/* ============================================================
   KOVY CORPORATE DESIGN OVERRIDES für Baume Template
   ------------------------------------------------------------
   Marken-Farben aus dem CD-Handbuch:
     Primary Grün:       #83b05a  (Kochwerk-Grün)
     Primary Hover:      #6a9147
     Dark Grün:          #1f3727
     Light Grün 60 %:    #b8d48a
     Light Background:   #f5f7f2
     Light Tint:         #eaf0e2
   ============================================================ */

:root {
  --kovy-green: #83b05a;
  --kovy-green-dark: #6a9147;
  --kovy-dark: #1f3727;
  --kovy-light-bg: #f5f7f2;
  --kovy-light-tint: #eaf0e2;
}

/* ---------- TYPOGRAPHY OVERRIDE -------------------------- */
body, h1, h2, h3, h4, h5, h6, p, a, span, button, input, textarea, select {
  font-family: "Myriad Pro", "Nunito", "Poppins", Helvetica, Arial, sans-serif;
}
body { color: #4a554a; }

/* ---------- LOGO (Bild statt Text) ----------------------- */
.logo h2 a {
  font-size: 0 !important;
  display: inline-block;
}
.logo h2 a::before {
  content: "";
  display: inline-block;
  width: 140px;
  height: 60px;
  background: url('../images/kovy-logo.png') center left / contain no-repeat;
  vertical-align: middle;
}

/* ---------- NAVIGATION COLORS ---------------------------- */
header nav > ul > li > a { color: var(--kovy-dark); }
header nav > ul > li > a:hover,
header nav > ul > li.current > a { color: var(--kovy-green); }

/* Vegan-Icon links-oben über dem AKTIVEN Menüpunkt.
   Pseudo auf <li> statt <a> — Baume hat <li> bereits
   "position: relative", sodass keine Override nötig ist. */
header nav > ul > li.current::before {
  content: "";
  position: absolute;
  width: 14px;
  height: 14px;
  top: -6px;
  left: -10px;
  background: url('../images/vegan_icon.svg') center center / contain no-repeat;
  pointer-events: none;
  z-index: 5;
}

/* ---------- HEADER LAYOUT: Logo links / Nav mittig / Social rechts
   Baume hatte margin-right:auto auf .logo, das alle anderen
   Elemente rechts zusammengedrückt hat. Wir nutzen
   absolute Positionierung für die mittige Nav, damit sie
   exakt in der Bildschirmmitte sitzt – unabhängig von der
   Breite des Logos und der Social-Icons. */
header .header-content {
  position: relative;
  justify-content: space-between !important;
}
header .header-content .logo {
  margin-right: 0 !important;
}
header nav {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  margin: 0 !important;
}
header .social-links {
  margin-left: 0 !important;
  gap: 18px;
  list-style: none;
  padding: 0;
}
/* nur auf großen Screens als Flex anzeigen — auf Mobile macht
   responsive.css display:none, und das soll wirken */
@media (min-width: 1367px) {
  header .social-links { display: flex; }
}

/* ---------- SOCIAL-ICONS HEADER -------------------------- */
header .social-links li a,
header .social-links li a i {
  color: var(--kovy-green) !important;
  transition: color 0.25s ease;
}
header .social-links li a:hover,
header .social-links li a:hover i {
  color: var(--kovy-dark) !important;
}

/* ---------- BUTTON OVERRIDES ----------------------------- */
.lnk-default {
  color: var(--kovy-green);
  border-color: var(--kovy-green);
}
.lnk-default:hover {
  background-color: var(--kovy-green);
  color: #fff;
}
.lnk-default.with-bg {
  background-color: var(--kovy-green) !important;
  color: #fff;
}
.lnk-default.with-bg:hover {
  background-color: var(--kovy-green-dark) !important;
}
.lnk-default.v2 {
  background-color: var(--kovy-green) !important;
  color: #fff;
}
.lnk-default.v2:hover {
  background-color: var(--kovy-green-dark) !important;
}
.sm-btn {
  color: var(--kovy-green);
  border-bottom: 2px solid var(--kovy-green);
}
.sm-btn:hover { color: var(--kovy-green-dark); }

/* ---------- HEADLINE COLORS ------------------------------ */
.title > h2,
.sec-title > h2,
.sec-title-v2 > h2,
h1, h2, h3 { color: var(--kovy-dark); }

.title > span,
.sec-title-v2 > span { color: var(--kovy-green); }
.sec-title > span { color: var(--kovy-green); }

/* ---------- ROTE BAUME-AKZENTE ENTFERNEN ---------------- */
/* Baume nutzt #fe043c als Akzentfarbe für:
   - .sec-title:before (50px-Strich unter Subline)
   - .sm-btn (kleiner Text-Button mit Unterstrich) */
.sec-title:before {
  background-color: var(--kovy-green) !important;
}
.sm-btn,
.sm-btn:hover {
  color: var(--kovy-green) !important;
}
.sm-btn:before {
  background-color: var(--kovy-green) !important;
}

/* ---------- BACKGROUNDS ---------------------------------- */
.bg1 { background-color: var(--kovy-light-bg) !important; background-image: none !important; }
.bg2 { background-color: var(--kovy-light-bg) !important; background-image: none !important; }
.bg3 {
  background-color: var(--kovy-dark) !important;
  background-image: none !important;
}
.bg4 { background-color: var(--kovy-light-bg) !important; background-image: none !important; }

/* ---------- FOOTER (Baume war rot) ----------------------- */
footer {
  background-color: var(--kovy-dark) !important;
}
.footer-content p, .footer-content p a { color: rgba(255,255,255,0.7); }
.footer-content .social-links li a { color: #fff; }
.footer-content .social-links li a:hover { color: var(--kovy-green); }

/* ---------- WIDGET-TITLES (Baume hatte sie rot #fe043c) -- */
.footer-widgets .widget-title,
.widget .widget-title,
.widget-title {
  color: var(--kovy-dark) !important;
}

/* ---------- TEXTAREA: vernünftige Höhe ------------------- */
.form-field textarea {
  width: 100%;
  min-height: 160px !important;
  height: auto !important;
  background-color: #fff !important;
  border: 2px solid var(--kovy-light-tint) !important;
  color: var(--kovy-dark) !important;
  padding: 18px 22px !important;
  border-radius: 8px;
  font-size: 15px;
  resize: vertical;
  font-family: inherit;
}
.form-field textarea:focus { border-color: var(--kovy-green) !important; outline: none; }

/* ---------- LOADING-MASK: Safety-Hide --------------------
   Falls JS irgendwo einen Fehler hat, soll die Maske
   trotzdem nach max. 3s verschwinden. */
#mask {
  animation: kovyMaskFade 3s forwards;
}
@keyframes kovyMaskFade {
  0%, 90% { opacity: 1; visibility: visible; }
  100%    { opacity: 0; visibility: hidden; }
}

/* ---------- BANNER-TEXT GROSS UND PRÄGNANT --------------- */
.banner-text > h2 em {
  color: var(--kovy-green);
  font-style: normal;
}
.banner-text > p {
  color: #6b7a6b;
}

/* ---------- FOOD-ITEM (Stats umfunktioniert) ------------- */
.food-item { background-color: var(--kovy-green); }
.food-item:hover { background-color: var(--kovy-green-dark); }

/* ---------- FORM (Reservation-Form für Franchise) -------- */
.form-field input,
.form-field textarea,
.form-field select {
  border: 2px solid var(--kovy-light-tint) !important;
  background: #fff;
  color: var(--kovy-dark);
}
.form-field input:focus,
.form-field textarea:focus { border-color: var(--kovy-green) !important; outline: none; }
.form-submit button {
  background-color: var(--kovy-green) !important;
  color: #fff;
}
.form-submit button:hover { background-color: var(--kovy-green-dark) !important; }


/* ============================================================
   NEUE KOVY-SEKTIONEN (gibt es so in Baume nicht)
   ============================================================ */

/* ---------- HERO BANNER STATS ---------------------------- */
.kovy-banner-stats {
  display: flex;
  border-top: 1px solid var(--kovy-light-tint);
  padding-top: 28px;
  margin-top: 40px;
  max-width: 540px;
}
.kovy-banner-stats .kbs {
  flex: 1;
  padding-right: 24px;
  margin-right: 24px;
  border-right: 1px solid var(--kovy-light-tint);
}
.kovy-banner-stats .kbs:last-child { border-right: none; margin-right: 0; padding-right: 0; }
.kovy-banner-stats .kbs-num {
  display: block;
  font-size: 28px;
  font-weight: 800;
  color: var(--kovy-green);
  line-height: 1;
  margin-bottom: 4px;
}
.kovy-banner-stats .kbs-label {
  font-size: 11px;
  color: #95a195;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

/* ---------- MARKTCHANCEN STAT CARDS ---------------------- */
.kovy-stats-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}
.kovy-stat-card {
  background: #fff;
  border: 1px solid var(--kovy-light-tint);
  border-radius: 14px;
  padding: 45px 30px;
  text-align: center;
  transition: transform 0.3s, box-shadow 0.3s;
}
.kovy-stat-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 50px rgba(31,55,39,0.10);
}
.kovy-stat-icon {
  width: 78px; height: 78px;
  background: url('../images/vegan_icon.svg') center center / contain no-repeat;
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 26px;
  margin: 0 auto 22px;
  /* leichte Schatten + Skalierung beim Hover des Cards */
  filter: drop-shadow(0 6px 14px rgba(31,55,39,0.12));
  transition: transform 0.3s ease;
}
.kovy-stat-card:hover .kovy-stat-icon {
  transform: scale(1.08);
}
.kovy-stat-num {
  font-size: 56px;
  font-weight: 800;
  color: var(--kovy-green);
  line-height: 1;
  margin-bottom: 10px;
  letter-spacing: -2px;
}
.kovy-stat-title {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--kovy-dark);
  margin-bottom: 14px;
}
.kovy-stat-desc {
  font-size: 14px;
  color: #7a857a;
  line-height: 1.75;
  margin: 0;
}

