
:root{
  --night:#0A0E16; --night-up:#111726; --panel:#18202F; --panel-up:#212B3D;
  --line:#2A3446; --line-soft:#1E2635;
  --on-dark:#EDF1F7; --on-dark-soft:#93A0B4;
  --paper:#F7F3EC; --paper-up:#EDE7DC; --card:#FFFFFF;
  --ink:#131A26; --ink-soft:#28323F; --body:#4A5566; --soft:#7C889A;
  --rule:#DFD8CB; --rule-soft:#EBE5D9;
  --brand:#E07A28; --brand-deep:#B85D14; --brand-bright:#FF9F45; --brand-pale:#FBEADA;
  --buy:#E07A28; --buy-deep:#B85D14;
  --gold:#C4922F; --gold-pale:#F5EAD3;
  --a1:#C9A227; --a2:#6E8FD1; --a3:#E08C6A; --a4:#5FA3A0; --a5:#9BAF91; --a6:#8C7A66;
  --accent:#FF9F45;
  --wrap:1240px; --gap:clamp(18px,2.4vw,30px);
  --wrap-wide:1440px;
  --radius:18px; --radius-sm:12px;
  --display:'Sora',"Segoe UI",Helvetica,Arial,sans-serif;
  --text:'Karla',"Segoe UI",Helvetica,Arial,sans-serif;
  --mono:'DM Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --masthead-h:112px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--night); color:var(--on-dark);
  font:400 17px/1.68 var(--text);
  overflow-x:hidden;
}
img,svg,video{max-width:100%}
img{height:auto}
[hidden]{display:none!important}
a{color:inherit}
h1,h2,h3,h4,h5{font-family:var(--display); font-weight:700; line-height:1.12; margin:0 0 .5em; letter-spacing:-.015em}
h1{font-size:clamp(34px,5.2vw,62px); font-weight:800}
h2{font-size:clamp(27px,3.5vw,42px)}
h3{font-size:clamp(20px,2.2vw,26px)}
h4{font-size:18px}
p{margin:0 0 1.05em}
ul,ol{margin:0 0 1.2em; padding-left:1.15em}
li{margin:.3em 0}
.skip{position:absolute;left:-9999px;top:0;background:var(--brand);color:#fff;padding:10px 16px;z-index:99}
.skip:focus{left:8px;top:8px}
:focus-visible{outline:3px solid var(--brand-bright); outline-offset:2px}
.content-wrap{width:min(100% - 2*var(--gap),var(--wrap)); margin-inline:auto}
.content-wrap.narrow{max-width:820px}
.mono{font-family:var(--mono)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* --- buttons ------------------------------------------------------------ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  font-family:var(--display); font-weight:700; font-size:16px; line-height:1;
  padding:15px 22px; border-radius:999px; border:1.5px solid transparent;
  text-decoration:none; cursor:pointer; max-width:100%;
  transition:transform .14s ease, background-color .14s ease, border-color .14s ease;
}
.btn svg{width:1.15em;height:1.15em;flex:0 0 auto;fill:currentColor}
.btn img.cta{display:block;width:auto}
.btn-buy{background:var(--buy); color:#fff; box-shadow:0 10px 26px -14px #B85D14}
.btn-buy:hover{background:var(--buy-deep); transform:translateY(-1px)}
.btn-line{background:transparent; color:var(--on-dark); border-color:rgba(255,255,255,.26)}
.btn-line:hover{border-color:var(--brand-bright); color:var(--brand-bright)}
.btn-ink{background:transparent; color:var(--ink); border-color:var(--rule)}
.btn-ink:hover{border-color:var(--brand); color:var(--brand-deep)}
.btn-sm{font-size:14px; padding:11px 16px}
.btn-lg{font-size:17px; padding:18px 28px}
.btn-block{display:flex; width:100%}

/* --- masthead ----------------------------------------------------------- */
.masthead{position:sticky; top:0; z-index:60; background:#0A0E16f2; backdrop-filter:blur(10px); border-bottom:1px solid var(--line)}
.utility{background:var(--panel); border-bottom:1px solid var(--line); font-size:13px; color:var(--on-dark-soft)}
.utility .content-wrap{display:flex; justify-content:space-between; gap:14px; padding:7px 0; align-items:center}
.utility a{color:var(--on-dark)}
.utility .u2{font-family:var(--mono); font-size:12.5px; letter-spacing:.02em}
.masthead-inner{display:flex; align-items:center; gap:20px; padding:14px 0}
.brandmark{display:inline-flex; align-items:center; gap:11px; text-decoration:none; color:inherit; flex:0 0 auto}
.brandmark-tile{width:42px;height:42px;flex:0 0 auto;border-radius:11px}
.brandmark-word{display:block; font-family:var(--display); font-weight:800; font-size:23px; letter-spacing:.01em; line-height:1.05}
.brandmark-sub{display:block; font-size:11.5px; letter-spacing:.13em; text-transform:uppercase; color:var(--on-dark-soft); margin-top:2px}
.mainnav{display:flex; gap:22px; margin-left:auto; font-family:var(--display); font-weight:500; font-size:15px}
.mainnav a{text-decoration:none; color:var(--on-dark-soft); padding:6px 0; border-bottom:2px solid transparent}
.mainnav a:hover,.mainnav a[aria-current="page"]{color:var(--on-dark); border-bottom-color:var(--brand-bright)}
.head-cta{display:flex; align-items:center; gap:10px; flex:0 1 auto; min-width:0}
.cta-short{display:none}
.masthead .nav-toggle{display:none}
.headclock{
  display:inline-flex; align-items:baseline; gap:7px; font-family:var(--mono); font-size:15px;
  padding:9px 13px; border-radius:999px; border:1px solid var(--line); background:var(--panel); color:var(--on-dark);
}
.headclock .hc-label{font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--on-dark-soft)}

/* --- hero --------------------------------------------------------------- */
.hero{position:relative; overflow:hidden; background:
  radial-gradient(120% 90% at 78% 8%, #B85D1455 0%, transparent 62%),
  linear-gradient(180deg,var(--night-up) 0%, var(--night) 78%)}
.hero-inner{display:grid; grid-template-columns:minmax(0,1.02fr) minmax(0,1fr); gap:clamp(26px,4vw,58px); align-items:center; padding:clamp(38px,5vw,74px) 0 clamp(34px,4.4vw,60px)}
.hero-inner>*{min-width:0}
.hero-eyebrow{display:inline-flex; align-items:center; gap:10px; font-family:var(--mono); font-size:12.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--brand-bright); margin:0 0 18px}
.hero-eyebrow::before{content:""; width:26px; height:1px; background:var(--brand-bright)}
.hero h1{margin-bottom:.42em}
.hero h1 em{font-style:normal; color:var(--brand-bright)}
.hero-lede{font-size:clamp(17px,1.45vw,19.5px); color:var(--on-dark-soft); max-width:56ch}
.hero-acts{display:flex; flex-wrap:wrap; gap:12px; margin:26px 0 0}
.hero-figure{position:relative; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); background:var(--panel); min-height:0}
.hero-figure img{display:block; width:100%; height:100%; object-fit:cover; aspect-ratio:16/11}
.hero-stamp{
  position:absolute; left:16px; bottom:16px; display:flex; gap:16px; align-items:center;
  background:#0A0E16d9; border:1px solid var(--line); border-radius:14px; padding:11px 16px; backdrop-filter:blur(6px);
}
.hero-stamp b{display:block; font-family:var(--mono); font-size:19px; color:var(--brand-bright); font-weight:500}
.hero-stamp span{display:block; font-size:11.5px; letter-spacing:.09em; text-transform:uppercase; color:var(--on-dark-soft)}
.trustband{background:var(--night); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.trustrow{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:var(--line)}
.trustrow>div{background:var(--night); padding:18px 20px; min-width:0}
.trustrow>div:first-child{padding-left:0}
.trustrow b{display:block; font-family:var(--display); font-size:24px; color:var(--on-dark); font-weight:700; letter-spacing:-.02em}
.trustrow span{display:block; font-size:13px; color:var(--on-dark-soft); margin-top:3px}

/* --- line rail ---------------------------------------------------------- */
.linerail{padding:clamp(30px,3.6vw,48px) 0}
.linerail-grid{display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px}
.linerail-grid>*{min-width:0}
.linechip{
  display:flex; flex-direction:column; gap:6px; text-decoration:none; color:inherit;
  background:var(--panel); border:1px solid var(--line); border-radius:var(--radius-sm);
  padding:16px 15px 14px; border-top:3px solid var(--accent); transition:transform .14s ease, border-color .14s ease;
}
.linechip:hover{transform:translateY(-2px); border-color:var(--accent)}
.linechip .lc-model{font-family:var(--mono); font-size:11.5px; letter-spacing:.09em; color:var(--accent)}
.linechip .lc-name{font-family:var(--display); font-weight:600; font-size:15.5px; line-height:1.22}
.linechip .lc-from{font-family:var(--mono); font-size:13px; color:var(--on-dark-soft); margin-top:auto}

/* --- section shell ------------------------------------------------------ */
.page-section{padding:clamp(40px,4.4vw,68px) 0; position:relative}
.page-section.on-paper{background:var(--paper); color:var(--body)}
.page-section.on-paper h1,.page-section.on-paper h2,.page-section.on-paper h3,.page-section.on-paper h4{color:var(--ink)}
.page-section.on-panel{background:var(--night-up)}
.page-section+.page-section.on-paper{border-top:0}
.hourhead{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(18px,3vw,44px); align-items:end; margin-bottom:clamp(24px,3vw,38px)}
.hourhead>*{min-width:0}
.hourhead.solo{grid-template-columns:minmax(0,1fr)}
.hourstamp{display:inline-flex; align-items:center; gap:12px; margin-bottom:14px}
.hourstamp .hs-time{font-family:var(--mono); font-size:15px; color:var(--accent); letter-spacing:.03em}
.hourstamp .hs-rule{flex:1 1 40px; height:1px; background:currentColor; opacity:.22; min-width:26px}
.hourstamp .hs-label{font-size:11.5px; letter-spacing:.15em; text-transform:uppercase; color:var(--on-dark-soft); white-space:nowrap}
.on-paper .hourstamp .hs-label{color:var(--soft)}
.hourhead h2{margin-bottom:0}
.hourlede{color:var(--on-dark-soft); font-size:16.5px}
.on-paper .hourlede{color:var(--body)}
.hourlede p:last-child{margin-bottom:0}
.hourfoot{display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-top:clamp(22px,2.6vw,32px)}
.hourfoot .hf-note{font-size:14.5px; color:var(--on-dark-soft)}
.on-paper .hourfoot .hf-note{color:var(--soft)}

/* --- product cards ------------------------------------------------------ */
.pgrid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--gap)}
.pgrid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.pgrid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.pgrid>*{min-width:0}
.pcard{
  display:flex; flex-direction:column; background:var(--card); color:var(--ink);
  border:1px solid rgba(0,0,0,.07); border-radius:var(--radius); overflow:hidden;
  transition:transform .16s ease, box-shadow .16s ease;
}
.pcard:hover{transform:translateY(-3px); box-shadow:0 26px 44px -30px rgba(0,0,0,.85)}
.pcard-shot{position:relative; background:var(--paper); padding:14px; border-bottom:1px solid var(--rule-soft)}
.pcard-shot img{display:block; width:100%; aspect-ratio:1/1; object-fit:contain}
.pcard-flag{
  position:absolute; left:12px; top:12px; font-family:var(--mono); font-size:11px; letter-spacing:.07em;
  background:var(--ink); color:#fff; border-radius:999px; padding:5px 10px;
}
.pcard-body{display:flex; flex-direction:column; gap:9px; padding:16px 16px 18px; flex:1}
.pcard-model{font-family:var(--mono); font-size:11.5px; letter-spacing:.1em; color:var(--accent)}
.pcard h3{font-size:17px; font-weight:600; line-height:1.26; margin:0; color:var(--ink)}
.pcard-spec{display:flex; flex-wrap:wrap; gap:7px; margin:0}
.pcard-spec span{font-size:12px; background:var(--paper-up); color:var(--ink-soft); border-radius:999px; padding:4px 9px}
.pcard-swatch{display:inline-flex; align-items:center; gap:7px; font-size:13px; color:var(--body)}
.pcard-swatch i{width:15px;height:15px;border-radius:50%;border:1px solid rgba(0,0,0,.2); display:inline-block; flex:0 0 auto}
.pcard-desc{font-size:14.5px; color:var(--body); margin:0; flex:1 0 auto}
.pcard-foot{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:2px}
.price{font-family:var(--mono); font-size:23px; font-weight:500; color:var(--ink); letter-spacing:-.02em}
.stars{display:inline-flex; align-items:center; gap:4px; font-family:var(--mono); font-size:13.5px; color:var(--ink-soft)}
.stars svg{width:14px;height:14px;fill:var(--gold)}
.stars .mute{color:var(--soft)}
.pcard .btn{width:100%}

