/* ============================================================
   Polarıx — shared styles (home + subpages)
   Strict black & white Swiss aesthetic.
   ============================================================ */
:root{
  --ink:#111113;
  --paper:#ffffff;
  --muted:#6b6b70;
  --hair:rgba(17,17,19,0.12);
  --hair-soft:rgba(17,17,19,0.07);
  --mono:'JetBrains Mono', ui-monospace, monospace;
  --sans:'Hanken Grotesk', system-ui, -apple-system, sans-serif;
}
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-weight:500;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
::selection{ background:var(--ink); color:var(--paper); }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }

/* ───────── home overlay top bar (fades in after the reveal) ───────── */
.topbar{
  position:fixed; top:0; left:0; right:0; z-index:60;
  display:flex; align-items:center; justify-content:space-between;
  padding:16px clamp(20px,5vw,64px);
  background:var(--paper); color:var(--ink);
  border-bottom:1px solid var(--hair);
  box-shadow:0 2px 16px rgba(17,17,19,.06);
  opacity:0; transform:translateY(-8px);
  transition:opacity .5s ease, transform .5s ease;
  pointer-events:none;
}
.topbar.show{ opacity:1; transform:none; pointer-events:auto; }
.topbar__brand{ font-weight:800; font-size:19px; letter-spacing:-.02em; }
.topbar__nav{ display:flex; gap:clamp(14px,3vw,32px); font-size:13.5px; font-weight:600; letter-spacing:.01em; align-items:center; }
.topbar__nav a{ opacity:.7; transition:opacity .25s; }
.topbar__nav a:hover{ opacity:1; }
.topbar .nav-toggle span{ background:var(--ink); }
@media (max-width:680px){
  .topbar .nav-toggle{ display:block; }
  .topbar__nav{
    position:absolute; top:100%; left:0; right:0;
    flex-direction:column; align-items:flex-start; gap:0;
    background:var(--paper); color:var(--ink);
    padding:6px clamp(20px,5vw,64px) 18px; border-bottom:1px solid var(--hair);
    transform:translateY(-8px); opacity:0; pointer-events:none; transition:opacity .25s ease, transform .25s ease;
  }
  .topbar.nav-open .topbar__nav{ transform:none; opacity:1; pointer-events:auto; }
  .topbar__nav a{ color:var(--ink) !important; opacity:1; width:100%; padding:13px 0; border-top:1px solid var(--hair-soft); font-size:16px; }
  .topbar__nav a:first-child{ border-top:none; }
  .topbar__nav a.is-cta{ margin-top:8px; border-radius:10px; }
}

/* ───────── hamburger toggle (shared) ───────── */
.nav-toggle{ display:none; width:28px; height:20px; position:relative; border:none; background:none; padding:0; cursor:pointer; flex:0 0 auto; }
.nav-toggle span{ position:absolute; left:0; right:0; height:2px; background:var(--ink); border-radius:2px; transition:transform .3s ease, opacity .2s ease; }
.nav-toggle span:nth-child(1){ top:0; }
.nav-toggle span:nth-child(2){ top:9px; }
.nav-toggle span:nth-child(3){ top:18px; }
.nav-open .nav-toggle span:nth-child(1){ transform:translateY(9px) rotate(45deg); }
.nav-open .nav-toggle span:nth-child(2){ opacity:0; }
.nav-open .nav-toggle span:nth-child(3){ transform:translateY(-9px) rotate(-45deg); }

