/* ==== FLEET THEME STANDARD — sizing tokens (from WordPress Design & Development Core)
   docs/elementor-pro/13-global-layout-foundation.md · 15-global-content-spacing-policy.md ·
   docs/quy-chuan-layout-va-tuong-tac.md. Paste this block verbatim at the top of the theme CSS.
   Change only colours/fonts/radius below the block, never the sizing values. ==== */
:root{
  /* Content width = OUTER container max-width (padding sits inside it) */
  --container-max:1440px;
  --container-pad:clamp(48px,5vw,96px);
  /* Section Spacing (band padding-block) */
  --section-y:120px; --section-y-compact:80px;
  /* Content Spacing (gap of content stacks) — sm <= md <= lg */
  --content-gap-sm:12px; --content-gap-md:24px; --content-gap-lg:48px;
  /* Grid / card collection gap */
  --grid-gap:32px;
  /* Component padding (inside cards/surfaces) */
  --card-pad:32px;
  /* Interaction */
  --touch:44px;
}
/* Laptop 1025–1366 */
@media (max-width:1366px){:root{--container-max:1366px;--container-pad:clamp(40px,4.5vw,72px);--section-y:104px;--section-y-compact:72px;--content-gap-md:20px;--content-gap-lg:40px;--grid-gap:28px;--card-pad:28px}}
/* Tablet 769–1024 */
@media (max-width:1024px){:root{--container-max:1024px;--container-pad:clamp(24px,4vw,48px);--section-y:80px;--section-y-compact:64px;--content-gap-sm:10px;--content-gap-md:20px;--content-gap-lg:32px;--grid-gap:24px;--card-pad:24px}}
/* Mobile <=768 */
@media (max-width:768px){:root{--container-max:768px;--container-pad:clamp(16px,5vw,24px);--section-y:64px;--section-y-compact:48px;--content-gap-sm:8px;--content-gap-md:16px;--content-gap-lg:28px;--grid-gap:16px;--card-pad:20px}}

/* Band -> Inner. Header, main and footer inners all use .container */
.container{width:100%;max-width:var(--container-max);margin-inline:auto;padding-inline:var(--container-pad);box-sizing:border-box}
.band{padding-block:var(--section-y)}
.band.compact{padding-block:var(--section-y-compact)}
/* Content stacks: sibling spacing ONLY via parent gap */
.stack{display:flex;flex-direction:column;gap:var(--content-gap-md)}
.stack-sm{display:flex;flex-direction:column;gap:var(--content-gap-sm)}
.stack-lg{display:flex;flex-direction:column;gap:var(--content-gap-lg)}
.row{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
/* Reset default UA margins so nothing spaces siblings by accident */
h1,h2,h3,h4,h5,h6,p,ul,ol,figure,blockquote,dl,dd{margin:0}
/* Prose exception (rich text inside ONE article body) */
.prose p,.prose ul,.prose ol,.prose blockquote,.prose figure{margin-block:0 1em}
.prose h2,.prose h3{margin-block:1.6em .5em}
[hidden]{display:none!important}
/* Accessibility baseline */
:focus-visible{outline:3px solid currentColor;outline-offset:3px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
/* ==== END FLEET THEME STANDARD ==== */

/* ==== NOMAD GEAR — technical utilitarian catalogue ==== */
:root{
  --paper:#f1efe8; --paper-2:#e7e3d6; --khaki:#d6cdb0; --khaki-d:#b9ad86; --olive:#4f5634; --olive-d:#3b4127;
  --signal:#ff5a1f; --signal-d:#e14812; --ink:#22231f; --ink-2:#4a4b44; --line:rgba(34,35,31,.18); --line-2:rgba(34,35,31,.08);
  --char:#2a2b27; --char-2:#34352f;
  --f-head:"Archivo",system-ui,sans-serif; --f-mono:"IBM Plex Mono",ui-monospace,monospace;
  --r:2px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.6 var(--f-head);font-stretch:100%}
main{overflow-x:clip;display:block}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--f-head);font-stretch:112%;font-weight:800;line-height:1.05;letter-spacing:-.02em}
h1{font-size:clamp(36px,4.6vw,64px)} h2{font-size:clamp(28px,3.2vw,44px)} h3{font-size:19px;letter-spacing:-.01em;line-height:1.2}
.mega{font-size:clamp(44px,6.4vw,96px);font-stretch:118%;text-transform:uppercase;letter-spacing:-.03em;line-height:.95}
.lead{font-size:clamp(17px,1.4vw,20px);color:var(--ink-2);max-width:60ch}
.mono{font-family:var(--f-mono);letter-spacing:.02em}
.small{font-size:13px} .muted{color:var(--ink-2)}
ul,ol{padding:0;list-style:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;background:var(--signal);color:var(--ink);padding:12px 16px;z-index:100;font-weight:700}
.skip:focus{top:12px}
:focus-visible{outline:3px solid var(--signal);outline-offset:2px}