/* --- lead card (one wide card per block) -------------------------------- */
.leadcard{
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:0;
  background:var(--card); color:var(--ink); border-radius:var(--radius); overflow:hidden;
  border:1px solid rgba(0,0,0,.07); margin-bottom:var(--gap);
}
.leadcard>*{min-width:0}
.leadcard-shot{background:var(--paper); display:flex; align-items:center; justify-content:center; padding:22px}
.leadcard-shot img{display:block; width:100%; max-height:420px; object-fit:contain}
.leadcard-body{padding:clamp(22px,2.6vw,34px); display:flex; flex-direction:column; gap:12px; justify-content:center}
.leadcard-body h3{font-size:clamp(21px,2.1vw,28px); color:var(--ink); margin:0}
.leadcard-body .lead-model{font-family:var(--mono); font-size:12px; letter-spacing:.1em; color:var(--accent)}
.leadcard-list{margin:0; padding-left:1.1em; font-size:15px; color:var(--body)}
.leadcard-foot{display:flex; flex-wrap:wrap; align-items:center; gap:14px; margin-top:4px}

/* --- gallery ------------------------------------------------------------ */
.gallery-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; align-items:start}
.gallery-grid>*{min-width:0}
.gfig{margin:0; position:relative; border-radius:var(--radius-sm); overflow:hidden; border:1px solid var(--line); background:var(--panel)}
.gfig img{display:block; width:100%; aspect-ratio:16/10; object-fit:cover}
.gfig.tall{grid-row:span 2}
.gfig.tall img{aspect-ratio:16/21}
.gfig.wide{grid-column:span 2}
.gfig.wide img{aspect-ratio:32/10}
.gfig figcaption{
  position:absolute; left:0; right:0; bottom:0; padding:26px 14px 11px; font-size:13px; color:#fff;
  background:linear-gradient(180deg,transparent,rgba(6,9,15,.86));
}

