/* ============================================================
   manibase · site.css — One-Pager
   Marke aus tokens.css. Bewusst editorial/technisch, kein Template-Look.
   ============================================================ */

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:clip;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}

body{
  margin:0;
  overflow-x:clip;
  background:var(--color-background);
  color:var(--color-text-primary);
  font-family:var(--font-body);
  font-size:var(--t-body);
  line-height:var(--lh-relaxed);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block;height:auto;}
[hidden]{display:none !important;} /* schlägt display-setzende Klassen (.btn, flex/grid) */
a{color:var(--color-primary);text-underline-offset:3px;}
:focus-visible{outline:none;box-shadow:var(--shadow-focus);border-radius:4px;}

.skip-link{
  position:absolute;left:-999px;top:0;z-index:var(--z-overlay);
  background:var(--color-ink);color:#fff;padding:12px 18px;border-radius:0 0 8px 0;
  font-weight:var(--fw-semibold);
}
.skip-link:focus{left:0;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* ---------- Layout primitives ---------- */
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:clamp(1.25rem,4vw,2.5rem);}
.section{padding-block:var(--section-y);}
.measure{max-width:var(--measure);}

/* ---------- Typography ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:12px;
  font-family:var(--font-body);font-size:var(--t-small);font-weight:var(--fw-semibold);
  letter-spacing:var(--ls-wider);text-transform:uppercase;color:var(--color-primary);
  margin:0 0 var(--space-5);
}
/* Maßlinien-Marker (technische Zeichnung) — bewusstes Marken-Element, sparsam */
.eyebrow::before{
  content:"";flex:none;width:30px;height:7px;
  border-left:1.5px solid currentColor;
  background:linear-gradient(currentColor,currentColor) 0 50%/100% 1.5px no-repeat;
}
.eyebrow.on-ink{color:var(--color-accent);}

h1,h2,h3{margin:0;color:var(--color-ink);font-family:var(--font-display);text-wrap:balance;}
.h-display{font-size:var(--t-display);font-weight:var(--fw-bold);line-height:var(--lh-tight);letter-spacing:var(--ls-tighter);}
/* Hero-Headline: bewusst ruhiger, max ~56px (Best Practice 48–56px) */
.h-hero{font-size:clamp(1.95rem, 1.2rem + 2.9vw, 3.5rem);font-weight:var(--fw-bold);line-height:1.1;letter-spacing:var(--ls-tighter);overflow-wrap:break-word;hyphens:auto;}
/* Wechselnder Begriff im Hero (gelber Akzent auf Dunkel) */
.rotator{display:inline-block;position:relative;}
.rotator__word{display:inline-block;color:var(--color-accent);transition:transform .4s var(--ease-out),opacity .4s var(--ease-out);will-change:transform,opacity;}
.rotator__word.is-out{transform:translateY(-0.4em);opacity:0;}
.rotator__word.is-pre{transition:none;transform:translateY(0.4em);opacity:0;}
.h1{font-size:var(--t-h1);font-weight:var(--fw-semibold);line-height:var(--lh-snug);letter-spacing:var(--ls-tight);}
.h2{font-size:var(--t-h2);font-weight:var(--fw-semibold);line-height:var(--lh-snug);letter-spacing:var(--ls-tight);}
.h3{font-size:var(--t-h3);font-weight:var(--fw-semibold);line-height:var(--lh-snug);}
.lead{font-size:var(--t-lead);line-height:var(--lh-normal);color:var(--color-text-secondary);text-wrap:pretty;}
.num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;}

/* Hand-pulled Marker (Golden Yellow Rule: gelbe Fläche, dunkler Text) */
.mark{
  color:var(--color-on-accent);font-weight:var(--fw-medium);
  padding:.03em .42em .12em;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20200%2040'%20preserveAspectRatio='none'%3E%3Cpath%20d='M2%208%20C40%204%2090%206%20140%205%20C176%204%20193%206%20197%2011%20C199%2019%20199%2027%20196%2033%20C191%2038%20150%2035%20100%2036%20C56%2037%2018%2036%205%2033%20C1%2026%201%2015%202%208%20Z'%20fill='%23F2D414'/%3E%3Cpath%20d='M8%2033%20C60%2038%20132%2037%20192%2032%20C156%2039%2090%2040%2018%2036%20C12%2035%208%2034%208%2033%20Z'%20fill='%23E3C00C'%20opacity='0.4'/%3E%3Cpath%20d='M12%2010%20C70%207%20134%209%20188%208'%20stroke='%23FFE873'%20stroke-width='2.5'%20fill='none'%20opacity='0.45'%20stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:center;background-size:100% 100%;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
}

