:root {
  --font-body: 'Montserrat', system-ui, sans-serif;
  --font-heading: 'Playfair Display', 'Playfair Fallback', Georgia, serif;
  --font-head: var(--font-heading);
  --ev-polish-ink: #2d2926;
  --ev-polish-dark: #1a1614;
  --ev-polish-muted: #6b635d;
  --ev-polish-gold: #c1873a;
  --ev-polish-gold-text: #7a4f1e;
  --ev-polish-gold-soft: #efd2a7;
  --ev-polish-cream: #faf6f1;
  --ev-polish-line: rgba(45, 41, 38, .10);
  --ev-info-band-bg: linear-gradient(90deg, #2d2926 0%, #332e2a 58%, #3a342f 100%);
  --ev-polish-ease: cubic-bezier(.16, 1, .3, 1);
  --ev-polish-shadow: 0 24px 64px -34px rgba(45, 31, 19, .34);
  --ev-surface-page: #fffaf6;
  --ev-surface-warm: #fff8f5;
  --ev-surface-cream: #faf6f1;
  --ev-surface-muted: #f6eee5;
  --ev-surface-panel: #ffffff;
  --ev-surface-dark: #2d2926;
  --ev-button-radius: 999px;
  --ev-button-height: 52px;
  --ev-button-height-sm: 44px;
  --ev-button-pad-x: 28px;
  --ev-button-shadow: 0 16px 36px -22px rgba(26, 22, 20, .58);
  --ev-button-shadow-hover: 0 20px 42px -22px rgba(26, 22, 20, .64);
  --ev-button-font-size: .96rem;
  --ev-button-font-weight: 700;
  --ev-button-letter-spacing: .02em;
  --ev-button-primary-bg: #efd2a7;
  --ev-button-primary-fg: #1a1614;
  --ev-button-secondary-bg: transparent;
  --ev-button-secondary-fg: #2d2926;
  --ev-button-secondary-border: rgba(45, 41, 38, .26);
}

*, *::before, *::after { box-sizing: border-box; }
html {
  scroll-behavior: smooth;
  overflow-x: clip;
  background: var(--ev-polish-dark);
}
body {
  margin: 0;
  min-width: 320px;
  overflow-x: clip;
  color: var(--ev-polish-ink);
  font-family: var(--font-body);
  background: var(--ev-surface-page);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
body ::selection { background: var(--ev-polish-gold-soft); color: var(--ev-polish-dark); }
body h1,
body h2,
body h3 { text-wrap: balance; }
body p { text-wrap: pretty; }
body img { color: transparent; }

.ev-skip-link {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 100000;
  padding: 12px 18px;
  border-radius: 40px;
  background: #fff;
  color: var(--ev-polish-dark);
  font-weight: 700;
  text-decoration: none;
  transform: translateY(-160%);
  transition: transform .2s ease;
}
.ev-skip-link:focus { transform: translateY(0); }

body :where(a, button, input, textarea, select, [tabindex]):focus-visible {
  outline: 3px solid var(--ev-polish-gold-soft);
  outline-offset: 4px;
  border-radius: 5px;
}

/* Design-System-Normalisierung:
   Die Homepage hatte historisch mehrere fast gleiche Off-Whites und mehrere
   eigenständige Button-Sprachen. Diese Ebene fasst sie in wenige semantische
   Varianten zusammen, ohne Bildwelt, CI-Farben oder Layout zu ersetzen. */
:where(.ev-pg, .ev-lb-section, .ev-steps-section, .ev-blog-teaser-section, #ev-cta-dock) {
  background: var(--ev-surface-page) !important;
}
:where(#anw-root, .ev-rr) {
  background: var(--ev-surface-warm) !important;
}
.ev-marquee-wrap {
  background: var(--ev-surface-cream) !important;
}

/* ── Seitenabschluss: monoton abwaerts, nie wieder heller ──
   Vorher lief die Folge Papier(251) -> Weiss(255) -> Hell(246) -> Fuss(23):
   ein schmaler heller Streifen unmittelbar vor der dunklen Flaeche. Genau der
   sticht ins Auge. Jetzt Papier -> Sand -> Fuss, ohne Aufhellung dazwischen.
   Trennlinien entfallen: der Farbwechsel trennt bereits. */
.ev-newsletter {
  /* Flaechig Sand, KEIN Verlauf: der Verlauf startete oben mit Papier und liess
     den Newsletter mit dem Papier-Band darueber verschmelzen — der Papier/Sand-
     Wechsel, den die Seite sonst durchhaelt, brach genau hier ab. */
  background: #f5efe7 !important;
  border-top: 0 !important;
}
/* Das Kleingedruckte ist Teil des Fussbereichs — auch farblich. */
.ev-claim-notes {
  background: #1a1614 !important;
  border-top: 0 !important;
}
.ev-slider-section {
  background: var(--ev-surface-muted) !important;
}
:where(.ev-pg-card, .ev-blog-card, .ev-qv-modal, .ev-cart-item, .ev-cart-upsell-card) {
  background: var(--ev-surface-panel) !important;
  border-color: var(--ev-polish-line) !important;
}

/* CTA-Hierarchie
   1. .ev-cta--primary   = eine einzige Conversion-Sprache, CI-Gold auf jeder Flaeche
   2. .ev-cta--secondary = gleiches Mass, ruhige Kontur
   3. .ev-cta--text      = Bereichswechsel ohne Button-Flaeche
   Store-Badges, Tabs, Hotspots und Icon-Controls sind bewusst keine CTAs. */
:where(
  .ev-cta:not(.ev-cta--text):not(.ev-cta--store),
  .ch-btn,
  .ev-rr-btn,
  .ev-sticky-cta,
  .ev-newsletter-submit,
  .ev-qv-atc,
  .ev-qv-details,
  .ev-cart-checkout,
  .ev-cart-empty a,
  .ev-promo-modal-cta
) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  box-sizing: border-box !important;
  min-height: var(--ev-button-height) !important;
  padding: 0 var(--ev-button-pad-x) !important;
  border-radius: var(--ev-button-radius) !important;
  border: 1px solid transparent !important;
  font-family: var(--font-body) !important;
  font-size: var(--ev-button-font-size) !important;
  font-weight: var(--ev-button-font-weight) !important;
  line-height: 1 !important;
  letter-spacing: var(--ev-button-letter-spacing) !important;
  text-transform: none !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  cursor: pointer !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  box-shadow: var(--ev-button-shadow) !important;
  transition:
    transform .34s var(--ev-polish-ease),
    background-color .34s var(--ev-polish-ease),
    color .34s var(--ev-polish-ease),
    border-color .34s var(--ev-polish-ease),
    box-shadow .34s var(--ev-polish-ease) !important;
}
:where(
  .ev-cta--primary,
  .ch-btn,
  .ev-rr-btn,
  .ev-sticky-cta,
  .ev-newsletter-submit,
  .ev-qv-atc,
  .ev-cart-checkout,
  .ev-cart-empty a,
  .ev-promo-modal-cta
) {
  color: var(--ev-button-primary-fg) !important;
  background: var(--ev-button-primary-bg) !important;
  border-color: rgba(26, 22, 20, .16) !important;
}
:where(.ev-cta--secondary, .ev-qv-details) {
  color: var(--ev-button-secondary-fg) !important;
  background: var(--ev-button-secondary-bg) !important;
  border-color: var(--ev-button-secondary-border) !important;
  box-shadow: none !important;
}
:where(
  .ev-cta--primary,
  .ch-btn,
  .ev-rr-btn,
  .ev-sticky-cta,
  .ev-newsletter-submit,
  .ev-qv-atc,
  .ev-cart-checkout,
  .ev-cart-empty a,
  .ev-promo-modal-cta
):hover {
  color: #fff8f5 !important;
  background: var(--ev-polish-dark) !important;
  border-color: var(--ev-polish-dark) !important;
  box-shadow: var(--ev-button-shadow-hover) !important;
  transform: translateY(-2px) !important;
}
:where(.ev-cta--secondary, .ev-qv-details):hover {
  color: var(--ev-polish-dark) !important;
  background: var(--ev-surface-cream) !important;
  border-color: var(--ev-polish-dark) !important;
  box-shadow: none !important;
  transform: translateY(-2px) !important;
}

:where(.ev-cta--nav)::after {
  content: "";
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M13 5l7 7-7 7' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12h14M13 5l7 7-7 7' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  transition: transform .34s var(--ev-polish-ease);
}
:where(.ev-cta--nav):hover::after { transform: translateX(4px); }

:where(.ev-cta--text, .ev-pg-header > a, .ev-lb-head > a, .ev-blog-teaser-header > a) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  min-height: var(--ev-button-height-sm) !important;
  padding: 0 2px !important;
  border-radius: var(--ev-button-radius) !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--ev-polish-gold-text) !important;
  font-family: var(--font-body) !important;
  font-size: var(--ev-button-font-size) !important;
  font-weight: var(--ev-button-font-weight) !important;
  line-height: 1 !important;
  letter-spacing: .01em !important;
  text-transform: none !important;
  white-space: nowrap !important;
  box-shadow: none !important;
  text-decoration: none !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 5px !important;
}
:where(.ev-cta--text, .ev-pg-header > a, .ev-lb-head > a, .ev-blog-teaser-header > a):hover {
  color: var(--ev-polish-dark) !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(193, 135, 58, .45) !important;
  transform: none !important;
}

