:root{--g:#0b1c15;--ink:#0c2017;--pasture:#c6efcf;--straw:#e1f2d5;--crop:#40d08a;--leaf:#9ae3b7;--wood:#163a2c;--soil:#0e150f;--pale:#daf4e0;--mut:#3b5546;--gap:8px;--big:168px;--bar:60px;
--disp:"Archivo","Arial Narrow",Arial,sans-serif;--body:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif;--mono:"DM Mono",ui-monospace,Menlo,Consolas,monospace}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:92px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--g);color:var(--pale);font:400 17px/1.6 var(--body);overflow-x:hidden}
img,svg{max-width:100%}
h1,h2,h3{font-family:var(--disp);font-stretch:112%;line-height:1.08;margin:0;letter-spacing:-.01em;overflow-wrap:break-word}
p{margin:0 0 1em}
a{color:inherit}
:focus-visible{outline:3px solid var(--ink);outline-offset:2px;box-shadow:0 0 0 7px #95ff4a}
.skip{position:absolute;left:-999px;top:8px;z-index:99;background:#95ff4a;color:var(--ink);padding:12px 16px;font-weight:700}
.skip:focus{left:8px}
.mast,.sec,.foot{width:min(1320px,100% - 32px);margin-inline:auto}

/* parcels */
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap)}
.grid>*,.rail>*,.facts>*{min-width:0}
.grid>*{grid-column:span 12}
.p{position:relative;padding:26px;border-radius:3px;background-color:var(--pasture);color:var(--ink)}
.p-pasture{background-color:var(--pasture);background-image:repeating-linear-gradient(118deg,transparent 0 11px,rgba(20,90,53,.07) 11px 12px)}
.p-straw{background-color:var(--straw);background-image:repeating-linear-gradient(0deg,transparent 0 13px,rgba(72,120,30,.07) 13px 14px)}
.p-crop{background-color:var(--crop);background-image:repeating-linear-gradient(90deg,transparent 0 9px,rgba(11,28,21,.08) 9px 10px)}
.p-leaf{background-color:var(--leaf);background-image:repeating-linear-gradient(62deg,transparent 0 10px,rgba(11,60,45,.07) 10px 11px)}
.p-wood{background-color:var(--wood);color:var(--pale);background-image:radial-gradient(rgba(110,220,162,.1) 1.5px,transparent 2px);background-size:14px 14px}
.p-soil{background-color:var(--soil);color:var(--pale);background-image:repeating-linear-gradient(135deg,transparent 0 7px,rgba(120,200,140,.045) 7px 8px)}