/* ---------- Wordmark ---------- */
.wordmark{display:inline-flex;align-items:baseline;font-family:var(--font-display);font-weight:var(--fw-bold);letter-spacing:-0.04em;line-height:1;font-size:1.55rem;white-space:nowrap;text-decoration:none;}
.wordmark .mani{color:var(--cobalt-500);}
.wordmark .base{color:var(--warm-900);}
/* Punkt = kleiner Schlusspunkt auf der Grundlinie (Proportion aus Original-Logo: ~0.2em, Unterkante auf Baseline) */
.wordmark .dot{width:.2em;height:.2em;border-radius:50%;background:var(--yellow-400);margin-left:.04em;align-self:baseline;}
.wordmark.on-ink .mani,.wordmark.on-ink .base{color:var(--paper);}
/* Inline-Wortmarke in Fließtext/Überschrift: erbt Schriftgröße */
.wordmark--inline{font-size:inherit;letter-spacing:inherit;vertical-align:baseline;}

/* ---------- Buttons ---------- */
.btn{
  --bg:var(--color-primary);--fg:#fff;--bd:transparent;
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-family:var(--font-body);font-weight:var(--fw-semibold);font-size:0.975rem;
  padding:13px 22px;border-radius:11px;border:1.5px solid var(--bd);
  background:var(--bg);color:var(--fg);cursor:pointer;text-decoration:none;white-space:normal;text-align:center;max-width:100%;
  transition:background var(--dur-base) var(--ease-out),transform var(--dur-fast) var(--ease-out),border-color var(--dur-base) var(--ease-out);
}
.btn:hover{background:var(--color-primary-hover);}
.btn:active{transform:translateY(1px);}
.btn--secondary{--bg:transparent;--fg:var(--color-primary);--bd:var(--color-primary);}
.btn--secondary:hover{background:var(--cobalt-50);}
.btn--accent{--bg:var(--color-accent);--fg:var(--color-ink);--bd:transparent;}
.btn--accent:hover{background:var(--yellow-300);}
.btn--ghost-ink{--bg:transparent;--fg:var(--color-ink);--bd:rgba(20,34,79,.28);}
.btn--ghost-ink:hover{background:rgba(20,34,79,.06);}
.btn--ghost-paper{--bg:transparent;--fg:var(--paper);--bd:rgba(255,255,255,.45);}
.btn--ghost-paper:hover{background:rgba(255,255,255,.10);}
.btn .ic{width:18px;height:18px;flex:none;}

.btn-row{display:flex;flex-wrap:wrap;gap:14px;}

/* ---------- Header / Nav ---------- */
.site-header{
  position:sticky;top:0;z-index:var(--z-nav);
  background:rgba(248,244,236,.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--color-border);
}
.nav{display:flex;align-items:center;gap:clamp(16px,3vw,32px);padding-block:14px;}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;flex:none;}
.brand__signet{width:34px;height:34px;display:block;flex:none;}
.nav__links{display:flex;gap:clamp(18px,2.4vw,30px);margin-left:auto;}
.nav__links a{color:var(--color-text-primary);text-decoration:none;font-weight:var(--fw-medium);font-size:0.975rem;}
.nav__links a:hover{color:var(--color-primary);}
.nav__cta{margin-left:clamp(14px,2vw,26px);display:flex;align-items:center;gap:14px;}
.nav__toggle{display:none;}