.ev-slider-tab {
  min-height: var(--ev-button-height-sm) !important;
  padding: 0 18px !important;
  border-radius: var(--ev-button-radius) !important;
  color: var(--ev-polish-ink) !important;
  background: var(--ev-surface-panel) !important;
  border: 1px solid var(--ev-polish-line) !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}
.ev-slider-tab--active {
  color: #fff8f5 !important;
  background: var(--ev-polish-dark) !important;
  border-color: var(--ev-polish-dark) !important;
}

:where(.ev-pg-card-qv, .ev-qv-close, .ev-drawer-close, .ev-cart-item-delete, .icon-btn, #send-btn) {
  min-width: 44px !important;
  min-height: 44px !important;
  border-radius: 999px !important;
}
.ev-app-btn {
  min-height: 56px !important;
  padding: 0 24px !important;
  border-radius: var(--ev-button-radius) !important;
  font-family: var(--font-body) !important;
  box-shadow: none !important;
}
.ev-app-btn[aria-disabled="true"] {
  cursor: default !important;
  opacity: .82;
}
.ev-app-btn[aria-disabled="true"]:hover {
  transform: none !important;
  background: rgba(255,255,255,.12) !important;
  border-color: rgba(255,255,255,.35) !important;
}
.ev-cookie-btn {
  min-height: 48px !important;
  padding: 0 24px !important;
  border-radius: var(--ev-button-radius) !important;
  font-weight: 700 !important;
}

