/* SigNeon360 redesign: generated from the approved design (signeon360-handoff/index.html) */
/* Layout: neon-shop night street. Fixed data-rain wall behind every page; hash-routed pages (Home, Shop, Design, Upload Idea, About, Contact) share the letter-swap nav, mobile dock and wave footer. Single dark look by choice: neon only reads on dark. */
:root{
  color-scheme:dark;
  --bg:#07060d;
  --panel:rgba(var(--ink),.66);
  --line:rgba(190,170,255,.14);
  --fg:#f1edff;
  --muted:#a9a2c4;
  --pink:#ff3fa8;
  --cyan:#3ff0ff;
  --violet:#9b6bff;
  --amber:#ffc24a;
  --ok:#5cf2a4;
  --ink:14,12,24;
  --fg2:#d6d0ee;
  --foot:#0d0a18;
  --hero-bg:#050309;
  --f-display:"Cormorant Garamond",Georgia,serif;
  --f-body:Jost,system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:Jost,system-ui,sans-serif;
  --f-neon:"Neonderthaw","Yellowtail",cursive;
  --r-sm:10px;--r-md:18px;--r-lg:28px;
  --gutter:clamp(16px,4vw,48px);
  --maxw:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body{background:var(--bg);color:var(--fg);font-family:var(--f-body);font-size:16px;line-height:1.6;overflow-x:clip;-webkit-font-smoothing:antialiased}
@media (pointer:fine){body.has-cursor,body.has-cursor *{cursor:none!important}}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--f-display);line-height:1.08;margin:0;text-wrap:balance;letter-spacing:-.01em}
p{margin:0}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:8px}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gutter)}
.eyebrow{font-family:var(--f-mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan)}
.sec{position:relative;z-index:2;padding-block:clamp(56px,9vw,110px)}
.sec-head{display:flex;flex-direction:column;gap:14px;max-width:720px;margin-bottom:clamp(26px,4vw,44px)}
.sec-head.row{max-width:none;flex-direction:row;justify-content:space-between;align-items:end;flex-wrap:wrap;gap:18px}
.sec-head.row>div{display:flex;flex-direction:column;gap:14px;max-width:680px}
.sec-head h2{font-size:clamp(34px,5vw,62px);font-weight:500}
.sec-head p{color:var(--muted);max-width:60ch}
.glow-pink{color:var(--pink);text-shadow:0 0 18px rgba(255,63,168,.6)}
.glow-cyan{color:var(--cyan);text-shadow:0 0 18px rgba(63,240,255,.55)}
.muted{color:var(--muted)}
[data-page]{display:none}
[data-page].show{display:block}

/* light mode (nav toggle) */
:root[data-mode="light"]{color-scheme:light;
  --bg:#f6f4fa;--panel:rgba(255,255,255,.8);--line:rgba(40,24,90,.13);--fg:#17121f;--muted:#5f5874;
  --pink:#d81b7c;--cyan:#0a8a9c;--violet:#6d43d6;--amber:#a86c00;--ok:#12855a;
  --ink:255,255,255;--fg2:#2e2842;--foot:#ece7f4}
:root[data-mode="light"] .vignette{background:radial-gradient(120% 80% at 50% 0%,transparent 45%,rgba(246,244,250,.7) 100%)}
:root[data-mode="light"] .c-ring{mix-blend-mode:normal}
:root[data-mode="light"] .lg-btn{--tint:30,20,60;box-shadow:inset 0 0 0 1px rgba(30,20,60,.14),inset 0 1px 0 rgba(255,255,255,.9),0 2px 10px rgba(30,20,60,.08)}
:root[data-mode="light"] .lg-btn.pink{--tint:216,27,124;box-shadow:inset 0 0 0 1px rgba(216,27,124,.45),inset 0 1px 0 rgba(255,255,255,.9),0 4px 16px rgba(216,27,124,.2)}
:root[data-mode="light"] .lg-btn.cyan{--tint:10,138,156;box-shadow:inset 0 0 0 1px rgba(10,138,156,.45),inset 0 1px 0 rgba(255,255,255,.9),0 4px 16px rgba(10,138,156,.18)}
:root[data-mode="light"] .lg-btn::after{opacity:.35}
:root[data-mode="light"] .lg-btn.hero-btn{--tint:255,31,90;box-shadow:inset 0 0 0 1px var(--crim),inset 2px 2px .5px -2px rgba(255,255,255,.7),inset 0 0 10px rgba(255,31,90,.18),0 0 18px rgba(255,31,90,.18)}
:root[data-mode="light"] .hero .eyebrow,:root[data-mode="light"] .hero{--pink:#ff3fa8}
:root[data-mode="light"] .card,:root[data-mode="light"] .cat-tile,:root[data-mode="light"] .tile,:root[data-mode="light"] .tcard,:root[data-mode="light"] .panel,:root[data-mode="light"] .sb-panel,:root[data-mode="light"] .filters,:root[data-mode="light"] .c-card,:root[data-mode="light"] .faq details{box-shadow:0 6px 24px rgba(40,24,90,.07)}
:root[data-mode="light"] .giant{-webkit-text-stroke-color:rgba(216,27,124,.55)}
:root[data-mode="light"] .modal-box,:root[data-mode="light"] .drawer{background:#fff}
:root[data-mode="light"] .scrim{background:rgba(30,20,50,.35)}
:root[data-mode="light"] .ticker-track span::before{text-shadow:none}
.mode-btn .i-sun,:root[data-mode="light"] .mode-btn .i-moon{display:none}
:root[data-mode="light"] .mode-btn .i-sun{display:block}
body,.nav-in,.card,.tile,.cat-tile,.panel,.tcard,footer,.foot-body{transition:background-color .4s,color .4s,border-color .4s}

/* background */
#rain{position:fixed;inset:0;width:100%;height:100%;z-index:0;display:block;pointer-events:none}
.vignette{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(120% 80% at 50% 0%,transparent 40%,rgba(var(--ink),.75) 100%)}

/* cursor */
.c-dot,.c-ring{position:fixed;left:0;top:0;pointer-events:none;z-index:9999;border-radius:50%;transform:translate3d(-100px,-100px,0);opacity:0;transition:opacity .3s}
.c-dot{width:8px;height:8px;margin:-4px 0 0 -4px;background:var(--fg);box-shadow:0 0 12px var(--pink),0 0 24px var(--pink)}
.c-ring{width:44px;height:44px;margin:-22px 0 0 -22px;border:1.5px solid rgba(63,240,255,.8);box-shadow:0 0 18px rgba(63,240,255,.35),inset 0 0 12px rgba(255,63,168,.25);transition:width .35s cubic-bezier(.2,.8,.2,1),height .35s cubic-bezier(.2,.8,.2,1),margin .35s cubic-bezier(.2,.8,.2,1),background .3s,border-color .3s,opacity .3s;mix-blend-mode:screen}
body.has-cursor .c-dot,body.has-cursor .c-ring{opacity:1}
body.cursor-hover .c-ring{width:78px;height:78px;margin:-39px 0 0 -39px;background:rgba(255,63,168,.14);border-color:var(--pink)}
body.cursor-down .c-ring{width:30px;height:30px;margin:-15px 0 0 -15px}
.c-trail{position:fixed;left:0;top:0;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;pointer-events:none;z-index:9998;background:var(--pink);box-shadow:0 0 10px var(--pink)}

/* reveal text */
.split .ch{display:inline-block;white-space:pre}
.split .w{display:inline-block;white-space:nowrap}
.split.go .ch{animation:chIn .9s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i)*26ms)}
@keyframes chIn{0%{opacity:0;transform:translateY(.55em) rotate(6deg) scale(.9);filter:blur(10px)}60%{opacity:1;filter:blur(0)}100%{opacity:1;transform:none;filter:none}}
.fade-up{transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.fade-up.pre{opacity:0;transform:translateY(24px)}

/* liquid glass button */
.lg-btn{--tint:255,255,255;position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 24px;border:0;border-radius:999px;font:600 15px/1 var(--f-body);color:var(--fg);text-decoration:none;cursor:pointer;background:rgba(var(--tint),.06);
  box-shadow:0 2px 6px rgba(0,0,0,.08),inset 3px 3px .5px -3px rgba(255,255,255,.9),inset -3px -3px .5px -3px rgba(255,255,255,.85),inset 1px 1px 1px -.5px rgba(255,255,255,.6),inset -1px -1px 1px -.5px rgba(255,255,255,.6),inset 0 0 6px 6px rgba(255,255,255,.08),inset 0 0 2px 2px rgba(255,255,255,.05),0 0 12px rgba(0,0,0,.15);
  transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s,background .3s,color .3s;white-space:nowrap}
.lg-btn::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;backdrop-filter:blur(6px) saturate(160%);-webkit-backdrop-filter:blur(6px) saturate(160%);backdrop-filter:url(#lg-filter) blur(2px) saturate(170%)}
.lg-btn::after{content:"";position:absolute;inset:1px;z-index:-1;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,0) 48%);opacity:.7;pointer-events:none}
.lg-btn:hover{transform:scale(1.05);background:rgba(var(--tint),.12)}
.lg-btn:active{transform:scale(.97)}
.lg-btn.pink{--tint:255,63,168;box-shadow:0 0 22px rgba(255,63,168,.35),inset 3px 3px .5px -3px rgba(255,255,255,.9),inset -3px -3px .5px -3px rgba(255,255,255,.85),inset 1px 1px 1px -.5px rgba(255,255,255,.6),inset -1px -1px 1px -.5px rgba(255,255,255,.6),inset 0 0 6px 6px rgba(255,63,168,.16)}
.lg-btn.cyan{--tint:63,240,255;box-shadow:0 0 22px rgba(63,240,255,.28),inset 3px 3px .5px -3px rgba(255,255,255,.9),inset -3px -3px .5px -3px rgba(255,255,255,.85),inset 1px 1px 1px -.5px rgba(255,255,255,.6),inset -1px -1px 1px -.5px rgba(255,255,255,.6),inset 0 0 6px 6px rgba(63,240,255,.14)}
.lg-btn.sm{min-height:38px;padding:9px 16px;font-size:13.5px}
.lg-btn.icon{width:44px;min-height:44px;padding:0}
.lg-btn.icon.sm{width:38px;min-height:38px}
.lg-btn.block{width:100%}
.lg-btn svg{width:18px;height:18px;flex:none}
.lg-btn .badge{position:absolute;top:-4px;right:-4px;min-width:19px;height:19px;padding:0 5px;border-radius:99px;background:var(--pink);color:#fff;font:700 11px/19px var(--f-body);box-shadow:0 0 10px var(--pink)}
.badge[data-n="0"]{display:none}
.lg-btn.on{--tint:255,63,168;color:var(--pink)}

/* desktop nav */
.nav{position:fixed;left:0;right:0;top:0;z-index:50;padding-top:calc(env(safe-area-inset-top,0px) + 14px);padding-inline:var(--gutter);pointer-events:none}
.nav-in{pointer-events:auto;max-width:var(--maxw);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 12px 10px 22px;border-radius:999px;background:rgba(var(--ink),.55);border:1px solid var(--line);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);transition:background .3s}
.nav.scrolled .nav-in{background:rgba(var(--ink),.85)}
.logo{display:flex;align-items:baseline;gap:2px;text-decoration:none;font-family:var(--f-display);font-weight:600;font-size:20px;letter-spacing:-.02em}
.logo .neon{font-family:"Tilt Neon",var(--f-body);font-weight:400;color:var(--pink);text-shadow:0 0 8px var(--pink),0 0 20px rgba(255,63,168,.6);animation:flick 6s infinite}
.logo .neon-w{position:relative;display:inline-flex;align-items:baseline}
.logo .neon-w::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;border-radius:2px;background:var(--pink);box-shadow:0 0 6px var(--pink),0 0 14px rgba(255,63,168,.7)}
.logo sup{font-family:var(--f-mono);font-size:11px;color:var(--cyan);margin-left:3px;text-shadow:0 0 8px var(--cyan)}
@keyframes flick{0%,92%,100%{opacity:1}93%{opacity:.4}94%{opacity:1}96%{opacity:.6}97%{opacity:1}}
.nav-links{display:flex;gap:2px;list-style:none;margin:0;padding:0}
.swap{position:relative;display:inline-flex;padding:10px 13px;border-radius:999px;text-decoration:none;font:500 14.5px/1.1 var(--f-body);color:var(--muted);transition:color .25s,background .25s}
.swap:hover,.swap.active{color:var(--fg);background:rgba(255,255,255,.05)}
.swap.active::after{content:"";position:absolute;left:50%;bottom:3px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--pink);box-shadow:0 0 8px var(--pink)}
.swap .l{position:relative;display:inline-block;overflow:hidden;height:1.15em;white-space:pre}
.swap .l span{display:block;transition:transform .45s cubic-bezier(.7,0,.2,1)}
.swap .l span+span{position:absolute;left:0;top:100%;color:var(--cyan)}
.swap.swapping .l span{transform:translateY(-100%)}
.nav-actions{display:flex;gap:8px;align-items:center}
@media (max-width:1060px) and (min-width:861px){.swap{padding:10px 9px;font-size:13.5px}.logo{font-size:17px}}