/* ---------- Hero (Foto + Tiefblau-Duotone) ---------- */
.hero{position:relative;isolation:isolate;overflow:clip;color:var(--paper);}
.hero::before{ /* Foto, leicht entsättigt, damit die Tönung trägt */
  content:"";position:absolute;inset:0;z-index:-2;
  background:url("../assets/hero-hands.jpg") center 28%/cover no-repeat;
  filter:grayscale(.55) contrast(1.04) brightness(1.02);
}
.hero::after{ /* Marken-Tönung: Cobalt-Glow + Tiefblau-Wash + feines Bauplan-Raster */
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    repeating-linear-gradient(to right, rgba(255,255,255,.05) 0 1px, transparent 1px var(--grid-cell)),
    repeating-linear-gradient(to bottom, rgba(255,255,255,.05) 0 1px, transparent 1px var(--grid-cell)),
    radial-gradient(130% 100% at 16% 22%, rgba(47,63,219,.40), transparent 58%),
    linear-gradient(176deg, rgba(20,34,79,.90) 0%, rgba(20,34,79,.82) 40%, rgba(20,34,79,.96) 100%);
}
.hero__inner{
  position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  min-height:clamp(460px,66vh,640px);
  padding-block:clamp(3rem,2rem+5vw,5.5rem);
}
.hero__copy{max-width:none;}
.hero h1{margin:0 0 var(--space-5);color:var(--paper);}
.hero .lead{max-width:92ch;margin:0 auto var(--space-8);color:var(--warm-200);line-height:var(--lh-normal);}
/* Feste Satz-Umbrüche im Hero-Lead nur auf großen Screens; mobil natürlich umbrechen lassen */
.lead-br{display:none;}
@media (min-width:1040px){ .lead-br{display:inline;} }
.hero .btn-row{margin-bottom:var(--space-8);justify-content:center;}
.hero .trust{justify-content:center;}
.trust{display:flex;flex-wrap:wrap;gap:18px 22px;font-size:var(--t-small);color:var(--color-text-secondary);}
.trust span{display:inline-flex;align-items:center;gap:8px;}
.trust .ic{width:17px;height:17px;color:var(--color-primary);}
.trust .ic.ok{color:var(--success);}
.trust--on-media{color:var(--warm-200);}
.trust--on-media .ic{color:var(--warm-200);}
.trust--on-media .ic.ok{color:#fff;}

/* ---------- Gründer ---------- */
.founders__intro{max-width:46ch;margin-top:var(--space-4);}
.founders__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,30px);margin-top:clamp(28px,4vw,44px);}
.founder{display:flex;gap:20px;align-items:flex-start;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:clamp(20px,2.4vw,26px);box-shadow:var(--shadow-sm);}
.founder__photo{width:96px;height:96px;border-radius:50%;flex:none;object-fit:cover;box-shadow:0 0 0 1.5px var(--color-border);}
.founder__photo--mono{display:inline-flex;align-items:center;justify-content:center;background:var(--cobalt-500);color:#fff;font-family:var(--font-display);font-weight:var(--fw-semibold);font-size:1.5rem;letter-spacing:.02em;}
.founder__body{min-width:0;}
.founder__bio{overflow-wrap:break-word;}
.founder__name{font-size:var(--t-h3);overflow-wrap:break-word;}
.founder__role{font-family:var(--font-mono);font-size:.78rem;letter-spacing:.04em;color:var(--color-primary);text-transform:uppercase;margin:3px 0 10px;}
.founder__bio{font-size:.95rem;line-height:var(--lh-normal);color:var(--color-text-secondary);}
.founders__together{
  margin-top:clamp(24px,3.5vw,40px);position:relative;overflow:hidden;color:#fff;
  background:var(--color-primary) radial-gradient(130% 120% at 100% 0%, rgba(255,255,255,.14), transparent 56%);
  border-radius:var(--radius-xl);padding:clamp(28px,4vw,46px) clamp(26px,4vw,48px);box-shadow:var(--shadow-lg);
}
.founders__label{
  display:inline-flex;align-items:center;gap:11px;font-family:var(--font-mono);
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cobalt-200);
  margin-bottom:clamp(14px,2vw,20px);
}
.founders__label::before{content:"";width:26px;height:1.5px;background:currentColor;flex:none;}
.founders__claim{
  margin:0;font-family:var(--font-display);font-weight:var(--fw-medium);color:#fff;
  font-size:clamp(1.25rem,1rem+1.05vw,1.9rem);line-height:var(--lh-snug);letter-spacing:var(--ls-tight);
  max-width:none;text-wrap:pretty;
}
.founders__claim b{font-weight:var(--fw-bold);}

/* ---------- Wertband (unter Hero) ---------- */
.valueband{background:var(--color-background);}
.valueband__grid{display:grid;grid-template-columns:repeat(4,1fr);padding-block:clamp(26px,3.5vw,40px);}
.vstat{min-width:0;padding:4px clamp(18px,2.2vw,30px);border-left:1px solid var(--color-border-strong);}
.vstat:first-child{border-left:none;padding-left:0;}
.vstat b{display:block;font-family:var(--font-display);font-weight:var(--fw-bold);color:var(--color-ink);font-size:clamp(1.55rem,1.05rem+1.5vw,2.2rem);line-height:1.05;letter-spacing:-0.02em;margin-bottom:10px;}
.vstat span{font-size:.9rem;color:var(--color-text-secondary);line-height:var(--lh-normal);}

