@font-face{font-family:Vanio;src:url('../fonts/vanio.woff2') format('woff2-variations');font-weight:100 900;font-style:normal;font-display:optional}
@font-face{font-family:Vanio;src:url('../fonts/vanio-italic.woff2') format('woff2-variations');font-weight:100 900;font-style:italic;font-display:optional}
@font-face{font-family:Geist;src:url('../fonts/geist.woff2') format('woff2-variations');font-weight:100 900;font-style:normal;font-display:optional}
@font-face{font-family:"Geist Mono";src:url('../fonts/geist-mono.woff2') format('woff2-variations');font-weight:100 900;font-style:normal;font-display:optional}

:root{
--ground:#FFFFFF;
--sunk:#F5F5F5;
--ink:#1D1D1F;
--ink-2:#333333;
--ink-3:#6B6B6B;
--line:#EAEAEA;
--line-2:#D8D8D8;
--accent:#FF6B00;
--accent-deep:#B34A00;
--accent-soft:#FFF1E6;

--s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:48px;--s6:64px;--s7:96px;--s8:128px;

--gut:var(--s3);
--band:var(--s6);
--nav-h:64px;

--serif:Vanio,Georgia,serif;
--sans:Geist,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
--mono:"Geist Mono",ui-monospace,SFMono-Regular,monospace;
--measure:68ch;

--fs-1:14px;--fs-2:15px;--fs-3:17px;--fs-4:20px;
--lh-body:1.65;
}
@media(min-width:700px){:root{--gut:var(--s5);--band:var(--s7)}}
@media(min-width:1200px){:root{--gut:72px;--band:var(--s8)}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;padding-top:var(--s7);background:var(--ground);color:var(--ink);font-family:var(--sans);font-size:var(--fs-3);line-height:var(--lh-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

.section{width:100%;padding:var(--band) var(--gut);border-top:1px solid var(--line)}
.section:first-of-type{border-top:0}
.section.sunk{background:var(--sunk)}
.section.accent{background:var(--accent);border-top:0;color:var(--ink)}
.inner{max-width:1296px;margin:0 auto;width:100%}
.inner.narrow{max-width:768px}

.cols{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--s5);align-items:start}
.cols.even{grid-template-columns:1fr 1fr}
@media(max-width:860px){.cols,.cols.even{grid-template-columns:1fr;gap:var(--s4)}}

h1,h2,h3,h4{font-family:var(--serif);font-weight:250;line-height:1.05;letter-spacing:-.025em;margin:0;text-wrap:balance}
h1{font-size:44px;font-weight:200;line-height:1.02}
h2{font-size:32px}
h3{font-size:20px;font-weight:300}
h4{font-size:17px;font-weight:400}
@media(min-width:700px){h1{font-size:72px}h2{font-size:44px}h3{font-size:24px}h4{font-size:19px}}
@media(min-width:1200px){h1{font-size:96px}h2{font-size:56px}h3{font-size:28px}}

p{margin:0 0 var(--s2);max-width:var(--measure)}
p:last-child{margin-bottom:0}
em{font-style:italic}
strong{font-weight:600}
.lede{font-size:var(--fs-4);color:var(--ink-2);max-width:48ch;line-height:1.55;margin-bottom:var(--s3)}
.small{font-size:var(--fs-2);color:var(--ink-2)}
.label{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);margin:0 0 var(--s3);display:block}
h2 + p,h2 + .lede{margin-top:var(--s3)}
h3 + p{margin-top:var(--s2)}
* + .stack,* + .checks,* + .steps,* + .figures,* + .scroller,* + .cards,* + .board,* + .chart{margin-top:var(--s4)}

