/* Jewish Services — styles */

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--hdr-h) + 16px)}
body{margin:0;background:var(--c-paper);color:var(--c-ink-2);font:400 var(--fs-body)/var(--lh-body) var(--font-body);overflow-x:clip;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
button,input{font:inherit;color:inherit}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding:0;list-style:none}
h1,h2,h3{color:var(--c-ink);overflow-wrap:break-word;hyphens:manual}
:focus-visible{outline:2px solid var(--c-focus);outline-offset:3px;border-radius:2px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:16px;top:-60px;z-index:100;background:var(--c-ink);color:var(--c-on-primary);padding:10px 14px;border-radius:var(--r-control);text-decoration:none}
.skip:focus{top:12px}

/* ---------- type roles ---------- */
.display{font:400 var(--fs-display)/var(--lh-display) var(--font-display);letter-spacing:var(--ls-display)}
.statement{font:400 var(--fs-statement)/var(--lh-display) var(--font-display);letter-spacing:var(--ls-display)}
.h2{font:400 var(--fs-h2)/var(--lh-head) var(--font-display);letter-spacing:var(--ls-head)}
.h3{font:500 clamp(1.5rem,2.2vw,2rem)/1.15 var(--font-display)}
.lede{font-size:var(--fs-lede);line-height:1.5;color:var(--c-ink-2);max-width:var(--measure-lede)}
.micro,.eyebrow{font:500 var(--fs-micro)/1.3 var(--font-mono);letter-spacing:var(--ls-micro);text-transform:uppercase;color:var(--c-ink-3)}
.label{display:flex;align-items:baseline;gap:12px;font:500 var(--fs-micro)/1 var(--font-mono);letter-spacing:var(--ls-micro);text-transform:uppercase;color:var(--c-ink-3);margin-bottom:22px}
.label .num{color:var(--c-ink)}
.label::after{content:"";flex:1;height:1px;background:var(--c-line-2);max-width:120px;align-self:center}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 22px;border-radius:var(--r-control);border:1px solid transparent;font-weight:500;font-size:1rem;text-decoration:none;cursor:pointer;background:none;transition:background var(--t) var(--ease),color var(--t) var(--ease),border-color var(--t) var(--ease),transform var(--t) var(--ease)}
.btn .ph{font-size:1.25em}
.btn:active{transform:translateY(1px)}
.btn--ink{background:var(--c-ink);color:var(--c-on-primary)}
.btn--ink:hover{background:var(--c-ink-2)}
.btn--wa{background:var(--c-wa);color:var(--c-on-wa)}
.btn--wa:hover{background:var(--c-wa-hover)}
.btn--line{border-color:var(--c-ink);color:var(--c-ink)}
.btn--line:hover{background:var(--c-ink);color:var(--c-on-primary)}
.btn--sm{min-height:40px;padding:0 14px;font-size:.9375rem;gap:8px}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:50;background:var(--c-paper);border-bottom:1px solid transparent;transition:border-color var(--t) var(--ease)}
.hdr.is-scrolled{border-bottom-color:var(--c-line)}
.hdr__in{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);height:var(--hdr-h);display:flex;align-items:center;gap:24px}
.mark{font:500 1.3rem/1 var(--font-display);color:var(--c-ink);text-decoration:none;letter-spacing:-.01em;white-space:nowrap}
.hdr__nav{margin-left:auto}
.hdr__nav ul{display:flex;gap:26px}
.hdr__nav a{font-size:.9375rem;text-decoration:none;color:var(--c-ink-2);background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;padding:4px 0;transition:background-size var(--t) var(--ease),color var(--t)}
.hdr__nav a:hover,.hdr__nav a.is-here{color:var(--c-ink);background-size:100% 1px}
.hdr__act{display:flex;align-items:center;gap:10px}
.avail{display:inline-flex;align-items:center;gap:8px;font:500 var(--fs-micro)/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--c-ink-3);margin-right:6px;white-space:nowrap}
.dot{width:7px;height:7px;border-radius:var(--r-round);background:var(--c-live)}
.lang{font:500 .8125rem/1 var(--font-mono);color:var(--c-ink);text-decoration:none;padding:12px 8px;border-radius:var(--r-control)}
.lang:hover{background:var(--c-fill)}
.burger{display:none;width:44px;height:44px;border:0;background:none;cursor:pointer;position:relative}
.burger__l,.burger__l::before,.burger__l::after{position:absolute;left:12px;width:20px;height:1.5px;background:var(--c-ink);transition:transform var(--t) var(--ease),opacity var(--t)}
.burger__l{top:21px}.burger__l::before{content:"";left:0;top:-6px}.burger__l::after{content:"";left:0;top:6px}
.burger[aria-expanded="true"] .burger__l{background:transparent}
.burger[aria-expanded="true"] .burger__l::before{transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] .burger__l::after{transform:translateY(-6px) rotate(-45deg)}

