/* ==========================================================================
   SEND H-PERFORMANCE — design system v2
   Industrial precision, editorial calm. 2026
   ========================================================================== */

:root{
  --ink:#0e1317;
  --graphite:#1a2128;
  --graphite-2:#2a333c;
  --paper:#ffffff;
  --bone:#f4f1ec;
  --bone-2:#ece7de;
  --line:#e0dbd2;
  --line-dark:#cbc4b8;
  --steel:#7b8791;
  --slate:#5b6770;
  --accent:#d9531e;
  --accent-d:#b73f12;
  --accent-l:#fdf1e9;
  --deep:#12303f;
  --deep-l:#1d4a5f;
  --ok:#2f7d4f;
  --warn:#a2541b;
  --r:4px;
  --r-lg:8px;
  --shadow-1:0 1px 2px rgba(14,19,23,.06);
  --shadow-2:0 2px 6px rgba(14,19,23,.07),0 12px 32px rgba(14,19,23,.06);
  --shadow-3:0 4px 12px rgba(14,19,23,.09),0 24px 60px rgba(14,19,23,.10);
  --maxw:1280px;
  --gut:32px;
  --ff:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --ff-disp:"Barlow Condensed","Inter",-apple-system,"Segoe UI",Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--ff);font-size:16px;line-height:1.65;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img,svg{max-width:100%;display:block}
