/* ==========================================================================
   MEININGHAUS SHOP SKIN — NOVAChild
   File: templates/NOVAChild/css/meininghaus-shop.css

   Replicates the WordPress/Oxygen design of meininghaus.de on top of NOVA.
   Values are taken 1:1 from the live Oxygen stylesheet (universal + page css):
     brand        #820924          text        #000 / #3c3c3b / rgba(60,60,59,.7)
     light band   #f4f4f4          page ground #f9f9f9      frame grey  #d3ced2
     font         Open Sans 15px/1.6, headings Open Sans 600 #820924
     content width 1120px, side gutter 20px

   Sections
     1  tokens + base            6  product list (Shop / Kategorie)
     2  header + notice bar      7  product detail (Seminar)
     3  main navigation          8  cart, checkout, account, forms
     4  footer                   9  helpers / NOVA clean-up
     5  homepage + CMS pages
   ========================================================================== */


/* ==========================================================================
   1  TOKENS + BASE
   ========================================================================== */

:root {
  /* align the design-system tokens (meininghaus.css) with the live WordPress values */
  --mh-font-heading:   "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --mh-font-body:      "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --mh-ink:            #3c3c3b;
  --mh-body:           rgba(60, 60, 59, 0.7);
  --mh-surface-alt:    #f4f4f4;
  --mh-page:           #f9f9f9;
  --mh-frame:          #d3ced2;
  --mh-grey-btn:       #666666;
  --mh-grey-btn-hover: #999999;
  --mh-content:        1120px;
  --mh-gutter-x:       20px;
}

/* Open Sans as variable font (weights 300-800). The WordPress site used Google Fonts incl. 500/700,
   NOVA only ships 400 + 600. Declared after NOVA's faces, so it wins for every weight. OFL licensed. */
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300 800;
  font-stretch: 100%;
  font-display: swap;
  src: url("../fonts/open-sans-variable-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 300 800;
  font-stretch: 100%;
  font-display: swap;
  src: url("../fonts/open-sans-variable-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

html { font-size: 15px; }

body {
  font-family: var(--mh-font-body);
  font-size: 15px;
  line-height: 1.6;
  font-weight: 400;
  color: #000;
  background-color: var(--mh-page);
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--mh-font-heading);
  font-weight: 600;
  color: #820924;
  line-height: 1.2;
}

h1, .h1 { font-size: 36px; }
h2, .h2 { font-size: 30px; }
h3, .h3 { font-size: 24px; }
h4, .h4 { font-size: 20px; }
h5, .h5 { font-size: 18px; }
h6, .h6 { font-size: 16px; }

a { color: #820924; font-weight: 400; text-decoration: none; }
a:hover { color: #820924; text-decoration: underline; }

/* NOVA containers follow the Oxygen content width */
@media (min-width: 1200px) {
  .container { max-width: var(--mh-content); }
}
.container-fluid-xl { max-width: var(--mh-content); }

/* the WordPress site had no breadcrumb, no "scroll to top" button */
.breadcrumb-container,
.breadcrumb-wrapper,
.smoothscroll-top { display: none !important; }

#main-wrapper { background: transparent; }
/* NOVA pads the content area by 60px; the Meininghaus sections (homepage, CMS pages, seminar pages)
   bring their own padding, so drop it there */
#main-wrapper #content-wrapper:has(.mh-page--fluid),
#main-wrapper #content-wrapper:has(.mh-product) { padding-top: 0 !important; }


/* ==========================================================================
   2  HEADER
   ========================================================================== */

.mh-topnote {
  background: #820924;
  color: #fff;
  font-size: 12px;
  line-height: 1.6;
  text-align: center;
  padding: 5px 15px;
}

.mh-header {
  position: relative;
  z-index: 1020;
  background: var(--mh-page);
  border-bottom: 1px solid #820924;
}
/* NOVA base theme forces ".is-checkout header" (body class added on the checkout pages) to a fixed
   height (4.2625rem >=992px, 2.8rem below) sized for its own compact ~49px logo. Since the logo fix above
   makes our header taller (~135px on checkout, no top nav/main nav rows there), that fixed height clipped
   the header's flow box and let the logo visually bleed into the step navigation below it (overflow:visible
   does not clip, it just no longer reserves layout space). #jtl-nav-wrapper is an ID selector, so it always
   outranks the theme's class+type rule and lets the header grow to fit its actual content on every page. */
#jtl-nav-wrapper { height: auto; }

.mh-header__inner {
  position: relative;
  max-width: var(--mh-content);
  margin: 0 auto;
  padding: 31px var(--mh-gutter-x) 0;
}

.mh-header__row {
  display: flex;
  align-items: center;
  gap: 40px;
  width: calc(100% - 150px);
  padding-bottom: 12px;
}

.mh-header__logo { flex: 0 0 auto; }
.mh-header__logo .navbar-brand { display: block; padding: 0; margin: 0; }
/* NOVA base theme ships its own un-namespaced "header .navbar-brand img" rule (height: 49px; width: auto;
   at >=992px), which has higher selector specificity (1 class + 2 types) than a plain ".mh-header__logo img"
   (1 class + 1 type) and silently won, squashing the logo from the intended 250x71 down to ~171x49. Including
   the id raises our specificity above the theme rule so our own width/height take effect at every breakpoint. */
.mh-header__logo img#shop-logo {
  display: block;
  width: 250px;
  max-width: 100%;
  height: auto;
  margin: 10px 30px;
}

.mh-header__links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 30px;
  text-align: right;
}

.mh-header__link,
.mh-header__skill {
  color: #820924;
  text-decoration: none;
}

.mh-header__link {
  font-size: 16px;
  font-weight: 500;
  padding: 10px 15px;
  border-bottom: 1px solid transparent;
  transition: border-color 0.2s;
}
.mh-header__link:hover,
.mh-header__link.is-active {
  color: #820924;
  text-decoration: none;
  border-bottom-color: #820924;
}

.mh-header__skill {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  line-height: 1.6;
}
.mh-header__skill:hover { text-decoration: none; color: #820924; }
.mh-header__skill-title { font-size: 19px; font-weight: 600; }
.mh-header__skill-sub   { font-size: 14px; font-weight: 600; line-height: 1.3; }

.mh-header__actions {
  position: absolute;
  top: 20px;
  right: 25px;
  display: flex;
  align-items: center;
  gap: 10px;
}

/* cart icon with count badge (NOVA cart dropdown markup) */
.mh-header__cart { margin: 0; padding: 0; }
.mh-header__cart .cart-icon-dropdown { list-style: none; }
.mh-header__cart .nav-link {
  position: relative;
  display: block;
  width: 45px;
  height: 25px;
  padding: 0;
  color: #820924;
}
.mh-header__cart .cart-icon-dropdown-icon {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 25px;
  line-height: 25px;
  color: #820924;
}
.mh-header__cart .fa-sup,
.mh-header__cart .cart-icon-dropdown-icon .fa-sup {
  position: absolute;
  top: -1px;
  left: 22px;
  width: 17px;
  height: 17px;
  border-radius: 3px;
  background: #820924;
  color: #fff;
  font-family: var(--mh-font-body);
  font-size: 10px;
  font-weight: 400;
  line-height: 17px;
  text-align: center;
  transform: none;
}
.mh-header__cart .cart-icon-dropdown-price { display: none; }
.mh-header__cart .dropdown-menu { left: auto; right: 0; margin-top: 12px; }

/* secure checkout label (replaces links + cart during checkout) */
.mh-header__secure {
  font-size: 14px;
  color: #820924;
  white-space: nowrap;
}

/* burger, only on mobile */
.mh-burger {
  display: none;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #820924;
  cursor: pointer;
}
.mh-burger svg { width: 40px; height: 40px; display: block; }


/* ==========================================================================
   3  MAIN NAVIGATION
   ========================================================================== */

/* the menu may use the full 1120px (Oxygen let it overflow the gutter as well) */
.mh-nav { padding-top: 19px; margin: 0 calc(-1 * var(--mh-gutter-x)); }

.mh-nav__close { display: none; }

.mh-nav__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  list-style: none;
  margin: 0;
  padding: 0;
}

.mh-nav__item {
  position: relative;
  white-space: nowrap;
}

.mh-nav__item > a {
  display: inline-flex;
  align-items: center;
  padding: 10px 12px;
  color: #820924;
  font-family: var(--mh-font-body);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.6;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color 0.3s, color 0.3s;
}
.mh-nav__item > a span:first-child { white-space: normal; text-align: left; }
.mh-nav__item:hover > a,
.mh-nav__item.is-focus > a,
.mh-nav__item.is-active > a {
  color: #820924;
  text-decoration: none;
  border-bottom-color: currentColor;
}

.mh-nav__toggle {
  display: inline-flex;
  align-items: center;
  margin-left: 6px;
  color: #820924;
}
.mh-nav__chevron { width: 11px; height: 11px; margin-top: 2px; }

/* dropdown */
.mh-nav__sub {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 9999;
  min-width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  background: #f4f4f4;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  visibility: hidden;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.3s, transform 0.3s, visibility 0.3s;
}
.mh-nav__item:hover > .mh-nav__sub,
.mh-nav__item.is-focus > .mh-nav__sub {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}
.mh-nav__item:last-child > .mh-nav__sub,
.mh-nav__item:nth-last-child(2) > .mh-nav__sub { left: auto; right: 0; }

.mh-nav__sub a {
  display: block;
  padding: 10px 17px;
  background: #f4f4f4;
  color: #820924;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.6;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color 0.3s;
}
.mh-nav__sub a:hover,
.mh-nav__subitem.is-active > a { border-bottom-color: currentColor; }

@media (max-width: 1120px) {
  .mh-nav__item > a { padding-left: 10px; padding-right: 10px; }
}

/* ---- mobile / tablet: full-screen menu like the Oxygen pro menu ------------- */
@media (max-width: 991px) {
  .mh-header__inner { padding-top: 20px; }
  .mh-header__row {
    width: 100%;
    justify-content: space-between;
    gap: 0;
  }
  .mh-header__logo img#shop-logo { margin: 0; width: 200px; }
  .mh-header__links { display: none; }
  .mh-header__actions { position: static; }
  .mh-burger { display: inline-flex; align-items: center; justify-content: center; }

  .mh-nav {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    background: #fff;
    overflow: auto;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.3s, visibility 0.3s;
  }
  body.mh-nav-open .mh-nav { visibility: visible; opacity: 1; }
  body.mh-nav-open { overflow: hidden; }

  .mh-nav__close {
    display: flex;
    position: absolute;
    top: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #820924;
    cursor: pointer;
  }
  .mh-nav__close svg { width: 50px; height: 50px; }

  .mh-nav__list {
    flex-direction: column;
    align-items: flex-start;
    min-width: 50%;
    width: 100%;
    max-width: 480px;
  }
  .mh-nav__item { width: 100%; white-space: normal; min-height: 32px; }
  .mh-nav__item > a { display: flex; justify-content: space-between; width: 100%; }
  .mh-nav__toggle { min-width: 32px; min-height: 32px; justify-content: center; }
  .mh-nav__item.is-open .mh-nav__chevron { transform: rotate(180deg); }

  .mh-nav__sub {
    display: none;
    position: static;
    visibility: visible;
    opacity: 1;
    transform: none;
    box-shadow: none;
    width: 100%;
    padding-left: 17px;
  }
  .mh-nav__item.is-open > .mh-nav__sub { display: block; }
}

@media (max-width: 479px) {
  .mh-header__logo img#shop-logo { width: 160px; }
}


/* ==========================================================================
   4  FOOTER
   ========================================================================== */

.mh-footer {
  background: #f4f4f4;
  color: #000;
  font-size: 15px;
  text-align: center;
}

.mh-footer__inner {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  max-width: var(--mh-content);
  margin: 0 auto;
  padding: 60px var(--mh-gutter-x);
}

.mh-footer__col--left {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 30%;
  text-align: left;
}
.mh-footer__col--center {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 40%;
  text-align: center;
}
.mh-footer__col--right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
  width: 30%;
  text-align: right;
}

