:root {
  --ink-950: #07090b;
  --ink-900: #0b0e11;
  --ink-850: #0f1317;
  --ink-800: #13181d;
  --ink-750: #182027;
  --blue-500: #0076b8;
  --blue-400: #34b6ff;
  --blue-300: #72d1ff;
  --text: #f5f7f9;
  --muted: #a8b0b9;
  --quiet: #737d87;
  --border: rgba(255, 255, 255, 0.1);
  --border-blue: rgba(88, 199, 255, 0.26);
  --success: #55ca8e;
  --danger: #ff9da8;
  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --shadow: 0 28px 80px rgba(0, 0, 0, 0.42);
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --shell: min(1240px, calc(100% - 48px));
  --z-header: 1000;
  --z-menu: 1100;
  --z-skip: 1200;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; color-scheme: dark; font-size: 100%; }
body { margin: 0; overflow-x: hidden; background: var(--ink-950); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 16px; line-height: 1.65; -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5, h6 { color: var(--text); }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; }
[id] { scroll-margin-top: 96px; }
.gtranslate_wrapper { display: flex; justify-content: flex-start; padding: 12px max(14px, calc((100% - 1240px) / 2)); background: #060708; }
.gtranslate_wrapper .gt_switcher_wrapper { position: static !important; z-index: auto !important; right: auto !important; bottom: auto !important; left: auto !important; }
.shell { width: var(--shell); margin-inline: auto; }
.skip-link { position: fixed; z-index: var(--z-skip); top: 8px; left: 8px; padding: 10px 16px; border-radius: 8px; background: #fff; color: #000; transform: translateY(-160%); transition: transform 160ms; }
.skip-link:focus { transform: translateY(0); }
:focus-visible { outline: 3px solid var(--blue-300); outline-offset: 4px; }
.section { padding: 118px 0; }
.eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 18px; color: var(--blue-300); font-size: 0.72rem; font-weight: 850; letter-spacing: 0.15em; text-transform: uppercase; }
.section-heading { max-width: 760px; margin-bottom: 52px; }
.section-heading.center { margin-inline: auto; text-align: center; }
.section-heading.center .eyebrow { justify-content: center; }
.section-heading h2, .household-copy h2, .support-copy h2, .final-cta h2 { margin: 0; font-size: clamp(2.3rem, 5vw, 4.75rem); line-height: 1.01; letter-spacing: -0.058em; text-wrap: balance; }
.section-heading > p:last-child, .household-copy > p, .support-copy > p, .final-cta p { max-width: 64ch; margin: 22px 0 0; color: var(--muted); font-size: 1.05rem; }

.button { min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 14px; padding: 13px 22px; border: 1px solid transparent; border-radius: 12px; background: var(--blue-500); color: #fff; font-size: 0.9rem; font-weight: 820; line-height: 1.2; cursor: pointer; box-shadow: 0 12px 32px rgba(5, 137, 220, 0.22); transition: transform 180ms var(--ease), border-color 180ms, background 180ms, box-shadow 180ms; }
.button:hover { transform: translateY(-2px); background: #006ba8; box-shadow: 0 16px 40px rgba(5, 137, 220, 0.3); }
.button:active { transform: translateY(0); }
.button-secondary { border-color: var(--border); background: rgba(255,255,255,.035); box-shadow: none; }
.button-secondary:hover { border-color: var(--border-blue); background: rgba(67, 185, 247, .08); box-shadow: none; }
.button-small { min-height: 44px; padding: 10px 17px; font-size: 0.8rem; }
.button-wide { width: 100%; }
.text-link { display: inline-flex; align-items: center; gap: 8px; padding: 0; border: 0; background: transparent; color: var(--blue-300); font-size: 0.86rem; font-weight: 820; cursor: pointer; }
.text-link:hover { color: #fff; }

.announcement { position: relative; z-index: calc(var(--z-header) + 1); border-bottom: 1px solid rgba(88,199,255,.12); background: #07131c; color: #dff5ff; }
.announcement-inner { min-height: 40px; display: flex; align-items: center; justify-content: space-between; gap: 24px; font-size: 0.76rem; }
.announcement-inner span { display: flex; align-items: center; gap: 10px; }
.announcement-inner span i { width: 3px; height: 3px; border-radius: 50%; background: var(--blue-300); }
.announcement-inner a { min-height: 40px; display: inline-flex; align-items: center; color: var(--blue-300); font-weight: 820; }
.site-header { position: sticky; z-index: var(--z-header); top: 0; border-bottom: 1px solid rgba(255,255,255,.065); background: rgba(7, 9, 11, .9); backdrop-filter: blur(18px); }
.nav-row { height: 72px; display: flex; align-items: center; gap: 24px; }
.brand-link { flex-shrink: 0; }
.brand { display: inline-flex; align-items: center; gap: 10px; }
.brand-mark { width: 34px; height: 34px; position: relative; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.12); border-radius: 9px; background: #0878bd; box-shadow: inset 0 1px rgba(255,255,255,.22), 0 8px 20px rgba(4,109,179,.2); font-size: 0.8rem; line-height: 1; transform: rotate(-4deg); }
.brand-mark i { font-style: normal; font-size: 1rem; font-weight: 900; transform: translate(-3px, -2px); }
.brand-mark b { position: absolute; right: 6px; bottom: 6px; font-size: 0.64rem; }
.brand-name { font-size: 0.92rem; font-weight: 900; letter-spacing: 0.09em; }
.desktop-nav { margin-left: auto; display: flex; align-items: center; gap: 24px; }
.desktop-nav a { min-height: 44px; position: relative; display: inline-flex; align-items: center; color: #aab2bb; font-size: 0.76rem; font-weight: 680; transition: color 180ms; }
.desktop-nav a::after { content: ""; height: 1px; position: absolute; right: 100%; bottom: 5px; left: 0; background: var(--blue-300); transition: right 220ms var(--ease); }
.desktop-nav a:hover { color: #fff; }
.desktop-nav a:hover::after { right: 0; }
.nav-cta { margin-left: 4px; }
.menu-button { width: 46px; height: 46px; display: none; flex-direction: column; align-items: center; justify-content: center; gap: 5px; border: 1px solid var(--border); border-radius: 11px; background: var(--ink-800); cursor: pointer; }
.menu-button span { width: 20px; height: 2px; border-radius: 2px; background: #fff; }
.mobile-menu { position: absolute; z-index: var(--z-menu); top: 100%; right: 0; left: 0; display: none; padding: 18px max(18px, calc((100% - 760px) / 2)); border-bottom: 1px solid var(--border); background: rgba(7,9,11,.985); box-shadow: var(--shadow); }

.hero { min-height: 730px; position: relative; display: flex; align-items: center; overflow: hidden; border-bottom: 1px solid rgba(255,255,255,.06); background: radial-gradient(ellipse 58% 58% at 75% 40%, rgba(8, 122, 190, .15), transparent 68%), linear-gradient(145deg, #080a0c, #0a0e11 52%, #07121a); }
.hero-grid { position: absolute; inset: 0; opacity: .11; background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px); background-size: 76px 76px; mask-image: linear-gradient(100deg, #000, transparent 82%); }
.hero-layout { position: relative; display: grid; grid-template-columns: .95fr 1.05fr; align-items: center; gap: 72px; padding: 88px 0 108px; }
.hero-copy { position: relative; z-index: 3; }
.hero-copy .eyebrow span { width: 7px; height: 7px; border-radius: 50%; background: var(--blue-300); box-shadow: 0 0 15px rgba(114,209,255,.72); }
.hero h1 { margin: 0; max-width: 720px; font-size: clamp(3.45rem, 6.1vw, 5.65rem); line-height: .96; letter-spacing: -0.068em; }
.hero h1 em { color: var(--blue-300); font-family: "Iowan Old Style", "Palatino Linotype", Georgia, serif; font-size: 1.04em; font-style: italic; font-weight: 500; letter-spacing: -.045em; }
.hero-lead { max-width: 660px; margin: 28px 0 34px; color: #b4bbc3; font-size: 1.08rem; line-height: 1.72; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-trust { display: flex; flex-wrap: wrap; gap: 9px 18px; margin-top: 25px; color: #8c949e; font-size: 0.74rem; }
.hero-trust span { display: flex; align-items: center; gap: 7px; }
.hero-trust span::before { content: ""; width: 5px; height: 9px; border-right: 1.5px solid var(--success); border-bottom: 1.5px solid var(--success); transform: rotate(45deg) translateY(-1px); }
.hero-visual { min-height: 520px; position: relative; display: grid; place-items: center; }
.hero-visual::before { content: ""; width: 70%; aspect-ratio: 1; position: absolute; border-radius: 50%; background: rgba(5,137,220,.17); filter: blur(88px); }
.hero-photo-frame { width: min(610px, 98%); aspect-ratio: 1.34; position: relative; overflow: hidden; border: 1px solid rgba(255,255,255,.17); border-radius: 26px; background: #0b1117; box-shadow: 0 42px 100px rgba(0,0,0,.68), 0 0 0 7px rgba(255,255,255,.022), inset 0 1px rgba(255,255,255,.2); transform: rotateY(-2deg); }
.hero-photo-frame::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 43%, rgba(3,8,12,.9)), linear-gradient(100deg, rgba(3,12,18,.25), transparent 48%); pointer-events: none; }
.hero-photo-frame img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; }
.hero-photo-caption { position: absolute; z-index: 2; right: 26px; bottom: 23px; left: 26px; display: flex; flex-direction: column; }
.hero-photo-caption span { color: var(--blue-300); font-size: .56rem; font-weight: 900; letter-spacing: .17em; }
.hero-photo-caption strong { max-width: 30ch; margin-top: 4px; font-size: .96rem; line-height: 1.35; }
.hero-service-card { width: 230px; position: absolute; z-index: 4; top: 12px; right: -12px; padding: 16px; border: 1px solid var(--border-blue); border-radius: 16px; background: rgba(8,14,18,.9); box-shadow: 0 24px 55px rgba(0,0,0,.5); backdrop-filter: blur(16px); }
.service-status { display: flex; align-items: center; gap: 8px; padding-bottom: 11px; border-bottom: 1px solid var(--border); color: var(--blue-300); font-size: .63rem; font-weight: 850; text-transform: uppercase; letter-spacing: .1em; }
.service-status i, .device-confirmation > i { width: 7px; height: 7px; border-radius: 50%; background: var(--success); box-shadow: 0 0 12px rgba(85,202,142,.6); }
.hero-service-card ol { margin: 12px 0 0; padding: 0; list-style: none; }
.hero-service-card li { display: flex; align-items: center; gap: 10px; min-height: 37px; color: #dce2e7; font-size: .72rem; }
.hero-service-card li b { color: #67808f; font-size: .59rem; }
.hero-device-dock { position: absolute; z-index: 4; bottom: 6px; left: 1px; display: flex; gap: 5px; padding: 6px; border: 1px solid var(--border); border-radius: 14px; background: rgba(9,14,18,.9); box-shadow: 0 20px 45px rgba(0,0,0,.5); backdrop-filter: blur(14px); }
.hero-device-dock > span { min-width: 78px; min-height: 54px; display: flex; align-items: center; gap: 8px; padding: 8px 9px; border-radius: 9px; background: rgba(255,255,255,.03); color: #b7c0c8; font-size: .63rem; font-weight: 760; }

.device-icon { width: 26px; height: 18px; position: relative; display: inline-block; flex-shrink: 0; border: 1.5px solid #6bcaff; border-radius: 3px; color: #6bcaff; }
.device-icon > i { width: 10px; height: 1px; position: absolute; bottom: -5px; left: 6px; background: currentColor; }
.device-icon-phone { width: 13px; height: 23px; margin-inline: 6px; border-radius: 4px; }
.device-icon-phone > i { width: 3px; bottom: 2px; left: 3.5px; border-radius: 50%; }
.device-icon-tablet { width: 19px; height: 24px; margin-inline: 3px; border-radius: 4px; }
.device-icon-tablet > i { display: none; }
.device-icon-laptop { height: 16px; margin-bottom: 4px; }
.device-icon-laptop > i { width: 32px; height: 3px; bottom: -6px; left: -4px; border-radius: 0 0 5px 5px; }
.device-icon-box { height: 12px; margin-bottom: 6px; border-radius: 5px; }
.device-icon-box > i { width: 3px; height: 3px; top: 3px; right: 3px; bottom: auto; left: auto; border-radius: 50%; }

.trust-bar { border-bottom: 1px solid rgba(255,255,255,.06); background: var(--ink-900); }
.trust-grid { display: grid; grid-template-columns: repeat(5, 1fr); }
.trust-grid > div { min-height: 82px; display: flex; align-items: center; gap: 13px; padding: 15px 21px; border-right: 1px solid rgba(255,255,255,.06); }
.trust-grid > div:last-child { border-right: 0; }
.trust-grid b { color: var(--blue-300); font-size: .75rem; }
.trust-grid span { font-size: .75rem; font-weight: 720; }

.problem-section { background: linear-gradient(180deg, var(--ink-950), var(--ink-900)); }
.before-after-stage { display: grid; grid-template-columns: 1fr 90px 1fr; align-items: stretch; }
.before-panel, .after-panel { min-height: 420px; padding: 36px; border: 1px solid var(--border); background: var(--ink-800); }
.before-panel { border-radius: 24px 0 0 24px; }
.after-panel { border-color: var(--border-blue); border-radius: 0 24px 24px 0; background: linear-gradient(145deg, #0f1b23, #10161a); }
.stage-label { color: var(--blue-300); font-size: .63rem; font-weight: 900; letter-spacing: .15em; }
.before-panel h3, .after-panel h3 { max-width: 19ch; margin: 65px 0 28px; font-size: clamp(1.55rem, 3vw, 2.15rem); line-height: 1.16; letter-spacing: -.04em; }
.friction-stack { display: grid; gap: 8px; }
.friction-stack > div { min-height: 64px; display: flex; align-items: center; gap: 13px; padding: 10px 13px; border: 1px solid rgba(255,255,255,.07); border-radius: 10px; background: rgba(255,255,255,.025); }
.friction-stack i { width: 21px; height: 21px; position: relative; flex-shrink: 0; border: 1px solid rgba(255,157,168,.35); border-radius: 50%; }
.friction-stack i::after, .friction-stack i::before { content: ""; width: 8px; height: 1px; position: absolute; top: 9px; left: 6px; background: #d7808a; transform: rotate(45deg); }
.friction-stack i::after { transform: rotate(-45deg); }
.friction-stack span { display: flex; flex-direction: column; }
.friction-stack b { font-size: .8rem; }
.friction-stack small { color: var(--quiet); font-size: .7rem; }
.story-bridge { position: relative; display: grid; place-items: center; background: linear-gradient(90deg, var(--ink-800), #0e161c); }
.story-bridge span { width: 100%; height: 1px; background: linear-gradient(90deg, rgba(114,209,255,.12), rgba(114,209,255,.6), rgba(114,209,255,.12)); }
.story-bridge i { width: 38px; height: 38px; position: absolute; display: grid; place-items: center; border: 1px solid var(--border-blue); border-radius: 50%; background: #0a1821; color: var(--blue-300); font-style: normal; }
.after-panel ol { margin: 0 0 26px; padding: 0; list-style: none; }
.after-panel li { min-height: 44px; display: flex; align-items: center; gap: 12px; color: #cdd4da; font-size: .84rem; }
.after-panel li b { width: 27px; height: 27px; display: grid; place-items: center; border: 1px solid var(--border-blue); border-radius: 50%; color: var(--blue-300); font-size: .61rem; }

.categories-section { background: var(--ink-900); }
.category-explorer { display: grid; grid-template-columns: 310px 1fr; gap: 18px; align-items: stretch; }
.category-tabs { display: flex; flex-direction: column; gap: 5px; }
.category-tabs button { min-height: 68px; display: grid; grid-template-columns: 30px 1fr 12px; align-items: center; gap: 10px; padding: 11px 16px; border: 1px solid transparent; border-radius: 12px; background: transparent; color: #858f99; text-align: left; cursor: pointer; transition: color 180ms, border-color 180ms, background 180ms; }
.category-tabs button:hover { color: #fff; background: rgba(255,255,255,.025); }
.category-tabs button.active { border-color: var(--border-blue); background: #101b22; color: #fff; }
.category-tabs button > span { color: #60717d; font-size: .62rem; font-weight: 850; }
.category-tabs button > b { font-size: .83rem; }
.category-tabs button > i { width: 6px; height: 6px; border-radius: 50%; background: #34404a; transition: background 180ms, box-shadow 180ms; }
.category-tabs button.active > i { background: var(--blue-300); box-shadow: 0 0 12px rgba(114,209,255,.7); }
.category-stage { min-width: 0; min-height: 530px; position: relative; }
.category-stage [data-category-panel] { height: 100%; position: relative; overflow: hidden; border: 1px solid var(--border); border-radius: 24px; background: var(--ink-800); }
.category-image { height: 100%; min-height: 530px; position: relative; }
.category-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 25%, rgba(5,9,12,.9) 72%), linear-gradient(180deg, transparent 60%, rgba(5,9,12,.7)); }
.category-image img { width: 100%; height: 100%; display: block; object-fit: cover; }
.category-image > span { position: absolute; z-index: 2; bottom: 24px; left: 25px; color: rgba(255,255,255,.72); font-size: .62rem; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.category-copy { width: 42%; position: absolute; z-index: 3; top: 50%; right: 6%; transform: translateY(-50%); }
.category-copy h3 { margin: 0; font-size: clamp(2rem, 4vw, 3.8rem); line-height: 1; letter-spacing: -.05em; }
.category-copy > p:not(.eyebrow) { margin: 19px 0 26px; color: #adb6bf; font-size: .94rem; }

.household-section { background: radial-gradient(circle at 76% 48%, rgba(5,137,220,.11), transparent 30%), var(--ink-950); }
.household-layout, .configurator-layout, .support-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 82px; align-items: center; }
.household-copy > p { max-width: 58ch; }
.interest-strip { display: flex; flex-wrap: wrap; gap: 6px; margin: 28px 0; }
.interest-strip span { padding: 6px 9px; border: 1px solid var(--border); border-radius: 999px; color: #91a0aa; font-size: .56rem; font-weight: 850; letter-spacing: .1em; }
.checked-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 22px; margin: 28px 0; padding: 0; list-style: none; }
.checked-list li { position: relative; padding-left: 22px; color: #cbd1d7; font-size: .83rem; }
.checked-list li::before { content: ""; width: 5px; height: 10px; position: absolute; top: 4px; left: 3px; border-right: 1.5px solid var(--success); border-bottom: 1.5px solid var(--success); transform: rotate(45deg); }
.household-copy small, .support-copy small { display: block; max-width: 52ch; margin-top: 15px; color: var(--quiet); font-size: .69rem; }
.household-visual { min-height: 490px; position: relative; display: grid; place-items: center; }
.household-photo-frame { width: 100%; aspect-ratio: 1.22; position: relative; overflow: hidden; margin: 0; border: 1px solid rgba(255,255,255,.15); border-radius: 24px; background: var(--ink-800); box-shadow: var(--shadow); }
.household-photo-frame::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(3,7,10,.86)); }
.household-photo-frame img { width: 100%; height: 100%; display: block; object-fit: cover; }
.household-photo-frame figcaption { position: absolute; z-index: 2; right: 26px; bottom: 24px; left: 26px; display: flex; flex-direction: column; }
.household-photo-frame figcaption span { color: var(--blue-300); font-size: .57rem; font-weight: 900; letter-spacing: .15em; }
.household-photo-frame figcaption b { max-width: 31ch; margin-top: 4px; font-size: .96rem; }
.household-summary { min-width: 330px; position: absolute; z-index: 3; right: -18px; bottom: 0; display: flex; gap: 6px; padding: 7px; border: 1px solid var(--border-blue); border-radius: 15px; background: rgba(8,14,18,.92); box-shadow: 0 20px 45px rgba(0,0,0,.48); backdrop-filter: blur(16px); }
.household-summary > div { min-width: 150px; display: flex; align-items: center; gap: 10px; padding: 9px; }
.household-summary > div + div { border-left: 1px solid var(--border); }
.household-summary span { display: flex; flex-direction: column; }
.household-summary small { color: #72808a; font-size: .5rem; font-weight: 850; letter-spacing: .11em; }
.household-summary b { font-size: .68rem; }

.reliability-section { background: var(--ink-900); }
.setup-health { overflow: hidden; border: 1px solid var(--border); border-radius: 24px; background: linear-gradient(145deg, var(--ink-800), #0d1317); box-shadow: 0 30px 90px rgba(0,0,0,.22); }
.health-header { min-height: 67px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 26px; border-bottom: 1px solid var(--border); }
.health-header > span { display: flex; align-items: center; gap: 8px; color: var(--blue-300); font-size: .59rem; font-weight: 900; letter-spacing: .14em; }
.health-header > span i { width: 7px; height: 7px; border-radius: 50%; background: var(--success); box-shadow: 0 0 12px rgba(85,202,142,.6); }
.health-header > b { color: #8b969f; font-size: .7rem; font-weight: 680; }
.health-path { height: 1px; margin: 50px 9% 0; background: rgba(255,255,255,.09); }
.health-path i { width: 100%; height: 1px; display: block; background: linear-gradient(90deg, var(--blue-500), var(--blue-300)); transform-origin: left; }
.health-steps { display: grid; grid-template-columns: repeat(4, 1fr); padding: 0 4% 35px; }
.health-steps article { position: relative; padding: 0 20px; text-align: center; }
.health-steps article > span { width: 43px; height: 43px; display: grid; place-items: center; margin: -22px auto 24px; border: 1px solid var(--border-blue); border-radius: 50%; background: #0a1821; color: var(--blue-300); font-size: .62rem; font-weight: 900; }
.health-steps h3 { margin: 0 0 7px; font-size: .98rem; }
.health-steps p { max-width: 27ch; margin: 0 auto; color: var(--muted); font-size: .77rem; }
.honesty-note { margin: 0; padding: 18px 24px; border-top: 1px solid var(--border); background: rgba(5,137,220,.045); color: #929ca6; text-align: center; font-size: .76rem; }
.honesty-note b { color: #e8edf1; }

.device-section { background: var(--ink-950); }
.device-heading-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; }
.device-confirmation { min-width: 220px; display: flex; align-items: center; gap: 12px; margin-bottom: 52px; padding: 13px 15px; border: 1px solid var(--border-blue); border-radius: 12px; background: rgba(5,137,220,.065); }
.device-confirmation span { display: flex; flex-direction: column; }
.device-confirmation small { color: var(--quiet); font-size: .53rem; font-weight: 850; letter-spacing: .12em; }
.device-confirmation b { font-size: .74rem; }
.device-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; }
.device-card { min-height: 168px; position: relative; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; padding: 19px; border: 1px solid var(--border); border-radius: 15px; background: var(--ink-800); text-align: left; cursor: pointer; transition: border-color 180ms, background 180ms, transform 180ms var(--ease); }
.device-card:hover { transform: translateY(-2px); border-color: rgba(114,209,255,.32); }
.device-card.selected { border-color: var(--blue-400); background: #0d1b24; box-shadow: inset 0 0 0 1px rgba(52,182,255,.12); }
.device-card > span:first-child { position: absolute; top: 15px; right: 15px; color: #59636c; font-size: .58rem; font-weight: 850; }
.device-card .device-icon { margin-bottom: 25px; }
.device-card > b { font-size: .8rem; }
.device-card > small { margin-top: 3px; color: var(--quiet); font-size: .62rem; }

.configurator-section { background: radial-gradient(circle at 20% 40%, rgba(5,137,220,.11), transparent 29%), var(--ink-900); }
.configurator-intro h2 { max-width: 600px; margin: 0; font-size: clamp(2.5rem, 5vw, 4.65rem); line-height: 1.02; letter-spacing: -.058em; }
.configurator-intro > p { max-width: 56ch; color: var(--muted); }
.journey-promise { display: grid; grid-template-columns: 36px 1fr; gap: 16px 13px; margin-top: 34px; }
.journey-promise > span { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--border-blue); border-radius: 50%; color: var(--blue-300); font-size: .61rem; font-weight: 850; }
.journey-promise > div { display: flex; flex-direction: column; justify-content: center; }
.journey-promise b { font-size: .84rem; }
.journey-promise small { color: var(--quiet); font-size: .71rem; }
.configurator-card { overflow: hidden; border: 1px solid var(--border-blue); border-radius: 24px; background: linear-gradient(145deg, #151a1f, #0e1215); box-shadow: var(--shadow); }
.form-progress { min-height: 58px; display: grid; grid-template-columns: auto 1fr auto 1fr auto; align-items: center; gap: 12px; padding: 12px 22px; border-bottom: 1px solid var(--border); background: #0c1114; }
.form-progress > span { display: flex; align-items: center; gap: 6px; color: #75818a; font-size: .49rem; font-weight: 850; letter-spacing: .08em; white-space: nowrap; }
.form-progress > span:first-child { color: #dff5ff; }
.form-progress > span b { width: 20px; height: 20px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 50%; color: #6b7780; font-size: .5rem; }
.form-progress > span:first-child b { border-color: var(--border-blue); color: var(--blue-300); }
.form-progress > i { height: 1px; background: rgba(255,255,255,.09); }
.selected-device-summary { display: flex; align-items: center; gap: 12px; margin: 22px 22px 0; padding: 11px 13px; border: 1px solid rgba(114,209,255,.18); border-radius: 11px; background: rgba(5,137,220,.055); }
.selected-device-summary > span { display: flex; flex: 1; flex-direction: column; }
.selected-device-summary small { color: var(--quiet); font-size: .54rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.selected-device-summary b { font-size: .75rem; }
.selected-device-summary button { min-width: 64px; min-height: 44px; border: 0; background: transparent; color: var(--blue-300); font-size: .68rem; font-weight: 800; cursor: pointer; }
.configurator-card form { padding: 22px; }
.intent-tabs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; margin-bottom: 20px; padding: 4px; border-radius: 11px; background: var(--ink-950); }
.intent-tabs button { min-height: 44px; border: 0; border-radius: 8px; background: transparent; color: #7e8891; font-size: .68rem; font-weight: 790; cursor: pointer; transition: color 180ms, background 180ms; }
.intent-tabs button.active { background: #174760; color: #fff; }
.form-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.configurator-card label { display: flex; flex-direction: column; gap: 7px; color: #cbd1d6; font-size: .72rem; font-weight: 740; }
.configurator-card label.full { grid-column: 1 / -1; }
.required, .optional { margin-left: 5px; color: #7fcff7; font-size: .55rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.optional { color: #69747d; }
.configurator-card input, .configurator-card select { width: 100%; min-height: 50px; padding: 10px 12px; border: 1px solid rgba(255,255,255,.12); border-radius: 9px; background: #090c0e; color: #fff; outline: none; }
.configurator-card input::placeholder { color: #66717a; }
.configurator-card input:focus, .configurator-card select:focus { border-color: var(--blue-400); box-shadow: 0 0 0 3px rgba(52,182,255,.11); }
.configurator-card [aria-invalid="true"] { border-color: #d97884; box-shadow: 0 0 0 2px rgba(217,120,132,.1); }
.configurator-card .button-wide { margin-top: 20px; }
.form-error { margin: 15px 2px -4px; color: var(--danger); font-size: .75rem; }
.plan-selection-note { margin: 17px 17px 0; padding: 10px 12px; border: 1px solid var(--border-blue); border-radius: 9px; background: rgba(5,137,220,.08); color: #dff5ff; font-size: .75rem; font-weight: 760; }
.privacy-note { max-width: 64ch; margin: 12px auto 0; color: #6f7982; font-size: .64rem; text-align: center; }

.steps-section { background: var(--ink-950); }
.steps-stage { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.steps-line { height: 1px; position: absolute; top: 27px; right: 11%; left: 11%; background: rgba(255,255,255,.08); }
.steps-line i { width: 100%; height: 1px; display: block; background: linear-gradient(90deg, transparent, #297ca8 12%, #297ca8 88%, transparent); }
.step { position: relative; text-align: center; }
.step > span { width: 54px; height: 54px; position: relative; z-index: 2; display: grid; place-items: center; margin: 0 auto 25px; border: 1px solid var(--border-blue); border-radius: 50%; background: #0b1820; color: var(--blue-300); font-size: .64rem; font-weight: 900; }
.step h3 { margin: 0 0 7px; font-size: .93rem; }
.step p { max-width: 27ch; margin: 0 auto; color: var(--muted); font-size: .78rem; }

.proof-section { background: radial-gradient(circle at 50% 60%, rgba(5,137,220,.09), transparent 38%), var(--ink-900); }
.proof-standard { max-width: 980px; display: grid; grid-template-columns: 145px 1fr 1fr; align-items: center; gap: 32px; margin: 0 auto; padding: 34px; border: 1px solid var(--border-blue); border-radius: 22px; background: rgba(12,21,27,.8); }
.proof-seal { width: 118px; height: 118px; position: relative; display: grid; place-items: center; border: 1px solid var(--border-blue); border-radius: 50%; color: var(--blue-300); }
.proof-seal::before { content: ""; position: absolute; inset: 9px; border: 1px dashed rgba(114,209,255,.25); border-radius: 50%; }
.proof-seal span { font-size: .57rem; font-weight: 900; letter-spacing: .14em; }
.proof-seal i { width: 7px; height: 13px; position: absolute; top: 62px; border-right: 1.5px solid var(--success); border-bottom: 1.5px solid var(--success); transform: rotate(45deg); }
.proof-standard h3 { margin: 9px 0 8px; font-size: 1.35rem; line-height: 1.25; }
.proof-standard p { margin: 0; color: var(--muted); font-size: .8rem; }
.proof-standard .checked-list { grid-template-columns: 1fr; margin: 0; }

.pricing-section { background: var(--ink-950); }
.pricing-selector { max-width: 780px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin: 0 auto 15px; padding: 6px; border: 1px solid var(--border); border-radius: 16px; background: var(--ink-900); }
.pricing-selector button { min-height: 82px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 2px 10px; padding: 13px 15px; border: 1px solid transparent; border-radius: 11px; background: transparent; color: #88929b; text-align: left; cursor: pointer; transition: border-color 180ms, background 180ms, color 180ms; }
.pricing-selector button.active { border-color: var(--border-blue); background: #101c23; color: #fff; }
.pricing-selector button span { font-size: .58rem; font-weight: 900; letter-spacing: .12em; }
.pricing-selector button b { grid-row: 1 / 3; grid-column: 2; color: var(--blue-300); font-size: 1.35rem; }
.pricing-selector button small { color: #66727b; font-size: .55rem; font-weight: 800; letter-spacing: .09em; }
.price-stage { max-width: 930px; display: grid; grid-template-columns: 1fr .72fr; align-items: center; gap: 24px 50px; margin: 0 auto; padding: 42px; border: 1px solid var(--border); border-radius: 24px; background: linear-gradient(145deg, var(--ink-800), #0d1215); }
.price-stage.featured { border-color: var(--border-blue); box-shadow: 0 28px 80px rgba(5,137,220,.12); }
.plan-label { display: inline-flex; padding: 5px 9px; border: 1px solid var(--border-blue); border-radius: 6px; color: var(--blue-300); font-size: .57rem; font-weight: 900; letter-spacing: .12em; }
.price-stage h3 { margin: 17px 0 7px; font-size: clamp(1.7rem, 3vw, 2.55rem); letter-spacing: -.04em; }
.price-stage-intro > p { max-width: 48ch; margin: 0; color: var(--muted); font-size: .85rem; }
.price { display: flex; align-items: flex-end; line-height: 1; }
.price sup { align-self: flex-start; margin-top: 10px; color: var(--blue-300); font-size: 1rem; font-weight: 850; }
.price strong { font-size: 4.1rem; letter-spacing: -.07em; }
.price span { margin: 0 0 8px 8px; color: #7f8992; font-size: .68rem; }
.price-stage-value > p { margin: 10px 0 0; color: #84909a; font-size: .72rem; }
.price-stage-value > p b { color: var(--success); }
.price-stage .checked-list { margin: 0; }
.price-stage > .button { justify-self: stretch; }
.household-offer { max-width: 930px; display: flex; align-items: center; justify-content: space-between; gap: 38px; margin: 22px auto 0; padding: 25px 28px; border: 1px solid rgba(114,209,255,.16); border-radius: 18px; background: linear-gradient(90deg, rgba(5,137,220,.085), rgba(255,255,255,.018)); }
.household-offer span { color: var(--blue-300); font-size: .58rem; font-weight: 900; letter-spacing: .12em; }
.household-offer h3 { margin: 5px 0 3px; font-size: 1.05rem; }
.household-offer p { margin: 0; color: var(--muted); font-size: .77rem; }
.standard-link { margin: 28px 0 6px; color: var(--muted); text-align: center; font-size: .86rem; }
.standard-link a { color: var(--blue-300); font-weight: 800; }
.pricing-terms { max-width: 850px; margin: 0 auto; color: #858f98; font-size: .75rem; text-align: center; }

.comparison-section { background: var(--ink-900); }
.comparison-table { overflow-x: auto; border: 1px solid var(--border); border-radius: 19px; }
.comparison-table table { width: 100%; min-width: 800px; border-collapse: collapse; background: #0f1418; }
.comparison-table th, .comparison-table td { padding: 17px 19px; border-right: 1px solid rgba(255,255,255,.06); border-bottom: 1px solid rgba(255,255,255,.06); color: #9da7af; font-size: .75rem; text-align: left; }
.comparison-table thead th { padding-block: 19px; background: #151a1e; color: #fff; font-size: .67rem; text-transform: uppercase; letter-spacing: .08em; }
.comparison-table thead th:nth-child(2), .comparison-table td:nth-child(2) { background: rgba(5,137,220,.06); color: #d8f3ff; }
.comparison-table tbody th { color: #d7dce1; font-weight: 720; }
.comparison-mobile { display: none; }
.table-disclaimer { margin: 14px 0 0; color: #858f98; font-size: .75rem; }

.support-section { background: radial-gradient(circle at 15% 55%, rgba(5,137,220,.1), transparent 30%), var(--ink-950); }
.support-copy > p { max-width: 58ch; margin-bottom: 29px; }
.support-conversation { padding: 18px; border: 1px solid var(--border); border-radius: 22px; background: var(--ink-800); box-shadow: var(--shadow); }
.conversation-head { min-height: 47px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 5px 14px; border-bottom: 1px solid var(--border); }
.conversation-head > span { display: flex; align-items: center; gap: 8px; color: var(--blue-300); font-size: .57rem; font-weight: 900; letter-spacing: .13em; }
.conversation-head > span i { width: 7px; height: 7px; border-radius: 50%; background: var(--success); }
.conversation-head small { color: #68737c; font-size: .57rem; }
.message { max-width: 82%; margin-top: 13px; padding: 12px 14px; border-radius: 13px; }
.message small { display: block; margin-bottom: 4px; color: #81909a; font-size: .5rem; font-weight: 900; letter-spacing: .1em; }
.message p { margin: 0; color: #d3d9de; font-size: .76rem; line-height: 1.55; }
.user-message { margin-left: auto; border: 1px solid rgba(114,209,255,.16); border-bottom-right-radius: 3px; background: #123347; }
.agent-message { border: 1px solid rgba(255,255,255,.07); border-bottom-left-radius: 3px; background: #0c1114; }
.conversation-footer { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 18px; padding-top: 13px; border-top: 1px solid var(--border); color: #78838c; font-size: .57rem; font-weight: 770; }
.conversation-footer i { width: 3px; height: 3px; border-radius: 50%; background: #3d4c56; }

.faq-section { background: var(--ink-900); }
.faq-layout { display: grid; grid-template-columns: .72fr 1.28fr; gap: 82px; align-items: start; }
.faq-layout > div:first-child { position: sticky; top: 115px; }
.faq-layout .section-heading { margin-bottom: 22px; }
.faq-item { border-bottom: 1px solid rgba(255,255,255,.09); }
.faq-item h3 { margin: 0; }
.faq-item h3 button { width: 100%; min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 12px 0; border: 0; background: transparent; color: #e8ecef; text-align: left; cursor: pointer; }
.faq-item h3 button > span { font-size: .88rem; font-weight: 760; }
.faq-item h3 button > i { width: 29px; height: 29px; position: relative; flex-shrink: 0; border: 1px solid var(--border); border-radius: 50%; transition: transform 200ms var(--ease), border-color 180ms; }
.faq-item h3 button > i::before, .faq-item h3 button > i::after { content: ""; width: 9px; height: 1px; position: absolute; top: 13px; left: 9px; background: #aab3bb; }
.faq-item h3 button > i::after { transform: rotate(90deg); }
.faq-item.open h3 button > i { transform: rotate(45deg); border-color: var(--border-blue); }
.faq-answer { overflow: hidden; }
.faq-answer p { max-width: 72ch; margin: -2px 42px 23px 0; color: var(--muted); font-size: .82rem; }

.guides-section { background: var(--ink-950); }
.guides-layout { display: grid; grid-template-columns: .82fr 1.18fr; gap: 18px; }
.guide-feature { min-height: 460px; display: flex; flex-direction: column; justify-content: flex-end; padding: 34px; border: 1px solid var(--border-blue); border-radius: 22px; background: radial-gradient(circle at 75% 18%, rgba(5,137,220,.18), transparent 32%), linear-gradient(145deg, #111a21, #0c1115); }
.guide-feature > span { color: var(--blue-300); font-size: .6rem; font-weight: 900; letter-spacing: .14em; }
.guide-feature h3 { max-width: 12ch; margin: 52px 0 10px; font-size: clamp(2rem, 4vw, 3.5rem); line-height: 1; letter-spacing: -.05em; }
.guide-feature p { max-width: 42ch; margin: 0 0 25px; color: var(--muted); font-size: .86rem; }
.guide-feature a { color: var(--blue-300); font-size: .78rem; font-weight: 820; }
.guide-index { overflow: hidden; border: 1px solid var(--border); border-radius: 22px; background: var(--ink-800); }
.guide-index > a { min-height: 92px; display: grid; grid-template-columns: 38px 1fr 25px; align-items: center; gap: 12px; padding: 12px 20px; border-bottom: 1px solid rgba(255,255,255,.065); transition: background 180ms; }
.guide-index > a:last-child { border-bottom: 0; }
.guide-index > a:hover { background: rgba(255,255,255,.025); }
.guide-index > a > span { color: #5e6c76; font-size: .61rem; font-weight: 850; }
.guide-index h3 { margin: 0; font-size: .86rem; }
.guide-index p { margin: 2px 0 0; color: var(--quiet); font-size: .7rem; }
.guide-index > a > i { color: var(--blue-300); font-style: normal; }

.final-cta { min-height: 540px; position: relative; display: grid; place-items: center; overflow: hidden; padding: 110px 0; border-top: 1px solid var(--border-blue); background: radial-gradient(circle at 50% 50%, rgba(5,137,220,.18), transparent 36%), linear-gradient(145deg, #07131b, #082334 52%, #07131a); text-align: center; }
.final-grid { position: absolute; inset: 0; opacity: .12; background-image: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px); background-size: 72px 72px; mask-image: radial-gradient(circle, #000, transparent 65%); }
.final-cta .shell { position: relative; }
.final-cta .eyebrow { justify-content: center; }
.final-cta h2 { max-width: 850px; margin-inline: auto; }
.final-cta p { max-width: 710px; margin-inline: auto; }
.final-cta .shell > div { display: flex; justify-content: center; gap: 12px; margin-top: 31px; }

.site-footer { padding: 72px 0 24px; border-top: 1px solid rgba(255,255,255,.06); background: #060708; }
.footer-grid { display: grid; grid-template-columns: 1.6fr repeat(4, 1fr); gap: 42px; }
.footer-brand p { max-width: 33ch; margin: 17px 0 0; color: #747e87; font-size: .76rem; }
.footer-brand p:nth-of-type(1) { color: #9aa4ad; font-size: .65rem; text-transform: uppercase; letter-spacing: .11em; }
.footer-grid h3 { margin: 7px 0 17px; color: #dce1e5; font-size: .67rem; text-transform: uppercase; letter-spacing: .1em; }
.footer-grid > div:not(.footer-brand) { display: flex; flex-direction: column; }
.footer-grid a { min-height: 32px; display: inline-flex; align-items: center; color: #737d86; font-size: .74rem; }
.footer-grid a:hover { color: #fff; }
.footer-bottom { display: flex; justify-content: space-between; gap: 24px; margin-top: 50px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.06); color: #858f98; font-size: .75rem; }
.mobile-sticky { display: none; }

/* Supporting evergreen routes */
.content-page { min-height: 100vh; background: var(--ink-950); }
.content-nav { position: sticky; top: 0; z-index: 100; border-bottom: 1px solid rgba(255,255,255,.07); background: rgba(7,9,11,.92); backdrop-filter: blur(18px); }
.content-nav .shell { min-height: 72px; display: flex; align-items: center; gap: 28px; }
.content-brand { display: flex; align-items: center; gap: 9px; margin-right: auto; font-size: .85rem; letter-spacing: .08em; }
.content-brand span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; background: #006fab; font-size: .72rem; font-weight: 900; letter-spacing: 0; }
.content-brand b { font-size: .82rem; }
.content-nav nav { display: flex; gap: 25px; }
.content-nav nav a { min-height: 44px; display: inline-flex; align-items: center; color: #9fa8b0; font-size: .76rem; font-weight: 700; }
.content-nav nav a:hover { color: #fff; }
.content-hero { position: relative; overflow: hidden; padding: 115px 0 105px; border-bottom: 1px solid rgba(255,255,255,.06); background: radial-gradient(circle at 75% 25%, rgba(5,137,220,.15), transparent 35%), linear-gradient(145deg, #080a0c, #0c1115); }
.content-hero::after { content: ""; position: absolute; inset: 0; opacity: .09; background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px); background-size: 70px 70px; mask-image: linear-gradient(90deg, #000, transparent); }
.content-hero .shell { position: relative; z-index: 2; }
.content-hero h1 { max-width: 900px; margin: 0; font-size: clamp(3rem, 7vw, 5.7rem); line-height: .98; letter-spacing: -.065em; }
.content-hero > .shell > p:not(.eyebrow) { max-width: 66ch; margin: 27px 0 32px; color: var(--muted); font-size: 1.05rem; }
.content-body { padding: 90px 0 105px; background: var(--ink-900); }
.prose-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.prose-section { padding: 30px; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--ink-800); }
.prose-section.full { grid-column: 1 / -1; }
.prose-section h2 { margin: 0 0 15px; font-size: 1.35rem; letter-spacing: -.03em; }
.prose-section h3 { margin: 10px 0 8px; }
.prose-section p, .prose-section li { color: var(--muted); font-size: .88rem; }
.prose-section ul, .prose-section ol { padding-left: 22px; }
.prose-section li { margin: 8px 0; }
.prose-section a { color: var(--blue-300); font-weight: 700; }
.legacy-legal > .xt-container { max-width: none !important; }
.legacy-legal h2 { margin-top: 30px !important; color: var(--text) !important; }
.legacy-legal h2:first-child { margin-top: 0 !important; }
.legacy-legal p, .legacy-legal li { color: var(--muted) !important; }
.prose-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.prose-cards article { min-height: 190px; padding: 22px; border: 1px solid rgba(255,255,255,.07); border-radius: 14px; background: #0d1114; }
.prose-cards article span { color: var(--blue-300); font-size: .61rem; font-weight: 900; text-transform: uppercase; letter-spacing: .1em; }
.prose-cards article h3 { font-size: 1rem; }
.prose-cards article p { font-size: .78rem; }
.prose-cards article b, .prose-cards article a { color: var(--blue-300); font-size: .73rem; }
.prose-faq details { border-bottom: 1px solid rgba(255,255,255,.08); }
.prose-faq summary { min-height: 62px; display: flex; align-items: center; cursor: pointer; font-weight: 800; }
.prose-faq details p { max-width: 80ch; margin: 0 0 20px; }
.content-cta { padding: 90px 0; background: radial-gradient(circle at 50% 100%, rgba(82,191,255,.15), transparent 45%), #071820; text-align: center; }
.content-cta h2 { margin: 0; font-size: clamp(2.1rem, 5vw, 3.8rem); letter-spacing: -.05em; }
.content-cta p { max-width: 700px; margin: 20px auto 30px; color: #aeb7c1; }
.content-footer { padding: 25px 0; border-top: 1px solid rgba(255,255,255,.07); background: #060708; color: #727a84; font-size: .72rem; }
.content-footer .shell { display: flex; justify-content: space-between; gap: 25px; }
.content-footer nav { display: flex; gap: 20px; }
.content-footer a:hover { color: #fff; }

@media (max-width: 1120px) {
  .desktop-nav { gap: 14px; }
  .desktop-nav a { font-size: .69rem; }
  .hero-layout { gap: 42px; }
  .hero h1 { font-size: clamp(3.2rem, 6vw, 4.7rem); }
  .device-grid { grid-template-columns: repeat(3, 1fr); }
  .footer-grid { grid-template-columns: 1.4fr repeat(2, 1fr); }
}

@media (max-width: 900px) {
  :root { --shell: min(100% - 32px, 760px); }
  .section { padding: 92px 0; }
  .desktop-nav, .nav-cta { display: none; }
  .menu-button { display: flex; margin-left: auto; }
  .mobile-menu { display: flex; flex-direction: column; }
  .mobile-menu a { min-height: 48px; display: flex; align-items: center; padding: 10px 7px; border-bottom: 1px solid rgba(255,255,255,.06); color: #c6ccd2; font-size: .85rem; }
  .mobile-menu .button { margin-top: 12px; border-bottom: 0; color: #fff; }
  .hero { min-height: auto; }
  .hero-layout { grid-template-columns: 1fr; gap: 66px; padding: 78px 0 100px; }
  .hero-copy { max-width: 720px; }
  .hero-visual { width: min(690px, 100%); margin: 0 auto; }
  .trust-grid { grid-template-columns: repeat(3, 1fr); }
  .trust-grid > div { border-bottom: 1px solid rgba(255,255,255,.06); }
  .before-after-stage { grid-template-columns: 1fr; }
  .before-panel, .after-panel { min-height: auto; }
  .before-panel { border-radius: 22px 22px 0 0; }
  .after-panel { border-radius: 0 0 22px 22px; }
  .before-panel h3, .after-panel h3 { margin-top: 36px; }
  .story-bridge { min-height: 72px; }
  .story-bridge span { width: 1px; height: 100%; background: linear-gradient(rgba(114,209,255,.12), rgba(114,209,255,.6), rgba(114,209,255,.12)); }
  .story-bridge i { transform: rotate(90deg); }
  .category-explorer { grid-template-columns: 1fr; }
  .category-tabs { flex-direction: row; overflow-x: auto; padding-bottom: 7px; scroll-snap-type: x proximity; }
  .category-tabs button { min-width: 155px; min-height: 56px; scroll-snap-align: start; }
  .category-stage, .category-image { min-height: 500px; }
  .household-layout, .configurator-layout, .support-layout { grid-template-columns: 1fr; gap: 58px; }
  .household-visual { width: min(650px, 100%); margin: 0 auto; }
  .health-steps { grid-template-columns: repeat(2, 1fr); gap: 38px 0; padding-bottom: 38px; }
  .health-path { display: none; }
  .health-steps article > span { margin: 0 auto 18px; }
  .steps-stage { grid-template-columns: repeat(2, 1fr); gap: 48px 20px; }
  .steps-line { display: none; }
  .proof-standard { grid-template-columns: 125px 1fr; }
  .proof-standard .checked-list { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; }
  .price-stage { grid-template-columns: 1fr; max-width: 720px; }
  .price-stage .checked-list { grid-template-columns: repeat(2, 1fr); }
  .household-offer { max-width: 720px; }
  .faq-layout { grid-template-columns: 1fr; gap: 18px; }
  .faq-layout > div:first-child { position: static; }
  .guides-layout { grid-template-columns: 1fr; }
  .guide-feature { min-height: 380px; }
  .footer-grid { grid-template-columns: repeat(3, 1fr); }
  .footer-brand { grid-column: 1 / -1; }
  .prose-cards { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 700px) {
  .comparison-table { display: none; }
  .comparison-mobile { display: grid; gap: 10px; }
  .comparison-mobile article { overflow: hidden; border: 1px solid var(--border); border-radius: 14px; background: var(--ink-800); }
  .comparison-mobile h3 { margin: 0; padding: 14px 16px; border-bottom: 1px solid var(--border); font-size: .82rem; }
  .comparison-mobile article > div { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 11px 16px; border-bottom: 1px solid rgba(255,255,255,.05); }
  .comparison-mobile article > div:last-child { border-bottom: 0; }
  .comparison-mobile b { color: #89949d; font-size: .66rem; }
  .comparison-mobile span { color: #cdd4da; font-size: .7rem; text-align: right; }
  .comparison-mobile article > div:first-of-type { background: rgba(5,137,220,.06); }
  .comparison-mobile article > div:first-of-type b, .comparison-mobile article > div:first-of-type span { color: #d9f4ff; }
}

@media (max-width: 600px) {
  :root { --shell: calc(100% - 28px); }
  body.xt4u-home { padding-bottom: 76px; }
  .section { padding: 76px 0; }
  .eyebrow, .breadcrumbs, .field-help, .privacy-note, .guide-card-meta, .device-card > small { font-size: .75rem; }
  .announcement-inner { min-height: 44px; justify-content: center; text-align: center; line-height: 1.3; }
  .announcement-inner span i, .announcement-inner a { display: none; }
  .nav-row { height: 66px; }
  .mobile-menu { padding: 16px 14px; }
  .hero-layout { gap: 50px; padding: 64px 0 80px; }
  .hero h1 { font-size: clamp(2.75rem, 13vw, 3.72rem); }
  .hero-lead { font-size: .98rem; }
  .hero-actions { flex-direction: column; }
  .hero-actions .button { width: 100%; }
  .hero-trust { gap: 8px 15px; }
  .hero-visual { min-height: 380px; }
  .hero-photo-frame { width: 100%; border-radius: 19px; transform: none; }
  .hero-photo-caption { right: 17px; bottom: 16px; left: 17px; }
  .hero-photo-caption strong { max-width: 24ch; font-size: .78rem; }
  .hero-service-card { width: 187px; top: -2px; right: -2px; padding: 12px; }
  .hero-service-card li { min-height: 32px; font-size: .62rem; }
  .hero-device-dock { right: 2px; bottom: 0; left: 2px; justify-content: center; }
  .hero-device-dock > span { min-width: 0; flex: 1; justify-content: center; padding-inline: 5px; font-size: .57rem; }
  .trust-grid { grid-template-columns: 1fr 1fr; }
  .trust-grid > div { min-height: 66px; padding: 11px 12px; }
  .trust-grid span { font-size: .66rem; }
  .section-heading { margin-bottom: 38px; }
  .section-heading h2, .household-copy h2, .support-copy h2, .final-cta h2 { font-size: clamp(2.2rem, 11vw, 3.15rem); }
  .section-heading > p:last-child, .household-copy > p, .support-copy > p, .final-cta p { font-size: .94rem; }
  .before-panel, .after-panel { padding: 24px; }
  .friction-stack small { font-size: .66rem; }
  .category-tabs button { min-width: 144px; }
  .category-stage, .category-image { min-height: 500px; }
  .category-image::after { background: linear-gradient(180deg, transparent 30%, rgba(5,9,12,.93) 69%); }
  .category-copy { width: auto; top: auto; right: 22px; bottom: 24px; left: 22px; transform: none; }
  .category-copy h3 { font-size: 2.45rem; }
  .category-image > span { top: 19px; bottom: auto; left: 20px; }
  .checked-list { grid-template-columns: 1fr; }
  .household-copy .button { width: 100%; }
  .household-visual { min-height: 360px; }
  .household-photo-frame { border-radius: 19px; }
  .household-photo-frame figcaption { right: 19px; bottom: 73px; left: 19px; }
  .household-summary { min-width: 0; right: 5px; bottom: 0; left: 5px; }
  .household-summary > div { min-width: 0; flex: 1; padding: 7px; }
  .household-summary b { font-size: .59rem; }
  .health-header { align-items: flex-start; padding: 15px 18px; }
  .health-steps { grid-template-columns: 1fr; gap: 27px; padding: 28px 18px; }
  .health-steps article { display: grid; grid-template-columns: 44px 1fr; gap: 0 13px; padding: 0; text-align: left; }
  .health-steps article > span { grid-row: 1 / 3; margin: 0; }
  .health-steps h3 { margin-top: 2px; }
  .health-steps p { margin: 0; }
  .device-heading-row { display: block; }
  .device-confirmation { margin: -20px 0 30px; }
  .device-grid { grid-template-columns: 1fr 1fr; }
  .device-card { min-height: 142px; padding: 14px; }
  .device-card .device-icon { margin-bottom: 19px; }
  .configurator-card { border-radius: 18px; }
  .form-progress { grid-template-columns: auto 1fr auto; gap: 8px; padding: 10px 14px; }
  .form-progress > span:nth-of-type(2), .form-progress > i:nth-of-type(2), .form-progress > span:nth-of-type(3) { display: none; }
  .intent-tabs { grid-template-columns: 1fr 1fr; }
  .form-fields { grid-template-columns: 1fr; }
  .configurator-card label.full { grid-column: auto; }
  .configurator-card form { padding: 17px; }
  .selected-device-summary { margin: 17px 17px 0; }
  .steps-stage { grid-template-columns: 1fr; gap: 31px; }
  .step { display: grid; grid-template-columns: 54px 1fr; gap: 0 15px; text-align: left; }
  .step > span { grid-row: 1 / 3; margin: 0; }
  .step h3 { margin-top: 3px; }
  .step p { margin: 0; }
  .proof-standard { grid-template-columns: 1fr; padding: 25px; }
  .proof-seal { width: 96px; height: 96px; }
  .proof-seal i { top: 49px; }
  .proof-standard .checked-list { grid-column: auto; grid-template-columns: 1fr; }
  .pricing-selector { grid-template-columns: 1fr; }
  .pricing-selector button { min-height: 65px; }
  .price-stage { padding: 25px; }
  .price-stage .checked-list { grid-template-columns: 1fr; }
  .household-offer { flex-direction: column; align-items: flex-start; padding: 23px; }
  .household-offer .button { width: 100%; }
  .support-copy .button { width: 100%; }
  .conversation-head { align-items: flex-start; flex-direction: column; }
  .message { max-width: 91%; }
  .faq-item h3 button > span { font-size: .82rem; }
  .guide-feature { min-height: 340px; padding: 25px; }
  .guide-index > a { grid-template-columns: 31px 1fr 18px; padding: 11px 14px; }
  .guide-index p { display: none; }
  .final-cta { min-height: 480px; padding: 85px 0; }
  .final-cta .shell > div { flex-direction: column; }
  .final-cta .button { width: 100%; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px 20px; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-bottom { flex-direction: column; }
  .mobile-sticky { height: 64px; position: fixed; z-index: 950; right: 10px; bottom: max(8px, env(safe-area-inset-bottom)); left: 10px; display: flex; align-items: center; justify-content: space-between; padding: 9px 14px; border: 1px solid rgba(116,211,255,.34); border-radius: 14px; background: #075f95; box-shadow: 0 16px 40px rgba(0,0,0,.65); }
  .mobile-sticky > span { display: flex; flex-direction: column; line-height: 1.25; }
  .mobile-sticky b { font-size: .76rem; }
  .mobile-sticky small { color: #b9e1f5; font-size: .61rem; }
  .mobile-sticky > i { width: 35px; height: 35px; display: grid; place-items: center; border-radius: 9px; background: rgba(255,255,255,.12); font-style: normal; }
  .content-nav nav { display: none; }
  .content-nav .button { min-height: 42px; padding: 9px 13px; font-size: .66rem; }
  .content-hero { padding: 75px 0; }
  .content-hero h1 { font-size: clamp(2.7rem, 13vw, 4rem); }
  .content-body { padding: 65px 0; }
  .prose-grid, .prose-cards { grid-template-columns: 1fr; }
  .prose-section.full { grid-column: auto; }
  .prose-section { padding: 22px; }
  .content-footer .shell { flex-direction: column; }
  .content-footer nav { flex-wrap: wrap; }
}

@media (max-width: 380px) {
  .hero-service-card { width: 170px; }
  .hero-device-dock > span { gap: 5px; }
  .hero-device-dock .device-icon { transform: scale(.88); }
  .device-card > b { font-size: .72rem; }
  .comparison-mobile article > div { grid-template-columns: .9fr 1.1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* WordPress evergreen implementation */
.visually-hidden { width: 1px !important; height: 1px !important; position: absolute !important; overflow: hidden !important; clip: rect(1px, 1px, 1px, 1px) !important; white-space: nowrap !important; }
.site-header.scrolled { background: rgba(7,9,11,.97); box-shadow: 0 14px 40px rgba(0,0,0,.22); }
.mobile-menu[data-open="false"] { display: none; }
.mobile-menu[data-open="true"] { display: flex; flex-direction: column; }
.category-stage article[hidden], .faq-answer[hidden] { display: none !important; }
.category-stage article { position: relative; min-height: inherit; }
.category-image img { width: 100%; height: 100%; object-fit: cover; }
.xt-reveal { opacity: 0; transform: translateY(16px); transition: opacity 420ms var(--ease), transform 420ms var(--ease); }
.xt-reveal.is-visible { opacity: 1; transform: none; }
.setup-combined { background: var(--ink-950); }
.setup-combined .configurator-layout { align-items: start; }
.setup-steps { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 30px 0 0; }
.setup-steps article { min-height: 142px; padding: 20px; border: 1px solid var(--border); border-radius: 15px; background: rgba(255,255,255,.025); }
.setup-steps span { color: var(--blue-300); font-size: .62rem; font-weight: 900; letter-spacing: .12em; }
.setup-steps h3 { margin: 12px 0 6px; font-size: .94rem; }
.setup-steps p { margin: 0; color: var(--muted); font-size: .76rem; }
.proof-layout { display: grid; grid-template-columns: 1.08fr .92fr; gap: 18px; align-items: stretch; }
.proof-placeholder { padding: 34px; border: 1px solid var(--border-blue); border-radius: 22px; background: linear-gradient(145deg, rgba(15,26,34,.94), rgba(8,13,17,.96)); }
.proof-placeholder h3 { margin: 10px 0 12px; font-size: 1.45rem; }
.proof-placeholder p { color: var(--muted); }
.proof-placeholder .checked-list { grid-template-columns: 1fr; }
.review-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 14px; }
.review-card { overflow: hidden; margin: 0; padding: 13px; border: 1px solid var(--border); border-radius: 18px; background: var(--ink-800); }
.review-card img { width: 100%; aspect-ratio: .78; object-fit: cover; border-radius: 11px; }
.review-card figcaption { margin-top: 10px; color: var(--quiet); font-size: .68rem; }
.support-standard { display: flex; flex-direction: column; justify-content: center; padding: 34px; border: 1px solid var(--border); border-radius: 22px; background: rgba(11,16,20,.88); }
.support-standard h3 { margin: 11px 0; font-size: 1.45rem; }
.support-standard p, .support-standard small { color: var(--muted); }
.support-standard .button { align-self: flex-start; margin-top: 18px; }
.plan-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; }
.plan-card { display: flex; flex-direction: column; padding: 28px; border: 1px solid var(--border); border-radius: 21px; background: linear-gradient(145deg, var(--ink-800), #0d1215); }
.plan-card.featured { border-color: var(--border-blue); box-shadow: 0 28px 70px rgba(5,137,220,.12); transform: translateY(-8px); }
.plan-card .plan-label { align-self: flex-start; }
.plan-card h3 { margin: 20px 0 4px; font-size: 1.2rem; }
.plan-card .price { margin: 15px 0; }
.plan-card .price strong { font-size: 3.65rem; }
.plan-card > p { color: var(--muted); font-size: .78rem; }
.plan-card .checked-list { grid-template-columns: 1fr; margin: 12px 0 22px; }
.plan-card .button { width: 100%; margin-top: auto; }
.pricing-section .household-offer { max-width: none; }
.comparison-mobile article { overflow: hidden; }
.faq-list h3 { margin: 0; }
.faq-answer { overflow: hidden; }
.guide-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; }
.guide-card { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--border); border-radius: 20px; background: var(--ink-800); transition: transform 180ms var(--ease), border-color 180ms; }
.guide-card:hover { transform: translateY(-4px); border-color: var(--border-blue); }
.guide-card-media { aspect-ratio: 16/9; overflow: hidden; background: #0b1116; }
.guide-card-media img { width: 100%; height: 100%; object-fit: cover; }
.guide-card-body { display: flex; flex: 1; flex-direction: column; padding: 20px; }
.guide-card-meta { display: flex; justify-content: space-between; gap: 12px; color: #818b94; font-size: .62rem; text-transform: uppercase; letter-spacing: .08em; }
.guide-card-meta a { color: inherit; }
.guide-card h2, .guide-card h3 { margin: 13px 0 8px; font-size: 1.05rem; line-height: 1.35; }
.guide-card p { margin: 0 0 18px; color: var(--muted); font-size: .75rem; }
.guide-card .text-link { margin-top: auto; }
.guides-footer { display: flex; justify-content: center; margin-top: 28px; }
.field-help { margin: -2px 0 0; color: var(--quiet); font-size: .62rem; }
.form-error[hidden] { display: none; }
.form-error { color: var(--danger); }
.blog-shell { width: min(1120px, calc(100% - 40px)); margin-inline: auto; }
.blog-hero { padding: 92px 0 70px; border-bottom: 1px solid var(--border); background: radial-gradient(circle at 72% 12%, rgba(5,137,220,.15), transparent 35%), #080b0d; }
.blog-hero h1 { max-width: 900px; margin: 0; font-size: clamp(2.7rem,7vw,5.3rem); line-height: .98; letter-spacing: -.06em; }
.blog-hero p:not(.eyebrow) { max-width: 68ch; color: var(--muted); }
.blog-tools { display: flex; justify-content: space-between; gap: 16px; margin: 34px 0; }
.blog-search { flex: 1; display: flex; gap: 8px; }
.blog-search input { width: 100%; min-height: 48px; padding: 10px 14px; border: 1px solid var(--border); border-radius: 10px; background: #090c0e; color: #fff; }
.blog-categories { display: flex; flex-wrap: wrap; gap: 8px; margin: -14px 0 34px; }
.blog-categories a { min-height: 44px; display: inline-flex; align-items: center; padding: 9px 14px; border: 1px solid var(--border); border-radius: 999px; color: #aab3bb; font-size: .76rem; font-weight: 750; }
.blog-categories a:hover, .blog-categories a[aria-current="page"] { border-color: var(--border-blue); background: rgba(52,182,255,.08); color: #fff; }
.blog-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; padding-bottom: 70px; }
.blog-pagination { display: flex; justify-content: center; gap: 8px; padding: 0 0 80px; }
.blog-pagination .page-numbers { min-width: 44px; min-height: 44px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 9px; }
.blog-pagination .current { border-color: var(--blue-500); background: var(--blue-500); }
.xt4u-blog .blog-tools .button-secondary,
.xt4u-blog .blog-pagination .page-numbers:not(.current) { background: #10161b; color: #f5f7f9; }
.breadcrumbs { margin-bottom: 15px; color: var(--quiet); font-size: .7rem; }
.breadcrumbs a { color: var(--blue-300); }

/* Evergreen article template */
.xt4u-article { background: var(--ink-950); }
.article-shell { width: min(1120px, calc(100% - 40px)); margin-inline: auto; }
.article-hero { padding: 78px 0 52px; border-bottom: 1px solid var(--border); background: radial-gradient(circle at 78% 10%, rgba(0,118,184,.15), transparent 35%), #080b0d; }
.article-breadcrumbs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; color: #8f99a2; font-size: .75rem; }
.article-breadcrumbs a { min-height: 32px; display: inline-flex; align-items: center; color: var(--blue-300); }
.article-hero h1 { max-width: 980px; margin: 0; font-size: clamp(2.65rem, 6.4vw, 5.5rem); line-height: 1; letter-spacing: -.06em; }
.article-excerpt { max-width: 72ch; margin: 24px 0 20px; color: #b3bcc4; font-size: clamp(1rem, 2vw, 1.17rem); line-height: 1.7; }
.article-byline { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; color: #9ca6ae; font-size: .76rem; }
.article-byline i { width: 3px; height: 3px; border-radius: 50%; background: #65717b; }
.article-featured-image { overflow: hidden; margin: 38px 0 0; border: 1px solid var(--border); border-radius: 22px; background: #0c1115; aspect-ratio: 16 / 9; }
.article-featured-image img { width: 100%; height: 100%; display: block; object-fit: cover; }
.article-layout { display: grid; grid-template-columns: minmax(190px, 250px) minmax(0, 1fr); gap: clamp(32px, 6vw, 80px); padding-block: 70px 90px; align-items: start; }
.article-layout:has(.article-content:first-child) { grid-template-columns: minmax(0, 1fr); }
.article-toc { position: sticky; top: 104px; max-height: calc(100vh - 130px); overflow-y: auto; padding: 22px; border: 1px solid var(--border); border-radius: 16px; background: #0c1115; }
.article-toc h2 { margin: 0 0 14px; font-size: .8rem; text-transform: uppercase; letter-spacing: .1em; }
.article-toc ol { margin: 0; padding: 0; list-style: none; }
.article-toc li { margin: 0; }
.article-toc .toc-level-3 { padding-left: 14px; }
.article-toc a { min-height: 38px; display: flex; align-items: center; border-bottom: 1px solid rgba(255,255,255,.045); color: #9fa9b1; font-size: .75rem; line-height: 1.35; }
.article-toc a:hover { color: #fff; }
.article-content { width: 100%; max-width: 74ch; min-width: 0; color: #c0c7cd; font-size: clamp(.98rem, 1.3vw, 1.05rem); line-height: 1.82; }
.article-content > :first-child { margin-top: 0; }
.article-content h2, .article-content h3 { scroll-margin-top: 110px; color: var(--text); line-height: 1.25; }
.article-content h2 { margin: 2.4em 0 .7em; font-size: clamp(1.65rem, 3vw, 2.2rem); letter-spacing: -.035em; }
.article-content h3 { margin: 2em 0 .55em; font-size: clamp(1.2rem, 2vw, 1.45rem); }
.article-content p, .article-content ul, .article-content ol, .article-content blockquote { margin-block: 1.15em; }
.article-content ul, .article-content ol { padding-left: 1.35em; }
.article-content li { margin-block: .45em; }
.article-content a:not(.button) { color: var(--blue-300); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.article-content img { max-width: 100%; height: auto; border-radius: 14px; }
.article-content figure { max-width: 100%; margin: 1.7em 0; }
.article-content figcaption { margin-top: 8px; color: #909aa3; font-size: .78rem; line-height: 1.5; }
.article-content table { width: 100%; max-width: 100%; display: block; overflow-x: auto; border-collapse: collapse; -webkit-overflow-scrolling: touch; }
.article-content th, .article-content td { min-width: 145px; padding: 12px; border: 1px solid var(--border); text-align: left; }
.article-content blockquote { padding: 2px 0 2px 22px; border-left: 3px solid var(--blue-500); color: #d3d8dc; }
.article-inline-cta, .article-final-cta { margin: 48px 0; padding: clamp(24px, 4vw, 38px); border: 1px solid var(--border-blue); border-radius: 20px; background: radial-gradient(circle at 100% 0, rgba(52,182,255,.11), transparent 38%), #0b151c; }
.article-inline-cta h2, .article-final-cta h2 { margin: 0 0 12px; font-size: clamp(1.55rem, 3vw, 2.15rem); }
.article-inline-cta p:not(.eyebrow), .article-final-cta p:not(.eyebrow) { margin: 0 0 22px; color: #aeb8c0; }
.article-inline-cta .button, .article-final-cta .button { color: #fff; text-decoration: none; }
.article-related { padding: 80px 0 95px; border-top: 1px solid var(--border); background: #090d10; }
.article-related .section-heading { margin-bottom: 28px; }
.article-related .section-heading h2 { margin: 0; font-size: clamp(2rem, 4vw, 3.2rem); }

@media (max-width: 900px) {
  .article-layout { grid-template-columns: 1fr; gap: 30px; padding-block: 42px 68px; }
  .article-toc { position: static; max-height: none; }
  .article-toc ol { columns: 2; column-gap: 24px; }
  .article-toc li { break-inside: avoid; }
  .article-content { max-width: none; }
}

@media (max-width: 600px) {
  .article-shell { width: min(100% - 28px, 1120px); }
  .article-hero { padding: 54px 0 34px; }
  .article-hero h1 { font-size: clamp(2.35rem, 12vw, 3.5rem); }
  .article-featured-image { margin-top: 28px; border-radius: 15px; }
  .article-toc ol { columns: 1; }
  .article-inline-cta, .article-final-cta { margin: 36px 0; border-radius: 16px; }
}

@media (max-width: 900px) {
  .proof-layout { grid-template-columns: 1fr; }
  .plan-grid, .guide-cards, .blog-grid { grid-template-columns: 1fr 1fr; }
  .plan-card.featured { transform: none; }
}

@media (max-width: 600px) {
  .setup-steps, .plan-grid, .guide-cards, .blog-grid { grid-template-columns: 1fr; }
  .proof-placeholder, .support-standard, .plan-card { padding: 23px; }
  .blog-tools { flex-direction: column; }
  .support-standard .button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .xt-reveal { opacity: 1; transform: none; }
  .plan-card.featured { transform: none; }
}