/* mobile top + dock */
.m-top,.dock-wrap{display:none}
@media (max-width:860px){
  .nav{display:none}
  .m-top{display:flex;position:fixed;top:0;left:0;right:0;z-index:50;align-items:center;justify-content:space-between;padding:calc(env(safe-area-inset-top,0px) + 10px) 16px 10px;background:linear-gradient(180deg,rgba(var(--ink),.94),rgba(var(--ink),0))}
  .dock-wrap{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;justify-content:center;padding:0 10px calc(env(safe-area-inset-bottom,0px) + 12px);pointer-events:none}
}
.dock{pointer-events:auto;display:flex;align-items:flex-end;gap:5px;height:60px;padding:0 8px 8px;border-radius:22px;background:rgba(var(--ink),.76);border:1px solid var(--line);backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%);box-shadow:0 10px 40px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.08);touch-action:none}
.dock-item{--s:40px;position:relative;width:var(--s);height:var(--s);flex:none;display:grid;place-items:center;border-radius:12px;border:0;color:var(--fg);background:rgba(255,255,255,.07);box-shadow:inset 0 1px 0 rgba(255,255,255,.12);transition:width .18s ease,height .18s ease,background .2s;cursor:pointer;padding:0;text-decoration:none}
.dock-item svg{width:48%;height:48%}
.dock-item.active{background:rgba(255,63,168,.2);color:var(--pink);box-shadow:0 0 16px rgba(255,63,168,.35),inset 0 1px 0 rgba(255,255,255,.15)}
.dock-item.active::after{content:"";position:absolute;bottom:-6px;width:4px;height:4px;border-radius:50%;background:var(--pink);box-shadow:0 0 6px var(--pink)}
.dock-label{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%,4px);padding:4px 9px;border-radius:8px;background:rgba(var(--ink),.95);border:1px solid var(--line);font:600 11.5px/1.2 var(--f-body);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s,transform .15s}
.dock-item.show-label .dock-label{opacity:1;transform:translate(-50%,0)}
.dock-item .badge{position:absolute;top:-4px;right:-4px;min-width:17px;height:17px;padding:0 4px;border-radius:99px;background:var(--pink);color:#fff;font:700 10px/17px var(--f-body)}

/* hero */
/* hero: halftone nebula — crimson pixel gas, sparkle stars, dotted planet, 3 parallax depths */
.hero{--crim:#ff1f5a;--blush:#f6e2e8;position:relative;z-index:2;min-height:max(620px,min(900px,100svh));display:flex;overflow:hidden;background:var(--hero-bg);cursor:crosshair}
#nebula{position:absolute;inset:0;width:100%;height:100%;z-index:0;display:block}
.hero::after{content:"";position:absolute;inset:auto 0 0 0;height:120px;z-index:1;background:linear-gradient(180deg,transparent,var(--bg));pointer-events:none}
.hero-in{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:space-between;gap:40px;max-width:var(--maxw);width:100%;margin:0 auto;padding-inline:var(--gutter);padding-block:clamp(104px,11vw,120px) clamp(56px,8vw,96px);pointer-events:none}
.hero-in a,.hero-in button{pointer-events:auto}
.hero-meta{display:flex;justify-content:space-between;gap:16px;font:400 10.5px/1.4 var(--f-mono);letter-spacing:.32em;text-transform:uppercase;color:rgba(246,226,232,.6)}
@media (max-width:640px){.hero-meta .hm-r{display:none}}
.hero-copy{display:flex;flex-direction:column;gap:20px;max-width:620px}
.hero-eyebrow{font:400 11px/1.3 var(--f-mono);letter-spacing:.34em;text-transform:uppercase;color:var(--crim)}
.hero h1{font-family:var(--f-display);font-size:clamp(52px,8.4vw,108px);font-weight:500;line-height:.92;letter-spacing:-.01em;color:var(--blush);text-shadow:0 4px 40px rgba(5,3,9,.85)}
.hero .hero-sub{font-size:14.5px;line-height:1.65;color:rgba(246,226,232,.62);max-width:40ch;text-shadow:0 2px 14px rgba(5,3,9,.9)}
.hero-cta{margin-top:12px}
.lg-btn.hero-btn{--tint:255,31,90;border-radius:3px;min-height:44px;padding:12px 22px;font:400 11.5px/1 var(--f-mono);letter-spacing:.28em;text-transform:uppercase;color:var(--blush);box-shadow:inset 0 0 0 1px var(--crim),inset 2px 2px .5px -2px rgba(255,255,255,.7),inset 0 0 10px rgba(255,31,90,.18),0 0 18px rgba(255,31,90,.18);background:rgba(255,31,90,.1)}
.lg-btn.hero-btn:hover{background:var(--crim);color:#050309;transform:none}
.lg-btn.hero-btn.solid{background:rgba(255,31,90,.28)}
.script{font-family:var(--f-neon);font-weight:400;font-size:1.35em;line-height:.8;color:var(--pink);text-shadow:0 0 6px #fff,0 0 18px var(--pink),0 0 42px var(--pink),0 0 80px rgba(255,63,168,.6);letter-spacing:0}
.hero-sub{font-size:clamp(16px,1.6vw,19px);color:var(--fg2);max-width:54ch;text-shadow:0 2px 18px rgba(var(--ink),.9)}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px}
.hero-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin-top:18px;max-width:880px;border-radius:var(--r-md);overflow:hidden;border:1px solid var(--line);background:var(--line)}
.fact{padding:16px 18px;background:rgba(var(--ink),.8);backdrop-filter:blur(8px);min-width:0}
.fact .n{font-family:var(--f-display);font-weight:600;font-size:21px;font-variant-numeric:tabular-nums}
.fact .t{font-size:13px;color:var(--muted);line-height:1.35}
@media (max-width:720px){.hero-facts{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* page header (inner pages) */
.phead{position:relative;z-index:2;padding-block:clamp(120px,14vw,170px) clamp(30px,5vw,56px);overflow:hidden}
.phead::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 80% at 80% 0%,rgba(255,63,168,.18),transparent 60%),radial-gradient(50% 70% at 10% 20%,rgba(63,240,255,.12),transparent 60%)}
.phead .wrap{display:flex;flex-direction:column;gap:16px}
.crumbs{display:flex;gap:8px;font:12px/1 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.crumbs a{text-decoration:none;color:var(--cyan)}
.phead h1{font-size:clamp(40px,7vw,88px);font-weight:500;max-width:18ch}
.phead p{color:var(--fg2);max-width:60ch;font-size:clamp(16px,1.5vw,18px)}

/* ticker */
.ticker{position:relative;z-index:2;border-block:1px solid var(--line);background:rgba(var(--ink),.75);overflow:hidden;padding-block:14px}
.ticker-track{display:flex;gap:46px;width:max-content;animation:tick 38s linear infinite;font-family:var(--f-display);font-weight:600;font-size:14px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.ticker-track span::before{content:"✦";color:var(--pink);margin-right:46px;text-shadow:0 0 8px var(--pink)}
@keyframes tick{to{transform:translateX(-50%)}}

/* categories */
.cats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
@media (max-width:980px){.cats{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:720px){.cats{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;margin-inline:calc(var(--gutter)*-1);padding-inline:var(--gutter);scrollbar-width:none}.cats::-webkit-scrollbar{display:none}.cat-tile{flex:0 0 138px;scroll-snap-align:start}}
.cats.auto{scroll-snap-type:none}
.cat-tile{--c:var(--pink);position:relative;display:flex;flex-direction:column;align-items:center;gap:12px;padding:22px 12px 18px;border-radius:var(--r-md);border:1px solid var(--line);background:var(--panel);backdrop-filter:blur(10px);color:var(--fg);text-decoration:none;text-align:center;cursor:pointer;font:inherit;overflow:hidden;transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .3s,box-shadow .3s}
.cat-tile::before{content:"";position:absolute;inset:auto -30% -60% -30%;height:120%;background:radial-gradient(closest-side,color-mix(in srgb,var(--c) 30%,transparent),transparent);opacity:.35;transition:opacity .3s}
.cat-tile:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--c) 60%,transparent);box-shadow:0 0 26px color-mix(in srgb,var(--c) 30%,transparent)}
.cat-tile:hover::before{opacity:.9}
.cat-ico{position:relative;width:62px;height:62px;display:grid;place-items:center;border-radius:50%;border:1.5px solid color-mix(in srgb,var(--c) 70%,transparent);box-shadow:0 0 18px color-mix(in srgb,var(--c) 35%,transparent),inset 0 0 14px color-mix(in srgb,var(--c) 25%,transparent)}
.cat-ico svg{width:30px;height:30px;color:var(--c);filter:drop-shadow(0 0 4px var(--c)) drop-shadow(0 0 10px var(--c))}
.cat-tile b{position:relative;font:600 14px/1.25 var(--f-body)}
.cat-tile small{position:relative;font:11px/1 var(--f-mono);color:var(--muted);letter-spacing:.08em}

/* neon sign art */
.sign{position:relative;display:grid;place-items:center;overflow:hidden;background:
  radial-gradient(70% 60% at 50% 50%,color-mix(in srgb,var(--c) 22%,transparent),transparent 70%),
  repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 26px),
  repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 1px,transparent 1px 52px),
  linear-gradient(160deg,#17121f,#0b0911)}
.sign .txt{position:relative;text-align:center;line-height:1;color:#fff;padding:0 8%;
  text-shadow:0 0 2px #fff,0 0 8px var(--c),0 0 18px var(--c),0 0 36px var(--c),0 0 70px var(--c);animation:buzz 5s infinite}
.sign .txt small{display:block;font-size:.45em;margin-top:.25em}
.sign .txt .g{display:block;font-family:"Segoe UI Symbol","Noto Sans Symbols 2","Apple Symbols",sans-serif;font-size:1.25em;line-height:1.05;margin-bottom:.06em}
.sign::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.06),transparent 30%);pointer-events:none}
@keyframes buzz{0%,96%,100%{opacity:1}97%{opacity:.82}98%{opacity:1}}
.f-neonder{font-family:"Neonderthaw",cursive}
.f-tilt{font-family:"Tilt Neon",sans-serif}
.f-monoton{font-family:"Monoton",cursive}
.f-yellow{font-family:"Yellowtail",cursive}