.avail__short{display:none}
@media (max-width:1180px){.avail__full{display:none}.avail__short{display:inline}.avail{margin-right:0}}
@media (max-width:1020px){
  .burger{display:block}
  .hdr__act .btn{display:none}
  .hdr__nav{position:fixed;inset:var(--hdr-h) 0 0 0;background:var(--c-paper);padding:24px var(--gutter);display:none;margin:0;border-top:1px solid var(--c-line)}
  .hdr__nav.is-open{display:block}
  .hdr__nav ul{flex-direction:column;gap:0}
  .hdr__nav li{border-bottom:1px solid var(--c-line)}
  .hdr__nav a{display:block;padding:18px 0;font:400 1.75rem/1.1 var(--font-display);color:var(--c-ink);background:none}
  .hdr__act{margin-left:auto}
  .hdr__nav{margin-left:0}
}

/* ---------- layout ---------- */
main{display:block}
.sec{max-width:var(--wrap);margin:0 auto;padding:var(--sec-y) var(--gutter)}
.sec__head{max-width:900px;margin-bottom:clamp(40px,6vw,72px)}
.sec__head .lede{margin-top:20px}
.band-fill{background:var(--c-fill)}

/* ---------- 0 hero: asymmetric split, photo bleeds right ---------- */
.hero{display:grid;grid-template-columns:minmax(0,1fr);gap:40px;max-width:none;padding:clamp(28px,5vw,64px) 0 0}
.hero__text{padding:0 var(--gutter);max-width:780px}
.eyebrow{margin-bottom:28px}
.hero .display{margin-bottom:28px}
.hero .lede{margin-bottom:34px}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:clamp(40px,6vw,64px)}
.where__q{font:500 var(--fs-micro)/1 var(--font-mono);letter-spacing:var(--ls-micro);text-transform:uppercase;color:var(--c-ink-3);padding-bottom:14px;border-bottom:1px solid var(--c-ink)}
.where__list li{border-bottom:1px solid var(--c-line-2)}
.where__list a{display:flex;align-items:center;gap:16px;min-height:64px;padding:18px 4px;text-decoration:none;color:var(--c-ink);font:400 clamp(1.2rem,1.6vw,1.45rem)/1.2 var(--font-display);transition:padding var(--t) var(--ease),background var(--t)}
.where__list .ph{font-size:1.35rem;color:var(--c-ink)}
.where__list .go{margin-left:auto;font-size:1.1rem;opacity:.35;transition:opacity var(--t),transform var(--t) var(--ease)}
.where__list a:hover{background:var(--c-fill)}
.where__list a:hover .go{opacity:1;transform:translateX(4px)}
.hero__img{position:relative;min-height:340px;overflow:hidden}
.hero__img img{width:100%;height:100%;object-fit:cover;object-position:60% 70%}
@media (min-width:960px){
  .hero{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(40px,5vw,88px);padding-top:0;min-height:calc(100svh - var(--hdr-h));align-items:stretch}
  .hero__text{padding:clamp(40px,6vh,88px) 0 clamp(40px,6vh,72px) max(var(--gutter),calc((100vw - var(--wrap))/2 + var(--gutter)));max-width:none;display:flex;flex-direction:column}
  .where{margin-top:auto}
  .hero__img{min-height:0;border-bottom-left-radius:var(--r-block)}
}
@media (min-width:960px) and (max-height:1120px){
  .hero__text{padding-top:clamp(20px,3vh,40px);padding-bottom:clamp(20px,3vh,36px)}
  .eyebrow{margin-bottom:18px}
  .hero .display{margin-bottom:18px;font-size:clamp(3.1rem,6.6vw,6.4rem)}
  .hero .lede{margin-bottom:24px}
  .hero__cta{margin-bottom:clamp(24px,3.5vh,40px)}
  .where__list a{padding-block:12px;min-height:56px}
}