/* tags & badges */
.tag{display:inline-flex;align-self:flex-start;align-items:center;gap:8px;font:500 12px/1 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--ink);padding:6px 10px;background:transparent}
.tag::before{content:"";width:8px;height:8px;background:var(--signal)}
.tag.light{border-color:var(--paper);color:var(--paper)}
.badge{display:inline-block;font:600 11px/1 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;background:var(--ink);color:var(--paper);padding:6px 8px}
.badge.signal{background:var(--signal);color:var(--ink)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--touch);padding:0 22px;border:1.5px solid var(--ink);background:var(--ink);color:var(--paper);font:600 14px/1 var(--f-mono);letter-spacing:.04em;text-transform:uppercase;text-decoration:none;cursor:pointer;border-radius:var(--r);transition:background-color .15s,color .15s,border-color .15s}
.btn:hover{background:var(--olive-d);border-color:var(--olive-d)}
.btn.signal{background:var(--signal);border-color:var(--signal);color:var(--ink)}
.btn.signal:hover{background:var(--signal-d);border-color:var(--signal-d)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--paper)}
.btn.dark{background:var(--char);border-color:var(--char)}
.dark .btn.ghost,.news .btn.ghost{color:var(--paper);border-color:var(--paper)}
.btn[disabled]{opacity:.4;cursor:not-allowed}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:var(--touch);height:var(--touch);border:1px solid transparent;background:transparent;color:inherit;cursor:pointer;position:relative;border-radius:var(--r);transition:border-color .15s,background-color .15s}
.icon-btn:hover{border-color:currentColor}
.icon-btn svg{width:22px;height:22px}
.link-btn{background:none;border:0;min-height:var(--touch);font:500 13px var(--f-mono);text-decoration:underline;color:var(--ink-2);cursor:pointer;padding:0 4px}
.link-btn:hover{color:var(--signal-d)}

/* grid-line backgrounds */
.gridlines{background-color:var(--paper-2);background-image:linear-gradient(var(--line-2) 1px,transparent 1px),linear-gradient(90deg,var(--line-2) 1px,transparent 1px);background-size:32px 32px}
.khaki{background-color:var(--khaki)}
.khaki.gridlines{background-color:var(--khaki);background-image:linear-gradient(rgba(34,35,31,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(34,35,31,.09) 1px,transparent 1px)}
.dark{background:var(--char);color:var(--paper)}
.dark .lead{color:#cfcbbd}
.dark .tag{border-color:var(--paper)}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:var(--paper);border-bottom:1px solid var(--ink)}
.announce{background:var(--olive-d);color:var(--paper)}
.announce p{font-size:12px;letter-spacing:.1em;text-align:center;min-height:32px;display:flex;align-items:center;justify-content:center}
.hrow{display:flex;align-items:center;gap:28px;min-height:68px}
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font:800 20px/1 var(--f-head);font-stretch:125%;letter-spacing:.02em;white-space:nowrap;min-height:var(--touch)}
.logo svg{width:28px;height:28px;color:var(--signal)}
.logo b{font-weight:400;color:var(--ink-2)}
.nav{display:flex;gap:4px}
.nav a{display:inline-flex;align-items:center;min-height:var(--touch);padding:0 12px;text-decoration:none;font:500 14px var(--f-mono);text-transform:uppercase;letter-spacing:.04em;border-bottom:2px solid transparent;transition:border-color .15s,color .15s}
.nav a:hover,.nav a[aria-current]{border-bottom-color:var(--signal)}
.hicons{display:flex;align-items:center;gap:4px}
.count{position:absolute;top:2px;right:0;min-width:18px;height:18px;border-radius:9px;background:var(--signal);color:var(--ink);font:600 11px/18px var(--f-mono);text-align:center;padding:0 4px}
.burger{display:none}