/* ---------- Prozess (So läuft ein Klartag) ---------- */
.process__head{margin-bottom:clamp(28px,4vw,46px);}
.process__head .lead{margin-top:var(--space-3);color:var(--color-text-secondary);max-width:54ch;}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:clamp(22px,3vw,32px);}
.step{position:relative;}
.step__n{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;background:var(--color-ink);color:#fff;font-family:var(--font-mono);font-weight:var(--fw-semibold);font-size:1.05rem;margin-bottom:16px;}
.step h3{margin-bottom:8px;}
.step p{font-size:.95rem;color:var(--color-text-secondary);line-height:var(--lh-normal);max-width:34ch;}
@media (min-width:881px){
  .step:not(:last-child)::after{content:"";position:absolute;top:22px;left:60px;right:-16px;height:2px;
    background:repeating-linear-gradient(to right,var(--color-border-strong) 0 6px,transparent 6px 13px);}
}

/* ---------- KI-Klartag (Angebot) ---------- */
.klartag{background:var(--color-ink);color:var(--color-text-on-ink);}
.klartag__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,64px);align-items:center;}
.klartag h2{color:#fff;max-width:16ch;}
.klartag .lead{color:var(--warm-200);max-width:44ch;margin-top:var(--space-5);}
.klartag ul{list-style:none;padding:0;margin:var(--space-8) 0 0;display:flex;flex-direction:column;gap:14px;}
.klartag li{display:flex;gap:12px;align-items:flex-start;color:var(--warm-100);font-size:1rem;line-height:var(--lh-normal);}
.klartag li .ic{width:20px;height:20px;flex:none;color:var(--color-accent);margin-top:3px;}
.ticket{background:var(--paper);color:var(--color-text-primary);border-radius:var(--radius-xl);padding:clamp(26px,3vw,38px);box-shadow:var(--shadow-lg);}
.ticket__price{display:flex;align-items:baseline;gap:10px;}
.ticket__price b{font-family:var(--font-display);font-weight:var(--fw-bold);font-size:clamp(2.5rem,1.8rem+3vw,3.5rem);color:var(--color-ink);letter-spacing:-0.03em;}
.ticket__price span{color:var(--color-text-secondary);font-size:.95rem;}
.ticket__note{font-size:.9rem;color:var(--color-text-secondary);margin:6px 0 0;}
.ampel{display:flex;gap:18px;margin:24px 0;padding:18px 0;border-block:1px solid var(--color-border);}
.ampel div{display:flex;flex-direction:column;align-items:center;gap:8px;flex:1;text-align:center;font-size:.78rem;color:var(--color-text-secondary);}
.ampel .light{width:22px;height:22px;border-radius:50%;}
.ampel .r{background:var(--error);} .ampel .y{background:var(--warning);} .ampel .g{background:var(--success);}
.ticket .btn{width:100%;margin-top:8px;}

/* ---------- Vertrauen ---------- */
.trust-sec__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:clamp(20px,3vw,32px);margin-top:clamp(28px,4vw,44px);}
.pillar h3{margin-bottom:8px;}
.pillar p{font-size:.96rem;color:var(--color-text-secondary);line-height:var(--lh-normal);margin:0;}
.pillar__mark{font-family:var(--font-mono);font-size:.8rem;color:var(--color-primary);margin-bottom:14px;display:block;}

/* ---------- Spotlight CTA ---------- */
.spotlight-cta{background:var(--color-accent);color:var(--color-ink);border-radius:var(--radius-xl);padding:clamp(36px,5vw,64px);display:flex;flex-wrap:wrap;gap:32px;align-items:center;}
.spotlight-cta h2{color:var(--color-ink);flex:1;min-width:280px;max-width:18ch;}
.spotlight-cta p{color:var(--color-ink);opacity:.82;max-width:42ch;margin:14px 0 0;}

