:root {
  --ink: #070b14;
  --ink-2: #0c1220;
  --night: #10182a;
  --panel: #121b30;
  --panel-2: #17223a;
  --line-dark: rgba(255, 255, 255, 0.1);
  --line-light: #dfe4ed;
  --paper: #f4f6f9;
  --white: #ffffff;
  --text: #e8ecf5;
  --muted: #9ca8bd;
  --dark-text: #111827;
  --dark-muted: #5d6677;
  --violet: #8067ff;
  --violet-bright: #a495ff;
  --blue: #42a5ff;
  --cyan: #70d8ff;
  --green: #61e6ae;
  --radius-sm: 10px;
  --radius: 18px;
  --radius-lg: 28px;
  --shadow: 0 30px 80px rgba(4, 7, 16, 0.28);
  --shell: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--dark-text);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
img, svg { display: block; max-width: 100%; }

.shell { width: min(calc(100% - 40px), var(--shell)); margin-inline: auto; }
.section { padding: 118px 0; }
.section-dark, .section-ink { color: var(--text); background: var(--ink); }
.section-light { background: var(--paper); }
.section-ink { background: linear-gradient(180deg, #09101d 0%, #080c15 100%); }

.skip-link {
  position: fixed; left: 16px; top: -80px; z-index: 1000;
  padding: 12px 16px; border-radius: 8px; background: #fff; color: #111;
}
.skip-link:focus { top: 16px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.site-header {
  position: absolute; inset: 0 0 auto; z-index: 30;
  height: 84px; border-bottom: 1px solid rgba(255,255,255,.08);
  color: var(--text);
}
.header-inner { height: 100%; display: flex; align-items: center; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.brand-name { font-size: 15px; font-weight: 750; letter-spacing: .17em; }
.brand-mark { position: relative; width: 25px; height: 24px; display: inline-block; }
.brand-mark span { position: absolute; display: block; width: 6px; border-radius: 4px; transform: skew(-20deg); background: linear-gradient(180deg, var(--violet-bright), var(--blue)); }
.brand-mark span:nth-child(1) { height: 12px; left: 1px; top: 9px; }
.brand-mark span:nth-child(2) { height: 21px; left: 9px; top: 1px; }
.brand-mark span:nth-child(3) { height: 15px; left: 17px; top: 6px; }
.main-nav { margin-left: auto; display: flex; align-items: center; gap: 28px; }
.main-nav a, .text-link { color: #c3cada; font-size: 14px; transition: color .2s ease; }
.main-nav a:hover, .text-link:hover { color: #fff; }
.header-actions { display: flex; align-items: center; gap: 18px; }
.nav-toggle { display: none; border: 0; background: none; color: #fff; }

.button {
  min-height: 50px; padding: 0 22px; border-radius: 11px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 700; letter-spacing: -.01em;
  border: 1px solid transparent; transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.button:hover { transform: translateY(-2px); }
.button-small { min-height: 42px; padding: 0 18px; }
.button-primary {
  color: #fff; background: linear-gradient(135deg, #6857ea 0%, #4f8cf7 100%);
  box-shadow: 0 12px 32px rgba(91, 101, 238, .28);
}
.button-primary:hover { box-shadow: 0 16px 38px rgba(91, 101, 238, .4); }
.button-secondary { color: #f0f3fa; border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.045); }
.button-secondary:hover { border-color: rgba(255,255,255,.35); background: rgba(255,255,255,.075); }
.button-ghost-dark { color: #172037; border-color: #cbd2de; background: transparent; }
.button-ghost-dark:hover { border-color: #8d98aa; }
.inline-link { font-weight: 750; font-size: 15px; color: #3e47a5; }
.inline-link span { margin-left: 8px; }

.hero {
  position: relative; overflow: hidden; min-height: 850px;
  padding: 174px 0 108px;
  background:
    radial-gradient(circle at 73% 32%, rgba(92, 78, 223, .16), transparent 33%),
    radial-gradient(circle at 18% 10%, rgba(42, 112, 205, .09), transparent 28%),
    linear-gradient(160deg, #090e19 0%, #070b14 60%, #090d18 100%);
}
.hero::before {
  content: ""; position: absolute; inset: 0; opacity: .18; pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: 70px 70px; mask-image: linear-gradient(to bottom, black, transparent 75%);
}
.hero-grid { position: relative; z-index: 2; display: grid; grid-template-columns: .86fr 1.14fr; align-items: center; gap: 64px; }
.hero-copy { padding-top: 4px; }
.eyebrow { margin: 0 0 24px; color: #aeb9cd; text-transform: uppercase; letter-spacing: .14em; font-size: 11px; font-weight: 800; }
.eyebrow-dot { display: inline-block; width: 7px; height: 7px; margin-right: 9px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(97,230,174,.1); }
.eyebrow-dark { color: #666f80; }
.hero h1 { margin: 0; max-width: 660px; font-size: clamp(56px, 6.2vw, 88px); line-height: .98; letter-spacing: -.065em; font-weight: 720; }
.hero h1 span { color: #939db0; }
.hero-lead { max-width: 620px; margin: 30px 0 0; color: #b0b9c9; font-size: 19px; line-height: 1.6; letter-spacing: -.015em; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; }
.offer-note { margin: 24px 0 0; color: #8f9aaf; font-size: 13px; line-height: 1.55; }
.offer-note strong { color: #d9ddff; }
.hero-proof { display: flex; flex-wrap: wrap; gap: 24px; margin: 32px 0 0; padding: 0; list-style: none; color: #8e99ad; font-size: 12px; }
.hero-proof li::before { content: ""; display: inline-block; width: 5px; height: 5px; border-radius: 50%; margin: 0 8px 2px 0; background: #6f84f4; }

.product-stage { position: relative; min-height: 550px; display: grid; place-items: center; perspective: 1200px; }
.app-window {
  position: relative; z-index: 3; width: 720px; max-width: 100%; min-height: 470px;
  border: 1px solid rgba(255,255,255,.13); border-radius: 18px; overflow: hidden;
  background: rgba(13, 20, 35, .96); box-shadow: 0 55px 120px rgba(0,0,0,.48), 0 0 0 1px rgba(99,90,224,.06) inset;
  transform: rotateY(-5deg) rotateX(1deg);
}
.app-topbar { height: 51px; padding: 0 16px; display: flex; align-items: center; border-bottom: 1px solid rgba(255,255,255,.08); background: #0c1322; }
.window-dots { display: flex; gap: 6px; }
.window-dots span { width: 7px; height: 7px; border-radius: 50%; background: #374257; }
.app-title { margin-left: 18px; color: #9eabc1; font-size: 11px; font-weight: 700; }
.system-state { margin-left: auto; display: inline-flex; align-items: center; gap: 7px; color: #8eb9a7; font-size: 10px; }
.system-state i, .security-status i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 10px rgba(97,230,174,.8); }
.app-layout { display: grid; grid-template-columns: 132px 1fr; min-height: 419px; }
.app-sidebar { padding: 20px 12px; border-right: 1px solid rgba(255,255,255,.075); background: #0a111e; }
.mini-brand { display: block; width: 25px; height: 25px; margin: 0 0 22px 8px; border-radius: 8px; background: linear-gradient(135deg, #6f5df5, #3ca6ec); }
.mini-brand i { display: block; width: 7px; height: 13px; margin: 6px auto; border: 2px solid #fff; border-top: 0; transform: skew(-12deg); }
.side-item { height: 34px; margin-bottom: 5px; padding: 0 8px; border-radius: 7px; display: flex; align-items: center; gap: 8px; color: #6f7b90; font-size: 9px; }
.side-item i { width: 12px; height: 12px; border: 1px solid currentColor; border-radius: 3px; opacity: .7; }
.side-item.active { color: #d9dff0; background: rgba(114, 101, 239, .13); }
.app-content { padding: 28px 28px 24px; }
.app-heading { display: flex; align-items: flex-end; justify-content: space-between; }
.app-heading small { color: #68758c; font-size: 9px; }
.app-heading h2 { margin: 5px 0 0; font-size: 25px; letter-spacing: -.04em; }
.last-check { color: #667389; font-size: 8px; }
.metric-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 11px; margin-top: 22px; }
.metric-card { min-height: 124px; padding: 15px; border: 1px solid rgba(255,255,255,.075); border-radius: 11px; background: #111a2c; }
.metric-card > span { display: block; margin-top: 12px; color: #8c98ad; font-size: 8px; }
.metric-card strong { display: block; margin-top: 4px; font-size: 19px; letter-spacing: -.035em; }
.metric-card small { display: block; margin-top: 5px; color: #67748a; font-size: 7px; }
.metric-icon { width: 22px; height: 22px; border-radius: 7px; background: rgba(91,104,239,.16); position: relative; }
.metric-icon::before { content: ""; position: absolute; inset: 6px; border: 1px solid #7d8cf1; }
.metric-icon.shield::before { border-radius: 50% 50% 55% 55%; }
.metric-icon.pulse::before { border-radius: 50%; border-color: #5eafe7; }
.metric-icon.clean::before { transform: rotate(45deg); border-color: #73cdb8; }
.activity-card { margin-top: 13px; padding: 15px; border: 1px solid rgba(255,255,255,.075); border-radius: 11px; background: #0f1829; }
.activity-head { display: flex; justify-content: space-between; padding-bottom: 12px; border-bottom: 1px solid rgba(255,255,255,.06); }
.activity-head strong { font-size: 9px; }
.activity-head span { color: #7f8bea; font-size: 7px; }
.activity-row { height: 37px; display: grid; grid-template-columns: 13px 1fr auto; align-items: center; gap: 7px; border-bottom: 1px solid rgba(255,255,255,.045); color: #8c98ac; font-size: 7px; }
.activity-row:last-child { border-bottom: 0; }
.activity-row i { width: 8px; height: 8px; border-radius: 50%; }
.activity-row i.ok { background: rgba(97,230,174,.14); border: 1px solid #5ccc9d; }
.activity-row i.info { background: rgba(91,126,239,.18); border: 1px solid #7185e9; }
.activity-row time { color: #58657a; }
.stage-orbit { position: absolute; border-radius: 50%; border: 1px solid rgba(119, 103, 244, .18); }
.orbit-one { width: 560px; height: 560px; right: -80px; top: -15px; }
.orbit-two { width: 390px; height: 390px; right: 8px; top: 70px; border-color: rgba(63, 165, 244, .12); }
.concept-label { position: absolute; right: 7px; bottom: 0; color: #566176; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }

.trust-bar { color: #98a3b7; background: #0b111e; border-top: 1px solid rgba(255,255,255,.06); border-bottom: 1px solid rgba(255,255,255,.06); }
.trust-grid { min-height: 86px; display: grid; grid-template-columns: repeat(4, 1fr); align-items: center; }
.trust-grid span { padding: 0 26px; text-align: center; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; border-right: 1px solid rgba(255,255,255,.07); }
.trust-grid span:last-child { border-right: 0; }

.section-intro h2 { margin: 0; font-size: clamp(42px, 5vw, 66px); line-height: 1.03; letter-spacing: -.055em; font-weight: 690; }
.split-intro { display: grid; grid-template-columns: 1.35fr .65fr; gap: 80px; align-items: end; }
.split-intro > p { margin: 0 0 8px; color: var(--dark-muted); font-size: 17px; line-height: 1.75; }
.centered-intro { max-width: 770px; margin: 0 auto 58px; text-align: center; }
.centered-intro h2 { color: #f4f6fb; }
.centered-intro > p:last-child { max-width: 650px; margin: 22px auto 0; color: #939eb2; line-height: 1.7; }

.feature-grid { margin-top: 68px; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.feature-card { position: relative; overflow: hidden; min-height: 360px; padding: 36px; border: 1px solid #dde2eb; border-radius: var(--radius); background: #fff; }
.feature-card::after { content: ""; position: absolute; inset: auto -80px -100px auto; width: 220px; height: 220px; border-radius: 50%; background: radial-gradient(circle, rgba(89,101,225,.09), transparent 68%); }
.feature-large { grid-row: span 2; min-height: 738px; background: #0e1627; border-color: #1d2940; color: #fff; }
.feature-wide { grid-column: span 2; min-height: 290px; display: grid; grid-template-columns: .8fr 1.2fr; gap: 50px; align-items: center; }
.feature-number { position: absolute; top: 24px; right: 25px; color: #9ba4b4; font-size: 10px; font-weight: 800; letter-spacing: .1em; }
.feature-large .feature-number { color: #66728a; }
.feature-kicker { margin: 0 0 14px; color: #626c7d; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.feature-large .feature-kicker { color: #8290a8; }
.feature-card h3 { max-width: 430px; margin: 0; font-size: 29px; line-height: 1.13; letter-spacing: -.04em; }
.feature-card > p:last-child, .feature-copy > p:last-child { max-width: 480px; margin: 17px 0 0; color: #6c7585; font-size: 15px; line-height: 1.65; }
.feature-large .feature-copy > p:last-child { color: #8e9aae; }
.feature-large .feature-copy { position: absolute; left: 36px; bottom: 40px; right: 36px; z-index: 3; }
.feature-icon { width: 58px; height: 58px; margin: 70px 0 38px; border-radius: 16px; background: #f0f2f8; position: relative; }
.feature-icon::before, .feature-icon::after { content: ""; position: absolute; }
.icon-speed::before { width: 26px; height: 26px; left: 16px; top: 16px; border: 2px solid #6975d9; border-radius: 50%; border-bottom-color: transparent; }
.icon-speed::after { width: 13px; height: 2px; left: 28px; top: 29px; background: #6975d9; transform: rotate(-35deg); transform-origin: left; }
.icon-broom::before { width: 5px; height: 28px; top: 11px; left: 27px; border-radius: 4px; background: #49a8d0; transform: rotate(35deg); }
.icon-broom::after { width: 22px; height: 15px; top: 31px; left: 15px; border-radius: 3px 3px 9px 9px; border: 2px solid #49a8d0; transform: rotate(35deg); }
.integrity-visual { position: absolute; inset: 55px 10px 200px; display: grid; place-items: center; }
.scan-ring { position: absolute; border: 1px solid rgba(133, 118, 241, .26); border-radius: 50%; }
.ring-a { width: 330px; height: 330px; }
.ring-b { width: 230px; height: 230px; border-color: rgba(72, 166, 231, .2); }
.scan-core { width: 138px; height: 138px; border-radius: 50%; display: grid; place-content: center; text-align: center; background: radial-gradient(circle, #18264a 0%, #121c31 66%); box-shadow: 0 0 70px rgba(101,85,232,.16); border: 1px solid rgba(138,126,240,.25); }
.scan-core span { font-size: 32px; font-weight: 700; letter-spacing: -.04em; }
.scan-core small { margin-top: 5px; color: #7f8ba0; font-size: 9px; text-transform: uppercase; letter-spacing: .14em; }
.scan-label { position: absolute; padding: 9px 12px; border: 1px solid rgba(255,255,255,.08); border-radius: 8px; color: #8693a9; background: rgba(14,23,40,.88); font-size: 8px; }
.label-a { top: 30px; right: 25px; }
.label-b { left: 20px; top: 190px; }
.label-c { right: 7px; bottom: 30px; }
.log-visual { padding: 8px 22px; border: 1px solid #e1e5ed; border-radius: 13px; background: #f7f8fa; }
.log-visual div { min-height: 57px; display: grid; grid-template-columns: 14px 1fr auto; gap: 12px; align-items: center; border-bottom: 1px solid #e4e8ef; font-size: 12px; }
.log-visual div:last-child { border-bottom: 0; }
.log-visual i { width: 8px; height: 8px; border-radius: 50%; }
.log-visual i.ok { background: #6bcaa1; }
.log-visual i.info { background: #6877dc; }
.log-visual time { color: #9199a7; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; }

.plans-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 920px; margin: 0 auto; }
.plan-card { position: relative; overflow: hidden; min-height: 640px; padding: 46px; border-radius: 22px; }
.plan-free { color: #172036; background: #eef1f6; }
.plan-pro { color: #f4f6fb; border: 1px solid rgba(132,114,247,.25); background: linear-gradient(155deg, #17203a 0%, #10182b 70%); box-shadow: 0 30px 90px rgba(0,0,0,.3); }
.pro-accent { position: absolute; inset: -120px -90px auto auto; width: 300px; height: 300px; border-radius: 50%; background: radial-gradient(circle, rgba(107,89,238,.25), transparent 65%); }
.plan-badge { position: absolute; top: 23px; right: 23px; padding: 8px 11px; border-radius: 999px; color: #cfc8ff; background: rgba(119,101,237,.14); border: 1px solid rgba(139,124,239,.2); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.plan-label { color: #737d8f; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .15em; }
.plan-pro .plan-label { color: #8490a8; }
.plan-head h3 { margin: 11px 0 13px; font-size: 45px; letter-spacing: -.055em; }
.plan-head p { min-height: 50px; margin: 0; color: #646e7e; line-height: 1.55; }
.plan-pro .plan-head p { color: #939eb2; }
.price { margin-top: 38px; padding: 28px 0; border-top: 1px solid rgba(40,49,67,.13); border-bottom: 1px solid rgba(40,49,67,.13); }
.plan-pro .price { border-color: rgba(255,255,255,.08); }
.price strong { display: block; font-size: 42px; letter-spacing: -.05em; }
.price span { display: block; margin-top: 5px; color: #747e8e; font-size: 11px; }
.plan-pro .price span { color: #8b97ad; }
.price-note { margin: 13px 0 -6px; color: #7d88a0; font-size: 10px; }
.check-list { margin: 32px 0; padding: 0; list-style: none; }
.check-list li { position: relative; min-height: 38px; padding-left: 25px; color: #505a6b; font-size: 13px; line-height: 1.45; }
.plan-pro .check-list li { color: #aeb7c9; }
.check-list li::before { content: ""; position: absolute; left: 0; top: 4px; width: 11px; height: 6px; border-left: 2px solid #6572d9; border-bottom: 2px solid #6572d9; transform: rotate(-45deg); }
.plan-card .button { width: 100%; }
.plan-disclaimer { margin: 24px auto 0; max-width: 730px; color: #697488; text-align: center; font-size: 10px; }

.security-section { background: #eef1f5; }
.security-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 90px; align-items: center; }
.security-copy h2 { margin: 0; font-size: clamp(42px, 5vw, 66px); line-height: 1.03; letter-spacing: -.055em; }
.security-copy > p:not(.eyebrow) { margin: 25px 0 0; max-width: 600px; color: #626c7d; font-size: 17px; line-height: 1.72; }
.security-points { margin: 36px 0; }
.security-points > div { display: grid; grid-template-columns: 42px 1fr; gap: 10px; padding: 17px 0; border-bottom: 1px solid #d8dde6; }
.security-points span { color: #747fcf; font-size: 10px; font-weight: 800; }
.security-points p { margin: 0; color: #606979; font-size: 14px; line-height: 1.55; }
.security-points strong { color: #1a2334; margin-right: 5px; }
.security-diagram { position: relative; min-height: 540px; border-radius: 28px; overflow: hidden; background: #0b1322; box-shadow: var(--shadow); }
.security-diagram::before { content: ""; position: absolute; inset: 0; opacity: .2; 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: 42px 42px; }
.security-ring { position: absolute; left: 50%; top: 50%; border-radius: 50%; transform: translate(-50%,-50%); border: 1px solid rgba(115,104,236,.25); }
.security-ring-outer { width: 390px; height: 390px; }
.security-ring-inner { width: 250px; height: 250px; border-color: rgba(62,160,227,.2); }
.security-node { position: absolute; z-index: 3; width: 130px; min-height: 74px; padding: 15px; border: 1px solid rgba(255,255,255,.1); border-radius: 12px; color: #fff; background: rgba(17,27,47,.92); box-shadow: 0 16px 42px rgba(0,0,0,.2); }
.security-node small { display: block; color: #718097; font-size: 8px; text-transform: uppercase; letter-spacing: .12em; }
.security-node strong { display: block; margin-top: 7px; font-size: 12px; }
.node-client { left: 44px; top: 230px; }
.node-policy { right: 45px; top: 116px; }
.node-core { right: 80px; bottom: 82px; border-color: rgba(117,101,236,.32); }
.security-line { position: absolute; z-index: 2; height: 1px; transform-origin: left; background: linear-gradient(90deg, rgba(99,111,227,.2), #6f75de, rgba(65,159,222,.25)); }
.line-a { width: 315px; left: 160px; top: 260px; transform: rotate(-24deg); }
.line-b { width: 210px; right: 120px; top: 198px; transform: rotate(73deg); }
.security-status { position: absolute; left: 36px; bottom: 30px; display: flex; align-items: center; gap: 8px; color: #789388; font-size: 9px; }

.documentation-section { color: #eef2fa; background: #080d17; padding-top: 96px; padding-bottom: 96px; }
.docs-panel { display: grid; grid-template-columns: 1.05fr .95fr; gap: 80px; align-items: center; padding: 62px; border: 1px solid rgba(255,255,255,.08); border-radius: 24px; background: linear-gradient(145deg, #111a2c, #0d1422); }
.docs-panel h2 { max-width: 650px; margin: 0; font-size: 44px; line-height: 1.08; letter-spacing: -.045em; }
.docs-panel > div:first-child > p:last-child { max-width: 570px; margin: 22px 0 0; color: #909caf; line-height: 1.7; }
.docs-links { border-top: 1px solid rgba(255,255,255,.1); }
.docs-links a { min-height: 66px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid rgba(255,255,255,.1); color: #bbc4d4; font-size: 14px; }
.docs-links a:hover { color: #fff; }
.docs-links i { font-style: normal; color: #59667c; font-size: 9px; }

.cta-section { position: relative; overflow: hidden; color: #fff; text-align: center; background: #0a1020; }
.cta-section::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 50% 20%, rgba(107,90,236,.18), transparent 34%); }
.cta-inner { position: relative; z-index: 2; max-width: 800px; }
.cta-inner h2 { margin: 0; font-size: clamp(46px, 6vw, 72px); letter-spacing: -.06em; line-height: 1; }
.cta-inner > p:not(.eyebrow) { max-width: 650px; margin: 24px auto 0; color: #9da7b9; font-size: 17px; line-height: 1.65; }
.cta-actions { justify-content: center; }

.site-footer { color: #a3adbf; background: #070b13; border-top: 1px solid rgba(255,255,255,.07); }
.footer-grid { display: grid; grid-template-columns: 1.8fr repeat(3, .7fr); gap: 48px; padding: 70px 0 54px; }
.footer-brand p { margin: 18px 0 0; color: #687489; font-size: 13px; }
.footer-grid > div:not(.footer-brand) { display: flex; flex-direction: column; gap: 13px; }
.footer-grid strong { margin-bottom: 5px; color: #edf1f8; font-size: 12px; }
.footer-grid a:not(.brand) { color: #7f8a9f; font-size: 12px; }
.footer-grid a:hover { color: #fff; }
.footer-bottom { min-height: 72px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid rgba(255,255,255,.07); color: #566176; font-size: 10px; }
.footer-bottom div { display: flex; gap: 18px; }

@media (max-width: 1080px) {
  .main-nav { gap: 17px; }
  .main-nav a { font-size: 12px; }
  .hero-grid { grid-template-columns: 1fr; }
  .hero-copy { max-width: 760px; }
  .product-stage { margin-top: 20px; }
  .app-window { width: min(760px, 95%); }
  .hero { padding-bottom: 90px; }
  .security-grid { gap: 45px; }
}

@media (max-width: 860px) {
  .site-header { position: absolute; }
  .header-inner { justify-content: space-between; }
  .nav-toggle { width: 42px; height: 42px; display: grid; place-content: center; gap: 6px; border: 1px solid rgba(255,255,255,.12); border-radius: 10px; }
  .nav-toggle span:not(.sr-only) { display: block; width: 18px; height: 1px; background: #fff; }
  .main-nav { position: absolute; top: 84px; left: 20px; right: 20px; margin: 0; padding: 20px; display: none; flex-direction: column; align-items: stretch; gap: 0; border: 1px solid rgba(255,255,255,.1); border-radius: 14px; background: rgba(9,14,25,.98); box-shadow: 0 20px 60px rgba(0,0,0,.35); }
  .main-nav.open { display: flex; }
  .main-nav a { padding: 13px 6px; font-size: 14px; border-bottom: 1px solid rgba(255,255,255,.06); }
  .header-actions { margin-left: auto; }
  .text-link { display: none; }
  .split-intro, .security-grid, .docs-panel { grid-template-columns: 1fr; }
  .split-intro { gap: 26px; }
  .feature-grid { grid-template-columns: 1fr; }
  .feature-large { grid-row: auto; }
  .feature-wide { grid-column: auto; grid-template-columns: 1fr; }
  .plans-grid { grid-template-columns: 1fr; max-width: 570px; }
  .trust-grid { grid-template-columns: 1fr 1fr; }
  .trust-grid span { min-height: 64px; display: grid; place-items: center; border-bottom: 1px solid rgba(255,255,255,.07); }
  .trust-grid span:nth-child(2) { border-right: 0; }
  .security-diagram { min-height: 480px; }
  .docs-panel { padding: 42px; gap: 42px; }
  .footer-grid { grid-template-columns: 1.3fr 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
}

@media (max-width: 600px) {
  .shell { width: min(calc(100% - 28px), var(--shell)); }
  .section { padding: 82px 0; }
  .header-actions .button { display: none; }
  .hero { min-height: auto; padding: 140px 0 78px; }
  .hero h1 { font-size: 52px; }
  .hero-lead { font-size: 16px; }
  .hero-actions { flex-direction: column; }
  .hero-actions .button { width: 100%; }
  .hero-proof { flex-direction: column; gap: 10px; }
  .product-stage { min-height: 410px; margin-top: 34px; overflow: hidden; display: block; }
  .app-window { position: absolute; top: 0; left: 50%; width: 690px; min-width: 690px; transform: translateX(-50%) scale(.52); transform-origin: top center; }
  .concept-label { right: 0; bottom: -4px; }
  .trust-grid { grid-template-columns: 1fr; }
  .trust-grid span { border-right: 0; }
  .section-intro h2, .security-copy h2 { font-size: 42px; }
  .feature-card { padding: 27px; min-height: 330px; }
  .feature-large { min-height: 640px; }
  .feature-large .feature-copy { left: 27px; right: 27px; bottom: 30px; }
  .integrity-visual { scale: .8; }
  .feature-wide { min-height: 420px; }
  .plan-card { padding: 34px 26px; min-height: auto; }
  .plan-badge { position: relative; display: inline-flex; top: auto; right: auto; margin-bottom: 28px; }
  .security-grid { gap: 55px; }
  .security-diagram { min-height: 440px; }
  .security-ring-outer { width: 310px; height: 310px; }
  .security-ring-inner { width: 200px; height: 200px; }
  .security-node { width: 110px; padding: 12px; }
  .node-client { left: 18px; }
  .node-policy { right: 16px; }
  .node-core { right: 35px; }
  .line-a { width: 230px; left: 115px; }
  .docs-panel { padding: 28px; }
  .docs-panel h2 { font-size: 36px; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-bottom { align-items: flex-start; flex-direction: column; justify-content: center; gap: 12px; padding: 20px 0; }
}

/* ==========================================================
   Astricode Ops commercial home · 2026 launch
   ========================================================== */

.hero-commercial .hero-grid {
  grid-template-columns: 1.02fr .98fr;
}

.hero-origin-line {
  max-width: 660px;
  margin: 24px 0 0;
  color: #aab4c7;
  font-size: 16px;
  line-height: 1.65;
}

.hero-origin-line strong {
  color: #fff;
}

.origin-stage {
  position: relative;
  min-height: 560px;
  display: grid;
  place-items: center;
  overflow: hidden;
}

.origin-orbit {
  position: absolute;
  border: 1px solid rgba(140,151,255,.16);
  border-radius: 50%;
}

.origin-orbit-a {
  width: 470px;
  height: 470px;
}

.origin-orbit-b {
  width: 340px;
  height: 340px;
}

.origin-stat {
  position: relative;
  z-index: 2;
  width: min(100%,470px);
  padding: 56px 46px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 26px;
  background:
    radial-gradient(
      circle at 50% 10%,
      rgba(111,132,244,.2),
      transparent 42%
    ),
    rgba(12,20,35,.9);
  box-shadow: 0 34px 100px rgba(0,0,0,.28);
  text-align: center;
}

.origin-stat-label,
.origin-stat-unit {
  display: block;
  color: #9da8bc;
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: 11px;
  font-weight: 800;
}

.origin-stat strong {
  display: block;
  margin: 18px 0 8px;
  color: #fff;
  font-size: clamp(68px,7vw,104px);
  line-height: .92;
  letter-spacing: -.075em;
}

.origin-stat p {
  max-width: 300px;
  margin: 28px auto 0;
  color: #a4afc2;
  line-height: 1.65;
}

.origin-flow {
  position: absolute;
  z-index: 3;
  bottom: 46px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 15px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  color: #cfd5e1;
  background: #0b1220;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
}

.origin-flow i {
  color: #69758a;
  font-style: normal;
}

.story-section {
  background: #f4f6f9;
}

.story-grid {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 110px;
  align-items: center;
}

.story-number-block {
  padding: 48px 0;
}

.story-number {
  display: block;
  color: #111927;
  font-size: clamp(72px,9vw,132px);
  line-height: .88;
  letter-spacing: -.08em;
  font-weight: 760;
}

.story-number-block strong {
  display: block;
  margin-top: 18px;
  color: #5f6d82;
  font-size: 23px;
}

.story-number-block small {
  display: block;
  margin-top: 8px;
  color: #939dad;
}

.story-copy h2 {
  max-width: 720px;
  margin: 0 0 30px;
  color: #111927;
  font-size: clamp(44px,5.4vw,70px);
  line-height: 1.01;
  letter-spacing: -.06em;
}

.story-copy > p:not(.eyebrow) {
  max-width: 720px;
  color: #667286;
  font-size: 17px;
  line-height: 1.75;
}

.story-conclusion {
  padding: 20px 22px;
  border-left: 3px solid #6f84f4;
  background: rgba(111,132,244,.06);
}

.story-conclusion strong {
  color: #182236;
}

.workflow-section {
  background: #080d17;
}

.workflow-intro {
  max-width: 850px;
  margin-inline: auto;
}

.workflow-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 16px;
  margin-top: 60px;
}

.workflow-card {
  min-height: 370px;
  padding: 34px 28px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 20px;
  background: linear-gradient(145deg,#111a2b,#0d1421);
}

.workflow-index {
  display: inline-flex;
  width: 38px;
  height: 38px;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 50%;
  color: #929db1;
  font-size: 11px;
  font-weight: 800;
}

.workflow-card h3 {
  margin: 8px 0 18px;
  color: #f2f5fb;
  font-size: 25px;
  line-height: 1.15;
  letter-spacing: -.035em;
}

.workflow-card p:last-child {
  color: #929db0;
  line-height: 1.68;
}

.workflow-claim {
  margin: 54px 0 0;
  color: #8995aa;
  text-align: center;
  font-size: clamp(23px,3vw,34px);
  letter-spacing: -.035em;
}

.workflow-claim strong {
  color: #dfe4ff;
}

.firewall-section {
  background: #eef1f5;
}

.firewall-grid {
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  gap: 90px;
  align-items: center;
}

.firewall-copy h2 {
  margin: 0;
  color: #111927;
  font-size: clamp(44px,5.2vw,68px);
  line-height: 1.02;
  letter-spacing: -.06em;
}

.firewall-copy > p:not(.eyebrow) {
  max-width: 650px;
  color: #667286;
  font-size: 17px;
  line-height: 1.72;
}

.firewall-panel {
  overflow: hidden;
  border: 1px solid #d6dce5;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 30px 70px rgba(30,45,70,.09);
}

.firewall-panel-head,
.firewall-layer {
  display: flex;
  align-items: center;
}

.firewall-panel-head {
  justify-content: space-between;
  padding: 22px 26px;
  border-bottom: 1px solid #e6eaf0;
}

.firewall-panel-head > span {
  color: #1a2435;
  font-weight: 750;
}

.firewall-panel-head b {
  color: #506078;
  font-size: 11px;
  letter-spacing: .08em;
}

.firewall-panel-head b i {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 7px;
  border-radius: 50%;
  background: #7185f2;
}

.firewall-layer {
  gap: 20px;
  padding: 24px 26px;
  border-bottom: 1px solid #edf0f4;
}

.firewall-layer:last-child {
  border-bottom: 0;
}

.firewall-layer > span {
  color: #8692a5;
  font-size: 11px;
  font-weight: 800;
}

.firewall-layer > div {
  flex: 1;
}

.firewall-layer strong,
.firewall-layer small {
  display: block;
}

.firewall-layer strong {
  color: #1c2637;
}

.firewall-layer small {
  margin-top: 5px;
  color: #8994a5;
}

.firewall-layer > b {
  color: #62708a;
  font-size: 10px;
  letter-spacing: .08em;
}

.detection-section {
  background: #fff;
}

.signal-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 18px;
  margin-top: 54px;
}

.signal-grid article,
.capability-card {
  padding: 30px;
  border: 1px solid #e0e5ec;
  border-radius: 18px;
  background: #f8f9fb;
}

.signal-grid article > span {
  color: #8090ef;
  font-size: 11px;
  font-weight: 800;
}

.signal-grid strong {
  display: block;
  margin-top: 36px;
  color: #1b2536;
  font-size: 20px;
}

.signal-grid p {
  color: #7a8698;
  line-height: 1.62;
}

.conservative-callout {
  max-width: 850px;
  margin: 70px auto 0;
  padding: 40px;
  border-radius: 22px;
  background: #eef1f5;
}

.conservative-callout h3 {
  margin: 0;
  color: #172132;
  font-size: clamp(30px,4vw,48px);
  line-height: 1.08;
  letter-spacing: -.045em;
}

.conservative-callout > p:last-child {
  color: #6d798c;
  line-height: 1.72;
}

.cleanup-section {
  background: #080d17;
}

.dual-ops-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.ops-panel {
  min-height: 650px;
  padding: 48px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 24px;
  background: linear-gradient(145deg,#111a2b,#0d1421);
}

.database-panel {
  background:
    radial-gradient(
      circle at 85% 15%,
      rgba(111,132,244,.15),
      transparent 34%
    ),
    linear-gradient(145deg,#111a2b,#0d1421);
}

.ops-panel h2 {
  margin: 0;
  color: #f2f5fb;
  font-size: clamp(38px,4.4vw,58px);
  line-height: 1.04;
  letter-spacing: -.055em;
}

.ops-panel > p:not(.eyebrow):not(.operational-note) {
  color: #939db0;
  font-size: 16px;
  line-height: 1.72;
}

.ops-points {
  margin-top: 36px;
}

.ops-points > div {
  display: flex;
  gap: 17px;
  padding: 18px 0;
  border-top: 1px solid rgba(255,255,255,.08);
}

.ops-points span {
  color: #7285ec;
  font-size: 10px;
  font-weight: 800;
}

.ops-points p {
  margin: 0;
  color: #99a4b7;
  line-height: 1.6;
}

.ops-points strong {
  display: block;
  margin-bottom: 4px;
  color: #e9edf5;
}

.operational-note {
  margin-top: 26px;
  color: #c7cee0;
  font-size: 13px;
  font-weight: 700;
}

.beyond-section {
  background: #f4f6f9;
}

.capability-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 18px;
  margin-top: 54px;
}

.capability-card > span {
  color: #7788e8;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .1em;
}

.capability-card h3 {
  margin: 38px 0 12px;
  color: #192334;
  font-size: 22px;
}

.capability-card p {
  color: #7b8798;
  line-height: 1.65;
}

.edition-status-note {
  margin: 18px 0 0;
  color: #7f899b;
  font-size: 12px;
  text-align: center;
}

.plan-pro .edition-status-note {
  color: #8e99ad;
}

.cta-pro-link {
  display: inline-block;
  margin-top: 28px;
  color: #adb8d0;
  font-size: 14px;
  font-weight: 750;
  text-decoration: none;
}

.cta-pro-link:hover {
  color: #fff;
}

@media (max-width:1080px) {
  .hero-commercial .hero-grid,
  .story-grid,
  .firewall-grid {
    grid-template-columns: 1fr;
  }

  .origin-stage {
    min-height: 500px;
  }

  .story-grid,
  .firewall-grid {
    gap: 55px;
  }

  .workflow-grid,
  .signal-grid,
  .capability-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width:860px) {
  .dual-ops-grid {
    grid-template-columns: 1fr;
  }

  .ops-panel {
    min-height: auto;
  }
}

@media (max-width:600px) {
  .hero-commercial h1 {
    font-size: 48px;
  }

  .origin-stage {
    min-height: 420px;
  }

  .origin-stat {
    padding: 40px 22px;
  }

  .origin-stat strong {
    font-size: 70px;
  }

  .origin-flow {
    bottom: 18px;
    gap: 5px;
    padding: 9px 10px;
    font-size: 8px;
  }

  .story-number {
    font-size: 72px;
  }

  .workflow-grid,
  .signal-grid,
  .capability-grid {
    grid-template-columns: 1fr;
  }

  .workflow-card {
    min-height: auto;
  }

  .workflow-index {
    margin-bottom: 34px;
  }

  .firewall-panel-head,
  .firewall-layer {
    padding-left: 18px;
    padding-right: 18px;
  }

  .conservative-callout,
  .ops-panel {
    padding: 28px;
  }
}

/* ==========================================================
   Astricode Ops Home polish · 1.6.4
   ========================================================== */

/*
 * The centered-intro base rules were designed primarily for
 * dark sections. Explicitly restore the commercial Beyond Spam
 * heading and copy on its light background.
 */
.beyond-section .centered-intro h2 {
  color: #111927;
}

.beyond-section .centered-intro > p:not(.eyebrow) {
  color: #7b8798;
}

/*
 * Keep the impact of the commercial hero while reducing the
 * unused vertical tail before the capability bar on desktop.
 */
@media (min-width: 601px) {
  .hero-commercial {
    min-height: auto;
    padding-bottom: 72px;
  }
}

/* Astricode Web 1.6.5 · Free vs Pro light-section title contrast */
body.compare-page .edition-cards-section .compare-centered h2 {
    color: #111927;
}


/* ASTRICODE LEGAL PAGES 1.7.1 */

.astricode-legal-page {
  background:
    radial-gradient(
      circle at 15% 0%,
      rgba(102, 80, 255, 0.08),
      transparent 32rem
    ),
    #f7f8fb;
  color: #172033;
}

.legal-site-header {
  position: relative;
  z-index: 10;
  border-bottom: 1px solid rgba(23, 32, 51, 0.09);
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(18px);
}

.legal-site-nav {
  min-height: 76px;
  display: flex;
  align-items: center;
  gap: 32px;
}

.legal-site-brand {
  margin-right: auto;
  color: #111827;
  font-size: 1.12rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  text-decoration: none;
}

.legal-site-links {
  display: flex;
  align-items: center;
  gap: 24px;
}

.legal-site-links a,
.legal-site-account {
  color: #475569;
  font-size: 0.92rem;
  font-weight: 650;
  text-decoration: none;
}

.legal-site-links a:hover,
.legal-site-account:hover {
  color: #111827;
}

.legal-site-account {
  padding: 10px 16px;
  border: 1px solid rgba(23, 32, 51, 0.14);
  border-radius: 999px;
  background: #fff;
}

.legal-page-main {
  padding: 64px 0 100px;
}

.astricode-legal {
  width: min(920px, calc(100% - 40px));
  margin: 0 auto;
  padding: clamp(32px, 5vw, 64px);
  border: 1px solid rgba(23, 32, 51, 0.08);
  border-radius: 28px;
  background: #fff;
  box-shadow:
    0 30px 80px rgba(30, 41, 59, 0.08);
  line-height: 1.75;
}

.astricode-legal h1 {
  max-width: 800px;
  margin: 0 0 18px;
  color: #111827;
  font-size: clamp(2.25rem, 5vw, 4.3rem);
  line-height: 1.02;
  letter-spacing: -0.055em;
}

.astricode-legal h2 {
  margin: 52px 0 16px;
  color: #111827;
  font-size: clamp(1.45rem, 2.6vw, 2rem);
  line-height: 1.2;
  letter-spacing: -0.025em;
}

.astricode-legal h3 {
  margin: 32px 0 12px;
  color: #172033;
}

.astricode-legal p,
.astricode-legal li {
  color: #475569;
  font-size: 1rem;
}

.astricode-legal strong {
  color: #1e293b;
}

.astricode-legal ul {
  margin: 16px 0 26px;
  padding-left: 24px;
}

.astricode-legal li + li {
  margin-top: 9px;
}

.astricode-legal hr {
  margin: 64px 0;
  border: 0;
  border-top: 1px solid rgba(23, 32, 51, 0.12);
}

.astricode-legal a {
  color: #5746d9;
  font-weight: 650;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.astricode-legal code {
  padding: 2px 6px;
  border-radius: 6px;
  background: #f1f5f9;
  color: #334155;
  font-size: 0.92em;
}

.legal-site-footer {
  padding: 48px 0;
  border-top: 1px solid rgba(23, 32, 51, 0.09);
  background: #0d1320;
  color: #cbd5e1;
}

.legal-footer-inner {
  display: grid;
  grid-template-columns: 1.2fr 1fr auto;
  align-items: start;
  gap: 40px;
}

.legal-site-footer strong {
  color: #fff;
  font-size: 1.05rem;
}

.legal-site-footer p {
  margin: 8px 0 0;
  color: #94a3b8;
  font-size: 0.9rem;
}

.legal-footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 20px;
}

.legal-footer-links a {
  color: #cbd5e1;
  font-size: 0.9rem;
  text-decoration: none;
}

.legal-footer-links a:hover {
  color: #fff;
}

.legal-footer-copy {
  white-space: nowrap;
}

@media (max-width: 860px) {
  .legal-site-links {
    display: none;
  }

  .legal-footer-inner {
    grid-template-columns: 1fr;
  }

  .legal-footer-copy {
    white-space: normal;
  }
}

@media (max-width: 640px) {
  .legal-site-nav {
    min-height: 68px;
  }

  .legal-page-main {
    padding: 28px 0 64px;
  }

  .astricode-legal {
    width: min(100% - 24px, 920px);
    padding: 26px 20px 36px;
    border-radius: 20px;
  }

  .astricode-legal h1 {
    font-size: clamp(2rem, 11vw, 3rem);
  }
}

/* END ASTRICODE LEGAL PAGES 1.7.1 */





/* ASTRICODE UNIFIED CONTENT PAGES 1.7.4 */

/*
 * Privacy, Terms, Legal, Changelog and Roadmap deliberately
 * use one single Astricode presentation system.
 *
 * The header and footer markup remain the exact shared markup
 * used by the public site. No alternative light header exists.
 */

.astricode-content-page {
  background:
    #0b1220;
}

/* -------------------------------------------------
   SHARED HEADER
   ------------------------------------------------- */

.astricode-content-page > header,
.astricode-content-page header.site-header {
  position:
    relative;
  z-index:
    50;
  background:
    #0b1220 !important;
  border-bottom:
    1px solid rgba(255, 255, 255, 0.08);
}

/*
 * Restore the original white Astricode logo used by the
 * main dark site header.
 */
.astricode-content-page header img {
  filter:
    none !important;
  opacity:
    1 !important;
}

/*
 * Shared header navigation follows the normal Astricode
 * dark-header colour system.
 */
.astricode-content-page header a:not(.button),
.astricode-content-page header nav a {
  color:
    rgba(255, 255, 255, 0.72) !important;
}

.astricode-content-page header a:not(.button):hover,
.astricode-content-page header nav a:hover {
  color:
    #ffffff !important;
}

.astricode-content-page header svg {
  color:
    #ffffff !important;
}

.astricode-content-page header svg path,
.astricode-content-page header svg text {
  fill:
    currentColor;
}

/*
 * Keep the existing Buy Pro CTA exactly as a branded action.
 */
.astricode-content-page header .button,
.astricode-content-page header [class*="primary"] {
  filter:
    none !important;
}

/* -------------------------------------------------
   MAIN CONTENT SURFACE
   ------------------------------------------------- */

.astricode-content-page .legal-page-main {
  position:
    relative;
  padding:
    72px 0 104px;
  background:
    linear-gradient(
      180deg,
      #f7f9fc 0%,
      #ffffff 100%
    );
}

/*
 * Remove the "separate microsite / floating document" effect.
 * These pages now use the same broad, clean content surface.
 */
.astricode-content-page
.legal-page-main
> .astricode-legal {
  width:
    min(1120px, calc(100% - 48px));
  margin:
    0 auto;
  padding:
    64px 72px 80px;
  border:
    1px solid rgba(15, 23, 42, 0.07);
  border-radius:
    24px;
  background:
    #ffffff;
  box-shadow:
    0 24px 70px rgba(15, 23, 42, 0.055);
}

/* -------------------------------------------------
   TYPOGRAPHY
   ------------------------------------------------- */

.astricode-content-page
.astricode-legal h1 {
  max-width:
    900px;
  margin:
    0 0 26px;
  color:
    #0b1220;
  font-size:
    clamp(2.7rem, 5vw, 4.6rem);
  line-height:
    1.02;
  letter-spacing:
    -0.055em;
}

.astricode-content-page
.astricode-legal h2 {
  margin:
    52px 0 18px;
  color:
    #111827;
  font-size:
    clamp(1.45rem, 2.5vw, 2rem);
  line-height:
    1.2;
  letter-spacing:
    -0.025em;
}

.astricode-content-page
.astricode-legal h3 {
  color:
    #172033;
}

.astricode-content-page
.astricode-legal p,
.astricode-content-page
.astricode-legal li {
  color:
    #526075;
  line-height:
    1.75;
}

.astricode-content-page
.astricode-legal strong {
  color:
    #172033;
}

.astricode-content-page
.astricode-legal a {
  color:
    #5c55e8;
  text-decoration:
    underline;
  text-underline-offset:
    3px;
}

/* -------------------------------------------------
   COMMON EYEBROW / LEAD
   ------------------------------------------------- */

.astricode-content-page
.info-eyebrow {
  margin:
    0 0 16px !important;
  color:
    #6258ec !important;
  font-size:
    0.76rem !important;
  font-weight:
    800 !important;
  letter-spacing:
    0.13em;
}

.astricode-content-page
.info-lead {
  max-width:
    780px;
  margin:
    0 0 48px !important;
  color:
    #526075 !important;
  font-size:
    1.12rem !important;
  line-height:
    1.75;
}

/* -------------------------------------------------
   CHANGELOG
   ------------------------------------------------- */

.astricode-content-page
.info-release,
.astricode-content-page
.info-note {
  margin-top:
    24px;
  padding:
    28px 30px;
  border:
    1px solid rgba(15, 23, 42, 0.08);
  border-radius:
    18px;
  background:
    #f9fafc;
  box-shadow:
    none;
}

.astricode-content-page
.info-release-meta,
.astricode-content-page
.roadmap-page-top {
  display:
    flex;
  align-items:
    center;
  justify-content:
    space-between;
  gap:
    18px;
  margin-bottom:
    18px;
}

/* -------------------------------------------------
   ONE BRAND STATUS SYSTEM
   ------------------------------------------------- */

/*
 * Available / Coming next / Planned retain their wording,
 * but all use the Astricode brand palette instead of
 * creating green, purple and grey mini-identities.
 */
.astricode-content-page
.info-status {
  display:
    inline-flex;
  align-items:
    center;
  min-height:
    28px;
  padding:
    0 11px;
  border:
    1px solid rgba(95, 85, 232, 0.14);
  border-radius:
    999px;
  background:
    rgba(95, 85, 232, 0.09);
  color:
    #574ed7;
  font-size:
    0.69rem;
  font-weight:
    800;
  letter-spacing:
    0.07em;
}

.astricode-content-page
.info-status-available,
.astricode-content-page
.info-status-next,
.astricode-content-page
.info-status-planned {
  background:
    rgba(95, 85, 232, 0.09);
  color:
    #574ed7;
}

/* -------------------------------------------------
   ROADMAP
   ------------------------------------------------- */

.astricode-content-page
.roadmap-page-grid {
  display:
    grid;
  grid-template-columns:
    repeat(2, minmax(0, 1fr));
  gap:
    18px;
  margin-top:
    42px;
}

.astricode-content-page
.roadmap-page-card {
  padding:
    28px;
  border:
    1px solid rgba(15, 23, 42, 0.08);
  border-radius:
    18px;
  background:
    #f9fafc;
  box-shadow:
    none;
}

.astricode-content-page
.roadmap-page-current,
.astricode-content-page
.roadmap-page-next {
  border-color:
    rgba(95, 85, 232, 0.18);
}

.astricode-content-page
.roadmap-page-card h2,
.astricode-content-page
.info-release h2,
.astricode-content-page
.info-note h2 {
  margin:
    0 0 12px;
  color:
    #111827;
}

.astricode-content-page
.roadmap-page-card p,
.astricode-content-page
.info-release p,
.astricode-content-page
.info-note p {
  color:
    #526075;
}

/* -------------------------------------------------
   SHARED FOOTER
   ------------------------------------------------- */

/*
 * Footer markup is already the same as home.
 * Keep its normal dark-site treatment unchanged.
 */
.astricode-content-page footer {
  margin-top:
    0;
}

/* -------------------------------------------------
   RESPONSIVE
   ------------------------------------------------- */

@media (max-width: 900px) {

  .astricode-content-page
  .legal-page-main
  > .astricode-legal {
    width:
      min(100% - 32px, 1120px);
    padding:
      48px 36px 64px;
  }

}

@media (max-width: 760px) {

  .astricode-content-page
  .roadmap-page-grid {
    grid-template-columns:
      1fr;
  }

}

@media (max-width: 640px) {

  .astricode-content-page
  .legal-page-main {
    padding:
      28px 0 64px;
  }

  .astricode-content-page
  .legal-page-main
  > .astricode-legal {
    width:
      min(100% - 24px, 1120px);
    padding:
      30px 22px 44px;
    border-radius:
      18px;
  }

  .astricode-content-page
  .astricode-legal h1 {
    font-size:
      clamp(2.15rem, 11vw, 3.15rem);
  }

}

/* END ASTRICODE UNIFIED CONTENT PAGES 1.7.4 */

/* ASTRICODE ROADMAP NATURAL TEXT FLOW 1.7.7 */
.astricode-content-page .astricode-roadmap-page .info-lead {
  max-width: none;
}
/* END ASTRICODE ROADMAP NATURAL TEXT FLOW 1.7.7 */

/* ==========================================================
   Astricode Ops positioning · 1.7.8
   ========================================================== */

.home-roadmap-note {
  margin-top: 56px;
  padding: 30px 34px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 36px;
  border: 1px solid #d9deea;
  border-radius: 20px;
  background: #fff;
}

.home-roadmap-note > div {
  max-width: 760px;
}

.home-roadmap-note span {
  display: block;
  margin-bottom: 10px;
  color: #6657df;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .13em;
}

.home-roadmap-note strong {
  display: block;
  color: #111927;
  font-size: 24px;
  letter-spacing: -.025em;
}

.home-roadmap-note p {
  margin: 10px 0 0;
  color: #687386;
  line-height: 1.7;
}

.comparison-roadmap-note {
  max-width: 820px;
  margin: 48px auto 0;
  padding: 26px 30px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 18px;
  background: rgba(255,255,255,.045);
  text-align: center;
}

.comparison-roadmap-note strong {
  display: block;
  color: #f4f6fb;
  font-size: 19px;
}

.comparison-roadmap-note p {
  margin: 10px auto 0;
  color: #aab4c7;
  line-height: 1.7;
}

.comparison-roadmap-note a {
  display: inline-block;
  margin-top: 16px;
  color: #b9b0ff;
  font-weight: 750;
}

@media (max-width: 760px) {
  .home-roadmap-note {
    align-items: flex-start;
    flex-direction: column;
  }
}


/*
 * Astricode public glass sticky header.
 *
 * Preserve each page's existing top-of-page treatment, then transform
 * the global navigation into the same glass surface used by Account
 * after the visitor starts scrolling.
 */
header.site-header.astricode-sticky-header {
  position: fixed;
  transition:
    height .34s cubic-bezier(.2, .72, .2, 1),
    background-color .34s cubic-bezier(.2, .72, .2, 1),
    border-color .34s ease,
    box-shadow .34s ease,
    backdrop-filter .34s ease;
}

header.site-header.astricode-sticky-header .brand-logo {
  transform-origin: left center;
  transition:
    width .34s cubic-bezier(.2, .72, .2, 1),
    transform .34s cubic-bezier(.2, .72, .2, 1);
}

header.site-header.astricode-sticky-header .button-small {
  transition:
    min-height .34s cubic-bezier(.2, .72, .2, 1),
    padding .34s cubic-bezier(.2, .72, .2, 1),
    transform .2s ease,
    box-shadow .2s ease;
}

header.site-header.astricode-sticky-header.is-scrolled {
  background-color: rgba(7, 11, 20, .82);
  border-bottom-color: rgba(255, 255, 255, .11);
  box-shadow:
    0 14px 38px rgba(0, 0, 0, .22),
    0 1px 0 rgba(255, 255, 255, .025);
  backdrop-filter: blur(18px) saturate(145%);
  -webkit-backdrop-filter: blur(18px) saturate(145%);
}

@media (min-width: 861px) {
  header.site-header.astricode-sticky-header.is-scrolled {
    height: 72px;
  }

  header.site-header.astricode-sticky-header.is-scrolled .brand-logo {
    width: 168px;
  }

  header.site-header.astricode-sticky-header.is-scrolled .button-small {
    min-height: 38px;
    padding-left: 16px;
    padding-right: 16px;
  }
}

@media (max-width: 860px) {
  header.site-header.astricode-sticky-header {
    position: fixed;
  }
}

@media (prefers-reduced-motion: reduce) {
  header.site-header.astricode-sticky-header,
  header.site-header.astricode-sticky-header .brand-logo,
  header.site-header.astricode-sticky-header .button-small {
    transition: none;
  }
}