/* Full-bleed-Sektionen nicht mit 100vw gegen die Scrollbar rechnen lassen.
   Das beseitigt feine seitliche Drift-Kanten und hält die Background-Bänder
   bündig zur Seite. */
:where(#ev-chero, .ev-trust-bar, .ev-flow, .ev-app-cta) {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Offcanvas-Container bleiben modal animiert, dürfen geschlossen aber keine
   unsichtbare Seitenbreite erzeugen. */
#chatbot-overlay,
.ev-cart-overlay {
  overflow: clip !important;
}

/* Header: gleiche Sprache, sauberer im Übergang und wärmer auf Mobilgeräten. */
.sv-header-in { max-width: 1320px; min-height: 74px; }
.sv-header.scrolled {
  background: rgba(255, 250, 246, .88);
  border-bottom: 1px solid rgba(45, 41, 38, .06);
  box-shadow: 0 18px 48px -38px rgba(45, 31, 19, .58);
}
body.sv-menu-active { overflow: hidden !important; }
body.sv-menu-active .sv-header {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
body.sv-menu-active .sv-header-in { position: relative; z-index: 100; }
body.sv-menu-active .sv-menu {
  position: relative;
  z-index: 3;
  color: #fff !important;
}
body.sv-menu-active .sv-logo-l { display: block !important; }
body.sv-menu-active .sv-logo-d { display: none !important; }
body.sv-menu-active .ev-sticky-cta { opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; }
.sv-header.scrolled .sv-search-close:hover { color: var(--ev-polish-gold); }
.sv-header.scrolled .sv-menu { color: var(--ev-polish-ink); }
.sv-nav a,
.sv-ddbtn,
.sv-ico { transition-duration: .28s; transition-timing-function: var(--ev-polish-ease); }

/* Bestehende Formen werden vereinheitlicht, ohne Layout oder CI auszutauschen. */
:where(.ev-pg-lifestyle-banner, .ev-rr-frame, .ev-slider-stage, .ev-lb-item, .ev-blog-teaser-card) {
  box-shadow: var(--ev-polish-shadow);
}
:where(.ev-cta, .ch-btn, .ev-rr-btn, .ev-sticky-cta, .ev-app-banner-cta a, .ev-qv-atc, .ev-cart-checkout) {
  transition-property: transform, background-color, color, border-color, box-shadow !important;
  transition-duration: .34s !important;
  transition-timing-function: var(--ev-polish-ease) !important;
}
:where(.ev-cta, .ch-btn, .ev-rr-btn, .ev-sticky-cta, .ev-app-banner-cta a, .ev-qv-atc, .ev-cart-checkout):active {
  transform: translateY(0) scale(.985) !important;
}

#ev-chero .ch-sub { max-width: 740px; }
#ev-chero .ch-trust { max-width: 760px; line-height: 1.55; }

.ev-rr { background: #fdf7f0; }
.ev-rr-frame { border: 1px solid rgba(193, 135, 58, .10); }
.ev-rr .ro-svg { opacity: .72; }

/* Der Raum-Stack hat eine eigene GSAP-Choreografie. Der globale Auto-Reveal darf
   keinen transformierten Sticky-Ahnen erzeugen, sonst driftet die Kartenlage. */
#anw-root .anw-wrap.ev-hidden,
#anw-root .anw-wrap.ev-hidden.ev-shown {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

.ev-pg { padding-block: clamp(72px, 8vw, 112px); }
.ev-pg-header { gap: 24px; }
.ev-pg-card {
  border-color: var(--ev-polish-line);
  box-shadow: 0 1px 0 rgba(45, 41, 38, .02);
  transition: transform .36s var(--ev-polish-ease), box-shadow .36s ease, border-color .36s ease;
}
.ev-pg-card:hover {
  border-color: rgba(193, 135, 58, .24);
  box-shadow: 0 26px 52px -32px rgba(45, 31, 19, .44);
}
.ev-pg-card-img { overflow: hidden; }
.ev-pg-card-img img { transition: transform .7s var(--ev-polish-ease); }
.ev-pg-card:hover .ev-pg-card-img img { transform: scale(1.025); }
.ev-pg-card-price { color: var(--ev-polish-muted) !important; }
.cx-section-sub,
.ev-slider-sub { color: var(--ev-polish-muted) !important; }
.ev-pg-header > a,
.ev-lb-head > a,
.ev-blog-teaser-header > a,
.ev-slider-inner > .cx-tag,
.ev-app-banner-text h3 em { color: var(--ev-polish-gold-text) !important; }
.ev-pg-card-qv { width: 44px; height: 44px; }
.ev-pg-card:focus-within .ev-pg-card-qv { opacity: 1; transform: none; }

.ev-qv-modal,
.ev-cart-drawer,
#chatbot-popup { box-shadow: 0 36px 100px -28px rgba(26, 22, 20, .48); }
.ev-slider-tab { min-height: 44px; }
.cx-ba-handle[role="slider"] { cursor: ew-resize; }
.cx-ba-handle[role="slider"]:focus-visible .cx-ba-handle-knob {
  outline: 3px solid var(--ev-polish-gold-soft);
  outline-offset: 4px;
}

.ev-sticky-cta {
  box-shadow: var(--ev-button-shadow) !important;
  transition-property: bottom, opacity, transform, background-color, color, box-shadow !important;
}
.ev-sticky-cta.polish-hidden { opacity: 0 !important; pointer-events: none !important; transform: translate(-50%, 14px); }
.ev-sticky-cta.docked.polish-hidden { transform: translate(-50%, -50%); opacity: 1 !important; pointer-events: auto !important; }
.ev-sticky-cta.docked.polish-dock-past,
.ev-sticky-cta.docked.polish-dock-past.polish-hidden {
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden;
  transition: none !important;
  transform: translate(-50%, -50%);
}

#chat-toggle-wrap { transition: bottom .42s var(--ev-polish-ease), opacity .2s ease, transform .2s ease; }
#chat-toggle-btn {
  box-shadow: none;
  transition: transform .34s var(--ev-polish-ease), opacity .3s ease !important;
}
#chat-toggle-btn:hover { transform: scale(1.025); }

@media (max-width: 1024px) {
  .sv-header-in { min-height: 68px; padding-block: 10px; }
  .sv-mnav {
    background: rgba(26, 22, 20, .975) !important;
    padding-top: 68px !important;
    padding-bottom: max(28px, env(safe-area-inset-bottom)) !important;
    overflow-y: auto;
  }
}

/* Die vier Desktop-Spalten werden im schmalen Tablet-Korridor zu eng: besonders
   die Kontaktadresse hatte bei 768px eine intrinsische Breite von > 200px und
   schob das Dokument nach rechts. Zwei echte minmax-Spalten halten den Footer
   im Raster, ohne die mobile Einspalten-Komposition zu veraendern. */
.footer__grid > * { min-width: 0; }
.footer__grid p,
.footer__grid a { overflow-wrap: anywhere; }
@media (min-width: 750px) and (max-width: 980px) {
  .footer__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: clamp(28px, 5vw, 48px);
    row-gap: 40px;
  }
}

@media (max-width: 820px) {
  .sv-header-in { min-height: 68px; padding-block: 10px; }
  .sv-mnav {
    background: rgba(26, 22, 20, .975) !important;
    padding-top: 68px !important;
    padding-bottom: max(28px, env(safe-area-inset-bottom)) !important;
    overflow-y: auto;
  }
  .sv-mnav a,
  .sv-mnav-chat { font-size: clamp(1.45rem, 7vw, 2rem); line-height: 1.15; }
  #ev-chero .ch-overlay { transform: none; left: 0; }
  #ev-chero .ch-sub br { display: none; }
  #ev-chero .ch-trust { font-size: .68rem; letter-spacing: .08em; }
  .ev-pg-grid { gap: 14px; }
  .ev-pg-card-body { padding: 14px 12px; }
}

@media (max-width: 420px) {
  .sv-header-in { gap: 8px; padding-inline: 14px; }
  .sv-actions { gap: 4px; }
  .sv-actions > .sv-ico[href*="customer_authentication"] { display: none; }
  #ev-chero .ch-overlay { padding-inline: 18px; }
  #ev-chero h1 {
    max-width: none;
    white-space: nowrap;
    text-wrap: nowrap;
    font-size: clamp(2.35rem, 10vw, 2.5rem) !important;
  }
  #ev-chero .ch-btn { width: 100%; justify-content: center; }
  .ev-rr-btn { width: 100%; }
  .ev-pg { padding-inline: 14px; }
  .ev-pg-grid { gap: 10px; }
  .ev-pg-card:last-child:nth-child(odd) { width: calc(50% - 5px); }
  .ev-pg-card-body { padding: 12px 10px; }
  .ev-pg-card-price { font-size: .82rem; }
  .ev-sticky-cta.visible { max-width: calc(100vw - 96px); overflow: hidden; text-overflow: ellipsis; }
}

