:root{
--ink:#06211f;
--ink-2:#0b302d;
--ink-3:#12423e;
--line:#1d5a53;
--lime:#c9f24d;
--lime-dim:#a8d132;
--mango:#ffb03a;
--coral:#ff6b57;
--cream:#f1f7ec;
--muted:#9dbdb3;
--display:ui-sans-serif,system-ui,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
--body:Georgia,"Iowan Old Style","Times New Roman",serif;
--mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,"Liberation Mono",monospace;
--wrap:44rem;
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}

body{
margin:0;
background:var(--ink);
color:var(--cream);
font-family:var(--body);
font-size:1.0625rem;
line-height:1.7;
}

.skip{
position:absolute;
left:-9999px;
top:0;
background:var(--lime);
color:var(--ink);
padding:.6rem 1rem;
font-family:var(--mono);
z-index:20;
}
.skip:focus{left:0}

a{color:var(--lime);text-decoration:underline;text-underline-offset:.18em}
a:hover{color:var(--mango)}

:focus-visible{outline:3px solid var(--mango);outline-offset:3px}

.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 1.15rem}

.strip{
position:relative;
background:var(--lime);
color:var(--ink);
padding:2.35rem 0 2.5rem;
}
.strip::before,.strip::after{
content:"";
position:absolute;
left:0;
right:0;
height:11px;
background:radial-gradient(circle 6px at 9px 6px,var(--ink) 97%,rgba(0,0,0,0) 100%) 0 0/18px 11px repeat-x;
}
.strip::before{top:0}
.strip::after{bottom:0;transform:rotate(180deg)}

.strip__tag{
font-family:var(--mono);
font-size:.68rem;
letter-spacing:.22em;
text-transform:uppercase;
margin:0 0 .55rem;
color:#2c4a17;
}
.strip__head{
font-family:var(--display);
font-weight:900;
font-size:clamp(1.5rem,6.4vw,2.35rem);
line-height:1.05;
letter-spacing:-.025em;
margin:0 0 .5rem;
}
.strip__sub{
margin:0 0 1.25rem;
font-size:.98rem;
line-height:1.55;
max-width:30rem;
color:#20390f;
}
.strip__meta{
font-family:var(--mono);
font-size:.7rem;
letter-spacing:.12em;
text-transform:uppercase;
margin:.9rem 0 0;
color:#2c4a17;
}

