/* Visuellewand – moderner Look (Phase 1: Startseite + Konfigurator-Seiten)
   Nur Schriften, Farben, Formen: saubere Poppins-Texte, kräftige Anton-Überschriften, Pill-Buttons, runde Karten.
   Keine Inhalte, Bilder oder Texte Dritter. */
@font-face{font-family:'Anton';font-style:normal;font-display:swap;font-weight:400;src:url(/fonts/anton-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Anton';font-style:normal;font-display:swap;font-weight:400;src:url(/fonts/anton-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:400;src:url(/fonts/poppins-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:500;src:url(/fonts/poppins-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:600;src:url(/fonts/poppins-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:700;src:url(/fonts/poppins-latin-700-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:400 700;src:url(/fonts/poppins-latin-ext-400-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --font-display:'Anton','Arial Narrow','Impact',sans-serif;
  --font-body:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-mono:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --bg:#FFFFFF; --bg-raised:#FFFFFF; --bg-sunken:#F4F6F2;
  --ink:#0E1A14; --ink-dim:#4A5750; --ink-faint:#7A877F;
  --line:#E5EAE4; --line-strong:#CDD6CE;
  --accent:#1B5E2F; --accent-strong:#14502B; --accent-ink:#FFFFFF;
  --accent-soft:rgba(27,94,47,.08); --accent-glow:rgba(27,94,47,.30);
  --band-bg:#08130E; --band-bg-raised:#0F1D16; --band-ink:#F4F7F2; --band-dim:#A3B1A8; --band-line:#1E3026;
  --band-accent:#C7EE6A; --band-accent-ink:#0E1A05;
  --radius:22px;
}
html{scroll-behavior:smooth}
body{font-family:var(--font-body); font-size:16px; line-height:1.7; color:var(--ink); background:var(--bg); -webkit-font-smoothing:antialiased}
p{max-width:64ch}

/* Überschriften: kräftig, schmal, Großbuchstaben (nur h1/h2) */
h1,h2{font-family:var(--font-display); font-weight:400; text-transform:uppercase; letter-spacing:.005em; line-height:1.04}
h3,h4{font-family:var(--font-body); font-weight:600; letter-spacing:-.005em; line-height:1.25; text-transform:none}
.hero h1{font-size:clamp(2.2rem,4.6vw,3.8rem); line-height:1.02}
.hero.hero-photo h1{font-size:clamp(2.7rem,7.6vw,5.9rem); line-height:1}
.head-row h2,.viz h2,.konf-home h2{font-size:clamp(2rem,4.4vw,3.3rem); max-width:18ch}
.final-cta h2{font-size:clamp(2.2rem,5.8vw,4.2rem)}
.hl{color:var(--accent)}
.hero .hl,.final-cta .hl,.konf-home .hl{color:var(--band-accent)}
.lede,.dek{color:var(--ink-dim); font-size:1.06rem; line-height:1.7}
.hero .dek,.hero .lede,.final-cta .dek,.konf-home .lede{color:var(--band-dim)}

/* Eyebrows als Pill-Badges */
.eyebrow{display:inline-flex; align-items:center; gap:.55em; font-family:var(--font-body); font-size:.78rem; font-weight:500; letter-spacing:.01em; text-transform:none; color:var(--accent-strong); background:var(--accent-soft); padding:.38rem .95rem; border-radius:999px; width:fit-content}
.eyebrow::before{content:""; width:.5rem; height:.5rem; border-radius:50%; background:currentColor; font-size:1em}
.hero .eyebrow,.final-cta .eyebrow,.konf-home .eyebrow{color:var(--band-accent); background:rgba(199,238,106,.12)}

/* Buttons: Pill, ruhig, ohne Versalien-Mono */
.btn{font-family:var(--font-body); font-size:.92rem; font-weight:600; letter-spacing:0; text-transform:none; padding:.9rem 1.7rem; border-radius:999px; border-width:1.5px; box-shadow:none}
.btn:hover{transform:translateY(-1px)}
.btn-solid{background:var(--accent); color:#fff}
.btn-solid:hover{background:var(--accent-strong)}
.btn-fill{background:var(--band-accent); color:var(--band-accent-ink)}
.on-line .btn-fill,.konf-bar .btn-fill{background:var(--accent); color:#fff}
.btn-ghost{border-color:rgba(244,247,242,.35); color:var(--band-ink)}
.on-line .btn-ghost,.konf-bar .btn-ghost{border-color:var(--line-strong); color:var(--ink)}
.on-line .btn-ghost:hover,.konf-bar .btn-ghost:hover{border-color:var(--accent); color:var(--accent-strong)}

/* Kopfbereich */
.topbar,.top-bar,.utility{font-family:var(--font-body)}
header.site{background:rgba(255,255,255,.92); border-bottom:1px solid var(--line)}
@supports (backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px)){header.site{background:rgba(255,255,255,.86)}}
nav.primary a{font-family:var(--font-body); font-weight:500; color:var(--ink-dim)}
nav.primary a:hover{color:var(--ink)}
nav.primary .mega-menu{border-radius:18px; border:1px solid var(--line); box-shadow:0 24px 60px -24px rgba(8,19,14,.35)}

/* Karten & Flächen */
.p-card,.konf-card,.proj-card,.faq-item,.ratgeber-card,.step-card{border-radius:var(--radius); border:1px solid var(--line); background:var(--bg-raised); box-shadow:0 1px 2px rgba(14,26,20,.04),0 18px 40px -26px rgba(14,26,20,.28); overflow:hidden}
.p-card:hover,.proj-card:hover{border-color:var(--accent); transform:translateY(-3px)}
.konf-card{background:var(--band-bg-raised); border-color:var(--band-line)}
.art,.p-card .art,.proj-card .art{border-radius:0}
.tag,.pill{font-family:var(--font-body); font-weight:500; letter-spacing:.02em; text-transform:none; border-radius:999px}
.konf-frame iframe{border-radius:var(--radius); box-shadow:0 30px 70px -40px rgba(8,19,14,.55)}

/* Ruhigere Abschnitte */
.on-line{border-top:0}
.on-line:nth-of-type(even){background:var(--bg-sunken)}
details summary{font-family:var(--font-body); font-weight:600}
.num{font-family:var(--font-display); font-weight:400; letter-spacing:.01em}
footer{font-family:var(--font-body)}
footer h4{font-family:var(--font-body); font-weight:600; letter-spacing:.02em; text-transform:none}
.cookie-banner .btn{padding:.7rem 1.3rem}
.marquee-track span,.mobile-nav nav a{text-transform:uppercase}
.lc-title,.announce-title{font-family:var(--font-body); font-weight:600; letter-spacing:-.005em}
.lc-title{font-size:1.15rem}
html{scroll-behavior:auto}

.viz h2{max-width:none;font-size:clamp(1.8rem,3.6vw,2.8rem)}
.hero-badge{font-family:var(--font-body);font-size:.78rem;font-weight:500;letter-spacing:.01em;text-transform:none;border-radius:999px}

/* Kennzahlen-Streifen unter dem Seitenkopf: lange Woerter duerfen nie ueberlappen oder abgeschnitten werden */
.hero:not(.hero-photo) .hero-stats{grid-template-columns:repeat(auto-fit,minmax(min(100%,9.5rem),1fr)); gap:1.1rem 1.4rem}
.hero:not(.hero-photo) .hero-stats:has(>:nth-child(4)){grid-template-columns:repeat(2,minmax(0,1fr))}
.hero:not(.hero-photo) .hero-stats>*{min-width:0}
.hero:not(.hero-photo) .hero-stats .num{font-size:clamp(1.3rem,1.9vw,1.75rem); line-height:1.15; overflow-wrap:break-word; hyphens:auto}
.hero:not(.hero-photo) .hero-stats .lbl{overflow-wrap:break-word}

/* tag-lesbar: Kennzeichnung auch auf hellen Bildern gut lesbar */
.art .tag{background:rgba(10,12,8,.66)!important;color:#eef2ea!important;border-color:rgba(255,255,255,.2)!important}
