@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/plex-mono-500.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/plex-mono-600.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 900;font-display:swap;src:url(/fonts/inter.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:600 900;font-display:swap;src:url(/fonts/inter-tight.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* B2B Kits — design system v2 (2026-10-30). Tokens → components → pages → motion → print → breakpoints. */
:root{
  --paper:#f4f5f8;--surface:#fff;--ink:#0a1326;--ink-2:#2a3349;--mute:#5d6680;--line:#e3e7ef;--line-2:#cfd5e1;
  --navy:#0a1326;--navy-2:#13203f;--navy-3:#1c2c55;--on-navy:#e9edf5;--on-navy-mute:#9aa6c2;
  --lime:#d4ff3f;--lime-2:#bfeb2a;--teal:#0b7a84;--amber:#ffb020;--red:#c2382f;
  --r:12px;--r-lg:20px;--r-xl:28px;
  --sh:0 1px 2px rgba(10,19,38,.05),0 12px 32px -18px rgba(10,19,38,.22);--sh-lg:0 40px 90px -40px rgba(10,19,38,.45);
  --display:"Inter Tight",Inter,system-ui,sans-serif;--body:Inter,system-ui,-apple-system,sans-serif;--mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,monospace;
  --wrap:1240px;--gut:clamp(16px,4vw,40px);
  --fs-hero:clamp(2.5rem,1.3rem + 4.6vw,5.4rem);--fs-h2:clamp(1.75rem,1.2rem + 2vw,2.7rem);--fs-h3:clamp(1.15rem,1rem + .5vw,1.35rem);
  --head-h:64px;
}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--head-h) + var(--tb-h,0px) + 12px)}
body{margin:0;font:400 1rem/1.55 var(--body);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;overflow-x:clip}
img{max-width:100%;height:auto;display:block}a{color:inherit}button{font:inherit;color:inherit;cursor:pointer}
h1,h2,h3{font-family:var(--display);letter-spacing:-.025em;line-height:1.05;margin:0 0 .5em;text-wrap:balance}
h1{font-size:var(--fs-hero);font-weight:800}h2{font-size:var(--fs-h2);font-weight:800}h3,.h3{font-size:var(--fs-h3);font-weight:700;letter-spacing:-.015em}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
p{margin:0 0 1em}.lead{font-size:clamp(1.05rem,1rem + .4vw,1.25rem);color:var(--ink-2);line-height:1.5}
.muted{color:var(--mute)}.small{font-size:.85rem}.mono{font-family:var(--mono);font-size:.84em;letter-spacing:-.01em}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.kicker{display:inline-flex;align-items:center;gap:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.13em;font-size:.74rem;color:var(--teal);margin-bottom:1rem}
.kicker::before{content:"";width:22px;height:3px;background:currentColor;border-radius:2px}
.hero .kicker{color:var(--lime)}
section{padding:clamp(3rem,6vw,5.5rem) 0}section.tight{padding-top:1.5rem}
.sec-head{max-width:62ch;margin-bottom:clamp(1.5rem,3vw,2.5rem)}.sec-head p{margin:0}

