/* =====================================================================
   PALAK · "Maharaja noir"
   A dark jewellery-vault theme: near-black surfaces, antique gold type
   and hairlines, emerald and oxblood as quiet accents. This file sits on
   top of style.css and redefines the look; layout lives in style.css.
   ===================================================================== */
:root{
  --paper:#0b0a09; --paper-2:#110f0d; --white:#16130f;
  --ink:#f1e6d0; --ink-2:#e4d7bd; --ink-3:#cdbfa5;
  --muted:#a59a8a; --muted-d:#9b9180;
  --line:rgba(201,164,100,.16); --line-d:rgba(201,164,100,.2);
  --accent:#c9a464; --accent-l:#e3c993; --gold:#c9a464; --gold-d:#8f7344; --silver:#efe5d1;
  --noir:#060505; --emerald:#123a2c; --oxblood:#3d1216;
  --serif:'Cormorant Garamond','Times New Roman',serif; --sans:'Jost','Helvetica Neue',Arial,sans-serif;
  color-scheme:dark;
}
html{background:var(--paper)}
body{background:var(--paper);color:var(--ink-3);font-weight:300;letter-spacing:.01em}
::selection{background:var(--gold);color:var(--noir)}
:focus-visible{outline-color:var(--gold)}

/* ---------- type ---------- */
h1,h2,h3{font-family:var(--serif);font-weight:400;color:var(--ink);letter-spacing:-.005em}
h1 em,h2 em,h3 em{color:var(--gold);font-weight:300}
h2{font-size:clamp(2.9rem,6.4vw,6rem);line-height:1.02}
.eyebrow{font-family:var(--sans);font-size:0.6875rem;font-weight:500;letter-spacing:.34em;color:var(--gold)}
.eyebrow::before{width:2.5rem;background:linear-gradient(90deg,transparent,var(--gold))}
p{color:var(--ink-3)}
.lead,.phead p,.head p,.pink-txt p,.pd-text{color:var(--ink-3);font-weight:300}
a{transition:color .3s}

/* ---------- buttons: sharp, gold, engraved ---------- */
.btn{border-radius:0;padding:1.05rem 2.1rem;font-family:var(--sans);font-size:0.75rem;font-weight:500;letter-spacing:.24em;text-transform:uppercase;background:var(--gold);color:var(--noir);border:1px solid var(--gold);box-shadow:none}
.btn::before{background:var(--ink);border-radius:0;transform:translateX(-101%)}
.btn:hover{color:var(--noir);border-color:var(--ink);box-shadow:0 0 0 1px rgba(201,164,100,.25),0 1rem 2.5rem -1rem rgba(201,164,100,.45);transform:none}
.btn:hover::before{transform:none}
.btn.ghost,.dark .btn.ghost{background:transparent;color:var(--ink);border-color:rgba(201,164,100,.55)}
.btn.ghost:hover{color:var(--noir);border-color:var(--ink)}
.btn.light{background:var(--ink);color:var(--noir);border-color:var(--ink)}
.btn.light::before{background:var(--gold)}
.btn.sm{padding:0.75rem 1.4rem;font-size:0.6875rem}
.btn svg{width:0.95rem;height:0.95rem}

/* ---------- loader ---------- */
#pre{background:var(--noir)}
#pre b{background:linear-gradient(100deg,#7d6540 20%,#f6e2b4 50%,#7d6540 80%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;font-weight:300}
#pre i{background:rgba(201,164,100,.18)}#pre i::after{background:var(--gold)}
#prog{background:var(--gold)}

/* ---------- menu ---------- */
#nav{border-bottom:1px solid transparent}
#nav.stuck{background:rgba(8,7,6,.82);border-color:var(--line);backdrop-filter:blur(1rem) saturate(1.2);-webkit-backdrop-filter:blur(1rem) saturate(1.2)}
.logo b{font-family:var(--serif);font-weight:400;letter-spacing:.32em;color:var(--ink)}
.logo small{color:var(--gold);letter-spacing:.46em}
.lk{font-family:var(--sans);font-size:0.6875rem;font-weight:500;letter-spacing:.24em;text-transform:uppercase}
.lk a{color:var(--ink-3)}.lk a:hover,.lk a[aria-current="page"]{color:var(--gold)}
.lk a::after{background:var(--gold)}
.mb i{background:var(--ink)}
.ic:hover{background:rgba(201,164,100,.1)}
.wc{background:var(--gold);color:var(--noir)}
.nav-cta.btn{padding:0.8rem 1.4rem}
.sheet{background:var(--noir)}
.sheet .sh-links a{border-color:var(--line);color:var(--ink);font-weight:300}
.sheet .sh-links a small{color:var(--gold)}
.sheet .sh-links a[aria-current="page"]{color:var(--gold)}