/* --- split sections ----------------------------------------------------- */
.split{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(24px,3.4vw,52px); align-items:center}
.split>*{min-width:0}
.split.wide-text{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr)}
.split-figure{margin:0; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line)}
.split-figure img{display:block; width:100%; aspect-ratio:4/3; object-fit:cover}
.on-paper .split-figure{border-color:var(--rule)}
.split.flip .split-figure{order:-1}
.split-stack{display:grid; gap:14px}
.split-stack .split-figure img{aspect-ratio:16/9}

/* --- fact tiles --------------------------------------------------------- */
.facts{display:grid; gap:14px}
.facts-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.facts-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.facts>*{min-width:0}
.facttile{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius-sm); padding:20px 18px}
.on-paper .facttile{background:var(--card); border-color:var(--rule); color:var(--body)}
.facttile b{display:block; font-family:var(--mono); font-size:26px; font-weight:500; color:var(--accent); margin-bottom:6px; letter-spacing:-.02em}
.facttile h4{margin:0 0 5px; font-size:16px}
.facttile p{margin:0; font-size:14.5px; color:var(--on-dark-soft)}
.on-paper .facttile p{color:var(--body)}

/* --- tables ------------------------------------------------------------- */
.table-scroll{overflow-x:auto; margin:0 0 14px; -webkit-overflow-scrolling:touch}
.data-table{width:100%; border-collapse:collapse; font-size:15px; min-width:560px; background:var(--card); color:var(--body)}
.data-table caption{caption-side:top; text-align:left; font-family:var(--display); font-weight:600; font-size:16px; color:var(--ink); padding:0 0 10px}
.data-table th,.data-table td{padding:12px 14px; border-bottom:1px solid var(--rule-soft); text-align:left; vertical-align:top}
.data-table thead th{background:var(--paper-up); font-family:var(--display); font-size:13.5px; letter-spacing:.02em; color:var(--ink); border-bottom:1px solid var(--rule)}
.data-table tbody th{font-weight:600; color:var(--ink); font-family:var(--text)}
.data-table td.is-num{font-family:var(--mono); font-size:14px; white-space:nowrap}
.data-table .ours{background:var(--brand-pale)}
.data-table thead th.ours{background:var(--brand); color:#fff}
.tablenote{font-size:13.5px; color:var(--soft); margin:0 0 4px}
.on-panel .data-table,.page-section:not(.on-paper) .data-table{background:var(--panel); color:var(--on-dark-soft)}
.page-section:not(.on-paper) .data-table caption{color:var(--on-dark)}
.page-section:not(.on-paper) .data-table th,.page-section:not(.on-paper) .data-table td{border-bottom-color:var(--line)}
.page-section:not(.on-paper) .data-table thead th{background:var(--panel-up); color:var(--on-dark); border-bottom-color:var(--line)}
.page-section:not(.on-paper) .data-table tbody th{color:var(--on-dark)}
.page-section:not(.on-paper) .data-table .ours{background:#B85D1433}
.page-section:not(.on-paper) .data-table thead th.ours{background:var(--brand); color:#fff}
.page-section:not(.on-paper) .tablenote{color:var(--on-dark-soft)}

/* --- reviews ------------------------------------------------------------ */
.revgrid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gap)}
.revgrid>*{min-width:0}
.revcard{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:22px 20px; display:flex; flex-direction:column; gap:10px; color:var(--on-dark-soft)}
.revcard h4{margin:0; font-size:16.5px; color:var(--on-dark)}
.revcard p{margin:0; font-size:15px}
.revcard .rev-meta{margin-top:auto; font-size:13px; color:var(--on-dark-soft); border-top:1px solid var(--line); padding-top:11px}
.revcard .rev-meta b{color:var(--on-dark); font-weight:600}
.rstars{display:inline-flex; gap:2px}
.rstars svg{width:15px;height:15px;fill:var(--gold)}
.rstars svg.off{fill:rgba(255,255,255,.16)}
.on-paper .rstars svg.off{fill:var(--rule)}

/* --- journal cards ------------------------------------------------------ */
.jgrid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gap)}
.jgrid>*{min-width:0}
.jcard{display:flex; flex-direction:column; background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; text-decoration:none; color:var(--on-dark-soft); transition:transform .16s ease, border-color .16s ease}
.jcard:hover{transform:translateY(-3px); border-color:var(--brand-bright)}
.jcard img{display:block; width:100%; aspect-ratio:16/9; object-fit:cover}
.jcard-body{padding:20px 19px 22px; display:flex; flex-direction:column; gap:9px; flex:1}
.jcard h3{margin:0; font-size:19px; color:var(--on-dark)}
.jcard p{margin:0; font-size:14.5px; flex:1}
.jcard-meta{font-family:var(--mono); font-size:12px; letter-spacing:.06em; color:var(--brand-bright)}
.jcard-more{font-family:var(--display); font-weight:600; font-size:14.5px; color:var(--on-dark); display:inline-flex; align-items:center; gap:7px}
.jcard-more svg{width:16px;height:16px;fill:none;stroke:currentColor}