.cta{
font-family:var(--display);
font-weight:800;
font-size:1.02rem;
letter-spacing:.01em;
background:var(--ink);
color:var(--lime);
border:0;
border-radius:2px;
padding:1rem 1.6rem;
cursor:pointer;
box-shadow:5px 5px 0 0 #2c4a17;
transition:transform .12s ease,box-shadow .12s ease;
}
.cta:hover{transform:translate(2px,2px);box-shadow:3px 3px 0 0 #2c4a17}
.cta:active{transform:translate(5px,5px);box-shadow:0 0 0 0 #2c4a17}

.cta--ghost{
background:var(--lime);
color:var(--ink);
box-shadow:5px 5px 0 0 var(--line);
}
.cta--ghost:hover{box-shadow:3px 3px 0 0 var(--line)}
.cta--ghost:active{box-shadow:0 0 0 0 var(--line)}

.masthead{
border-bottom:1px solid var(--line);
background:var(--ink);
}
.masthead__row{
display:flex;
flex-wrap:wrap;
align-items:center;
gap:.85rem 1.4rem;
padding:1.15rem 0;
}
.logo{
display:inline-flex;
align-items:center;
gap:.6rem;
text-decoration:none;
color:var(--cream);
}
.logo__mark{
display:grid;
place-items:center;
width:2.3rem;
height:2.3rem;
border-radius:6px;
background:var(--lime);
color:var(--ink);
font-family:var(--display);
font-weight:900;
font-size:1.4rem;
line-height:1;
}
.logo__word{
font-family:var(--display);
font-weight:900;
font-size:1.35rem;
letter-spacing:-.03em;
}
.logo__word span{color:var(--lime)}

.nav{
display:flex;
flex-wrap:wrap;
gap:.4rem .95rem;
width:100%;
font-family:var(--mono);
font-size:.72rem;
letter-spacing:.12em;
text-transform:uppercase;
}
.nav a{color:var(--muted);text-decoration:none}
.nav a:hover{color:var(--lime)}

main{padding:2.6rem 0 0}

h1{
font-family:var(--display);
font-weight:900;
font-size:clamp(3.1rem,17vw,6.5rem);
line-height:.88;
letter-spacing:-.045em;
margin:0 0 1.1rem;
}
.eyebrow{
font-family:var(--mono);
font-size:.68rem;
letter-spacing:.24em;
text-transform:uppercase;
color:var(--mango);
margin:0 0 .9rem;
}

.lede{
font-size:1.2rem;
line-height:1.6;
color:var(--cream);
margin:0 0 1.35rem;
}

h2{
font-family:var(--display);
font-weight:900;
font-size:clamp(1.55rem,5.4vw,2.05rem);
line-height:1.12;
letter-spacing:-.03em;
margin:3.2rem 0 1rem;
padding-top:1.4rem;
border-top:1px solid var(--line);
}
h2 .idx{
display:block;
font-family:var(--mono);
font-size:.68rem;
font-weight:400;
letter-spacing:.24em;
color:var(--muted);
margin-bottom:.55rem;
}

h3{
font-family:var(--display);
font-weight:800;
font-size:1.1rem;
letter-spacing:-.01em;
margin:2rem 0 .5rem;
color:var(--lime);
}

p{margin:0 0 1.1rem}

.facts{
display:grid;
grid-template-columns:1fr;
gap:0;
border:1px solid var(--line);
background:var(--ink-2);
margin:0 0 2rem;
}
.facts div{
display:flex;
justify-content:space-between;
gap:1rem;
padding:.7rem .95rem;
border-bottom:1px solid var(--ink-3);
}
.facts div:last-child{border-bottom:0}
.facts dt{
font-family:var(--mono);
font-size:.68rem;
letter-spacing:.14em;
text-transform:uppercase;
color:var(--muted);
margin:0;
}
.facts dd{
margin:0;
font-family:var(--mono);
font-size:.8rem;
color:var(--lime);
text-align:right;
}

.callout{
border-left:4px solid var(--mango);
background:var(--ink-2);
padding:1rem 1.1rem;
margin:0 0 1.6rem;
font-size:.98rem;
}
.callout p:last-child{margin-bottom:0}
.callout strong{color:var(--mango)}

.scroller{
overflow-x:auto;
-webkit-overflow-scrolling:touch;
border:1px solid var(--line);
margin:0 0 .7rem;
}
table{
border-collapse:collapse;
width:100%;
min-width:34rem;
font-family:var(--mono);
font-size:.78rem;
line-height:1.5;
}
caption{
text-align:left;
font-family:var(--mono);
font-size:.68rem;
letter-spacing:.18em;
text-transform:uppercase;
color:var(--muted);
padding:.75rem .9rem;
background:var(--ink-2);
border-bottom:1px solid var(--line);
}
th,td{
text-align:left;
padding:.65rem .9rem;
border-bottom:1px solid var(--ink-3);
vertical-align:top;
}
thead th{
background:var(--ink-3);
color:var(--lime);
font-weight:700;
letter-spacing:.06em;
text-transform:uppercase;
font-size:.68rem;
white-space:nowrap;
}
tbody tr:last-child td{border-bottom:0}
tbody th{font-weight:700;color:var(--cream);white-space:nowrap}
.table-note{
font-family:var(--mono);
font-size:.68rem;
letter-spacing:.06em;
color:var(--muted);
margin:0 0 2rem;
}

.checks{list-style:none;padding:0;margin:0 0 1.6rem}
.checks li{
position:relative;
padding-left:1.7rem;
margin-bottom:.6rem;
}
.checks li::before{
content:"";
position:absolute;
left:0;
top:.55rem;
width:.6rem;
height:.6rem;
background:var(--lime);
transform:rotate(45deg);
}
.checks li.minus::before{background:var(--coral)}

.faq{margin:1.4rem 0 0}
.faq__item{
border:1px solid var(--line);
background:var(--ink-2);
margin-bottom:.5rem;
}
.faq__item input{
position:absolute;
opacity:0;
width:1px;
height:1px;
}
.faq__q{
display:flex;
justify-content:space-between;
align-items:flex-start;
gap:1rem;
padding:.95rem 1rem;
cursor:pointer;
font-family:var(--display);
font-weight:700;
font-size:1rem;
line-height:1.35;
}
.faq__q::after{
content:"+";
font-family:var(--mono);
font-size:1.25rem;
line-height:1;
color:var(--lime);
flex:0 0 auto;
}
.faq__item input:checked+.faq__q::after{content:"–"}
.faq__q:hover{color:var(--lime)}
.faq__a{
max-height:0;
overflow:hidden;
padding:0 1rem;
font-size:.98rem;
transition:max-height .25s ease,padding .25s ease;
}
.faq__item input:checked~.faq__a{
max-height:44rem;
padding:0 1rem 1.05rem;
}
.faq__item input:focus-visible+.faq__q{outline:3px solid var(--mango);outline-offset:-3px}

.cards{
display:grid;
grid-template-columns:1fr;
gap:1rem;
margin:1.6rem 0 0;
}
.card{
border:1px solid var(--line);
background:var(--ink-2);
padding:1.25rem 1.2rem 1.35rem;
}
.card__tag{
font-family:var(--mono);
font-size:.66rem;
letter-spacing:.2em;
text-transform:uppercase;
color:var(--mango);
margin:0 0 .5rem;
}
.card h3{margin:0 0 .55rem;font-size:1.08rem;color:var(--cream)}
.card p{font-size:.96rem;margin:0 0 .8rem}
.card p:last-child{margin-bottom:0}

.tail{
border-top:1px solid var(--line);
margin-top:3.2rem;
padding:2.4rem 0 1.6rem;
text-align:center;
}
.tail__head{
font-family:var(--display);
font-weight:900;
font-size:clamp(1.3rem,5vw,1.7rem);
letter-spacing:-.03em;
line-height:1.15;
margin:0 0 .7rem;
}
.tail p{color:var(--muted);font-size:.98rem;max-width:26rem;margin:0 auto 1.3rem}

footer{
border-top:1px solid var(--line);
background:var(--ink-2);
padding:2.2rem 0 2.6rem;
font-size:.9rem;
color:var(--muted);
}
.foot__row{
display:flex;
flex-wrap:wrap;
gap:1rem 1.4rem;
align-items:center;
margin-bottom:1.3rem;
}
.age{
display:inline-grid;
place-items:center;
width:2.6rem;
height:2.6rem;
border-radius:50%;
border:2px solid var(--coral);
color:var(--coral);
font-family:var(--display);
font-weight:900;
font-size:.85rem;
flex:0 0 auto;
}
.foot__nav{
display:flex;
flex-wrap:wrap;
gap:.4rem 1.1rem;
font-family:var(--mono);
font-size:.7rem;
letter-spacing:.12em;
text-transform:uppercase;
width:100%;
}
.foot__nav a{color:var(--muted);text-decoration:none}
.foot__nav a:hover{color:var(--lime)}
footer p{margin:0 0 .8rem;max-width:52rem}
.copy{
font-family:var(--mono);
font-size:.72rem;
letter-spacing:.1em;
color:var(--muted);
margin:1.4rem 0 0;
}

@media (min-width:34rem){
.facts{grid-template-columns:1fr 1fr}
.facts div{border-right:1px solid var(--ink-3)}
.facts div:nth-child(2n){border-right:0}
}

@media (min-width:48rem){
:root{--wrap:47rem}
main{padding-top:3.6rem}
.strip{padding:3rem 0 3.2rem}
.nav{width:auto;margin-left:auto;gap:.4rem 1.1rem}
.foot__nav{width:auto;margin-left:auto}
.cards{grid-template-columns:1fr 1fr;gap:1.15rem}
.tail{padding:3.2rem 0 2rem}
}

@media (prefers-reduced-motion:reduce){
*{transition:none !important}
.cta:hover,.cta:active{transform:none}
}
