:root{ --pink:#FF3D8A; --pink-soft:#FF7EB3; --gold:#F5C97B; --bg:#160910; --panel:#211019; --line:rgba(255,255,255,.1); --dim:#B98CA0; --text:#FBEFF4; }
html,body{ margin:0; padding:0; background:var(--bg); color:var(--text); font-family:'Poppins',sans-serif; -webkit-font-smoothing:antialiased; scroll-behavior:smooth; overflow-x:hidden; }
*{ box-sizing:border-box; }
h1,h2,h3{ font-family:'Playfair Display',serif; margin:0; }
a{ color:var(--pink-soft); text-decoration:none; }
img{ display:block; width:100%; height:100%; object-fit:cover; }
::selection{ background:var(--pink); color:#fff; }
.wrap{ max-width:1180px; margin:0 auto; padding:0 clamp(20px,4vw,48px); }
@media (prefers-reduced-motion: reduce){ *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; } html,body{ scroll-behavior:auto; } }

.btn{ display:inline-flex; align-items:center; gap:8px; padding:15px 30px; border-radius:999px; font-weight:700; font-size:15px; cursor:pointer; border:none; transition:transform .2s, box-shadow .2s; font-family:'Poppins',sans-serif; }
.btn-main{ background:linear-gradient(135deg,var(--pink),#C7217A); color:#fff; box-shadow:0 8px 24px rgba(255,61,138,.35); }
.btn-main:hover{ transform:translateY(-2px); box-shadow:0 12px 34px rgba(255,61,138,.55); }
.btn-ghost{ background:rgba(255,255,255,.06); color:var(--text); border:1px solid rgba(255,255,255,.18); }
.btn-ghost:hover{ border-color:var(--pink-soft); color:var(--pink-soft); }

/* progress bar */
#sa-progress{ position:fixed; top:0; left:0; right:0; height:3px; background:linear-gradient(90deg,var(--pink-soft),var(--gold)); transform:scaleX(0); transform-origin:left; z-index:1000; box-shadow:0 0 12px rgba(255,61,138,.6); }

/* age gate */
#gate{ position:fixed; inset:0; z-index:2000; background:#0D0509; display:flex; align-items:center; justify-content:center; padding:24px; }
#gate .box{ max-width:420px; text-align:center; background:var(--panel); border:1px solid var(--line); border-radius:20px; padding:40px 28px; animation:saPopIn .5s cubic-bezier(.22,1,.36,1); }
#gate h2{ font-size:26px; margin-bottom:10px; }
#gate p{ color:var(--dim); font-size:14px; line-height:1.6; margin-bottom:24px; }
#gate .row{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
@keyframes saPopIn{ from{ opacity:0; transform:scale(.92) translateY(14px); } to{ opacity:1; transform:none; } }

nav{ position:fixed; top:3px; left:0; right:0; z-index:900; display:flex; align-items:center; justify-content:space-between; padding:16px clamp(20px,4vw,48px); background:rgba(22,9,16,.72); backdrop-filter:blur(14px); border-bottom:1px solid var(--line); }
nav .logo{ font-family:'Playfair Display',serif; font-weight:700; font-size:22px; letter-spacing:.02em; background:linear-gradient(135deg,var(--pink-soft),var(--gold)); -webkit-background-clip:text; background-clip:text; color:transparent; }
nav .links{ display:flex; gap:24px; align-items:center; }
nav .links a.navlink{ color:var(--dim); font-size:14px; font-weight:500; transition:color .2s; }
nav .links a.navlink:hover{ color:var(--pink-soft); }
#cart-btn{ position:relative; background:rgba(255,255,255,.06); border:1px solid var(--line); width:42px; height:42px; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:18px; transition:border-color .2s, transform .2s; }
#cart-btn:hover{ border-color:var(--pink-soft); }
#cart-count{ position:absolute; top:-6px; right:-6px; background:var(--pink); color:#fff; font-size:11px; font-weight:800; min-width:18px; height:18px; border-radius:9px; display:flex; align-items:center; justify-content:center; padding:0 4px; transform:scale(0); transition:transform .2s; }
#cart-count.show{ transform:scale(1); }

/* hero */
header#top{ position:relative; min-height:100vh; display:flex; align-items:center; padding:140px clamp(20px,5vw,64px) 80px; overflow:hidden; background:url('../gallery/hero-bg.jpg') center/cover no-repeat; }
#heroShader{ position:absolute; inset:0; z-index:0; width:100%; height:100%; opacity:.55; }
header#top::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg, rgba(22,9,16,.35), var(--bg) 96%); pointer-events:none; z-index:0; }
header#top .content{ position:relative; z-index:1; max-width:640px; }
header#top .tag{ display:inline-block; padding:7px 16px; border-radius:999px; background:rgba(255,61,138,.14); border:1px solid rgba(255,126,179,.4); color:var(--pink-soft); font-size:13px; font-weight:600; margin-bottom:22px; animation:saGlowPulse 2.4s ease-in-out infinite; }
@keyframes saGlowPulse{ 0%,100%{ box-shadow:0 0 0 rgba(255,61,138,0); } 50%{ box-shadow:0 0 22px rgba(255,61,138,.35); } }
header#top h1{ font-size:clamp(38px,5.5vw,58px); line-height:1.08; margin-bottom:18px; overflow:hidden; }
header#top h1 .word{ display:inline-block; overflow:hidden; vertical-align:top; }
header#top h1 .word span{ display:inline-block; animation:saWordUp .8s cubic-bezier(.22,1,.36,1) backwards; }
@keyframes saWordUp{ from{ opacity:0; transform:translateY(110%); } to{ opacity:1; transform:translateY(0); } }
header#top h1 span.grad{ background:linear-gradient(135deg,var(--pink-soft),var(--gold)); -webkit-background-clip:text; background-clip:text; color:transparent; }
header#top p.sub{ color:var(--dim); font-size:17px; line-height:1.6; margin-bottom:32px; max-width:520px; }
header#top .stats{ display:flex; gap:32px; margin-top:44px; flex-wrap:wrap; }
header#top .stats div b{ font-size:24px; font-family:'Playfair Display',serif; display:block; }
header#top .stats div span{ color:#8C6A78; font-size:13px; }

/* floating hearts */
.sa-floaters{ position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.sa-floaters i{ position:absolute; bottom:-10%; opacity:.5; animation:saFloatUp linear infinite; color:var(--pink-soft); font-style:normal; }
@keyframes saFloatUp{ from{ transform:translateY(0) rotate(0deg); opacity:0; } 10%{ opacity:.55; } to{ transform:translateY(-120vh) rotate(25deg); opacity:0; } }

/* marquee */
.sa-marquee{ position:relative; z-index:1; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(255,61,138,.06); padding:14px 0; overflow:hidden; white-space:nowrap; }
.sa-marquee .track{ display:inline-flex; gap:48px; animation:saMarquee 26s linear infinite; }
.sa-marquee span{ font-size:13px; font-weight:600; letter-spacing:.04em; color:var(--pink-soft); }
@keyframes saMarquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

section{ padding:90px clamp(20px,5vw,64px); position:relative; }
.sec-head{ text-align:center; max-width:600px; margin:0 auto 50px; }
.sec-head .eyebrow{ color:var(--pink-soft); font-size:13px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; margin-bottom:10px; }
.sec-head h2{ font-size:clamp(28px,3.6vw,40px); margin-bottom:14px; }
.sec-head p{ color:var(--dim); font-size:15px; line-height:1.6; }

[data-reveal]{ opacity:0; transform:translateY(30px); }
[data-reveal].revealed{ opacity:1; transform:translateY(0); transition:opacity .8s cubic-bezier(.22,1,.36,1) var(--d,0ms), transform .8s cubic-bezier(.22,1,.36,1) var(--d,0ms); }

/* sets gallery */
.sets-grid{ max-width:1180px; margin:0 auto; display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:20px; }
.set-card{ position:relative; border-radius:22px; overflow:hidden; border:1px solid var(--line); background:var(--panel); will-change:transform; transition:transform .35s, box-shadow .35s, border-color .35s; }
.set-card:hover{ transform:translateY(-6px); border-color:rgba(255,126,179,.5); box-shadow:0 22px 55px rgba(255,61,138,.2), 0 0 40px -10px rgba(245,201,123,.18); }
.set-media{ position:relative; height:200px; overflow:hidden; }
.set-media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:blur(6px) brightness(.55) saturate(1.15); transform:scale(1.1); transition:transform .4s; }
.set-card:hover .set-media img{ transform:scale(1.18); }
.set-media::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg, transparent 45%, var(--panel) 100%); }
.set-badge{ position:absolute; top:12px; left:12px; z-index:2; font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; font-weight:700; background:rgba(10,4,7,.55); border:1px solid rgba(255,255,255,.18); backdrop-filter:blur(6px); padding:5px 12px; border-radius:999px; }
.set-lock{ position:absolute; inset:0; z-index:1; display:flex; align-items:center; justify-content:center; }
.set-lock span{ width:52px; height:52px; border-radius:50%; background:rgba(0,0,0,.4); border:1px solid rgba(245,201,123,.4); display:flex; align-items:center; justify-content:center; font-size:20px; backdrop-filter:blur(4px); animation:saLockPulse 3.2s ease-in-out infinite; }
@keyframes saLockPulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(255,61,138,.35), 0 0 24px 4px rgba(245,201,123,.12); } 50%{ box-shadow:0 0 0 8px rgba(255,61,138,.05), 0 0 32px 8px rgba(245,201,123,.22); } }
.set-body{ position:relative; z-index:2; padding:18px 20px 20px; }
.set-body .title{ font-family:'Playfair Display',serif; font-size:18px; font-weight:700; }
.set-body .meta{ color:var(--dim); font-size:12.5px; margin-top:2px; margin-bottom:16px; }
.variant-btns{ display:flex; flex-direction:column; gap:9px; }
.add-btn{ position:relative; overflow:hidden; display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; padding:11px 16px; border-radius:999px; border:1px solid var(--line); background:rgba(255,255,255,.04); color:var(--text); font-size:13px; font-weight:600; cursor:pointer; transition:border-color .2s, background .2s, transform .15s; }
.add-btn:hover{ border-color:rgba(255,126,179,.5); background:rgba(255,255,255,.08); }
.add-btn:active{ transform:scale(.96); }
.add-btn .vb-price{ font-weight:800; background:linear-gradient(135deg,var(--gold),var(--pink-soft)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.add-btn.video{ border-color:rgba(245,201,123,.4); box-shadow:0 0 22px -10px rgba(245,201,123,.6); }
.set-foot{ text-align:center; font-size:11px; color:#8C6A78; margin-top:14px; letter-spacing:.02em; }

/* VIP pricing */
#vip{ position:relative; }
#vip .bg{ position:absolute; inset:0; z-index:0; }
#vip .bg img{ opacity:.28; }
#vip .bg::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg, var(--bg), rgba(22,9,16,.4) 30%, var(--bg)); }
#vip .inner{ position:relative; z-index:1; }
.plans{ max-width:960px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.plan{ background:var(--panel); border:1px solid var(--line); border-radius:20px; padding:32px 26px; display:flex; flex-direction:column; gap:16px; transition:transform .3s, box-shadow .3s, border-color .3s; }
.plan:hover{ transform:translateY(-6px); border-color:rgba(255,126,179,.4); box-shadow:0 20px 50px rgba(255,61,138,.14); }
.plan.featured{ border-color:rgba(245,201,123,.55); box-shadow:0 0 40px rgba(255,61,138,.18), 0 10px 50px -12px rgba(245,201,123,.35); background:linear-gradient(160deg, var(--panel), rgba(245,201,123,.06)); transform:scale(1.04); position:relative; }
.plan.featured:hover{ transform:scale(1.04) translateY(-6px); }
.plan.featured .badge{ position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:linear-gradient(135deg,var(--gold),#fff3d6); color:#2a0e18; font-size:11px; font-weight:800; padding:5px 14px; border-radius:999px; letter-spacing:.04em; box-shadow:0 4px 14px rgba(245,201,123,.4); }
.plan.featured .price{ background:linear-gradient(135deg,var(--gold),var(--pink-soft)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.plan h3{ font-size:15px; color:var(--dim); font-weight:600; text-transform:uppercase; letter-spacing:.06em; }
.plan .price{ font-family:'Playfair Display',serif; font-size:38px; }
.plan .price small{ font-size:14px; color:#8C6A78; font-family:'Poppins',sans-serif; }
.plan ul{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; flex:1; }
.plan ul li{ font-size:13.5px; color:#EBD3DF; display:flex; gap:8px; align-items:flex-start; }
.plan ul li::before{ content:'✓'; color:var(--pink-soft); font-weight:700; }

#faq .item{ max-width:760px; margin:0 auto 14px; background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:20px 24px; cursor:pointer; transition:border-color .2s; }
#faq .item:hover{ border-color:rgba(255,126,179,.3); }
#faq .item .q{ display:flex; justify-content:space-between; align-items:center; font-weight:600; font-size:15px; }
#faq .item .a{ max-height:0; overflow:hidden; color:var(--dim); font-size:13.5px; line-height:1.6; transition:max-height .35s; }
#faq .item.open .a{ max-height:200px; margin-top:12px; }
#faq .item .icon{ transition:transform .3s; color:var(--pink-soft); flex-shrink:0; }
#faq .item.open .icon{ transform:rotate(45deg); }

footer{ padding:50px clamp(20px,5vw,64px) 34px; border-top:1px solid var(--line); text-align:center; }
footer .legal{ color:#8C6A78; font-size:12px; max-width:640px; margin:18px auto 0; line-height:1.6; }
footer .flinks{ display:flex; gap:24px; justify-content:center; margin-bottom:14px; flex-wrap:wrap; }
footer .flinks a{ color:var(--dim); font-size:13px; }
footer .flinks a:hover{ color:var(--pink-soft); }

/* ===== toast ===== */
.toast{ position:fixed; bottom:1.4rem; left:50%; transform:translateX(-50%) translateY(120%); background:linear-gradient(120deg,var(--pink),#C7217A); color:#fff; padding:.85rem 1.5rem; border-radius:50px; font-size:.86rem; font-weight:600; z-index:1600; box-shadow:0 12px 40px rgba(255,61,138,.5); transition:.4s; letter-spacing:.02em; }
.toast.show{ transform:translateX(-50%) translateY(0); }

/* ===== spark: set -> cart icon ===== */
.sa-spark{ position:fixed; width:16px; height:16px; border-radius:50%; background:var(--pink-soft); box-shadow:0 0 22px 7px var(--pink); z-index:1700; pointer-events:none; transform:translate(-50%,-50%); transition:left .8s cubic-bezier(.34,.02,.24,1), top .8s cubic-bezier(.34,.02,.24,1); animation:saSparkPulse .35s ease-in-out infinite; }
@keyframes saSparkPulse{ 0%,100%{ transform:translate(-50%,-50%) scale(1); } 50%{ transform:translate(-50%,-50%) scale(1.35); } }
.sa-flash{ position:fixed; width:56px; height:56px; border-radius:50%; background:radial-gradient(circle,#fff,var(--pink) 55%,transparent 75%); z-index:1701; pointer-events:none; animation:saFlash .5s ease-out forwards; }
@keyframes saFlash{ 0%{ transform:translate(-50%,-50%) scale(.15); opacity:0; } 25%{ transform:translate(-50%,-50%) scale(1.3); opacity:1; } 100%{ transform:translate(-50%,-50%) scale(2.2); opacity:0; } }

/* ===== cart drawer ===== */
#overlay{ position:fixed; inset:0; background:rgba(10,4,7,.6); backdrop-filter:blur(4px); z-index:1400; opacity:0; pointer-events:none; transition:opacity .3s; }
#overlay.show{ opacity:1; pointer-events:auto; }
#cart-drawer{ position:fixed; top:0; right:0; height:100%; width:min(420px,92vw); background:var(--panel); border-left:1px solid var(--line); z-index:1500; transform:translateX(100%); transition:transform .4s cubic-bezier(.22,1,.36,1); display:flex; flex-direction:column; }
#cart-drawer.open{ transform:translateX(0); }
#cart-drawer .cd-head{ display:flex; align-items:center; justify-content:space-between; padding:22px 24px; border-bottom:1px solid var(--line); }
#cart-drawer .cd-head h3{ font-size:19px; }
#cart-drawer .cd-close{ background:none; border:none; color:var(--dim); font-size:20px; cursor:pointer; }
#cart-drawer .cd-close:hover{ color:var(--pink-soft); }
#cart-items{ flex:1; overflow-y:auto; padding:18px 24px; display:flex; flex-direction:column; gap:14px; }
.cart-empty{ text-align:center; color:var(--dim); margin-top:3rem; font-family:'Playfair Display',serif; font-size:1.1rem; }
.ci{ display:flex; gap:12px; align-items:flex-start; border-bottom:1px solid var(--line); padding-bottom:12px; }
.ci img{ width:56px; height:66px; object-fit:cover; border-radius:10px; }
.ci-info{ flex:1; }
.ci-name{ font-size:.92rem; font-weight:600; }
.ci-meta{ font-size:.74rem; color:var(--dim); }
.ci-price{ color:var(--pink-soft); font-size:.9rem; margin-top:.2rem; }
.ci-qty{ display:flex; align-items:center; gap:.5rem; margin-top:.4rem; }
.ci-qty button{ width:24px; height:24px; border-radius:6px; border:1px solid var(--line); background:none; color:var(--text); cursor:pointer; }
.ci-qty button:hover{ border-color:var(--pink-soft); }
.ci-rm{ background:none; border:none; color:var(--dim); cursor:pointer; font-size:.74rem; }
.ci-rm:hover{ color:var(--pink); }
#cart-drawer .cd-foot{ border-top:1px solid var(--line); padding:20px 24px 26px; display:flex; flex-direction:column; gap:12px; }
.cp-form{ display:flex; gap:.5rem; }
.cp-form input{ flex:1; min-width:0; background:#0c0509; border:1px dashed var(--line); border-radius:8px; padding:.6rem .7rem; color:var(--text); font-size:.86rem; }
.cp-form input:focus{ outline:none; border-color:var(--pink-soft); border-style:solid; }
.cp-form button{ background:rgba(255,61,138,.15); border:1px solid var(--pink-soft); color:var(--pink-soft); border-radius:8px; padding:.4rem .9rem; cursor:pointer; font-size:.76rem; font-weight:700; letter-spacing:.03em; white-space:nowrap; }
.cp-form button:hover{ background:rgba(255,61,138,.28); }
.cp-applied{ display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; background:rgba(255,126,179,.1); border:1px solid rgba(255,126,179,.35); border-radius:8px; padding:.55rem .7rem; font-size:.82rem; color:#ffd7e6; }
.cp-applied b{ color:#fff; letter-spacing:.03em; }
.cp-applied .cp-lbl{ color:var(--dim); font-size:.74rem; flex:1 1 100%; }
.cp-applied #cp-remove{ background:none; border:none; color:var(--dim); cursor:pointer; font-size:.74rem; text-decoration:underline; }
.cd-line{ display:flex; justify-content:space-between; font-size:.86rem; color:var(--dim); }
.cd-line.disc{ color:var(--pink-soft); }
.cd-line.total{ font-size:1.15rem; font-weight:700; color:var(--text); padding-top:6px; border-top:1px solid var(--line); }
#cart-drawer input[type=email]{ width:100%; padding:12px 14px; border-radius:10px; border:1px solid var(--line); background:rgba(255,255,255,.04); color:#fff; font-size:13.5px; }

@media (max-width:900px){ .sets-grid{ grid-template-columns:repeat(2,1fr); } .plans{ grid-template-columns:1fr; } .plan.featured{ transform:none; } nav .links a.navlink{ display:none; } }