@media (max-width: 360px) {
  .sv-logo img { width: 110px !important; height: auto !important; }
  #ev-chero h1 { max-width: 16ch; white-space: normal; text-wrap: balance; }
}

@media (hover: none) {
  .ev-pg-card-qv { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
  .ev-marquee-track { animation: none !important; }
  .sv-search:not(.open) { opacity: 0 !important; pointer-events: none !important; }
  .sv-search.open { opacity: 1 !important; pointer-events: auto !important; }
}

/* ══════════════════════════════════════════════════════════════════
   EYEBROW-SYSTEM — vereinheitlicht 2026-08-05
   Vorher drei Familien: (A) versal+gesperrt ohne Flaeche, (B) 16px normal,
   (C) voller Gold-Block als Pille (nur "Dein Zuhause" = Ausreisser).
   Kanonisch ist A: klein, fett, versal, gesperrt, KEINE Flaeche.
   Farbe: heller Grund -> dunkles Gold #7a4f1e (kontraststark),
          dunkler Grund -> helles Gold #efd2a7.
   Behebt nebenbei den Kontrast-Befund "Schritt 1" (1.45:1 -> ueber Norm).
   ══════════════════════════════════════════════════════════════════ */
.cx-tag,
.evx-haus .evx-haus__tag,
.ev-rr-eyebrow,
.evx-gut .evx-gut__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 0;
  margin: 0 0 16px;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  font-family: var(--font-body, 'Montserrat', system-ui, sans-serif);
  font-size: .72rem !important;
  font-weight: 700 !important;
  line-height: 1.2;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  color: #7a4f1e !important;
}

/* Auf dunklem Grund heller Goldton (Kontrast) */
.ev-reflex-eyebrow,
.evx-gut .evx-gut__herolabel {
  font-family: var(--font-body, 'Montserrat', system-ui, sans-serif);
  font-size: .72rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #efd2a7 !important;
}

/* Die Gutachten-Kopfzeile behaelt ihre fuehrende Haarlinie als Signatur */
.evx-gut .evx-gut__eyebrow::before {
  content: "";
  width: 34px;
  height: 1px;
  background: currentColor;
  opacity: .7;
}