/* ---------- Footer ---------- */
.site-footer{background:var(--color-ink);color:var(--warm-200);padding-block:clamp(40px,5vw,64px) 32px;}
.footer__top{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:32px;}
.footer__claim{color:var(--warm-300);font-size:.95rem;max-width:30ch;margin-top:14px;line-height:var(--lh-normal);}
.footer__h{font-family:var(--font-body);font-size:.72rem;font-weight:var(--fw-semibold);letter-spacing:.14em;text-transform:uppercase;color:var(--color-accent);margin:0 0 14px;}
.footer__col a{display:block;color:var(--warm-200);text-decoration:none;font-size:.95rem;margin-bottom:10px;}
.footer__col a:hover{color:#fff;}
.footer__bottom{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;margin-top:40px;padding-top:22px;border-top:1px solid rgba(255,255,255,.1);font-size:.82rem;color:var(--warm-400);}

/* ---------- Legal pages ---------- */
.legal{padding-block:clamp(3rem,2rem+4vw,5rem);}
.legal h1{margin-bottom:var(--space-8);}
.legal h2{font-size:var(--t-h3);margin:var(--space-10) 0 var(--space-3);}
.legal p,.legal li{font-size:1rem;line-height:var(--lh-relaxed);color:var(--color-text-primary);max-width:var(--measure);}
.legal a{color:var(--color-primary);}
.legal .ph{background:var(--yellow-100);padding:1px 6px;border-radius:4px;color:var(--warm-900);}
.legal .back{display:inline-block;margin-top:var(--space-12);}

/* Anker nicht unter dem Sticky-Header verstecken */
section[id]{scroll-margin-top:84px;}

/* ---------- Kennen Sie das? (Pain Points + Folge) ---------- */
.pains__head{max-width:78ch;margin-bottom:clamp(20px,3vw,32px);}
.pains__head .lead{margin-top:var(--space-3);max-width:none;}
/* Editoriale Reihen mit Haarlinien statt uniformem Karten-Raster */
.pains__list{list-style:none;margin:0;padding:0;display:grid;gap:0;}
.pain{min-width:0;display:grid;grid-template-columns:auto 1fr;gap:clamp(16px,2.4vw,26px);align-items:start;
  padding:clamp(20px,2.6vw,28px) 0;border-top:1px solid var(--color-border);}
.pain:last-child{border-bottom:1px solid var(--color-border);}
.pain__icon{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:12px;background:var(--cobalt-50);color:var(--color-primary);flex:none;}
.pain__icon svg{width:23px;height:23px;}
.pain__body h3{margin-bottom:6px;}
.pain__body p{font-size:1rem;color:var(--color-text-secondary);line-height:var(--lh-normal);max-width:64ch;}

/* Folge: Cobalt-Band (trägt die 30%-Cobalt-Geste), Konsequenzen betont; eine Gelb-Geste als Akzent */
.folge{margin-top:clamp(30px,4.5vw,52px);background:var(--color-primary);color:#fff;
  border-radius:var(--radius-xl);padding:clamp(30px,4.5vw,52px) clamp(26px,4vw,50px);box-shadow:var(--shadow-lg);
  display:grid;grid-template-columns:0.85fr 1.5fr;gap:clamp(24px,4vw,52px);align-items:start;}
.folge__lead{font-family:var(--font-display);font-weight:var(--fw-bold);color:#fff;
  font-size:clamp(1.5rem,1.1rem+1.5vw,2.3rem);line-height:var(--lh-snug);letter-spacing:var(--ls-tight);margin:0;text-wrap:balance;}
@media (max-width:760px){
  .folge{grid-template-columns:1fr;}
  .folge__lead{margin-bottom:clamp(6px,1.5vw,12px);}
}
.folge__list{list-style:none;margin:0;padding:0;display:grid;gap:clamp(18px,2.6vw,26px);}
.folge__list li{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;}
.folge__ic{width:24px;height:24px;flex:none;margin-top:6px;color:var(--cobalt-200);}
.folge__list p{margin:0;color:#fff;font-size:clamp(1.08rem,0.98rem+0.5vw,1.32rem);line-height:var(--lh-normal);max-width:62ch;}
.folge__list b{font-weight:var(--fw-semibold);}
.folge__sub{color:rgba(255,255,255,.78);}

/* ---------- So nehmen wir Ihnen das ab (Lösung / Checkliste) ---------- */
.solve{background:var(--color-surface-sunken);border-block:1px solid var(--color-border);}
.solve__head{max-width:58ch;margin-bottom:clamp(28px,4vw,44px);}
.solve__head .lead{margin-top:var(--space-3);}
.solve__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,34px) clamp(28px,4vw,48px);}
@media (max-width:640px){.solve__list{grid-template-columns:1fr;}}
.solve__item{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;}
.solve__check{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;background:var(--cobalt-50);color:var(--color-primary);flex:none;}
.solve__check svg{width:22px;height:22px;}
.solve__item h3{margin-bottom:6px;}
.solve__item p{font-size:.97rem;color:var(--color-text-secondary);line-height:var(--lh-normal);max-width:44ch;}
.solve__cta{display:flex;flex-wrap:wrap;align-items:center;gap:16px 22px;margin-top:clamp(30px,4vw,44px);}
.solve__hint{font-size:.95rem;color:var(--color-text-secondary);max-width:42ch;line-height:var(--lh-normal);}

/* ---------- Unsere Helden (zentrierter heller Balken, mobil swipebar) ---------- */
.heroes__intro{color:var(--color-text-secondary);max-width:58ch;margin-top:var(--space-3);}
.heroes__grid{list-style:none;margin:clamp(26px,3.5vw,40px) 0 0;padding:6px 2px 10px;
  display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  justify-content:safe center;scrollbar-width:thin;scrollbar-color:var(--color-border-strong) transparent;}
