@font-face{font-family:"Noto Serif Hebrew";font-weight:400;font-display:swap;src:url(fonts/noto-serif-hebrew-hebrew-400-normal.woff2) format("woff2");unicode-range:U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:"Noto Serif Hebrew";font-weight:400;font-display:swap;src:url(fonts/noto-serif-hebrew-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F}
@font-face{font-family:"Noto Serif Hebrew";font-weight:500;font-display:swap;src:url(fonts/noto-serif-hebrew-hebrew-500-normal.woff2) format("woff2");unicode-range:U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:Assistant;font-weight:400;font-display:swap;src:url(fonts/assistant-hebrew-400-normal.woff2) format("woff2");unicode-range:U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:Assistant;font-weight:400;font-display:swap;src:url(fonts/assistant-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F}
@font-face{font-family:Assistant;font-weight:600;font-display:swap;src:url(fonts/assistant-hebrew-600-normal.woff2) format("woff2");unicode-range:U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:Assistant;font-weight:600;font-display:swap;src:url(fonts/assistant-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F}
@font-face{font-family:Assistant;font-weight:700;font-display:swap;src:url(fonts/assistant-hebrew-700-normal.woff2) format("woff2");unicode-range:U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:Assistant;font-weight:700;font-display:swap;src:url(fonts/assistant-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+2000-206F}

:root{--bone:#f2f0ea;--paper:#faf9f5;--ink:#15201b;--muted:#4a5851;--forest:#1f4a37;--deep:#0f2b1f;--moss:#bfd86b;--line:#cfd3c8;
--serif:"Noto Serif Hebrew",Georgia,serif;--sans:Assistant,"Segoe UI",Arial,sans-serif;
--ease:cubic-bezier(.23,1,.32,1);--wipe:cubic-bezier(.77,0,.175,1);--m:clamp(20px,5vw,72px);color-scheme:light}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bone);color:var(--ink);font:400 18px/1.65 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:clip}
h1,h2,h3,p,ul,ol,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--forest);outline-offset:3px;border-radius:4px}
.dark :focus-visible,.demo-bar :focus-visible,.site-footer :focus-visible{outline-color:var(--moss)}
.sr{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;inset-inline-start:12px;top:-60px;background:var(--ink);color:#fff;padding:10px 16px;border-radius:8px;z-index:100;text-decoration:none;transition:top .2s}
.skip:focus{top:12px}

/* demo strip + header */
.demo-bar{background:var(--ink);color:#fff;font-size:16px;line-height:1.4;padding:9px var(--m);text-align:center}
.demo-bar strong{color:var(--moss);font-weight:600}
.site-header{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--bone) 92%,transparent);backdrop-filter:blur(8px);border-block-end:1px solid var(--line);view-transition-name:hdr}
.bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px var(--m);max-inline-size:1360px;margin-inline:auto}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font:500 26px/1 var(--serif)}
.brand small{display:block;font:400 16px/1.2 var(--sans);color:var(--muted);margin-block-start:4px}
.logo{inline-size:40px;block-size:40px;flex:none}
.logo path,.logo circle{fill:none;stroke:var(--forest);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0}
.nav ul{display:flex;gap:6px}
.nav a{display:block;padding:10px 14px;border-radius:999px;text-decoration:none;font-weight:600;position:relative;transition:background .18s}
.nav a:hover{background:rgba(31,74,55,.09)}
.nav a[aria-current=page]{background:var(--forest);color:#fff}
.menu-btn{display:none;background:none;border:1.5px solid var(--forest);border-radius:999px;padding:9px 18px;font-weight:600;cursor:pointer}
@media(max-width:860px){
 .menu-btn{display:block}
 .nav{position:absolute;inset-inline:0;top:100%;background:var(--bone);border-block-end:1px solid var(--line);padding:8px var(--m) 20px;display:none}
 .nav.open{display:block;animation:drop .3s var(--ease)}
 .nav ul{flex-direction:column}
 .nav a{padding:14px 16px;font-size:19px}
}
@keyframes drop{from{opacity:0;transform:translateY(-8px)}}

main{display:block;min-block-size:70vh}
.wrap{max-inline-size:1360px;margin-inline:auto;padding-inline:var(--m)}
section{padding-block:clamp(56px,9vw,120px)}
.eyebrow{font:600 16px/1 var(--sans);letter-spacing:.04em;color:var(--forest);display:flex;align-items:center;gap:12px;margin-block-end:22px}
.eyebrow::before{content:"";inline-size:36px;block-size:2px;background:var(--forest)}
h1,h2{font-family:var(--serif);font-weight:400;line-height:1.15;letter-spacing:-.01em}
h1{font-size:clamp(44px,7.4vw,104px)}
h2{font-size:clamp(34px,4.6vw,60px)}
h3,.statements h3{font:600 22px/1.3 var(--sans)}
.lead{font-size:clamp(19px,2vw,23px);color:var(--muted);max-inline-size:34em;margin-block-start:26px}
.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 26px;border-radius:999px;font-weight:700;text-decoration:none;border:2px solid var(--forest);background:var(--forest);color:#fff;cursor:pointer;transition:transform .15s var(--ease),background .2s,color .2s}
.btn:hover{background:var(--deep);border-color:var(--deep)}
.btn:active{transform:scale(.97)}
.btn.ghost{background:transparent;color:var(--forest)}
.btn.ghost:hover{background:var(--forest);color:#fff}
.btn.light{background:var(--moss);border-color:var(--moss);color:var(--deep)}
.btn.light:hover{background:#fff;border-color:#fff}
.actions{display:flex;flex-wrap:wrap;gap:14px;margin-block-start:34px}

/* hero */
.hero{padding-block:clamp(40px,7vw,96px) clamp(48px,8vw,100px)}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,5vw,80px);align-items:center}
@media(max-width:960px){.hero-grid{grid-template-columns:1fr}}
.hero h1 em{font-style:normal;color:var(--forest);background:linear-gradient(transparent 82%,var(--moss) 82% 94%,transparent 94%);background-size:0 100%;background-repeat:no-repeat;background-position:right;animation:mark 1s .7s var(--ease) forwards}
@keyframes mark{to{background-size:100% 100%}}
.bgline{position:fixed;inset-inline:0;top:0;block-size:100vh;z-index:-1;pointer-events:none;opacity:.4}
.bgline svg{position:absolute;inset-inline-start:-6vw;top:10vh;inline-size:70vw;max-inline-size:900px;will-change:transform}
.bgline path{fill:none;stroke:var(--line);stroke-width:2}

/* cards and calculators */
.card{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:clamp(22px,3vw,36px)}
.card.dark{background:var(--forest);color:#fff;border-color:var(--forest)}
.calc h2{font:500 26px/1.3 var(--serif);margin-block-end:6px}
.calc .hint{color:var(--muted);font-size:16px;margin-block-end:22px}
.field{margin-block-end:20px}
.field label{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-weight:600;margin-block-end:8px}
.pair{display:grid;grid-template-columns:1fr 132px;gap:14px;align-items:center}
input[type=number],input[type=text],input[type=tel],select,textarea{inline-size:100%;background:#fff;border:1.5px solid #8d978f;border-radius:12px;padding:10px 12px;min-block-size:46px}
textarea{min-block-size:130px;resize:vertical}
input[type=range]{inline-size:100%;accent-color:var(--forest);block-size:32px;cursor:pointer}
.result{border-block-start:1px solid var(--line);padding-block-start:22px;margin-block-start:6px}
.big{font:400 clamp(46px,6vw,72px)/1 var(--serif);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.big small{font:600 18px var(--sans);color:var(--muted);letter-spacing:0;margin-inline-start:8px}
.split{display:flex;block-size:14px;border-radius:99px;overflow:hidden;background:var(--line);margin-block:20px 10px}
.split i{display:block;block-size:100%;transition:inline-size .5s var(--ease)}
.split .p{background:var(--forest)}
.split .i{background:var(--moss)}
.legend{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:16px;color:var(--muted)}
.legend b{color:var(--ink);font-variant-numeric:tabular-nums}
.key{display:inline-block;inline-size:12px;block-size:12px;border-radius:3px;margin-inline-end:6px;vertical-align:-1px}
.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-block-start:18px}
.facts div{border-inline-start:3px solid var(--moss);padding-inline-start:12px}
.facts dt{font-size:16px;color:var(--muted)}
.facts dd{margin:0;font:600 22px var(--sans);font-variant-numeric:tabular-nums}
.gauge{position:relative;block-size:14px;border-radius:99px;margin-block:22px 8px;background:linear-gradient(90deg,var(--forest) 0 66%,#8a7a3a 66% 80%,#15201b 80% 100%)}
.gauge span{position:absolute;top:-6px;inline-size:6px;block-size:26px;background:var(--ink);border-radius:3px;inset-inline-start:0;transition:inset-inline-start .4s var(--ease);transform:translateX(50%)}
.note{font-size:16px;color:var(--muted);margin-block-start:14px}
.msg{font-weight:600;font-size:19px;margin-block-start:12px}
.calc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:24px;align-items:start}

/* statements */
.statements{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-block:1px solid var(--ink)}
@media(max-width:860px){.statements{grid-template-columns:1fr}}
.statements article{padding:34px 28px 34px 0;border-inline-end:1px solid var(--line)}
.statements article+article{padding-inline-start:28px}
.statements article:last-child{border:0}
@media(max-width:860px){.statements article{border:0;border-block-end:1px solid var(--line);padding:26px 0}.statements article+article{padding-inline-start:0}}
.statements .n{font:400 60px/1 var(--serif);color:var(--forest);margin-block-end:14px;display:block}
.statements p{color:var(--muted);margin-block-start:8px}

/* quotes */
.dark-band{background:var(--deep);color:#fff}
.dark-band .eyebrow{color:var(--moss)}.dark-band .eyebrow::before{background:var(--moss)}
.quotes{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-block-start:44px}
@media(max-width:860px){.quotes{grid-template-columns:1fr}}
.quote{border:1px solid rgba(255,255,255,.22);border-radius:20px;padding:30px}
.quote p{font:400 23px/1.5 var(--serif)}
.quote footer{margin-block-start:20px;color:#d3dccd;font-size:16px}
.tag{display:inline-block;border:1px solid currentColor;border-radius:99px;padding:2px 10px;font-size:16px;margin-inline-start:8px}

/* timeline */
.timeline{position:relative;margin-block-start:48px;padding-inline-start:64px}
.timeline::before{content:"";position:absolute;inset-inline-start:19px;top:6px;bottom:6px;inline-size:2px;background:var(--line)}
.timeline .fill{position:absolute;inset-inline-start:19px;top:6px;bottom:6px;inline-size:2px;background:var(--forest);transform-origin:top;transform:scaleY(var(--p,0))}
.step{position:relative;padding-block-end:54px;max-inline-size:44em}
.step:last-child{padding-block-end:0}
.step .num{position:absolute;inset-inline-start:-64px;top:0;inline-size:40px;block-size:40px;border-radius:50%;background:var(--bone);border:2px solid var(--forest);display:grid;place-items:center;font:600 18px var(--sans);transition:background .3s,color .3s}
.step.on .num{background:var(--forest);color:#fff}
.step h2{font:500 30px/1.25 var(--serif);margin-block-end:10px}
.step p{color:var(--muted)}
.step .ask{margin-block-start:12px;font-size:17px;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:10px 14px;display:inline-block}
.dashes li{position:relative;padding-inline-start:28px;margin-block:12px}
.dashes li::before{content:"";position:absolute;inset-inline-start:0;top:.85em;inline-size:16px;block-size:2px;background:var(--forest)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,6vw,90px)}
@media(max-width:860px){.two{grid-template-columns:1fr}}

/* about */
.mono{aspect-ratio:1;border-radius:50%;background:var(--forest);color:var(--bone);display:grid;place-items:center;font:400 clamp(90px,14vw,170px)/1 var(--serif);max-inline-size:340px;inline-size:100%;position:relative;isolation:isolate}
.mono::after{content:"";position:absolute;inset:-8px;border:2px solid var(--moss);border-radius:50%;z-index:-1;animation:ring 6s ease-in-out infinite alternate}
@keyframes ring{to{transform:scale(1.04) rotate(8deg)}}

/* contact */
.preview{background:#fff;border:1.5px dashed #8d978f;border-radius:14px;padding:16px;white-space:pre-wrap;min-block-size:130px}
.copied{color:var(--forest);font-weight:600;min-block-size:1.6em;margin-block-start:10px}

/* footer */
.site-footer{background:var(--deep);color:#e4eadf;padding-block:56px 36px}
.foot{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px}
@media(max-width:860px){.foot{grid-template-columns:1fr}}
.foot h2{font:600 18px var(--sans);color:var(--moss);margin-block-end:12px}
.foot a{text-decoration:none;display:inline-block;padding-block:4px}
.foot a:hover{text-decoration:underline}
.foot .brand{color:#fff}
.legal{border-block-start:1px solid rgba(255,255,255,.2);margin-block-start:40px;padding-block-start:22px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:16px}
.credit a{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--moss)}

/* reveals (only when JS marks the page) */
.js .rv{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease);transition-delay:calc(var(--i,0)*70ms)}
.js .rv.in{opacity:1;transform:none}
.js .line{display:block;overflow:hidden;padding-block:.06em}
.js .line>span{display:block;transform:translateY(105%);transition:transform .9s var(--ease);transition-delay:calc(var(--i,0)*110ms + 250ms)}
.js .line.in>span{transform:none}

/* boot */
.boot{position:fixed;inset:0;z-index:200;background:var(--forest);display:none;place-items:center;color:#fff}
.booting .boot{display:grid;animation:lift .7s var(--wipe) 1.15s forwards}
.boot .logo{inline-size:84px;block-size:84px}
.boot .logo path,.boot .logo circle{stroke:#fff;stroke-width:2.6;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1s .1s var(--ease) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes lift{to{transform:translateY(-100%);visibility:hidden}}

/* cross-document page transition: the next page opens as a circle from the tapped spot */
@view-transition{navigation:auto}
::view-transition-group(hdr){animation:none}
::view-transition-old(root){animation:away .7s var(--wipe) both}
::view-transition-new(root){animation:open .7s var(--wipe) both}
@keyframes open{from{clip-path:circle(0 at var(--vx,50%) var(--vy,50%))}to{clip-path:circle(150vmax at var(--vx,50%) var(--vy,50%))}}
@keyframes away{to{transform:scale(.965);filter:brightness(.8)}}
@keyframes fade{from{opacity:0}}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important}
 ::view-transition-old(root){animation:none}
 ::view-transition-new(root){animation:fade .15s both!important}
 .booting .boot{display:none}
 .hero h1 em{background-size:100% 100%}
}

.site-footer .logo path,.site-footer .logo circle{stroke:#fff}
.mono{margin:10px;inline-size:calc(100% - 20px)}
