/* CUTLINE — product page v3 on the CTRL design system (2026-09-30).
   Anton for display, Archivo for text, IBM Plex Mono for spec fields.
   Ink / Bone / Stone. Flare is a signal only (POM tags, eyebrow dot, the launch tag).
   CTAs are ink/bone pills, as on ctrlclub-futbol.com. Scoped to body.cl.
   The order form (cutline-order.js) keeps its ids and .ofield/.oerr/.ook classes. */
.cl{
  --k:#0B0B0C; --k2:#1C1C1F; --bone:#F4F3EF; --paper:#FFFFFF; --stone:#E9E9E6; --mist:#D8D8D4;
  --grey:#5C5C61; --grey-d:#A9A9AD; --flare:#FFB020; --flare-t:#FFF3D6; --err:#B3261E;
  --line:rgba(11,11,12,.12); --line-2:rgba(11,11,12,.26); --line-d:rgba(244,243,239,.16);
  --dsp:'Anton','Archivo Black',Impact,sans-serif; --txt:'Archivo','Helvetica Neue',Arial,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,Menlo,Consolas,monospace;
  --gut:clamp(16px,4vw,48px); --max:1320px; --ez:cubic-bezier(.2,.7,.2,1);
}
body.cl{background:var(--paper);color:var(--k);font:400 16px/1.6 var(--txt);overflow-x:hidden}
.cl :focus-visible{outline:2px solid var(--k);outline-offset:3px}
.cl .dk :focus-visible,.cl .hd :focus-visible,.cl .cl-bar :focus-visible{outline-color:var(--bone)}
.cl ::selection{background:var(--k);color:var(--bone)}
.cl .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---- shared Institute header, themed ink on this page ---- */
.cl .hd{background:rgba(11,11,12,.94);border-bottom:1px solid var(--line-d);color:var(--bone)}
.cl .hd.scrolled{border-bottom-color:var(--line-d)}
.cl .hd a.nl,.cl .hd button.nl,.cl .hd .mark{color:var(--bone)}
.cl .menu{background:var(--k);border-bottom-color:var(--line-d);color:var(--bone)}
.cl .menu h4,.cl .menu a .d{color:var(--grey-d)}
.cl .scrim{background:rgba(0,0,0,.45)}

