/* Layout: editorial bands — black stage with hairline gold rules, warm-white "paper" bands for reading-heavy sections. */
:root{
  --black:#080808; --char:#151515; --char2:#1d1c1a; --line:#2a2824; --line2:#3a372f;
  --gold:#C8A45D; --gold2:#D4AF69; --gold-dim:#8a7444; --white:#F5F2EB; --mute:#a39e92; --mute2:#6f6a60;
  --paper:#F5F2EB; --paper2:#ebe6db; --ink:#151515; --ink-mute:#5e584d; --pline:#d8d1c2;
  --ok:#6fae7a; --warn:#d8a24a; --bad:#cf6a5a;
  --f-display:"Archivo",ui-sans-serif,system-ui,-apple-system,"Segoe UI","Noto Sans SC","Noto Sans Arabic",sans-serif;
  --f-serif:"Newsreader",Georgia,"Times New Roman",serif;
  --f-body:"Archivo",ui-sans-serif,system-ui,-apple-system,"Segoe UI","Noto Sans SC","Noto Sans Arabic",sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --gut:max(16px,env(safe-area-inset-left,0px)); --gutr:max(16px,env(safe-area-inset-right,0px));
  --ease:cubic-bezier(.2,.7,.1,1);
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0}
body{background:var(--black);color:var(--white);font:400 16px/1.6 var(--f-body);font-variation-settings:"wdth" 100;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--black)}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--gold2);outline-offset:3px;border-radius:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hp{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{max-width:1240px;margin:0 auto;padding-left:var(--gut);padding-right:var(--gutr)}
@media(min-width:720px){.wrap{padding-left:max(40px,env(safe-area-inset-left,0px));padding-right:max(40px,env(safe-area-inset-right,0px))}}
.narrow{max-width:860px}
.mono{font-family:var(--f-mono);font-size:.78rem;letter-spacing:.02em;color:var(--mute)}
.gold{color:var(--gold)!important}
.ic{width:1.1em;height:1.1em;flex:none}

/* type */
h1,h2,h3,h4{font-family:var(--f-display);font-weight:400;margin:0;text-wrap:balance;letter-spacing:-.01em}
h1,.display{font-size:clamp(2.3rem,6.2vw,5.2rem);line-height:1.02;font-variation-settings:"wdth" 112;font-weight:300;letter-spacing:-.025em}
h2{font-size:clamp(1.7rem,3.4vw,2.8rem);line-height:1.08;font-variation-settings:"wdth" 108;font-weight:300}
h3{font-size:1.12rem;line-height:1.3;font-weight:500;font-variation-settings:"wdth" 100}
h4{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500;color:var(--mute)}
em{font-family:var(--f-serif);font-style:italic;font-weight:300;color:var(--gold2);letter-spacing:-.01em;font-variation-settings:normal}
.sec-light em{color:#9a7a3a}
.eyebrow{font-family:var(--f-mono);font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin:0 0 18px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.lede{font-size:clamp(1.02rem,1.5vw,1.2rem);color:var(--mute);max-width:62ch;margin:22px 0 0;line-height:1.6}
p{margin:0}
.prose p{max-width:65ch;margin:0 0 18px;color:var(--mute)}
.prose h2{font-size:clamp(1.4rem,2.4vw,1.9rem);margin:0 0 16px}
.prose h2:not(:first-child){margin-top:36px}
.sec-light .prose p{color:var(--ink-mute)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;border-radius:2px;font-weight:500;font-size:.92rem;letter-spacing:.02em;border:1px solid transparent;cursor:pointer;transition:background .3s var(--ease),color .3s,border-color .3s,transform .3s var(--ease);background:none;white-space:nowrap}
.btn .ic{transition:transform .3s var(--ease)}
.btn:hover .ic{transform:translateX(4px)}
[dir=rtl] .btn:hover .ic{transform:translateX(-4px) scaleX(-1)}
[dir=rtl] .btn .ic,[dir=rtl] .link-arrow .ic{transform:scaleX(-1)}
.btn-gold{background:var(--gold);color:var(--black)}
.btn-gold:hover{background:var(--gold2)}
.btn-gold.on{background:transparent;color:var(--gold2);border-color:var(--gold)}
.btn-line{border-color:var(--line2);color:var(--white)}
.btn-line:hover{border-color:var(--gold);color:var(--gold2)}
.sec-light .btn-line{border-color:var(--pline);color:var(--ink)}
.sec-light .btn-line:hover{border-color:var(--gold-dim);color:#7a5f2c}
.btn-sm{padding:9px 14px;font-size:.84rem}
.link-arrow{display:inline-flex;align-items:center;gap:10px;color:var(--gold2);font-weight:500;font-size:.92rem;margin-top:28px;border-bottom:1px solid transparent;transition:border-color .3s;padding-bottom:3px}
.link-arrow:hover{border-color:var(--gold)}
.sec-light .link-arrow{color:#7a5f2c}
.chip{display:inline-flex;align-items:center;font-family:var(--f-mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;border:1px solid var(--line2);border-radius:20px;color:var(--mute);white-space:nowrap}
.chip-gold{border-color:var(--gold-dim);color:var(--gold2)}
.sec-light .chip{border-color:var(--pline);color:var(--ink-mute)}
.row-actions{display:flex;flex-wrap:wrap;gap:12px}

/* header */
.hdr{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(8,8,8,.86);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.hdr-in{max-width:1400px;margin:0 auto;display:flex;align-items:center;gap:24px;height:68px;padding-left:var(--gut);padding-right:var(--gutr)}
@media(min-width:720px){.hdr-in{padding-left:max(32px,env(safe-area-inset-left,0px));padding-right:max(32px,env(safe-area-inset-right,0px))}}
.logo{display:flex;align-items:center;gap:10px;flex:none}
.logo svg{width:30px;height:30px;fill:none;stroke:var(--gold);stroke-width:1.2}
.logo-w{font-family:var(--f-display);font-variation-settings:"wdth" 125;font-weight:600;letter-spacing:.24em;font-size:1rem}
.logo-g{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.3em;color:var(--gold);border-inline-start:1px solid var(--line2);padding-inline-start:10px}
.logo-lg svg{width:40px;height:40px}.logo-lg .logo-w{font-size:1.3rem}
.nav{display:flex;align-items:center;gap:4px;margin-inline-start:auto}
.nav>a,.nav-dd>a{padding:10px 12px;font-size:.88rem;color:#cfc9bc;transition:color .25s;position:relative}
.nav>a:hover,.nav-dd>a:hover,.nav a.on{color:var(--white)}
.nav>a.on::after,.nav-dd>a.on::after{content:"";position:absolute;left:12px;right:12px;bottom:4px;height:1px;background:var(--gold)}
.nav-dd{position:relative}
.dd{position:absolute;top:100%;inset-inline-start:0;min-width:260px;background:var(--char);border:1px solid var(--line);padding:8px;display:grid;opacity:0;visibility:hidden;transform:translateY(6px);transition:.25s var(--ease);box-shadow:0 30px 60px rgba(0,0,0,.5)}
.nav-dd:hover .dd,.nav-dd:focus-within .dd{opacity:1;visibility:visible;transform:none}
.dd a{padding:10px 12px;font-size:.88rem;color:#cfc9bc;border-radius:2px}
.dd a:hover{background:var(--char2);color:var(--gold2)}
.nav-mobile-extra{display:none}
.hdr-tools{display:flex;align-items:center;gap:10px}
.lang select{background:transparent;border:1px solid var(--line2);border-radius:2px;padding:7px 8px;font-size:.8rem;color:#cfc9bc}
.lang option{background:var(--char)}
.qbtn{position:relative;display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--line2);border-radius:2px;color:#cfc9bc;transition:border-color .25s}
.qbtn:hover{border-color:var(--gold)}
.qcount{position:absolute;top:-7px;inset-inline-end:-7px;min-width:19px;height:19px;padding:0 5px;border-radius:10px;background:var(--gold);color:var(--black);font:600 .66rem/19px var(--f-mono);text-align:center}
.qcount:empty,.qcount[data-zero]{display:none}
.burger{display:none;background:none;border:1px solid var(--line2);border-radius:2px;width:38px;height:38px;place-items:center;cursor:pointer}
.burger .ic{width:20px;height:20px}
@media(max-width:1080px){
  .nav{position:fixed;inset:calc(68px + env(safe-area-inset-top,0px)) 0 0;background:var(--black);flex-direction:column;align-items:stretch;gap:0;padding:12px var(--gutr) calc(32px + env(safe-area-inset-bottom,0px)) var(--gut);overflow:auto;transform:translateY(-8px);opacity:0;visibility:hidden;transition:.3s var(--ease);margin:0}
  .nav.open{opacity:1;visibility:visible;transform:none}
  .nav>a,.nav-dd>a{display:block;font-family:var(--f-display);font-variation-settings:"wdth" 110;font-size:1.6rem;font-weight:300;padding:14px 0;border-bottom:1px solid var(--line);color:var(--white)}
  .nav>a.on::after,.nav-dd>a.on::after{display:none}
  .nav a.on{color:var(--gold2)}
  .dd{display:none}
  .nav-mobile-extra{display:grid;margin-top:18px;gap:2px}
  .nav-mobile-extra a{padding:10px 0;color:var(--mute);font-size:.95rem}
  .burger{display:grid}
  .hdr-cta{display:none}
}
@media(max-width:420px){.lang select{width:64px}.logo-g{display:none}}

/* page transition */
main{display:block;min-height:60vh}
main.enter{animation:enter .55s var(--ease)}
@keyframes enter{from{opacity:.25;transform:translateY(10px)}to{opacity:1;transform:none}}

/* hero */
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line);background:radial-gradient(120% 90% at 70% 30%,#16140f 0%,var(--black) 60%)}
.hero-map{position:absolute;inset:0;opacity:.95}
.routemap{width:100%;height:100%;display:block}
.grat line{stroke:#1f1d19;stroke-width:1}
.grat .eq{stroke:#2c2820;stroke-dasharray:2 6}
.arc{fill:none;stroke:var(--gold);stroke-width:1.1;stroke-opacity:.75;stroke-dasharray:1200;stroke-dashoffset:0;animation:draw 2.4s var(--ease) both;animation-delay:var(--d)}
@keyframes draw{from{stroke-dashoffset:1200}to{stroke-dashoffset:0}}
.dest{fill:var(--black);stroke:var(--gold2);stroke-width:1.3}
.origin{fill:var(--gold2)}
.origin-ring{fill:none;stroke:var(--gold);stroke-opacity:.6;animation:pulse 3s ease-out infinite;transform-origin:center;transform-box:fill-box}
@keyframes pulse{0%{transform:scale(.6);opacity:1}100%{transform:scale(2.2);opacity:0}}
.maplabels text{font:500 11px var(--f-mono);fill:var(--mute);letter-spacing:.1em}
.origin-label{font:500 11px var(--f-mono);fill:var(--gold2);letter-spacing:.14em}
.hero-in{position:relative;padding-block:clamp(72px,12vw,150px) clamp(64px,9vw,120px)}
.hero-in::before{content:"";position:absolute;inset:0 30% 0 -10%;background:linear-gradient(90deg,rgba(8,8,8,.92) 30%,rgba(8,8,8,0));z-index:-1;pointer-events:none}
[dir=rtl] .hero-in::before{background:linear-gradient(-90deg,rgba(8,8,8,.92) 30%,rgba(8,8,8,0));inset:0 -10% 0 30%}
.hero .display{max-width:13ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:38px}
.lanes{position:relative;border-top:1px solid var(--line);overflow:hidden;background:rgba(8,8,8,.7)}
.lanes-track{display:flex;width:max-content;animation:lanes 60s linear infinite}
.lanes span{display:flex;gap:10px;align-items:baseline;padding:16px 28px;border-inline-end:1px solid var(--line);font-size:.82rem;color:var(--mute);white-space:nowrap}
.lanes b{font:500 .76rem var(--f-mono);color:var(--gold2);letter-spacing:.1em}
@keyframes lanes{to{transform:translateX(-50%)}}
@media(max-width:720px){.hero-map{opacity:.22}.maplabels,.origin-label{display:none}.hero-in::before{inset:0}}

/* sections */
.sec{padding-block:clamp(64px,9vw,128px)}
.sec-tight{padding-block:clamp(36px,5vw,64px)}
.sec+.sec:not(.sec-light):not(.split-sec){border-top:1px solid var(--line)}
.sec-light{background:var(--paper);color:var(--ink)}
.sec-light .eyebrow{color:#8a6c33}
.sec-light h4,.sec-light .mono{color:var(--ink-mute)}
.sec-head{margin-bottom:clamp(36px,5vw,64px);max-width:860px}
.sec-head.row{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;max-width:none}
.sec-head.row .link-arrow{margin:0}
.phead{padding-block:clamp(64px,10vw,140px) clamp(40px,6vw,72px);border-bottom:1px solid var(--line);background:linear-gradient(180deg,#0e0d0b,var(--black))}
.phead-sm{padding-block:clamp(44px,6vw,80px) clamp(28px,4vw,48px)}
.phead-sm h1{font-size:clamp(2rem,4.6vw,3.6rem)}
.sample-note{margin-top:28px;font-size:.84rem;color:var(--mute2);display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;max-width:80ch}
.sec-light .sample-note{color:var(--ink-mute)}

/* route stages */
.route{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line2)}
.route li{padding:28px 24px 0 0;position:relative;display:grid;gap:12px;align-content:start}
.route li::before{content:"";position:absolute;top:-4px;inset-inline-start:0;width:7px;height:7px;background:var(--gold);transform:rotate(45deg)}
.route-n{font:500 .78rem var(--f-mono);color:var(--gold)}
.route p{color:var(--mute);font-size:.92rem}
.sec-light .route{border-color:var(--pline)}.sec-light .route p{color:var(--ink-mute)}
@media(max-width:960px){.route{grid-template-columns:1fr 1fr;row-gap:36px}}
@media(max-width:560px){.route{grid-template-columns:1fr}}

/* category grid */
.catgrid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--pline);border-inline-start:1px solid var(--pline)}
.catcell{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:26px 22px;border-bottom:1px solid var(--pline);border-inline-end:1px solid var(--pline);transition:background .35s var(--ease)}
.catcell:hover{background:var(--white)}
.cat-ic{width:30px;height:30px;color:#9a7a3a;stroke-width:1.5;transition:transform .4s var(--ease)}
.catcell:hover .cat-ic{transform:scale(1.12)}
.catcell-name{font-weight:500;font-size:.95rem}
.catcell-n{font:.74rem var(--f-mono);color:var(--ink-mute)}
@media(max-width:960px){.catgrid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.catgrid{grid-template-columns:1fr 1fr}.catcell{padding:18px 14px;gap:10px}.cat-ic{width:24px;height:24px}}
@media(max-width:400px){.catgrid{grid-template-columns:1fr}}

/* product cards */
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.cat-main .pgrid{grid-template-columns:repeat(3,1fr)}
@media(max-width:1100px){.pgrid{grid-template-columns:repeat(3,1fr)}.cat-main .pgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.pgrid,.cat-main .pgrid{grid-template-columns:1fr 1fr;gap:12px}}
@media(max-width:380px){.pgrid,.cat-main .pgrid{grid-template-columns:1fr}}
.pcard{background:var(--char);border:1px solid var(--line);display:flex;flex-direction:column;transition:border-color .35s var(--ease),transform .45s var(--ease);min-width:0}
.pcard:hover{border-color:var(--gold-dim);transform:translateY(-4px)}
.pcard-link{display:block;overflow:hidden}
.pcard:hover .art-ic{transform:scale(1.08) translateY(-3px)}
.pcard-body{padding:18px;display:flex;flex-direction:column;gap:10px;flex:1}
.pcard-meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font:.68rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.pcard h3{font-size:.98rem;line-height:1.35}
.pcard h3 a:hover{color:var(--gold2)}
.pcard-spec{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:auto 0 0;padding-top:12px;border-top:1px solid var(--line)}
.pcard-spec dt{font:.64rem var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mute2)}
.pcard-spec dd{margin:2px 0 0;font:500 .86rem var(--f-mono);font-variant-numeric:tabular-nums;color:var(--white)}
.btn-quote{display:flex;align-items:center;justify-content:center;gap:6px;background:none;border:1px solid var(--line2);color:#cfc9bc;padding:9px;font-size:.8rem;border-radius:2px;cursor:pointer;transition:.25s}
.btn-quote:hover{border-color:var(--gold);color:var(--gold2)}
.btn-quote.on{background:rgba(200,164,93,.1);border-color:var(--gold-dim);color:var(--gold2)}
@media(max-width:560px){.pcard-body{padding:12px}.pcard-spec{grid-template-columns:1fr}.pcard h3{font-size:.9rem}}

/* product art */
.art{position:relative;aspect-ratio:4/3.4;max-width:100%;background:radial-gradient(80% 70% at 50% 38%,#24211b 0%,#121110 70%);display:grid;place-items:center;overflow:hidden}
.art::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(var(--rot,30deg),transparent 0 22px,rgba(212,175,105,.035) 22px 23px)}
.art img{width:100%;height:100%;object-fit:cover}
.art-plinth{position:absolute;bottom:18%;width:46%;height:9%;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.65),transparent)}
.art-ic{width:38%;height:38%;color:var(--gold2);stroke-width:1.15;position:relative;transition:transform .6s var(--ease);filter:drop-shadow(0 8px 18px rgba(200,164,93,.18))}
.art-sku,.art-hs{position:absolute;font:500 .62rem var(--f-mono);letter-spacing:.12em;color:var(--mute2)}
.art-sku{top:12px;inset-inline-start:12px}.art-hs{top:12px;inset-inline-end:12px}
.art-big{aspect-ratio:1;border:1px solid var(--line)}
.art-big .art-sku,.art-big .art-hs{font-size:.74rem;top:20px}.art-big .art-sku{inset-inline-start:20px}.art-big .art-hs{inset-inline-end:20px}

/* tabs */
.tabs{display:inline-flex;border:1px solid var(--line2);border-radius:2px;padding:3px;gap:2px;flex-wrap:wrap}
.tabs button{background:none;border:0;padding:8px 14px;font-size:.84rem;color:var(--mute);cursor:pointer;border-radius:1px;transition:.25s}
.tabs button.on{background:var(--gold);color:var(--black)}
.tabs button:not(.on):hover{color:var(--white)}

/* split + photo */
.split-sec{border-top:1px solid var(--line)}
.split{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(32px,6vw,88px);align-items:center}
.split.rev>:first-child{order:2}
.split h2{margin-bottom:22px}
.split p{color:var(--mute);max-width:56ch}
.sec-light .split p{color:var(--ink-mute)}
@media(max-width:860px){.split{grid-template-columns:1fr}.split.rev>:first-child{order:0}}
.photo{position:relative;margin:0;aspect-ratio:5/4;max-width:100%;overflow:hidden;background:#1a1814}
.photo img{width:100%;height:100%;object-fit:cover}
.photo figcaption{position:absolute;inset-inline-start:16px;bottom:14px;font:500 .68rem var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:rgba(245,242,235,.75);background:rgba(8,8,8,.55);padding:6px 10px;backdrop-filter:blur(6px)}
.ph-containers{background:linear-gradient(180deg,rgba(8,8,8,0) 50%,rgba(8,8,8,.6)),repeating-linear-gradient(90deg,#1f1c17 0 9px,#2a261f 9px 12px,#17150f 12px 18px),linear-gradient(#1a1814,#1a1814)}
.ph-containers::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 0 31%,#0b0a08 31% 33%,transparent 33% 64%,#0b0a08 64% 66%,transparent 66%),linear-gradient(90deg,transparent 0 33%,rgba(200,164,93,.16) 33% 34%,transparent 34% 66%,rgba(200,164,93,.16) 66% 67%,transparent 67%);mix-blend-mode:normal}
.ph-containers::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 75% 15%,rgba(212,175,105,.22),transparent 70%)}
.ph-bench{background:radial-gradient(50% 40% at 50% 60%,rgba(212,175,105,.16),transparent 70%),linear-gradient(180deg,#14130f 0 62%,#22201a 62% 100%)}
.ph-bench::before{content:"";position:absolute;left:18%;right:18%;bottom:30%;height:28%;background:repeating-linear-gradient(90deg,#2b2820 0 16%,transparent 16% 21%);border-bottom:1px solid var(--gold-dim)}
.ph-office{background:linear-gradient(180deg,#0f0e0c,#1b1915),repeating-linear-gradient(90deg,transparent 0 46px,rgba(212,175,105,.07) 46px 47px)}
.ph-office::before{content:"";position:absolute;inset:16% 12% 0;background:repeating-linear-gradient(180deg,#24211b 0 6px,transparent 6px 22px),repeating-linear-gradient(90deg,transparent 0 30px,#0d0c0a 30px 32px);opacity:.8;clip-path:polygon(0 30%,40% 0,100% 18%,100% 100%,0 100%)}
.ph-grid{background:linear-gradient(rgba(212,175,105,.09) 1px,transparent 1px) 0 0/24px 24px,linear-gradient(90deg,rgba(212,175,105,.09) 1px,transparent 1px) 0 0/24px 24px,#171511}
.ph-grid::before{content:"";position:absolute;left:20%;top:28%;width:52%;height:36%;border:1px solid var(--gold);box-shadow:0 0 0 12px rgba(200,164,93,.06)}
.ph-grid::after{content:"152.4 mm";position:absolute;left:20%;top:calc(28% - 26px);font:500 .7rem var(--f-mono);color:var(--gold2);letter-spacing:.1em}
.ph-factory{background:linear-gradient(180deg,#121110,#1d1b16),#151310}
.ph-factory::before{content:"";position:absolute;inset:auto 0 26% 0;height:30%;background:repeating-linear-gradient(90deg,#2b271f 0 40px,#1a1814 40px 52px);transform:perspective(500px) rotateX(48deg);transform-origin:bottom}
.ph-factory::after{content:"";position:absolute;inset:0;background:radial-gradient(40% 30% at 50% 10%,rgba(212,175,105,.25),transparent 70%)}

/* QC strip */
.qc-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--pline)}
.qc{padding:28px 24px 28px 0;display:grid;gap:10px;align-content:start}
.qc+.qc{padding-inline-start:24px;border-inline-start:1px solid var(--pline)}
.qc-code{font:500 1.6rem var(--f-mono);color:#9a7a3a;letter-spacing:.04em}
.qc p{color:var(--ink-mute);font-size:.92rem}
@media(max-width:860px){.qc-strip{grid-template-columns:1fr 1fr}.qc:nth-child(3){padding-inline-start:0;border:0}}
@media(max-width:480px){.qc-strip{grid-template-columns:1fr}.qc,.qc+.qc{padding-inline-start:0;border-inline-start:0;border-bottom:1px solid var(--pline)}}

/* ticks */
.ticks{list-style:none;padding:0;margin:24px 0 0;display:grid;gap:12px}
.ticks li{display:flex;gap:12px;align-items:flex-start;color:var(--mute)}
.ticks .ic{color:var(--gold);margin-top:4px}
.sec-light .ticks li{color:var(--ink-mute)}.sec-light .ticks .ic{color:#9a7a3a}

/* markets */
.mkt-list{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line2)}
.mkt{padding:22px 18px 22px 0;border-bottom:1px solid var(--line);display:grid;gap:6px;transition:color .25s}
.mkt:hover .mkt-name{color:var(--gold2)}
.mkt-name{font-family:var(--f-display);font-variation-settings:"wdth" 110;font-size:1.2rem;font-weight:300}
.mkt-sea{font:.72rem var(--f-mono);color:var(--mute)}
@media(max-width:860px){.mkt-list{grid-template-columns:1fr 1fr}}
.mkt-detail{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--line2)}
.mkd{padding:32px 32px 32px 0;border-bottom:1px solid var(--line)}
.mkd:nth-child(even){padding-inline-start:32px;border-inline-start:1px solid var(--line)}
.mkd h2{font-size:1.6rem;margin-bottom:18px}
.mkd dl{margin:0;display:grid;gap:12px}
.mkd dt{font:.66rem var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.mkd dd{margin:3px 0 0;color:var(--mute);font-size:.94rem}
@media(max-width:860px){.mkt-detail{grid-template-columns:1fr}.mkd:nth-child(even){padding-inline-start:0;border-inline-start:0}}

/* cols, tables, steps */
.cols3,.cols2{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,56px)}
.cols2{grid-template-columns:1fr 1fr}
.col{display:grid;gap:10px;align-content:start;padding-top:20px;border-top:1px solid var(--line2)}
.sec-light .col{border-color:var(--pline)}
.col p{color:var(--mute)}.sec-light .col p{color:var(--ink-mute)}
.col h3{font-size:1.25rem;font-weight:400;font-variation-settings:"wdth" 105}
@media(max-width:860px){.cols3,.cols2{grid-template-columns:1fr}}
.tbl-wrap{overflow-x:auto;border:1px solid var(--line)}
.sec-light .tbl-wrap{border-color:var(--pline);background:var(--white)}
.tbl{border-collapse:collapse;width:100%;min-width:640px;font-size:.92rem}
.tbl th,.tbl td{padding:16px 18px;text-align:start;vertical-align:top;border-bottom:1px solid var(--line)}
.sec-light .tbl th,.sec-light .tbl td{border-color:var(--pline)}
.tbl thead th{font:500 .7rem var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--gold);background:var(--char)}
.sec-light .tbl thead th{background:var(--paper2);color:#8a6c33}
.tbl tbody th{font-weight:500;white-space:nowrap}
.tbl td{color:var(--mute)}.sec-light .tbl td{color:var(--ink-mute)}
.tbl tr:last-child>*{border-bottom:0}
.cmp thead th:not(:first-child){font:400 1.3rem var(--f-display);font-variation-settings:"wdth" 110;letter-spacing:0;text-transform:none;color:var(--white)}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 56px}
.steps li{display:grid;grid-template-columns:48px 1fr;gap:16px;padding:28px 0;border-top:1px solid var(--line)}
.steps p{color:var(--mute);margin-top:8px}
@media(max-width:760px){.steps{grid-template-columns:1fr}}
.svc-list{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line2)}
.svc{position:relative;padding:40px 56px 40px 0;border-bottom:1px solid var(--line);display:grid;gap:14px;transition:background .35s}
.svc:nth-child(even){padding-inline-start:40px;border-inline-start:1px solid var(--line)}
.svc-n{font:500 .78rem var(--f-mono);color:var(--gold)}
.svc p{color:var(--mute);max-width:44ch}
.svc-ar{position:absolute;inset-inline-end:16px;top:44px;width:22px;height:22px;color:var(--gold);transition:transform .35s var(--ease)}
.svc:hover h2{color:var(--gold2)}.svc:hover .svc-ar{transform:translateX(6px)}
@media(max-width:760px){.svc-list{grid-template-columns:1fr}.svc:nth-child(even){padding-inline-start:0;border-inline-start:0}}
.ind-list{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line2)}
.ind{padding:32px 28px 32px 0;border-bottom:1px solid var(--line);display:grid;gap:12px;align-content:start}
.ind:not(:nth-child(3n+1)){padding-inline-start:28px;border-inline-start:1px solid var(--line)}
.ind-head{display:flex;justify-content:space-between;align-items:center}
.ind-ic{width:36px;height:36px;color:var(--gold);stroke-width:1.3}
.ind h2{font-size:1.5rem}
.ind p{color:var(--mute);font-size:.94rem}
.ind-comp{font-size:.86rem!important}
.ind .link-arrow{margin-top:6px}
@media(max-width:960px){.ind-list{grid-template-columns:1fr 1fr}.ind:not(:nth-child(3n+1)){padding-inline-start:0;border-inline-start:0}.ind:nth-child(even){padding-inline-start:28px;border-inline-start:1px solid var(--line)}}
@media(max-width:640px){.ind-list{grid-template-columns:1fr}.ind:nth-child(even){padding-inline-start:0;border-inline-start:0}}

/* CTA band */
.band-cta{background:var(--char);border-top:1px solid var(--line);padding-block:clamp(56px,8vw,104px)}
.cta-in{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap}
.cta-in h2{max-width:20ch}
.cta-actions{display:flex;gap:12px;flex-wrap:wrap}

/* catalogue */
.cat-layout{display:grid;grid-template-columns:250px 1fr;gap:40px;align-items:start}
.cat-main{min-width:0}
.filters{position:sticky;top:calc(88px + env(safe-area-inset-top,0px));max-height:calc(100vh - 110px);overflow:auto;padding-inline-end:6px}
.filters summary{font:500 .72rem var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--gold);cursor:pointer;list-style:none;padding-bottom:14px;border-bottom:1px solid var(--line)}
.filters summary::-webkit-details-marker{display:none}
.fgroup{padding:18px 0;border-bottom:1px solid var(--line);display:grid;gap:8px}
.fgroup h4{margin-bottom:4px}
.radio,.check{display:flex;align-items:center;gap:10px;font-size:.88rem;color:#cfc9bc;cursor:pointer}
.radio em{margin-inline-start:auto;font:normal .72rem var(--f-mono);color:var(--mute2)}
.radio input,.check input{accent-color:var(--gold);width:16px;height:16px;flex:none}
.radio:has(input:checked) span{color:var(--gold2)}
.fgroup input[type=range]{accent-color:var(--gold);width:100%}
output{font-family:var(--f-mono);color:var(--gold2)}
.filters .btn{margin-top:16px}
@media(max-width:900px){.cat-layout{grid-template-columns:1fr;gap:20px}.filters{position:static;max-height:none;border:1px solid var(--line);padding:14px}.filters summary{border:0;padding:0}.filters details[open] summary{padding-bottom:12px;border-bottom:1px solid var(--line)}}
.cat-bar{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.search{flex:1 1 280px;display:flex;align-items:center;gap:10px;border:1px solid var(--line2);padding:0 14px;background:var(--char);transition:border-color .25s}
.search:focus-within{border-color:var(--gold)}
.search .ic{color:var(--mute)}
.search input{flex:1;min-width:0;background:none;border:0;padding:13px 0;outline:none}
.sort{display:flex;align-items:center;gap:10px;font-size:.84rem;color:var(--mute)}
.sort select,.field select{background:var(--char);border:1px solid var(--line2);padding:12px;border-radius:0}
.count{margin-bottom:14px}
.empty{border:1px dashed var(--line2);padding:48px 28px;text-align:center;display:grid;gap:14px;justify-items:center}
.empty p{color:var(--mute);max-width:52ch}

/* product detail */
.crumbs{margin-bottom:28px;display:flex;gap:6px;flex-wrap:wrap}
.crumbs a:hover{color:var(--gold2)}
.pd{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:start}
.pd-media{position:sticky;top:calc(96px + env(safe-area-inset-top,0px))}
.pd-info{display:grid;gap:20px;min-width:0}
.pd-info h1{font-size:clamp(2rem,3.8vw,3.2rem)}
.pd-info>p{color:var(--mute)}
.pd-price{font:400 1.6rem var(--f-display);font-variation-settings:"wdth" 110;color:var(--gold2);display:flex;gap:14px;align-items:baseline;flex-wrap:wrap}
.pd-custom{display:flex;gap:8px;flex-wrap:wrap}
.spec{margin:6px 0 0;border-top:1px solid var(--line2)}
.spec div{display:grid;grid-template-columns:200px 1fr;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}
.spec dt{font:.7rem var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mute2);padding-top:3px}
.spec dd{margin:0;font-size:.94rem;font-variant-numeric:tabular-nums}
@media(max-width:860px){.pd{grid-template-columns:1fr}.pd-media{position:static}.spec div{grid-template-columns:1fr;gap:2px}}

/* forms */
.form{display:grid;gap:22px;margin-top:32px}
.form fieldset{border:0;padding:0;margin:0;display:grid;gap:18px}
.form legend{font:500 .72rem var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--gold);padding-bottom:12px;margin-bottom:6px;border-bottom:1px solid var(--line);width:100%}
.sec-light .form legend{color:#8a6c33;border-color:var(--pline)}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:620px){.fgrid{grid-template-columns:1fr}}
.field{display:grid;gap:7px;min-width:0}
.field>span{font-size:.8rem;color:var(--mute);letter-spacing:.02em}
.field input,.field textarea,.field select{width:100%;background:var(--char);border:1px solid var(--line2);padding:13px 14px;border-radius:0;outline:none;transition:border-color .2s}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--gold)}
.field textarea{resize:vertical}
.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:var(--bad)}
.sec-light .field>span{color:var(--ink-mute)}
.sec-light .field input,.sec-light .field textarea,.sec-light .field select{background:var(--white);border-color:var(--pline);color:var(--ink)}
.sec-light .field input:focus,.sec-light .field textarea:focus,.sec-light .field select:focus{border-color:var(--gold-dim)}
.sec-light .check{color:var(--ink)}
.sec-light .sort select{background:var(--white)}
.checks{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.checks-label{grid-column:1/-1;font-size:.8rem;color:var(--mute)}
@media(max-width:620px){.checks{grid-template-columns:1fr}}
.form-foot{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.form-fine{font-size:.8rem;color:var(--mute2);max-width:40ch}
.sec-light .form-fine{color:var(--ink-mute)}
.form-status:empty{display:none}
.form-status{border:1px solid var(--gold-dim);background:rgba(200,164,93,.07);padding:18px 20px;display:grid;gap:10px}
.form-status.err{border-color:var(--bad);background:rgba(207,106,90,.08)}
.form-status b{font-family:var(--f-mono);color:var(--gold2)}
.sec-light .form-status b{color:#7a5f2c}
.sec-light .form-status{background:var(--white)}

/* quote list */
.qlist{display:grid;border-top:1px solid var(--line)}
.qrow{display:grid;grid-template-columns:84px 1fr 120px 40px;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.qrow-art .art{aspect-ratio:1}.qrow-art .art-sku,.qrow-art .art-hs{display:none}
.qrow-info{display:grid;gap:4px;min-width:0}
.qrow-qty input{width:100%;background:var(--char);border:1px solid var(--line2);padding:10px;font-family:var(--f-mono)}
.icon-btn{background:none;border:1px solid var(--line2);width:38px;height:38px;display:grid;place-items:center;cursor:pointer;color:var(--mute)}
.icon-btn:hover{color:var(--bad);border-color:var(--bad)}
@media(max-width:560px){.qrow{grid-template-columns:64px 1fr 40px}.qrow-qty{grid-column:2}.qrow .icon-btn{grid-row:1;grid-column:3}}

/* contact */
.contact-layout{display:grid;grid-template-columns:1fr 340px;gap:clamp(32px,5vw,72px);align-items:start}
.contact-layout .form{margin-top:0}
.contact-side{display:grid;gap:0;border-top:1px solid var(--line2)}
.cside{padding:24px 0;border-bottom:1px solid var(--line);display:grid;gap:12px}
.cside p{color:var(--mute);font-size:.92rem}
.sel{user-select:all;color:var(--white)}
.mini-steps{margin:0;padding-inline-start:20px;color:var(--mute);font-size:.92rem;display:grid;gap:6px}
@media(max-width:960px){.contact-layout{grid-template-columns:1fr}}

/* footer */
.ftr{border-top:1px solid var(--line);padding-block:72px calc(32px + env(safe-area-inset-bottom,0px));background:var(--black)}
.ftr-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
.ftr-top>div{display:grid;gap:10px;align-content:start}
.ftr-top a{color:var(--mute);font-size:.9rem;transition:color .2s}
.ftr-top a:hover{color:var(--gold2)}
.ftr-top h4{margin-bottom:6px}
.ftr-brand p{color:var(--mute);font-size:.9rem;margin-top:8px}
.ftr-bot{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:56px;padding-top:24px;border-top:1px solid var(--line);font-size:.8rem;color:var(--mute2)}
.notice{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;max-width:80ch}
@media(max-width:860px){.ftr-top{grid-template-columns:1fr 1fr}.ftr-brand{grid-column:1/-1}}

/* WhatsApp float + toast */
.wa-float{position:fixed;inset-inline-end:calc(20px + env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:40;display:flex;align-items:center;gap:10px;background:var(--char);border:1px solid var(--gold-dim);color:var(--gold2);padding:12px 16px;border-radius:30px;box-shadow:0 18px 40px rgba(0,0,0,.45);font-size:.86rem;font-weight:500;transition:transform .3s var(--ease),background .3s}
[dir=rtl] .wa-float{inset-inline-end:auto;right:auto;left:calc(20px + env(safe-area-inset-left,0px))}
.wa-float:hover{transform:translateY(-3px);background:#1f1c16}
.wa-float .ic{width:22px;height:22px}
@media(max-width:560px){.wa-float span{display:none}.wa-float{padding:13px}}
.toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);background:var(--white);color:var(--ink);padding:12px 18px;font-size:.88rem;opacity:0;pointer-events:none;transition:.35s var(--ease);z-index:70;max-width:calc(100vw - 32px)}
.toast.show{opacity:1;transform:translate(-50%,0)}
.modal-back{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:80;display:grid;place-items:center;padding:20px}
.modal{background:var(--char);border:1px solid var(--line2);max-width:460px;width:100%;padding:28px;display:grid;gap:16px}
.modal p{color:var(--mute)}

/* ADMIN */
.adm{display:grid;grid-template-columns:220px 1fr;min-height:calc(100vh - 68px)}
.adm-side{border-inline-end:1px solid var(--line);padding:28px 16px;display:grid;gap:4px;align-content:start;background:#0c0c0b}
.adm-side button{background:none;border:0;text-align:start;padding:11px 14px;color:var(--mute);cursor:pointer;border-radius:2px;display:flex;justify-content:space-between;font-size:.9rem}
.adm-side button.on{background:var(--char2);color:var(--gold2)}
.adm-side button:hover:not(.on){color:var(--white)}
.adm-side .badge{font:.7rem var(--f-mono);background:var(--gold);color:var(--black);border-radius:10px;padding:1px 7px}
.adm-main{padding:32px clamp(16px,3vw,40px) 64px;min-width:0}
.adm-head{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.adm-head h1{font-size:1.9rem}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:28px}
.kpi{background:var(--char);border:1px solid var(--line);padding:20px;display:grid;gap:6px}
.kpi b{font:300 2.2rem var(--f-display);font-variation-settings:"wdth" 110;color:var(--white);font-variant-numeric:tabular-nums}
.kpi span{font:.68rem var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.adm-tools{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.adm-tools .search{flex:1 1 240px}
.adm-tbl{overflow-x:auto;border:1px solid var(--line)}
.adm-tbl table{width:100%;border-collapse:collapse;font-size:.86rem;min-width:720px}
.adm-tbl th,.adm-tbl td{padding:11px 14px;border-bottom:1px solid var(--line);text-align:start;vertical-align:middle}
.adm-tbl thead th{font:500 .66rem var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--gold);background:var(--char);position:sticky;top:0}
.adm-tbl tbody tr:hover{background:#111}
.adm-tbl td.num{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.pill{display:inline-block;font:500 .66rem var(--f-mono);letter-spacing:.08em;text-transform:uppercase;padding:3px 9px;border-radius:12px;border:1px solid}
.st-new{color:var(--gold2);border-color:var(--gold-dim);background:rgba(200,164,93,.1)}
.st-contacted{color:#8fb6d8;border-color:#3e5468}
.st-quoted{color:var(--ok);border-color:#3d5a42}
.st-closed{color:var(--mute2);border-color:var(--line2)}
.st-off{color:var(--bad);border-color:#5a3530}
.adm-act{display:flex;gap:6px}
.adm-act button{background:none;border:1px solid var(--line2);color:var(--mute);padding:5px 10px;font-size:.78rem;cursor:pointer;border-radius:2px}
.adm-act button:hover{color:var(--gold2);border-color:var(--gold-dim)}
.adm-act button.danger:hover{color:var(--bad);border-color:var(--bad)}
.drawer-back{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:80}
.drawer{position:fixed;top:0;bottom:0;inset-inline-end:0;width:min(560px,100vw);background:var(--char);border-inline-start:1px solid var(--line2);z-index:81;overflow:auto;padding:calc(24px + env(safe-area-inset-top,0px)) max(24px,env(safe-area-inset-right,0px)) calc(32px + env(safe-area-inset-bottom,0px)) 24px;display:grid;gap:18px;align-content:start}
.drawer-head{display:flex;justify-content:space-between;align-items:center}
.drawer .field input,.drawer .field textarea,.drawer .field select{background:var(--black)}
.inq-detail{display:grid;gap:10px}
.inq-detail div{display:grid;grid-template-columns:150px 1fr;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);font-size:.9rem}
.inq-detail dt{font:.68rem var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mute2)}
.inq-detail dd{margin:0;white-space:pre-wrap;word-break:break-word}
.login{max-width:420px;margin:80px auto;padding:0 var(--gutr) 0 var(--gut);display:grid;gap:18px}
.login p{color:var(--mute)}
.code-out{width:100%;min-height:160px;background:var(--black);border:1px solid var(--line2);font:.76rem var(--f-mono);padding:12px;color:var(--mute)}
.imgslots{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}
.imgslot{border:1px solid var(--line);padding:12px;display:grid;gap:10px}
.imgslot .photo{aspect-ratio:16/10}
.imgslot .photo figcaption{font-size:.58rem}
@media(max-width:860px){.adm{grid-template-columns:1fr}.adm-side{grid-auto-flow:column;grid-auto-columns:max-content;overflow-x:auto;border-inline-end:0;border-bottom:1px solid var(--line);padding:10px var(--gutr) 10px var(--gut)}.kpis{grid-template-columns:1fr 1fr}.inq-detail div{grid-template-columns:1fr;gap:2px}}


/* 3D JOURNEY — sticky stage, scroll drives the camera */
.journey{position:relative;height:700vh;background:var(--black)}
.j-stage{position:sticky;top:calc(68px + env(safe-area-inset-top,0px));height:calc(100vh - 68px - env(safe-area-inset-top,0px));height:calc(100svh - 68px - env(safe-area-inset-top,0px));overflow:hidden;border-bottom:1px solid var(--line)}
.j-canvas,.j-fallback{position:absolute;inset:0;width:100%;height:100%;display:block}
.j-fallback{opacity:0}
.j-nogl .j-fallback{opacity:.9}.j-nogl .j-canvas{display:none}
.j-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(8,8,8,.88) 0%,rgba(8,8,8,.55) 30%,rgba(8,8,8,0) 58%),linear-gradient(0deg,rgba(8,8,8,.7) 0%,rgba(8,8,8,0) 26%),linear-gradient(180deg,rgba(8,8,8,.45),rgba(8,8,8,0) 18%)}
[dir=rtl] .j-shade{background:linear-gradient(-90deg,rgba(8,8,8,.88) 0%,rgba(8,8,8,.55) 30%,rgba(8,8,8,0) 58%),linear-gradient(0deg,rgba(8,8,8,.7) 0%,rgba(8,8,8,0) 26%)}
.j-pins{position:absolute;inset:0;pointer-events:none}
.j-pin{position:absolute;left:0;top:0;opacity:0;transition:opacity .4s;display:flex;align-items:center;gap:8px;white-space:nowrap;will-change:transform}
.j-pin i{width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:var(--gold2);box-shadow:0 0 0 0 rgba(212,175,105,.6);animation:pin 2.4s ease-out infinite;flex:none}
.j-pin b{font:500 .66rem var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--white);background:rgba(8,8,8,.72);border:1px solid var(--line2);padding:5px 9px;margin-top:-5px;backdrop-filter:blur(6px)}
.j-pin.on b{border-color:var(--gold);color:var(--gold2)}
@keyframes pin{0%{box-shadow:0 0 0 0 rgba(212,175,105,.55)}100%{box-shadow:0 0 0 16px rgba(212,175,105,0)}}
.j-cards{position:absolute;inset:0;pointer-events:none}
.j-card{position:absolute;left:max(40px,env(safe-area-inset-left,0px));bottom:clamp(64px,10vh,120px);width:min(460px,calc(100% - 80px));opacity:0;transform:translateY(18px);transition:opacity .55s var(--ease),transform .7s var(--ease);pointer-events:none;display:grid;gap:16px}
.j-card.on{opacity:1;transform:none;pointer-events:auto}
.j-card h2{font-size:clamp(1.8rem,3.4vw,2.9rem)}
.j-card>p:not(.eyebrow):not(.j-mk):not(.j-cue){color:#cfc9bc;max-width:44ch}
.j-card .link-arrow{margin-top:4px}
.j-card .eyebrow{margin:0}
.j-n{display:inline-grid;place-items:center;width:30px;height:30px;border:1px solid var(--gold);border-radius:50%;font-size:.7rem;letter-spacing:0;color:var(--gold2)}
.j-intro{width:min(680px,calc(100% - 80px));top:50%;bottom:auto;transform:translateY(-46%)}
.j-intro.on{transform:translateY(-50%)}
.j-intro .lede{margin:0;color:#cfc9bc}
.j-intro .hero-actions{margin-top:10px}
.j-cue{display:flex;align-items:center;gap:12px;margin-top:18px!important;color:var(--mute)}
.j-cue span{width:1px;height:34px;background:linear-gradient(var(--gold),transparent);animation:cue 2s var(--ease) infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.j-outro{width:min(620px,calc(100% - 80px))}
.j-mk{display:flex;flex-wrap:wrap;gap:8px}
.j-mk span{font:.72rem var(--f-mono);letter-spacing:.06em;border:1px solid var(--line2);padding:5px 10px;color:#cfc9bc;background:rgba(8,8,8,.5)}
.j-rail{position:absolute;right:max(32px,env(safe-area-inset-right,0px));top:50%;transform:translateY(-50%);display:grid;gap:4px}
.j-rail button{display:flex;align-items:center;justify-content:flex-end;gap:12px;background:none;border:0;cursor:pointer;color:var(--mute2);font:500 .7rem var(--f-mono);letter-spacing:.14em;text-transform:uppercase;padding:8px 0;transition:color .3s}
.j-rail button span{order:2;width:26px;height:1px;background:currentColor;font-size:0;transition:width .4s var(--ease)}
.j-rail button:hover,.j-rail button.on{color:var(--gold2)}
.j-rail button.on span{width:46px}
.j-bar{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--line)}
.j-bar i{display:block;height:100%;background:var(--gold);transform-origin:left;transform:scaleX(0)}
[dir=rtl] .j-card{left:auto;right:max(40px,env(safe-area-inset-right,0px))}
[dir=rtl] .j-rail{right:auto;left:max(32px,env(safe-area-inset-left,0px))}
[dir=rtl] .j-bar i{transform-origin:right}
@media(max-width:860px){
  .journey{height:600vh}
  .j-shade{background:linear-gradient(0deg,rgba(8,8,8,.96) 0%,rgba(8,8,8,.75) 38%,rgba(8,8,8,0) 66%),linear-gradient(180deg,rgba(8,8,8,.5),rgba(8,8,8,0) 16%)}
  .j-card,.j-intro,.j-outro,[dir=rtl] .j-card{left:var(--gut);right:var(--gutr);width:auto;bottom:calc(58px + env(safe-area-inset-bottom,0px));top:auto;transform:translateY(18px)}
  .j-card.on,.j-intro.on{transform:none}
  .j-intro .display{font-size:clamp(2.2rem,10vw,3.2rem)}
  .j-intro .lede{font-size:.95rem}
  .j-cue{display:none!important}
  .j-rail,[dir=rtl] .j-rail{top:auto;bottom:22px;left:var(--gut);right:calc(var(--gutr) + 66px);transform:none;grid-auto-flow:column;justify-content:space-between;gap:0}
  .j-rail button{font-size:0;padding:8px 0;gap:0}
  .j-rail button span{width:100%;min-width:28px;height:2px}
  .j-rail button.on span{width:100%}
  .j-pin b{display:none}.j-pin.on b{display:block}
  .j-card .hero-actions .btn{padding:12px 16px}
}
@media(prefers-reduced-motion:reduce){.j-card{transition:none}}

/* LANGUAGES — Chinese uses the device's native CJK faces; Arabic uses IBM Plex Sans Arabic with Amiri for accents */
:root[lang^="zh"]{--f-display:"Archivo","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",sans-serif;--f-body:"Archivo","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",sans-serif}
:root[lang^="zh"] em{font-family:"Songti SC","STSong","Noto Serif SC","SimSun",serif;font-style:normal;font-weight:400}
:root[lang^="zh"] h1,:root[lang^="zh"] .display{letter-spacing:0;line-height:1.15}
:root[lang^="zh"] h2{letter-spacing:0;line-height:1.25}
:root[lang^="zh"] .lede,:root[lang^="zh"] p{line-height:1.8}
:root[lang="ar"]{--f-display:"IBM Plex Sans Arabic","Archivo",sans-serif;--f-body:"IBM Plex Sans Arabic","Archivo",sans-serif}
:root[lang="ar"] em{font-family:"Amiri","IBM Plex Sans Arabic",serif;font-style:normal;font-weight:400}
:root[lang="ar"] *:not(.logo-w):not(.logo-g):not(.art-sku):not(.art-hs){letter-spacing:0!important}
:root[lang="ar"] .eyebrow,:root[lang="ar"] h4,:root[lang="ar"] .pcard-meta,:root[lang="ar"] .pcard-spec dt,:root[lang="ar"] .spec dt,:root[lang="ar"] .mkd dt,:root[lang="ar"] .form legend,:root[lang="ar"] .j-pin b,:root[lang="ar"] .j-rail button,:root[lang="ar"] .chip,:root[lang="ar"] .tbl thead th,:root[lang="ar"] .filters summary,:root[lang="ar"] .mono{font-family:"IBM Plex Sans Arabic",var(--f-mono);text-transform:none}
:root[lang="ar"] .eyebrow{font-size:.86rem}
:root[lang="ar"] h1,:root[lang="ar"] .display{line-height:1.25;font-weight:400}
:root[lang="ar"] h2{line-height:1.35;font-weight:400}
:root[lang="ar"] p,:root[lang="ar"] .lede{line-height:1.85}
:root[lang="ar"] .art,:root[lang="ar"] .pcard-spec dd,:root[lang="ar"] .pd-price,:root[lang="ar"] .qrow-qty input{direction:ltr}
:root[lang="ar"] .pd-price{justify-content:flex-end}
:root[lang="ar"] .lanes{direction:ltr}
:root[lang="ar"] .catcell,:root[lang="ar"] .route li,:root[lang="ar"] .qc{text-align:right}
:root[lang="ar"] .route li{padding:28px 0 0 24px}
:root[lang="ar"] .route li::before{inset-inline-start:0}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}.lanes-track{animation:none}}
