:root { --bg:#05060a; --panel:#0b0d15; --panel-2:#101321; --line:rgba(255,255,255,.12); --line-soft:rgba(255,255,255,.07); --text:#f5f6fb; --text-dim:#9ba0b4; --text-faint:#676c80; --blue:#6480ff; --blue-hi:#8aa1ff; --blue-dim:rgba(100,128,255,.16); --blue-glow:rgba(82,113,255,.55); --green:#31dd95; --sans:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; min-height:100vh; overflow-x:hidden; font-family:var(--sans); color:var(--text); background:var(--bg); line-height:1.5; } a { color:inherit; text-decoration:none; } button { font:inherit; }
.axiom-bg { position:fixed; inset:0; z-index:0; pointer-events:none; background:radial-gradient(850px 540px at 50% 18%,rgba(56,79,210,.22),transparent 66%), radial-gradient(500px 500px at 92% 66%,rgba(70,98,246,.12),transparent 70%), #05060a; } .axiom-bg::before { content:""; position:absolute; inset:0; opacity:.25; background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size:72px 72px; mask-image:linear-gradient(to bottom,black,transparent 70%); }
.wrap { position:relative; z-index:1; width:min(1180px,92%); margin:0 auto; } header { position:sticky; top:0; z-index:50; background:rgba(5,6,10,.75); backdrop-filter:blur(18px); border-bottom:1px solid transparent; } .nav-wrap { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:70px; } .logo { display:flex; align-items:center; gap:10px; font-size:19px; font-weight:800; letter-spacing:-.04em; } .logo-mark { display:grid; width:31px; height:31px; place-items:center; overflow:hidden; border:1px solid rgba(255,255,255,.18); border-radius:9px; background:#090b12; } .logo-mark img { width:100%; height:100%; object-fit:cover; } .logo-word span { color:var(--blue-hi); } .nav-links { display:flex; gap:28px; color:var(--text-dim); font-size:14px; } .nav-links a:hover { color:#fff; } .nav-right { display:flex; align-items:center; gap:10px; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:10px 18px; border:1px solid transparent; border-radius:999px; font-size:14px; font-weight:700; cursor:pointer; transition:transform .16s,box-shadow .2s,background .2s,border-color .2s; } .btn:hover { transform:translateY(-2px); } .btn:active { transform:translateY(0); } .btn-lg { padding:14px 28px; font-size:15px; } .btn-ghost { color:var(--text-dim); border-color:var(--line); background:rgba(255,255,255,.02); } .btn-ghost:hover { color:#fff; border-color:rgba(255,255,255,.28); } .btn-blue { color:#06102e; background:linear-gradient(135deg,#8ca4ff,#5573ff); box-shadow:0 12px 34px -14px var(--blue-glow),inset 0 1px rgba(255,255,255,.4); } .btn-blue:hover { background:linear-gradient(135deg,#a1b4ff,#6683ff); box-shadow:0 16px 40px -12px var(--blue-glow); } .btn-dark { color:#fff; border-color:var(--line); background:rgba(255,255,255,.06); } .btn-dark:hover { background:rgba(255,255,255,.1); } .btn-activate { cursor:grab; user-select:none; } .btn-activate:active { cursor:grabbing; }
.hero { position:relative; z-index:1; min-height:820px; padding:92px 0 54px; text-align:center; overflow:hidden; } .hero-orbit { position:absolute; left:50%; top:245px; width:min(900px,85vw); height:360px; transform:translateX(-50%) perspective(900px) rotateX(64deg); border:1px solid rgba(108,133,255,.28); border-radius:50%; box-shadow:0 0 80px rgba(67,94,255,.18),inset 0 0 80px rgba(67,94,255,.14); opacity:.7; } .hero-orbit::after { content:""; position:absolute; inset:34px 120px; border:1px solid rgba(108,133,255,.18); border-radius:50%; } .hero-inner { width:100%; } .axiom-hero-mark { width:68px; height:68px; margin:0 auto 22px; overflow:hidden; border-radius:20px; filter:drop-shadow(0 0 30px rgba(105,134,255,.5)); } .axiom-hero-mark img { display:block; width:100%; height:100%; object-fit:cover; } .eyebrow { display:inline-block; color:var(--blue-hi); font-size:11px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; } .hero-title { position:relative; margin:12px 0 18px; font-size:clamp(46px,7.5vw,90px); line-height:.98; letter-spacing:-.075em; font-weight:800; } .hero-title span { color:#fff; background:linear-gradient(105deg,#fff 5%,#8199ff 55%,#4f6eff); -webkit-background-clip:text; background-clip:text; color:transparent; } .hero-sub { max-width:570px; margin:0 auto 30px; color:var(--text-dim); font-size:17px; } .hero-cta { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:12px; margin-bottom:12px; } .drag-hint { color:var(--text-faint); font-size:12px; }
.axiom-hero-terminal { position:relative; width:min(1000px,96vw); margin:58px auto 0; overflow:hidden; text-align:left; border:1px solid rgba(130,151,255,.38); border-radius:22px; background:linear-gradient(145deg,rgba(41,54,138,.7),rgba(10,12,26,.9) 46%,rgba(16,21,54,.9)); box-shadow:0 40px 100px -40px rgba(64,91,255,.75),0 0 0 1px rgba(255,255,255,.06); } .axiom-hero-terminal::before { content:""; position:absolute; inset:0; background:radial-gradient(500px 260px at 50% 0,rgba(139,159,255,.3),transparent 70%); pointer-events:none; } .terminal-chrome { position:relative; display:flex; align-items:center; gap:7px; height:48px; padding:0 18px; border-bottom:1px solid rgba(255,255,255,.1); background:rgba(7,8,16,.48); } .terminal-dot { width:9px; height:9px; border-radius:50%; } .terminal-dot.red { background:#ff625c; }.terminal-dot.yellow { background:#ffbd44; }.terminal-dot.green { background:#35ca5a; } .terminal-label { margin-left:12px; color:#8d95b1; font-size:10px; letter-spacing:.12em; } .terminal-live { margin-left:auto; color:var(--green); font-size:10px; font-weight:800; letter-spacing:.12em; } .terminal-body { position:relative; display:grid; grid-template-columns:135px 1fr 205px; min-height:390px; background:rgba(6,7,13,.75); } .terminal-sidebar { padding:22px 16px; border-right:1px solid rgba(255,255,255,.08); background:rgba(6,7,13,.35); } .mini-brand { display:flex; align-items:center; gap:6px; margin-bottom:28px; color:#fff; font-size:11px; font-weight:800; letter-spacing:.03em; } .mini-brand img { width:18px; height:18px; border-radius:5px; object-fit:cover; } .sidebar-line { width:100%; height:8px; margin:16px 0; border-radius:4px; background:rgba(255,255,255,.1); }.sidebar-line.short { width:65%; }.sidebar-line.active { background:linear-gradient(90deg,#617fff,rgba(97,127,255,.1)); box-shadow:0 0 20px rgba(97,127,255,.35); }.sidebar-spacer { height:82px; } .terminal-main { min-width:0; padding:20px; } .terminal-topline { display:flex; align-items:center; gap:18px; color:#737b97; font-size:10px; } .terminal-topline span:first-child { color:#fff; } .terminal-search { margin-left:auto; min-width:155px; padding:8px 12px; border:1px solid rgba(255,255,255,.1); border-radius:8px; color:#5f6780; } .terminal-avatar { width:20px; height:20px; border-radius:50%; background:linear-gradient(135deg,#8398ff,#313f94); } .token-row { display:flex; align-items:center; gap:26px; margin-top:24px; padding:16px; border:1px solid rgba(255,255,255,.08); border-radius:12px; background:rgba(255,255,255,.025); } .token-row div { display:flex; flex-direction:column; gap:2px; } .token-row small,.order-stat small { color:#707991; font-size:9px; letter-spacing:.1em; }.token-row strong { font-size:12px; }.positive { color:var(--green)!important; }.token-row button { margin-left:auto; padding:9px 26px; border:0; border-radius:8px; color:#031b18; background:#40dba0; font-size:11px; font-weight:800; } .chart-area { position:relative; height:220px; margin-top:14px; overflow:hidden; border:1px solid rgba(255,255,255,.07); border-radius:12px; background:#080a12; } .chart-grid { position:absolute; inset:0; background:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px); background-size:44px 44px; opacity:.35; } .chart-area svg,.dashboard-chart svg { position:absolute; inset:0; width:100%; height:100%; } .chart-area polyline,.dashboard-chart polyline { fill:none; stroke:#67e5ba; stroke-width:3; vector-effect:non-scaling-stroke; filter:drop-shadow(0 0 5px rgba(103,229,186,.55)); } .price-tag { position:absolute; right:10px; top:25%; padding:3px 6px; border-radius:4px; color:#07111d; background:#63ddb9; font-size:10px; font-weight:800; } .order-strip { display:flex; gap:26px; margin-top:15px; color:#6d748d; font-size:10px; }.order-strip span:first-child { color:#fff; }.order-profit { margin-left:auto; color:var(--green)!important; } .terminal-order { padding:20px 15px; border-left:1px solid rgba(255,255,255,.08); background:rgba(6,7,13,.55); } .order-tabs { display:flex; gap:5px; margin-bottom:20px; padding:4px; border-radius:8px; background:rgba(255,255,255,.05); color:#7a829c; font-size:11px; text-align:center; }.order-tabs b,.order-tabs span { flex:1; padding:8px; border-radius:6px; }.order-tabs b { color:#05221a; background:#42daa1; }.order-field { display:flex; justify-content:space-between; padding:13px 10px; border:1px solid rgba(255,255,255,.09); border-radius:8px; color:#aab1c7; font-size:12px; }.order-field small { color:#5d657a; font-size:9px; }.quick-row { display:grid; grid-template-columns:repeat(4,1fr); gap:5px; margin-top:10px; }.quick-row span { padding:7px 1px; border-radius:6px; color:#7e87a1; background:rgba(255,255,255,.05); font-size:9px; text-align:center; }.order-button { margin-top:12px; padding:12px; border-radius:8px; color:#061d19; background:#3fdaa0; font-size:10px; font-weight:800; text-align:center; }.order-stat { display:flex; justify-content:space-between; margin-top:22px; color:#fff; font-size:10px; }.terminal-caption { display:flex; justify-content:center; flex-wrap:wrap; gap:42px; padding:19px; color:#8992ae; font-size:10px; font-weight:800; letter-spacing:.13em; }
.section { position:relative; z-index:1; padding:116px 0; }.section-head { max-width:700px; margin:0 auto 48px; text-align:center; }.section-title { margin:12px 0 14px; font-size:clamp(32px,5vw,56px); line-height:1.02; letter-spacing:-.06em; }.section-sub { margin:0 auto; max-width:620px; color:var(--text-dim); font-size:16px; }.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }.feature-card { padding:28px; border:1px solid var(--line); border-radius:16px; background:linear-gradient(145deg,rgba(20,24,44,.8),rgba(10,12,20,.72)); }.feature-card:hover { border-color:rgba(110,137,255,.48); background:linear-gradient(145deg,rgba(28,37,84,.72),rgba(10,12,20,.82)); }.feature-icon { display:grid; width:42px; height:42px; margin-bottom:18px; place-items:center; border-radius:12px; color:#b7c4ff; background:var(--blue-dim); font-size:24px; }.feature-card h3 { margin:0 0 9px; font-size:17px; }.feature-card p { margin:0; color:var(--text-dim); font-size:14px; line-height:1.6; }.pill-row { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; margin-top:26px; }.pill { padding:8px 14px; border:1px solid var(--line); border-radius:999px; color:#aab2cc; background:rgba(255,255,255,.035); font-size:12px; }
.visual-grid { display:grid; grid-template-columns:1.1fr .9fr; align-items:start; gap:20px; }.visual-card { overflow:hidden; border:1px solid var(--line); border-radius:20px; background:linear-gradient(145deg,rgba(17,21,39,.9),rgba(8,10,17,.86)); }.axiom-dashboard-card { align-self:start; padding:18px; }.dashboard-label { display:flex; justify-content:space-between; margin-bottom:16px; color:#afb7d0; font-size:11px; font-weight:800; letter-spacing:.1em; }.dashboard-label span { color:var(--green); font-size:10px; letter-spacing:.02em; }.dashboard-chart { position:relative; height:340px; overflow:hidden; border:1px solid rgba(255,255,255,.08); border-radius:12px; background:#080a12; }.dashboard-chart .chart-grid { background-size:54px 54px; }.dashboard-candles { position:absolute; inset:18px 24px; display:flex; align-items:center; justify-content:space-around; opacity:.45; }.dashboard-candles i { width:5px; height:18%; border-radius:3px; background:#48d8a3; box-shadow:0 0 0 1px #48d8a3; }.dashboard-candles i:nth-child(2){height:30%}.dashboard-candles i:nth-child(3){height:14%;background:#f06b77}.dashboard-candles i:nth-child(4){height:44%}.dashboard-candles i:nth-child(5){height:27%;background:#f06b77}.dashboard-candles i:nth-child(6){height:53%}.dashboard-candles i:nth-child(7){height:38%}.dashboard-bottom { display:flex; gap:24px; padding:16px 4px 2px; color:#777f99; font-size:11px; }.dashboard-bottom b { margin-left:auto; color:var(--green); }.visual-card-copy { display:flex; flex-direction:column; }.phone-shell { position:relative; width:230px; height:400px; margin:28px auto 0; padding:18px 13px 0; overflow:hidden; border:2px solid #373d58; border-radius:34px 34px 24px 24px; background:linear-gradient(155deg,#14192d,#070910 70%); box-shadow:0 24px 60px -22px #000; }.phone-notch { position:absolute; top:8px; left:50%; width:82px; height:17px; transform:translateX(-50%); border-radius:0 0 12px 12px; background:#04050a; }.phone-top { display:flex; justify-content:space-between; padding:0 5px 22px; color:#e9edff; font-size:9px; }.phone-top b { color:#9eafff; letter-spacing:.08em; }.phone-balance { padding:12px 3px 16px; font-size:21px; font-weight:800; }.phone-balance small { display:block; margin-top:4px; color:var(--green); font-size:9px; }.phone-tabs { display:flex; gap:14px; padding:9px 2px; border-bottom:1px solid rgba(255,255,255,.1); color:#777f97; font-size:9px; }.phone-tabs .selected { color:#fff; }.phone-token { display:flex; align-items:center; gap:8px; padding:14px 2px; border-bottom:1px solid rgba(255,255,255,.06); font-size:10px; }.phone-token small { margin-left:auto; color:#9ea6bc; }.phone-token em { color:var(--green); font-size:8px; font-style:normal; }.token-icon { display:grid; width:25px; height:25px; place-items:center; border-radius:50%; color:#fff; font-weight:800; }.token-icon.purple { background:#6c74ff; }.token-icon.gold { background:#d2a52d; }.token-icon.blue { background:#3976bc; }.phone-nav { position:absolute; right:0; bottom:0; left:0; display:flex; justify-content:space-around; padding:13px; border-top:1px solid rgba(255,255,255,.08); color:#6e7691; }.phone-nav-active { color:#91a4ff; }.visual-copy { padding:26px 28px 30px; margin-top:auto; }.visual-copy h3 { margin:0 0 10px; font-size:22px; }.visual-copy p { margin:0; color:var(--text-dim); font-size:14px; }
.split { display:grid; grid-template-columns:1fr .82fr; align-items:center; gap:72px; }.left-title { text-align:left; }.left-sub { max-width:520px; margin:0; text-align:left; }.security-card { padding:30px; border:1px solid rgba(110,137,255,.28); border-radius:18px; background:linear-gradient(145deg,rgba(22,31,73,.82),rgba(9,11,20,.9)); box-shadow:0 30px 70px -36px rgba(80,109,255,.7); }.security-icon { display:grid; width:44px; height:44px; margin-bottom:20px; place-items:center; border-radius:14px; color:#081d18; background:#40dba0; font-size:25px; font-weight:900; }.security-card h3 { margin:0 0 8px; font-size:20px; }.security-card p { margin:0 0 22px; color:var(--text-dim); font-size:14px; }.security-row { display:flex; justify-content:space-between; padding:15px 0; border-top:1px solid var(--line-soft); color:#bac1d8; font-size:13px; }.security-row b { color:var(--green); font-size:10px; letter-spacing:.12em; }
.cta-banner { position:relative; z-index:1; padding:20px 0 100px; }.cta-inner { padding:68px 30px; border:1px solid rgba(105,132,255,.32); border-radius:24px; text-align:center; background:radial-gradient(480px 210px at 50% 0,rgba(85,111,255,.34),transparent 70%),linear-gradient(145deg,rgba(21,29,77,.85),rgba(8,10,18,.94)); }.cta-inner h2 { margin:12px 0 12px; font-size:clamp(28px,4vw,48px); letter-spacing:-.06em; }.cta-inner p { max-width:620px; margin:0 auto 24px; color:var(--text-dim); }.cta-inner .drag-hint { margin-top:14px; }.hero-load,.reveal { opacity:0; transform:translateY(18px); transition:opacity .55s,transform .55s; }.hero-load.in-view,.reveal.in-view { opacity:1; transform:translateY(0); }
footer { position:relative; z-index:1; padding:0 0 35px; }.footer-top { display:grid; grid-template-columns:1.5fr repeat(3,1fr); gap:28px; padding:35px 0; border-top:1px solid var(--line-soft); }.footer-brand p { max-width:280px; margin:14px 0 0; color:var(--text-dim); font-size:13px; }.footer-col h4 { margin:0 0 14px; color:#727b95; font-size:11px; letter-spacing:.12em; text-transform:uppercase; }.footer-col ul { display:flex; flex-direction:column; gap:9px; padding:0; margin:0; list-style:none; }.footer-col a { color:var(--text-dim); font-size:13px; }.footer-col a:hover { color:#fff; }.disclaimer { max-width:840px; margin:0 0 22px; color:var(--text-faint); font-size:11px; line-height:1.6; }.footer-bottom { display:flex; justify-content:space-between; gap:16px; padding-top:18px; border-top:1px solid var(--line-soft); color:var(--text-faint); font-size:12px; }.socials { display:flex; gap:14px; }.socials a:hover { color:#fff; }
@media (max-width:900px){.nav-links{display:none}.hero{padding-top:76px}.terminal-body{grid-template-columns:85px 1fr}.terminal-order{display:none}.feature-grid{grid-template-columns:1fr 1fr}.visual-grid,.split{grid-template-columns:1fr;gap:22px}.split{gap:36px}.left-title,.left-sub{text-align:center}.left-sub{margin:0 auto}.phone-shell{margin-top:28px}.visual-card-copy{align-items:stretch}.footer-top{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.nav-right .btn-ghost{display:none}.hero{min-height:auto;padding:62px 0 40px}.hero-title{font-size:49px}.hero-sub{font-size:15px}.hero-orbit{top:240px;width:110vw}.axiom-hero-terminal{margin-top:40px;border-radius:16px}.terminal-body{grid-template-columns:1fr;min-height:300px}.terminal-sidebar{display:none}.terminal-main{padding:12px}.terminal-topline{gap:8px}.terminal-topline span:nth-child(-n+4){display:none}.terminal-search{min-width:0;flex:1}.token-row{gap:9px;padding:11px}.token-row div:nth-child(4){display:none}.token-row button{padding:8px 13px}.chart-area{height:175px}.terminal-caption{gap:12px;font-size:8px}.feature-grid{grid-template-columns:1fr}.section{padding:80px 0}.dashboard-chart{height:245px}.footer-top{grid-template-columns:1fr}.footer-bottom{flex-direction:column}}
.pc-preview-frame { position:relative; margin:0; padding:18px; background:linear-gradient(145deg,rgba(16,20,47,.92),rgba(5,7,13,.96)); }
.pc-preview-frame img { display:block; width:100%; height:auto; border:1px solid rgba(133,157,255,.38); border-radius:12px; box-shadow:0 24px 50px -30px rgba(86,112,255,.9); }
.pc-preview-frame::after { content:""; position:absolute; inset:18px; border:1px solid rgba(255,255,255,.06); border-radius:12px; pointer-events:none; }
.pc-preview-badge { position:absolute; right:34px; bottom:32px; display:flex; align-items:center; gap:8px; padding:7px 10px; border:1px solid rgba(130,151,255,.45); border-radius:7px; color:#d9e0ff; background:rgba(5,7,15,.78); backdrop-filter:blur(8px); font-size:9px; letter-spacing:.09em; }
.pc-preview-badge b { color:#70e2b5; font-size:8px; }
.axiom-hero-terminal > .terminal-body { display:none; }
.dashboard-image { position:relative; overflow:hidden; border:1px solid rgba(255,255,255,.08); border-radius:12px; background:#05070d; box-shadow:0 18px 38px -28px rgba(86,112,255,.9); }
.dashboard-image img { display:block; width:100%; height:auto; }
.dashboard-image-mask { position:absolute; top:0; left:0; padding:13px 18px 12px; color:#afb7d0; background:rgba(4,6,11,.96); font-size:11px; font-weight:800; letter-spacing:.1em; }
.dashboard-image-mask span { margin-left:10px; color:var(--green); font-size:10px; letter-spacing:.02em; }
.phone-top img { width:26px; height:26px; border-radius:7px; object-fit:cover; }
.phone-nav-logo { width:18px; height:18px; border-radius:5px; object-fit:cover; }

/* AxiomSniper uses the same matte, low-gloss surface language as FomoSniper. */
.axiom-hero-terminal { background:#08090f; border-color:rgba(142,153,194,.28); box-shadow:0 28px 70px -42px rgba(0,0,0,.95), inset 0 1px rgba(255,255,255,.025); }
.axiom-hero-terminal::before { background:linear-gradient(180deg,rgba(255,255,255,.035),transparent 24%); }
.pc-preview-frame { background:#08090f; }
.pc-preview-frame img { border-color:rgba(142,153,194,.3); box-shadow:none; filter:saturate(.92) contrast(1.04); }
.pc-preview-frame::after { border-color:rgba(255,255,255,.055); }
.pc-preview-badge { border-color:rgba(142,153,194,.34); background:rgba(7,8,13,.9); box-shadow:none; }
.visual-card { background:#08090f; box-shadow:inset 0 1px rgba(255,255,255,.02),0 18px 50px -34px rgba(0,0,0,.92); }
.dashboard-image { box-shadow:none; }
.dashboard-image-mask { background:rgba(4,5,9,.97); }
.axiom-hero-mark { background:#08090f; filter:none; }
.hero-orbit { display:none; }
.execution-section { padding-top:36px; }
.execution-panel { width:min(760px,100%); margin:0 auto; overflow:hidden; border:1px solid rgba(142,153,194,.3); border-radius:18px; background:rgba(7,8,13,.88); box-shadow:inset 0 1px rgba(255,255,255,.025),0 22px 52px -38px rgba(0,0,0,.96); }
.execution-row { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:20px 22px; border-bottom:1px solid rgba(142,153,194,.15); color:#e3e7f6; }
.execution-row:last-child { border-bottom:0; }
.execution-row strong { font-size:15px; letter-spacing:-.02em; }
.execution-state { display:inline-flex; align-items:center; gap:8px; color:var(--green); font-size:10px; font-weight:800; letter-spacing:.09em; }
.execution-state::before { content:""; width:8px; height:8px; border-radius:50%; background:var(--green); box-shadow:0 0 10px rgba(64,219,160,.52); }
.security-card { border-color:rgba(142,153,194,.3); border-radius:18px; background:#0c1020; box-shadow:inset 0 1px rgba(255,255,255,.025),0 26px 58px -38px rgba(73,93,188,.8); }
.security-icon { border-radius:13px; }
.security-row { padding:16px 0; }

/* Keep the Axiom preview frame as quiet and straightforward as Fomo's. */
.axiom-hero-terminal {
  border-color:rgba(255,255,255,.14);
  border-radius:18px;
  background:#08090f;
  box-shadow:0 24px 60px -44px rgba(0,0,0,.9);
}
.axiom-hero-terminal .terminal-chrome {
  border-bottom:0;
  background:#08090f;
}
.axiom-hero-terminal::before { display:none; }
.axiom-hero-terminal .terminal-label {
  margin-left:auto;
  color:var(--blue-hi);
  font-weight:600;
}
.pc-preview-frame {
  padding:0 18px 18px;
  background:#08090f;
}
.pc-preview-frame img {
  border-color:rgba(255,255,255,.12);
  border-radius:12px;
  box-shadow:none;
}
.pc-preview-frame::after { display:none; }
.pc-preview-badge {
  border-color:rgba(255,255,255,.12);
  border-radius:6px;
  background:rgba(8,9,15,.94);
}

/* Leave the hero slot open until the Axiom walkthrough video is ready. */
.pc-preview-frame.video-slot {
  min-height:clamp(300px, 48vw, 560px);
  box-sizing:border-box;
  padding:18px;
  background:#08090f;
}

/* Walkthrough treatment: the recording stays primary while the surrounding UI remains quiet. */
.axiom-walkthrough-video {
  display:block;
  width:100%;
  aspect-ratio:16 / 9;
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;
  background:#03040a;
  object-fit:cover;
  filter:brightness(1.1) contrast(1.04) saturate(1.05);
  box-shadow:0 18px 38px -28px rgba(0,0,0,.96);
}
.axiom-walkthrough-video::-webkit-media-controls-panel {
  background:linear-gradient(180deg,rgba(7,8,13,.1),rgba(7,8,13,.9));
}
.axiom-install-steps {
  display:flex;
  flex-direction:column;
  margin:0 18px 18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  background:#08090f;
}
.axiom-install-step {
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:14px 16px;
  border-bottom:1px solid rgba(255,255,255,.08);
  color:#aeb5c8;
  font-size:13px;
  line-height:1.45;
}
.axiom-install-step:last-child { border-bottom:0; }
.axiom-install-step p { margin:0; }
.axiom-install-step strong { color:#f1f3fb; }
.axiom-install-step .step-num {
  display:grid;
  flex:0 0 24px;
  width:24px;
  height:24px;
  place-items:center;
  border-radius:50%;
  color:#dfe5ff;
  background:rgba(99,124,255,.2);
  font-size:11px;
  font-weight:800;
}
@media (max-width:560px) {
  .pc-preview-frame.video-slot { min-height:0; padding:12px; }
  .axiom-install-steps { margin:0 12px 12px; }
  .axiom-install-step { padding:12px; font-size:12px; }
}

/* The desktop Axiom screen is the single focal visual in the speed section. */
.speed-visual-grid {
  grid-template-columns:minmax(0,1fr);
  width:min(1000px,100%);
  margin:0 auto;
}
.speed-visual-grid .axiom-dashboard-card {
  width:100%;
  padding:18px;
  border-color:rgba(255,255,255,.14);
  border-radius:18px;
  background:#08090f;
  box-shadow:0 24px 60px -44px rgba(0,0,0,.9);
}
.speed-visual-grid .dashboard-image {
  border-color:rgba(255,255,255,.12);
  border-radius:12px;
}

/* One surface language across the Axiom page: matte, quiet, and lightly outlined. */
:root {
  --surface-matte:#08090f;
  --border-matte:rgba(255,255,255,.14);
  --shadow-matte:0 24px 60px -44px rgba(0,0,0,.9);
}
.feature-card,
.visual-card,
.execution-panel,
.security-card,
.axiom-hero-terminal,
.speed-visual-grid .axiom-dashboard-card,
.cta-inner {
  border-color:var(--border-matte);
  border-radius:18px;
  background:var(--surface-matte);
  box-shadow:var(--shadow-matte);
}
.feature-card { padding:26px; }
.feature-card:hover {
  border-color:rgba(255,255,255,.22);
  background:#0b0d14;
}
.feature-icon {
  border:1px solid rgba(255,255,255,.1);
  background:#111522;
}
.pill {
  border-color:rgba(255,255,255,.14);
  background:var(--surface-matte);
}
.execution-panel { box-shadow:var(--shadow-matte); }
.execution-row { padding:18px 20px; border-bottom-color:rgba(255,255,255,.09); }
.execution-state::before { box-shadow:none; }
.security-card {
  padding:28px;
  background:var(--surface-matte);
  box-shadow:var(--shadow-matte);
}
.security-card p { line-height:1.55; }
.security-row { border-top-color:rgba(255,255,255,.09); }
.cta-inner {
  border-color:var(--border-matte);
  background:var(--surface-matte);
}
.axiom-install-steps {
  border-color:rgba(255,255,255,.14);
  border-radius:18px;
  background:var(--surface-matte);
}

/* Use the dimensional phone artwork while keeping the screen Axiom-specific. */
.axiom-phone-stage {
  position:relative;
  width:min(390px,100%);
  aspect-ratio:1197 / 1163;
  margin:8px auto 0;
  filter:drop-shadow(0 28px 24px rgba(0,0,0,.42));
}
.axiom-phone-device {
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}
.axiom-phone-screen {
  position:absolute;
  top:3.5%;
  right:15.5%;
  bottom:6.5%;
  left:18.5%;
  z-index:1;
  overflow:hidden;
  clip-path:polygon(8% 0,92% 0,100% 100%,0 100%);
  color:#f4f6ff;
  background:#05070d;
}
.axiom-phone-screen::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(115deg,rgba(255,255,255,.12),transparent 16%,transparent 72%,rgba(255,255,255,.035));
  mix-blend-mode:screen;
}
.axiom-phone-screen::after {
  content:"";
  position:absolute;
  top:0;
  left:35%;
  z-index:3;
  width:30%;
  height:13px;
  border-radius:0 0 9px 9px;
  background:#03040a;
}
.axiom-phone-ui {
  position:absolute;
  inset:0;
  overflow:hidden;
  padding:15px 10px 0;
  background:linear-gradient(165deg,#11172a,#05070d 54%,#060812);
}
.axiom-phone-ui .phone-top { padding:0 3px 10px; font-size:8px; }
.axiom-phone-ui .phone-top img { width:21px; height:21px; border-radius:5px; }
.axiom-phone-ui .phone-balance { padding:7px 2px 10px; font-size:17px; letter-spacing:-.04em; }
.axiom-phone-ui .phone-balance small { margin-top:2px; font-size:7px; }
.axiom-phone-ui .phone-tabs { gap:10px; padding:7px 2px; font-size:7px; }
.axiom-phone-ui .phone-token { gap:6px; padding:9px 2px; font-size:8px; }
.axiom-phone-ui .phone-token small,
.axiom-phone-ui .phone-token em { font-size:7px; }
.axiom-phone-ui .token-icon { width:18px; height:18px; font-size:8px; }
.axiom-phone-ui .phone-nav { padding:9px 10px; font-size:10px; }
.axiom-phone-ui .phone-nav-logo { width:15px; height:15px; }

@media (max-width:560px){
  .axiom-phone-stage { width:min(340px,100%); margin-top:0; }
}

/* Let the navigation arrive as a single, restrained opening beat. */
header { animation: nav-header-open .7s cubic-bezier(.22,1,.36,1) both; transform-origin: top center; }
.nav-wrap > .logo,
.nav-wrap > .nav-links,
.nav-wrap > .nav-right { opacity:0; transform:translateY(-8px); animation:nav-item-open .52s cubic-bezier(.22,1,.36,1) both; }
.nav-wrap > .logo { animation-delay:.12s; }
.nav-wrap > .nav-links { animation-delay:.2s; }
.nav-wrap > .nav-right { animation-delay:.28s; }
@keyframes nav-header-open { from { opacity:0; transform:translateY(-14px); } to { opacity:1; transform:translateY(0); } }
@keyframes nav-item-open { from { opacity:0; transform:translateY(-8px); } to { opacity:1; transform:translateY(0); } }
@media (prefers-reduced-motion: reduce) {
  header,
  .nav-wrap > .logo,
  .nav-wrap > .nav-links,
  .nav-wrap > .nav-right { opacity:1; transform:none; animation:none; }
}

/* Plans, installation, and FAQ sections follow the same quiet matte system. */
.section-head-left { max-width:760px; margin-left:0; margin-right:0; text-align:left; }
.section-head-left .section-sub { margin-left:0; }
.pricing-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; align-items:stretch; }
.price-card { position:relative; display:flex; min-height:420px; flex-direction:column; padding:22px; border:1px solid var(--border-matte); border-radius:16px; background:#08090f; box-shadow:var(--shadow-matte); }
.price-card-featured { border-color:rgba(49,221,149,.58); background:linear-gradient(145deg,rgba(11,39,36,.9),#080f12 58%,#08090f); }
.price-card-top { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.price-card h3 { margin:0 0 5px; font-size:16px; }
.price-card p { margin:0; color:var(--text-dim); font-size:12px; }
.price-badge,.price-kicker,.install-callout-tag { color:var(--green); font-size:9px; font-weight:800; letter-spacing:.12em; }
.price-kicker { display:block; margin-bottom:14px; }
.price { display:flex; align-items:baseline; gap:6px; margin:24px 0 20px; }
.price strong { font-size:32px; letter-spacing:-.06em; }
.price span { color:var(--text-dim); font-size:11px; }
.check-list { display:flex; flex:1; flex-direction:column; gap:12px; padding:0; margin:0 0 24px; list-style:none; color:#ccd1df; font-size:13px; }
.check-list li::before { content:"✓"; display:inline-block; width:20px; color:var(--green); font-weight:800; }
.price-card .btn { width:100%; border-radius:8px; }
.pricing-note { margin:18px 0 0; color:var(--text-faint); font-size:11px; }
.install-section { padding-top:96px; }
.install-toolbar { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:16px; }
.install-toolbar-note { color:var(--text-faint); font-size:10px; font-weight:800; letter-spacing:.12em; }
.install-tabs { display:flex; gap:4px; padding:4px; border:1px solid var(--border-matte); border-radius:10px; background:#08090f; }
.install-tab { padding:8px 14px; border:0; border-radius:7px; color:var(--text-dim); background:transparent; font-size:12px; cursor:pointer; }
.install-tab.is-active { color:#061b18; background:var(--green); }
.install-panel { overflow:hidden; border:1px solid var(--border-matte); border-radius:18px; background:#08090f; box-shadow:var(--shadow-matte); }
.install-panel-content { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; padding:14px; }
.install-panel-content.is-hidden { display:none; }
.install-step-card { min-height:136px; padding:16px; border:1px solid rgba(255,255,255,.1); border-radius:12px; background:#0a0c11; }
.install-step-card > span { display:block; margin-bottom:20px; color:var(--green); font-size:10px; font-weight:800; letter-spacing:.1em; }
.install-step-card h3 { margin:0 0 7px; font-size:14px; }
.install-step-card p { margin:0; color:var(--text-dim); font-size:12px; line-height:1.5; }
kbd { padding:2px 5px; border:1px solid rgba(255,255,255,.22); border-bottom-width:2px; border-radius:4px; color:#e8ebf4; background:#151820; font-size:10px; }
.install-callout { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:0 14px 14px; padding:18px 20px; border:1px solid rgba(49,221,149,.48); border-radius:12px; background:rgba(9,42,37,.48); }
.install-callout h3 { margin:6px 0 4px; font-size:16px; }
.install-callout p { margin:0; color:var(--text-dim); font-size:12px; }
.install-callout .btn { flex:0 0 auto; border-radius:8px; }
.faq-section { padding-top:86px; }
.faq-layout { display:grid; grid-template-columns:.72fr 1.28fr; align-items:start; gap:72px; }
.faq-heading { padding-top:4px; }
.faq-heading .section-sub { margin-left:0; }
.faq-list { border-top:1px solid rgba(255,255,255,.12); }
.faq-item { border-bottom:1px solid rgba(255,255,255,.12); }
.faq-item summary { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:17px 0; color:#e3e7f2; font-size:14px; font-weight:700; cursor:pointer; list-style:none; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::after { content:"⌄"; color:#7b839a; font-size:15px; font-weight:400; transition:transform .2s; }
.faq-item[open] summary::after { transform:rotate(180deg); }
.faq-item p { max-width:680px; padding:0 28px 18px 0; margin:0; color:var(--text-dim); font-size:13px; line-height:1.6; }
@media (max-width:900px) {
  .pricing-grid { grid-template-columns:1fr 1fr; }
  .price-card:last-child { grid-column:1 / -1; }
  .faq-layout { grid-template-columns:1fr; gap:34px; }
}
@media (max-width:560px) {
  .section-head-left { text-align:center; }
  .section-head-left .section-sub { margin-left:auto; }
  .pricing-grid { grid-template-columns:1fr; }
  .price-card:last-child { grid-column:auto; }
  .install-toolbar { align-items:flex-start; flex-direction:column; }
  .install-panel-content { grid-template-columns:1fr; }
  .install-step-card { min-height:0; }
  .install-callout { align-items:flex-start; flex-direction:column; }
  .install-callout .btn { width:100%; }
}

/* Final visual pass: every content panel uses the same quiet Axiom surface. */
:root {
  --surface-matte:#0a0c12;
  --surface-raised:#0e1118;
  --border-matte:rgba(196,205,232,.17);
  --border-soft:rgba(196,205,232,.10);
  --shadow-matte:0 22px 52px -38px rgba(0,0,0,.92);
}

header {
  background:rgba(5,6,10,.9);
  border-bottom-color:var(--border-soft);
}

.section { padding:clamp(76px,8vw,112px) 0; }
.section-head,
.section-head-left {
  max-width:760px;
  margin:0 0 34px;
  text-align:left;
}
.section-head .section-sub,
.section-head-left .section-sub { margin-left:0; }
.section-title { font-size:clamp(34px,4.4vw,56px); }

.feature-grid,
.pricing-grid { gap:14px; }

.feature-card,
.visual-card,
.execution-panel,
.security-card,
.cta-inner,
.price-card,
.install-panel,
.faq-list,
.axiom-hero-terminal,
.speed-visual-grid .axiom-dashboard-card {
  border:1px solid var(--border-matte);
  border-radius:18px;
  background:var(--surface-matte);
  box-shadow:var(--shadow-matte);
}

.feature-card,
.security-card { padding:24px; }
.feature-card:hover { border-color:rgba(196,205,232,.28); background:var(--surface-raised); }
.feature-icon { border-color:var(--border-soft); background:#151925; }

.visual-card,
.speed-visual-grid .axiom-dashboard-card,
.price-card,
.install-panel { overflow:hidden; }
.visual-card > * { position:relative; z-index:1; }

.execution-panel { width:min(760px,100%); }
.execution-row { padding:18px 20px; border-bottom-color:var(--border-soft); }
.execution-row strong { color:#f0f2fa; }

.security-card { background:var(--surface-matte); box-shadow:var(--shadow-matte); }
.security-row { border-top-color:var(--border-soft); }

.cta-inner {
  padding:56px 30px;
  background:var(--surface-matte);
}

.install-panel-content { gap:14px; padding:14px; }
.install-step-card {
  border-color:var(--border-soft);
  border-radius:12px;
  background:var(--surface-raised);
}
.install-callout { border-color:rgba(49,221,149,.46); background:rgba(9,42,37,.34); }

.price-card { min-height:400px; }
.price-card-featured { border-color:rgba(49,221,149,.58); background:#0b1717; }
.activate-anchor { position:relative; top:-92px; display:block; height:0; margin:0; visibility:hidden; }
.plan-wip {
  display:flex;
  min-height:42px;
  align-items:center;
  justify-content:center;
  margin-top:auto;
  border-top:1px solid var(--border-soft);
  color:var(--text-faint);
  font-size:10px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.faq-list { overflow:hidden; }
.faq-item { padding:0 20px; border-bottom-color:var(--border-soft); }
.faq-item:first-child { border-top:0; }
.faq-item summary { padding:18px 0; }
.faq-item p { padding-right:24px; }

@media (max-width:900px) {
  .section-head,
  .section-head-left { margin-right:auto; margin-left:auto; }
  .section-head:not(.section-head-left) { text-align:center; }
  .section-head:not(.section-head-left) .section-sub { margin-left:auto; }
}

@media (max-width:560px) {
  .section { padding:72px 0; }
  .section-head,
  .section-head-left { text-align:center; }
  .section-head .section-sub,
  .section-head-left .section-sub { margin-left:auto; }
  .feature-card,
  .security-card { padding:20px; }
  .faq-item { padding:0 16px; }
}

/* Final consistency sweep: one rhythm, one surface system, one control scale. */
:root {
  --section-space:clamp(76px,8vw,112px);
  --panel-radius:18px;
  --control-height:44px;
}

.section,
.install-section,
.execution-section,
.faq-section {
  padding-top:var(--section-space);
  padding-bottom:var(--section-space);
}

.section-head,
.section-head-left {
  max-width:760px;
  margin:0 0 36px;
  text-align:left;
}

.section-title {
  margin:12px 0 14px;
  font-size:clamp(34px,4.4vw,56px);
  line-height:1.04;
}

.section-sub {
  font-size:15px;
  line-height:1.6;
}

.feature-grid,
.pricing-grid { gap:16px; }

.feature-card,
.visual-card,
.execution-panel,
.security-card,
.price-card,
.install-panel,
.faq-list,
.speed-visual-grid .axiom-dashboard-card {
  border-radius:var(--panel-radius);
}

.feature-card {
  min-height:188px;
  display:flex;
  flex-direction:column;
  padding:24px;
}

.feature-card h3,
.price-card h3,
.install-step-card h3,
.install-callout h3,
.security-card h3 {
  line-height:1.25;
}

.feature-card p,
.price-card p,
.install-callout p,
.security-card p {
  line-height:1.55;
}

.price-card { min-height:400px; padding:24px; }
.price-card .btn,
.install-callout .btn { min-height:var(--control-height); }

.install-panel-content { gap:16px; padding:16px; }
.install-step-card { min-height:140px; padding:18px; }
.install-callout { margin:0 16px 16px; padding:20px 22px; }

.execution-panel { width:min(760px,100%); }
.execution-row { min-height:60px; padding:18px 20px; }

.faq-layout,
.split { gap:clamp(32px,5vw,72px); }
.faq-item summary { min-height:56px; }

.footer-top { gap:clamp(20px,3vw,36px); }
.hero-cta > a[href="#install"],
.footer-col a[href="#install"] { display:none; }

@media (max-width:900px) {
  .section-head,
  .section-head-left {
    margin-right:0;
    margin-left:0;
    text-align:left;
  }
  .section-head .section-sub,
  .section-head-left .section-sub { margin-left:0; }
}

@media (max-width:560px) {
  .section,
  .install-section,
  .execution-section,
  .faq-section { padding-top:72px; padding-bottom:72px; }
  .section-head,
  .section-head-left { margin-bottom:28px; text-align:center; }
  .section-head .section-sub,
  .section-head-left .section-sub { margin-right:auto; margin-left:auto; }
  .feature-card { min-height:0; }
  .install-step-card { min-height:0; }
  .install-callout { margin:0 12px 12px; padding:18px; }
}

/* Final visual pass: match the processed walkthrough frame and keep anchor jumps clear of the sticky header. */
.axiom-walkthrough-video {
  aspect-ratio:2 / 1;
  filter:brightness(1.06) contrast(1.03) saturate(1.03);
}

section[id],
#activate { scroll-margin-top:88px; }

:focus-visible {
  outline:2px solid var(--blue-hi);
  outline-offset:4px;
}

/* AxiomAdvanced replaces the walkthrough with a compact filter summary. */
.filter-preview {
  min-height:220px;
  padding:24px;
  background:
    radial-gradient(circle at 70% 20%, rgba(81,106,246,.18), transparent 34%),
    linear-gradient(135deg, rgba(14,17,36,.96), rgba(7,8,16,.98));
  border:1px solid rgba(127,148,255,.22);
  color:var(--text);
}
.filter-preview-head,
.filter-preview-body { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.filter-preview-head { padding-bottom:22px; border-bottom:1px solid var(--line-soft); color:var(--text-faint); font-size:11px; font-weight:700; letter-spacing:.14em; }
.filter-preview-head b { color:#42e6bc; font-size:10px; }
.filter-preview-body { padding:28px 0 24px; }
.filter-preview-body div { display:flex; flex-direction:column; gap:8px; }
.filter-preview-body small { color:var(--text-faint); font-size:10px; letter-spacing:.08em; }
.filter-preview-body strong { font-size:16px; }
.filter-preview-bars { display:flex; align-items:flex-end; gap:10px; height:54px; padding-top:10px; border-top:1px solid var(--line-soft); }
.filter-preview-bars span { display:block; width:100%; height:var(--bar); min-height:12px; border-radius:4px 4px 0 0; background:linear-gradient(180deg, #6d82ff, #36e4bd); opacity:.9; }

@media (max-width: 620px) {
  .filter-preview { min-height:180px; padding:18px; }
  .filter-preview-body { align-items:flex-start; flex-direction:column; gap:14px; padding:20px 0; }
  .filter-preview-body div { flex-direction:row; align-items:baseline; gap:10px; }
}

/* Advanced site visual system: shared surfaces, borders, and install rhythm. */
:root {
  --advanced-panel:#0a0c12;
  --advanced-panel-raised:#0f121a;
  --advanced-border:rgba(196,205,232,.15);
  --advanced-border-soft:rgba(196,205,232,.09);
  --advanced-radius:18px;
  --advanced-shadow:0 24px 58px -42px rgba(0,0,0,.94);
}

.feature-card,
.visual-card,
.execution-panel,
.security-card,
.price-card,
.faq-list,
.axiom-hero-terminal,
.speed-visual-grid .axiom-dashboard-card {
  border-color:var(--advanced-border);
  border-radius:var(--advanced-radius);
  background:var(--advanced-panel);
  box-shadow:var(--advanced-shadow);
}

.axiom-hero-terminal {
  overflow:hidden;
  background:var(--advanced-panel);
  box-shadow:var(--advanced-shadow);
}

.axiom-hero-terminal .terminal-chrome {
  height:50px;
  border-bottom-color:var(--advanced-border-soft);
  background:#080a10;
}

.filter-preview {
  min-height:0;
  padding:24px;
  border:0;
  border-bottom:1px solid var(--advanced-border-soft);
  border-radius:0;
  background:var(--advanced-panel);
  box-shadow:none;
}

.filter-preview-head {
  padding-bottom:18px;
  border-bottom-color:var(--advanced-border-soft);
}

.filter-preview-body {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:start;
  padding:24px 0 20px;
}

.filter-preview-body div { gap:7px; }
.filter-preview-body strong { font-size:15px; letter-spacing:-.02em; }

.filter-preview-bars {
  height:auto;
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:8px;
  padding-top:14px;
  border-top-color:var(--advanced-border-soft);
}

.filter-preview-bars span {
  width:100%;
  height:8px;
  min-height:8px;
  border-radius:999px;
  background:linear-gradient(90deg,#55dfbd 0 var(--bar),rgba(255,255,255,.08) var(--bar) 100%);
  opacity:1;
}

.axiom-install-steps {
  margin:0;
  border:0;
  border-radius:0;
  background:var(--advanced-panel);
}

.axiom-install-step {
  min-height:58px;
  align-items:center;
  padding:16px 24px;
  border-bottom-color:var(--advanced-border-soft);
}

.axiom-install-step .step-num {
  flex-basis:24px;
  width:24px;
  height:24px;
  color:#dfe5ff;
  background:rgba(99,124,255,.18);
}

.feature-card:hover,
.visual-card:hover,
.price-card:hover,
.security-card:hover {
  border-color:rgba(196,205,232,.25);
}

.price-card-featured {
  border-color:rgba(49,221,149,.42);
  background:linear-gradient(145deg,rgba(11,30,29,.92),var(--advanced-panel));
}

@media (max-width:620px) {
  .filter-preview { padding:20px; }
  .filter-preview-body { grid-template-columns:1fr; gap:16px; padding:20px 0; }
  .filter-preview-body div { flex-direction:row; align-items:baseline; gap:10px; }
  .axiom-install-step { padding:15px 20px; }
}

/* Final install preview: a quiet browser-like filter surface. */
.filter-preview {
  min-height:0;
  padding:24px;
  background:var(--advanced-panel);
  border:0;
  border-bottom:1px solid var(--advanced-border-soft);
  border-radius:0;
}
.filter-preview-head {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  padding-bottom:18px;
  border-bottom:1px solid var(--advanced-border-soft);
}
.filter-preview-head > div { display:flex; flex-direction:column; gap:7px; }
.filter-preview-head strong { color:#eef1fb; font-size:17px; letter-spacing:-.02em; }
.filter-preview-eyebrow { color:var(--text-faint); font-size:10px; font-weight:800; letter-spacing:.14em; }
.filter-preview-head b { color:#42e6bc; font-size:10px; letter-spacing:.12em; }
.filter-preview-toolbar { display:flex; align-items:center; gap:8px; padding:18px 0; }
.filter-chip,
.filter-search { border:1px solid var(--advanced-border-soft); border-radius:999px; background:var(--advanced-panel-raised); color:var(--text-dim); font-size:11px; }
.filter-chip { padding:8px 12px; white-space:nowrap; }
.filter-chip.is-active { color:#081b19; border-color:transparent; background:#42dcae; font-weight:800; }
.filter-search { margin-left:auto; min-width:180px; padding:8px 12px; color:var(--text-faint); border-radius:8px; }
.filter-preview-table { border:1px solid var(--advanced-border-soft); border-radius:12px; overflow:hidden; background:#080a10; }
.filter-preview-row { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:14px; align-items:center; min-height:46px; padding:0 14px; border-bottom:1px solid var(--advanced-border-soft); color:var(--text-dim); font-size:12px; }
.filter-preview-row:last-child { border-bottom:0; }
.filter-preview-row-head { min-height:32px; color:var(--text-faint); background:rgba(255,255,255,.025); font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.filter-preview-row strong { color:#eef1fb; font-size:12px; }
.signal-tag { color:#42e6bc; font-weight:700; }
.status-pill { justify-self:start; padding:5px 8px; border-radius:999px; color:#42e6bc; background:rgba(66,220,174,.1); font-size:10px; font-weight:800; }
.status-pill.muted { color:#b8bfd4; background:rgba(255,255,255,.06); }
@media (max-width:620px) {
  .filter-preview { padding:20px; }
  .filter-preview-toolbar { align-items:stretch; flex-wrap:wrap; }
  .filter-search { width:100%; min-width:0; margin-left:0; }
  .filter-preview-table { overflow-x:auto; }
  .filter-preview-row { min-width:520px; }
}

/* Use the supplied filter capture as the preview surface. */
.filter-preview.image-preview {
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:0;
  padding:22px;
  background:#0a0911;
}
.filter-preview-image {
  display:block;
  width:auto;
  max-width:100%;
  max-height:560px;
  height:auto;
  object-fit:contain;
  border-radius:14px;
  box-shadow:0 20px 48px -30px rgba(0,0,0,.9);
}
@media (max-width:620px) {
  .filter-preview.image-preview { padding:14px; }
  .filter-preview-image { max-height:460px; border-radius:10px; }
}

/* Keep the supplied menu legible without letting it overpower the install flow. */
.axiom-hero-terminal .terminal-dot { display:none; }
.axiom-hero-terminal .terminal-chrome { justify-content:flex-end; }
.filter-preview.image-preview { padding:clamp(14px, 2vw, 24px); }
.filter-preview-image {
  display:block;
  width:min(100%, 860px);
  height:auto !important;
  max-width:100%;
  max-height:none !important;
  aspect-ratio:927 / 887;
  object-fit:contain;
  margin:0 auto;
  transition:width .25s ease;
}
@media (max-width:620px) {
  .filter-preview-image { width:100%; }
}

/* Final image-frame reset: never clip or distort the supplied screen capture. */
.filter-preview.image-preview {
  display:flex;
  align-items:center;
  justify-content:center;
  height:auto;
  max-height:none;
  overflow:hidden;
  padding:clamp(14px, 2vw, 22px);
}
.filter-preview-image {
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  max-height:min(620px, 70vh) !important;
  aspect-ratio:auto;
  object-fit:contain;
}
@media (max-width:620px) {
  .filter-preview-image { max-height:60vh !important; }
}

/* Let the real filter screen be the focal card instead of a wide empty browser shell. */
.axiom-hero-terminal {
  width:min(860px, 96vw);
}
.axiom-hero-terminal .terminal-chrome { display:none; }
.filter-preview.image-preview {
  padding:0;
  background:#0a0911;
  border:0;
  border-radius:0;
}
.filter-preview-image {
  width:100% !important;
  max-width:none !important;
  max-height:none !important;
  border:0;
  border-radius:0;
  box-shadow:none;
}
.axiom-install-steps {
  border-top:1px solid var(--advanced-border-soft);
}