:root {
  --edge: clamp(20px, 6vw, 100px);
  --blue: #295bd6;
  --bg: #0c1322;
  --surface: #172238;
  --ink: #f1f5ff;
  --secondary: #c3cfe6;
  --muted: #a4b6d5;
  --line: #2f405f;
  --accent: #9bb8ff;
}
html {scrollbar-gutter:auto;scroll-padding-top:105px}
::selection {background:#dbe8ff;color:#111c33}
.wrap {max-width:1200px}
h1,h2,h3 {font-weight:650;letter-spacing:-.035em}
.site-header {margin:12px 16px 0;border:0;border-radius:24px 24px 0 0;background:#173778;color:white}
.site-header.is-scrolled {
  background:var(--bg);
  background:color-mix(in srgb,var(--bg) 84%,transparent);
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
}
.site-header .mobile-menu {display:none}
.brand {font-weight:700}
.brand img {border-radius:8px}
.desktop-nav {gap:clamp(16px,3vw,38px)}
.desktop-nav a,.desktop-nav a:last-child,.topbar > .nav-cta {
  position:relative;color:white;font-size:15px;font-weight:550;
}
.topbar > .nav-cta {display:inline-flex;align-items:center;gap:8px;min-height:44px;justify-self:end}
.desktop-nav a::after,.topbar > .nav-cta::after {
  content:'';position:absolute;inset:auto 0 7px;height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:left;transition:transform .16s ease;
}
.desktop-nav a:hover::after,.desktop-nav a:focus-visible::after,.nav-cta:hover::after,.nav-cta:focus-visible::after {transform:scaleX(1)}
.site-header :focus-visible,.hero :focus-visible,.concept-banner :focus-visible,.closing-v11 :focus-visible {outline-color:white}
.download {border:1px solid transparent;background:var(--blue);color:white;border-radius:9px;font-weight:650;gap:12px}
.download:hover {background:#3466dd;border-color:#3466dd}
.hero .download,.closing-v11 .download {color:#174bbb;background:white;border-color:white}
.hero .download:hover,.closing-v11 .download:hover {background:#eaf1ff;border-color:#eaf1ff}
.hero,.concept-banner,.closing-v11 {
  background:linear-gradient(152deg,#173778 10%,#1b438f 65%,#193573 100%);
  color:white;margin-inline:16px;border-radius:0 0 24px 24px;
}
.hero-inner {min-height:0;padding-top:56px}
.hero-copy {padding:0;text-align:center}
.hero h1,.concept-banner h1 {
  font-size:clamp(36px,5vw,68px);line-height:1.09;font-weight:690;
  letter-spacing:-.05em;margin-inline:auto;text-wrap:balance;
}
.hero h1 span,.concept-banner h1 span {color:#b9d0ff}
.hero-copy>p,.concept-banner p {
  max-width:630px;margin:20px auto 0;color:#f2f6ff;font-size:clamp(16px,1.45vw,20px);line-height:1.55;
}
.hero-actions {justify-content:center;margin-top:26px}
.hero-actions .quiet-action {background:transparent;border:1px solid #d6e3ff;color:white;border-radius:9px;font-weight:600}
.hero-actions .quiet-action:hover {background:#234d9b}
.concept-art {
  position:relative;max-width:1000px;width:100%;height:355px;margin:44px auto 0;
  overflow:hidden;display:grid;justify-items:center;align-items:start;
}
.art-phone {
  width:254px;border:8px solid #101a2e;border-radius:34px;overflow:hidden;
  background:#101a2e;box-shadow:0 20px 40px #10265455;
}
.art-note {
  position:absolute;max-width:calc(50% - 32px);width:266px;z-index:1;padding:17px 20px;
  background:#192946;color:var(--ink);border:1px solid #52699c;border-radius:13px;
  box-shadow:0 14px 26px #0b162d50;font-size:14px;
}
.art-note small {display:block;color:#c1cfee;font-size:12px;margin-bottom:6px}
.art-note strong {font-size:18px;display:block}
.art-note p {margin-top:3px;color:#c1cfee}
.art-note.left {top:76px;left:5%}
.art-note.right {top:160px;right:5%}
.market-strip {font-size:15px;justify-content:center;gap:clamp(16px,4vw,55px);padding-block:20px}
.market-strip .market-note {display:none}
.cookie-banner {
  position:fixed;z-index:30;inset-inline:0;
  bottom:max(12px,env(safe-area-inset-bottom));margin-inline:auto;
  width:min(calc(100% - 24px),440px);padding:14px 16px;
  background:var(--surface);border:1px solid var(--line);border-radius:16px;
  box-shadow:0 6px 24px #0006;font-size:14px;
}
.cookie-actions {display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.cookie-actions button {
  min-height:44px;padding:6px 12px;border:1px solid var(--accent);border-radius:8px;
  background:transparent;
}
.cookie-actions [value="accepted"] {background:var(--accent);color:var(--bg)}
.landing main .section-intro {gap:32px}
.landing main .section-intro h2,.answers h2 {font-weight:650}
.workbench14,.car-stage14 {background:var(--surface);border-radius:20px;padding:clamp(18px,3vw,40px)}
.landing main .closing-v11 {border-radius:24px;text-align:center;padding-block:66px}
.closing-v11 p {margin-inline:auto;color:white}
.site-footer {margin-top:36px;background:var(--surface)}
.footer-main nav a:hover {color:#b7ceff;text-decoration:underline}
.concept-banner {text-align:center;padding:45px 0 55px}
.concept-banner h1 {max-width:980px}

.platforms {padding-block:38px 12px;display:grid;gap:42px}
.platform-section h2 {font-size:clamp(26px,3vw,40px);margin-bottom:16px}
.platform-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.platform-card {
  display:flex;flex-direction:column;padding:17px 18px 13px;
  border-radius:16px;background:#162239;border:1px solid #2b3e60;
}
.platform-card:hover {border-color:#526ea0}
.platform-top {display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:8px}
.platform-icon {
  width:36px;height:36px;display:grid;place-items:center;border-radius:9px;
  background:#233f79;color:#c7dbff;font-size:14px;font-weight:800;
}
.platform-icon.edge {background:#1a444b;color:#b2ece9}
.platform-icon.firefox,.platform-icon.android {background:#4c2d31;color:#ffd3a7}
.platform-icon.ios,.platform-icon.orion-mac {background:#392e60;color:#e1d3ff}
.platform-format {font-size:12px;font-weight:650;color:#bdcae2}
.platform-card h3 {font-size:clamp(18px,1.8vw,23px)}
.platform-card p {font-size:13px;color:#bdcae2;margin:5px 0 0}
.platform-card .platform-state {margin-top:auto;padding-top:9px}
.platform-card .download {justify-content:center;margin-top:14px;font-size:14px;padding-inline:12px}
.instruction-link {
  display:flex;justify-content:space-between;align-items:center;gap:6px;min-height:44px;
  border-top:1px solid var(--line);margin-top:10px;padding-block:8px;color:#b7ceff;font-size:14px;font-weight:650;
}
.instruction-link:hover span:first-child,.instruction-link:focus-visible span:first-child,.catalog-empty a {
  text-decoration:underline;text-underline-offset:4px;
}
.catalog-empty a {color:#b7ceff}
#recommended {max-width:400px;margin:26px auto 0}
#recommended .recommended-label {color:#e4edff;margin:0 0 9px;font-size:15px}
#recommended .platform-card {text-align:left}
#recommended .platform-card p {margin:5px 0 0;font-size:13px;color:#bdcae2}
#recommended .recommendation-note {font-size:15px;margin:0}

.guide-banner {text-align:left;padding-block:26px 38px}
.guide-heading {max-width:1200px}
.guide-banner .eyebrow-link {color:white;margin-bottom:14px}
.guide-banner .eyebrow-link:hover {text-decoration:underline;text-underline-offset:4px}
.guide-banner .flow-eyebrow {font-size:14px;color:#dbe7ff;margin:0 0 9px}
.guide-banner h1 {font-size:clamp(34px,5vw,60px);margin:0;text-wrap:pretty}
.guide-banner .flow-lead {margin:14px 0 0}
.guide-page {padding-block:24px 18px}
.guide-layout {gap:clamp(25px,5vw,70px);margin-top:24px;grid-template-columns:minmax(0,1fr) 245px}
.guide-steps li,.guide-steps li:last-child {border:0;border-bottom:1px solid var(--line);padding:19px 0 23px 46px}
.guide-steps li::before {
  content:counter(guide);top:18px;left:0;border-radius:50%;width:32px;height:32px;
  line-height:32px;text-align:center;font-weight:750;background:#233e75;color:#d6e4ff;
}
.guide-steps p {margin-top:7px}
.step-cue {border:0;padding:0;margin-top:10px}
.guide-product-caption {font-weight:600}
.release-unavailable,.browser-needed {margin-top:0;background:none;border:0;padding:8px 0}
.first-search {margin-top:35px;padding-top:18px}
.flow-main {padding-block:20px 35px}
.flow-main ul {margin:0}
.flow-main li a:hover {color:#b7ceff;text-decoration:underline;text-underline-offset:4px}
.floating-download {display:none}
@media(max-width:1050px) {
  .workbench14 {display:block}
  .step-tabs14 {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
  .step-tabs14 button {
    display:block;min-width:0;min-height:48px;padding:8px 4px;
    border:0;border-bottom:2px solid transparent;font-size:clamp(13px,2vw,16px);
    text-align:center;
  }
  .step-tabs14 [aria-selected=true] {border-bottom-color:var(--accent)}
  .step-tabs14 [aria-selected=true]::after {content:none}
  .flow-grid14 {border-top:1px solid var(--line);padding-top:24px}
  .flow-panel14 {min-height:0}
}
@media(max-width:850px) {
  html {scroll-padding-top:74px}
  .desktop-nav,.topbar > .nav-cta {display:none}
  .topbar {display:flex;justify-content:space-between;min-height:62px;gap:12px}
  .art-note {display:none}
  .concept-art {height:300px}
  .art-phone {width:200px}
  .platform-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:850px), (hover:none) and (pointer:coarse) {
  .floating-download:not([hidden]) {
    display:grid;place-items:center;position:fixed;z-index:20;
    right:calc(16px + env(safe-area-inset-right));
    bottom:calc(16px + env(safe-area-inset-bottom));
    width:54px;height:54px;border-radius:50%;
    background:#f0eee7;color:#171d28;box-shadow:0 4px 12px #05091159;
    transition:background-color 140ms ease,transform 140ms ease;
  }
  .floating-download svg {width:23px;height:23px;stroke-width:1.65}
  .floating-download:active {background:#e2dfd6;transform:scale(.95)}
  .landing .site-footer {padding-bottom:calc(72px + env(safe-area-inset-bottom))}
}
@media(hover:hover) {
  .floating-download:hover:not(:active) {background:#fffdf7}
}
@media(max-width:800px) {
  .market-strip {grid-template-columns:repeat(2,max-content);justify-items:center;gap:8px 24px}
}
@media(max-width:640px) {
  :root {--edge:16px}
  .site-header {margin:8px 8px 0;border-radius:16px 16px 0 0}
  .hero,.concept-banner,.closing-v11 {margin-inline:8px;border-radius:0 0 16px 16px}
  .hero-inner {padding-top:24px}
  .hero h1,.concept-banner h1 {font-size:clamp(28px,8.2vw,40px);letter-spacing:-.035em}
  .hero h1 br {display:none}
  .hero-copy>p,.concept-banner p {margin-top:12px;font-size:16px}
  .hero-actions {margin-top:18px;gap:8px}
  .hero-actions .quiet-action,.hero-actions .download {font-size:14px;min-height:44px;padding:8px 12px;gap:6px}
  .hero-actions .quiet-action {justify-content:center}
  .concept-art {height:clamp(180px,59vw,250px);margin-top:20px}
  .art-phone {width:165px;border-width:5px;border-radius:24px}
  .market-strip {padding-block:12px}
  .product-section,.purchase-section,.answers {padding-block:44px}
  .landing main .section-intro {margin-bottom:24px}
  .section-intro>p {margin-top:12px}
  .workbench14,.car-stage14 {padding:16px}
  .flow-grid14,.car-stage14 {gap:20px}
  .car-specs14 dl {grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .car-specs14 dd {font-size:clamp(22px,6.5vw,30px)}
  .landing main .closing-v11 {padding-block:40px}
  .closing-v11 h2 {font-size:clamp(30px,8vw,40px)}
  .concept-banner {padding-block:26px 31px}
  .concept-banner h1 br {display:none}
  .platforms {padding-top:24px;gap:27px}
  .platform-grid {gap:9px}
  .platform-card {padding:11px}
  .instruction-link {font-size:13px}
  .guide-banner h1 {font-size:clamp(28px,8vw,38px)}
  .guide-layout {grid-template-columns:minmax(0,1fr)}
  .guide-product {display:block;position:static;width:min(100%,215px);margin:auto}
  .first-search .back-link {margin-top:8px}
}
@media(max-width:360px) {
  .hero-actions {display:grid;grid-template-columns:minmax(0,1fr)}
  .platform-grid {grid-template-columns:minmax(0,1fr)}
}
@media(prefers-reduced-motion:reduce) {
  .desktop-nav a::after,.topbar > .nav-cta::after {transition:none}
}