/* ---------- Nav ---------- */
.site-nav{position:sticky;top:40px;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:1em 2em;background:#fff;border-bottom:1px solid var(--line);}
.brand{display:flex;align-items:center;gap:.55em;font-family:var(--font-display);font-weight:700;font-size:1.2rem;}
.brand-mark{width:1.7em;height:1.7em;border-radius:50%;border:2px dashed var(--green);display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:.55em;color:var(--green-deep);flex-shrink:0;}
.nav-links{display:flex;gap:2em;font-size:.9rem;font-weight:500;}
.nav-links a{text-decoration:none;border-bottom:2px solid transparent;padding-bottom:2px;}
.nav-links a:hover{border-color:var(--amber);}
@media (max-width:820px){.nav-links{display:none;}}

/* ---------- Hero ---------- */
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:3em;align-items:center;padding:5em 2em 4em;max-width:1180px;margin:0 auto;}
.eyebrow{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.1em;font-size:.72rem;color:var(--green-deep);margin-bottom:1em;display:inline-block;}
.hero h1{font-size:clamp(2.1rem,4.2vw,3.3rem);}
.hero .lede{font-size:1.05rem;max-width:46ch;}
.hero-cta{display:flex;align-items:center;gap:1.3em;margin-top:1.7em;flex-wrap:wrap;position:relative;}
.hero-cta a{text-decoration:none;}
.doodle-arrow{position:absolute;top:-50px;right:-6px;transform:scaleX(-1) rotate(10deg);pointer-events:none;}
.doodle-note{position:absolute;top:-62px;right:56px;font-family:var(--font-mono);color:var(--amber);font-size:.74rem;transform:rotate(-4deg);pointer-events:none;white-space:nowrap;}
@media (max-width:900px){.hero{grid-template-columns:1fr;padding-top:3em;} .doodle-arrow,.doodle-note{display:none;}}

.passport{background:var(--paper-raised);border:1px solid var(--line);border-radius:var(--radius);padding:1.7em;max-width:380px;margin-left:auto;}
.passport-head{display:flex;justify-content:space-between;align-items:center;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-soft);border-bottom:1px dashed var(--line);padding-bottom:.8em;margin-bottom:1em;}
.passport-field{font-size:.85rem;color:var(--ink-soft);margin-bottom:.55em;border-bottom:1px solid var(--line);padding-bottom:.4em;}
.passport-field b{color:var(--ink);font-weight:600;}
.stamp-row{display:flex;gap:10px;margin-top:1.2em;align-items:center;}
.stamp-row .stamp-group{gap:4px;}
.stamp-row .stamp{width:24px;height:24px;}
.stamp{width:2.4em;height:2.4em;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:.65rem;border:2px dashed var(--line);color:var(--ink-soft);flex-shrink:0;}
.stamp.done{border-style:solid;border-color:var(--green);color:#fff;background:var(--green);}
.stamp.current{border-style:solid;border-color:var(--amber);color:var(--amber-deep);background:var(--tint);animation:pulse 2.2s ease-in-out infinite;}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(0,85,255,.4);}50%{box-shadow:0 0 0 6px rgba(0,85,255,0);}}
.passport-caption{font-size:.78rem;color:var(--ink-soft);margin-top:1.1em;margin-bottom:0;font-style:italic;font-family:var(--font-display);}

/* ---------- Stat strip ---------- */
.stat-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5em;max-width:1180px;margin:0 auto;padding:2.2em 2em 4em;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}

/* ---------- Drei Hebel, nach Figma 14720:16 ----------
   Der Aufbau der Folie: Eyebrow, zweizeilige Aussage in 44, darunter
   drei Spalten mit Haarlinie darueber, Titel 20 fett und Text 18,
   zum Schluss eine Linie und eine leise Fusszeile. */
.hebel{max-width:1180px;margin:0 auto;padding:4.4em 2em 4em;}
.hebel h2{font-size:clamp(1.8rem,3vw,44px);line-height:1.2;margin:0 0 1.6em;}
.hebel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3em;}
.hebel-col{border-top:1px solid var(--line);padding-top:1.5em;}
.hebel-col h3{font-size:20px;margin-bottom:.45em;}
.hebel-col p{font-size:18px;line-height:1.55;color:var(--ink);margin:0 0 .9em;}
.hebel-col .hebel-detail{font-size:.86rem;line-height:1.55;color:var(--ink-soft);margin:0;}
.hebel-foot{border-top:1px solid var(--line);margin-top:3.2em;padding-top:1.2em;font-size:15px;color:var(--ink-soft);}
@media (max-width:860px){.hebel{padding-top:3em;} .hebel-grid{grid-template-columns:1fr;gap:2em;}}
.stat b{display:block;font-family:var(--font-display);font-size:2.1rem;color:var(--green-deep);}
.stat span{font-size:.8rem;color:var(--ink-soft);}
@media (max-width:760px){.stat-strip{grid-template-columns:repeat(2,1fr);}}