/* footer */
.site-footer{background:var(--char);color:#d9d5c7;padding-block:72px 32px;border-top:6px solid var(--signal)}
.fgrid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:var(--grid-gap)}
.fcol p{max-width:36ch;color:#bdb9aa}
.fcol h3{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--khaki-d);font-weight:500}
.fcol a:not(.logo){display:inline-flex;align-items:center;min-height:36px;text-decoration:none;color:#e9e5d8}
.fcol a:not(.logo):hover{color:var(--signal)}
.site-footer .logo{color:var(--paper)} .site-footer .logo b{color:var(--khaki-d)}
.fbot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;border-top:1px solid rgba(255,255,255,.15);padding-top:24px;color:#a9a597}

/* section head */
.shead{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--content-gap-md);flex-wrap:wrap}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font:500 13px var(--f-mono);text-transform:uppercase;letter-spacing:.04em}
.crumbs a{display:inline-flex;align-items:center;min-height:var(--touch);color:var(--ink-2)}
.crumbs a:hover{color:var(--signal-d)}

/* plates (photos on neutral gridded backgrounds) */
.plate{display:flex;flex-direction:column;border:1px solid var(--ink);background:var(--paper-2)}
.plate img{width:100%;aspect-ratio:3/2;object-fit:cover}
.plate-cap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font:500 12px var(--f-mono);letter-spacing:.06em;text-transform:uppercase;padding:10px 14px;border-top:1px solid var(--ink);background:var(--paper)}

/* hero */
.hero{border-bottom:1px solid var(--ink);background-color:var(--paper);background-image:linear-gradient(var(--line-2) 1px,transparent 1px),linear-gradient(90deg,var(--line-2) 1px,transparent 1px);background-size:48px 48px}
.hero-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:var(--grid-gap);align-items:center}
.hero-media img{aspect-ratio:4/3}
.hero-specs{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--ink);background:var(--paper)}
.hero-specs div{background:var(--paper);display:flex;flex-direction:column;gap:4px;padding:16px;border-left:1px solid var(--ink)}
.hero-specs div:first-child{border-left:0}
.hero-specs dt{font:500 11px var(--f-mono);text-transform:uppercase;letter-spacing:.1em;color:var(--ink-2)}
.hero-specs dd{font:800 28px/1 var(--f-head);font-stretch:118%}

