/* EN LED Posters: brand B "Clean Light" (white / warm grey, editorial serif, vermilion accent).
   Single theme. Fonts self-hosted (OFL, see /assets/fonts/LICENSE-*). Line-diagram motifs from brand A,
   CSS poster mockup from brand C (home only). */
@font-face{font-family:"Literata";src:url(/assets/fonts/literata-latin-wght-normal.woff2) format("woff2");font-weight:200 900;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url(/assets/fonts/inter-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
:root{
  --bg:#fff;--bg-alt:#f5f3ef;--surface:#fff;--surface-2:#faf8f5;
  --ink:#14171c;--ink-2:#3d434d;--muted:#5f6672;--line:#e4e0d9;--line-2:#d2cdc3;
  --accent:#c93a08;--accent-hover:#a92f05;--accent-ink:#fff;--accent-soft:#fdeee8;--warn:#8a5200;
  --font-head:"Literata",Georgia,"Times New Roman",serif;
  --font-body:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --font-mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --r:12px;--r-sm:8px;--r-btn:999px;
  --shadow:0 1px 2px rgba(20,23,28,.05),0 8px 24px -8px rgba(20,23,28,.12);
  --slot-a:#f1eee8;--slot-b:#e6e1d8;--slot-ink:#7a7468;
  --maxw:1200px;--gut:clamp(18px,4vw,32px);--sec-y:clamp(44px,7vw,96px);color-scheme:light}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.62 var(--font-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{max-width:100%}
a{color:var(--accent);text-underline-offset:3px}a:hover{color:var(--accent-hover)}
a.pending{text-decoration-style:dotted;text-decoration-thickness:1px}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
h1,h2,h3,h4{font-family:var(--font-head);font-weight:500;letter-spacing:-.015em;line-height:1.12;margin:0 0 .5em;text-wrap:balance}
h1{font-size:clamp(2rem,1.2rem + 3.2vw,3.5rem)}h2{font-size:clamp(1.55rem,1.1rem + 1.7vw,2.3rem)}h3{font-size:clamp(1.1rem,1rem + .45vw,1.3rem);line-height:1.25}
p{margin:0 0 1em;text-wrap:pretty}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;background:var(--accent);color:#fff;padding:10px 16px;border-radius:var(--r-sm);z-index:100;font-weight:600}.skip:focus{top:12px}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gut)}.narrow{max-width:820px}
.sec{padding:var(--sec-y) 0}.sec.alt{background:var(--bg-alt);border-block:1px solid var(--line)}
.sec-head{max-width:760px;margin-bottom:clamp(20px,3vw,36px)}
.eyebrow{display:inline-flex;align-items:center;gap:.6em;font:500 .74rem/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:0 0 1em}
.eyebrow::before{content:"";width:18px;height:2px;background:currentColor}
.lead{font-size:clamp(1.04rem,1rem + .3vw,1.2rem);color:var(--ink-2);max-width:62ch}.lead p:last-child{margin-bottom:0}
.hint{display:block;font-size:.8rem;color:var(--muted);margin-top:5px}
.ph{color:var(--warn);font-family:var(--font-mono);font-size:.85em}
.todo-box{border:1px dashed var(--warn);color:var(--warn);background:#fff8ec;padding:10px 14px;border-radius:var(--r-sm);font-size:.9rem}
.todo-inline{color:var(--warn)}
.preview-bar{background:#14171c;color:#fff;font-size:.78rem;padding:6px var(--gut);text-align:center}
/* buttons / chips */
.btn{display:inline-flex;align-items:center;justify-content:center;font:600 .95rem/1 var(--font-body);padding:.95em 1.5em;border-radius:var(--r-btn);border:1.5px solid transparent;text-decoration:none;cursor:pointer;transition:background .15s,transform .15s;white-space:nowrap}
.btn-primary{background:var(--accent);color:var(--accent-ink)}.btn-primary:hover{background:var(--accent-hover);color:var(--accent-ink);transform:translateY(-1px)}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--line-2)}.btn-ghost:hover{border-color:var(--ink);color:var(--ink)}
.btn-sm{padding:.7em 1.15em;font-size:.88rem}.btn-lg{padding:1.05em 1.8em}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:1.2em 0 0;padding:0;list-style:none}
.chip{font:500 .78rem/1 var(--font-mono);padding:.6em .9em;border-radius:var(--r-btn);background:var(--surface);border:1px solid var(--line-2)}
.opt{display:inline-block;font:600 .66rem/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;padding:.4em .65em;border-radius:var(--r-btn);background:var(--accent-soft);color:var(--accent)}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin:1.6em 0 0}
/* header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--line)}
.hdr{display:flex;align-items:center;gap:22px;height:68px}
.logo{display:inline-flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;flex:none}.logo:hover{color:var(--ink)}
.logo-mark{width:30px;height:30px;fill:var(--ink)}
.logo-word{display:flex;flex-direction:column;font:700 1.1rem/1 var(--font-body);letter-spacing:.14em}
.logo-word small{font:500 .5rem/1 var(--font-mono);letter-spacing:.28em;margin-top:5px;color:var(--muted)}
.nav{margin-left:auto}.nav ul{display:flex;gap:2px;margin:0;padding:0;list-style:none}
.nav a:not(.btn){display:block;padding:.6em .8em;color:var(--ink-2);text-decoration:none;font-weight:500;font-size:.92rem;border-radius:var(--r-sm)}
.nav a:not(.btn):hover,.nav a[aria-current]{color:var(--ink);background:var(--accent-soft)}
.nav a.pending{text-decoration:underline dotted;text-underline-offset:4px}
.nav-toggle{display:none;margin-left:auto;background:transparent;border:1px solid var(--line-2);color:var(--ink);width:44px;height:44px;border-radius:var(--r-sm);cursor:pointer;align-items:center;justify-content:center}
@media (max-width:1100px){
  .nav-toggle{display:inline-flex}.hdr-cta{display:none}
  .nav{position:absolute;left:0;right:0;top:100%;background:var(--bg);border-bottom:1px solid var(--line);padding:10px var(--gut) 20px;display:none;margin:0;box-shadow:var(--shadow)}
  .nav.open{display:block}.nav ul{flex-direction:column}
  .nav a:not(.btn){padding:.9em .4em;font-size:1rem;border-bottom:1px solid var(--line);border-radius:0}.nav .btn{display:flex;margin-top:14px}}
@media (min-width:1101px){.nav .nav-cta{display:none}}
.crumbs{font:500 .8rem/1.4 var(--font-mono);color:var(--muted);padding:18px 0 0}
.crumbs ol{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}.crumbs li+li::before{content:"/";margin-right:6px;opacity:.5}
.crumbs a{color:var(--muted);text-decoration:none}.crumbs a:hover{color:var(--ink)}
/* hero */
.hero{background:linear-gradient(180deg,#faf8f5,#fff);padding:0 0 clamp(36px,5vw,72px);border-bottom:1px solid var(--line)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:center;padding-top:clamp(20px,3vw,36px)}
.hero-page .hero-text h1{font-size:clamp(1.9rem,1.2rem + 2.6vw,3.1rem)}
.hero-side>*:last-child{margin-bottom:0}
.hero-home{padding-top:clamp(28px,4vw,56px)}
@media (max-width:900px){.hero-grid{grid-template-columns:minmax(0,1fr)}}
/* image slot placeholders */
.slot{margin:1.4em 0}
.slot-box{position:relative;aspect-ratio:4/3;border-radius:var(--r);border:1px dashed var(--line-2);background:radial-gradient(120% 90% at 30% 20%,var(--slot-a),var(--slot-b));color:var(--slot-ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:14px;text-align:center;overflow:hidden}
.slot.wide .slot-box{aspect-ratio:16/9}
.slot-art{width:auto;height:min(44%,150px);aspect-ratio:1/2;opacity:.85}
.slot-id{font:600 .74rem/1 var(--font-mono);color:var(--accent);letter-spacing:.06em}
.slot-alt{font-size:.74rem;max-width:46ch;line-height:1.35}
.badge{position:absolute;top:10px;right:10px;font:600 .62rem/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;padding:.5em .75em;border-radius:var(--r-btn);border:1px solid currentColor;background:rgba(255,255,255,.7);color:var(--warn)}
.slot figcaption{font-size:.85rem;color:var(--muted);padding-top:8px}
.hero-side .slot{margin:0}
/* poster mockup (CSS only) */
.hero-device{display:grid;place-items:center;position:relative}
.mock-note{font-size:.76rem;color:var(--muted);margin:14px 0 0;text-align:center}
.pdev{--u:calc(var(--dw)/100);width:var(--dw);display:flex;flex-direction:column;align-items:center;margin-inline:auto}
.pdev-frame{width:100%;background:linear-gradient(145deg,#2a2c35,#0d0e12 40%,#1c1e26);padding:calc(var(--u)*2.2);border-radius:calc(var(--u)*2.4);box-shadow:0 calc(var(--u)*16) calc(var(--u)*30) calc(var(--u)*-8) rgba(0,0,0,.45)}
.pdev-screen{position:relative;aspect-ratio:1/3;background:#05060a;overflow:hidden;border-radius:calc(var(--u)*.8)}
.slide{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:6%;padding:12%;opacity:0;animation:slides 12s infinite;color:#fff;font-family:var(--font-head)}
.slide span{font:500 calc(var(--dw)*.07)/1 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;opacity:.85}
.slide b{font-size:calc(var(--dw)*.26);line-height:1;font-weight:600}
.slide i{display:block;height:calc(var(--dw)*.03);width:40%;background:#fff;opacity:.9}
.s1{background:#c93a08;animation-delay:0s;opacity:1}.s2{background:#14171c;animation-delay:4s}.s3{background:#2c5a8a;animation-delay:8s}
@keyframes slides{0%{opacity:0}4%{opacity:1}30%{opacity:1}34%{opacity:0}100%{opacity:0}}
.pdev-dots{position:absolute;inset:0;background:radial-gradient(circle,transparent 0 40%,rgba(0,0,0,.55) 65%);background-size:calc(var(--dw)/34) calc(var(--dw)/34);mix-blend-mode:multiply}
.pdev-glare{position:absolute;inset:0;background:linear-gradient(112deg,rgba(255,255,255,.16),transparent 34%,transparent 70%,rgba(255,255,255,.05))}
.pdev-neck{width:36%;height:calc(var(--u)*7);background:linear-gradient(90deg,#15161b,#2b2d36 50%,#15161b)}
.pdev-base{position:relative;width:calc(100% + var(--u)*22);height:calc(var(--u)*4);background:linear-gradient(180deg,#2c2e38,#101116);border-radius:calc(var(--u)*1.2)}
.pdev-base b{position:absolute;top:100%;width:calc(var(--u)*4.2);height:calc(var(--u)*4.2);background:radial-gradient(circle,#777 0 16%,#1a1b21 18%);border-radius:50%}
.pdev-base b:nth-child(1){left:8%}.pdev-base b:nth-child(2){left:30%}.pdev-base b:nth-child(3){right:30%}.pdev-base b:nth-child(4){right:8%}
@media (prefers-reduced-motion:reduce){.slide{animation:none}.s2,.s3{display:none}html{scroll-behavior:auto}}
/* prose (markdown output) */
.body>*,.prose>*{max-width:none}
.prose{min-width:0;max-width:78ch}.prose-wide,.home-body{padding:var(--sec-y) 0 0}
.prose h2{margin-top:1.8em;padding-top:.2em}.prose h2:first-child{margin-top:0}.prose h3{margin-top:1.4em}
.prose ul,.prose ol{padding-left:1.3em}.prose li{margin:.3em 0}
.prose p,.prose li{color:var(--ink-2)}.prose strong{color:var(--ink)}
.home-body,.prose-wide{max-width:var(--maxw);margin:0 auto;padding-left:var(--gut);padding-right:var(--gut);padding-bottom:var(--sec-y)}
.home-body>h2,.prose-wide>h2{margin-top:1.6em}.home-body>p,.home-body>ul,.prose-wide>p,.prose-wide>ul{max-width:78ch;color:var(--ink-2)}
.layout-doc{display:grid;grid-template-columns:230px minmax(0,1fr);gap:clamp(24px,4vw,56px);padding-top:var(--sec-y);padding-bottom:var(--sec-y);align-items:start}
.layout-doc:not(:has(.toc)){grid-template-columns:minmax(0,1fr)}
@media (max-width:960px){.layout-doc{grid-template-columns:1fr}}
.toc{position:sticky;top:92px;font-size:.88rem;border-left:2px solid var(--line);padding-left:16px}
.toc-h{font:600 .7rem/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.toc ol{list-style:none;margin:0;padding:0;display:grid;gap:8px}.toc a{color:var(--ink-2);text-decoration:none}.toc a:hover{color:var(--accent)}
@media (max-width:960px){.toc{position:static}}
/* tables */
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);box-shadow:var(--shadow);margin:1.2em 0}
table{width:100%;border-collapse:collapse;font-size:.92rem}
caption{text-align:left;padding:14px 18px;font:600 .72rem/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--accent);border-bottom:1px solid var(--line);background:var(--surface-2)}
th,td{text-align:left;padding:11px 16px;vertical-align:top;border-bottom:1px solid var(--line)}
tr:last-child>*{border-bottom:0}
thead th{font:600 .7rem/1.2 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:var(--surface-2);white-space:nowrap}
tbody th{font-weight:500;color:var(--ink-2);width:38%}
td{font-variant-numeric:tabular-nums}tbody tr:hover>*{background:var(--accent-soft)}
.spec-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(20px,3vw,40px);align-items:start}
.spec-sec .tbl-wrap{margin:0}
@media (max-width:900px){.spec-grid{grid-template-columns:1fr}}
.side-card{background:var(--bg-alt);border:1px solid var(--line);border-radius:var(--r);padding:clamp(18px,2.4vw,28px)}
.side-card h2,.side-card h3{font-size:1.3rem}
/* cards */
.grid{display:grid;gap:clamp(14px,2vw,24px)}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1000px){.g3{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:640px){.g3{grid-template-columns:1fr}}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:clamp(18px,2.2vw,26px);box-shadow:var(--shadow);display:flex;flex-direction:column}
.card h3 a{color:var(--ink);text-decoration:none}.card h3 a:hover{color:var(--accent)}
.card .eyebrow{margin-bottom:.8em}.card .more{margin:auto 0 0}
.mini{display:grid;gap:6px;margin:0 0 1em;font-size:.84rem}.mini div{display:flex;gap:10px;border-top:1px solid var(--line);padding-top:6px}.mini dt{color:var(--muted);min-width:5.5em}.mini dd{margin:0}
/* process steps (how to order) */
.process ol{list-style:none;counter-reset:step;padding:0;display:grid;gap:12px}
.process ol>li{counter-increment:step;position:relative;padding:18px 20px 18px 74px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
.process ol>li::before{content:counter(step);position:absolute;left:18px;top:12px;font:500 2rem/1 var(--font-head);color:var(--accent)}
/* FAQ */
.faq{display:grid;gap:10px;max-width:880px}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}.faq details[open]{border-color:var(--line-2);box-shadow:var(--shadow)}
.faq summary{list-style:none;cursor:pointer;padding:16px 20px;font-weight:600;display:flex;gap:16px;align-items:center;justify-content:space-between}
.faq summary::-webkit-details-marker{display:none}.faq summary .ico{flex:none;color:var(--accent);transition:transform .2s}.faq details[open] .ico{transform:rotate(180deg)}
.faq .ans{padding:0 20px 18px;color:var(--ink-2);max-width:70ch}.faq .ans p:last-child{margin:0}
/* RFQ */
.rfq-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:clamp(20px,3vw,40px);align-items:start}
@media (max-width:900px){.rfq-grid{grid-template-columns:1fr}}
.rfq-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:clamp(18px,3vw,36px);box-shadow:var(--shadow)}
.rfq-form>h2,.rfq-form>p,.rfq-summary,.full{grid-column:1/-1}
@media (max-width:560px){.rfq-form{grid-template-columns:1fr}}
.field{border:0;padding:0;margin:0;min-width:0}
.field label,.field legend{display:block;font:600 .82rem/1.2 var(--font-body);margin-bottom:7px;padding:0}
.req{font:500 .66rem var(--font-mono);color:var(--accent);margin-left:.4em;text-transform:uppercase}
.field input[type=text],.field input[type=number],.field select,.field textarea,.field input[type=file]{width:100%;font:400 .96rem/1.3 var(--font-body);color:var(--ink);background:var(--bg);border:1.5px solid var(--line-2);border-radius:var(--r-sm);padding:.75em .9em}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.field [aria-invalid=true]{border-color:#b00020}
.checks{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px 16px}.checks label{font-weight:400;display:flex;gap:8px;margin:0}
.rfq-summary{background:var(--accent-soft);border-radius:var(--r-sm);padding:12px 16px}.rfq-summary h3{font-size:1rem;margin-bottom:.4em}
.rfq-summary dl{display:grid;grid-template-columns:auto 1fr;gap:2px 14px;margin:0;font-size:.9rem}.rfq-summary dt{color:var(--muted)}.rfq-summary dd{margin:0;font-weight:600}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.rfq-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center}.rfq-status{margin:0;font-size:.92rem}
.contact{list-style:none;margin:0;padding:0;display:grid;gap:8px}
/* CTA band + footer */
.cta-band{background:var(--ink);color:#fff;padding:clamp(36px,5vw,64px) 0}
.cta-band .wrap{display:flex;gap:24px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.cta-band h2{color:#fff}.cta-body{max-width:68ch;color:rgba(255,255,255,.85)}.cta-body p:last-child{margin:0}.cta-body a{color:#ffb59c}
.site-footer{background:var(--bg-alt);border-top:1px solid var(--line);padding:clamp(36px,5vw,64px) 0 24px;font-size:.92rem}
.foot-grid{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:clamp(20px,4vw,48px)}
@media (max-width:800px){.foot-grid{grid-template-columns:1fr 1fr}.foot-grid>:first-child{grid-column:1/-1}}
.foot-h{font:600 .72rem/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0 0 14px}.foot-h2{margin-top:24px}
.site-footer ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.site-footer a{color:var(--ink-2);text-decoration:none}.site-footer a:hover{color:var(--accent)}.site-footer a.pending{text-decoration:underline dotted}
.foot-tag{color:var(--muted);font-size:.86rem;max-width:34ch;margin-top:14px}
.foot-note{margin-top:32px;padding-top:18px;border-top:1px solid var(--line);color:var(--muted);font-size:.82rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
.foot-legal{display:flex;gap:18px;flex-wrap:wrap}.site-footer .foot-legal a{color:var(--muted)}.site-footer .foot-legal a:hover{color:var(--accent)}
/* legal pages: owner placeholders stay visible until filled in */
.owner-ph{background:#fff3b0;color:var(--ink);padding:0 .25em;border-radius:3px;font-weight:600}
.legal-meta{color:var(--muted);font-size:.9rem}
@media print{.site-header,.nav-toggle,.preview-bar{display:none}}
/* inline diagrams (SVG from LED Visual); fonts come from the site: body Inter, .f-head Literata, .f-mono system mono */
.slot.diagram{margin:1.6em 0}
.dgm-box{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.dgm{display:block;width:100%;height:auto;max-width:100%;font-family:var(--font-body)}
.dgm .f-head{font-family:var(--font-head)}.dgm .f-mono{font-family:var(--font-mono)}
.hero-side .slot.diagram{margin:0}
/* render illustrations (AI, labelled) */
.slot.render img{display:block;width:100%;height:auto;border-radius:var(--r);border:1px solid var(--line);background:var(--slot-a)}
.slot.render picture{display:block}
.illus{display:inline-block;font:600 .66rem/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;padding:.35em .6em;border:1px solid var(--line-2);border-radius:var(--r-btn);color:var(--muted);margin-right:.6em}

/* ===== launch v1 additions (2026-10-07): catalog, line-up, quote list, figures ===== */
:root{--sil-body:#8b9099;--sil-edge:#5c616a;--sil-screen:#c9ccd1}
.hdr-quote{margin-left:10px;display:inline-flex;align-items:center;gap:.3em;border:1.5px solid var(--ink);border-radius:var(--r-btn);padding:.55em 1em;font:600 .88rem/1 var(--font-body);color:var(--ink);text-decoration:none;white-space:nowrap}
.hdr-quote:hover{color:var(--ink);background:var(--accent-soft)}
.hdr-quote.has{background:var(--ink);color:#fff}
@media (max-width:1100px){.hdr-quote{margin-left:auto}.nav-toggle{margin-left:8px}}
.btn.added{background:#2f6f3e;color:#fff;border-color:#2f6f3e}
.btn-dark-ghost{border:1.5px solid rgba(255,255,255,.45);color:#fff}.btn-dark-ghost:hover{border-color:#fff;color:#fff}
.muted{color:var(--muted)}
/* figures */
.fig{margin:1.6em 0}
.fig img{width:100%;height:auto;border-radius:var(--r);border:1px solid var(--line);background:#fff}
.fig figcaption{font-size:.85rem;color:var(--muted);padding-top:8px}
.ph-box{aspect-ratio:4/3;max-height:420px;width:100%;display:grid;place-items:center;background:linear-gradient(180deg,#f3f1ed,#e9e6e0);border:1px solid var(--line);border-radius:var(--r);color:#a3a7ae}
.ph-art{width:60px;height:120px}
.hero-side .fig{margin:0}
/* silhouettes */
.sil{display:block}
.sil .body{fill:var(--sil-body)}.sil .edge{fill:var(--sil-edge)}.sil .back{fill:#a9adb4}
.sil .hinge{stroke:#6f747c;stroke-width:6}
.sil .wheel{fill:#3b3f46}
/* dark home hero */
.hero-dark{background:radial-gradient(1200px 500px at 70% 30%,#232831 0%,#121419 60%,#0c0d10 100%);color:#e9eaec;padding:clamp(36px,5vw,72px) 0;overflow:hidden}
.hero-dark h1{color:#fff;max-width:14ch;font-size:clamp(2rem,1.2rem + 3vw,3.4rem)}
.hero-dark .lead{color:#b9bdc4}
.hero-dark .eyebrow{color:#ff8a5c}
.hd-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,4vw,56px);align-items:center}
.facts{display:flex;flex-wrap:wrap;gap:10px;margin:1.6em 0 0;padding:0;list-style:none}
.facts li{border:1px solid rgba(255,255,255,.2);border-radius:var(--r-btn);padding:.5em 1em;font-size:.88rem;color:#dfe1e4}
.facts .fact-key{border-color:rgba(255,255,255,.45)}
.facts .fact-key strong{display:block;color:#fff;font-weight:700}
.facts .fact-key small{display:block;font-size:.78rem;opacity:.85}
.hero-poster{position:relative;display:flex;justify-content:center;align-items:flex-end;height:min(560px,62vh);min-height:380px}
.hero-poster .halo{position:absolute;left:50%;top:42%;width:70%;height:70%;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(255,140,90,.28),rgba(90,140,255,.12) 60%,transparent);filter:blur(10px);animation:halo 8s ease-in-out infinite alternate}
.poster-css{position:relative;height:100%;aspect-ratio:700/2160;display:flex;flex-direction:column;align-items:center}
.poster-css .cab{position:relative;width:100%;flex:1;background:#2b2f36;border-radius:6px;padding:3.2%;box-shadow:0 30px 60px -20px rgba(0,0,0,.7),inset 0 0 0 1px rgba(255,255,255,.06)}
.poster-css .screen{width:100%;height:100%;border-radius:3px;background:linear-gradient(160deg,#ff7a3d,#d94a7a 30%,#5b5bd6 60%,#2bb3c9 85%,#ffcf5a);background-size:300% 300%;animation:scr 12s ease-in-out infinite;position:relative;overflow:hidden}
.poster-css .screen::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.18) 48%,transparent 60%);background-size:250% 100%;animation:sheen 6s linear infinite}
.poster-css .msg{position:absolute;left:10%;right:10%;bottom:12%;color:#fff;font:700 clamp(.9rem,1.4vw,1.25rem)/1.15 var(--font-body);text-shadow:0 2px 10px rgba(0,0,0,.25)}
.poster-css .msg small{display:block;font-weight:500;font-size:.7em;opacity:.85;margin-top:.4em}
.poster-css .base{width:78%;height:14px;background:#1f2228;border-radius:4px;margin-top:2px}
.poster-css .wheels{width:78%;display:flex;justify-content:space-between;padding:0 4%}
.poster-css .wheels i{width:18px;height:18px;border-radius:50%;background:#15171b;border:3px solid #3a3f47}
@keyframes scr{0%{background-position:0% 30%}50%{background-position:100% 70%}100%{background-position:0% 30%}}
@keyframes sheen{0%{background-position:150% 0}100%{background-position:-100% 0}}
@keyframes halo{0%{opacity:.7;transform:translate(-50%,-50%) scale(.95)}100%{opacity:1;transform:translate(-50%,-50%) scale(1.05)}}
@media (prefers-reduced-motion:reduce){.poster-css .screen,.poster-css .screen::after,.hero-poster .halo{animation:none}}
/* line-up: one scale, one floor line */
.lineup{display:flex;align-items:flex-start;justify-content:space-between;gap:clamp(6px,1.2vw,14px);overflow-x:auto;padding:20px 4px 8px;scrollbar-width:thin}
.lu-item{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:8px;background:none;border:0;padding:6px 4px 10px;border-radius:var(--r-sm);cursor:pointer;color:var(--ink-2);font:500 .76rem/1.25 var(--font-body);text-align:center}
.lu-item:hover{background:var(--surface-2)}
.lu-item[aria-pressed="true"]{background:var(--accent-soft);color:var(--ink)}
.lu-sil{height:190px;display:flex;align-items:flex-end;justify-content:center;border-bottom:2px solid var(--line-2);padding:0 6px}
.lu-sil svg{height:100%;width:auto}
.lu-item .lbl{max-width:11ch}
.lu-scale{font:500 .72rem/1 var(--font-mono);color:var(--muted);margin:8px 0 0}
.lu-detail{margin-top:18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:20px 22px;box-shadow:var(--shadow);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center}
.lu-detail h3{margin:0 0 .35em}
.lu-detail dl{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;margin:10px 0 0;font-size:.9rem}
.lu-detail dt{color:var(--muted)}.lu-detail dd{margin:0}
.lu-actions{display:flex;flex-direction:column;gap:10px}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,3vw,28px)}
.tile{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:end;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:clamp(18px,3vw,30px);text-decoration:none;color:var(--ink);box-shadow:var(--shadow);min-height:250px}
.tile:hover{color:var(--ink);transform:translateY(-2px)}
.tile h2{margin:0 0 .3em}.tile p{color:var(--ink-2);font-size:.95rem;margin:0 0 1em;max-width:36ch}
.tile .go{font-weight:600;color:var(--accent)}
.tile .sils{display:flex;gap:10px;align-items:flex-end}.tile .sils>span{height:150px;display:flex}.tile .sils svg{height:100%;width:auto}
/* filter chips (buttons) */
.fchips{display:flex;flex-wrap:wrap;gap:8px}
.fchip{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--line-2);background:var(--surface);border-radius:var(--r-btn);padding:.5em .95em;font:500 .86rem/1.1 var(--font-body);color:var(--ink);cursor:pointer;text-decoration:none;white-space:nowrap}
.fchip:hover{border-color:var(--ink);color:var(--ink)}
.fchip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.fchip:disabled{opacity:.35;cursor:not-allowed;border-style:dashed}
.fchip .d{color:var(--muted);font-size:.8em}.fchip[aria-pressed="true"] .d{color:#c9ccd1}
/* catalog */
.cat-head{padding:clamp(18px,3vw,32px) 0 6px}
.cat-head h1{font-size:clamp(1.8rem,1.2rem + 2vw,2.7rem)}
.viewbar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin:8px 0 16px}
.seg{display:inline-flex;border:1.5px solid var(--line-2);border-radius:var(--r-btn);padding:3px;background:var(--surface)}
.seg button{border:0;background:none;padding:.5em 1.1em;border-radius:var(--r-btn);font:600 .85rem/1 var(--font-body);color:var(--ink-2);cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--ink);color:#fff}
.count{color:var(--muted);font-size:.9rem}
.live{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(18px,3vw,36px);align-items:stretch}
.stage{background:linear-gradient(180deg,#f3f1ed,#e9e6e0);border:1px solid var(--line);border-radius:var(--r);min-height:520px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:22px 18px 14px;position:relative}
.stage .floor{position:absolute;left:0;right:0;bottom:0;height:56px;background:#dcd8d1;border-top:1px solid #cfcac2;border-radius:0 0 var(--r) var(--r)}
.stage .sil-box{position:relative;z-index:1;height:420px;display:flex;align-items:flex-end;justify-content:center;margin-bottom:28px}
.stage .sil-box svg{height:100%;width:auto}
.stage .cap{position:relative;z-index:1;font:600 .82rem/1.35 var(--font-mono);color:var(--ink-2);text-align:center;margin:0}
.filters{min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;box-shadow:var(--shadow)}
.fg{margin:0 0 14px;padding:0 0 12px;border-bottom:1px solid var(--line)}
.fg .lg{display:block;font:600 .7rem/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 10px}
.fg .lg em{font-style:normal;color:var(--accent);margin-left:6px}
.reset{background:none;border:0;color:var(--accent);font:600 .85rem/1 var(--font-body);cursor:pointer;padding:4px 0}
.match{margin-top:clamp(20px,3vw,32px)}
.match h2{font-size:1.25rem}
.mcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.mcard{display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;box-shadow:var(--shadow)}
.mcard .ms{height:84px;display:flex;align-items:flex-end;justify-content:center}.mcard .ms svg{height:100%;width:auto}
.mcard h3{font-family:var(--font-body);font-size:.95rem;font-weight:700;margin:0 0 2px;letter-spacing:0}
.mcard h3 a{color:var(--ink);text-decoration:none}.mcard h3 a:hover{color:var(--accent)}
.mcard p{font-size:.8rem;color:var(--muted);margin:0 0 8px;line-height:1.35}
.mcard .acts{display:flex;gap:8px;flex-wrap:wrap}
table.models td.p{font-weight:700;white-space:nowrap}
table.models td a{color:var(--ink);font-weight:600;white-space:nowrap}
body.view-table .stage{display:none}
body.view-table .live{grid-template-columns:minmax(0,1fr)}
body.view-table .filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:4px 22px;align-items:start}
body.view-table .fg{border-bottom:0;margin:0}
[hidden]{display:none !important}
/* model page */
.prod{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(20px,4vw,56px);align-items:start;padding:clamp(16px,3vw,32px) 0 var(--sec-y)}
.prod .stage{min-height:600px}.prod .stage .sil-box{height:500px}
.prod h1{font-size:clamp(1.6rem,1.2rem + 1.8vw,2.4rem)}
.big-pitch{font:700 clamp(1.6rem,1.2rem + 1.6vw,2.3rem)/1.1 var(--font-body);margin:.2em 0 .6em}
.big-pitch span{color:var(--muted);font-weight:500}
.pick{margin:0 0 16px}
/* quote list */
.quote-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(20px,4vw,48px);align-items:start;padding:clamp(16px,3vw,28px) 0 var(--sec-y)}
.qlist{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.qitem{display:grid;grid-template-columns:44px minmax(0,1fr) auto auto;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.qitem .ms{height:70px;display:flex;align-items:flex-end;justify-content:center}.qitem .ms svg{height:100%;width:auto}
.qitem h3{font-family:var(--font-body);font-size:.95rem;font-weight:700;margin:0 0 2px;letter-spacing:0}
.qitem h3 a{color:inherit}
.qitem p{margin:0;font-size:.8rem;color:var(--muted)}
.qty{display:inline-flex;align-items:center;border:1.5px solid var(--line-2);border-radius:var(--r-btn);overflow:hidden}
.qty button{width:34px;height:34px;border:0;background:var(--surface);font:600 1.05rem/1 var(--font-body);cursor:pointer;color:var(--ink)}
.qty output{min-width:30px;text-align:center;font-weight:600}
.rm{width:34px;height:34px;border-radius:50%;border:1px solid var(--line-2);background:var(--surface);cursor:pointer;font-size:1.1rem;line-height:1;color:var(--muted)}
.rm:hover{color:var(--accent);border-color:var(--accent)}
.empty{border:1.5px dashed var(--line-2);border-radius:var(--r);padding:28px;text-align:center;color:var(--muted)}
.qform{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:22px;box-shadow:var(--shadow);position:sticky;top:90px;display:grid;gap:16px}
.qform .hint{display:block;font-size:.8rem;color:var(--muted);margin-top:5px}
.qform .opt-l{font-weight:400;color:var(--muted)}
.qform input[type=email],.qform input[type=text],.qform input[type=tel],.qform textarea{width:100%;font:400 .96rem/1.3 var(--font-body);padding:.75em .85em;border:1.5px solid var(--line-2);border-radius:var(--r-sm);background:#fff;color:var(--ink)}
.qform input.bad{border-color:#b3261e;background:#fff7f6}
.qform .err{display:block;color:#b3261e;font-size:.8rem;margin-top:5px}
.qform .btn-primary{width:100%;padding:1em}
.qform .lg{display:block;font:600 .82rem/1.2 var(--font-body);margin-bottom:8px}
.cchips{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.cchip{display:flex;flex-direction:column;align-items:center;gap:5px;min-width:0;border:1.5px solid var(--line-2);background:var(--surface);border-radius:var(--r-sm);padding:.6em .2em .55em;font:500 .8rem/1.1 var(--font-body);color:var(--ink);cursor:pointer}
.cchip svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.cchip span{max-width:100%;overflow:hidden;text-overflow:ellipsis}
.cchip:hover{border-color:var(--ink)}
.cchip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.frow3{display:grid;gap:16px}
.form-msg{padding:12px 14px;border-radius:var(--r-sm);font-size:.92rem}
.form-msg.ok{background:#e8f4ea;border:1px solid #9cc9a5}
.form-msg.bad{background:#fff4d6;border:1px solid #e8c873}
.contact-list{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin:0}
.side-pick .fchips{margin:10px 0 14px}
@media (max-width:980px){
  .hd-grid{grid-template-columns:minmax(0,1fr)}
  .hero-poster{height:400px;min-height:0;order:-1}
  .live,.prod,.quote-grid{grid-template-columns:minmax(0,1fr)}
  .qform{position:static}
}
@media (max-width:640px){
  .logo-word{font-size:.95rem}
  .hdr-quote{padding:.5em .8em;font-size:.82rem}
  .hero-poster{height:290px}
  .tiles{grid-template-columns:minmax(0,1fr)}
  .tile{min-height:0;grid-template-columns:minmax(0,1fr)}.tile .sils>span{height:110px}
  .lu-detail{grid-template-columns:minmax(0,1fr)}
  .stage{min-height:0;padding:12px 10px 8px;flex-direction:row;justify-content:center;gap:12px;align-items:flex-end}
  .stage .sil-box{height:150px;margin-bottom:14px}
  .stage .floor{height:24px}
  .stage .cap{font-size:.72rem;text-align:left;max-width:55%;align-self:center}
  .prod .stage{min-height:0}.prod .stage .sil-box{height:220px}
  .filters{padding:12px}
  .fg{margin:0 0 10px;padding:0 0 8px}
  .fchips{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
  .fchips::-webkit-scrollbar{display:none}
  .fchip{flex:0 0 auto}
  table.models,table.models tbody,table.models tr,table.models td{display:block;width:100%}
  table.models thead{display:none}
  .tbl-wrap.models-wrap{border:0;overflow:visible}
  table.models tr{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px 14px;margin:0 0 10px}
  table.models td{border:0;padding:3px 0;display:flex;justify-content:space-between;gap:10px}
  table.models td::before{content:attr(data-l);color:var(--muted);font-size:.8rem}
  table.models td.act::before{content:""}
  .qitem{grid-template-columns:36px minmax(0,1fr) auto;grid-template-areas:"s t r" "s q q"}
  .qitem .ms{grid-area:s;height:60px}.qitem .t{grid-area:t}.qitem .qty{grid-area:q;justify-self:start}.qitem .rm{grid-area:r}
}
.spec-grid>*,.hero-grid>*,.layout-doc>*{min-width:0}
.spec-body .tbl-wrap{margin:0 0 1em}.spec-body>p{font-size:.88rem;color:var(--muted)}

/* 2026-10-18: galleries, cabinet switch, p-page photo */
.pl-gallery .pl-main{width:100%;height:auto;max-height:620px;object-fit:contain;background:#fff}
.pl-thumbs{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.pl-thumb{padding:0;border:2px solid transparent;border-radius:6px;background:#fff;cursor:pointer;width:64px;height:64px;overflow:hidden}
.pl-thumb[aria-pressed="true"]{border-color:currentColor}
.pl-thumb img{width:100%;height:100%;object-fit:contain}
.cab-switch{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}
.cab-note{font-size:.85rem;margin-top:8px}
.stage .stage-photo{max-height:520px;width:auto;max-width:100%;height:auto;object-fit:contain}
/* 2026-10-19: photo framing: whole poster visible, contain on neutral, no fill strips */
.fig-photo img{max-height:640px;object-fit:contain;background:#fff}
.pl-gallery .pl-main{height:560px;max-height:none}
.tf-duo{margin:0}
.tf-duo-row{display:flex;align-items:flex-end;justify-content:center;gap:28px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px 24px 18px}
.tf-duo-item{display:flex;flex-direction:column;align-items:center;gap:10px;min-width:0}
.tf-duo-item img{display:block;height:420px;width:auto;max-width:100%;object-fit:contain;border:0;border-radius:0;background:transparent}
.tf-duo-item span{font-size:.82rem;font-weight:600;color:var(--muted)}
.stage-duo{display:flex;align-items:flex-end;justify-content:center;gap:24px}
.stage-duo .stage-photo{max-height:480px}
@media (max-width:640px){.tf-duo-item img{height:300px}.pl-gallery .pl-main{height:420px}}
/* 2026-10-19: home photos */
.hero-photo{margin:0;justify-self:center;width:100%;max-width:440px}
.hero-photo img{display:block;width:100%;height:auto;max-height:560px;object-fit:contain;background:#e9e7e3;border-radius:14px;box-shadow:0 30px 60px -20px rgba(0,0,0,.6)}
.hero-photo figcaption{font-size:.8rem;color:#9ea3ab;margin-top:10px;text-align:center}
.tile-photo{display:flex;align-items:flex-end;justify-content:center;height:230px;width:130px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px}
.tile-photo img{height:100%;width:auto;max-width:100%;object-fit:contain}
@media (max-width:760px){.tile-photo{width:100%;height:220px}}
/* 2026-10-19: cascade configurator */
.cz{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:clamp(18px,3vw,36px);background:var(--surface);border:1px solid var(--line);border-radius:calc(var(--r) + 4px);box-shadow:var(--shadow);padding:clamp(18px,3vw,32px);margin-top:20px}
.cz-controls{display:flex;flex-direction:column;gap:18px}
.cz-g{display:flex;flex-direction:column;gap:8px}
.cz-l{font:500 .72rem/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.cz-l small{letter-spacing:0;text-transform:none;font-size:.95em}
.cz .fchips{flex-wrap:wrap;overflow:visible}
.cz [data-cz="n"] .fchip{min-width:44px;justify-content:center;font-weight:600}
.cz-note{font-size:.85rem;color:var(--muted);margin:0}
.cz-main{min-width:0;display:flex;flex-direction:column}
.cz-stagewrap{position:relative;background:#f9fbfc;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.cz-stage{position:relative;line-height:0}
.cz-photo{display:block;width:100%;height:auto;background:#f9fbfc}
.cz-dimlabel{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cz-svg .cz-body{fill:#22252b}.cz-svg .cz-edge{fill:#2f333a}.cz-svg .cz-wheel{fill:#15171b;stroke:#6b7078;stroke-width:8}
.cz-svg .cz-floor{stroke:#b9b5ac;stroke-width:8}
.cz-svg .cz-dimline line{stroke:#6b7078;stroke-width:8}
.cz-title{font-weight:600;margin:14px 0 6px}
.cz-specs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0}
.cz-k{background:var(--bg-alt,#f6f5f2);border:1px solid var(--line);border-radius:10px;padding:10px 12px;min-width:0}
.cz-k dt{font:500 .68rem/1.2 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.cz-k dd{margin:0;font-weight:600;font-size:.95rem}
.cz-k dd small{display:block;font-weight:400;font-size:.8rem;color:var(--muted);margin-top:3px}
.cz-big{grid-column:span 1}.cz-big dd{font-size:1.25rem;color:var(--accent)}
.cz-ctrl{grid-column:span 1}
.cz-cta{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:16px 0 0}
.cz-cta .added{background:#1d7a3e}
.cz-more{font-weight:600;margin-left:auto}
.cz-th{margin:36px 0 10px;font-size:1.05rem}
.cz-table{width:100%;border-collapse:collapse;font-size:.88rem}
.cz-table caption{text-align:left;color:var(--muted);font-size:.82rem;padding-bottom:6px}
.cz-table th,.cz-table td{border:1px solid var(--line);padding:7px 9px;text-align:center;white-space:nowrap}
.cz-table thead th{background:var(--bg-alt,#f6f5f2);font-size:.8rem}
.cz-table th[scope="row"]{text-align:left}
.cz-foot{font-size:.85rem;color:var(--muted);margin-top:14px}
.cz-compact .cz-specs{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:900px){.cz{grid-template-columns:minmax(0,1fr)}.cz-specs{grid-template-columns:repeat(2,minmax(0,1fr))}.cz-more{margin-left:0}}
.tbl-wrap{overflow-x:auto}

.cz-pix{margin:22px 0 0;padding:18px 20px;border:1px solid var(--line);border-radius:var(--r);background:var(--bg-alt,#f6f5f2)}
.cz-pix-h{margin:0 0 4px;font-size:1.05rem}
.cz-pix-sub{margin:0 0 14px;font-size:.88rem;color:var(--muted)}
.cz-pix-row{display:flex;flex-wrap:wrap;gap:18px}
.cz-pix figure{margin:0;flex:0 1 220px;min-width:0}
.cz-pix canvas{display:block;width:100%;aspect-ratio:1;border-radius:12px;background:#050506}
.cz-pix figcaption{margin-top:8px;font-size:.88rem;line-height:1.4}
.cz-pix figcaption span{color:var(--muted);font-size:.82rem}