/* buttons, pills, steppers */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.8rem 1.25rem;border-radius:999px;border:1.5px solid var(--ink);background:var(--ink);color:#fff;font-weight:600;text-decoration:none;line-height:1;transition:transform .15s ease,background .15s ease,box-shadow .15s ease;white-space:nowrap}
.btn:hover{background:var(--navy-3);border-color:var(--navy-3);transform:translateY(-1px)}.btn:active{transform:translateY(0)}
.btn.lime{background:var(--lime);border-color:var(--lime);color:var(--ink)}.btn.lime:hover{background:var(--lime-2);border-color:var(--lime-2)}
.btn.ghost{background:transparent;color:inherit;border-color:currentColor;opacity:.9}.btn.ghost:hover{opacity:1;background:rgba(10,19,38,.05)}
.hero .btn.ghost,.site .btn.ghost{border-color:rgba(255,255,255,.35)}.hero .btn.ghost:hover{background:rgba(255,255,255,.08)}
.btn.sm{padding:.55rem .95rem;font-size:.88rem}.btn[disabled]{opacity:.45;pointer-events:none}
.pill{display:inline-flex;align-items:center;gap:.35rem;padding:.22rem .62rem;border-radius:999px;font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;background:var(--paper);color:var(--ink-2);border:1px solid var(--line)}
.pill.tag{background:var(--lime);color:var(--ink);border-color:transparent}.pill.ok{background:#e6f6ee;color:#0f6b3f;border-color:transparent}.pill.warn{background:#fff3d6;color:#7a4d00;border-color:transparent}
.step{display:inline-flex;align-items:center;border:1.5px solid var(--line-2);border-radius:999px;overflow:hidden;background:#fff;transition:border-color .15s,background .15s}
.step button{width:42px;height:42px;border:0;background:transparent;font-size:1.25rem;font-weight:600;display:grid;place-items:center;color:var(--ink);cursor:pointer;touch-action:manipulation}
.step button:hover{background:var(--paper)}
.step input.qty{width:3.2rem;height:42px;border:0;border-left:1px solid var(--line-2);border-right:1px solid var(--line-2);background:rgba(255,255,255,.75);text-align:center;font-family:var(--mono);font-weight:700;font-size:16px;color:var(--ink);padding:0;-moz-appearance:textfield;cursor:text}
.step input.qty:focus{outline:2px solid var(--ink);outline-offset:-2px;background:#fff}
.step:not(.zero) input.qty{border-color:rgba(10,19,38,.25)}
.step:not(.zero){border-color:var(--ink);background:var(--lime)}.step:not(.zero) button:hover{background:var(--lime-2)}
.step.zero .minus{opacity:.35;pointer-events:none}
.quick{display:flex;gap:.3rem;justify-content:flex-end}.quick button{border:1px solid var(--line-2);background:#fff;border-radius:999px;padding:.28rem .6rem;font-family:var(--mono);font-size:.78rem;font-weight:600;color:var(--ink-2);cursor:pointer;touch-action:manipulation}.quick button:hover{border-color:var(--ink);color:var(--ink)}
.size .quick{grid-column:1/-1}
.rm{min-height:40px;border:0;background:none;color:var(--mute);font-size:.8rem;text-decoration:underline;text-underline-offset:2px;cursor:pointer;padding:.25rem 0}.rm:hover{color:#a3261c}
.lineacts{display:flex;gap:.6rem;align-items:center}
.printonly{display:none}table.t td.kits .step{vertical-align:middle}
.step.bump{animation:bump .3s ease}
@keyframes bump{40%{transform:scale(1.08)}}

/* RUO bar + header */
.ruo{background:var(--navy);color:var(--on-navy-mute);font-size:.78rem;text-align:center;padding:.45rem var(--gut);border-bottom:1px solid rgba(255,255,255,.08)}.ruo b{color:#fff;font-weight:600}
.top{position:sticky;top:0;z-index:60;height:var(--head-h);background:rgba(244,245,248,.82);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--line)}
.top .wrap{height:100%;display:flex;align-items:center;gap:1.5rem}
.logo{display:inline-flex;align-items:center;min-height:44px;gap:.65rem;text-decoration:none;font-family:var(--display);font-weight:800;font-size:1.15rem;letter-spacing:-.02em;line-height:1}
.logo .mark{width:34px;height:34px;border-radius:9px;background:var(--navy);display:grid;place-items:center;position:relative;flex:none}
.logo .mark i{width:18px;height:5px;background:var(--lime);border-radius:2px;display:block;box-shadow:0 -8px 0 0 #fff}
.logo .word small{display:block;font:700 .6rem/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-top:.3rem}
.site .logo .word small{color:var(--on-navy-mute)}.site .logo .mark{background:var(--navy-3)}
nav.main{display:flex;gap:.25rem;margin-left:auto}nav.main a{text-decoration:none;font-weight:500;font-size:.93rem;padding:.5rem .8rem;border-radius:999px;color:var(--ink-2)}
nav.main a:hover{background:rgba(10,19,38,.06);color:var(--ink)}nav.main a[aria-current]{color:var(--ink);font-weight:600;background:rgba(10,19,38,.06)}
.top .actions{display:flex;align-items:center;gap:.6rem}
.sheet-btn .n{display:inline-grid;place-items:center;min-width:1.5rem;height:1.5rem;padding:0 .4rem;border-radius:999px;background:var(--lime);color:var(--ink);font-family:var(--mono);font-size:.78rem;font-weight:600}
.menu-btn{display:none;width:40px;height:40px;border:1px solid var(--line-2);border-radius:999px;background:#fff;place-items:center;align-content:center;gap:4px}
.menu-btn span{display:block;width:16px;height:2px;background:var(--ink);border-radius:2px}

/* hero (navy) */
.hero{background:var(--navy);color:var(--on-navy);padding:clamp(3rem,7vw,6rem) 0 clamp(7rem,12vw,10rem);position:relative;overflow:clip}
.hero::before{content:"";position:absolute;inset:auto -20% -40% -20%;height:60%;background:radial-gradient(60% 80% at 50% 100%,rgba(212,255,63,.18),transparent 70%);pointer-events:none}
.hero .wrap.top-row{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.hero h1{color:#fff;margin-bottom:1rem;font-size:clamp(2.5rem,1.3rem + 4.6vw,4.6rem)}.hero h1 em{font-style:normal;color:var(--lime)}
.hero .lead{color:var(--on-navy-mute);max-width:52ch}
.hero .cta{display:flex;gap:.75rem;flex-wrap:wrap;margin:1.75rem 0 2rem}
.hero .specs{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem .5rem}
.hero .specs li{display:inline-flex;align-items:center;gap:.5rem;font-size:.85rem;color:var(--on-navy);padding:.45rem .8rem;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(255,255,255,.04)}
.hero .specs li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--lime)}
.hero .visual{margin:0;position:relative}
.hero .visual img.stack{width:100%;border-radius:var(--r-xl);box-shadow:var(--sh-lg);aspect-ratio:1376/768;object-fit:cover;display:block}
.hero .visual .kit{position:absolute;left:-22px;bottom:-56px;width:clamp(172px,44%,220px);background:#fff;color:var(--ink);border-radius:18px;padding:.5rem .5rem .7rem;box-shadow:var(--sh-lg);display:grid;gap:.45rem}
.hero .visual .kit img{width:100%;height:auto;aspect-ratio:1;border-radius:12px;display:block}.hero .visual .kit div{display:grid;gap:.1rem;padding:0 .35rem;font-size:.8rem;line-height:1.25}
.hero .visual .kit b{font-family:var(--display);font-size:1.25rem;letter-spacing:-.02em}
.hero .visual .chip{position:absolute;background:#fff;color:var(--ink);border-radius:14px;padding:.6rem .85rem;box-shadow:var(--sh);font-size:.82rem;line-height:1.25;display:grid;gap:.1rem}
.hero .visual .chip b{font-family:var(--display);font-size:1.1rem;letter-spacing:-.02em}
.hero .visual .chip.b{right:-14px;top:14%}
.bento-sec{padding:0 0 clamp(3rem,6vw,5rem);margin-top:calc(-1 * clamp(4.5rem,9vw,7.5rem));position:relative;z-index:2}
.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
.tile{background:#fff;color:var(--ink);border-radius:var(--r-lg);padding:1.25rem 1.35rem;box-shadow:var(--sh);min-height:132px;display:flex;flex-direction:column;justify-content:flex-end;position:relative}
.tile.stat{grid-column:span 3}.tile.stat b{font-family:var(--display);font-size:clamp(2rem,1.4rem + 2vw,3rem);letter-spacing:-.04em;line-height:1;display:block}
.tile.stat span{color:var(--mute);font-size:.88rem;margin-top:.4rem}.tile.stat.lime{background:var(--lime)}.tile.stat.lime b{color:var(--ink)}.tile.stat.lime span{color:var(--ink-2)}
.tile.sample{grid-column:span 7;justify-content:flex-start}.tile.serve{grid-column:span 5;background:var(--navy-2);color:var(--on-navy);justify-content:flex-start}
.tile.serve h2{color:#fff;font-size:var(--fs-h3);font-weight:700;letter-spacing:-.015em}.tile.serve ul{margin:0;padding:0;list-style:none;display:grid;gap:.55rem}.tile.serve li{display:flex;gap:.7rem;align-items:flex-start;color:var(--on-navy-mute);font-size:.93rem}
.tile.serve li b{color:#fff;font-weight:600}.tile.serve li::before{content:"";flex:none;width:18px;height:18px;border-radius:50%;background:var(--lime);margin-top:.25rem;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round' d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E") center/80% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round' d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E") center/80% no-repeat}
.sample .head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:.75rem}.sample .head h2{margin:0;font-size:var(--fs-h3);font-weight:700;letter-spacing:-.015em}
.sample .thumbs{display:flex;gap:.5rem;margin-bottom:.9rem}.sample .thumbs img{width:64px;height:64px;border-radius:12px;background:var(--paper);border:1px solid var(--line)}
.sample .row{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-top:1px solid var(--line);font-size:.93rem;align-items:center}
.sample .row .price{font-family:var(--mono);font-weight:600}.sample .row.total{border-top:2px solid var(--ink);font-weight:600}.sample .row.total .price{font-size:1.15rem}

/* pricing ladder */
.ladder{background:var(--paper)}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.tier{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.5rem;display:flex;flex-direction:column;gap:.5rem;position:relative;transition:transform .2s ease,box-shadow .2s ease}
.tier:hover{transform:translateY(-3px);box-shadow:var(--sh)}
.tier .name{font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:.74rem;color:var(--teal)}
.tier .off{font-family:var(--display);font-size:clamp(2.4rem,1.8rem + 2vw,3.6rem);font-weight:800;letter-spacing:-.04em;line-height:1}.tier .off span{font:600 .95rem var(--body);letter-spacing:0;color:var(--mute);margin-left:.4rem}
.tier .req{font-family:var(--mono);font-size:.84rem;color:var(--ink-2);padding:.45rem .7rem;background:var(--paper);border-radius:8px;align-self:flex-start}
.tier ul{margin:.75rem 0 0;padding:0;list-style:none;display:grid;gap:.5rem;font-size:.92rem;color:var(--ink-2)}.tier li{display:flex;justify-content:space-between;gap:1rem;border-top:1px solid var(--line);padding-top:.5rem}.tier li b{font-family:var(--mono);font-weight:600;color:var(--ink)}
.tier.best{background:var(--navy);color:var(--on-navy);border-color:var(--navy)}.tier.best .name{color:var(--lime)}.tier.best .off,.tier.best li b{color:#fff}.tier.best .off span,.tier.best ul{color:var(--on-navy-mute)}.tier.best .req{background:rgba(255,255,255,.08);color:#fff}.tier.best li{border-color:rgba(255,255,255,.12)}
.tier .best-tag{position:absolute;top:-12px;right:18px;background:var(--lime);color:var(--ink);font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:.3rem .65rem;border-radius:999px}
.compare{margin-top:clamp(1.5rem,3vw,2.5rem);background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow-x:auto}
.compare table{width:100%;border-collapse:collapse;font-size:.93rem}.compare th,.compare td{padding:.8rem 1rem;text-align:left;border-bottom:1px solid var(--line)}
.compare th{font-size:.72rem;text-transform:uppercase;letter-spacing:.09em;color:var(--mute);font-weight:700;background:var(--paper)}
.compare td.num,.compare th.num{text-align:right;font-family:var(--mono);white-space:nowrap}.compare tr:last-child td{border-bottom:0}.compare td.hl{font-weight:600;background:rgba(212,255,63,.25)}

/* steps / trust / faq */
.steps ol{list-style:none;counter-reset:s;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.steps li{counter-increment:s;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.25rem;display:grid;gap:.35rem;align-content:start}
.steps li::before{content:"0" counter(s);font-family:var(--mono);font-weight:600;color:var(--teal);font-size:.9rem;margin-bottom:.4rem}
.steps li b{font-family:var(--display);font-size:1.1rem;letter-spacing:-.015em}.steps li span{color:var(--mute);font-size:.9rem;line-height:1.45}
.trust{background:var(--navy);color:var(--on-navy)}.trust h2{color:#fff}.trust .sec-head p{color:var(--on-navy-mute)}
.trust .cols{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.trust .col{background:var(--navy-2);border:1px solid rgba(255,255,255,.08);border-radius:var(--r-lg);padding:1.5rem;display:grid;gap:.5rem;align-content:start}
.trust .col b{font-family:var(--display);font-size:1.2rem;letter-spacing:-.015em;color:#fff}.trust .col span{color:var(--on-navy-mute);font-size:.93rem;line-height:1.5}
.trust .col .ico{width:40px;height:40px;border-radius:12px;background:rgba(212,255,63,.15);display:grid;place-items:center;color:var(--lime);margin-bottom:.4rem}
.faq details,.faq-l details{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:0 1.25rem;margin-bottom:.6rem}
.faq summary,.faq-l summary{cursor:pointer;font-weight:600;padding:1rem 0;list-style:none;display:flex;justify-content:space-between;gap:1rem;align-items:center}
.faq summary::-webkit-details-marker,.faq-l summary::-webkit-details-marker{display:none}.faq summary::after,.faq-l summary::after{content:"+";font-family:var(--display);font-size:1.4rem;color:var(--mute);transition:transform .2s}
.faq details[open] summary::after,.faq-l details[open] summary::after{transform:rotate(45deg)}.faq details p,.faq-l details p{margin:0 0 1rem;color:var(--ink-2)}
.cta-band{background:var(--lime);color:var(--ink)}.cta-band .wrap{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;flex-wrap:wrap}.cta-band h2{margin:0}

/* catalog */
.cat-head{padding:clamp(2rem,4vw,3rem) 0 1.25rem}.cat-head h1{font-size:clamp(2rem,1.3rem + 2.5vw,3.4rem)}.cat-head p{max-width:70ch;margin:0}
.toolbar{position:sticky;top:var(--head-h);z-index:40;background:rgba(244,245,248,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:.7rem 0}
.toolbar .wrap{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.toolbar input[type=search]{flex:1 1 260px;max-width:360px;min-width:min(240px,100%);padding:.68rem .95rem .68rem 2.4rem;border:1.5px solid var(--line-2);border-radius:999px;font:inherit;font-size:.93rem;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23667089' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") .9rem center/16px no-repeat}
.toolbar input[type=search]:focus,.toolbar select:focus{outline:2px solid var(--ink);outline-offset:1px;border-color:var(--ink)}
.toolbar select{padding:.68rem 2.2rem .68rem .95rem;border:1.5px solid var(--line-2);border-radius:999px;font:inherit;font-size:.9rem;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230a1326' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") right .8rem center/14px no-repeat;appearance:none;-webkit-appearance:none}
.toolbar .view{display:inline-flex;border:1.5px solid var(--line-2);border-radius:999px;overflow:hidden;background:#fff}
.toolbar .view button{border:0;background:transparent;width:42px;height:40px;display:grid;place-items:center;color:var(--mute)}.toolbar .view button[aria-pressed=true]{background:var(--ink);color:#fff}
.toolbar .tiernow{margin-left:auto;font-size:.88rem;display:inline-flex;align-items:center;gap:.5rem;flex-wrap:wrap}.toolbar .count{font-family:var(--mono);font-size:.8rem;color:var(--mute)}
.grid-cat{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;padding-top:1.5rem}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease,border-color .2s}
.card:hover{transform:translateY(-3px);box-shadow:var(--sh);border-color:var(--line-2)}
.card .ph{position:relative;background:var(--paper);aspect-ratio:1/1}.card .ph img{width:100%;height:100%;object-fit:cover}
.card .ph .pill{position:absolute;top:10px;left:10px;background:rgba(255,255,255,.92);backdrop-filter:blur(6px)}.card .ph .pill.fmt{left:auto;right:10px}
.card .body{padding:1rem 1.1rem 1.1rem;display:flex;flex-direction:column;gap:.6rem;flex:1}
.card h2{margin:0;font-size:1.15rem;font-weight:700;letter-spacing:-.015em;overflow-wrap:break-word}.card .desc{color:var(--mute);font-size:.86rem;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.45}
.sizes{display:grid;gap:.45rem;margin-top:auto;container-type:inline-size}
@container (max-width:330px){.size{grid-template-columns:auto 1fr}.size .step{grid-column:1/-1;display:flex}.size .step input.qty{flex:1;width:auto;min-width:0}.size .quick button{flex:1}}
.size{display:grid;grid-template-columns:auto 1fr auto;gap:.65rem;align-items:center;padding:.6rem .7rem;border:1px solid var(--line);border-radius:14px;background:var(--paper)}
.size .sz{font-family:var(--mono);font-weight:600;font-size:.86rem;min-width:3.6rem}
.size .pr{display:grid;line-height:1.2}.size .pr b{font-family:var(--display);font-size:1.15rem;letter-spacing:-.02em}.size .pr small{color:var(--mute);font-size:.74rem}.size .pr .ls{white-space:nowrap}.size .pr s{text-decoration-color:rgba(93,102,128,.7)}
.size.oos{background:#fafbfc}.size.oos .pr b{color:var(--mute)}.oos-t{font-size:.72rem;font-weight:700;color:#7a4d00;text-transform:uppercase;letter-spacing:.06em}
.card .unv{font-size:.76rem;color:#7a4d00;background:#fff3d6;border-radius:8px;padding:.4rem .6rem}
.card .foot{display:flex;justify-content:space-between;gap:1rem;color:var(--mute);font-size:.78rem;padding-top:.5rem;border-top:1px solid var(--line)}
.grid-cat.list{grid-template-columns:1fr;gap:10px}
.grid-cat.list .card{flex-direction:row;align-items:stretch}.grid-cat.list .card .ph{width:150px;flex:none;aspect-ratio:auto}
.grid-cat.list .card .ph .pill.fmt{display:none}.grid-cat.list .card .body{padding:.9rem 1.1rem}.grid-cat.list .card .desc{display:none}
.grid-cat.list .sizes{display:flex;flex-wrap:wrap;gap:.5rem}.grid-cat.list .size{flex:1 1 340px}.grid-cat.list .card .foot{display:none}
.empty-state{padding:3rem 1rem;text-align:center;color:var(--mute)}

/* drawer + sheetbar */
.drawer{position:fixed;inset:0 0 0 auto;width:min(460px,100%);background:#fff;z-index:80;box-shadow:-30px 0 80px -30px rgba(10,19,38,.45);transform:translateX(102%);transition:transform .32s cubic-bezier(.2,.7,.2,1);display:flex;flex-direction:column}
.drawer.open{transform:none}.scrim{position:fixed;inset:0;background:rgba(10,19,38,.4);z-index:70;opacity:0;pointer-events:none;transition:opacity .25s;backdrop-filter:blur(2px)}.scrim.open{opacity:1;pointer-events:auto}
.drawer header{display:flex;justify-content:space-between;align-items:center;padding:1.1rem 1.25rem;border-bottom:1px solid var(--line)}.drawer header h2{margin:0;font-size:var(--fs-h3);font-weight:700;letter-spacing:-.015em}
.drawer .lines{flex:1;overflow:auto;padding:.5rem 1.25rem}
.drawer .line{display:flex;justify-content:space-between;gap:1rem;padding:.9rem 0;border-bottom:1px solid var(--line)}.drawer .line b{font-weight:600;display:block}.drawer .line .meta{color:var(--mute);font-size:.8rem;display:block;margin-top:.15rem}
.drawer .line .right{text-align:right;display:grid;gap:.4rem;justify-items:end}
.drawer .empty{padding:2.5rem 0;text-align:center;color:var(--mute)}
.drawer footer{padding:1rem 1.25rem 1.25rem;border-top:1px solid var(--line);display:grid;gap:.5rem;background:var(--paper)}
.tot{display:flex;justify-content:space-between;font-size:.93rem}.tot.big{font-family:var(--display);font-size:1.45rem;font-weight:800;letter-spacing:-.02em;padding-top:.5rem;border-top:1px solid var(--line);margin-top:.25rem}
.prog{height:6px;background:var(--line);border-radius:3px;overflow:hidden}.prog i{display:block;height:100%;background:var(--ink);width:0;transition:width .3s;border-radius:3px}
.hint{font-size:.85rem;color:var(--ink-2)}.hint.warn{color:#7a4d00}.hint.ok{color:#0f6b3f}
.sheetbar{position:fixed;left:12px;right:12px;bottom:12px;z-index:65;background:var(--navy);color:#fff;border-radius:999px;padding:.6rem .6rem .6rem 1.2rem;display:none;justify-content:space-between;align-items:center;gap:1rem;box-shadow:var(--sh-lg)}
.sheetbar div{display:grid;line-height:1.15}.sheetbar b{font-size:.92rem}.sheetbar span{font-family:var(--mono);font-size:.8rem;color:var(--on-navy-mute)}
.toast{position:fixed;left:50%;bottom:84px;transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:.7rem 1.1rem;border-radius:999px;font-size:.9rem;opacity:0;pointer-events:none;transition:all .25s;z-index:90;white-space:nowrap;max-width:calc(100% - 32px);overflow:hidden;text-overflow:ellipsis}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* PO / forms / prose pages */
.page{padding:clamp(2rem,4vw,3.5rem) 0 clamp(3rem,6vw,5rem)}.page h1{font-size:clamp(2rem,1.3rem + 2.5vw,3.4rem)}
.prose{max-width:76ch}.prose h2{font-size:1.45rem;margin-top:2.2rem}.prose ul{padding-left:1.2rem}.prose li{margin:.4rem 0;color:var(--ink-2)}.prose p{color:var(--ink-2)}
.callout{background:#fff;border:1px solid var(--line);border-left:4px solid var(--lime);border-radius:var(--r);padding:1rem 1.25rem;margin-top:2rem}
.po{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(1rem,3vw,1.75rem);box-shadow:var(--sh)}
table.t{width:100%;border-collapse:collapse;font-size:.92rem}table.t th,table.t td{padding:.7rem .6rem;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
table.t th{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--mute)}table.t .num{text-align:right;font-family:var(--mono);white-space:nowrap}table.t td.mono{white-space:nowrap}
.po .totals{margin-left:auto;max-width:360px;margin-top:1rem}.po .totals .tot{padding:.3rem 0}
.two{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
form.f{display:grid;gap:.95rem}form.f label{display:grid;gap:.35rem;font-weight:600;font-size:.9rem}
form.f input,form.f select,form.f textarea{font:inherit;padding:.75rem .9rem;border:1.5px solid var(--line-2);border-radius:12px;background:#fff;width:100%;transition:border-color .15s,box-shadow .15s}
form.f input:focus,form.f select:focus{outline:0;border-color:var(--ink);box-shadow:0 0 0 3px rgba(212,255,63,.5)}
form.f .row2{display:grid;grid-template-columns:1fr 1fr;gap:.95rem}form.f input.cb{width:22px;height:22px;margin:.1rem 0 0;accent-color:var(--ink)}
.tscroll{overflow-x:auto}form.f .note{font-size:.8rem;color:var(--mute);font-weight:400}
.notice{background:#fff8e6;border:1px solid #f5d78a;border-radius:var(--r);padding:.85rem 1rem;font-size:.9rem}
.kitcard{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.35rem;box-shadow:var(--sh)}.kitcard h2{margin-top:0;font-size:var(--fs-h3);font-weight:700;letter-spacing:-.015em}
.kitcard .row{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-top:1px solid var(--line);font-size:.93rem}.kitcard .row:first-of-type{border-top:0}
.kitcard .row b{color:var(--teal)}

/* footer */
footer.site{background:var(--navy);color:var(--on-navy-mute);padding:clamp(3rem,5vw,4.5rem) 0 2rem;font-size:.9rem}
footer.site .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:2rem;margin-bottom:2.5rem}
footer.site .logo{color:#fff}footer.site .about p{margin:1rem 0 0;max-width:40ch}
footer.site .cols b{display:block;color:#fff;margin-bottom:.7rem;font-weight:600}footer.site .cols a{display:block;color:var(--on-navy-mute);text-decoration:none;padding:.22rem 0}footer.site .cols a:hover{color:#fff}
footer.site .cols span{display:block;font-size:.8rem;margin-top:.3rem;max-width:26ch}
.prose figure.coa{margin:1.6rem 0 2rem;max-width:560px}.prose figure.coa img{display:block;width:100%;height:auto;border:1px solid var(--line,#dfe3ea);border-radius:10px;box-shadow:0 6px 24px rgba(10,19,38,.08);background:#fff}.prose figure.coa figcaption{font-size:.85rem;color:var(--mute,#5b6475);margin-top:.7rem;line-height:1.55}
footer.site .legal{border-top:1px solid rgba(255,255,255,.1);padding-top:1.5rem;font-size:.78rem;line-height:1.6;max-width:110ch}

/* motion: reveal on intersection (app.js adds .in); visible without JS, instant when the user asks for reduced motion */
.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s cubic-bezier(.2,.7,.2,1)}
.js .reveal.in{opacity:1;transform:none}
.js .reveal:nth-child(2){transition-delay:.06s}.js .reveal:nth-child(3){transition-delay:.12s}.js .reveal:nth-child(4){transition-delay:.18s}.js .reveal:nth-child(5){transition-delay:.24s}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.js .reveal{opacity:1;transform:none}}

/* print: the PO is the artifact */
@media print{.printonly{display:inline!important}.ruo,.top,footer.site,.drawer,.scrim,.toast,.noprint,.sheetbar{display:none!important}body{background:#fff}.po{box-shadow:none;border:0;padding:0}.page{padding:0}}

/* breakpoints */
@media (max-width:1024px){
  .tile.stat{grid-column:span 6}.tile.sample{grid-column:span 12}.tile.serve{grid-column:span 12}
  .steps ol{grid-template-columns:repeat(2,1fr)}.trust .cols{grid-template-columns:1fr 1fr}
  footer.site .cols{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  .hero .wrap.top-row{grid-template-columns:1fr}.hero .visual{margin:0 0 3rem;max-width:620px}.hero .visual .kit{left:10px}.hero .visual .chip.b{right:8px}
  .tiers{grid-template-columns:1fr}.compare th:nth-child(5),.compare td:nth-child(5),.po table.t th:nth-child(4),.po table.t td:nth-child(4){display:none}.btn.sm{min-height:40px}
  nav.main{display:none;position:absolute;top:var(--head-h);left:0;right:0;background:#fff;border-bottom:1px solid var(--line);padding:.75rem var(--gut) 1rem;flex-direction:column;gap:.25rem;box-shadow:var(--sh-lg)}
  nav.main.open{display:flex}nav.main a{padding:.8rem .9rem;font-size:1rem}.menu-btn{display:grid}
  .two{grid-template-columns:1fr}
}
@media (max-width:760px){
  :root{--head-h:58px}
  .sheet-btn{display:none}.sheetbar[data-show]{display:flex}
  .toolbar .tiernow,.toolbar .count{display:none}
  .grid-cat{grid-template-columns:1fr 1fr;gap:10px}.card .body{padding:.8rem}.card h2{font-size:1rem}
  .btn.sm{min-height:40px}.toolbar input[type=search]{flex:1 1 100%;max-width:none}
  .size{padding:.5rem .6rem}.size .quick button{padding:.45rem 0}.rm{min-height:40px;padding:.6rem 0}
  .grid-cat.list .card .ph{width:96px}
  .steps ol{grid-template-columns:1fr}.trust .cols{grid-template-columns:1fr}
  .compare th:nth-child(2),.compare td:nth-child(2){display:none}.compare th,.compare td{padding:.65rem .5rem}.compare table{font-size:.84rem}.compare th{font-size:.64rem;letter-spacing:.05em}
  form.f .row2{grid-template-columns:1fr}
  .po table.t thead{display:none}.po table.t,.po table.t tbody{display:block}
  .po table.t tr{display:grid;grid-template-columns:1fr auto;grid-template-areas:'item item' 'qty total' 'rm per';gap:.45rem .8rem;align-items:center;padding:.85rem 0;border-bottom:1px solid var(--line)}
  .po table.t td{border:0;padding:0}.po table.t td:nth-child(1){grid-area:item}.po table.t td:nth-child(3){grid-area:qty;text-align:left}
  .po table.t td:nth-child(5){grid-area:per;color:var(--mute);font-size:.8rem}.po table.t td:nth-child(5)::after{content:'/kit'}.po table.t td:nth-child(6){grid-area:total;font-size:1.05rem}.po table.t td:nth-child(7){grid-area:rm}
  .po table.t td:nth-child(2),.po table.t td:nth-child(4){display:none}.po table.t td.empty{grid-column:1/-1}
  footer.site{padding-bottom:calc(84px + env(safe-area-inset-bottom))}body[data-page=order] .sheetbar{display:none!important}
}
@media (max-width:600px){
  .grid-cat{grid-template-columns:1fr}
  .grid-cat:not(.list) .card{display:grid;grid-template-columns:84px minmax(0,1fr);grid-template-areas:'ph name' 'ph desc' 'sz sz' 'unv unv' 'foot foot';grid-template-rows:auto 1fr;column-gap:.85rem;row-gap:.3rem;padding:.85rem;align-items:start}
  .grid-cat:not(.list) .card .body{display:contents}.grid-cat:not(.list) .card .ph{grid-area:ph;width:84px;border-radius:12px;overflow:hidden}.grid-cat:not(.list) .card .ph .pill{display:none}
  .grid-cat:not(.list) .card h2{grid-area:name;font-size:1.05rem}.grid-cat:not(.list) .card .desc{grid-area:desc}.grid-cat:not(.list) .card .sizes{grid-area:sz;margin-top:.55rem}.grid-cat:not(.list) .card .unv{grid-area:unv;margin-top:.3rem}.grid-cat:not(.list) .card .foot{grid-area:foot;margin-top:.4rem}
}
@media (max-width:440px){
  .grid-cat{grid-template-columns:1fr}
  .tile.stat{grid-column:span 6;min-height:110px;padding:1rem}
  footer.site .cols{grid-template-columns:1fr}
  .hero .cta .btn{flex:1 1 100%}
  .compare th.num{white-space:normal;letter-spacing:.02em}.compare th,.compare td{padding:.6rem .4rem}.compare td:first-child{padding-left:.7rem}
}
@media (max-width:760px){.toolbar{position:static}.step button{width:44px;height:44px}.step input.qty{height:44px}.quick button{min-height:44px}}
/* Custom volume (500+ / 1,000+ kits) and the order-page buyer form */
.custom .vol{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:14px;align-items:start}
.vcards{display:grid;gap:14px}
.vcard{background:var(--ink);color:#fff;border-radius:var(--r-lg);padding:1.5rem;display:grid;gap:.4rem}
.vcard .name{font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:.74rem;color:var(--lime)}
.vcard b{font-family:var(--display);font-size:clamp(1.8rem,1.4rem + 1.4vw,2.6rem);font-weight:800;letter-spacing:-.03em;line-height:1.05}
.vcard p{margin:0;color:rgba(255,255,255,.8);font-size:.95rem}
.custom .kitcard h3{margin:0 0 1rem;font-size:var(--fs-h3);font-weight:700;letter-spacing:-.015em}
form.f label.cbl{font-weight:400;display:grid;grid-template-columns:auto 1fr;gap:.6rem;align-items:start}
form.f textarea{resize:vertical}form.f textarea:focus{outline:0;border-color:var(--ink);box-shadow:0 0 0 3px rgba(212,255,63,.5)}
.po form.buyer{max-width:640px;margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--line)}
.po form.buyer h2{margin:0;font-size:var(--fs-h3);font-weight:700;letter-spacing:-.015em}
@media (max-width:900px){.custom .vol{grid-template-columns:1fr}.vcards{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.vcards{grid-template-columns:1fr}}
/* Price match (Andrew 10/31): lime panel so it reads apart from the volume-quote form below */
.match{padding-bottom:0}
.match .vol{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.25rem,3vw,2.5rem);align-items:center;background:var(--lime);color:var(--ink);border-radius:var(--r-xl);padding:clamp(1.25rem,4vw,3rem)}
.match .kicker{color:var(--ink)}.match h2{margin:0 0 .6rem}.match .lead{color:var(--ink-2);max-width:44ch}.match .small a{color:var(--ink);text-decoration:underline}
.match .muted{color:var(--ink-2)}
ul.checks{list-style:none;margin:1.25rem 0;padding:0;display:grid;gap:.6rem}
ul.checks li{display:grid;grid-template-columns:22px 1fr;gap:.6rem;align-items:start;font-weight:500}
ul.checks li::before{content:"✓";width:22px;height:22px;border-radius:50%;background:var(--ink);color:var(--lime);display:grid;place-items:center;font-size:.75rem;font-weight:800;margin-top:.1rem}
.match .kitcard{box-shadow:var(--sh-lg);border:0}.match .kitcard h3{margin:0 0 1rem;font-size:var(--fs-h3);font-weight:700;letter-spacing:-.015em}
@media (max-width:900px){.match .vol{grid-template-columns:1fr}}
/* Two listed tiers + the custom-quote card (Andrew's price sheet, 10/31) */
.tier.quote{background:var(--ink);border-color:var(--ink);color:#fff}.tier.quote .name{color:var(--lime)}.tier.quote .off span{color:var(--on-navy-mute)}
.tier.quote .req{background:var(--navy-2);color:var(--on-navy)}.tier.quote ul{color:var(--on-navy)}.tier.quote li{border-color:rgba(255,255,255,.12)}
.tier.quote a{color:var(--lime);font-weight:600}.tier.quote li b{color:var(--lime)}
.size .pr small.vt{color:var(--teal);font-weight:600}
/* GLP price block on the homepage (2026-11-01) */
/* the GLP panel takes the slot that overlaps the hero's bottom edge; the bento follows it */
.glp{padding:0 0 clamp(2.5rem,5vw,4rem);margin-top:calc(-1 * clamp(4.5rem,9vw,7.5rem));position:relative;z-index:2}
.glp .panel{background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--sh-lg);padding:clamp(1.25rem,3vw,2.25rem)}
.glp + .bento-sec{margin-top:0}
.glp-card td:first-child{white-space:nowrap}
.glp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:start}
.glp-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.1rem;display:flex;flex-direction:column;gap:.8rem}
.glp-card .gh{display:flex;gap:.75rem;align-items:center}.glp-card .gh img{width:56px;height:56px;border-radius:10px;background:#fff;flex:none}
.glp-card h3{margin:0 0 .15rem}
.glp-card table{width:100%;border-collapse:collapse;font-size:.9rem;background:#fff;border-radius:var(--r);overflow:hidden}
.glp-card th{font-size:.66rem;text-transform:uppercase;letter-spacing:.06em;color:var(--mute);font-weight:700;text-align:left;padding:.55rem .6rem;border-bottom:1px solid var(--line)}
.glp-card td{padding:.5rem .6rem;border-bottom:1px solid var(--line)}.glp-card tr:last-child td{border-bottom:0}
.glp-card .num{text-align:right;font-family:var(--mono);white-space:nowrap}.glp-card td.hl{font-weight:600;background:rgba(212,255,63,.25)}
.glp-card .btn{align-self:flex-start}.glp-note{margin:1rem 0 0}
@media (max-width:1024px){.glp-grid{grid-template-columns:1fr 1fr}}
@media (max-width:700px){.glp-grid{grid-template-columns:1fr}}
@media (max-width:600px){.glp .panel{padding:1.1rem .8rem}.glp-card{padding:.8rem .65rem}}
@media (max-width:400px){.glp-card th,.glp-card td{padding:.5rem .4rem}.glp-card table{font-size:.84rem}.glp-card th{font-size:.6rem;letter-spacing:.03em}}
/* custom price list banner (buyer-specific link from the desk) */
.cpbar{background:var(--lime);color:var(--ink);border-bottom:1px solid var(--lime-2)}
.cpbar .wrap{display:flex;gap:.6rem 1rem;align-items:center;justify-content:space-between;flex-wrap:wrap;padding-top:.6rem;padding-bottom:.6rem;font-size:.92rem}
.cpbar .btn{background:transparent;border-color:rgba(10,19,38,.35);color:var(--ink)}
.size.cpp [data-kit-price]{color:var(--teal)}
.card{scroll-margin-top:1.5rem}.card:target{border-color:var(--teal);box-shadow:0 0 0 3px rgba(11,122,132,.2)}

/* SEO pages (2026-11-02): kit pages, category hubs, buyer guides, reference tables. */
.crumbs{font-size:.8rem;color:var(--mute);margin-bottom:1rem;display:flex;flex-wrap:wrap;gap:.15rem .45rem}.crumbs a{color:var(--mute);text-decoration:none}.crumbs a:hover{color:var(--ink);text-decoration:underline}
.crumbs span[aria-hidden]{color:var(--line-2)}.crumbs [aria-current]{color:var(--ink-2)}
.pdp{padding:clamp(1.5rem,3vw,2.5rem) 0 clamp(2rem,4vw,3rem)}
.pdp-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.pdp-ph{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);overflow:hidden;aspect-ratio:1/1;position:sticky;top:calc(var(--head-h) + 16px)}.pdp-ph img{width:100%;height:100%;object-fit:cover}
.pdp-buy h1{font-size:clamp(2rem,1.4rem + 2.2vw,3.2rem);margin-bottom:.35em}.pdp-buy h1 span{display:block;font-size:.42em;font-weight:600;color:var(--mute);letter-spacing:-.01em;margin-top:.4rem}
.pdp-buy .lead{margin-bottom:1.25rem}.pdp-buy .sizes{margin:0 0 .9rem;gap:.55rem}.pdp-buy .size{background:#fff}.pdp-note{margin:.2rem 0 1rem}
.pdp-buy .cta{display:flex;gap:.6rem;flex-wrap:wrap}.btn.ghost{background:transparent;color:var(--ink)}
.pdp-body,.hub-body{background:#fff;border-top:1px solid var(--line);padding:clamp(2.5rem,5vw,4rem) 0}
.pdp-cols{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.pdp-cols .prose{max-width:76ch;min-width:0}.pdp-cols .prose h2:first-child,.prose>.kicker+h1{margin-top:0}
.pdp-side{position:sticky;top:calc(var(--head-h) + 16px);display:grid;gap:.5rem}.pdp-side h2{font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;color:var(--mute);margin:1.2rem 0 .3rem;font-family:var(--body);font-weight:700}.pdp-side h2:first-child{margin-top:0}
.tbl{position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch;margin:1rem 0 1.5rem;border:1px solid var(--line);border-radius:var(--r);background:#fff}
.tbl table{width:100%;border-collapse:collapse;font-size:.92rem}.tbl th,.tbl td{padding:.7rem .9rem;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.tbl tr:last-child td{border-bottom:0}
.tbl th{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--mute);background:var(--paper);font-weight:700;white-space:nowrap}.tbl th span{text-transform:none;letter-spacing:0;font-weight:500}
table.ptable td:first-child{white-space:nowrap}.tbl .num{text-align:right;font-family:var(--mono);font-size:.86rem;white-space:nowrap}.tbl td.hl{background:#f6ffd9;font-weight:700}
table.spec th{width:34%;background:var(--paper);text-transform:none;letter-spacing:0;font-size:.85rem;color:var(--ink-2);font-weight:600;white-space:normal}
table.ref td:first-child a{font-weight:600;text-decoration:none}table.ref td:first-child a:hover{text-decoration:underline}
.rel{display:grid;grid-template-columns:56px minmax(0,1fr);gap:.75rem;align-items:center;padding:.5rem;border:1px solid var(--line);border-radius:var(--r);background:#fff;text-decoration:none;transition:border-color .15s}
.rel:hover,.glink:hover{border-color:var(--ink)}.rel img{width:56px;height:56px;border-radius:8px;object-fit:cover;background:var(--paper)}.rel b{display:block;font-size:.92rem;line-height:1.25}.rel small{color:var(--mute);font-size:.78rem}
.glink{display:block;padding:.85rem 1rem;border:1px solid var(--line);border-radius:var(--r);background:#fff;text-decoration:none;transition:border-color .15s}.glink b{display:block;font-family:var(--display);font-size:1rem;letter-spacing:-.01em;line-height:1.25;margin-bottom:.3rem}.glink span{display:block;color:var(--mute);font-size:.84rem;line-height:1.45}
.guide-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;margin:1.5rem 0}.guide-grid .glink{padding:1.1rem 1.2rem}
.guides-strip{background:#fff;border-top:1px solid var(--line)}.guides-strip .guide-grid{margin-top:0}
.faq-l{margin:1rem 0 1.5rem}
.page.guide .prose h1{font-size:clamp(2rem,1.3rem + 2.2vw,3rem)}.page.guide .prose h2{margin-top:2.4rem}.page.guide .prose a,.pdp-body .prose a,.hub-body .prose a,.page .prose a{color:var(--teal)}
.chips{display:flex;flex-wrap:wrap;gap:.45rem;margin:1rem 0 0}.chips a{padding:.4rem .85rem;border:1px solid var(--line-2);border-radius:999px;background:#fff;font-size:.85rem;font-weight:600;text-decoration:none}.chips a:hover{border-color:var(--ink)}
.card h2 a{color:inherit;text-decoration:none}.card h2 a:hover{text-decoration:underline;text-underline-offset:3px}
@media (max-width:1024px){footer.site .cols .about{grid-column:1/-1}}
@media (max-width:860px){.pdp-top,.pdp-cols{grid-template-columns:1fr}.pdp-ph{position:static;max-width:440px}.pdp-side{position:static}}
@media (max-width:600px){table.ptable th:nth-child(2),table.ptable td:nth-child(2){display:none}.pdp-ph{max-width:none;aspect-ratio:4/3}.tbl th,.tbl td{padding:.6rem .65rem}.tbl table{font-size:.86rem}table.spec th{width:40%}.guide-grid{grid-template-columns:1fr}}
.mw-form{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(1rem,3vw,1.5rem);margin:1.5rem 0 2rem;max-width:860px}
.mw-form>label{display:block;font-weight:600;font-size:.85rem;margin-bottom:.4rem}
.mw-form textarea{width:100%;font:500 1rem/1.5 var(--mono);letter-spacing:.06em;padding:.75rem .9rem;border:1.5px solid var(--line-2);border-radius:var(--r);resize:vertical;word-break:break-all;background:var(--paper)}
.mw-form textarea:focus,.mw-opts input[type=number]:focus{outline:2px solid var(--ink);outline-offset:1px}
.mw-opts{display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;margin:.8rem 0 1rem;font-size:.92rem}.mw-opts label{display:inline-flex;align-items:center;gap:.45rem;min-height:40px}
.mw-opts input[type=checkbox]{width:18px;height:18px;accent-color:var(--ink)}.mw-opts input[type=number]{width:4.2rem;padding:.45rem .5rem;border:1.5px solid var(--line-2);border-radius:8px;font:inherit}
.mw-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:8px}.mw-grid div{background:var(--paper);border-radius:10px;padding:.65rem .8rem}
.mw-grid span{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--mute);font-weight:700}.mw-grid b{font-family:var(--mono);font-size:1.02rem;font-weight:600;overflow-wrap:anywhere}
.mw-err{color:var(--red);margin:0}.mw-h2{font-size:1.45rem;margin-top:1rem}table.ref td.seq{max-width:240px;overflow-wrap:anywhere;font-size:.78rem}table.ref .btn.sm{min-height:34px;padding:.45rem .8rem}
/* property tools */
.mw-opts select,.mo-sel{padding:.45rem .6rem;border:1.5px solid var(--line-2);border-radius:8px;font:inherit;background:#fff;max-width:100%}
.mo-sel{display:block;width:100%;max-width:520px;margin-bottom:.2rem}.mw-opts input.w7{width:7rem}
.mo-h{font-size:1.02rem;margin:1.3rem 0 0}
.pp-chart{display:block;width:100%;height:auto;margin:1rem 0 .2rem;background:var(--paper);border-radius:10px}
.pp-chart polyline{fill:none;stroke:var(--teal);stroke-width:2.5}.pp-chart .z{stroke:var(--line-2);stroke-dasharray:4 4}.pp-chart .pi{stroke:var(--ink);stroke-width:1.2}
.pp-chart text{font:600 11px var(--body);fill:var(--mute)}
.pp-advice{margin-top:1rem}.pp-advice h3{font-size:1rem;margin:1rem 0 .4rem}.pp-advice ol,.pp-advice ul{margin:0;padding-left:1.3rem;line-height:1.55}.pp-advice li{margin:.25rem 0}