/* ───────── solid header (subpages) ───────── */
.site-header{
  position:sticky; top:0; z-index:60;
  display:flex; align-items:center; justify-content:space-between;
  padding:16px clamp(20px,5vw,64px);
  background:rgba(255,255,255,0.86); backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--hair-soft);
}
.site-header__brand{ display:flex; align-items:center; }
.site-header__logo{ height:52px; width:auto; }
.site-header__nav{ display:flex; gap:clamp(14px,2.4vw,30px); align-items:center; font-size:14px; font-weight:600; }
.site-header__nav a{ color:#33333a; transition:color .2s; position:relative; }
.site-header__nav a:hover{ color:var(--ink); }
.site-header__nav a.is-active{ color:var(--ink); }
.site-header__nav a.is-active::after{ content:''; position:absolute; left:0; right:0; bottom:-6px; height:2px; background:var(--ink); border-radius:2px; }
.nav-cta{ padding:9px 16px; border:1px solid var(--ink); border-radius:999px; color:var(--ink) !important; transition:background .2s,color .2s; }
.nav-cta:hover{ background:var(--ink); color:var(--paper) !important; }
@media (max-width:720px){
  .site-header .nav-toggle{ display:block; }
  .site-header__nav{
    position:absolute; top:100%; left:0; right:0;
    flex-direction:column; align-items:flex-start; gap:0;
    background:rgba(255,255,255,0.98); backdrop-filter:saturate(140%) blur(10px);
    border-bottom:1px solid var(--hair);
    padding:6px clamp(20px,5vw,64px) 18px;
    transform:translateY(-8px); opacity:0; pointer-events:none; transition:opacity .25s ease, transform .25s ease;
  }
  .site-header.nav-open .site-header__nav{ transform:none; opacity:1; pointer-events:auto; }
  .site-header__nav a{ width:100%; padding:13px 0; border-top:1px solid var(--hair-soft); font-size:16px; }
  .site-header__nav a:first-child{ border-top:none; }
  .site-header__nav a.is-active::after{ display:none; }
  .nav-cta{ margin-top:8px; align-self:stretch; border-radius:10px; }
}

/* ───────── scroll cue (home) ───────── */
.scrollcue{
  position:fixed; left:50%; bottom:34px; transform:translateX(-50%);
  z-index:40; display:flex; flex-direction:column; align-items:center; gap:10px;
  font-family:var(--mono); font-size:11px; letter-spacing:.28em; text-transform:uppercase;
  color:var(--muted); opacity:0; transition:opacity .5s ease;
}
.scrollcue__line{ width:1px; height:46px; background:linear-gradient(var(--ink),transparent); position:relative; overflow:hidden; }
.scrollcue__line::after{ content:''; position:absolute; left:0; top:-50%; width:1px; height:50%; background:var(--ink); animation:cueDrop 1.8s ease-in-out infinite; }
@keyframes cueDrop{ 0%{ transform:translateY(0); } 60%,100%{ transform:translateY(200%); } }

/* ───────── hero (home autoplay reveal → centred stack) ───────── */
#hero{ position:relative; height:100vh; background:var(--paper); }
#hero-sticky{ position:sticky; top:0; height:100vh; width:100%; overflow:hidden; }
#hero-react{ position:absolute; inset:0; transform-origin:50% 50%; transition:transform 1s cubic-bezier(.22,.61,.36,1); }
#hero.is-done #hero-react{ transform:translateY(-30vh) scale(0.55); }
html.intro-lock, html.intro-lock body{ overflow:hidden; height:100%; touch-action:none; }

/* manifest: a centred column that settles directly BELOW the lockup once the reveal ends */
.herostage__manifest{ position:absolute; left:0; right:0; top:52%; z-index:5; display:flex; flex-direction:column; align-items:center; text-align:center; opacity:0; transform:translateY(22px); transition:opacity .8s ease .2s, transform .8s cubic-bezier(.22,.61,.36,1) .2s; pointer-events:none; }
.herostage__manifest.show{ opacity:1; transform:translateY(0); }
.herostage__inner{ display:flex; flex-direction:column; align-items:center; }
.herostage__manifest h1,.herostage__manifest h2{ font-weight:800; letter-spacing:-.035em; line-height:1.04; font-size:clamp(26px,4.2vw,56px); margin:0; }
.herostage__manifest h1 .dim,.herostage__manifest h2 .dim{ color:var(--muted); }
.herostage__desc{ max-width:40ch; font-size:clamp(17px,1.7vw,23px); line-height:1.5; color:var(--ink); margin:clamp(14px,2vh,22px) 0 0; }
.herostage__cta{ display:flex; gap:14px; margin-top:clamp(18px,2.4vh,28px); justify-content:center; flex-wrap:wrap; pointer-events:auto; }
.hbtn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:15px 32px; border-radius:999px; font-weight:700; font-size:16px; transition:transform .3s cubic-bezier(.22,.61,.36,1), background .2s, color .2s; }
.hbtn--solid{ background:var(--ink); color:var(--paper); }
.hbtn--ghost{ border:1.5px solid var(--ink); color:var(--ink); }
.hbtn:hover{ transform:translateY(-3px); }
.hbtn--ghost:hover{ background:var(--ink); color:var(--paper); }
@media (max-width:760px){
  #hero.is-done #hero-react{ transform:translateY(-32vh) scale(0.50); }
  .herostage__manifest{ top:46%; }
  .herostage__manifest h1,.herostage__manifest h2{ font-size:clamp(24px,7vw,40px); }
  .hbtn{ padding:13px 26px; font-size:15px; }
}

