/* brand page – light theme (7 Oct); the hero visual lives in hero-stage.css */
.bh{position:relative;min-height:min(100vh,1000px);min-height:min(100svh,1000px);padding:calc(var(--nav) + 36px) 0 90px;overflow-x:clip}
.bh .phero__bg::before{width:900px;height:900px;left:-320px;top:-340px}
.bh__aura{position:absolute;right:-10%;top:8%;width:62vw;max-width:900px;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(245,132,31,.1),rgba(47,123,224,.07) 55%,rgba(93,71,214,.03) 80%,transparent);opacity:.8;pointer-events:none}   /* gradient only – no blur filter */
@keyframes aura{to{transform:rotate(360deg)}}
.bh__in{position:relative}
.bh__word{position:relative;z-index:3;margin:2px 0 .12em -.045em;font-size:min(236px,calc((100vw - 2 * var(--gut)) / (var(--len) * .6)));line-height:.9;letter-spacing:-.06em;font-weight:800;white-space:nowrap;pointer-events:none}
.bh__letters{display:inline-block;will-change:transform}
/* dark navy gradient letters – readable to the bottom of each glyph on the white page */
.bh__letters span{display:inline-block;padding-bottom:.06em;background:linear-gradient(180deg,var(--text) 18%,#2a3a5c 58%,#5a6b8e 100%);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:0;transform:translateY(-.22em) rotateX(40deg)}
.bh__word.is-on .bh__letters span{animation:letIn 1.1s var(--ease) both;animation-delay:calc(var(--k) * 55ms + 80ms)}
@keyframes letIn{to{opacity:1;transform:none}}
.bh__grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.92fr);gap:32px;align-items:start;margin-top:26px}
.bh__copy{position:relative;z-index:3;max-width:620px}
.bh__copy .lead{color:var(--muted)}
/* the stage (owner, 7 Oct: real photos, no 3D – hero-stage.css .hs): the brand's banner composition or a model's cut-out on the
   light studio floor; a fixed-height column on desktop, its own aspect ratio (--ar from page-brand.js) on phones */
.bh__stage{position:relative;z-index:2;height:auto;aspect-ratio:var(--ar,1);max-height:min(64vh,620px);margin-top:0}
/* caption of a cut-out: the model and its part number, a link to the model page */
.bh__cap{position:absolute;left:50%;bottom:0;z-index:4;display:flex;align-items:center;gap:10px;max-width:calc(100% - 20px);padding:8px 8px 8px 16px;border-radius:999px;background:var(--surface-solid);border:1px solid var(--line);box-shadow:0 18px 40px -20px rgba(var(--ink-rgb),.4);font-size:13px;white-space:nowrap;transform:translateX(-50%);pointer-events:auto;transition:border-color .25s,box-shadow .25s}
.bh__cap:hover{border-color:rgba(245,132,31,.55);box-shadow:0 18px 40px -16px rgba(var(--ink-rgb),.5)}
.bh__cap-m{font-weight:700;overflow:hidden;text-overflow:ellipsis}
.bh__cap-c{color:var(--orange2);font-size:12px;font-weight:700;overflow:hidden;text-overflow:ellipsis}
.bh__cap-go{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--orange);color:#1b0d00;font-weight:800}
.bh--flat .bh__grid{grid-template-columns:1fr}
/* two counts (owner, 7 Oct): part numbers · models – no display-module count, no year range, no Service Pack share bar */
.bstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin:30px 0 0;max-width:420px}
.bstat{min-width:0;display:flex;flex-direction:column-reverse;gap:2px;padding:15px 16px;border-radius:16px;background:var(--surface-solid);border:1px solid var(--line);box-shadow:0 10px 24px -18px rgba(var(--ink-rgb),.2)}
.bstat dd{margin:0;font-variant-numeric:tabular-nums;font-size:clamp(22px,1.9vw,28px);white-space:nowrap;font-weight:800;letter-spacing:-.03em;line-height:1.1;color:var(--text)}
.bstat dt{font-size:13px;color:var(--muted)}
.bh__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.bh__cue{position:absolute;left:50%;bottom:22px;width:26px;height:42px;margin-left:-13px;border-radius:14px;border:2px solid var(--line2)}
.bh__cue span{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--orange);animation:cue2 1.8s 5}
@keyframes cue2{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(14px)}}