/* product grid & card */
.grid-prod{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--grid-gap)}
.pcard{display:grid;grid-template-rows:auto 1fr auto;border:1px solid var(--ink);background:var(--paper);transition:box-shadow .2s}
.pcard:hover{box-shadow:6px 6px 0 var(--ink)}
.pimg{position:relative;display:block;background-color:#e2ddcd;background-image:linear-gradient(var(--line-2) 1px,transparent 1px),linear-gradient(90deg,var(--line-2) 1px,transparent 1px);background-size:16px 16px;padding:14px;border-bottom:1px solid var(--ink)}
.pimg img{width:100%;aspect-ratio:1/1;object-fit:cover;filter:saturate(.92) contrast(1.03)}
.pcode{position:absolute;left:0;top:0;z-index:1;background:var(--paper);border-right:1px solid var(--ink);border-bottom:1px solid var(--ink);padding:4px 8px;font-size:11px}
.pimg .badge{position:absolute;right:0;top:0;z-index:1}
.pinfo{padding:16px;background:var(--paper)}
.pinfo h3{font-size:18px}
.pinfo h3 a{text-decoration:none}
.pinfo h3 a:hover{text-decoration:underline;text-decoration-color:var(--signal);text-decoration-thickness:2px}
.pinfo .spec{color:var(--ink-2);text-transform:uppercase;font-size:12px}
.pline{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.price{font:600 16px var(--f-mono)}
.price s,.compare{color:var(--ink-2);font-weight:400;font-size:.85em}
.price.big{font-size:28px}
.dots{display:inline-flex;gap:4px}
.dot{display:inline-block;width:14px;height:14px;border-radius:50%;background:var(--c);box-shadow:0 0 0 1px var(--ink)}
.btn.quick{border-width:0;border-top:1px solid var(--ink);border-radius:0;background:var(--paper);color:var(--ink);width:100%}
.btn.quick:hover{background:var(--signal);color:var(--ink)}

/* collections */
.grid-coll{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--grid-gap)}
.coll{display:grid;grid-template-rows:auto 1fr;border:1px solid var(--ink);background:var(--paper);text-decoration:none;position:relative;transition:box-shadow .2s}
.coll:hover{box-shadow:6px 6px 0 var(--ink)}
.coll-img{display:block;border-bottom:1px solid var(--ink)}
.coll-img img{width:100%;aspect-ratio:16/10;object-fit:cover}
.coll-body{display:flex;flex-direction:column;gap:6px;padding:18px;background:var(--paper)}
.coll-name{font:800 24px/1.1 var(--f-head);font-stretch:115%}
.coll-all{background:var(--olive);color:var(--paper);align-content:end;min-height:240px}
.coll-all .coll-body{background:var(--olive)}
.coll-all .arrow{position:absolute;right:20px;top:16px;font:400 48px/1 var(--f-mono);color:var(--signal)}

/* usp */
.usp{background:var(--char);color:var(--paper)}
.usp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid rgba(255,255,255,.25)}
.usp-item{display:flex;flex-direction:column;gap:8px;padding:var(--card-pad);border-left:1px solid rgba(255,255,255,.25)}
.usp-item:first-child{border-left:0}
.usp-item .mono{color:var(--signal);font-size:13px}
.usp-item p{color:#cfcbbd;font-size:15px}

/* split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:var(--content-gap-lg);align-items:center}
.split.rev>figure{order:2}

/* spec tables */
.spec-table{width:100%;border-collapse:collapse;font:400 14px var(--f-mono);background:var(--paper);border:1px solid var(--ink)}
.spec-table th,.spec-table td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line)}
.spec-table thead th{background:var(--ink);color:var(--paper);font-weight:500;text-transform:uppercase;font-size:12px;letter-spacing:.08em}
.spec-table tbody th{font-weight:500;text-transform:uppercase;font-size:12px;letter-spacing:.06em;color:var(--ink-2);white-space:nowrap}
.spec-table tr.total td{font-weight:600;background:var(--khaki)}
.table-wrap{overflow-x:auto}
.compare-table{min-width:720px}
.compare-table td.cur,.compare-table th.cur{background:#fff6ee}
.compare-table thead th.cur{background:var(--signal);color:var(--ink)}
.compare-table thead a{color:var(--paper)}
.compare-table td.hi{font-weight:600;box-shadow:inset 4px 0 0 var(--olive)}

/* quotes & ugc */
.grid-quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--grid-gap)}
.quote{display:flex;flex-direction:column;justify-content:space-between;gap:24px;padding:var(--card-pad);border:1px solid rgba(255,255,255,.3);background:var(--char-2)}
.quote blockquote{font-size:18px;line-height:1.5}
.quote figcaption{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--khaki)}
.stars{color:var(--signal);letter-spacing:2px}
.grid-ugc{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--grid-gap)}
.ugc{display:flex;flex-direction:column;border:1px solid rgba(255,255,255,.3);background:var(--char-2)}
.ugc img{aspect-ratio:1/1;object-fit:cover;width:100%}
.ugc figcaption{padding:10px 12px;font-size:12px;color:var(--khaki);background:var(--char-2)}