/* pivot field */
.pivot{display:block;position:relative;aspect-ratio:1;border-radius:50%;background:conic-gradient(var(--crop) 0 60deg,var(--pasture) 60deg 120deg,#227a57 120deg 205deg,var(--crop) 205deg 290deg,var(--leaf) 290deg);box-shadow:0 0 0 2px var(--g)}
.pivot::after{content:"";position:absolute;inset:44%;border-radius:50%;background:var(--g)}
.pivot i{position:absolute;left:50%;top:calc(50% - 1.5px);width:50%;height:3px;background:var(--g);transform-origin:0 50%;transform:rotate(-150deg);animation:sweep 60s linear infinite}
@keyframes sweep{to{transform:rotate(210deg)}}

/* header */
.mast{position:sticky;top:calc(-1*(var(--big) + var(--gap)));z-index:50;padding:8px 0;background:var(--g)}
.mast-big{display:grid;grid-template-columns:minmax(0,1fr) var(--big) 250px;gap:var(--gap);height:var(--big);margin-bottom:var(--gap)}
.mast-big .p{padding:18px 22px;overflow:hidden}
.mb-word{container-type:inline-size;display:flex;align-items:flex-end}
.mb-word span{font:800 min(9.3cqw,104px)/.9 var(--disp);font-stretch:125%;letter-spacing:-.03em;white-space:nowrap}
.mb-piv{padding:14px!important}
.mb-tag{display:flex;flex-direction:column;justify-content:space-between;font:600 19px/1.2 var(--disp)}
.mb-tag b{font:500 13px/1.2 var(--mono);overflow-wrap:anywhere}
.bar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:var(--gap);height:var(--bar)}
.logo{display:flex;align-items:center;gap:10px;padding:0 18px;background:var(--wood);color:var(--pale);border-radius:3px;text-decoration:none;font:800 18px/1 var(--disp);font-stretch:118%}
.logo .pivot{width:28px;flex:none}
.logo .pivot i{height:2px;top:calc(50% - 1px)}
.nav{display:flex;gap:var(--gap)}
.nav a{flex:1;display:flex;align-items:center;justify-content:center;padding:0 12px;background:#0f281a;color:var(--pale);border-radius:3px;text-decoration:none;font:600 15px/1.1 var(--disp);text-align:center;transition:background .15s}
.nav a:hover{background:#1b4531}
.nav a[aria-current]{background:var(--pasture);color:var(--ink)}
.burger{display:none}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:10px 22px;background:var(--crop);color:var(--ink);border:2px solid var(--ink);border-radius:3px;font:700 16px/1.15 var(--disp);font-stretch:108%;text-decoration:none;cursor:pointer;text-align:center;transition:transform .12s,background .15s}
.btn:hover{background:#5de3a0;transform:translateY(-1px)}
.btn.dark{background:var(--ink);color:var(--pale);border-color:var(--ink)}
.btn.dark:hover{background:#1b4531}
.btn.ghost{background:transparent;color:inherit;border-color:currentColor}
.btn.ghost:hover{background:rgba(90,160,113,.18)}
.btn.sm{min-height:44px;padding:8px 14px;font-size:14px}
.bar-cta{height:var(--bar);border-color:var(--crop);padding-inline:26px}
.btns{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 0}

/* sections */
.sec{margin-top:var(--gap)}
main>.sec+.sec{margin-top:44px}
.lead{font-size:19px;line-height:1.5;max-width:62ch;margin:18px 0 0}
h1{font-size:clamp(32px,4.3vw,58px);font-weight:800;letter-spacing:-.025em}
h2{font-size:clamp(24px,2.5vw,34px);font-weight:700}
h3{font-size:20px;font-weight:700;margin-bottom:8px}
.p>p:last-child{margin-bottom:0}
.eyebrow{font:500 13px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.08em;margin:0 0 16px}
.eyebrow::before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--ink);margin-right:8px}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font:500 13px/1.3 var(--mono);margin-bottom:18px}
.crumbs a{padding:8px 0;text-underline-offset:3px}
.crumbs i{width:14px;height:2px;background:currentColor;opacity:.6}
.top{padding:34px}
.sec-h{display:flex;flex-direction:column;justify-content:space-between;gap:20px;min-height:120px}
.sec-h .pivot{width:88px}
.num{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--ink);color:var(--pale);font:500 16px/1 var(--mono);margin-bottom:22px}
.p-wood .num,.p-soil .num{background:var(--crop);color:var(--ink)}
.feat p,.step p,.use p,.ben p,.ex p{font-size:16px;line-height:1.55}

/* home */
.h-main{padding:38px 36px;display:flex;flex-direction:column;justify-content:center}
.h-bul{display:grid;grid-template-columns:96px minmax(0,1fr);gap:22px;align-items:center}
.h-bul ul{list-style:none;margin:0;padding:0;font:700 18px/1.25 var(--disp)}
.h-bul li{padding:9px 0;border-top:2px solid rgba(11,28,21,.75)}
.h-bul li:first-child{border-top:0}
.h-code{padding:0;overflow:hidden}
.facts{grid-column:1/-1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--gap)}
.fact{padding:20px 22px;display:flex;flex-direction:column;gap:6px}
.fact b{font:800 clamp(24px,2.5vw,36px)/1 var(--disp);font-stretch:118%;letter-spacing:-.02em;overflow-wrap:anywhere}
.fact span{font:500 13px/1.35 var(--mono)}
.fact:nth-child(1){background-color:var(--crop)}
.fact:nth-child(3){background-color:var(--straw)}
.fact:nth-child(4){background-color:var(--leaf)}
.fact:nth-child(5){background-color:var(--wood);color:var(--pale)}
.facts.stack{grid-template-columns:1fr}

