/* ============================================================================
   PASARGAD DESIGN — V30 · Dimension
   Depth, light and perspective layered over the V29 house style.
   ========================================================================= */

/* --------------------------------------------------- living photographs */
.d3-canvas{position:absolute;z-index:1;pointer-events:none;opacity:0;transition:opacity 1.2s var(--ease);display:block}
.d3-live>.d3-canvas{opacity:1}
.d3-live>img.d3-src{opacity:0;transition:opacity 1.2s var(--ease)}
.frame .d3-canvas{z-index:0}
.frame.inset::after{z-index:2}
.atelier-stage>.d3-canvas{z-index:0}
.available-collection{isolation:isolate}
.available-collection>.d3-canvas{z-index:0}
.available-collection>div{position:relative;z-index:2}

/* ------------------------------------------------------- gold dust layer */
.dust{position:absolute;inset:0;z-index:3;pointer-events:none;mix-blend-mode:screen}
.hero-inner{will-change:transform}

/* ------------------------------------------------------ 3D loader coin */
.loader-coin{width:92px;height:92px;perspective:700px;margin-bottom:10px;opacity:0;
  animation:lmFade 1s ease .1s forwards}
.loader-coin .coin{position:relative;width:100%;height:100%;transform-style:preserve-3d;
  animation:coinSpin 3.6s cubic-bezier(.65,0,.35,1) infinite}
.loader-coin img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;backface-visibility:visible}
.loader-coin img:not(:first-child){filter:brightness(.42) sepia(.6) saturate(1.4)}
.loader-coin img:last-child{filter:brightness(1.05)}
.loader-coin .shine{position:absolute;inset:-30%;transform:translateZ(1px);pointer-events:none;
  background:radial-gradient(circle at 50% 50%,rgba(255,230,170,.35),transparent 55%);mix-blend-mode:screen}
@keyframes coinSpin{0%{transform:rotateY(0) rotateX(8deg)}50%{transform:rotateY(180deg) rotateX(-6deg)}100%{transform:rotateY(360deg) rotateX(8deg)}}

/* --------------------------------------------------------- gilded type */
.hero h1 .l2,.page-hero h1 em,.h-xl em,.h-lg em,.h-md em,.pull em,.atelier-intro h1 em,.collection-intro h1 em{
  background:linear-gradient(100deg,#a67c2e 0%,#e7c878 22%,#fff0c4 38%,#c9a24b 55%,#f3dc9a 72%,#a67c2e 100%);
  background-size:260% 100%;background-position:0 0;
  -webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 1px 0 rgba(90,62,20,.9)) drop-shadow(0 2px 0 rgba(60,40,12,.7)) drop-shadow(0 14px 26px rgba(0,0,0,.45));
  padding-inline:.06em}
