/* =========================================================
   FokusNetz – Website-Styles (eigenständig, ohne Build-Tool)
   Schrift: Sora · Akzent: Orange · Dunkle Sektionen: Navy
   ========================================================= */

/* Sora – selbst gehostet (Variable Font 400–800), kein Google-Fonts-Aufruf.
   Datenschutzfreundlich: keine IP-Übertragung an Google. */
@font-face{
  font-family:"Sora";
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url("fonts/sora-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:"Sora";
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url("fonts/sora-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root{
  --orange:#fe6f00;
  --orange-d:#e96400;
  --orange-soft:rgba(254,111,0,.12);
  --ink:#0e1320;
  --nav-ink:#1c2230;
  --nav-muted:#5a6172;
  --muted:#6b7384;
  --hero-text:#aab3c5;
  --line:#e9e8e3;
  --line-2:#eef0f3;
  --page:#ffffff;
  --dark:#0c1424;
  --dark-2:#0a1120;
  --card-dark:#121b2e;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:"Sora", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  background:var(--page); color:var(--nav-ink); line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{ max-width:1240px; margin:0 auto; padding:0 40px }

/* shared icon */
.ico{ width:24px; height:24px; flex:none; stroke:currentColor; stroke-width:2;
  fill:none; stroke-linecap:round; stroke-linejoin:round }

/* ============ NAV ============ */
header.nav{
  position:sticky; top:0; z-index:50; background:rgba(255,255,255,.86);
  backdrop-filter:blur(10px); border-bottom:1px solid var(--line);
}
.nav .wrap{ display:flex; align-items:center; min-height:68px; gap:36px }
.brand{ display:flex; align-items:center; gap:10px; text-decoration:none }
.brand img{ height:48px; width:auto }
.brand .word{ font-size:21px; font-weight:700; letter-spacing:-.01em; color:var(--nav-ink) }
.brand .word span{ color:var(--orange) }

nav.links{ display:flex; gap:32px; margin-left:14px }
nav.links a{
  text-decoration:none; color:var(--nav-muted); font-size:15.5px; font-weight:500;
  transition:color .15s; position:relative; padding:4px 0;
}
nav.links a:hover{ color:var(--nav-ink) }
nav.links a::after{
  content:""; position:absolute; left:0; right:100%; bottom:-2px; height:2px;
  background:var(--orange); transition:right .2s;
}
nav.links a:hover::after{ right:0 }
.nav .spacer{ flex:1 }

.btn{
  font-family:inherit; font-weight:600; font-size:15px; cursor:pointer;
  border-radius:11px; padding:13px 22px; display:inline-flex; align-items:center; gap:9px;
  text-decoration:none; border:2px solid transparent; transition:.16s; white-space:nowrap;
}
.btn.primary{ background:var(--orange); color:#fff }
.btn.primary:hover{ background:var(--orange-d) }
.btn.ghost-dark{ background:transparent; color:#fff; border-color:rgba(255,255,255,.85) }
.btn.ghost-dark:hover{ background:rgba(255,255,255,.1) }
.btn.ghost-light{ background:transparent; color:var(--nav-ink); border-color:var(--line) }
.btn.ghost-light:hover{ border-color:var(--orange); color:var(--orange) }
.btn .arr{ transition:transform .16s }
.btn:hover .arr{ transform:translateX(3px) }

.burger{ display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:8px }
.burger i{ width:24px; height:2.5px; background:var(--nav-ink); border-radius:2px; display:block }

/* mobile menu panel */
.mobile-menu{ display:none; }

/* ============ HERO ============ */
.hero{
  position:relative; overflow:hidden; color:#fff;
  background:linear-gradient(135deg, #070b14 0%, #0c1424 55%, #0a1120 100%);
}
.hero .glow{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(ellipse 90% 62% at 50% -8%,  rgba(20,58,132,.72), transparent 60%),
    radial-gradient(ellipse 58% 52% at 84% 82%,  rgba(254,111,0,.20), transparent 56%),
    radial-gradient(ellipse 42% 44% at 16% 58%,  rgba(46,24,108,.55), transparent 56%);
}
.hero canvas.dots{
  position:absolute; inset:0; z-index:0; pointer-events:none; display:block;
  width:100%; height:100%;
  -webkit-mask-image:radial-gradient(ellipse 92% 90% at 50% 36%, #000 42%, transparent 84%);
          mask-image:radial-gradient(ellipse 92% 90% at 50% 36%, #000 42%, transparent 84%);
}
.hero .topline{ position:absolute; top:0; left:0; right:0; height:2px; z-index:2;
  background:linear-gradient(90deg, transparent, rgba(254,111,0,.55), transparent) }

.hero-inner{ position:relative; z-index:3; padding:150px 40px 250px }

h1.title{
  font-size:clamp(34px, 5vw, 64px); line-height:1.05; font-weight:800;
  letter-spacing:-.025em; max-width:15ch;
}
h1.title .o{ color:var(--orange) }
h1.title .hl{ position:relative; white-space:nowrap; }
h1.title .hl::after{
  content:""; position:absolute; left:-.02em; right:-.02em; bottom:.04em;
  height:.11em; border-radius:6px; background:var(--orange);
  transform:scaleX(var(--hl, 0)); transform-origin:left center;
}
p.lede{
  margin-top:26px; font-size:clamp(17px,1.6vw,21px); line-height:1.6;
  color:var(--hero-text); max-width:50ch; font-weight:400;
}
.ctas{ display:flex; gap:15px; margin-top:38px; flex-wrap:wrap }

/* trust bar */
.trust{
  position:relative; z-index:3; margin-top:280px;
  border-top:1px solid rgba(255,255,255,.12); padding-top:30px;
  display:flex; align-items:center; gap:38px; flex-wrap:wrap;
}
.trust .coop{ display:flex; align-items:center; gap:16px }
.trust .coop .lbl{ font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:#7b8398; font-weight:600 }
.logo-chip{
  display:inline-flex; align-items:center; justify-content:center;
  background:#fff; padding:9px 16px; height:auto;
  border-radius:12px; box-shadow:0 6px 18px rgba(0,0,0,.18);
  flex-shrink:0;
}
.logo-chip img{ height:42px; width:auto; display:block }
.logo-ph{
  height:42px; min-width:150px; padding:0 18px; border:1.5px dashed rgba(255,255,255,.24);
  border-radius:9px; display:flex; align-items:center; justify-content:center; gap:8px;
  color:#aeb6c6; font-size:13px; font-weight:600; letter-spacing:.02em;
}
.logo-ph b{ color:#fff }
.trust .facts{ display:flex; gap:30px; margin-left:auto; flex-wrap:wrap }
.fact{ display:flex; flex-direction:column; gap:2px }
.fact b{ font-size:21px; font-weight:700; letter-spacing:-.01em; color:#fff }
.fact b .u{ color:var(--orange) }
.fact s{ text-decoration:none; font-size:12.5px; color:#8a92a4 }

.hero .curve{ position:absolute; left:0; right:0; bottom:-1px; z-index:2; width:100%; height:84px; display:block }

@media (prefers-reduced-motion: no-preference){
  .hero-inner.anim > *{ opacity:0; transform:translateY(18px); }
}

/* scroll hint */
.scrollcue{
  position:absolute; left:50%; bottom:118px; transform:translateX(-50%);
  z-index:4; display:flex; flex-direction:column; align-items:center; gap:11px;
  text-decoration:none; color:#aab3c5; opacity:.92; transition:color .15s, opacity .15s;
}
.scrollcue:hover{ color:#fff; opacity:1 }
.scrollcue .lbl{ font-size:11px; letter-spacing:.2em; text-transform:uppercase; font-weight:600 }
.scrollcue .chevs{ position:relative; width:22px; height:22px; }
.scrollcue .chevs i{
  position:absolute; left:50%; top:2px; width:12px; height:12px; margin-left:-6px;
  border-right:2px solid currentColor; border-bottom:2px solid currentColor;
  transform:rotate(45deg); border-radius:1px;
}
.scrollcue .chevs i:nth-child(2){ top:10px; }
@media (prefers-reduced-motion: no-preference){
  .scrollcue .chevs i{ animation:cueBounce 1.7s ease-in-out infinite; }
  .scrollcue .chevs i:nth-child(2){ animation-delay:.18s; }
  @keyframes cueBounce{
    0%,100%{ transform:translateY(-3px) rotate(45deg); opacity:.35 }
    50%    { transform:translateY(3px)  rotate(45deg); opacity:1 }
  }
}

/* replay */
.replay-btn{
  position:absolute; right:30px; bottom:120px; z-index:5;
  display:inline-flex; align-items:center; gap:8px;
  font-family:inherit; font-size:12.5px; font-weight:600; letter-spacing:.02em;
  color:#aab3c5; background:rgba(255,255,255,.05); cursor:pointer;
  border:1px solid rgba(255,255,255,.16); border-radius:100px; padding:9px 16px;
  backdrop-filter:blur(4px); transition:color .15s, border-color .15s, background .15s;
}
.replay-btn:hover{ color:#fff; border-color:rgba(255,255,255,.42); background:rgba(255,255,255,.1) }
.replay-btn .ic{ font-size:15px; line-height:1; display:inline-block; transition:transform .5s cubic-bezier(.22,.7,.2,1) }
.replay-btn:hover .ic{ transform:rotate(-180deg) }
.replay-btn.spin .ic{ transform:rotate(-360deg) }

/* ============ SECTION SHELL ============ */
.section{ padding:96px 0 }
.section.dark{ background:var(--dark); color:#fff; position:relative; overflow:hidden }
.eyebrow-l{ display:inline-block; font-size:13px; font-weight:700; letter-spacing:.16em;
  text-transform:uppercase; color:var(--orange) }
.eyebrow-l.center{ display:block; text-align:center }
.h2{ font-size:clamp(28px,3.4vw,42px); font-weight:800; letter-spacing:-.022em;
  color:var(--nav-ink); margin-top:12px; text-wrap:balance }
.section.dark .h2{ color:#fff }
.lead{ color:var(--muted); font-size:17.5px; line-height:1.65; margin-top:16px; max-width:62ch }
.section.dark .lead{ color:#aab4c6 }
.sec-head{ text-align:center; max-width:720px; margin:0 auto 56px }
.sec-head .lead{ margin-left:auto; margin-right:auto }

/* ============ NRW / SCHÜLERFIRMA ============ */
.nrw{ text-align:center; padding:88px 0 }
.nrw .eyebrow-l{ margin-bottom:6px }
.nrw p{ color:var(--muted); font-size:18px; line-height:1.7; max-width:64ch; margin:18px auto 0 }
.nrw .wappen{ width:140px; height:auto; margin:42px auto 8px; filter:drop-shadow(0 14px 28px rgba(0,0,0,.12)) }
.nrw .rule{ width:120px; height:3px; margin:26px auto 0; border-radius:3px;
  background:linear-gradient(90deg, transparent, var(--orange), transparent) }

/* ============ CARDS / LEISTUNGEN ============ */
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px }
.card{
  background:#fff; border:1px solid var(--line-2); border-radius:18px; padding:34px 30px;
  transition:transform .2s, box-shadow .2s, border-color .2s;
}
.card:hover{ transform:translateY(-4px); box-shadow:0 18px 40px rgba(15,23,42,.08); border-color:#e2e6ec }
.card .ic-box{
  width:54px; height:54px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  background:var(--orange-soft); color:var(--orange); margin-bottom:22px;
}
.card .ic-box .ico{ width:26px; height:26px }
.card h3{ font-size:20px; font-weight:700; letter-spacing:-.01em; color:var(--nav-ink) }
.card p{ color:var(--muted); font-size:15.5px; line-height:1.65; margin-top:12px }

/* featured (orange) Leistungs-Karte */
.card.featured{ background:var(--orange); border-color:var(--orange); }
.card.featured:hover{ box-shadow:0 18px 40px rgba(254,111,0,.28); border-color:var(--orange) }
.card.featured .ic-box{ background:rgba(255,255,255,.2); color:#fff }
.card.featured h3{ color:#fff }
.card.featured p{ color:rgba(255,255,255,.92) }
.card-link{
  display:inline-flex; align-items:center; gap:8px; margin-top:20px;
  color:#fff; font-weight:600; font-size:15px; text-decoration:none;
}
.card-link .arr{ transition:transform .16s }
.card-link:hover .arr{ transform:translateX(3px) }
/* "Noch nicht verfügbar"-Badge */
.badge{
  display:inline-block; vertical-align:middle; margin-left:8px;
  font-size:11.5px; font-weight:600; letter-spacing:.01em; color:var(--muted);
  background:#f1f2f4; border:1px solid var(--line-2); border-radius:100px; padding:3px 10px;
}

/* CTA-Paar in "Über uns" */
.about-ctas{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:34px }
@media (max-width:760px){ .about-ctas{ grid-template-columns:1fr } }

/* Gründer-CTA in "Über uns" */
.founders-cta{
  display:flex; align-items:center; gap:18px;
  background:var(--orange); color:#fff; text-decoration:none;
  border-radius:16px; padding:22px 26px; transition:transform .2s, box-shadow .2s;
}
.founders-cta:hover{ transform:translateY(-3px); box-shadow:0 18px 40px rgba(254,111,0,.3) }
.founders-cta .fc-ico{
  width:48px; height:48px; flex:none; border-radius:12px; background:rgba(255,255,255,.18);
  display:flex; align-items:center; justify-content:center;
}
.founders-cta .fc-ico .ico{ width:24px; height:24px }
.founders-cta .fc-text{ display:flex; flex-direction:column; gap:3px }
.founders-cta .fc-text strong{ font-size:18px; font-weight:700; letter-spacing:-.01em }
.founders-cta .fc-text small{ font-size:14px; color:rgba(255,255,255,.85) }
.founders-cta .arr{ margin-left:auto; font-size:22px; transition:transform .16s }
.founders-cta:hover .arr{ transform:translateX(4px) }

/* dunkle CTA-Variante (Unser Weg) */
.founders-cta.alt{
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.14);
}
.founders-cta.alt:hover{ box-shadow:0 18px 40px rgba(0,0,0,.3); border-color:rgba(254,111,0,.5) }
.founders-cta.alt .fc-ico{ background:rgba(254,111,0,.16); color:var(--orange) }
.founders-cta.alt .fc-text small{ color:#9aa6ba }
.founders-cta.alt .arr{ color:var(--orange) }

/* Kontakt-Status (geschlossen) */
.status.closed{ color:#e05b54 }
.status.closed .dot{ background:#e05b54; box-shadow:0 0 0 4px rgba(224,91,84,.16) }

/* ============ ÜBER UNS (dark) — features ============ */
.about-grid{ display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start }
.about-intro .eyebrow-l{ margin-bottom:8px }
.about-intro .lead{ margin-top:18px }
.features{ display:grid; grid-template-columns:1fr 1fr; gap:30px 28px }
.feature{ }
.feature .ic-box{
  width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:rgba(254,111,0,.16); color:var(--orange); margin-bottom:16px;
}
.feature .ic-box .ico{ width:22px; height:22px }
.feature h3{ font-size:17.5px; font-weight:700; color:#fff }
.feature p{ color:#9aa6ba; font-size:14.5px; line-height:1.6; margin-top:8px }
.section.dark .glow-d{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(ellipse 50% 50% at 12% 18%, rgba(46,24,108,.45), transparent 60%),
    radial-gradient(ellipse 46% 50% at 88% 92%, rgba(254,111,0,.12), transparent 58%);
}
.section.dark .wrap{ position:relative; z-index:1 }

/* ============ PARTNER ============ */
.partners{ display:flex; justify-content:center; gap:30px; flex-wrap:wrap; margin-top:8px }
.partner-card{
  border:1px solid transparent; border-radius:16px; padding:20px 24px; background:transparent;
  display:flex; align-items:center; justify-content:center; min-width:240px; min-height:120px;
  transition:transform .2s; text-decoration:none;
}
.partner-card:hover{ transform:translateY(-3px) }
.partner-card img{ max-height:130px; width:auto }
.partner-ph{ display:flex; flex-direction:column; align-items:center; gap:4px; color:var(--muted) }
.partner-ph b{ font-size:20px; color:var(--nav-ink); letter-spacing:-.01em }
.partner-ph s{ text-decoration:none; font-size:12px; letter-spacing:.06em; text-transform:uppercase }

/* ============ KONTAKT ============ */
.contact-grid{ display:grid; grid-template-columns:.86fr 1.14fr; gap:34px; align-items:stretch }
.info-card{
  background:var(--dark); color:#fff; border-radius:20px; padding:36px 34px;
  border:1px solid rgba(255,255,255,.06);
}
.info-card h3{ font-size:21px; font-weight:700; margin-bottom:26px }
.info-row{ display:flex; align-items:flex-start; gap:16px; margin-bottom:22px }
.info-row .ic-box{
  width:44px; height:44px; flex:none; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:rgba(254,111,0,.16); color:var(--orange);
}
.info-row .ic-box .ico{ width:20px; height:20px }
.info-row .k{ font-size:13px; color:#8b95a8 }
.info-row .v{ font-size:16px; font-weight:600; color:#fff; margin-top:2px; word-break:break-word }
.info-row a.v{ text-decoration:none }
.info-row a.v:hover{ color:var(--orange) }
.info-div{ height:1px; background:rgba(255,255,255,.1); margin:8px 0 20px }
.status{ display:flex; align-items:center; gap:10px; font-weight:600; color:#5fd28a; font-size:15px }
.status .dot{ width:9px; height:9px; border-radius:50%; background:#5fd28a; box-shadow:0 0 0 4px rgba(95,210,138,.18) }
.info-card .hours{ color:#8b95a8; font-size:14px; margin-top:8px }

/* "So läuft's ab"-Karte unter den Kontaktinfos */
.contact-left{ display:flex; flex-direction:column; gap:22px }
.steps-card{
  background:#fff; border:1px solid var(--line-2); border-radius:20px; padding:30px 30px;
  box-shadow:0 10px 34px rgba(15,23,42,.05);
}
.steps-card h3{ font-size:19px; font-weight:700; color:var(--nav-ink); margin-bottom:22px }
.steps{ list-style:none; display:flex; flex-direction:column; gap:22px; position:relative }
.step{ display:flex; align-items:flex-start; gap:16px; position:relative }
.step .step-n{
  width:34px; height:34px; flex:none; border-radius:10px; display:flex; align-items:center; justify-content:center;
  background:var(--orange-soft); color:var(--orange); font-weight:700; font-size:16px; z-index:1;
}
/* Verbindungslinie zwischen den Schritten */
.step:not(:last-child)::before{
  content:""; position:absolute; left:16.5px; top:34px; bottom:-22px; width:2px;
  background:var(--line); border-radius:2px;
}
.step-text strong{ display:block; font-size:16px; font-weight:700; color:var(--nav-ink); margin-bottom:4px }
.step-text p{ color:var(--muted); font-size:14.5px; line-height:1.6 }

.form-card{ background:#fff; border:1px solid var(--line-2); border-radius:20px; padding:34px 32px;
  box-shadow:0 10px 34px rgba(15,23,42,.05); display:flex; flex-direction:column }
.field-grow{ display:flex; flex-direction:column; flex:1 1 auto }
.field-grow textarea{ flex:1 1 auto }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:18px }
.field{ margin-bottom:18px }
.field label{ display:block; font-size:13.5px; font-weight:600; color:var(--nav-ink); margin-bottom:7px }
.field label .req{ color:var(--orange) }
.field input, .field textarea{
  width:100%; font-family:inherit; font-size:15px; color:var(--nav-ink);
  border:1.5px solid var(--line); border-radius:11px; padding:12px 14px; background:#fdfdfc;
  transition:border-color .15s, box-shadow .15s;
}
.field input::placeholder, .field textarea::placeholder{ color:#aab1bd }
.field input:focus, .field textarea:focus{ outline:none; border-color:var(--orange); box-shadow:0 0 0 3px rgba(254,111,0,.12) }
.field textarea{ min-height:130px; resize:vertical }
.consent{ display:flex; align-items:flex-start; gap:11px; margin:6px 0 20px; font-size:13.5px; color:var(--muted); line-height:1.5 }
.consent input{ width:18px; height:18px; margin-top:2px; flex:none; accent-color:var(--orange) }
.consent a{ color:var(--orange); text-decoration:underline; text-underline-offset:2px }
.form-card .btn.primary{ width:100%; justify-content:center; padding:15px }
.form-note{ font-size:14px; margin-top:14px; text-align:center; min-height:20px }
.form-note.ok{ color:#1f8a5b }
.form-note.err{ color:#cc3b34 }

/* ============ FOOTER ============ */
footer.site{ background:var(--dark-2); color:#fff; border-top:1px solid rgba(255,255,255,.08); padding:64px 0 30px }
.foot-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:40px }
.foot-brand img{ height:34px; margin-bottom:18px; filter:brightness(0) invert(1) }
.foot-brand p{ color:#8b95a8; font-size:14.5px; line-height:1.65; max-width:38ch }
.foot-col h4{ font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:#aab4c6; margin-bottom:16px }
.foot-col a{ display:block; color:#8b95a8; text-decoration:none; font-size:15px; padding:6px 0; transition:color .15s }
.foot-col a:hover{ color:#fff }
.foot-bottom{ display:flex; align-items:center; justify-content:space-between; gap:16px;
  border-top:1px solid rgba(255,255,255,.08); margin-top:44px; padding-top:24px; flex-wrap:wrap }
.foot-bottom p{ color:#737d90; font-size:13.5px }
.foot-bottom .made{ color:#737d90; font-size:13.5px; display:flex; align-items:center; gap:6px }

/* ============ RESPONSIVE ============ */
@media (max-width:960px){
  .about-grid{ grid-template-columns:1fr; gap:40px }
  .contact-grid{ grid-template-columns:1fr; gap:26px }
  .cards{ grid-template-columns:1fr 1fr }
}
@media (max-width:820px){
  .wrap{ padding:0 22px }
  nav.links, .nav .btn.primary{ display:none }
  .burger{ display:flex }
  .hero-inner{ padding:74px 22px 180px }
  .trust{ margin-top:120px; gap:24px }
  .trust .coop{ flex-wrap:wrap }
  .trust .coop .lbl{ width:100% }
  .trust .facts{ margin-left:0; gap:22px }
  .section{ padding:72px 0 }
  .cards{ grid-template-columns:1fr }
  .features{ grid-template-columns:1fr }
  .form-row{ grid-template-columns:1fr }
  .foot-grid{ grid-template-columns:1fr 1fr; gap:30px }
  .foot-brand{ grid-column:1 / -1 }
  /* mobile menu */
  .mobile-menu.open{ display:block; position:fixed; inset:68px 0 auto 0; z-index:49;
    background:#fff; border-bottom:1px solid var(--line); padding:14px 22px 22px }
  .mobile-menu a{ display:block; padding:13px 4px; font-size:17px; font-weight:500;
    color:var(--nav-ink); text-decoration:none; border-bottom:1px solid var(--line-2) }
  .mobile-menu .btn{ margin-top:16px; width:100%; justify-content:center }
}
@media (max-width:520px){
  .foot-grid{ grid-template-columns:1fr }
  .nrw p{ font-size:16.5px }
}

/* ============ RECHTSSEITEN (Impressum / Datenschutz / AGB) ============ */
.legal-hero{ background:var(--dark); color:#fff; padding:64px 0 56px }
.legal-hero .back{
  display:inline-flex; align-items:center; gap:8px; color:var(--orange);
  text-decoration:none; font-size:15px; font-weight:600; margin-bottom:22px;
  transition:color .15s;
}
.legal-hero .back:hover{ color:#ffa558 }
.legal-hero h1{ font-size:clamp(32px,5vw,52px); font-weight:800; letter-spacing:-.022em }
.legal-body{ padding:64px 0 88px }
.legal-body .wrap{ max-width:820px }
.legal-block{ margin-bottom:38px }
.legal-block:last-child{ margin-bottom:0 }
.legal-block h2{ font-size:24px; font-weight:700; color:var(--nav-ink); letter-spacing:-.01em; margin-bottom:14px }
.legal-block h3{ font-size:18px; font-weight:700; color:var(--nav-ink); margin:20px 0 8px }
.legal-block p{ color:var(--muted); font-size:16px; line-height:1.7; margin-bottom:12px }
.legal-block p.addr{ color:var(--nav-ink); font-weight:500 }
.legal-block a{ color:var(--orange); text-decoration:none }
.legal-block a:hover{ text-decoration:underline; text-underline-offset:2px }
.legal-block ul{ padding-left:22px; margin:8px 0 }
.legal-block li{ color:var(--muted); font-size:16px; line-height:1.7; margin-bottom:10px }
.legal-block li strong{ color:var(--nav-ink) }

/* ============ GRÜNDER-SEITE ============ */
.founders-hero{ background:var(--dark); color:#fff; padding:72px 0 60px; text-align:center }
.founders-hero .back{
  display:inline-flex; align-items:center; gap:8px; color:var(--orange);
  text-decoration:none; font-size:15px; font-weight:600; margin-bottom:22px; transition:color .15s;
}
.founders-hero .back:hover{ color:#ffa558 }
.founders-hero h1{ font-size:clamp(34px,5vw,56px); font-weight:800; letter-spacing:-.022em }
.founders-hero p{ color:#aab4c6; font-size:18px; margin:16px auto 0; max-width:56ch }
.founders-body{ padding:72px 0 88px }
.founders-grid{ display:grid; grid-template-columns:1fr 1fr; gap:48px; max-width:980px; margin:0 auto }
.founder{ }
.founder .photo{
  aspect-ratio:1/1; border:1px solid var(--line-2); border-radius:18px; background:#f6f7f9;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  color:#aab1bd; overflow:hidden;
}
.founder .photo img{ width:100%; height:100%; object-fit:cover }
.founder .photo b{ font-size:16px; font-weight:600; color:#8a92a0 }
.founder .photo s{ text-decoration:none; font-size:13.5px }
.founder h2{ font-size:26px; font-weight:800; letter-spacing:-.01em; color:var(--nav-ink); margin-top:24px }
.founder .role{ color:var(--orange); font-weight:700; font-size:15.5px; margin-top:4px }
.founder .bio{
  margin-top:18px; background:#f8f9fa; border:1px solid var(--line-2); border-radius:14px;
  padding:22px 24px; color:var(--muted); font-size:16px; line-height:1.7;
}
.founders-back-cta{ text-align:center; margin-top:56px }
@media (max-width:760px){
  .founders-grid{ grid-template-columns:1fr; gap:40px }
}

/* ============ REISE / UNSER WEG (Timeline) ============ */
.journey-body{ padding:80px 0 96px }
.journey-intro{ text-align:center; max-width:680px; margin:0 auto 64px }
.journey-intro .eyebrow-l{ margin-bottom:10px }
.journey-intro p{ color:var(--muted); font-size:17.5px; line-height:1.7; margin-top:16px }

.timeline{ position:relative; max-width:880px; margin:0 auto; }
/* Mittellinie */
.timeline::before{
  content:""; position:absolute; left:50%; top:6px; bottom:6px; width:2px; margin-left:-1px;
  background:linear-gradient(180deg, transparent, var(--line) 6%, var(--line) 94%, transparent);
}
.tl-item{ position:relative; width:50%; padding:0 46px 56px; }
.tl-item:nth-child(odd){ left:0; text-align:right; }
.tl-item:nth-child(even){ left:50%; text-align:left; }
.tl-item:last-child{ padding-bottom:0 }
/* Punkt auf der Linie */
.tl-item::after{
  content:""; position:absolute; top:6px; width:16px; height:16px; border-radius:50%;
  background:var(--orange); border:4px solid #fff; box-shadow:0 0 0 2px var(--orange);
  z-index:1;
}
.tl-item:nth-child(odd)::after{ right:-8px }
.tl-item:nth-child(even)::after{ left:-8px }

.tl-year{
  display:inline-block; font-size:13px; font-weight:700; letter-spacing:.08em;
  color:var(--orange); background:var(--orange-soft); border-radius:100px; padding:5px 14px;
}
.tl-card{
  margin-top:14px; background:#fff; border:1px solid var(--line-2); border-radius:16px;
  padding:24px 26px; box-shadow:0 10px 30px rgba(15,23,42,.05); text-align:left;
  transition:transform .2s, box-shadow .2s, border-color .2s;
}
.tl-card:hover{ transform:translateY(-3px); box-shadow:0 18px 40px rgba(15,23,42,.09); border-color:#e2e6ec }
.tl-card h3{ font-size:19px; font-weight:700; letter-spacing:-.01em; color:var(--nav-ink) }
.tl-card p{ color:var(--muted); font-size:15px; line-height:1.65; margin-top:10px }

.journey-back-cta{ text-align:center; margin-top:72px }

/* animiert unterstrichene Schlüsselwörter (Scroll-Trigger) */
.kw{ position:relative; font-weight:600; color:inherit; white-space:nowrap; }
.kw::after{
  content:""; position:absolute; left:-2px; right:-2px; bottom:-3px; height:3px;
  border-radius:3px; background:var(--orange);
  transform:scaleX(0); transform-origin:left center;
  transition:transform .7s cubic-bezier(.22,1,.36,1);
}
.kw.in-view::after{ transform:scaleX(1); }
/* kräftiger bei großen Überschriften */
.h2 .kw::after{ height:5px; bottom:-1px; border-radius:4px; }
@media (prefers-reduced-motion: reduce){
  .kw::after{ transition:none; transform:scaleX(1); }
}

@media (max-width:680px){
  .timeline::before{ left:9px }
  .tl-item, .tl-item:nth-child(odd), .tl-item:nth-child(even){
    width:100%; left:0; text-align:left; padding:0 0 44px 38px;
  }
  .tl-item::after,
  .tl-item:nth-child(odd)::after, .tl-item:nth-child(even)::after{ left:1px; right:auto }
}


/* Deaktivierter "Unser Weg"-Button */
.founders-cta.is-disabled{ cursor:default; opacity:.6; pointer-events:none; }
.founders-cta .arr.soon{
  font-size:.78rem; font-weight:600; white-space:nowrap; letter-spacing:.02em;
  color:#fff; background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.35);
  padding:.28em .7em; border-radius:999px;
}