/* ---------- 1 right now: tab rail + two-column panel ---------- */
.now-wrap{background:var(--c-fill)}
.now__body{display:grid;gap:28px}
.tabs{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 calc(-1*var(--gutter));padding:0 var(--gutter) 4px}
.tabs::-webkit-scrollbar{display:none}
.tab{flex:0 0 auto;display:flex;align-items:center;gap:12px;padding:14px 16px;border:1px solid var(--c-line-2);border-radius:var(--r-control);background:var(--c-card);cursor:pointer;text-align:left;font-size:1rem;color:var(--c-ink-2);transition:border-color var(--t),background var(--t),color var(--t)}
.tab .ph{font-size:1.4rem;color:var(--c-ink)}
.tab:hover{border-color:var(--c-ink-3)}
.tab[aria-selected="true"]{background:var(--c-ink);border-color:var(--c-ink);color:var(--c-on-primary)}
.tab[aria-selected="true"] .ph{color:var(--c-on-primary)}
.no-js .tabs{display:none}
.panel{background:var(--c-card);border:1px solid var(--c-line);border-radius:var(--r-block);padding:clamp(22px,3vw,40px)}
.no-js .panel+.panel{margin-top:16px}
.js .panel[hidden]{display:none}
.panel__t{display:flex;align-items:center;gap:12px;font:400 clamp(1.6rem,2.6vw,2.3rem)/1.1 var(--font-display);margin-bottom:28px}
.panel__t .ph{font-size:.9em}
.panel__cols{display:grid;gap:32px}
.panel__cols .micro{padding-bottom:12px;border-bottom:1px solid var(--c-line-2);margin-bottom:6px}
.ticks li{border-bottom:1px solid var(--c-line)}
.tick{display:flex;gap:14px;align-items:flex-start;padding:14px 0;cursor:pointer;color:var(--c-ink)}
.ticks li{position:relative}
.tick__in{position:absolute;left:0;top:14px;width:22px;height:22px;margin:0;clip-path:inset(50%)}
.tick__box{flex:0 0 22px;height:22px;margin-top:1px;border:1.5px solid var(--c-field);border-radius:4px;display:grid;place-items:center;transition:background var(--t-fast),border-color var(--t-fast)}
.tick__box .ph{font-size:14px;color:var(--c-on-primary);transform:scale(0);transition:transform var(--t) var(--ease)}
.tick__in:checked+.tick .tick__box{background:var(--c-ink);border-color:var(--c-ink)}
.tick__in:checked+.tick .tick__box .ph{transform:none}
.tick__in:checked+.tick span:last-child{color:var(--c-ink-3);text-decoration:line-through;text-decoration-color:var(--c-ink-4)}
.tick__in:focus-visible+.tick .tick__box{outline:2px solid var(--c-focus);outline-offset:2px}
.steps{counter-reset:s}
.steps li{counter-increment:s;display:flex;gap:14px;padding:14px 0;border-bottom:1px solid var(--c-line);color:var(--c-ink)}
.steps li::before{content:counter(s,decimal-leading-zero);font:500 var(--fs-micro)/1.9 var(--font-mono);color:var(--c-ink-3);flex:0 0 22px}
.send{display:grid;gap:14px;margin-top:16px;padding:clamp(20px,2.4vw,28px) 0 0}
.field{display:grid;gap:6px}
.field label{font:500 var(--fs-micro)/1 var(--font-mono);letter-spacing:var(--ls-micro);text-transform:uppercase;color:var(--c-ink-3)}
.field input{height:52px;padding:0 16px;border:1px solid var(--c-field);border-radius:var(--r-control);background:var(--c-card);color:var(--c-ink);font-size:1.0625rem;min-width:0;width:100%}
.field input::placeholder{color:var(--c-ink-3)}
.send__call{font-size:.9375rem;color:var(--c-ink-2);text-underline-offset:3px}
@media (min-width:720px){
  .panel__cols{grid-template-columns:1fr 1fr;gap:40px}
  .send{grid-template-columns:minmax(0,260px) auto 1fr;align-items:end}
  .send .btn{align-self:end}
  .send__call{align-self:center;padding-top:20px}
}
@media (min-width:1020px){
  .now__body{grid-template-columns:280px minmax(0,1fr);gap:40px;align-items:start}
  .tabs{flex-direction:column;overflow:visible;margin:0;padding:0;position:sticky;top:calc(var(--hdr-h) + 24px)}
  .tab{padding:16px 18px}
}