/* ---- primitives ---- */
.cl-w{max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
.cl-sec{padding:clamp(64px,9vw,120px) 0}
.dk{background:var(--k);color:var(--bone)}
.bn{background:var(--bone)}
.st{background:var(--stone)}
.wh{background:var(--paper)}
.cl-eb{font:600 12px/1.2 var(--txt);letter-spacing:.18em;text-transform:uppercase;color:var(--grey);margin:0 0 18px;display:flex;align-items:center;gap:10px}
.dk .cl-eb{color:var(--grey-d)}
.cl-eb i{width:7px;height:7px;border-radius:50%;background:var(--flare);flex:none}
.cl-h1{font:400 clamp(52px,12vw,112px)/.9 var(--dsp);text-transform:uppercase;letter-spacing:.005em;margin:0}
@media (min-width:1101px){.cl-h1{font-size:clamp(64px,6.2vw,100px)}}
.cl-h1 span{display:block}
.cl-h2{font:400 clamp(40px,5.6vw,80px)/.92 var(--dsp);text-transform:uppercase;letter-spacing:.005em;margin:0 0 20px}
.cl-h3{font:700 18px/1.3 var(--txt);margin:0 0 8px}
.cl-lede{font-size:clamp(17px,1.45vw,19px);line-height:1.55;color:#3A3A3E;max-width:540px;margin:0}
.dk .cl-lede{color:#D2D2CF}
.cl-mut{color:var(--grey)}
.dk .cl-mut{color:var(--grey-d)}
.cl-fine{font-size:13px;line-height:1.6;color:var(--grey);max-width:780px;margin:0}
.dk .cl-fine{color:var(--grey-d)}
.cl-mono{font-family:var(--mono)}
.cl-hdrow{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:24px clamp(24px,5vw,80px);align-items:end;margin-bottom:clamp(32px,5vw,56px)}
.cl-hdrow .cl-h2{margin:0}
.cl-hdcta{justify-self:start}

/* buttons — ink / bone pills, like the CTRL store */
.cl-btns{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.cl-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 28px;border-radius:999px;border:1.5px solid var(--k);background:var(--k);color:var(--paper);font:700 14px/1 var(--txt);letter-spacing:.05em;text-transform:uppercase;cursor:pointer;transition:background .25s,color .25s,border-color .25s,transform .2s;text-align:center}
.cl-btn:hover{background:var(--k2)}
.cl-btn:active{transform:scale(.985)}
.cl-btn.bo{background:var(--bone);border-color:var(--bone);color:var(--k)}
.cl-btn.bo:hover{background:var(--paper);border-color:var(--paper)}
.cl-btn.gh{background:transparent;color:var(--k)}
.cl-btn.gh:hover{background:var(--k);color:var(--paper)}
.dk .cl-btn.gh{color:var(--bone);border-color:rgba(244,243,239,.45)}
.dk .cl-btn.gh:hover{background:var(--bone);color:var(--k);border-color:var(--bone)}
.cl-link{font:700 13px/1 var(--txt);letter-spacing:.06em;text-transform:uppercase;border-bottom:1.5px solid currentColor;padding-bottom:3px}

/* ---- wordmark: CUTLINE, cut once ---- */
.cl-wm{position:relative;display:inline-block;font:400 clamp(28px,2.6vw,38px)/1 var(--dsp);letter-spacing:.03em;margin:0 0 26px;padding-right:.1em}
.cl-wm span{display:block}
.cl-wm span:first-child{clip-path:inset(0 0 50% 0)}
.cl-wm span+span{position:absolute;left:0;top:0;clip-path:inset(50% 0 0 0);transform:translateX(.08em)}
.cl-wm::after{content:"";position:absolute;left:-.25em;right:-.5em;top:50%;height:1.5px;margin-top:-.75px;background:currentColor;opacity:.9}

/* ---- announcement bar (ink, like CTRL) ---- */
.cl-bar{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 16px;background:var(--k);color:var(--bone);font:600 11.5px/1.5 var(--txt);letter-spacing:.14em;text-transform:uppercase;text-align:center;padding:10px var(--gut);border-bottom:1px solid var(--line-d)}
.cl-bar b{color:var(--flare);font-weight:700}
.cl-bar s{opacity:.6}
.cl-bar a{text-decoration:underline;text-underline-offset:3px;white-space:nowrap;font-weight:700}

/* ---- hero ---- */
.cl-hero{overflow:hidden}
.cl-hero .cl-w{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:clamp(36px,5vw,80px);align-items:center;padding-top:clamp(52px,7vw,104px);padding-bottom:clamp(60px,7vw,110px)}
.cl-hero .cl-lede{margin:26px 0 32px}
.cl-offer{margin:22px 0 0;font:500 14px/1.5 var(--txt);color:var(--grey-d)}
.cl-offer b{font:400 24px/1 var(--dsp);color:var(--bone);letter-spacing:.01em}
.cl-offer s{color:var(--grey-d)}

/* the pack card */
.hc{margin:0;background:var(--bone);color:var(--k);border-radius:10px;overflow:hidden;box-shadow:0 40px 90px rgba(0,0,0,.5);animation:hcin .9s var(--ez) .1s both}
@keyframes hcin{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.hc-hd{display:flex;gap:6px 16px;align-items:center;flex-wrap:wrap;background:var(--k);color:var(--bone);padding:11px 18px;font:500 10.5px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid var(--line-d)}
.hc-brand{font:400 17px/1 var(--dsp);letter-spacing:.06em}
.hc-id{margin-left:auto;color:var(--grey-d)}
.hc-body{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.hc-fig{padding:18px 10px 10px 16px;border-right:1px solid var(--line);display:flex;flex-direction:column;justify-content:center}
.hc-fig .fl{width:100%;height:auto;display:block}
.hc-note{margin:6px 0 0;font:500 10px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--grey)}
.hc-spec{padding:18px 18px 16px;min-width:0}
.hc-name{font:400 clamp(20px,1.9vw,26px)/1 var(--dsp);text-transform:uppercase;margin:0 0 14px}
.hc-lbl{font:500 10px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--grey);margin:14px 0 6px}
.hc-lbl:first-of-type{margin-top:0}
.hc-tbl{width:100%;border-collapse:collapse;font:400 12.5px/1.3 var(--txt)}
.hc-tbl th{font:500 9.5px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--grey);text-align:left;padding:0 6px 6px 0;border-bottom:1.5px solid var(--k)}
.hc-tbl td{padding:6px 6px 6px 0;border-bottom:1px solid var(--line)}
.hc-tbl .n{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.hc-tbl td.n{font-weight:500}
.hc-tbl .t{color:var(--grey)}
.hc-tbl td.c{font:700 11px/1 var(--mono);width:26px}
.hc-tbl tbody tr{animation:hcrow .5s var(--ez) both;animation-delay:calc(1.3s + var(--i) * .12s)}
@keyframes hcrow{from{opacity:0;transform:translateX(8px)}to{opacity:1;transform:none}}
.hc-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 14px}
.hc-chips li{display:flex;align-items:center;gap:7px;font-size:12px}
.hc-chips i{width:16px;height:16px;border-radius:3px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.2)}
.hc-chips b{font:500 11.5px/1 var(--mono)}
.hc-chips span{color:var(--grey)}
.hc-flags{list-style:none;margin:0;padding:0;display:grid;gap:5px}
.hc-flags li{display:flex;gap:8px;align-items:center;font-size:12.5px;line-height:1.3}
.hc-flags b,.cl-flagcard b{flex:none;display:inline-block;min-width:62px;text-align:center;font:600 9.5px/1.9 var(--mono);letter-spacing:.08em;text-transform:uppercase;background:var(--k);color:var(--bone);padding:0 6px;border-radius:2px}
.hc-flags b.caution,.cl-flagcard b.caution{background:var(--flare);color:var(--k)}
.hc-ft{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 14px;padding:9px 18px;border-top:1px solid var(--line);background:#EDECE7;font:500 10px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--grey)}

/* the technical flat */
.fl-ln{fill:none;stroke:var(--k);stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round}
.fl-rib{fill:none;stroke:var(--k);stroke-opacity:.16;stroke-width:1}
.fl-btn{fill:var(--bone);stroke:var(--k);stroke-width:2}
.fl-g line{stroke:var(--k);stroke-width:1.5;stroke-dasharray:6 5}
.fl-end{fill:var(--k)}
.fl-tag circle{fill:var(--flare);stroke:var(--k);stroke-width:1.5}
.fl-tag text{font:700 15px/1 var(--txt);text-anchor:middle;fill:var(--k)}
.fl-anim .fl-ln{stroke-dasharray:1;stroke-dashoffset:1;animation:fldraw 1.4s var(--ez) .35s forwards}
.fl-anim .fl-rib,.fl-anim .fl-btn{opacity:0;animation:flfade .6s ease 1.3s forwards}
.fl-anim .fl-g{opacity:0;animation:flfade .45s ease forwards;animation-delay:calc(1.5s + var(--i) * .16s)}
@keyframes fldraw{to{stroke-dashoffset:0}}
@keyframes flfade{to{opacity:1}}
@media (prefers-reduced-motion:reduce){
  .hc,.hc-tbl tbody tr{animation:none}
  .fl-anim .fl-ln{animation:none;stroke-dasharray:none;stroke-dashoffset:0}
  .fl-anim .fl-rib,.fl-anim .fl-btn,.fl-anim .fl-g{animation:none;opacity:1}
}

/* ---- proof numbers ---- */
.cl-statw{padding-top:clamp(40px,5vw,64px);padding-bottom:clamp(40px,5vw,64px)}
.cl-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1.5px solid var(--k)}
.cl-stats div{padding:22px 20px 4px 0}
.cl-stats b{display:block;font:400 clamp(44px,5vw,72px)/1 var(--dsp);letter-spacing:.01em}
.cl-stats small{font-size:.5em}
.cl-stats span{display:block;margin-top:8px;font:600 12px/1.4 var(--txt);letter-spacing:.14em;text-transform:uppercase;color:var(--grey)}
.cl-stats-note{margin:28px 0 0;max-width:760px;color:#3A3A3E}

/* ---- what comes back: CTRL-style product tiles ---- */
.tls{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,20px) clamp(10px,1.4vw,18px)}
.tl{min-width:0;display:flex;flex-direction:column}
.tl-ph{min-height:0;flex:none}
.tl-ph{aspect-ratio:1/1;background:var(--stone);border-radius:6px;overflow:hidden;display:flex;align-items:center;justify-content:center;position:relative}
.tl-ph picture,.tl-ph img{width:100%;height:100%;display:block}
.tl-cw picture{display:block;width:100%;height:100%}
.tl-img img{object-fit:contain;padding:8%;mix-blend-mode:multiply}
.tl-n{margin:14px 0 3px;font:700 13.5px/1.3 var(--txt);letter-spacing:.06em;text-transform:uppercase}
.tl-m{margin:0;font:500 12px/1.45 var(--mono);color:var(--grey);letter-spacing:.01em;text-transform:none}
.og-doc{width:62%;aspect-ratio:1/1.3;background:var(--paper);box-shadow:0 18px 40px rgba(0,0,0,.14);display:flex;flex-direction:column;border-radius:3px;overflow:hidden}
.og-hd{display:flex;justify-content:space-between;gap:6px;white-space:nowrap;background:var(--k);color:var(--bone);font:500 9px/1 var(--mono);letter-spacing:.08em;padding:8px 10px}
.og-hd span:first-child{font:400 12px/1 var(--dsp);letter-spacing:.06em}
.og-doc .fl{width:78%;height:auto;margin:6% auto 0;display:block}
.og-rows{margin:auto 10px 12px;display:grid;gap:5px}
.og-rows i{display:block;height:5px;background:var(--mist);border-radius:2px}
.og-rows i:nth-child(2){width:80%}.og-rows i:nth-child(4){width:60%}
.tl-json{background:var(--k)}
.tl-code{margin:0;padding:8% 8%;width:100%;font:400 clamp(9.5px,.92vw,12.5px)/1.65 var(--mono);color:var(--bone);white-space:pre-wrap;overflow-wrap:anywhere;overflow:hidden;text-transform:none;letter-spacing:0}
.tl-cw{list-style:none;margin:0;padding:0 8%;display:flex;flex-wrap:wrap;justify-content:center;align-content:center;gap:8px;width:100%;box-sizing:border-box}
.tl-cw li{flex:0 0 calc(25% - 6px);aspect-ratio:1/1;border-radius:4px;overflow:hidden;background:#F1F0ED}
.tl-cw img{object-fit:cover}
.cl-more{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 24px;margin:clamp(28px,4vw,44px) 0 0}

/* ---- trust + the real confidence box ---- */
.cl-tr{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,5vw,80px);align-items:start}
.cl-trust{margin:clamp(24px,3vw,40px) 0 0;padding:0;display:grid;gap:26px;counter-reset:t}
.cl-trust li{list-style:none;border-top:1.5px solid var(--k);padding-top:18px;display:grid;grid-template-columns:64px minmax(0,1fr);column-gap:16px}
.cl-trust .n{grid-row:span 2;font:400 40px/1 var(--dsp)}
.cl-trust p{margin:0;color:#3A3A3E}
.cl-flagcard{background:var(--paper);border:1.5px solid var(--k);border-radius:8px;overflow:hidden;position:sticky;top:96px}
.cl-flag-hd{display:flex;justify-content:space-between;gap:10px;margin:0;background:var(--k);color:var(--bone);padding:12px 18px;font:500 10.5px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase}
.cl-flagcard ul{list-style:none;margin:0;padding:6px 18px}
.cl-flagcard li{display:flex;gap:12px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--line);font-size:14px;line-height:1.5}
.cl-flagcard li:last-child{border-bottom:0}
.cl-flagcard li b{margin-top:2px}
.cl-flagcard strong{display:block;font-weight:700;margin-bottom:2px}
.cl-flag-ft{margin:0;padding:12px 18px 16px;border-top:1px solid var(--line);font-size:13px;color:var(--grey);background:var(--bone)}

/* ---- tech pack sheet (live HTML; also rendered to an image) ---- */
.ts{background:var(--paper);color:var(--k);border:1.5px solid var(--k);font:400 14px/1.5 var(--txt);max-width:1100px;margin:0 auto;text-align:left}
.ts p,.ts ul{margin:0}
.ts ul{list-style:none;padding:0}
.ts-hd{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;background:var(--k);color:var(--bone);padding:12px 20px;font:500 11px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase}
.ts-brand{font:400 21px/1 var(--dsp);letter-spacing:.05em;border-bottom:2px solid var(--flare);padding-bottom:3px}
.ts-id{margin-left:auto;color:var(--flare)}
.ts-title{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px 28px;align-items:end;padding:22px 20px 20px;border-bottom:1.5px solid var(--k)}
.ts-name{font:400 clamp(28px,3.1vw,42px)/.95 var(--dsp);text-transform:uppercase;letter-spacing:.005em;margin:0;max-width:22ch;hyphens:none}
.ts-meta{display:grid;grid-template-columns:repeat(4,auto);margin:0;border:1px solid var(--line-2)}
.ts-meta div{padding:9px 14px;border-left:1px solid var(--line-2)}
.ts-meta div:first-child{border-left:0}
.ts-meta dt{font:500 10px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--grey)}
.ts-meta dd{margin:5px 0 0;font:500 13.5px/1.2 var(--mono);white-space:nowrap}
.ts-main{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);border-bottom:1.5px solid var(--k)}
.ts-fig{margin:0;padding:18px;border-right:1px solid var(--line-2);display:flex;flex-direction:column;justify-content:space-between;gap:10px;background:#FBFBFA}
.ts-img{position:relative;max-width:380px;margin:0 auto;width:100%}
.ts-img img{width:100%;height:auto;display:block;mix-blend-mode:multiply}
.ts-pom{position:absolute;inset:0;width:100%;height:100%}
.ts-pom line{stroke:var(--k);stroke-width:5;stroke-dasharray:16 10}
.ts-pom circle{fill:var(--k)}
.ts-pom .tg rect{fill:var(--flare);stroke:var(--k);stroke-width:4}
.ts-pom text{font:700 30px/1 var(--txt);text-anchor:middle;fill:var(--k)}
.ts-fig figcaption{font:500 10.5px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--grey)}
.ts-pomw{padding:18px 20px;display:flex;flex-direction:column;gap:10px}
.ts-lbl{font:500 10.5px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--grey);margin:0 0 8px!important}
.ts-tbl{width:100%;border-collapse:collapse;font:400 13.5px/1.35 var(--txt);margin-bottom:14px}
.ts-tbl th{font:500 10px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--grey);text-align:left;padding:0 8px 8px 0;border-bottom:1.5px solid var(--k)}
.ts-tbl td{padding:9px 8px 9px 0;border-bottom:1px solid var(--line)}
.ts-tbl .n{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.ts-tbl td.n:nth-child(3){font-weight:500}
.ts-tbl td.c{width:34px}
.ts-tbl td.c{font:600 12px/1 var(--mono)}
.ts-tbl td.c::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--flare);margin-right:7px;vertical-align:2px;box-shadow:0 0 0 1px var(--k)}
.ts-sku{font:400 13px/1.5 var(--mono)}
.ts-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-bottom:1.5px solid var(--k)}
.ts-cols section{padding:18px 20px;border-left:1px solid var(--line-2);font-size:13.5px;line-height:1.55}
.ts-cols section:first-child{border-left:0}
.ts-bom{margin-top:12px!important;border-top:1px solid var(--line)}
.ts-bom li{padding:7px 0;border-bottom:1px solid var(--line);font-size:12.5px;line-height:1.45}
.ts-bom b{display:block;font:500 10px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--grey)}
.ts-seams li{padding:6px 0 6px 18px;border-bottom:1px solid var(--line);position:relative}
.ts-seams li::before{content:"";position:absolute;left:0;top:15px;width:10px;border-top:1.5px dashed var(--k)}
.ts-foot2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);border-bottom:1.5px solid var(--k)}
.ts-foot2>section{padding:18px 20px}
.ts-chips{display:grid;gap:12px}
.ts-chips li{display:flex;gap:14px;align-items:center}
.ts-chips i{flex:none;width:52px;height:52px;border:1px solid var(--line-2)}
.ts-chips span{font-size:13px;line-height:1.35}
.ts-chips b{display:block;font:500 14px/1.3 var(--mono)}
.ts-chips em{display:block;font:400 11px/1.4 var(--mono);font-style:normal;color:var(--grey);margin-top:2px}
.ts-conf{padding:18px 20px;background:var(--flare-t);border-left:4px solid var(--flare)}
.ts-conf li{padding:5px 0;font-size:13.5px;line-height:1.45}
.ts-conf li b{display:inline-block;min-width:66px;margin-right:8px;font:600 10px/1.8 var(--mono);letter-spacing:.08em;background:var(--k);color:var(--bone);text-align:center;padding:0 6px}
.ts-conf-n{margin-top:10px!important;font-size:12.5px;line-height:1.5;color:#3A3A3E}
.ts-ft{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 18px;padding:10px 20px;background:var(--bone);font:500 10.5px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--grey)}
@media (max-width:760px){
  .ts-title,.ts-main,.ts-cols,.ts-foot2{grid-template-columns:minmax(0,1fr)}
  .ts-meta{grid-template-columns:1fr 1fr}
  .ts-meta div:nth-child(3){border-left:0}
  .ts-meta div:nth-child(n+3){border-top:1px solid var(--line-2)}
  .ts-fig{border-right:0;border-bottom:1px solid var(--line-2)}
  .ts-img{max-width:240px}
  .ts-cols section{border-left:0;border-top:1px solid var(--line-2)}
  .ts-cols section:first-child{border-top:0}
  .ts-tbl .g{display:none}
  .ts-hd{padding:12px 16px}.ts-title,.ts-pomw,.ts-cols section,.ts-foot2>section,.ts-conf{padding-left:16px;padding-right:16px}
  .ts-id{margin-left:0}
}