/* panoramic spread */
.pano-sec{overflow:hidden}
.pano{position:relative;height:clamp(300px,36vw,460px);perspective:1100px;perspective-origin:50% 50%;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.pano-stage{position:absolute;inset:0;transform-style:preserve-3d}
.pano-card{position:absolute;left:50%;top:50%;width:var(--cw);height:calc(var(--cw)*1.4);margin:calc(var(--cw)*-.7) 0 0 calc(var(--cw)*-.5);border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.12);box-shadow:0 26px 50px rgba(0,0,0,.55);cursor:pointer;padding:0;background:none;color:inherit;font:inherit;transition:border-color .3s,box-shadow .3s}
.pano-card .sign{position:absolute;inset:0}
.pano-card .txt{font-size:calc(var(--cw)*.16)}
.pano-card .cap{position:absolute;left:0;right:0;bottom:0;padding:12px;background:linear-gradient(0deg,rgba(var(--ink),.94),transparent);text-align:left;font:600 12.5px/1.25 var(--f-body)}
.pano-card .cap i{display:block;font:normal 11.5px/1.2 var(--f-mono);color:var(--cyan);margin-top:4px}
.pano-card:hover{border-color:var(--pink);box-shadow:0 26px 50px rgba(0,0,0,.55),0 0 30px rgba(255,63,168,.4)}
.pano-floor{position:absolute;left:5%;right:5%;bottom:2%;height:30%;background:radial-gradient(50% 50% at 50% 50%,rgba(255,63,168,.18),transparent 70%);filter:blur(20px);pointer-events:none}
.pano-ctrl{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:20px;flex-wrap:wrap}
.pano-hint{font:12px/1.3 var(--f-mono);color:var(--muted);letter-spacing:.08em;text-transform:uppercase}