/* ---------- 2 route: tool left, globe right, index below ---------- */
.route__body{display:grid;gap:32px}
.finder{min-width:0}
.finder__form{position:relative;display:flex;align-items:center;border-bottom:2px solid var(--c-ink);transition:border-color var(--t)}
.finder__icon{font-size:1.6rem;color:var(--c-ink);margin-right:12px}
.finder__form input{flex:1;min-width:0;border:0;background:none;height:72px;font:400 clamp(1.6rem,3vw,2.4rem)/1 var(--font-display);color:var(--c-ink);outline:none}
.finder__form input::placeholder{color:var(--c-ink-4)}
.finder__go{width:52px;height:52px;border-radius:var(--r-control);border:0;background:var(--c-ink);color:var(--c-on-primary);display:grid;place-items:center;cursor:pointer;font-size:1.3rem;transition:background var(--t)}
.finder__go:hover{background:var(--c-ink-2)}
.finder.busy .finder__form{border-bottom-color:var(--c-ink-3)}
.finder__chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:18px 0 8px}
.finder__chips .micro{margin-right:6px}
.chip{border:1px solid var(--c-line-2);background:var(--c-card);border-radius:var(--r-control);padding:8px 12px;font-size:.9375rem;cursor:pointer;color:var(--c-ink);transition:border-color var(--t),background var(--t)}
.chip:hover{border-color:var(--c-ink)}
.finder__status{min-height:0;margin-top:18px}
.finder__status li{display:flex;align-items:center;gap:10px;font:400 .875rem/1.4 var(--font-mono);color:var(--c-ink-3);padding:4px 0;transition:opacity var(--t),transform var(--t) var(--ease)}
.motion-ready .finder__status li:not(.show){opacity:0;transform:translateY(4px)}
.finder__status li .ph{color:var(--c-ink)}
.finder__status li b{color:var(--c-ink);font-weight:500}
.finder__answer{margin-top:18px}
.ans{border-top:1px solid var(--c-ink);padding-top:22px;transition:opacity .5s var(--ease),transform .6s var(--ease)}
.motion-ready .ans:not(.show){opacity:0;transform:translateY(8px)}
.ans__h{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin-bottom:18px}
.ans__city{font:400 clamp(1.9rem,3.4vw,2.8rem)/1 var(--font-display);color:var(--c-ink)}
.ans__country{font:500 var(--fs-micro)/1 var(--font-mono);letter-spacing:var(--ls-micro);text-transform:uppercase;color:var(--c-ink-3)}
.ans__km{flex-basis:100%;font:400 .875rem/1.4 var(--font-mono);color:var(--c-ink-2)}
.route:has(.ans__km) .globe__cap{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ans .fold{margin-top:4px}
.ans .fold .facts>div:last-child{border-bottom:0}
.path{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:22px;font:500 .9375rem/1 var(--font-mono);color:var(--c-ink)}
.path span{padding:8px 10px;border:1px solid var(--c-ink);border-radius:var(--r-control)}
.path span.via{border-style:dashed;color:var(--c-ink-2);border-color:var(--c-ink-3)}
.path span.end{background:var(--c-ink);color:var(--c-on-primary)}
.path i.ph{color:var(--c-ink-3)}
.facts{display:grid;gap:0}
.facts>div{display:grid;grid-template-columns:28px minmax(0,1fr);gap:4px 12px;padding:14px 0;border-bottom:1px solid var(--c-line)}
.facts .ph{font-size:1.25rem;color:var(--c-ink);grid-row:span 2;padding-top:2px}
.facts dt{font:500 var(--fs-micro)/1.3 var(--font-mono);letter-spacing:var(--ls-micro);text-transform:uppercase;color:var(--c-ink-3)}
.facts dd{color:var(--c-ink);min-width:0;overflow-wrap:break-word}
.facts dd ul{display:flex;flex-wrap:wrap;gap:6px 18px}
.facts dd ul li{display:flex;align-items:center;gap:6px}
.facts dd ul li .ph{font-size:.95rem;grid-row:auto;padding:0;color:var(--c-ink-3)}
.meter{display:inline-flex;gap:4px;vertical-align:middle;margin-right:10px}
.meter i{width:18px;height:6px;border-radius:2px;background:var(--c-line-2)}
.meter i.on{background:var(--c-ink)}
.ans__cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.globe{position:relative;aspect-ratio:1/1;max-width:640px;width:100%;margin:0 auto}
.globe canvas{width:100%;height:100%;display:block}
.no-webgl .globe{display:none}
.no-webgl .route__body{grid-template-columns:minmax(0,1fr);max-width:760px}
.globe__cap{position:absolute;left:0;bottom:4px;font:500 var(--fs-micro)/1.3 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--c-ink-3)}
.idx{margin-top:clamp(48px,7vw,96px);border-top:1px solid var(--c-ink);padding-top:18px}
.idx__t{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline;font:400 1.5rem/1.2 var(--font-display);color:var(--c-ink);margin-bottom:24px}
.idx__cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:28px 32px}
.idx__col .micro{padding-bottom:10px;border-bottom:1px solid var(--c-line-2)}
.idx__col button{display:flex;justify-content:space-between;gap:12px;width:100%;text-align:left;padding:9px 0;border:0;border-bottom:1px solid var(--c-line);background:none;cursor:pointer;color:var(--c-ink);font-size:.9375rem;transition:padding var(--t) var(--ease)}
.idx__col button:hover,.idx__col button.is-on{padding-left:6px}
.idx__col button.is-on{font-weight:600}
.code{font:400 .75rem/1.6 var(--font-mono);color:var(--c-ink-3);white-space:nowrap}
@media (min-width:960px){
  .route__body{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:start}
  .globe{position:sticky;top:calc(var(--hdr-h) + 24px)}
}

