@font-face{font-family:Geist;src:url('assets/geist-latin.woff2') format('woff2');font-weight:100 900;font-display:swap}
:root{font-family:Geist,Arial,sans-serif;color:#f5f1f6;background:#111013;color-scheme:dark;font-synthesis:none;--pink:#f47fad;--muted:#bcb4c1}
*{box-sizing:border-box}
body{margin:0;min-width:280px}
::selection{background:var(--pink);color:#111013}
.page{width:min(1440px,100%);min-height:100dvh;margin:auto;padding:0 clamp(24px,5.5vw,88px);display:grid;grid-template-rows:auto 1fr auto;overflow:hidden}
.header{height:112px;display:flex;align-items:center;justify-content:space-between;gap:24px;position:relative;z-index:2}
.logo{width:164px;height:auto;display:block}
.availability{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:10px}
.availability>span{width:6px;height:6px;background:var(--pink);border-radius:50%;box-shadow:0 0 14px #f47fad60}
main{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:12px;min-height:520px;padding:56px 0 72px;position:relative}
.copy{position:relative;z-index:1}
.eyebrow{font-size:11px;font-weight:550;text-transform:uppercase;letter-spacing:.2em;margin:0 0 28px;color:var(--pink)}
h1{font-size:clamp(42px,5vw,72px);line-height:1.09;font-weight:450;letter-spacing:-.055em;margin:0 0 28px;text-wrap:balance}
h1 span{color:var(--pink)}
.description{font-size:clamp(15px,1.2vw,17px);line-height:1.8;color:var(--muted);margin:0;max-width:440px}
.closing{display:flex;align-items:center;gap:16px;font-size:14px;margin:36px 0 0;color:#f5f1f6}
.closing::before{content:'';width:32px;height:1px;background:var(--pink)}
.art{height:440px;position:relative;display:grid;place-items:center;perspective:1000px;isolation:isolate;--rx:0deg;--ry:0deg}
.art-light{position:absolute;width:125%;height:125%;background:radial-gradient(ellipse,#a7266824 0%,#8b21550d 38%,transparent 66%);pointer-events:none}
.frame{position:absolute;width:270px;height:270px;border:1px solid #f47fad16;transform:rotate(45deg);pointer-events:none}
.frame-back{width:360px;height:360px;border-color:#f47fad09}
.frame-front::before,.frame-front::after{content:'';position:absolute;width:22px;height:22px;border-color:#f47fad65;border-style:solid}
.frame-front::before{top:-1px;left:-1px;border-width:1px 0 0 1px}
.frame-front::after{bottom:-1px;right:-1px;border-width:0 1px 1px 0}
.symbol-depth{position:relative;width:100%;height:100%;display:grid;place-items:center;transform:rotateX(var(--rx)) rotateY(var(--ry));transition:transform .65s cubic-bezier(.2,.7,.2,1);will-change:transform}
.symbol{position:absolute;width:790px;max-width:none;height:auto;filter:drop-shadow(0 24px 40px #0005);pointer-events:none}
footer{position:relative;z-index:1;border-top:1px solid #ffffff12;min-height:80px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:var(--muted);font-size:11px;letter-spacing:.015em}
@media(prefers-reduced-motion:no-preference){
 .header{animation:arrive .9s both}
 .copy{animation:arrive 1.1s .12s both}
 .art{animation:arrive 1.4s .2s both}
 footer{animation:arrive 1s .35s both}
 .symbol{animation:float 8s ease-in-out infinite}
 .art-light{animation:breathe 8s ease-in-out infinite}
 @keyframes arrive{from{opacity:0;translate:0 18px}to{opacity:1;translate:0 0}}
 @keyframes float{0%,100%{translate:0 0}50%{translate:0 -12px}}
 @keyframes breathe{0%,100%{opacity:.65}50%{opacity:1}}
}
@media(min-width:1500px){main{min-height:620px}}
@media(max-width:1023px){.page{padding-inline:40px}h1{font-size:52px}.symbol{width:660px}.frame{width:225px;height:225px}.frame-back{width:300px;height:300px}.art{height:380px}main{grid-template-columns:1.2fr 1fr}.desktop-break{display:none}}
@media(max-width:767px){
 .page{padding-inline:26px}.header{height:90px}.logo{width:138px}
 main{grid-template-columns:1fr;gap:22px;padding:40px 0 38px;min-height:0}
 h1{font-size:clamp(37px,8.5vw,60px);letter-spacing:-.05em;margin-bottom:22px}
 .eyebrow{margin-bottom:22px;font-size:10px}.description{font-size:15px;max-width:360px}.closing{margin-top:24px}
 .art{height:250px;width:100%;max-width:400px;margin-inline:auto}.symbol{width:490px}.frame{width:172px;height:172px}.frame-back{width:222px;height:222px}
 footer{font-size:10px;min-height:76px;gap:12px;flex-wrap:wrap;padding-block:20px}
}
@media(max-width:360px){.page{padding-inline:20px}.availability{font-size:11px}.art{height:220px}.symbol{width:440px}footer{flex-direction:column;align-items:flex-start;justify-content:center;gap:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.symbol-depth{transform:none;will-change:auto}}