@font-face{font-family:Manrope;src:url('./manrope.woff2') format('woff2');font-weight:200 800;font-style:normal;font-display:swap}
:root{font-family:Manrope,Arial,sans-serif;color:#000;background:#fff;font-synthesis:none;--purple:#533afd}
*{box-sizing:border-box}
body{margin:0}
.page{margin:auto;min-height:100svh;display:flex;flex-direction:column;--gutter:max(clamp(20px,5vw,75px),calc((100vw - 1350px)/2))}
header{display:flex;align-items:center;justify-content:space-between;height:76px;min-height:76px;padding:0 var(--gutter);border-bottom:1px solid #e3e8ee;background:#fff}
.logo{display:block;width:190px;height:auto;object-fit:contain}
.status{display:flex;align-items:center;gap:9px;font-size:12px;font-weight:600;color:#5e5e66;border:1px solid #e8e6f0;padding:10px 15px;border-radius:99px}
.dot{width:6px;height:6px;background:var(--purple);border-radius:50%}
main{display:grid;grid-template-columns:1.35fr 1fr;align-items:center;flex:1;gap:20px;min-height:610px;padding:70px var(--gutter) 66px;position:relative;isolation:isolate}
main:before{content:"";position:absolute;inset:0 0 30%;z-index:-3;background:radial-gradient(ellipse at 0% 5%,#f5e9d4 0%,transparent 46%),radial-gradient(ellipse at 23% 0%,#f6a36e85 0%,transparent 50%),radial-gradient(ellipse at 48% 5%,#f96bee70 0%,transparent 58%),radial-gradient(ellipse at 78% 0%,#665efd70 0%,transparent 56%),radial-gradient(ellipse at 100% 22%,#ea226165 0%,transparent 50%);mask-image:linear-gradient(#000 0%,#0009 30%,transparent 85%)}
.intro{position:relative;z-index:2}
.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.19em;color:var(--purple);font-weight:700;margin:0 0 27px}
h1{font-size:clamp(44px,4.8vw,72px);line-height:1.08;letter-spacing:-.045em;font-weight:300;margin:0 0 30px}
h1 span{color:var(--purple)}
.description{font-size:16px;color:#6b6b6b;line-height:1.85;margin:0;letter-spacing:-.015em}
.launch-note{display:flex;align-items:center;gap:13px;margin-top:43px;font-size:12px;color:#55555c}
.line{width:29px;height:1px;background:var(--purple)}
.sculpture{height:460px;position:relative;isolation:isolate;display:grid;place-items:center}
.halo{position:absolute;width:100%;height:110%;background:radial-gradient(ellipse,#e7e0ff80 0%,#f4efff30 34%,transparent 68%);z-index:-2}
.floor{position:absolute;bottom:80px;width:240px;height:30px;background:#5a369e26;filter:blur(21px);border-radius:50%;transform:rotate(-15deg)}
.object{position:relative;width:260px;height:280px;transform:rotate(-15deg) skewY(8deg);animation:float 9s ease-in-out infinite}
.frame{position:absolute;width:236px;height:252px;border:40px solid var(--purple);border-radius:51px}
.back{left:33px;top:0;border-color:#3420b7;box-shadow:inset 3px 3px 4px #180d7233,2px 4px 4px #38239825}
.front{left:0;top:23px;border-color:#6c52ff;background:linear-gradient(140deg,#f5f0ff,#e9e0ff);box-shadow:inset 0 0 0 2px #ffffff22,0 2px 0 #4630dd}
.front:after{content:"";position:absolute;right:-41px;bottom:-41px;width:106px;height:107px;background:#eee7ff;border-radius:0 0 20px 0}
.tile{position:absolute;width:113px;height:113px;left:167px;top:187px;border-radius:27px;background:linear-gradient(140deg,#a494ff 0%,#6343ff 55%,#533afd);box-shadow:16px -13px 0 #3924bf,0 18px 22px #4931a92b,inset 1px 2px 2px #ffffff70;transform:translate(15px,16px)}
.tile span{display:block;width:38px;height:38px;border:1px solid #ffffff50;border-radius:11px;margin:36px}
.coordinate{position:absolute;color:#98919f;font-size:9px;letter-spacing:.12em}
.two{bottom:13px;right:0;letter-spacing:.03em}
footer{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid #ededf0;padding:26px 0 30px;margin:0 var(--gutter);color:#86868c;font-size:11px}
@keyframes float{0%,100%{transform:translateY(0) rotate(-15deg) skewY(8deg)}50%{transform:translateY(-12px) rotate(-12deg) skewY(8deg)}}
@media(prefers-reduced-motion:reduce){.object{animation:none}}
@media(min-width:1450px){main{min-height:700px}}
@media(max-width:760px){.status{padding:8px 11px;font-size:10px}main{grid-template-columns:1fr;padding:52px var(--gutter) 30px;gap:18px;min-height:0}.eyebrow{margin-bottom:20px}h1{font-size:clamp(40px,8.5vw,60px);margin-bottom:24px}.description{font-size:14px}.launch-note{margin-top:25px}.sculpture{height:330px}.object{scale:.8}.floor{bottom:42px}.two{bottom:0}.halo{height:120%}footer{font-size:10px;padding:23px 0;flex-wrap:wrap;gap:12px}footer span:nth-child(2){display:none}}
@media(max-width:600px){.logo{width:160px}}
@media(max-width:360px){.desktop-break{display:none}.status{font-size:9px;padding:7px 8px}}