/* Dessert Place "Sweet After Dark" motion layer: intro, rain hero, neon type, coverflow, wipes, cursor */
:root{--hdr:72px}
.demo-strip{z-index:31}

/* ---------- intro ---------- */
.intro{position:fixed;inset:0;z-index:110;display:grid;place-items:center;cursor:pointer;overflow:hidden}
.intro .curtain{position:absolute;top:0;bottom:0;width:50.2%;background:radial-gradient(120% 80% at 50% 50%,#1e0f0c,#0a0605 70%);transition:transform 1.1s cubic-bezier(.76,0,.24,1)}
.intro .curtain.l{left:0;box-shadow:inset -40px 0 80px -40px rgba(255,77,130,.25)}
.intro .curtain.r{right:0;box-shadow:inset 40px 0 80px -40px rgba(176,80,122,.25)}
.intro.open .curtain.l{transform:translateX(-101%)}
.intro.open .curtain.r{transform:translateX(101%)}
.intro .seam{position:absolute;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:linear-gradient(transparent,#ff4d82 30%,#fff 50%,#b0507a 70%,transparent);box-shadow:0 0 30px 6px rgba(255,77,130,.6);transform:scaleY(0);animation:seam .9s cubic-bezier(.7,0,.2,1) 1.3s forwards;z-index:3}
.intro.open .seam{opacity:0;transition:opacity .3s}
@keyframes seam{to{transform:scaleY(1)}}
.intro .ic{position:relative;z-index:4;text-align:center;transition:opacity .45s,transform .9s cubic-bezier(.7,0,.2,1),filter .45s}
.intro.open .ic{opacity:0;transform:scale(1.25);filter:blur(10px)}
.imoon{width:74px;height:74px;fill:none;stroke:#ff4d82;stroke-width:1.2;filter:drop-shadow(0 0 10px #ff4d82) drop-shadow(0 0 30px rgba(255,77,130,.6))}
.imoon path{stroke-dasharray:100;stroke-dashoffset:100;animation:draw 1.2s cubic-bezier(.6,0,.2,1) .1s forwards,moonfill .8s ease 1.1s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes moonfill{to{fill:rgba(255,77,130,.25)}}
.iw{font:800 clamp(48px,9vw,96px)/1 'Sora',sans-serif;letter-spacing:-3px;margin-top:18px}
.iw span{display:inline-block;opacity:0;color:#fff;animation:flickOn 1.1s linear forwards;animation-delay:var(--fd)}
.iw span.g{color:#ffb3cf}
.iw span{text-shadow:0 0 4px #fff,0 0 14px #ff4d82,0 0 34px #ff4d82,0 0 70px rgba(255,77,130,.7)}
.iw span.g{text-shadow:0 0 4px #fff,0 0 14px #f2b6cf,0 0 34px #b0507a,0 0 70px rgba(176,80,122,.7)}
.itag{margin-top:14px;font:600 13px Inter,sans-serif;letter-spacing:.7em;text-transform:uppercase;color:#dbc8b9;opacity:0;animation:fadeUp .8s ease 1.4s forwards;padding-left:.7em}
.intro .skip{position:absolute;bottom:26px;left:0;right:0;text-align:center;z-index:4;font-size:12px;color:#7d6a5f;letter-spacing:.2em;text-transform:uppercase}
.intro.open .skip{opacity:0}
@keyframes flickOn{0%{opacity:0}8%{opacity:1}10%{opacity:.08}18%{opacity:1}20%{opacity:.15}24%{opacity:1}40%{opacity:.85}42%{opacity:.2}46%{opacity:1}100%{opacity:1}}

/* ---------- route wipe ---------- */
.wipe{position:fixed;inset:0;z-index:86;pointer-events:none}
.wipe i{position:absolute;left:0;right:0;top:0;height:128%;transform:translateY(-101%);-webkit-mask:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 66' preserveAspectRatio='none'%3E%3Cpath d='M0 0H400V22C398.0 22 395.9 22 393.9 36.2C393.9 54.3 379.0 54.3 379.0 36.2C377.0 22 374.9 22 372.9 22C370.9 22 368.5 22 366.5 29.6C366.5 41.3 346.4 41.3 346.4 29.6C344.4 22 341.9 22 339.9 22C337.9 22 339.9 22 337.9 29.8C337.9 41.5 322.9 41.5 322.9 29.8C320.9 22 322.9 22 320.9 22Q305.9 25.7 291.0 22Q278.9 30.7 266.7 22C264.7 22 258.9 22 256.9 39.7C256.9 61.5 242.4 61.5 242.4 39.7C240.4 22 234.6 22 232.6 22C230.6 22 221.3 22 219.3 30.6C219.3 43.2 203.9 43.2 203.9 30.6C201.9 22 192.5 22 190.5 22Q177.2 26.1 163.9 22Q146.8 27.2 129.6 22C127.6 22 123.2 22 121.2 29.7C121.2 41.3 104.7 41.3 104.7 29.7C102.7 22 98.3 22 96.3 22C94.3 22 90.3 22 88.3 32.5C88.3 46.9 67.2 46.9 67.2 32.5C65.2 22 61.2 22 59.2 22C57.2 22 57.1 22 55.1 37.7C55.1 57.5 32.7 57.5 32.7 37.7C30.7 22 30.5 22 28.5 22C26.5 22 29.5 22 27.5 34.8C27.5 51.6 4.7 51.6 4.7 34.8C2.7 22 5.7 22 3.7 22Q1.9 30.9 0.0 22V0Z'/%3E%3C/svg%3E") bottom/100% 22% no-repeat,linear-gradient(#000,#000) top/100% 78.4% no-repeat;mask:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 66' preserveAspectRatio='none'%3E%3Cpath d='M0 0H400V22C398.0 22 395.9 22 393.9 36.2C393.9 54.3 379.0 54.3 379.0 36.2C377.0 22 374.9 22 372.9 22C370.9 22 368.5 22 366.5 29.6C366.5 41.3 346.4 41.3 346.4 29.6C344.4 22 341.9 22 339.9 22C337.9 22 339.9 22 337.9 29.8C337.9 41.5 322.9 41.5 322.9 29.8C320.9 22 322.9 22 320.9 22Q305.9 25.7 291.0 22Q278.9 30.7 266.7 22C264.7 22 258.9 22 256.9 39.7C256.9 61.5 242.4 61.5 242.4 39.7C240.4 22 234.6 22 232.6 22C230.6 22 221.3 22 219.3 30.6C219.3 43.2 203.9 43.2 203.9 30.6C201.9 22 192.5 22 190.5 22Q177.2 26.1 163.9 22Q146.8 27.2 129.6 22C127.6 22 123.2 22 121.2 29.7C121.2 41.3 104.7 41.3 104.7 29.7C102.7 22 98.3 22 96.3 22C94.3 22 90.3 22 88.3 32.5C88.3 46.9 67.2 46.9 67.2 32.5C65.2 22 61.2 22 59.2 22C57.2 22 57.1 22 55.1 37.7C55.1 57.5 32.7 57.5 32.7 37.7C30.7 22 30.5 22 28.5 22C26.5 22 29.5 22 27.5 34.8C27.5 51.6 4.7 51.6 4.7 34.8C2.7 22 5.7 22 3.7 22Q1.9 30.9 0.0 22V0Z'/%3E%3C/svg%3E") bottom/100% 22% no-repeat,linear-gradient(#000,#000) top/100% 78.4% no-repeat}
.wipe i:nth-child(1){background:linear-gradient(180deg,#b0507a,#ff4d82 45%,#f0a35e)}
.wipe i:nth-child(2){background:#120a08}
.wipe .wm{position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px;opacity:0;transform:scale(.6) rotate(-30deg);transition:opacity .25s,transform .5s cubic-bezier(.34,1.56,.64,1);color:#ff4d82;filter:drop-shadow(0 0 16px #ff4d82)}
.wipe.in{pointer-events:auto}
.wipe.in i{animation:pourIn .55s cubic-bezier(.7,0,.25,1) forwards}
.wipe.in i:nth-child(2){animation-delay:.07s}
.wipe.in .wm{opacity:1;transform:none;transition-delay:.3s}
.wipe.out i{transform:translateY(0);animation:pourOut .7s cubic-bezier(.7,0,.25,1) forwards}
.wipe.out i:nth-child(1){animation-delay:.08s}
@keyframes pourIn{from{transform:translateY(-101%)}to{transform:translateY(0)}}
@keyframes pourOut{from{transform:translateY(0)}to{transform:translateY(102%)}}
@keyframes wIn{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes wOut{from{clip-path:inset(0 0 0 0)}to{clip-path:inset(0 0 0 100%)}}

/* ---------- scroll progress + cursor ---------- */
.sprog{position:fixed;left:0;right:0;top:0;height:2px;z-index:60;background:linear-gradient(90deg,#ff4d82,#f0a35e,#b0507a);transform-origin:0 50%;transform:scaleX(0);box-shadow:0 0 12px rgba(255,77,130,.8);pointer-events:none}
html.has-cur,html.has-cur *{cursor:none!important}
html.has-cur input,html.has-cur textarea{cursor:text!important}
.cur-d,.cur-r{position:fixed;left:0;top:0;pointer-events:none;z-index:120;border-radius:50%}
.cur-d{width:6px;height:6px;margin:-3px 0 0 -3px;background:#fff;box-shadow:0 0 10px #ff4d82}
.cur-r{width:38px;height:38px;margin:-19px 0 0 -19px;border:1px solid rgba(255,255,255,.45);display:grid;place-items:center;font:700 10px Inter,sans-serif;letter-spacing:.14em;color:#fff;transition:width .35s cubic-bezier(.34,1.56,.64,1),height .35s cubic-bezier(.34,1.56,.64,1),margin .35s cubic-bezier(.34,1.56,.64,1),background .3s,border-color .3s}
.cur-r.big{width:62px;height:62px;margin:-31px 0 0 -31px;background:rgba(255,77,130,.12);border-color:rgba(255,77,130,.8)}
.cur-r.view{width:86px;height:86px;margin:-43px 0 0 -43px;background:rgba(255,77,130,.88);border-color:transparent;box-shadow:0 0 40px rgba(255,77,130,.6)}
.cur-hide .cur-d,.cur-hide .cur-r{opacity:0}

/* ---------- hero ---------- */
.ah{position:relative;height:100svh;min-height:660px;margin:calc(-1 * var(--hdr) - 12px) calc(50% - 50vw) 0;overflow:hidden;display:grid;place-items:center;text-align:center;isolation:isolate;--p:0}
.ah-bg{position:absolute;inset:-4%;z-index:-3;transform:translate3d(var(--px,0),var(--py2,0),0) scale(calc(1.04 + var(--p) * .18));transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.ah-bg img{width:100%;height:100%;object-fit:cover;animation:kbSky 32s ease-in-out infinite alternate;filter:saturate(1.15) brightness(.78)}
@keyframes kbSky{from{transform:scale(1) translate(0,0)}to{transform:scale(1.12) translate(-2%,-1.5%)}}
.ah canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-2;pointer-events:none}
.ah-vig{position:absolute;inset:0;z-index:-1;background:radial-gradient(80% 70% at 50% 45%,rgba(14,8,7,.15),rgba(14,8,7,.75) 100%),linear-gradient(180deg,rgba(14,8,7,.55) 0%,transparent 25%,transparent 60%,var(--bg) 100%)}
.ah-in{position:relative;padding:0 16px;max-width:1100px;transform:translateY(calc(var(--p) * -140px));opacity:calc(1 - var(--p) * 1.6);filter:blur(calc(var(--p) * 8px))}
.neon-t{font:800 clamp(46px,9.6vw,132px)/.92 'Sora',sans-serif;letter-spacing:-.045em;margin:20px 0 14px}
.neon-t .row{display:block}
.neon-t .n{display:inline-block;color:#fff6fa;opacity:0;text-shadow:0 0 4px #fff,0 0 16px #ff4d82,0 0 40px #ff4d82,0 0 90px rgba(255,77,130,.75);animation:flickOn 1.3s linear forwards,buzz 7s linear 3s infinite;animation-delay:var(--fd),calc(var(--fd) + 3s)}
@keyframes buzz{0%,96%,100%{opacity:1}97%{opacity:.35}98%{opacity:1}98.6%{opacity:.5}}
.neon-t .sp{display:inline-block;width:.28em}
.neon-t .gl{display:inline-block;background:linear-gradient(100deg,#fff 0%,#ffd1e2 30%,#ff4d82 50%,#f0a35e 65%,#f2b6cf 85%,#fff 100%);background-size:250% auto;-webkit-background-clip:text;background-clip:text;color:transparent;clip-path:inset(0 100% 0 0);animation:wipeTxt 1.2s cubic-bezier(.76,0,.24,1) .9s forwards,shimmer 7s linear 2s infinite}
@keyframes wipeTxt{to{clip-path:inset(-10% -5% -20% 0)}}
.ah .eyebrow{opacity:0;animation:fadeUp .8s ease .2s forwards}
.ah .lead{animation-delay:1.3s}
.ah .search{animation-delay:1.45s}
.ah .stats{animation-delay:1.6s}
.scroll-cue{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);display:grid;justify-items:center;gap:8px;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:#dbc8b9;opacity:calc(1 - var(--p) * 4)}
.scroll-cue i{width:1px;height:46px;background:linear-gradient(#fff,transparent);position:relative;overflow:hidden}
.scroll-cue i::after{content:'';position:absolute;left:0;top:-40%;width:1px;height:40%;background:#ff4d82;box-shadow:0 0 8px #ff4d82;animation:cue 1.8s cubic-bezier(.6,0,.2,1) infinite}
@keyframes cue{to{top:110%}}
.ah .marquee{position:absolute;left:0;right:0;bottom:90px;margin:0;opacity:calc(1 - var(--p) * 2)}

/* ---------- section titles ---------- */
.kicker{font:600 12px Inter,sans-serif;letter-spacing:.35em;text-transform:uppercase;color:#ff9cc0;display:flex;align-items:center;gap:12px;margin:70px 0 6px}
.kicker::before{content:'';width:34px;height:1px;background:#ff4d82;box-shadow:0 0 8px #ff4d82}
.big-h{font:800 clamp(34px,5.5vw,64px)/1 'Sora',sans-serif;letter-spacing:-.04em;margin:0 0 26px}
.big-h .split{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.08em}
.big-h .split>span{display:inline-block;transform:translateY(110%);transition:transform 1s cubic-bezier(.2,.8,.2,1) var(--sd,0ms)}
.big-h.in .split>span{transform:none}
.big-h em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- coverflow ---------- */
.cover{position:relative;height:clamp(440px,52vw,600px);perspective:1500px;margin:0 calc(50% - 50vw);overflow:hidden;touch-action:pan-y}
.cover::before{content:'';position:absolute;left:50%;bottom:6%;width:60vw;height:120px;margin-left:-30vw;background:radial-gradient(closest-side,rgba(255,77,130,.35),transparent);filter:blur(20px);pointer-events:none}
.cover-stage{position:absolute;inset:0;transform-style:preserve-3d}
.cf{position:absolute;left:50%;top:4%;width:clamp(210px,24vw,300px);aspect-ratio:3/4;translate:-50% 0;border-radius:24px;overflow:hidden;background:#1b110f;border:1px solid rgba(255,255,255,.1);transition:transform 1s cubic-bezier(.2,.8,.2,1),opacity 1s,filter 1s;filter:brightness(.42) saturate(.7) blur(.5px);-webkit-box-reflect:below 10px linear-gradient(transparent 72%,rgba(255,255,255,.16));will-change:transform}
.cf.on{filter:none;box-shadow:0 30px 90px -20px rgba(255,77,130,.65)}
.cf img{width:100%;height:100%;object-fit:cover;transition:transform 6s ease}
.cf.on img{transform:scale(1.08)}
.cf .cap{position:absolute;left:0;right:0;bottom:0;padding:18px;background:linear-gradient(transparent,rgba(14,8,7,.92));text-align:left;transform:translateY(14px);opacity:0;transition:all .7s cubic-bezier(.2,.8,.2,1) .2s}
.cf.on .cap{transform:none;opacity:1}
.cf .cap b{font:800 26px/1 'Sora',sans-serif;letter-spacing:-.03em}
.cf .cap b span{font:500 16px Inter,sans-serif;color:#e4d4c6;margin-left:6px}
.cf .cap small{display:block;color:#dccabd;margin-top:6px;font-size:12.5px}
.cf .badges{top:14px;left:14px}
.cf-nav{position:absolute;bottom:4%;left:50%;transform:translateX(-50%);display:flex;gap:12px;align-items:center;z-index:60}
.cf-nav .dots{display:flex;gap:6px}
.cf-nav .dots i{width:6px;height:6px;border-radius:6px;background:rgba(255,255,255,.25);transition:all .5s cubic-bezier(.2,.8,.2,1)}
.cf-nav .dots i.on{width:26px;background:var(--grad)}

/* ---------- silk band (countries) ---------- */
.silk{position:relative;margin:60px calc(50% - 50vw) 0;padding:10px max(16px,calc(50vw - 604px)) 80px;isolation:isolate;overflow:hidden}
.silk>img{position:absolute;left:0;top:-15%;width:100%;height:130%;object-fit:cover;z-index:-2;opacity:.5;transform:translateY(var(--py,0px))}
.silk::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,var(--bg),rgba(14,8,7,.35) 25%,rgba(14,8,7,.5) 75%,var(--bg))}
.silk .country{background:rgba(24,15,12,.55)}

/* ---------- city band ---------- */
.band{position:relative;margin:-12px calc(50% - 50vw) 0;padding:46px max(16px,calc(50vw - 604px)) 26px;min-height:380px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;isolation:isolate}
.band>img{position:absolute;left:0;top:-15%;width:100%;height:130%;object-fit:cover;z-index:-2;transform:translateY(var(--py,0px)) scale(1.05);animation:bandIn 1.6s cubic-bezier(.2,.8,.2,1)}
@keyframes bandIn{from{opacity:0;scale:1.2;filter:blur(8px)}}
.band::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(14,8,7,.5),rgba(14,8,7,.35) 40%,rgba(14,8,7,.85) 80%,var(--bg))}
.outline{position:relative;display:inline-block;font:800 clamp(60px,12vw,168px)/.88 'Sora',sans-serif;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.6);margin:14px 0 8px}
.outline::after{content:attr(data-text);position:absolute;left:0;top:0;background:linear-gradient(100deg,#fff,#ffc2d8 40%,#ff4d82 60%,#f2b6cf);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:0;clip-path:inset(0 100% 0 0);animation:wipeTxt 1.5s cubic-bezier(.76,0,.24,1) .45s forwards;filter:drop-shadow(0 0 30px rgba(255,77,130,.45))}
.band .count{font-size:15px;color:#e6deef}
.band .crumbs{color:#d0c6dc}

/* ---------- card reveal (clip wipe) ---------- */
.ad.rv{opacity:1;translate:none;scale:none;clip-path:inset(100% 0 0 0 round 18px)}
.ad.rv .ph img.on{transform:scale(1.35)}
.ad.rv.in{clip-path:inset(0 0 0 0 round 18px);transition:clip-path 1.1s cubic-bezier(.76,0,.24,1) var(--d,0ms),transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s,border-color .3s}
.ad.rv.in .ph img.on{transform:scale(1.03);transition:opacity .7s,transform 2.2s cubic-bezier(.2,.8,.2,1) var(--d,0ms)}
.ad.rv.in.shown{clip-path:none}
.ad.rv.in.shown:hover .ph img.on{transform:scale(1.13);transition:opacity .7s,transform 7s cubic-bezier(.1,.6,.3,1)}
.ad .sweep{position:absolute;inset:0;z-index:5;pointer-events:none;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.35) 50%,transparent 60%);transform:translateX(-120%)}
.ad.rv.in .sweep{animation:sweep 1.4s cubic-bezier(.6,0,.2,1) calc(var(--d,0ms) + .5s) forwards}
@keyframes sweep{to{transform:translateX(120%)}}

/* ---------- profile ---------- */
.amb{position:fixed;inset:-12%;z-index:-1;pointer-events:none}
.amb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:blur(80px) saturate(1.5) brightness(.5);opacity:0;transition:opacity 1.6s ease}
.amb img.on{opacity:.65}
.pw{position:relative}
.bigname{position:absolute;top:-10px;left:0;width:100vw;margin-left:calc(50% - 50vw);overflow:hidden;white-space:nowrap;pointer-events:none;z-index:-1;-webkit-mask:linear-gradient(180deg,#000 40%,transparent);mask:linear-gradient(180deg,#000 40%,transparent)}
.bigname div{display:inline-block;font:800 clamp(120px,22vw,320px)/1 'Sora',sans-serif;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.07);animation:marq 50s linear infinite;padding-right:.3em}
.stage .slide{clip-path:inset(0 0 0 0)}
.stage .slide.on{animation:slideIn 1.1s cubic-bezier(.76,0,.24,1)}
@keyframes slideIn{from{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0 0 0 0)}}
.stage .slide.on img{animation:kb 9s ease-out forwards}

@media (prefers-reduced-motion:reduce){
 .ad.rv{clip-path:none}.ah-in{transform:none;opacity:1;filter:none}
 .neon-t .n,.neon-t .gl,.iw span{opacity:1;clip-path:none}
 .big-h .split>span{transform:none}.outline::after{clip-path:none}
}
@media(max-width:640px){
 .ah{min-height:620px}.ah .marquee{bottom:84px}
 .cf{width:62vw}
}