/* --- brand story article on the home page ------------------------------- */
.brandpiece{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,320px); gap:clamp(24px,3.4vw,48px); align-items:start}
.brandpiece>*{min-width:0}
.brandpiece-body{font-size:17px}
.brandpiece-body h3{margin-top:1.5em; color:var(--ink)}
.brandpiece-body h3:first-child{margin-top:0}
.brandpiece-figure{margin:0; border-radius:var(--radius); overflow:hidden; border:1px solid var(--rule)}
.brandpiece-figure img{display:block; width:100%; aspect-ratio:3/4; object-fit:cover}
.brandpiece-figure figcaption{font-size:13px; color:var(--soft); padding:10px 12px; background:var(--card)}
.brandaside{display:grid; gap:16px; position:sticky; top:calc(var(--masthead-h) + 16px)}

/* --- callouts, quotes, disclaimers -------------------------------------- */
.callout{background:var(--panel); border:1px solid var(--line); border-left:3px solid var(--accent); border-radius:var(--radius-sm); padding:18px 20px; margin:0 0 1.3em; color:var(--on-dark-soft)}
.callout h4{margin:0 0 6px; font-size:16px; color:var(--on-dark)}
.callout p:last-child{margin-bottom:0}
.on-paper .callout{background:var(--paper-up); border-color:var(--rule); color:var(--body)}
.on-paper .callout h4{color:var(--ink)}
.pullquote{margin:1.6em 0; padding:0 0 0 22px; border-left:3px solid var(--accent); font-family:var(--display); font-weight:500; font-size:clamp(19px,2vw,24px); line-height:1.4; color:var(--ink)}
.pullquote footer{font-family:var(--text); font-weight:400; font-size:14.5px; color:var(--soft); margin-top:10px}
.disclaimer{background:var(--gold-pale); border:1px solid #C4922F55; border-radius:var(--radius-sm); padding:16px 18px; font-size:14.5px; color:var(--ink-soft); margin:0 0 1.4em}
.disclaimer b{color:var(--ink)}
.sources{background:var(--paper-up); border:1px solid var(--rule); border-radius:var(--radius-sm); padding:18px 20px; margin:2em 0 1.4em; font-size:14.5px; color:var(--body)}
.sources h3{font-size:17px; margin:0 0 8px; color:var(--ink)}
.sources ol{margin:0; padding-left:1.2em}
.sources li{margin:.5em 0}
.sources a{color:var(--brand-deep)}

/* --- article pages ------------------------------------------------------ */
.artwrap{background:var(--paper); color:var(--body)}
.arthero{background:var(--night-up); padding:clamp(30px,4vw,58px) 0 clamp(26px,3vw,44px)}
.arthero .kicker{font-family:var(--mono); font-size:12.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--brand-bright); margin:0 0 14px}
.arthero h1{max-width:20ch}
.arthero .dek{font-size:clamp(17px,1.5vw,20px); color:var(--on-dark-soft); max-width:60ch}
.artmeta{display:flex; flex-wrap:wrap; gap:18px; font-family:var(--mono); font-size:13px; color:var(--on-dark-soft); margin-top:20px}
.artcover{margin:0; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line)}
.artcover img{display:block; width:100%; aspect-ratio:21/9; object-fit:cover}
.artbody{max-width:760px; margin-inline:auto; padding:clamp(30px,4vw,56px) 0 clamp(34px,4vw,60px); font-size:17.5px; color:var(--body)}
.artbody h2{margin-top:1.7em; color:var(--ink); scroll-margin-top:calc(var(--masthead-h) + 18px)}
.artbody h3{margin-top:1.4em; color:var(--ink-soft)}
.artbody a{color:var(--brand-deep)}
.artbody .data-table{min-width:480px}
.artfig{margin:1.8em 0; border-radius:var(--radius-sm); overflow:hidden; background:var(--paper-up); border:1px solid var(--rule)}
.artfig img{display:block; width:100%; max-height:520px; object-fit:contain; background:var(--paper-up)}
.artfig figcaption{font-size:13.5px; color:var(--soft); padding:10px 14px}
.toc{background:var(--card); border:1px solid var(--rule); border-radius:var(--radius-sm); padding:18px 20px; margin:0 0 2em}
.toc h2{margin:0 0 8px!important; font-size:16px}
.toc ol{margin:0; padding-left:1.2em; font-size:15px}
.toc a{color:var(--ink-soft); text-decoration:none; border-bottom:1px solid var(--rule)}
.toc a:hover{color:var(--brand-deep)}
.inline-buy{
  display:grid; grid-template-columns:120px minmax(0,1fr); gap:18px; align-items:center;
  background:var(--card); border:1px solid var(--rule); border-radius:var(--radius-sm); padding:16px; margin:1.8em 0;
}
.inline-buy>*{min-width:0}
.inline-buy img.pshot{display:block; width:100%; aspect-ratio:1/1; object-fit:contain; background:var(--paper-up); border-radius:10px}
.inline-buy h4{margin:0 0 4px; font-size:17px; color:var(--ink)}
.inline-buy p{margin:0 0 10px; font-size:14.5px}
.inline-buy .ib-foot{display:flex; flex-wrap:wrap; align-items:center; gap:12px}
.related{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:2em 0 0}
.related>*{min-width:0}
.related a{display:block; background:var(--card); border:1px solid var(--rule); border-radius:var(--radius-sm); padding:16px 18px; text-decoration:none; color:var(--ink)}
.related a:hover{border-color:var(--brand)}
.related span{display:block; font-family:var(--mono); font-size:11.5px; letter-spacing:.08em; color:var(--brand-deep); margin-bottom:5px}
.faqlist{margin:1.6em 0 0}
.faqitem{border-top:1px solid var(--rule); padding:16px 0}
.faqitem h3{margin:0 0 6px; font-size:18px}
.faqitem p:last-child{margin-bottom:0}

