/* ============================================================
   LONGEVITY (L8ngevity) — Longevity Klinik & VIP Members Club
   Design-System (eigene Marke)
   Fonts: Hanken Grotesk (Display/Body) · IBM Plex Mono (Labels)
   ============================================================ */

:root{
  /* Palette (Longevity) */
  --porcelain:#F6F3EE;
  --sand:#E8DCC7;
  --oak:#C9B08A;
  --greige:#A99E8C;
  --graphite:#4A4A4A;
  --ink:#16181A;
  --gold:#B08A46;
  --foil:#CBA85C;
  --antique:#8A6A2F;

  --bg:var(--porcelain);
  --fg:var(--ink);
  --line:rgba(22,24,26,.14);
  --line-soft:rgba(22,24,26,.08);

  --mono:"IBM Plex Mono",ui-monospace,monospace;
  --sans:"Hanken Grotesk",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --ui:"Syne",var(--sans);

  --wrap:1240px;
  --pad:6vw;
  --ease:cubic-bezier(.22,.61,.36,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}

body{
  font-family:var(--sans);
  background:var(--bg);
  color:var(--fg);
  font-size:clamp(1rem,.55rem + .6vw,1.125rem);
  line-height:1.6;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

.wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad);width:100%}

/* ---------- Typography helpers ---------- */
.mono{font-family:var(--mono);font-weight:400;letter-spacing:.14em;text-transform:uppercase;font-size:.72rem}
.gold{color:var(--gold)}
.muted{color:var(--greige)}
.eyebrow{
  font-family:var(--mono);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--antique);display:flex;align-items:center;gap:.9rem;margin-bottom:1.6rem;
}
.eyebrow i{display:inline-block;width:34px;height:1px;background:var(--gold);opacity:.7}
.eyebrow.light{color:var(--foil)}
.eyebrow.light i{background:var(--foil)}

.big{
  font-size:clamp(2rem,1.1rem + 4.4vw,4.6rem);
  line-height:1.04;letter-spacing:-.02em;font-weight:500;
}
.light{color:var(--porcelain)}
.lead{font-size:clamp(1.05rem,.9rem + .7vw,1.4rem);line-height:1.55;font-weight:400;color:var(--graphite);max-width:56ch}
.dark .lead{color:rgba(246,243,238,.75)}

/* ---------- Buttons ---------- */
.btn{
  font-family:var(--ui);font-weight:600;font-size:.95rem;letter-spacing:.01em;text-transform:none;
  padding:.9rem 1.6rem;border:1.5px solid var(--ink);display:inline-flex;align-items:center;gap:.5rem;
  transition:background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease),transform .25s var(--ease),box-shadow .25s var(--ease);
  cursor:pointer;white-space:nowrap;border-radius:100px;background:transparent;color:var(--ink);
}
.btn span{transition:transform .25s var(--ease)}
.btn:hover span{transform:translateX(4px)}
.btn-solid{background:var(--ink);color:var(--porcelain);border-color:var(--ink);box-shadow:0 12px 26px -14px rgba(22,24,26,.55)}
.btn-solid:hover{background:var(--gold);border-color:var(--gold);color:var(--ink);transform:translateY(-2px)}
.btn-ghost:hover{background:var(--ink);color:var(--porcelain)}
.btn.wide{width:100%;justify-content:center;padding:1.05rem}
.dark .btn-ghost{border-color:var(--porcelain);color:var(--porcelain)}
/* Sekundär-Button: Textstil mit Gold-Unterstrich */
.btn-text{border:0;border-radius:0;background:none;padding:.5rem 0;color:var(--ink);position:relative;font-weight:600;box-shadow:none}
.btn-text::after{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--gold);transform:scaleX(.4);transform-origin:left;transition:transform .3s var(--ease)}
.btn-text:hover{transform:none}
.btn-text:hover::after{transform:scaleX(1)}
.dark .btn-text{color:var(--porcelain)}