/* ---------- home: cinematic opening ---------- */
.hero{background:radial-gradient(60% 70% at 72% 46%,rgba(201,164,100,.12),transparent 62%),radial-gradient(40% 50% at 20% 90%,rgba(18,58,44,.35),transparent 70%),var(--paper)}
.hero h1{font-weight:300;font-size:clamp(3.75rem,8.2vw,8.5rem);line-height:.95;letter-spacing:-.01em;color:var(--ink)}
.hero h1 em{font-style:italic;color:var(--gold)}
.hero .eyebrow{color:var(--gold)}
.viewer.free .halo{background:radial-gradient(closest-side,rgba(201,164,100,.16),rgba(201,164,100,.05) 55%,transparent 72%)}
.viewer.free .halo::before{border-color:rgba(201,164,100,.22)}
.viewer.free .halo::after{border-color:rgba(201,164,100,.18)}
.viewer.free .finish{background:rgba(10,9,8,.6);border:1px solid var(--line)}
.finish{border-radius:0;border-color:var(--line);background:rgba(10,9,8,.55)}
.finish button{border-radius:0;font-family:var(--sans);font-size:0.6875rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3)}
.finish button.on,.viewer.free .finish button.on{background:var(--gold);color:var(--noir)}
.vcap>.vname{font-weight:400;color:var(--ink)}
.vcap>.vname:hover{color:var(--gold)}
.vcap>span{color:var(--muted)}
.vdots button{background:rgba(201,164,100,.25)}.vdots button.on{background:var(--gold)}
.vprog{background:var(--line)}.vprog b{background:var(--gold)}
.trust{border-color:var(--line);background:var(--paper)}
.trust svg{color:var(--gold)}
.trust b{color:var(--ink);font-weight:400}
.trust span{color:var(--muted)}

/* ticker: gold engraved band */
.tick{background:var(--noir);border-color:var(--line)}
.tick span{color:var(--gold);font-weight:300}
.tick span::after{background:var(--gold);transform:rotate(45deg);border-radius:0;width:0.35rem;height:0.35rem}

/* section rhythm: ornamental dividers */
.pad,.pink,.making{position:relative}
.gems-sec{background:var(--paper)}
.gems-sec::before,.pink::before,.making::before,.sig-h::before{content:"";position:absolute;left:50%;top:0;width:min(40rem,70%);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,rgba(201,164,100,.45),transparent)}
.gems-sec::after,.pink::after,.making::after,.sig-h::after{content:"";position:absolute;left:50%;top:-0.3rem;width:0.6rem;height:0.6rem;transform:translateX(-50%) rotate(45deg);border:1px solid var(--gold);background:var(--paper)}
.sig-h{position:relative}