/* --- brand link in prose ------------------------------------------------ */
.bl{color:var(--brand-deep); text-decoration:none; border-bottom:1px solid #E07A2855}
.bl:hover{border-bottom-color:var(--brand)}
.page-section:not(.on-paper) .bl,.arthero .bl{color:var(--brand-bright); border-bottom-color:#FF9F4555}

/* --- breadcrumbs, simple pages ------------------------------------------ */
.crumbs{font-size:13.5px; color:var(--on-dark-soft); padding:16px 0 0}
.crumbs a{color:var(--on-dark-soft)}
.crumbs a:hover{color:var(--brand-bright)}
.page-block{padding:clamp(26px,3.4vw,44px) 0 clamp(40px,5vw,72px)}
.page-block h1{margin-bottom:.5em}
.page-block h2{margin-top:1.6em; font-size:clamp(22px,2.4vw,29px)}
.page-block a{color:var(--brand-bright)}

/* --- shelf (category) pages --------------------------------------------- */
.shelfhead{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.9fr); gap:clamp(22px,3vw,44px); align-items:stretch; padding:clamp(26px,3.4vw,44px) 0 clamp(28px,3.4vw,46px)}
.shelfhead>*{min-width:0}
.shelfhead-figure{margin:0; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line)}
.shelfhead-figure img{display:block; width:100%; height:100%; min-height:240px; object-fit:cover}
.shelfhead-text{display:flex; flex-direction:column; justify-content:center; gap:14px}
.shelfnav{display:flex; flex-wrap:wrap; gap:9px; margin:0 0 clamp(22px,2.6vw,32px)}
.shelfnav a{font-family:var(--display); font-weight:500; font-size:14px; text-decoration:none; color:var(--on-dark-soft); border:1px solid var(--line); border-radius:999px; padding:9px 15px}
.shelfnav a:hover,.shelfnav a[aria-current="page"]{color:var(--night); background:var(--brand-bright); border-color:var(--brand-bright)}