/* code */
.codetabs{display:flex;gap:2px;padding:8px 8px 0;background:#070d08}
.codetabs button{min-height:44px;padding:0 18px;background:transparent;color:#a8c8af;border:0;border-radius:3px 3px 0 0;font:500 14px/1 var(--mono);cursor:pointer}
.codetabs button[aria-selected=true]{background:var(--soil);color:var(--crop);box-shadow:inset 0 3px 0 var(--crop)}
pre.code{position:relative;margin:0;padding:52px 20px 20px;overflow-x:auto;background:var(--soil);color:#d3ecd7;font:400 13.5px/1.65 var(--mono);border-radius:3px;max-width:100%;tab-size:2}
pre.code code{font:inherit;background:none;padding:0;color:inherit}
pre.code .k{color:#6fe6a8}pre.code .s{color:#bdf18b}pre.code .c{color:#84a58e}
.copy{position:absolute;top:6px;right:6px;min-width:44px;min-height:44px;padding:0 12px;background:#172a1d;color:var(--pale);border:1px solid #30523c;border-radius:3px;font:500 12px/1 var(--mono);cursor:pointer}
.copy:hover{background:var(--crop);color:var(--ink)}

/* prose */
.prose{padding:38px 40px}
.prose>*{max-width:74ch}
.prose.long{font-size:18px;line-height:1.72}
.prose h2{margin:1.7em 0 .6em;padding-top:.5em;border-top:3px solid var(--ink)}
.prose>h2:first-child{margin-top:0}
.prose h3{margin:1.5em 0 .5em}
.prose a{color:#12563b;font-weight:600;text-underline-offset:3px}
.prose ul,.prose ol{padding-left:1.25em;margin:0 0 1.1em}
.prose li{margin-bottom:.4em}
.prose li::marker{color:#227a57;font-weight:700}
.prose code{font:500 .88em var(--mono);background:rgba(11,28,21,.1);padding:.12em .36em;border-radius:2px;overflow-wrap:anywhere}
.prose pre.code,.prose table{max-width:100%;margin:0 0 1.3em}
.prose table{display:block;overflow-x:auto;border-collapse:collapse;font-size:15px;line-height:1.4}
.prose th,.prose td{padding:10px 14px;border:2px solid var(--straw);text-align:left;vertical-align:top}
.prose th{background:var(--wood);color:var(--pale);font:600 14px/1.3 var(--disp);white-space:nowrap}
.prose td{background:#d1e6c2}
.rail{grid-column:span 12;display:grid;gap:var(--gap);align-content:start}
.side h2{font-size:26px;margin-bottom:10px}
.side .btn{margin-top:8px;width:100%}
.toc h2{font:500 13px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.08em;margin-bottom:12px;font-stretch:100%}
.toc ol{list-style:none;margin:0;padding:0;counter-reset:t}
.toc li{counter-increment:t;border-top:1px solid rgba(154,227,183,.28)}
.toc a{display:grid;grid-template-columns:26px minmax(0,1fr);gap:6px;padding:11px 0;min-height:44px;text-decoration:none;font:500 15px/1.35 var(--body)}
.toc a::before{content:counter(t,decimal-leading-zero);font:500 12px/1.7 var(--mono);color:var(--crop)}
.toc a:hover{color:var(--crop)}

/* faq + cta */
.faq-list{grid-column:span 12;display:grid;gap:var(--gap);align-content:start}
details.p{padding:0}
summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:60px;padding:14px 22px;cursor:pointer;list-style:none;font:700 18px/1.25 var(--disp)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";flex:none;width:32px;height:32px;border-radius:50%;background:var(--ink);color:var(--pale);font:500 20px/31px var(--mono);text-align:center;transition:transform .2s}
details[open] summary::after{transform:rotate(45deg)}
details p{padding:0 22px 20px;margin:0;max-width:78ch}
.cta-t{padding:40px 36px}
.cta-t h2{font-size:clamp(28px,3.4vw,46px);font-weight:800;margin-bottom:12px}
.cta-t p{font-size:19px;max-width:54ch}
.cta-b{display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;gap:20px;overflow:hidden}
.cta-b .pivot{width:120px;align-self:flex-end}
.top-side{display:flex;flex-direction:column;justify-content:space-between;gap:18px}
.top-side .pivot{width:84px}

/* key page */
.k-form{padding:26px;background-image:none;background-color:#eefbe6;box-shadow:inset 0 0 0 3px var(--crop)}
.tabs2{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;background:var(--ink);border-radius:3px;margin-bottom:16px}
.tabs2 button{min-height:44px;background:transparent;color:var(--pale);border:0;border-radius:2px;font:700 15px/1.1 var(--disp);cursor:pointer}
.tabs2 button[aria-selected=true]{background:var(--crop);color:var(--ink)}
.msg:empty{display:none}
.msg{margin:0 0 14px;padding:12px 14px;background:var(--pasture);border-left:5px solid #227a57;font-size:15px;line-height:1.4}
.msg.err{background:#fbfad9;border-left-color:#b39d0c;color:#7d6f05}
.row{margin-bottom:14px}
.row label,.calc label{display:block;font:600 14px/1.3 var(--disp);margin-bottom:6px}
input,select,textarea{width:100%;min-height:48px;padding:10px 14px;background:#f9fff6;color:var(--ink);border:2px solid var(--ink);border-radius:3px;font:400 16px/1.4 var(--body)}
textarea{min-height:150px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:0;border-color:#227a57;box-shadow:0 0 0 4px rgba(64,208,138,.5)}
.note{font-size:13.5px;line-height:1.45;color:var(--mut);margin:8px 0 0}
.mut{color:var(--mut)}
.form .btn[data-submit],form[data-support] .btn{width:100%;min-height:54px;background:var(--ink);color:var(--pale);font-size:17px;margin-top:4px}
.form .btn[data-submit]:hover,form[data-support] .btn:hover{background:#1b4531}
.form .btn.ghost{background:#f9fff6;color:var(--ink);border-color:var(--ink)}
.keyout{display:none}
.keyout.on{display:block;margin-top:6px}
.keyout h3{font-size:22px}
.keybox{display:flex;align-items:center;gap:10px;padding:10px 10px 10px 16px;background:var(--soil);color:var(--crop);border-radius:3px;font:500 14px/1.4 var(--mono)}
.keybox span{flex:1;min-width:0;overflow-wrap:anywhere}
.keyout p{font-size:15px;margin:12px 0}
.keyout code{font:500 13px var(--mono);overflow-wrap:anywhere}
.acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.ben h3{font-size:18px}

/* pricing */
.calc-t{padding:30px}
.calc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:end}
.calc>div{min-width:0}
.calc label{color:var(--pale);font:500 13px/1.3 var(--mono)}
.calc input{border-color:var(--crop);font:500 20px/1.2 var(--mono);min-height:56px}
.calc output{display:block;font:800 clamp(34px,4.4vw,56px)/1 var(--disp);font-stretch:118%;color:var(--crop);min-height:56px;overflow-wrap:anywhere}
.ex h3{font-size:18px;line-height:1.25}

/* article / support / 404 */
.date{font:500 13px/1.3 var(--mono);margin:20px 0 0}
.take h2{font:500 13px/1.3 var(--mono);text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px;font-stretch:100%}
.take ul{list-style:none;margin:0;padding:0;counter-reset:k}
.take li{counter-increment:k;display:grid;grid-template-columns:30px minmax(0,1fr);gap:8px;padding:11px 0;border-top:2px solid rgba(11,28,21,.75);font:600 16px/1.4 var(--body)}
.take li:first-child{border-top:0}
.take li::before{content:counter(k);font:500 13px/1.8 var(--mono)}
.sup{padding:30px}
.sup form{margin-top:0!important}
.sup [data-support-msg]{font-weight:600}
.sup-piv{display:flex;align-items:center;justify-content:center;min-height:180px}
.sup-piv .pivot{width:min(220px,60%)}
.nf-piv{display:flex;align-items:center;justify-content:center}
.nf-piv .pivot{width:min(240px,70%)}
.nf-l{display:flex;align-items:flex-end;min-height:96px;text-decoration:none;font:700 18px/1.2 var(--disp)}
.nf-l:hover{background-color:var(--crop)}

/* footer */
.foot{margin-top:56px;padding-bottom:28px}
.f-brand p{margin:14px 0 0;font-size:15px;color:#bce3c6}
.f-brand .logo{padding:0;background:none;display:inline-flex;min-height:44px;font-size:20px}
.f-links{display:flex;flex-wrap:wrap;gap:4px 22px;align-content:center}
.f-links a{display:inline-flex;align-items:center;min-height:44px;font-size:15px;text-underline-offset:3px}
.f-cta{display:flex;align-items:center;justify-content:center}
.f-cta .btn{width:100%}
.f-legal{grid-column:1/-1;margin:10px 2px 0;font:400 13px/1.5 var(--mono);color:#a8ccb2}

@media (min-width:980px){
.h-main{grid-column:1/8;grid-row:1/3}.h-bul{grid-column:8/13}.h-code{grid-column:8/13}
.sec-h{grid-column:span 3}
.feats .feat:nth-child(2){grid-column:span 5}.feats .feat:nth-child(3){grid-column:span 4}
.feats .feat:nth-child(4){grid-column:span 7}.feats .feat:nth-child(5){grid-column:span 5}
.feats .feat:nth-child(6){grid-column:span 5}.feats .feat:nth-child(7){grid-column:span 7}
.step,.ex{grid-column:span 3}
.uses .sec-h{grid-column:span 4}.uses .use{grid-column:span 4}.uses .use:nth-child(2){grid-column:span 8}
.two>.prose,.art>.prose{grid-column:span 8}.two>.rail,.art>.rail{grid-column:span 4}
.docs>.rail{grid-column:span 3}.docs>.prose{grid-column:span 9}
.rail{position:sticky;top:84px}
.toc{max-height:calc(100vh - 100px);overflow-y:auto}
.faq-list{grid-column:span 9}
.cta-t{grid-column:span 8}.cta-b{grid-column:span 4}
.t-wide{grid-column:span 9}.top-side{grid-column:span 3}
.t-art{grid-column:span 7}.take{grid-column:span 5}
.k-top{grid-column:1/8}.k-form{grid-column:8/13;grid-row:1/4}
.ben{grid-column:span 3}.ben:nth-child(4),.ben:nth-child(5){grid-column:span 4}
.keyhero .ben:nth-child(3){grid-column:1/4}.keyhero .ben:nth-child(5){grid-column:1/5}
.calc-t{grid-column:span 9}
.t-sup{grid-column:1/6;grid-row:1}.sup-piv{grid-column:1/6;grid-row:2}.sup{grid-column:6/13;grid-row:1/3}
.nf-piv{grid-column:span 4}.nf-top{grid-column:span 8}.nf-l{grid-column:span 2}.nf-l:nth-of-type(1){grid-column:span 4}
.f-brand{grid-column:span 4}.f-links{grid-column:span 5}.f-cta{grid-column:span 3}
}
@media (min-width:1180px){
main>.sec>.grid{width:calc(100% - 72px)}
main>.sec:nth-child(even)>.grid{margin-left:72px}
}
@media (max-width:979px){
:root{--big:96px;--bar:52px}
html{scroll-padding-top:76px}
.mast-big{grid-template-columns:minmax(0,1fr) var(--big)}
.mb-tag{display:none}
.mast-big .p{padding:10px 14px}
.mb-piv{padding:10px!important}
.mb-word span{font-size:min(14.2cqw,58px);white-space:normal;line-height:.92}
.bar{grid-template-columns:minmax(0,1fr) auto var(--bar);position:relative}
.logo{padding:0 12px;font-size:15px;gap:8px}
.logo .pivot{width:24px}
.bar-cta{padding-inline:14px;font-size:14.5px;min-height:0}
.burger{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:var(--bar);height:var(--bar);background:var(--pasture);border:0;border-radius:3px;cursor:pointer}
.burger i{width:22px;height:3px;background:var(--ink)}
.nav{display:none;position:absolute;top:calc(100% + var(--gap));left:0;right:0;grid-template-columns:1fr 1fr;gap:var(--gap);padding:var(--gap);background:var(--g);box-shadow:0 18px 30px rgba(0,0,0,.55)}
.nav.open{display:grid}
.nav a{min-height:52px;justify-content:flex-start;padding:0 16px;font-size:16px}
.nav a:first-child{grid-column:1/-1}
main>.sec+.sec{margin-top:28px}
.p{padding:22px 20px}
.top,.h-main,.cta-t{padding:26px 20px}
.prose{padding:26px 20px}
.prose.long{font-size:17px}
.lead{font-size:17.5px}
.sec-h{min-height:0}
.faq .sec-h .pivot{display:none}
.facts{grid-template-columns:1fr 1fr}
.facts .fact:first-child{grid-column:1/-1}
.facts.stack .fact{grid-column:1/-1}
.h-code,.k-form{padding:0}
.k-form{padding:20px 16px}
.calc{grid-template-columns:1fr}
.docs>.rail,.art>.rail{order:-1}
.art>.rail .side{display:none}
.cta-b .pivot,.top-side .pivot{display:none}
.sup-piv{display:none}
.nf-l{min-height:60px;align-items:center}
summary{font-size:17px;padding:12px 18px}
details p{padding:0 18px 18px}
}
@media (min-width:640px) and (max-width:979px){
.feat,.step,.use,.ben,.ex,.nf-l{grid-column:span 6}
.facts{grid-template-columns:repeat(6,minmax(0,1fr))}
.facts .fact,.facts .fact:first-child{grid-column:span 2}
.facts .fact:nth-child(4),.facts .fact:nth-child(5){grid-column:span 3}
.facts.stack .fact{grid-column:1/-1!important}
.calc{grid-template-columns:1fr 1fr}
.calc>div:last-child{grid-column:1/-1}
}
@media (max-width:419px){
.logo span:last-child{width:min-content;line-height:1}
.bar-cta{padding-inline:11px}
.h-bul{grid-template-columns:64px minmax(0,1fr);gap:16px}
}
@media (prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
*,*::before,*::after{animation:none!important;transition:none!important}
}
