@font-face{font-family:'Clash Display';font-weight:700;font-display:swap;src:url('/assets/fonts/clash-700.woff2') format('woff2')}
@font-face{font-family:'Clash Display';font-weight:600;font-display:swap;src:url('/assets/fonts/clash-600.woff2') format('woff2')}
@font-face{font-family:'General Sans';font-weight:400;font-display:swap;src:url('/assets/fonts/gs-400.woff2') format('woff2')}
:root{--k:#000;--w:#fff;--lev1:#7c5cff;--lev2:#ff5e9e;--dim:rgba(255,255,255,.66);--hair:rgba(255,255,255,.14);--sl:-7deg;
--disp:'Clash Display',ui-sans-serif,system-ui,sans-serif;--body:'General Sans','Inter',ui-sans-serif,system-ui,sans-serif;
--mono:ui-monospace,'JetBrains Mono',Menlo,Consolas,monospace;
--alu:linear-gradient(115deg,#f4f4f7 0%,#8e8e96 12%,#ffffff 22%,#5f5f68 38%,#c9c9d0 52%,#54545c 68%,#eeeef2 84%,#77777f 100%)}
*{margin:0;padding:0;box-sizing:border-box}
body{background:
 radial-gradient(60% 50% at 76% 18%,rgba(124,92,255,.13),transparent 60%),
 radial-gradient(44% 38% at 20% 80%,rgba(255,94,158,.10),transparent 66%),
 repeating-linear-gradient(97deg,rgba(255,255,255,.022) 0 1px,transparent 1px 170px),var(--k);
 color:var(--w);font-family:var(--body);font-size:18px;line-height:1.6;overflow-x:hidden}
a{color:inherit}a:focus-visible{outline:2px solid var(--lev2);outline-offset:3px}
.container{max-width:1140px;margin:0 auto;padding:0 32px}
header{position:sticky;top:0;z-index:40;background:rgba(0,0,0,.72);backdrop-filter:blur(16px);border-bottom:1px solid var(--hair)}
.bar{display:flex;align-items:center;justify-content:space-between;height:72px}
.home{font-family:var(--disp);font-weight:700;font-size:12.5px;letter-spacing:.3em;color:var(--dim);text-decoration:none}
.home:hover{color:var(--w)}
.wm{font-family:var(--disp);font-weight:700;font-size:21px;letter-spacing:.14em;
 background:linear-gradient(100deg,#fff 30%,var(--lev1) 72%,var(--lev2) 100%);
 -webkit-background-clip:text;background-clip:text;color:transparent}
.hero{padding:12vh 0 6vh}
.chip{display:inline-block;font-family:var(--mono);font-size:13.5px;font-weight:700;letter-spacing:.26em;padding:9px 16px;margin-bottom:30px;
 border:1px solid transparent;border-image:linear-gradient(90deg,var(--lev1),var(--lev2)) 1;
 transform:skewX(var(--sl))}
.chip span{display:inline-block;transform:skewX(calc(var(--sl)*-1));
 background:linear-gradient(90deg,var(--lev1),var(--lev2));
 -webkit-background-clip:text;background-clip:text;color:transparent}
h1{font-family:var(--disp);font-weight:700;font-size:clamp(56px,9vw,120px);letter-spacing:.1em;line-height:1;
 background:linear-gradient(100deg,#fff 40%,var(--lev1) 78%,var(--lev2) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.line{font-size:clamp(22px,2.3vw,29px);font-weight:600;margin-top:24px;max-width:26em}
.line2{color:var(--dim);margin-top:14px;font-size:19px;font-weight:500;max-width:32em}
.phones{display:flex;gap:7vw;justify-content:center;align-items:flex-start;flex-wrap:wrap;padding:8vh 0 10vh;perspective:1500px}
.phone{width:min(270px,80vw);border-radius:35px;padding:3px;background:var(--alu);
 box-shadow:0 50px 110px -30px rgba(0,0,0,.95);position:relative;
 transform:rotateY(-7deg) rotateX(2deg);transition:transform .3s ease;
 -webkit-box-reflect:below 16px linear-gradient(transparent 70%,rgba(0,0,0,.26))}
.phone:last-child{transform:rotateY(7deg) rotateX(2deg);translate:0 6vh}
.phone:hover{transform:rotateY(0) rotateX(0)}
.phone .bez{background:#050506;border-radius:32px;padding:9px;position:relative;overflow:hidden}
.phone img{display:block;width:100%;border-radius:24px}
.phone .b1,.phone .b2{position:absolute;right:-2.5px;width:3px;border-radius:2px;background:linear-gradient(180deg,#b9b9c0,#5e5e66 50%,#a6a6ae)}
.phone .b1{top:19%;height:44px}.phone .b2{top:19%;margin-top:56px;height:70px}
footer{border-top:1px solid var(--hair);padding:32px 0 42px}
.foot{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;font-family:var(--mono);font-size:13.5px;letter-spacing:.08em;color:var(--dim)}
.foot a{color:var(--dim);text-decoration:none}.foot a:hover{color:var(--w)}
.hero-doc{padding:9vh 0 2vh}
.doc{max-width:820px;padding-bottom:4vh}
.doc h2{font-family:var(--disp);font-weight:600;font-size:clamp(21px,2.6vw,29px);letter-spacing:.03em;margin:52px 0 16px}
.doc p{margin:15px 0;color:rgba(255,255,255,.86)}
.doc strong{color:var(--w)}
.doc ul{margin:15px 0 15px 1.25em}
.doc li{margin:8px 0;color:rgba(255,255,255,.86)}
.doc a{color:var(--w);text-decoration:underline;text-decoration-color:var(--lev1);text-underline-offset:3px}
.doc a:hover{text-decoration-color:var(--lev2)}
.doc code{font-family:var(--mono);font-size:.9em;color:var(--w);background:rgba(255,255,255,.07);border:1px solid var(--hair);padding:1px 6px;white-space:nowrap}
.doc .tbl{overflow-x:auto;margin:20px 0;border:1px solid var(--hair)}
.doc table{border-collapse:collapse;width:100%;min-width:560px;font-size:15.5px}
.doc th{font-family:var(--mono);font-weight:700;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);text-align:left;padding:12px 14px;border-bottom:1px solid var(--hair)}
.doc td{padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.06);vertical-align:top;color:rgba(255,255,255,.86)}
.doc tr:last-child td{border-bottom:none}
.doc-nav{font-family:var(--mono);font-size:13px;letter-spacing:.06em;color:var(--dim);border-top:1px solid var(--hair);padding:26px 0 8vh}
.doc-nav a{color:var(--dim);text-decoration:none}.doc-nav a:hover{color:var(--w)}
.testsec{padding:6vh 0 10vh}
.sec-h{font-family:var(--disp);font-weight:700;font-size:clamp(30px,4.4vw,50px);letter-spacing:.05em;color:var(--w);margin:0 0 6px}
.testnote{color:rgba(255,255,255,.9);font-size:17.5px;font-weight:500;max-width:620px;margin:14px 0}
.testnote strong{color:var(--w)}
.testnote a{color:var(--w)}
.pillstack{display:flex;flex-direction:column;gap:14px;max-width:460px;margin:2vh 0 6vh}
.pill{display:flex;align-items:center;justify-content:center;gap:12px;padding:17px 30px;
 border:1px solid rgba(255,255,255,.28);border-radius:999px;text-decoration:none;
 font-family:Roboto,'General Sans',ui-sans-serif,system-ui,sans-serif;font-size:18px;font-weight:600;color:var(--w);
 background:rgba(255,255,255,.03);transition:border-color .18s ease,background .18s ease}
.pill svg,.pill img{width:22px;height:22px;flex:none}
.pill:hover{border-color:var(--w);background:rgba(255,255,255,.07)}
.pill-off{color:var(--dim);border-color:var(--hair);cursor:default}
.pill-off:hover{border-color:var(--hair);background:rgba(255,255,255,.03)}
@media (max-width:700px){
 .phones{gap:9vh;padding-bottom:6vh}
 .phone,.phone:last-child{-webkit-box-reflect:none;translate:0 0;transform:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

.langs{display:inline-flex;gap:13px;font-family:var(--mono,ui-monospace,monospace);font-size:12px;letter-spacing:.18em;vertical-align:middle}.langs a{color:rgba(255,255,255,.55);text-decoration:none}.langs a:hover{color:#fff}.langs a.on{color:#fff}

.wm-img{height:32px;width:auto;display:block}
.hero-tight{padding:6vh 0 5vh}
.hero-tight .pillstack{margin:3.5vh 0 2.5vh}
.urge{color:var(--w);font-weight:600;font-size:clamp(18px,1.7vw,22px);max-width:32em}

.home{display:inline-flex;align-items:center;gap:9px}
.smark{height:1em;width:auto;display:block}
.lockup,.wm-lock{display:inline-flex;align-items:center;gap:7px;text-decoration:none}
.glyph{height:26px;width:auto;display:block}
.wm-img{height:22px;width:auto;display:block}
.herolock{display:flex;align-items:center;gap:clamp(14px,2.4vw,26px);line-height:0;margin:8px 0 0}
.glyph-l{width:clamp(64px,9vw,104px);height:auto;
 animation:glyphin .65s cubic-bezier(.2,.85,.25,1) both}
.wm-l{width:min(340px,58vw);height:auto;
 animation:wmin .65s .12s cubic-bezier(.2,.85,.25,1) both}
@keyframes glyphin{from{opacity:0;transform:translateX(-18px) skewX(-7deg)}to{opacity:1;transform:none}}
@keyframes wmin{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}

#lmorph{position:fixed;top:0;left:0;z-index:60;display:flex;align-items:center;
 gap:.18em;font-size:26px;transform-origin:0 0;will-change:transform;text-decoration:none}
.glyph-m{height:1em;width:auto;display:block}
.wm-m{height:.85em;width:auto;display:block}
#lslot{display:inline-block}
#lspacer{width:min(430px,74vw);aspect-ratio:3.25/1;margin:10px 0 0}

.hgrid{display:grid;grid-template-columns:minmax(0,330px) minmax(0,1fr);gap:clamp(26px,5vw,72px);align-items:center}
.hphone .phone{width:min(300px,74vw);transform:rotateY(6deg) rotateX(2deg)}
.hphone .phone:hover{transform:rotateY(0) rotateX(0)}
.hero-tight{padding:4vh 0 6vh}
@media (max-width:900px){
 .hgrid{grid-template-columns:1fr}
 .hphone{order:2;display:flex;justify-content:center;margin-top:4vh}
}
