:root {
  color-scheme: dark;
  --bg: #05070c;
  --bg-soft: #090d16;
  --panel: rgba(13, 18, 30, 0.82);
  --panel-solid: #0c111c;
  --line: rgba(255, 255, 255, 0.11);
  --line-strong: rgba(255, 255, 255, 0.2);
  --text: #f5f8ff;
  --muted: #aab4c8;
  --dim: #7f8ba3;
  --blue: #3abdff;
  --blue-soft: rgba(58, 189, 255, 0.16);
  --mint: #60ffda;
  --purple: #ae57ff;
  --gold: #ffd36b;
  --radius: 24px;
  --shadow: 0 24px 80px rgba(0, 0, 0, 0.34);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
body.menuOpen { overflow: hidden; }
a { color: inherit; }
button, input, textarea, select { font: inherit; }
img, video { max-width: 100%; }
::selection { color: #001018; background: var(--mint); }

.skipLink {
  position: fixed;
  left: 16px;
  top: -80px;
  z-index: 100;
  padding: 12px 16px;
  border-radius: 12px;
  background: var(--text);
  color: var(--bg);
  font-weight: 800;
  transition: top 160ms ease;
}
.skipLink:focus { top: 16px; }

.shell { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }

.siteHeader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  gap: 28px;
  min-height: 76px;
  padding: 12px max(20px, calc((100vw - 1180px) / 2));
  border-bottom: 1px solid transparent;
  transition: background 180ms ease, border-color 180ms ease, backdrop-filter 180ms ease;
}
.siteHeader.scrolled {
  background: rgba(5, 7, 12, 0.82);
  border-color: var(--line);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-width: max-content;
  color: var(--text);
  text-decoration: none;
}
.brandMark {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(96, 255, 218, 0.46);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(58, 189, 255, 0.2), rgba(174, 87, 255, 0.16));
  box-shadow: inset 0 0 22px rgba(96, 255, 218, 0.08), 0 0 28px rgba(58, 189, 255, 0.12);
  color: var(--mint);
  font-weight: 900;
}
.brand strong, .brand small { display: block; }
.brand strong { font-size: 14px; letter-spacing: 0.04em; }
.brand small { margin-top: 2px; color: var(--dim); font-size: 10px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.desktopNav { display: flex; align-items: center; justify-content: center; gap: 6px; margin-inline: auto; }
.desktopNav a {
  padding: 10px 12px;
  border-radius: 999px;
  color: #c5cede;
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
  transition: color 150ms ease, background 150ms ease;
}
.desktopNav a:hover, .desktopNav a:focus-visible { color: #fff; background: rgba(255,255,255,0.07); }
.headerActions { display: flex; align-items: center; gap: 10px; }
.headerCta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid rgba(96,255,218,0.35);
  border-radius: 999px;
  background: rgba(96,255,218,0.08);
  color: #eafffa;
  text-decoration: none;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
}
.headerCta:hover, .headerCta:focus-visible { background: rgba(96,255,218,0.15); border-color: rgba(96,255,218,0.65); }
.menuButton {
  display: none;
  width: 44px;
  height: 44px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(255,255,255,0.05);
  cursor: pointer;
}
.menuButton span { display: block; width: 100%; height: 2px; margin: 4px 0; border-radius: 999px; background: #fff; }
.mobileBackdrop { position: fixed; inset: 0; z-index: 59; background: rgba(0,0,0,0.54); backdrop-filter: blur(8px); }
.mobileMenu {
  position: fixed;
  top: 12px;
  right: 12px;
  z-index: 60;
  width: min(380px, calc(100vw - 24px));
  max-height: calc(100vh - 24px);
  overflow: auto;
  padding: 18px;
  border: 1px solid var(--line-strong);
  border-radius: 24px;
  background: rgba(8, 12, 20, 0.96);
  box-shadow: var(--shadow);
}
.mobileMenuTop { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.mobileMenuTop p { margin: 0; color: var(--muted); font-size: 12px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
.menuClose { width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 999px; background: rgba(255,255,255,0.05); color: #fff; font-size: 24px; cursor: pointer; }
.mobileMenu nav { display: grid; gap: 8px; padding-top: 14px; }
.mobileMenu nav a { padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,0.035); color: #eef3ff; text-decoration: none; font-weight: 750; }

.hero {
  position: relative;
  display: grid;
  min-height: 100svh;
  overflow: hidden;
  background: #03050a;
}
.heroVideo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(0.92) contrast(1.08) brightness(0.68); transform: scale(1.035); }
.heroShade {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 72% 42%, rgba(58,189,255,0.10), transparent 33%),
    linear-gradient(90deg, rgba(3,5,10,0.96) 0%, rgba(3,5,10,0.82) 42%, rgba(3,5,10,0.44) 75%, rgba(3,5,10,0.7) 100%),
    linear-gradient(180deg, rgba(3,5,10,0.2), rgba(3,5,10,0.54) 72%, #05070c 100%);
}
.heroGrid {
  position: absolute;
  inset: 0;
  opacity: 0.16;
  background-image: linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,0.8), transparent 88%);
}
.heroContent {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(340px, 0.75fr);
  align-items: center;
  gap: clamp(48px, 7vw, 110px);
  padding-top: 132px;
  padding-bottom: 104px;
}
.heroCopy { max-width: 720px; }
.eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 18px; color: #b9c7dd; font-size: 11px; font-weight: 850; letter-spacing: 0.17em; text-transform: uppercase; }
.eyebrow span { width: 34px; height: 1px; background: linear-gradient(90deg, var(--mint), var(--blue)); box-shadow: 0 0 12px rgba(96,255,218,0.7); }
.hero h1 { max-width: 820px; margin: 0; font-size: clamp(3.25rem, 7vw, 6.7rem); line-height: 0.95; letter-spacing: -0.065em; text-wrap: balance; }
.heroLead { max-width: 680px; margin: 28px 0 0; color: #c7d0df; font-size: clamp(1rem, 1.7vw, 1.22rem); line-height: 1.7; }
.heroActions, .featureActions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 20px; border: 1px solid transparent; border-radius: 14px; text-decoration: none; font-size: 13px; font-weight: 850; letter-spacing: 0.025em; transition: transform 150ms ease, border-color 150ms ease, background 150ms ease, box-shadow 150ms ease; }
.button:hover { transform: translateY(-2px); }
.buttonPrimary { border-color: rgba(96,255,218,0.56); background: linear-gradient(135deg, rgba(58,189,255,0.22), rgba(96,255,218,0.17)); color: #f4fffc; box-shadow: 0 10px 34px rgba(58,189,255,0.13), inset 0 0 24px rgba(96,255,218,0.06); }
.buttonPrimary:hover, .buttonPrimary:focus-visible { border-color: rgba(96,255,218,0.95); box-shadow: 0 16px 42px rgba(58,189,255,0.22), inset 0 0 24px rgba(96,255,218,0.09); }
.buttonGhost { border-color: var(--line-strong); background: rgba(255,255,255,0.045); color: #edf2fb; }
.buttonGhost:hover, .buttonGhost:focus-visible { border-color: rgba(255,255,255,0.36); background: rgba(255,255,255,0.08); }
.buttonLarge { min-height: 56px; padding-inline: 26px; }
.heroNote { max-width: 660px; margin: 24px 0 0; padding-left: 14px; border-left: 2px solid rgba(96,255,218,0.45); color: #8390a7; font-size: 12px; line-height: 1.65; }
.statusPanel { align-self: center; padding: 18px; border: 1px solid var(--line); border-radius: 26px; background: rgba(8,12,21,0.65); box-shadow: var(--shadow); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.statusPanelHead { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 4px 4px 14px; }
.statusPanelHead p { margin: 0; font-size: 12px; font-weight: 850; letter-spacing: 0.1em; text-transform: uppercase; }
.statusPanelHead span { color: var(--dim); font-size: 10px; }
.statusRow { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; padding: 16px 14px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,0.035); color: inherit; text-decoration: none; }
.statusRow + .statusRow { margin-top: 10px; }
.statusRow:hover, .statusRow:focus-visible { border-color: rgba(96,255,218,0.38); background: rgba(255,255,255,0.065); }
.statusRow strong, .statusRow small { display: block; }
.statusRow strong { font-size: 13px; }
.statusRow small { margin-top: 3px; color: var(--muted); font-size: 10px; line-height: 1.35; }
.statusRow b { color: #cdd6e8; font-size: 11px; }
.statusDot { width: 9px; height: 9px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 16px rgba(255,211,107,0.65); }
.statusDotLive { background: var(--mint); box-shadow: 0 0 16px rgba(96,255,218,0.65); }
.statusRowBrowser { border-color: rgba(255,211,107,0.2); }
.scrollCue { position: absolute; left: 50%; bottom: 24px; z-index: 3; display: flex; align-items: center; gap: 10px; transform: translateX(-50%); color: #8f9bb0; text-decoration: none; font-size: 10px; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; }
.scrollCue span { width: 34px; height: 1px; background: rgba(255,255,255,0.32); }

.section { position: relative; padding: 110px 0; }
.sectionOperations { background: linear-gradient(180deg, #05070c, #07101a 52%, #05070c); }
.sectionOpen { overflow: hidden; background: radial-gradient(circle at 12% 25%, rgba(58,189,255,0.08), transparent 34%), radial-gradient(circle at 90% 75%, rgba(174,87,255,0.08), transparent 30%), #05070c; }
.sectionSpecialist { background: #080b12; }
.sectionPublic { background: linear-gradient(180deg, #080b12, #05070c); }
.sectionBoundaries { background: #05070c; }
.sectionHead { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr); align-items: end; gap: 52px; margin-bottom: 46px; }
.sectionHeadWide { grid-template-columns: minmax(0, 1.3fr) minmax(300px, 0.7fr); }
.section h2 { margin: 0; font-size: clamp(2.25rem, 5vw, 4.7rem); line-height: 1; letter-spacing: -0.052em; text-wrap: balance; }
.sectionHead > p, .boundaryIntro > p, .publicLayout > div > p, .ctaCard > div > p { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.75; }
.platformGrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.productCard { display: flex; flex-direction: column; min-height: 420px; padding: 28px; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(160deg, rgba(255,255,255,0.048), rgba(255,255,255,0.02)); box-shadow: 0 18px 52px rgba(0,0,0,0.16); }
.productCardFlagship { border-color: rgba(96,255,218,0.22); background: linear-gradient(160deg, rgba(96,255,218,0.06), rgba(58,189,255,0.035)); }
.productCardDocs { border-color: rgba(58,189,255,0.25); }
.cardTopline { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.tag { display: inline-flex; align-items: center; min-height: 26px; padding: 0 9px; border: 1px solid var(--line); border-radius: 999px; color: #b9c5d8; font-size: 9px; font-weight: 850; letter-spacing: 0.12em; text-transform: uppercase; }
.tagFlagship { color: var(--mint); border-color: rgba(96,255,218,0.25); background: rgba(96,255,218,0.06); }
.tagDocs { color: #8cdcff; border-color: rgba(58,189,255,0.26); background: rgba(58,189,255,0.06); }
.availability { color: var(--dim); font-size: 10px; font-weight: 750; }
.productCard h3 { margin: 34px 0 12px; font-size: 1.8rem; letter-spacing: -0.035em; }
.productCard > p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.featureList { margin: 24px 0 28px; padding: 0; list-style: none; }
.featureList li { position: relative; padding-left: 19px; color: #b9c3d3; font-size: 12px; line-height: 1.6; }
.featureList li + li { margin-top: 8px; }
.featureList li::before { content: ""; position: absolute; left: 0; top: 0.65em; width: 7px; height: 1px; background: var(--mint); box-shadow: 0 0 8px rgba(96,255,218,0.7); }
.cardLink { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: auto; padding-top: 18px; border-top: 1px solid var(--line); color: #eef7ff; text-decoration: none; font-size: 12px; font-weight: 850; }
.cardLink span { color: var(--mint); transition: transform 150ms ease; }
.cardLink:hover span { transform: translate(3px, -2px); }

.openGrid { display: grid; gap: 22px; }
.featureCard { position: relative; overflow: hidden; padding: clamp(28px, 5vw, 56px); border: 1px solid var(--line); border-radius: 32px; background: rgba(9,13,22,0.82); box-shadow: var(--shadow); }
.browserFeature { border-color: rgba(96,255,218,0.22); background: linear-gradient(145deg, rgba(58,189,255,0.065), rgba(174,87,255,0.045) 62%, rgba(9,13,22,0.9)); }
.pressFeature { border-color: rgba(58,189,255,0.18); }
.featureGlow { position: absolute; top: -240px; right: -140px; width: 520px; height: 520px; border-radius: 50%; background: radial-gradient(circle, rgba(96,255,218,0.14), rgba(58,189,255,0.06) 38%, transparent 70%); pointer-events: none; }
.featureHeader { position: relative; display: flex; align-items: flex-start; justify-content: space-between; gap: 32px; }
.featureKicker { margin: 0 0 10px; color: var(--mint); font-size: 11px; font-weight: 900; letter-spacing: 0.16em; text-transform: uppercase; }
.featureHeader h3 { max-width: 820px; margin: 0; font-size: clamp(2rem, 4.5vw, 4.2rem); line-height: 1.02; letter-spacing: -0.05em; }
.statusBadge { display: inline-flex; align-items: center; min-height: 34px; max-width: 250px; padding: 7px 12px; border: 1px solid; border-radius: 999px; font-size: 9px; font-weight: 900; letter-spacing: 0.1em; line-height: 1.3; text-align: center; text-transform: uppercase; }
.statusBadgeBuild { color: #ffe8a7; border-color: rgba(255,211,107,0.34); background: rgba(255,211,107,0.07); }
.statusBadgeLive { color: #cafff2; border-color: rgba(96,255,218,0.32); background: rgba(96,255,218,0.07); }
.featureIntro { position: relative; max-width: 940px; margin: 28px 0 0; color: #c4cedd; font-size: clamp(1rem, 1.8vw, 1.18rem); line-height: 1.75; }
.featureColumns { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 0.75fr); gap: 42px; margin-top: 34px; }
.featureColumns h4 { margin: 0 0 16px; font-size: 14px; letter-spacing: 0.02em; }
.featureListDense { margin: 0; }
.progressCard { align-self: start; padding: 22px; border: 1px solid var(--line); border-radius: 20px; background: rgba(0,0,0,0.18); }
.progressHead { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 10px; font-weight: 750; }
.progressHead strong { color: #fff; }
.progressTrack { height: 7px; margin: 16px 0; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,0.08); }
.progressTrack span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--blue), var(--mint)); box-shadow: 0 0 14px rgba(96,255,218,0.5); }
.progressCard p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.6; }
.boundaryCallout { position: relative; margin-top: 30px; padding: 17px 18px; border: 1px solid rgba(255,211,107,0.22); border-radius: 16px; background: rgba(255,211,107,0.045); color: #c7c1ae; font-size: 12px; line-height: 1.65; }
.boundaryCallout strong { color: #ffe9aa; }
.quietText { color: var(--dim); font-size: 10px; font-weight: 700; }
.pressHighlights { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 30px; }
.pressHighlights span { padding: 8px 11px; border: 1px solid var(--line); border-radius: 999px; background: rgba(255,255,255,0.035); color: #c3ccda; font-size: 10px; font-weight: 750; }
.pressColumns { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.pressColumns > div { padding: 20px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,0.025); }
.pressColumns p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.themeRoadmap { position: relative; margin-top: 30px; padding: clamp(22px, 4vw, 32px); border: 1px solid rgba(174,87,255,0.2); border-radius: 24px; background: linear-gradient(145deg, rgba(174,87,255,0.055), rgba(58,189,255,0.035)); }
.themeRoadmapHead { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.themeRoadmapKicker { margin: 0 0 9px; color: #d8bcff; font-size: 10px; font-weight: 900; letter-spacing: 0.14em; text-transform: uppercase; }
.themeRoadmap h4 { max-width: 760px; margin: 0; font-size: clamp(1.45rem, 3vw, 2.25rem); line-height: 1.12; letter-spacing: -0.035em; }
.statusBadgePlan { flex: 0 0 auto; color: #e8d7ff; border-color: rgba(174,87,255,0.34); background: rgba(174,87,255,0.08); }
.themeRoadmapIntro { max-width: 920px; margin: 20px 0 0; color: #b9c5d7; font-size: 12px; line-height: 1.7; }
.themeCapabilityGrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 22px; }
.themeCapabilityGrid article { min-height: 150px; padding: 17px; border: 1px solid var(--line); border-radius: 16px; background: rgba(5,7,12,0.34); }
.themeCapabilityGrid article > span { display: block; color: #b894ed; font-size: 9px; font-weight: 900; letter-spacing: 0.12em; }
.themeCapabilityGrid strong, .themeCapabilityGrid small { display: block; }
.themeCapabilityGrid strong { margin-top: 24px; font-size: 13px; }
.themeCapabilityGrid small { margin-top: 7px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.themeBoundary { display: grid; grid-template-columns: auto 1fr; gap: 12px; margin-top: 14px; padding: 15px 17px; border: 1px solid rgba(96,255,218,0.16); border-radius: 15px; background: rgba(96,255,218,0.035); color: #aeb9ca; font-size: 11px; line-height: 1.65; }
.themeBoundary strong { color: #cafff2; white-space: nowrap; }
.themeRoadmapNote { margin: 14px 0 0; color: var(--dim); font-size: 10px; font-weight: 700; line-height: 1.6; }
.textLink { color: #bfeee3; text-decoration: none; font-size: 12px; font-weight: 800; }
.textLink:hover { color: #fff; }

.compactGrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.compactCard { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px; min-height: 112px; padding: 18px; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,255,255,0.03); color: inherit; text-decoration: none; }
.compactCard:hover, .compactCard:focus-visible { border-color: rgba(96,255,218,0.32); background: rgba(255,255,255,0.055); }
.compactIcon { display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid rgba(58,189,255,0.25); border-radius: 15px; background: rgba(58,189,255,0.06); color: #9be2ff; font-size: 11px; font-weight: 900; }
.compactCard strong, .compactCard small { display: block; }
.compactCard strong { font-size: 14px; }
.compactCard small { margin-top: 5px; color: var(--muted); font-size: 11px; line-height: 1.45; }
.compactCard b { color: var(--mint); }
.publicLayout { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 72px; align-items: start; }
.publicLayout h2 { margin-bottom: 24px; }
.publicLinks { display: grid; gap: 10px; }
.publicLinks a { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,0.028); color: inherit; text-decoration: none; }
.publicLinks a:hover, .publicLinks a:focus-visible { border-color: rgba(255,255,255,0.24); background: rgba(255,255,255,0.05); }
.publicLinks strong, .publicLinks small { display: block; }
.publicLinks strong { font-size: 14px; }
.publicLinks small { margin-top: 4px; color: var(--muted); font-size: 11px; }
.publicLinks b { color: var(--mint); }
.boundariesLayout { display: grid; grid-template-columns: minmax(0, 0.72fr) minmax(0, 1.28fr); gap: 72px; }
.boundaryIntro { position: sticky; top: 112px; align-self: start; }
.boundaryIntro h2 { margin-bottom: 24px; }
.boundaryGrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.boundaryGrid article { min-height: 240px; padding: 24px; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,255,255,0.025); }
.boundaryGrid article > span { color: var(--mint); font-size: 10px; font-weight: 900; letter-spacing: 0.12em; }
.boundaryGrid h3 { margin: 42px 0 12px; font-size: 1.2rem; }
.boundaryGrid p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.ctaSection { padding: 40px 0 110px; background: #05070c; }
.ctaCard { display: flex; align-items: center; justify-content: space-between; gap: 48px; padding: clamp(28px, 5vw, 54px); border: 1px solid rgba(96,255,218,0.2); border-radius: 30px; background: linear-gradient(135deg, rgba(58,189,255,0.07), rgba(174,87,255,0.045)); }
.ctaCard h2 { max-width: 800px; margin: 0 0 18px; font-size: clamp(2rem, 4vw, 3.7rem); line-height: 1.04; letter-spacing: -0.045em; }

.siteFooter { padding: 70px 0 26px; border-top: 1px solid var(--line); background: #03050a; }
.footerGrid { display: grid; grid-template-columns: 1.5fr repeat(3, 0.75fr); gap: 42px; }
.footerBrand p { max-width: 300px; margin: 18px 0 0; color: var(--dim); font-size: 12px; line-height: 1.6; }
.footerGrid h2 { margin: 0 0 16px; color: #e9eef7; font-size: 11px; letter-spacing: 0.13em; text-transform: uppercase; }
.footerGrid > div:not(.footerBrand) a { display: block; color: #9ca8ba; text-decoration: none; font-size: 12px; line-height: 2.05; }
.footerGrid > div:not(.footerBrand) a:hover { color: #fff; }
.footerBottom { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 52px; padding-top: 20px; border-top: 1px solid var(--line); color: #687489; font-size: 10px; }
.footerBottom p { margin: 0; }

.page { min-height: 100vh; background: radial-gradient(circle at 80% 10%, rgba(58,189,255,0.07), transparent 32%), var(--bg); color: var(--text); }
.page .miniTopbar { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; gap: 8px; overflow-x: auto; padding: 14px max(20px, calc((100vw - 960px) / 2)); border-bottom: 1px solid var(--line); background: rgba(5,7,12,0.88); backdrop-filter: blur(16px); white-space: nowrap; }
.page .miniTopbar a { color: #c8d2e2; text-decoration: none; font-size: 11px; font-weight: 750; }
.page .miniTopbar span { color: #536079; }
.page main { width: min(900px, calc(100% - 40px)); margin: 0 auto; padding: 82px 0 100px; }
.page h1 { margin: 0 0 16px; font-size: clamp(2.6rem, 6vw, 5rem); line-height: 1; letter-spacing: -0.055em; }
.page .effective { margin: 0 0 42px; color: var(--dim); font-size: 12px; font-weight: 750; }
.page h2 { margin: 42px 0 12px; font-size: 1.25rem; }
.page p, .page li { color: #b8c2d2; font-size: 14px; line-height: 1.75; }
.page a { color: #bcfff0; }
.page .notice { margin: 28px 0; padding: 18px; border: 1px solid rgba(96,255,218,0.2); border-radius: 16px; background: rgba(96,255,218,0.04); }

.easterPixel { position: fixed; left: 8px; bottom: 8px; z-index: 70; width: 4px; height: 4px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,0.18); opacity: 0.1; }
.easterPixel:hover, .easterPixel:focus-visible { opacity: 1; outline: none; }
.easterEgg { position: fixed; left: 14px; bottom: 26px; z-index: 69; width: min(620px, calc(100vw - 28px)); opacity: 0; transform: translateY(10px) scale(0.985); pointer-events: none; transition: opacity 180ms ease, transform 180ms ease; }
.easterEgg img { display: block; width: 100%; height: auto; border-radius: 18px; box-shadow: 0 30px 90px rgba(0,0,0,0.62); }
.easterPixel:hover + .easterEgg, .easterPixel:focus-visible + .easterEgg, .easterEgg:hover { opacity: 1; transform: translateY(0) scale(1); }

:focus-visible { outline: 2px solid var(--mint); outline-offset: 3px; }

@media (max-width: 980px) {
  .desktopNav { display: none; }
  .headerActions { margin-left: auto; }
  .menuButton { display: block; }
  .heroContent { grid-template-columns: 1fr; gap: 44px; padding-top: 138px; }
  .heroCopy { max-width: 820px; }
  .statusPanel { max-width: 620px; }
  .platformGrid { grid-template-columns: 1fr; }
  .productCard { min-height: auto; }
  .featureHeader { display: grid; }
  .statusBadge { justify-self: start; }
  .featureColumns { grid-template-columns: 1fr; }
  .themeCapabilityGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sectionHead, .sectionHeadWide, .publicLayout, .boundariesLayout { grid-template-columns: 1fr; gap: 28px; }
  .boundaryIntro { position: static; }
  .footerGrid { grid-template-columns: 1.3fr repeat(3, 1fr); gap: 28px; }
}

@media (max-width: 720px) {
  .shell { width: min(100% - 28px, 1180px); }
  .siteHeader { min-height: 68px; padding: 10px 14px; }
  .brandMark { width: 38px; height: 38px; }
  .headerCta { display: none; }
  .heroContent { padding-top: 116px; padding-bottom: 96px; }
  .hero h1 { font-size: clamp(3rem, 15vw, 5.2rem); }
  .statusPanel { padding: 12px; }
  .statusPanelHead { display: grid; }
  .statusRow { grid-template-columns: auto 1fr; }
  .statusRow b { grid-column: 2; }
  .scrollCue { display: none; }
  .section { padding: 82px 0; }
  .section h2 { font-size: clamp(2.25rem, 11vw, 3.65rem); }
  .featureCard { padding: 24px 20px; border-radius: 24px; }
  .featureHeader h3 { font-size: clamp(2rem, 10vw, 3.2rem); }
  .themeRoadmapHead { display: grid; }
  .themeCapabilityGrid { grid-template-columns: 1fr; }
  .themeBoundary { grid-template-columns: 1fr; }
  .themeBoundary strong { white-space: normal; }
  .pressColumns, .compactGrid, .boundaryGrid { grid-template-columns: 1fr; }
  .compactCard { min-height: 96px; }
  .ctaCard { display: grid; }
  .footerGrid { grid-template-columns: 1fr 1fr; }
  .footerBrand { grid-column: 1 / -1; }
  .footerBottom { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 460px) {
  .heroActions, .featureActions { align-items: stretch; flex-direction: column; }
  .button { width: 100%; }
  .featureHeader { gap: 18px; }
  .featureColumns { gap: 24px; }
  .quietText { text-align: center; }
  .footerGrid { grid-template-columns: 1fr; }
  .footerBrand { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; }
  .heroVideo { display: none; }
  .hero { background: radial-gradient(circle at 70% 30%, #0b2030, #05070c 58%); }
}

/* PASS 2: canonical resources */
.resourceGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 820px) { .resourceGrid { grid-template-columns: 1fr; } }

/* PASS 3–4: status and architecture */
.statusMatrix{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.statusMatrix article,.architectureCards article{padding:1.25rem;border:1px solid rgba(107,234,255,.2);background:rgba(8,16,28,.72);border-radius:18px}.statusMatrix h3,.architectureCards h3{margin:.65rem 0 .45rem}.statusMatrix p,.architectureCards p{color:var(--muted);margin:0}.statusBadge{display:inline-flex;padding:.3rem .58rem;border-radius:999px;font-size:.73rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;border:1px solid currentColor}.statusLive{color:#85ffd1}.statusOpen{color:#8bd8ff}.statusDev{color:#ffd18b}.statusPreview{color:#d7b8ff}.statusJsonLink{margin-top:1rem}.splitArchitecture{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:2rem;align-items:start}.architectureCards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.architectureCards a{display:inline-block;margin-top:.85rem}.menuOpen{overflow:hidden}@media(max-width:900px){.statusMatrix{grid-template-columns:repeat(2,minmax(0,1fr))}.splitArchitecture{grid-template-columns:1fr}}@media(max-width:620px){.statusMatrix,.architectureCards{grid-template-columns:1fr}}

/* PASS 5-8 canonical knowledge base */
.kbBody{min-height:100vh;background:radial-gradient(circle at 10% 0,rgba(58,189,255,.12),transparent 28rem),var(--bg)}.kbTop{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:14px max(20px,calc((100% - 1120px)/2));border-bottom:1px solid var(--line);background:rgba(5,7,12,.9);backdrop-filter:blur(18px)}.kbTop a{text-decoration:none}.kbBrand{font-weight:900}.kbBrand small{display:block;color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.11em}.kbNav{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:flex-end}.kbNav a{padding:.55rem .7rem;border:1px solid transparent;border-radius:999px;color:var(--muted);font-weight:750;font-size:.82rem}.kbNav a:hover,.kbNav a:focus-visible,.kbNav a[aria-current=page]{color:var(--text);border-color:var(--line);background:rgba(96,255,218,.07)}.kbMain{width:min(1120px,calc(100% - 32px));margin:auto;padding:clamp(3rem,7vw,6rem) 0}.kbHero{max-width:900px}.kbHero h1{font-size:clamp(2.7rem,7vw,5.8rem);line-height:.92;letter-spacing:-.065em;margin:.7rem 0 1rem}.kbHero p{font-size:1.12rem;color:var(--muted);max-width:72ch}.kbStatus{display:inline-flex;padding:.42rem .65rem;border:1px solid rgba(96,255,218,.35);border-radius:999px;color:var(--mint);font-size:.74rem;font-weight:900;text-transform:uppercase;letter-spacing:.11em}.kbGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:2rem}.kbCard,.kbPanel{padding:1.25rem;border:1px solid var(--line);border-radius:22px;background:linear-gradient(150deg,rgba(13,18,30,.9),rgba(8,12,20,.82));box-shadow:var(--shadow)}.kbCard h2,.kbPanel h2{margin:.3rem 0 .7rem;font-size:1.4rem}.kbCard p,.kbPanel p,.kbPanel li{color:var(--muted)}.kbCard a{display:inline-block;margin-top:.7rem;color:var(--mint);font-weight:850}.kbPanel{margin-top:1rem}.kbTable{width:100%;border-collapse:collapse}.kbTable th,.kbTable td{text-align:left;padding:.85rem;border-bottom:1px solid var(--line);vertical-align:top}.kbTable th{color:var(--text)}.kbTable td{color:var(--muted)}.kbNotice{padding:1rem;border-left:3px solid var(--gold);background:rgba(255,211,107,.07);border-radius:0 16px 16px 0;color:var(--muted)}.kbFooter{width:min(1120px,calc(100% - 32px));margin:auto;padding:2rem 0 3rem;border-top:1px solid var(--line);color:var(--muted);display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}.kbFooter a{color:var(--text)}@media(max-width:850px){.kbTop{align-items:flex-start}.kbNav{display:none}.kbGrid{grid-template-columns:1fr 1fr}}@media(max-width:560px){.kbGrid{grid-template-columns:1fr}.kbHero h1{font-size:3rem}.kbTable{display:block;overflow-x:auto}}@media print{.kbTop,.kbFooter{display:none}.kbBody{background:#fff;color:#111}.kbMain{width:100%;padding:0}.kbCard,.kbPanel{box-shadow:none;background:#fff;color:#111}.kbCard p,.kbPanel p,.kbPanel li,.kbTable td{color:#222}}

.releaseTruth{margin:0;padding:.78rem clamp(1rem,4vw,3rem);border-bottom:1px solid rgba(91,225,255,.2);background:rgba(2,8,20,.9);color:#bdd0df;font-size:.9rem}.releaseTruth strong{color:#fff}.releaseTruth a{margin-left:.35rem}.ecosystemDiagram{display:grid;gap:1rem}.diagramGroup{border:1px solid rgba(76,222,255,.24);border-radius:18px;padding:1.3rem;background:linear-gradient(145deg,rgba(8,24,45,.96),rgba(3,11,24,.92))}.diagramChildren{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin:1rem 0}.diagramChildren a{display:flex;flex-direction:column;gap:.35rem;padding:1rem;border:1px solid rgba(117,247,255,.2);border-radius:14px;background:rgba(255,255,255,.025);text-decoration:none}.diagramChildren span{color:#abc1d1;font-size:.88rem}.resourceCard{display:flex}.resourceIcon{font-size:1.3rem}@media(max-width:720px){.diagramChildren{grid-template-columns:1fr}.releaseTruth{font-size:.82rem}}@media print{.releaseTruth{background:#fff;color:#111;border:1px solid #999}.diagramChildren{display:block}.diagramChildren a,.diagramGroup{display:block;break-inside:avoid;margin-bottom:.7rem;background:#fff;color:#111}}

/* PASS15-20 CSP, media, contrast, and table contracts */
.progress-native-38{width:86.36%}.kb-table-scroll{overflow-x:auto}
@media(prefers-contrast:more){:root{--line:rgba(151,255,238,.48);--muted:#d1dee7}.featureCard,.resourceCard,.kbCard,.kbPanel,.diagramGroup{border-width:2px}}
@media(forced-colors:active){.button,.menuButton,.menuClose,.featureCard,.resourceCard,.kbCard,.kbPanel,.diagramGroup{border:1px solid CanvasText}.heroVideo{display:none}.statusBadge{forced-color-adjust:auto}}
