:root{
  --bg:#FBFAFF;
  --panel:#FFFFFF;
  --panel-2:#F4F1FC;
  --line:rgba(24,16,60,.10);
  --line-2:rgba(24,16,60,.18);
  --text:#1B1733;
  --muted:#666084;
  --violet:#6D4DFF;
  --violet-soft:#8B5CF6;
  --violet-ink:#3B2E73;
  --teal:#7C6CFF;
  --grad:linear-gradient(120deg,#B388FF 0%,#7C5CFF 28%,#C084FC 52%,#8B5CF6 76%,#B388FF 100%);
  --grad-btn:linear-gradient(135deg,#8B5CF6 0%,#6D4DFF 45%,#A78BFA 100%);
  --shadow:0 18px 48px rgba(109,77,255,.14);
  --shadow-lg:0 28px 70px rgba(109,77,255,.22);
}
*{ box-sizing:border-box; margin:0; }
html,body{ background:var(--bg); color:var(--text); font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; -webkit-font-smoothing:antialiased; overflow-x:hidden; scroll-behavior:smooth; }
a{ text-decoration:none; color:inherit; }
::selection{ background:rgba(139,92,246,.25); }
.wrap{ max-width:1160px; margin:0 auto; padding:0 26px; position:relative; z-index:1; }

/* aurora & grid backdrop */
.aurora{ position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.aurora .blob{ position:absolute; border-radius:50%; filter:blur(90px); opacity:.55; }
.blob.a{ width:640px; height:640px; left:-220px; top:-220px; background:radial-gradient(closest-side,#C7B5FF,transparent 70%); animation:drift1 22s ease-in-out infinite alternate; }
.blob.b{ width:560px; height:560px; right:-200px; top:6%; background:radial-gradient(closest-side,#DCD2FF,transparent 70%); animation:drift2 19s ease-in-out infinite alternate; }
.blob.c{ width:680px; height:680px; left:30%; bottom:-320px; background:radial-gradient(closest-side,#EFE0FF,transparent 70%); animation:drift3 26s ease-in-out infinite alternate; }
@keyframes drift1{ to{ transform:translate(130px,90px) scale(1.15); } }
@keyframes drift2{ to{ transform:translate(-120px,130px) scale(1.12); } }
@keyframes drift3{ to{ transform:translate(-160px,-90px) scale(1.1); } }
.grid-overlay{ position:fixed; inset:0; z-index:0; pointer-events:none; background-image:linear-gradient(rgba(24,16,60,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(24,16,60,.055) 1px,transparent 1px); background-size:46px 46px; mask-image:radial-gradient(ellipse 90% 65% at 50% 0%, black 35%, transparent 78%); -webkit-mask-image:radial-gradient(ellipse 90% 65% at 50% 0%, black 35%, transparent 78%); }
.noise{ position:fixed; inset:0; z-index:0; pointer-events:none; opacity:.035; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E"); }
main{ position:relative; z-index:1; }

/* nav */
nav{ position:sticky; top:0; z-index:40; backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); background:rgba(255,255,255,.78); border-bottom:1px solid rgba(24,16,60,.08); }
.nav-in{ height:60px; display:flex; align-items:center; justify-content:space-between; gap:18px; }
.brand{ display:flex; align-items:center; gap:11px; font-weight:800; font-size:17px; letter-spacing:-.3px; color:var(--violet-ink); }
.brand-orb{ width:20px; height:20px; border-radius:50%; background:conic-gradient(from 210deg,#7C5CFF,#C084FC,#8B5CF6,#7C5CFF); box-shadow:0 0 14px rgba(124,92,255,.5), inset 0 0 6px rgba(255,255,255,.7); }
.nav-links{ display:flex; gap:22px; align-items:center; font-size:13.5px; color:var(--muted); }
.nav-links a{ transition:color .15s; }
.nav-links a:hover,.nav-links a.active{ color:var(--violet); }
.nav-links a.active{ text-decoration:underline; text-underline-offset:6px; text-decoration-color:var(--violet); text-decoration-thickness:2px; }
.nav-cta{ display:inline-flex; align-items:center; padding:9px 18px; border-radius:999px; background:var(--grad-btn); color:#FFFFFF; font-size:13px; font-weight:800; box-shadow:0 10px 28px rgba(124,92,255,.35); transition:transform .15s, box-shadow .2s; }
.nav-cta:hover{ transform:translateY(-1px); box-shadow:0 14px 34px rgba(124,92,255,.45); }

/* hero */
.eyebrow{ display:inline-flex; gap:10px; align-items:center; padding:6px 14px; border-radius:999px; border:1px solid rgba(124,92,255,.3); background:#FFFFFF; font-size:11.5px; font-weight:700; letter-spacing:.6px; text-transform:uppercase; color:#5A3FE0; margin-bottom:26px; box-shadow:0 6px 18px rgba(124,92,255,.12); }
.pulse{ width:8px; height:8px; border-radius:999px; background:#8B5CF6; box-shadow:0 0 10px rgba(139,92,246,.65); animation:pulse 1.5s ease-in-out infinite; }
@keyframes pulse{ 50%{ opacity:.35; transform:scale(.75); } }
h1{ font-size:clamp(2.9rem,6.8vw,4.35rem); letter-spacing:-2.6px; line-height:1.02; font-weight:850; color:var(--violet-ink); }
.grad{ background:var(--grad); background-size:220% 100%; -webkit-background-clip:text; background-clip:text; color:transparent; animation:gradpan 9s linear infinite; }
@keyframes gradpan{ to{ background-position:220% 0; } }
.page-hero{ display:grid; grid-template-columns:1.02fr .98fr; gap:44px; align-items:center; padding:52px 0 56px; min-height:78vh; }
.page-hero-simple{ padding:64px 0 20px; }
.lead{ margin:22px 0 30px; font-size:17px; line-height:1.68; color:var(--muted); max-width:54ch; }
.lead b{ color:var(--violet-ink); font-weight:700; }
.cta-row{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; }
.btn{ display:inline-flex; align-items:center; gap:9px; padding:14px 22px; border-radius:16px; font-weight:800; font-size:14.5px; letter-spacing:-.1px; border:1px solid var(--line-2); background:var(--panel); color:var(--violet-ink); cursor:pointer; transition:transform .15s, box-shadow .2s, border-color .2s; font-family:inherit; box-shadow:0 6px 18px rgba(24,16,60,.06); }
.btn:hover{ transform:translateY(-2px); border-color:rgba(124,92,255,.4); box-shadow:0 12px 28px rgba(124,92,255,.18); }
.btn.primary{ position:relative; overflow:hidden; background:var(--grad-btn); border:0; color:#FFFFFF; box-shadow:var(--shadow); }
.btn.primary::after{ content:""; position:absolute; top:0; left:-80%; width:50%; height:100%; background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent); transform:skewX(-20deg); animation:sheen 3.2s ease-in-out infinite; }
@keyframes sheen{ 0%,60%{ left:-80%; } 100%{ left:130%; } }
.btn.primary:hover{ box-shadow:var(--shadow-lg); }
.tiny{ margin-top:16px; font-size:12px; color:var(--muted); display:flex; gap:14px; flex-wrap:wrap; }
.tiny span::before{ content:"✓"; color:var(--violet); margin-right:5px; font-weight:800; }

/* phone mockup */
.hero-visual{ position:relative; height:520px; display:flex; align-items:center; justify-content:center; perspective:1200px; }
.phone{ width:238px; height:478px; border-radius:44px; background:linear-gradient(160deg,#FFFFFF,#F0EDFB); border:1px solid rgba(24,16,60,.12); box-shadow:var(--shadow-lg), inset 0 0 0 1px rgba(255,255,255,.7); padding:12px; position:relative; transform:rotateY(-9deg) rotateX(2deg); animation:floaty 6s ease-in-out infinite; z-index:2; }
@keyframes floaty{ 50%{ transform:rotateY(-6deg) rotateX(1deg) translateY(-14px); } }
.phone-notch{ position:absolute; top:10px; left:50%; transform:translateX(-50%); width:86px; height:20px; border-radius:12px; background:#232041; z-index:3; }
.phone-screen{ height:100%; border-radius:34px; overflow:hidden; position:relative; background:radial-gradient(circle at 50% 22%, #E9E2FF 0%, #F6F3FF 55%, #FBFAFF 100%); display:flex; flex-direction:column; align-items:center; padding:44px 16px 18px; }
.p-orb{ width:84px; height:84px; border-radius:50%; background:radial-gradient(circle at 34% 32%, #FFFFFF, #8B5CF6 55%, #4C2EA8); box-shadow:0 0 44px rgba(124,92,255,.4), inset -6px -8px 18px rgba(0,0,0,.14); position:relative; animation:breathe 3.4s ease-in-out infinite; }
.p-orb::after{ content:""; position:absolute; inset:14%; border-radius:50%; background:radial-gradient(circle at 42% 38%, rgba(255,255,255,.75), transparent 55%); }
@keyframes breathe{ 50%{ transform:scale(1.07); box-shadow:0 0 64px rgba(124,92,255,.55), inset -6px -8px 18px rgba(0,0,0,.14); } }
.p-status{ margin-top:14px; font-size:11px; color:#5A3FE0; font-weight:700; letter-spacing:1.2px; text-transform:uppercase; }
.p-wave{ display:flex; gap:4px; align-items:center; margin-top:12px; height:26px; }
.p-wave i{ width:4px; border-radius:3px; background:linear-gradient(180deg,#7C5CFF,#B388FF); animation:wave 1.1s ease-in-out infinite; }
.p-wave i:nth-child(1){ animation-delay:0s; } .p-wave i:nth-child(2){ animation-delay:.15s; } .p-wave i:nth-child(3){ animation-delay:.3s; } .p-wave i:nth-child(4){ animation-delay:.1s; } .p-wave i:nth-child(5){ animation-delay:.45s; } .p-wave i:nth-child(6){ animation-delay:.25s; } .p-wave i:nth-child(7){ animation-delay:.4s; } .p-wave i:nth-child(8){ animation-delay:.05s; }
@keyframes wave{ 0%,100%{ height:6px; } 50%{ height:24px; } }
.p-chip{ margin-top:14px; width:100%; background:#FFFFFF; border:1px solid rgba(124,92,255,.35); border-radius:12px; padding:8px 10px; font-size:10.5px; color:#3B2E73; box-shadow:0 4px 14px rgba(124,92,255,.12); }
.p-chip b{ display:block; color:#8B5CF6; font-size:8.5px; letter-spacing:.8px; text-transform:uppercase; margin-bottom:2px; }
.p-bubble{ margin-top:8px; width:100%; align-self:flex-start; background:#F0EDFB; border:1px solid rgba(24,16,60,.08); padding:8px 10px; border-radius:12px; font-size:10px; color:#453F66; line-height:1.45; }
.win-frame{ position:absolute; width:330px; border-radius:16px; background:#191233; border:1px solid rgba(255,255,255,.1); box-shadow:var(--shadow-lg); z-index:1; transform:translate(96px,-130px) rotate(1.5deg); overflow:hidden; }
.win-bar{ height:34px; display:flex; align-items:center; gap:7px; padding:0 12px; border-bottom:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.04); }
.win-dot{ width:9px; height:9px; border-radius:50%; }
.d-red{ background:#FF5F57; } .d-yellow{ background:#FEBC2E; } .d-green{ background:#28C840; }
.win-title{ margin-left:6px; font-size:10px; color:#B9A8FF; }
.win-body{ padding:14px; font-family:ui-monospace,"Cascadia Code",Consolas,monospace; font-size:10px; line-height:1.65; color:#B8A8FF; }
.win-body .dim{ color:#6E6491; } .win-body .ok{ color:#C084FC; } .win-body .cm{ color:#E9E4FF; }
.hero-float{ position:absolute; display:flex; gap:9px; align-items:center; padding:9px 13px; border-radius:14px; background:rgba(255,255,255,.85); border:1px solid rgba(124,92,255,.3); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); box-shadow:0 14px 34px rgba(109,77,255,.16); font-size:11px; z-index:3; }
.hero-float small{ color:var(--muted); display:block; font-size:9.5px; font-weight:600; letter-spacing:.4px; text-transform:uppercase; }
.hero-float b{ font-weight:700; color:var(--violet-ink); }
.float-1{ top:70px; left:-2%; animation:floaty2 7s ease-in-out infinite; }
.float-2{ bottom:96px; right:-3%; animation:floaty2 8s ease-in-out infinite 1.2s; }
.float-3{ bottom:190px; left:4%; animation:floaty2 6s ease-in-out infinite .6s; }
@keyframes floaty2{ 50%{ transform:translateY(-12px); } }

/* sections */
.section{ padding:56px 0; position:relative; }
.sec-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:26px; }
.eyebrow2{ font-size:11px; letter-spacing:2.2px; text-transform:uppercase; color:#6D4DFF; font-weight:800; margin-bottom:10px; display:flex; align-items:center; gap:8px; }
.eyebrow2::before{ content:""; width:22px; height:1px; background:linear-gradient(90deg,#6D4DFF,transparent); display:inline-block; }
.section h2{ font-size:clamp(1.7rem,3.4vw,2.35rem); letter-spacing:-1.2px; font-weight:820; color:var(--violet-ink); }
.section .sub{ color:var(--muted); font-size:15px; margin-top:8px; max-width:56ch; line-height:1.6; }
.hr{ height:1px; background:linear-gradient(90deg,transparent,rgba(24,16,60,.12) 30%,rgba(24,16,60,.12) 70%,transparent); }

/* homepage teaser grid */
.teasers{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.teaser{ display:flex; flex-direction:column; gap:10px; border-radius:22px; border:1px solid var(--line); background:var(--panel); padding:22px; transition:transform .18s,border-color .2s,box-shadow .25s; box-shadow:0 8px 22px rgba(24,16,60,.06); }
.teaser:hover{ transform:translateY(-4px); border-color:rgba(124,92,255,.45); box-shadow:var(--shadow); }
.teaser h3{ font-size:17px; letter-spacing:-.3px; color:var(--violet-ink); }
.teaser p{ color:var(--muted); font-size:13px; line-height:1.6; }
.teaser .go{ margin-top:auto; color:var(--violet); font-weight:800; font-size:13px; display:flex; align-items:center; gap:6px; }
.stat-strip{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:0 0 34px; padding:0 2px; }
.stat{ border:1px solid var(--line); background:var(--panel); border-radius:16px; padding:14px 12px; text-align:center; box-shadow:0 6px 16px rgba(24,16,60,.05); }
.stat b{ display:block; font-size:19px; letter-spacing:-.5px; color:var(--violet-ink); }
.stat span{ font-size:10.5px; color:var(--muted); letter-spacing:.4px; text-transform:uppercase; }

/* live demo */
.live{ display:grid; grid-template-columns:.92fr 1.08fr; gap:18px; }
.live-left{ position:relative; border-radius:24px; padding:28px; border:1px solid var(--line); background:var(--panel); overflow:hidden; box-shadow:0 10px 30px rgba(24,16,60,.06); }
.live-left::before{ content:""; position:absolute; top:-70px; right:-70px; width:230px; height:230px; background:radial-gradient(closest-side,rgba(139,92,246,.2),transparent); }
.live-left h3{ font-size:23px; letter-spacing:-.6px; color:var(--violet-ink); line-height:1.15; }
.live-left p{ color:var(--muted); font-size:14px; line-height:1.68; margin:12px 0 16px; max-width:46ch; }
.badges{ display:flex; gap:8px; flex-wrap:wrap; }
.badge{ font-size:10.5px; color:#5A3FE0; border:1px solid rgba(124,92,255,.4); border-radius:999px; padding:5px 11px; background:#F3EFFE; letter-spacing:.3px; font-weight:600; }
.chatpanel{ position:relative; border-radius:24px; border:1px solid rgba(255,255,255,.1); background:#140E2C; overflow:hidden; box-shadow:var(--shadow-lg); display:flex; flex-direction:column; }
.chatpanel-head{ display:flex; align-items:center; gap:10px; padding:12px 16px; border-bottom:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.04); }
.light{ width:10px; height:10px; border-radius:50%; }
.l-red{ background:#FF5F57; } .l-yel{ background:#FEBC2E; } .l-grn{ background:#28C840; }
.chatpanel-title{ margin-left:4px; font-family:ui-monospace,"Cascadia Code",Consolas,monospace; font-size:11.5px; color:#B9A8FF; }
.chatpanel-live{ margin-left:auto; display:flex; align-items:center; gap:7px; font-size:10.5px; color:#C084FC; font-weight:800; letter-spacing:.8px; text-transform:uppercase; }
.chatbox{ display:flex; flex-direction:column; gap:12px; padding:14px; }
.chatlog{ display:flex; flex-direction:column; gap:10px; max-height:330px; min-height:230px; overflow:auto; padding:2px; scrollbar-width:thin; scrollbar-color:#3A2F6B transparent; }
.bubble{ max-width:86%; padding:10px 13px; border-radius:16px; font-size:13px; line-height:1.58; white-space:pre-wrap; word-wrap:break-word; }
.bubble.user{ align-self:flex-end; background:linear-gradient(135deg,rgba(139,92,246,.45),rgba(139,92,246,.24)); border:1px solid rgba(139,92,246,.6); border-bottom-right-radius:4px; color:#F1ECFF; }
.bubble.ai{ align-self:flex-start; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); border-bottom-left-radius:4px; color:#EDE9FF; }
.bubble.typing{ color:#A79BCB; font-style:italic; }
.caret{ display:inline-block; width:8px; height:15px; background:#B388FF; margin-left:2px; vertical-align:-2px; animation:blink .8s steps(1) infinite; border-radius:2px; }
@keyframes blink{ 50%{ opacity:0; } }
.authrow{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; font-size:11.5px; color:#B9A8FF; padding-bottom:12px; border-bottom:1px dashed #322659; }
.authrow input{ background:#1D1536; border:1px solid rgba(255,255,255,.14); color:#FFFFFF; border-radius:12px; padding:9px 11px; font-size:12px; outline:none; width:150px; font-family:inherit; }
.authrow input:focus{ border-color:#8B5CF6; }
.authrow button{ border:1px solid rgba(139,92,246,.5); background:rgba(139,92,246,.2); color:#D8CEFF; border-radius:12px; padding:9px 13px; font-size:12px; cursor:pointer; font-weight:700; transition:background .15s; font-family:inherit; }
.authrow button:hover{ background:rgba(139,92,246,.32); }
.guest-btn{ background:var(--grad-btn) !important; color:#FFFFFF !important; border:0 !important; font-weight:850 !important; box-shadow:0 8px 22px rgba(139,92,246,.45); }
.composer{ display:flex; gap:8px; }
.composer input{ flex:1; padding:13px 15px; border-radius:14px; border:1px solid rgba(255,255,255,.14); background:#1D1536; color:#FFFFFF; font-size:13px; outline:none; font-family:inherit; transition:border-color .15s, box-shadow .2s; }
.composer input:focus{ border-color:#8B5CF6; box-shadow:0 0 0 3px rgba(139,92,246,.22); }
.composer button{ padding:0 20px; border-radius:14px; border:0; background:var(--grad-btn); color:#FFFFFF; font-weight:850; cursor:pointer; transition:transform .15s, box-shadow .2s; }
.composer button:hover{ transform:translateY(-1px); box-shadow:0 10px 26px rgba(139,92,246,.5); }
/* voice button (in composer) */
.mic-btn{ width:48px; height:48px; border-radius:14px; border:1px solid rgba(255,255,255,.16); background:#221A3F; color:#CFC6FF; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:all .15s; padding:0; }
.mic-btn:hover{ background:#2A2147; }
.mic-btn.rec{ background:linear-gradient(135deg,#EF4444,#B91C1C); border-color:#FCA5A5; color:#FFFFFF; animation:mic-pulse 1.1s ease-in-out infinite; box-shadow:0 0 0 0 rgba(239,68,68,.5); }
@keyframes mic-pulse{ 0%{ box-shadow:0 0 0 0 rgba(239,68,68,.5); } 100%{ box-shadow:0 0 0 14px rgba(239,68,68,0); } }
.mic-hint{ font-size:10px; color:#8E81B8; text-align:center; letter-spacing:.4px; }
/* hands-free dialogue mode */
.dialogue-bar{ display:flex; gap:10px; align-items:center; padding-bottom:2px; border-bottom:1px solid rgba(255,255,255,.06); padding-bottom:10px; }
.dialogue-btn{ flex:0 0 auto; border-radius:14px; border:1px solid rgba(255,255,255,.16); background:#221A3F; color:#CFC6FF; padding:10px 14px; font-weight:800; font-size:12px; display:flex; gap:8px; align-items:center; cursor:pointer; transition:all .15s; font-family:inherit; }
.dialogue-btn:hover{ background:#2A2147; }
.dialogue-btn.on{ background:var(--grad-btn); color:#FFFFFF; border-color:transparent; box-shadow:0 8px 24px rgba(139,92,246,.45); }
.dialogue-state{ font-size:10.5px; color:#8E81B8; letter-spacing:.3px; flex:1; text-align:right; }

/* bento features */
.bento{ display:grid; grid-template-columns:repeat(4,1fr); gap:13px; grid-auto-rows:170px; }
.feat{ position:relative; border-radius:22px; border:1px solid var(--line); background:var(--panel); padding:18px; overflow:hidden; display:flex; flex-direction:column; justify-content:flex-end; gap:5px; transition:transform .18s, border-color .2s, box-shadow .25s; box-shadow:0 8px 22px rgba(24,16,60,.06); }
.feat::after{ content:""; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(90deg,transparent,rgba(124,92,255,.35),transparent); }
.feat:hover{ transform:translateY(-4px); border-color:rgba(124,92,255,.45); box-shadow:var(--shadow); }
.feat h4{ font-size:14.5px; letter-spacing:-.2px; color:var(--violet-ink); }
.feat p{ color:var(--muted); font-size:12px; line-height:1.55; }
.ic-chip{ position:absolute; top:16px; left:16px; width:40px; height:40px; border-radius:13px; display:flex; align-items:center; justify-content:center; font-size:19px; background:#F3EFFE; border:1px solid rgba(124,92,255,.4); }
.ic-violet{} .ic-teal{} .ic-blue{} .ic-pink{} .ic-amber{}
.feat.tall{ grid-row:span 2; }
.feat.wide{ grid-column:span 2; }
.feat-gen{ background:linear-gradient(160deg,#3B2E73 0%,#1E1535 100%); border-color:rgba(139,92,246,.4); }
.feat-gen h4{ color:#F1ECFF; }
.feat-gen p{ color:#B9AEE8; }
.gen-art{ position:absolute; top:14px; right:14px; width:108px; height:118px; border-radius:14px; border:1px solid rgba(255,255,255,.22); background:conic-gradient(from 210deg at 50% 60%, #FDE68A, #FB7185 25%, #A78BFA 45%, #38BDF8 65%, #34D399 82%, #FDE68A); box-shadow:0 10px 30px rgba(124,92,255,.45); opacity:.94; }
.gen-art::after{ content:""; position:absolute; inset:0; border-radius:14px; background:radial-gradient(circle at 50% 88%, rgba(0,0,0,.45), transparent 60%); }
.kvo{ font-family:ui-monospace,"Cascadia Code",Consolas,monospace; font-size:10px; color:#8B7FBE; letter-spacing:.4px; }
.feat-gen .kvo{ color:#A79BE0; }

/* downloads */
.downloads{ display:grid; grid-template-columns:repeat(auto-fit,minmax(258px,1fr)); gap:14px; }
.dl-card{ border-radius:22px; padding:22px; border:1px solid var(--line); background:var(--panel); display:flex; flex-direction:column; gap:10px; box-shadow:0 10px 26px rgba(24,16,60,.06); }
.dl-card h3{ font-size:16.5px; letter-spacing:-.2px; display:flex; align-items:center; gap:10px; color:var(--violet-ink); }
.dl-card p{ color:var(--muted); font-size:12.5px; line-height:1.55; }
.dl-card code{ display:block; font-size:9.5px; color:#5A5285; word-break:break-all; background:#F4F1FC; padding:9px 10px; border-radius:10px; border:1px solid rgba(24,16,60,.1); font-family:ui-monospace,"Cascadia Code",Consolas,monospace; }
.dl-card .btn{ justify-content:center; }
.dl-icon{ width:34px; height:34px; border-radius:11px; display:flex; align-items:center; justify-content:center; font-size:17px; background:#F3EFFE; border:1px solid rgba(124,92,255,.35); }

/* footer */
footer{ padding:40px 0 60px; color:var(--muted); font-size:12px; }
.foot-in{ display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; padding-top:26px; border-top:1px solid rgba(24,16,60,.12); }
.foot-brand{ display:flex; align-items:center; gap:9px; font-weight:800; color:var(--violet-ink); }
.foot-links{ display:flex; gap:18px; flex-wrap:wrap; }
.foot-links a:hover{ color:var(--violet); }

@media (max-width:980px){
  .page-hero{ grid-template-columns:1fr; min-height:auto; padding:44px 0 8px; }
  .hero-visual{ height:440px; margin-top:10px; }
  .live{ grid-template-columns:1fr; }
  .bento{ grid-template-columns:repeat(2,1fr); grid-auto-rows:158px; }
  .teasers{ grid-template-columns:1fr; }
  .stat-strip{ grid-template-columns:repeat(2,1fr); }
  .feat.wide{ grid-column:span 2; }
  .win-frame{ display:none; }
  .phone{ transform:none; animation:none; }
  @keyframes floaty{ 50%{ transform:translateY(-12px); } }
  .float-1{ left:0; } .float-2{ right:0; }
}
@media (max-width:600px){
  .bento{ grid-template-columns:1fr; grid-auto-rows:150px; }
  .feat.wide{ grid-column:auto; }
  .nav-links{ display:none; }
  h1{ letter-spacing:-1.8px; }
  .hero-float{ display:none; }
}
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation:none !important; transition:none !important; }
  html{ scroll-behavior:auto; }
}