/* cards and tiles: framed like vitrines */
.pc,.ct-t,.cc,.gc{border-radius:2px;border:1px solid var(--line);background:radial-gradient(70% 58% at 50% 40%,#2a2520 0%,#110f0d 70%,#0a0908 100%)}
.pc:hover,.ct-t:hover{border-color:rgba(201,164,100,.45);box-shadow:0 2rem 4rem -2rem rgba(0,0,0,.8),0 0 0 1px rgba(201,164,100,.12)}
.pc h3,.ct-t h3{font-weight:400;color:var(--ink)}
.pc .sub,.ct-t div span{color:var(--gold);letter-spacing:.2em}
.pc .tg{border-radius:0;background:rgba(6,5,5,.6);border-color:var(--line);color:var(--ink-3)}
.pc .go,.ct-t .go{border-radius:0;border-color:var(--line)}
.pc:hover .go,.ct-t:hover .go{background:var(--gold);color:var(--noir);border-color:var(--gold)}
.hrt{border-radius:0;background:rgba(6,5,5,.55);border-color:var(--line)}
.hrt.on,.hrtb.on{color:var(--gold)}
.g-panna{background:radial-gradient(70% 55% at 50% 38%,#163b2d,#08130e 74%)}
.g-manik{background:radial-gradient(70% 55% at 50% 38%,#43161b,#12070a 74%)}
.g-neelam{background:radial-gradient(70% 55% at 50% 38%,#18234a,#070a17 74%)}
.g-navratna{background:radial-gradient(70% 55% at 50% 38%,#3a301d,#120e07 74%)}
.g-moti{background:radial-gradient(70% 55% at 50% 38%,#34302a,#0f0d0b 74%)}
.ct-all{background:var(--noir);border:1px solid var(--line);border-radius:2px}
.ct-mini a{border-radius:0;background:rgba(201,164,100,.04);border-color:var(--line)}
.ct-mini a:hover{border-color:rgba(201,164,100,.5)}
.ct-all-h h3{color:var(--ink)}

/* Pink City story: oxblood and gold */
.pink{background:radial-gradient(60% 80% at 85% 50%,rgba(94,26,31,.45),transparent 70%),var(--paper)}
.pink-art{border-radius:2px;border:1px solid var(--line);background:radial-gradient(65% 60% at 50% 45%,#3a2a22,#0c0908 76%);box-shadow:0 3rem 6rem -3rem rgba(0,0,0,.9)}
.pink-txt h2 em{color:var(--gold)}

/* showcase */
.sig-h{background:var(--paper)}
.show{background:var(--noir)}
.stick::before{background:radial-gradient(55% 60% at 68% 50%,rgba(201,164,100,.12),transparent 70%)}
.sc-txt h2{font-weight:300}.sc-txt h2 em{color:var(--gold)}
.sc-txt li{border-color:var(--line)}
.sc-txt li::before{background:var(--gold);border-radius:0;transform:rotate(45deg);width:0.4rem;height:0.4rem}
.dots button{border-color:var(--gold)}.dots button.on{background:var(--gold);border-color:var(--gold)}
.sc-link{color:var(--gold)}
.sc-play .vprog{background:var(--line)}

/* dark bands (call to action) */
.dark,.cta-band{background:radial-gradient(60% 120% at 50% 0%,rgba(201,164,100,.1),transparent 60%),var(--noir);color:var(--ink-3)}
.cta-band h2{font-weight:300}

/* ---------- page headers ---------- */
.phead{background:radial-gradient(50% 80% at 80% 30%,rgba(201,164,100,.08),transparent 70%)}
.phead h1{font-weight:300;font-size:clamp(3.25rem,7.4vw,7.25rem);color:var(--ink)}
.ph-art{border-radius:2px;border:1px solid var(--line);background:radial-gradient(65% 60% at 50% 45%,#2c2620,#0b0908 76%)}

/* ---------- collection ---------- */
.chips{background:var(--paper)}
.chips button{border-radius:0;background:transparent;border-color:var(--line);color:var(--ink-3);font-family:var(--sans);font-size:0.75rem;letter-spacing:.12em;text-transform:uppercase;font-weight:400}
.chips button span{color:var(--gold);opacity:.8}
.chips button:hover{border-color:var(--gold)}
.chips button.on{background:var(--gold);color:var(--noir);border-color:var(--gold)}.chips button.on span{color:var(--noir)}
.gems-f button{border-radius:0;color:var(--muted)}
.gems-f button.on{background:transparent;border-color:var(--gold);color:var(--ink)}
.cat-h{border-color:var(--line)}.cat-h h2{font-weight:300}
.c3ctl button{border-radius:0;border-color:var(--line)}
.c3ctl button:hover{background:var(--gold);color:var(--noir)}
.cc .cap span{color:var(--gold)}

/* ---------- 3D studio + piece pages ---------- */
.st-cv,.pd-view{border-radius:2px;border:1px solid var(--line);background:radial-gradient(60% 55% at 50% 44%,#2b2520 0%,#110f0d 58%,#070606 100%)}
.tabs button{border-radius:0;background:transparent;border-color:var(--line);color:var(--ink-3)}
.tabs button.on{background:var(--gold);color:var(--noir);border-color:var(--gold)}
.tabs button .im{border-radius:0}
.chips.sm button{font-size:0.6875rem}
.st-more{color:var(--gold)}
.crumbs{color:var(--muted)}.crumbs [aria-current]{color:var(--gold)}
.pd-info h1{font-weight:300;font-size:clamp(3rem,5vw,5.25rem)}
.pd-sub{color:var(--gold);letter-spacing:.24em}
.pd-tags span{border-radius:0;background:transparent;border-color:var(--line);color:var(--ink-3);letter-spacing:.06em}
.pd-hl{border-color:var(--line)}.pd-hl h2{color:var(--gold);letter-spacing:.24em}
.pd-hl li,.facts-l li{color:var(--ink-3)}
.pd-hl li::before,.facts-l li::before{border-radius:0;transform:rotate(45deg);background:var(--gold)}
.pd-note{color:var(--muted)}
.pd-set{border-radius:0;background:transparent;border-color:var(--line)}
.pd-set:hover{border-color:var(--gold)}
.pd-set img,.dr-item img,.srch-res img,.svd img,.tabs button .im{background:radial-gradient(circle,#2e2822,#0c0a09)}
.pd-acc,.pd-acc details{border-color:var(--line)}
.pd-acc summary{font-weight:400;color:var(--ink)}
.pd-acc summary::after{color:var(--gold)}
.pd-acc details>div{color:var(--muted)}
.szt th{color:var(--gold);border-color:var(--line)}.szt td{color:var(--ink-3);border-color:var(--line)}
.pd-full{border-radius:0}
.rel.alt{background:var(--paper-2)}
.pd-bar{border-radius:0;background:rgba(6,5,5,.94);border:1px solid var(--line)}
.pd-bar .btn{background:var(--gold);border-color:var(--gold);color:var(--noir)}

/* ---------- about ---------- */
.pil{border-color:var(--gold)}.pil svg{stroke:var(--gold)}.pil h3{font-weight:400}
.gd{border-color:var(--gold)}.gd h3{font-weight:400}.gd span{color:var(--gold)}
.cr{border-color:var(--gold)}.cr b{color:var(--gold)}.cr h3{font-weight:400}
.steps5 li{border-radius:0;background:linear-gradient(180deg,#141210,#0d0c0a);border-color:var(--line)}
.steps5 svg{color:var(--gold)}.steps5 .n{color:var(--gold)}
.insta{background:radial-gradient(60% 100% at 50% 100%,rgba(94,26,31,.35),transparent 70%),var(--noir)}

/* ---------- enquire ---------- */
form{background:linear-gradient(180deg,#141210,#0e0c0b);border:1px solid var(--line);border-radius:2px;box-shadow:0 3rem 6rem -3rem rgba(0,0,0,.9)}
.fld label,.fld .lbl{color:var(--gold);letter-spacing:.24em}
.fld input,.fld textarea{background:#0a0908;border-color:var(--line);border-radius:0;color:var(--ink)}
.fld input::placeholder,.fld textarea::placeholder{color:#6f675c}
.fld input:focus,.fld textarea:focus{background:#050404;border-color:var(--gold);box-shadow:0 0 0 3px rgba(201,164,100,.15)}
.opts button{border-radius:0;background:transparent;border-color:var(--line);color:var(--ink-3)}
.opts button:hover{border-color:var(--gold)}
.opts button.on{background:var(--gold);color:var(--noir);border-color:var(--gold)}
.out{background:#0a0908;border-color:var(--line);border-radius:0}
.out pre{color:var(--ink)}
.how{background:transparent;border:1px solid var(--line);border-radius:2px}
.steps li::before{background:transparent;border:1px solid var(--gold);color:var(--gold);border-radius:0;transform:rotate(45deg)}
.steps b{color:var(--ink);font-weight:400}
.svd a{border-radius:0;background:transparent;border-color:var(--line)}
.info div{border-color:var(--line)}

/* ---------- overlays ---------- */
.dr-panel,.srch-in{background:#0d0c0a;border-left:1px solid var(--line)}
.srch-in{border:1px solid var(--line);border-radius:2px}
.dr-panel footer{background:#0d0c0a;border-color:var(--line)}
.dr-panel header,.dr-item,.srch-bar{border-color:var(--line)}
.srch-res a:hover,.srch-res a:focus-visible{background:rgba(201,164,100,.08)}
.srch-hint button{border-radius:0;border-color:var(--line)}
.toast{background:var(--gold);color:var(--noir);border-radius:0}.toast a{color:var(--noir)}
.skip{background:var(--gold);color:var(--noir)}

/* ---------- footer ---------- */
footer.ft{background:var(--noir);border-top:1px solid var(--line)}
.ft-logo b{color:var(--ink);font-weight:300;letter-spacing:.32em}
.ft-logo small{color:var(--gold)}
.ft-col h4{color:var(--gold);letter-spacing:.3em}
.ft-col a{color:var(--ink-3)}
footer .credit b{color:var(--ink);border-color:var(--gold)}

/* ---------- 404 ---------- */
.nf h1 em{color:var(--gold)}
.ct-all .btn.light{color:var(--noir)}
.pd-bar{color:var(--ink)}.pd-bar small{color:var(--gold)}
.pd-act{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:0.5rem}
.pd-act .btn{white-space:nowrap}
.pd-act .btn:first-child{padding-inline:1.25rem}
@media (max-width:600px){.pd-act{grid-template-columns:1fr auto}.pd-act .btn:first-child{grid-column:1/-1}}
.ph-compact h1{font-size:clamp(2.75rem,4.2vw,4rem)}
@media (max-width:600px){
  .btn{letter-spacing:.16em;padding:1rem 1.25rem}
  .cta .btn,.cta .btn:first-child{flex:1 1 100%;justify-content:center;white-space:nowrap}
  .eyebrow{letter-spacing:.24em}
  .hero h1{font-size:clamp(3.25rem,15vw,4.25rem)}
}

/* =================== Home: full-screen centred scene =================== */
.hero.hero-full{position:relative;min-height:100svh;padding:0;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;
  background:radial-gradient(42% 52% at 50% 54%,rgba(201,164,100,.16),transparent 66%),radial-gradient(70% 45% at 50% 105%,rgba(18,58,44,.4),transparent 70%),radial-gradient(40% 40% at 0% 0%,rgba(61,18,22,.35),transparent 70%),var(--paper)}
.hero-full .hf-view{position:absolute;inset:0;height:auto;max-height:none;aspect-ratio:auto;margin:0;display:block;z-index:1;background:none;box-shadow:none;border-radius:0}
.hero-full .hf-view .vwrap{position:absolute;left:0;right:0;top:34%;bottom:22%;height:auto;min-height:0;max-height:none;margin:0;flex:none}
.hero-full .hf-view .halo{position:absolute;left:50%;top:50%;width:auto;height:118%;aspect-ratio:1;transform:translate(-50%,-50%)}
.hero-full .hf-view .v-poster{width:auto;height:80%;max-width:80%}
.hf-top{position:relative;z-index:2;text-align:center;padding-top:clamp(6.75rem,12vh,8.5rem);pointer-events:none}
.hf-top .eyebrow{justify-content:center}
.hf-top .eyebrow::after{content:"";width:2.5rem;height:1px;background:linear-gradient(90deg,var(--gold),transparent)}
.hero-full h1{font-size:clamp(3rem,6vw,6.25rem);line-height:1;margin:1.1rem auto 0;font-weight:300}
.hero-full h1 .ln{text-align:center}
.hf-bot{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:end;gap:2rem;padding-bottom:clamp(1.75rem,4.5vh,3rem)}
.hf-left .lead{max-width:30ch;font-size:0.9375rem;line-height:1.6;margin:0 0 1.25rem}
.hf-left .cta{flex-wrap:nowrap;gap:0.625rem}
.hf-cap{text-align:center;padding:0;min-width:16rem}
.hf-cap .vfoot{margin-top:0.875rem}
.hf-right{display:flex;flex-direction:column;align-items:flex-end;gap:1.5rem}
.hf-right .finish{position:static}
.hf-scroll{display:flex;align-items:center;gap:0.75rem;font-size:0.625rem;letter-spacing:.32em;text-transform:uppercase;color:var(--muted)}
.hf-scroll i{display:block;width:1px;height:2.5rem;background:linear-gradient(var(--gold),transparent);transform-origin:top;animation:hfs 2.4s var(--out) infinite}
@keyframes hfs{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
@media (max-width:1100px){.hf-left .cta{flex-wrap:wrap}.hf-left .cta .btn{flex:1 1 100%;justify-content:center}}
@media (max-width:900px){
  .hf-top{padding-top:5.75rem}
  .hero-full h1{font-size:clamp(2.6rem,11vw,3.75rem)}
  .hf-bot{grid-template-columns:1fr;gap:1.25rem;text-align:center;padding-bottom:1.75rem}
  .hf-cap{order:-1;min-width:0}
  .hf-left .lead{margin:0 auto 1rem;max-width:34ch}
  .hf-right{flex-direction:row;justify-content:center;align-items:center}
  .hf-scroll{display:none}
}
.hero-full .hf-view{align-self:stretch;justify-self:stretch;margin-top:0}
.hf-top{padding-top:clamp(6rem,10vh,7.25rem)}
.hero-full h1{font-size:clamp(2.9rem,5vw,5.25rem)}
.hf-left .lead{margin-bottom:1rem}