/* Startseite (index): Hero, Problem, Warum Erbright, Ablauf, Zusagen, Gründer, FAQ, Abschluss-CTA. */
/* hero – Full-Bleed-Video */
.hero{position:relative;min-height:640px;height:86vh;max-height:920px;display:flex;align-items:center;background:var(--color-ink);overflow:hidden}
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero__scrim{position:absolute;inset:0;background:linear-gradient(to top,rgba(30,25,40,.72) 0%,rgba(30,25,40,.42) 50%,rgba(30,25,40,.14) 100%)}
.hero .l-container{width:100%}
.hero__content{position:relative;z-index:2;padding:48px 0;color:#fff;max-width:640px}
.hero__content .type-display-xl{color:#fff}
.hero__content .type-body-lg{color:rgba(255,255,255,.82);margin-top:22px}
.hero__ctas{display:flex;gap:14px;margin-top:32px;flex-wrap:wrap}
.hero__trustline{margin-top:20px;font:400 14px/22px var(--font-sans);color:rgba(255,255,255,.64)}

/* warum erbright – USP-Karten im Stil der Szenario-Karten (Kommentar 09:03) */
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.why-item{background:var(--color-surface-subtle);border-radius:var(--radius-card);padding:28px 24px}
.why-item .type-heading-sm{margin-bottom:12px}
.why-item p{font-size:15px;line-height:24px;color:var(--color-text-muted)}


/* stat cards (Problem-Sektion) */
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:48px;margin-top:56px}
.stat-item__value{font:400 66px/78px var(--font-display);margin-bottom:6px}  /* freistehend wie die Trust-Reihe (Kommentar 22:44) */
.stat-item p{font-size:15px;line-height:23px;color:var(--color-text-muted)}

/* scenario cards (Die ehrliche Rechnung) */
.scenario-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px}
.scenario-card{background:var(--color-surface-subtle);border-radius:var(--radius-card);padding:26px 22px}
.scenario-card__label{font:600 12px/18px var(--font-sans);letter-spacing:.06em;text-transform:uppercase;color:var(--color-text-muted)}
.scenario-card__value{font:400 40px/48px var(--font-display);margin:10px 0 6px}
.scenario-card p{font-size:14px;line-height:22px;color:var(--color-text-muted)}
.section--dark .scenario-card{color:var(--color-ink)}  /* Karten bleiben Ink-auf-Hell, auch im dunklen Band */
.section--dark .scenario-card:not(.scenario-card--highlight){background:#fff}
.scenario-card--highlight{background:var(--color-accent-primary)}
.scenario-card--highlight .scenario-card__label{color:var(--color-ink)}
/* interests – Warum Erbright: links emotionaler Einstieg, rechts "Wie die andere Seite bezahlt wird" (Pfeil = Interesse gleich-/gegenläufig) */
.interests{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:start}
.interests .section__head{margin-bottom:0}
.interests__table{display:grid;gap:10px}
.interests__head{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr) 160px;gap:20px;padding:0 20px;font:600 12px/18px var(--font-sans);letter-spacing:.06em;text-transform:uppercase;color:var(--color-text-muted)}
.interests__row{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr) 160px;gap:20px;align-items:center;padding:18px 20px;border-radius:var(--radius-card);background:var(--color-surface-subtle)}
.interests__row--us{background:var(--color-accent-primary)}
.interests__who{font:600 15px/22px var(--font-sans)}
.interests__how{font-size:14px;line-height:22px;color:var(--color-text-muted)}
.interests__row--us .interests__how{color:var(--color-ink)}
.chip{justify-self:start;display:inline-flex;align-items:center;gap:6px;border-radius:var(--radius-pill);padding:4px 12px;font:600 13px/20px var(--font-sans);background:#fff;color:var(--color-text-muted)}
.chip b{font:400 18px/1 var(--font-display)}
.chip--down{color:#9A3B1F}
.chip--up{background:var(--color-ink);color:#fff}
.interests__cta{margin-top:40px;padding:28px 32px;border-radius:var(--radius-card);background:var(--color-surface-warm);display:grid;grid-template-columns:1fr auto;column-gap:32px;align-items:center}
.interests__cta .text-muted{grid-column:1;font-size:15px;line-height:24px;margin-top:4px}
.interests__cta .button{grid-column:2;grid-row:1 / span 2}
.footnote{margin-top:36px;font-size:12px;line-height:18px;color:var(--color-text-muted);max-width:820px}
.footnote p+p{margin-top:4px}

/* ablauf – Kopf links; rechts Schritte mit Nummern-Badges links und Scroll-Linie von Badge zu Badge (Kommentar 09:09) */
.process-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:56px;align-items:start}
.process-grid .section__head{margin-bottom:0}
.process-steps{position:relative}
.process-line{position:absolute;left:21px;width:2px;background:var(--color-border-subtle)}
.process-line__progress{width:100%;height:0;background:var(--color-ink)}
.process-step{display:grid;grid-template-columns:44px 1fr;gap:24px;padding:24px 0;opacity:.33;transition:opacity .45s ease}
.process-step.is-active{opacity:1}
@media (prefers-reduced-motion:reduce){.process-step{opacity:1;transition:none}}
.process-step:first-child{padding-top:0}
.process-step__num{font:400 22px/1 var(--font-display);width:44px;height:44px;border-radius:50%;background:var(--color-surface-subtle);display:flex;align-items:center;justify-content:center;position:relative;z-index:1}
.process-step__body .type-heading-sm{margin-bottom:10px;padding-top:8px}
.process-step p{font-size:15px;line-height:24px;color:var(--color-text-muted)}

/* founder */
.founder-section__grid{display:grid;grid-template-columns:340px 1fr;gap:56px;align-items:center}
.founder-section__grid img{border-radius:var(--radius-card-lg)}
.founder-section blockquote{font:400 26px/38px var(--font-display);font-style:italic;margin:20px 0 24px}  /* dokumentierte Akzidenz-Ausnahme zur 32px-Serif-Regel, siehe Guide */
.founder-section__copy{max-width:560px}
.founder-section__name{font:600 15px/22px var(--font-sans);margin-top:20px}


/* faq – Headline links, Akkordeon rechts */
.faq-section__grid{display:grid;grid-template-columns:1fr 1.5fr;gap:56px;align-items:start}
.faq-section__grid .section__head{margin-bottom:0}
.faq-section__grid .section__head h2{text-wrap:balance}
.faq-section__list details{border-bottom:1px solid var(--color-border-subtle);padding:22px 0}
.faq-section__list summary{font:600 17px/26px var(--font-sans);letter-spacing:-.014em;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq-section__list summary::-webkit-details-marker{display:none}
.faq-section__list summary::after{content:"+";font:400 24px/26px var(--font-display);color:var(--color-icon-muted)}
.faq-section__list details[open] summary::after{content:"–"}
.faq-section__list details p{margin-top:12px;color:var(--color-text-muted);font-size:15px;line-height:25px}
.section--dark .faq-section__list details{border-color:rgba(255,255,255,.16)}
.section--dark .faq-section__list summary::after{color:rgba(255,255,255,.56)}
.section--dark .faq-section__list details p{color:rgba(255,255,255,.72)}

/* final cta – doppeltes Bottom-Padding, damit der fade-ink-Verlauf weich im Footer ankommt */
.final-cta{text-align:center}
.final-cta .section__inner{padding-bottom:192px}
.final-cta .type-display-lg{max-width:640px;margin:0 auto 20px}
.final-cta__copy{max-width:560px;margin:0 auto 32px}

@media (prefers-reduced-motion:reduce){
  .hero__video{display:none}
}

@media (max-width:920px){
  .why-grid,.stats-grid{grid-template-columns:1fr}
  .process-grid{grid-template-columns:1fr;gap:24px}
  .scenario-grid{grid-template-columns:1fr 1fr}
  .interests{grid-template-columns:1fr;gap:28px}
  .interests__cta{grid-template-columns:1fr;row-gap:16px}
  .interests__cta .button{grid-column:1;grid-row:auto;justify-self:start}
  .founder-section__grid{grid-template-columns:1fr}
  .faq-section__grid{grid-template-columns:1fr;gap:24px}
  .hero{height:auto;min-height:560px}
  .hero__content{padding:96px 0 72px}
}

@media (max-width:640px){
  .interests__head{display:block;padding:0 4px}
  .interests__head span:not(:last-child){display:none}
  .interests__row{grid-template-columns:1fr;gap:6px}
  .scenario-grid{grid-template-columns:1fr}  /* 2 Spalten sprengen bei langen Wörtern den Viewport */
  .stat-item__value{font-size:52px;line-height:62px}
  .final-cta .section__inner{padding-bottom:128px}
}