:root{--ivory:#f6efe4;--ink:#1b1210;--gold:#c8962e;--maroon:#2a0a10;--ease:cubic-bezier(.2,.7,.2,1)}
*{box-sizing:border-box;margin:0;padding:0}
html{background:#0d0608;-webkit-text-size-adjust:100%}
body{font-family:'Inter',system-ui,sans-serif;font-weight:300;color:var(--ink);background:#0d0608;overflow-x:hidden}
img{display:block}
em{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;color:var(--gold);font-weight:400}
.sc{position:relative;height:calc(var(--h) * 100svh)}
.st{position:sticky;top:0;height:100svh;overflow:hidden;background:var(--ivory)}
.light .st{background:var(--ivory)}
.fill{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;will-change:transform,opacity,filter}

/* bar */
.bar{position:fixed;top:0;left:0;right:0;z-index:30;display:flex;justify-content:space-between;align-items:center;padding:18px 3.2vw;color:#fff;transition:color .5s;mix-blend-mode:normal;pointer-events:none}
.bar>*{pointer-events:auto}
body.light .bar{color:var(--ink)}
.brand{font-family:'Cormorant Garamond',serif;font-weight:500;letter-spacing:.42em;font-size:20px;color:inherit;text-decoration:none}
.bar nav a{color:inherit;text-decoration:none;font-size:12px;letter-spacing:.16em;text-transform:uppercase;margin-left:26px;opacity:.8}
.rail-prog{position:fixed;left:0;top:0;bottom:0;width:3px;z-index:31;background:rgba(127,127,127,.12)}
.rail-prog i{display:block;width:100%;height:100%;background:var(--gold);transform-origin:top;transform:scaleY(0)}
.chap{position:fixed;left:3.2vw;bottom:22px;z-index:30;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#fff;transition:color .5s;display:flex;gap:12px;align-items:center}
body.light .chap{color:var(--ink)}
.chap b{font-family:'Cormorant Garamond',serif;font-size:22px;font-weight:500;letter-spacing:.05em;color:var(--gold)}
.geoora{position:fixed;right:16px;bottom:16px;z-index:40;background:rgba(15,10,8,.82);color:#f3e7d3;font-size:12px;letter-spacing:.06em;padding:9px 14px;border-radius:99px;text-decoration:none;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid rgba(200,150,46,.45)}
.geoora b{font-weight:500;color:var(--gold)}

.big{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:clamp(46px,8.2vw,128px);line-height:.95;letter-spacing:-.01em}
.big.top{position:absolute;top:11vh;left:0;right:0;text-align:center;z-index:2}
.big.tl{position:absolute;top:13vh;left:5vw;z-index:2}
.hint{position:absolute;left:0;right:0;bottom:7vh;text-align:center;font-size:11px;letter-spacing:.24em;text-transform:uppercase;opacity:.55}

/* hero */
.hero-st{background:#0d0608;color:#fff}
.shade{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,rgba(0,0,0,.1),rgba(0,0,0,.6));pointer-events:none}
.h-title{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 6vw;will-change:transform,opacity}
.h-title small{letter-spacing:.4em;text-transform:uppercase;font-size:12px;opacity:.85;margin-bottom:2.4vh}
.h-title h1{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(60px,15vw,250px);letter-spacing:.14em;line-height:1;margin-right:-.14em;text-shadow:0 8px 60px rgba(0,0,0,.5)}
.h-title p{text-shadow:0 2px 24px rgba(0,0,0,.8);margin-top:3vh;font-size:clamp(13px,1.3vw,18px);letter-spacing:.06em;opacity:.9;line-height:1.7}
.h2t h2{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(52px,9vw,150px);line-height:.98}
.cue{position:absolute;left:50%;bottom:5vh;width:1px;height:56px;background:rgba(255,255,255,.3);overflow:hidden}
.cue i{display:block;width:1px;height:20px;background:#fff;animation:cue 1.8s infinite}
@keyframes cue{from{transform:translateY(-20px)}to{transform:translateY(56px)}}

/* look */
.look-row{position:absolute;left:0;bottom:13vh;top:31vh;display:flex;justify-content:flex-start;gap:3vw;align-items:flex-end;will-change:transform;width:max-content}
.look-row figure{height:100%;aspect-ratio:3/4;position:relative;flex:0 0 auto;will-change:transform,filter,opacity}
.look-row img{width:100%;height:100%;object-fit:cover;border-radius:6px}
.look-row figcaption{display:none;position:absolute;left:0;right:0;bottom:-26px;text-align:center;font-size:11px;letter-spacing:.18em;text-transform:uppercase;opacity:0;transition:opacity .3s}
.look-row figure.on figcaption{opacity:.8}

/* silk */
.silk-count{position:absolute;right:5vw;top:15vh;font-size:12px;letter-spacing:.2em;z-index:2}
.silk-count b{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:52px;color:var(--gold);letter-spacing:0}
.strip{position:absolute;left:0;top:30vh;bottom:9vh;display:flex;gap:3vw;align-items:center;padding-left:8vw;will-change:transform}
.strip article{height:100%;aspect-ratio:3/4;flex:0 0 auto;position:relative;border-radius:10px;overflow:hidden;background:var(--c);will-change:transform;box-shadow:0 30px 60px -30px rgba(0,0,0,.45)}
.strip img{width:100%;height:100%;object-fit:cover;mix-blend-mode:normal}
.strip h3{position:absolute;left:18px;bottom:44px;color:#fff;font-family:'Cormorant Garamond',serif;font-size:34px;font-weight:500;text-shadow:0 2px 18px rgba(0,0,0,.6)}
.strip span{position:absolute;left:18px;bottom:20px;color:#fff;font-size:13px;letter-spacing:.1em;text-shadow:0 2px 12px rgba(0,0,0,.6)}

/* rail */
.rail-st{display:flex;align-items:center}
.rail-words{position:absolute;top:12vh;left:0;right:0;text-align:center;font-family:'Cormorant Garamond',serif;font-size:clamp(46px,8vw,120px);z-index:2;line-height:1}
.rail-words span{display:inline-block;margin:0 .12em;will-change:transform,opacity}
.rail-st picture{position:absolute;left:0;top:26vh;height:62vh}
.rail-st img{height:100%;width:auto;max-width:none;will-change:transform,filter;border-radius:4px}

/* drape */
.dcols{position:absolute;left:0;right:0;top:24vh;bottom:9vh;overflow:hidden;display:flex;justify-content:center;gap:2vw;padding:0 4vw}
.dcol{width:16vw;position:relative;display:flex;flex-direction:column;gap:2vh;will-change:transform}
.dcol .t{width:100%;aspect-ratio:3/4;flex:0 0 auto;border-radius:8px;overflow:hidden;opacity:.55;transform:scale(.94);transition:opacity .4s,transform .4s,box-shadow .4s;cursor:pointer}
.dcol .t.on{opacity:1;transform:scale(1);box-shadow:0 0 0 3px var(--gold)}
.dcol .t img{width:100%;height:100%;object-fit:cover}
.dmain{position:relative;height:100%;aspect-ratio:3/4;flex:0 0 auto;border-radius:12px;overflow:hidden;background:#d8c3b2;max-width:46vw}
.dmain picture{position:absolute;inset:0;opacity:0;transform:scale(1.12);will-change:transform,opacity}
.dmain img{width:100%;height:100%;object-fit:cover}
.dcap{position:absolute;left:0;right:0;bottom:0;padding:26px 20px 18px;background:linear-gradient(transparent,rgba(0,0,0,.6));color:#fff;display:flex;flex-direction:column;gap:4px;z-index:3}
.dcap b{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:28px}
.dcap span{font-size:12px;letter-spacing:.06em;opacity:.9}

/* bridal */
.bridal-st{background:var(--ivory);color:var(--ink)}
.bridal-st .big{transition:none}
.bcards{position:absolute;left:0;right:0;top:27vh;bottom:11vh;display:flex;gap:2vw;align-items:center;will-change:transform,opacity}
.bcards div{height:100%;aspect-ratio:3/4;flex:0 0 auto;border-radius:8px;overflow:hidden}
.bcards img{width:100%;height:100%;object-fit:cover}
.bmain{position:absolute;left:50%;top:55%;height:74vh;aspect-ratio:4/5;border-radius:10px;overflow:hidden;opacity:0;will-change:transform,opacity;box-shadow:0 40px 90px -30px rgba(0,0,0,.7)}
.bmain img{width:100%;height:100%;object-fit:cover}
.bside{position:absolute;left:50%;top:55%;height:46vh;aspect-ratio:3/4;border-radius:8px;overflow:hidden;opacity:0;will-change:transform,opacity;filter:saturate(.8) brightness(.8)}
.bside img{width:100%;height:100%;object-fit:cover}
.btext{position:absolute;left:5vw;bottom:12vh;color:#f3e4d0;z-index:3;opacity:0;max-width:30vw;will-change:transform,opacity}
.btext small{letter-spacing:.3em;text-transform:uppercase;font-size:11px;color:var(--gold)}
.btext h3{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(30px,3.6vw,56px);line-height:1;margin:10px 0 14px}
.btext p{font-size:14px;line-height:1.7;opacity:.85}
.btext{text-shadow:0 2px 20px rgba(0,0,0,.6)}

/* weave */
.weave-st{background:#0d0608;color:#f3e4d0}
.big.mid{position:absolute;left:0;right:0;top:50%;text-align:center;transform:translateY(-50%);z-index:1;opacity:.95}
#gl{position:absolute;inset:0;width:100%;height:100%;z-index:2;display:block}
.wfoot{position:absolute;left:0;right:0;bottom:8vh;z-index:3;display:flex;align-items:center;justify-content:center;gap:28px;flex-wrap:wrap;padding:0 5vw}
.dots{display:flex;gap:10px}
.dots i{width:18px;height:18px;border-radius:50%;background:var(--c);opacity:.45;transition:transform .3s,opacity .3s;box-shadow:0 0 0 2px rgba(255,255,255,.2)}
.dots i.on{opacity:1;transform:scale(1.35);box-shadow:0 0 0 2px #fff}
.wname{display:flex;flex-direction:column;min-width:190px}
.wname b{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:26px}
.wname span{font-size:13px;letter-spacing:.1em;color:var(--gold)}
.cta{background:var(--gold);color:#1b0f08;text-decoration:none;font-size:12px;letter-spacing:.2em;text-transform:uppercase;padding:14px 26px;border-radius:99px;font-weight:500}

.end{min-height:80svh;background:#0d0608;color:#f3e4d0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:16px;padding:12vh 6vw}
.end h2{font-family:'Cormorant Garamond',serif;font-weight:400;font-size:clamp(46px,8vw,120px)}
.end p{opacity:.7;max-width:520px;line-height:1.7}
.end .small{font-size:12px;letter-spacing:.14em;text-transform:uppercase;opacity:.5}

@media (max-width:768px){
  .bar nav{display:none}
  .bar{padding:14px 18px}
  .brand{font-size:16px}
  .chap{left:16px;bottom:18px}
  .geoora{right:10px;bottom:10px;font-size:11px;padding:8px 12px}
  .big.top{top:9vh}
  .big.tl{top:10vh}
  .look-row{top:24vh;bottom:15vh;gap:5vw}
  .look-row figure{height:auto;width:62vw}
  .strip article{height:auto;width:62vw}
  .bcards div{height:auto;width:58vw}
  .strip{top:26vh;bottom:12vh;padding-left:10vw;gap:5vw}
  .silk-count{top:13vh}
  .rail-st picture{top:30vh;height:52vh}
  .dcols{top:22vh;bottom:13vh;gap:2vw;padding:0 3vw}
  .dcol{width:17vw}
  .dmain{max-width:56vw}
  .dcap b{font-size:20px}.dcap span{font-size:11px}
  .bcards{top:24vh;bottom:15vh}
  .bmain{height:64vh}
  .bside{display:none}
  .btext{left:6vw;right:6vw;max-width:none;bottom:15vh}
  .wfoot{bottom:11vh;gap:14px}
  .hint{bottom:10vh}
}
@media (prefers-reduced-motion:reduce){.cue i{animation:none}}