.on-paper .h-md em,.on-paper .h-lg em,.on-paper .pull em{
  background:linear-gradient(100deg,#4a2e1c,#8a5a34 40%,#b98a52 55%,#5a3a26);background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 1px 0 rgba(255,255,255,.6))}
body:not(.loading) .hero h1 .l2{animation:fadeUp 1.3s var(--ease) .72s forwards,goldSheen 9s ease-in-out 2.2s infinite}
.h-xl em,.h-lg em,.h-md em,.pull em,.page-hero h1 em{animation:goldSheen 11s ease-in-out infinite}
@keyframes goldSheen{0%,100%{background-position:0 0}50%{background-position:100% 0}}
.hero h1 .l1{text-shadow:0 1px 0 rgba(0,0,0,.35),0 10px 40px rgba(0,0,0,.6)}

/* ------------------------------------------------------ perspective reveals */
.rv{transform:perspective(1400px) translateY(56px) rotateX(11deg) scale(.975);transform-origin:50% 0;
  transition:opacity 1.35s var(--ease),transform 1.5s var(--ease)}
.rv.in{transform:none}

/* ---------------------------------------------------------------- tilt */
.tilt{transform-style:preserve-3d;will-change:transform;transition:box-shadow .6s var(--ease)}
.tilt .glare{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:calc(var(--gh,0) * 1);
  background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(255,236,196,.20),rgba(255,236,196,.06) 28%,transparent 60%);
  mix-blend-mode:screen;border-radius:inherit}
.frame.tilt:hover,.upcoming-card.tilt:hover,.available-collection.tilt:hover{box-shadow:0 40px 80px -30px rgba(0,0,0,.75),0 0 0 1px rgba(201,162,75,.18)}
.info-list.tilt,.form.tilt{position:relative}
.showroom-card.tilt{box-shadow:0 30px 70px -20px rgba(0,0,0,.7)}

/* ------------------------------------------------ upcoming concept cards */
.upcoming-card{position:relative;overflow:hidden;transform-style:preserve-3d;
  background:
    radial-gradient(ellipse at 85% 0%,rgba(201,162,75,.12),transparent 60%),
    linear-gradient(160deg,rgba(24,30,26,.9),rgba(12,15,13,.95))}
.upcoming-card::before{content:"";position:absolute;inset:0;padding:1px;border-radius:inherit;pointer-events:none;
  background:conic-gradient(from var(--ang,0deg),transparent 0 70%,rgba(231,200,120,.85) 80%,transparent 90%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  animation:ringSpin 7s linear infinite}
.upcoming-card:nth-child(3)::before{animation-delay:-2.3s}.upcoming-card:nth-child(4)::before{animation-delay:-4.6s}
@property --ang{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes ringSpin{to{--ang:360deg}}
.upcoming-number{font-family:var(--display);font-size:clamp(48px,5vw,76px);line-height:1;
  background:linear-gradient(180deg,#f3dc9a,#8b6a2f);-webkit-background-clip:text;background-clip:text;color:transparent;
  transform:translateZ(40px);filter:drop-shadow(0 12px 18px rgba(0,0,0,.55))}
.upcoming-card>div{transform:translateZ(22px)}

/* -------------------------------------------- collection hero card depth */
.available-collection{transform-style:preserve-3d;box-shadow:0 50px 90px -40px rgba(0,0,0,.8)}
.available-collection>div{background:linear-gradient(180deg,rgba(16,22,18,.94),#0f1411)}

/* ------------------------------------------------ scroll-risen blocks */
.riser{transform:perspective(1600px) rotateX(calc(var(--rise,0) * 16deg)) translateY(calc(var(--rise,0) * 40px)) scale(calc(1 - var(--rise,0) * .06));
  transform-origin:50% 100%}

/* --------------------------------------------------- showroom feature */
.showroom-feature>.frame{box-shadow:0 60px 110px -50px rgba(0,0,0,.85)}
.showroom-card{backdrop-filter:blur(14px);background:rgba(11,12,11,.86)}

/* ============================================================================
   The showroom walk
   ========================================================================= */













/* the floor reflection */




















/* ---------------------------------------------- house photographs, uncropped */
.frame:has(img[src*="house/"]){aspect-ratio:16/9}
.showroom-grid .frame,.signature .frame{box-shadow:0 40px 80px -40px rgba(0,0,0,.75)}

/* ---------------------------------------------------------- buttons */
.btn{transition:color .5s var(--ease),transform .5s var(--ease),box-shadow .5s var(--ease)}
.btn:hover{transform:translateY(-2px);box-shadow:0 18px 34px -16px rgba(201,162,75,.55)}
.btn-solid{box-shadow:inset 0 1px 0 rgba(255,245,215,.55),inset 0 -2px 0 rgba(90,60,20,.35),0 10px 26px -12px rgba(201,162,75,.6)}

/* ---------------------------------------------------- atelier stage */
.atelier-main{box-shadow:0 70px 120px -60px rgba(0,0,0,.9)}

/* ------------------------------------------------------ stillness */
body.dim-still .rv,body.dim-still .riser{transform:none!important}







@media (prefers-reduced-motion:reduce){.loader-coin .coin,.upcoming-card::before{animation:none}}
.hero h1 .l2{text-shadow:none}
.hero-bg::after{z-index:2}
.frame::after,.atelier-stage::after{z-index:2}



.collection-intro,.atelier-intro,.atelier-outro{padding-inline:var(--gutter)}


/* V30.1 · mobile menu fix — the scrolled nav's backdrop-filter made it the
   containing block for the fixed full-screen menu, clipping it to the bar.
   The blur now lives on a pseudo-element so the menu is relative to the viewport. */
nav.site.scrolled{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
nav.site::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;
  background:rgba(11,10,16,.9);backdrop-filter:blur(22px) saturate(1.25);-webkit-backdrop-filter:blur(22px) saturate(1.25);
  transition:opacity .6s var(--ease)}
nav.site.scrolled::before{opacity:1}
@media(max-width:820px){.nav-links{height:100vh;height:100dvh;overflow-y:auto;padding:90px 24px 40px}.nav-toggle{position:relative;z-index:901}}
@media(max-width:820px){nav.site .brand{position:relative;z-index:901}}

/* V31 · live form states */
.hp{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.form-product{font-size:13px;color:var(--gold-bright);border:1px solid var(--line-2);padding:10px 14px;margin:0}
.form-note.busy{color:var(--cream-3)}
.form-note.ok{color:#9fd3a8;border-inline-start:2px solid #9fd3a8;padding-inline-start:12px}
.form-note.err{color:#f0a493;border-inline-start:2px solid #f0a493;padding-inline-start:12px}
.form button[disabled]{opacity:.6;cursor:wait}