/* products */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:18px}
.card{display:flex;flex-direction:column;border-radius:var(--r-md);overflow:hidden;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(10px);transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .3s,box-shadow .3s;min-width:0}
.card:hover{transform:translateY(-4px);border-color:rgba(255,63,168,.4);box-shadow:0 20px 40px rgba(0,0,0,.4)}
.card-media{position:relative}
.card .sign{aspect-ratio:1/1;max-width:100%;cursor:pointer}
.card .txt{font-size:clamp(26px,2.8vw,36px)}
.sale-pill{position:absolute;top:12px;left:12px;z-index:2;padding:5px 9px;border-radius:99px;background:var(--pink);color:#fff;font:700 11px/1 var(--f-mono);letter-spacing:.06em;box-shadow:0 0 12px rgba(255,63,168,.6)}
.card-body{display:flex;flex-direction:column;gap:10px;padding:16px;flex:1}
.card h3{font:600 15.5px/1.35 var(--f-body);letter-spacing:0}
.card .cat{font:11px/1.2 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.prices{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;font-variant-numeric:tabular-nums}
.price{font:600 17px/1 var(--f-display);color:var(--cyan);white-space:nowrap}
.was{font:500 14px/1 var(--f-body);color:var(--muted);text-decoration:line-through}
.card-act{display:flex;gap:8px;margin-top:auto}
.card-act .lg-btn:first-child{flex:1}
.lbl-s{display:none}
@media (max-width:620px){
  .grid.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .grid.products .card-body{padding:12px;gap:8px}
  .grid.products h3{font-size:13.5px}
  .grid.products .cat{font-size:9.5px;letter-spacing:.06em}
  .grid.products .price{font-size:15px}
  .grid.products .was{font-size:12px}
  .grid.products .txt{font-size:24px}
  .grid.products .sale-pill{top:8px;left:8px;font-size:10px;padding:4px 7px}
  .grid.products .card-act{gap:6px}
  .grid.products .card-act .lg-btn:first-child{padding:8px 10px;gap:6px;font-size:12.5px}
  .grid.products .card-act .lg-btn.icon{width:34px;min-height:34px}
  .grid.products .lbl-l{display:none}.grid.products .lbl-s{display:inline}
}
.vids{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
@media (max-width:720px){.vids{grid-template-columns:1fr}}
.vid{position:relative;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);background:#0b0911;aspect-ratio:16/10;max-width:100%;box-shadow:0 30px 60px rgba(0,0,0,.45);transition:border-color .3s,box-shadow .3s}
.vid:hover{border-color:rgba(255,63,168,.5);box-shadow:0 30px 60px rgba(0,0,0,.45),0 0 34px rgba(255,63,168,.25)}
.vid video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.vid .fallback{position:absolute;inset:0;display:none}
.vid.no-video .fallback{display:grid}
.vid.no-video video{display:none}
.vid .fallback .txt{font-size:clamp(40px,6vw,72px)}
.vid-bar{position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;justify-content:space-between;align-items:end;gap:12px;padding:18px;background:linear-gradient(0deg,rgba(var(--ink),.9),transparent)}
.vid-bar b{display:block;font:700 17px/1.25 var(--f-display)}
.vid-bar span{font:12px/1.3 var(--f-mono);color:var(--muted);letter-spacing:.06em}
.vid-ctrl{display:flex;gap:8px}
.vid-live{position:absolute;top:14px;left:14px;z-index:2;display:flex;align-items:center;gap:7px;padding:5px 10px;border-radius:99px;background:rgba(var(--ink),.7);font:11px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase}
.vid-live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--pink);box-shadow:0 0 8px var(--pink);animation:buzz 1.6s infinite}
.empty-state{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;gap:14px;padding:50px 16px;text-align:center;border:1px dashed var(--line);border-radius:var(--r-md);color:var(--muted)}

/* shop page */
.shop{display:grid;grid-template-columns:250px minmax(0,1fr);gap:28px;align-items:start}
@media (max-width:900px){.shop{grid-template-columns:1fr}}
.filters{position:sticky;top:100px;display:flex;flex-direction:column;gap:22px;padding:20px;border-radius:var(--r-md);background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(12px)}
.filters h4{font:600 12px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.f-list{display:flex;flex-direction:column;gap:2px}
.f-list button{display:flex;justify-content:space-between;gap:8px;width:100%;padding:8px 10px;border:0;border-radius:10px;background:none;color:var(--muted);font:500 14.5px/1.3 var(--f-body);text-align:left;cursor:pointer;transition:.2s}
.f-list button span{font:12px/1.3 var(--f-mono)}
.f-list button:hover{color:var(--fg);background:rgba(255,255,255,.04)}
.f-list button.on{color:var(--fg);background:rgba(255,63,168,.12);box-shadow:inset 2px 0 0 var(--pink)}
.check{display:flex;align-items:center;gap:10px;font:500 14.5px/1.3 var(--f-body);color:var(--fg)}
.check input{width:18px;height:18px;accent-color:var(--pink)}
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.toolbar .count{font:13px/1.3 var(--f-mono);color:var(--muted)}
.toolbar .inp{width:auto;min-height:42px;padding:8px 14px;font-size:14.5px}
.f-toggle{display:none}
@media (max-width:900px){.filters{position:static;display:none}.filters.open{display:flex}.f-toggle{display:inline-flex}}
.shop-search{flex:1;min-width:180px;max-width:320px}

/* sign builder (mirrors the live custom-neon-sign configurator) */
.sb{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:22px;align-items:start}
@media (max-width:900px){.sb{grid-template-columns:1fr}}
.sb-stage{position:sticky;top:96px;display:flex;flex-direction:column;gap:10px;z-index:3}
@media (max-width:900px){.sb-stage{position:sticky;top:calc(env(safe-area-inset-top,0px) + 60px);gap:6px;background:var(--bg);padding-block:4px 8px;margin-inline:calc(var(--gutter)*-1);padding-inline:var(--gutter)}}
.scene{position:relative;aspect-ratio:4/3;max-width:100%;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);box-shadow:0 30px 70px rgba(0,0,0,.5);isolation:isolate}
@media (max-width:900px){.scene{aspect-ratio:auto;height:min(28vh,250px);border-radius:18px}}
.scene-night{position:absolute;inset:0;z-index:1;background:rgba(4,4,12,.72);opacity:0;transition:opacity .5s;pointer-events:none}
.scene.night .scene-night{opacity:1}
.bg-concrete{background:radial-gradient(70% 55% at 25% 20%,rgba(255,255,255,.16),transparent 60%),linear-gradient(180deg,transparent 80%,#6e5038 80%,#5b4130 84%,#7a5a40 84.4%,#5b4130 100%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .35 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),repeating-linear-gradient(90deg,rgba(0,0,0,.12) 0 2px,transparent 2px 120px),linear-gradient(180deg,#8d857c,#625b54)}
.bg-wood{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.01 .6' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .45 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),repeating-linear-gradient(90deg,#7a5536 0 88px,#3d2817 88px 90px,#8a6040 90px 178px,#3d2817 178px 180px,#6d4a2e 180px 268px,#3d2817 268px 270px)}
.bg-brick{background:radial-gradient(80% 60% at 50% 30%,rgba(255,200,170,.12),transparent 70%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='60'%3E%3Crect width='120' height='60' fill='%23c9bfb4'/%3E%3Cg fill='%238a3f2c'%3E%3Crect x='2' y='2' width='56' height='26' rx='2'/%3E%3Crect x='62' y='2' width='56' height='26' rx='2' fill='%23974634'/%3E%3Crect x='-28' y='32' width='56' height='26' rx='2' fill='%237e3828'/%3E%3Crect x='32' y='32' width='56' height='26' rx='2'/%3E%3Crect x='92' y='32' width='56' height='26' rx='2' fill='%237e3828'/%3E%3C/g%3E%3C/svg%3E") 0 0/90px 45px}
.bg-studio{background:radial-gradient(60% 50% at 50% 35%,#3a3150,transparent 70%),linear-gradient(180deg,#1a1626 0 78%,#100d18 78%)}
.bg-pink{background:radial-gradient(60% 50% at 70% 20%,rgba(255,255,255,.35),transparent 70%),linear-gradient(180deg,#e7b9c4 0 76%,#b98a95 76% 77%,#d7a9b4 77%)}
.bg-black{background:radial-gradient(70% 60% at 50% 40%,#1b1b1f,#070708)}
.sb-top{position:absolute;left:0;right:0;top:0;z-index:4;display:flex;justify-content:space-between;align-items:start;gap:10px;padding:12px}
.sb-toggles{display:flex;gap:8px;flex-wrap:wrap}
.seg{display:inline-flex;padding:3px;border-radius:12px;background:rgba(var(--ink),.6);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.14)}
.seg button{min-height:32px;padding:6px 12px;border:0;border-radius:9px;background:none;color:var(--muted);font:700 12px/1 var(--f-body);letter-spacing:.04em;cursor:pointer;transition:.2s}
.seg button.on{background:var(--pink);color:#fff;box-shadow:0 0 12px rgba(255,63,168,.5)}
.seg.sm button{min-height:30px;padding:6px 14px}
.sb-price{display:flex;flex-direction:column;align-items:flex-end;padding:8px 12px;border-radius:12px;background:rgba(var(--ink),.6);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.14)}
.sb-price b{font:600 20px/1.1 var(--f-display);font-variant-numeric:tabular-nums}
.sb-price span{font:11px/1.2 var(--f-mono);color:var(--muted)}
.sb-canvas{position:absolute;inset:14% 6% 14%;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center}
.sb-board{position:relative;z-index:2;display:flex;max-width:100%;padding:0;transition:padding .3s,background .3s,border-radius .3s,box-shadow .3s;--bb:rgba(215,215,215,.42)}
.sb-neon{white-space:pre;line-height:1.05;color:#fff;transition:color .3s,text-shadow .3s;max-width:100%;padding:.08em .12em}
.sb-board.t-cut{padding:.35em .5em;border-radius:2em;background:var(--bb);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.35),0 10px 24px rgba(0,0,0,.25)}
.sb-board.t-board,.sb-board.t-stand{padding:.45em .7em;border-radius:6px;background:var(--bb);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.35),0 12px 26px rgba(0,0,0,.3)}
.sb-board.t-box{padding:.45em .7em;border-radius:4px;background:var(--bb);box-shadow:inset 0 0 0 2px rgba(255,255,255,.5),inset 10px 10px 0 rgba(255,255,255,.08),inset -10px -10px 0 rgba(0,0,0,.12),14px 14px 0 rgba(255,255,255,.08),0 14px 28px rgba(0,0,0,.35)}
.sb-board.clear{background:rgba(220,220,230,.18);backdrop-filter:blur(1px)}
.sb-raceway,.sb-stand,.sb-wires{display:none}
.sb-canvas.t-raceway .sb-raceway{display:block;position:relative;z-index:1;width:min(80%,var(--tw,300px));height:14px;margin-top:-22px;border-radius:4px;background:var(--bbs,#bdbdbd);box-shadow:inset 0 2px 0 rgba(255,255,255,.4),0 8px 16px rgba(0,0,0,.35)}
.sb-canvas.t-stand .sb-stand{display:block;width:44%;height:12px;margin-top:-2px;border-radius:0 0 8px 8px;background:var(--bbs,#bdbdbd);clip-path:polygon(12% 0,88% 0,100% 100%,0 100%);box-shadow:0 8px 16px rgba(0,0,0,.35)}
.sb-canvas.hang .sb-wires{display:flex;justify-content:space-between;position:absolute;top:-14%;height:calc(14% + var(--wt,40%));width:var(--ww,60%);z-index:1;pointer-events:none}
.sb-wires i{width:1px;background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.55))}
.sb-measure{position:relative;z-index:2;margin-top:14px;width:var(--tw,200px);max-width:100%;height:1px;background:rgba(255,255,255,.75);text-align:center}
.sb-measure::before,.sb-measure::after{content:"";position:absolute;top:-5px;width:1px;height:11px;background:rgba(255,255,255,.75)}
.sb-measure::before{left:0}.sb-measure::after{right:0}
.sb-measure span{position:relative;top:6px;display:inline-block;padding:2px 8px;border-radius:99px;background:rgba(0,0,0,.45);font:600 12px/1.3 var(--f-mono);color:#fff}
.sb-dimmer{position:absolute;left:12px;bottom:12px;z-index:4;display:flex;align-items:center;gap:8px;padding:6px 12px;border-radius:12px;background:rgba(var(--ink),.6);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.14);font:600 11px/1 var(--f-mono);color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.sb-dimmer input{width:90px;accent-color:var(--pink)}
.sb-bgs{display:flex;gap:8px;overflow-x:auto;padding:2px;scrollbar-width:none}
.sb-bgs::-webkit-scrollbar{display:none}
.sb-bgs button{flex:0 0 auto;width:64px;height:44px;padding:3px;border-radius:10px;border:1.5px solid var(--line);background:none;cursor:pointer;transition:.2s}
.sb-bgs button span{display:block;width:100%;height:100%;border-radius:7px;background-size:cover}
.sb-bgs button.on{border-color:var(--pink);box-shadow:0 0 12px rgba(255,63,168,.4)}
@media (max-width:900px){.sb-bgs button{width:52px;height:36px}}
@media (max-width:900px){
  .sb-stage{padding-bottom:4px}
  .sb-foot{position:static!important;padding:8px 8px 8px 14px;border-radius:14px}.sb-foot .price{font-size:20px}.sb-foot .lg-btn{min-height:42px;padding:10px 18px}
  .sb-top{padding:8px}
  .sb-toggles{flex-direction:column;gap:5px}
  .seg button{min-height:26px;padding:4px 9px;font-size:10.5px}
  .sb-price{padding:5px 9px}.sb-price b{font-size:15px}.sb-price span{font-size:9.5px}
  .sb-dimmer{left:auto;right:8px;bottom:8px;padding:5px 8px}.sb-dimmer label{display:none}.sb-dimmer input{width:70px}
  .sb-measure span{font-size:10.5px}
}
.sb-panel{display:flex;flex-direction:column;gap:22px;padding:clamp(18px,3vw,26px);border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(12px);min-width:0}
.sb-head h2{font-size:22px;font-weight:600;text-transform:uppercase;letter-spacing:.02em}
.sb-head span{font-size:14px;color:var(--muted)}
.sb-group{display:flex;flex-direction:column;gap:10px}
.sb-label{display:flex;flex-direction:column;gap:3px}
.sb-label b{font:600 15px/1.3 var(--f-body)}
.sb-label small{font-size:12.5px;color:var(--muted)}
.sb-text{border-radius:14px;border:1px solid var(--line);background:rgba(var(--ink),.65);overflow:hidden;transition:border-color .2s,box-shadow .2s}
.sb-text:focus-within{border-color:var(--pink);box-shadow:0 0 0 3px rgba(255,63,168,.18)}
.sb-text.bad{border-color:#ff5c7a}
.sb-text textarea{display:block;width:100%;min-height:86px;padding:14px 16px 6px;border:0;background:none;color:var(--fg);font:500 17px/1.45 var(--f-body);resize:none;outline:none}
.sb-align{display:flex;align-items:center;gap:6px;padding:8px 10px 10px}
.sb-align button{width:36px;height:32px;display:grid;place-items:center;border-radius:9px;border:1px solid var(--line);background:none;color:var(--muted);cursor:pointer}
.sb-align button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.sb-align button.on{color:#fff;border-color:var(--pink);background:rgba(255,63,168,.16)}
.sb-remain{margin-left:auto;font:12px/1.3 var(--f-mono);color:var(--muted)}
.sb-err{padding:10px 12px;border-radius:10px;background:rgba(235,63,52,.16);border:1px solid rgba(255,92,122,.55);color:#ffb3c1;font-size:13.5px}
.sb-fonts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
@media (max-width:520px){.sb-fonts{grid-template-columns:repeat(2,minmax(0,1fr))}}
.sb-fonts button,.sb-cards button{position:relative;display:flex;flex-direction:column;gap:4px;align-items:flex-start;text-align:left;padding:12px;border-radius:12px;border:1px solid var(--line);background:rgba(var(--ink),.5);color:var(--muted);cursor:pointer;font:inherit;transition:.2s;min-width:0}
.sb-fonts button{align-items:center;text-align:center;padding:10px 6px}
.sb-fonts button .ff{font-size:24px;line-height:1.2;color:var(--fg);white-space:nowrap}
.sb-fonts button small{font:11px/1.2 var(--f-mono);letter-spacing:.04em}
.sb-fonts button.on,.sb-cards button.on{border-color:var(--pink);background:rgba(255,63,168,.1);color:var(--fg);box-shadow:0 0 14px rgba(255,63,168,.25)}
.sb-fonts button:hover,.sb-cards button:hover{border-color:rgba(255,63,168,.5)}
.sb-cards{display:grid;gap:8px}
.sb-cards.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.sb-cards.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:520px){.sb-cards.c3{grid-template-columns:repeat(2,minmax(0,1fr))}}
.sb-cards b{font:600 14.5px/1.25 var(--f-body);color:var(--fg)}
.sb-cards small{font-size:12px;line-height:1.35}
.sb-cards em{position:absolute;top:8px;right:8px;font:700 10.5px/1 var(--f-mono);font-style:normal;color:var(--cyan)}
.sb-swatches{display:flex;flex-wrap:wrap;gap:10px}
.sb-swatches button{position:relative;width:40px;height:40px;border-radius:50%;border:2px solid transparent;background:var(--c);box-shadow:0 0 12px color-mix(in srgb,var(--c) 60%,transparent);cursor:pointer;transition:.2s}
.sb-swatches button.on{border-color:#fff;transform:scale(1.08)}
.sb-swatches button em{position:absolute;top:-8px;right:-10px;padding:2px 5px;border-radius:99px;background:var(--bg);border:1px solid var(--line);font:700 9.5px/1.2 var(--f-mono);font-style:normal;color:var(--cyan)}
.sb-swatches.bb button{box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
.sb-extra{display:flex;flex-direction:column;gap:12px;padding:14px;border-radius:14px;border:1px solid var(--line);background:rgba(var(--ink),.35)}
.sb-row{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding-bottom:12px;border-bottom:1px solid var(--line)}
.sb-row>div:first-child{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 180px}
.sb-row b{font:600 14.5px/1.3 var(--f-body)}
.sb-row small{font-size:12px;color:var(--muted)}
.sb-select{width:auto;min-height:40px;padding:6px 12px;font-size:14.5px}
.sb-cable{display:flex;gap:8px}
.sb-cable button{width:32px;height:32px;border-radius:50%;background:var(--c);border:2px solid var(--line);cursor:pointer}
.sb-cable button.on{border-color:var(--pink);box-shadow:0 0 10px rgba(255,63,168,.5)}
.sb-count{align-self:flex-end;font:11.5px/1 var(--f-mono);color:var(--muted)}
.sb-foot{position:sticky;bottom:12px;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 12px 12px 18px;border-radius:16px;background:rgba(var(--ink),.94);border:1px solid rgba(255,63,168,.35);box-shadow:0 10px 30px rgba(0,0,0,.4)}
.sb-foot>div{display:flex;flex-direction:column}
.sb-foot .price{font-size:24px}
.sb-foot small{font:11px/1.3 var(--f-mono);color:var(--muted)}
@media (max-width:860px){.sb-foot{bottom:calc(env(safe-area-inset-bottom,0px) + 84px)}}
.sb-sum{grid-template-columns:1fr 1fr}
.sb-sum .scene{border-radius:0;border:0;box-shadow:none;aspect-ratio:auto;min-height:300px}
.sum-list{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;margin:0;font-size:14px}
.sum-list dt{color:var(--muted)}
.sum-list dd{margin:0;font-weight:600;text-align:right}
/* builder */
.builder{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:22px;align-items:start}
@media (max-width:900px){.builder{grid-template-columns:1fr}}
.preview{position:sticky;top:96px;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);box-shadow:0 30px 70px rgba(0,0,0,.5)}
@media (max-width:900px){.preview{position:relative;top:0}}
.preview .sign{aspect-ratio:16/11;max-width:100%}
.preview .txt{font-size:clamp(34px,6vw,78px);word-break:break-word}
.preview.off .txt{text-shadow:none;color:#3a3446;animation:none}
.preview-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 18px;background:rgba(var(--ink),.92);border-top:1px solid var(--line);font:13px/1.3 var(--f-mono);color:var(--muted)}
.preview-bar b{color:var(--fg);font-weight:600}
.panel{display:flex;flex-direction:column;gap:20px;padding:clamp(18px,3vw,28px);border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(12px)}
.field{display:flex;flex-direction:column;gap:8px;min-width:0}
.field>label,.field>.lab{font:600 12px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.inp{width:100%;min-height:48px;padding:12px 16px;border-radius:14px;border:1px solid var(--line);background:rgba(var(--ink),.65);color:var(--fg);font:500 16px/1.4 var(--f-body);transition:border-color .2s,box-shadow .2s}
.inp:focus{outline:none;border-color:var(--pink);box-shadow:0 0 0 3px rgba(255,63,168,.18)}
textarea.inp{min-height:120px;resize:vertical}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opt{position:relative}
.opt input{position:absolute;opacity:0;pointer-events:none}
.opt span{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:8px 14px;border-radius:12px;border:1px solid var(--line);background:rgba(var(--ink),.5);font:500 14px/1.2 var(--f-body);color:var(--muted);cursor:pointer;transition:.2s}
.opt input:checked+span{color:var(--fg);border-color:var(--pink);box-shadow:0 0 14px rgba(255,63,168,.3);background:rgba(255,63,168,.1)}
.opt input:focus-visible+span{outline:2px solid var(--cyan);outline-offset:2px}
.opt.font span{font-size:20px}
.sw span{width:42px;height:42px;padding:0;border-radius:50%;background:var(--c);box-shadow:0 0 12px var(--c)}
.sw input:checked+span{border:3px solid #fff;box-shadow:0 0 22px var(--c)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:520px){.row2{grid-template-columns:1fr}}
.total{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-top:16px;border-top:1px dashed var(--line)}
.total .price{font-size:28px}
.toggle{display:flex;align-items:center;gap:10px;font:500 14px/1.2 var(--f-body);color:var(--muted)}
.toggle input{accent-color:var(--pink)}

/* quote */
.quote{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:28px;align-items:start}
@media (max-width:900px){.quote{grid-template-columns:1fr}}
.steps{display:flex;flex-direction:column;gap:18px;margin:0;padding:0;list-style:none;counter-reset:s}
.steps li{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start}
.steps li::before{counter-increment:s;content:counter(s);display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--cyan);color:var(--cyan);font:700 15px var(--f-display);box-shadow:0 0 14px rgba(63,240,255,.25)}
.steps b{display:block;font-weight:600}
.steps span{color:var(--muted);font-size:14.5px}
.drop{display:flex;flex-direction:column;align-items:center;gap:6px;padding:22px;border-radius:14px;border:1.5px dashed rgba(63,240,255,.4);background:rgba(63,240,255,.04);text-align:center;color:var(--muted);font-size:14px;cursor:pointer;transition:.2s}
.drop.over,.drop:hover{border-color:var(--cyan);background:rgba(63,240,255,.09);color:var(--fg)}
.drop b{color:var(--cyan)}
.form-ok{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:20px;border-radius:14px;border:1px solid rgba(92,242,164,.45);background:rgba(92,242,164,.08)}
.form-ok b{color:var(--ok)}
.err{color:#ff8fb8;font-size:13.5px}

/* 3D marquee testimonials */
.tm{position:relative;height:clamp(460px,52vw,620px);overflow:hidden;border-radius:var(--r-lg);border:1px solid var(--line);background:rgba(var(--ink),.55);perspective:1000px}
.tm::before,.tm::after{content:"";position:absolute;left:0;right:0;height:22%;z-index:3;pointer-events:none}
.tm::before{top:0;background:linear-gradient(180deg,var(--bg),transparent)}
.tm::after{bottom:0;background:linear-gradient(0deg,var(--bg),transparent)}
.tm-fade-x{position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(90deg,var(--bg),transparent 18%,transparent 82%,var(--bg))}
.tm-stage{position:absolute;left:50%;top:50%;display:flex;gap:16px;transform:translate(-50%,-50%) rotateX(20deg) rotateY(-10deg) rotateZ(18deg);transform-style:preserve-3d}
.tm-col{display:flex;flex-direction:column;gap:16px;animation:tmUp 40s linear infinite}
.tm-col.down{animation-name:tmDown}
.tm-col:nth-child(3){animation-duration:46s}
.tm-col:nth-child(4){animation-duration:36s}
.tm:hover .tm-col{animation-play-state:paused}
@keyframes tmUp{from{transform:translateY(0)}to{transform:translateY(-50%)}}
@keyframes tmDown{from{transform:translateY(-50%)}to{transform:translateY(0)}}
.tcard{width:270px;display:flex;flex-direction:column;gap:12px;padding:18px;border-radius:16px;background:rgba(var(--ink),.9);border:1px solid var(--line);box-shadow:0 10px 30px rgba(0,0,0,.35);transition:border-color .3s,box-shadow .3s}
.tcard:hover{border-color:rgba(255,63,168,.6);box-shadow:0 0 26px rgba(255,63,168,.3)}
.tcard .who{display:flex;align-items:center;gap:10px}
.tcard .who b{display:block;font:600 14.5px/1.2 var(--f-body)}
.tcard .who i{display:block;font:normal 12px/1.2 var(--f-mono);color:var(--muted)}
.tcard p{font-size:14.5px;color:var(--fg2);line-height:1.5}
.stars{color:var(--amber);letter-spacing:3px;text-shadow:0 0 8px rgba(255,194,74,.5);font-size:13px}
.av{width:38px;height:38px;flex:none;border-radius:50%;display:grid;place-items:center;font:700 14px var(--f-display);color:#0b0911;background:var(--c);box-shadow:0 0 12px var(--c)}
.verified{margin-left:auto;font:10.5px/1 var(--f-mono);letter-spacing:.06em;color:var(--ok);border:1px solid rgba(92,242,164,.4);border-radius:99px;padding:4px 7px}
@media (max-width:720px){.tcard{width:220px}.tm-stage{transform:translate(-50%,-50%) rotateX(16deg) rotateY(-8deg) rotateZ(14deg)}}
.rating{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.rating .big{font:600 48px/1 var(--f-display);text-shadow:0 0 24px rgba(255,194,74,.4)}

/* feature tiles */
.tiles{display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));gap:18px}
@media (max-width:980px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.tiles{grid-template-columns:1fr}}
.tile{--c:var(--pink);display:flex;flex-direction:column;gap:12px;padding:26px;border-radius:var(--r-md);background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(10px)}
.tile svg{width:32px;height:32px;color:var(--c);filter:drop-shadow(0 0 8px var(--c))}
.tile h3{font:700 18px/1.3 var(--f-display)}
.tile p{color:var(--muted);font-size:15px}
.tile .num{font:600 40px/1 var(--f-display);color:var(--c);text-shadow:0 0 16px var(--c)}

/* about */
.split2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center}
@media (max-width:860px){.split2{grid-template-columns:1fr}}
.split2 .sign{border-radius:var(--r-lg);aspect-ratio:5/4;max-width:100%;border:1px solid var(--line)}
.split2 .sign .txt{font-size:clamp(44px,6vw,80px)}
.prose{display:flex;flex-direction:column;gap:16px}
.prose h2{font-size:clamp(26px,3.6vw,42px);font-weight:600}
.prose p{color:var(--fg2);max-width:60ch}
.aims{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:12px}
.aims li{display:flex;gap:12px;align-items:start;color:var(--fg2)}
.aims li::before{content:"";flex:none;width:10px;height:10px;margin-top:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 10px var(--cyan)}

/* contact */
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:24px;align-items:start}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr}}
.c-cards{display:flex;flex-direction:column;gap:14px}
.c-card{display:flex;flex-direction:column;gap:10px;padding:20px;border-radius:var(--r-md);background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(10px)}
.c-card h3{font:700 16px/1.3 var(--f-display);display:flex;align-items:center;gap:10px}
.c-card h3 svg{width:20px;height:20px;color:var(--pink);filter:drop-shadow(0 0 6px var(--pink))}
.c-row{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 0;border-top:1px solid var(--line);font-size:15px}
.c-row:first-of-type{border-top:0}
.c-row span{color:var(--muted)}
.c-row b{font:600 14.5px/1.3 var(--f-mono);user-select:all;word-break:break-all}
.hours{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;font-size:15px}
.hours span{color:var(--muted)}
.hours b{font-variant-numeric:tabular-nums;font-weight:600}
.faq{display:flex;flex-direction:column;gap:10px;max-width:900px}
.faq details{border-radius:var(--r-md);background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(10px);transition:border-color .3s}
.faq details[open]{border-color:rgba(255,63,168,.45)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:18px 20px;list-style:none;cursor:pointer;font:600 16px/1.35 var(--f-body)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid var(--line);color:var(--pink);font:600 18px/1 var(--f-body);transition:transform .3s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 20px 18px;color:var(--muted);max-width:70ch}

/* CTA band */
.band{position:relative;overflow:hidden;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;padding:clamp(26px,4vw,44px);border-radius:var(--r-lg);border:1px solid rgba(255,63,168,.35);background:radial-gradient(80% 140% at 100% 0%,rgba(255,63,168,.22),transparent 60%),radial-gradient(60% 120% at 0% 100%,rgba(63,240,255,.14),transparent 60%),rgba(var(--ink),.8)}
.band h2{font-size:clamp(24px,3.4vw,40px);font-weight:600;max-width:20ch}
.band .acts{display:flex;gap:12px;flex-wrap:wrap}

/* wave footer */
footer{position:relative;z-index:2;margin-top:40px}
.waves{display:block;width:100%;height:clamp(70px,10vw,130px);margin-bottom:-2px}
.wave-par>use{animation:wave 22s cubic-bezier(.55,.5,.45,.5) infinite}
.wave-par>use:nth-child(1){animation-delay:-2s;animation-duration:7s}
.wave-par>use:nth-child(2){animation-delay:-3s;animation-duration:10s}
.wave-par>use:nth-child(3){animation-delay:-4s;animation-duration:13s}
.wave-par>use:nth-child(4){animation-delay:-5s;animation-duration:20s}
@keyframes wave{0%{transform:translate3d(-90px,0,0)}100%{transform:translate3d(85px,0,0)}}
.foot-body{background:var(--foot);padding-block:30px 34px}
.foot{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.4fr;gap:30px}
@media (max-width:900px){.foot{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.foot{grid-template-columns:1fr 1fr;gap:28px 18px}.foot>div:first-child,.foot>div:last-child{grid-column:1/-1}.giant{margin-top:26px}}
.foot h4{margin:0 0 14px;font:600 12px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.foot ul a{text-decoration:none;color:var(--fg2);font-size:15px;transition:color .2s}
.foot ul a:hover{color:var(--pink)}
.socials{display:flex;gap:8px;flex-wrap:wrap}
.phone{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font:600 17px/1.2 var(--f-mono)}
.phone span{user-select:all}
.news{display:flex;gap:8px}
.news .inp{min-width:0}
.giant span{display:inline-block}
.giant{margin-top:36px;font:600 clamp(36px,11vw,170px)/.95 var(--f-display);padding-block:.04em;letter-spacing:-.04em;text-align:center;color:transparent;-webkit-text-stroke:1.5px rgba(255,63,168,.55);background:linear-gradient(180deg,rgba(255,63,168,.25),transparent 75%);-webkit-background-clip:text;background-clip:text;user-select:none;white-space:nowrap;overflow:visible}
.legal{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:18px;padding-top:20px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}
@media (max-width:860px){.foot-body{padding-bottom:calc(110px + env(safe-area-inset-bottom,0px))}}

/* drawer / modal / toast */
.scrim{position:fixed;inset:0;z-index:80;background:rgba(4,3,8,.6);backdrop-filter:blur(4px);opacity:0;pointer-events:none;transition:opacity .3s}
.scrim.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;bottom:0;z-index:90;width:min(420px,100%);display:flex;flex-direction:column;background:rgba(var(--ink),.97);border-left:1px solid var(--line);transform:translateX(102%);transition:transform .45s cubic-bezier(.2,.8,.2,1);padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
.drawer.open{transform:none}
.dr-head{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--line)}
.dr-head h3{font-size:18px}
.dr-body{flex:1;overflow:auto;padding:16px 20px;display:flex;flex-direction:column;gap:12px}
.dr-foot{padding:18px 20px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:12px}
.dr-foot:empty{display:none}
.line-item{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid var(--line)}
.line-item .sign{width:72px;height:60px;border-radius:10px}
.line-item .txt{font-size:13px;padding:0 4px}
.line-item h5{margin:0;font:600 14px/1.3 var(--f-body)}
.line-item small{color:var(--muted);font-size:12px;display:block}
.qty{display:flex;align-items:center;gap:6px;margin-top:6px}
.qty button{width:28px;height:28px;border-radius:8px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--fg);cursor:pointer;font:600 15px/1 var(--f-body)}
.qty span{min-width:20px;text-align:center;font-variant-numeric:tabular-nums}
.empty{display:flex;flex-direction:column;align-items:center;gap:14px;padding:40px 10px;text-align:center;color:var(--muted)}
.empty .sign{width:180px;height:110px;border-radius:14px}
.empty .txt{font-size:28px}
.ship-bar{height:6px;border-radius:9px;background:rgba(255,255,255,.08);overflow:hidden}
.ship-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--pink),var(--cyan));box-shadow:0 0 10px var(--pink);transition:width .4s}
.modal{position:fixed;inset:0;z-index:95;display:grid;place-items:center;padding:16px;pointer-events:none}
.modal-box{width:min(860px,100%);max-height:calc(100svh - 32px);overflow:auto;display:grid;grid-template-columns:1.1fr 1fr;border-radius:var(--r-lg);background:rgba(var(--ink),.98);border:1px solid var(--line);box-shadow:0 40px 90px rgba(0,0,0,.6);transform:scale(.94);opacity:0;transition:.35s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.modal.open .modal-box{transform:none;opacity:1;pointer-events:auto}
@media (max-width:700px){.modal-box{grid-template-columns:1fr}}
.modal .sign{min-height:280px}
.modal .txt{font-size:clamp(38px,5.6vw,60px)}
.m-info{display:flex;flex-direction:column;gap:16px;padding:26px}
.m-info h3{font-size:22px}
.m-info p{color:var(--muted)}
.toast{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom,0px) + 28px);z-index:120;transform:translate(-50%,30px);opacity:0;display:flex;align-items:center;gap:10px;padding:12px 18px;border-radius:999px;background:rgba(var(--ink),.96);border:1px solid rgba(255,63,168,.5);box-shadow:0 0 24px rgba(255,63,168,.3);font:600 14px/1.2 var(--f-body);transition:.35s cubic-bezier(.2,.8,.2,1);pointer-events:none;max-width:calc(100% - 32px)}
.toast.show{opacity:1;transform:translate(-50%,0)}
@media (max-width:860px){.toast{bottom:calc(env(safe-area-inset-bottom,0px) + 90px)}}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
/* ===== additions for real data (products, cart, checkout, policy pages) ===== */
a.cat-tile{text-decoration:none}
.pimg{position:relative;display:block;overflow:hidden;background:linear-gradient(160deg,#17121f,#0b0911)}
.pimg img{display:block;width:100%;height:100%;object-fit:cover}
.pimg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.05),transparent 30%);pointer-events:none}
.card .pimg{aspect-ratio:1/1;cursor:pointer}
.card h3 a{text-decoration:none;color:inherit}
.card h3 a:hover{color:var(--pink)}
.pano-card .pimg{position:absolute;inset:0}
.line-item .pimg{width:72px;height:60px;border-radius:10px}
.modal .pimg{min-height:280px;height:100%}
.modal-box .m-desc{max-height:150px;overflow:auto;font-size:14px;color:var(--muted)}
.modal-box .m-desc table{width:100%;border-collapse:collapse}
.modal-box .m-desc td{padding:4px 6px;border:1px solid var(--line)}
.pager{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:28px}
.pager button{min-width:42px;height:42px;padding:0 12px;border-radius:12px;border:1px solid var(--line);background:rgba(var(--ink),.5);color:var(--muted);font:600 14px var(--f-body);cursor:pointer;transition:.2s}
.pager button:hover{border-color:rgba(255,63,168,.5);color:var(--fg)}
.pager button.on{border-color:var(--pink);color:var(--fg);background:rgba(255,63,168,.12);box-shadow:0 0 14px rgba(255,63,168,.25)}
.pager button:disabled{opacity:.4;cursor:default}
.f-list button.sub{padding-left:22px;font-size:13.5px}
/* product page */
.pd{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(22px,4vw,48px);align-items:start}
@media (max-width:860px){.pd{grid-template-columns:1fr}}
.pd-gal{display:flex;flex-direction:column;gap:12px}
.pd-main{border-radius:var(--r-lg);border:1px solid var(--line);box-shadow:0 30px 70px rgba(0,0,0,.5);aspect-ratio:1/1}
.pd-thumbs{display:flex;gap:10px;flex-wrap:wrap}
.pd-thumbs button{width:72px;height:72px;padding:0;border-radius:12px;border:1px solid var(--line);overflow:hidden;background:none;cursor:pointer;opacity:.7;transition:.2s}
.pd-thumbs button.on,.pd-thumbs button:hover{opacity:1;border-color:var(--pink);box-shadow:0 0 14px rgba(255,63,168,.3)}
.pd-thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.pd-info{display:flex;flex-direction:column;gap:18px}
.pd-info .cat{font:11px/1.2 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.pd-info h2{font-size:clamp(26px,3.4vw,40px);font-weight:600}
.pd-meta{display:flex;gap:18px;flex-wrap:wrap;font:12.5px/1.3 var(--f-mono);color:var(--muted)}
.pd-meta b{color:var(--fg);font-weight:600}
.pd-info .prices .price{font-size:32px}
.pd-buy{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.qtybox{display:inline-flex;align-items:center;gap:6px}
.qtybox button{width:42px;height:42px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--fg);cursor:pointer;font:600 18px/1 var(--f-body)}
.qtybox input{width:54px;height:42px;text-align:center;border-radius:12px;border:1px solid var(--line);background:rgba(var(--ink),.65);color:var(--fg);font:600 16px var(--f-body)}
.pd-desc{margin-top:28px;color:var(--fg2)}
.pd-desc table{width:100%;border-collapse:collapse;margin:8px 0}
.pd-desc td,.pd-desc th{padding:8px 10px;border:1px solid var(--line);text-align:left}
.pd-desc h1,.pd-desc h2,.pd-desc h3,.pd-desc h4{font-family:var(--f-display);margin:14px 0 6px}
.pd-desc p,.pd-desc li{color:var(--fg2);line-height:1.6}
.pd-desc img{max-width:100%;height:auto;border-radius:12px}
/* cart + checkout pages */
.cartgrid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:24px;align-items:start}
@media (max-width:900px){.cartgrid{grid-template-columns:1fr}}
.cartlist{display:flex;flex-direction:column;gap:12px}
.cart-row{display:grid;grid-template-columns:84px minmax(0,1fr) auto;gap:14px;align-items:center;padding:12px;border-radius:var(--r-md);background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(10px)}
.cart-row .pimg{width:84px;height:72px;border-radius:12px}
.cart-row h5{margin:0;font:600 15px/1.3 var(--f-body)}
.cart-row small{display:block;color:var(--muted);font-size:12.5px}
.cart-row .rm{background:none;border:0;color:var(--muted);cursor:pointer;font:12px var(--f-mono);text-decoration:underline;padding:4px 0}
.cart-row .rm:hover{color:var(--pink)}
.cart-row .tot{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:6px}
@media (max-width:520px){.cart-row{grid-template-columns:64px minmax(0,1fr)}.cart-row .pimg{width:64px;height:56px}.cart-row .tot{grid-column:1/-1;flex-direction:row;justify-content:space-between;align-items:center}}
.sumbox{position:sticky;top:100px;display:flex;flex-direction:column;gap:12px;padding:22px;border-radius:var(--r-lg);background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(12px)}
@media (max-width:900px){.sumbox{position:static}}
.sumbox h3{font-size:20px}
.sumrow{display:flex;justify-content:space-between;gap:12px;font-size:15px;color:var(--fg2)}
.sumrow.total{padding-top:12px;border-top:1px dashed var(--line);color:var(--fg);align-items:baseline}
.sumrow.total .price{font-size:26px}
.pay-opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
@media (max-width:520px){.pay-opts{grid-template-columns:1fr}}
.payment-option{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:rgba(var(--ink),.5);cursor:pointer;color:var(--fg2);font:500 14.5px var(--f-body)}
.payment-option input{accent-color:var(--pink);margin:0}
.payment-option:has(input:checked){border-color:var(--pink);background:rgba(255,63,168,.1);color:var(--fg)}
.payment-option[hidden]{display:none}
.checkout-form{display:flex;flex-direction:column;gap:18px}
.checkout-form .ttl{font:600 12px/1 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);margin-top:6px}
#stripe-card-element{padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:rgba(var(--ink),.65)}
.note-custom{padding:12px 14px;border-radius:12px;border:1px solid rgba(63,240,255,.4);background:rgba(63,240,255,.06);color:var(--fg2);font-size:14px}
.cart-empty{display:flex;flex-direction:column;align-items:center;gap:14px;padding:50px 16px;text-align:center;border:1px dashed var(--line);border-radius:var(--r-md);color:var(--muted)}
/* policy */
.policy{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}
@media (max-width:900px){.policy{grid-template-columns:1fr}}
.prose-policy{color:var(--fg2);line-height:1.7;display:block}
.prose-policy h2,.prose-policy h3{font-family:var(--f-display);color:var(--fg);margin:18px 0 6px}
.prose-policy ul,.prose-policy ol{padding-left:22px}
.prose-policy a{color:var(--cyan)}
.prose-policy table{width:100%;border-collapse:collapse}
.prose-policy td,.prose-policy th{padding:8px 10px;border:1px solid var(--line);text-align:left}
.c-cards a:not(.lg-btn){color:var(--cyan);text-decoration:none;font-size:15px}
.trk{display:flex;flex-direction:column;gap:10px;padding:20px;border-radius:var(--r-md);background:var(--panel);border:1px solid var(--line);max-width:560px}
.form-status{font-size:14px;margin-top:8px}
.form-status.ok{color:var(--ok)}
.form-status.err{color:#ff8fb8}
/* hero fits one screen, headline on 3 lines */
.hero{min-height:560px;height:100svh}
.hero-in{gap:24px;padding-block:clamp(96px,10vh,120px) clamp(28px,5vh,56px)}
.hero-copy{gap:clamp(10px,2vh,20px);max-width:720px}
.hero h1{font-size:clamp(40px,min(7.2vw,12.5svh),104px)}
.hero-cta{margin-top:4px}
@media (max-width:860px){.hero{height:auto;min-height:100svh}.hero-in{padding-bottom:clamp(110px,16vh,150px)}}
/* checkout validation + promo */
.fld-err{display:block;min-height:0;color:#ff8fb8;font-size:13px;line-height:1.35}
.fld-err:empty{display:none}
.inp.is-bad{border-color:#ff5c7a;box-shadow:0 0 0 3px rgba(255,92,122,.16)}
.phone-grp{display:flex;align-items:stretch;gap:0}
.phone-grp>span{display:grid;place-items:center;padding:0 14px;border:1px solid var(--line);border-right:0;border-radius:14px 0 0 14px;background:rgba(var(--ink),.8);color:var(--cyan);font:600 15px var(--f-mono)}
.phone-grp .inp{border-radius:0 14px 14px 0;min-width:0}
.spin{display:inline-block;width:14px;height:14px;margin-right:10px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;vertical-align:-2px}
@keyframes spin{to{transform:rotate(360deg)}}
.promo{display:flex;flex-direction:column;gap:6px}
.promo-row{display:flex;gap:8px}
.promo-row .inp{min-width:0;min-height:42px;padding:8px 12px;font-size:14.5px;text-transform:uppercase}
.promo-msg{font-size:13px;color:var(--muted)}
.promo-msg.ok{color:var(--ok)}
.promo-msg.bad{color:#ff8fb8}
.news-msg{display:block;margin-top:8px;font-size:13px}
/* skeleton cards while the shop loads */
.skel .pimg{aspect-ratio:1/1}
.skel .pimg,.sk-line{background:linear-gradient(100deg,rgba(255,255,255,.04) 30%,rgba(255,255,255,.1) 50%,rgba(255,255,255,.04) 70%);background-size:300% 100%;animation:sk 1.4s linear infinite}
.sk-line{height:14px;border-radius:7px;margin:6px 0}
.sk-line.s{width:55%}
@keyframes sk{from{background-position:100% 0}to{background-position:-100% 0}}
.card .pimg img{content-visibility:auto}
.addr-warn{border-color:rgba(255,92,122,.55);background:rgba(255,92,122,.07);display:flex;flex-direction:column;gap:8px}
.addr-warn[hidden]{display:none}
.addr-warn ul{margin:0;padding-left:20px}
/* blog */
.post-hero{border-radius:var(--r-lg);border:1px solid var(--line);box-shadow:0 30px 70px rgba(0,0,0,.5);aspect-ratio:16/9;margin-bottom:24px}
.post-body{font-size:17px;line-height:1.75}
.post-body h2,.post-body h3,.post-body h4{margin:28px 0 10px;color:var(--fg)}
.post-body p,.post-body li{color:var(--fg2)}
.post-body a{color:var(--cyan)}
.post-body ul,.post-body ol{padding-left:22px}
.post-body img{display:block;margin:18px auto;border-radius:12px;height:auto}
.post-body figure{margin:18px 0}
.post-body table{width:100%;border-collapse:collapse;display:block;overflow-x:auto}
.post-body td,.post-body th{padding:8px 10px;border:1px solid var(--line)}
.pager a.lg-btn[aria-disabled="true"]{opacity:.4;pointer-events:none}
/* blog cards: a short teaser (long excerpts are cut), shorter still on phones */
.card .excerpt{font-size:14.5px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}
.card h3 a{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}
@media (max-width:720px){.card .excerpt{-webkit-line-clamp:2;line-clamp:2;font-size:13.5px}.card h3 a{-webkit-line-clamp:2;line-clamp:2}}
/* eight dock items on narrow phones */
@media (max-width:440px){.dock{gap:4px;padding-inline:6px}.dock-item{--s:34px}}
@media (max-width:360px){.dock-item{--s:32px}}
/* phones: backdrop blur on dozens of cards makes scrolling heavy; a plain translucent panel looks the same and is much cheaper */
@media (max-width:860px){
  .card,.cat-tile,.tile,.tcard,.panel,.c-card,.filters,.sumbox{backdrop-filter:none;-webkit-backdrop-filter:none}
  .card,.cat-tile,.tile,.c-card{background:rgba(var(--ink),.82)}
}
/* off-screen animations are paused (class set by fx.js) */
.anim-off .tm-col,.anim-off .wave-par>use,.anim-off .ticker-track{animation-play-state:paused}
/* phones: the letter-by-letter heading reveal without the blur filter (a blur on every letter can't run on the GPU) */
@media (max-width:860px){
  .split.go .ch{animation-name:chInLite;animation-duration:.55s;animation-delay:calc(var(--i)*14ms)}
}
@keyframes chInLite{0%{opacity:0;transform:translateY(.4em)}100%{opacity:1;transform:none}}

/* ---------- cookie consent bar (Google Analytics, JS/analytics.js) ---------- */
.sn-consent{position:fixed;left:50%;transform:translateX(-50%);bottom:18px;z-index:88;width:min(660px,calc(100% - 24px));display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:14px 18px;border-radius:18px;background:rgba(15,13,23,.94);border:1px solid rgba(190,170,255,.2);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:#f1edff;font-size:14px;line-height:1.45;box-shadow:0 18px 50px rgba(0,0,0,.5)}
.sn-consent p{margin:0;flex:1 1 260px;color:#cfc9e6}
.sn-consent a{color:#3ff0ff}
.sn-consent div{display:flex;gap:8px}
.sn-consent button{min-height:40px;padding:8px 18px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);color:#fff;font:500 14px/1 var(--f-body);cursor:pointer}
.sn-consent .sn-consent-yes{background:rgba(255,63,168,.28);border-color:#ff3fa8}
@media (max-width:900px){.sn-consent{bottom:calc(96px + env(safe-area-inset-bottom,0px))}}

/* ---------- home hero: Night Window (always dark, in both site themes) ---------- */
.rail-hero,.rh-modal{--bg:#07060d;--wall:#0d0b14;--fg:#f1edff;--muted:#a9a2c4;--line:rgba(190,170,255,.14);--pink:#ff3fa8;--cyan:#3ff0ff;color:var(--fg);font-family:var(--f-body)}
.rail-hero .lg-btn,.rh-modal .lg-btn,:root[data-mode="light"] .rail-hero .lg-btn,:root[data-mode="light"] .rh-modal .lg-btn{--tint:255,255,255;color:#f1edff;box-shadow:inset 3px 3px .5px -3px rgba(255,255,255,.9),inset -3px -3px .5px -3px rgba(255,255,255,.85),inset 0 0 6px 6px rgba(255,255,255,.07)}
.rail-hero .lg-btn.pink,.rh-modal .lg-btn.pink,:root[data-mode="light"] .rail-hero .lg-btn.pink,:root[data-mode="light"] .rh-modal .lg-btn.pink{--tint:255,63,168;box-shadow:0 0 22px rgba(255,63,168,.35),inset 3px 3px .5px -3px rgba(255,255,255,.9),inset -3px -3px .5px -3px rgba(255,255,255,.85),inset 0 0 6px 6px rgba(255,63,168,.16)}
.rail-hero{--nav-h:88px;z-index:2;position:relative;overflow:hidden;height:100vh;height:100svh;min-height:540px;display:flex;flex-direction:column;align-items:center;padding-block:calc(var(--nav-h) + clamp(14px,3vh,36px)) clamp(16px,3.4vh,40px);
  background:
    radial-gradient(120% 70% at 50% 0%,rgba(255,255,255,.04),transparent 60%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),
    linear-gradient(180deg,#0f0d17 0%,var(--wall) 55%,var(--bg) 100%)}
.rh-bloom{position:absolute;left:0;top:0;width:900px;height:760px;margin:-380px 0 0 -450px;border-radius:50%;pointer-events:none;z-index:0;
  background:radial-gradient(closest-side,color-mix(in srgb,var(--glow,#ff3fa8) 46%,transparent),color-mix(in srgb,var(--glow,#ff3fa8) 14%,transparent) 55%,transparent 100%);
  opacity:var(--bloom,0);transform:translate3d(var(--bx,50vw),var(--by,320px),0);transition:opacity .5s,background .6s;mix-blend-mode:screen;filter:blur(6px)}
.rh-floor{position:absolute;left:0;right:0;bottom:0;height:22%;pointer-events:none;z-index:0;background:linear-gradient(180deg,transparent,rgba(0,0,0,.55))}
.rh-head{position:relative;z-index:3;flex:none;text-align:center;padding-inline:var(--gutter);display:flex;flex-direction:column;align-items:center;gap:14px}
.rh-eyebrow{margin:0;font:400 11.5px/1.3 var(--f-body);letter-spacing:.34em;text-transform:uppercase;color:var(--muted)}
.rh-eyebrow b{font-weight:500;color:var(--pink)}
.rh-head h1{margin:0;font:400 clamp(34px,4.6vw,60px)/1.04 var(--f-display);letter-spacing:-.01em;text-wrap:balance;max-width:24ch}
.rh-head h1 em{font-style:italic;color:var(--pink);text-shadow:0 0 18px rgba(255,63,168,.55)}

/* stage + track */
.rh-stage{position:relative;z-index:2;width:100%;flex:1 1 auto;min-height:0;margin-top:clamp(10px,2.4vh,26px);touch-action:pan-y}
.rh-track{position:relative;height:100%;margin-inline:auto;width:min(1240px,100%);padding-inline:var(--gutter)}
.rh-rail{position:absolute;left:var(--gutter);right:var(--gutter);top:10px;height:12px;border-radius:6px;z-index:3;
  background:linear-gradient(180deg,#c9ccd3 0%,#8e939c 38%,#5c6068 62%,#a4a8b0 100%);
  box-shadow:0 8px 18px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.6)}
.rh-rail::before{content:"";position:absolute;inset:0;border-radius:inherit;background:repeating-linear-gradient(90deg,rgba(255,255,255,.07) 0 1px,transparent 1px 3px);mix-blend-mode:overlay}
.rh-rail i{position:absolute;top:-3px;width:14px;height:18px;border-radius:4px;background:linear-gradient(180deg,#6d7179,#33363c);box-shadow:0 4px 8px rgba(0,0,0,.5)}
.rh-rail i:first-child{left:-6px}.rh-rail i:last-child{right:-6px}

.pend{position:absolute;top:16px;left:0;width:var(--bw);transform:translate3d(calc(var(--x) - 50%),0,0);z-index:2;will-change:transform}
.pend.dragging{z-index:5}
.carriage{position:absolute;left:50%;top:-2px;width:26px;height:16px;margin-left:-13px;border-radius:4px;z-index:4;background:linear-gradient(180deg,#7b7f87,#40434a);box-shadow:0 3px 6px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.35)}
.swing{position:absolute;left:0;top:12px;width:100%;transform-origin:50% 0;transform:rotate(var(--a,0rad));will-change:transform}
.cords{position:absolute;left:0;top:0;width:100%;height:var(--drop);overflow:visible;pointer-events:none}
.cords line{stroke:#22252b;stroke-width:1.6;stroke-linecap:round}
.cords circle{fill:#9aa0a8}
.board{position:absolute;left:0;top:var(--drop);width:100%;aspect-ratio:1;padding:0;border:0;border-radius:14px;background:none;cursor:grab;display:block;
  box-shadow:0 18px 30px rgba(0,0,0,.55);transition:box-shadow .55s}
.board:active{cursor:grabbing}
.board .acrylic{position:absolute;inset:0;border-radius:inherit;overflow:hidden;background:#111;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.22),inset 0 1px 0 rgba(255,255,255,.45)}
.board img{width:100%;height:100%;object-fit:cover;display:block;filter:brightness(.32) saturate(.18) contrast(1.15);transition:filter .6s cubic-bezier(.2,.8,.2,1),transform .6s;pointer-events:none;-webkit-user-drag:none;user-select:none}
.board .acrylic::after{content:"";position:absolute;inset:0;background:linear-gradient(140deg,rgba(255,255,255,.18),transparent 34%,transparent 70%,rgba(255,255,255,.06));pointer-events:none}
.board .holes{position:absolute;top:7px;left:10px;right:10px;display:flex;justify-content:space-between;pointer-events:none}
.board .holes span{width:7px;height:7px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#d7dbe2,#6f747c);box-shadow:0 1px 2px rgba(0,0,0,.6)}
.pend.on .board{box-shadow:0 18px 30px rgba(0,0,0,.5),0 0 calc(34px * var(--dim,1)) color-mix(in srgb,var(--c) 70%,transparent),0 0 calc(90px * var(--dim,1)) color-mix(in srgb,var(--c) 35%,transparent)}
.pend.on .board img{filter:brightness(calc(.45 + .65 * var(--dim,1))) saturate(1.15) contrast(1.05);transform:scale(1.03)}
.board:focus-visible{outline:2px solid var(--cyan);outline-offset:5px}
.pend .led{position:absolute;right:8px;bottom:8px;width:6px;height:6px;border-radius:50%;background:#3a3a44;transition:.4s;pointer-events:none}
.pend.on .led{background:var(--c);box-shadow:0 0 8px var(--c)}

/* info under the rail */
.rh-info{position:relative;z-index:3;flex:none;display:flex;flex-direction:column;align-items:center;gap:clamp(8px,1.6vh,14px);text-align:center;padding-inline:var(--gutter)}
.rh-kicker{margin:0;font:400 11.5px/1.3 var(--f-body);letter-spacing:.34em;text-transform:uppercase;color:var(--pink)}
.rh-info h1{margin:2px 0 0;font:400 clamp(34px,min(5.4vw,7.2vh),74px)/1 var(--f-display);letter-spacing:-.01em;text-wrap:balance}
.rh-info h1 em{font-style:italic;color:var(--pink);text-shadow:0 0 18px rgba(255,63,168,.55)}
.rh-name{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center;font:500 16px/1.3 var(--f-body)}
.rh-tag{display:inline-flex;align-items:baseline;gap:6px;padding:4px 10px;border-radius:99px;border:1px solid var(--line);background:rgba(255,255,255,.04);font:500 13px/1.2 var(--f-body);font-variant-numeric:tabular-nums}
.rh-tag s{color:var(--muted);font-weight:400;font-size:12px}
.rh-desc{margin:0;max-width:56ch;color:var(--muted);font-size:clamp(14px,min(1.3vw,2vh),17px);line-height:1.55}
@media (max-height:640px){.rh-desc{display:none}}
.rh-acts{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:6px}
.chip{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:8px 14px;border-radius:99px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--fg);font:500 13px/1 var(--f-body);cursor:pointer;transition:.25s}
.chip:hover{border-color:rgba(255,63,168,.6);background:rgba(255,63,168,.08)}
.chip .dot{width:7px;height:7px;border-radius:50%;background:var(--c,#ff3fa8);box-shadow:0 0 8px var(--c,#ff3fa8)}
.rh-hint{margin:6px 0 0;font:400 11.5px/1.3 var(--f-body);letter-spacing:.18em;text-transform:uppercase;color:rgba(169,162,196,.7)}
.rh-fade{animation:fadeIn .45s ease both}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* mobile: the rail becomes a swipeable track */
@media (max-width:900px){
  .rh-stage{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;touch-action:pan-x pan-y}
  .rh-stage::-webkit-scrollbar{display:none}
  .rh-track{width:var(--track-w);max-width:none;padding-inline:0}
  .rh-rail{left:0;right:0}
  .snap{position:absolute;top:0;height:1px;width:1px;scroll-snap-align:center}
  .rh-hint{display:none}
  .eb-x{display:none}
}

/* detail view */
.rh-modal{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:16px;background:rgba(4,3,8,.7);backdrop-filter:blur(6px);opacity:0;pointer-events:none;transition:opacity .3s}
.rh-modal.open{opacity:1;pointer-events:auto}
.rh-card{position:relative;width:min(880px,100%);max-height:calc(100svh - 32px);overflow:auto;display:grid;grid-template-columns:1.05fr 1fr;border-radius:26px;background:#0f0d17;border:1px solid var(--line);box-shadow:0 40px 90px rgba(0,0,0,.6);transform:translateY(24px) scale(.97);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.rh-modal.open .rh-card{transform:none}
@media (max-width:700px){.rh-card{grid-template-columns:1fr}}
.rh-shot{position:relative;min-height:320px;background:#000;overflow:hidden}
.rh-shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(calc(.3 + .8 * var(--dim,1))) saturate(calc(.4 + .8 * var(--dim,1)));transition:filter .2s}
.rh-shot::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 calc(120px * var(--dim,1)) color-mix(in srgb,var(--c) 45%,transparent);pointer-events:none}
.rh-body{display:flex;flex-direction:column;gap:14px;padding:clamp(20px,3vw,32px)}
.rh-body .top{display:flex;justify-content:space-between;align-items:start;gap:12px}
.rh-body .cat{font:400 11.5px/1.3 var(--f-body);letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.rh-body h2{margin:6px 0 0;font:500 clamp(28px,3.4vw,38px)/1.05 var(--f-display)}
.rh-body p{margin:0;color:var(--muted);line-height:1.6}
.rh-price{display:flex;align-items:baseline;gap:10px;font:600 30px/1 var(--f-display);color:var(--cyan);font-variant-numeric:tabular-nums}
.rh-price s{font:400 16px/1 var(--f-body);color:var(--muted)}
.rh-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;font-size:14px}
.rh-list li{display:flex;gap:10px;align-items:center}
.rh-list li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--c);box-shadow:0 0 8px var(--c);flex:none}
.dimmer{display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.03)}
.dimmer label{display:flex;justify-content:space-between;font:500 12px/1 var(--f-body);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.dimmer input{width:100%;accent-color:var(--c)}
.x-btn{width:40px;height:40px;flex:none;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--fg);cursor:pointer;display:grid;place-items:center}
.x-btn svg{width:18px;height:18px}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
.v-c{align-items:stretch;background:
  radial-gradient(90% 60% at 50% 30%,transparent 30%,rgba(5,4,9,.85) 100%),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='60'%3E%3Crect width='120' height='60' fill='%2315101a'/%3E%3Cg fill='%23241820'%3E%3Crect x='2' y='2' width='56' height='26' rx='2'/%3E%3Crect x='62' y='2' width='56' height='26' rx='2' fill='%23291b23'/%3E%3Crect x='-28' y='32' width='56' height='26' rx='2' fill='%23201519'/%3E%3Crect x='32' y='32' width='56' height='26' rx='2'/%3E%3Crect x='92' y='32' width='56' height='26' rx='2' fill='%23201519'/%3E%3C/g%3E%3C/svg%3E") 0 0/96px 48px,
  #110d14}
.v-c .rh-head{align-items:flex-start;text-align:left;width:min(1240px,100%);margin-inline:auto;flex-direction:row;justify-content:space-between}
.v-c .open-sign{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:8px;border:1.5px solid #ff3b4e;color:#ff6b7a;font:600 12px/1 var(--f-body);letter-spacing:.24em;text-shadow:0 0 8px #ff3b4e;box-shadow:0 0 14px rgba(255,59,78,.4),inset 0 0 10px rgba(255,59,78,.25);animation:openFlick 5s infinite}
@keyframes openFlick{0%,90%,100%{opacity:1}92%{opacity:.35}94%{opacity:1}96%{opacity:.5}}
.v-c .rh-copy{position:relative;z-index:3;flex:none;width:min(1240px,100%);margin-inline:auto;padding-inline:var(--gutter);display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:end;gap:clamp(16px,3vw,40px)}
.v-c .rh-copy h1{margin:0;font:400 clamp(38px,min(5.8vw,8vh),84px)/.96 var(--f-display);letter-spacing:-.015em;text-wrap:balance}
.v-c .rh-copy h1 em{font-style:italic;color:var(--pink);text-shadow:0 0 18px rgba(255,63,168,.55)}
.v-c .rh-copy .side{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.v-c .rh-acts{justify-content:flex-start}
.v-c .now{display:flex;align-items:center;gap:10px;font:500 13px/1.3 var(--f-body);color:var(--muted)}
.v-c .now b{color:var(--fg);font-weight:500}
.v-c .now i{width:8px;height:8px;border-radius:50%;background:var(--c,#ff3fa8);box-shadow:0 0 10px var(--c,#ff3fa8)}
.v-c .rh-rail{background:linear-gradient(180deg,#3a3a40,#1c1c21 60%,#2a2a30);box-shadow:0 8px 18px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.18)}
.pend.flick .board img{animation:flickOn .7s steps(1) both}
@keyframes flickOn{0%{filter:brightness(.3) saturate(.2)}15%{filter:brightness(1.1) saturate(1.1)}25%{filter:brightness(.35) saturate(.3)}40%{filter:brightness(1.05) saturate(1.1)}48%{filter:brightness(.5) saturate(.5)}60%,100%{filter:brightness(1.1) saturate(1.15)}}
@media (max-width:900px){
  .v-c .rh-copy{grid-template-columns:1fr;text-align:center;justify-items:center}
  .v-c .rh-copy .side{align-items:center}
  .v-c .rh-acts{justify-content:center}
  .v-c .rh-head{flex-direction:column;align-items:center;text-align:center;gap:10px}
}
:is(.v-b,.v-c) .board{border-radius:0;box-shadow:none!important;background:none;overflow:visible}
:is(.v-b,.v-c) .board .acrylic{background:none;box-shadow:none;overflow:visible}
:is(.v-b,.v-c) .board .acrylic::after,:is(.v-b,.v-c) .board .holes,:is(.v-b,.v-c) .pend .led{display:none}
:is(.v-b,.v-c) .cords{z-index:2}
:is(.v-b,.v-c) .cords line{stroke:#5a5560;stroke-width:1.3}
:is(.v-b,.v-c) .cords .rg{fill:none;stroke:#b9bcc3;stroke-width:1.6}
:is(.v-b,.v-c) .board img{position:absolute;inset:-6%;width:112%;height:112%;object-fit:contain;translate:var(--dx,0) 0;transform:none;
  filter:brightness(1) saturate(1.05) drop-shadow(0 0 2px var(--c)) drop-shadow(0 0 8px color-mix(in srgb,var(--c) 70%,transparent));opacity:.72}
:is(.v-b,.v-c) .pend.on .board img{opacity:1;transform:scale(1.04);transform-origin:50% 0;
  filter:brightness(1.25) saturate(1.3) drop-shadow(0 0 3px var(--c)) drop-shadow(0 0 12px var(--c)) drop-shadow(0 0 32px var(--c))}
:is(.v-b,.v-c) .pend.flick .board img{animation:neonOn .8s steps(1) both}
@keyframes neonOn{0%{opacity:.72;filter:brightness(1) saturate(1.05)}14%{opacity:1;filter:brightness(1.2) saturate(1.2) drop-shadow(0 0 10px var(--c))}26%{opacity:.5;filter:brightness(.95) saturate(.1)}42%{opacity:1;filter:brightness(1.2) saturate(1.3) drop-shadow(0 0 14px var(--c))}52%{opacity:.6;filter:brightness(1) saturate(.4)}64%,100%{opacity:1;filter:brightness(1.25) saturate(1.3) drop-shadow(0 0 3px var(--c)) drop-shadow(0 0 12px var(--c)) drop-shadow(0 0 32px var(--c))}}
/* Night window: all signs fully lit from first load; the "in the window" sign gets an extra boost */
.v-c .board img{opacity:1;filter:brightness(1.25) saturate(1.3) drop-shadow(0 0 3px var(--c)) drop-shadow(0 0 12px var(--c)) drop-shadow(0 0 30px var(--c))}
.v-c .pend.on .board img{filter:brightness(1.35) saturate(1.35) drop-shadow(0 0 4px var(--c)) drop-shadow(0 0 16px var(--c)) drop-shadow(0 0 44px var(--c))}

.v-c .rh-bloom{width:520px;height:460px;margin:-230px 0 0 -260px;opacity:0;transition:opacity .45s,background .4s}  /* glow only around the sign you point at */
.v-c.hovering .rh-bloom{opacity:var(--bloom,1)}
/* fixed pink + blue ambience on the wall (does not change with the signs) */
.v-c::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;mix-blend-mode:screen;
  background:radial-gradient(45% 55% at 28% 48%,rgba(255,63,168,.22),transparent 70%),
             radial-gradient(45% 55% at 74% 46%,rgba(90,110,255,.2),transparent 70%),
             radial-gradient(70% 50% at 50% 40%,rgba(170,80,255,.1),transparent 75%)}
.rh-modal{z-index:85}
/* phones: the site's top bar is shorter and the bottom dock needs room */
@media (max-width:900px){.rail-hero{--nav-h:64px;padding-bottom:calc(clamp(16px,3.4vh,40px) + 84px + env(safe-area-inset-bottom,0px))}}