/* ---- campaign set ---- */
.cl-camp{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,1.4vw,18px)}
.cl-camp figure{margin:0}
.cl-shot{aspect-ratio:4/5;background:var(--paper);border-radius:4px;overflow:hidden}
.cl-shot img{width:100%;height:100%;object-fit:contain;display:block}
.cl-camp figcaption,.cl-cw figcaption{display:flex;gap:10px;align-items:baseline;margin-top:12px;font:600 13px/1.35 var(--txt);letter-spacing:.04em;text-transform:uppercase}
.cl-camp figcaption b,.cl-cw .hx{font:500 11px/1 var(--mono);letter-spacing:.06em;color:var(--grey-d)}
.cl-cwhd{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 24px;margin:clamp(48px,6vw,72px) 0 18px;padding-top:22px;border-top:1px solid var(--line-d)}
.cl-cwhd h3{font:400 clamp(28px,3vw,40px)/1 var(--dsp);text-transform:uppercase;margin:0}
.cl-cw{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;margin:0;padding:0;list-style:none}
.cl-cw li{min-width:0}
.cl-cw figure{margin:0}
.cl-cw .ph{aspect-ratio:1/1;background:#F1F0ED;border-radius:4px;overflow:hidden}
.cl-cw .ph img{width:100%;height:100%;object-fit:cover;display:block}
.cl-cw figcaption{flex-direction:column;gap:6px;font-size:12px}
.cl-cw .hx{display:flex;gap:7px;align-items:center}
.cl-cw .hx i{width:11px;height:11px;border-radius:2px;box-shadow:0 0 0 1px rgba(244,243,239,.4)}
.cl-camp-note{margin-top:22px}

/* ---- steps ---- */
.cl-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none}
.cl-steps li{background:var(--paper);border-radius:6px;padding:clamp(22px,2.6vw,34px);display:flex;flex-direction:column;gap:8px}
.cl-steps .n{font:400 64px/1 var(--dsp);color:var(--k);margin-bottom:6px}
.cl-steps p{margin:0;color:#3A3A3E}
.cl-steps a{text-decoration:underline;text-underline-offset:3px}

/* ---- buy ---- */
.cl-buy{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:start}
.cl-val{width:100%;border-collapse:collapse;font-size:15px;margin-top:8px}
.cl-val td{padding:15px 0;border-bottom:1px solid var(--line-d);color:#D2D2CF;vertical-align:top}
.cl-val td.amt{text-align:right;white-space:nowrap;padding-left:16px;font-family:var(--mono);font-size:14px;color:var(--bone)}
.cl-val tr.tot td{color:var(--bone);font-weight:600;border-bottom:1.5px solid var(--bone)}
.cl-val tr.us td{border-bottom:0;color:var(--bone);font-weight:700}
.cl-val tr.us td:first-child::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--flare);margin-right:10px;vertical-align:2px}
.cl-card{background:var(--paper);color:var(--k);border-radius:8px;padding:clamp(24px,3vw,40px)}
.cl-tag{display:inline-flex;align-items:center;gap:8px;font:600 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;padding:8px 12px;border-radius:999px;white-space:nowrap}
.cl-card .cl-tag{background:var(--k);color:var(--flare)}
.cl-price{display:flex;align-items:baseline;gap:14px;margin:18px 0 6px}
.cl-price b{font:400 clamp(84px,9vw,120px)/.85 var(--dsp)}
.cl-price s{font:400 34px/1 var(--dsp);color:var(--grey)}
.cl-price span{font:600 13px/1.3 var(--txt);letter-spacing:.08em;text-transform:uppercase;color:var(--grey)}
.cl-incl{list-style:none;margin:20px 0 26px;padding:0;border-top:1px solid var(--line)}
.cl-incl li{padding:10px 0 10px 26px;border-bottom:1px solid var(--line);position:relative;font-size:15px}
.cl-incl li::before{content:"";position:absolute;left:2px;top:17px;width:12px;height:6px;border-left:2px solid var(--k);border-bottom:2px solid var(--k);transform:rotate(-45deg)}
.cl-card .cl-btns{flex-direction:column;align-items:stretch}
.cl-card .cl-btn.gh,.dk .cl-card .cl-btn.gh{color:var(--k);border-color:var(--k);background:transparent}
.cl-card .cl-btn.gh:hover,.dk .cl-card .cl-btn.gh:hover{background:var(--k);color:var(--paper)}
.dk .cl-card :focus-visible{outline-color:var(--k)}