/* ---------- NAV (Redesign) ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:1000;padding:0 var(--pad);
  border-bottom:1px solid transparent;
  transition:background .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease)}
.nav.scrolled{background:rgba(246,243,238,.82);
  -webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5);
  border-bottom-color:var(--line);box-shadow:0 8px 30px -22px rgba(22,24,26,.5)}
.nav-in{max-width:var(--wrap);margin:0 auto;height:78px;display:flex;align-items:center;justify-content:space-between;transition:height .3s var(--ease)}
.nav.scrolled .nav-in{height:62px}
.brand{display:inline-flex;align-items:center;gap:.55rem;color:var(--ink)}
.brand-mark{height:34px;width:34px;display:block;border-radius:7px;transition:height .3s var(--ease),width .3s var(--ease)}
.brand-word{font-family:var(--ui);font-weight:800;letter-spacing:.02em;font-size:1.3rem;line-height:1;color:var(--ink)}
.nav.scrolled .brand-mark{height:30px;width:30px}
.nav-links{display:flex;align-items:center;gap:2.4rem}
.nav-links a:not(.btn){font-family:var(--ui);font-weight:500;font-size:1rem;letter-spacing:0;color:var(--graphite);position:relative;padding:.3rem 0;transition:color .2s var(--ease)}
.nav-links a:not(.btn)::after{content:"";position:absolute;left:0;bottom:-3px;height:2px;width:0;background:var(--gold);transition:width .3s var(--ease)}
.nav-links a:not(.btn):hover{color:var(--ink)}
.nav-links a:not(.btn):hover::after{width:100%}
.nav-cta{padding:.62rem 1.25rem}
.burger{display:none;flex-direction:column;gap:6px;background:none;border:0;cursor:pointer;padding:8px}
.burger span{width:26px;height:2px;background:var(--ink);transition:.3s var(--ease)}
.burger[aria-expanded="true"] span:first-child{transform:translateY(8px) rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{transform:translateY(-8px) rotate(-45deg)}

/* ---------- HERO ---------- */
.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding-top:120px;padding-bottom:200px;overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(120% 90% at 78% 8%,rgba(203,168,92,.30),transparent 55%),
    radial-gradient(100% 80% at 10% 100%,rgba(201,176,138,.35),transparent 60%),
    linear-gradient(160deg,#efe8dc 0%,var(--porcelain) 40%,#efe6d6 100%);
}
.hero-bg::after{/* slow drifting gold sheen */
  content:"";position:absolute;inset:-20%;
  background:radial-gradient(40% 40% at 50% 50%,rgba(176,138,70,.14),transparent 70%);
  animation:drift 18s var(--ease) infinite alternate;
}
@keyframes drift{from{transform:translate(-8%,-4%) scale(1)}to{transform:translate(10%,6%) scale(1.15)}}
.grain{position:absolute;inset:0;z-index:1;opacity:.05;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
.hero-in{position:relative;z-index:2}
.hero-h1{font-size:clamp(2.4rem,1rem + 6.4vw,6.2rem);line-height:1.02;letter-spacing:-.03em;font-weight:500;margin:0 0 1.6rem;max-width:18ch}
.hero-lead{max-width:52ch;color:var(--graphite);font-size:clamp(1.05rem,.9rem + .7vw,1.35rem)}
.hero-cta{display:flex;gap:1rem;flex-wrap:wrap;margin:2.2rem 0 1.4rem}
.hero-open{font-family:var(--mono);font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--antique)}
.hero-cards{position:absolute;left:0;right:0;bottom:36px;z-index:2;display:flex;gap:18px;flex-wrap:wrap}
.glass-card{
  flex:1 1 220px;min-width:200px;padding:20px;
  background:rgba(246,243,238,.35);border:.5px solid rgba(255,255,255,.5);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  box-shadow:0 30px 60px -30px rgba(22,24,26,.4);
}
.glass-card .mono{color:var(--antique);display:block;margin-bottom:.7rem}
.glass-card b{display:block;font-size:2rem;font-weight:500;letter-spacing:-.02em;line-height:1}
.glass-card small{display:block;margin-top:.5rem;color:var(--graphite);font-size:.85rem}

/* ---------- TICKER ---------- */
.ticker{border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;background:var(--sand)}
.ticker-row{display:flex;gap:2rem;white-space:nowrap;padding:14px 0;font-family:var(--mono);text-transform:uppercase;letter-spacing:.18em;font-size:.8rem;color:var(--antique);animation:marq 26s linear infinite;width:max-content}
.ticker-row i{color:var(--gold)}
@keyframes marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- SECTION base ---------- */
.section{padding:clamp(5rem,3rem + 8vw,9rem) 0;position:relative}
.section.tight{padding-top:clamp(3rem,2rem + 4vw,5rem)}
.section.dark{background:var(--ink);color:var(--porcelain)}
.section.dark .big{color:var(--porcelain)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:3rem;margin-top:2.4rem}
h2.big{margin-bottom:.4rem}

