:root{
 --bg:#1C0B36; --bg2:#2A1150; --panel:#2F1659; --line:#4A2A85;
 --ink:#FFF8FF; --muted:#CBB8EE; --dim:#9D88C8;
 --violet:#8466FF; --violet2:#B3A2FF; --hole:#E8344F; --hole2:#FF6B7F;
 --gold:#FBC02D; --slime:#8BD13A; --outline:#2D0F2E;
 --maxw:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);
 font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.6;
 -webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--violet2);text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.wrap{max-width:var(--maxw);margin:0 auto;padding-left:20px;padding-right:20px}
h1,h2,h3{font-family:"Lilita One","Fredoka",system-ui,sans-serif;font-weight:400;
 letter-spacing:.01em;text-wrap:balance;margin:0}

nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;
 background:rgba(28,11,54,.86);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
nav .wrap{display:flex;align-items:center;gap:18px;padding-block:10px}
nav img{height:32px;width:auto}
nav .sp{flex:1}
nav a.l{color:var(--muted);font-size:14px;font-weight:600}
nav a.l:hover{color:var(--ink);text-decoration:none}
@media(max-width:760px){nav a.l.hide{display:none}}

.btn{display:inline-block;padding:11px 20px;border-radius:999px;font-weight:700;font-size:15px;
 border:2px solid var(--line);color:var(--ink);background:var(--panel);
 transition:transform .12s ease,border-color .12s ease}
.btn:hover{border-color:var(--violet2);text-decoration:none;transform:translateY(-1px)}
.btn.p{background:linear-gradient(180deg,var(--hole2),var(--hole));border-color:var(--outline);
 color:#fff;box-shadow:0 3px 0 var(--outline)}
.btn.p:hover{filter:brightness(1.06)}
nav .btn{padding:8px 16px;font-size:14px}

.hero{position:relative;border-bottom:1px solid var(--line);overflow:hidden;
 background:#5E2BC4}
.hero .bgimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:78% 50%}
.hero .veil{position:absolute;inset:0;
 background:linear-gradient(90deg,rgba(28,11,54,.92) 0%,rgba(28,11,54,.72) 42%,rgba(28,11,54,.05) 72%),
 linear-gradient(180deg,rgba(28,11,54,0) 70%,rgba(28,11,54,.9))}
.hero .wrap{position:relative;padding-block:70px 60px}
.hero .logo{width:min(440px,82vw);height:auto;margin:0 0 22px;filter:drop-shadow(0 6px 0 rgba(0,0,0,.25))}
.eyebrow{font-family:Inter,sans-serif;font-weight:700;font-size:12px;letter-spacing:.16em;
 text-transform:uppercase;color:var(--gold);margin:0 0 14px}
.hero h1{font-size:clamp(32px,5.6vw,56px);line-height:1.05;margin-bottom:16px;max-width:16ch}
.hero h1 em{font-style:normal;color:var(--gold)}
.hero p.lede{font-size:clamp(16px,2vw,19px);color:var(--muted);max-width:52ch;margin:0 0 26px}
.cta{display:flex;flex-wrap:wrap;gap:11px;margin-bottom:22px}
.specs{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:13px;color:var(--dim)}
.specs b{color:var(--ink);font-weight:700}
@media(max-width:760px){
 .hero .veil{background:linear-gradient(180deg,rgba(28,11,54,.55),rgba(28,11,54,.94) 60%)}
 .hero .bgimg{object-position:85% 50%}
}

section{padding-block:60px;border-bottom:1px solid var(--line)}
section h2{font-size:clamp(26px,3.8vw,36px);margin-bottom:10px}
section .sub{color:var(--muted);max-width:66ch;margin:0 0 30px}

.loop{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;counter-reset:s}
.step{background:var(--panel);border:2px solid var(--line);border-radius:18px;padding:18px;position:relative}
.step::before{counter-increment:s;content:counter(s);
 display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;
 background:radial-gradient(circle at 50% 60%,var(--outline) 30%,#7A1F5C 31% 52%,var(--hole) 53%);
 color:transparent;font-size:0}
.step h3{font-size:20px;margin:10px 0 6px}
.step p{margin:0;font-size:14.5px;color:var(--muted)}

.feats{display:grid;grid-template-columns:repeat(auto-fit,minmax(265px,1fr));gap:16px}
.feat{border-left:4px solid var(--violet);border-radius:2px;padding-left:16px}
.feat.r{border-left-color:var(--hole)}
.feat.y{border-left-color:var(--gold)}
.feat.g{border-left-color:var(--slime)}
.feat h3{font-size:20px;margin-bottom:6px}
.feat p{margin:0;color:var(--muted);font-size:14.5px}

.modes{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}
.mode{background:var(--panel);border:2px solid var(--line);border-radius:20px;padding:22px}
.mode .tag{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
 padding:4px 10px;border-radius:999px;background:var(--hole);color:#fff;margin-bottom:10px}
.mode.inf .tag{background:var(--violet)}
.mode h3{font-size:26px;margin-bottom:8px}
.mode p{margin:0;color:var(--muted);font-size:15px}

.shots{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:16px}
figure{margin:0;background:var(--panel);border:2px solid var(--line);border-radius:16px;overflow:hidden}
figure img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
figcaption{padding:13px 15px}
figcaption b{display:block;font-size:14.5px;margin-bottom:3px}
figcaption span{font-size:13px;color:var(--muted)}

details{border-bottom:1px solid var(--line)}
details summary{cursor:pointer;padding:15px 0;font-weight:700;font-size:16px;list-style:none;
 display:flex;justify-content:space-between;gap:14px;align-items:center}
details summary::-webkit-details-marker{display:none}
details summary::after{content:"+";color:var(--gold);font-size:22px;line-height:1;flex:none}
details[open] summary::after{content:"\2013"}
details p{margin:0 0 15px;color:var(--muted);max-width:70ch}

.band{background:radial-gradient(ellipse at 50% 120%,#6C2BD9 0%,var(--bg2) 45%,var(--bg) 80%);text-align:center}
.band h2{margin-bottom:10px}
.band p{color:var(--muted);max-width:52ch;margin:0 auto 22px}

footer{padding-block:32px;color:var(--dim);font-size:13.5px}
footer .wrap{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center}
footer .sp{flex:1}

/* press page */
.ph{padding-block:46px 30px;border-bottom:1px solid var(--line)}
.ph h1{font-size:clamp(34px,5vw,50px);margin-bottom:10px}
.fact{width:100%;border-collapse:collapse;font-size:14.5px}
.fact th{text-align:left;padding:9px 14px 9px 0;color:var(--muted);font-weight:500;
 width:180px;vertical-align:top;border-bottom:1px solid var(--line)}
.fact td{padding:9px 0;border-bottom:1px solid var(--line);vertical-align:top}
@media(max-width:560px){.fact th{width:118px;font-size:13px}}
.dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:12px}
.dl a{background:var(--panel);border:2px solid var(--line);border-radius:14px;padding:14px;
 display:block;color:var(--ink)}
.dl a:hover{border-color:var(--violet2);text-decoration:none}
.dl b{display:block;font-size:14.5px;margin-bottom:3px}
.dl span{font-size:12px;color:var(--dim);font-family:"JetBrains Mono",ui-monospace,monospace}
.note{background:var(--panel);border:2px solid var(--line);border-left:5px solid var(--gold);
 border-radius:12px;padding:14px 16px;color:var(--muted);font-size:14px;margin:0 0 26px}
.quote{border-left:4px solid var(--hole);padding-left:18px;margin:0 0 24px;
 font-size:17px;color:var(--ink);max-width:62ch}