/* --- closing band ------------------------------------------------------- */
.closeband{background:linear-gradient(135deg,#B85D14 0%, #E07A28 58%, #FF9F45 100%); color:#fff}
.closeband .content-wrap{padding:clamp(38px,4.6vw,64px) 0; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,auto); gap:clamp(20px,3vw,44px); align-items:center}
.closeband h2{color:#fff; margin-bottom:.35em}
.closeband p{margin:0; color:rgba(255,255,255,.9)}
.closeband .cb-acts{display:flex; flex-wrap:wrap; gap:12px; justify-content:flex-end; align-items:center}
.closeband .btn-buy{background:#0A0E16; color:#fff; box-shadow:0 12px 30px -16px rgba(0,0,0,.9)}
.closeband .btn-buy:hover{background:#111726}
.closeband .btn-line{border-color:rgba(255,255,255,.6); color:#fff}

/* --- footer ------------------------------------------------------------- */
.footer{background:#0A0E16; border-top:1px solid var(--line); padding:clamp(38px,4.4vw,62px) 0 26px; color:var(--on-dark-soft); font-size:15px}
.footcols{display:grid; grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr)); gap:clamp(22px,3vw,44px)}
.footcols>*{min-width:0}
.footbrand p{font-size:14.5px; max-width:46ch}
.footer h4{font-family:var(--display); font-size:13px; letter-spacing:.14em; text-transform:uppercase; color:var(--on-dark); margin:0 0 12px}
.footer ul{list-style:none; margin:0; padding:0}
.footer li{margin:.42em 0}
.footer a{color:var(--on-dark-soft); text-decoration:none}
.footer a:hover{color:var(--brand-bright)}
.social{display:flex; gap:10px; margin:16px 0 14px}
.social a{display:inline-flex; width:34px; height:34px; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:50%}
.social img{width:19px;height:19px}
.pays{display:flex; flex-wrap:wrap; gap:7px}
.pays img{height:24px; width:auto; opacity:.9}
.footbase{display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; border-top:1px solid var(--line); margin-top:30px; padding-top:18px; font-size:14px}
.footbase p{margin:0}
.disclosure{display:flex; align-items:center; gap:9px; margin:14px 0 0; font-size:13.5px; color:var(--on-dark-soft)}
.disclosure img.dsc{display:block; width:auto}

/* --- sticky buy bar ----------------------------------------------------- */
.buybar{
  position:fixed; left:0; right:0; bottom:0; z-index:55; transform:translateY(105%);
  display:flex; align-items:center; gap:16px; padding:11px clamp(14px,3vw,28px);
  background:#0A0E16f5; border-top:1px solid var(--line); backdrop-filter:blur(10px);
  transition:transform .22s ease;
}
body.baron .buybar{transform:translateY(0)}
.bb-note{font-family:var(--mono); font-size:13px; color:var(--on-dark-soft); white-space:nowrap}
.bb-chips{display:flex; gap:8px; overflow-x:auto; flex:1; min-width:0}
.bb-chips a{font-size:13px; text-decoration:none; color:var(--on-dark); border:1px solid var(--line); border-radius:999px; padding:6px 12px; white-space:nowrap}
.bb-chips a:hover{border-color:var(--brand-bright); color:var(--brand-bright)}
.buybar .btn{flex:0 0 auto}

/* --- 404 ---------------------------------------------------------------- */
.notfound{text-align:center; padding:clamp(50px,7vw,110px) 0}
.notfound .nf-code{font-family:var(--mono); font-size:clamp(56px,10vw,120px); color:var(--brand-bright); line-height:1; margin:0 0 14px}
.notfound p{color:var(--on-dark-soft); max-width:52ch; margin-inline:auto}
.notfound .nf-acts{display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin-top:26px}

/* --- responsive --------------------------------------------------------- */
@media (max-width:1180px){
  .pgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .linerail-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .footcols{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:1024px){
  .mainnav{
    display:none; position:absolute; left:0; right:0; top:100%; flex-direction:column; gap:0;
    background:var(--night-up); border-bottom:1px solid var(--line); padding:8px 0;
  }
  .mainnav.open{display:flex}
  .mainnav a{padding:12px clamp(18px,4vw,30px); border-bottom:0}
  .masthead-inner{position:relative}
  .masthead .nav-toggle{display:inline-flex}
  .headclock{display:none}
  .brandpiece{grid-template-columns:minmax(0,1fr)}
  .brandaside{position:static; grid-template-columns:repeat(2,minmax(0,1fr))}
  .revgrid,.jgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .facts-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gallery-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .closeband .content-wrap{grid-template-columns:minmax(0,1fr)}
  .closeband .cb-acts{justify-content:flex-start}
}
@media (max-width:860px){
  .hero-inner{grid-template-columns:minmax(0,1fr)}
  .hero-figure{min-height:0}
  .hero-figure img{aspect-ratio:16/10}
  .hourhead{grid-template-columns:minmax(0,1fr)}
  .split,.split.wide-text{grid-template-columns:minmax(0,1fr)}
  .split.flip .split-figure{order:0}
  .leadcard{grid-template-columns:minmax(0,1fr)}
  .shelfhead{grid-template-columns:minmax(0,1fr)}
  .shelfhead-figure img{min-height:0; aspect-ratio:16/9}
  .trustrow{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pgrid,.pgrid.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .utility .content-wrap span:first-child{display:none}
  .bb-note{display:none}
}
@media (max-width:640px){
  body{font-size:16.5px}
  .masthead-inner{gap:10px; padding:11px 0}
  .brandmark{gap:8px}
  .brandmark-tile{width:34px;height:34px;border-radius:9px}
  .brandmark-word{font-size:19px}
  .brandmark-sub{display:none}
  .head-cta{gap:7px}
  .head-cta .btn-sm{padding:9px 12px; font-size:13.5px}
  .cta-long{display:none}
  .cta-short{display:inline}
  .gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gfig.wide{grid-column:span 2}
.gfig.wide img{aspect-ratio:32/10}
  .gfig.tall{grid-row:span 1}
  .gfig.tall img{aspect-ratio:16/10}
  .gfig.wide img{aspect-ratio:16/10}
  .revgrid,.jgrid{grid-template-columns:minmax(0,1fr)}
  .facts-3,.facts-4{grid-template-columns:minmax(0,1fr)}
  .linerail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footcols{grid-template-columns:minmax(0,1fr)}
  .brandaside{grid-template-columns:minmax(0,1fr)}
  .related{grid-template-columns:minmax(0,1fr)}
  .inline-buy{grid-template-columns:minmax(0,1fr)}
  .inline-buy img.pshot{max-width:180px}
  .hero-stamp{position:static; margin:0; border-radius:0; border-left:0; border-right:0; border-bottom:0}
  .hero-acts .btn{width:100%}
  .disclosure{flex-wrap:wrap}
  .disclosure img.dsc{max-width:100%; height:auto!important}
  .buybar{gap:10px}
  .buybar .btn{padding:11px 14px}
}
@media (max-width:430px){
  .pgrid,.pgrid.cols-3,.pgrid.cols-2{grid-template-columns:minmax(0,1fr)}
  .trustrow{grid-template-columns:minmax(0,1fr)}
  .linerail-grid{grid-template-columns:minmax(0,1fr)}
}
@media (min-width:1700px){
  :root{--wrap:var(--wrap-wide)}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important; animation:none!important; scroll-behavior:auto!important}
}