/* ---------- 3 process: pinned horizontal track ---------- */
.process{padding-bottom:clamp(48px,6vw,80px)}
.process__pin{display:grid;gap:40px}
.process__intro .lede{margin-top:20px}
.process__img{margin-top:32px;width:min(100%,300px);aspect-ratio:4/5;object-fit:cover;border-radius:var(--r-block)}
.process__track{position:relative;min-width:0}
.rail{position:absolute;left:11px;top:0;bottom:0;width:1px;background:var(--c-line-2)}
.rail__fill{position:absolute;inset:0;background:var(--c-ink);transform-origin:0 0;transform:scaleY(0)}
.rail.is-full .rail__fill{transform:none}
.rail__plane{position:absolute;left:0;top:0;font-size:22px;color:var(--c-ink);background:var(--c-paper);padding:2px;will-change:transform}
.stages{display:grid;gap:0}
.stage{position:relative;padding:0 0 40px 48px}
.stage__n{font:500 var(--fs-micro)/1 var(--font-mono);letter-spacing:var(--ls-micro);color:var(--c-ink-3);margin-bottom:12px}
.stage__i{font-size:2rem;color:var(--c-ink);margin-bottom:14px}
.stage__t{font:400 clamp(1.6rem,2.4vw,2.2rem)/1.1 var(--font-display);margin-bottom:16px}
.stage__dl{display:grid;gap:0;max-width:36ch}
.stage__we{border-top:2px solid var(--c-ink);padding-top:14px}
.stage__you{border-top:1px solid var(--c-line-2);margin-top:18px}
.stage__dl dd{color:var(--c-ink)}
.stage__you .fold{border-top:0}
.stage__none{padding:12px 0;color:var(--c-ink-3)}
.stage__need li{display:flex;gap:10px;align-items:flex-start;padding:6px 0;color:var(--c-ink)}
.stage__need .ph{font-size:1rem;margin-top:.3em;color:var(--c-ink-3)}
.always{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter) clamp(24px,3vw,40px);display:grid;gap:14px}
.always ul{display:grid;gap:12px}
.always li{display:flex;gap:14px;align-items:center;color:var(--c-ink);font-size:1.0625rem}
.always .ph{font-size:1.4rem}
@media (min-width:720px){.always{grid-template-columns:160px 1fr;align-items:start;padding-top:0}.always::before{content:"";grid-column:1/-1;height:1px;background:var(--c-line-2);margin-bottom:10px}.always ul{grid-template-columns:1fr 1fr}}
@media (min-width:1020px){
  .process{max-width:none;padding-left:0;padding-right:0}
  .process__pin{grid-template-columns:minmax(260px,.32fr) minmax(0,1fr);gap:0;align-items:center;min-height:calc(100svh - var(--hdr-h) - 48px);padding-left:max(var(--gutter),calc((100vw - var(--wrap))/2 + var(--gutter)))}
  .process__img{width:min(100%,340px);max-height:38svh;aspect-ratio:4/5}
  .process__intro{padding-right:48px}
  .process__track{overflow:hidden;padding-top:56px}
  .process__track::before{content:"";position:absolute;left:0;top:0;bottom:0;width:120px;z-index:2;pointer-events:none;background:linear-gradient(90deg,var(--c-paper),transparent)}
  .stages{will-change:transform}
  .rail{left:0;right:0;top:12px;bottom:auto;width:auto;height:1px}
  .stages{display:flex;width:max-content;gap:0}
  .stage{width:clamp(300px,26vw,380px);padding:0 48px 0 0;border-left:1px solid var(--c-line);padding-left:28px}
  .stage:first-child{border-left:0;padding-left:0}
  .always{padding-top:32px}
}