a{color:var(--ink);text-decoration:none}
a:hover{color:var(--accent)}
button{font:inherit;cursor:pointer}
::selection{background:var(--accent);color:#fff}

h1,h2,h3,h4,h5{margin:0 0 .5em;font-weight:650;line-height:1.15;letter-spacing:-.02em}
h1{font-size:clamp(2.1rem,4.4vw,3.5rem)}
h2{font-size:clamp(1.55rem,2.6vw,2.25rem)}
h3{font-size:1.2rem;letter-spacing:-.01em}
h4{font-size:1rem;letter-spacing:0}
p{margin:0 0 1em}
ul,ol{margin:0 0 1em;padding-left:1.15em}
hr{border:0;border-top:1px solid var(--line);margin:0}

/* ---------- layout ---------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gut)}
.wrap-narrow{max-width:900px;margin:0 auto;padding:0 var(--gut)}
.sec{padding:88px 0}
.sec.tight{padding:56px 0}
.sec.bone{background:var(--bone)}
.sec.ink{background:var(--ink);color:#e7e3dc}
.sec.ink h2,.sec.ink h3,.sec.ink h4{color:#fff}
.sec.deep{background:linear-gradient(160deg,#12303f,#0e1317 70%);color:#dfe6ea}
.sec.deep h2,.sec.deep h3{color:#fff}
.center{text-align:center}
.stack>*+*{margin-top:18px}

.eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--ff-disp);font-size:.82rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--accent);
  margin-bottom:14px;
}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--accent);display:block}
.sec.deep .eyebrow,.sec.ink .eyebrow{color:#f0a37a}
.sec.deep .eyebrow::before,.sec.ink .eyebrow::before{background:#f0a37a}

.lead{font-size:1.075rem;color:var(--slate);max-width:64ch}
.sec.ink .lead,.sec.deep .lead{color:#a9b6bf}
.muted{color:var(--slate)}
.small{font-size:.875rem}
.tiny{font-size:.78rem;letter-spacing:.02em}

/* ---------- top notice ---------- */
.notice{
  background:var(--ink);color:#c3ccd3;font-size:.79rem;
  letter-spacing:.02em;border-bottom:1px solid #1f272e;
}
.notice .wrap{display:flex;flex-wrap:wrap;gap:26px;align-items:center;justify-content:center;
  padding-top:9px;padding-bottom:9px;min-height:38px}
.notice span{display:inline-flex;align-items:center;gap:8px}
.notice b{color:#fff;font-weight:600}
.notice .sep{width:1px;height:11px;background:#33404a}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:90;background:rgba(255,255,255,.96);
  backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid var(--line);
  transition:box-shadow .2s,border-color .2s}
.hdr.stuck{box-shadow:0 1px 0 rgba(14,19,23,.05),0 8px 28px rgba(14,19,23,.07)}
.hdr .bar{display:flex;align-items:center;gap:22px;height:80px;max-width:var(--maxw);
  margin:0 auto;padding:0 var(--gut);transition:height .2s}
.hdr.stuck .bar{height:68px}

.brand{display:flex;align-items:center;flex:none}
.brand img{height:58px;width:auto;display:block;transition:height .2s}
.hdr.stuck .brand img{height:46px}

.nav{margin-left:auto;display:flex;align-items:center;gap:4px}
.nav>li{list-style:none;position:relative}
.nav a,.nav button.navlink{
  display:inline-flex;align-items:center;gap:5px;background:none;border:0;
  padding:10px 13px;font-size:.9rem;font-weight:550;color:var(--ink);letter-spacing:-.005em;
  border-radius:var(--r);
}
.nav a:hover,.nav button.navlink:hover{color:var(--accent);background:var(--bone)}
.nav a.on{color:var(--accent)}
.nav .caret{width:7px;height:7px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;
  transform:rotate(45deg) translateY(-1px);opacity:.6}

.tools{display:flex;align-items:center;gap:6px;margin-left:6px;padding-left:14px;border-left:1px solid var(--line)}
.iconbtn{
  width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid transparent;border-radius:var(--r);background:none;color:var(--ink);position:relative;
}
.iconbtn:hover{background:var(--bone);color:var(--accent)}
.iconbtn svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.qcount{
  position:absolute;top:2px;right:1px;min-width:16px;height:16px;padding:0 4px;border-radius:9px;
  background:var(--accent);color:#fff;font-size:.62rem;font-weight:700;line-height:16px;text-align:center;
  display:none;
}
.qcount.on{display:block}
.navtoggle{display:none;margin-left:auto;width:40px;height:40px;border:1px solid var(--line);
  border-radius:var(--r);background:#fff;align-items:center;justify-content:center}
.navtoggle svg{width:20px;height:20px;stroke:var(--ink);stroke-width:1.7;fill:none;stroke-linecap:round}

/* mega menu */
.mega{
  position:absolute;top:calc(100% + 12px);left:-140px;width:760px;
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-3);padding:22px;display:none;grid-template-columns:1.35fr 1fr;gap:22px;
}
.has-mega:hover .mega,.mega.open{display:grid}
.mega .cols{display:grid;grid-template-columns:1fr 1fr;gap:6px 22px}
.mega .mh{grid-column:1/-1;font-family:var(--ff-disp);font-size:.72rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--steel);padding:0 0 8px;border-bottom:1px solid var(--line);margin-bottom:6px}
.mega a{display:block;padding:9px 10px;border-radius:var(--r);font-size:.9rem}
.mega a small{display:block;color:var(--steel);font-size:.76rem;font-weight:400;margin-top:2px}
.mega a:hover{background:var(--bone)}
.mega .promo{background:var(--bone);border-radius:var(--r-lg);padding:18px;display:flex;
  flex-direction:column;justify-content:space-between}
.mega .promo .k{font-family:var(--ff-disp);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent)}
.mega .promo h4{margin:6px 0 6px;font-size:1.02rem}
.mega .promo p{font-size:.82rem;color:var(--slate);margin:0 0 12px}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:14px 26px;border-radius:var(--r);border:1.5px solid transparent;
  font-size:.92rem;font-weight:600;letter-spacing:.01em;transition:.16s;white-space:nowrap;
}
.btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.btn-p{background:var(--accent);color:#fff}
.btn-p:hover{background:var(--accent-d);color:#fff;transform:translateY(-1px)}
.btn-d{background:var(--ink);color:#fff}
.btn-d:hover{background:#000;color:#fff}
.btn-o{border-color:var(--ink);color:var(--ink);background:none}
.btn-o:hover{background:var(--ink);color:#fff}
.btn-w{border-color:rgba(255,255,255,.4);color:#fff;background:none}
.btn-w:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn.sm{padding:10px 18px;font-size:.84rem}
.btn.xs{padding:8px 14px;font-size:.79rem}
.btn.wide{width:100%}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.linkarrow{display:inline-flex;align-items:center;gap:7px;font-weight:600;font-size:.9rem;color:var(--accent)}
.linkarrow:hover{gap:11px}
.linkarrow svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---------- hero ---------- */
.hero{position:relative;background:var(--bone);overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;
  background:
    radial-gradient(900px 460px at 88% 8%,rgba(217,83,30,.10),transparent 62%),
    linear-gradient(180deg,#f7f4ef,#efeae1);
  pointer-events:none}
.hero .in{position:relative;display:grid;grid-template-columns:1.02fr .98fr;gap:56px;
  align-items:center;padding:78px 0 84px}
.hero h1{margin-bottom:18px;letter-spacing:-.035em;line-height:1.06}
.hero h1 em{font-style:normal;color:var(--accent)}
.hero p{font-size:1.09rem;color:#3f4a53;max-width:47ch;margin-bottom:28px}
.hero .btns{display:flex;flex-wrap:wrap;gap:12px}
.hero .proof{display:flex;flex-wrap:wrap;gap:26px;margin-top:38px;padding-top:22px;border-top:1px solid var(--line-dark)}
.hero .proof div{font-size:.8rem;color:var(--slate);display:flex;align-items:center;gap:7px}
.hero .proof svg{width:14px;height:14px;stroke:var(--ok);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}

.hero-media{position:relative;height:460px}
.hero-media .ph{
  position:absolute;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--shadow-2);overflow:hidden;
}
.hero-media .ph img{width:100%;height:100%;object-fit:contain;padding:12px}
.hero-media .a{width:66%;height:64%;left:0;top:0}
.hero-media .b{width:46%;height:42%;right:0;bottom:12%;box-shadow:var(--shadow-3)}
.hero-media .c{width:34%;height:30%;right:8%;top:0;background:var(--ink);border-color:var(--ink);
  display:flex;flex-direction:column;justify-content:center;padding:18px}
.hero-media .c b{font-family:var(--ff-disp);font-size:1.9rem;color:#fff;line-height:1;letter-spacing:.02em}
.hero-media .c span{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:#9fb0bc;margin-top:6px}
.hero-media .tag{
  position:absolute;left:calc(66% - 30px);top:calc(64% - 22px);background:var(--accent);color:#fff;
  font-family:var(--ff-disp);font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;
  padding:7px 13px;border-radius:2px;z-index:2;box-shadow:var(--shadow-1)
}

/* ---------- category grid ---------- */
.catgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.catcard{
  position:relative;display:block;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  overflow:hidden;transition:.2s;min-height:230px;
}
.catcard:hover{border-color:var(--line-dark);box-shadow:var(--shadow-2);transform:translateY(-2px)}
.catcard .thumb{height:150px;background:var(--bone);display:flex;align-items:center;justify-content:center;padding:10px}
.catcard .thumb img{height:100%;width:auto;object-fit:contain;transition:transform .35s}
.catcard:hover .thumb img{transform:scale(1.05)}
.catcard .txt{padding:16px 18px 18px;border-top:1px solid var(--line)}
.catcard .k{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--steel);font-family:var(--ff-disp)}
.catcard h3{margin:4px 0 3px;font-size:1.06rem}
.catcard .n{font-size:.78rem;color:var(--slate)}
.catcard .go{position:absolute;right:14px;bottom:16px;opacity:0;transition:.2s;color:var(--accent);font-weight:700}
.catcard:hover .go{opacity:1}

/* ---------- product grid ---------- */
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px 20px}
.pcard{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);
  border-radius:var(--r-lg);overflow:hidden;transition:.18s}
.pcard:hover{border-color:var(--line-dark);box-shadow:var(--shadow-2);transform:translateY(-2px)}
.pcard .media{position:relative;background:#fbfaf8;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;
  padding:16px;border-bottom:1px solid var(--line)}
.pcard .media img{width:100%;height:100%;object-fit:contain;transition:opacity .25s,transform .35s}
.pcard:hover .media img.main{transform:scale(1.045)}
.pcard .flag{
  position:absolute;left:10px;top:10px;z-index:2;font-family:var(--ff-disp);font-size:.66rem;
  letter-spacing:.14em;text-transform:uppercase;padding:4px 8px;border-radius:2px;background:var(--ink);color:#fff;
}
.pcard .flag.best{background:var(--accent)}
.pcard .flag.new{background:var(--deep)}
.pcard .body{padding:14px 15px 16px;display:flex;flex-direction:column;flex:1}
.pcard .cat{font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;color:var(--steel);margin-bottom:5px}
.pcard h3{font-size:.94rem;line-height:1.35;margin:0 0 6px;font-weight:600}
.pcard h3 a{color:var(--ink)}
.pcard .oe{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.72rem;color:var(--slate);
  letter-spacing:.01em;margin-bottom:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pcard .foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding-top:11px;border-top:1px solid var(--line)}
.pcard .price{font-size:.8rem;color:var(--steel);font-style:italic}
.pcard .addq{border:1px solid var(--line-dark);background:#fff;border-radius:2px;padding:6px 10px;
  font-size:.74rem;font-weight:600;color:var(--ink)}
.pcard .addq:hover{background:var(--ink);color:#fff;border-color:var(--ink)}

/* ---------- feature band ---------- */
.band{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.band .cell{background:#fff;padding:24px 22px}
.band .cell b{display:block;font-family:var(--ff-disp);font-size:1.9rem;line-height:1;color:var(--ink);letter-spacing:.01em}
.band .cell span{display:block;font-size:.8rem;color:var(--slate);margin-top:7px}
.sec.ink .band,.sec.deep .band{background:#28323b;border-color:#28323b}
.sec.ink .band .cell,.sec.deep .band .cell{background:#141b21}
.sec.ink .band .cell b,.sec.deep .band .cell b{color:#fff}

/* ---------- process ---------- */
.proc{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;counter-reset:s}
.proc .st{counter-increment:s;position:relative;padding-top:26px;border-top:2px solid #2c3742}
.proc .st::before{content:"0" counter(s);position:absolute;top:-14px;left:0;background:var(--ink);
  color:#f0a37a;font-family:var(--ff-disp);font-size:.78rem;letter-spacing:.12em;padding:4px 9px;border-radius:2px}
.proc h4{margin:0 0 6px;color:#fff;font-size:1rem}
.proc p{margin:0;font-size:.875rem;color:#9fb0bc}

/* ---------- split content ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.split.wide{grid-template-columns:1.15fr .85fr}
.fig{border-radius:var(--r-lg);overflow:hidden;background:#fbfaf8;border:1px solid var(--line);
  aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;padding:26px}
.fig img{width:100%;height:100%;object-fit:contain}
.checklist{list-style:none;padding:0;margin:22px 0 0}
.checklist li{position:relative;padding-left:30px;margin-bottom:13px;font-size:.95rem;color:#3d4852}
.checklist li::before{content:"";position:absolute;left:0;top:5px;width:16px;height:16px;border-radius:50%;
  background:var(--accent-l);border:1px solid #f3c6ae}
.checklist li::after{content:"";position:absolute;left:4.5px;top:9.5px;width:7px;height:4px;
  border-left:1.8px solid var(--accent);border-bottom:1.8px solid var(--accent);transform:rotate(-45deg)}

/* ---------- quote strip ---------- */
.strip{background:var(--ink);color:#fff;padding:52px 0}
.strip .in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px}
.strip h3{margin:0 0 6px;color:#fff;font-size:1.5rem}
.strip p{margin:0;color:#9fb0bc;font-size:.94rem;max-width:56ch}

/* ---------- page hero ---------- */
.phero{background:var(--ink);color:#fff;padding:44px 0 52px;position:relative;overflow:hidden}
.phero::after{content:"";position:absolute;inset:0;
  background:radial-gradient(700px 300px at 92% 0%,rgba(217,83,30,.22),transparent 60%);pointer-events:none}
.phero .wrap{position:relative;z-index:1}
.phero h1{color:#fff;font-size:clamp(1.9rem,3.2vw,2.7rem);margin-bottom:10px;letter-spacing:-.03em}
.phero p{color:#b7c3cb;max-width:62ch;margin:0;font-size:1.02rem}
.phero .k{font-family:var(--ff-disp);font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:#f0a37a;margin-bottom:10px}
.phero .nameline{margin-top:20px;padding-top:16px;border-top:1px solid #2b3740;color:#e7ebee;
  font-family:var(--ff-disp);font-size:.9rem;letter-spacing:.12em;text-transform:uppercase}
.phero .nameline b{color:#fff;font-weight:700}
.phero .nameline i{font-style:normal;color:var(--accent);font-weight:700}

/* breadcrumb */
.crc{font-size:.8rem;color:var(--steel);padding:16px 0 0}
.crc a{color:var(--steel)}
.crc a:hover{color:var(--accent)}
.crc span{margin:0 7px;opacity:.5}

/* ---------- filters ---------- */
.filterbar{display:flex;flex-wrap:nowrap;gap:14px;align-items:center;justify-content:space-between;
  padding:18px 0;border-bottom:1px solid var(--line);margin-bottom:28px}
.chips{display:flex;flex-wrap:nowrap;gap:7px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;padding-bottom:2px}
.chips::-webkit-scrollbar{display:none}
.chips .chip{white-space:nowrap}
.chip{border:1px solid var(--line-dark);background:#fff;border-radius:999px;padding:7px 15px;
  font-size:.82rem;font-weight:550;color:#404b54}
.chip:hover{border-color:var(--ink);color:var(--ink)}
.chip.on{background:var(--ink);border-color:var(--ink);color:#fff}
.fsearch{position:relative;flex:0 0 270px;max-width:270px}
.fsearch input{width:100%;padding:10px 14px 10px 36px;border:1px solid var(--line-dark);border-radius:999px;
  font:inherit;font-size:.86rem;background:#fff}
.fsearch svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);width:15px;height:15px;
  stroke:var(--steel);fill:none;stroke-width:2;stroke-linecap:round}
.fsearch input:focus{outline:none;border-color:var(--ink)}
.count{font-size:.82rem;color:var(--steel)}

/* ---------- product detail ---------- */
.pdp{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;padding-top:26px}
.gal .main{background:#fbfaf8;border:1px solid var(--line);border-radius:var(--r-lg);
  aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;padding:34px;overflow:hidden}
.gal .main img{width:100%;height:100%;object-fit:contain}
.gal .galnote{margin-top:12px;font-size:.84rem;color:var(--slate);display:flex;gap:8px;align-items:flex-start}
.gal .galnote::before{content:"";flex:0 0 3px;align-self:stretch;background:var(--accent);border-radius:2px}
.gal .thumbs{display:flex;gap:10px;margin-top:12px}
.gal .thumbs button{width:78px;height:78px;border:1px solid var(--line);border-radius:var(--r);
  background:#fff;padding:6px;overflow:hidden}
.gal .thumbs button.on{border-color:var(--ink)}
.gal .thumbs img{width:100%;height:100%;object-fit:contain}
.buybox .cat{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);
  font-family:var(--ff-disp);margin-bottom:8px}
.buybox h1{font-size:clamp(1.5rem,2.4vw,2.05rem);margin-bottom:8px;letter-spacing:-.025em;line-height:1.15}
.buybox .sub{color:var(--slate);font-size:1rem;margin-bottom:18px}
.metarow{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px}
.tag{display:inline-flex;align-items:center;gap:6px;font-size:.75rem;font-weight:600;padding:5px 11px;
  border-radius:2px;background:var(--bone);color:#4b5760;letter-spacing:.02em}
.tag.ok{background:#edf6f0;color:var(--ok)}
.tag.warn{background:var(--accent-l);color:var(--accent-d)}
.priceline{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;margin-bottom:20px}
.priceline .lbl{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--steel);font-family:var(--ff-disp)}
.priceline .val{font-size:1.28rem;font-weight:600;color:var(--ink);margin:6px 0 4px}
.priceline .val .dash{color:var(--line-dark);letter-spacing:.12em}
.priceline .note{font-size:.82rem;color:var(--slate);margin:0}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.actions .btn{flex:1 1 180px}
.factlist{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;margin-top:4px}
.factlist .row{display:flex;gap:14px;padding:11px 15px;border-bottom:1px solid var(--line);font-size:.87rem}
.factlist .row:last-child{border-bottom:0}
.factlist .row:nth-child(odd){background:#fbfaf8}
.factlist .row dt{width:38%;flex:none;color:var(--steel)}
.factlist .row dd{margin:0;color:var(--ink);font-weight:500}
.factlist .row dd.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8rem;font-weight:400}

.secthead{display:flex;align-items:baseline;justify-content:space-between;gap:18px;margin-bottom:16px;
  padding-bottom:10px;border-bottom:1px solid var(--line)}
.secthead h3{margin:0;font-size:1.05rem;letter-spacing:.01em}
.secthead span{font-size:.78rem;color:var(--steel)}
.prose{max-width:74ch}
.prose p{color:#3d4852}
.prose h3{margin-top:34px}
.prose h4{margin-top:22px}
.prose li{color:#3d4852;margin-bottom:6px}

/* fit notes */
.fitbox{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bone);padding:20px 22px}
.fitbox h4{margin:0 0 10px;font-size:.95rem}
.fitbox ul{list-style:none;padding:0;margin:0}
.fitbox li{position:relative;padding-left:20px;font-size:.87rem;color:#3d4852;margin-bottom:7px}
.fitbox li::before{content:"";position:absolute;left:0;top:8px;width:6px;height:6px;border-radius:50%;background:var(--accent)}

/* ---------- tables ---------- */
table.tbl{width:100%;border-collapse:collapse;font-size:.9rem}
table.tbl th{text-align:left;font-family:var(--ff-disp);font-size:.72rem;letter-spacing:.14em;
  text-transform:uppercase;color:#fff;background:var(--graphite);padding:11px 14px;font-weight:600}
table.tbl td{padding:11px 14px;border-bottom:1px solid var(--line);color:#3d4852}
table.tbl tr:nth-child(even) td{background:#fbfaf8}
table.tbl td:first-child{font-weight:600;color:var(--ink);width:34%}
table.tbl td.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.84rem}

/* ---------- faq ---------- */
.faq{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:18px 30px 18px 0;position:relative;
  font-weight:600;font-size:.97rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:4px;top:24px;width:11px;height:11px;
  border-right:1.7px solid var(--steel);border-bottom:1.7px solid var(--steel);
  transform:rotate(45deg);transition:.2s}
.faq[open] summary::after{transform:rotate(-135deg);top:26px}
.faq .a{padding:0 40px 20px 0;color:var(--slate);font-size:.92rem}
.faq .a p:last-child{margin-bottom:0}

/* ---------- forms ---------- */
.form{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:28px}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fgrid .full{grid-column:1/-1}
label{display:block;font-size:.8rem;font-weight:600;margin-bottom:6px;color:#39434c;letter-spacing:.01em}
input[type=text],input[type=email],input[type=tel],select,textarea{
  width:100%;padding:11px 13px;border:1px solid var(--line-dark);border-radius:var(--r);
  font:inherit;font-size:.92rem;background:#fff;color:var(--ink);
}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px rgba(14,19,23,.06)}
textarea{min-height:120px;resize:vertical}
.hint{font-size:.76rem;color:var(--steel);margin-top:6px}
.formnote{display:none;margin-top:16px;padding:14px 16px;border-radius:var(--r);
  background:#edf6f0;border:1px solid #bfdcc9;color:#255f3c;font-size:.88rem}
.formnote.show{display:block}

/* ---------- quote page ---------- */
.qlist{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:#fff}
.qrow{display:grid;grid-template-columns:88px 1fr auto auto;gap:16px;align-items:center;
  padding:14px 16px;border-bottom:1px solid var(--line)}
.qrow:last-child{border-bottom:0}
.qrow img{width:88px;height:88px;object-fit:contain;background:#fbfaf8;border:1px solid var(--line);border-radius:var(--r);padding:6px}
.qrow .t{font-weight:600;font-size:.92rem;line-height:1.35}
.qrow .s{font-family:ui-monospace,Menlo,monospace;font-size:.76rem;color:var(--steel);margin-top:3px}
.qrow .rm{background:none;border:1px solid var(--line);border-radius:var(--r);width:32px;height:32px;
  color:var(--steel);font-size:1rem;line-height:1}
.qrow .rm:hover{border-color:var(--accent);color:var(--accent)}
.qempty{padding:56px 24px;text-align:center;color:var(--slate)}

/* ---------- footer ---------- */
.ftr{background:var(--ink);color:#93a1ab;padding:64px 0 26px;font-size:.88rem}
.ftr .cols{display:grid;grid-template-columns:1.6fr repeat(4,1fr);gap:36px}
.ftr h5{color:#fff;font-family:var(--ff-disp);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;
  margin:0 0 14px;font-weight:600}
.ftr ul{list-style:none;margin:0;padding:0}
.ftr li{margin-bottom:9px}
.ftr a{color:#93a1ab}
.ftr a:hover{color:#fff}
.ftr .fbrand{margin-bottom:16px}
.ftr .fbrand img{height:66px;width:auto;display:block;filter:invert(1)}
.ftr .note{color:#7d8b95;font-size:.82rem;line-height:1.7;max-width:34ch}
.ftr .bot{border-top:1px solid #232c34;margin-top:44px;padding-top:20px;display:flex;flex-wrap:wrap;
  gap:14px;justify-content:space-between;color:#6f7d87;font-size:.79rem}
.legal{border-top:1px solid #232c34;margin-top:20px;padding-top:18px;color:#6f7d87;font-size:.76rem;
  line-height:1.7;max-width:100%}

/* toast */
.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,20px);z-index:200;
  background:var(--ink);color:#fff;padding:13px 22px;border-radius:var(--r);font-size:.88rem;
  box-shadow:var(--shadow-3);opacity:0;pointer-events:none;transition:.25s}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* reveal */
.rv{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* ---------- responsive ---------- */
@media(max-width:1120px){
  .pgrid{grid-template-columns:repeat(3,1fr)}
  .mega{left:-60px;width:640px}
}
@media(max-width:960px){
  :root{--gut:22px}
  .sec{padding:64px 0}
  .hero .in{grid-template-columns:1fr;gap:36px;padding:52px 0 60px}
  .hero-media{height:340px}
  .catgrid{grid-template-columns:repeat(2,1fr)}
  .pdp{grid-template-columns:1fr;gap:32px}
  .split,.split.wide{grid-template-columns:1fr;gap:30px}
  .proc{grid-template-columns:1fr 1fr;gap:30px 22px}
  .band{grid-template-columns:1fr 1fr}
  .ftr .cols{grid-template-columns:1fr 1fr;gap:28px}
  .nav{display:none}
  .nav.open{display:flex;position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;
    align-items:stretch;padding:14px var(--gut) 22px;border-bottom:1px solid var(--line);
    box-shadow:var(--shadow-2);gap:0;max-height:calc(100vh - 74px);overflow:auto}
  .nav.open>li{border-bottom:1px solid var(--line)}
  .nav.open a,.nav.open button.navlink{width:100%;justify-content:space-between;padding:14px 4px}
  .nav.open .mega{position:static;display:block;width:auto;box-shadow:none;border:0;padding:0 0 12px;
    grid-template-columns:1fr;left:auto}
  .nav.open .mega .promo{display:none}
  .nav.open .mega .cols{grid-template-columns:1fr}
  .navtoggle{display:flex}
  .tools{margin-left:0;border:0;padding-left:0}
  .hdr .bar{gap:12px}
  .brand img{height:44px}
  .hdr.stuck .brand img{height:40px}
}
@media(max-width:720px){
  .pgrid{grid-template-columns:repeat(2,1fr);gap:14px}
  .pcard .body{padding:11px 12px 13px}
  .pcard h3{font-size:.87rem}
  .pcard .oe{font-size:.68rem}
  .catgrid{grid-template-columns:1fr}
  .hero-media{height:280px}
  .fgrid{grid-template-columns:1fr}
  .band{grid-template-columns:1fr 1fr}
  .notice .wrap{gap:14px;font-size:.72rem}
  .notice .sep{display:none}
  .notice span:nth-child(4),.notice span:nth-child(5){display:none}
  .qrow{grid-template-columns:64px 1fr auto;gap:12px}
  .qrow img{width:64px;height:64px}
  .filterbar{flex-wrap:wrap;align-items:stretch}
  .chips{flex:1 1 100%}
  .fsearch{flex:1 1 auto;max-width:none}
  .ftr .cols{grid-template-columns:1fr}
  .actions .btn{flex:1 1 100%}
}
@media(max-width:520px){
  .pgrid{grid-template-columns:1fr}
  .hdr .bar{height:64px}
}