.heroes__grid::-webkit-scrollbar{height:8px;}
.heroes__grid::-webkit-scrollbar-thumb{background:var(--color-border-strong);border-radius:99px;}
.hcard{flex:0 0 clamp(200px,21vw,236px);scroll-snap-align:center;min-width:0;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-md);outline:none;cursor:pointer;}
.hcard:focus-visible{box-shadow:var(--shadow-focus),var(--shadow-lg);}
.hcard__media{position:relative;aspect-ratio:1/1;overflow:hidden;background:#fff;}
.hcard__media img{width:100%;height:100%;object-fit:cover;display:block;}
.hcard__info{position:absolute;inset:auto 0 0 0;background:rgba(47,63,219,.93);color:#fff;
  padding:18px 18px 20px;transform:translateY(101%);transition:transform var(--dur-slow) var(--ease-out);}
.hcard:hover .hcard__info,.hcard:focus .hcard__info,.hcard:focus-within .hcard__info{transform:translateY(0);}
.hcard__info p{font-size:.9rem;line-height:var(--lh-normal);text-wrap:pretty;}
.hcard__label{display:flex;flex-direction:column;gap:2px;padding:14px 18px 18px;}
.hcard__name{font-family:var(--font-display);font-weight:var(--fw-bold);font-size:1.18rem;color:var(--color-ink);}
.hcard__role{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;color:var(--color-primary);}

/* ---------- Warum manibase (Intro) ---------- */
.why__intro{margin:var(--space-4) 0 clamp(28px,3.5vw,40px);max-width:50ch;}

/* ---------- CTA-Band ---------- */
.ctaband{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:22px clamp(24px,4vw,48px);
  background:var(--color-ink);color:#fff;border-radius:var(--radius-xl);padding:clamp(28px,4vw,44px) clamp(26px,4vw,48px);}
.ctaband h2{color:#fff;max-width:20ch;}
.ctaband p{color:var(--warm-200);margin-top:8px;max-width:44ch;}
.ctaband .btn{flex:none;}

/* ---------- Timeline (So arbeiten wir) ---------- */
.tl{list-style:none;margin:clamp(28px,4vw,44px) 0 0;padding:0;max-width:760px;}
.tl__item{position:relative;display:grid;grid-template-columns:auto 1fr;gap:clamp(16px,2.4vw,28px);padding-bottom:clamp(22px,3vw,34px);}
.tl__item:last-child{padding-bottom:0;}
.tl__node{position:relative;display:flex;justify-content:center;}
.tl__num{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;
  background:var(--color-primary);color:#fff;font-family:var(--font-mono);font-weight:var(--fw-semibold);font-size:1.05rem;flex:none;z-index:1;}
.tl__item:not(:last-child) .tl__node::after{content:"";position:absolute;top:46px;bottom:calc(-1 * clamp(22px,3vw,34px));
  left:50%;transform:translateX(-50%);width:2px;background:var(--color-border-strong);}
.tl__card{padding-top:5px;min-width:0;}
.tl__card h3{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;margin-bottom:8px;}
.tl__meta{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.03em;text-transform:uppercase;color:var(--color-primary);
  background:var(--cobalt-50);padding:3px 9px;border-radius:var(--radius-pill);}
.tl__card p{font-size:.98rem;color:var(--color-text-secondary);line-height:var(--lh-normal);max-width:54ch;}
.tl__cta{margin-top:clamp(28px,4vw,40px);}

/* ---------- Termin / Calendly (heller Block, getrennt vom Footer) ---------- */
.booking{background:var(--color-surface-sunken);border-top:1px solid var(--color-border);padding-block:var(--section-y);}
.booking__head{max-width:60ch;margin-bottom:clamp(24px,3vw,36px);}
.booking__head .lead{margin-top:var(--space-3);}
.cal{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:clamp(12px,1.6vw,18px);box-shadow:var(--shadow-md);}
.calendly-inline-widget{min-width:0;width:100%;border-radius:var(--radius-lg);overflow:hidden;}
.cal__note{font-size:.9rem;color:var(--color-text-secondary);line-height:var(--lh-normal);margin:14px 6px 4px;}
.cal__alt{color:var(--color-primary);font-weight:var(--fw-medium);margin-left:6px;}

/* ---------- Wie funktioniert unsere KI-Hilfe ---------- */
.how{background:var(--color-surface-sunken);border-block:1px solid var(--color-border);}

/* ---------- Timeline-Inline-Link (Mehr zum KI-Klartag) ---------- */
.tl__link{display:inline-flex;align-items:center;gap:6px;margin-top:4px;color:var(--color-primary);font-weight:var(--fw-semibold);text-decoration:none;font-size:.95rem;}
.tl__link:hover{text-decoration:underline;}
.tl__link .ic{width:16px;height:16px;transition:transform var(--dur-base) var(--ease-out);}
.tl__link:hover .ic{transform:translateX(3px);}

/* ---------- Newsletter (Cobalt-Band, gelber Akzent auf Dunkel) ---------- */
.newsletter{background:var(--color-primary);color:#fff;}
.newsletter__inner{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,4vw,56px);align-items:center;padding-block:clamp(32px,4vw,52px);}
.newsletter__copy h2{color:#fff;max-width:20ch;}
.newsletter__copy p{color:rgba(255,255,255,.85);margin:10px 0 0;max-width:46ch;line-height:var(--lh-normal);}
.newsletter__row{display:flex;gap:12px;flex-wrap:wrap;}
.newsletter__form input[type=email]{flex:1 1 220px;min-width:0;border:1.5px solid rgba(255,255,255,.5);background:rgba(255,255,255,.12);color:#fff;border-radius:11px;padding:13px 16px;font:inherit;font-size:1rem;}
.newsletter__form input[type=email]::placeholder{color:rgba(255,255,255,.7);}
.newsletter__form input[type=email]:focus-visible{outline:none;border-color:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.3);}
.newsletter__form .btn{flex:none;}
.newsletter__note{font-size:.8rem;color:rgba(255,255,255,.72);margin:12px 0 0;line-height:var(--lh-normal);}
.newsletter__note a{color:#fff;}
.newsletter__ok{font-size:1rem;color:#fff;margin:0;font-weight:var(--fw-medium);max-width:52ch;line-height:var(--lh-normal);}

/* ---------- Qualifizierungs-Maske (Wizard) ---------- */
.js .wstep{display:none;}
.js .wstep.is-active{display:block;}
.js .wstep--contact.is-active{display:grid;}
.wizard{max-width:760px;}
.wizard__progress{display:flex;align-items:center;gap:14px;margin:0 0 clamp(20px,3vw,28px);}
.wizard__bar{flex:1;height:6px;border-radius:99px;background:var(--color-border);overflow:hidden;}
.wizard__bar-fill{display:block;height:100%;width:25%;background:var(--color-primary);border-radius:99px;transition:width var(--dur-base) var(--ease-out);}
.wizard__count{flex:none;font-family:var(--font-mono);font-size:.78rem;color:var(--color-text-secondary);white-space:nowrap;}
.wizard__count b{color:var(--color-ink);}
.wstep{border:0;margin:0;padding:0;min-width:0;}
.wstep--contact{gap:14px;}
.wstep__q{font-family:var(--font-display);font-weight:var(--fw-semibold);font-size:clamp(1.15rem,1rem+0.8vw,1.5rem);color:var(--color-ink);line-height:var(--lh-snug);padding:0;margin:0 0 clamp(16px,2.4vw,22px);}
.wstep__hint,.field__opt{font-family:var(--font-body);font-weight:var(--fw-regular);font-size:.8rem;color:var(--color-text-secondary);letter-spacing:0;}
.wstep__hint{display:inline-block;margin-left:6px;}

.qgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;}
.qcard{position:relative;display:flex;flex-direction:column;gap:4px;justify-content:center;
  background:var(--color-surface);border:1.5px solid var(--color-border);border-radius:var(--radius-md);
  padding:16px 18px;cursor:pointer;
  transition:border-color var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out),background var(--dur-base) var(--ease-out);}
.qcard:hover{border-color:var(--color-border-strong);box-shadow:var(--shadow-sm);}
.qcard input{position:absolute;opacity:0;width:0;height:0;}
.qcard__t{font-family:var(--font-display);font-weight:var(--fw-semibold);font-size:1rem;color:var(--color-ink);}
.qcard__d{font-size:.85rem;color:var(--color-text-secondary);line-height:var(--lh-normal);}
.qcard:has(input:checked){border-color:var(--color-primary);background:var(--cobalt-50);box-shadow:0 0 0 1px var(--color-primary);}
.qcard:has(input:focus-visible){box-shadow:var(--shadow-focus);}

.field{display:flex;flex-direction:column;gap:6px;}
.field label{font-size:.85rem;font-weight:var(--fw-semibold);color:var(--color-ink);}
.field input{border:1.5px solid var(--color-border);background:var(--color-surface);border-radius:10px;padding:12px 14px;font:inherit;font-size:1rem;color:var(--color-text-primary);min-width:0;}
.field input:focus-visible{outline:none;border-color:var(--color-primary);box-shadow:var(--shadow-focus);}
.field input[aria-invalid=true]{border-color:var(--error);}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:.88rem;color:var(--color-text-secondary);line-height:var(--lh-normal);margin-top:4px;}
.consent input{margin-top:3px;flex:none;width:18px;height:18px;accent-color:var(--color-primary);}
.consent a{color:var(--color-primary);}

.wizard__nav{display:flex;gap:12px;flex-wrap:wrap;margin-top:clamp(20px,3vw,28px);}
.wizard__back{margin-right:auto;}
.wizard__err{color:var(--error);font-size:.92rem;font-weight:var(--fw-medium);margin:14px 0 0;}

.cal__intro{font-size:1.02rem;color:var(--color-ink);margin:2px 4px 16px;}
.cal__embed{min-height:680px;width:100%;border-radius:var(--radius-lg);overflow:hidden;}

/* ---------- Blog ---------- */
.blog__head{max-width:60ch;margin-bottom:clamp(28px,4vw,44px);}
.blog__head .lead{margin-top:var(--space-3);}
.blog__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:clamp(20px,3vw,28px);}
.postcard{position:relative;display:flex;flex-direction:column;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);transition:box-shadow var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out);}
.postcard:hover{box-shadow:var(--shadow-md);transform:translateY(-3px);}
.postcard__body{padding:clamp(20px,2.4vw,26px);display:flex;flex-direction:column;gap:10px;flex:1;}
.postcard__meta{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.04em;text-transform:uppercase;color:var(--color-primary);}
.postcard__title{font-family:var(--font-display);font-weight:var(--fw-semibold);font-size:1.3rem;color:var(--color-ink);line-height:var(--lh-snug);margin:0;}
.postcard__title a{color:inherit;text-decoration:none;}
.postcard__title a::after{content:"";position:absolute;inset:0;}
.postcard__excerpt{font-size:.95rem;color:var(--color-text-secondary);line-height:var(--lh-normal);margin:0;}
.postcard__more{margin-top:auto;color:var(--color-primary);font-weight:var(--fw-semibold);font-size:.95rem;display:inline-flex;align-items:center;gap:6px;}

/* Blog-Artikel */
.post{padding-block:clamp(2.5rem,2rem+3vw,4.5rem);}
.post__header{max-width:var(--measure);margin-bottom:clamp(24px,3vw,36px);}
.post__meta{font-family:var(--font-mono);font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:var(--color-primary);margin-bottom:14px;}
.post__title{font-size:var(--t-h1);line-height:var(--lh-snug);letter-spacing:var(--ls-tight);}
.post__lead{font-size:var(--t-lead);color:var(--color-text-secondary);margin-top:16px;line-height:var(--lh-normal);}
.post__body{max-width:var(--measure);}
.post__body h2{font-size:var(--t-h3);margin:clamp(28px,4vw,40px) 0 var(--space-3);}
.post__body p,.post__body li{font-size:1.05rem;line-height:var(--lh-relaxed);color:var(--color-text-primary);}
.post__body p{margin:0 0 var(--space-5);}
.post__body ul{margin:0 0 var(--space-5);padding-left:1.2em;}
.post__body li{margin-bottom:8px;}
.post__cta{margin-top:clamp(28px,4vw,40px);}
.post__back{display:inline-block;margin-bottom:var(--space-8);font-size:.92rem;}

/* ---------- Reveal motion ---------- */
.reveal{opacity:0;transform:translateY(16px);transition:opacity var(--dur-slow) var(--ease-out),transform var(--dur-slow) var(--ease-out);}
.reveal.is-in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none;}
}