/* ---------- "WAS DU BEKOMMST" (auf .bg3 dunkel) ---------- */
.kovy-benefits-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}
.kovy-benefit {
  padding: 35px 28px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(131,176,90,0.18);
  border-radius: 12px;
  transition: all 0.3s;
}
.kovy-benefit:hover {
  background: rgba(131,176,90,0.10);
  border-color: var(--kovy-green);
  transform: translateY(-5px);
}
.kovy-benefit-icon {
  width: 54px; height: 54px;
  border-radius: 50%;
  background: var(--kovy-green);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px;
  margin-bottom: 20px;
}
.kovy-benefit h3 {
  color: #fff !important;
  font-size: 17px !important;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 14px;
}
.kovy-benefit p {
  font-size: 14px;
  color: rgba(255,255,255,0.65);
  line-height: 1.75;
  margin: 0;
}
/* override sec-title colors on dark section */
.kovy-on-dark .title > h2,
.kovy-on-dark .sec-title > h2 { color: #fff !important; }
.kovy-on-dark .title > p { color: rgba(255,255,255,0.7); }

/* ---------- INVESTMENT CARDS ----------------------------- */
.kovy-invest-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}
.kovy-invest-card {
  text-align: center;
  padding: 55px 30px 40px;
  border: 2px solid var(--kovy-light-tint);
  border-radius: 14px;
  position: relative;
  background: #fff;
  transition: all 0.3s;
}
.kovy-invest-card.featured {
  border-color: var(--kovy-green);
  background: var(--kovy-light-bg);
  transform: scale(1.04);
}
.kovy-invest-card:hover {
  border-color: var(--kovy-green);
  box-shadow: 0 20px 50px rgba(31,55,39,0.10);
}
.kovy-invest-badge {
  position: absolute;
  top: -14px; left: 50%;
  transform: translateX(-50%);
  background: var(--kovy-green);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 6px 18px;
  border-radius: 20px;
}
.kovy-invest-label {
  font-size: 10px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #95a195;
  margin-bottom: 14px;
}
.kovy-invest-value {
  font-size: 50px;
  font-weight: 800;
  color: var(--kovy-dark);
  line-height: 1;
  letter-spacing: -2px;
  margin-bottom: 8px;
}
.kovy-invest-value .unit {
  font-size: 22px;
  color: var(--kovy-green);
  font-weight: 400;
}
.kovy-invest-card h3 {
  font-size: 14px !important;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin: 18px 0 12px;
  border-top: 1px solid var(--kovy-light-tint);
  padding-top: 18px;
}
.kovy-invest-card p {
  font-size: 13px;
  color: #7a857a;
  line-height: 1.75;
  margin: 0;
}