.nav{position:fixed;top:var(--s2);left:50%;transform:translateX(-50%);z-index:50;display:flex;align-items:center;gap:var(--s1);padding:var(--s1);background:rgba(255,255,255,.86);backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:999px;max-width:calc(100vw - var(--s4))}
.nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 var(--s2);border-radius:999px;font-size:var(--fs-1);text-decoration:none;white-space:nowrap;color:var(--ink-2)}
.nav a:hover{background:var(--sunk);color:var(--ink)}
.nav .brand{font-family:var(--serif);font-size:19px;font-weight:300;letter-spacing:-.02em;padding:0 var(--s2);color:var(--ink)}
.nav .cta{background:var(--accent);color:var(--ink);font-weight:500}
.nav .cta:hover{background:var(--accent-deep);color:#FFFFFF}
@media(max-width:720px){.nav{gap:4px;padding:6px}.nav a{padding:0 12px;font-size:13px}.nav .brand{padding:0 10px;font-size:17px}.nav .hide-s{display:none}}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s1);height:56px;padding:0 var(--s4);border-radius:999px;font-family:var(--mono);font-size:13px;letter-spacing:.09em;text-transform:uppercase;text-decoration:none;border:1px solid transparent;cursor:pointer;font-weight:500}
.btn-primary{background:var(--accent);color:var(--ink)}
.btn-primary:hover{background:var(--accent-deep);color:#FFFFFF}
.btn-secondary{background:transparent;color:var(--ink);border-color:var(--line-2)}
.btn-secondary:hover{border-color:var(--ink)}
.section.accent .btn-primary{background:var(--ink);color:#FFFFFF}
.section.accent .btn-primary:hover{background:#000000}
.section.accent .btn-secondary{border-color:rgba(29,29,31,.4)}
.section.accent .btn-secondary:hover{border-color:var(--ink)}
.btn + .btn{margin-left:var(--s2)}
.arrow{display:inline-flex;align-items:center;gap:var(--s1);min-height:44px;font-family:var(--mono);font-size:13px;letter-spacing:.06em;text-decoration:none;color:var(--ink);border-bottom:1px solid var(--accent)}
.arrow:hover{color:var(--accent-deep)}

.stack{list-style:none;margin:0;padding:0;display:grid;gap:1px;background:var(--line);border:1px solid var(--line)}
.stack li{background:var(--ground);padding:var(--s2) var(--s3);font-size:var(--fs-2);color:var(--ink-2)}
.stack b{font-family:var(--mono);font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink);font-weight:500;margin-right:var(--s1)}
.steps{list-style:none;margin:0;padding:0;counter-reset:s}
.steps li{counter-increment:s;display:grid;grid-template-columns:var(--s5) minmax(0,1fr);gap:var(--s3);padding:var(--s2) 0;border-bottom:1px solid var(--line);font-size:var(--fs-2);color:var(--ink-2)}
.steps li::before{content:counter(s,decimal-leading-zero);font-family:var(--mono);font-size:12px;color:var(--accent);padding-top:4px;font-weight:500}
.steps li > div > b{font-family:var(--mono);font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink);font-weight:500}
.steps li:last-child{border-bottom:0}
.checks{list-style:none;margin:0;padding:0}
.checks li{position:relative;padding:var(--s2) 0 var(--s2) var(--s4);border-bottom:1px solid var(--line);font-size:var(--fs-2);color:var(--ink-2)}
.checks li:last-child{border-bottom:0}
.checks li::before{content:"";position:absolute;left:0;top:26px;width:var(--s2);height:2px;background:var(--accent)}

.figures{display:grid;grid-template-columns:repeat(auto-fit,minmax(176px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.figure{background:var(--ground);padding:var(--s3)}
.figure b{display:block;font-family:var(--serif);font-weight:250;font-size:32px;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;margin-bottom:var(--s1)}
@media(min-width:700px){.figure b{font-size:40px}}
.figure span{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);line-height:1.45;display:block}

.card{background:var(--ground);border:1px solid var(--line);padding:var(--s3);display:flex;flex-direction:column;gap:var(--s2)}
.card .label{margin-bottom:0}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(272px,1fr));gap:var(--s3)}

.scroller{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;font-size:var(--fs-2);min-width:480px}
caption{text-align:left;font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);padding-bottom:var(--s2)}
th,td{text-align:left;padding:var(--s2) var(--s3) var(--s2) 0;border-bottom:1px solid var(--line)}
thead th{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-weight:400}
td.num,th.num{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;padding-right:0}
tbody tr:last-child td{border-bottom:0}

.quote{margin:0;padding-left:var(--s3);border-left:2px solid var(--accent);font-family:var(--serif);font-size:28px;font-weight:300;line-height:1.35;max-width:24ch}
@media(min-width:700px){.quote{font-size:36px}}
.quote footer{margin-top:var(--s2);font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);font-style:normal}

.board{background:var(--sunk);border:1px solid var(--line);padding:var(--s4)}
.board .label{margin-bottom:var(--s3)}
.board-flow{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:var(--s2);align-items:stretch}
.board-node{background:var(--ground);border:1px solid var(--line-2);padding:var(--s2);font-size:var(--fs-1)}
.board-node b{display:block;font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:var(--s1);color:var(--accent-deep)}