/* explorer */
.xsec{padding-top:70px}
.xsec .sec-h{margin-bottom:22px}.xsec__lead{max-width:440px}
.xrecent{margin-bottom:22px}
.xbar{position:sticky;top:var(--nav);z-index:20;padding:12px 0;margin-bottom:8px;background:var(--surface);border-block:1px solid var(--line)}
.xbar__in{display:flex;align-items:center;gap:16px}
.xbar__cw{position:relative;flex:1;min-width:0;--fl:0px;--fr:0px}
.xbar__cw.has-l{--fl:56px}.xbar__cw.has-r{--fr:56px}
.xbar__chips{display:flex;gap:8px;min-width:0;overflow-x:auto;scrollbar-width:none;padding:2px;scroll-behavior:smooth;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 var(--fl),#000 calc(100% - var(--fr)),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 var(--fl),#000 calc(100% - var(--fr)),transparent 100%)}
.xbar__nav{position:absolute;top:50%;z-index:2;display:grid;place-items:center;width:32px;height:32px;margin-top:-16px;border-radius:50%;border:1px solid var(--line2);background:var(--surface-solid);color:var(--text);opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s,background .2s}
.xbar__nav svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.xbar__nav:hover{background:var(--orange);color:#1b0d00}
.xbar__nav--l{left:0}.xbar__nav--r{right:0}
.xbar__cw.has-l .xbar__nav--l,.xbar__cw.has-r .xbar__nav--r{opacity:1;visibility:visible}
.xbar__chips::-webkit-scrollbar{display:none}
.xchip{flex:none;border-color:var(--line);background:var(--surface-solid);font-weight:600;padding:8px 8px 8px 14px;gap:8px;transition:border-color .2s,background .2s,color .2s,transform .2s}
.xchip:active{transform:scale(.97)}
.xchip[aria-pressed="true"]{background:linear-gradient(135deg,var(--orange),#ff9d3f);color:#1b0d00;border-color:transparent}
.xchip__n{min-width:22px;padding:2px 7px;border-radius:999px;background:var(--card2);font-size:11.5px;font-weight:700;text-align:center;color:var(--muted)}
.xchip[aria-pressed="true"] .xchip__n{background:rgba(0,0,0,.14);color:#1b0d00}
.xbar__sep{flex:none;width:1px;margin:4px 4px;background:var(--line2)}
.xbar__tools{display:flex;gap:10px;flex:none}
.xsearch{position:relative;display:block}
.xsearch svg{position:absolute;left:14px;top:50%;width:17px;height:17px;margin-top:-8.5px;fill:none;stroke:var(--muted);stroke-width:2;pointer-events:none}
.xsearch input{width:250px;height:42px;padding:0 14px 0 40px;border-radius:999px;border:1px solid var(--line);background:var(--surface-solid);color:var(--text);font:500 14px Inter,sans-serif;outline:none;transition:border-color .2s,box-shadow .2s,width .35s var(--ease)}
.xsearch input:focus{border-color:rgba(245,132,31,.6);box-shadow:0 0 0 4px rgba(245,132,31,.12);width:300px}
.xsearch input::placeholder{color:var(--dim)}
.xsort .select{min-height:42px;height:42px;padding:0 38px 0 16px;border-radius:999px;font-size:14px;width:auto}
.xmeta{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin:18px 0 18px}
.xcount{font-size:14px;color:var(--muted)}.xcount b{color:var(--text)}
.xmore{display:flex;justify-content:center;margin-top:34px}
.xmore[hidden],.xmore .btn[hidden]{display:none}

/* ("Most complete models" showcase removed 7 Oct – rings / chips tired the eye) */

/* part types – one tile = icon, part type, "N parts" (owner, 7 Oct) */
.tgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.tt{position:relative;display:flex;flex-direction:column;gap:4px;min-height:150px;padding:20px;border-radius:22px;background:var(--surface-solid);border:1px solid var(--line);overflow:hidden;transition:transform .4s var(--ease),border-color .3s,box-shadow .4s}
.tt::before{content:"";position:absolute;inset:auto -30% -60% auto;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--c) 14%,transparent),transparent 65%);opacity:.6;transition:opacity .4s,transform .6s var(--ease)}
.tt:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--c) 55%,transparent);box-shadow:0 30px 50px -36px rgba(var(--ink-rgb),.35)}
.tt:hover::before{opacity:1;transform:scale(1.15)}
.tt__ico{position:relative;display:grid;place-items:center;width:52px;height:52px;flex:none;border-radius:15px;background:radial-gradient(circle at 30% 20%,var(--ph1),var(--ph2) 75%);box-shadow:inset 0 0 0 1px rgba(var(--ink-rgb),.06)}
.tt__ico svg{width:32px}
.tt__b{position:relative;display:flex;flex-direction:column;gap:2px;margin-top:auto;padding-top:18px}.tt__b b{font-size:17px}.tt__b small{font-size:13px;color:var(--muted)}
.tt__go{position:absolute;right:16px;top:16px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--card2);color:var(--text);transition:transform .3s var(--ease),background .3s,color .3s}
.tt:hover .tt__go{transform:rotate(-45deg);background:var(--orange);color:#1b0d00}

/* other brands */
.ogrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px}
.ob{position:relative;display:flex;flex-direction:column;gap:2px;min-height:120px;padding:20px;border-radius:20px;background:var(--surface-solid);border:1px solid var(--line);overflow:hidden;transition:transform .35s var(--ease),border-color .3s,box-shadow .3s}
.ob::before{content:"";position:absolute;inset:0;background:radial-gradient(240px circle at var(--mx,50%) var(--my,0%),rgba(245,132,31,.1),transparent 60%);opacity:0;transition:opacity .3s}
.ob:hover{transform:translateY(-4px);border-color:rgba(245,132,31,.45);box-shadow:0 24px 40px -30px rgba(var(--ink-rgb),.3)}.ob:hover::before{opacity:1}
.ob b{position:relative;font-size:20px;letter-spacing:-.02em;margin-top:auto;padding-right:36px}.ob>span:not(.ob__big):not(.ob__go){position:relative;font-size:13px;color:var(--muted)}
.ob__big{position:absolute;left:14px;bottom:-16px;font-size:58px;font-weight:800;letter-spacing:-.05em;color:rgba(var(--ink-rgb),.035);pointer-events:none;white-space:nowrap;transform:translateY(8px)}
.ob__go{position:absolute;right:16px;top:16px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--card2);color:var(--text);transition:transform .3s,background .3s,color .3s}
.ob:hover .ob__go{transform:rotate(-45deg);background:var(--orange);color:#1b0d00}

@media (max-width:1100px){.xsearch input,.xsearch input:focus{width:200px}}
@media (max-width:900px){
  .bh{min-height:0;padding-bottom:60px}
  .bh__grid{grid-template-columns:1fr;gap:0;margin-top:0}
  /* the photo above the copy, nothing clipped: the row takes the image's own aspect ratio */
  .bh__stage{order:-1;height:auto;min-height:0;aspect-ratio:var(--ar,1);max-height:min(50svh,420px);margin:6px 0 0}
  .bh__copy{margin-top:8px}
  .bh__cue{display:none}
  .xbar__in{flex-direction:column;align-items:stretch;gap:10px}
  .xbar__tools{width:100%}.xsearch{flex:1}.xsearch input,.xsearch input:focus{width:100%}
}
@media (max-width:600px){
  .bh{padding-top:calc(var(--nav) + 20px)}
  .bh__word{letter-spacing:-.055em}
  .bh__cap{font-size:12px}.bh__cap-c{display:none}
  .bstats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bstat{padding:14px}
  .bh__cta .btn{flex:1 1 100%}
  .xbar{padding:10px 0}
  .xchip{padding:7px 7px 7px 12px;font-size:12.5px}
  .xsort .select{padding:0 32px 0 12px;font-size:13px}
  .tgrid{grid-template-columns:repeat(2,1fr);gap:10px}.tt{min-height:140px;padding:16px}.ogrid{grid-template-columns:repeat(2,1fr)}.ob{min-height:104px;padding:16px}.ob b{font-size:17px}
}
@media (prefers-reduced-motion:reduce){.bh__letters span{opacity:1;transform:none;filter:none}.bh__aura{animation:none}}
/* "Explore the series" slider (explore.css) – reserve its height so the page doesn't jump when it mounts */
#seriesX{min-height:487px}
@media (max-width:900px){#seriesX{min-height:467px}}
@media (max-width:600px){#seriesX{min-height:459px}}

/* ---------- 5 Oct: live category intro, crumbs, flat (no-WebGL) hero ---------- */
.bh__about{margin-top:22px;max-width:620px;font-size:14.5px;line-height:1.65;color:var(--muted)}
.bh__about[hidden]{display:none}
.bh__about p+p{margin-top:8px}
.bh__about .li-m{color:var(--text)}
.bh__ws a{color:var(--orange2);font-weight:600}
.bh .crumbs a{display:inline-block;padding:12px 0;margin:-12px 0}
@media (max-width:600px){.bh__about{font-size:14px;margin-top:18px}}
/* tighter rhythm between hero, series and explorer (audit: 150–200 px empty bands) */
.bh{padding-bottom:64px}
#series.section{padding-top:70px}
.xsec.section{padding-top:64px}
@media (max-width:900px){.bh{padding-bottom:36px}#series.section{padding-top:44px}.xsec.section{padding-top:44px}}
/* the gradient is clipped to each letter box: give descenders (g, y, p) room to paint, keep the line height, and keep a clear gap to the stage */
.bh__letters span{padding-bottom:.24em;margin-bottom:-.18em}
.bh__word{margin-bottom:.2em}
@media (max-width:600px){
  .xchip{min-height:40px}
  .xbar__nav{width:40px;height:40px;margin-top:-20px}
}
.xbar__chips{overflow-y:hidden}
.bh__stage[hidden],.bh__cap[hidden]{display:none!important}
.bstat{justify-content:flex-end}
/* no backdrop blur below the high tier (perf.js) – sticky bars go solid so content never shows through */
html:not([data-q="high"]) .xbar{background:var(--surface-solid)}
