/* ============ ZARPOSH MOTION LAYER ============ */

/* ---------- velvet curtain (intro + page transitions) ---------- */
.curtain{position:fixed;inset:0;z-index:1000;pointer-events:none;overflow:hidden}
.curtain i{position:absolute;top:0;bottom:0;width:50.4%;transition:transform .9s cubic-bezier(.76,0,.2,1);will-change:transform;box-shadow:0 0 60px rgba(0,0,0,.6);
  background:
   linear-gradient(90deg,rgba(0,0,0,.5),rgba(0,0,0,0) 12%,rgba(255,255,255,.08) 26%,rgba(0,0,0,.42) 42%,rgba(0,0,0,0) 58%,rgba(255,255,255,.09) 74%,rgba(0,0,0,.55)),
   repeating-linear-gradient(90deg,#64102a 0 46px,#8c1b3b 46px 94px,#5a0e24 94px 140px)}
.curtain .cl{left:0;transform:translateX(-102%);border-right:1px solid rgba(214,106,140,.7)}
.curtain .cr{right:0;transform:translateX(102%);border-left:1px solid rgba(214,106,140,.7)}
.curtain::before{content:"";position:absolute;left:0;right:0;top:0;height:8px;background:linear-gradient(90deg,#8f6b2c,#f0d79b,#8f6b2c);z-index:3;opacity:0;transition:opacity .3s}
html.cshut .curtain{pointer-events:auto}
html.cshut .curtain::before{opacity:1}
html.cshut .curtain i{transform:none;transition-duration:.5s}
.c-logo{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;opacity:0;transition:opacity .3s .05s;pointer-events:none}
.c-logo svg{width:84px;height:84px}
.c-logo b{font-family:var(--serif);font-weight:500;letter-spacing:.55em;padding-left:.55em;font-size:1.4rem;color:var(--gold2)}
.c-logo small{font-size:.6rem;letter-spacing:.34em;text-transform:uppercase;color:#d9b9a8}
html.cshut .c-logo{opacity:1}

/* first-paint states (only when JS + motion are alive) */
html.js:not(.nomotion) .hero2 h1 .ln>span{opacity:0}
html.js:not(.nomotion) .hero2 .eyebrow,
html.js:not(.nomotion) .hero2 .hero-txt p,
html.js:not(.nomotion) .hero2 .cta,
html.js:not(.nomotion) .hero2 .meta,
html.js:not(.nomotion) .hero2 .hero-card{opacity:0}
html.js:not(.nomotion) .hdr .nav-l,html.js:not(.nomotion) .hdr .logo,html.js:not(.nomotion) .hdr .acts{opacity:0}

/* ---------- word reveal ---------- */
.w{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .02em .14em;margin-bottom:-.14em}
.wi{display:inline-block;will-change:transform}

/* ---------- hero ---------- */
.hero2{position:relative;height:100vh;height:100svh;min-height:540px;overflow:hidden;background:#fdeef2;display:flex;align-items:center;padding:var(--hh) var(--pad) 0}
.h-media{position:absolute;top:0;right:0;bottom:0;width:62%;overflow:hidden;will-change:transform;background:radial-gradient(60% 70% at 62% 50%,rgba(255,200,216,.16),transparent 70%)}
.h-media img{position:absolute;top:-3%;right:0;height:119%;width:auto;max-width:none;transform-origin:50% 58%;will-change:transform;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%);mask-image:linear-gradient(90deg,transparent 0,#000 30%)}
.h-media::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,rgba(74,29,51,.7),transparent 26%),linear-gradient(180deg,rgba(74,29,51,.55),transparent 18%)}
.hero2 .hero-txt{position:relative;z-index:3;max-width:min(600px,48vw)}
.hero2 h1{font-size:clamp(3rem,min(7.6vw,12.5vh),8rem);margin:20px 0 18px;letter-spacing:-.01em}
.hero2 h1 .ln{display:block;overflow:hidden;padding-bottom:.1em}
.hero2 h1 .ln>span{display:block}
.hero2 .hero-txt p{max-width:420px;color:#c5d0c8;font-size:1.02rem}
.hero2 .cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.hero2 .meta{display:flex;gap:30px;margin-top:40px}
.hero2 .meta div{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.hero2 .meta b{display:block;font-family:var(--serif);font-size:1.6rem;color:var(--gold2);letter-spacing:0;font-weight:500}
.hero-card{position:absolute;right:4vw;bottom:11vh;z-index:3}
.hero2 .hero-chip{position:static;animation:floaty 7s ease-in-out infinite}
.hero2 .scroll-cue{display:none}
.hero-fade{position:absolute;inset:0;opacity:0;z-index:5;pointer-events:none}

/* leaf-shadow scene (light: pre-blurred image, no filters) */
.leaf-bg{position:absolute;inset:0;overflow:hidden;background:#fdeef2}
.leaf-bg::before{content:"";position:absolute;inset:-4%;background:linear-gradient(180deg,rgba(248,200,216,.35),rgba(74,29,51,.7)),url("../assets/photos/leaf-bg.jpg") center/cover;animation:kb 28s ease-in-out infinite alternate}
.leaf-bg::after{content:"";position:absolute;inset:-10%;opacity:.5;animation:sway 18s ease-in-out infinite alternate;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 600'%3E%3Cg fill='%23010a05' fill-opacity='.62'%3E%3Cpath d='M0 0C40-50 110-50 150 0 110 50 40 50 0 0Z' transform='translate(40 90) rotate(-28)'/%3E%3Cpath d='M0 0C40-50 110-50 150 0 110 50 40 50 0 0Z' transform='translate(210 40) rotate(18) scale(.8)'/%3E%3Cpath d='M0 0C40-50 110-50 150 0 110 50 40 50 0 0Z' transform='translate(420 130) rotate(-52) scale(1.1)'/%3E%3Cpath d='M0 0C40-50 110-50 150 0 110 50 40 50 0 0Z' transform='translate(90 340) rotate(40) scale(1.2)'/%3E%3Cpath d='M0 0C40-50 110-50 150 0 110 50 40 50 0 0Z' transform='translate(330 300) rotate(-15)'/%3E%3Cpath d='M0 0C40-50 110-50 150 0 110 50 40 50 0 0Z' transform='translate(500 420) rotate(62) scale(.9)'/%3E%3Cpath d='M0 0C40-50 110-50 150 0 110 50 40 50 0 0Z' transform='translate(180 520) rotate(-40) scale(1.3)'/%3E%3Cpath d='M0 0C40-50 110-50 150 0 110 50 40 50 0 0Z' transform='translate(560 40) rotate(100) scale(.7)'/%3E%3C/g%3E%3C/svg%3E") 0 0/620px}
@keyframes kb{to{transform:scale(1.1) translate(-2%,-1%)}}
@keyframes sway{from{transform:translate(0,0) rotate(-1.2deg)}to{transform:translate(3%,2%) rotate(1.5deg)}}
.leaf-bg .lt{position:absolute;inset:0;z-index:2;background:radial-gradient(520px 340px at 18% 12%,rgba(255,200,216,.2),transparent 70%),radial-gradient(420px 300px at 82% 30%,rgba(255,214,226,.12),transparent 70%)}
.hero-fade .lt{background:linear-gradient(0deg,rgba(253,232,239,.95),rgba(253,232,239,0) 200px),radial-gradient(520px 340px at 18% 12%,rgba(255,200,216,.2),transparent 70%),radial-gradient(420px 300px at 82% 30%,rgba(255,214,226,.12),transparent 70%)}

/* new collections */
.newc{background:#fdeef2;overflow:hidden;padding-top:clamp(80px,10vw,140px)}
.newc::before{content:"";position:absolute;left:0;right:0;top:0;height:200px;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(253,232,239,.95),rgba(253,232,239,0))}
.newc>.sec-h,.newc>.arches{position:relative;z-index:3}
.newc .sec-h h2{font-size:clamp(2.4rem,5.6vw,5rem)}
.newc .arches{align-items:start}
.newc .arch{will-change:transform;margin-bottom:0!important}
.newc .arch .art{inset:0}
.newc .arch h3{min-height:2.3em;display:flex;align-items:flex-start;justify-content:center;line-height:1.15}

/* ---------- explore: pinned scrub ---------- */
.explore{padding:0;height:100vh;height:100svh;min-height:520px;overflow:hidden}
.ex-pin{height:100%;padding:calc(var(--hh) + 14px) var(--pad) 28px;display:flex;flex-direction:column;position:relative;transition:padding .6s var(--ease)}
.ex-pin .sec-h{margin:0 auto 18px;transition:opacity .4s,max-height .6s var(--ease),margin .6s var(--ease);max-height:260px;overflow:hidden;flex:none}
.ex-pin .sec-h h2{font-size:clamp(1.9rem,min(4vw,6.4vh),3.4rem);margin:8px 0 6px}
.explore .panels{flex:1 1 auto;min-height:0;height:auto;width:100%;max-width:1500px;margin:0 auto;will-change:transform}
.panel .art img{transition:transform 1s var(--ease)}
.panel .pt .big{display:block;font-family:var(--serif);font-size:clamp(2.8rem,min(7vw,11vh),7rem);line-height:.9;font-style:italic;color:rgba(255,200,216,.95);opacity:0;transform:translateY(24px);transition:.5s var(--ease) .05s}
.panel.active .pt .big{opacity:1;transform:none}
.panel:not(.active) .pt .big{display:none}
.panel.active .pt h3{display:none}
.panel{transition:flex .6s var(--ease),border-color .4s}
.ex-prog{flex:none;display:flex;align-items:center;gap:16px;margin-top:16px;font-family:var(--serif);color:var(--gold2);font-size:1.1rem;transition:opacity .4s}
.ex-prog i{flex:1;height:1px;background:rgba(214,106,140,.3);position:relative}
.ex-prog b{position:absolute;left:0;top:-1px;height:3px;width:0;background:var(--gold-fill,var(--gold))}
.explore.full .ex-pin{padding:0}
.explore.full .sec-h{opacity:0;max-height:0;margin:0}
.explore.full .ex-prog{position:absolute;bottom:26px;left:var(--pad);right:var(--pad);z-index:5;margin:0}
.explore.full .panels{max-width:none;gap:0}
.explore.full .panel{border-color:transparent}
.explore.full .panel:not(.active){flex:0.0001;opacity:0}

/* ---------- best sellers: pinned horizontal ---------- */
.best{padding:0;overflow:hidden}
.bs-pin{height:100vh;height:100svh;min-height:520px;display:flex;flex-direction:column;justify-content:center;padding-top:calc(var(--hh) + 6px);padding-bottom:24px;overflow:hidden}
.bs-pin .sec-h{margin-bottom:22px;flex:none}
.bs-pin .sec-h h2{font-size:clamp(2rem,min(4.4vw,6.4vh),3.8rem);margin:8px 0 4px}
.bs-track{display:flex;gap:clamp(14px,2vw,26px);padding:0 var(--pad);width:max-content;will-change:transform;align-items:flex-start}
.bs-track .card{width:clamp(200px,calc((100vh - var(--hh) - 340px) * .8),340px);flex:none}
.bs-track .card-media .art{inset:0}
.end-card{flex:none;align-self:stretch;width:clamp(200px,20vw,280px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;border:1px solid var(--line);text-align:center;font-family:var(--serif);font-size:1.9rem;line-height:1.1;transition:background .4s,border-color .4s;margin-bottom:92px;padding:20px}
.end-card span{font-family:var(--sans);font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.end-card:hover{background:rgba(214,106,140,.1);border-color:var(--gold)}

/* ---------- story ---------- */
.st-art .a1 img,.st-art .a2 img{width:100%;height:100%;object-fit:cover;object-position:center 15%}
.st-art .a1{will-change:clip-path}

/* ---------- card image settle-in (fast) ---------- */
.card[data-reveal] .card-media .art{transform:scale(1.15);transition:transform 1s var(--ease)}
.card[data-reveal].in .card-media .art{transform:scale(1)}
.card[data-reveal].in:hover .card-media .art{transform:scale(1.07)}

/* ---------- mega menu stagger ---------- */
.mega>div>*{opacity:0;transform:translateY(12px);transition:opacity .4s var(--ease),transform .5s var(--ease)}
.has-mega:hover .mega>div>*,.has-mega:focus-within .mega>div>*{opacity:1;transform:none}
.mega>div:nth-child(1)>*{transition-delay:.03s}.mega>div:nth-child(2)>*{transition-delay:.07s}.mega>div:nth-child(3)>*{transition-delay:.11s}
.mega .feat{opacity:0;transform:scale(.95);transition:.5s var(--ease) .08s}
.has-mega:hover .mega .feat{opacity:1;transform:none}

.mag{will-change:transform}

/* nomotion / reduced motion */
html.nomotion .hero2 h1 .ln>span,html.nomotion .hero2 .eyebrow,html.nomotion .hero2 p,html.nomotion .hero2 .cta,html.nomotion .hero2 .meta,html.nomotion .hero2 .hero-card{transform:none;opacity:1}
html.nomotion .bs-track{width:auto;overflow-x:auto}
html.nomotion .explore,html.nomotion .bs-pin{height:auto}

/* ---------- short laptop screens ---------- */
@media (max-height:760px) and (min-width:901px){
  .hero2 .meta{display:none}
  .hero2 .hero-txt p{font-size:.96rem}
  .ex-pin .sec-h p,.bs-pin .sec-h p{display:none}
  .ex-pin .sec-h{margin-bottom:12px}
  .bs-pin .sec-h{margin-bottom:14px}
  .hero-card{bottom:8vh}
}
@media (max-height:640px) and (min-width:901px){
  .hero2 .hero-txt p{display:none}
  .hero2 .cta{margin-top:22px}
  .ex-pin .sec-h .eyebrow,.bs-pin .sec-h .eyebrow{display:none}
}

/* ---------- tablet / mobile ---------- */
@media (max-width:900px){
  .hero2{padding:0 var(--pad) max(64px,9svh);align-items:flex-end}
  .h-media{width:100%}
  .h-media img{top:0;right:0;left:0;height:100%;width:100%;object-fit:cover;object-position:center 12%;-webkit-mask-image:none;mask-image:none}
  .h-media::after{background:linear-gradient(0deg,#4a1d33 8%,rgba(74,29,51,.86) 46%,transparent 76%),linear-gradient(180deg,rgba(74,29,51,.6),transparent 20%)}
  .hero2 .hero-txt{max-width:100%}
  .hero2 h1{font-size:clamp(3rem,15vw,5.2rem);margin:12px 0 10px}
  .hero2 .hero-txt p{font-size:.95rem}
  .hero2 .cta{margin-top:20px}
  .hero2 .meta{margin-top:22px;gap:20px}
  .hero2 .meta b{font-size:1.35rem}
  .hero-card{display:none}
  .explore{height:auto;min-height:0;overflow:visible}
  .ex-pin{height:auto;padding:70px var(--pad) 60px}
  .ex-prog{display:none}
  .explore .panels{flex:none;height:auto}
  .panel:not(.active) .num{display:none}
  .panel .pt .big{font-size:3.2rem}
  .bs-pin{height:auto;min-height:0;padding-top:64px;padding-bottom:64px}
  .bs-track{width:auto;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .bs-track::-webkit-scrollbar{display:none}
  .bs-track .card{width:62vw;scroll-snap-align:start}
  .end-card{width:58vw;margin-bottom:76px;scroll-snap-align:start}
  .newc{padding-top:70px}
  .c-logo svg{width:68px;height:68px}.c-logo b{font-size:1.1rem}
  .leaf-bg::before,.leaf-bg::after{animation:none}
}
@media (prefers-reduced-motion:reduce){
  .curtain{display:none}
  .leaf-bg::before,.leaf-bg::after{animation:none}
}
.newc .arch h3{font-size:clamp(1.15rem,1.7vw,1.5rem)}

/* no-overlap fixes */
.explore.full .panel .pt{bottom:80px}
.hero2 h1{line-height:1.1}