/* ───────── generic layout ───────── */
.wrap{ max-width:1240px; margin:0 auto; padding:0 clamp(20px,5vw,64px); }
.wrap--narrow{ max-width:920px; }
.eyebrow{
  font-family:var(--mono); font-size:12px; letter-spacing:.26em; text-transform:uppercase;
  color:var(--muted); display:inline-flex; align-items:center; gap:12px;
}
.eyebrow::before{ content:''; width:26px; height:1px; background:var(--ink); display:inline-block; }
.eyebrow--center{ justify-content:center; }

/* reveal-on-scroll */
[data-reveal]{ opacity:0; transform:translateY(26px); transition:opacity .9s cubic-bezier(.22,.61,.36,1), transform .9s cubic-bezier(.22,.61,.36,1); }
[data-reveal].in{ opacity:1; transform:none; }
[data-reveal][data-delay="1"]{ transition-delay:.08s; }
[data-reveal][data-delay="2"]{ transition-delay:.16s; }
[data-reveal][data-delay="3"]{ transition-delay:.24s; }
@media (prefers-reduced-motion:reduce){ [data-reveal]{ opacity:1; transform:none; transition:none; } }

/* ───────── page hero (subpages) ───────── */
.page-hero{ padding:clamp(64px,11vh,130px) 0 clamp(40px,6vh,80px); }
.page-hero .backlink{ font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); display:inline-flex; gap:8px; align-items:center; margin-bottom:26px; transition:color .2s; }
.page-hero .backlink:hover{ color:var(--ink); }
.page-hero h1{ font-weight:800; letter-spacing:-.035em; line-height:1.0; font-size:clamp(40px,7.5vw,104px); margin:18px 0 0; max-width:15ch; }
.page-hero h1 .dim{ color:var(--muted); }
.lead{ margin:32px 0 0; max-width:54ch; font-size:clamp(17px,1.5vw,21px); line-height:1.6; color:#2c2c30; }

/* ───────── manifesto / generic section ───────── */
.section{ padding:clamp(60px,9vh,120px) 0; }
.section--rule{ border-top:1px solid var(--hair-soft); }
.manifesto{ padding:clamp(110px,17vh,200px) 0 clamp(80px,12vh,150px); border-top:1px solid var(--hair-soft); }
.manifesto--lead{ padding-top:clamp(8px,1.6vh,22px); padding-bottom:clamp(48px,7vh,90px); }
.manifesto--lead p{ margin-top:0; }
.manifesto h2{ font-weight:800; letter-spacing:-.035em; line-height:1.02; font-size:clamp(36px,7vw,98px); margin:26px 0 0; max-width:16ch; }
.manifesto h2 .dim{ color:var(--muted); }
.manifesto p{ margin:40px 0 0; max-width:48ch; font-size:clamp(19px,1.9vw,27px); line-height:1.5; color:#2c2c30; }

.section-head h2{ font-weight:800; letter-spacing:-.03em; font-size:clamp(30px,5vw,60px); margin:18px 0 0; line-height:1.02; max-width:18ch; }
.section-head p{ margin:22px 0 0; max-width:46ch; color:#33333a; line-height:1.6; font-size:clamp(15px,1.2vw,18px); }

/* ───────── problem / pain points (home) ───────── */
.problems{ padding:clamp(80px,11vh,150px) 0; border-top:1px solid var(--hair-soft); }
.problems__title{ font-weight:800; letter-spacing:-.035em; line-height:1.02; font-size:clamp(32px,5.6vw,74px); margin:24px 0 0; }
.problems__title .dim{ color:var(--muted); }
.problems__grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(16px,1.6vw,26px); margin-top:clamp(40px,5vw,56px); }
@media (max-width:820px){ .problems__grid{ grid-template-columns:1fr; } }
.pain{ padding:clamp(28px,3.5vw,40px); border:1px solid var(--hair); border-radius:16px; }
.pain__icon{ display:flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:50%; background:var(--ink); color:var(--paper); font-size:18px; font-weight:700; line-height:1; transition:background .3s; position:relative; }
.pain__x,.pain__check{ transition:opacity .3s; }
.pain__x{ opacity:1; }
.pain__check{ position:absolute; opacity:0; }
.pain:hover .pain__icon,.pain.is-active .pain__icon{ background:#1a8a4a; }
.pain:hover .pain__x,.pain.is-active .pain__x{ opacity:0; }
.pain:hover .pain__check,.pain.is-active .pain__check{ opacity:1; }
.pain h3{ font-weight:800; font-size:clamp(18px,1.8vw,22px); letter-spacing:-.02em; margin:20px 0 0; }
.pain p{ margin:10px 0 0; color:var(--muted); font-size:clamp(14px,1.1vw,16px); line-height:1.6; }
.pain__fix{ max-height:0; overflow:hidden; opacity:0; color:#1a8a4a; font-weight:600; transition:max-height .4s cubic-bezier(.22,.61,.36,1), opacity .3s, margin .3s; margin-top:0 !important; }
.pain:hover .pain__fix,.pain.is-active .pain__fix{ max-height:80px; opacity:1; margin-top:10px !important; }

/* ───────── leistungen split (home) ───────── */
.services{ padding:clamp(70px,9vh,120px) 0; }
.services__title{ font-weight:800; letter-spacing:-.035em; line-height:1.02; font-size:clamp(32px,5.6vw,74px); margin:24px 0 0; }
.services__title .dim{ white-space:nowrap; }
.services__title .dim{ color:var(--muted); }
.services__intro{ margin:26px 0 0; max-width:48ch; color:#2c2c30; line-height:1.62; font-size:clamp(16px,1.35vw,19px); }
.services__grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(16px,1.6vw,26px); }
@media (max-width:820px){ .services__grid{ grid-template-columns:1fr; } }
.svc{ padding:clamp(36px,4.5vw,64px) clamp(28px,3.5vw,56px) clamp(44px,5vw,72px); border:2px solid var(--hair); border-radius:16px; position:relative; display:flex; flex-direction:column; transition:transform .4s cubic-bezier(.22,.61,.36,1), box-shadow .4s, background .3s; }
.svc:hover{ transform:translateY(-6px); box-shadow:0 24px 60px rgba(17,17,19,.1); }
.svc__no{ font-family:var(--mono); font-size:12px; color:var(--muted); letter-spacing:.2em; }
.svc__star{ position:absolute; top:clamp(36px,4.5vw,64px); right:clamp(28px,3.5vw,56px); }
.svc h3{ font-weight:800; letter-spacing:-.025em; font-size:clamp(26px,3.4vw,42px); margin:30px 0 0; }
.svc p{ margin:18px 0 0; max-width:40ch; line-height:1.62; color:#33333a; font-size:clamp(15px,1.15vw,17px); }
.svc ul{ list-style:none; margin:30px 0 0; padding:0; }
.svc li{ display:flex; gap:12px; align-items:baseline; padding:11px 0; border-top:1px solid var(--hair-soft); font-size:14.5px; color:#2c2c30; }
.svc li::before{ content:''; flex:0 0 auto; width:7px; height:7px; border-radius:50%; background:var(--ink); transform:translateY(2px); }
.svc__link{ margin-top:auto; padding-top:30px; display:inline-flex; align-items:center; gap:9px; font-weight:700; font-size:15px; }
.svc__link svg{ transition:transform .3s; }
.svc:hover .svc__link svg{ transform:translateX(5px); }
.svc.is-primary{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.svc.is-primary .svc__no,.svc.is-primary p,.svc.is-primary li{ color:rgba(255,255,255,.74); }
.svc.is-primary li{ border-color:rgba(255,255,255,.14); }
.svc.is-primary li::before{ background:var(--paper); }
.svc.is-primary .tag{ color:var(--ink); background:var(--paper); }
.tag{ display:inline-block; margin-top:26px; align-self:flex-start; font-family:var(--mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; padding:7px 12px; border:1px solid var(--ink); border-radius:999px; }

/* ───────── included list (subpages) ───────── */
.incl-list{ display:grid; grid-template-columns:1fr 1fr; gap:0; margin-top:clamp(34px,4vw,52px); border-top:1px solid var(--hair); }
@media (max-width:680px){ .incl-list{ grid-template-columns:1fr; } }
.incl-item{ padding:clamp(22px,2.6vw,32px) 0; border-bottom:1px solid var(--hair); }
.incl-item:nth-child(odd){ padding-right:clamp(20px,3vw,40px); }
.incl-item:nth-child(even){ padding-left:clamp(20px,3vw,40px); border-left:1px solid var(--hair); }
@media (max-width:680px){ .incl-item:nth-child(even){ padding-left:0; border-left:none; } }
.incl-item h3{ font-weight:800; letter-spacing:-.02em; font-size:clamp(17px,1.5vw,20px); margin:0; display:flex; align-items:center; gap:10px; }
.incl-item h3::before{ content:'+'; font-family:var(--mono); font-weight:400; font-size:14px; color:var(--muted); flex:0 0 auto; }
.incl-list--numbered{ counter-reset:step; }
.incl-list--numbered .incl-item h3::before{ counter-increment:step; content:counter(step); font-family:var(--mono); font-weight:500; font-size:12px; color:var(--paper); background:var(--ink); width:24px; height:24px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; flex:0 0 24px; }
.incl-list--numbered .incl-item p{ margin-left:34px; }
.incl-item p{ margin:8px 0 0 24px; color:#33333a; line-height:1.58; font-size:14.5px; }

/* ───────── process flow (horizontal) ───────── */
.flow{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin-top:clamp(34px,4vw,52px); position:relative; }
@media (max-width:680px){ .flow{ grid-template-columns:1fr 1fr; row-gap:clamp(28px,3vw,36px); } }
@media (max-width:420px){ .flow{ grid-template-columns:1fr; } }
.flow__line{ position:absolute; top:15px; left:15px; right:15px; height:1px; background:var(--hair); grid-column:1/-1; }
@media (max-width:420px){ .flow__line{ display:none; } }
.flow__step{ position:relative; padding:0 clamp(12px,1.6vw,24px); text-align:center; }
.flow__num{ display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:50%; border:1px solid var(--hair); background:var(--paper); font-family:var(--mono); font-size:13px; font-weight:500; color:var(--muted); position:relative; z-index:1; transition:background .3s, color .3s, border-color .3s; }
.flow__step:hover .flow__num{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.flow__step h3{ font-weight:800; font-size:clamp(16px,1.4vw,19px); letter-spacing:-.01em; margin:14px 0 0; }
.flow__step p{ margin:6px 0 0; color:var(--muted); font-size:13.5px; line-height:1.5; }

/* ───────── stat band ───────── */
.stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,4vw,60px); margin-top:clamp(40px,5vw,64px); }
@media (max-width:680px){ .stats{ grid-template-columns:1fr; gap:34px; } }
.stat b{ display:block; font-weight:800; letter-spacing:-.03em; font-size:clamp(44px,6vw,80px); line-height:.95; }
.stat span{ display:block; margin-top:12px; color:var(--muted); font-size:15px; line-height:1.5; max-width:26ch; }

/* ───────── pakete ───────── */
.pricing{ padding:clamp(80px,11vh,150px) 0; }
.pricing__head{ display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:20px; }
.pricing__head h2{ font-weight:800; letter-spacing:-.03em; font-size:clamp(32px,5vw,64px); margin:18px 0 0; line-height:1; }
.plans{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:clamp(40px,5vw,64px); align-items:stretch; }
@media (max-width:900px){ .plans{ grid-template-columns:1fr; } }
.plan{ border:1px solid var(--hair); border-radius:16px; padding:clamp(28px,2.6vw,40px); display:flex; flex-direction:column; min-height:360px; transition:transform .4s cubic-bezier(.22,.61,.36,1), box-shadow .4s; }
.plan:hover{ transform:translateY(-6px); box-shadow:0 24px 60px rgba(17,17,19,.1); }
.plan__name{ font-weight:800; font-size:21px; letter-spacing:-.01em; }
.plan__desc{ color:var(--muted); font-size:14px; margin-top:8px; line-height:1.5; min-height:42px; }
.plan__price{ margin-top:26px; display:flex; align-items:baseline; gap:8px; }
.plan__price b{ font-weight:800; font-size:clamp(34px,3vw,46px); letter-spacing:-.03em; }
.plan__price span{ color:var(--muted); font-size:14px; }
.plan ul{ list-style:none; margin:24px 0 0; padding:0; flex:1; }
.plan li{ padding:10px 0; border-top:1px solid var(--hair-soft); font-size:14px; color:#2c2c30; display:flex; gap:10px; align-items:baseline; }
.plan li::before{ content:'+'; color:var(--muted); font-family:var(--mono); }
.plan__cta{ margin-top:24px; text-align:center; padding:14px; border:1px solid var(--ink); border-radius:999px; font-weight:700; font-size:14px; letter-spacing:.01em; transition:background .25s,color .25s; }
.plan__cta:hover{ background:var(--ink); color:var(--paper); }
.plan.is-featured{ background:var(--ink); color:var(--paper); border-color:var(--ink); transform:translateY(-10px); }
.plan.is-featured:hover{ transform:translateY(-16px); }
@media (max-width:900px){ .plan.is-featured, .plan.is-featured:hover{ transform:none; } }
.plan.is-featured .plan__desc,.plan.is-featured .plan__price span,.plan.is-featured li{ color:rgba(255,255,255,.72); }
.plan.is-featured li{ border-color:rgba(255,255,255,.14); }
.plan.is-featured li::before{ color:rgba(255,255,255,.6); }
.plan.is-featured .plan__cta{ background:var(--paper); color:var(--ink); border-color:var(--paper); }
.plan.is-featured .plan__cta:hover{ background:transparent; color:var(--paper); }
.plan__badge{ align-self:flex-start; font-family:var(--mono); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; padding:5px 10px; border-radius:999px; background:var(--paper); color:var(--ink); margin-bottom:18px; }

/* ───────── faq ───────── */
.faq{ margin-top:clamp(34px,4vw,52px); border-top:1px solid var(--hair); }
.faq details{ border-bottom:1px solid var(--hair); }
.faq summary{ list-style:none; cursor:pointer; padding:24px 0; display:flex; justify-content:space-between; align-items:center; gap:20px; font-weight:700; font-size:clamp(17px,1.6vw,21px); letter-spacing:-.01em; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary .plus{ flex:0 0 auto; width:22px; height:22px; position:relative; }
.faq summary .plus::before,.faq summary .plus::after{ content:''; position:absolute; background:var(--ink); transition:transform .3s; }
.faq summary .plus::before{ left:0; right:0; top:10px; height:2px; }
.faq summary .plus::after{ top:0; bottom:0; left:10px; width:2px; }
.faq details[open] summary .plus::after{ transform:scaleY(0); }
.faq p{ margin:0 0 24px; max-width:62ch; color:#33333a; line-height:1.62; }

/* ───────── contact ───────── */
.contact-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(30px,5vw,72px); margin-top:clamp(40px,5vw,64px); align-items:start; }
@media (max-width:820px){ .contact-grid{ grid-template-columns:1fr; } }
.contact-card{ border:1px solid var(--hair); border-radius:16px; padding:clamp(26px,3vw,40px); }
.contact-card h3{ font-weight:800; font-size:20px; margin:0 0 6px; letter-spacing:-.01em; }
.contact-row{ display:flex; justify-content:space-between; gap:16px; padding:16px 0; border-top:1px solid var(--hair-soft); font-size:15px; }
.contact-row:first-of-type{ border-top:none; }
.contact-row span:first-child{ color:var(--muted); }
.contact-row a{ font-weight:600; }
.form label{ display:block; font-size:13px; font-weight:600; color:#33333a; margin:18px 0 8px; letter-spacing:.01em; }
.form input,.form textarea,.form select{ width:100%; font-family:var(--sans); font-size:15px; color:var(--ink); background:var(--paper); border:1px solid var(--hair); border-radius:10px; padding:13px 15px; transition:border-color .2s; }
.form input:focus,.form textarea:focus,.form select:focus{ outline:none; border-color:var(--ink); }
.form textarea{ resize:vertical; min-height:120px; }
.form button{ margin-top:24px; width:100%; padding:16px; border:none; border-radius:999px; background:var(--ink); color:var(--paper); font-family:var(--sans); font-weight:700; font-size:15px; cursor:pointer; transition:transform .25s; }
.form button:hover{ transform:translateY(-2px); }

/* ───────── cta ───────── */
.cta{ padding:clamp(90px,14vh,180px) 0; border-top:1px solid var(--hair); text-align:center; }
.cta h2{ font-weight:800; letter-spacing:-.035em; line-height:1.0; font-size:clamp(40px,9vw,128px); margin:0; }
.cta__sub{ color:var(--muted); margin:26px auto 0; max-width:40ch; font-size:clamp(16px,1.4vw,19px); line-height:1.6; }
.cta__btn{ display:inline-flex; align-items:center; gap:12px; margin-top:44px; padding:18px 30px; border-radius:999px; background:var(--ink); color:var(--paper); font-weight:700; font-size:16px; transition:transform .3s cubic-bezier(.22,.61,.36,1), opacity .3s; }
.cta__btn:hover{ transform:translateY(-3px); }
.cta__btn svg{ transition:transform .3s; }
.cta__btn:hover svg{ transform:translate(4px,-4px); }
.cta__alt{ display:block; margin-top:22px; font-size:14px; color:var(--muted); }
.cta__alt a{ color:var(--ink); font-weight:600; border-bottom:1px solid var(--hair); }

/* ───────── footer ───────── */
.footer{ border-top:1px solid var(--hair); padding:clamp(50px,7vh,90px) 0 40px; }
.footer__top{ display:flex; justify-content:space-between; align-items:flex-end; gap:30px; flex-wrap:wrap; }
.footer__logo{ display:flex; align-items:flex-end; }
.footer__logo-img{ height:clamp(60px,8vw,100px); width:auto; }
.footer__links{ display:flex; gap:30px; font-size:14px; font-weight:600; color:var(--muted); flex-wrap:wrap; }
.footer__links a:hover{ color:var(--ink); }
.footer__base{ display:flex; justify-content:space-between; align-items:center; margin-top:48px; padding-top:22px; border-top:1px solid var(--hair-soft); font-family:var(--mono); font-size:11.5px; letter-spacing:.06em; color:var(--muted); flex-wrap:wrap; gap:14px; }
.footer__legal{ display:flex; gap:18px; }
.footer__legal a{ color:var(--muted); }
.footer__legal a:hover{ color:var(--ink); }

/* ───────── two-plan layout (centered, intentional) ───────── */
.plans--two{ grid-template-columns:repeat(2,minmax(0,1fr)); max-width:680px; margin-left:auto; margin-right:auto; }
@media (max-width:900px){ .plans--two{ grid-template-columns:1fr; max-width:440px; } }

/* ───────── about / founder ───────── */
.about-teaser{ padding:clamp(80px,11vh,150px) 0; border-top:1px solid var(--hair-soft); }
.about-teaser__inner{ display:flex; align-items:center; gap:clamp(30px,5vw,60px); }
@media (max-width:760px){ .about-teaser__inner{ flex-direction:column; text-align:center; } }
.about-teaser__photos{ display:flex; flex-shrink:0; }
.about-teaser__img{ width:clamp(100px,12vw,160px); height:clamp(100px,12vw,160px); border-radius:50%; object-fit:cover; border:3px solid var(--paper); box-shadow:0 4px 20px rgba(17,17,19,.08); }
.about-teaser__img+.about-teaser__img{ margin-left:-20px; }
.about-teaser__body .eyebrow{ margin-bottom:12px; }
.about-teaser__body h2{ font-weight:800; letter-spacing:-.03em; font-size:clamp(28px,4.4vw,52px); margin:0; line-height:1.04; }
.about-teaser__body p{ margin:18px 0 0; max-width:50ch; color:#33333a; line-height:1.64; font-size:clamp(15px,1.15vw,17px); }
.about__ph{ display:flex; flex-direction:column; align-items:center; gap:14px; color:var(--muted); text-align:center; padding:24px; }
.about__ph svg{ opacity:.45; }
.about__ph span{ font-family:var(--mono); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; }

/* ───────── team (über uns) ───────── */
.team-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(20px,2vw,32px); align-items:start; }
@media (max-width:760px){ .team-grid{ grid-template-columns:1fr; } }
.team-card{ border:1px solid var(--hair); border-radius:16px; overflow:hidden; transition:transform .4s cubic-bezier(.22,.61,.36,1), box-shadow .4s; }
.team-card:hover{ transform:translateY(-6px); box-shadow:0 24px 60px rgba(17,17,19,.1); }
.team-card__photo{ aspect-ratio:4/5; background:var(--paper); display:flex; align-items:center; justify-content:center; border-bottom:1px solid var(--hair); }
.team-card__photo img{ width:100%; height:100%; object-fit:cover; }
.team-card__body{ padding:clamp(24px,3vw,36px); }
.team-card__body h2{ font-weight:800; font-size:clamp(22px,2.4vw,30px); letter-spacing:-.02em; margin:0; }
.team-card__role{ display:block; font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-top:8px; }
.team-card__bio{ max-height:0; overflow:hidden; opacity:0; margin:0; color:#33333a; line-height:1.64; font-size:clamp(14px,1.1vw,16px); transition:max-height .4s cubic-bezier(.22,.61,.36,1), opacity .3s, margin .3s; }
.team-card:hover .team-card__bio,.team-card.is-open .team-card__bio{ max-height:300px; opacity:1; margin-top:18px; }
@media (max-width:760px){ .team-card__bio{ max-height:none; opacity:1; margin-top:18px; overflow:visible; } }

/* ───────── price block (web) ───────── */
.priceblock{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; max-width:640px; margin:42px auto 0; text-align:left; }
@media (max-width:620px){ .priceblock{ grid-template-columns:1fr; } }
.priceblock .tile{ display:block; text-decoration:none; color:inherit; cursor:pointer; border:1px solid var(--hair); border-radius:16px; padding:28px 26px; transition:transform .3s cubic-bezier(.22,.61,.36,1), box-shadow .3s; }
.priceblock .tile:hover{ transform:translateY(-4px); box-shadow:0 12px 32px rgba(17,17,19,.10); }
.priceblock .tile.is-primary{ background:var(--ink); color:var(--paper); border-color:var(--ink); }
.priceblock .tile.is-primary:hover{ box-shadow:0 12px 32px rgba(17,17,19,.25); }
.priceblock .tile b{ display:block; font-weight:800; font-size:clamp(30px,4vw,44px); letter-spacing:-.03em; }
.priceblock .tile .unit{ font-weight:600; font-size:14px; color:var(--muted); letter-spacing:0; }
.priceblock .tile.is-primary .unit{ color:rgba(255,255,255,.7); }
.priceblock .tile p{ margin:12px 0 0; font-size:14px; line-height:1.55; color:#33333a; }
.priceblock .tile.is-primary p{ color:rgba(255,255,255,.8); }
.priceblock .tile__badge{ display:inline-block; font-family:var(--mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase; padding:4px 10px; border-radius:999px; margin-bottom:14px; background:var(--ink); color:var(--paper); }
.priceblock .tile.is-primary .tile__badge{ background:var(--paper); color:var(--ink); }
.priceblock .tile__label{ display:block; font-family:var(--mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-bottom:14px; }
.priceblock .tile.is-primary .tile__label{ color:rgba(255,255,255,.55); }
.priceblock .tile__old{ display:block; font-size:17px; font-weight:600; text-decoration:line-through; color:var(--muted); letter-spacing:-.01em; margin-bottom:2px; }
.priceblock .tile.is-primary .tile__old{ color:rgba(255,255,255,.55); }
.price-strike{ text-decoration:line-through; color:var(--muted); }

/* ───────── web call-out (pakete) ───────── */
.web-callout{ display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap; margin-top:clamp(34px,4vw,52px); border:1px solid var(--ink); border-radius:16px; padding:clamp(24px,3vw,36px); }
.web-callout h3{ font-weight:800; letter-spacing:-.02em; font-size:clamp(20px,2.4vw,28px); margin:8px 0 0; }
.web-callout p{ color:#33333a; font-size:15px; line-height:1.55; margin:8px 0 0; max-width:46ch; }
.web-callout .eyebrow{ margin:0; }
.web-callout .cta__btn{ margin-top:0; flex:0 0 auto; }

/* ───────── legal pages (impressum / datenschutz) ───────── */
.legal{ padding:clamp(40px,6vh,80px) 0 clamp(60px,9vh,120px); }
.legal .wrap{ max-width:760px; }
.legal h1{ font-weight:800; letter-spacing:-.03em; font-size:clamp(34px,5vw,60px); margin:0 0 10px; line-height:1.02; }
.legal__updated{ color:var(--muted); font-family:var(--mono); font-size:12px; letter-spacing:.08em; }
.legal h2{ font-weight:800; font-size:clamp(20px,2.2vw,26px); letter-spacing:-.01em; margin:46px 0 0; }
.legal h3{ font-weight:700; font-size:16px; margin:26px 0 0; }
.legal p,.legal li{ color:#33333a; line-height:1.7; font-size:15.5px; margin:14px 0 0; }
.legal ul{ margin:14px 0 0; padding-left:20px; }
.legal li{ margin:7px 0 0; }
.legal a{ color:var(--ink); border-bottom:1px solid var(--hair); }
.legal .ph{ background:var(--hair-soft); border:1px dashed var(--hair); border-radius:6px; padding:1px 7px; font-family:var(--mono); font-size:13px; color:var(--ink); white-space:nowrap; }
.legal__hint{ margin-top:34px; padding:16px 18px; border:1px dashed var(--hair); border-radius:12px; background:var(--hair-soft); font-size:13.5px; color:var(--muted); line-height:1.6; }