/* newsletter */
.news{background:var(--olive);color:var(--paper)}
.news .lead{color:#e3e0d0}
.news-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:var(--content-gap-lg);align-items:end}
.nform,.sform{display:flex;gap:8px}
.nform input,.sform input{flex:1;min-width:0;min-height:52px;padding:0 16px;border:1.5px solid var(--ink);background:var(--paper);color:var(--ink);font:400 16px var(--f-mono);border-radius:var(--r)}
.nform input{border-color:var(--paper)}
.ok{color:var(--khaki)} .muted-light{color:#cfcbbd}

/* page hero */
.phero{border-bottom:1px solid var(--ink)}
.narrow{max-width:900px}

/* collection layout */
.coll-layout{display:grid;grid-template-columns:280px 1fr;gap:var(--content-gap-lg);align-items:start}
.coll-side{position:sticky;top:120px}
.filters{border:1px solid var(--ink);background:var(--paper)}
.filters summary{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:56px;padding:0 16px;cursor:pointer;border-bottom:1px solid var(--ink);list-style:none}
.filters summary::-webkit-details-marker{display:none}
.filter-form{padding:20px 16px}
fieldset{border:0;margin:0;padding:0;min-width:0}
legend{font:600 12px var(--f-mono);text-transform:uppercase;letter-spacing:.1em;padding:0}
.filter-form legend{border-bottom:1px solid var(--line);width:100%;padding-bottom:8px}
.chk{position:relative;display:flex;align-items:center;gap:10px;min-height:var(--touch);cursor:pointer;font-size:15px}
.chk input,.sw input,.opt input,.bitem input{position:absolute;inset:0;width:100%;height:100%;margin:0;clip-path:inset(50%);cursor:pointer}
.chk span::before{content:"";display:inline-block;vertical-align:-3px;width:18px;height:18px;border:1.5px solid var(--ink);margin-inline-end:10px;background:var(--paper)}
.chk:has(input:checked) span::before{background:var(--signal) linear-gradient(45deg,transparent 40%,var(--ink) 40% 60%,transparent 60%)}
.chk:has(input:focus-visible),.sw:has(input:focus-visible),.opt:has(input:focus-visible),.bitem:has(input:focus-visible){outline:3px solid var(--signal);outline-offset:2px}
.swatch-grid{display:flex;flex-wrap:wrap;gap:4px}
.sw{position:relative;display:inline-flex;align-items:center;justify-content:center;width:calc(var(--touch) + 2px);height:calc(var(--touch) + 2px);cursor:pointer;border:1px solid transparent}
.sw .dot{width:24px;height:24px}
.sw:has(input:checked){border-color:var(--ink);background:var(--paper-2)}
.sw.big .dot{width:30px;height:30px}
input[type=range]{width:100%;min-height:var(--touch);accent-color:var(--signal)}
.toolbar{display:flex;align-items:center;gap:16px;flex-wrap:wrap;border-bottom:1px solid var(--ink);padding-bottom:12px}
.sort{display:flex;align-items:center;gap:10px}
select,textarea,.field input{min-height:var(--touch);border:1.5px solid var(--ink);background:var(--paper);color:var(--ink);font:400 15px var(--f-mono);padding:0 12px;border-radius:var(--r)}
textarea{padding:12px;resize:vertical}
.coll-grid{grid-template-columns:repeat(3,1fr)}
.pager{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.pg{display:inline-flex;align-items:center;justify-content:center;min-width:var(--touch);min-height:var(--touch);border:1px solid var(--ink);background:var(--paper);font:500 14px var(--f-mono);text-decoration:none;color:var(--ink);cursor:pointer;transition:background-color .15s,color .15s}
.pg:hover:not([disabled]),.pg[aria-current]{background:var(--ink);color:var(--paper)}
.pg[disabled]{opacity:.35;cursor:not-allowed}
.card{border:1px solid var(--ink);background:var(--paper);padding:var(--card-pad)}
.empty{display:flex;flex-direction:column;align-items:flex-start;gap:var(--content-gap-md)}

/* product page */
.pdp{display:grid;grid-template-columns:1.15fr 1fr;gap:var(--content-gap-lg);align-items:start}
.gallery-main img{aspect-ratio:4/3}
.thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.thumb{padding:4px;border:1px solid var(--line);background:var(--paper-2);cursor:pointer;min-height:var(--touch);transition:border-color .15s}
.thumb[aria-pressed=true]{border:2px solid var(--signal)}
.thumb img{aspect-ratio:4/3;object-fit:cover;width:100%}
.price-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.opt-row{display:flex;flex-wrap:wrap;gap:8px}
.opt{position:relative;display:inline-flex}
.opt span{display:inline-flex;align-items:center;justify-content:center;min-width:56px;min-height:var(--touch);padding:0 16px;border:1.5px solid var(--ink);font:500 14px var(--f-mono);cursor:pointer;background:var(--paper);transition:background-color .15s,color .15s}
.opt:hover span{background:var(--paper-2)}
.opt:has(input:checked) span{background:var(--ink);color:var(--paper)}
.buy-row{display:flex;gap:12px;flex-wrap:wrap}
.grow{flex:1;min-width:200px}
.qty{display:inline-flex;align-items:center;border:1.5px solid var(--ink);background:var(--paper)}
.qty button{width:var(--touch);height:var(--touch);border:0;background:transparent;font:500 20px var(--f-mono);cursor:pointer;color:var(--ink)}
.qty button:hover{background:var(--paper-2)}
.qty input{width:48px;height:var(--touch);border:0;text-align:center;font:500 16px var(--f-mono);background:transparent;color:var(--ink);-moz-appearance:textfield}
.qty input::-webkit-inner-spin-button{-webkit-appearance:none}
.qty.sm button{width:40px;height:40px}
.qv{min-width:28px;text-align:center;font:500 15px var(--f-mono)}
.assure{display:flex;flex-direction:column;gap:6px;border-left:3px solid var(--olive);padding-left:12px;background:transparent}
.acc{border-top:1px solid var(--ink)}
.acc details{border-bottom:1px solid var(--ink)}
.acc summary{display:flex;justify-content:space-between;align-items:center;min-height:56px;cursor:pointer;font:600 14px var(--f-mono);text-transform:uppercase;letter-spacing:.06em;list-style:none}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";font-size:20px;color:var(--signal-d)}
.acc details[open] summary::after{content:"−"}
.acc-body{padding:0 0 20px;background:transparent;border-bottom:0}
.acc-body{border-top:1px dashed transparent}
.ticks{display:flex;flex-direction:column;gap:6px}
.ticks li::before{content:"▸ ";color:var(--signal-d)}

/* bundle */
.bundle{display:grid;grid-template-columns:1fr 320px;gap:var(--grid-gap);align-items:stretch}
.bundle-items{display:flex;align-items:center;gap:12px}
.plus{font:600 28px var(--f-mono);color:var(--olive)}
.bitem{position:relative;flex:1;display:flex;flex-direction:column;gap:12px;cursor:pointer;transition:border-color .15s,opacity .15s}
.bitem .bimg{display:block;background:var(--paper-2);border:1px solid var(--line)}
.bitem img{aspect-ratio:4/3;object-fit:cover;width:100%}
.bitem .tick{position:absolute;top:12px;right:12px;width:26px;height:26px;border:1.5px solid var(--ink);background:var(--signal)}
.bitem:not(:has(input:checked)){opacity:.55}
.bitem:not(:has(input:checked)) .tick{background:var(--paper)}
.bundle-sum{justify-content:center;background:var(--paper-2)}

/* cart */
.cart-layout{display:grid;grid-template-columns:1fr 380px;gap:var(--content-gap-lg);align-items:start}
.cart-lines{display:flex;flex-direction:column;gap:12px}
.cline{display:grid;grid-template-columns:96px 1fr auto;gap:16px;align-items:start}
.cline.card{padding:16px}
.cimg{display:block;border:1px solid var(--line);background:var(--paper-2)}
.cimg img{aspect-ratio:1/1;object-fit:cover;width:100%}
.cname{font-weight:700;text-decoration:none}
.cname:hover{text-decoration:underline}
.bar{height:8px;background:var(--paper-2);border:1px solid var(--ink)}
.bar span{display:block;height:100%;background:var(--signal);width:0;transition:width .3s}
.summary{position:sticky;top:120px}
.sum-list{display:flex;flex-direction:column;gap:10px}
.sum-list div{display:flex;justify-content:space-between;gap:12px;font-family:var(--f-mono);font-size:14px}
.sum-total{display:flex;justify-content:space-between;gap:12px;font:700 20px var(--f-mono);border-top:1px solid var(--ink);padding-top:12px}

/* drawer & search dialog */
dialog{border:0;padding:0;color:var(--ink);background:var(--paper)}
dialog::backdrop{background:rgba(20,21,18,.55)}
.drawer{margin:0 0 0 auto;width:min(440px,100vw);height:100dvh;max-height:100dvh;border-left:2px solid var(--ink)}
.drawer-in{display:flex;flex-direction:column;gap:20px;height:100%;padding:20px}
.drawer-head{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--ink);padding-bottom:12px}
.drawer-head h2{font-size:24px}
.drawer-lines{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:16px}
.drawer .cline{grid-template-columns:72px 1fr auto}
.drawer-foot{border-top:1px solid var(--ink);padding-top:16px}
.drawer-foot .btn{width:100%}
.search-dlg{margin:80px auto auto;width:min(720px,calc(100vw - 32px));border:2px solid var(--ink)}
.search-in{padding:20px}
.predict{display:flex;flex-direction:column;gap:8px}
.pred{display:flex;gap:12px;align-items:center;text-decoration:none;min-height:var(--touch);border:1px solid var(--line);padding:6px;background:var(--paper)}
.pred:hover{border-color:var(--ink)}
.pred img{width:56px;height:56px;object-fit:cover}
.pred>span{display:flex;flex-direction:column}

/* about / blog / contact */
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--grid-gap)}
.stat{display:flex;flex-direction:column;gap:8px}
.stat dt{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-2)}
.stat dd{font:800 clamp(32px,3.4vw,48px)/1 var(--f-head);font-stretch:118%}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--grid-gap)}
.step .mono{color:var(--signal-d);font-size:13px}
.chips{gap:8px}
.chip{min-height:var(--touch);padding:0 16px;border:1.5px solid var(--ink);background:var(--paper);font:500 13px var(--f-mono);text-transform:uppercase;cursor:pointer;transition:background-color .15s,color .15s}
.chip[aria-pressed=true],.chip:hover{background:var(--ink);color:var(--paper)}
.grid-posts{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--grid-gap)}
.post{display:flex;flex-direction:column;border:1px solid var(--ink);background:var(--paper)}
.post-img{display:block;border-bottom:1px solid var(--ink)}
.post-img img{aspect-ratio:3/2;object-fit:cover;width:100%}
.post-body{padding:var(--card-pad);background:var(--paper)}
.post-body h3 a{text-decoration:none}
.post-body h3 a:hover{text-decoration:underline;text-decoration-color:var(--signal)}
.post-body .mono{color:var(--olive)}
.article-layout{display:grid;grid-template-columns:minmax(0,68ch) 320px;gap:var(--content-gap-lg);align-items:start;justify-content:space-between}
.prose{font-size:18px;line-height:1.75}
.prose h2{font-size:28px}
.prose blockquote{border-left:4px solid var(--signal);padding-left:20px;font:500 20px/1.5 var(--f-head);font-stretch:105%}
.prose a{text-decoration-color:var(--signal);text-decoration-thickness:2px}
.article-side{position:sticky;top:120px}
.contact-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:var(--content-gap-lg);align-items:start}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--grid-gap)}
.field{display:flex;flex-direction:column;gap:6px;font:600 12px var(--f-mono);text-transform:uppercase;letter-spacing:.08em}
.field input,.field select,.field textarea{width:100%;text-transform:none;letter-spacing:0;font-weight:400}
.err{color:#b3261e;font-family:var(--f-mono)}
.info div{display:flex;flex-direction:column;gap:2px}
.info dt{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-2)}
.info a{display:inline-flex;align-items:center;min-height:var(--touch)}
.nf-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:var(--content-gap-lg);align-items:center}
.nf .plate img{aspect-ratio:4/5}