/* ---------- PRINCIPLES ---------- */
.principles{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line);margin-top:2rem}
.principle{padding:2.4rem 2rem 2.4rem 0;border-right:1px solid var(--line)}
.principle:last-child{border-right:0}
.principle .num{color:var(--gold);display:block;margin-bottom:1.4rem}
.principle h3{font-size:clamp(1.4rem,1rem + 1.4vw,2rem);font-weight:500;letter-spacing:-.02em;line-height:1.1;margin-bottom:.9rem}
.principle p{color:var(--graphite);max-width:34ch}

/* ---------- RAUM ---------- */
.raum-head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap;margin-top:1rem}
.raum-meta{display:flex;gap:2.5rem}
.raum-meta b{display:block;font-size:clamp(1.6rem,1rem + 2vw,2.6rem);font-weight:500;letter-spacing:-.02em;line-height:1}
.raum-meta .mono{color:var(--antique);margin-top:.5rem;display:block}
.gallery{display:flex;gap:8px;height:64vh;min-height:420px;margin-top:3rem;padding:0 var(--pad)}
.slot{position:relative;flex:1;overflow:hidden;transition:flex-grow .55s var(--ease);cursor:pointer}
.slot:hover{flex-grow:3.2}
.slot span{position:absolute;left:18px;bottom:18px;z-index:2;color:var(--porcelain);letter-spacing:.14em}
.slot::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(22,24,26,.55))}
.slot.s1{background:linear-gradient(150deg,#cdb891,#a98f66)}
.slot.s2{background:linear-gradient(150deg,#d8c6a6,#b49a6f)}
.slot.s3{background:linear-gradient(150deg,#bfa77f,#8a6a2f)}
.slot.s4{background:linear-gradient(150deg,#e0d3ba,#c1a97f)}
.slot.s5{background:linear-gradient(150deg,#c7b490,#9c8460)}

/* ---------- AUSWERTUNG (dark USP) ---------- */
.board{display:flex;flex-wrap:wrap;gap:.6rem;margin:2.4rem 0 1rem}
.chip{border:1px solid rgba(246,243,238,.28);padding:.55rem .9rem;color:var(--porcelain);letter-spacing:.1em}
.gold-chip{border-color:var(--gold);color:var(--foil)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid rgba(246,243,238,.2);margin-top:2.6rem}
.step{padding:2.2rem 1.6rem 2.2rem 0;border-right:1px solid rgba(246,243,238,.16)}
.step:last-child{border-right:0}
.step .num{color:var(--foil);display:block;margin-bottom:1.1rem}
.step h4{font-size:1.2rem;font-weight:600;margin-bottom:.7rem;letter-spacing:-.01em}
.step p{color:rgba(246,243,238,.68);font-size:.95rem}

/* ---------- LAYERS (5 Ebenen) ---------- */
.layers{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line);margin-top:2rem}
.layer{padding:2.2rem 1.4rem 2.2rem 0;border-right:1px solid var(--line)}
.layer:last-child{border-right:0}
.layer .num{width:2.2rem;height:2.2rem;border:1px solid var(--gold);color:var(--gold);display:flex;align-items:center;justify-content:center;border-radius:50%;margin-bottom:1.2rem;font-size:.8rem}
.layer h4{font-size:1.15rem;font-weight:600;margin-bottom:.6rem}
.layer p{color:var(--graphite);font-size:.92rem}

/* ---------- LEISTUNGEN GRID ---------- */
.grid-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:2.4rem}
.gcard{background:var(--bg);padding:2rem 1.6rem;transition:background .3s var(--ease)}
.gcard:hover{background:var(--sand)}
.gcard h4{font-size:1.1rem;font-weight:600;margin-bottom:.7rem;letter-spacing:-.01em}
.gcard p{color:var(--graphite);font-size:.92rem}
.gcard .foot{display:block;margin-top:.5rem;font-family:var(--mono);font-size:.66rem;letter-spacing:.08em;color:var(--greige);text-transform:uppercase}

/* ---------- INTEGRATION / INCLUDED ---------- */
.integration{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
.incl-h{color:var(--antique);margin:0 0 1rem;padding-top:1.4rem;border-top:1px solid var(--line)}
.incl-h:first-child{padding-top:0;border-top:0}
.ticks{list-style:none;display:grid;gap:.6rem;margin-bottom:2rem}
.ticks li{position:relative;padding-left:1.6rem;color:var(--graphite)}
.ticks li::before{content:"";position:absolute;left:0;top:.6em;width:8px;height:8px;background:var(--gold)}
.ticks.alt li::before{background:var(--greige)}

/* ---------- PREISE ---------- */
.plans{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(246,243,238,.14);border:1px solid rgba(246,243,238,.14);margin-top:2.6rem}
.plan{background:var(--ink);padding:2.2rem 1.6rem;display:flex;flex-direction:column;transition:background .3s var(--ease)}
.plan:hover{background:#1e2124}
.plan .tier{color:var(--foil);letter-spacing:.24em;margin-bottom:1.4rem}
.plan .price{font-family:var(--mono);font-size:1.9rem;color:var(--porcelain);letter-spacing:-.01em;margin-bottom:1.2rem;font-weight:500}
.plan .price small{font-size:.8rem;color:rgba(246,243,238,.5);letter-spacing:0}
.plan-desc{color:rgba(246,243,238,.7);font-size:.92rem}
.plan.featured{background:var(--porcelain)}
.plan.featured .tier{color:var(--antique)}
.plan.featured .price{color:var(--ink)}
.plan.featured .price small{color:var(--greige)}
.plan.featured .plan-desc{color:var(--graphite)}
.plan.featured{box-shadow:0 0 0 1px var(--gold),0 24px 60px -20px rgba(176,138,70,.5)}
.founding{display:flex;justify-content:space-between;align-items:center;gap:2rem;flex-wrap:wrap;
  margin-top:2.4rem;padding:2.2rem;border:1px solid rgba(246,243,238,.2);background:rgba(246,243,238,.03)}
.founding h3{font-size:clamp(1.4rem,1rem + 1.4vw,2rem);font-weight:500;margin:.8rem 0 .6rem;letter-spacing:-.02em}
.founding .chip{display:inline-block}

/* ---------- ZUGEHÖRIGKEIT ---------- */
.belong{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);margin-top:2rem}
.belong>div{padding:2.2rem 1.4rem 2.2rem 0;border-right:1px solid var(--line)}
.belong>div:last-child{border-right:0}
.belong .num{color:var(--gold);display:block;margin-bottom:1.1rem}
.belong h4{font-size:1.1rem;font-weight:600;margin-bottom:.6rem}
.belong p{color:var(--graphite);font-size:.92rem}

/* ---------- BEWERBUNG ---------- */
.cta-sec{background:linear-gradient(160deg,#efe8dc,var(--porcelain))}
.cta-in{max-width:760px}
.apply{margin-top:2.4rem;max-width:640px}
.apply .row{display:flex;gap:1rem;margin-bottom:1rem}
.apply input,.apply select{
  flex:1;width:100%;font-family:var(--sans);font-size:1rem;color:var(--ink);
  background:rgba(255,255,255,.6);border:1px solid var(--line);padding:.95rem 1rem;border-radius:0;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:border-color .2s}
.apply input:focus,.apply select:focus{outline:0;border-color:var(--gold)}
.apply input::placeholder{color:var(--greige)}
.form-note{margin-top:1rem;color:var(--antique);letter-spacing:.06em;text-transform:none;font-size:.7rem}

/* ---------- FOOTER ---------- */
.ftr{background:var(--ink);color:var(--porcelain);padding:4rem 0 2rem}
.ftr-in{display:flex;justify-content:space-between;gap:3rem;flex-wrap:wrap;padding-bottom:3rem;border-bottom:1px solid rgba(246,243,238,.14)}
.ftr .brand-word{color:var(--porcelain)}
.brand-lockup{display:block;width:min(420px,64%);height:auto;margin:1.4rem 0 .6rem;mix-blend-mode:darken}
.ftr-brand .mono{color:rgba(246,243,238,.55);margin-top:1rem;line-height:1.7;letter-spacing:.08em;text-transform:none}
.ftr-cols{display:flex;gap:3.5rem;flex-wrap:wrap}
.ftr-cols h5{color:var(--foil);margin-bottom:1rem;letter-spacing:.18em}
.ftr-cols a{display:block;color:rgba(246,243,238,.7);padding:.25rem 0;font-size:.9rem;transition:color .2s}
.ftr-cols a:hover{color:var(--porcelain)}
.ftr-bot{display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap;padding-top:1.6rem}
.ftr-bot .mono{color:rgba(246,243,238,.4);letter-spacing:.08em;text-transform:none;font-size:.72rem}
.ftr-bot .disclaimer{max-width:60ch;text-align:right}

/* ---------- REVEAL ---------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.08s}
.reveal.d2{transition-delay:.16s}
.reveal.d3{transition-delay:.24s}
.reveal.d4{transition-delay:.32s}
.reveal.d5{transition-delay:.4s}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  .hero-bg::after,.ticker-row{animation:none}
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1000px){
  .steps,.layers,.grid-cards,.plans,.belong{grid-template-columns:1fr 1fr}
  .principles{grid-template-columns:1fr}
  .principle{border-right:0;border-bottom:1px solid var(--line)}
  .principle:last-child{border-bottom:0}
  .layers .layer:nth-child(odd),.belong>div:nth-child(odd),.step:nth-child(odd){border-right:1px solid var(--line)}
  .step:nth-child(odd){border-right-color:rgba(246,243,238,.16)}
}
@media (max-width:760px){
  :root{--pad:5vw}
  .nav-links{position:fixed;inset:0;flex-direction:column;justify-content:center;gap:1.6rem;
    background:rgba(246,243,238,.96);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
    transform:translateY(-100%);transition:transform .45s var(--ease);z-index:-1}
  .nav-links.open{transform:none}
  .nav-links a{font-size:1rem}
  .burger{display:flex}
  .two-col,.integration{grid-template-columns:1fr;gap:1.6rem}
  .steps,.layers,.grid-cards,.plans,.belong{grid-template-columns:1fr}
  .step,.layer,.belong>div{border-right:0!important;border-bottom:1px solid var(--line)}
  .section.dark .step{border-bottom-color:rgba(246,243,238,.16)}
  .gallery{height:auto;flex-direction:column;padding:0 var(--pad)}
  .slot{height:180px;flex:none}
  .slot:hover{flex-grow:0}
  .apply .row{flex-direction:column}
  .hero-cards{position:static;margin-top:2.4rem}
  .ftr-bot .disclaimer{text-align:left}
}


/* ============================================================
   NEUE ELEMENTE (v2)
   ============================================================ */

/* Scroll-Fortschritt */
.progress{position:fixed;top:0;left:0;height:3px;width:0;z-index:2000;
  background:linear-gradient(90deg,var(--antique),var(--gold),var(--foil));
  box-shadow:0 0 12px rgba(176,138,70,.6);transition:width .1s linear}

/* Cursor-Glow (nur feine Zeiger) */
.cursor-glow{position:fixed;top:0;left:0;width:420px;height:420px;margin:-210px 0 0 -210px;
  border-radius:50%;pointer-events:none;z-index:900;opacity:0;transition:opacity .4s var(--ease);
  background:radial-gradient(circle,rgba(176,138,70,.16),rgba(176,138,70,0) 62%);
  mix-blend-mode:multiply}
body.has-cursor .cursor-glow{opacity:1}
@media (hover:none){.cursor-glow{display:none}}

/* Stat-Band mit Count-up */
.statband{background:var(--sand);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;padding-top:0;padding-bottom:0}
.stat{padding:clamp(2.6rem,1.6rem + 3vw,3.8rem) 2rem;border-right:1px solid var(--line)}
.stat:last-child{border-right:0}
.stat b{display:block;font-size:clamp(1.6rem,1rem + 1.7vw,2.4rem);font-weight:500;letter-spacing:-.02em;line-height:1.05;font-variant-numeric:tabular-nums;white-space:nowrap}
.stat .mono{display:block;margin-top:.7rem;color:var(--antique);letter-spacing:.05em;font-size:.64rem;min-height:2.6em;line-height:1.35;padding-right:.6rem}

/* Vergleich */
.compare{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:2.8rem}
.compare-col{background:var(--bg);padding:2.2rem 1.8rem}
.compare-col.ours{background:var(--ink);color:var(--porcelain)}
.chip-lite{display:inline-block;color:var(--greige);letter-spacing:.18em;margin-bottom:1.4rem}
.gold-lite{color:var(--foil)}
.clist{list-style:none;display:grid;gap:.85rem}
.clist li{position:relative;padding-left:2rem;line-height:1.4}
.clist.minus li{color:var(--graphite)}
.clist.minus li::before{content:"—";position:absolute;left:0;top:-.05em;color:var(--greige);font-weight:600}
.compare-col.ours .clist.plus li{color:var(--porcelain)}
.clist.plus li::before{content:"✓";position:absolute;left:0;top:0;color:var(--gold);font-weight:700}

/* Bio-Age Gauge */
.bioage{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.gauge{border:1px solid var(--line);background:linear-gradient(160deg,#fff,rgba(232,220,199,.4));padding:2.2rem}
.gauge-row{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:.6rem}
.gauge-row b{font-size:2.4rem;font-weight:500;letter-spacing:-.02em;line-height:1}
.gauge-row .mono{color:var(--graphite)}
.gauge-row.gold b{color:var(--gold)}
.gauge-row.gold .mono{color:var(--antique)}
.gauge-track{position:relative;height:8px;background:rgba(22,24,26,.1);margin:0 0 1.8rem;overflow:hidden}
.gauge-fill{position:absolute;left:0;top:0;height:100%;width:0;background:var(--greige);transition:width 1.1s var(--ease)}
.gauge-fill.gold-fill{background:linear-gradient(90deg,var(--antique),var(--gold),var(--foil))}
.reveal.in .gauge-fill{width:var(--to)}
.gauge-mark{position:absolute;top:50%;left:0;width:2px;height:18px;background:var(--ink);transform:translate(-50%,-50%);opacity:0;transition:opacity .6s .8s var(--ease)}
.reveal.in .gauge-mark{opacity:.5;left:var(--at)}
.gauge-note{margin-top:.4rem;color:var(--greige);letter-spacing:.08em;text-transform:none;font-size:.66rem}

/* FAQ Accordion */
.faq{margin-top:2rem;border-top:1px solid var(--line)}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item summary{list-style:none;cursor:pointer;padding:1.5rem 3rem 1.5rem 0;position:relative;
  font-size:clamp(1.1rem,.9rem+.7vw,1.4rem);font-weight:500;letter-spacing:-.01em;transition:color .2s}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);
  font-family:var(--mono);font-size:1.4rem;color:var(--gold);transition:transform .3s var(--ease)}
.faq-item[open] summary::after{content:"–";transform:translateY(-50%) rotate(180deg)}
.faq-item summary:hover{color:var(--gold)}
.faq-body{padding:0 3rem 1.6rem 0}
.faq-body p{color:var(--graphite);max-width:70ch}
.faq-item[open] .faq-body{animation:faqin .4s var(--ease)}
@keyframes faqin{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

@media (max-width:1000px){
  .stat-grid{grid-template-columns:1fr 1fr}
  .stat:nth-child(odd){border-right:1px solid var(--line)}
  .bioage{grid-template-columns:1fr;gap:2rem}
}
@media (max-width:760px){
  .stat-grid{grid-template-columns:1fr 1fr}
  .compare{grid-template-columns:1fr}
  .cursor-glow{display:none}
}

/* ============================================================
   v3 — Feinschliff
   ============================================================ */

/* Claim */
.claim{font-family:var(--ui);font-weight:600;font-style:italic;color:var(--gold);
  font-size:clamp(1.1rem,.8rem + 1vw,1.7rem);letter-spacing:.01em;line-height:1.5;
  margin:0 0 1rem;padding-bottom:.14em}
.claim-sm{font-family:var(--ui);font-style:italic;color:var(--foil);margin:.7rem 0 0;font-size:1.05rem}

/* Stat-Band: 5 Spalten + Wort-Stat */
.stat-grid{grid-template-columns:repeat(5,1fr)}
.stat b.word{font-size:clamp(1.6rem,1rem + 1.7vw,2.4rem);letter-spacing:-.01em}

/* Abstand Text ↔ Trennstrich */
.principle{padding-left:2rem}
.principles .principle:first-child{padding-left:0}
.steps .step{padding-left:1.9rem}
.steps .step:first-child{padding-left:0}
.layers .layer{padding-left:1.7rem}
.layers .layer:first-child{padding-left:0}
.belong>div{padding-left:1.7rem}
.belong>div:first-child{padding-left:0}

/* Epigenetik-Tags */
.tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.6rem}
.tag{border:1px solid var(--line);padding:.42rem .8rem;color:var(--antique);letter-spacing:.08em}

/* Über uns — Gründer */
.ueber-intro{margin-top:2.2rem}
.founders{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin-top:2.6rem}
.founder{display:flex;gap:1.2rem;align-items:flex-start;border:1px solid var(--line);padding:1.6rem;
  background:linear-gradient(160deg,#fff,rgba(232,220,199,.35))}
.ph-avatar{flex:none;width:62px;height:62px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-family:var(--ui);font-weight:700;font-size:1.1rem;color:var(--porcelain);
  background:linear-gradient(150deg,var(--gold),var(--antique));letter-spacing:.02em}
.founder h4{font-size:1.2rem;font-weight:600;margin-bottom:.15rem;letter-spacing:-.01em}
.founder .mono{color:var(--antique);margin-bottom:.6rem;display:block;text-transform:none;letter-spacing:.05em}
.founder p:last-child{color:var(--graphite);font-size:.95rem}
.badge-soft{display:inline-block;margin-left:.6rem;padding:.18rem .6rem;border:1px solid var(--line);
  color:var(--greige);letter-spacing:.12em;vertical-align:middle}

/* Über uns — internationales Board */
.roster{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.rcard{background:var(--bg);padding:1.6rem 1.4rem;display:flex;flex-direction:column;gap:.35rem;transition:background .3s var(--ease)}
.rcard:hover{background:var(--sand)}
.rcard .flag{color:var(--antique);letter-spacing:.1em}
.rcard h4{font-size:1.05rem;font-weight:600;letter-spacing:-.01em;margin-top:.2rem;line-height:1.2}
.rcard .mono{color:var(--graphite);font-size:.66rem;text-transform:none;letter-spacing:.04em}
.rcard .status{margin-top:auto;color:var(--gold);letter-spacing:.14em;font-size:.6rem;padding-top:.7rem}

/* Membership — Feature-Liste */
.plan-feat{list-style:none;margin:1.2rem 0 0;padding-top:1.2rem;border-top:1px solid rgba(246,243,238,.14);display:grid;gap:.55rem}
.plan-feat li{position:relative;padding-left:1.4rem;font-size:.86rem;color:rgba(246,243,238,.78);line-height:1.4}
.plan-feat li::before{content:"✓";position:absolute;left:0;top:0;color:var(--gold);font-weight:700;font-size:.8rem}
.plan.featured .plan-feat{border-top-color:rgba(22,24,26,.12)}
.plan.featured .plan-feat li{color:var(--graphite)}

@media (max-width:1000px){
  .stat-grid{grid-template-columns:repeat(3,1fr)}
  .principle{padding-left:0}
  .steps .step:nth-child(odd),.layers .layer:nth-child(odd),.belong>div:nth-child(odd){padding-left:0}
  .roster{grid-template-columns:repeat(2,1fr)}
  .founders{grid-template-columns:1fr}
}
@media (max-width:600px){
  .stat-grid{grid-template-columns:repeat(2,1fr)}
  .roster{grid-template-columns:1fr}
  .steps .step,.layers .layer,.belong>div{padding-left:0}
}

/* ============================================================
   v4 — Logo-Wortmarke im Menü, V-Initial, Logo-Wiederverwendung
   ============================================================ */

/* Menü-Logo (Wortmarke mit V-Haken) */
.brand-logo{height:30px;width:auto;display:block;transition:height .3s var(--ease)}
.nav.scrolled .brand-logo{height:26px}

/* V-Initial für Überschriften, die mit V beginnen */
.vcap{display:inline-block;height:.96em;width:auto;vertical-align:baseline;margin-right:.04em}

/* Logo-Wiederverwendung: dezente Wasserzeichen in dunklen Sektionen */
.section{overflow:hidden}
.wm{position:absolute;pointer-events:none;z-index:0;opacity:.06;width:min(460px,44vw);height:auto}
.wm-tr{top:-2.5rem;right:-3.5rem;transform:rotate(-8deg)}
.wm-bl{bottom:-3.5rem;left:-3.5rem;transform:rotate(6deg)}
.section.dark .wrap{position:relative;z-index:1}

/* Präsentes Siegel */
.seal{width:58px;height:auto;border-radius:12px;display:block;margin:0 0 1.6rem;
  box-shadow:0 14px 30px -14px rgba(22,24,26,.5)}

@media (max-width:760px){
  .brand-logo{height:26px}
  .wm{width:60vw;opacity:.05}
}




/* Prominentes Logo im Hero */
.hero-logo{width:78px;height:auto;border-radius:15px;display:block;margin:0 0 1.5rem;
  box-shadow:0 18px 38px -18px rgba(22,24,26,.55)}
@media (max-width:760px){ .hero-logo{width:64px} }






/* ============================================================
   MOBILE-FIXES (Overflow beseitigen)
   ============================================================ */
html,body{overflow-x:hidden;max-width:100%}
.eyebrow{flex-wrap:wrap}
.big,.hero-h1,.lead,.hero-lead,p,.faq-item summary,.plan-desc{overflow-wrap:break-word;word-break:break-word}

@media (max-width:600px){
  /* Stat-Band einspaltig stapeln */
  .stat-grid{grid-template-columns:1fr}
  .stat{padding:1.5rem 1.25rem;border-right:0;border-bottom:1px solid var(--line);min-width:0}
  .stat:last-child{border-bottom:0}
  .stat b{white-space:normal}
  .stat .mono{min-height:0;margin-top:.5rem}
}
@media (max-width:760px){
  /* „Der Ort": Kopf + Kennzahlen stapeln statt nebeneinander */
  .raum-head{flex-direction:column;align-items:flex-start;gap:1.5rem}
  .raum-meta{flex-wrap:wrap;gap:1.4rem 2rem}
  /* Board-Chips & Tags nicht überlaufen */
  .board,.tags{gap:.4rem}
}


/* ============================================================
   MOBILE-MENÜ (alles hinter Burger, nur bei Klick sichtbar)
   ============================================================ */
@media (max-width:760px){
  .burger{display:flex;position:relative;z-index:1002}
  .nav-links{
    position:fixed;inset:0;z-index:1001;
    flex-direction:column;justify-content:center;align-items:center;gap:1.9rem;
    background:rgba(246,243,238,.985);
    -webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);
    transform:none;
    opacity:0;visibility:hidden;pointer-events:none;
    transition:opacity .3s var(--ease),visibility .3s var(--ease);
  }
  .nav-links.open{opacity:1;visibility:visible;pointer-events:auto}
  .nav-links a:not(.btn){font-size:1.3rem}
  .nav-cta{padding:.9rem 1.8rem;font-size:.9rem}
}



/* ============================================================
   v5 — Rebrand Longevity: Logo_8 als dezentes Wasserzeichen
   ============================================================ */
.wm8{position:absolute;z-index:0;pointer-events:none;height:clamp(320px,52vh,600px);width:auto;
  opacity:.06;filter:saturate(1.05)}
.wm8-hero{top:10%;right:-2%}
.wm8-tr{top:-3rem;right:-2%}
.wm8-bl{bottom:-4rem;left:-2%}
.wm8-br{bottom:-4rem;right:-2%}
.section.dark .wm8{opacity:.10}
/* Inhalt immer über dem Wasserzeichen */
.section > .wrap{position:relative;z-index:1}
.cta-sec .cta-in{position:relative;z-index:1}
@media (max-width:760px){
  .wm8{height:300px;opacity:.05}
  .section.dark .wm8{opacity:.08}
}


/* ============================================================
   INTRO / PRELOADER — weiße Fläche · Wortmarke zoomt rein ·
   kurzer Satz · alles blendet aus · Seite erscheint
   ============================================================ */
.intro{
  position:fixed; inset:0; z-index:9999;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:1.7rem; background:#ffffff;
  /* Overlay blendet am Ende der Sequenz aus (auch ohne JS) */
  animation:introOut .85s var(--ease) 4.05s forwards;
}
.intro-mark{
  width:min(620px,74vw); height:auto;
  opacity:0; transform:scale(.72);
  animation:introMark 1.25s var(--ease) .25s both;
}
.intro-line{
  font-family:var(--ui);
  font-size:clamp(.85rem,.55rem + .8vw,1.1rem);
  letter-spacing:.3em; text-transform:uppercase; font-weight:500;
  color:var(--antique);
  opacity:0; transform:translateY(12px);
  animation:introLine .7s var(--ease) 1.35s both;
}
body.intro-active{overflow:hidden}

@keyframes introMark{
  0%{opacity:0; transform:scale(.72)}
  55%{opacity:1}
  100%{opacity:1; transform:scale(1)}
}
@keyframes introLine{
  0%{opacity:0; transform:translateY(12px)}
  100%{opacity:1; transform:translateY(0)}
}
@keyframes introOut{
  0%{opacity:1; visibility:visible}
  100%{opacity:0; visibility:hidden}
}

/* Reduzierte Bewegung: kein Intro */
@media (prefers-reduced-motion: reduce){
  .intro{display:none}
}


/* ---------- Scroll-to-Top-Button ---------- */
.to-top{
  position:fixed;
  right:clamp(1.1rem,3vw,2rem); bottom:clamp(1.1rem,3vw,2rem);
  z-index:200;
  width:48px; height:48px; border-radius:50%;
  display:grid; place-items:center;
  background:var(--ink); color:var(--porcelain);
  border:1px solid rgba(246,243,238,.16);
  cursor:pointer;
  box-shadow:0 8px 26px rgba(22,24,26,.24);
  opacity:0; transform:translateY(14px) scale(.9); pointer-events:none;
  transition:opacity .35s var(--ease), transform .35s var(--ease),
             background .25s var(--ease), color .25s var(--ease);
}
.to-top.show{ opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }
.to-top:hover{ background:var(--gold); color:#fff; }
.to-top:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }
.to-top svg{ width:20px; height:20px; display:block; }

@media (prefers-reduced-motion: reduce){
  .to-top{ transition:opacity .2s linear; transform:none; }
  .to-top.show{ transform:none; }
}