@font-face {
  font-family: "IBM Plex Sans";
  src: url("./assets/fonts/ibm-plex-sans-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 700;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans";
  src: url("./assets/fonts/ibm-plex-sans-latin-ext.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 700;
  font-display: swap;
  unicode-range: U+0100-024F, U+1E00-1EFF;
}

@font-face {
  font-family: "Mona Sans";
  src: url("./assets/fonts/mona-sans-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
}

@font-face {
  font-family: "Mona Sans";
  src: url("./assets/fonts/mona-sans-latin-ext.woff2") format("woff2");
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  unicode-range: U+0100-024F, U+1E00-1EFF;
}

:root {
  color-scheme: dark;
  --bg: #090b0c;
  --bg-soft: #101413;
  --surface: #121716;
  --surface-2: #181c1b;
  --paper: #f4f4ee;
  --text: #edeee8;
  --muted: #a1a7a4;
  --quiet: #69716f;
  --line: #303534;
  --line-soft: rgba(235, 239, 235, 0.12);
  --steel: #9da9aa;
  --cyan: #83bdc6;
  --amber: #d2ad68;
  --ui-blue: #38bdf8;
  --ui-green: #38d98a;
  --ui-purple: #a78bfa;
  --ui-red: #fb7185;
  --header-height: 68px;
  --page-flow: 0%;
  font-family: "Mona Sans", Arial, "Helvetica Neue", Helvetica, system-ui, sans-serif;
  font-synthesis: none;
}

* {
  box-sizing: border-box;
  letter-spacing: 0;
}

html {
  scroll-behavior: smooth;
  scroll-snap-type: y proximity;
  background: var(--bg);
}

body {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  isolation: isolate;
  background: var(--bg);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
}

body::before {
  position: fixed;
  z-index: -2;
  inset: 0;
  background:
    linear-gradient(
      160deg,
      #090b0c 0%,
      #111716 20%,
      #101519 42%,
      #171711 64%,
      #0d1413 82%,
      #090a0c 100%
    );
  background-position: 50% var(--page-flow);
  background-size: 100% 420%;
  content: "";
  will-change: background-position;
}

body::after {
  position: fixed;
  z-index: -1;
  inset: 0;
  opacity: 0.17;
  background-image:
    linear-gradient(rgba(243, 244, 238, 0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(243, 244, 238, 0.025) 1px, transparent 1px);
  background-size: 64px 64px;
  content: "";
  mask-image: linear-gradient(to bottom, transparent, #000 18%, #000 82%, transparent);
  pointer-events: none;
}

body.is-loading,
body.modal-open {
  overflow: hidden;
}

button,
input,
textarea,
select {
  font: inherit;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

button {
  color: inherit;
}

a {
  color: inherit;
}

img {
  display: block;
  max-width: 100%;
}

.skip-link {
  position: fixed;
  z-index: 300;
  left: 16px;
  top: -80px;
  padding: 10px 14px;
  background: var(--paper);
  color: #111;
}

.skip-link:focus {
  top: 12px;
}

.boot-intro {
  position: fixed;
  z-index: 250;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #07090c;
  transition: opacity 500ms ease, visibility 500ms ease;
}

.boot-intro::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0.42;
  background-image:
    linear-gradient(rgba(121, 206, 224, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(121, 206, 224, 0.055) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(to bottom, transparent 4%, #000 42%, transparent 96%);
}

.boot-intro.is-done {
  opacity: 0;
  visibility: hidden;
}

.boot-stage {
  position: relative;
  display: grid;
  width: min(820px, 86vw);
  min-height: 240px;
  place-items: center;
  animation: boot-stage-arrive 2100ms cubic-bezier(0.16, 0.78, 0.2, 1) both;
}

.boot-wordmark {
  position: relative;
  z-index: 2;
  color: rgba(242, 245, 242, 0.035);
  font-size: clamp(68px, 12vw, 156px);
  font-weight: 700;
  line-height: 0.9;
  white-space: nowrap;
  -webkit-text-stroke: 1px rgba(203, 220, 224, 0.92);
  text-shadow:
    0 0 10px rgba(199, 229, 235, 0.32),
    0 0 38px rgba(121, 206, 224, 0.18),
    0 0 92px rgba(121, 206, 224, 0.08);
  animation: boot-wordmark-breathe 1450ms ease-in-out infinite alternate;
}

.boot-wordmark::before,
.boot-wordmark::after {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  color: transparent;
  pointer-events: none;
}

.boot-wordmark::before {
  -webkit-text-stroke: 7px rgba(121, 206, 224, 0.045);
  filter: blur(5px);
}

.boot-wordmark::after {
  clip-path: inset(0 100% 0 0);
  -webkit-text-stroke: 1px rgba(255, 255, 255, 0.96);
  text-shadow: 0 0 16px rgba(210, 241, 246, 0.68);
  animation: boot-wordmark-draw 1800ms 120ms cubic-bezier(0.2, 0.7, 0.2, 1) both;
}

.boot-wordmark-pulse {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(700px, 76vw);
  height: 1px;
  overflow: hidden;
  background: linear-gradient(90deg, transparent, rgba(121, 206, 224, 0.55), transparent);
  box-shadow: 0 0 26px rgba(121, 206, 224, 0.24);
  transform: translate(-50%, 70px);
}

.boot-wordmark-pulse::after {
  content: "";
  position: absolute;
  inset: -1px auto -1px 0;
  width: 18%;
  background: #effffd;
  box-shadow: 0 0 20px rgba(216, 247, 249, 0.85);
  animation: boot-wordmark-pulse 1250ms ease-in-out infinite;
}

.boot-copy {
  position: absolute;
  left: 50%;
  bottom: 7vh;
  width: min(560px, 82vw);
  transform: translateX(-50%);
}

.boot-copy span,
.boot-copy strong {
  display: block;
}

.boot-copy span {
  color: var(--cyan);
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 10px;
}

.boot-copy strong {
  margin-top: 7px;
  font-size: 18px;
  font-weight: 500;
}

.boot-copy i {
  position: relative;
  display: block;
  height: 2px;
  margin-top: 17px;
  overflow: hidden;
  background: #20272a;
}

.boot-copy i::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, var(--cyan), var(--paper));
  transform: translateX(-100%);
  animation: boot-progress 1900ms ease both;
}

@keyframes boot-stage-arrive {
  0% { opacity: 0; transform: scale(0.86); }
  38% { opacity: 1; }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes boot-wordmark-breathe {
  to {
    -webkit-text-stroke-color: rgba(230, 242, 242, 1);
    text-shadow:
      0 0 14px rgba(222, 245, 247, 0.46),
      0 0 48px rgba(121, 206, 224, 0.26),
      0 0 120px rgba(121, 206, 224, 0.12);
  }
}

@keyframes boot-wordmark-draw {
  to { clip-path: inset(0 0 0 0); }
}

@keyframes boot-wordmark-pulse {
  0% { transform: translateX(-115%); opacity: 0; }
  24%, 72% { opacity: 1; }
  100% { transform: translateX(650%); opacity: 0; }
}

@keyframes boot-progress {
  to { transform: translateX(0); }
}

.site-header {
  position: fixed;
  z-index: 100;
  left: 16px;
  right: 16px;
  top: 14px;
  display: flex;
  min-height: var(--header-height);
  align-items: center;
  justify-content: space-between;
  padding: 0 12px 0 16px;
  border: 1px solid rgba(236, 238, 234, 0.16);
  background: rgba(8, 10, 13, 0.72);
  backdrop-filter: blur(18px);
  transition: background 220ms ease, border-color 220ms ease;
}

.site-header.is-scrolled {
  border-color: rgba(236, 238, 234, 0.24);
  background: rgba(8, 10, 13, 0.92);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  text-decoration: none;
}

.brand-mark {
  position: relative;
  display: grid;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  place-items: center;
}

.brand-mark svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  shape-rendering: geometricPrecision;
}

.brand-facet {
  stroke: rgba(255, 255, 255, 0.34);
  stroke-width: 0.5px;
  vector-effect: non-scaling-stroke;
  transform-box: fill-box;
  transform-origin: center;
  transition: transform 420ms cubic-bezier(0.16, 1, 0.3, 1), opacity 220ms ease;
}

.brand-facet-a {
  fill: url("#brand-facet-a-gradient");
}

.brand-facet-b {
  fill: url("#brand-facet-b-gradient");
}

.brand-facet-c {
  fill: url("#brand-facet-c-gradient");
}

.brand-aperture {
  fill: #0b0e0e;
  stroke: var(--amber);
  stroke-width: 1.2px;
  vector-effect: non-scaling-stroke;
  transition: fill 220ms ease, transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
  transform-box: fill-box;
  transform-origin: center;
}

.brand:hover .brand-facet-a {
  transform: translate(-1px, -1px) rotate(-2deg);
}

.brand:hover .brand-facet-b {
  transform: translate(1px, -1px) rotate(2deg);
}

.brand:hover .brand-facet-c {
  transform: translateY(1.5px);
}

.brand:hover .brand-aperture {
  fill: var(--amber);
  transform: scale(0.78);
}

.brand > span:last-child {
  display: grid;
}

.brand strong {
  font-size: 14px;
}

.brand small {
  margin-top: 2px;
  color: #8b9697;
  font-size: 9px;
  text-transform: uppercase;
}

.site-nav {
  display: flex;
  align-items: center;
  gap: clamp(14px, 1.55vw, 30px);
}

.site-nav a {
  color: #b7bdbb;
  font-size: 12px;
  text-decoration: none;
  transition: color 180ms ease;
}

.site-nav a:hover {
  color: var(--paper);
}

.site-nav .header-cta {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  padding: 0 18px;
  background: var(--paper);
  color: #111416;
  font-weight: 700;
}

.language-switcher {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.language-switcher::after {
  position: absolute;
  right: 9px;
  width: 5px;
  height: 5px;
  border-right: 1px solid #8f9a99;
  border-bottom: 1px solid #8f9a99;
  content: "";
  pointer-events: none;
  transform: translateY(-2px) rotate(45deg);
}

.language-switcher select {
  min-width: 94px;
  height: 34px;
  padding: 0 24px 0 9px;
  border: 1px solid #3a4445;
  border-radius: 0;
  appearance: none;
  background: #111517;
  color: #d8ddda;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 9px;
  letter-spacing: 0;
  outline: none;
  cursor: pointer;
}

.language-switcher select:hover,
.language-switcher select:focus-visible {
  border-color: var(--cyan);
  color: var(--paper);
}

.language-switcher option {
  background: #111517;
  color: var(--paper);
}

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.nav-toggle {
  display: none;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid var(--line);
  background: transparent;
}

.nav-toggle span {
  display: block;
  width: 18px;
  height: 1px;
  background: var(--paper);
}

.nav-toggle span + span {
  margin-top: 5px;
}

.deck-nav {
  position: fixed;
  z-index: 80;
  right: 18px;
  top: 50%;
  display: grid;
  gap: 11px;
  transform: translateY(-50%);
}

.deck-nav a {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 9px;
  color: #7b8585;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 9px;
  text-decoration: none;
}

.deck-nav i {
  width: 18px;
  height: 2px;
  background: #3a4243;
  transition: width 180ms ease, background 180ms ease;
}

.deck-nav span {
  position: absolute;
  right: 30px;
  opacity: 0;
  white-space: nowrap;
  transform: translateX(6px);
  transition: opacity 180ms ease, transform 180ms ease;
}

.deck-nav a:hover span,
.deck-nav a:focus-visible span {
  opacity: 1;
  transform: none;
}

.deck-nav a.is-active {
  color: var(--paper);
}

.deck-nav a.is-active i {
  width: 30px;
  background: var(--amber);
}

.deck-slide {
  position: relative;
  min-height: 100svh;
  overflow: hidden;
  scroll-margin-top: 86px;
  scroll-snap-align: start;
  scroll-snap-stop: normal;
  border-bottom: 1px solid var(--line-soft);
}

.eyebrow {
  margin: 0 0 20px;
  color: var(--cyan);
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 10px;
  text-transform: uppercase;
}

.button {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 0 18px;
  border: 1px solid transparent;
  border-radius: 2px;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition: background 180ms ease, color 180ms ease, border-color 180ms ease;
}

.button-primary {
  background: var(--paper);
  color: #111416;
}

.button-primary:hover {
  background: var(--amber);
}

.button-secondary {
  border-color: #465052;
  background: rgba(9, 11, 14, 0.4);
  color: var(--paper);
}

.button-secondary:hover {
  border-color: var(--paper);
}

.hero {
  display: grid;
  min-height: 100svh;
  align-items: center;
  padding: 120px 7vw 72px;
  isolation: isolate;
}

.hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(90deg, rgba(9, 11, 14, 0.98) 0%, rgba(9, 11, 14, 0.82) 38%, rgba(9, 11, 14, 0.12) 78%, rgba(9, 11, 14, 0.58) 100%);
}

.hero-copy {
  position: relative;
  z-index: 5;
  width: min(670px, 52vw);
}

.hero h1 {
  margin: 0;
  color: var(--paper);
  font-size: 82px;
  font-weight: 700;
  line-height: 0.92;
}

.hero-statement {
  margin: 30px 0 0;
  color: var(--paper);
  font-size: 35px;
  font-weight: 400;
  line-height: 1.08;
}

.hero-lead {
  max-width: 610px;
  margin: 24px 0 0;
  color: #b0b7b5;
  font-size: 16px;
  line-height: 1.55;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 32px;
}

.hero-principles {
  position: absolute;
  z-index: 5;
  left: 7vw;
  right: 7vw;
  bottom: 28px;
  display: grid;
  max-width: 880px;
  margin: 0;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--line-soft);
}

.hero-principles div {
  padding: 14px 28px 0 0;
}

.hero-principles dt {
  color: var(--paper);
  font-size: 11px;
  font-weight: 700;
}

.hero-principles dd {
  margin: 5px 0 0;
  color: #778181;
  font-size: 11px;
}

.hero-world {
  position: absolute;
  z-index: -2;
  inset: 0;
  overflow: hidden;
  perspective: 1800px;
}

.hero-grid {
  position: absolute;
  inset: 32% -10% -30%;
  background-image:
    linear-gradient(rgba(121, 206, 224, 0.09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(121, 206, 224, 0.09) 1px, transparent 1px);
  background-size: 46px 46px;
  transform: rotateX(62deg) translateY(18%);
  mask-image: linear-gradient(to bottom, transparent, #000 18%, transparent 88%);
}

.hero-sheet {
  position: absolute;
  right: 3vw;
  top: 14vh;
  width: min(960px, 60vw);
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border: 1px solid rgba(156, 176, 183, 0.28);
  background: #eef1ed;
  transform-style: preserve-3d;
}

.hero-sheet img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero-sheet-shadow {
  opacity: 0.18;
  filter: grayscale(1) invert(1);
  transform: translate3d(-30px, 54px, -80px) rotateX(3deg) rotateY(-9deg);
}

.hero-sheet-main {
  transform: translate3d(0, 0, 30px) rotateX(2deg) rotateY(-8deg);
  box-shadow: -60px 80px 140px rgba(0, 0, 0, 0.48);
  animation: hero-sheet-breathe 9s ease-in-out infinite alternate;
}

.hero-inspection-plane {
  position: absolute;
  z-index: 4;
  left: 10%;
  top: 58%;
  width: 20%;
  aspect-ratio: 1.48;
  border: 1px solid var(--cyan);
  background: rgba(121, 206, 224, 0.08);
  box-shadow: 0 0 42px rgba(121, 206, 224, 0.12);
  transform: translateZ(4px);
  animation: hero-aperture 8s ease-in-out infinite alternate;
}

.hero-inspection-plane span {
  position: absolute;
  left: 0;
  top: 6px;
  padding: 2px 4px;
  background: rgba(8, 12, 14, 0.78);
  color: var(--cyan);
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 8px;
}

.hero-inspection-plane i {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 8px;
  height: 8px;
  border: 1px solid var(--amber);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

.hero-scan {
  position: absolute;
  z-index: 6;
  right: 0;
  top: 28%;
  width: 66%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--cyan), transparent);
  opacity: 0.4;
  animation: hero-scan 7s ease-in-out infinite;
}

.hero-coordinate {
  position: absolute;
  color: rgba(156, 176, 183, 0.58);
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 8px;
}

.coordinate-x {
  right: 3vw;
  bottom: 9vh;
}

.coordinate-y {
  right: 2vw;
  top: 19vh;
  writing-mode: vertical-rl;
}

@keyframes hero-sheet-breathe {
  to { transform: translate3d(-15px, 8px, 55px) rotateX(0) rotateY(-5deg); }
}

@keyframes hero-aperture {
  to { left: 68%; top: 24%; }
}

@keyframes hero-scan {
  0%, 100% { transform: translateY(-120px); opacity: 0; }
  18%, 82% { opacity: 0.45; }
  50% { transform: translateY(430px); }
}

.product-slide {
  display: grid;
  min-height: 100svh;
  padding: 88px 4vw 18px;
  grid-template-rows: auto minmax(0, 1fr);
  background: #0b0e12;
}

.slide-heading {
  position: relative;
  z-index: 4;
}

.product-heading {
  display: grid;
  width: min(1540px, 100%);
  margin: 0 auto 12px;
  align-items: end;
  grid-template-columns: minmax(0, 1fr) minmax(330px, 0.62fr);
  gap: 48px;
}

.product-heading .eyebrow {
  margin-bottom: 7px;
}

.product-heading h2,
.scope-copy h2,
.evidence-heading h2,
.security-copy h2,
.demo-copy h2 {
  margin: 0;
  color: var(--paper);
  font-size: 42px;
  font-weight: 600;
  line-height: 1.02;
}

.scene-copy {
  padding-left: 22px;
  border-left: 1px solid var(--line);
}

.scene-copy strong {
  display: block;
  color: var(--paper);
  font-size: 15px;
}

.scene-copy p {
  margin: 7px 0 0;
  color: #909999;
  font-size: 12px;
  line-height: 1.45;
}

.product-theater {
  display: grid;
  min-height: 0;
  grid-template-rows: minmax(0, 1fr) 48px;
}

.cad-app {
  position: relative;
  display: grid;
  align-self: center;
  width: min(1540px, calc((100svh - 194px) * 1.7778));
  max-width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 0;
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid #252d3a;
  border-radius: 4px;
  background: #0b0e14;
  color: #e4e9f1;
  box-shadow: 0 34px 110px rgba(0, 0, 0, 0.5);
  font-family: Inter, Arial, system-ui, sans-serif;
  font-size: 10px;
  grid-template-rows: 21px 64px 23px minmax(0, 1fr) 23.5%;
  container-type: inline-size;
}

.cad-app button {
  min-width: 0;
  border: 1px solid #2b3444;
  border-radius: 5px;
  background: #151a24;
  color: #d7deea;
  cursor: default;
}

.cad-mission {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 0.45rem;
  overflow: hidden;
  padding: 0 0.55rem;
  border-bottom: 1px solid #232b39;
  background: linear-gradient(180deg, #151a24, #11151d);
  white-space: nowrap;
}

.cad-mission > span,
.cad-mission > b {
  flex: 0 0 auto;
  padding: 0.16rem 0.42rem;
  border: 1px solid #2a3343;
  border-radius: 5px;
  background: #141923;
  color: #aeb9ca;
  font-size: 0.78em;
}

.cad-mission > b {
  color: #dce4ef;
}

.cad-led {
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--ui-green);
  box-shadow: 0 0 8px rgba(56, 217, 138, 0.7);
}

.cad-mission .cad-mission-state {
  overflow: hidden;
  color: #8f9caf;
  text-overflow: ellipsis;
}

.cad-toolbar {
  display: flex;
  min-width: 0;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.48rem 0.65rem 0.38rem;
  background: linear-gradient(180deg, #141923 0%, #10131a 100%);
}

.cad-toolbar-main {
  display: flex;
  min-width: 0;
  flex: 1;
  gap: 0.68rem;
}

.cad-tool-group {
  display: grid;
  min-width: 0;
  gap: 0.2rem;
}

.cad-tool-group small {
  color: #8490a3;
  font-size: 0.62em;
}

.cad-tool-group > div {
  display: flex;
  min-width: 0;
  gap: 0.28rem;
}

.cad-tool-group button,
.cad-tool-group span,
.cad-tool-group b {
  display: inline-flex;
  min-height: 1.75rem;
  align-items: center;
  padding: 0 0.42rem;
  border: 1px solid #2b3343;
  border-radius: 5px;
  background: #151a24;
  color: #d8dee8;
  font-size: 0.76em;
  font-weight: 500;
  white-space: nowrap;
}

.cad-session-group span {
  max-width: 11.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cad-tool-group .cad-command {
  border-color: #f8fafc;
  background: #f8fafc;
  color: #111827;
}

.cad-tool-group .cad-ai-on {
  border-color: rgba(34, 197, 94, 0.42);
  background: rgba(34, 197, 94, 0.12);
  color: #8df5b7;
  font-weight: 800;
}

.cad-agent-controls {
  flex: 0 0 auto;
  justify-items: end;
}

.cad-status-strip {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 0.3rem;
  overflow: hidden;
  padding: 0 0.55rem;
  border-top: 1px solid #232a38;
  border-bottom: 1px solid #232a38;
  background: #10131a;
  white-space: nowrap;
}

.cad-status-strip span {
  flex: 0 0 auto;
  padding: 0.14rem 0.42rem;
  border: 1px solid #2a3343;
  border-radius: 4px;
  color: #aeb9ca;
  font-size: 0.7em;
}

.cad-workspace {
  display: grid;
  min-height: 0;
  padding: 6px;
  gap: 6px;
  grid-template-columns: minmax(0, 1fr) clamp(285px, 29%, 430px);
}

.cad-drawing,
.cad-agent,
.cad-results {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border: 1px solid #202937;
  border-radius: 3px;
  background: #0d1118;
}

.cad-drawing {
  display: grid;
  grid-template-rows: 28px minmax(0, 1fr);
}

.cad-canvas-meta {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 0.35rem;
  overflow: hidden;
  padding: 0 0.48rem;
  border-bottom: 1px solid #202937;
  background: #111722;
  white-space: nowrap;
}

.cad-canvas-meta span {
  flex: 0 0 auto;
  padding: 0.2rem 0.38rem;
  border: 1px solid #2a3546;
  border-radius: 4px;
  color: #aab5c4;
  font-size: 0.68em;
}

.cad-canvas-meta span:first-child {
  color: #e6edf4;
}

.cad-camera {
  position: relative;
  min-height: 0;
  overflow: hidden;
  background-color: #080d13;
  background-image:
    linear-gradient(#131b24 1px, transparent 1px),
    linear-gradient(90deg, #131b24 1px, transparent 1px);
  background-size: 26px 26px;
}

.cad-page {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 82%;
  aspect-ratio: 1672 / 941;
  border: 2px solid var(--ui-green);
  background: #eef2ef;
  box-shadow: 0 0 20px rgba(56, 217, 138, 0.16);
  transform: translate(-50%, -50%) scale(0.96);
  transform-origin: center;
  transition:
    left 1100ms cubic-bezier(0.2, 0.75, 0.2, 1),
    top 1100ms cubic-bezier(0.2, 0.75, 0.2, 1),
    transform 1100ms cubic-bezier(0.2, 0.75, 0.2, 1);
}

.cad-page > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cad-region {
  position: absolute;
  display: none;
  border: 2px solid var(--ui-blue);
  background: rgba(56, 189, 248, 0.08);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.18) inset;
}

.cad-region > span {
  position: absolute;
  left: -2px;
  top: -18px;
  min-width: max-content;
  padding: 3px 6px;
  border-radius: 4px 4px 0 0;
  background: var(--ui-blue);
  color: #061018;
  font-size: 7px;
  font-weight: 800;
}

.region-w { left: 2.5%; top: 68.2%; width: 18.8%; height: 30.4%; }
.region-a { left: 21.4%; top: 68.1%; width: 17.2%; height: 30.4%; }
.region-ai { left: 39.4%; top: 68.1%; width: 17.2%; height: 30.4%; }
.region-section { left: 57.6%; top: 68.1%; width: 13%; height: 30.4%; }

.cad-reticle {
  position: absolute;
  left: 12%;
  top: 82.5%;
  display: none;
  align-items: center;
  transform: translate(-50%, -50%);
}

.cad-reticle i {
  display: block;
  width: 14px;
  height: 14px;
  border: 2px solid var(--ui-blue);
  border-radius: 50%;
  background: rgba(56, 189, 248, 0.14);
  box-shadow: 0 0 15px rgba(56, 189, 248, 0.6);
}

.cad-reticle span {
  margin-left: -2px;
  padding: 4px 8px;
  border-radius: 5px;
  background: #102f4b;
  color: #dbeafe;
  font-size: 8px;
  white-space: nowrap;
}

.cad-legend {
  position: absolute;
  z-index: 6;
  left: 7px;
  bottom: 6px;
  display: flex;
  max-width: 93%;
  flex-wrap: wrap;
  gap: 3px;
}

.cad-legend span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 6px;
  border: 1px solid #273345;
  border-radius: 999px;
  background: rgba(12, 17, 24, 0.92);
  color: #9ba8b9;
  font-size: 7px;
}

.cad-legend i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #7f8da1;
}

.cad-legend .legend-focus { background: var(--ui-blue); }
.cad-legend .legend-observation { background: var(--ui-purple); }
.cad-legend .legend-result { background: var(--ui-green); }
.cad-legend .legend-reference { background: #f59e0b; }
.cad-legend .legend-uncertain { background: var(--ui-red); }
.cad-legend .legend-revisit { background: #f97316; }
.cad-legend .legend-coverage { background: #0ea5e9; }

.cad-app[data-scene="inspect"] .cad-page,
.cad-app[data-scene="ai-view"] .cad-page,
.cad-app[data-scene="commit"] .cad-page {
  left: 116%;
  top: -6%;
  transform: translate(-50%, -50%) scale(2.2);
}

.cad-app[data-scene="inspect"] .region-w,
.cad-app[data-scene="ai-view"] .region-w,
.cad-app[data-scene="commit"] .region-w {
  display: block;
  border-color: var(--ui-green);
  background: rgba(56, 217, 138, 0.1);
}

.cad-app[data-scene="inspect"] .region-w > span,
.cad-app[data-scene="ai-view"] .region-w > span,
.cad-app[data-scene="commit"] .region-w > span {
  background: var(--ui-green);
}

.cad-app[data-scene="inspect"] .cad-reticle,
.cad-app[data-scene="ai-view"] .cad-reticle,
.cad-app[data-scene="commit"] .cad-reticle {
  display: flex;
  transform: translate(-50%, -50%) scale(0.46);
}

.cad-app[data-scene="inspect"] .cad-region > span,
.cad-app[data-scene="ai-view"] .cad-region > span,
.cad-app[data-scene="commit"] .cad-region > span {
  transform: scale(0.46);
  transform-origin: left bottom;
}

.cad-app[data-scene="deliver"] .cad-region {
  display: block;
  opacity: 0.78;
}

.cad-app[data-scene="deliver"] .region-section {
  border-color: var(--ui-green);
  background: rgba(56, 217, 138, 0.1);
}

.cad-app[data-scene="deliver"] .region-section > span {
  background: var(--ui-green);
}

.cad-app[data-scene="deliver"] .cad-reticle {
  left: 64%;
  top: 82%;
  display: flex;
}

.cad-agent {
  display: grid;
  grid-template-rows: 48px 30px minmax(0, 1fr);
  background: #0f1117;
}

.cad-agent > header {
  padding: 8px 10px;
  border-bottom: 1px solid #222a37;
}

.cad-agent > header strong {
  display: block;
  color: #f7f9fc;
  font-size: 1.08em;
}

.cad-agent > header p {
  margin: 4px 0 0;
  color: #919cad;
  font-size: 0.72em;
  line-height: 1.3;
}

.cad-agent-tabs {
  display: flex;
  gap: 4px;
  min-width: 0;
  overflow: hidden;
  padding: 4px 7px;
  border-bottom: 1px solid #222a37;
  background: #10131a;
}

.cad-agent-tabs button {
  flex: 0 0 auto;
  padding: 0 7px;
  color: #abb6c6;
  font-size: 0.68em;
}

.cad-agent-tabs button.is-active {
  border-color: rgba(59, 130, 246, 0.74);
  background: #1b2841;
  color: #dbeafe;
}

.cad-agent-view {
  display: none;
  min-height: 0;
  overflow: hidden;
}

.cad-agent-view.is-active {
  display: grid;
}

.cad-chat-view {
  grid-template-rows: 28px minmax(0, 1fr) auto 24px;
}

.cad-agent-subhead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 9px;
  border-bottom: 1px solid #222a37;
  background: #10131a;
}

.cad-agent-subhead strong {
  font-size: 0.9em;
}

.cad-agent-subhead span {
  color: #939ead;
  font-size: 0.68em;
}

.cad-chat-timeline {
  display: flex;
  min-height: 0;
  flex-direction: column;
  gap: 6px;
  overflow: hidden;
  padding: 8px;
  background: linear-gradient(180deg, #0f1117, #11141c);
}

.cad-chat-card {
  display: none;
  flex: 0 0 auto;
  padding: 7px 8px;
  border: 1px solid #283142;
  border-left-width: 3px;
  border-radius: 7px;
  background: #141923;
  color: #d8dee8;
  animation: cad-card-in 260ms ease-out both;
}

.cad-chat-card.is-visible {
  display: block;
}

.cad-chat-card header,
.cad-chat-card footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}

.cad-chat-card header b {
  font-size: 0.78em;
}

.cad-chat-card time,
.cad-chat-card small {
  color: #8793a6;
  font-size: 0.65em;
}

.cad-chat-card p {
  margin: 4px 0 0;
  color: #d8dee8;
  font-size: 0.72em;
  line-height: 1.35;
}

.cad-chat-card footer {
  justify-content: flex-start;
  margin-top: 5px;
}

.cad-chat-card footer span {
  padding: 2px 5px;
  border: 1px solid #2a3344;
  border-radius: 999px;
  background: #0f141e;
  color: #9fb0c6;
  font-size: 0.62em;
}

.cad-operator-message {
  margin-left: 6%;
  border-left-width: 1px;
  border-color: rgba(59, 130, 246, 0.46);
  background: #13223a;
}

.cad-activity-card,
.cad-focus-card {
  border-left-color: var(--ui-blue);
  background: #101c27;
}

.cad-thinking-card {
  border-left-color: var(--ui-purple);
  background: linear-gradient(180deg, #1a1428, #151924);
}

.cad-thinking-card button {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  border: 0;
  background: transparent;
  text-align: left;
}

.cad-thinking-card button span {
  display: grid;
}

.cad-thinking-card button b {
  color: #c4b5fd;
  font-size: 0.78em;
}

.cad-thinking-card button small {
  margin-top: 2px;
  color: #a78bfa;
}

.cad-notebook-card {
  border-left-color: var(--ui-purple);
  background: #181729;
}

.cad-table-card,
.cad-final-card {
  border-left-color: var(--ui-green);
  background: #101f19;
}

.cad-composer {
  padding: 6px 8px 5px;
  border-top: 1px solid #252d3a;
  background: #10131a;
  box-shadow: 0 -12px 24px rgba(0, 0, 0, 0.25);
}

.cad-domain-row {
  display: flex;
  gap: 4px;
  margin-bottom: 5px;
}

.cad-domain-row span {
  padding: 3px 7px;
  border: 1px solid #2a3040;
  border-radius: 999px;
  color: #aab4c4;
  font-size: 0.63em;
}

.cad-domain-row .is-active {
  border-color: rgba(59, 130, 246, 0.7);
  background: #17233a;
  color: #bfdbfe;
}

.cad-composer-shell {
  display: grid;
  min-height: 48px;
  align-items: center;
  gap: 5px;
  padding: 5px;
  border: 1px solid #303849;
  border-radius: 7px;
  background: #151923;
  grid-template-columns: 26px minmax(0, 1fr) auto;
}

.cad-composer-shell button {
  min-height: 28px;
  padding: 0 8px;
  font-size: 0.72em;
}

.cad-composer-shell p {
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 34px;
  align-items: center;
  margin: 0;
  overflow: hidden;
  color: #f4f7fb;
  font-size: 0.72em;
  line-height: 1.35;
  white-space: normal;
}

.cad-composer-shell p span {
  display: block;
  width: 100%;
  overflow-wrap: anywhere;
}

.cad-composer-shell p i {
  color: #8490a3;
  font-style: normal;
}

.cad-composer-shell p span:not(:empty) + i {
  display: none;
}

.cad-composer-shell .cad-send {
  border-color: #3b82f6;
  background: #2563eb;
  color: #fff;
}

.cad-composer-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 4px;
  color: #8d98a8;
  font-size: 0.62em;
}

.cad-context {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 8px;
  border-top: 1px solid #222a37;
  background: #10131a;
  color: #8590a1;
  font-size: 0.62em;
}

.cad-ai-view {
  grid-template-rows: 30px minmax(0, 1fr) 26px;
  padding: 0;
  background: #0f1117;
}

.exact-crop {
  position: relative;
  min-height: 0;
  margin: 10px;
  overflow: hidden;
  border: 1px solid #39465a;
  background: #edf1ee;
}

.exact-crop img {
  position: absolute;
  max-width: none;
  height: auto;
}

.cad-bbox {
  margin: 0;
  padding: 4px 10px;
  color: #8d98a8;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 0.66em;
}

.cad-notebook-view,
.cad-coverage-view,
.cad-memory-view {
  align-content: start;
  grid-template-rows: 30px auto;
  overflow: auto;
}

.cad-notebook-view article,
.cad-memory-view article {
  margin: 9px;
  padding: 9px;
  border: 1px solid #2c3546;
  border-left: 3px solid var(--ui-green);
  border-radius: 6px;
  background: #121923;
}

.cad-notebook-view article b,
.cad-memory-view article b {
  font-size: 0.75em;
}

.cad-notebook-view article p,
.cad-memory-view article p,
.cad-coverage-view > p {
  margin: 6px 0 0;
  color: #a2adbc;
  font-size: 0.7em;
  line-height: 1.4;
}

.cad-notebook-view article small {
  color: #7f8b9e;
  font-size: 0.62em;
}

.cad-coverage-meter {
  height: 8px;
  margin: 16px 10px 0;
  overflow: hidden;
  border-radius: 999px;
  background: #202837;
}

.cad-coverage-meter i {
  display: block;
  width: 0;
  height: 100%;
  background: var(--ui-blue);
  transition: width 700ms ease;
}

.cad-coverage-view > p {
  padding: 0 10px;
}

.cad-results {
  display: grid;
  margin: 0 6px 6px;
  background: #0f1117;
  grid-template-rows: 38px 26px minmax(0, 1fr);
}

.cad-result-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px;
  border-bottom: 1px solid #232a38;
}

.cad-result-heading strong {
  color: #f7f9fc;
  font-size: 0.92em;
}

.cad-result-heading p {
  margin: 2px 0 0;
  color: #8793a5;
  font-size: 0.63em;
}

.cad-result-heading button {
  min-height: 25px;
  padding: 0 10px;
  font-size: 0.7em;
}

.cad-table-summary {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 0 10px;
  overflow: hidden;
  border-bottom: 1px solid #232a38;
  color: #9aa5b5;
  font-size: 0.63em;
  white-space: nowrap;
}

.cad-table-summary label {
  min-width: 125px;
  margin-left: auto;
  padding: 4px 7px;
  border: 1px solid #2a3343;
  border-radius: 4px;
  background: #141923;
}

.cad-table-scroll {
  min-height: 0;
  overflow: hidden;
}

.cad-table-scroll table {
  width: 100%;
  border-collapse: collapse;
  table-layout: auto;
}

.cad-table-scroll th,
.cad-table-scroll td {
  padding: 5px 7px;
  border-right: 1px solid #242c3a;
  border-bottom: 1px solid #242c3a;
  text-align: left;
  white-space: nowrap;
}

.cad-table-scroll th {
  background: #141923;
  color: #b8c2d1;
  font-size: 0.64em;
  font-weight: 700;
}

.cad-table-scroll td {
  color: #cbd3de;
  font-size: 0.64em;
}

.cad-table-scroll tbody tr:nth-child(2n) {
  background: #11151d;
}

.cad-empty-row td {
  padding: 13px;
  color: #8390a2;
  text-align: center;
}

.cad-result-row {
  display: none;
}

.cad-result-row.is-visible {
  display: table-row;
  animation: table-row-in 420ms ease both;
}

.cad-result-row td:nth-last-child(2) b {
  padding: 3px 6px;
  border: 1px solid rgba(34, 197, 94, 0.35);
  border-radius: 999px;
  background: rgba(34, 197, 94, 0.1);
  color: #86efac;
}

.cad-result-row td:last-child {
  display: grid;
}

.cad-result-row td:last-child small {
  color: #7f8b9d;
  font-size: 0.85em;
}

@keyframes cad-card-in {
  from { opacity: 0; transform: translateY(7px); }
  to { opacity: 1; transform: none; }
}

@keyframes table-row-in {
  from { opacity: 0; background: rgba(56, 217, 138, 0.18); }
  to { opacity: 1; background: transparent; }
}

.product-controls {
  display: grid;
  width: min(1540px, 100%);
  margin: 4px auto 0;
  align-items: center;
  gap: 14px;
  grid-template-columns: auto minmax(80px, 1fr) auto;
}

.product-scene-buttons {
  display: flex;
  gap: 3px;
}

.product-scene-buttons button,
.product-play {
  min-height: 34px;
  padding: 0 13px;
  border: 1px solid #303739;
  border-radius: 2px;
  background: #111518;
  color: #858e8e;
  font-size: 10px;
  cursor: pointer;
}

.product-scene-buttons button.is-active {
  border-color: var(--cyan);
  background: #152126;
  color: var(--paper);
}

.product-progress {
  height: 1px;
  overflow: hidden;
  background: #2a3132;
}

.product-progress i {
  display: block;
  width: 0;
  height: 100%;
  background: var(--amber);
  transition: width 500ms ease;
}

.scope-slide,
.security-slide,
.demo-slide {
  display: grid;
  min-height: 100svh;
  align-items: center;
  padding: 100px 7vw 64px;
  grid-template-columns: minmax(360px, 0.85fr) minmax(520px, 1.15fr);
  gap: 7vw;
}

.scope-slide {
  background: #111516;
}

.slide-copy {
  position: relative;
  z-index: 5;
}

.scope-copy > p:not(.eyebrow),
.security-copy > p:not(.eyebrow),
.demo-copy > p:not(.eyebrow) {
  max-width: 660px;
  margin: 24px 0 0;
  color: #a2aaa8;
  font-size: 16px;
  line-height: 1.55;
}

.scope-copy > p.scope-detail {
  margin-top: 12px;
  color: #7f8a88;
  font-size: 13px;
}

.scope-prompt {
  display: grid;
  margin-top: 38px;
  padding: 17px 0;
  border-top: 1px solid #3a4241;
  border-bottom: 1px solid #3a4241;
  grid-template-columns: 64px 1fr;
  gap: 16px;
}

.scope-prompt span {
  color: var(--cyan);
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 10px;
  text-transform: uppercase;
}

.scope-prompt strong {
  min-height: 43px;
  color: var(--paper);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
}

.scope-output-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
}

.scope-output-line span {
  margin-right: 5px;
  color: #707a78;
  font-size: 10px;
  text-transform: uppercase;
}

.scope-output-line b {
  padding: 6px 9px;
  border: 1px solid #36403e;
  color: #bdc5c2;
  font-size: 9px;
  font-weight: 500;
}

.document-machine {
  position: relative;
  min-height: 660px;
  perspective: 1400px;
  transform-style: preserve-3d;
}

.machine-floor,
.security-floor,
.security-visual-floor {
  position: absolute;
  inset: 16% 0 0;
  background-image:
    linear-gradient(rgba(121, 206, 224, 0.12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(121, 206, 224, 0.12) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: linear-gradient(to bottom, #000 10%, transparent 84%);
  transform: rotateX(62deg) translateY(18%);
}

.document-plane,
.output-plane {
  position: absolute;
  overflow: hidden;
  border: 1px solid #526061;
  background: rgba(18, 23, 24, 0.94);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.42);
  transform-style: preserve-3d;
}

.document-plane > span,
.output-plane > span {
  position: absolute;
  left: 12px;
  bottom: 9px;
  color: var(--cyan);
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 8px;
}

.source-drawing {
  left: 1%;
  top: 4%;
  width: 48%;
  aspect-ratio: 16 / 9;
  background: #eff2ed;
  transform: rotateY(14deg) rotateX(5deg) translateZ(-20px);
  animation: machine-drawing 8s ease-in-out infinite alternate;
}

.source-drawing img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.source-drawing span {
  padding: 4px 7px;
  background: rgba(7, 10, 12, 0.86);
}

.source-protocol {
  left: 3%;
  bottom: 9%;
  width: 38%;
  height: 206px;
  padding: 15px 15px 28px;
  border-color: #49645a;
  transform: rotateY(12deg) rotateX(-5deg) translateZ(60px);
}

.mini-sheet-heading {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 9px;
  padding-bottom: 10px;
  border-bottom: 1px solid #3b4645;
}

.mini-sheet-heading > i {
  display: grid;
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
  place-items: center;
  background: #167447;
  color: #eff8f2;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 10px;
  font-style: normal;
}

.mini-sheet-heading div {
  min-width: 0;
}

.mini-sheet-heading b,
.mini-sheet-heading small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mini-sheet-heading b {
  color: var(--paper);
  font-size: 10px;
  font-weight: 600;
}

.mini-sheet-heading small {
  margin-top: 2px;
  color: #76827f;
  font-size: 7px;
}

.mini-sheet-grid {
  display: grid;
  margin-top: 11px;
  border-top: 1px solid #364442;
  border-left: 1px solid #364442;
  grid-template-columns: 0.55fr 0.95fr 1.35fr;
}

.mini-sheet-grid > * {
  min-width: 0;
  padding: 6px 5px;
  overflow: hidden;
  border-right: 1px solid #364442;
  border-bottom: 1px solid #364442;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mini-sheet-grid b {
  background: #1a2923;
  color: #bcd6c8;
  font-size: 7px;
  font-weight: 600;
}

.mini-sheet-grid span {
  color: #aab4b1;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 6px;
}

.machine-aperture {
  position: absolute;
  z-index: 6;
  left: 8%;
  top: 58%;
  width: 22%;
  aspect-ratio: 1.32;
  border: 1px solid var(--cyan);
  background: rgba(121, 206, 224, 0.08);
  box-shadow: 0 0 55px rgba(121, 206, 224, 0.11);
  transform: translateZ(4px);
  animation: aperture-float 5s ease-in-out infinite alternate;
}

.machine-aperture span {
  position: absolute;
  left: 5px;
  top: 5px;
  padding: 2px 4px;
  background: rgba(8, 12, 14, 0.78);
  color: var(--cyan);
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 8px;
}

.machine-aperture i {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 12px;
  height: 12px;
  border: 1px solid var(--amber);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

.machine-core {
  position: absolute;
  z-index: 8;
  left: 43%;
  top: 44%;
  display: grid;
  width: 170px;
  height: 82px;
  place-content: center;
  border: 1px solid var(--paper);
  background: #0b0e11;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
  text-align: center;
  transform: translateZ(220px);
}

.machine-core b {
  font-size: 12px;
}

.machine-core small {
  margin-top: 5px;
  color: #7c8987;
  font-size: 9px;
}

.output-table {
  right: 0;
  top: 12%;
  width: 43%;
  height: 266px;
  padding: 14px 14px 29px;
  border-color: #526061;
  transform: rotateY(-14deg) rotateX(5deg) translateZ(10px);
}

.mini-result-heading {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 9px;
}

.mini-result-heading div {
  min-width: 0;
}

.mini-result-heading b,
.mini-result-heading small {
  display: block;
}

.mini-result-heading b {
  color: var(--paper);
  font-size: 10px;
}

.mini-result-heading small {
  margin-top: 3px;
  color: #74807f;
  font-size: 7px;
}

.mini-result-heading > i {
  padding: 5px 7px;
  border: 1px solid #33404a;
  background: #171d24;
  color: #bcc7d2;
  font-size: 7px;
  font-style: normal;
}

.mini-result-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  color: #aeb8b7;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 5.8px;
  text-align: left;
}

.mini-result-table th,
.mini-result-table td {
  padding: 6px 4px;
  overflow: hidden;
  border: 1px solid #303a43;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mini-result-table th {
  background: #171c24;
  color: #8592a3;
  font-weight: 600;
}

.mini-result-table th:nth-child(1) { width: 14%; }
.mini-result-table th:nth-child(2) { width: 24%; }
.mini-result-table th:nth-child(3) { width: 42%; }
.mini-result-table th:nth-child(4) { width: 20%; }

.mini-result-table td b {
  color: #62d89b;
  font-size: inherit;
}

.output-table > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 2px 0;
  color: #74807f;
  font-size: 6px;
}

.output-table > footer b {
  color: #9acbb2;
  font-size: 6px;
  font-weight: 500;
}

.output-files {
  position: absolute;
  right: 8%;
  bottom: 11%;
  display: flex;
  gap: 10px;
  transform: translateZ(150px) rotateY(-10deg);
}

.output-files span {
  display: grid;
  width: 82px;
  height: 108px;
  align-content: center;
  justify-items: center;
  gap: 5px;
  border: 1px solid #525e5e;
  background: #151a1b;
  color: var(--paper);
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 10px;
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.38);
}

.output-files b {
  font-size: 10px;
}

.output-files small {
  color: #74807f;
  font-family: inherit;
  font-size: 6px;
}

.output-files span:nth-child(2) {
  transform: translateY(18px);
}

.machine-beam {
  position: absolute;
  z-index: 5;
  height: 1px;
  overflow: hidden;
  background: rgba(121, 206, 224, 0.35);
  transform-origin: left center;
}

.machine-beam::after {
  content: "";
  position: absolute;
  left: 0;
  top: -1px;
  width: 28%;
  height: 3px;
  background: var(--cyan);
  box-shadow: 0 0 14px var(--cyan);
  animation: beam-flow 2.2s linear infinite;
}

.beam-source {
  left: 28%;
  top: 41%;
  width: 31%;
  transform: rotate(23deg);
}

.beam-protocol {
  left: 28%;
  top: 73%;
  width: 23%;
  transform: rotate(-41deg);
}

.beam-output {
  left: 55%;
  top: 51%;
  width: 34%;
  transform: rotate(-17deg);
}

.beam-files {
  left: 72%;
  top: 49%;
  width: 22%;
  transform: rotate(67deg);
}

@keyframes machine-drawing {
  to { transform: rotateY(9deg) rotateX(2deg) translate3d(12px, -8px, 20px); }
}

@keyframes aperture-float {
  to { left: 68%; top: 18%; }
}

@keyframes beam-flow {
  from { transform: translateX(-100%); }
  to { transform: translateX(420%); }
}

.evidence-slide {
  display: grid;
  min-height: 100svh;
  padding: 96px 6vw 48px;
  grid-template-rows: auto minmax(0, 1fr);
  background: #0d1012;
}

.evidence-heading {
  display: grid;
  width: min(1480px, 100%);
  margin: 0 auto 22px;
  align-items: end;
  grid-template-columns: minmax(0, 0.95fr) minmax(360px, 0.6fr);
  gap: 70px;
}

.evidence-heading > p {
  margin: 0;
  color: #909998;
  font-size: 14px;
  line-height: 1.55;
}

.evidence-layout {
  display: grid;
  width: min(1480px, 100%);
  min-height: 0;
  margin: 0 auto;
  grid-template-columns: 310px minmax(0, 1fr);
  gap: 7vw;
}

.evidence-rail {
  align-self: center;
  border-top: 1px solid #343b3b;
}

.evidence-rail article {
  position: relative;
  padding: 20px 0 20px 22px;
  border-bottom: 1px solid #343b3b;
  opacity: 0.34;
  transition: opacity 250ms ease, transform 250ms ease;
  cursor: pointer;
}

.evidence-rail article::before {
  content: "";
  position: absolute;
  left: 0;
  top: 20px;
  bottom: 20px;
  width: 2px;
  background: #4a5352;
}

.evidence-rail article.is-active {
  opacity: 1;
  transform: translateX(6px);
}

.evidence-rail article.is-active::before {
  background: var(--amber);
}

.evidence-rail b {
  color: var(--paper);
  font-size: 14px;
}

.evidence-rail p {
  margin: 7px 0 0;
  color: #929b99;
  font-size: 12px;
  line-height: 1.45;
}

.evidence-machine {
  position: relative;
  display: grid;
  min-height: 590px;
  align-items: center;
  overflow: hidden;
}

.evidence-grid {
  position: absolute;
  inset: 10% 0 0;
  background-image:
    linear-gradient(rgba(121, 206, 224, 0.075) 1px, transparent 1px),
    linear-gradient(90deg, rgba(121, 206, 224, 0.075) 1px, transparent 1px);
  background-size: 38px 38px;
  mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent);
}

.evidence-flow {
  position: relative;
  z-index: 2;
  display: grid;
  min-width: 0;
  align-items: center;
  padding: 36px 0;
  grid-template-columns:
    minmax(120px, 1.1fr) 32px
    minmax(120px, 1fr) 32px
    minmax(108px, 0.82fr) 32px
    minmax(130px, 1fr) 32px
    minmax(150px, 1.18fr);
}

.evidence-node {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 250px;
  align-content: end;
  padding: 14px;
  overflow: hidden;
  border: 1px solid #3d4748;
  background: rgba(14, 19, 21, 0.97);
  box-shadow: 0 22px 55px rgba(0, 0, 0, 0.34);
  transition: border-color 300ms ease, opacity 300ms ease, transform 450ms ease, box-shadow 300ms ease;
}

.evidence-node > b {
  margin-top: 12px;
  color: var(--paper);
  font-size: 9px;
  letter-spacing: 0;
}

.evidence-node > small {
  margin-top: 5px;
  color: #74807f;
  font-size: 7px;
  line-height: 1.35;
}

.node-document {
  transform: translateY(-26px);
}

.evidence-document-preview,
.evidence-viewport-preview {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  border: 1px solid #3f4b4b;
  background: #e9ede8;
}

.evidence-document-preview img,
.evidence-viewport-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.evidence-document-preview::after {
  content: "PDF";
  position: absolute;
  left: 5px;
  top: 5px;
  padding: 3px 4px;
  background: rgba(8, 12, 14, 0.88);
  color: #c9d1cf;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 6px;
}

.node-viewport {
  transform: translateY(26px);
}

.evidence-viewport-preview img {
  width: 310%;
  max-width: none;
  height: auto;
  transform: translate(-5%, -68%);
}

.evidence-viewport-preview > i {
  position: absolute;
  inset: 8px;
  border: 1px solid var(--cyan);
  box-shadow: 0 0 24px rgba(121, 206, 224, 0.18);
}

.node-model {
  transform: translateY(-10px);
}

.evidence-model-core {
  position: relative;
  display: grid;
  width: 78px;
  aspect-ratio: 1;
  margin: 0 auto 16px;
  place-items: center;
  border: 1px solid #706890;
  background: #14131c;
  transform: rotate(45deg);
}

.evidence-model-core::before {
  content: "";
  width: 30px;
  height: 30px;
  border: 1px solid #a9a0ca;
  box-shadow: 0 0 28px rgba(169, 160, 202, 0.22);
}

.evidence-model-core i {
  position: absolute;
  width: 5px;
  height: 5px;
  background: var(--cyan);
  box-shadow: 0 0 12px rgba(121, 206, 224, 0.75);
}

.evidence-model-core i:nth-child(1) { left: 8px; top: 8px; }
.evidence-model-core i:nth-child(2) { right: 8px; top: 8px; }
.evidence-model-core i:nth-child(3) { right: 8px; bottom: 8px; }

.node-memory {
  transform: translateY(24px);
}

.evidence-notebook-preview,
.evidence-output-preview {
  display: grid;
  min-height: 110px;
  align-content: start;
  border: 1px solid #33403e;
  background: #111719;
}

.evidence-notebook-preview span,
.evidence-output-preview span {
  display: grid;
  min-width: 0;
  align-items: center;
  padding: 8px;
  border-bottom: 1px solid #2c3635;
}

.evidence-notebook-preview span {
  grid-template-columns: 1fr auto;
}

.evidence-notebook-preview span:last-child,
.evidence-output-preview span:last-child {
  border-bottom: 0;
}

.evidence-notebook-preview b,
.evidence-notebook-preview i {
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 6px;
  font-style: normal;
}

.evidence-notebook-preview b {
  color: #c7cfcc;
}

.evidence-notebook-preview i {
  color: #73817d;
}

.evidence-notebook-preview span:first-child i {
  color: var(--ui-green);
}

.evidence-notebook-preview span:last-child i {
  color: var(--amber);
}

.node-output {
  transform: translateY(-24px);
}

.evidence-output-preview span {
  grid-template-columns: 0.7fr 1.35fr 0.65fr;
  gap: 5px;
  color: #a5afac;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 5.5px;
}

.evidence-output-preview span:first-child {
  background: #171d24;
}

.evidence-output-preview span b {
  color: #7e8b99;
  font-size: inherit;
}

.evidence-output-preview span i {
  overflow: hidden;
  color: #a5afac;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.evidence-output-preview span strong {
  color: var(--ui-green);
  font-weight: 600;
}

.evidence-flow-link {
  position: relative;
  display: block;
  height: 1px;
  overflow: hidden;
  background: #405052;
}

.evidence-flow-link::after {
  content: "";
  position: absolute;
  left: -45%;
  top: -1px;
  width: 45%;
  height: 3px;
  background: var(--cyan);
  box-shadow: 0 0 12px rgba(121, 206, 224, 0.8);
  animation: evidence-flow 1.9s linear infinite;
}

.evidence-flow-link::before {
  content: "";
  position: absolute;
  right: 0;
  top: -3px;
  width: 6px;
  height: 6px;
  border-top: 1px solid #708385;
  border-right: 1px solid #708385;
  transform: rotate(45deg);
}

.evidence-machine[data-state="document"] .node-document,
.evidence-machine[data-state="viewport"] .node-viewport,
.evidence-machine[data-state="model"] .node-model,
.evidence-machine[data-state="memory"] .node-memory,
.evidence-machine[data-state="output"] .node-output {
  border-color: var(--amber);
  box-shadow: 0 0 0 1px rgba(231, 185, 93, 0.12), 0 30px 72px rgba(0, 0, 0, 0.46);
}

@keyframes evidence-flow {
  from { transform: translateX(0); }
  to { transform: translateX(325%); }
}

@keyframes evidence-flow-vertical {
  from { transform: translateY(0); }
  to { transform: translateY(325%); }
}

.security-slide {
  background: #111516;
}

.security-copy .button {
  margin-top: 34px;
}

.security-copy > small {
  display: block;
  margin-top: 15px;
  color: #646e6c;
  font-size: 10px;
}

.security-machine {
  position: relative;
  width: 100%;
  min-height: 660px;
  border: 0;
  background: transparent;
  perspective: 1400px;
  cursor: pointer;
  transform-style: preserve-3d;
}

.security-floor {
  inset: 11% 0 0;
}

.security-node {
  position: absolute;
  left: 50%;
  display: grid;
  width: min(80%, 560px);
  height: 116px;
  place-content: center;
  border: 1px solid #647170;
  background: rgba(15, 21, 22, 0.98);
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.48), 0 0 0 1px rgba(235, 239, 235, 0.035) inset;
  text-align: center;
  transform-style: preserve-3d;
  transition: transform 500ms ease, border-color 500ms ease;
}

.security-node::before {
  position: absolute;
  left: 17px;
  top: 17px;
  width: 9px;
  height: 9px;
  border: 1px solid currentColor;
  content: "";
}

.security-node b {
  color: #eef1ed;
  font-size: 15px;
}

.security-node i {
  margin-top: 7px;
  color: #a0aaa8;
  font-size: 10px;
  font-style: normal;
}

.security-customer { top: 3%; color: var(--steel); transform: translateX(-50%) rotateX(46deg) translateZ(10px); }
.security-service { top: 25%; color: var(--cyan); border-color: #5795a0; transform: translateX(-50%) rotateX(46deg) translateZ(85px); }
.security-api { top: 47%; color: #b8a5d4; border-color: #82749d; transform: translateX(-50%) rotateX(46deg) translateZ(160px); }
.security-review { top: 69%; color: #8db596; border-color: #63856b; transform: translateX(-50%) rotateX(46deg) translateZ(235px); }

.security-machine:hover .security-customer { transform: translateX(-50%) rotateX(46deg) translate3d(0, -10px, 10px); }
.security-machine:hover .security-review { transform: translateX(-50%) rotateX(46deg) translate3d(0, 10px, 235px); }

.security-link {
  position: absolute;
  left: 50%;
  width: 2px;
  height: 88px;
  overflow: hidden;
  background: rgba(121, 206, 224, 0.52);
}

.security-link i {
  position: absolute;
  top: -20px;
  left: -1px;
  width: 3px;
  height: 20px;
  background: var(--cyan);
  box-shadow: 0 0 12px var(--cyan);
  animation: security-flow 1.8s linear infinite;
}

.link-customer-service { top: 20%; }
.link-service-api { top: 42%; }
.link-api-review { top: 64%; }

.security-orbit {
  position: absolute;
  left: 50%;
  top: 46%;
  width: 86%;
  aspect-ratio: 1;
  border: 1px solid rgba(231, 185, 93, 0.3);
  border-radius: 50%;
  transform: translate(-50%, -50%) rotateX(72deg);
  animation: security-orbit 12s linear infinite;
}

.security-machine > small {
  position: absolute;
  right: 2%;
  bottom: 4%;
  color: #687270;
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 8px;
}

@keyframes security-flow {
  to { transform: translateY(92px); }
}

@keyframes security-orbit {
  to { transform: translate(-50%, -50%) rotateX(72deg) rotateZ(360deg); }
}

.demo-slide {
  padding-bottom: 145px;
  background: #0b0e11;
}

.demo-contact {
  display: grid;
  margin-top: 36px;
}

.demo-contact span {
  color: #6f7978;
  font-size: 10px;
  text-transform: uppercase;
}

.demo-contact a {
  margin-top: 7px;
  color: var(--paper);
  font-size: 17px;
}

.demo-form {
  position: relative;
  display: grid;
  gap: 18px;
  padding: 32px;
  border: 1px solid #343c3d;
  background: #111518;
  transition: border-color 180ms ease, background-color 180ms ease;
}

.demo-form.is-sending {
  border-color: #66706f;
}

.demo-form.is-success {
  border-color: rgba(120, 211, 166, 0.65);
  background: #111816;
}

.demo-form.is-error {
  border-color: rgba(225, 145, 113, 0.7);
}

.form-trap {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

.field-pair {
  display: grid;
  gap: 16px;
  grid-template-columns: 1fr 1fr;
}

.demo-form label {
  display: grid;
  gap: 8px;
}

.demo-form label > span {
  color: #aeb6b4;
  font-size: 11px;
}

.demo-form input,
.demo-form textarea {
  width: 100%;
  border: 0;
  border-bottom: 1px solid #465051;
  border-radius: 0;
  outline: 0;
  background: transparent;
  color: var(--paper);
  font-size: 14px;
}

.demo-form input {
  height: 42px;
}

.demo-form textarea {
  min-height: 88px;
  resize: vertical;
}

.demo-form input:focus,
.demo-form textarea:focus {
  border-color: var(--cyan);
}

.demo-form .consent {
  display: grid;
  align-items: start;
  gap: 10px;
  grid-template-columns: 16px minmax(0, 1fr);
}

.consent input {
  width: 15px;
  height: 15px;
  margin: 1px 0 0;
}

.consent span {
  color: #7d8785 !important;
  line-height: 1.4;
}

.form-action {
  display: flex;
  align-items: center;
  gap: 16px;
}

.form-action .button {
  flex: 0 0 auto;
  min-width: 190px;
  white-space: nowrap;
}

.form-action p {
  min-width: 0;
  margin: 0;
  color: #687270;
  font-size: 9px;
  line-height: 1.35;
}

.demo-form.is-success .form-action p {
  color: #78d3a6;
}

.demo-form.is-error .form-action p {
  color: #e19171;
}

.demo-form .button:disabled {
  cursor: wait;
  opacity: 0.66;
}

.site-footer {
  position: absolute;
  left: 7vw;
  right: 7vw;
  bottom: 0;
  display: grid;
  min-height: 108px;
  align-items: center;
  border-top: 1px solid #303738;
  grid-template-columns: auto minmax(300px, 1fr) auto;
  gap: 35px;
}

.site-footer > div {
  display: grid;
}

.site-footer strong {
  font-size: 12px;
}

.site-footer span,
.site-footer p,
.site-footer a {
  color: #707a78;
  font-size: 9px;
}

.site-footer p {
  margin: 0;
  line-height: 1.5;
}

.site-footer nav {
  display: flex;
  gap: 15px;
}

.security-modal[hidden] {
  display: none;
}

.security-modal {
  position: fixed;
  z-index: 210;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
}

.security-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(3, 5, 6, 0.9);
  backdrop-filter: blur(14px);
}

.security-dialog {
  position: relative;
  display: grid;
  width: min(1260px, 96vw);
  height: min(780px, 92vh);
  outline: 0;
  border: 1px solid #3b4546;
  background: #0d1112;
  box-shadow: 0 45px 140px #000;
  opacity: 0;
  transform: translateY(20px) scale(0.98);
  transition: opacity 250ms ease, transform 250ms ease;
  grid-template-rows: 66px minmax(0, 1fr) 62px;
}

.security-modal.is-open .security-dialog {
  opacity: 1;
  transform: none;
}

.security-dialog > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  border-bottom: 1px solid #303839;
}

.security-dialog > header > div {
  display: grid;
}

.security-dialog > header span {
  color: var(--cyan);
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 9px;
}

.security-dialog > header b {
  margin-top: 4px;
  font-size: 14px;
}

.security-dialog > header button {
  width: 38px;
  height: 38px;
  border: 1px solid #354041;
  background: transparent;
  font-size: 24px;
  cursor: pointer;
}

.security-dialog-body {
  display: grid;
  min-height: 0;
  grid-template-columns: 0.92fr 1.08fr;
}

.security-visual {
  position: relative;
  min-height: 0;
  overflow: hidden;
  border-right: 1px solid #303839;
  perspective: 1000px;
}

.security-visual-floor {
  inset: 12% -12% -20%;
  transform: rotateX(64deg) translateY(16%);
}

.sv-node {
  position: absolute;
  display: grid;
  width: 180px;
  min-height: 78px;
  place-content: center;
  border: 1px solid #465253;
  background: rgba(16, 22, 23, 0.96);
  box-shadow: 0 20px 55px rgba(0, 0, 0, 0.38);
  text-align: center;
  transition: border-color 300ms ease, opacity 300ms ease, transform 500ms ease;
}

.sv-node b {
  font-size: 10px;
}

.sv-node small {
  margin-top: 4px;
  color: #72807d;
  font-size: 8px;
}

.sv-customer { left: 7%; top: 9%; transform: translateZ(20px); }
.sv-service { right: 7%; top: 28%; border-color: #467f8a; transform: translateZ(90px); }
.sv-api { left: 11%; bottom: 24%; border-color: #71658d; transform: translateZ(130px); }
.sv-review { right: 8%; bottom: 8%; border-color: #507157; transform: translateZ(70px); }

.sv-link {
  position: absolute;
  display: block;
  height: 1px;
  overflow: hidden;
  background: rgba(121, 206, 224, 0.42);
  transform-origin: left center;
}

.sv-link em {
  position: absolute;
  top: -1px;
  width: 24%;
  height: 3px;
  background: var(--cyan);
  box-shadow: 0 0 12px var(--cyan);
  animation: modal-flow 1.8s linear infinite;
}

.sv-link-a { left: 29%; top: 29%; width: 47%; transform: rotate(20deg); }
.sv-link-b { left: 65%; top: 48%; width: 48%; transform: rotate(143deg); }
.sv-link-c { left: 29%; top: 72%; width: 50%; transform: rotate(18deg); }

.security-visual > strong {
  position: absolute;
  left: 20px;
  bottom: 18px;
  color: var(--cyan);
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 9px;
  text-transform: uppercase;
}

.security-visual[data-step="0"] .sv-customer,
.security-visual[data-step="0"] .sv-service,
.security-visual[data-step="1"] .sv-api,
.security-visual[data-step="2"] .sv-service,
.security-visual[data-step="2"] .sv-api,
.security-visual[data-step="3"] .sv-service,
.security-visual[data-step="3"] .sv-review,
.security-visual[data-step="4"] .sv-service,
.security-visual[data-step="4"] .sv-review,
.security-visual[data-step="5"] .sv-review {
  border-color: var(--amber);
  box-shadow: 0 0 0 1px rgba(231, 185, 93, 0.16), 0 25px 70px rgba(0, 0, 0, 0.48);
}

.security-slides {
  min-height: 0;
  overflow: auto;
  padding: 58px 64px;
}

.security-slides article > span {
  color: var(--cyan);
  font-family: "SFMono-Regular", Consolas, monospace;
  font-size: 9px;
}

.security-slides h2 {
  margin: 17px 0 0;
  color: var(--paper);
  font-size: 46px;
  font-weight: 600;
  line-height: 1.04;
}

.security-slides p {
  margin: 25px 0 0;
  color: #a2aaa8;
  font-size: 14px;
  line-height: 1.55;
}

.security-slides ul {
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid #303839;
}

.security-slides li {
  padding: 13px 0;
  border-bottom: 1px solid #303839;
  color: #899391;
  font-size: 12px;
}

.security-dialog > footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 0 20px;
  border-top: 1px solid #303839;
}

.security-dialog > footer > div {
  display: flex;
  flex-wrap: wrap;
  gap: 17px;
}

.security-dialog > footer a {
  color: #8d9895;
  font-size: 9px;
}

.security-dialog > footer nav {
  display: flex;
  align-items: center;
  gap: 13px;
}

.security-dialog > footer button {
  width: 38px;
  height: 34px;
  border: 1px solid #354041;
  background: #141a1b;
  cursor: pointer;
}

.security-dots {
  display: flex;
  gap: 5px;
}

.security-dots i {
  width: 18px;
  height: 2px;
  background: #3b4545;
}

.security-dots i.is-active {
  background: var(--amber);
}

@keyframes modal-flow {
  from { transform: translateX(-100%); }
  to { transform: translateX(520%); }
}

/* 2026 design system: one material language across marketing and spatial diagrams. */
body.is-loading main {
  filter: brightness(0.58) saturate(0.7);
  transform: scale(0.935);
  transform-origin: 50% 50%;
  transition: filter 1300ms cubic-bezier(0.16, 1, 0.3, 1), transform 1300ms cubic-bezier(0.16, 1, 0.3, 1);
}

body.is-loading .site-header,
body.is-loading .deck-nav {
  opacity: 0;
  transition: opacity 900ms 220ms ease;
}

body.is-loading.is-revealing main {
  filter: none;
  transform: scale(1);
}

body.is-loading.is-revealing .site-header,
body.is-loading.is-revealing .deck-nav {
  opacity: 1;
}

@property --boot-reveal {
  syntax: "<length>";
  inherits: false;
  initial-value: 0px;
}

.boot-intro {
  --boot-reveal: 0px;
  place-items: center;
  overflow: hidden;
  background: transparent;
  transition: opacity 380ms ease, visibility 380ms ease;
}

.boot-intro::before {
  display: none;
}

.boot-veil {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 50%, rgba(210, 173, 104, 0.075), transparent 22%),
    linear-gradient(145deg, #080b0a, #0e1312 52%, #080a0b);
  -webkit-mask-image: radial-gradient(
    circle at 50% 50%,
    transparent 0 var(--boot-reveal),
    #000 calc(var(--boot-reveal) + 2px)
  );
  mask-image: radial-gradient(
    circle at 50% 50%,
    transparent 0 var(--boot-reveal),
    #000 calc(var(--boot-reveal) + 2px)
  );
}

.boot-veil::before {
  position: absolute;
  inset: 0;
  opacity: 0.28;
  background-image:
    linear-gradient(rgba(244, 244, 238, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(244, 244, 238, 0.035) 1px, transparent 1px);
  background-position: 50% 50%;
  background-size: 64px 64px;
  content: "";
  mask-image: radial-gradient(circle, #000, transparent 68%);
}

.boot-veil::after {
  position: absolute;
  left: 50%;
  top: 50%;
  width: min(680px, 68vw);
  height: min(680px, 68vw);
  border: 1px solid rgba(161, 171, 167, 0.12);
  border-radius: 50%;
  box-shadow:
    0 0 0 52px rgba(161, 171, 167, 0.025),
    0 0 0 126px rgba(161, 171, 167, 0.018);
  content: "";
  transform: translate(-50%, -50%) scaleY(0.34);
}

.boot-symbol-stage {
  position: relative;
  z-index: 3;
  width: min(980px, 96vmin);
  aspect-ratio: 1;
}

.boot-symbol-stage::before,
.boot-symbol-stage::after {
  position: absolute;
  z-index: -1;
  left: 50%;
  top: 50%;
  content: "";
  pointer-events: none;
}

.boot-symbol-stage::before {
  width: 40%;
  height: 40%;
  border: 1px solid rgba(210, 173, 104, 0.2);
  border-radius: 50%;
  transform: translate(-50%, -50%) rotate(0deg) scaleY(0.28);
  animation: boot-orbit-turn 6s linear infinite;
}

.boot-symbol-stage::after {
  width: 5px;
  height: 5px;
  border: 1px solid var(--amber);
  box-shadow: 0 0 24px rgba(210, 173, 104, 0.7);
  transform: translate(-50%, -50%);
  animation: boot-node-pulse 900ms ease-in-out infinite alternate;
}

.boot-symbol {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  shape-rendering: geometricPrecision;
  animation: boot-symbol-settle 1120ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.boot-logo-facet,
.boot-logo-aperture {
  shape-rendering: geometricPrecision;
  transform-box: fill-box;
  transform-origin: center;
}

.boot-logo-facet {
  stroke: rgba(255, 255, 255, 0.34);
  stroke-width: 0.55px;
  vector-effect: non-scaling-stroke;
}

.boot-logo-facet-a {
  fill: url("#boot-facet-a-gradient");
  animation: boot-facet-a-in 760ms 80ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.boot-logo-facet-b {
  fill: url("#boot-facet-b-gradient");
  animation: boot-facet-b-in 780ms 150ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.boot-logo-facet-c {
  fill: url("#boot-facet-c-gradient");
  animation: boot-facet-c-in 820ms 220ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.boot-logo-aperture {
  fill: #0b0e0e;
  stroke: var(--amber);
  stroke-width: 1.2px;
  vector-effect: non-scaling-stroke;
  animation: boot-aperture-in 500ms 430ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.boot-signal {
  position: absolute;
  left: 50%;
  bottom: 28%;
  width: 20%;
  height: 1px;
  overflow: hidden;
  background: rgba(161, 171, 167, 0.18);
  transform: translateX(-50%);
}

.boot-signal::after {
  position: absolute;
  inset: 0;
  width: 28%;
  background: linear-gradient(90deg, transparent, var(--amber), transparent);
  box-shadow: 0 0 15px rgba(210, 173, 104, 0.64);
  content: "";
  animation: boot-signal-pass 1050ms ease-in-out infinite;
}

.boot-intro.is-opening .boot-veil {
  animation: boot-center-reveal 1120ms 70ms cubic-bezier(0.7, 0, 0.2, 1) forwards;
}

.boot-intro.is-opening .boot-logo-facet-a {
  animation: boot-facet-a-out 1050ms cubic-bezier(0.55, 0, 0.2, 1) forwards;
}

.boot-intro.is-opening .boot-logo-facet-b {
  animation: boot-facet-b-out 1050ms cubic-bezier(0.55, 0, 0.2, 1) forwards;
}

.boot-intro.is-opening .boot-logo-facet-c {
  animation: boot-facet-c-out 1050ms cubic-bezier(0.55, 0, 0.2, 1) forwards;
}

.boot-intro.is-opening .boot-logo-aperture {
  animation: boot-aperture-out 920ms cubic-bezier(0.55, 0, 0.2, 1) forwards;
}

.boot-intro.is-opening .boot-symbol-stage::before,
.boot-intro.is-opening .boot-symbol-stage::after,
.boot-intro.is-opening .boot-signal {
  opacity: 0;
  transition: opacity 260ms ease;
}

@keyframes boot-symbol-settle {
  0% { opacity: 0; transform: rotate(-8deg) scale(0.82); }
  100% { opacity: 1; transform: rotate(0) scale(1); }
}

@keyframes boot-facet-a-in {
  0% { opacity: 0; transform: translate(58%, 42%) rotate(32deg) scale(0.18); }
  100% { opacity: 1; transform: none; }
}

@keyframes boot-facet-b-in {
  0% { opacity: 0; transform: translate(-52%, 38%) rotate(-35deg) scale(0.16); }
  100% { opacity: 1; transform: none; }
}

@keyframes boot-facet-c-in {
  0% { opacity: 0; transform: translate(12%, -58%) rotate(24deg) scale(0.15); }
  100% { opacity: 1; transform: none; }
}

@keyframes boot-aperture-in {
  0% { opacity: 0; transform: scale(0); }
  70% { opacity: 1; transform: scale(1.4); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes boot-facet-a-out {
  0% { opacity: 1; transform: none; }
  35% { opacity: 1; }
  100% { opacity: 0; transform: translate(-44vw, -38vh) rotate(-28deg) scale(4.3); }
}

@keyframes boot-facet-b-out {
  0% { opacity: 1; transform: none; }
  35% { opacity: 1; }
  100% { opacity: 0; transform: translate(46vw, -34vh) rotate(31deg) scale(4.4); }
}

@keyframes boot-facet-c-out {
  0% { opacity: 1; transform: none; }
  35% { opacity: 1; }
  100% { opacity: 0; transform: translate(2vw, 48vh) rotate(-14deg) scale(4.7); }
}

@keyframes boot-aperture-out {
  0% { fill: #0b0e0e; opacity: 1; stroke: var(--amber); transform: scale(1); }
  24% { fill: transparent; opacity: 1; stroke: var(--amber); transform: scale(1.5); }
  44% { fill: transparent; opacity: 0; stroke: transparent; transform: scale(2.35); }
  100% { fill: transparent; opacity: 0; stroke: transparent; transform: scale(2.35); }
}

@keyframes boot-center-reveal {
  0% { --boot-reveal: 0px; opacity: 1; }
  78% { opacity: 1; }
  100% { --boot-reveal: 150vmax; opacity: 0; }
}

@keyframes boot-orbit-turn {
  to { transform: translate(-50%, -50%) rotate(360deg) scaleY(0.28); }
}

@keyframes boot-node-pulse {
  to { background: var(--amber); transform: translate(-50%, -50%) scale(0.7); }
}

@keyframes boot-signal-pass {
  0% { opacity: 0; transform: translateX(-110%); }
  24%, 76% { opacity: 1; }
  100% { opacity: 0; transform: translateX(360%); }
}

.deck-slide {
  background: transparent;
  border-bottom-color: rgba(244, 244, 238, 0.09);
}

.product-slide,
.scope-slide,
.evidence-slide,
.security-slide,
.demo-slide {
  background: transparent;
}

.product-slide::before,
.scope-slide::before,
.evidence-slide::before,
.security-slide::before,
.demo-slide::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(90deg, rgba(5, 7, 8, 0.34), transparent 48%, rgba(5, 7, 8, 0.14));
  content: "";
  pointer-events: none;
}

.eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  color: rgba(244, 244, 238, 0.78);
  font-family: "IBM Plex Sans", Arial, sans-serif;
  font-size: 9px;
  font-weight: 600;
}

.eyebrow::before {
  width: 22px;
  height: 1px;
  flex: 0 0 auto;
  background: var(--amber);
  content: "";
}

.product-heading h2,
.scope-copy h2,
.evidence-heading h2,
.security-copy h2,
.demo-copy h2,
.security-slides h2,
.hero h1,
.hero-statement {
  font-family: "Mona Sans", Arial, sans-serif;
  letter-spacing: 0;
}

.product-heading h2,
.scope-copy h2,
.evidence-heading h2,
.security-copy h2,
.demo-copy h2 {
  font-weight: 560;
}

.hero h1 {
  font-weight: 640;
}

.hero-statement {
  font-weight: 430;
}

.scope-prompt span {
  color: rgba(244, 244, 238, 0.76);
}

.scope-output-line b:last-child {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-color: rgba(210, 173, 104, 0.62);
  color: var(--paper);
}

.scope-output-line b:last-child::after {
  color: var(--amber);
  content: "\221E";
  font-size: 13px;
  font-weight: 400;
}

.document-machine {
  isolation: isolate;
}

.document-plane,
.output-plane {
  border-color: rgba(177, 187, 183, 0.38);
  background: rgba(13, 17, 17, 0.9);
  box-shadow:
    0 34px 90px rgba(0, 0, 0, 0.42),
    0 0 0 1px rgba(244, 244, 238, 0.025) inset;
  backdrop-filter: blur(8px);
}

.machine-core {
  overflow: hidden;
  border-color: rgba(244, 244, 238, 0.72);
  background: rgba(9, 12, 12, 0.96);
  box-shadow:
    0 26px 70px rgba(0, 0, 0, 0.56),
    12px 14px 0 rgba(18, 23, 22, 0.8);
}

.machine-core::before,
.machine-core::after {
  position: absolute;
  width: 30px;
  height: 1px;
  background: var(--amber);
  content: "";
}

.machine-core::before { left: -7px; top: 12px; transform: rotate(-45deg); }
.machine-core::after { right: -7px; bottom: 12px; transform: rotate(-45deg); }

.output-file-stream {
  position: absolute;
  z-index: 7;
  right: 19%;
  bottom: 10%;
  width: 260px;
  height: 190px;
  pointer-events: none;
  transform: translateZ(100px);
}

.output-file-stream i {
  position: absolute;
  right: 8%;
  bottom: 5%;
  width: 44px;
  height: 60px;
  border: 1px solid rgba(210, 173, 104, 0.55);
  background:
    linear-gradient(90deg, transparent 26%, rgba(244, 244, 238, 0.08) 27% 29%, transparent 30%),
    repeating-linear-gradient(to bottom, transparent 0 8px, rgba(244, 244, 238, 0.08) 9px 10px),
    #121716;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.42);
  opacity: 0;
  animation: artifact-flight 6.6s cubic-bezier(0.34, 0.02, 0.18, 1) infinite;
}

.output-file-stream i:nth-child(2) { animation-delay: -1.1s; }
.output-file-stream i:nth-child(3) { animation-delay: -2.2s; }
.output-file-stream i:nth-child(4) { animation-delay: -3.3s; }
.output-file-stream i:nth-child(5) { animation-delay: -4.4s; }
.output-file-stream i:nth-child(6) { animation-delay: -5.5s; }

.output-files {
  z-index: 9;
  isolation: isolate;
}

.output-file-stack {
  position: absolute;
  z-index: -1;
  inset: -18px -24px -20px -30px;
  pointer-events: none;
}

.output-file-stack em {
  position: absolute;
  right: 14px;
  bottom: 10px;
  width: 76px;
  height: 102px;
  border: 1px solid rgba(143, 153, 149, 0.26);
  background: rgba(15, 19, 19, 0.74);
  transform-origin: 50% 110%;
}

.output-file-stack em:nth-child(1) { transform: translate(-136px, 5px) rotate(-24deg); }
.output-file-stack em:nth-child(2) { transform: translate(-102px, -10px) rotate(-16deg); }
.output-file-stack em:nth-child(3) { transform: translate(-67px, -18px) rotate(-9deg); }
.output-file-stack em:nth-child(4) { transform: translate(-32px, -18px) rotate(-3deg); }
.output-file-stack em:nth-child(5) { transform: translate(4px, -10px) rotate(6deg); }

.output-file-stack em:nth-child(1) {
  background: repeating-linear-gradient(to bottom, #111615 0 9px, rgba(244, 244, 238, 0.08) 10px);
}

.output-file-stack em:nth-child(2) {
  background-image:
    linear-gradient(rgba(244, 244, 238, 0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(244, 244, 238, 0.07) 1px, transparent 1px);
  background-color: #111615;
  background-size: 13px 13px;
}

.output-file-stack em:nth-child(3) {
  background:
    linear-gradient(90deg, rgba(210, 173, 104, 0.16) 0 22%, transparent 22%),
    repeating-linear-gradient(to bottom, #111615 0 12px, rgba(244, 244, 238, 0.07) 13px);
}

.output-file-stack em:nth-child(4) {
  background:
    linear-gradient(90deg, transparent 0 18%, rgba(244, 244, 238, 0.08) 18% 20%, transparent 20% 54%, rgba(244, 244, 238, 0.08) 54% 56%, transparent 56%),
    #111615;
}

.output-file-stack em:nth-child(5) {
  background: linear-gradient(145deg, rgba(210, 173, 104, 0.11), transparent 48%), #111615;
}

.output-files span {
  position: relative;
  overflow: hidden;
  border-color: rgba(157, 169, 165, 0.46);
  background:
    repeating-linear-gradient(to bottom, transparent 0 14px, rgba(244, 244, 238, 0.04) 15px),
    rgba(17, 22, 21, 0.96);
  transition: border-color 280ms ease, transform 450ms cubic-bezier(0.16, 1, 0.3, 1);
}

.output-files span::after {
  position: absolute;
  right: -1px;
  top: -1px;
  width: 18px;
  height: 18px;
  border-left: 1px solid rgba(210, 173, 104, 0.5);
  border-bottom: 1px solid rgba(210, 173, 104, 0.5);
  background: #0c100f;
  content: "";
  clip-path: polygon(100% 0, 100% 100%, 0 0);
}

.document-machine:hover .output-files span {
  border-color: rgba(210, 173, 104, 0.58);
}

.document-machine:hover .output-files span:nth-of-type(1) { transform: translateY(-5px) rotate(-2deg); }
.document-machine:hover .output-files span:nth-of-type(2) { transform: translateY(13px); }
.document-machine:hover .output-files span:nth-of-type(3) { transform: translateY(-4px) rotate(2deg); }

@keyframes artifact-flight {
  0% {
    opacity: 0;
    transform: translate3d(-245px, -160px, -70px) scale(0.34) rotate(-18deg);
  }
  18% { opacity: 0.72; }
  68% {
    opacity: 0.72;
    transform: translate3d(-42px, -34px, 20px) scale(0.82) rotate(7deg);
  }
  100% {
    opacity: 0;
    transform: translate3d(16px, 4px, 80px) scale(1) rotate(12deg);
  }
}

.security-machine {
  isolation: isolate;
  width: calc(100% - clamp(28px, 6vw, 96px));
  margin-inline: auto;
  overflow: visible;
  perspective: 1600px;
}

.security-floor {
  inset: 9% -4% -8%;
  opacity: 0.58;
  transform: rotateX(64deg) translateY(22%);
}

.security-network,
.sv-network {
  position: absolute;
  z-index: 3;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
}

.security-network path,
.security-network circle,
.sv-network path,
.sv-network circle {
  vector-effect: non-scaling-stroke;
}

.security-track,
.sv-track {
  fill: none;
  stroke: rgba(151, 163, 159, 0.38);
  stroke-width: 1;
}

.security-signal,
.sv-signal {
  fill: none;
  stroke: var(--amber);
  stroke-width: 2;
  stroke-dasharray: 0.08 0.92;
  stroke-dashoffset: 1;
  filter: drop-shadow(0 0 6px rgba(210, 173, 104, 0.75));
  animation: security-route 4.8s linear infinite;
}

.security-signal.route-b,
.sv-signal.route-b { animation-delay: -1.6s; }
.security-signal.route-c,
.sv-signal.route-c { animation-delay: -3.2s; }

.security-network circle,
.sv-network circle {
  fill: #111615;
  stroke: rgba(210, 173, 104, 0.7);
  stroke-width: 1;
}

.security-node {
  z-index: 5;
  left: auto;
  width: min(36%, 360px);
  height: 92px;
  border-color: rgba(155, 166, 162, 0.52);
  background:
    linear-gradient(135deg, rgba(244, 244, 238, 0.035), transparent 42%),
    rgba(13, 18, 17, 0.94);
  box-shadow:
    0 24px 62px rgba(0, 0, 0, 0.46),
    9px 11px 0 rgba(13, 17, 16, 0.82);
  backdrop-filter: blur(9px);
  transform: perspective(1000px) rotateX(3deg) rotateY(0deg);
}

.security-node::before {
  left: 14px;
  top: 14px;
  width: 8px;
  height: 8px;
}

.security-node::after {
  position: absolute;
  right: 14px;
  bottom: 14px;
  width: 20px;
  height: 1px;
  background: currentColor;
  box-shadow: 0 0 9px currentColor;
  content: "";
  opacity: 0.55;
}

.security-customer {
  left: 0;
  top: 7%;
  color: #aab4b1;
  transform: perspective(1000px) rotateY(5deg) translateZ(20px);
}

.security-service {
  right: 0;
  top: 28%;
  color: #d2ad68;
  border-color: rgba(210, 173, 104, 0.62);
  transform: perspective(1000px) rotateY(-5deg) translateZ(70px);
}

.security-api {
  left: 5%;
  top: 52%;
  color: #a8b6b8;
  border-color: rgba(139, 158, 161, 0.58);
  transform: perspective(1000px) rotateY(5deg) translateZ(110px);
}

.security-review {
  right: 0;
  top: 74%;
  color: #b6c2b5;
  border-color: rgba(159, 179, 158, 0.58);
  transform: perspective(1000px) rotateY(-5deg) translateZ(40px);
}

.security-machine:hover .security-customer {
  transform: perspective(1000px) rotateY(3deg) translate3d(7px, -4px, 38px);
}

.security-machine:hover .security-service {
  transform: perspective(1000px) rotateY(-3deg) translate3d(-7px, -4px, 92px);
}

.security-machine:hover .security-api {
  transform: perspective(1000px) rotateY(3deg) translate3d(7px, -4px, 132px);
}

.security-machine:hover .security-review {
  transform: perspective(1000px) rotateY(-3deg) translate3d(-7px, -4px, 62px);
}

.security-orbit {
  z-index: 1;
  top: 51%;
  width: min(46%, 330px);
  border-color: rgba(210, 173, 104, 0.24);
  box-shadow:
    0 0 0 28px rgba(146, 157, 153, 0.035),
    0 0 0 70px rgba(146, 157, 153, 0.02);
  transform: translate(-50%, -50%) rotateX(70deg);
}

@keyframes security-route {
  to { stroke-dashoffset: 0; }
}

.security-dialog {
  overflow: hidden;
  border-color: rgba(167, 177, 173, 0.42);
  background: rgba(12, 16, 15, 0.96);
  box-shadow: 0 48px 150px rgba(0, 0, 0, 0.82);
}

.security-dialog > header span,
.security-slides article > span,
.security-visual > strong {
  color: rgba(244, 244, 238, 0.78);
  font-family: "IBM Plex Sans", Arial, sans-serif;
  font-weight: 600;
}

.security-visual {
  background:
    linear-gradient(145deg, rgba(244, 244, 238, 0.025), transparent 44%),
    rgba(9, 13, 12, 0.72);
}

.security-visual-floor {
  opacity: 0.42;
}

.sv-network {
  z-index: 2;
}

.sv-node {
  z-index: 4;
  width: 180px;
  min-height: 78px;
  border-color: rgba(151, 163, 159, 0.44);
  background:
    linear-gradient(135deg, rgba(244, 244, 238, 0.035), transparent 46%),
    rgba(13, 18, 17, 0.96);
  box-shadow:
    0 20px 55px rgba(0, 0, 0, 0.4),
    7px 8px 0 rgba(11, 15, 14, 0.72);
}

.sv-node::before,
.sv-node::after {
  position: absolute;
  width: 12px;
  height: 12px;
  content: "";
  opacity: 0.66;
}

.sv-node::before {
  left: 8px;
  top: 8px;
  border-top: 1px solid var(--amber);
  border-left: 1px solid var(--amber);
}

.sv-node::after {
  right: 8px;
  bottom: 8px;
  border-right: 1px solid var(--amber);
  border-bottom: 1px solid var(--amber);
}

.sv-customer {
  left: 6%;
  top: 7%;
  transform: translateZ(20px);
}

.sv-service {
  right: 6%;
  top: 27%;
  transform: translateZ(88px);
}

.sv-api {
  left: 9%;
  bottom: 22%;
  transform: translateZ(126px);
}

.sv-review {
  right: 6%;
  bottom: 7%;
  transform: translateZ(58px);
}

.security-visual[data-step="0"] .sv-signal.route-a,
.security-visual[data-step="1"] .sv-signal.route-b,
.security-visual[data-step="2"] .sv-signal.route-b,
.security-visual[data-step="3"] .sv-signal.route-c,
.security-visual[data-step="4"] .sv-signal.route-c,
.security-visual[data-step="5"] .sv-signal.route-c {
  stroke-width: 3;
  filter: drop-shadow(0 0 8px rgba(210, 173, 104, 0.92));
}

.security-visual[data-step="0"] .sv-track.route-a,
.security-visual[data-step="1"] .sv-track.route-b,
.security-visual[data-step="2"] .sv-track.route-b,
.security-visual[data-step="3"] .sv-track.route-c,
.security-visual[data-step="4"] .sv-track.route-c,
.security-visual[data-step="5"] .sv-track.route-c {
  stroke: rgba(210, 173, 104, 0.7);
}

.security-slides h2 {
  font-weight: 560;
}

.demo-form {
  background: rgba(15, 20, 19, 0.88);
  backdrop-filter: blur(12px);
}

@media (max-width: 1180px) {
  .site-nav { gap: 13px; }
  .site-nav a { font-size: 11px; }
  .site-nav .header-cta { padding-inline: 14px; }
  .hero h1 { font-size: 68px; }
  .hero-statement { font-size: 30px; }
  .product-heading h2,
  .scope-copy h2,
  .evidence-heading h2,
  .security-copy h2,
  .demo-copy h2 { font-size: 36px; }
  .cad-app { font-size: 8px; }
  .cad-workspace { grid-template-columns: minmax(0, 1fr) 30%; }
  .cad-tool-group span:nth-last-child(1) { display: none; }
  .scope-slide,
  .security-slide,
  .demo-slide { grid-template-columns: minmax(320px, 0.8fr) minmax(440px, 1.2fr); gap: 4vw; }
  .document-machine,
  .security-machine { min-height: 560px; }
  .evidence-layout { grid-template-columns: 270px minmax(0, 1fr); gap: 4vw; }
}

@media (max-width: 860px) {
  html { scroll-snap-type: none; }
  .site-header { left: 8px; right: 8px; top: 8px; min-height: 58px; }
  .nav-toggle { display: grid; }
  .site-nav {
    position: absolute;
    left: -1px;
    right: -1px;
    top: calc(100% + 1px);
    display: none;
    align-items: stretch;
    padding: 12px;
    border: 1px solid #3a4243;
    background: #0b0e11;
    flex-direction: column;
    gap: 0;
  }
  .site-nav.is-open { display: flex; }
  .site-nav a { padding: 12px; }
  .site-nav .header-cta { justify-content: center; margin-top: 5px; }
  .language-switcher { margin-top: 8px; }
  .language-switcher select { width: 100%; height: 42px; padding-left: 12px; }
  .deck-nav { display: none; }
  .deck-slide { min-height: auto; }
  .hero { min-height: 100svh; padding: 104px 24px 140px; }
  .hero::after { background: linear-gradient(90deg, rgba(9,11,14,.98), rgba(9,11,14,.73)); }
  .hero-copy { width: 100%; }
  .hero h1 { font-size: 58px; }
  .hero-statement { font-size: 28px; }
  .hero-lead { font-size: 15px; }
  .hero-sheet { right: 6%; top: 20%; width: 88%; opacity: 0.36; }
  .hero-inspection-plane { width: 24%; }
  .hero-principles { left: 24px; right: 24px; grid-template-columns: 1fr; }
  .hero-principles div:not(:first-child) { display: none; }
  .product-slide { min-height: 100svh; padding: 84px 12px 20px; }
  .product-heading { display: block; }
  .product-heading h2 { font-size: 30px; }
  .scene-copy { margin-top: 12px; padding-left: 14px; }
  .product-theater { grid-template-rows: auto 48px; }
  .cad-app { width: 100%; min-height: 0; font-size: 5px; grid-template-rows: 12px 40px 14px minmax(0, 1fr) 25%; }
  .cad-workspace { padding: 3px; gap: 3px; grid-template-columns: 68% 32%; }
  .cad-canvas-meta { height: 18px; }
  .cad-drawing { grid-template-rows: 18px minmax(0, 1fr); }
  .cad-agent { grid-template-rows: 31px 20px minmax(0, 1fr); }
  .cad-agent > header { padding: 4px 5px; }
  .cad-chat-timeline { gap: 3px; padding: 4px; }
  .cad-chat-card { padding: 4px; border-radius: 3px; }
  .cad-composer { padding: 3px 4px; }
  .cad-composer-shell { min-height: 28px; padding: 2px; grid-template-columns: 16px minmax(0,1fr) auto; }
  .cad-composer-shell p { min-height: 22px; }
  .cad-composer-shell button { min-height: 18px; padding: 0 3px; }
  .cad-domain-row { display: none; }
  .cad-context { display: none; }
  .cad-chat-view { grid-template-rows: 18px minmax(0,1fr) auto; }
  .cad-results { margin: 0 3px 3px; grid-template-rows: 22px 16px minmax(0,1fr); }
  .cad-table-summary label,
  .cad-table-summary span:nth-child(n+4),
  .cad-table-scroll th:nth-child(2),
  .cad-table-scroll td:nth-child(2),
  .cad-table-scroll th:nth-child(4),
  .cad-table-scroll td:nth-child(4),
  .cad-table-scroll th:nth-child(7),
  .cad-table-scroll td:nth-child(7) { display: none; }
  .cad-legend span:nth-child(n+5) { display: none; }
  .product-controls { gap: 7px; grid-template-columns: minmax(0,1fr) auto; }
  .product-progress { display: none; }
  .product-scene-buttons { overflow-x: auto; }
  .product-scene-buttons button { flex: 0 0 auto; min-height: 32px; padding: 0 9px; }
  .scope-slide,
  .security-slide,
  .demo-slide { display: block; min-height: auto; padding: 94px 24px 58px; }
  .security-node { height: 72px; }
  .security-node b { font-size: 11px; }
  .security-node i { margin-top: 4px; font-size: 7px; }
  .scope-copy h2,
  .security-copy h2,
  .demo-copy h2,
  .evidence-heading h2 { font-size: 34px; }
  .document-machine,
  .security-machine {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: 520px;
    margin: 30px auto 0;
    overflow: hidden;
    contain: paint;
  }
  .evidence-slide {
    display: block;
    min-height: auto;
    padding: 94px 24px 58px;
  }
  .evidence-heading { display: block; }
  .evidence-heading > p { margin-top: 18px; }
  .evidence-heading,
  .evidence-layout,
  .evidence-machine {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }
  .evidence-layout { display: block; }
  .evidence-rail {
    display: grid;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    grid-template-columns: 1fr 1fr;
    margin-top: 28px;
  }
  .evidence-rail article { padding: 14px; }
  .evidence-machine { min-height: 510px; margin-top: 24px; }
  .evidence-flow {
    grid-template-columns:
      minmax(112px, 1.1fr) 22px
      minmax(112px, 1fr) 22px
      minmax(104px, 0.82fr) 22px
      minmax(120px, 1fr) 22px
      minmax(138px, 1.18fr);
  }
  .evidence-node { min-height: 220px; padding: 11px; }
  .demo-slide { padding-bottom: 150px; }
  .demo-form { margin-top: 30px; padding: 22px; }
  .site-footer { left: 24px; right: 24px; min-height: 120px; grid-template-columns: 1fr auto; gap: 12px; }
  .site-footer p { grid-column: 1 / -1; grid-row: 2; }
  .security-dialog-body { grid-template-columns: 1fr; }
  .security-visual { display: none; }
  .security-slides { padding: 34px 30px; }
  .security-slides h2 { font-size: 38px; }
}

@media (max-width: 560px) {
  .hero { padding-left: 18px; padding-right: 18px; }
  .hero h1 { font-size: 46px; }
  .hero-statement { font-size: 24px; }
  .hero-actions { align-items: stretch; flex-direction: column; }
  .hero-principles { left: 18px; right: 18px; }
  .product-heading h2 { font-size: 27px; }
  .cad-app {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    font-size: 4px;
    grid-template-rows: 8px 25px 9px minmax(0, 1fr) 24%;
  }
  .cad-workspace {
    padding: 2px;
    gap: 2px;
    grid-template-columns: minmax(0, 2.12fr) minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
  }
  .cad-mission { padding-inline: 3px; gap: 2px; }
  .cad-mission > span,
  .cad-mission > b { padding: 1px 2px; border-radius: 2px; }
  .cad-toolbar { gap: 3px; padding: 2px 3px; }
  .cad-toolbar-main { gap: 3px; }
  .cad-tool-group { gap: 1px; }
  .cad-tool-group > div { gap: 1px; }
  .cad-tool-group button,
  .cad-tool-group span,
  .cad-tool-group b { min-height: 11px; padding: 0 2px; border-radius: 2px; }
  .cad-status-strip { gap: 2px; padding-inline: 3px; }
  .cad-status-strip span { padding: 1px 2px; border-radius: 2px; }
  .cad-drawing { min-height: 0; grid-template-rows: 12px minmax(0, 1fr); }
  .cad-canvas-meta { height: 12px; gap: 2px; padding-inline: 3px; }
  .cad-canvas-meta span { padding: 1px 2px; border-radius: 2px; }
  .cad-agent { min-height: 0; grid-template-rows: 18px 12px minmax(0, 1fr); }
  .cad-agent > header { padding: 2px 3px; }
  .cad-agent > header p { display: none; }
  .cad-agent-tabs { gap: 1px; padding: 2px 3px; }
  .cad-agent-tabs button { padding-inline: 3px; border-radius: 2px; }
  .cad-agent-subhead { padding-inline: 3px; }
  .cad-chat-view { grid-template-rows: 12px minmax(0, 1fr) auto; }
  .cad-ai-view { grid-template-rows: 12px minmax(0, 1fr) 9px; }
  .cad-ai-view .exact-crop {
    width: auto;
    max-width: calc(100% - 4px);
    height: calc(100% - 4px);
    margin: 2px auto;
    justify-self: center;
  }
  .cad-bbox {
    padding: 1px 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .cad-notebook-view,
  .cad-coverage-view,
  .cad-memory-view { grid-template-rows: 12px minmax(0, 1fr); }
  .cad-notebook-view article,
  .cad-memory-view article { margin: 2px; padding: 2px; }
  .cad-chat-timeline { gap: 2px; padding: 2px; }
  .cad-chat-card { padding: 2px 3px; border-radius: 2px; }
  .cad-chat-card p { margin-top: 1px; }
  .cad-composer { padding: 2px 3px; }
  .cad-composer-shell {
    min-height: 16px;
    gap: 2px;
    padding: 1px;
    border-radius: 2px;
    grid-template-columns: 9px minmax(0, 1fr) auto;
  }
  .cad-composer-shell p { min-height: 13px; }
  .cad-composer-shell button { min-height: 10px; padding-inline: 2px; }
  .cad-composer-footer { margin-top: 1px; }
  .cad-legend { left: 3px; bottom: 2px; gap: 1px; }
  .cad-legend span { gap: 2px; padding: 1px 2px; border-radius: 3px; }
  .cad-legend i { width: 3px; height: 3px; }
  .cad-results { margin: 0 2px 2px; grid-template-rows: 14px 9px minmax(0, 1fr); }
  .cad-result-heading { padding-inline: 4px; }
  .cad-result-heading p { display: none; }
  .cad-result-heading button { min-height: 10px; padding-inline: 3px; }
  .cad-table-summary { gap: 4px; padding-inline: 4px; }
  .cad-table-scroll th,
  .cad-table-scroll td { padding: 2px 3px; }
  .cad-app[data-scene="inspect"] .cad-page,
  .cad-app[data-scene="ai-view"] .cad-page,
  .cad-app[data-scene="commit"] .cad-page { top: -31%; }
  .cad-chat-timeline { overflow: hidden; }
  .cad-session-group span:nth-child(n+2),
  .cad-view-group button:nth-child(n+4),
  .cad-pan-group { display: none; }
  .cad-agent-tabs button:nth-child(n+4) { display: none; }
  .cad-pan-group,
  .cad-agent-controls span,
  .cad-view-group button:nth-child(n+4) { display: none; }
  .scope-slide,
  .security-slide,
  .demo-slide,
  .evidence-slide { padding-left: 18px; padding-right: 18px; }
  .scope-prompt { grid-template-columns: 1fr; gap: 8px; }
  .document-machine,
  .security-machine {
    width: 100%;
    min-height: 430px;
    margin-top: 24px;
    overflow: hidden;
    contain: paint;
    transform: none;
  }
  .machine-core {
    left: 50%;
    top: 43%;
    width: 150px;
    height: 72px;
    transform: translateX(-50%) translateZ(120px);
  }
  .security-node { height: 60px; }
  .security-node b { font-size: 8.5px; }
  .security-node i { margin-top: 3px; font-size: 5.5px; }
  .security-node::before { left: 8px; top: 8px; width: 6px; height: 6px; }
  .security-node::after { right: 8px; bottom: 8px; width: 12px; }
  .source-drawing { width: 58%; }
  .source-protocol {
    left: 0;
    bottom: 2%;
    display: block;
    width: 43%;
    height: 146px;
    padding: 8px 8px 19px;
  }
  .mini-sheet-heading { gap: 5px; padding-bottom: 5px; }
  .mini-sheet-heading > i { width: 16px; height: 16px; font-size: 7px; }
  .mini-sheet-heading b { font-size: 6px; }
  .mini-sheet-heading small { display: none; }
  .mini-sheet-grid { margin-top: 6px; }
  .mini-sheet-grid > * { padding: 3px 2px; font-size: 4px; }
  .output-table {
    top: 8%;
    width: 50%;
    height: 190px;
    padding: 8px 8px 20px;
  }
  .mini-result-heading { padding-bottom: 5px; }
  .mini-result-heading b { font-size: 7px; }
  .mini-result-heading small { font-size: 4.5px; }
  .mini-result-heading > i { padding: 3px 4px; font-size: 4.5px; }
  .mini-result-table { font-size: 4px; }
  .mini-result-table th,
  .mini-result-table td { padding: 3px 2px; }
  .output-table > footer { padding-top: 4px; font-size: 4px; }
  .output-table > footer b { font-size: 4px; }
  .machine-aperture { width: 25%; }
  .output-file-stream { right: 2%; bottom: 5%; width: 180px; height: 140px; }
  .output-file-stream i {
    width: 32px;
    height: 44px;
    animation-name: artifact-flight-mobile;
  }
  .output-files { right: 2%; bottom: 5%; gap: 6px; }
  .output-files span { width: 50px; height: 72px; }
  .output-file-stack { inset: -10px -8px -14px -18px; }
  .output-file-stack em { right: 7px; bottom: 6px; width: 48px; height: 68px; }
  .output-file-stack em:nth-child(1) { transform: translate(-80px, 4px) rotate(-21deg); }
  .output-file-stack em:nth-child(2) { transform: translate(-60px, -5px) rotate(-14deg); }
  .output-file-stack em:nth-child(3) { transform: translate(-40px, -9px) rotate(-8deg); }
  .output-file-stack em:nth-child(4) { transform: translate(-20px, -8px) rotate(-3deg); }
  .output-file-stack em:nth-child(5) { transform: translate(0, -4px) rotate(5deg); }
  .evidence-rail {
    display: flex;
    width: 100%;
    max-width: 100%;
    margin-top: 20px;
    overflow-x: auto;
    border-top: 1px solid #343b3b;
    scrollbar-width: none;
  }
  .evidence-rail::-webkit-scrollbar { display: none; }
  .evidence-rail article {
    flex: 0 0 auto;
    padding: 10px 12px;
    border-right: 1px solid #343b3b;
    border-bottom: 0;
  }
  .evidence-rail article::before { top: 10px; bottom: 10px; }
  .evidence-rail article.is-active { transform: none; }
  .evidence-rail p { display: none; }
  .evidence-machine { width: 100%; min-height: 665px; overflow: hidden; transform: none; }
  .evidence-flow {
    width: 100%;
    min-width: 0;
    padding: 0 8px;
    grid-template-columns: 1fr;
    grid-template-rows: 112px 18px 112px 18px 112px 18px 112px 18px 112px;
  }
  .evidence-node {
    display: grid;
    min-height: 112px;
    height: 112px;
    align-content: center;
    padding: 8px 10px;
    grid-template-columns: 84px minmax(0, 1fr);
    grid-template-rows: 1fr 1fr;
    column-gap: 10px;
  }
  .evidence-node > div {
    width: 84px;
    max-height: 62px;
    margin: 0;
    grid-column: 1;
    grid-row: 1 / 3;
  }
  .evidence-node > b {
    align-self: end;
    margin-top: 0;
    grid-column: 2;
    grid-row: 1;
  }
  .evidence-node > small {
    align-self: start;
    grid-column: 2;
    grid-row: 2;
  }
  .node-document,
  .node-viewport,
  .node-model,
  .node-memory,
  .node-output { transform: none; }
  .evidence-model-core {
    width: 54px;
    height: 54px;
    transform: rotate(45deg);
  }
  .evidence-notebook-preview,
  .evidence-output-preview { min-height: 0; }
  .evidence-notebook-preview span,
  .evidence-output-preview span { padding: 4px; }
  .evidence-flow-link {
    width: 1px;
    height: 18px;
    justify-self: center;
  }
  .evidence-flow-link::before {
    right: -3px;
    top: auto;
    bottom: 0;
    transform: rotate(135deg);
  }
  .evidence-flow-link::after {
    left: -1px;
    top: -45%;
    width: 3px;
    height: 45%;
    animation-name: evidence-flow-vertical;
  }
  .field-pair { grid-template-columns: 1fr; }
  .form-action { align-items: stretch; flex-direction: column; }
  .form-action .button { width: 100%; min-width: 0; }
  .site-footer { grid-template-columns: 1fr; }
  .site-footer nav { grid-row: auto; }
  .site-footer p { display: none; }
  .security-modal { padding: 8px; }
  .security-dialog { width: 100%; height: 96vh; }
  .security-slides { padding: 26px 20px; }
  .security-slides h2 { font-size: 31px; }
  .security-dialog > footer { align-items: flex-start; padding: 10px 14px; flex-direction: column; }
  .security-dialog > footer > div { gap: 10px; }

  @keyframes artifact-flight-mobile {
    0% { opacity: 0; transform: translate3d(-150px, -104px, -40px) scale(0.34) rotate(-16deg); }
    18% { opacity: 0.72; }
    68% { opacity: 0.72; transform: translate3d(-32px, -26px, 16px) scale(0.82) rotate(6deg); }
    100% { opacity: 0; transform: translate3d(10px, 3px, 46px) scale(1) rotate(10deg); }
  }
}

/* Mobile is a readable, vertically composed CAD workspace rather than a scaled desktop frame. */
@media (max-width: 780px) {
  .hero {
    min-height: max(780px, 100svh);
    padding: 104px 18px 168px;
  }

  .hero-copy {
    width: 100%;
  }

  .hero h1 {
    font-size: 50px;
    line-height: 0.96;
  }

  .hero-statement {
    margin-top: 26px;
    font-size: 27px;
    line-height: 1.08;
  }

  .hero-lead {
    margin-top: 22px;
    font-size: 15px;
    line-height: 1.58;
  }

  .hero-actions {
    margin-top: 28px;
  }

  .hero-principles {
    left: 18px;
    right: 18px;
    bottom: 25px;
    display: grid;
    max-width: none;
    gap: 0;
    overflow: visible;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .hero-principles::-webkit-scrollbar {
    display: none;
  }

  .hero-principles div,
  .hero-principles div:not(:first-child) {
    display: block;
    min-width: 0;
    padding: 14px 10px 0 0;
  }

  .hero-principles div + div {
    padding-left: 10px;
    border-left: 1px solid rgba(151, 163, 159, 0.22);
  }

  .hero-principles dt {
    font-size: 11px;
  }

  .hero-principles dd {
    font-size: 9px;
    line-height: 1.35;
  }

  .product-slide {
    display: block;
    min-height: 0;
    padding: 94px 18px 72px;
  }

  .product-heading {
    display: block;
    width: 100%;
    margin: 0;
  }

  .product-heading h2 {
    font-size: 33px;
    line-height: 1.02;
  }

  .scene-copy {
    min-height: 106px;
    margin-top: 20px;
    padding: 14px 0 0;
    border-top: 1px solid rgba(151, 163, 159, 0.28);
    border-left: 0;
  }

  .scene-copy strong {
    font-size: 15px;
  }

  .scene-copy p {
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.5;
  }

  .product-theater {
    display: block;
    min-height: 0;
    margin-top: 26px;
  }

  .cad-app {
    width: 100%;
    max-width: none;
    height: 900px;
    min-height: 0;
    margin: 0;
    aspect-ratio: auto;
    align-self: auto;
    border-radius: 3px;
    font-size: 8px;
    grid-template-rows: 24px 68px 24px minmax(0, 1fr) 180px;
  }

  .cad-mission,
  .cad-toolbar,
  .cad-status-strip,
  .cad-canvas-meta,
  .cad-agent-tabs,
  .cad-domain-row,
  .cad-context,
  .cad-table-summary,
  .cad-table-scroll {
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .cad-mission::-webkit-scrollbar,
  .cad-toolbar::-webkit-scrollbar,
  .cad-status-strip::-webkit-scrollbar,
  .cad-canvas-meta::-webkit-scrollbar,
  .cad-agent-tabs::-webkit-scrollbar,
  .cad-domain-row::-webkit-scrollbar,
  .cad-context::-webkit-scrollbar,
  .cad-table-summary::-webkit-scrollbar,
  .cad-table-scroll::-webkit-scrollbar {
    display: none;
  }

  .cad-mission {
    gap: 5px;
    overflow-x: auto;
    padding: 0 6px;
  }

  .cad-mission > span,
  .cad-mission > b {
    display: inline-flex;
    min-height: 15px;
    align-items: center;
    padding: 1px 4px;
    border-radius: 3px;
    font-size: 6.5px;
  }

  .cad-led {
    width: 6px;
    height: 6px;
  }

  .cad-toolbar {
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    gap: 10px;
    overflow-x: auto;
    padding: 7px 7px 6px;
  }

  .cad-toolbar-main {
    flex: 0 0 auto;
    gap: 8px;
  }

  .cad-tool-group {
    flex: 0 0 auto;
    gap: 3px;
  }

  .cad-tool-group small {
    font-size: 6px;
  }

  .cad-tool-group > div {
    gap: 3px;
  }

  .cad-tool-group button,
  .cad-tool-group span,
  .cad-tool-group b {
    display: inline-flex;
    min-height: 24px;
    padding: 0 6px;
    border-radius: 4px;
    font-size: 6.5px;
  }

  .cad-agent-controls {
    flex: 0 0 auto;
    justify-items: start;
  }

  .cad-session-group span:nth-child(n+2),
  .cad-view-group button:nth-child(n+4),
  .cad-pan-group,
  .cad-agent-controls span,
  .cad-pan-group,
  .cad-agent-tabs button:nth-child(n+4) {
    display: inline-flex;
  }

  .cad-status-strip {
    gap: 4px;
    overflow-x: auto;
    padding: 0 6px;
  }

  .cad-status-strip span {
    padding: 2px 5px;
    border-radius: 3px;
    font-size: 6.5px;
  }

  .cad-workspace {
    grid-template-columns: 1fr;
    grid-template-rows: minmax(230px, 0.92fr) minmax(260px, 1.08fr);
    gap: 5px;
    padding: 5px;
  }

  .cad-drawing {
    grid-template-rows: 25px minmax(0, 1fr);
  }

  .cad-canvas-meta {
    height: 25px;
    gap: 4px;
    overflow-x: auto;
    padding: 0 5px;
  }

  .cad-canvas-meta span {
    padding: 2px 5px;
    border-radius: 3px;
    font-size: 6.5px;
  }

  .cad-page {
    width: 92%;
  }

  .cad-app[data-scene="inspect"] .cad-page,
  .cad-app[data-scene="ai-view"] .cad-page,
  .cad-app[data-scene="commit"] .cad-page {
    left: 116%;
    top: -2%;
  }

  .cad-legend {
    right: 5px;
    left: 5px;
    bottom: 4px;
    max-width: none;
    flex-wrap: nowrap;
    gap: 3px;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .cad-legend::-webkit-scrollbar {
    display: none;
  }

  .cad-legend span,
  .cad-legend span:nth-child(n+5) {
    display: inline-flex;
    flex: 0 0 auto;
    padding: 2px 5px;
    font-size: 6px;
  }

  .cad-agent {
    max-width: 100%;
    grid-template-rows: 48px 30px minmax(0, 1fr);
  }

  .cad-agent > header {
    padding: 7px 8px;
  }

  .cad-agent > header strong {
    font-size: 9px;
  }

  .cad-agent > header p {
    display: -webkit-box;
    margin-top: 3px;
    overflow: hidden;
    font-size: 6.5px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .cad-agent-tabs {
    gap: 3px;
    overflow-x: auto;
    padding: 4px 6px;
  }

  .cad-agent-tabs button,
  .cad-agent-tabs button:nth-child(n+4) {
    display: inline-block;
    min-height: 18px;
    padding: 0 6px;
    border-radius: 3px;
    font-size: 6.5px;
  }

  .cad-chat-view {
    grid-template-rows: 23px minmax(0, 1fr) auto 18px;
  }

  .cad-agent-subhead {
    padding: 0 7px;
  }

  .cad-agent-subhead strong {
    font-size: 8px;
  }

  .cad-agent-subhead span {
    font-size: 6px;
  }

  .cad-chat-timeline {
    gap: 4px;
    overflow-y: auto;
    padding: 5px;
  }

  .cad-chat-card {
    padding: 5px 6px;
    border-radius: 4px;
  }

  .cad-chat-card header b {
    font-size: 7px;
  }

  .cad-chat-card time,
  .cad-chat-card small {
    font-size: 5.75px;
  }

  .cad-chat-card p {
    margin-top: 3px;
    font-size: 7px;
    line-height: 1.35;
  }

  .cad-chat-card footer {
    margin-top: 4px;
  }

  .cad-chat-card footer span {
    padding: 2px 4px;
    font-size: 5.5px;
  }

  .cad-domain-row {
    display: flex;
    gap: 3px;
    margin-bottom: 4px;
    overflow-x: auto;
  }

  .cad-domain-row span {
    flex: 0 0 auto;
    padding: 2px 6px;
    font-size: 6px;
  }

  .cad-composer {
    padding: 5px 6px 4px;
  }

  .cad-composer-shell {
    min-height: 48px;
    gap: 4px;
    padding: 4px;
    border-radius: 4px;
    grid-template-columns: 22px minmax(0, 1fr) auto;
  }

  .cad-composer-shell p {
    min-height: 40px;
    font-size: 7px;
    line-height: 1.3;
  }

  .cad-composer-shell button {
    min-height: 24px;
    padding: 0 6px;
    font-size: 6.5px;
  }

  .cad-composer-footer {
    margin-top: 3px;
    font-size: 6px;
  }

  .cad-context {
    display: flex;
    min-height: 18px;
    gap: 12px;
    justify-content: flex-start;
    overflow-x: auto;
    padding: 0 7px;
    font-size: 5.75px;
    white-space: nowrap;
  }

  .cad-ai-view {
    grid-template-rows: 23px minmax(0, 1fr) 20px;
  }

  .cad-ai-view .exact-crop {
    width: auto;
    max-width: calc(100% - 12px);
    height: calc(100% - 12px);
    margin: 6px auto;
  }

  .cad-bbox {
    padding: 4px 7px;
    font-size: 6px;
  }

  .cad-notebook-view,
  .cad-coverage-view,
  .cad-memory-view {
    grid-template-rows: 23px minmax(0, 1fr);
  }

  .cad-notebook-view article,
  .cad-memory-view article {
    margin: 6px;
    padding: 7px;
  }

  .cad-notebook-view article b,
  .cad-memory-view article b {
    font-size: 7px;
  }

  .cad-notebook-view article p,
  .cad-memory-view article p,
  .cad-coverage-view > p {
    margin-top: 4px;
    font-size: 7px;
  }

  .cad-notebook-view article small {
    font-size: 6px;
  }

  .cad-results {
    margin: 0 5px 5px;
    grid-template-rows: 35px 24px minmax(0, 1fr);
  }

  .cad-result-heading {
    padding: 0 7px;
  }

  .cad-result-heading strong {
    font-size: 8px;
  }

  .cad-result-heading p {
    display: -webkit-box;
    max-width: 230px;
    margin-top: 2px;
    overflow: hidden;
    font-size: 5.75px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .cad-result-heading button {
    min-height: 22px;
    padding: 0 7px;
    font-size: 6.5px;
  }

  .cad-table-summary {
    gap: 9px;
    overflow-x: auto;
    padding: 0 7px;
    font-size: 6px;
  }

  .cad-table-summary label,
  .cad-table-summary span:nth-child(n+4) {
    display: block;
    flex: 0 0 auto;
  }

  .cad-table-summary label {
    min-width: 120px;
    margin-left: 0;
  }

  .cad-table-scroll {
    overflow-x: auto;
    overflow-y: hidden;
  }

  .cad-table-scroll table {
    width: 720px;
    min-width: 720px;
  }

  .cad-table-scroll th,
  .cad-table-scroll td {
    display: table-cell;
    padding: 5px 6px;
    font-size: 6.5px;
  }

  .cad-table-scroll th:nth-child(2),
  .cad-table-scroll td:nth-child(2),
  .cad-table-scroll th:nth-child(4),
  .cad-table-scroll td:nth-child(4),
  .cad-table-scroll th:nth-child(7),
  .cad-table-scroll td:nth-child(7) {
    display: table-cell;
  }

  .cad-empty-row td {
    white-space: normal;
  }

  .product-controls {
    display: grid;
    width: 100%;
    margin-top: 12px;
    gap: 8px 10px;
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .product-scene-buttons {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 3px;
  }

  .product-scene-buttons button {
    min-width: 0;
    min-height: 34px;
    padding: 0 2px;
    font-size: 8px;
  }

  .product-progress {
    display: block;
  }

  .product-play {
    min-height: 32px;
    padding: 0 10px;
    font-size: 8px;
  }

  .scope-slide,
  .security-slide,
  .demo-slide,
  .evidence-slide {
    min-height: 0;
    padding: 92px 18px 72px;
  }

  .scope-copy h2,
  .security-copy h2,
  .demo-copy h2,
  .evidence-heading h2 {
    font-size: 33px;
    line-height: 1.04;
  }

  .scope-copy > p:not(.eyebrow),
  .security-copy > p:not(.eyebrow),
  .demo-copy > p:not(.eyebrow),
  .evidence-heading > p {
    margin-top: 20px;
    font-size: 15px;
    line-height: 1.62;
  }

  .scope-copy > p.scope-detail {
    margin-top: 13px;
    font-size: 13px;
    line-height: 1.6;
  }

  .scope-prompt {
    margin-top: 30px;
    padding: 15px 0;
  }

  .scope-prompt strong {
    min-height: 0;
    font-size: 14px;
  }

  .scope-output-line {
    margin-top: 16px;
  }

  .document-machine,
  .security-machine {
    min-height: 500px;
    margin-top: 30px;
  }

  .mini-sheet-heading small {
    display: block;
  }

  .evidence-heading {
    margin-bottom: 0;
  }

  .evidence-layout {
    margin-top: 26px;
  }

  .evidence-rail {
    display: flex;
    margin-top: 0;
    gap: 0;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
  }

  .evidence-rail article {
    flex: 0 0 100%;
    min-width: 0;
    padding: 13px 14px 14px;
    scroll-snap-align: start;
  }

  .evidence-rail p {
    display: block;
    margin-top: 7px;
    font-size: 10px;
    line-height: 1.45;
  }

  .evidence-machine {
    min-height: 685px;
    margin-top: 22px;
  }

  .evidence-flow {
    grid-template-rows: 116px 18px 116px 18px 116px 18px 116px 18px 116px;
  }

  .evidence-node {
    min-height: 116px;
    height: 116px;
  }

  .demo-form {
    margin-top: 28px;
    padding: 20px;
  }

  .security-modal {
    padding: 8px;
  }

  .security-dialog {
    width: 100%;
    height: calc(100svh - 16px);
    max-height: none;
    grid-template-rows: 58px minmax(0, 1fr) 84px;
  }

  .security-dialog > header {
    padding: 0 14px;
  }

  .security-dialog > header button {
    width: 36px;
    height: 36px;
  }

  .security-dialog-body {
    grid-template-columns: 1fr;
    grid-template-rows: 210px minmax(0, 1fr);
  }

  .security-visual {
    display: block;
    min-height: 0;
    border-right: 0;
    border-bottom: 1px solid #303839;
  }

  .sv-node {
    width: 120px;
    min-height: 50px;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.42), 4px 5px 0 rgba(11, 15, 14, 0.72);
  }

  .sv-node b {
    font-size: 7px;
  }

  .sv-node small {
    margin-top: 3px;
    font-size: 6px;
  }

  .sv-customer { left: 5%; top: 8%; }
  .sv-service { right: 5%; top: 26%; }
  .sv-api { left: 8%; bottom: 20%; }
  .sv-review { right: 5%; bottom: 7%; }

  .security-visual > strong {
    left: 12px;
    bottom: 9px;
    font-size: 7px;
  }

  .security-slides {
    min-height: 0;
    overflow-y: auto;
    padding: 26px 22px 30px;
  }

  .security-slides h2 {
    margin-top: 12px;
    font-size: 30px;
    line-height: 1.06;
  }

  .security-slides p {
    margin-top: 18px;
    font-size: 13px;
    line-height: 1.55;
  }

  .security-slides ul {
    margin-top: 20px;
  }

  .security-slides li {
    padding: 10px 0;
    font-size: 11px;
    line-height: 1.45;
  }

  .security-dialog > footer {
    display: grid;
    align-items: center;
    padding: 8px 12px;
    gap: 6px;
    grid-template-columns: 1fr;
    grid-template-rows: 24px 36px;
  }

  .security-dialog > footer > div {
    display: flex;
    width: 100%;
    flex-wrap: nowrap;
    gap: 14px;
    overflow-x: auto;
    scrollbar-width: none;
    white-space: nowrap;
  }

  .security-dialog > footer > div::-webkit-scrollbar {
    display: none;
  }

  .security-dialog > footer nav {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 480px) {
  html[lang="cs"] .product-heading h2,
  html[lang="de"] .product-heading h2,
  html[lang="es"] .product-heading h2 {
    font-size: 30px;
  }

  .scene-copy {
    min-height: 126px;
  }

  .cad-app {
    height: 820px;
    font-size: 8px;
    grid-template-rows: 22px 64px 22px minmax(0, 1fr) 176px;
  }

  .cad-workspace {
    grid-template-rows: minmax(230px, 0.92fr) minmax(260px, 1.08fr);
  }

  .cad-tool-group button,
  .cad-tool-group span,
  .cad-tool-group b {
    min-height: 22px;
  }

  .product-scene-buttons {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .product-scene-buttons button {
    min-height: 36px;
    font-size: 8px;
  }

  .security-dialog-body {
    grid-template-rows: 190px minmax(0, 1fr);
  }

  .sv-node {
    width: 105px;
    min-height: 44px;
  }

  .security-slides {
    padding: 22px 18px 28px;
  }

  .security-slides h2 {
    font-size: 27px;
  }
}

@media (max-width: 360px) {
  .hero h1 {
    font-size: 44px;
  }

  .hero-statement {
    font-size: 24px;
  }

  .product-heading h2,
  .scope-copy h2,
  .security-copy h2,
  .demo-copy h2,
  .evidence-heading h2 {
    font-size: 30px;
  }

  .cad-app {
    height: 800px;
    font-size: 7.5px;
    grid-template-rows: 22px 62px 22px minmax(0, 1fr) 170px;
  }

  .cad-workspace {
    grid-template-rows: minmax(218px, 0.92fr) minmax(248px, 1.08fr);
  }

  .product-scene-buttons button {
    font-size: 7.5px;
  }

  .security-dialog-body {
    grid-template-rows: 176px minmax(0, 1fr);
  }

  .sv-node {
    width: 96px;
    min-height: 42px;
  }
}

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

.legal-body {
  min-height: 100svh;
  background-color: #0b0e11;
  background-image:
    linear-gradient(rgba(121, 206, 224, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(121, 206, 224, 0.035) 1px, transparent 1px);
  background-size: 52px 52px;
}

.legal-page {
  position: relative;
  width: min(840px, calc(100% - 36px));
  margin: 0 auto;
  padding: 150px 0 110px;
}

.legal-page > .button {
  margin-bottom: 48px;
}

.legal-page h1 {
  max-width: 720px;
  margin: 0;
  color: var(--paper);
  font-size: 64px;
  font-weight: 600;
  line-height: 1;
}

.legal-page h1 + p {
  margin-top: 30px;
  color: #b2bbb9;
  font-size: 17px;
  line-height: 1.65;
}

.legal-page h2 {
  margin: 58px 0 0;
  padding-top: 18px;
  border-top: 1px solid #374041;
  color: var(--paper);
  font-size: 24px;
  font-weight: 550;
}

.legal-page p,
.legal-page li {
  color: #939e9c;
  font-size: 14px;
  line-height: 1.7;
}

.legal-page p {
  margin: 16px 0 0;
}

.legal-page ul {
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.legal-page li {
  padding: 11px 0;
  border-bottom: 1px solid #2a3233;
}

@media (max-width: 560px) {
  .legal-page { padding: 112px 0 76px; }
  .legal-page > .button { margin-bottom: 34px; }
  .legal-page h1 { font-size: 42px; }
  .legal-page h1 + p { font-size: 15px; }
  .legal-page h2 { margin-top: 42px; font-size: 21px; }
}

/* Mobile scenes are composed for a phone instead of shrinking the desktop stage. */
@media (max-width: 780px) {
  .product-slide {
    padding-right: 14px;
    padding-bottom: 54px;
    padding-left: 14px;
  }

  .product-heading,
  .product-theater {
    width: 100%;
    max-width: 520px;
    margin-right: auto;
    margin-left: auto;
  }

  .cad-app,
  .document-machine,
  .evidence-machine,
  .security-machine {
    scroll-margin-top: 78px;
  }

  .scene-copy {
    min-height: 104px;
  }

  .cad-app {
    height: 760px;
    font-size: 9px;
    grid-template-rows: 44px 60px 40px minmax(0, 1fr) 150px;
  }

  .cad-mission {
    display: flex;
    align-content: center;
    align-items: center;
    gap: 3px;
    overflow: hidden;
    padding: 4px 6px;
    white-space: normal;
    flex-wrap: wrap;
  }

  .cad-mission > span,
  .cad-mission > b {
    min-height: 15px;
    padding: 1px 4px;
    font-size: 6.5px;
    white-space: nowrap;
  }

  .cad-mission .cad-mission-state {
    max-width: 100%;
    flex: 1 1 112px;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .cad-toolbar {
    display: block;
    overflow: hidden;
    padding: 6px;
  }

  .cad-toolbar-main {
    display: grid;
    width: 100%;
    gap: 6px;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  }

  .cad-tool-group {
    width: 100%;
    min-width: 0;
  }

  .cad-tool-group > div {
    width: 100%;
    min-width: 0;
    overflow: hidden;
  }

  .cad-tool-group button,
  .cad-tool-group span,
  .cad-tool-group b {
    min-width: 0;
    min-height: 24px;
    padding: 0 5px;
    overflow: hidden;
    font-size: 6.5px;
    text-overflow: ellipsis;
  }

  .cad-session-group span:nth-of-type(2),
  .cad-view-group button:nth-of-type(1),
  .cad-view-group button:nth-of-type(2),
  .cad-view-group button:nth-of-type(5),
  .cad-view-group button:nth-of-type(6),
  .cad-pan-group,
  .cad-agent-controls {
    display: none !important;
  }

  .cad-session-group .cad-command,
  .cad-session-group span:first-of-type,
  .cad-view-group button:nth-of-type(3),
  .cad-view-group button:nth-of-type(4),
  .cad-view-group b {
    display: inline-flex !important;
  }

  .cad-session-group .cad-command {
    flex: 0 0 auto;
  }

  .cad-session-group span:first-of-type,
  .cad-view-group button:nth-of-type(4) {
    flex: 1 1 auto;
  }

  .cad-status-strip {
    display: grid;
    gap: 3px;
    overflow: hidden;
    padding: 3px 6px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    white-space: normal;
  }

  .cad-status-strip span {
    display: block;
    min-width: 0;
    padding: 2px 5px;
    overflow: hidden;
    font-size: 6.5px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .cad-status-strip span:nth-child(2),
  .cad-status-strip span:nth-child(4),
  .cad-status-strip span:nth-child(7),
  .cad-status-strip span:nth-child(8) {
    display: none;
  }

  .cad-workspace {
    gap: 5px;
    padding: 5px;
    grid-template-columns: 1fr;
    grid-template-rows: 180px minmax(0, 1fr);
  }

  .cad-drawing {
    grid-template-rows: 27px minmax(0, 1fr);
  }

  .cad-canvas-meta {
    height: 27px;
    gap: 3px;
    padding: 0 5px;
  }

  .cad-canvas-meta span {
    padding: 2px 5px;
    font-size: 6.5px;
  }

  .cad-agent {
    grid-template-rows: 34px 48px minmax(0, 1fr);
  }

  .cad-agent > header {
    padding: 4px 7px;
  }

  .cad-agent > header strong {
    font-size: 10px;
  }

  .cad-agent > header p {
    margin-top: 1px;
    font-size: 6px;
    line-height: 1.15;
    -webkit-line-clamp: 1;
  }

  .cad-agent-tabs {
    display: grid;
    gap: 3px;
    overflow: hidden;
    padding: 3px 5px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .cad-agent-tabs button,
  .cad-agent-tabs button:nth-child(n+4) {
    display: block;
    width: 100%;
    min-height: 18px;
    padding: 0 3px;
    overflow: hidden;
    font-size: 6.25px;
    line-height: 1.1;
    text-overflow: ellipsis;
    white-space: normal;
  }

  .cad-chat-view {
    grid-template-rows: 24px minmax(0, 1fr) auto 18px;
  }

  .cad-chat-timeline {
    overflow-y: auto;
  }

  .cad-chat-card p,
  .cad-composer-shell p,
  .cad-notebook-view article p,
  .cad-memory-view article p {
    font-size: 7.5px;
  }

  .cad-results {
    margin: 0 5px 5px;
    grid-template-rows: 38px 24px minmax(0, 1fr);
  }

  .cad-result-heading {
    padding: 0 7px;
  }

  .cad-result-heading strong {
    font-size: 8.5px;
  }

  .cad-result-heading p {
    display: -webkit-box;
    max-width: 235px;
    font-size: 5.75px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .cad-table-summary {
    gap: 8px;
    overflow: hidden;
    padding: 0 7px;
    font-size: 6px;
  }

  .cad-table-summary label,
  .cad-table-summary span:nth-child(n+4) {
    display: none;
  }

  .cad-table-scroll {
    overflow-x: hidden;
    overflow-y: auto;
  }

  .cad-table-scroll table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
  }

  .cad-table-scroll th,
  .cad-table-scroll td {
    display: table-cell;
    padding: 5px 4px;
    overflow: hidden;
    font-size: 6.5px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .cad-table-scroll th:nth-child(2),
  .cad-table-scroll td:nth-child(2),
  .cad-table-scroll th:nth-child(4),
  .cad-table-scroll td:nth-child(4),
  .cad-table-scroll th:nth-child(6),
  .cad-table-scroll td:nth-child(6),
  .cad-table-scroll th:nth-child(7),
  .cad-table-scroll td:nth-child(7),
  .cad-table-scroll th:nth-child(9),
  .cad-table-scroll td:nth-child(9) {
    display: none;
  }

  .cad-table-scroll th:nth-child(1) { width: 14%; }
  .cad-table-scroll th:nth-child(3) { width: 25%; }
  .cad-table-scroll th:nth-child(5) { width: 45%; }
  .cad-table-scroll th:nth-child(8) { width: 16%; }

  .document-machine {
    width: 100%;
    max-width: 520px;
    height: 650px;
    min-height: 650px;
    margin: 30px auto 0;
    overflow: hidden;
    contain: layout paint;
    perspective: 1100px;
  }

  .document-machine .machine-floor {
    inset: 12% 0 0;
    opacity: 0.42;
    transform: none;
  }

  .source-drawing {
    left: 0;
    top: 20px;
    width: 100%;
    transform: none;
    animation-name: machine-drawing-mobile;
  }

  .machine-core {
    left: 50%;
    top: 178px;
    width: 178px;
    height: 74px;
    transform: translateX(-50%) translateZ(80px);
  }

  .output-table {
    right: auto;
    left: 0;
    top: 244px;
    width: 100%;
    height: 190px;
    padding: 10px 10px 23px;
    transform: none;
  }

  .mini-result-heading b {
    font-size: 8px;
  }

  .mini-result-heading small,
  .mini-result-heading > i {
    font-size: 5.5px;
  }

  .mini-result-table {
    font-size: 5px;
  }

  .mini-result-table th,
  .mini-result-table td {
    padding: 4px 3px;
  }

  .source-protocol {
    left: 0;
    top: 458px;
    bottom: auto;
    width: 55%;
    height: 156px;
    padding: 9px 9px 20px;
    transform: none;
  }

  .mini-sheet-heading b {
    font-size: 6.5px;
  }

  .mini-sheet-heading small {
    display: block;
    font-size: 5px;
  }

  .mini-sheet-grid > * {
    padding: 3px 2px;
    font-size: 4.5px;
  }

  .output-file-stream,
  .output-file-stack,
  .beam-protocol,
  .beam-files {
    display: none;
  }

  .output-files {
    right: 0;
    bottom: 37px;
    gap: 5px;
    transform: none;
  }

  .output-files span {
    width: 48px;
    height: 76px;
  }

  .output-files span:nth-child(2) {
    transform: translateY(9px);
  }

  .output-files b {
    font-size: 8px;
  }

  .output-files small {
    font-size: 5px;
  }

  .beam-source,
  .beam-output {
    left: 50%;
    width: 1px;
    height: 42px;
    transform: none;
  }

  .beam-source { top: 209px; }
  .beam-output { top: 426px; height: 36px; }

  .beam-source::after,
  .beam-output::after {
    left: -1px;
    top: -45%;
    width: 3px;
    height: 45%;
    animation: mobile-beam-y 1.8s linear infinite;
  }

  .evidence-layout {
    margin-top: 26px;
  }

  .evidence-rail {
    display: grid;
    min-height: 104px;
    overflow: hidden;
    border-top: 1px solid #343b3b;
  }

  .evidence-rail article {
    display: block;
    width: 100%;
    min-width: 0;
    padding: 14px 14px 15px;
    opacity: 0;
    pointer-events: none;
    grid-area: 1 / 1;
    transform: translateY(8px);
  }

  .evidence-rail article.is-active {
    opacity: 1;
    pointer-events: auto;
    transform: none;
  }

  .evidence-rail p {
    display: block;
    margin-top: 7px;
    font-size: 10px;
    line-height: 1.45;
  }

  .evidence-machine {
    width: 100%;
    max-width: 520px;
    height: 390px;
    min-height: 390px;
    margin: 18px auto 0;
    overflow: hidden;
  }

  .evidence-grid {
    inset: 0;
  }

  .evidence-flow {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
  }

  .evidence-node {
    position: absolute;
    inset: 18px 10px 48px;
    display: grid;
    width: auto;
    height: auto;
    min-height: 0;
    align-content: end;
    padding: 18px;
    opacity: 0;
    pointer-events: none;
    z-index: 0;
    grid-template-columns: 1fr;
    grid-template-rows: minmax(0, 1fr) auto auto;
    transform: translateY(16px) scale(0.97);
    transition: opacity 320ms ease, transform 480ms ease, border-color 300ms ease, box-shadow 300ms ease;
  }

  .evidence-node > div {
    width: 100%;
    max-height: 210px;
    margin: 0;
    grid-column: 1;
    grid-row: 1;
  }

  .evidence-node > b {
    align-self: auto;
    margin-top: 13px;
    font-size: 10px;
    grid-column: 1;
    grid-row: 2;
  }

  .evidence-node > small {
    align-self: auto;
    margin-top: 5px;
    font-size: 8px;
    grid-column: 1;
    grid-row: 3;
  }

  .evidence-document-preview,
  .evidence-viewport-preview {
    height: 186px;
    aspect-ratio: auto;
  }

  .evidence-model-core {
    width: 104px;
    height: 104px;
    margin: 30px auto 45px;
  }

  .evidence-notebook-preview,
  .evidence-output-preview {
    min-height: 176px;
  }

  .evidence-notebook-preview span,
  .evidence-output-preview span {
    padding: 10px;
  }

  .evidence-machine[data-state="document"] .node-document,
  .evidence-machine[data-state="viewport"] .node-viewport,
  .evidence-machine[data-state="model"] .node-model,
  .evidence-machine[data-state="memory"] .node-memory,
  .evidence-machine[data-state="output"] .node-output {
    opacity: 1;
    pointer-events: auto;
    z-index: 2;
    transform: none;
  }

  .evidence-flow-link {
    position: absolute;
    bottom: 20px;
    width: 18%;
    height: 2px;
    background: #405052;
  }

  .evidence-flow > .evidence-flow-link:nth-of-type(1) { left: 6%; }
  .evidence-flow > .evidence-flow-link:nth-of-type(2) { left: 29%; }
  .evidence-flow > .evidence-flow-link:nth-of-type(3) { left: 52%; }
  .evidence-flow > .evidence-flow-link:nth-of-type(4) { left: 75%; }

  .evidence-flow-link::before {
    display: none;
  }

  .evidence-flow-link::after {
    left: -45%;
    top: -1px;
    width: 45%;
    height: 3px;
    animation-name: evidence-flow;
  }

  .security-machine {
    width: 100%;
    max-width: 520px;
    height: 450px;
    min-height: 450px;
    margin: 30px auto 0;
    overflow: hidden;
    contain: layout paint;
  }

  .security-network {
    display: none;
  }

  .security-machine::before,
  .security-machine::after {
    position: absolute;
    z-index: 2;
    left: 50%;
    top: 50%;
    background: rgba(210, 173, 104, 0.5);
    box-shadow: 0 0 12px rgba(210, 173, 104, 0.24);
    content: "";
    transform: translate(-50%, -50%);
  }

  .security-machine::before {
    width: 1px;
    height: 190px;
  }

  .security-machine::after {
    width: 120px;
    height: 1px;
  }

  .security-floor {
    inset: 9% 0 0;
    opacity: 0.38;
    transform: none;
  }

  .security-node {
    width: calc(50% - 9px);
    height: 104px;
    padding: 14px 10px;
    transform: none !important;
  }

  .security-node b {
    font-size: 9px;
  }

  .security-node i {
    margin-top: 5px;
    font-size: 6.5px;
    line-height: 1.35;
  }

  .security-customer {
    left: 0;
    top: 52px;
  }

  .security-service {
    right: 0;
    top: 52px;
  }

  .security-api {
    left: 0;
    top: 276px;
  }

  .security-review {
    right: 0;
    top: 276px;
  }

  .security-orbit {
    top: 50%;
    width: 168px;
  }

  .security-machine > small {
    right: 0;
    bottom: 14px;
    left: 0;
    text-align: center;
  }
}

@media (min-width: 481px) and (max-width: 780px) {
  .document-machine {
    height: 790px;
    min-height: 790px;
  }

  .machine-core {
    top: 284px;
  }

  .output-table {
    top: 350px;
    height: 210px;
  }

  .source-protocol {
    top: 584px;
    width: 56%;
    height: 170px;
  }

  .output-files {
    bottom: 40px;
  }

  .beam-source { top: 304px; }
  .beam-output { top: 548px; }

  .mini-result-table {
    font-size: 5.8px;
  }
}

@media (max-width: 480px) {
  .scene-copy {
    min-height: 126px;
  }

  .cad-app {
    height: 760px;
    font-size: 9px;
    grid-template-rows: 44px 60px 40px minmax(0, 1fr) 150px;
  }

  .document-machine {
    height: 630px;
    min-height: 630px;
  }

  .source-protocol {
    top: 452px;
    width: 56%;
  }

  .output-files {
    bottom: 27px;
  }
}

@media (max-width: 360px) {
  .cad-app {
    height: 740px;
    font-size: 8.5px;
    grid-template-rows: 44px 58px 40px minmax(0, 1fr) 144px;
  }

  .cad-workspace {
    grid-template-rows: 170px minmax(0, 1fr);
  }

  .cad-agent-tabs button,
  .cad-agent-tabs button:nth-child(n+4) {
    font-size: 5.75px;
  }

  .document-machine {
    height: 610px;
    min-height: 610px;
  }

  .source-protocol {
    top: 448px;
    height: 148px;
  }

  .output-files {
    bottom: 18px;
  }

  .output-files span {
    width: 43px;
    height: 70px;
  }

  .security-node {
    width: calc(50% - 6px);
  }
}

@keyframes machine-drawing-mobile {
  from { transform: translateY(0); }
  to { transform: translateY(-5px); }
}

@keyframes mobile-beam-y {
  from { transform: translateY(0); }
  to { transform: translateY(325%); }
}

/* Phone experience: retain the product states, but give each state one readable focus. */
@media (max-width: 780px) {
  :root {
    --header-height: 58px;
  }

  html {
    scroll-snap-type: none;
  }

  body::after {
    opacity: 0.12;
    background-size: 40px 40px;
  }

  .site-header {
    left: 8px;
    right: 8px;
    top: 8px;
    min-height: 58px;
    padding: 0 10px 0 12px;
    transform: translateY(0);
    transition:
      opacity 220ms ease,
      transform 300ms cubic-bezier(0.22, 1, 0.36, 1),
      background 220ms ease,
      border-color 220ms ease;
  }

  .site-header.is-hidden {
    opacity: 0;
    pointer-events: none;
    transform: translateY(calc(-100% - 12px));
  }

  .brand {
    gap: 8px;
  }

  .brand-mark {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
  }

  .brand strong {
    font-size: 14px;
  }

  .brand small {
    margin-top: 1px;
    font-size: 8px;
  }

  .nav-toggle {
    width: 42px;
    height: 42px;
  }

  .site-nav {
    padding: 8px;
    background: rgba(9, 12, 14, 0.98);
  }

  .site-nav a {
    min-height: 44px;
    padding: 0 12px;
  }

  .deck-slide {
    min-height: 0;
    scroll-margin-top: 140px;
    scroll-snap-align: none;
  }

  .product-slide,
  .scope-slide,
  .evidence-slide,
  .security-slide,
  .demo-slide {
    padding: 82px 18px 50px;
  }

  .eyebrow {
    margin-bottom: 14px;
  }

  .product-heading h2,
  .scope-copy h2,
  .evidence-heading h2,
  .security-copy h2,
  .demo-copy h2 {
    font-size: 32px;
    line-height: 1.04;
  }

  .scene-copy {
    min-height: 102px;
    margin-top: 17px;
    padding-top: 13px;
  }

  .scene-copy strong {
    font-size: 14px;
  }

  .scene-copy p {
    font-size: 12px;
    line-height: 1.48;
  }

  .product-theater {
    margin-top: 16px;
  }

  .cad-app {
    height: 650px;
    border-color: #344052;
    border-radius: 3px;
    box-shadow: 0 24px 68px rgba(0, 0, 0, 0.46);
    font-size: 10px;
    grid-template-rows: 36px minmax(0, 1fr) 54px;
  }

  .cad-toolbar,
  .cad-status-strip {
    display: none;
  }

  .cad-mission {
    height: 36px;
    align-content: center;
    flex-wrap: nowrap;
    gap: 5px;
    padding: 0 8px;
    background: linear-gradient(180deg, #171d27, #10151d);
  }

  .cad-mission > span,
  .cad-mission > b {
    display: none;
    min-height: 20px;
    align-items: center;
    padding: 2px 6px;
    font-size: 7.5px;
  }

  .cad-mission > b,
  .cad-mission > span:nth-of-type(2),
  .cad-mission > span:nth-of-type(4),
  .cad-mission > .cad-mission-state {
    display: inline-flex;
  }

  .cad-mission > span:nth-of-type(2),
  .cad-mission > span:nth-of-type(4) {
    flex: 0 1 auto;
  }

  .cad-mission > .cad-mission-state {
    min-width: 0;
    flex: 1 1 auto;
    justify-content: flex-end;
  }

  .cad-led {
    width: 7px;
    height: 7px;
  }

  .cad-workspace {
    min-height: 0;
    gap: 6px;
    padding: 6px;
    grid-template-columns: 1fr;
    grid-template-rows: 232px minmax(0, 1fr);
  }

  .cad-drawing {
    min-height: 0;
    grid-template-rows: 38px minmax(0, 1fr);
  }

  .cad-canvas-meta {
    display: grid;
    height: 38px;
    align-content: center;
    gap: 3px;
    overflow: hidden;
    padding: 3px 5px;
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) minmax(0, 0.72fr);
  }

  .cad-canvas-meta span {
    display: none;
    min-width: 0;
    min-height: 13px;
    align-items: center;
    padding: 1px 4px;
    overflow: hidden;
    font-size: 7px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .cad-canvas-meta span:nth-child(1),
  .cad-canvas-meta span:nth-child(2),
  .cad-canvas-meta span:nth-child(4),
  .cad-canvas-meta span:nth-child(6) {
    display: flex;
  }

  .cad-canvas-meta span:nth-child(6) {
    grid-column: 1 / -1;
  }

  .cad-page {
    width: 94%;
    border-width: 1px;
    transform: translate(-50%, -50%) scale(0.98);
  }

  .cad-app[data-scene="inspect"] .cad-page,
  .cad-app[data-scene="ai-view"] .cad-page,
  .cad-app[data-scene="commit"] .cad-page {
    left: 118%;
    top: -5%;
    transform: translate(-50%, -50%) scale(1.9);
  }

  .cad-app[data-scene="inspect"] .cad-reticle,
  .cad-app[data-scene="ai-view"] .cad-reticle,
  .cad-app[data-scene="commit"] .cad-reticle,
  .cad-app[data-scene="inspect"] .cad-region > span,
  .cad-app[data-scene="ai-view"] .cad-region > span,
  .cad-app[data-scene="commit"] .cad-region > span {
    transform: translate(-50%, -50%) scale(0.53);
  }

  .cad-app[data-scene="inspect"] .cad-region > span,
  .cad-app[data-scene="ai-view"] .cad-region > span,
  .cad-app[data-scene="commit"] .cad-region > span {
    transform: scale(0.53);
  }

  .cad-legend {
    right: 5px;
    left: 5px;
    bottom: 5px;
    display: grid;
    max-width: none;
    gap: 3px;
    overflow: visible;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .cad-legend span,
  .cad-legend span:nth-child(n+5) {
    display: none;
  }

  .cad-legend span:nth-child(-n+4) {
    display: flex;
    min-width: 0;
    justify-content: center;
    padding: 3px 2px;
    overflow: hidden;
    border-radius: 3px;
    font-size: 6.5px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .cad-agent {
    min-height: 0;
    border-color: #313b4c;
    grid-template-rows: 40px 56px minmax(0, 1fr);
  }

  .cad-agent > header {
    padding: 6px 8px;
  }

  .cad-agent > header strong {
    font-size: 11px;
  }

  .cad-agent > header p {
    margin-top: 2px;
    font-size: 7px;
    line-height: 1.25;
    -webkit-line-clamp: 1;
  }

  .cad-agent-tabs {
    display: grid;
    gap: 3px;
    overflow: hidden;
    padding: 4px 6px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .cad-agent-tabs button,
  .cad-agent-tabs button:nth-child(n+4) {
    display: block;
    width: 100%;
    min-height: 22px;
    padding: 0 4px;
    overflow: hidden;
    font-size: 7.5px;
    line-height: 1.1;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .cad-chat-view {
    grid-template-rows: 27px minmax(0, 1fr) auto;
  }

  .cad-agent-subhead {
    padding: 0 8px;
  }

  .cad-agent-subhead strong {
    font-size: 9px;
  }

  .cad-agent-subhead span {
    font-size: 6.5px;
  }

  .cad-chat-timeline {
    gap: 5px;
    padding: 6px;
  }

  .cad-chat-card {
    padding: 6px 7px;
  }

  .cad-chat-card header b {
    font-size: 8px;
  }

  .cad-chat-card time,
  .cad-chat-card small {
    font-size: 6.25px;
  }

  .cad-chat-card p,
  .cad-composer-shell p,
  .cad-notebook-view article p,
  .cad-memory-view article p {
    font-size: 8px;
    line-height: 1.35;
  }

  .cad-chat-card footer span {
    font-size: 6px;
  }

  .cad-composer {
    padding: 5px 6px 6px;
  }

  .cad-domain-row {
    display: flex;
    gap: 3px;
    overflow: hidden;
  }

  .cad-domain-row span {
    min-width: 0;
    flex: 1 1 0;
    padding: 3px 2px;
    font-size: 6.5px;
    text-align: center;
  }

  .cad-composer-shell {
    min-height: 64px;
    padding: 5px;
    grid-template-columns: 26px minmax(0, 1fr) auto;
  }

  .cad-composer-shell p {
    min-height: 52px;
    align-content: center;
    padding: 3px 1px;
    white-space: normal;
  }

  .cad-composer-shell button {
    min-height: 32px;
    padding: 0 8px;
    font-size: 7.5px;
  }

  .cad-composer-footer {
    font-size: 6.5px;
  }

  .cad-context {
    display: none;
  }

  .cad-ai-view {
    grid-template-rows: 27px minmax(0, 1fr) 25px;
  }

  .cad-ai-view .exact-crop {
    width: auto;
    max-width: calc(100% - 14px);
    height: calc(100% - 12px);
    margin: 6px auto;
  }

  .cad-bbox {
    padding: 5px 8px;
    font-size: 7px;
  }

  .cad-notebook-view article,
  .cad-memory-view article {
    margin: 8px;
    padding: 10px;
  }

  .cad-results {
    min-height: 0;
    margin: 0 6px 6px;
    overflow: hidden;
    grid-template-rows: 48px;
  }

  .cad-result-heading {
    padding: 0 9px;
  }

  .cad-result-heading strong {
    font-size: 10px;
  }

  .cad-result-heading p {
    max-width: 245px;
    font-size: 6.75px;
    line-height: 1.28;
  }

  .cad-result-heading button {
    min-height: 28px;
    padding: 0 9px;
    font-size: 7px;
  }

  .cad-app:not([data-scene="commit"]):not([data-scene="deliver"]) .cad-table-summary,
  .cad-app:not([data-scene="commit"]):not([data-scene="deliver"]) .cad-table-scroll {
    display: none;
  }

  .cad-app[data-scene="commit"],
  .cad-app[data-scene="deliver"] {
    grid-template-rows: 36px minmax(0, 1fr) 190px;
  }

  .cad-app[data-scene="commit"] .cad-results,
  .cad-app[data-scene="deliver"] .cad-results {
    grid-template-rows: 46px 24px minmax(0, 1fr);
  }

  .cad-table-summary {
    display: flex;
    gap: 9px;
    overflow: hidden;
    padding: 0 8px;
    font-size: 7px;
  }

  .cad-table-summary label,
  .cad-table-summary span:nth-child(n+4) {
    display: none;
  }

  .cad-table-scroll {
    overflow: hidden auto;
  }

  .cad-table-scroll table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
  }

  .cad-table-scroll th,
  .cad-table-scroll td {
    padding: 6px 5px;
    font-size: 7px;
  }

  .cad-table-scroll th:nth-child(1) { width: 14%; }
  .cad-table-scroll th:nth-child(3) { width: 25%; }
  .cad-table-scroll th:nth-child(5) { width: 45%; }
  .cad-table-scroll th:nth-child(8) { width: 16%; }

  .product-controls {
    margin-top: 10px;
  }

  .product-scene-buttons {
    display: grid;
    overflow: visible;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 4px;
  }

  .product-scene-buttons button {
    min-height: 38px;
    padding: 0 4px;
    font-size: 8px;
  }

  .product-progress {
    display: block;
  }

  .product-play {
    min-height: 34px;
  }

  .scope-copy > p:not(.eyebrow),
  .security-copy > p:not(.eyebrow),
  .demo-copy > p:not(.eyebrow),
  .evidence-heading > p {
    margin-top: 18px;
    font-size: 14px;
    line-height: 1.56;
  }

  .scope-copy > p.scope-detail {
    margin-top: 12px;
    font-size: 12px;
    line-height: 1.55;
  }

  .scope-prompt {
    margin-top: 24px;
    padding: 13px 0;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 12px;
  }

  .scope-prompt strong {
    font-size: 13px;
  }

  .scope-output-line {
    gap: 6px;
    margin-top: 13px;
  }

  .scope-output-line span {
    width: 100%;
    margin: 0 0 2px;
  }

  .scope-output-line b {
    padding: 5px 7px;
    font-size: 8px;
  }

  .document-machine {
    height: 520px;
    min-height: 520px;
    margin-top: 24px;
  }

  .document-machine .machine-floor {
    inset: 0;
    opacity: 0.3;
    background-size: 28px 28px;
  }

  .source-drawing {
    left: 0;
    top: 0;
    width: 100%;
    transform: none;
  }

  .machine-core {
    left: 50%;
    top: 154px;
    width: 172px;
    height: 66px;
    transform: translateX(-50%) translateZ(60px);
  }

  .machine-core b {
    font-size: 11px;
  }

  .machine-core small {
    font-size: 8px;
  }

  .output-table {
    left: 0;
    right: auto;
    top: 212px;
    width: 100%;
    height: 160px;
    padding: 9px 9px 21px;
    transform: none;
  }

  .mini-result-heading {
    padding-bottom: 6px;
  }

  .mini-result-heading b {
    font-size: 8px;
  }

  .mini-result-heading small,
  .mini-result-heading > i {
    font-size: 5.5px;
  }

  .mini-result-table {
    font-size: 5.3px;
  }

  .mini-result-table th,
  .mini-result-table td {
    padding: 4px 3px;
  }

  .output-table > footer {
    padding-top: 5px;
    font-size: 5.5px;
  }

  .source-protocol {
    left: 0;
    top: 390px;
    bottom: auto;
    width: 57%;
    height: 116px;
    padding: 8px 8px 18px;
    transform: none;
  }

  .mini-sheet-heading {
    gap: 6px;
    padding-bottom: 5px;
  }

  .mini-sheet-heading > i {
    width: 19px;
    height: 19px;
    font-size: 8px;
  }

  .mini-sheet-heading b {
    font-size: 5.8px;
  }

  .mini-sheet-heading small {
    font-size: 4.5px;
  }

  .mini-sheet-grid {
    margin-top: 6px;
  }

  .mini-sheet-grid > * {
    padding: 2px;
    font-size: 4.2px;
  }

  .output-files {
    right: 0;
    bottom: 14px;
    gap: 4px;
    transform: none;
  }

  .output-files span {
    width: 43px;
    height: 68px;
  }

  .output-files span:nth-child(2) {
    transform: translateY(7px);
  }

  .output-files b {
    font-size: 7px;
  }

  .output-files small {
    font-size: 4.5px;
  }

  .beam-source,
  .beam-output {
    left: 50%;
    width: 1px;
    transform: none;
  }

  .beam-source {
    top: 171px;
    height: 43px;
  }

  .beam-output {
    top: 369px;
    height: 23px;
  }

  .evidence-layout {
    margin-top: 22px;
  }

  .evidence-rail {
    min-height: 94px;
  }

  .evidence-rail article {
    padding: 12px 13px 13px;
  }

  .evidence-rail b {
    font-size: 13px;
  }

  .evidence-rail p {
    font-size: 9.5px;
  }

  .evidence-machine {
    height: 310px;
    min-height: 310px;
    margin-top: 14px;
  }

  .evidence-node {
    inset: 14px 8px 42px;
    padding: 14px;
  }

  .evidence-node > div {
    max-height: 166px;
  }

  .evidence-document-preview,
  .evidence-viewport-preview {
    height: 154px;
  }

  .evidence-model-core {
    width: 90px;
    height: 90px;
    margin: 20px auto 29px;
  }

  .evidence-notebook-preview,
  .evidence-output-preview {
    min-height: 150px;
  }

  .evidence-notebook-preview span,
  .evidence-output-preview span {
    padding: 8px;
  }

  .evidence-node > b {
    margin-top: 10px;
    font-size: 9px;
  }

  .evidence-node > small {
    margin-top: 3px;
    font-size: 7px;
  }

  .evidence-flow-link {
    bottom: 17px;
  }

  .security-machine {
    height: 330px;
    min-height: 330px;
    margin-top: 24px;
  }

  .security-floor {
    inset: 0;
    opacity: 0.3;
    background-size: 28px 28px;
  }

  .security-machine::before {
    height: 122px;
  }

  .security-machine::after {
    width: 86px;
  }

  .security-node {
    width: calc(50% - 7px);
    height: 82px;
    padding: 11px 7px;
  }

  .security-node b {
    font-size: 7.5px;
  }

  .security-node i {
    margin-top: 4px;
    font-size: 5.5px;
  }

  .security-customer,
  .security-service {
    top: 32px;
  }

  .security-api,
  .security-review {
    top: 206px;
  }

  .security-orbit {
    width: 122px;
  }

  .security-machine > small {
    bottom: 9px;
    font-size: 6.5px;
  }

  .security-copy .button {
    width: 100%;
    margin-top: 28px;
  }

  .security-copy > small {
    display: block;
    margin-top: 16px;
    font-size: 9px;
    line-height: 1.45;
  }

  .demo-contact {
    margin-top: 28px;
  }

  .demo-contact a {
    overflow-wrap: anywhere;
    font-size: 16px;
  }

  .demo-form {
    gap: 14px;
    margin-top: 24px;
    padding: 18px;
  }

  .field-pair {
    gap: 12px;
  }

  .demo-form label {
    gap: 5px;
  }

  .demo-form input {
    height: 40px;
  }

  .demo-form textarea {
    min-height: 96px;
  }

  .form-action {
    align-items: stretch;
    flex-direction: column;
    gap: 10px;
  }

  .form-action .button {
    width: 100%;
    min-width: 0;
  }

  .demo-slide {
    padding-bottom: 138px;
  }
}

@media (max-width: 480px) {
  .hero {
    padding-top: 90px;
  }

  .hero h1 {
    font-size: 48px;
  }

  .product-slide,
  .scope-slide,
  .evidence-slide,
  .security-slide,
  .demo-slide {
    padding-right: 14px;
    padding-left: 14px;
  }

  .cad-app {
    height: 630px;
  }

  .cad-workspace {
    grid-template-rows: 222px minmax(0, 1fr);
  }

  .cad-mission > span:nth-of-type(2) {
    display: none;
  }

  .cad-result-heading p {
    max-width: 210px;
  }

  .document-machine {
    height: 500px;
    min-height: 500px;
  }

  .source-protocol {
    top: 382px;
    height: 108px;
  }

  .output-files {
    bottom: 12px;
  }
}

@media (max-width: 360px) {
  .product-heading h2,
  .scope-copy h2,
  .evidence-heading h2,
  .security-copy h2,
  .demo-copy h2 {
    font-size: 29px;
  }

  .cad-app {
    height: 610px;
  }

  .cad-workspace {
    grid-template-rows: 208px minmax(0, 1fr);
  }

  .cad-mission > span:nth-of-type(4) {
    display: none;
  }

  .cad-agent-tabs button,
  .cad-agent-tabs button:nth-child(n+4) {
    font-size: 6.75px;
  }

  .cad-result-heading p {
    max-width: 178px;
  }

  .document-machine {
    height: 480px;
    min-height: 480px;
  }

  .source-protocol {
    top: 370px;
    height: 102px;
  }

  .output-files span {
    width: 39px;
    height: 63px;
  }

  .security-node {
    width: calc(50% - 5px);
  }
}

/* iOS browser-sheet hardening: no fixed chrome and no transformed drawing bitmap. */
.cad-mobile-focus {
  display: none;
}

@media (max-width: 780px) {
  .site-header,
  .site-header.is-scrolled,
  .site-header.is-hidden {
    position: absolute;
    opacity: 1;
    pointer-events: auto;
    transform: none;
  }

  .cad-camera {
    display: grid;
    place-items: center;
  }

  .cad-page,
  .cad-app[data-scene="inspect"] .cad-page,
  .cad-app[data-scene="ai-view"] .cad-page,
  .cad-app[data-scene="commit"] .cad-page {
    position: relative;
    left: auto;
    top: auto;
    width: 94%;
    grid-area: 1 / 1;
    opacity: 1;
    transform: none;
    transition: opacity 180ms ease;
  }

  .cad-page > img {
    object-fit: contain;
  }

  .cad-app[data-scene="inspect"] .cad-page,
  .cad-app[data-scene="ai-view"] .cad-page,
  .cad-app[data-scene="commit"] .cad-page {
    opacity: 0;
  }

  .cad-app[data-scene="inspect"] .cad-page .cad-region,
  .cad-app[data-scene="ai-view"] .cad-page .cad-region,
  .cad-app[data-scene="commit"] .cad-page .cad-region,
  .cad-app[data-scene="inspect"] .cad-page .cad-reticle,
  .cad-app[data-scene="ai-view"] .cad-page .cad-reticle,
  .cad-app[data-scene="commit"] .cad-page .cad-reticle {
    display: none;
  }

  .cad-mobile-focus {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: block;
    width: auto;
    height: auto;
    min-height: 0;
    margin: 0;
    aspect-ratio: auto !important;
    opacity: 0;
    border: 1px solid var(--ui-green);
    background: #eef2ef;
    pointer-events: none;
    transition: opacity 220ms ease;
  }

  .cad-app[data-scene="inspect"] .cad-mobile-focus,
  .cad-app[data-scene="ai-view"] .cad-mobile-focus,
  .cad-app[data-scene="commit"] .cad-mobile-focus {
    opacity: 1;
  }

  .cad-mobile-focus-region {
    position: absolute;
    left: 3%;
    top: 20%;
    width: 41%;
    height: 70%;
    border: 2px solid var(--ui-green);
    background: rgba(56, 217, 138, 0.08);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2) inset;
  }

  .cad-mobile-focus-region span {
    position: absolute;
    left: -2px;
    top: -18px;
    padding: 3px 6px;
    border-radius: 4px 4px 0 0;
    background: var(--ui-green);
    color: #061018;
    font-size: 7px;
    font-weight: 800;
    white-space: nowrap;
  }

  .cad-mobile-focus-reticle {
    position: absolute;
    z-index: 2;
    left: 24%;
    top: 56%;
    display: flex;
    align-items: center;
    transform: translate(-50%, -50%);
  }

  .cad-mobile-focus-reticle i {
    width: 13px;
    height: 13px;
    border: 2px solid var(--ui-blue);
    border-radius: 50%;
    background: rgba(56, 189, 248, 0.14);
    box-shadow: 0 0 14px rgba(56, 189, 248, 0.55);
  }

  .cad-mobile-focus-reticle span {
    margin-left: -2px;
    padding: 4px 7px;
    border-radius: 5px;
    background: #102f4b;
    color: #dbeafe;
    font-size: 7px;
    white-space: nowrap;
  }

  .evidence-rail {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
  }

  .evidence-rail article {
    grid-area: 1 / 1;
  }

  .evidence-machine {
    height: 260px;
    min-height: 260px;
  }

  .evidence-node {
    inset: 10px 7px 38px;
    padding: 12px;
  }

  .evidence-node > div {
    max-height: 132px;
  }

  .evidence-document-preview,
  .evidence-viewport-preview {
    height: 126px;
  }

  .evidence-model-core {
    width: 72px;
    height: 72px;
    margin: 12px auto 20px;
  }

  .evidence-notebook-preview,
  .evidence-output-preview {
    min-height: 124px;
  }

  .evidence-node > b {
    margin-top: 8px;
  }

  .document-machine {
    height: 480px;
    min-height: 480px;
  }

  .source-protocol {
    top: 374px;
    height: 102px;
  }

  .source-protocol > span {
    display: none;
  }

  .output-files {
    bottom: 10px;
  }

  .demo-form {
    gap: 12px;
    padding: 16px;
  }

  .field-pair {
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .demo-form label > span {
    font-size: 10px;
  }

  .demo-form input {
    height: 38px;
  }
}

@media (max-width: 360px) {
  .field-pair {
    grid-template-columns: 1fr;
  }

  .document-machine {
    height: 470px;
    min-height: 470px;
  }

  .source-protocol {
    top: 364px;
  }
}