/* ---------- 4 cost: statement number + gantt bars ---------- */
.cost{display:grid;gap:56px}
.cost__main .lede{margin-top:24px}
.bars{margin-top:clamp(40px,5vw,64px)}
.bars .micro{margin-bottom:14px}
.bars__scale{display:grid;grid-template-columns:96px minmax(0,1fr);column-gap:16px;font:400 .75rem/1 var(--font-mono);color:var(--c-ink-3);padding:0 0 8px;border-bottom:1px solid var(--c-line-2)}
.bars__ticks{grid-column:2;position:relative;height:1em}
.bars__ticks span{position:absolute;top:0;left:calc(var(--x)*100%);transform:translateX(calc(var(--x)*-100%));white-space:nowrap}
.bars ul li{display:grid;grid-template-columns:96px minmax(0,1fr);gap:4px 16px;align-items:center;padding:12px 0;border-bottom:1px solid var(--c-line)}
.bars__c{font:400 1.2rem/1 var(--font-display);color:var(--c-ink)}
.bars__track{position:relative;height:10px}
.bars__r{position:absolute;top:0;bottom:0;left:calc(var(--a)*100%);width:calc((var(--b) - var(--a))*100%);background:var(--c-ink);border-radius:2px;transform-origin:left center}
.bars__v{grid-column:2;font:400 .8125rem/1 var(--font-mono);color:var(--c-ink-3)}
.bars__chf{margin-top:14px;font:400 .8125rem/1.4 var(--font-mono);color:var(--c-ink-3)}
.cost__side{align-self:end}
.cost__side>.micro{padding-bottom:12px;border-bottom:1px solid var(--c-ink)}
.factors li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:14px;padding:20px 0;border-bottom:1px solid var(--c-line)}
.factors .ph{font-size:1.6rem;color:var(--c-ink)}
.factors h3{font:600 1rem/1.3 var(--font-body);margin-bottom:4px}
.factors p{color:var(--c-ink-2);font-size:var(--fs-small)}
.cost__side .btn{margin-top:28px}
@media (min-width:1020px){.cost{grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);gap:clamp(48px,7vw,120px)}}

/* ---------- 5 direct line: big number + one boxed aside ---------- */
.direct{display:grid;gap:48px;border-top:1px solid var(--c-line-2)}
.direct__fam .lede{margin-top:16px}
.bignum{display:inline-block;margin:32px 0 28px;font:400 clamp(2.2rem,6vw,5.4rem)/1 var(--font-display);letter-spacing:-.02em;color:var(--c-ink);text-decoration:none;white-space:nowrap;background:linear-gradient(currentColor,currentColor) 0 100%/0 2px no-repeat;transition:background-size var(--t-slow) var(--ease)}
.bignum:hover{background-size:100% 2px}
.lines li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px;align-items:center;padding:14px 0;border-bottom:1px solid var(--c-line);color:var(--c-ink)}
.lines .ph{font-size:1.3rem}
.lines a{text-underline-offset:3px;overflow-wrap:anywhere}
.direct__pro{border:1px solid var(--c-ink);border-radius:var(--r-block);padding:clamp(24px,3vw,40px);align-self:start;display:grid;gap:16px;color:var(--c-ink-2)}
.pro__i{font-size:2rem;color:var(--c-ink)}
.direct__pro h3{font:400 clamp(1.5rem,2.2vw,2rem)/1.15 var(--font-display)}
.direct__pro ul li{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--c-line);color:var(--c-ink)}
.direct__pro ul .ph{font-size:1.2rem;margin-top:3px}
.direct__pro .btn{justify-self:start}
@media (min-width:1020px){.direct{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(48px,7vw,120px)}}