.chart svg{width:100%;height:auto;display:block;overflow:visible}
.chart .grid line{stroke:var(--line)}
.chart .base{stroke:var(--line-2)}
.chart .bar{fill:var(--accent)}
.chart text{font-family:var(--mono);font-variant-numeric:tabular-nums;fill:var(--ink-3);font-size:11px}
.chart .val{fill:var(--ink);font-size:12px;font-weight:500}

.media{border:1px solid var(--line);background:var(--sunk)}
.media figcaption{font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--ink-3);padding:var(--s2);border-top:1px solid var(--line)}

.field{display:block;margin-bottom:var(--s3)}
.field > span{display:block;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-bottom:var(--s1)}
input[type=text],input[type=email],input[type=url],textarea,select{width:100%;font-family:var(--sans);font-size:16px;color:var(--ink);background:var(--ground);border:1px solid var(--line-2);border-radius:0;padding:var(--s2);height:56px}
textarea{height:auto;min-height:152px;resize:vertical}
input:focus,textarea:focus,select:focus{outline:2px solid var(--accent);outline-offset:0;border-color:var(--accent)}
.radio{display:flex;align-items:center;gap:var(--s2);padding:var(--s2) 0;border-bottom:1px solid var(--line);cursor:pointer;font-size:var(--fs-2);min-height:56px}
.radio input{width:20px;height:20px;accent-color:var(--accent)}

.stage{position:relative;height:320px;background:transparent;overflow:hidden;touch-action:none}
@media(min-width:700px){.stage{height:400px}}
.pill{position:absolute;top:0;left:0;transform:translate(-200%,-200%);display:inline-flex;align-items:center;white-space:nowrap;padding:var(--s2) var(--s3);border-radius:999px;font-family:var(--mono);font-size:12.5px;letter-spacing:.02em;will-change:transform;user-select:none;font-weight:500}
.pill.a{background:#1D1D1F;color:#FFFFFF}
.pill.b{background:#FF6B00;color:#1D1D1F}
.pill.c{background:#333333;color:#FFFFFF}
.pill.d{background:#6B6B6B;color:#FFFFFF}
.pill.e{background:#EAEAEA;color:#1D1D1F}
.stage-note{font-family:var(--mono);font-size:12px;letter-spacing:.07em;color:var(--ink-3);margin:var(--s2) 0 0}

.reveal{opacity:0;transform:translateY(var(--s2));transition:opacity .7s cubic-bezier(.2,.7,.3,1),transform .7s cubic-bezier(.2,.7,.3,1)}
.reveal.in{opacity:1;transform:none}

.price-big{font-family:var(--serif);font-weight:200;font-size:56px;letter-spacing:-.03em;line-height:1;margin:0 0 var(--s1)}
@media(min-width:700px){.price-big{font-size:80px}}
.term{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin:0 0 var(--s4)}

.site-footer{border-top:1px solid var(--line);padding:var(--band) var(--gut) var(--s5)}
.wordmark{font-family:var(--serif);font-weight:200;font-size:64px;line-height:.86;letter-spacing:-.045em;margin:0 0 var(--s4)}
@media(min-width:700px){.wordmark{font-size:160px}}
@media(min-width:1200px){.wordmark{font-size:224px}}
.footer-row{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s4);font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--ink-3)}
.footer-row a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.footer-row a:hover{color:var(--accent-deep)}

.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:#FFFFFF;padding:var(--s2) var(--s3);z-index:99;font-family:var(--mono);font-size:12px}
.skip:focus{left:0}

.swatches{display:grid;grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.sw{background:var(--ground)}
.sw i{display:block;height:72px}
.sw span{display:block;padding:var(--s2);font-family:var(--mono);font-size:11px;letter-spacing:.05em;color:var(--ink-3)}

@media (prefers-reduced-motion:reduce){
*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
.reveal{opacity:1;transform:none}
.stage{height:auto;padding:0;display:flex;flex-wrap:wrap;gap:var(--s1)}
.pill{position:static;transform:none!important}
}
.panel{background:var(--line);border:1px solid var(--line);gap:1px}
.panel > div{background:var(--ground);padding:var(--s3)}
.panel h3{font-family:var(--mono);font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3);font-weight:400;margin:0 0 var(--s2)}
.panel ul{margin:0;padding:0;list-style:none}
.panel li{padding:var(--s2) 0;border-bottom:1px solid var(--line);font-size:var(--fs-2);color:var(--ink-2)}
.panel li:last-child{border-bottom:0}
.after-list{margin-top:var(--s3)}
.section.accent .label,.section.accent p,.section.accent .small{color:var(--ink)}
.btn-row{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;margin-top:var(--s3)}
.btn-row .btn + .btn{margin-left:0}