/* ---------- Generic section ---------- */
.section{max-width:1180px;margin:0 auto;padding:5em 2em;}
.section-head{max-width:62ch;margin-bottom:2.4em;}

/* ---------- Phase teaser ---------- */
.teaser-subhead{font-family:var(--font-mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft);margin:1.6em 0 .8em;}
.teaser-subhead:first-of-type{margin-top:0;}
.phase-row{display:grid;grid-template-columns:repeat(5,1fr);gap:.9em;margin-bottom:.4em;}
.phase-chip{background:var(--paper-raised);border:1px solid var(--line);border-radius:10px;padding:1.1em .85em;box-shadow:var(--shadow-off-sm);}
.phase-chip .num{font-family:var(--font-mono);font-size:.72rem;color:var(--green-deep);}
.phase-chip h4{font-family:var(--font-body);font-size:.86rem;font-weight:700;margin:.35em 0 .3em;}
.phase-chip p{font-size:.74rem;margin:0;}
.ops-row .phase-chip{border-style:dashed;}
@media (max-width:980px){.phase-row{grid-template-columns:repeat(3,1fr);}}
@media (max-width:620px){.phase-row{grid-template-columns:repeat(2,1fr);}}

.stories-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2em;}
@media (max-width:820px){.stories-grid{grid-template-columns:1fr;}}
.story-card h4{font-size:.98rem;margin:0 0 .5em;}
.story-card p{font-size:.85rem;margin:0;}

/* ---------- Audience ---------- */
.audience-grid{display:grid;grid-template-columns:1fr 1fr;gap:2em;}
.audience-card{padding:2em;}
.icon-badge{width:2.9em;height:2.9em;border-radius:50%;background:var(--tint);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;margin-bottom:1em;filter:grayscale(1);opacity:.7;}
.audience-card ul{padding-left:1.1em;margin:1em 0 1.4em;color:var(--ink-soft);font-size:.9rem;}
.audience-card li{margin-bottom:.5em;}
@media (max-width:820px){.audience-grid{grid-template-columns:1fr;}}

/* ---------- Access steps ---------- */
.access-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5em;counter-reset:step;margin-bottom:2em;}
.access-step{position:relative;padding:1.7em 1.5em 1.5em;}
.access-step::before{counter-increment:step;content:counter(step);font-family:var(--font-mono);font-size:1.3rem;color:var(--amber);position:absolute;top:-15px;left:1.2em;background:var(--paper);padding:0 .3em;}
@media (max-width:820px){.access-grid{grid-template-columns:1fr;}}

/* ---------- Testimonial ---------- */
.testimonial{max-width:760px;margin:0 auto;padding:1em 2em 4em;text-align:center;}
.testimonial blockquote{font-family:var(--font-display);font-style:italic;font-size:1.4rem;color:var(--ink);margin:0 0 .8em;}
.testimonial cite{font-family:var(--font-mono);font-size:.76rem;color:var(--ink-soft);font-style:normal;}

/* ---------- Partners ---------- */
.partners{text-align:center;padding:2em;font-family:var(--font-mono);font-size:.78rem;color:var(--ink-soft);border-top:1px solid var(--line);}

/* ---------- CTA banner ---------- */
.cta-banner{background:var(--ink);color:var(--paper);text-align:center;padding:4.5em 2em;}
.cta-banner h2{color:var(--paper);}
.cta-banner p{color:rgba(255,255,255,.72);margin:0 auto 1.6em;max-width:44ch;}

/* ---------- Footer ---------- */
.site-footer{background:var(--paper-raised);border-top:1px solid var(--line);padding:3.4em 2em 2em;}
.footer-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2em;}
.footer-grid h5{font-family:var(--font-mono);text-transform:uppercase;font-size:.7rem;letter-spacing:.08em;color:var(--ink-soft);margin-bottom:1em;}
.footer-grid a,.footer-grid .flink{display:block;font-size:.86rem;margin-bottom:.6em;text-decoration:none;color:var(--ink);cursor:pointer;}
.footer-bottom{max-width:1180px;margin:2.4em auto 0;padding-top:1.4em;border-top:1px solid var(--line);font-size:.74rem;color:var(--ink-soft);font-family:var(--font-mono);}
@media (max-width:820px){.footer-grid{grid-template-columns:1fr 1fr;}}