/* ---------- 6 plan ahead: full-bleed photo, stepped row ---------- */
.plan{background:var(--c-fill)}
.plan__img{height:clamp(260px,42vw,560px);overflow:hidden}
.plan__img img{width:100%;height:118%;object-fit:cover;object-position:50% 60%;will-change:transform}
.plan__head{max-width:860px}
.plan__head .lede{margin-top:20px}
.plan__steps{display:grid;gap:0;margin:clamp(40px,5vw,64px) 0;counter-reset:p}
.plan__steps li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:4px 16px;padding:22px 0;border-top:1px solid var(--c-ink)}
.plan__steps .ph{font-size:1.8rem;color:var(--c-ink);grid-row:span 3}
.plan__steps h3{font:400 1.5rem/1.15 var(--font-display)}
.plan__steps p:last-child{color:var(--c-ink-2)}
.plan__foot{display:grid;gap:24px}
.plan__foot .fold{max-width:56ch}
.plan__foot .fold p{color:var(--c-ink-2)}
.plan__cta{display:flex;flex-wrap:wrap;gap:12px}
@media (min-width:860px){
  .plan__steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
  .plan__steps li{grid-template-columns:1fr;gap:10px}
  .plan__steps .ph{grid-row:auto}
  .plan__foot{grid-template-columns:minmax(0,1fr) auto;align-items:center}
}

/* ---------- 7 faq: sticky title left, list right ---------- */
.faq{display:grid;gap:40px}
.qa{border-top:1px solid var(--c-line-2)}
.qa:last-child{border-bottom:1px solid var(--c-line-2)}
.qa summary{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;cursor:pointer;list-style:none;font:400 clamp(1.2rem,1.7vw,1.5rem)/1.3 var(--font-display);color:var(--c-ink)}
.qa summary::-webkit-details-marker{display:none}
.qa__i{flex:0 0 auto;font-size:1.25rem;transition:transform var(--t) var(--ease)}
.qa[open] .qa__i{transform:rotate(45deg)}
.qa__a{padding:0 0 26px;max-width:var(--measure)}
.qa__a p{color:var(--c-ink-2);margin-bottom:14px}
.more{display:inline-flex;align-items:center;gap:8px;font-weight:500;color:var(--c-ink);text-decoration:none;border-bottom:1px solid var(--c-ink);padding-bottom:2px}
.more .ph{transition:transform var(--t) var(--ease)}
.more:hover .ph{transform:translateX(4px)}
@media (min-width:1020px){.faq{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(48px,7vw,120px)}.faq__head{position:sticky;top:calc(var(--hdr-h) + 32px);align-self:start}}

/* ---------- 8 request ---------- */
.request{border-top:1px solid var(--c-line-2)}
.request__head{display:grid;gap:18px 48px;margin-bottom:clamp(32px,4vw,56px)}
.request__head .label{grid-column:1/-1;margin-bottom:0}
.request__side{display:grid;gap:22px;justify-items:start;align-content:end}
.req{display:grid;gap:18px 24px;max-width:1040px}
.req select,.req textarea{width:100%;min-width:0;padding:14px 16px;border:1px solid var(--c-field);border-radius:var(--r-control);background:var(--c-card);color:var(--c-ink);font-size:1.0625rem}
.req select{height:52px;padding:0 16px}
.req textarea{resize:vertical;min-height:120px;line-height:1.5}
.opt{text-transform:none;letter-spacing:0;color:var(--c-ink-3)}
.req__err{color:var(--c-ink);font-weight:500}
.req__sent{display:flex;align-items:center;gap:10px;color:var(--c-ink);font-weight:500}
.req__sent[hidden]{display:none}
.req__sent .ph{font-size:1.25rem;color:var(--c-wa)}
.req__sent[data-via="mail"] .req__sent-wa,.req__sent:not([data-via="mail"]) .req__sent-mail{display:none}
.req__act{display:flex;flex-wrap:wrap;gap:12px}
@media (min-width:720px){.req{grid-template-columns:1fr 1fr}.field--wide,.req__err,.req__sent,.req__act{grid-column:1/-1}}
@media (min-width:860px){.request__head{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:end}}
.request .h2{font-size:var(--fs-statement);line-height:var(--lh-display);letter-spacing:var(--ls-display)}