/* ---------- Laptop ---------- */
@media (max-width:1366px){
  .nav a{padding:0 9px;font-size:13px}
  .coll-layout{grid-template-columns:250px 1fr}
}
/* ---------- Tablet ---------- */
@media (max-width:1024px){
  .burger{display:inline-flex}
  .nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:0;background:var(--paper);border-bottom:2px solid var(--ink);padding:8px var(--container-pad) 16px}
  .nav.open{display:flex}
  .nav a{min-height:48px;border-bottom:1px solid var(--line)}
  .hero-grid,.split,.pdp,.cart-layout,.contact-grid,.nf-grid,.news-grid,.coll-layout,.article-layout{grid-template-columns:1fr}
  .split.rev>figure{order:0}
  .grid-prod,.coll-grid,.grid-coll{grid-template-columns:repeat(2,1fr)}
  .usp-grid,.stat-grid,.steps{grid-template-columns:repeat(2,1fr)}
  .usp-item:nth-child(3){border-left:0}
  .usp-item:nth-child(n+3){border-top:1px solid rgba(255,255,255,.25)}
  .grid-quotes{grid-template-columns:1fr}
  .grid-posts{grid-template-columns:repeat(2,1fr)}
  .fgrid{grid-template-columns:repeat(2,1fr)}
  .coll-side,.summary,.article-side{position:static}
  .bundle{grid-template-columns:1fr}
}
/* ---------- Mobile ---------- */
@media (max-width:768px){
  .announce p{font-size:10px;letter-spacing:.04em}
  .hrow{min-height:60px;gap:12px}
  .logo{font-size:17px}
  .hero-specs dd{font-size:22px}
  .hero-specs div{padding:12px}
  .grid-coll{grid-template-columns:1fr}
  .grid-ugc{grid-template-columns:repeat(2,1fr)}
  .usp-grid,.stat-grid{grid-template-columns:repeat(2,1fr)}
  .steps,.grid-posts,.form-grid{grid-template-columns:1fr}
  .pimg{padding:8px}
  .pinfo{padding:10px}
  .pinfo h3{font-size:15px}
  .pinfo .spec{font-size:10px}
  .price{font-size:14px}
  .btn.quick{font-size:12px;padding:0 8px}
  .bundle-items{flex-direction:column;align-items:stretch}
  .plus{text-align:center}
  .cline{grid-template-columns:72px 1fr}
  .cline>.price{grid-column:2}
  .nform,.sform{flex-direction:column}
  .sform .icon-btn{align-self:flex-end}
  .site-footer{padding-block:48px 24px}
  .thumbs{gap:8px}
}
@media (max-width:480px){
  .fgrid{grid-template-columns:1fr 1fr}
  .fcol:first-child{grid-column:1/-1}
  .usp-item{padding:16px}
}
