/* ============================================================
   FINAL THEME (laedt nach style.css)
   Palette: Navy + Champagner-Gold (Akzent) + Vertrauens-Gruen (CTA)
   Schrift: Inter durchgehend · Saarschleife-Hero · CTA weit oben
   ============================================================ */
:root{
  --anthrazit:#2B2F36;
  --dunkelblau:#0F2A44;       /* Primaer-Navy: Headings, Dunkelflaechen */
  --dunkelblau-dark:#0A2036;
  --weiss:#FFFFFF;
  --offwhite:#F7F5F0;         /* warmes Off-White / Sand */
  --sand:#F1ECE0;
  --sand-dark:#E4DCCB;
  --gold:#C8A45D;             /* Champagner-Gold = Akzent (Kicker, Checks, Linien) */
  --gold-dark:#B08E45;
  --gold-soft:#F2E9D6;
  --brass:#C8A45D;
  --cta:#2F7D5C;              /* Vertrauens-Gruen = CTA */
  --cta-hover:#246348;
  --bf-green:#0F2A44;         /* Funnel-Leiste / Auswahl = Navy */
  --bf-green-d:#0A2036;
  --bf-blue:#C8A45D;          /* Slider-Bubble = Gold */
  --text:#26313D;
  --text-light:#6B7280;
  --muted:#6B7280;
  --border:#DDD6C8;
  --font-mono:'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

/* ----- Schrift: Inter durchgehend ----- */
body{ font-family:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
h1,h2,h3,.bf-q,.logo-name,.bf-success-title{
  font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight:800; letter-spacing:-0.022em;
}
.bf-q{ font-weight:700; }
.hero-eyebrow::before{ content:""; }   /* dezenter, klassischer */

/* ----- CTA = Gruen (Akzent bleibt Gold) ----- */
.btn-gold{ background:var(--cta); color:#fff; box-shadow:0 6px 18px rgba(47,125,92,0.28); }
.btn-gold:hover{ background:var(--cta-hover); color:#fff; box-shadow:0 10px 26px rgba(47,125,92,0.36); }
.bf-submit{ background:var(--cta); }
.bf-submit:hover{ background:var(--cta-hover); }
.mobile-call{ background:var(--dunkelblau); }

/* ----- HERO: Bild voll sichtbar, fokussierter Scrim nur hinter dem Text ----- */
.hero{ min-height:80vh; padding:80px 0 88px; }
.hero-overlay{
  background:
    radial-gradient(118% 78% at 50% 42%, rgba(10,32,54,0.42) 0%, rgba(10,32,54,0.28) 42%, rgba(10,32,54,0.58) 100%),
    linear-gradient(180deg, rgba(10,32,54,0.34) 0%, rgba(10,32,54,0.05) 40%, rgba(10,32,54,0.50) 100%);
}
.hero-overlay::after{ content:none; }   /* zusaetzliche Abdunklung der Basis entfernen */
.hero-inner{ text-shadow:0 2px 26px rgba(8,18,30,0.5); }
.hero-eyebrow{ color:var(--gold); }
.hero-subline{ color:#FFFFFF; }
.hero-microcopy{ color:rgba(255,255,255,0.86); }

/* ----- Farb-Kohaerenz: nur Palette (Navy / Gold / Gruen / Sand) ----- */
.bf-choice:hover{ background:var(--offwhite); }
.bf-choice.selected{ background:var(--gold-soft); }
.bf-count{ background:var(--sand); }
.bf-bubble{ color:#2B2F36; }
.bf-success-icon svg circle, .bf-success-icon svg path{ stroke:var(--cta); }

/* ----- Logo-Bild (freigestellt) ----- */
img.logo-mark{ height:58px; width:auto; display:block; object-fit:contain; }
.logo{ gap:12px; }
/* ueber dem Bild dezenter Schatten fuer Lesbarkeit, beim Scrollen weg */
.site-header .logo-mark{ filter:drop-shadow(0 1px 4px rgba(8,18,30,0.45)); transition:filter .25s; }
.site-header.scrolled .logo-mark{ filter:none; }

/* ----- klassisch-edle Feinheit: goldene Oberkante am Funnel ----- */
.funnel-card, .bf-card{ border-top:3px solid var(--gold); }

/* ============================================================
   TRANSPARENTER HEADER ueber dem Hero (wird beim Scrollen solide)
   ============================================================ */
.site-header{ position:fixed; left:0; right:0; top:0; background:transparent;
  border-bottom-color:transparent; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
/* Hero startet ganz oben hinter der Leiste */
.hero{ margin-top:0; }
/* Transparenter Zustand: helle Schrift */
.site-header .logo-name{ color:#fff; }
.site-header .logo-sub{ color:var(--gold); }
.site-header .header-phone{ color:#fff; }
.site-header .header-phone:hover{ color:var(--gold); }
.site-header .phone-icon{ color:var(--gold); }
.site-header .header-btn{ background:rgba(255,255,255,0.12); border:1px solid rgba(255,255,255,0.55);
  color:#fff; box-shadow:none; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.site-header .header-btn:hover{ background:rgba(255,255,255,0.22); color:#fff; }

/* Gescrollt: solide weisse Leiste, dunkle Schrift, gruener Button */
.site-header.scrolled{ background:rgba(255,255,255,0.97); border-bottom-color:var(--border); box-shadow:var(--shadow-sm);
  backdrop-filter:saturate(180%) blur(10px); -webkit-backdrop-filter:saturate(180%) blur(10px); }
.site-header.scrolled .logo-name{ color:var(--dunkelblau); }
.site-header.scrolled .logo-sub{ color:var(--gold-dark); }
.site-header.scrolled .header-phone{ color:var(--anthrazit); }
.site-header.scrolled .header-phone:hover{ color:var(--dunkelblau); }
.site-header.scrolled .phone-icon{ color:var(--gold-dark); }
.site-header.scrolled .header-btn{ background:var(--cta); border-color:transparent; color:#fff; backdrop-filter:none; -webkit-backdrop-filter:none; }
.site-header.scrolled .header-btn:hover{ background:var(--cta-hover); }