/* ---------- folds: secondary detail after a decision; the summary names what is inside ---------- */
.fold{border-top:1px solid var(--c-line)}
.fold>summary{display:flex;align-items:flex-start;gap:12px;padding:12px 0;cursor:pointer;list-style:none;color:var(--c-ink);font-weight:500;line-height:1.45}
.fold>summary::-webkit-details-marker{display:none}
.fold>summary>span{min-width:0;overflow-wrap:break-word}
.fold__i{flex:0 0 auto;margin-left:auto;margin-top:.2em;font-size:1rem;color:var(--c-ink-3);transition:transform var(--t) var(--ease)}
.fold>summary:hover .fold__i{color:var(--c-ink)}
.fold[open]>summary .fold__i{transform:rotate(180deg)}
.fold__b{padding:0 0 12px}
/* without scripts every fold reads open */
html.no-js details.fold::details-content{content-visibility:visible;display:block}
html.no-js .fold__i{display:none}
html.no-js .fold>summary{cursor:auto}
/* German compounds may break inside the narrow columns */
:lang(de) .stage__t,:lang(de) .stage__dl,:lang(de) .tab,:lang(de) .panel__cols,:lang(de) .factors,:lang(de) .fold{hyphens:auto}

/* ---------- footer + mobile bar ---------- */
.ftr{background:var(--c-fill-2)}
.ftr__in{max-width:var(--wrap);margin:0 auto;padding:clamp(56px,7vw,96px) var(--gutter) calc(clamp(40px,5vw,64px) + env(safe-area-inset-bottom));display:grid;gap:22px}
.ftr__mark{font:400 clamp(2.4rem,6vw,5rem)/1 var(--font-display);color:var(--c-ink);letter-spacing:-.02em}
.ftr__lines,.ftr__legal{display:flex;flex-wrap:wrap;gap:8px 28px}
.ftr__lines a,.ftr__legal a{color:var(--c-ink);text-underline-offset:3px}
.ftr__c{font:400 .8125rem/1.4 var(--font-mono);color:var(--c-ink-3)}
.mbar{display:none}
@media (max-width:1020px){
  .mbar{display:grid;grid-template-columns:1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--c-paper);border-top:1px solid var(--c-line-2);padding:8px 8px calc(8px + env(safe-area-inset-bottom));gap:8px}
  .mbar a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:50px;border-radius:var(--r-control);text-decoration:none;font-weight:500;border:1px solid var(--c-ink);color:var(--c-ink)}
  .mbar .ph{font-size:1.25rem}
  .mbar a.mbar__wa{background:var(--c-wa);border-color:var(--c-wa);color:var(--c-on-wa)}
  body{padding-bottom:calc(66px + env(safe-area-inset-bottom))}
}

/* ---------- legal page ---------- */
.legal__nav{max-width:860px;margin:0 auto;padding:24px var(--gutter);display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.legal__main{max-width:860px;margin:0 auto;padding:48px var(--gutter) 64px}
.legal__main h1{margin-bottom:32px}
.legal__main h2{margin:56px 0 20px}
.legal__dl div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:16px;padding:14px 0;border-bottom:1px solid var(--c-line)}
.legal__dl dt{color:var(--c-ink-3)}
.legal__dl dd{color:var(--c-ink);overflow-wrap:anywhere}
.legal__ul li{padding:10px 0;border-bottom:1px solid var(--c-line)}
.legal__ftr{max-width:860px;margin:0 auto;padding:0 var(--gutter) 48px}

/* ---------- motion (hidden start states apply only once scripts are running) ---------- */
.motion-ready [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0s)}
.motion-ready [data-reveal].is-in{opacity:1;transform:none}
.motion-ready .split-line{overflow:clip;padding-bottom:.06em;margin-bottom:-.06em}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;scroll-behavior:auto!important}}