.mh-social {
  display: flex;
  gap: 10px;
  margin: 0 0 10px;
  padding: 0;
  list-style: none;
}
.mh-social a { display: block; color: rgba(60, 60, 59, 0.7); }
.mh-social a:hover { color: #820924; }
.mh-social svg { width: 25px; height: 25px; display: block; }

.mh-footer__links { margin: 0; padding: 0; list-style: none; }
.mh-footer__links li { margin-bottom: 5px; }
.mh-footer__links a { color: #000; text-decoration: none; }
.mh-footer__links a:hover { color: #820924; text-decoration: none; }

.mh-footer__logo { width: 90px; height: auto; margin-bottom: 15px; }
.mh-footer__brand { line-height: 1.6; }
.mh-footer__brand strong { font-weight: 700; }

.mh-footer__right-top {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
}
.mh-footer__badge { width: 80px; height: auto; margin-right: 30px; }

.mh-footer__note {
  margin: 20px 0 0;
  font-family: var(--mh-font-body);
  font-size: 11px;
  font-style: italic;
  text-align: right;
}

.mh-footer__credits {
  padding: 10px 20px;
  font-size: 11px;
  color: #666;
  text-align: center;
}
.mh-footer__credits a { color: #666; text-decoration: underline; }

@media (max-width: 767px) {
  .mh-footer__inner { flex-direction: column; align-items: center; text-align: center; }
  .mh-footer__col--center { order: 1; width: 100%; }
  .mh-footer__col--right { order: 2; width: 100%; align-items: center; text-align: center; margin-top: 25px; }
  .mh-footer__col--left { order: 3; width: 100%; flex-direction: row; align-items: center; justify-content: center; gap: 30px; text-align: center; margin-top: 25px; }
  .mh-footer__right-top { flex-direction: column; align-items: center; }
  .mh-footer__badge { margin: 0 0 27px; }
  .mh-footer__note { text-align: center; }
}
@media (max-width: 479px) {
  .mh-footer__col--left { flex-direction: column; }
}


/* ==========================================================================
   5  HOMEPAGE + CMS PAGES  (content classes used in Eigene Seiten)
   ========================================================================== */

/* full-width page wrapper (index.tpl override for "fluid" pages) */
.mh-page--fluid { width: 100%; }

/* section = Oxygen .ct-section; inner = .ct-section-inner-wrap (75px 20px, max 1120) */
.mh-sec { width: 100%; }
.mh-sec__in {
  max-width: var(--mh-content);
  margin: 0 auto;
  padding: 75px var(--mh-gutter-x);
}
.mh-sec--alt    { background: #f4f4f4; }
.mh-sec--brand  { background: #820924; color: #f4f4f4; }
.mh-sec--brand a { color: #fff; }
.mh-sec--flush .mh-sec__in { max-width: 100%; padding: 0; }
.mh-sec--tight .mh-sec__in { padding-top: 25px; padding-bottom: 40px; }
.mh-sec--tall  .mh-sec__in { padding-top: 120px; padding-bottom: 120px; }
.mh-sec--xtall .mh-sec__in { padding-top: 125px; padding-bottom: 125px; }
.mh-sec--pad50 .mh-sec__in { padding-top: 50px; padding-bottom: 50px; }
.mh-sec--pad0  .mh-sec__in { padding-top: 0; padding-bottom: 0; }
.mh-sec--line-top { border-top: 1px solid #820924; }

/* Oxygen text classes */
.mh-h1 {
  font-family: var(--mh-font-heading);
  font-size: 30px;
  font-weight: 400;
  line-height: 1.2;
  text-transform: uppercase;
  color: #820924;
  margin: 0 0 15px;
  text-align: left;
  hyphens: auto;
}
.mh-h1 b, .mh-h1 strong { font-weight: 700; }
/* multi-line headings: former Oxygen inner <div>s are now <span class="mh-line"> inside a real heading tag */
.mh-line { display: block; }
h2.mh-h1, h3.mh-h1 { font-size: 30px; }
.mh-unterkunft-card__title { margin: 0; }

.mh-h2 {
  font-family: var(--mh-font-heading);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.2px;
  text-transform: uppercase;
  color: #820924;
  margin: 5px 0;
}
.mh-h2 .is-light, .mh-h2 span { font-weight: 400; }

.mh-h3 {
  font-family: var(--mh-font-heading);
  font-size: 18px;
  font-weight: 400;
  text-transform: none;
  text-align: center;
  color: #820924;
  margin: 20px 0 10px;
}

.mh-h2-details {
  font-family: var(--mh-font-heading);
  font-size: 30px;
  font-weight: 400;
  line-height: 1.2;
  text-transform: uppercase;
  text-align: left;
  color: #820924;
  margin: 0 0 8px;
}
.mh-h2-details strong { font-weight: 700; }

.mh-fliesstext {
  font-family: var(--mh-font-body);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.6;
  color: rgba(60, 60, 59, 0.7);
  text-align: left;
  margin: 5px 0;
}
.mh-fliesstext--justify { text-align: justify; hyphens: auto; }
.mh-fliesstext--center  { text-align: center; }
.mh-fliesstext em, .mh-italic { font-style: italic; }

.mh-text { font-size: 15px; line-height: 1.6; color: #000; }
.mh-text p { margin: 0 0 1em; }
.mh-text p:last-child { margin-bottom: 0; }

.mh-center { text-align: center; }

/* square-bullet list (.aufzaehlung) */
.mh-aufzaehlung { color: #000; font-size: 15px; text-align: left; margin-top: 0; }
.mh-aufzaehlung ul { list-style: none; padding: 0; margin: 0 0 20px; }
.mh-aufzaehlung ul li {
  padding-left: 1em;
  text-indent: -0.8em;
  color: #3c3c3b;
  margin-bottom: 3px;
}
.mh-aufzaehlung ul li::before { content: "\25A0  "; color: #820924; }
.mh-aufzaehlung p { margin: 0 0 10px; }

/* the burgundy "button" used on the site (.button) */
.mh-button,
.mh-sec--brand .mh-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mh-font-body);
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  text-align: center;
  color: #fff;
  background: #820924;
  border: 2px solid #fff;
  border-radius: 0;
  padding: 15px;
  text-decoration: none;
  transition: transform 0.3s;
}
.mh-button:hover { color: #fff; text-decoration: none; transform: rotate(-1deg); }
.mh-button--outline { background: transparent; border-color: #820924; color: #820924; }
.mh-button--outline:hover { color: #820924; }

/* CTA button with white frame (.button_cta) */
.mh-button-cta {
  display: inline-flex;
  align-items: center;
  padding: 10px 15px;
  border: 2px solid #fff;
  color: #fff;
  text-transform: uppercase;
  text-decoration: none !important;
  transition: transform 0.3s;
}
.mh-button-cta:hover { color: #fff; transform: rotate(-2deg); }

/* tables (.redTable / .seminarTable) */
.mh-table, table.redTable, table.seminarTable {
  width: 100%;
  border: 2px solid #820924;
  border-collapse: collapse;
  background: #fff;
  margin: 15px 0;
}
.mh-table td, .mh-table th, table.redTable td, table.redTable th, table.seminarTable td, table.seminarTable th {
  border: 1px solid #aaa;
  padding: 6px;
}
.mh-table thead, table.redTable thead, table.seminarTable thead { background: #820924; }
.mh-table thead th, table.redTable thead th, table.seminarTable thead th { color: #fff; font-weight: 700; border-left: 2px solid #820924; }
.mh-table tr:nth-child(even), table.redTable tr:nth-child(even) { background: #ededed; }

/* ---- hero slider ------------------------------------------------------------ */
.mh-slider {
  position: relative;
  height: 400px;
  overflow: hidden;
  background: #f4f4f4;
}
.mh-slider__slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.75s ease, visibility 0.75s;
}
.mh-slider__slide.is-active { opacity: 1; visibility: visible; z-index: 1; }

.mh-slider__box {
  position: absolute;
  top: 100px;
  left: 150px;
  width: 30%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
}
.mh-slider__kicker {
  display: inline-block;
  font-size: 40px;
  line-height: 1.6;
  color: rgba(60, 60, 59, 0.7);
  background: rgba(255, 255, 255, 0.75);
  padding: 0 20px;
  margin: 0 0 10px -20px;
  white-space: nowrap;
}
.mh-slider__button {
  display: inline-flex;
  align-items: center;
  margin-left: 30px;
  padding: 15px;
  font-family: var(--mh-font-body);
  font-size: 40px;
  font-weight: 400;
  letter-spacing: 2px;
  line-height: 1.6;
  text-transform: uppercase;
  color: #fff;
  background: #820924;
  border: 2px solid #fff;
  text-decoration: none;
  white-space: nowrap;
  transition: transform 0.3s;
}
.mh-slider__button:hover { color: #fff; text-decoration: none; transform: scale3d(1.01, 1.01, 1.01); }

.mh-slider__arrow {
  position: absolute;
  top: 50%;
  z-index: 3;
  width: 32px;
  height: 32px;
  margin-top: -16px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.85);
  color: #999;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s, color 0.2s;
}
.mh-slider__arrow:hover { background: #820924; color: #fff; }
.mh-slider__arrow svg { width: 16px; height: 16px; }
.mh-slider__arrow--prev { left: 10px; }
.mh-slider__arrow--next { right: 10px; }

@media (max-width: 991px) {
  .mh-slider__box { left: 40px; top: 70px; width: 60%; }
  .mh-slider__kicker, .mh-slider__button { font-size: 30px; }
}
@media (max-width: 767px) {
  .mh-slider { height: 320px; }
  .mh-slider__box { left: 20px; top: 60px; width: 80%; }
  .mh-slider__kicker { font-size: 24px; margin-left: 0; white-space: normal; }
  .mh-slider__button { font-size: 22px; margin-left: 20px; letter-spacing: 1px; padding: 10px 12px; }
}

/* OPC portlet "Meininghaus Slider" (plugin jtl_customslider) with custom class "mh-hero":
   maps the plugin classes onto the WordPress hero look above. The --slider-* variables set here
   override the plugin defaults (:root in MeininghausSlider.css); values an editor sets in the
   portlet's "Styles" tab are emitted inline and still win. */
.meininghaus-slider.mh-hero {
  --slider-height-desktop: 400px;
  --slider-height-tablet: 400px;
  --slider-height-mobile: 320px;
  --slider-top-border-width: 0px;
  --slider-content-max-width: none;
  --slider-content-padding: 0px;
  --slider-content-left-offset: 0px;
  --slider-content-spacing: 0px;
  --slider-title-size: 40px;
  --slider-title-color: rgba(60, 60, 59, 0.7);
  --slider-title-bg: rgba(255, 255, 255, 0.75);
  --slider-title-weight: 400;
  --slider-text-size: 18px;
  --slider-text-color: #fff;
  --slider-button-bg: #820924;
  --slider-arrow-size: 32px;
  --slider-arrow-color: #999;
  --slider-arrow-inset: 10px;
  --slider-transition-speed: 750ms;
  background: #f4f4f4;
  border-top: 0;
}
.mh-hero .meininghaus-slider__slide { transition: opacity 0.75s ease, visibility 0.75s; }
.mh-hero .meininghaus-slider__bg img { object-position: 50% 50%; }
.mh-hero .meininghaus-slider__content {
  position: absolute;
  top: 100px;
  left: 150px;
  width: 30%;
  height: auto;
  max-width: none;
  padding: 0;
  gap: 0;
  justify-content: flex-start;
  align-items: flex-start;
}
.mh-hero .meininghaus-slider__title {
  display: inline-block;
  font-size: var(--slider-title-size);
  font-weight: var(--slider-title-weight);
  line-height: 1.6;
  color: var(--slider-title-color);
  background: var(--slider-title-bg);
  padding: 0 20px;
  margin: 0 0 10px -20px;
  white-space: nowrap;
}
.mh-hero .meininghaus-slider__text {
  margin: 0 0 10px;
  font-size: var(--slider-text-size);
  color: var(--slider-text-color);
  max-width: none;
}
.mh-hero .meininghaus-slider__button,
.mh-hero .meininghaus-slider__button.meininghaus-button {
  display: inline-flex;
  align-items: center;
  margin: 0 0 0 30px;
  padding: 15px;
  font-family: var(--mh-font-body);
  font-size: 40px;
  font-weight: 400;
  letter-spacing: 2px;
  line-height: 1.6;
  text-transform: uppercase;
  color: #fff;
  background: var(--slider-button-bg);
  border: 2px solid #fff;
  border-radius: 0;
  text-decoration: none;
  white-space: nowrap;
  transition: transform 0.3s;
}
.mh-hero .meininghaus-slider__button:hover,
.mh-hero .meininghaus-slider__button:focus {
  color: #fff;
  background: var(--slider-button-bg);
  text-decoration: none;
  transform: scale3d(1.01, 1.01, 1.01);
}
.mh-hero .meininghaus-slider__arrow {
  width: 32px;
  height: 32px;
  background: rgba(255, 255, 255, 0.85);
  color: #999;
  font-size: 26px;
  line-height: 1;
  padding: 0 0 3px;
  transition: background 0.2s, color 0.2s;
}
.mh-hero .meininghaus-slider__arrow:hover { background: #820924; color: #fff; }
.mh-hero .meininghaus-slider__arrow--prev { left: 10px; }
.mh-hero .meininghaus-slider__arrow--next { right: 10px; }
.mh-hero .meininghaus-slider__dots { bottom: 12px; }

@media (max-width: 991px) {
  .mh-hero .meininghaus-slider__content { left: 40px; top: 70px; width: 60%; }
  .mh-hero .meininghaus-slider__title, .mh-hero .meininghaus-slider__button { font-size: 30px; }
}
@media (max-width: 767px) {
  .meininghaus-slider.mh-hero { height: var(--slider-height-mobile); }
  .mh-hero .meininghaus-slider__content { left: 20px; top: 60px; width: 80%; }
  .mh-hero .meininghaus-slider__title { font-size: 24px; margin-left: 0; white-space: normal; }
  .mh-hero .meininghaus-slider__button { font-size: 22px; margin-left: 20px; letter-spacing: 1px; padding: 10px 12px; }
}

/* ---- seminar cards ("Für deine professionelle Ausbildung") ------------------ */
.mh-cards {
  display: flex;
  justify-content: space-around;
  align-items: flex-start;
  width: 100%;
  margin-top: 20px;
}
.mh-card-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  text-decoration: none;
  transition: transform 0.3s;
}
.mh-card-link:hover { transform: scale(1.03); text-decoration: none; }
.mh-card-link img { width: 300px; max-width: 100%; height: auto; margin-bottom: 20px; }
.mh-card-link__title { font-size: 20px; color: #820924; line-height: 1.6; }
.mh-card-link__sub   { font-size: 16px; color: rgba(60, 60, 59, 0.7); line-height: 1.6; }

@media (max-width: 1120px) {
  .mh-card-link img { width: 250px; }
}
@media (max-width: 767px) {
  .mh-cards { flex-direction: column; align-items: center; gap: 28px; }
}

/* ---- two-column image | text bands ------------------------------------------- */
.mh-split2 {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  width: 100%;
}
.mh-split2__media {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 49%;
  text-align: center;
  padding-top: 20px;
}
.mh-split2__text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 49%;
  text-align: left;
}
.mh-split2__text .mh-h2 { text-align: left; }
.mh-sec--brand .mh-h2,
.mh-sec--brand .mh-text,
.mh-sec--brand .mh-fliesstext { color: #fff; }

@media (max-width: 991px) {
  .mh-split2 { flex-direction: column; align-items: center; }
  .mh-split2__media, .mh-split2__text { width: 100%; }
  .mh-split2__media { margin-bottom: 38px; }
}

/* ---- "Friseurfachschule Meininghaus" two text/image columns ------------------- */
.mh-two {
  display: flex;
  justify-content: space-around;
  align-items: flex-start;
  width: 100%;
  text-align: justify;
}
.mh-two > * { width: 48%; }
.mh-team-img {
  width: 100%;
  background-size: cover;
  background-position: 50% 50%;
  background-image: var(--mh-img);
  transition: background-image 0.3s;
}
.mh-team-img[style*="--mh-img"] { padding-bottom: 100%; }
.mh-team-img:hover { background-image: var(--mh-img-hover, var(--mh-img)); }

/* ---- hover swap: two images, the second fades in on hover, the first zooms slightly ----------
   plain HTML:   <div class="mh-hover-swap"><img class="mh-swap__a"><img class="mh-swap__b"></div>
   OPC:          Container "mh-hover-swap" with two Bild portlets (custom classes mh-swap__a / mh-swap__b) */
.mh-hover-swap {
  position: relative;
  display: block;
  width: 100%;
  overflow: hidden;
  padding-bottom: 0 !important;
  background: none !important;
}
.mh-hover-swap img { display: block; width: 100%; height: auto; }
.mh-hover-swap .mh-swap__a,
.mh-hover-swap .mh-swap__a img { transition: transform 0.7s ease; }
.mh-hover-swap .mh-swap__b {
  position: absolute;
  inset: 0;
  margin: 0 !important;
  max-width: none !important;
  opacity: 0;
  transition: opacity 0.5s ease;
  pointer-events: none;
}
.mh-hover-swap .mh-swap__b img { height: 100%; object-fit: cover; }
.mh-hover-swap:hover .mh-swap__b,
.mh-hover-swap:focus-within .mh-swap__b { opacity: 1; }
.mh-hover-swap:hover img.mh-swap__a,
.mh-hover-swap:hover .mh-swap__a img { transform: scale(1.04); }
/* the JTL container wrapper must not break the stacking */
.mh-hover-swap > div { display: block; position: relative; }

/* fixed-height variant (team portraits): both pictures fill the box, cropped like the old background-size: cover */
.mh-mitarbeiter__img.mh-hover-swap,
.mh-hover-swap.is-fixed { height: 330px; }
.mh-mitarbeiter__img.mh-hover-swap .mh-swap__a,
.mh-mitarbeiter__img.mh-hover-swap .mh-swap__b,
.mh-mitarbeiter__img.mh-hover-swap > div:not(.mh-swap__a):not(.mh-swap__b) { height: 100%; }
.mh-mitarbeiter__img.mh-hover-swap img { height: 100%; object-fit: cover; object-position: 50% 20%; }
.mh-mitarbeiter__img.mh-hover-swap .mh-swap__a { max-width: none !important; margin: 0 !important; }
@media (max-width: 1120px) { .mh-mitarbeiter__img.mh-hover-swap { height: 300px; } }
@media (max-width: 991px)  { .mh-mitarbeiter__img.mh-hover-swap { height: 200px; } }
@media (prefers-reduced-motion: reduce) {
  .mh-hover-swap .mh-swap__a, .mh-hover-swap .mh-swap__a img, .mh-hover-swap .mh-swap__b { transition: none; }
}
@media (max-width: 767px) {
  .mh-two { flex-direction: column; align-items: flex-start; }
  .mh-two > * { width: 100%; }
}

/* ---- "Ganzheitliches Konzept" ------------------------------------------------- */
.mh-konzept {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.mh-konzept__text { width: 60%; }
.mh-konzept__img  { width: 35%; margin-top: -50px; }
.mh-konzept__img img { width: 100%; height: auto; display: block; }
@media (max-width: 991px) {
  .mh-konzept { align-items: flex-end; }
  .mh-konzept__text .mh-h1 { margin-top: 51px; }
}
@media (max-width: 767px) {
  .mh-konzept { flex-direction: column; }
  .mh-konzept__text { width: 100%; }
  .mh-konzept__img { width: 80%; margin-top: 0; }
}

/* ---- Goethe quote band ---------------------------------------------------- */
.mh-quote-band {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.mh-quote-band__text { width: 60%; }
.mh-quote-band__quote {
  font-size: 20px;
  font-weight: 400;
  text-transform: uppercase;
  color: #fff;
  text-align: left;
  margin: 0;
}
.mh-quote-band__author {
  color: #fff;
  font-style: italic;
  margin: 10px 0 0 8%;
}
.mh-quote-band .mh-button { width: 25%; }
@media (max-width: 767px) {
  .mh-quote-band { flex-direction: column; }
  .mh-quote-band__text { width: 100%; margin-bottom: 25px; }
  .mh-quote-band .mh-button { width: 80%; }
}
@media (max-width: 479px) {
  .mh-quote-band__quote { text-align: center; }
  .mh-quote-band .mh-button { width: 100%; }
}

/* ---- Vorteile (6 icon boxes) ---------------------------------------------- */
.mh-vorteile {
  display: grid;
  grid-template-columns: repeat(3, minmax(200px, 1fr));
  gap: 75px 50px;
  width: 100%;
  justify-items: center;
}
.mh-vorteil {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin-bottom: 30px;
}
.mh-vorteil__icon { color: #820924; }
.mh-vorteil__icon svg { width: 80px; height: 80px; display: block; }
.mh-vorteil .mh-fliesstext { text-align: center; }
@media (max-width: 991px) {
  .mh-vorteile { grid-template-columns: repeat(2, minmax(200px, 1fr)); gap: 20px; }
}
@media (max-width: 767px) {
  .mh-vorteile { display: flex; flex-direction: column; }
}

/* ---- partner logos --------------------------------------------------------- */
.mh-logos {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.mh-logos > * { width: 8%; text-align: center; }
.mh-logos img { max-width: 100%; height: auto; }
@media (max-width: 991px) {
  .mh-logos { display: grid; grid-template-columns: repeat(3, minmax(200px, 1fr)); gap: 40px 25px; }
  .mh-logos > * { width: 100%; }
}
@media (max-width: 479px) {
  .mh-logos { grid-template-columns: repeat(2, minmax(120px, 1fr)); gap: 50px 5px; }
}

/* ---- team cards (Akademie page) ------------------------------------------- */
.mh-team,
.mh-sec__in > div:has(> .mh-mitarbeiter),
.mh-sec__in > div:has(> .mh-unterkunft-card),
.mh-sec__in > div:has(> .mh-langhaarbild) { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 35px 3%; }
.mh-langhaarbild { width: 19%; height: 250px; background-size: cover; background-position: 50% 50%; }
@media (max-width: 767px) { .mh-langhaarbild { width: 100%; height: 400px; margin-bottom: 20px; } }
.mh-ueberblick { display: flex; flex-wrap: wrap; width: 100%; margin-bottom: 10px; }
.mh-ueberblick__label { width: 220px; }
.mh-video { position: relative; padding-bottom: 56.25%; height: 0; }
.mh-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; }
.mh-page--fluid iframe { max-width: 100%; }
.mh-subhead { margin-top: -5px; font-size: 20px; font-weight: 600; }
.mh-toggle { cursor: pointer; }
.mh-h2-small { line-height: 1.4; }
.mh-icon-glyph { display: inline-block; width: 1em; height: 1em; }
.mh-mitarbeiter { width: 30%; min-width: 250px; text-align: center; display: flex; flex-direction: column; align-items: center; }
.mh-mitarbeiter__img { width: 100%; height: 330px; background-size: cover; background-position: 50% 50%; background-image: var(--mh-img); }
.mh-mitarbeiter__img:hover { background-image: var(--mh-img-hover, var(--mh-img)); }
@media (max-width: 1120px) { .mh-mitarbeiter__img { height: 300px; } }
@media (max-width: 991px)  { .mh-mitarbeiter__img { height: 200px; } }

/* ---- Team page sections (values from the Oxygen page CSS of meininghaus.de/team) ------------- */
/* intro: centered h1 + two justified text columns (49 %) */
.mh-teamintro .mh-sec__in { padding-top: 80px; padding-bottom: 0; text-align: center; }
.mh-teamintro .mh-h1 { text-align: center; }
.mh-teamintro__cols { display: flex; justify-content: space-between; align-items: flex-start; padding-top: 44px; width: 100%; }
.mh-teamintro__cols > * { width: 49%; text-align: justify; }
@media (max-width: 991px) { .mh-teamintro__cols { flex-direction: column; } .mh-teamintro__cols > * { width: 100%; } }

/* Historie: text 54 % left, award 40 % right, light band */
.mh-historie .mh-sec__in { display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start; text-align: justify; }
.mh-historie__text { width: 54%; padding-top: 0; }
.mh-historie__text .mh-h2 { text-align: center; margin-top: 0; }
.mh-historie__text .mh-text, .mh-historie__text .mh-fliesstext { text-align: justify; hyphens: auto; }
.mh-historie__award { width: 40%; display: flex; flex-direction: column; align-items: center; text-align: center; }
.mh-historie__award img { max-width: 100%; height: auto; }
.mh-historie__award .mh-h3 { margin-top: 20px; }
.mh-historie__award .mh-fliesstext { text-align: center; }
@media (max-width: 767px) { .mh-historie .mh-sec__in { flex-direction: column; } .mh-historie__text, .mh-historie__award { width: 100%; } .mh-historie__award { margin-top: 30px; } }

/* Die Salons zur Akademie: centered intro + three columns (30 %) */
.mh-salons .mh-sec__in { padding-top: 80px; padding-bottom: 80px; }
.mh-salons__intro { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 20px 0; width: 100%; }
.mh-salons__intro .mh-h1 { text-align: center; }
.mh-salons__intro > .mh-fliesstext, .mh-salons__intro > .mh-text { text-align: center; margin-bottom: 30px; max-width: none; }
.mh-salons__grid { display: flex; justify-content: space-between; align-items: flex-start; width: 100%; }
.mh-salon { width: 30%; display: flex; flex-direction: column; align-items: center; text-align: center; }
.mh-salon .mh-h3 { margin: 0 0 10px; }
.mh-salon img { width: 100%; height: auto; }
.mh-salon .mh-fliesstext { margin-top: 15px; text-align: center; }
.mh-salon a { color: #820924; text-align: center; }
@media (max-width: 767px) { .mh-salons__grid { flex-direction: column; } .mh-salon { width: 100%; margin-top: 20px; } .mh-salon:first-child { margin-top: 0; } }

/* Nachhaltigkeit: dark teal band, round portrait overlapping the solar photo, light-blue heading */
.mh-nachhaltigkeit { background: #0e4a62; color: #fff; }
.mh-nachhaltigkeit .mh-sec__in { display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start; padding-bottom: 75px; }
.mh-nachhaltigkeit__media { width: 35%; display: flex; flex-direction: column; align-items: flex-start; }
.mh-nachhaltigkeit__portrait,
.mh-nachhaltigkeit__portrait img { border-radius: 100%; }
.mh-nachhaltigkeit__portrait { position: relative; z-index: 1; width: 250px; max-width: 250px !important; margin: -40px 0 -150px -30px !important; }
.mh-nachhaltigkeit__solar { width: 400px; max-width: 100% !important; margin: 0 !important; }
.mh-nachhaltigkeit__solar img, .mh-nachhaltigkeit__portrait img { width: 100%; height: auto; display: block; }
.mh-nachhaltigkeit__text { width: 60%; text-align: left; }
.mh-nachhaltigkeit__text .mh-h2 { text-align: center; color: #a7e0eb; margin-top: 0; }
.mh-nachhaltigkeit__text .mh-text, .mh-nachhaltigkeit__text .mh-fliesstext, .mh-nachhaltigkeit__text p { color: #fff; text-align: left; }
.mh-nachhaltigkeit__text a { color: #a7e0eb; text-decoration: underline; }
@media (max-width: 767px) {
  .mh-nachhaltigkeit .mh-sec__in { flex-direction: column; align-items: center; }
  .mh-nachhaltigkeit__media { width: 80%; margin-bottom: 57px; align-items: center; }
  .mh-nachhaltigkeit__portrait { margin: -40px 0 -120px 0 !important; }
  .mh-nachhaltigkeit__text { width: 100%; }
}

/* ---- Unterkunft cards ------------------------------------------------------- */
.mh-unterkunft-grid { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0 3%; }
.mh-unterkunft-card { width: 30%; margin-bottom: 60px; display: flex; flex-direction: column; }
.mh-unterkunft-card__title { color: #820924; font-weight: 700; font-size: 22px; }
.mh-unterkunft-card__img { width: 100%; height: 200px; margin: 20px 0; background-size: cover; background-position: 50% 50%; }
.mh-unterkunft-card__link { margin-top: 18px; color: #820924; font-weight: 600; }
@media (max-width: 767px) { .mh-unterkunft-card { width: 100%; } }


/* ==========================================================================
   6  PRODUCT LIST  (Shop / Kategorie / Suche)
   ========================================================================== */

/* full width, no filter sidebar (like the WooCommerce shop page) */
#sidepanel_left { display: none !important; }
#content-wrapper.is-item-list,
#content-wrapper.has-left-sidebar { padding-left: var(--mh-gutter-x); padding-right: var(--mh-gutter-x); max-width: calc(var(--mh-content) + 0px); }
#content-wrapper.is-item-list #content > .row > [class*="col-lg-"],
#content-wrapper.has-left-sidebar #content > .row > [class*="col-lg-"] {
  flex: 0 0 100%;
  max-width: 100%;
}

/* WooCommerce shows no sub-category tiles */
#content .content-cats-small,
.productlist-header .sub-categories { display: none !important; }

/* category header: keep name + description, drop images */
.productlist-header .category-image,
.productlist-header .subcategories-image,
#content .content-cats-small .subcategories-image { display: none; }
.productlist-header h1,
.productlist-header .h2 {
  font-size: 30px;
  font-weight: 400;
  text-transform: uppercase;
  color: #820924;
}

/* result options (count + sorting) in Woo style */
.productlist-page-nav,
.result-options {
  font-size: 15px;
  color: #666;
}
#product-list-type,
.productlist-filter-headline,
.filter-headline,
#productlist-actions .btn-icon { display: none !important; }

/* product cards: four per row on desktop like the WooCommerce shop page */
.product-list .row > [class*="col-"] { margin-bottom: 0; }
@media (min-width: 1200px) {
  #product-list.layout-gallery > .product-wrapper,
  #product-list > .product-wrapper { flex: 0 0 25%; max-width: 25%; }
}
.mh-item {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 20px;
  background: transparent;
  border: 0;
  box-shadow: none;
}
.mh-item__link { display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.mh-item__link:hover { text-decoration: none; }
.mh-item__image { position: relative; }
.mh-item__image img,
.mh-item__image picture img {
  width: 100%;
  height: auto;
  min-width: 64px;
  min-height: 64px;
  border: 1px solid var(--mh-frame);
  overflow: hidden;
  display: block;
  transition: all ease 0.2s;
}
.mh-item__image .ribbon { z-index: 2; }

.mh-item__title {
  font-family: var(--mh-font-body);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.6;
  margin: 12px 0 6px;
  text-transform: none;
}
.mh-item__title a { color: #820924; text-decoration: none; }
.mh-item__title a:hover { color: rgba(130, 9, 36, 0.8); text-decoration: underline; }

.mh-item__price { margin-bottom: 16px; }
.mh-item__price .price,
.mh-item__price .productbox-price,
.mh-item__price .price_wrapper {
  font-size: 16px;
  font-weight: 700;
  color: #000;
}
.mh-item__price .price_label,
.mh-item__price .footnote-reference,
.mh-item__price .price-note,
.mh-item__price .base-price { font-size: 12px; font-weight: 400; color: #666; }
.mh-item__price .footnote-reference a,
.mh-item__price .price-note a { color: #820924; }

.mh-item__button,
.mh-item__button:hover {
  display: flex;
  justify-content: center;
  margin-top: auto;
  padding: 16px 24px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 1px;
  line-height: 1.2;
  text-transform: uppercase;
  text-align: center;
  color: #fff;
  background: var(--mh-grey-btn);
  border: 1px solid var(--mh-grey-btn);
  border-radius: 4px;
  text-decoration: none;
  transition: all ease 0.2s;
}
.mh-item__button:hover {
  background: var(--mh-grey-btn-hover);
  border-color: var(--mh-grey-btn-hover);
}

/* pagination like Woo */
.pagination .page-link { color: #820924; border-color: var(--mh-frame); border-radius: 0; }
.pagination .page-item.active .page-link { background: #820924; border-color: #820924; color: #fff; }


/* ==========================================================================
   7  PRODUCT DETAIL  (Seminar)
   Values measured on meininghaus.de/seminare/damen-haarschnitt-basic-b1/ (Oxygen template ids *-1982,
   WooCommerce + woo-variation-swatches + Newsletter plugin) - the original value is noted on every rule.
   ========================================================================== */

.mh-product {
  width: 100%;
  font-family: var(--mh-font-body);
  font-size: 15px;                                    /* body: font-size 15px / line-height 1.6 / #000 */
  line-height: 1.6;
  color: #000;
}
.mh-product__wrap { display: block; margin: 0; }
.mh-product p { line-height: 1.6; }                   /* NOVA theme sets p { line-height: 1.8 } */
/* NOVA gives every <main> section 4rem padding - the Oxygen sections carry their own inner paddings */
.mh-product__gridwrap, .mh-cta { padding: 0; }
.mh-product a { color: #820924; text-decoration: none; }
.mh-product a:hover { color: #820924; text-decoration: underline; }

/* headings: .h2-details = 30px uppercase #820924. Oxygen renders them either as <h2> (weight 600, strong
   -> bolder = 800, line-height 1.2: "geeignet für", "Seminarinhalte", "Unterkunft") or as text <div>
   (weight 400, strong 700, line-height 1.6: "Seminardetails", "Seminartermine", "Teilnehmerstimmen") */
.mh-product .mh-h2-details {
  font-family: var(--mh-font-heading);
  font-size: 30px;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: normal;
  text-transform: uppercase;
  text-align: left;
  color: #820924;
  margin: 0;
  padding: 0;
}
.mh-product .mh-h2-details strong, .mh-product .mh-h2-details b { font-weight: 700; }
.mh-product .mh-h2-details--heading { font-weight: 600; line-height: 1.2; }
.mh-product .mh-h2-details--heading strong, .mh-product .mh-h2-details--heading b { font-weight: 800; }

/* 7.1 intro  (#section-654-1982: inner-wrap flex row, space-between, gap 50px, padding 75px 20px, max 1120) */
.mh-product__intro {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  gap: 50px;
  max-width: var(--mh-content);
  margin: 0 auto;
  padding: 75px var(--mh-gutter-x);
}
.mh-product__intro-text {                              /* #div_block-655-1982: flex column, flex-grow 1 */
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex: 1 1 0%;
  min-width: 0;
}
.mh-product__image {                                   /* #image-658-1982: width 300px */
  flex: 0 0 300px;
  width: 300px;
  max-width: 100%;
}
.mh-product__image img { width: 100%; height: auto; display: block; }
.mh-product__title {                                   /* h1.ct-headline: 36px / 600 / #820924 / line-height 1.15, no uppercase */
  font-family: var(--mh-font-heading);
  font-size: 36px;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: normal;
  text-transform: none;
  text-align: left;
  color: #820924;
  margin: 0;
  padding: 0;
  hyphens: auto;
}
.mh-product__desc {                                    /* #text_block-674-1982: 15px / 1.6 / #000, p margin 15px 0 */
  width: 100%;
  max-width: 100%;
  font-size: 15px;
  line-height: 1.6;
  color: #000;
}
.mh-product__desc p { margin: 15px 0; }
.mh-product__desc p strong, .mh-product__desc p b { font-weight: 700; }   /* subhead: bold first paragraph */
.mh-product__desc .mh-subhead, .mh-product__desc .subhead { margin-top: -5px; font-size: 20px; font-weight: 600; }   /* .subhead */
.mh-product__desc a { color: #820924; }

/* 7.2 grid: content | buy box  (#section-71-1982: bg #f4f4f4, inner-wrap grid repeat(3, minmax(200px,1fr)),
   column-gap 40px, row-gap 20px, first child spans 2 columns, padding 75px 20px) */
.mh-product__gridwrap { width: 100%; background-color: #f4f4f4; }
.mh-product__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(200px, 1fr));
  column-gap: 40px;
  row-gap: 20px;
  align-items: stretch;
  max-width: var(--mh-content);
  margin: 0 auto;
  padding: 75px var(--mh-gutter-x);
}
.mh-product__col {                                     /* #div_block-540-1982: grid-column span 2, flex column */
  grid-column: span 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
}
.mh-product__block { margin-bottom: 50px; max-width: 100%; }   /* div_block-14 / _dynamic_list-542 / div_block-84: margin-bottom 50px */
/* same 50px rhythm for the OPC text portlets (<div class="mh-opc-h2"><h2 class="mh-h2-details">) */
.mh-product .mh-product__col .mh-opc-h2 .mh-h2-details { margin-top: 50px; }
.mh-product .mh-product__col .mh-opc-h2:first-child .mh-h2-details,
.mh-product .mh-product__col .opc-area > .mh-opc-h2:first-child .mh-h2-details { margin-top: 0; }
.mh-product__col .mh-product__desc { margin: 0; }

/* square-bullet lists (.aufzaehlung: #000 15px; ul no bullets, padding 0, margin 0; li padding-left 1em,
   text-indent -0.8em, #3c3c3b, margin-bottom 3px; ::before "■ " #820924) */
.mh-product .mh-aufzaehlung { color: #000; font-size: 15px; line-height: 1.6; text-align: left; margin: 0; max-width: 100%; }
.mh-product .mh-aufzaehlung ul { list-style: none; padding: 0; margin: 0; }
.mh-product .mh-aufzaehlung ul li {
  padding-left: 1em;
  text-indent: -0.8em;
  color: #3c3c3b;
  margin-bottom: 3px;
}
.mh-product .mh-aufzaehlung ul li::before { content: "\25A0  "; color: #820924; }
.mh-product .mh-aufzaehlung p { margin: 0 0 10px; }
.mh-product .mh-aufzaehlung a { color: #820924; }

/* PDF button "Anmeldeformular" (link-799-2038: flex row, padding 10px 15px, border 2px #820924, margin-top 20px,
   max-width 30%, icon 25px, text margin-left 10px, hover rotate(-2deg), transition .2s) */
/* (the OPC button portlet uses the class on a wrapper <div> - styled in meininghaus-opc-kurse.css) */
a.mh-pdf-button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  margin-top: 20px;
  padding: 10px 15px;
  border: 2px solid #820924;
  max-width: 30%;
  color: #820924;
  font-size: 15px;
  line-height: 1.6;
  text-align: left;
  text-decoration: none !important;
  transition: all ease 0.2s;
}
a.mh-pdf-button:hover, a.mh-pdf-button:focus { transform: rotate(-2deg); color: #820924; text-decoration: none; }
a.mh-pdf-button i, a.mh-pdf-button svg { font-size: 25px; width: 25px; height: 25px; line-height: 1; flex: 0 0 25px; text-align: center; color: #820924; }
a.mh-pdf-button span { margin-left: 10px; }

/* buy box (#-product-builder-3-1982: third grid column, 333px at 1120) */
.mh-product__buy { width: 100%; min-width: 0; }
.mh-product__buy .product-offer,
.mh-product #product-offer .product-info .product-offer { display: flex; flex-direction: column; align-items: stretch; margin: 0; }   /* NOVA: margin-bottom 2rem */

/* price (#-product-price-31-1982 .price: 20px / 700 / #000, display flex, line-height 1.6, margin 0) */
.mh-product__price { margin: 0; }
.mh-product #product-offer .price_wrapper,
.mh-product .mh-product__price .price_wrapper { margin: 0; }   /* NOVA: #product-offer .price_wrapper margin-bottom 1.5rem */
.mh-product__price .price,
.mh-product__price .price.h1,
.mh-product__price .price_wrapper .price,
.mh-product__price .woocommerce-Price-amount {
  display: flex;
  align-items: center;
  font-family: inherit;
  font-size: 20px;
  font-weight: 700;
  color: #000;
  margin: 0;
  line-height: 1.6;
}
.mh-product__price .price del { font-size: 20px; font-weight: 200; color: #666; margin-right: 5px; }
.mh-product__price .price_label,
.mh-product__price .base-price { font-size: 12px; font-weight: 400; color: #666; }
/* seminars are services: no tax/shipping footnote under the price (the "umsatzsteuerbefreit" line follows) */
.mh-product__price .footnote-reference,
.mh-product__price .price-note,
.mh-product__price .shipping-tax-info { display: none; }
.mh-product__vat { font-size: 12px; line-height: 1.6; color: #000; margin: 0; }   /* #text_block-146-1982: 12px */

/* no dates yet: plain 15px text like the other text blocks */
.mh-product__nodates { font-size: 15px; line-height: 1.6; color: #000; margin-top: 9px; }
.mh-product__nodates p { margin: 0 0 15px; }
.mh-product__nodates p:last-child { margin-bottom: 0; }
.mh-product__nodates a { color: #820924; }

/* Termine = NOVA variation swatches rendered like the woo-variation-swatches button items:
   form.cart margin-top 9px, max-width 400px; li: flex, width 100%, margin 10px 0, padding 2px, 16px,
   line-height 2, bg #fff, radius 2px, box-shadow 0 0 0 1px #a8a8a8; hover 0 0 0 3px #ddd; selected 0 0 0 2px #000 */
.mh-product__variations { margin-top: 9px; max-width: 400px; width: 100%; }
.mh-product__variations .variations,
.mh-product__variations .variations .row,
.mh-product__variations .variations .form-row { margin-left: 0; margin-right: 0; }
.mh-product__variations .variations .form-group,
.mh-product__variations .variations .form-row { margin-bottom: 0; }
.mh-product__variations .variations > .col,
.mh-product__variations .variations .col { padding-left: 0; padding-right: 0; }
/* WooCommerce hides the "Datum" label above the date buttons (.variations .label {display:none}) */
.mh-product__variations .variations label:not(.variation),
.mh-product__variations .variations dt,
.mh-product__variations .variations .variation-name,
.mh-product__variations .variations legend { display: none; }
.mh-product__variations .variations dl,
.mh-product__variations .variations dd { margin: 0; }
.mh-product__variations .updatingStockInfo { display: none !important; }
.mh-product__variations .swatches .col-auto,
.mh-product__variations .swatches > [class*="col"] { flex: 0 0 100%; max-width: 100%; padding: 0; }
.mh-product__variations .variation.swatches,
.mh-product__variations .variation.swatches-text,
.mh-product__variations .variation-radio-wrapper .variation {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: auto;
  min-height: 0;
  margin: 10px 0;
  padding: 2px;
  background: #fff;
  border: 0;
  border-radius: 2px;
  box-shadow: 0 0 0 1px #a8a8a8;
  color: #000;
  font-size: 16px;
  font-weight: 400;
  line-height: 2;
  text-align: center;
  cursor: pointer;
  user-select: none;
  transition: all 0.2s ease;
}
.mh-product__variations .variation.swatches:hover,
.mh-product__variations .variation.swatches:focus-within {
  background: #fff;
  color: #000;
  box-shadow: 0 0 0 3px #ddd;
}
.mh-product__variations .variation.swatches.active,
.mh-product__variations .variation.swatches.active:hover,
.mh-product__variations .variation.swatches-text.active {
  background: #fff;
  color: #000;
  box-shadow: 0 0 0 2px #000;
}
.mh-product__variations .variation.swatches .label-variation { display: block; padding: 0 5px; font-weight: 400; line-height: inherit; }
/* tooltip "diesen Termin auswählen" ([data-wvstooltip]::before: #333, #fff 14px, height 30px, radius 3px,
   shadow 0 0 5px 1px rgba(0,0,0,.3), padding 0 20px, 10px above the item, 5px arrow, fade .5s) */
.mh-product__variations .variation.swatches::before,
.mh-product__variations .variation.swatches::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  z-index: 999;
  transition: opacity 0.5s ease-in-out;
}
.mh-product__variations .variation.swatches::before {
  content: "diesen Termin auswählen";
  bottom: calc(100% + 10px);
  min-width: 100px;
  width: max-content;
  height: 30px;
  line-height: 30px;
  padding: 0 20px;
  border-radius: 3px;
  background: #333;
  box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.3);
  color: #fff;
  font-size: 14px;
  font-weight: 400;
  text-indent: 0;
}
.mh-product__variations .variation.swatches::after {
  top: -10px;
  width: 0;
  height: 0;
  border: 5px solid transparent;
  border-top-color: #333;
}
.mh-product__variations .variation.swatches:hover::before,
.mh-product__variations .variation.swatches:hover::after { opacity: 1; visibility: visible; }
.mh-product__variations .variation-badge { display: none; }
.mh-product__variations .swatches-sold-out,
.mh-product__variations .swatches-not-in-stock { opacity: 0.5; text-decoration: line-through; }
.mh-product__variations select,
.mh-product__variations .custom-select,
.mh-product__variations .bootstrap-select > .dropdown-toggle {
  width: 100%;
  height: auto;
  border: 1px solid var(--mh-frame);
  border-radius: 4px;
  background: #fff;
  color: #000;
  font-size: 14px;
  line-height: 1.2;
  padding: 8px 12px;
}

/* "added to cart" notice: WooCommerce shows a slim message + buttons, not a product data sheet */
.mh-product .card.alert-dismissable,
.mh-product #pushed-success {
  max-width: var(--mh-content);
  margin: 20px auto 0;
  border: 1px solid var(--mh-frame);
  border-top: 3px solid #820924;   /* brand colour instead of NOVA teal */
  border-radius: 0;
  background: #fff;
}
.mh-product .card.alert-dismissable .card-header { background: transparent; border: 0; color: #820924; font-size: 15px; font-weight: 600; }
.mh-product .card.alert-dismissable .productbox-inner .form-row,
.mh-product .card.alert-dismissable .pushed-success-image-wrapper,
.mh-product .card.alert-dismissable .attr-characteristic { display: none !important; }

/* stock/availability: Woo hides it (.woocommerce-variation-availability {display:none}) */
.mh-product__stock { display: none; }

/* add to cart (.single_add_to_cart_button.button.alt: flex, width 100%, padding 16px 24px, 12px / 700,
   letter-spacing 1px, uppercase, line-height 1.2, #fff on #820924, border 1px #820924, radius 0,
   hover rgba(130,9,36,.8), transition .2s; .quantity hidden; .disabled #ccc) */
.mh-product__basket { margin: 0; width: 100%; max-width: 400px; }
.mh-product__basket #add-to-cart { margin: 0; }        /* NOVA: #add-to-cart margin-top 2rem */
.mh-product__basket .choose_quantity,
.mh-product__basket #quantity-grp,
.mh-product__basket .quantity-wrapper,
.mh-product__basket .basket-form-inline > [class*="col-"]:not(:last-child) { display: none !important; }
.mh-product__basket .basket-form-inline { margin: 0; }
.mh-product__basket .basket-form-inline > [class*="col-"] { flex: 0 0 100%; max-width: 100%; padding: 0; }
.mh-product__basket .alert.choose-variations { display: none !important; }
.mh-product__basket .btn,
.mh-product__basket .btn-primary,
.mh-product__basket #add-to-cart .btn,
.mh-product__cart-btn {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 16px 24px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1px;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
  background: #820924;
  border: 1px solid #820924;
  border-radius: 0;
  box-shadow: none;
  outline: none;
  cursor: pointer;
  transition: all ease 0.2s;
}
.mh-product__basket .btn:hover,
.mh-product__basket .btn:focus,
.mh-product__basket .btn-primary:hover,
.mh-product__basket #add-to-cart .btn:hover,
.mh-product__cart-btn:hover {
  background: rgba(130, 9, 36, 0.8);
  border-color: rgba(130, 9, 36, 0.8);
  color: #fff;
  box-shadow: none;
}
.mh-product__cart-btn[disabled] { cursor: pointer; opacity: 1; }
.mh-product__basket .btn .fa,
.mh-product__basket .btn .fas,
.mh-product__basket .btn > svg { display: none; }
.mh-product__basket .btn-basket-check { display: inline; }
.mh-product__basket .btn.disabled,
.mh-product__basket .btn:disabled { background: #ccc !important; border-color: #ccc !important; opacity: 1; filter: grayscale(100%); }

/* newsletter box (.newsletter-div: padding-top 102px, margin-bottom 50px; .newsletter-titel 19px uppercase #820924,
   b 700; form margin 15px 0 (text block -5px); label 12px #666 margin 8px 0 3px; input 14px, padding 8px 12px,
   border 1px #d3ced2, radius 4px; .tnp-submit inline-block, margin-top 20px, padding .7em, 15px, #fff on #444) */
.mh-newsletter { display: flex; flex-direction: column; align-items: flex-start; padding-top: 102px; width: 100%; margin-bottom: 50px; }
.mh-newsletter__title {
  font-size: 19px;
  font-weight: 400;
  line-height: 1.6;
  text-transform: uppercase;
  text-align: left;
  color: #820924;
  margin: 0;
}
.mh-newsletter__title strong, .mh-newsletter__title b { font-weight: 700; }
.mh-newsletter__form { display: block; width: 100%; max-width: 500px; margin: 10px 0 15px; }   /* -5px text block + 15px form margin */
.mh-newsletter__label { display: block; font-size: 12px; font-weight: 400; line-height: normal; color: #666; margin: 8px 0 3px; padding: 0; }
.mh-newsletter__input,
.mh-newsletter input[type="email"] {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 8px 12px;
  font-family: inherit;
  font-size: 14px;
  line-height: normal;
  border: 1px solid var(--mh-frame);
  border-radius: 4px;
  background: #fff;
  color: #000;
  outline: none;
  box-shadow: none;
  transition: all ease 0.2s;
}
.mh-newsletter__input::placeholder { color: var(--mh-frame); }
.mh-newsletter__input:focus { border: 1px solid #820924; box-shadow: 0 0 5px #820924; outline: 0; }
.mh-newsletter .captcha, .mh-newsletter .form-group { margin-bottom: 0; }
.mh-newsletter__submit {
  display: inline-block;
  width: auto;
  height: auto;
  margin: 20px 0 0;
  padding: 0.7em;
  font-family: inherit;
  font-size: 15px;
  font-weight: 400;
  line-height: normal;
  text-align: center;
  color: #fff;
  background: #444;
  border: 0;
  border-radius: 0;
  cursor: pointer;
}
.mh-newsletter__submit:hover { background: #444; color: #fff; }

/* Unterkunft (headline-571 h2 30px/600, rich text p 15px / 1.6, link #820924) */
.mh-unterkunft { width: 100%; }
.mh-unterkunft p { font-size: 15px; line-height: 1.6; color: #000; margin: 0; }
.mh-unterkunft a { color: #820924; }

@media (max-width: 991px) {
  /* #section-71-1982 inner-wrap: display flex (column) -> columns stack, row-gap 20px */
  .mh-product__grid { display: flex; flex-direction: column; align-items: stretch; }
  .mh-product__col, .mh-product__buy { width: 100%; }
}
@media (max-width: 767px) {
  /* #section-654-1982 inner-wrap: flex column, align-items center, text-align left */
  .mh-product__intro { flex-direction: column; align-items: center; text-align: left; }
  .mh-product__intro-text { width: 100%; flex: 0 0 auto; }
  .mh-product__image { flex: 0 0 auto; width: 300px; max-width: 100%; }
}
@media (max-width: 479px) {
  .mh-product .mh-h2-details { font-size: 28px; }   /* .h2-details 28px */
  .mh-newsletter__title { font-size: 28px; }         /* .newsletter-titel 28px */
  .mh-newsletter__submit { width: 100%; }            /* .tnp-subscription input[type=submit] width 100% <= 480px */
}

/* 7.3 CTA band (#section-399-1982: bg #820924, inner padding 60px 20px; div_block-403 flex row space-between,
   align center, text-align justify; div_block-498 width 80%; head 28px/600 uppercase white margin 0 20px 20px 0;
   quote 20px italic; author 14px italic margin-left 30px; link padding 10px 15px border 2px #fff, hover rotate(-2deg)) */
.mh-cta { background: #820924; color: #fff; width: 100%; text-align: left; }
.mh-cta__inner {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  max-width: var(--mh-content);
  margin: 0 auto;
  padding: 60px var(--mh-gutter-x);
  text-align: justify;
}
.mh-cta__text { display: flex; flex-direction: column; align-items: flex-start; width: 80%; }
.mh-cta__head {
  font-size: 28px;
  font-weight: 600;
  line-height: 1.6;
  text-transform: uppercase;
  text-align: left;
  color: #fff;
  margin: 0 20px 20px 0;
}
.mh-cta__quote { width: 100%; color: #fff; font-size: 20px; font-style: italic; font-weight: 400; line-height: 1.6; margin: 0; }
.mh-cta__author { color: #fff; font-size: 14px; font-style: italic; line-height: 1.6; margin: 0 0 0 30px; }
.mh-cta__button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  padding: 10px 15px;
  border: 2px solid #fff;
  color: #fff;
  font-size: 15px;
  line-height: 1.6;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none !important;
  transition: all ease 0.2s;
}
.mh-cta__button:hover, .mh-cta__button:focus { color: #fff; transform: rotate(-2deg); text-decoration: none; }
@media (max-width: 767px) {
  /* @media 767: section text-align center, div_block-403 flex column align center, head centered margin-bottom 22px */
  .mh-cta { text-align: center; }
  .mh-cta__inner { flex-direction: column; align-items: center; }
  .mh-cta__head { text-align: center; margin: 0 0 22px; }
}

/* 7.4 testimonials (#section-205-1982: padding 100px 20px, flex column align center; title margin-bottom 25px;
   swiper slide flex column center; text width 75% margin 0 50px centered; divider 30x1 #820924 margin 10px 0 30px;
   name 18px #820924; arrows 27x44 at 10px, #000, icon 32px) */
.mh-stimmen {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: var(--mh-content);
  margin: 0 auto;
  padding: 100px var(--mh-gutter-x);
  text-align: left;
}
.mh-product .mh-stimmen__title { margin: 0 0 25px; text-align: left; }
.mh-stimmen__slider { position: relative; width: 100%; padding: 0; }
.mh-stimmen__track { display: grid; width: 100%; }
.mh-stimmen__slide {
  grid-area: 1 / 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 15px;
  line-height: 1.6;
  color: #000;
  text-align: center;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s;
}
.mh-stimmen__slide.is-active { visibility: visible; opacity: 1; }
.mh-stimmen__slide p { width: 75%; margin: 15px 0; font-size: 15px; line-height: 1.6; text-align: center; }
.mh-stimmen__slide footer,
.mh-stimmen__slide cite {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-style: normal;
  font-size: 18px;
  line-height: 1.6;
  color: #820924;
  margin: 0;
}
.mh-stimmen__slide footer::before,
.mh-stimmen__slide cite::before {
  content: "";
  display: block;
  width: 30px;
  height: 1px;
  min-height: 1px;
  background: #820924;
  margin: 10px 0 30px;
}
.mh-stimmen__arrow {
  position: absolute;
  top: 50%;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 27px;
  height: 44px;
  margin-top: -22px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #000;
  cursor: pointer;
}
.mh-stimmen__arrow svg { width: 27px; height: 44px; display: block; }
.mh-stimmen__arrow--prev { left: 10px; right: auto; }
.mh-stimmen__arrow--next { right: 10px; left: auto; }

/* NOVA bits that do not exist on the WordPress product page */
.mh-product .product-detail-image-preview-bar,
.mh-product .productdetails-tabs,
.mh-product #tab-description,
.mh-product .product-slider.x-sell,
.mh-product .product-slider.x-related { display: none; }


/* ==========================================================================
   8  CART, CHECKOUT, ACCOUNT, FORMS  (WooCommerce / Oxygen look)
   ========================================================================== */

/* primary buttons: burgundy, uppercase 12px, rounded 4px */
.btn-primary,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
  color: #fff;
  background-color: #820924;
  border-color: #820924;
  border-radius: 4px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1px;
  line-height: 1.2;
  text-transform: uppercase;
  padding: 16px 24px;
  box-shadow: none;
}
.btn-primary:hover,
.btn-primary:focus {
  color: #fff;
  background-color: rgba(130, 9, 36, 0.8);
  border-color: rgba(130, 9, 36, 0.8);
  box-shadow: none;
}
.btn-primary.btn-sm { padding: 8px 12px; }

/* secondary / outline: white with burgundy frame (Woo tertiary) */
.btn-secondary,
.btn-outline-primary,
.btn-outline-secondary,
.btn-light {
  color: #820924;
  background: #fff;
  border: 1px solid #820924;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1px;
  line-height: 1.2;
  text-transform: uppercase;
  padding: 16px 24px;
}
.btn-secondary:hover,
.btn-outline-primary:hover,
.btn-outline-secondary:hover,
.btn-light:hover {
  color: rgba(130, 9, 36, 0.8);
  background: #fff;
  border-color: rgba(130, 9, 36, 0.8);
}
.btn-secondary.btn-sm, .btn-outline-primary.btn-sm, .btn-outline-secondary.btn-sm { padding: 8px 12px; }

.btn-link { color: #820924; }
.btn-link:hover { color: rgba(130, 9, 36, 0.8); }

/* cards / boxes: 1px frame + 3px burgundy top */
.card,
.basket-summary,
.checkout-summary,
#order-summary .card,
.cart-summary {
  border: 1px solid var(--mh-frame);
  border-top: 3px solid #820924;
  border-radius: 0;
  background: #fff;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.04);
}
.card-header { background: transparent; border-bottom: 1px solid var(--mh-frame); }

/* tables */
.table th,
.table thead th {
  font-weight: 400;
  color: #666;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-color: var(--mh-frame);
}
.table td { color: #666; border-color: var(--mh-frame); vertical-align: middle; }
.table td strong, .table td .price, .table .price { color: #000; font-weight: 700; }

/* form controls */
.form-control,
.custom-select,
select.form-control,
textarea.form-control {
  height: auto;
  padding: 8px 12px;
  font-size: 14px;
  color: #000;
  background: #fff;
  border: 1px solid var(--mh-frame);
  border-radius: 4px;
  box-shadow: none;
}
.form-control:focus,
.custom-select:focus {
  border-color: #820924;
  box-shadow: 0 0 5px #820924;
}
.form-group label,
label { font-size: 12px; color: #666; font-weight: 400; }
.custom-control-input:checked ~ .custom-control-label::before {
  background-color: #820924;
  border-color: #820924;
}
.custom-control-label::before { border-color: var(--mh-frame); border-radius: 4px; }
.custom-radio .custom-control-label::before { border-radius: 100%; }

/* checkout steps */
.checkout-steps .badge,
.badge-primary { background: #820924; color: #fff; }
.checkout-steps .step-current .step-text { color: #820924; }

/* alerts */
.alert { border-radius: 0; border: 1px solid var(--mh-frame); border-top-width: 3px; background: #fff; color: #666; }
.alert-info    { border-top-color: #820924; }
.alert-danger  { border-top-color: #e96199; }
.alert-success { border-top-color: #65bec2; }
.alert a { color: #820924; }

/* account navigation */
.nav-pills .nav-link.active { background: #820924; color: #fff; }
.nav-pills .nav-link { color: #820924; border-radius: 0; }

/* headings inside shop pages */
#content h1:not(.mh-h1):not(.mh-product__title):not(.mh-kontakt__title),
.page-title { font-size: 30px; font-weight: 400; text-transform: uppercase; color: #820924; }

/* links inside NOVA shop UI */
.text-primary { color: #820924 !important; }
.bg-primary { background-color: #820924 !important; }
.border-primary { border-color: #820924 !important; }


/* ==========================================================================
   8b  PHONE REFINEMENTS (<= 767px)  — spacing and type scale for small screens
   ========================================================================== */
@media (max-width: 767px) {
  /* section rhythm: the desktop paddings (75-125px) are too tall on a phone */
  .mh-sec__in { padding-top: 48px; padding-bottom: 48px; }
  .mh-sec--tall .mh-sec__in, .mh-sec--xtall .mh-sec__in { padding-top: 56px; padding-bottom: 56px; }
  .mh-sec--tight .mh-sec__in { padding-top: 24px; padding-bottom: 32px; }
  .mh-sec--pad50 .mh-sec__in { padding-top: 40px; padding-bottom: 40px; }
  .mh-sec--flush .mh-sec__in { padding: 0; }
  .mh-salons .mh-sec__in, .mh-teamintro .mh-sec__in { padding-top: 48px; padding-bottom: 48px; }

  /* type scale */
  .mh-h1 { font-size: 24px; }
  .mh-page--fluid h1:not([class*="mh-"]) { font-size: 28px; }   /* Oxygen default h1 36px -> 28px on phones */
  .mh-h2, .mh-page--fluid h2:not([class*="mh-"]) { font-size: 19px; }
  .mh-h2-details { font-size: 24px; }
  .mh-quote-band__quote { font-size: 17px; }
  .mh-fliesstext, .mh-text { text-align: left; hyphens: auto; }

  /* hero slider (plugin portlet) */
  .meininghaus-slider.mh-hero .meininghaus-slider__title { font-size: 22px !important; margin-left: 0 !important; white-space: normal !important; }
  .meininghaus-slider.mh-hero .meininghaus-slider__button { font-size: 20px !important; letter-spacing: 1px !important; padding: 10px 14px !important; margin-left: 16px !important; }
  .meininghaus-slider.mh-hero .meininghaus-slider__content { left: 20px !important; top: 60px !important; width: 80% !important; }

  /* cards & buttons */
  .mh-card-link img { width: 240px; }
  .mh-button { font-size: 16px; padding: 12px; }
  .mh-vorteil { margin-bottom: 10px; }
  .mh-vorteil__icon svg, .mh-vorteil__icon img { width: 60px !important; height: 60px !important; }
  .mh-konzept__img { width: 70%; margin: 0 auto; }

  /* seminar page: the Oxygen template keeps its desktop paddings (75/60/100px) and type sizes on phones;
     its own media rules (stacking, 28px headings <= 479px) live in section 7 */

  /* footer */
  .mh-footer__inner { padding: 40px 20px; }
}

/* iOS Safari: prevent automatic text scaling in landscape and keep tap targets comfortable */
html { -webkit-text-size-adjust: 100%; }
@media (max-width: 767px) {
  .mh-nav__sub a, .mh-footer__links a { padding-top: 4px; padding-bottom: 4px; display: inline-block; }
}


/* ==========================================================================
   9  HELPERS / NOVA CLEAN-UP
   ========================================================================== */

/* NOVA reserves space for its sticky header — not needed with the custom header */
body.jtl-sticky, .sticky-top-placeholder { padding-top: 0 !important; }

/* NOVA notification bar under the header */
#notification-bar { margin: 0; }

/* consent manager buttons in brand colours */
#consent-manager .btn-primary { background: #820924; border-color: #820924; }

/* print */
@media print {
  .mh-topnote, .mh-nav, .mh-header__actions, .mh-footer { display: none !important; }
}

/* two-line menu labels (e.g. "Fördermaßnahmen<br>der Arbeitsagentur") sit on the baseline like in Oxygen */
.mh-nav__item > a span:first-child { line-height: 1.3; }
.mh-nav__list { align-items: flex-end; }


/* ==========================================================================
   10  KONTAKT — layout of the original page (Oxygen section-2-60 / section-3-60)
   ========================================================================== */
/* 1. Google map, full width, 400px, phone button overlapping the lower edge */
.mh-kontakt-map { position: relative; height: 400px; background: #f4f4f4; }
.mh-kontakt-map__frame { display: block; width: 100%; height: 400px; border: 0; }
.mh-kontakt-map__cta { display: flex; justify-content: center; }
.mh-kontakt-map__phone {
  position: relative; z-index: 1; margin-top: -45px;
  display: inline-flex; justify-content: center; align-items: center;
  padding: 21px 33.6px; background: #820924; border: 1px solid #820924; border-radius: 4px;
  color: #fff; font-family: var(--mh-font); font-size: 25px; line-height: 1.2; letter-spacing: 1px; text-transform: uppercase;
  text-decoration: none; white-space: nowrap; transition: background .2s;
}
.mh-kontakt-map__phone:hover, .mh-kontakt-map__phone:focus { background: #999; border-color: #999; color: #fff; text-decoration: none; }
/* the button (45px) sticks into the following section */
.mh-kontakt-map + * { margin-top: 0; }

/* 2. two columns: form | address + quote */
.mh-kontakt {
  display: flex; flex-direction: row; align-items: flex-start; justify-content: space-between;
  padding: 120px 0 80px; text-align: left;
}
.mh-kontakt__form { width: 50%; }
.mh-kontakt__info { width: 44%; display: flex; flex-direction: column; }

/* form (Fluent Forms look: label above bordered input, red asterisk) */
.mh-kontakt-form .mh-kontakt-form__row { display: flex; gap: 20px; }
.mh-kontakt-form .mh-kontakt-form__row > .mh-field { flex: 1 1 0; min-width: 0; }
.mh-kontakt-form .mh-field { margin-bottom: 20px; }
.mh-kontakt-form label { display: inline-block; margin-bottom: 5px; font-weight: 600; font-size: 15px; line-height: 1.4; color: #3c3c3b; }
.mh-kontakt-form .mh-req { color: #f56c6c; }
.mh-kontakt-form input[type="text"], .mh-kontakt-form input[type="email"], .mh-kontakt-form input[type="tel"], .mh-kontakt-form textarea {
  display: block; width: 100%; padding: 8px 12px; font-family: var(--mh-font); font-size: 15px; line-height: 1.5; color: #3c3c3b;
  background: #fff; border: 1px solid #dadada; border-radius: 3px; box-shadow: none; transition: border-color .2s;
}
.mh-kontakt-form textarea { min-height: 120px; resize: vertical; }
.mh-kontakt-form input:focus, .mh-kontakt-form textarea:focus { outline: 0; border-color: #820924; box-shadow: 0 0 0 1px rgba(130, 9, 36, .15); }
.mh-kontakt-form .has-error input, .mh-kontakt-form .has-error textarea { border-color: #c00; }
.mh-kontakt-form .form-error-msg { color: #c00; font-size: 13px; margin-top: 4px; }
.mh-kontakt-form .form-error-msg .fas { display: none; }
/* NOVA checkbox snippet inside the form */
.mh-kontakt-form__checkbox .form-group { margin-bottom: 20px; }
.mh-kontakt-form__checkbox .custom-control-label, .mh-kontakt-form__checkbox label { font-weight: 400; font-size: 15px; }
.mh-kontakt-form__checkbox .custom-control-input:checked ~ .custom-control-label::before { background: #820924; border-color: #820924; }
.mh-kontakt-form__checkbox .moreinfo a { color: #820924; text-decoration: underline; }
.mh-kontakt-form__checkbox .optional { display: none; }
.mh-kontakt-form__captcha { margin-bottom: 20px; }
.mh-kontakt-form__submit { text-align: left; }
.mh-kontakt-form__button {
  background: #820924; color: #f4f4f4; border: 0; border-radius: 3px; padding: 10px 30px;
  font-family: var(--mh-font); font-size: 15px; font-weight: 400; text-transform: uppercase; letter-spacing: .5px; line-height: 1.5;
}
.mh-kontakt-form__button:hover, .mh-kontakt-form__button:focus { background: #820924; color: #f4f4f4; opacity: .9; }
.mh-kontakt-form .honeypot, .mh-kontakt-form .required-info { display: none; }
.mh-kontakt__note { margin-top: 24px; font-style: italic; }

/* address */
.mh-kontakt__title {
  font-family: var(--mh-font-heading); font-size: 22px; font-weight: 600; letter-spacing: .2px; line-height: 1.6;
  text-transform: uppercase; color: #820924; margin: 5px 0;
}
.mh-kontakt__address .mh-fliesstext { margin: 0 0 12px; }
.mh-kontakt__address a { color: inherit; text-decoration: none; }
.mh-kontakt__address a:hover { color: #820924; }

/* quote + portrait: text 65% right-aligned with top rule, portrait 50% bottom-aligned on the 2px rule */
.mh-kontakt__quote {
  display: flex; flex-direction: row; justify-content: space-between; align-items: flex-end;
  margin-top: -100px; border-bottom: 2px solid #820924;
}
.mh-kontakt__quote-text { flex: 1 1 65%; width: auto; min-width: 0; margin: 150px 0 25px; padding-top: 10px; border-top: 1px solid #820924; text-align: right; }
.mh-kontakt__quote-line { font-family: var(--mh-font-heading); font-size: 18px; font-weight: 400; line-height: 1.6; text-transform: uppercase; color: #820924; }
.mh-kontakt__quote-author { margin-top: 10px; font-style: italic; color: rgba(60, 60, 59, .7); }
.mh-kontakt__axel { flex: 1 1 50%; width: auto; max-width: 50%; height: auto; display: block; margin-left: 20px; align-self: flex-end; }   /* text + portrait shrink together like Oxygen (65 % + 50 %), no overlap */

@media (max-width: 991px) {
  .mh-kontakt { padding: 80px 0 60px; }
  .mh-kontakt__form, .mh-kontakt__info { width: 49%; }
  .mh-kontakt__quote { margin-top: 0; }
  .mh-kontakt__quote-text { margin-top: 40px; }
}
@media (max-width: 767px) {
  .mh-kontakt-map { height: 300px; }
  .mh-kontakt-map__frame { height: 300px; }
  .mh-kontakt-map__phone { font-size: 20px; padding: 16px 24px; margin-top: -35px; }
  .mh-kontakt { flex-direction: column; padding: 70px 0 40px; }
  .mh-kontakt__form, .mh-kontakt__info { width: 100%; }
  .mh-kontakt__info { margin-top: 50px; }
  .mh-kontakt-form .mh-kontakt-form__row { flex-direction: column; gap: 0; }
  .mh-kontakt__quote-text { margin-top: 30px; }
}

/* seminar page: parent article without child articles (dates) yet */
.mh-product__nodates { margin: 10px 0 20px; padding: 16px 18px; background: #f9f9f9; border-left: 3px solid #820924; font-size: 15px; line-height: 1.6; }
.mh-product__nodates p { margin: 0 0 6px; }
.mh-product__nodates p:last-child { margin: 0; }
.mh-product__nodates a { color: #820924; font-weight: 600; text-decoration: none; }
.mh-product__nodates a:hover { text-decoration: underline; }

/* ==========================================================================
   11  SEMINARTERMINE AS RADIO BUTTONS  (details.tpl block mh-product-dates)
   ========================================================================== */
.mh-product__variations .mh-dates .mh-dates__name { display: none; }
.mh-product__variations .mh-dates .mh-dates__item { flex: 0 0 100%; max-width: 100%; padding: 0; }
.mh-product__variations .mh-dates .mh-dates__radio,
.mh-product__variations .mh-dates .mh-dates__radio:hover,
.mh-product__variations .mh-dates .mh-dates__radio.active {
  display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 12px;
  width: 100%; min-height: 0; margin: 0; padding: 9px 12px;
  background: #fff; border: 1px solid #a8a8a8; border-radius: 2px; box-shadow: none;
  font-size: 16px; line-height: 1.4; color: #000; text-align: left; cursor: pointer;
  transition: border-color .15s, background .15s;
}
.mh-product__variations .mh-dates .mh-dates__item + .mh-dates__item .mh-dates__radio { margin-top: 10px; }
.mh-product__variations .mh-dates .mh-dates__radio:hover { border-color: #820924; }
.mh-product__variations .mh-dates .mh-dates__radio.active { border-color: #820924; background: #fdf5f6; }
.mh-product__variations .mh-dates .mh-dates__radio::before,
.mh-product__variations .mh-dates .mh-dates__radio::after { display: none !important; content: none !important; }
/* the radio circle */
.mh-product__variations .mh-dates .mh-dates__circle {
  flex: 0 0 20px; width: 20px; height: 20px; border-radius: 50%; border: 2px solid #820924; background: #fff;
  position: relative; box-sizing: border-box;
}
.mh-product__variations .mh-dates .mh-dates__circle::after {
  content: ""; position: absolute; left: 3px; top: 3px; width: 10px; height: 10px; border-radius: 50%;
  background: #820924; transform: scale(0); transition: transform .12s;
}
.mh-product__variations .mh-dates .mh-dates__radio.active .mh-dates__circle::after,
.mh-product__variations .mh-dates .mh-dates__input:checked ~ .mh-dates__circle::after { transform: scale(1); }
.mh-product__variations .mh-dates .mh-dates__input:focus-visible ~ .mh-dates__circle { outline: 2px solid #820924; outline-offset: 2px; }
.mh-product__variations .mh-dates .mh-dates__radio .label-variation { display: block; padding: 0; margin: 0; font-weight: 400; line-height: inherit; }
.mh-product__variations .mh-dates .mh-dates__radio.active .label-variation { font-weight: 600; }
.mh-product__variations .mh-dates .mh-dates__note { margin-left: auto; font-size: 12px; color: #c00; white-space: nowrap; }
.mh-product__variations .mh-dates .variation.swatches-sold-out,
.mh-product__variations .mh-dates .variation.swatches-not-in-stock { opacity: .6; }
.mh-product__variations .mh-dates .variation.swatches-sold-out .label-variation,
.mh-product__variations .mh-dates .variation.swatches-not-in-stock .label-variation { text-decoration: line-through; }
.mh-product__variations .mh-dates .variation-wrapper + .variation-wrapper { margin-top: 20px; }
.mh-product__variations .mh-dates .variation-wrapper + .variation-wrapper .mh-dates__name { display: block; margin-bottom: 6px; font-weight: 600; }
/* dates listed straight from the child articles (no variation "Datum" in the shop yet): links look like the radios */
.mh-product__variations .mh-dates--links { margin-top: 9px; }
.mh-product__variations .mh-dates .mh-dates__link, .mh-product__variations .mh-dates .mh-dates__link:hover { text-decoration: none; color: #000; }
.mh-product__variations .mh-dates .mh-dates__price { margin-left: auto; font-weight: 600; white-space: nowrap; }
.mh-product__variations .mh-dates .mh-dates__item + .mh-dates__item .mh-dates__link { margin-top: 10px; }

/* ==========================================================================
   12  SEMINAR PAGE — buy box spacing, red band button, newsletter topics, phone layout
   ========================================================================== */
/* space between the last date and the cart button */
.mh-product__variations .mh-dates { margin-bottom: 4px; }
.mh-product__basket { margin-top: 20px; }
.mh-product__stock + .mh-product__basket { margin-top: 16px; }

/* red band: the button text must stay white (the generic ".mh-product a" colour rule was winning) */
.mh-product .mh-cta__button, .mh-cta .mh-cta__button, .mh-kurs__band .mh-cta__button {
  color: #fff !important; background: transparent; border: 2px solid #fff; font-weight: 400;
}
.mh-product .mh-cta__button:hover, .mh-product .mh-cta__button:focus { color: #fff !important; background: rgba(255, 255, 255, .08); }

/* newsletter topics (three checkboxes like the original form) */
.mh-newsletter__topics { display: flex; flex-direction: column; gap: 6px; margin: 12px 0 4px; }
.mh-newsletter__topic { display: flex; align-items: flex-start; gap: 8px; margin: 0; font-size: 13px; line-height: 1.5; color: #3c3c3b; font-weight: 400; cursor: pointer; }
.mh-newsletter__topic input { width: 16px; height: 16px; margin: 2px 0 0; flex: 0 0 16px; accent-color: #820924; }

/* phone layout of the seminar page */
@media (max-width: 767px) {
  .mh-product__title { font-size: 28px; line-height: 1.2; }
  .mh-product__intro { padding: 40px 20px 30px; gap: 24px; }
  .mh-product__image { width: 100%; }
  .mh-product__image img { max-width: 100%; height: auto; }
  .mh-product__gridwrap .mh-product__grid { padding: 40px 20px; row-gap: 10px; }
  .mh-h2-details { font-size: 24px; }
  .mh-product__block { margin-bottom: 32px; }
  .mh-pdf-button { max-width: 100%; }
  .mh-product__buy { margin-top: 24px; }
  .mh-product__variations { max-width: 100%; }
  .mh-product__basket { max-width: 100%; }
  .mh-newsletter { padding-top: 40px; margin-bottom: 32px; }
  .mh-newsletter__title { font-size: 19px; }
  .mh-newsletter__form { max-width: 100%; }
  .mh-newsletter__submit { width: 100%; }
  .mh-cta__inner { padding: 40px 20px; }
  .mh-cta__text { width: 100%; align-items: center; }
  .mh-cta__head { font-size: 22px; }
  .mh-cta__quote { font-size: 17px; text-align: center; }
  .mh-cta__author { margin: 4px 0 20px; text-align: center; }
  .mh-cta__button { width: 100%; max-width: 320px; }
  .mh-stimmen { padding: 50px 20px; }
  .mh-stimmen__track blockquote, .mh-stimmen blockquote { width: 100%; margin: 0; }
  .mh-stimmen__arrow { top: auto; bottom: -6px; }
  .mh-kurs-extra .mh-sec__in { padding-left: 20px; padding-right: 20px; }
}

/* --- Anmeldeformular button: PDF symbol drawn by CSS (works in template and OPC button portlet) --- */
a.mh-pdf-button .mh-pdf-button__icon,
.opc-Button.mh-pdf-button .btn::before {
  content: ""; display: inline-block; flex: 0 0 25px; width: 25px; height: 25px; margin-right: 10px; font-size: 0; color: transparent;
  background: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath fill='%23820924' d='M64 0C28.7 0 0 28.7 0 64v384c0 35.3 28.7 64 64 64h256c35.3 0 64-28.7 64-64V160H256c-17.7 0-32-14.3-32-32V0H64zm192 0v128h128L256 0zM64 224h24c30.9 0 56 25.1 56 56s-25.1 56-56 56H80v32c0 8.8-7.2 16-16 16s-16-7.2-16-16V240c0-8.8 7.2-16 16-16zm24 80c13.3 0 24-10.7 24-24s-10.7-24-24-24H80v48h8zm72-64c0-8.8 7.2-16 16-16h24c26.5 0 48 21.5 48 48v64c0 26.5-21.5 48-48 48h-24c-8.8 0-16-7.2-16-16V240zm32 16v96h8c8.8 0 16-7.2 16-16v-64c0-8.8-7.2-16-16-16h-8zm96-16c0-8.8 7.2-16 16-16h48c8.8 0 16 7.2 16 16s-7.2 16-16 16h-32v32h32c8.8 0 16 7.2 16 16s-7.2 16-16 16h-32v48c0 8.8-7.2 16-16 16s-16-7.2-16-16V240z'/%3E%3C/svg%3E") no-repeat center / contain;
}
a.mh-pdf-button .mh-pdf-button__icon + span { margin-left: 0; }
.opc-Button.mh-pdf-button .btn { display: inline-flex; align-items: center; }
/* OPC pages imported before 5.9.0 still contain the icon span - never show it (would be a second symbol) */
.opc-Button.mh-pdf-button .btn .opc-Icon { display: none !important; }

/* --- Young Stylist: three columns follow the intro with 65px like #div_block-716-2038 (no extra section padding) --- */
.mh-product__intro:has(+ .mh-kurs-extra--cols) { padding-bottom: 0; }
.mh-product__intro + .mh-kurs-extra--cols .mh-sec__in { padding-top: 0; }

/* --- "Wohnen" as a heading inside a block (SS Active Summer Session, #headline-75-1982-1-1) --- */
.mh-aufzaehlung .mh-h2-details--inline, .mh-product .mh-h2-details--inline { display: block; margin: 30px 0 8px; font-size: 30px; font-weight: 600; line-height: 1.2; text-transform: uppercase; color: #820924; }
.mh-h2-details--inline + p { margin-top: 0; }

/* --- Young Stylist testimonial grid: text 20px above/below like #_rich_text-729-2038 --- */
.mh-kurs-extra--stimmen .mh-kurs-col p { margin: 20px 0; }
.mh-kurs-extra--stimmen .mh-kurs-col img { display: block; margin: 0 auto; }

/* --- Seminartermine without the radio circle: plain bordered rows, centred text like the original date buttons --- */
.mh-product__variations .mh-dates .mh-dates__circle { display: none !important; }
.mh-product__variations .mh-dates .mh-dates__radio,
.mh-product__variations .mh-dates .mh-dates__radio:hover,
.mh-product__variations .mh-dates .mh-dates__radio.active { justify-content: center; text-align: center; gap: 10px; }
.mh-product__variations .mh-dates .mh-dates__radio .label-variation { flex: 0 1 auto; }
.mh-product__variations .mh-dates .mh-dates__price, .mh-product__variations .mh-dates .mh-dates__note { margin-left: 0; }
.mh-product__variations .mh-dates .mh-dates__radio.active { background: #820924; border-color: #820924; color: #fff; }
.mh-product__variations .mh-dates .mh-dates__radio.active .label-variation,
.mh-product__variations .mh-dates .mh-dates__radio.active .mh-dates__price { color: #fff; }
.mh-product__variations .mh-dates .mh-dates__input:focus-visible ~ .label-variation { outline: 2px solid #820924; outline-offset: 4px; }

/* --- cart button is visibly disabled until a date has been chosen (the child page shows the active button) --- */
.mh-product__basket .mh-product__cart-btn[disabled],
.mh-product__basket .mh-product__cart-btn[disabled]:hover,
.mh-product__basket .mh-product__cart-btn[disabled]:focus {
  background: #cfcfcf !important; border-color: #cfcfcf !important; color: #fff !important;
  cursor: not-allowed; opacity: 1; box-shadow: none; transform: none;
}
.mh-product__cart-hint { margin: 8px 0 0; font-size: 12px; line-height: 1.5; color: #666; }

/* --- selected date: only the border turns burgundy (no filled background, text stays dark) --- */
.mh-product__variations .mh-dates .mh-dates__radio.active,
.mh-product__variations .mh-dates .mh-dates__radio.active:hover {
  background: #fff; border: 2px solid #820924; color: #000; padding: 8px 11px;
}
.mh-product__variations .mh-dates .mh-dates__radio.active .label-variation,
.mh-product__variations .mh-dates .mh-dates__radio.active .mh-dates__price { color: #000; font-weight: 600; }

/* --- Unterkunft page (Oxygen 2913): intro 65 % / 30 % with 100px below, four cards 30 % (.Unterkunft_Div) --- */
.mh-unterkunft-page .mh-sec__in { text-align: justify; }
.mh-unterkunft-page .mh-h1 { text-align: center; margin-bottom: 40px; }
.mh-unterkunft-intro, .mh-page--fluid .opc-Container.mh-unterkunft-intro > div { display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start; width: 100%; margin-bottom: 100px; }
.mh-unterkunft-intro__main { width: 65%; text-align: left; }
.mh-unterkunft-intro__note { width: 30%; text-align: left; }
.mh-unterkunft-intro p { margin: 0; font-size: 15px; line-height: 1.6; }
.mh-unterkunft-grid, .mh-page--fluid .opc-Container.mh-unterkunft-grid > div { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; width: 100%; gap: 0; }
.mh-unterkunft-grid::after { content: ""; width: 30%; }        /* keeps the 4th card left-aligned like Oxygen's space-between wrap */
.mh-unterkunft-card { width: 30%; margin-bottom: 60px; display: flex; flex-direction: column; text-align: left; }
.mh-unterkunft-card__title { margin: 0; color: #820924; font-weight: 700; font-size: 22px; line-height: 1.6; }
.mh-unterkunft-card__title a { color: #820924; text-decoration: none; }
.mh-unterkunft-card__img { width: 100%; height: 200px; margin: 20px 0; background-size: cover; background-position: 50% 50%; }
.mh-unterkunft-card .mh-text p { margin: 0 0 15px; font-size: 15px; line-height: 1.6; }
.mh-unterkunft-card .mh-text p:last-child { margin-bottom: 0; }
.mh-unterkunft-card__link { margin-top: 18px; color: #820924; font-weight: 600; text-decoration: none; }
.mh-unterkunft-card__link:hover { color: #820924; text-decoration: underline; }
@media (max-width: 991px) {
  .mh-unterkunft-card { width: 48%; }
  .mh-unterkunft-grid::after { width: 48%; }
}
@media (max-width: 767px) {
  .mh-unterkunft-intro, .mh-page--fluid .opc-Container.mh-unterkunft-intro > div { flex-direction: column; margin-bottom: 50px; gap: 20px; }
  .mh-unterkunft-intro__main, .mh-unterkunft-intro__note, .mh-unterkunft-card { width: 100%; }
  .mh-unterkunft-card { margin-bottom: 40px; }
}

/* --- "Dieser Artikel befindet sich nun in Ihrem Warenkorb" card: button texts must not inherit the burgundy link colour --- */
.mh-product #pushed-success .btn-basket,
.mh-product #pushed-success a.btn-primary,
.mh-product .card.alert-dismissable a.btn-primary {
  color: #fff !important; background: #820924; border-color: #820924; text-decoration: none;
}
.mh-product #pushed-success .btn-basket:hover,
.mh-product #pushed-success a.btn-primary:hover { color: #fff !important; background: rgba(130, 9, 36, .85); border-color: rgba(130, 9, 36, .85); }
.mh-product #pushed-success .continue-shopping,
.mh-product #pushed-success a.btn-outline-primary { color: #820924 !important; background: #fff; border-color: #820924; text-decoration: none; }
.mh-product #pushed-success .continue-shopping:hover { background: #f9f9f9; }
.mh-product #pushed-success .btn { text-transform: uppercase; letter-spacing: .5px; font-weight: 600; font-size: 13px; }
.mh-product #pushed-success .productbox-title { font-weight: 600; color: #000; margin-bottom: 12px; }

/* --- Seminar overview pages (Ausbildung Basic / Weiterbildung Classic / Advanced / Prüfung): rows like Oxygen
       .ueberblick_div (flex row, mb 10px) with .ueberblick_1 390px + .termin-liste (15px / 24px, pb 20px) --- */
.mh-ueberblick, .mh-page--fluid .mh-ueberblick { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: flex-start; width: 100%; margin: 0 0 10px; }
.mh-ueberblick__label { flex: 0 0 390px; width: 390px; max-width: 390px; padding-right: 20px; font-size: 15px; line-height: 24px; }
.mh-ueberblick__label a { color: #820924; text-decoration: none; }
.mh-ueberblick__label a:hover { text-decoration: underline; }
.mh-ueberblick__label b, .mh-ueberblick__label strong { font-weight: 700; }
.mh-ueberblick__text { flex: 1 1 auto; min-width: 0; }
.mh-termin-liste { font-size: 15px; line-height: 24px; color: #000; padding-bottom: 20px; }
.mh-termin-liste span:last-of-type { display: none; }
/* "MEININGHAUS <big>CLASSIC</big> AUSBILDUNGSKURSE IM ÜBERBLICK:" - the middle word is 40px (#span-29-425) */
.mh-page--fluid .mh-h2-details > span:nth-child(2):nth-last-child(2) { font-size: 40px; line-height: 1; }
.mh-page--fluid .mh-h2-details + .mh-text { margin-bottom: 50px; }
@media (max-width: 767px) {
  .mh-ueberblick, .mh-page--fluid .mh-ueberblick { flex-direction: column; margin-bottom: 18px; }
  .mh-ueberblick__label { flex: 0 0 auto; width: 100%; max-width: 100%; padding-right: 0; }
  .mh-termin-liste { padding-bottom: 0; }
  .mh-page--fluid .mh-h2-details > span:nth-child(2):nth-last-child(2) { font-size: 30px; }
}

/* ==========================================================================
   13  FÖRDERMASSNAHMEN PAGE  (Oxygen 489: three sections, top row 55 % | 40 %, three-column grid below)
   ========================================================================== */
.mh-massnahme .mh-sec__in { padding-top: 100px; padding-bottom: 100px; text-align: left; }
.mh-massnahme:not(.mh-massnahme--alt) .mh-sec__in { padding-top: 75px; }
.mh-massnahme--alt { background: #f4f4f4; }
.mh-massnahme__h1, .mh-massnahme .mh-h1 { margin: 0 0 54px; text-align: left; }
.mh-massnahme__top, .mh-page--fluid .opc-Container.mh-massnahme__top > div {
  display: flex; flex-direction: row; justify-content: space-between; align-items: flex-end; width: 100%; gap: 40px;
}
.mh-massnahme__intro { width: 55%; }
.mh-massnahme__side, .mh-page--fluid .opc-Container.mh-massnahme__side > div { width: 40%; display: flex; flex-direction: column; align-items: flex-start; }
.mh-page--fluid .opc-Container.mh-massnahme__side { width: 40%; }
.mh-page--fluid .opc-Container.mh-massnahme__side > div { width: 100%; }
.mh-massnahme__nr { margin: 0 0 6px; text-align: left; font-size: 18px; color: #820924; font-weight: 400; text-transform: none; }
.mh-massnahme__intro .mh-h2-details { line-height: 1.2; margin: 0; font-weight: 600; }
.mh-massnahme__intro .mh-h2-details b, .mh-massnahme__intro .mh-h2-details strong { font-weight: 700; }
.mh-massnahme__intro .mh-text { margin-top: 25px; font-size: 15px; line-height: 1.6; }
.mh-massnahme__intro .mh-text p { margin: 0 0 15px; }
.mh-massnahme__termine { width: 100%; margin-bottom: 25px; }
.mh-massnahme__termine .mh-h2-details { margin: 0; font-weight: 700; }            /* "ausbildungsTERMINE": prefix light, word bold */
.mh-massnahme__termine .mh-h2-details span { font-weight: 400; }
.mh-massnahme__termine .mh-termin-liste { padding-bottom: 0; }
.mh-massnahme .mh-pdf-button, .mh-massnahme a.mh-pdf-button { width: 100%; max-width: none; margin-top: 0; justify-content: flex-start; }
.mh-massnahme__note { margin: 20px 0 0; color: #820924; font-weight: 600; font-size: 15px; line-height: 1.6; }
.mh-massnahme__grid, .mh-page--fluid .opc-Container.mh-massnahme__grid > div {
  display: grid; grid-template-columns: repeat(3, minmax(200px, 1fr)); column-gap: 40px; row-gap: 20px; width: 100%; margin-top: 30px; align-items: stretch;
}
.mh-massnahme__col--stack, .mh-page--fluid .opc-Container.mh-massnahme__col--stack > div { display: flex; flex-direction: column; gap: 40px; }
.mh-massnahme__grid .mh-text { font-size: 15px; line-height: 1.6; }
.mh-massnahme__grid .mh-text p { margin: 0 0 10px; }
.mh-massnahme__grid .mh-text p strong:only-child, .mh-massnahme__grid .mh-text p:first-child strong { color: #000; }
@media (max-width: 991px) {
  .mh-massnahme__top, .mh-page--fluid .opc-Container.mh-massnahme__top > div { flex-direction: column; align-items: flex-start; gap: 30px; }
  .mh-massnahme__intro, .mh-massnahme__side, .mh-page--fluid .opc-Container.mh-massnahme__side { width: 100%; }
  .mh-massnahme__grid, .mh-page--fluid .opc-Container.mh-massnahme__grid > div { grid-template-columns: repeat(2, minmax(200px, 1fr)); }
}
@media (max-width: 767px) {
  .mh-massnahme .mh-sec__in, .mh-massnahme:not(.mh-massnahme--alt) .mh-sec__in { padding-top: 48px; padding-bottom: 48px; }
  .mh-massnahme__h1, .mh-massnahme .mh-h1 { margin-bottom: 30px; }
  .mh-massnahme__grid, .mh-page--fluid .opc-Container.mh-massnahme__grid > div { grid-template-columns: 1fr; }
  .mh-massnahme__col--stack, .mh-page--fluid .opc-Container.mh-massnahme__col--stack > div { gap: 20px; }
}
/* Fördermaßnahmen: the Anmeldeformular button (OPC button portlet) spans the whole right column like #link-70-489 */
.mh-massnahme .opc-Button.mh-pdf-button { width: 100%; }
.mh-massnahme .opc-Button.mh-pdf-button .btn { display: flex; width: 100%; justify-content: flex-start; }
.mh-massnahme__side > *, .mh-page--fluid .opc-Container.mh-massnahme__side > div > * { width: 100%; align-self: stretch; }

/* --- default H1 of CMS pages (Oxygen h1: 36px / 600 / no uppercase) - beats the "#content h1" shop-page rule --- */
#content .mh-page--fluid h1:not([class*="mh-"]):not(.mh-h1):not(.mh-product__title):not(.mh-kontakt__title) { font-size: 36px; font-weight: 600; line-height: 1.15; text-transform: none; color: #820924; margin: 0; }
@media (max-width: 767px) { #content .mh-page--fluid h1:not([class*="mh-"]):not(.mh-h1):not(.mh-product__title):not(.mh-kontakt__title) { font-size: 28px; } }

/* --- combined seminar pages (C1 / C2): one Seminartermine block per variant article, like the two/three
       WooCommerce product widgets of the original page ("3 TAGE 570,00 €", "5 TAGE 630,00 € – 690,00 €") --- */
.mh-variants { display: flex; flex-direction: column; gap: 40px; width: 100%; }
.mh-variant { width: 100%; }
.mh-variant__title { margin: 0 0 6px; font-family: var(--mh-font-heading); font-size: 22px; font-weight: 700; letter-spacing: .2px; line-height: 1.6; text-transform: uppercase; color: #820924; }
.mh-variant .mh-product__price { margin-bottom: 0; }
.mh-variant .mh-product__variations { margin-top: 9px; }
.mh-variant .mh-product__basket { margin-top: 20px; }
.mh-variant .mh-product__cart-hint a { color: #820924; font-weight: 600; }

/* ==========================================================================
   14  TRAIN YOUR SKILL PAGE  (Oxygen 2929)
   ========================================================================== */
.mh-tys-title { font-size: 36px; font-weight: 400; line-height: 1.15; color: #820924; margin: 0 0 20px; }
.mh-tys-title strong { font-weight: 600; }
.mh-tys-intro { margin-bottom: 46px; }
.mh-tys-intro p { margin: 0 0 15px; }
/* three numbered columns (#div_block-86-2929: margin-top 22px, 30 % each, number 36px burgundy centred) */
.mh-tys-steps, .mh-page--fluid .opc-Container.mh-tys-steps > div { display: flex; flex-direction: row; justify-content: space-between; width: 100%; margin-top: 22px; }
.mh-tys-step, .mh-page--fluid .opc-Container.mh-tys-step { width: 30%; text-align: center; }
.mh-tys-step__num { font-size: 36px; font-weight: 600; line-height: 1.15; color: #820924; text-align: center; margin: 0 0 10px; }
.mh-tys-step .mh-text, .mh-tys-step .mh-text p { text-align: center; }
.mh-tys-step .mh-text p { margin: 0 0 10px; }
/* Beispielpaket: text 60 % | table, vertically centred (#div_block-55-2929) */
.mh-tys-package, .mh-page--fluid .opc-Container.mh-tys-package > div { display: flex; flex-direction: row; justify-content: space-between; align-items: center; gap: 40px; width: 100%; }
.mh-tys-package__text, .mh-page--fluid .opc-Container.mh-tys-package__text { width: 60%; }
.mh-tys-package__table, .mh-page--fluid .opc-Container.mh-tys-package__table { width: 37%; }
.mh-tys-package__text ol { padding-left: 1.2em; margin: 0; }
.mh-tys-package__text ol li { margin-bottom: 6px; }
/* burgundy benefits band: three 30 % columns, white text (#section-5-2929) */
.mh-tys-cols, .mh-page--fluid .opc-Container.mh-tys-cols > div { display: flex; flex-direction: row; justify-content: space-between; width: 100%; }
.mh-tys-col, .mh-page--fluid .opc-Container.mh-tys-col { width: 30%; }
.mh-sec--brand .mh-tys-col p, .mh-sec--brand .mh-tys-col strong { color: #fff; }
/* Preise: two columns 49 % / 48 %, 42px below the intro (#div_block-82-2929) */
.mh-tys-prices, .mh-page--fluid .opc-Container.mh-tys-prices > div { display: flex; flex-direction: row; justify-content: space-between; width: 100%; margin-top: 42px; }
.mh-tys-prices__col, .mh-page--fluid .opc-Container.mh-tys-prices__col { width: 49%; }
.mh-tys-prices__col:last-child, .mh-page--fluid .opc-Container.mh-tys-prices__col:last-child { width: 48%; }
.mh-tys-prices__col .mh-text + .mh-text { margin-top: 20px; }
/* .redTable of the original: header cells are <td> */
.mh-table thead td, table.redTable thead td { color: #fff; font-weight: 700; text-align: center; border-left: 2px solid #820924; background: #820924; }
.mh-table td { padding: 6px; font-size: 15px; }
.mh-table { width: auto; max-width: 100%; }
/* CTA band of the page (#section-36-2929): 60px padding, 21px text, white bordered button */
.mh-tys-cta .mh-sec__in { padding-top: 60px; padding-bottom: 60px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; }
.mh-page--fluid .opc-Container.mh-tys-cta .mh-sec__in > div { display: flex; flex-direction: row; justify-content: space-between; align-items: center; width: 100%; }
.mh-tys-cta .mh-cta__text { width: 80%; }
.mh-tys-cta__head, .mh-tys-cta .mh-cta__head { font-size: 21px; font-weight: 600; text-transform: none; line-height: 1.6; color: #fff; margin: 0 20px 0 0; text-align: left; }
.mh-tys-cta .mh-cta__button { color: #fff !important; }
@media (max-width: 991px) {
  .mh-tys-package, .mh-page--fluid .opc-Container.mh-tys-package > div { flex-direction: column; align-items: flex-start; gap: 30px; }
  .mh-tys-package__text, .mh-tys-package__table, .mh-page--fluid .opc-Container.mh-tys-package__text, .mh-page--fluid .opc-Container.mh-tys-package__table { width: 100%; }
  .mh-tys-prices, .mh-page--fluid .opc-Container.mh-tys-prices > div { flex-direction: column; gap: 40px; }
  .mh-tys-prices__col, .mh-tys-prices__col:last-child, .mh-page--fluid .opc-Container.mh-tys-prices__col, .mh-page--fluid .opc-Container.mh-tys-prices__col:last-child { width: 100%; }
  .mh-tys-prices .mh-text { overflow-x: auto; }
}
@media (max-width: 767px) {
  .mh-tys-title { font-size: 28px; }
  .mh-tys-steps, .mh-page--fluid .opc-Container.mh-tys-steps > div, .mh-tys-cols, .mh-page--fluid .opc-Container.mh-tys-cols > div { flex-direction: column; gap: 25px; }
  .mh-tys-step, .mh-tys-col, .mh-page--fluid .opc-Container.mh-tys-step, .mh-page--fluid .opc-Container.mh-tys-col { width: 100%; }
  .mh-tys-cta .mh-sec__in, .mh-page--fluid .opc-Container.mh-tys-cta .mh-sec__in > div { flex-direction: column; align-items: center; text-align: center; }
  .mh-tys-cta .mh-cta__text { width: 100%; }
  .mh-tys-cta__head, .mh-tys-cta .mh-cta__head { text-align: center; margin: 0 0 22px; }
}
#content .mh-page--fluid h1.mh-tys-title:not(.mh-h1):not(.mh-product__title):not(.mh-kontakt__title) { font-size: 36px; font-weight: 400; text-transform: none; line-height: 1.15; margin: 0 0 20px; }
@media (max-width: 767px) { #content .mh-page--fluid h1.mh-tys-title:not(.mh-h1):not(.mh-product__title):not(.mh-kontakt__title) { font-size: 28px; } }
/* price tables on phones: scroll inside their column instead of widening the page */
@media (max-width: 767px) {
  .mh-page--fluid .mh-text:has(> .mh-table), .mh-page--fluid .mh-text:has(> p + .mh-table), .mh-tys-package__table { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
  .mh-table td { padding: 4px 5px; font-size: 13px; }
}

/* --- Kontakt: Google-Maps consent box shown instead of the map until the visitor agrees --- */
.mh-kontakt-map__consent { display: flex; align-items: center; justify-content: center; width: 100%; height: 400px; background: #f4f4f4; border-bottom: 1px solid #e3e3e3; padding: 30px 20px; box-sizing: border-box; }
.mh-kontakt-map__consent-inner { max-width: 720px; text-align: center; }
.mh-kontakt-map__consent-title { margin: 0 0 12px; font-size: 20px; font-weight: 700; color: #820924; line-height: 1.4; }
.mh-kontakt-map__consent-text { margin: 0 0 22px; font-size: 15px; line-height: 1.6; color: #3c3c3b; }
.mh-kontakt-map__consent-actions { display: flex; justify-content: center; align-items: center; gap: 24px; flex-wrap: wrap; }
.mh-kontakt-map__accept { padding: 12px 30px; background: #820924; color: #fff; border: 1px solid #820924; border-radius: 3px; font-family: var(--mh-font); font-size: 15px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; cursor: pointer; transition: background .2s; }
.mh-kontakt-map__accept:hover { background: #999; border-color: #999; color: #fff; }
.mh-kontakt-map__details { color: #820924; font-weight: 600; text-decoration: underline; }
/* the quote block: keep the portrait visible next to the right-aligned lines */
.mh-kontakt__quote { min-height: 300px; }
.mh-kontakt__axel { max-width: 50%; }
@media (max-width: 767px) {
  .mh-kontakt-map__consent { height: 300px; padding: 20px 16px; }
  .mh-kontakt-map__consent-title { font-size: 17px; }
  .mh-kontakt-map__consent-text { font-size: 14px; }
  .mh-kontakt__quote { min-height: 0; }
}

/* ---- 15. Seminarübersicht (/seminaruebersicht, Oxygen page 2044) ------------------------------ */
/* h1 "Alle Seminare im Überblick": 35px uppercase, 45px below (#headline-604); same look for the Termine h2 */
.mh-su-h1, h2.mh-su-h1 { font-size: 35px; margin-bottom: 45px; }
/* two table columns of 48 % with space between (#div_block-596 / -535 / -538) */
.mh-su-cols, .mh-page--fluid .opc-Container.mh-su-cols > div { display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start; width: 100%; }
.mh-su-col, .mh-page--fluid .opc-Container.mh-su-col { width: 48%; min-width: 0; }
.mh-su-col .mh-table, .mh-su-bottom__table .mh-table, .mh-table--seminar { width: 100%; margin: 15px 0; }
.mh-su-col .mh-text, .mh-su-bottom__table.mh-text { margin: 0; }
.mh-table--seminar thead td { text-align: left; }
.mh-table--seminar tbody tr:nth-child(even) { background: #ededed; }
.mh-table--seminar td, .mh-table--plain td { font-size: 15px; line-height: 1.4; vertical-align: top; }
.mh-table--seminar a, .mh-table--plain a { color: #820924; text-decoration: none; }
.mh-table--seminar a:hover, .mh-table--plain a:hover { text-decoration: underline; }
/* course code cells: 50px, Train-Your-Skill colours (.bg50 = Wochenkurse, .bg20 = Tageskurse) */
.mh-table td.bg50, .mh-table td.bg20 { width: 50px; min-width: 50px; text-align: center; font-weight: 700; }
.mh-table td.bg50 { background: #ced2c1 !important; }
.mh-table td.bg20 { background: #c8d3e7 !important; }
/* Train Your Skill block below the columns: text 50 % + legend table 45 %, 52px above (#div_block-599) */
.mh-su-bottom, .mh-page--fluid .opc-Container.mh-su-bottom > div { display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start; width: 100%; margin-top: 52px; }
.mh-su-bottom__text, .mh-page--fluid .opc-Container.mh-su-bottom__text { width: 50%; }
.mh-su-bottom__table, .mh-page--fluid .opc-Container.mh-su-bottom__table { width: 45%; }
.mh-su-bottom__text h3 { font-family: var(--mh-font-heading); font-size: 22px; color: #820924; margin: 0 0 12px; }
.mh-su-bottom__text p { margin: 0 0 12px; }
.mh-table--plain { border: 2px solid #820924; }
/* generated Seminartermine list (snippets/mh_seminartermine.tpl) directly under the heading section */
.mh-su-termine .mh-sec__in { padding-bottom: 0; }
.mh-su-termine-list .mh-sec__in { padding-top: 0; }
.mh-su-month { margin: 0 0 30px; }
.mh-su-month__title { font-family: var(--mh-font-heading); font-size: 22px; font-weight: 600; color: #820924; text-transform: uppercase; margin: 0 0 10px; }
.mh-su-month .mh-table { width: 100%; margin: 0; }
.mh-su-month .mh-table thead td { text-align: left; }
.mh-su-month .mh-table td { font-size: 15px; vertical-align: middle; }
.mh-su-month .mh-table td.mh-su-date { white-space: nowrap; width: 220px; font-weight: 700; }
.mh-su-month .mh-table td.mh-su-price { white-space: nowrap; width: 130px; text-align: right; }
.mh-su-month .mh-table td.mh-su-book { width: 140px; text-align: right; }
.mh-su-month .mh-table td.mh-su-book a { display: inline-block; padding: 4px 12px; border: 1px solid #820924; border-radius: 3px; color: #820924; font-size: 13px; text-decoration: none; }
.mh-su-month .mh-table td.mh-su-book a:hover { background: #820924; color: #fff; }
.mh-su-month .mh-table td.mh-su-book .mh-su-soldout { color: #999; font-size: 13px; }
.mh-su-legend { margin: 0 0 25px; font-size: 14px; color: #555; }
.mh-su-legend span { display: inline-block; width: 14px; height: 14px; margin: 0 4px 0 12px; vertical-align: -2px; border: 1px solid #aaa; }
.mh-su-empty { margin: 0 0 40px; font-size: 16px; }
.mh-su-month .mh-table tr.mh-su-row--week td:first-child { border-left: 6px solid #ced2c1; }
.mh-su-month .mh-table tr.mh-su-row--day td:first-child { border-left: 6px solid #c8d3e7; }
@media (max-width: 900px) {
  .mh-su-h1, h2.mh-su-h1 { font-size: 28px; margin-bottom: 30px; }
  .mh-su-cols, .mh-page--fluid .opc-Container.mh-su-cols > div, .mh-su-bottom, .mh-page--fluid .opc-Container.mh-su-bottom > div { flex-direction: column; }
  .mh-su-col, .mh-page--fluid .opc-Container.mh-su-col, .mh-su-bottom__text, .mh-page--fluid .opc-Container.mh-su-bottom__text, .mh-su-bottom__table, .mh-page--fluid .opc-Container.mh-su-bottom__table { width: 100%; }
  .mh-su-bottom, .mh-page--fluid .opc-Container.mh-su-bottom > div { margin-top: 30px; }
  .mh-su-col .mh-table:first-child { margin-top: 0; }
  .mh-su-month .mh-table td.mh-su-date, .mh-su-month .mh-table td.mh-su-price, .mh-su-month .mh-table td.mh-su-book { width: auto; }
  .mh-su-month .mh-text { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
@media (max-width: 575px) {
  .mh-su-h1, h2.mh-su-h1 { font-size: 24px; }
  .mh-su-month .mh-table td { font-size: 13px; padding: 4px 5px; }
  .mh-su-month .mh-table td.mh-su-date { white-space: normal; }
}
/* the Oxygen wrapper <div class="mh-text mh-table"> around a table must not get the table frame itself */
.mh-page--fluid div.mh-table, .mh-page--fluid .mh-text.mh-table { border: 0; background: transparent; margin: 0; padding: 0; width: auto; max-width: 100%; }
.mh-page--fluid .mh-text.mh-table > table.mh-table { margin: 15px 0; }
.mh-su-col .mh-text.mh-table > table.mh-table, .mh-su-bottom__table > table.mh-table { width: 100%; }
@media (max-width: 575px) {
  .mh-su-month .mh-table { table-layout: auto; }
  .mh-su-month .mh-table td.mh-su-book a { padding: 3px 8px; font-size: 12px; }
  .mh-su-month .mh-table td.mh-su-price { font-size: 12px; }
  .mh-su-legend { font-size: 13px; }
}
/* FullCalendar year view like the original (#code_block-527-2044): events are white on the course colour */
.mh-su-calendar { margin: 0 0 40px; font-family: var(--mh-font-body, inherit); }
.mh-su-calendar .fc-event-time { display: none !important; }
.mh-su-calendar .fc-event-start { margin-left: 15px !important; }
.mh-su-calendar .fc-event-end { margin-right: 15px !important; }
.mh-su-calendar .fc-event, .mh-su-calendar .fc-event:hover, .mh-su-calendar .fc-daygrid-event, .mh-su-calendar .fc-event-title { color: #fff; text-decoration: none; font-size: 13px; }
.mh-su-calendar .fc-daygrid-event { padding: 2px 4px; border-radius: 3px; white-space: normal; }
.mh-su-calendar .fc-daygrid-day-number, .mh-su-calendar .fc-col-header-cell-cushion { color: #333; text-decoration: none; }
.mh-su-calendar .fc-toolbar-title { font-family: var(--mh-font-heading); font-size: 26px; color: #820924; text-transform: uppercase; }
.mh-su-calendar .fc-button-primary { background: #820924; border-color: #820924; color: #fff; text-transform: none; box-shadow: none; }
.mh-su-calendar .fc-button-primary:hover, .mh-su-calendar .fc-button-primary:not(:disabled):active, .mh-su-calendar .fc-button-primary:not(:disabled).fc-button-active { background: #5e0619; border-color: #5e0619; }
.mh-su-calendar .fc-button-primary:disabled { background: #b5b5b5; border-color: #b5b5b5; }
.mh-su-calendar .fc-multimonth-title { font-family: var(--mh-font-heading); font-size: 20px; color: #820924; padding: 20px 0 10px; }
.mh-su-calendar .fc-day-today { background: rgba(130, 9, 36, 0.06); }
.mh-su-calendar .fc-daygrid-more-link { color: #820924; font-size: 12px; }
.mh-su-calendar .fc-popover { z-index: 1050; }
.mh-su-calendar .fc-popover-title { font-size: 14px; }
.mh-su-calendar.fc-theme-standard td, .mh-su-calendar.fc-theme-standard th, .mh-su-calendar.fc-theme-standard .fc-scrollgrid { border-color: #ddd; }
.mh-su-noscript { margin: 0 0 30px; padding-left: 1.2em; }
@media (max-width: 767px) {
  .mh-su-calendar .fc-toolbar { flex-direction: column; gap: 10px; align-items: flex-start; }
  .mh-su-calendar .fc-toolbar-title { font-size: 20px; }
  .mh-su-calendar .fc-event, .mh-su-calendar .fc-daygrid-event, .mh-su-calendar .fc-event-title { font-size: 10px; }
  .mh-su-calendar .fc-event-start { margin-left: 2px !important; }
  .mh-su-calendar .fc-event-end { margin-right: 2px !important; }
  .mh-su-calendar .fc-daygrid-event { padding: 1px 2px; }
  .mh-su-calendar .fc-daygrid-day-number { font-size: 12px; padding: 2px; }
}
/* #mh-calendar itself carries the .fc root class -> theme via FullCalendar's CSS variables */
.mh-su-calendar.fc { --fc-button-bg-color: #820924; --fc-button-border-color: #820924; --fc-button-hover-bg-color: #5e0619; --fc-button-hover-border-color: #5e0619; --fc-button-active-bg-color: #5e0619; --fc-button-active-border-color: #5e0619; --fc-today-bg-color: rgba(130, 9, 36, 0.06); --fc-border-color: #ddd; --fc-more-link-text-color: #820924; --fc-page-bg-color: #fff; }
.mh-su-calendar .fc-daygrid-day-number, .mh-su-calendar .fc-col-header-cell-cushion { color: #333 !important; }
/* courses without bookable dates ("Termine auf Anfrage …", json datesNote): note instead of dates/price/cart */
.mh-product__onrequest { font-size: 16px; line-height: 1.6; }
.mh-product__onrequest p { color: #000; }

/* ---- 16. seminar page without picture: title + intro over the full row (Gesellenprüfungsvorbereitung) ---- */
.mh-product__intro--full { gap: 0; }
.mh-product__intro--full .mh-product__intro-text { flex: 1 1 100%; width: 100%; }
.mh-product__intro--full .mh-product__image { display: none; }
/* ---- YouTube video (content link a.mh-video-link -> consent box, iframe after click) ---- */
.mh-video { position: relative; width: 100%; max-width: 560px; aspect-ratio: 16 / 9; margin: 20px 0 10px; background: #f4f4f4; border: 1px solid #ddd; overflow: hidden; }
.mh-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.mh-video__consent { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 20px 24px; }
.mh-video__title { margin: 0 0 8px; font-family: var(--mh-font-heading); font-size: 18px; font-weight: 600; color: #820924; }
.mh-video__text { margin: 0 0 14px; font-size: 13px; line-height: 1.5; color: #333; }
.mh-video__accept { padding: 8px 18px; background: #820924; color: #fff; border: 0; border-radius: 3px; font-size: 14px; font-weight: 600; cursor: pointer; }
.mh-video__accept:hover { background: #5e0619; }
.mh-video__external { margin-top: 10px; font-size: 12px; color: #820924 !important; text-decoration: underline; }
.mh-video--loaded { background: #000; }
@media (max-width: 575px) { .mh-video__title { font-size: 15px; } .mh-video__text { font-size: 12px; margin-bottom: 10px; } }

/* ---- 17. Meisterkurs intro (Oxygen 2087: h1 full row, then grid text | square team picture with hover swap) ---- */
.mh-product__title-light { font-weight: 400; }
.mh-product__intro--grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 50px; align-items: stretch; }
.mh-product__intro--grid2 .mh-product__intro-text { display: contents; }
.mh-product__intro--grid2 .mh-product__title { grid-column: 1 / -1; margin-bottom: 15px; }
.mh-product__intro--grid2 .mh-product__desc { grid-column: 1; margin: 0; }
.mh-product__intro--grid2 .mh-product__image { grid-column: 2; grid-row: 2; width: 100%; flex: none; max-width: none; }
.mh-product__intro--grid2 .mh-product__image > img, .mh-product__intro--grid2 .mh-product__swap { width: 100%; aspect-ratio: 1 / 1; }
.mh-product__swap img { width: 100%; height: 100%; object-fit: contain; object-position: top left; }
.mh-product__swap .mh-swap__b { position: absolute; top: 0; left: 0; }
.mh-product__intro--grid2 .mh-kurs-caption .mh-sec__in { padding-top: 0; }
@media (max-width: 991px) {
  .mh-product__intro--grid2 { grid-template-columns: minmax(0, 1fr); }
  .mh-product__intro--grid2 .mh-product__title, .mh-product__intro--grid2 .mh-product__desc, .mh-product__intro--grid2 .mh-product__image { grid-column: 1; grid-row: auto; }
  .mh-product__intro--grid2 .mh-product__image { width: 80%; margin: 0 auto; }
}
@media (max-width: 767px) { .mh-product__intro--grid2 .mh-product__image { width: 100%; } }

/* ---- 18. Meisterkurs-Prüfungsfächer (/meisterkurs-pruefungsfaecher, Oxygen 2087/2806) ---- */
.mh-pf-sec .mh-sec__in { padding-top: 0; padding-bottom: 100px; }
.mh-backlink { margin: 55px 0 28px; padding: 10px 0; font-size: 15px; }
.mh-backlink a { color: #820924; text-decoration: none; display: inline-flex; align-items: center; gap: 10px; }
.mh-backlink a::before { content: ""; width: 9px; height: 9px; border-left: 2px solid #820924; border-bottom: 2px solid #820924; transform: rotate(45deg); margin-left: 6px; }
.mh-backlink a:hover { text-decoration: underline; }
.mh-pf-title, h1.mh-pf-title { font-family: var(--mh-font-heading); font-size: 36px; font-weight: 600; line-height: 1.15; color: #820924; text-transform: none; margin: 0 0 21px; }
.mh-pf-title span { font-weight: 400; }
.mh-pf-grid, .mh-page--fluid .opc-Container.mh-pf-grid > div { display: grid; grid-template-columns: repeat(2, minmax(200px, 1fr)); gap: 40px; align-items: stretch; width: 100%; }
.mh-pf-block, .mh-page--fluid .opc-Container.mh-pf-block { min-width: 0; }
.mh-pf-h2, .mh-pf-block .mh-h2, .mh-page--fluid .mh-pf-block h2.mh-h2 { font-family: var(--mh-font-heading); font-size: 22px; font-weight: 700; letter-spacing: 0.2px; line-height: 1.6; text-transform: uppercase; color: #820924; margin: 5px 0; }
.mh-pf-block h6.h5, .mh-pf-block .h5 { font-family: var(--mh-font-heading); font-size: 16px; font-weight: 600; line-height: 1.2; color: #820924; margin: 0; }
.mh-pf-block p { margin: 15px 0 0; font-size: 15px; line-height: 24px; color: #000; }
.mh-pf-block ul, .mh-pf-block ol { margin: 15px 0 0; padding-left: 1.3em; }
.mh-pf-block li { margin-bottom: 3px; font-size: 15px; line-height: 24px; color: #3c3c3b; }
.mh-pf-block .mh-text + .mh-text, .mh-pf-block .opc-Container.mh-text + .opc-Container.mh-text { margin-top: 20px; }
.mh-pf-cta .mh-sec__in { padding-top: 60px; padding-bottom: 60px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; }
.mh-page--fluid .opc-Container.mh-pf-cta .mh-sec__in > div { display: flex; flex-direction: row; justify-content: space-between; align-items: center; width: 100%; }
@media (max-width: 767px) {
  .mh-pf-grid, .mh-page--fluid .opc-Container.mh-pf-grid > div { grid-template-columns: minmax(0, 1fr); gap: 30px; }
  .mh-backlink { margin: 25px 0 15px; }
  .mh-pf-title, h1.mh-pf-title { font-size: 28px; }
  .mh-pf-sec .mh-sec__in { padding-bottom: 50px; }
}
.mh-pf-cta .mh-cta__text { width: 80%; }
.mh-pf-cta .mh-cta__button { color: #fff !important; }
@media (max-width: 767px) {
  .mh-pf-cta .mh-sec__in, .mh-page--fluid .opc-Container.mh-pf-cta .mh-sec__in > div { flex-direction: column; align-items: center; text-align: center; }
  .mh-pf-cta .mh-cta__text { width: 100%; margin-bottom: 20px; }
}
/* Prüfungsfächer: OPC heading portlet / generic rules must not restyle the title and the h6 sub-headings */
#content .mh-page--fluid .mh-pf-sec h1, .mh-page--fluid .mh-pf-sec h1.mh-pf-title { font-size: 36px !important; font-weight: 600 !important; text-transform: none !important; line-height: 1.15 !important; margin: 0 0 21px !important; color: #820924; }
#content .mh-page--fluid .mh-pf-sec h1 span { font-weight: 400 !important; }
.mh-page--fluid .mh-pf-block h6, .mh-page--fluid .mh-pf-block h6.h5 { font-size: 16px !important; font-weight: 600 !important; line-height: 1.2 !important; color: #820924 !important; margin: 0 !important; text-transform: none !important; }
.mh-page--fluid .mh-pf-block .mh-text + .mh-text h6 { margin-top: 20px !important; }
@media (max-width: 767px) { #content .mh-page--fluid .mh-pf-sec h1, .mh-page--fluid .mh-pf-sec h1.mh-pf-title { font-size: 28px !important; } }

/* ---- 19. Meisterkurs Seminardetails + sidebar like the original (#section-1118-2087) ---- */
.mh-kurs-h3 .is-light, .mh-product .mh-kurs-h3 .is-light, .mh-aufzaehlung .mh-kurs-h3 .is-light { font-weight: 400; }
/* block heading kept for the parser but not shown (<h2><span class="mh-visually-hidden">Seminardetails</span></h2>) */
.mh-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.mh-product__block:has(> h2 > .mh-visually-hidden:only-child) > h2, .mh-opc-h2:has(> h2 > .mh-visually-hidden:only-child), .mh-product .mh-opc-h2:has(> .mh-h2-details > .mh-visually-hidden:only-child) { display: none; }
/* buy box: sentence under the heading, dates as plain text, PDF button under the dates */
.mh-product__dates-intro { margin: 0 0 25px; font-size: 15px; line-height: 24px; color: #000; }
.mh-dates--plain { list-style: none; margin: 0; padding: 0; }
.mh-dates--plain li { font-size: 15px; line-height: 24px; color: #000; padding: 0; }
.mh-product__buy a.mh-pdf-button--dates { margin: 28px 0; }
.mh-kurs-aside--preise .mh-kurs-h3 { margin: 0 0 10px; }
.mh-kurs-aside a.mh-pdf-button, .mh-product .mh-kurs-aside a.mh-pdf-button { margin: 0 0 28px; }
.mh-kurs-aside--preise p { margin: 0; }
.mh-product__buy a.mh-pdf-button, .mh-kurs-aside a.mh-pdf-button, .mh-product .mh-kurs-aside a.mh-pdf-button { display: inline-flex; width: auto; max-width: none; justify-content: flex-start; }

.mh-product__buy .mh-h2-details--small { font-size: 25px; line-height: 1.4; margin-bottom: 10px; }
.mh-product .mh-product__buy a.mh-pdf-button--dates, .mh-product .mh-kurs-aside a.mh-pdf-button { display: inline-flex !important; width: auto !important; max-width: none !important; justify-content: flex-start; }
/* the buy box is a flex column: the button must not stretch to the full column width */
.mh-product .mh-product__buy a.mh-pdf-button--dates { align-self: flex-start; }

/* ---- 20. course page in rows (json "layout": "rows", Langhaar - built by meininghaus.js initProductRows) ---- */
.mh-product__rows { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 70px; }
.mh-product__row { display: grid; grid-template-columns: repeat(3, minmax(200px, 1fr)); column-gap: 40px; align-items: start; }
.mh-product__row-col, .mh-product__row .mh-product__col { grid-column: span 2; }
.mh-product__row .mh-product__buy--row { grid-column: 3; }
.mh-product__row-col > .mh-opc-h2:first-child .mh-h2-details, .mh-product .mh-product__row-col > .mh-opc-h2:first-child .mh-h2-details { margin-top: 0; }
.mh-product__buy--source { display: none !important; }
.mh-variant__head, .mh-product .mh-variant__head { margin: 0 0 14px; line-height: 1.2; }
.mh-variant__label { display: inline-block; margin-top: 8px; font-size: 36px; font-weight: 700; line-height: 1.15; text-transform: uppercase; }
.mh-product__row .mh-variant + .mh-variant { margin-top: 0; }
.mh-product__row .mh-unterkunft { margin-top: 0; }
@media (max-width: 991px) {
  .mh-product__rows { gap: 40px; }
  .mh-product__row { grid-template-columns: minmax(0, 1fr); row-gap: 25px; }
  .mh-product__row-col, .mh-product__row .mh-product__col, .mh-product__row .mh-product__buy--row { grid-column: 1; }
  .mh-variant__label { font-size: 28px; }
}
.mh-product .mh-product__row-col > .mh-opc-h2:first-child .mh-h2-details { margin-top: 0 !important; }

/* ---- 21. hero slider on phones: the slide fills the screen width and shows the whole picture ------------------
   The seminar slides are 1042x877 pictures with the tilted white frame inside the image; with object-fit: cover at
   375x320 the frame was cut off left and right. On phones the slider now follows the picture ratio (1042:877) and
   letterboxes nothing: contain for the framed pictures, cover only for panorama pictures (class is-wide set by
   meininghaus.js when width/height > 1.6, e.g. the 2500x833 "Die Akademie" photo). */
@media (max-width: 767px) {
  .meininghaus-slider.mh-hero { height: auto !important; aspect-ratio: 1042 / 877; min-height: 0; }
  .mh-hero .meininghaus-slider__track, .mh-hero .meininghaus-slider__slide { height: 100%; }
  .mh-hero .meininghaus-slider__bg, .mh-hero .meininghaus-slider__bg img { width: 100%; height: 100%; }
  .mh-hero .meininghaus-slider__bg img { object-fit: contain; object-position: 50% 50%; }
  .mh-hero .meininghaus-slider__slide.is-wide .meininghaus-slider__bg img { object-fit: cover; }
  .meininghaus-slider.mh-hero .meininghaus-slider__content { left: 8% !important; top: 22% !important; width: 84% !important; }
  .meininghaus-slider.mh-hero .meininghaus-slider__title { font-size: 26px !important; padding: 0 14px !important; line-height: 1.5 !important; }
  .meininghaus-slider.mh-hero .meininghaus-slider__button { font-size: 24px !important; padding: 12px 18px !important; margin-left: 14px !important; margin-top: 4px; }
  .mh-hero .meininghaus-slider__arrow { top: 50%; }
}
@media (max-width: 575px) {
  .meininghaus-slider.mh-hero .meininghaus-slider__title { font-size: 22px !important; }
  .meininghaus-slider.mh-hero .meininghaus-slider__button { font-size: 20px !important; padding: 10px 14px !important; }
}

/* ---- 22. phone menu: Seminarübersicht + Kontakt as extra entries (header links are hidden below 992px) ---- */
.mh-nav__item--mobile { display: none; }
@media (max-width: 991px) {
  .mh-nav__item--mobile { display: block; }
  .mh-nav__item--mobile:first-of-type, .mh-nav__item:not(.mh-nav__item--mobile) + .mh-nav__item--mobile { margin-top: 12px; border-top: 1px solid #e5e5e5; padding-top: 12px; }
  .mh-nav__item--mobile + .mh-nav__item--mobile { margin-top: 0; border-top: 0; padding-top: 0; }
}

/* ---- 23. checkout step 2 "Zahlung" like the old shop: payment method as a tab box, no shipping row ---------
   Old WooCommerce layout: heading "Zahlungsart auswählen", one light box per payment method with the method
   name as a small tab, below it a darker panel with the note text. The shop has a single shipping method, its
   radio row is hidden (templates/NOVAChild/checkout/step3_shipping_options.tpl; this CSS is the fallback). */
.checkout-shipping-form .checkout-shipping-form-options,
.mh-checkout-shipping-hidden { display: none; }
#fieldset-payment > hr { display: none; }
.checkout-shipping-form .checkout-payment-options { margin: 10px 0 0; }
/* the radiogroup wrapper has no column class -> stretch it so every method box spans the full width */
.checkout-payment-options > [role="group"] { width: 100%; }
.checkout-payment-options .checkout-payment-method { margin-bottom: 14px; }
.checkout-payment-options .custom-control.custom-radio { display: block; width: 100%; min-height: 0; padding: 0; margin: 0; }
.checkout-payment-options .custom-control-input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.checkout-payment-options .custom-control-label {
  display: block; width: 100%; padding: 14px 14px 16px;
  background: #e9e6ed; border: 1px solid #d8d3dd; border-radius: 4px;
  color: #333; cursor: pointer; transition: border-color 0.2s;
}
.checkout-payment-options .custom-control-label::before,
.checkout-payment-options .custom-control-label::after { display: none; }
.checkout-payment-options .custom-control-input:focus-visible ~ .custom-control-label { outline: 2px solid #820924; outline-offset: 2px; }
.checkout-payment-options .custom-control-label .content { display: block; padding: 0 0 0 14px; margin: 0 0 14px; }
.checkout-payment-options .custom-control-label .title { font-size: 13px; font-weight: 400; color: #555; }
.checkout-payment-options .custom-control-label img.img-sm { display: block; margin: 0 0 14px 14px; max-height: 32px; }
.checkout-payment-options .checkout-payment-method-badge { float: none; display: block; margin: 0 0 10px 14px; color: #000; }
.checkout-payment-options .checkout-payment-method-note {
  position: relative; display: block; padding: 18px 14px;
  background: #dcd6e0; border-radius: 3px;
}
.checkout-payment-options .checkout-payment-method-note::before {
  content: ""; position: absolute; top: -7px; left: 40px;
  border: 7px solid transparent; border-top: 0; border-bottom-color: #dcd6e0;
}
.checkout-payment-options .checkout-payment-method-note small { font-size: 16px; line-height: 1.5; color: #444; }