/* order form (script-driven; ids and classes must stay) */
.cl .oyou{margin-top:24px;border-top:1px solid var(--line);padding-top:16px}
.cl .oyou summary{cursor:pointer;font:600 12px/1.6 var(--txt);letter-spacing:.12em;text-transform:uppercase;color:var(--grey);list-style:none;display:flex;justify-content:space-between;gap:12px}
.cl .oyou summary::-webkit-details-marker{display:none}
.cl .oyou summary::after{content:"+";font:400 20px/1 var(--txt);color:var(--k)}
.cl .oyou[open] summary::after{content:"\2013"}
.cl .ofield{display:flex;flex-direction:column;gap:8px;margin:20px 0 0}
.cl .ofield label{font:500 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--grey)}
.cl .ofield .req{text-transform:none;letter-spacing:.02em}
.cl .ofield input,.cl .ofield select,.cl .ofield textarea{font:16px/1.5 var(--txt);color:var(--k);background:var(--paper);border:1.5px solid var(--line-2);border-radius:6px;padding:12px 14px;width:100%}
.cl .ofield input:focus,.cl .ofield select:focus,.cl .ofield textarea:focus{outline:2px solid var(--k);outline-offset:1px;border-color:var(--k)}
.cl .ofield textarea{min-height:88px;resize:vertical}
.cl .ohp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cl .btn{display:flex;width:100%;justify-content:center;align-items:center;min-height:54px;margin-top:22px;border-radius:999px;border:1.5px solid var(--k);background:var(--k);color:var(--paper);font:700 14px/1 var(--txt);letter-spacing:.05em;text-transform:uppercase;cursor:pointer}
.cl .btn:hover{background:var(--k2);color:var(--paper)}
.cl .btn:disabled{opacity:.45;cursor:default}
.cl .oerr{margin:16px 0 0;padding:12px 14px;border-left:3px solid var(--err);background:#FBEAE8;font-size:14px;line-height:1.5;color:#7A1B14}
.cl .ook{margin:16px 0 0;padding:12px 14px;border-left:3px solid var(--flare);background:var(--flare-t);font-size:14px;line-height:1.5}
.cl .oerr:empty,.cl .ook:empty{display:none}
.cl .terms{margin-top:18px;font:500 11px/1.9 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--grey)}
.ts-kv{margin:14px 0 0;border-top:1px solid var(--line)}
.ts-kv div{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;padding:8px 0;border-bottom:1px solid var(--line)}
.ts-kv dt{font:500 10px/1.8 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--grey)}
.ts-kv dd{margin:0;font-size:13.5px;line-height:1.5}