/* ---------- Responsive ---------- */
@media (max-width:880px){
  .founders__grid{grid-template-columns:1fr;}
  .valueband__grid{grid-template-columns:1fr 1fr;gap:26px 30px;}
  .vstat{border-left:none;padding-left:0;padding-right:0;}
  .klartag__grid{grid-template-columns:1fr;}
  .footer__top{grid-template-columns:1fr 1fr;}
  .newsletter__inner{grid-template-columns:1fr;gap:22px;}
  .nav__links{display:none;}
  .nav__toggle{display:inline-flex;}
}
@media (max-width:560px){
  .nav__cta .btn-label-long{display:none;}
  .valueband__grid{grid-template-columns:1fr;gap:22px;}
  .hero .btn-row{flex-direction:column;align-items:stretch;width:100%;}
  .ctaband .btn,.tl__cta .btn{width:100%;}
  .ctaband{flex-direction:column;align-items:flex-start;}
  .footer__top{grid-template-columns:1fr;}
  .spotlight-cta{flex-direction:column;align-items:flex-start;}
  .founder{flex-direction:column;}
}
@media (max-width:480px){
  /* Logo + Hamburger reichen; CTA steckt im Menü */
  .nav__cta{display:none;}
}

/* Mobile-Menü (details/summary, kein JS nötig) */
.menu-mobile{display:none;}
@media (max-width:880px){
  .menu-mobile[open]{display:block;}
  .menu-mobile{display:block;}
  .menu-mobile summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--color-border);border-radius:10px;}
  .menu-mobile summary::-webkit-details-marker{display:none;}
  .menu-mobile__panel{position:absolute;left:0;right:0;top:100%;background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:12px clamp(1.25rem,4vw,2.5rem) 20px;display:flex;flex-direction:column;gap:4px;box-shadow:var(--shadow-md);}
  .menu-mobile__panel a{padding:12px 4px;text-decoration:none;color:var(--color-text-primary);font-weight:var(--fw-medium);border-bottom:1px solid var(--color-border);}
}