/* ---------- PROZESS (4 Schritte) ------------------------- */
.kovy-process-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
  position: relative;
}
.kovy-process-grid::before {
  content: '';
  position: absolute;
  top: 45px; left: 12%; right: 12%;
  height: 2px;
  background: linear-gradient(90deg, var(--kovy-green), #b8d48a);
  z-index: 0;
}
.kovy-process-step {
  text-align: center;
  position: relative;
  z-index: 1;
  padding: 0 12px;
}
.kovy-process-circle {
  width: 92px; height: 92px;
  border-radius: 50%;
  background: var(--kovy-green);
  color: #fff;
  font-size: 34px;
  font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 24px;
  box-shadow: 0 10px 25px rgba(131,176,90,0.35);
  border: 5px solid #fff;
  transition: transform 0.3s;
}
.kovy-process-step:hover .kovy-process-circle { transform: scale(1.1); }
.kovy-process-step h3 {
  font-size: 14px !important;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 12px;
}
.kovy-process-step p {
  font-size: 13px;
  color: #7a857a;
  line-height: 1.75;
  margin: 0;
}

/* ---------- FAQ ACCORDION -------------------------------- */
.kovy-faq { max-width: 820px; margin: 0 auto; }
.kovy-faq-item { border-bottom: 1px solid var(--kovy-light-tint); }
.kovy-faq-q {
  width: 100%;
  background: none;
  border: none;
  text-align: left;
  padding: 24px 50px 24px 0;
  font-size: 17px;
  font-weight: 700;
  color: var(--kovy-dark);
  cursor: pointer;
  position: relative;
  font-family: inherit;
  transition: color 0.25s;
}
.kovy-faq-q:hover, .kovy-faq-q.open { color: var(--kovy-green); }
.kovy-faq-q::after {
  content: '+';
  position: absolute;
  right: 0; top: 50%;
  transform: translateY(-50%);
  font-size: 32px;
  font-weight: 300;
  color: var(--kovy-green);
  line-height: 1;
  transition: transform 0.3s;
}
.kovy-faq-q.open::after { content: '−'; }
.kovy-faq-a {
  display: none;
  padding: 0 0 26px;
  font-size: 15px;
  color: #6b7a6b;
  line-height: 1.85;
}

/* ---------- FAQ auf dunklem Hintergrund (.kovy-on-dark) -- */
.kovy-on-dark .kovy-faq-item {
  border-bottom-color: rgba(255,255,255,0.12);
}
.kovy-on-dark .kovy-faq-q {
  color: #fff;
}
.kovy-on-dark .kovy-faq-q:hover,
.kovy-on-dark .kovy-faq-q.open {
  color: var(--kovy-green);
}
.kovy-on-dark .kovy-faq-a {
  color: rgba(255,255,255,0.72);
}

/* ---------- HERO BANNER -------------------------------- */
/* Bild im Banner-Thumb sauber anzeigen */
.banner-thumb img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* Chili-Dekoration links oben (Baume nutzt Platzhalter, wir überschreiben mit lokaler Datei) */
.main-banner:before {
  background-image: url('../images/chili.png') !important;
  background-size: contain !important;
}

/* ---------- BENEFIT-LIST IM KONTAKT-FORMULAR ------------- */
.kovy-benefit-list {
  list-style: none;
  padding: 0;
  margin: 0 0 30px;
}
.kovy-benefit-list li {
  padding: 12px 0;
  border-bottom: 1px solid var(--kovy-light-tint);
  font-size: 14px;
  color: #4a554a;
}
.kovy-benefit-list li i {
  color: var(--kovy-green);
  margin-right: 10px;
}

/* ---------- TESTIMONIAL-SLIDE TWEAKS --------------------- */
.testi-slide h3 { color: var(--kovy-dark); }
.testi-slide h4 { color: var(--kovy-green); }

/* ---------- GALLERY: Original Baume-Stil mit Lupen-Icon -
   Bild absolut positioniert (kein Layout-Flow) — verhindert
   das "Hüpfen" vor dem Zoom komplett. Explizite Werte
   für transform-origin, margin und top/left/right/bottom
   verhindern Sub-Pixel-Rendering-Sprünge. */
.gallery-item {
  position: relative !important;
  display: block;
  overflow: hidden !important;
  width: 100%;
  aspect-ratio: 1 / 1;
  margin: 0;
  background: var(--kovy-light-bg);
  font-size: 0;       /* kein inline-Whitespace */
  line-height: 0;
  cursor: pointer;    /* zeigt: hier kann man klicken */
  transform: translateZ(0); /* eigener GPU-Layer */
}
/* Bild absolut positioniert, füllt komplett, transformiert sauber */
.gallery-item > img {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: top !important;
  object-fit: cover !important;
  display: block;
  transform: scale(1) !important;
  transform-origin: center center !important;
  transition: transform 0.6s ease !important;
  will-change: transform;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.gallery-item:hover > img {
  transform: scale(1.08) !important;
}
/* Dunkler Overlay + Lupen-Icon — Klicks gehen durch zum Parent */
.gallery-item .zoom-img {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
  background-color: rgba(31, 55, 39, 0.55) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s ease, visibility 0.4s ease;
  z-index: 2;
  pointer-events: none; /* Klicks gehen durch zum .gallery-item */
}
.gallery-item .zoom-img i {
  color: #fff;
  font-size: 22px;
  width: 56px;
  height: 56px;
  border: 2px solid #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.35s ease, background 0.35s ease, border-color 0.35s ease;
  opacity: 0;
  line-height: 1;
}
.gallery-item:hover .zoom-img {
  opacity: 1 !important;
  visibility: visible !important;
}
.gallery-item:hover .zoom-img i {
  opacity: 1;
  background: var(--kovy-green);
  border-color: var(--kovy-green);
}

/* ---------- UTILITY: bündig anschließen ohne Abstand -----
   Entfernt Padding-Bottom der Section UND Margin-Bottom
   von .masonary darin, damit die Galerie direkt an die
   nächste Section anschließt. */
.block.kovy-flush-bottom {
  padding-bottom: 0 !important;
}
.block.kovy-flush-bottom .masonary {
  margin-bottom: 0 !important;
}

/* ---------- lightGallery: Brand-Anpassungen ---------------
   Lightbox-Hintergrund, Buttons und aktive Thumbnails in
   Kovy-Farbwelt. */
.lg-backdrop {
  background-color: rgba(15, 26, 19, 0.97) !important;
}
.lg-toolbar .lg-icon:hover,
.lg-actions .lg-next:hover,
.lg-actions .lg-prev:hover,
.lg-outer .lg-thumb-item.active,
.lg-outer .lg-thumb-item:hover {
  border-color: var(--kovy-green) !important;
  color: var(--kovy-green) !important;
}
.lg-progress-bar .lg-progress {
  background-color: var(--kovy-green) !important;
}
.lg-sub-html h4 {
  color: var(--kovy-green) !important;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-size: 14px;
}

/* ---------- EIGENES TESTIMONIAL-CAROUSEL (horizontal) ----
   Slick-Stil: Pfeile links/rechts vom Slide, Track translateX.
   Robust für file://-Protokoll ohne Slick-Library. */
.kovy-testimonial-carousel {
  position: relative;
  max-width: 1080px;
  margin: 0 auto;
  padding: 0 80px;
}
.kovy-testi-viewport {
  overflow: hidden;
}
.kovy-testi-track {
  display: flex;
  transition: transform 0.55s ease;
  will-change: transform;
}
.kovy-testi-track .testi-slide {
  flex: 0 0 100%;
  box-sizing: border-box;
  background-color: #fff;
  padding: 62px 80px 65px;
  text-align: center;
  border-radius: 8px;
  box-shadow: 0 20px 50px rgba(0,0,0,0.15);
}
.kovy-testi-track .testi-slide h3 {
  font-size: 28px;
  font-weight: 700;
  color: var(--kovy-dark);
  margin-bottom: 20px;
}
.kovy-testi-track .testi-slide p {
  font-size: 16px;
  color: #6b7a6b;
  line-height: 1.8;
  margin-bottom: 28px;
  font-style: italic;
}
.kovy-testi-track .testi-slide h4 {
  color: var(--kovy-green);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.kovy-testi-track .testi-slide span {
  color: #95a195;
  font-size: 13px;
}

/* Pfeile links/rechts wie Slick */
.kovy-testi-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: rgba(255,255,255,0.08);
  border: 2px solid rgba(255,255,255,0.25);
  color: #fff;
  font-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.25s;
}
.kovy-testi-arrow:hover {
  background: var(--kovy-green);
  border-color: var(--kovy-green);
  color: #fff;
}
.kovy-testi-prev { left: 15px; }
.kovy-testi-next { right: 15px; }

/* Dots unten */
.kovy-testi-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 35px;
}
.kovy-testi-dot {
  width: 10px; height: 10px;
  border-radius: 50%;
  background: rgba(255,255,255,0.25);
  border: none;
  cursor: pointer;
  padding: 0;
  transition: all 0.25s;
}
.kovy-testi-dot.active,
.kovy-testi-dot:hover {
  background: var(--kovy-green);
  transform: scale(1.3);
}

@media (max-width: 768px) {
  .kovy-testimonial-carousel { padding: 0 60px; }
  .kovy-testi-track .testi-slide { padding: 40px 25px 45px; }
  .kovy-testi-track .testi-slide h3 { font-size: 22px; }
  .kovy-testi-prev { left: 5px; }
  .kovy-testi-next { right: 5px; }
}

/* ---------- INVESTMENT-YOUTUBE-VIDEO --------------------- */
.kovy-invest-video {
  max-width: 880px;
  margin: 0 auto 70px;
}
.kovy-video-wrap {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
  overflow: hidden;
  border-radius: 16px;
  box-shadow: 0 30px 70px rgba(31,55,39,0.22),
              0 0 0 6px rgba(131,176,90,0.15);
  border: 4px solid var(--kovy-green);
  background: var(--kovy-dark);
  cursor: pointer;
}
.kovy-video-wrap iframe {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  border: none;
}

/* Vorschaubild (Poster) */
.kovy-video-poster {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease, filter 0.5s ease;
}
.kovy-video-wrap:hover .kovy-video-poster {
  transform: scale(1.04);
  filter: brightness(0.85);
}

/* Play-Button overlay */
.kovy-video-play {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 92px; height: 92px;
  border-radius: 50%;
  background: var(--kovy-green);
  border: 4px solid #fff;
  color: #fff;
  font-size: 30px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-left: 6px;       /* Play-Dreieck optisch zentrieren */
  box-shadow: 0 10px 30px rgba(0,0,0,0.35),
              0 0 0 0 rgba(131,176,90,0.5);
  animation: kovyPulse 2.2s ease-out infinite;
  transition: transform 0.25s ease, background 0.25s ease;
  z-index: 2;
}
.kovy-video-wrap:hover .kovy-video-play {
  background: var(--kovy-green-dark);
  transform: translate(-50%, -50%) scale(1.1);
  animation-play-state: paused;
}
@keyframes kovyPulse {
  0%   { box-shadow: 0 10px 30px rgba(0,0,0,0.35), 0 0 0 0    rgba(131,176,90,0.55); }
  70%  { box-shadow: 0 10px 30px rgba(0,0,0,0.35), 0 0 0 22px rgba(131,176,90,0); }
  100% { box-shadow: 0 10px 30px rgba(0,0,0,0.35), 0 0 0 0    rgba(131,176,90,0); }
}

/* Aktivierter Zustand: Iframe statt Bild */
.kovy-video-wrap.kovy-video-active .kovy-video-poster,
.kovy-video-wrap.kovy-video-active .kovy-video-play {
  display: none;
}

.kovy-video-caption {
  text-align: center;
  color: var(--kovy-green);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-top: 18px;
}
.kovy-video-caption i { margin-right: 6px; }

@media (max-width: 576px) {
  .kovy-video-play { width: 70px; height: 70px; font-size: 22px; }
}


/* ============================================================
   RESPONSIVE
   ============================================================ */
@media only screen and (max-width: 991px) {
  .kovy-stats-grid,
  .kovy-benefits-grid,
  .kovy-invest-grid { grid-template-columns: 1fr; }
  .kovy-process-grid { grid-template-columns: repeat(2, 1fr); gap: 40px; }
  .kovy-process-grid::before { display: none; }
  .kovy-banner-stats { flex-wrap: wrap; }
}
@media only screen and (max-width: 576px) {
  .kovy-process-grid { grid-template-columns: 1fr; }
  .kovy-banner-stats .kbs {
    flex: 0 0 100%;
    border-right: none;
    margin-right: 0;
    padding-right: 0;
    margin-bottom: 18px;
  }
}


/* ============================================================
   TYPOGRAPHY NORMALIZATION
   Mindestschriftgröße 17 px für Body-Text. Ausnahmen:
   Footer, Form-Labels/Placeholder und Pflichtfeld-Hinweise
   dürfen kleiner sein (Sondertexte).
   ============================================================ */

/* Globale Body-Größe (überschreibt Baumes "p { font-size: 15px }") */
body, p {
  font-size: 17px !important;
  line-height: 1.7 !important;
}

/* Baume-Spans (Eyebrows über Headlines) — Standard 13.5 / 14 px */
.title > span,
.sec-title > span,
.sec-title-v2 > span {
  font-size: 17px !important;
  line-height: 1.6 !important;
}

/* --- HERO-Banner --- */
.banner-text > p { font-size: 17px !important; line-height: 1.7 !important; }
.kovy-banner-stats .kbs-label { font-size: 17px; line-height: 1.4; }

/* --- Marktchancen-Karten --- */
.kovy-stat-title { font-size: 17px; }
.kovy-stat-desc  { font-size: 17px; line-height: 1.7; }

/* --- "Was du bekommst" Cards --- */
.kovy-benefit p  { font-size: 17px; line-height: 1.7; }

/* --- Prozess (4 Schritte) --- */
.kovy-process-step h3 { font-size: 17px !important; }
.kovy-process-step p  { font-size: 17px; line-height: 1.7; }

/* --- FAQ --- */
.kovy-faq-q { font-size: 17px !important; }
.kovy-faq-a { font-size: 17px !important; line-height: 1.8 !important; }

/* --- Testimonials --- */
.kovy-testi-track .testi-slide p    { font-size: 17px; line-height: 1.8; }
.kovy-testi-track .testi-slide h4   { font-size: 17px; }
.kovy-testi-track .testi-slide span { font-size: 17px; }

/* --- Video-Caption --- */
.kovy-video-caption   { font-size: 17px; }

/* --- About-Text --- */
.about-text p { font-size: 17px !important; line-height: 1.7 !important; }

/* --- Mobile-Menü-Links --- */
.responsive-mobile-menu ul li a { font-size: 17px !important; }

/* --- Textarea-Eingabe --- */
.form-field textarea { font-size: 17px !important; }


/* ============================================================
   SONDERTEXTE — bewusst kleiner als 17px
   ============================================================ */

/* Footer-Widgets (Adresse, Erreichbarkeit, Kontakt) */
.footer-widgets .widget p,
.footer-widgets .widget span {
  font-size: 15px !important;
  line-height: 1.7;
}

/* Footer-Copyright + Links */
footer .footer-content p,
footer .footer-content p a {
  font-size: 14px !important;
}

/* Form-Inputs (Baume nutzt 16px für die Eingabe) */
.form-field input,
.form-field select,
.form-field input::placeholder,
.form-field textarea::placeholder {
  font-size: 16px !important;
}

/* Pflichtfeld-Hinweis unter Form */
.reserve-form ~ p,
.reserve-form + p,
form p[style*="color:#95a195"] {
  font-size: 14px !important;
}

@media only screen and (max-width: 1366px) {

  /* Hamburger nicht direkt am Rand kleben */
  header .container-fluid,
  header.sticky .container-fluid {
    padding: 0 25px !important;
  }
  header .menu-btn {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Hamburger-Striche in Kovy-Dunkelgrün statt weiß */
  header .menu-btn > span {
    background-color: var(--kovy-dark) !important;
  }
  header.sticky .menu-btn > span {
    background-color: var(--kovy-dark) !important;
  }

  /* Header-Layout zurücksetzen (Nav ist eh display:none) */
  header nav { position: static; transform: none; }
  header .header-content { justify-content: space-between !important; }

  /* Sticky-Header gleiche Breite wie normaler Header
     (Baume's "position:fixed; left:0" ohne Breitenangabe kann
     den Header rechts ein paar Pixel verschieben — wir fixieren
     die Breite explizit) */
  header.sticky {
    width: 100% !important;
    right: 0 !important;
    box-sizing: border-box;
  }
}

/* Scrollbar-Platz immer reservieren — verhindert horizontalen
   Sprung beim Wechsel zwischen Section mit/ohne Scrollbar */
html {
  scrollbar-gutter: stable;
}

/* ---------- Mobile Aufklapp-Menü: Kovy-Farben + Layout ---- */
.responsive-mobile-menu {
  background-color: var(--kovy-dark) !important;
  display: flex;
  flex-direction: column;
}

/* Padding-Top damit der erste Menüpunkt nicht hinter dem Header verschwindet */
.responsive-mobile-menu > ul:first-child {
  padding-top: 90px;
  margin: 0;
  float: none;
}

.responsive-mobile-menu ul li a {
  color: #fff !important;
  border-bottom: 1px solid rgba(255,255,255,0.10) !important;
  transition: color 0.2s ease, background 0.2s ease;
}
.responsive-mobile-menu ul li a:hover,
.responsive-mobile-menu ul li.active > a {
  color: var(--kovy-green) !important;
  background: rgba(255,255,255,0.04);
}
.responsive-mobile-menu ul li a:before {
  color: #fff;
}

/* Social-Icons am unteren Rand des Mobile-Menüs */
.kovy-mobile-social {
  list-style: none;
  margin: auto 0 30px;
  padding: 25px 25px 0;
  float: none !important;
  width: 100% !important;
  display: flex !important;
  justify-content: center;
  gap: 22px;
  border-top: 1px solid rgba(255,255,255,0.10);
}
.kovy-mobile-social li {
  float: none !important;
  width: auto !important;
}
.kovy-mobile-social li a {
  border: none !important;
  padding: 0 !important;
  color: #fff !important;
  font-size: 18px;
  width: 42px;
  height: 42px;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,0.08);
  transition: all 0.25s ease;
}
.kovy-mobile-social li a:before { display: none !important; }
.kovy-mobile-social li a:hover {
  background: var(--kovy-green) !important;
  color: #fff !important;
  transform: translateY(-3px);
}

/* ---------- Banner-Bild auf Mobile zeigen ---------------- */
@media only screen and (max-width: 991px) {
  .main-banner .banner-content {
    display: flex;
    flex-direction: column-reverse; /* Bild oben, Text unten */
  }
  .banner-thumb {
    display: block !important;
    text-align: center;
    margin: 0 0 35px;
    width: 100%;
  }
  .banner-thumb img {
    max-width: 78%;
    height: auto;
    margin: 0 auto;
  }
}
@media only screen and (max-width: 576px) {
  .banner-thumb img { max-width: 92%; }
}