/* ---- faq / origin / legal ---- */
.cl-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(28px,5vw,80px);align-items:start}
.cl .cl-faq{border-top:1.5px solid var(--k)}
.cl details.q{border-bottom:1px solid var(--line-2)}
.cl details.q summary{font:600 17px/1.4 var(--txt);letter-spacing:0;padding:20px 40px 20px 0}
.cl details.q summary::after{font:400 24px/1 var(--txt);top:20px}
.cl details.q p{color:#3A3A3E;font-size:16px}
.cl-origin .cl-h2{max-width:14ch}
.cl-legal{padding:36px 0 44px}
.cl-caption{max-width:1100px;margin:14px auto 0;font:400 12.5px/1.5 var(--mono);color:var(--grey)}
.cl-samp-hd .cl-h2{font-size:clamp(52px,8vw,112px)}

/* ---- responsive ---- */
@media (max-width:1100px){
  .cl-hero .cl-w{grid-template-columns:minmax(0,1fr)}
  .hc{max-width:720px}
}
@media (max-width:1000px){
  .cl-cw{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(132px,28%);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;scrollbar-width:thin}
  .cl-cw li{scroll-snap-align:start}
  .cl-buy,.cl-split,.cl-hdrow,.cl-tr{grid-template-columns:minmax(0,1fr)}
  .cl-flagcard{position:static}
  .tls{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .hc-body{grid-template-columns:minmax(0,1fr)}
  .hc-fig{border-right:0;border-bottom:1px solid var(--line);padding:14px 20% 8px}
  .hc-id{margin-left:0}
  .hc-tbl td:nth-child(2){font-size:12px}
  .cl-stats{grid-template-columns:1fr 1fr}
  .cl-stats div:nth-child(n+3){border-top:1px solid var(--line-2)}
  .cl-camp{grid-template-columns:1fr 1fr}
  .cl-camp figure:first-child{grid-column:1/-1}
  .cl-camp figure:first-child .cl-shot{aspect-ratio:1/1}
  .cl-steps{grid-template-columns:minmax(0,1fr)}
  .cl-trust li{grid-template-columns:48px minmax(0,1fr)}
  .cl-bar{font-size:10.5px;letter-spacing:.08em}
}
@media (max-width:480px){
  .tls{gap:14px 10px}
  .tl-n{font-size:12px}
  .tl-m{font-size:11px}
  .cl-btns .cl-btn{flex:1 1 100%}
  .cl-price b{font-size:84px}
}

/* ---- OG card (render only) ---- */
.og{width:1200px;height:630px;background:var(--k);color:var(--bone);display:grid;grid-template-columns:560px 640px;overflow:hidden;position:relative;font-family:var(--txt)}
.og-l{padding:70px 0 0 64px}
.og-wm{font-size:36px;margin-bottom:30px}
.og-h{font:400 88px/.9 var(--dsp);text-transform:uppercase;margin:0 0 26px}
.og-s{font:500 20px/1.4 var(--txt);color:#D2D2CF;margin:0 0 30px;max-width:440px}
.og-cta{display:inline-block;background:var(--bone);color:var(--k);font:700 16px/1 var(--txt);letter-spacing:.05em;text-transform:uppercase;padding:18px 28px;border-radius:999px;margin:0}
.og-r{position:relative;padding:56px 56px 0 0}
.og-r .hc{animation:none;box-shadow:0 30px 70px rgba(0,0,0,.6)}
.og-r .hc-tbl tbody tr{animation:none}