@charset "UTF-8";
:root {
  --bg: #070b16;
  --ink: #111b32;
  --muted: #7d8a9e;
  --blue: #486bff;
  --cyan: #54e5ee;
  --line: #ffffff12;
  --font: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  --ease: cubic-bezier(.22, 1, .36, 1);
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 94px;
}
body {
  margin: 0;
  background: var(--bg);
  font: 15px/1.7 var(--font);
  color: #eaf0ff;
  -webkit-font-smoothing: antialiased;
}
a {
  color: inherit;
  text-decoration: none;
}
button {
  font: inherit;
  color: inherit;
  cursor: pointer;
}
button,
a {
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
img,
svg,
canvas {
  display: block;
}
img {
  max-width: 100%;
}
button: focus-visible, a: focus-visible, [tabindex="0"]: focus-visible {
  outline: 2px solid #62daef;
  outline-offset: 5px;
}
::selection {
  background: #4089dd66;
  color: #fff;
}
[hidden] {
  display: none!important;
}.container {
  width: min(1200px, calc(100% - 96px));
  margin-inline: auto;
}.icon {
  height: 22px;
  width: 22px;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}.skip-link {
  position: fixed;
  left: 16px;
  top: -100px;
  z-index: 100;
  background: #425be5;
  color: #fff;
  padding: 12px 20px;
  border-radius: 5px;
}.skip-link:focus {
  top: 12px;
}.reading-progress {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  transform: scaleX(0);
  transform-origin: left;
  background: linear-gradient(90deg, #5460ff, #51e4e6);
  z-index: 50;
}.brand {
  display: flex;
  align-items: center;
  gap: 9px;
  line-height: 1;
}.brand>span {
  display: flex;
  flex-direction: column;
  gap: 5px;
}.brand strong {
  font-weight: 750;
  font-size: 21px;
  letter-spacing: .8px;
}.brand small {
  font-size: 11px;
  letter-spacing: 1px;
  font-weight: 600;
  color: #9ca9c2;
}.brand img {
  filter: drop-shadow(0 0 12px #0085ff22);
}.site-header {
  position: sticky;
  top: 0;
  height: 83px;
  z-index: 30;
  background: #070b16e0;
  border-bottom: 1px solid #ffffff0b;
  backdrop-filter: blur(22px);
  transition: box-shadow .3s;
}.site-header.scrolled {
  box-shadow: 0 8px 30px #0002;
}.nav-shell {
  height: 100%;
  display: flex;
  align-items: center;
  gap: 40px;
  justify-content: space-between;
}.main-nav {
  display: flex;
  gap: 35px;
  margin-left: 30px;
}.main-nav a {
  font-size: 12px;
  color: #a3adc2;
  transition: color .2s;
  position: relative;
  padding-block: 15px;
}.main-nav a:after {
  position: absolute;
  content: "";
  left: 0;
  right: 0;
  bottom: 5px;
  height: 1px;
  background: #67d8e8;
  transform: scaleX(0);
  transition: transform .3s;
}.main-nav a:hover,
.main-nav a.active {
  color: #fff;
}.main-nav a.active:after {
  transform: scaleX(1);
}.nav-actions {
  display: flex;
  align-items: center;
  gap: 23px;
}.button {
  min-height: 51px;
  padding: 0 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  border: 1px solid transparent;
  border-radius: 7px;
  font-size: 13px;
  font-weight: 550;
  position: relative;
  transition: transform .3s var(--ease), background .3s, border-color .3s, box-shadow .3s;
  white-space: nowrap;
}.button .icon {
  width: 20px;
  height: 20px;
  transition: transform .3s var(--ease);
}.button:hover .icon {
  transform: translate(2px, -2px);
}.button-primary {
  background: linear-gradient(110deg, #4b65fc, #3656ec);
  color: #fff;
  box-shadow: 0 0 22px #375dec26, inset 0 1px 0 #ffffff35;
  overflow: hidden;
}.button-primary:after {
  content: "";
  position: absolute;
  inset: -50% -100%;
  background: linear-gradient(100deg, transparent 40%, #ffffff20 50%, transparent 60%);
  transform: translateX(-60%);
  animation: button-shine 5s ease-in-out infinite;
  pointer-events: none;
}.button-primary:hover {
  transform: translateY(-3px);
  box-shadow: 0 0 30px #375dec55;
  border-color: #8198ff;
}.button-ghost {
  border-color: #ffffff22;
  background: #ffffff02;
  color: #d1d9ec;
}.button-ghost .icon {
  width: 17px;
  height: 17px;
}.button-ghost:hover {
  background: #ffffff08;
  border-color: #ffffff55;
}.button-ghost:hover .icon {
  transform: translateX(4px);
}.button-back {
  border-color: #ffffff26;
  color: #cdd5e8;
  min-height: 36px;
  border-radius: 5px;
  font-size: 11px;
  gap: 12px;
  padding-inline: 15px;
}.button-back .icon {
  width: 17px;
  height: 17px;
}.button-back:hover {
  background: #ffffff0c;
  border-color: #ffffff66;
}.gradient-text {
  background: linear-gradient(100deg, #93aaff 0%, #d2e3ff 35%, #63e0ed 70%, #91b8ff 100%);
  background-size: 220% auto;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: text-flow 9s ease-in-out infinite;
}.live-dot {
  height: 5px;
  width: 5px;
  border-radius: 50%;
  background: #68ddd6;
  box-shadow: 0 0 0 4px #68ddd60c;
  display: inline-block;
  flex: none;
  position: relative;
}.live-dot:after {
  content: "";
  position: absolute;
  inset: -4px;
  border: 1px solid #68ddd655;
  border-radius: 50%;
  animation: dot-pulse 2.5s ease-out infinite;
} .hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background: radial-gradient(ellipse at 75% 30%, #0d1a38 0%, #070b16 56%);
}.hero-grid-background {
  position: absolute;
  inset: 0;
  background-image: linear-gradient(#6e9cdb05 1px, transparent 1px), linear-gradient(90deg, #6e9cdb05 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(90deg, transparent, #000 70%);
  pointer-events: none;
}.hero-aurora {
  position: absolute;
  filter: blur(90px);
  border-radius: 50%;
  pointer-events: none;
  opacity: .14;
  animation: aurora-drift 15s ease-in-out infinite;
}.aurora-one {
  width: 380px;
  height: 280px;
  right: -80px;
  top: 50px;
  background: #1b65eb;
}.aurora-two {
  width: 310px;
  height: 210px;
  right: 350px;
  top: 250px;
  background: #04bcd4;
  opacity: .07;
  animation-delay: -7s;
}.hero-layout {
  display: grid;
  grid-template-columns: 1.08fr 1fr;
  align-items: center;
  gap: 40px;
  min-height: 650px;
  padding-block: 65px 60px;
  position: relative;
}.hero-copy {
  position: relative;
  z-index: 3;
  animation: hero-in 1s var(--ease) both;
}.hero-eyebrow {
  font-size: 9px;
  letter-spacing: 2px;
  font-weight: 500;
  color: #8aacc2;
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 28px;
}.hero-eyebrow .live-dot {
  width: 4px;
  height: 4px;
}.hero h1 {
  font-size: clamp(35px, 3.65vw, 52px);
  font-weight: 650;
  letter-spacing: -1.5px;
  line-height: 1.5;
  margin: 0 0 23px;
  white-space: nowrap;
}.hero-lead {
  font-size: 18px;
  letter-spacing: 1.2px;
  font-weight: 400;
  color: #c0cce1;
  margin: 0 0 8px;
}.hero-description {
  font-size: 13px;
  line-height: 2.05;
  color: #7b8aa5;
  margin: 0;
  letter-spacing: .2px;
}.hero-actions {
  display: flex;
  gap: 14px;
  margin-top: 32px;
}.hero-footnote {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #66768e;
  font-size: 10px;
  margin-top: 35px;
  letter-spacing: .4px;
}.hero-footnote>span {
  width: 15px;
  height: 1px;
  background: #385b91;
}.hero-footnote i {
  color: #30435e;
  font-style: normal;
}.engine-scene {
  height: 505px;
  position: relative;
  min-width: 0;
  animation: hero-in 1.3s .15s var(--ease) both;
}.engine-scene canvas {
  position: absolute;
  inset: -10% -12%;
  width: 124%;
  height: 120%;
  z-index: 1;
  pointer-events: none;
}.engine-halo {
  position: absolute;
  width: 190px;
  height: 190px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: radial-gradient(circle, #3c96ce16, transparent 68%);
  border-radius: 50%;
  box-shadow: 0 0 80px #0b81cb0b;
  pointer-events: none;
}.engine-center {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -48%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  z-index: 2;
}.engine-center img {
  width: 54px;
  height: 51px;
  filter: drop-shadow(0 0 17px #048aff66);
  animation: center-float 5s ease-in-out infinite;
}.engine-center>span {
  font-size: 10px;
  letter-spacing: 3px;
  color: #8da5cc;
}.engine-orbit {
  width: 380px;
  height: 380px;
  border: 1px solid #6eacd312;
  position: absolute;
  left: 50%;
  top: 50%;
  border-radius: 50%;
  pointer-events: none;
  transform: translate(-50%, -50%);
}.engine-orbit:after {
  content: "";
  height: 4px;
  width: 4px;
  background: #5aa7f5;
  border-radius: 50%;
  position: absolute;
  left: 50%;
  top: -2px;
  box-shadow: 0 0 15px #59c7ff;
  transform-origin: 0 191px;
  animation: orbital-dot 16s linear infinite;
}.orbit-b {
  width: 440px;
  height: 440px;
  border-style: dashed;
  border-color: #6eacd309;
}.orbit-b:after {
  transform-origin: 0 221px;
  animation: orbital-dot 25s linear infinite reverse;
  width: 3px;
  height: 3px;
  opacity: .5;
}.scene-coordinate {
  position: absolute;
  left: 9px;
  right: 0;
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 8px;
  letter-spacing: 1.5px;
  color: #475b7c;
  z-index: 4;
}.coord-top {
  top: 0;
}.coord-top>span {
  margin-left: auto;
  color: #334661;
  font-size: 8px;
  letter-spacing: 2px;
}.coord-bottom {
  bottom: -1px;
  color: #566d8b;
  font-size: 8px;
  letter-spacing: 1px;
}.coord-bottom .live-dot {
  width: 3px;
  height: 3px;
}.coord-bottom .live-dot:after {
  display: none;
}.scene-axis {
  margin-left: auto;
  font-size: 10px;
  color: #42607c;
}.engine-label {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 10px;
  z-index: 4;
  padding: 12px 14px;
  background: linear-gradient(120deg, #0e1931e8, #0c1527e0);
  border: 1px solid #657ea72d;
  box-shadow: 0 10px 25px #0002;
  backdrop-filter: blur(10px);
  border-radius: 9px;
  animation: label-float 6s ease-in-out infinite;
}.engine-label small {
  font-size: 6px;
  letter-spacing: 1.6px;
  color: #56779f;
  display: block;
  margin-bottom: 3px;
}.engine-label strong {
  font-size: 11px;
  letter-spacing: .5px;
  font-weight: 500;
  color: #c7d8f1;
  display: block;
}.engine-node {
  width: 29px;
  height: 29px;
  border: 1px solid #38558566;
  border-radius: 7px;
  background: linear-gradient(145deg, #19325a66, #10213d66);
  display: grid;
  place-items: center;
  color: #77b6fb;
}.engine-node .icon {
  width: 15px;
  height: 15px;
}.label-keyword {
  top: 66px;
  left: -22px;
  animation-delay: -1s;
}.label-create {
  right: -27px;
  top: 229px;
  animation-delay: -3s;
}.label-publish {
  bottom: 48px;
  left: 7px;
  animation-delay: -4s;
}.label-create .engine-node {
  color: #62d5db;
  border-color: #3b899d55;
}.node-dot {
  height: 4px;
  width: 4px;
  border-radius: 50%;
  background: #53dacb;
  margin-left: 6px;
  box-shadow: 0 0 8px #53dacb88;
  animation: node-blink 2.5s ease-in-out infinite;
}.hero-bottom {
  position: relative;
  min-height: 128px;
  display: flex;
  align-items: center;
  border-top: 1px solid #ffffff0c;
  gap: 55px;
}.hero-bottom:before {
  content: "";
  position: absolute;
  top: -1px;
  width: 100px;
  height: 1px;
  background: linear-gradient(90deg, transparent, #6bd5e3, transparent);
  left: 0;
  animation: rail-run 8s linear infinite;
}.hero-bottom>p {
  font-size: 10px;
  line-height: 1.9;
  color: #52627d;
  margin: 0 auto 0 0;
}.hero-bottom>p strong {
  color: #8e9cb5;
  font-size: 11px;
  font-weight: 400;
}.hero-capability {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 11px;
  color: #a9b8ce;
}.hero-capability>span {
  font-size: 8px;
  letter-spacing: 1px;
  color: #415273;
}.scroll-cue {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 15px 0 15px 15px;
}.scroll-cue>span {
  width: 18px;
  height: 28px;
  border: 1px solid #405571;
  border-radius: 15px;
  position: relative;
}.scroll-cue>span:after {
  content: "";
  width: 2px;
  height: 5px;
  background: #a4bed8;
  position: absolute;
  top: 5px;
  left: 7px;
  animation: scroll-tick 1.7s ease-in-out infinite;
}.scroll-cue .icon {
  width: 12px;
  height: 12px;
  transform: rotate(90deg);
  color: #6682a7;
} .dark-section {
  color: #eaf0ff;
  background: #080d19;
}.workflow-section {
  padding-block: 100px 87px;
  border-top: 1px solid #ffffff07;
  position: relative;
  overflow: hidden;
  background: radial-gradient(ellipse at 50% 80%, #0d1a2f, #080d19 65%);
}.section-intro {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 40px;
  margin-bottom: 44px;
}.section-kicker {
  display: flex;
  align-items: center;
  gap: 10px;
  letter-spacing: 1.8px;
  font-size: 9px;
  color: #7d9bb8;
  font-weight: 450;
  margin-bottom: 23px;
}.section-kicker>i {
  height: 5px;
  width: 5px;
  display: block;
  border: 1px solid #5e99c0;
  transform: rotate(45deg);
  flex: none;
}.section-intro h2 {
  font-size: clamp(30px, 3vw, 40px);
  font-weight: 550;
  line-height: 1.55;
  letter-spacing: -1.1px;
  margin: 0;
}.text-muted-light {
  color: #7787a1;
}.intro-aside {
  font-size: 12px;
  line-height: 2.05;
  color: #60718b;
  margin: 0 0 4px;
  flex: none;
}.workflow-selector {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 22px;
}.flow-tab {
  display: flex;
  align-items: center;
  gap: 13px;
  position: relative;
  text-align: left;
  min-height: 83px;
  padding: 16px 18px;
  border: 1px solid #ffffff10;
  border-radius: 8px;
  background: #ffffff02;
  transition: background .3s, border-color .3s;
  overflow: hidden;
}.flow-tab.active {
  background: linear-gradient(110deg, #1c2f52, #13263c);
  border-color: #698fc34d;
}.flow-tab:hover {
  background: #16233a;
}.flow-number {
  font-size: 10px;
  letter-spacing: 1px;
  color: #4d6283;
  align-self: flex-start;
  padding-top: 4px;
  font-variant-numeric: tabular-nums;
}.flow-tab.active .flow-number {
  color: #8ebeff;
}.flow-tab strong {
  display: block;
  font-size: 13px;
  font-weight: 500;
  color: #8c9ab2;
}.flow-tab.active strong {
  color: #deebff;
}.flow-tab small {
  display: block;
  font-size: 9px;
  color: #4b5d79;
  margin-top: 3px;
}.flow-tab.active small {
  color: #6f8ba9;
}.flow-tab>.icon {
  color: #354e70;
  width: 18px;
  height: 18px;
  margin-left: auto;
}.flow-tab.active>.icon {
  color: #91b7e8;
}.flow-progress {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, #577df9, #59dfe4);
  width: 100%;
  transform: scaleX(0);
  transform-origin: left;
}.flow-tab.active .flow-progress {
  animation: flow-fill var(--demo-duration, 6500ms) linear both;
}.demo-paused .flow-tab.active .flow-progress {
  animation-play-state: paused;
}.studio {
  background: #fafbff;
  border: 1px solid #647fa22b;
  box-shadow: 0 0 100px #3680b812, 0 30px 65px #0003;
  border-radius: 13px;
  color: #17233b;
  overflow: hidden;
  position: relative;
}.studio:before {
  content: "";
  position: absolute;
  height: 1px;
  left: 15%;
  right: 15%;
  top: 0;
  background: linear-gradient(90deg, transparent, #85bcebb0, transparent);
}.studio-topbar {
  height: 40px;
  background: linear-gradient(90deg, #141e30, #172337);
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 0 19px;
  border-bottom: 1px solid #ffffff0c;
}.window-dots {
  display: flex;
  gap: 5px;
}.window-dots>i {
  height: 6px;
  width: 6px;
  border-radius: 50%;
  background: #6b555d;
}.window-dots>i:nth-child(2) {
  background: #7b6e4f;
}.window-dots>i:nth-child(3) {
  background: #45705e;
}.studio-title {
  font-size: 8px;
  letter-spacing: 1.2px;
  color: #667c9c;
  margin: auto;
}.interface-badge {
  font-size: 8px;
  border: 1px solid #5e759130;
  border-radius: 3px;
  padding: 2px 6px;
  color: #6e819c;
}.studio-body {
  display: flex;
  min-height: 391px;
}.studio-sidebar {
  width: 166px;
  flex: none;
  padding: 25px 12px 23px;
  background: #111c30;
  position: relative;
  color: #d5dff1;
}.sidebar-brand {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 10px 25px;
  font-size: 15px;
  letter-spacing: .5px;
}.sidebar-brand img {
  width: 25px;
  height: 24px;
}.sidebar-brand strong {
  font-weight: 650;
}.sidebar-menu {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 11px 13px;
  border-radius: 6px;
  margin-bottom: 7px;
  color: #5e7192;
  font-size: 11px;
}.sidebar-menu .icon {
  width: 15px;
  height: 15px;
}.sidebar-menu.active {
  color: #b5ceff;
  background: #253f6c66;
  border: 1px solid #3d609a35;
}.sidebar-caption {
  position: absolute;
  bottom: 26px;
  left: 25px;
  font-size: 8px;
  color: #405576;
  display: flex;
  align-items: center;
  gap: 5px;
}.sidebar-caption>span {
  height: 3px;
  width: 3px;
  border-radius: 50%;
  background: #579bb4;
}.studio-main {
  flex: 1;
  min-width: 0;
  padding: 25px 29px;
}.studio-main-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 23px;
}.studio-main-heading small {
  font-size: 7px;
  letter-spacing: 1.4px;
  color: #9ca8ba;
  display: block;
  margin-bottom: 5px;
}.studio-main-heading h3 {
  font-size: 17px;
  line-height: 1.6;
  font-weight: 650;
  letter-spacing: -.3px;
  margin: 0;
}.studio-site {
  font-size: 9px;
  color: #94a2b8;
  display: flex;
  align-items: center;
  gap: 5px;
  border: 1px solid #e6ebf5;
  padding: 4px 7px;
  border-radius: 4px;
  white-space: nowrap;
}.studio-site .icon {
  width: 12px;
  height: 12px;
}.flow-panel {
  min-height: 250px;
  animation: panel-arrive .55s var(--ease) both;
}.panel-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}.mock-search {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid #e8edf5;
  background: #fff;
  border-radius: 5px;
  font-size: 9px;
  color: #a2aec0;
  white-space: nowrap;
  overflow: hidden;
}.mock-search .icon {
  width: 12px;
  height: 12px;
}.mock-search>span {
  overflow: hidden;
  text-overflow: ellipsis;
}.small-action {
  white-space: nowrap;
  padding: 7px 10px;
  border-radius: 4px;
  background: #ecf1ff;
  border: 1px solid #dde7fc;
  color: #657dd6;
  font-size: 9px;
}.content-table {
  border: 1px solid #e8edf6;
  border-radius: 7px;
  overflow: hidden;
  background: #fff;
}.table-head {
  background: #f1f5fa;
  display: flex;
  justify-content: space-between;
  padding: 8px 12px;
  font-size: 9px;
  color: #8c9ab0;
}.table-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 12px;
  border-bottom: 1px solid #edf1f8;
  min-width: 0;
}.table-row:last-child {
  border: 0;
}.table-row>div {
  min-width: 0;
  flex: 1;
}.table-row strong {
  display: block;
  font-size: 10px;
  color: #2b3b57;
  font-weight: 550;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}.table-row small {
  display: block;
  font-size: 8px;
  color: #a2adbe;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 3px;
}.check-box {
  width: 10px;
  height: 10px;
  border: 1px solid #c6d3ea;
  border-radius: 2px;
  flex: none;
  position: relative;
  background: #fff;
}.check-box.checked {
  background: #5d7be7;
  border-color: #5d7be7;
}.check-box.checked:after {
  content: "";
  position: absolute;
  width: 5px;
  height: 2.5px;
  border-left: 1px solid #fff;
  border-bottom: 1px solid #fff;
  transform: rotate(-45deg);
  left: 1.5px;
  top: 2px;
}.tag {
  font-size: 8px;
  white-space: nowrap;
  padding: 3px 6px;
  border-radius: 3px;
  flex: none;
  font-weight: 400;
}.blue-tag {
  color: #5d7bd3;
  background: #edf2ff;
}.cyan-tag {
  color: #4c9eac;
  background: #e8f7f9;
}.gray-tag {
  color: #9ba9be;
  background: #f1f4f8;
}.stage-item {
  animation: item-arrive .5s var(--ease) both;
}.stage-item:nth-child(3) {
  animation-delay: .13s;
}.stage-item:nth-child(4) {
  animation-delay: .25s;
}.panel-note {
  margin-top: 14px;
  display: flex;
  align-items: center;
  gap: 6px;
  color: #9eabc0;
  font-size: 8px;
}.panel-note .icon {
  width: 12px;
  height: 12px;
  color: #8ba1cf;
}.panel-subtitle {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 8px;
  color: #97a4ba;
  min-width: 0;
}.panel-subtitle>strong {
  font-size: 11px;
  font-weight: 550;
  color: #526681;
}.studio-inspector {
  width: 210px;
  flex: none;
  padding: 28px 22px;
  background: #f0f4fa;
  border-left: 1px solid #e4ebf6;
  position: relative;
}.inspector-eyebrow {
  font-size: 8px;
  color: #9caabd;
  letter-spacing: .6px;
}.inspector-emblem {
  height: 45px;
  width: 45px;
  display: grid;
  place-items: center;
  border: 1px solid #e0e8fa;
  border-radius: 12px;
  background: linear-gradient(135deg, #f5f8ff, #e2eaff);
  color: #7994e8;
  margin: 18px 0;
}.inspector-emblem .icon {
  width: 23px;
  height: 23px;
}.studio-inspector h4 {
  font-size: 13px;
  font-weight: 600;
  margin: 0 0 8px;
  color: #384e70;
}.studio-inspector p {
  font-size: 10px;
  line-height: 1.9;
  color: #93a0b4;
  margin: 0 0 20px;
  min-height: 57px;
}.inspector-setting {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #e0e7f1;
}.inspector-setting>span {
  font-size: 8px;
  color: #a3afc1;
}.inspector-setting strong {
  font-size: 10px;
  font-weight: 500;
  color: #6981a3;
}.inspector-note {
  font-size: 7px;
  color: #a7b2c3;
  display: flex;
  align-items: center;
  gap: 4px;
  position: absolute;
  bottom: 20px;
  left: 22px;
  right: 12px;
}.inspector-note .icon {
  width: 10px;
  height: 10px;
}.studio-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  padding: 11px 20px;
  border-top: 1px solid #e5ebf5;
  background: #f3f6fc;
  font-size: 8px;
  color: #9aa9bd;
}.studio-bottom>span {
  display: flex;
  align-items: center;
  gap: 8px;
}.studio-bottom .live-dot {
  height: 3px;
  width: 3px;
  background: #66b7aa;
  box-shadow: none;
}.studio-bottom .live-dot:after {
  display: none;
}.studio-disclaimer {
  font-size: 10px;
  color: #3e5273;
  text-align: center;
  letter-spacing: .5px;
  margin: 19px 0 0;
}.document-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #e4eaf4;
  padding-bottom: 12px;
  font-size: 9px;
  color: #8d9fb9;
}.document-toolbar>span {
  display: flex;
  align-items: center;
  gap: 6px;
}.document-toolbar .icon {
  height: 12px;
  width: 12px;
}.document-status {
  font-size: 8px;
  color: #87a79f;
}.document-status>i {
  height: 3px;
  width: 3px;
  border-radius: 50%;
  background: #84b4a4;
}.demo-document {
  padding: 16px 8px 5px;
}.document-category {
  font-size: 8px;
  color: #89a2d5;
  letter-spacing: .5px;
}.demo-document h4 {
  font-size: 15px;
  line-height: 1.6;
  font-weight: 650;
  color: #30445e;
  margin: 8px 0 10px;
}.demo-document>p {
  display: inline;
  font-size: 11px;
  color: #8a97aa;
  line-height: 2.2;
  margin: 0;
  min-height: 70px;
}.typing-caret {
  height: 11px;
  width: 1px;
  display: inline-block;
  background: #6c8dca;
  vertical-align: middle;
  margin-left: 3px;
  animation: caret-blink 1s steps(1) infinite;
}.document-outline {
  display: flex;
  gap: 9px;
  margin-top: 20px;
  flex-wrap: wrap;
}.document-outline>span {
  font-size: 8px;
  padding: 6px 8px;
  background: #eef3fc;
  color: #89a1c3;
  border-radius: 3px;
}.publish-timeline {
  border: 1px solid #e3eaf5;
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
}.timeline-days {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  padding-block: 9px;
  background: #f3f6fb;
  color: #8a9bb5;
  font-size: 9px;
  text-align: center;
}.timeline-body {
  height: 164px;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  grid-template-rows: repeat(3, 1fr);
  position: relative;
  background: linear-gradient(90deg, transparent calc(100% - 1px), #edf1f8 0) 0 0/20% 100%, linear-gradient(transparent calc(100% - 1px), #edf1f8 0) 0 0/100% 33.333%;
}.timeline-event {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 8px;
  align-self: center;
  margin: 6px;
  padding: 7px 9px;
  border-radius: 4px;
  border: 1px solid #dce7fd;
  background: #eef4ff;
  color: #7896cc;
  white-space: nowrap;
  z-index: 1;
  animation: timeline-event 2.5s ease-in-out infinite;
}.timeline-event .icon {
  height: 12px;
  width: 12px;
}.timeline-event small {
  font-size: 7px;
  margin-left: auto;
  color: #98adcd;
}.timeline-event-a {
  grid-column: 1 / 4;
  grid-row: 1;
}.timeline-event-b {
  grid-column: 2 / 5;
  grid-row: 2;
  animation-delay: .7s;
  background: #e9f6f9;
  border-color: #d6ecf1;
  color: #70a4ae;
}.timeline-event-c {
  grid-column: 3 / 6;
  grid-row: 3;
  animation-delay: 1.4s;
}.timeline-line {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 20%;
  width: 1px;
  background: linear-gradient(transparent, #5591dfaa);
  animation: timeline-scan 7s ease-in-out infinite;
  z-index: 2;
}.timeline-line:before {
  content: "";
  height: 4px;
  width: 4px;
  position: absolute;
  left: -1.5px;
  top: 0;
  border-radius: 50%;
  background: #69b5ed;
  box-shadow: 0 0 6px #69b5ed;
} .light-section {
  background: #f7f9fc;
  color: var(--ink);
}.capabilities-section {
  padding-block: 100px 80px;
}.light-section .section-kicker {
  color: #778ba4;
}.light-section .section-kicker>i {
  border-color: #869cb8;
}.light-section .intro-aside {
  color: #92a0b4;
}.text-muted {
  color: #a1adbf;
}.capability-grid {
  display: grid;
  grid-template-columns: 5fr 6fr;
  gap: 22px;
}.capability-card {
  position: relative;
  isolation: isolate;
  background: #fff;
  border: 1px solid #e3e9f3;
  border-radius: 16px;
  padding: 28px 30px 0;
  overflow: hidden;
  transition: transform .4s var(--ease), box-shadow .4s, border-color .4s;
}.capability-card:hover {
  transform: translateY(-5px);
  border-color: #cbd9ef;
  box-shadow: 0 20px 50px #536e9c0b;
}.spotlight-card:before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(400px circle at var(--pointer-x, 50%) var(--pointer-y, 50%), #5087ef0a, transparent 65%);
  z-index: -1;
  pointer-events: none;
}.card-identity {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  font-size: 8px;
  letter-spacing: 1.7px;
  color: #a5b2c5;
}.card-identity .icon {
  height: 18px;
  width: 18px;
  color: #8b9fbc;
}.capability-card h3 {
  font-size: 26px;
  line-height: 1.6;
  font-weight: 600;
  letter-spacing: -.7px;
  margin: 20px 0 10px;
}.capability-card>p {
  font-size: 11px;
  color: #97a4b8;
  line-height: 2;
  margin: 0;
}.radar-visual {
  height: 255px;
  position: relative;
  overflow: hidden;
  margin: 2px -10px 0;
}.radar-grid {
  height: 240px;
  width: 240px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  border: 1px solid #e8eff9;
  background: repeating-radial-gradient(circle, transparent 0 38px, #e7effb 39px 40px);
  mask-image: radial-gradient(circle, #000 65%, transparent 76%);
}.radar-grid:before,
.radar-grid:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  background: #e7eff9;
  left: 0;
  top: 50%;
}.radar-grid:after {
  transform: rotate(90deg);
}.radar-sweep {
  position: absolute;
  width: 237px;
  height: 237px;
  left: 50%;
  top: 50%;
  margin-left: -118.5px;
  margin-top: -118.5px;
  border-radius: 50%;
  background: conic-gradient(from 0deg, transparent 0 260deg, #6d9af603 290deg, #80c9f528 356deg, #7faef173 360deg);
  animation: radar-spin 9s linear infinite;
  mask-image: radial-gradient(circle, transparent 18%, #000 22% 68%, transparent 73%);
}.radar-center {
  width: 43px;
  height: 43px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: linear-gradient(130deg, #eef4ff, #d9e9ff);
  border: 1px solid #d6e3fa;
  box-shadow: 0 0 35px #78b9ef14;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #6a9ee5;
}.radar-center .icon {
  width: 20px;
  height: 20px;
}.radar-word {
  position: absolute;
  background: #ffffffed;
  border: 1px solid #e5ecf8;
  border-radius: 6px;
  padding: 6px 11px;
  font-size: 9px;
  color: #829bbd;
  box-shadow: 0 5px 18px #4b75b80b;
  animation: keyword-drift 5s ease-in-out infinite;
}.word-a {
  left: 7%;
  top: 39px;
}.word-b {
  right: 0;
  top: 92px;
  animation-delay: -1s;
}.word-c {
  left: 0;
  bottom: 67px;
  animation-delay: -3s;
}.word-d {
  right: 7%;
  bottom: 33px;
  animation-delay: -2s;
}.radar-dot {
  position: absolute;
  width: 4px;
  height: 4px;
  background: #8ab7ea;
  border-radius: 50%;
  box-shadow: 0 0 0 4px #8ab7ea0b;
  animation: radar-dot 5s ease-in-out infinite;
}.radar-dot-a {
  left: 40%;
  top: 54px;
}.radar-dot-b {
  right: 27%;
  top: 155px;
  animation-delay: -2s;
}.radar-dot-c {
  left: 31%;
  top: 180px;
  animation-delay: -4s;
}.card-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  border-top: 1px solid #edf1f6;
  min-height: 62px;
  font-size: 11px;
  color: #6f85a4;
}.card-bottom small {
  font-size: 9px;
  color: #b0bbcc;
  letter-spacing: .3px;
}.writer-visual {
  height: 255px;
  position: relative;
  padding-top: 20px;
  margin-inline: 0;
}.writer-template {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  max-width: 85%;
  margin-inline: auto;
  padding: 10px 14px;
  border: 1px solid #e0e8f6;
  background: #f8fbff;
  border-radius: 7px;
  box-shadow: 0 8px 23px #365fb30d;
  animation: template-drift 6s ease-in-out infinite;
}.writer-template>span {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 10px;
  color: #7d93b7;
}.writer-template .icon {
  height: 14px;
  width: 14px;
}.writer-template .template-applied {
  color: #84b7b0;
  font-size: 8px;
  gap: 4px;
}.writer-template .template-applied .icon {
  height: 11px;
  width: 11px;
}.writer-sheet {
  background: #fff;
  border: 1px solid #e4eaf6;
  border-radius: 9px;
  padding: 23px 22px 15px;
  position: relative;
  margin: -5px 15px 0;
  box-shadow: 0 12px 23px #3b5c9408;
  transform: perspective(800px) rotateX(3deg);
}.sheet-label {
  font-size: 6px;
  letter-spacing: 1.5px;
  color: #b1bdd0;
  display: block;
  margin-bottom: 7px;
}.writer-sheet>strong {
  font-size: 13px;
  color: #607b9e;
  font-weight: 550;
  display: block;
  letter-spacing: .1px;
}.writer-lines {
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin-top: 13px;
}.writer-lines i {
  height: 3px;
  border-radius: 2px;
  background: linear-gradient(90deg, #e4eaf5 60%, #b6d1f7 75%, #e4eaf5 90%);
  background-size: 300% 100%;
  width: 100%;
  animation: writer-line 3.5s ease-in-out infinite;
}.writer-lines i:nth-child(2) {
  width: 90%;
  animation-delay: .25s;
}.writer-lines i:nth-child(3) {
  width: 68%;
  animation-delay: .5s;
}.sheet-bottom {
  display: flex;
  gap: 13px;
  margin-top: 13px;
}.sheet-image {
  width: 60px;
  height: 35px;
  background: linear-gradient(130deg, #e7effd, #d6e6ff);
  border: 1px solid #deebfc;
  border-radius: 4px;
  display: grid;
  place-items: center;
  color: #a0b9e7;
}.sheet-image .icon {
  width: 19px;
  height: 19px;
}.sheet-bottom>span:last-child {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding-top: 8px;
}.sheet-bottom>span:last-child>i {
  height: 3px;
  background: #edf1f8;
  border-radius: 3px;
  width: 80%;
}.sheet-bottom>span:last-child>i:last-child {
  width: 55%;
}.sheet-spark {
  position: absolute;
  right: -13px;
  bottom: 16px;
  height: 33px;
  width: 33px;
  display: grid;
  place-items: center;
  background: linear-gradient(130deg, #eef3ff, #d9e7ff);
  border: 1px solid #dbe7fd;
  border-radius: 8px;
  color: #88a4e9;
  box-shadow: 0 0 20px #5994ef0c;
}.sheet-spark .icon {
  width: 17px;
  height: 17px;
}.operations-panel {
  display: grid;
  grid-template-columns: .92fr 1.9fr;
  align-items: center;
  gap: 48px;
  padding: 44px 43px;
  background: radial-gradient(ellipse at 80% 0, #182c44, #101c2e 60%);
  border: 1px solid #263b54;
  border-radius: 16px;
  margin-top: 22px;
  overflow: hidden;
  min-height: 339px;
  position: relative;
}.operations-panel:after {
  content: "";
  height: 1px;
  width: 500px;
  background: linear-gradient(90deg, transparent, #82c4e744, transparent);
  position: absolute;
  top: 0;
  right: 0;
}.operations-copy .card-identity {
  font-size: 7px;
  color: #587494;
  letter-spacing: 1.5px;
}.operations-copy h3 {
  font-size: 29px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .4px;
  color: #d7e4f7;
  margin: 17px 0 13px;
}.operations-copy p {
  font-size: 11px;
  line-height: 2;
  color: #71859f;
  margin: 0;
  max-width: 250px;
}.operations-tags {
  display: flex;
  gap: 7px;
  margin-top: 18px;
}.operations-tags>span {
  font-size: 8px;
  padding: 3px 7px;
  background: #ffffff04;
  border: 1px solid #50749a33;
  color: #7f9abc;
  border-radius: 4px;
}.operations-visual {
  display: flex;
  align-items: center;
  gap: 46px;
  min-width: 0;
}.ops-sites {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  position: relative;
}.ops-site {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 15px 12px;
  background: #192a43;
  border: 1px solid #4c6e9933;
  box-shadow: 0 10px 20px #0001;
  border-radius: 8px;
  position: relative;
  z-index: 2;
  animation: site-glow 7s ease-in-out infinite;
}.ops-site:nth-child(2) {
  animation-delay: -3.5s;
}.site-graphic {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid #40649e55;
  border-radius: 6px;
  background: #223f6666;
  color: #79a4e0;
  flex: none;
}.site-graphic .icon {
  height: 17px;
  width: 17px;
}.site-graphic.cyan {
  color: #66bdca;
  border-color: #35697966;
  background: #1d475455;
}.ops-site strong {
  display: block;
  font-size: 10px;
  color: #b2c6e3;
  font-weight: 500;
  white-space: nowrap;
}.ops-site small {
  display: block;
  font-size: 7px;
  color: #5b7697;
  margin-top: 3px;
  white-space: nowrap;
}.ops-site>i {
  height: 3px;
  width: 3px;
  background: #5fa9aa;
  border-radius: 50%;
  margin-left: auto;
}.ops-link {
  position: absolute;
  height: 76px;
  right: -25px;
  top: 40px;
  width: 24px;
  border: 1px solid #47719655;
  border-left: 0;
  border-radius: 0 8px 8px 0;
}.ops-link:before {
  content: "";
  position: absolute;
  left: 23px;
  top: 50%;
  width: 23px;
  height: 1px;
  background: #47719677;
}.ops-link>i {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  position: absolute;
  background: #76d2df;
  box-shadow: 0 0 10px #77d3e8;
  right: -2px;
  top: 8%;
  animation: ops-data 3s ease-in-out infinite;
}.ops-link>i:nth-child(2) {
  animation-delay: 1.5s;
}.ops-calendar {
  width: 281px;
  flex: none;
  border: 1px solid #36577866;
  border-radius: 9px;
  overflow: hidden;
  background: #15283e;
  box-shadow: 0 15px 30px #0001;
}.ops-calendar-head {
  padding: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #5c7b9b20;
}.ops-calendar-head>span {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 9px;
  color: #8ba8c7;
}.ops-calendar-head .icon {
  height: 13px;
  width: 13px;
}.ops-calendar-head>span:last-child {
  font-size: 7px;
  color: #476788;
}.ops-calendar-week {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  text-align: center;
  font-size: 7px;
  color: #496d91;
  padding: 9px 0;
  background: #192e47;
}.ops-calendar-grid {
  height: 120px;
  background: linear-gradient(90deg, transparent calc(100% - 1px), #3f63852b 0) 0 0/20% 100%, linear-gradient(transparent calc(100% - 1px), #3f63852b 0) 0 0/100% 33.333%;
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  grid-template-rows: repeat(3, 1fr);
}.ops-event {
  background: #31578d66;
  border: 1px solid #557db84d;
  color: #7fa7dd;
  border-radius: 3px;
  font-size: 7px;
  align-self: center;
  justify-self: center;
  padding: 4px 8px;
  z-index: 2;
}.event-a {
  grid-column: 1;
  grid-row: 1;
}.event-b {
  grid-column: 3;
  grid-row: 2;
  background: #255a6966;
  border-color: #417c8b55;
  color: #7bbac8;
}.event-c {
  grid-column: 5;
  grid-row: 3;
}.ops-scan {
  height: 1px;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: linear-gradient(90deg, transparent, #6dabc366, transparent);
  box-shadow: 0 0 10px #42b9c222;
  animation: ops-scan 6s ease-in-out infinite;
}.ops-calendar-foot {
  padding: 9px 12px;
  display: flex;
  align-items: center;
  gap: 6px;
  border-top: 1px solid #3c64812b;
  color: #4f7796;
  font-size: 7px;
}.ops-calendar-foot .live-dot {
  height: 3px;
  width: 3px;
  box-shadow: none;
}.ops-calendar-foot .live-dot:after {
  display: none;
}.principles {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 30px;
  margin-top: 40px;
}.principles>div {
  display: grid;
  grid-template-columns: 27px 1fr;
  align-items: center;
  column-gap: 10px;
  row-gap: 4px;
  padding-left: 10px;
}.principles .icon {
  color: #839aba;
  height: 20px;
  width: 20px;
  grid-row: 1 / 3;
}.principles strong {
  font-size: 11px;
  color: #7c8fa8;
  font-weight: 550;
}.principles>div>span {
  font-size: 10px;
  color: #a9b4c4;
} .scenarios-section {
  padding-block: 31px 100px;
}.scenarios-section .section-intro {
  padding-top: 60px;
  border-top: 1px solid #e1e8f1;
}.scenario-layout {
  display: grid;
  grid-template-columns: .78fr 2fr;
  gap: 36px;
}.scenario-tabs {
  display: flex;
  flex-direction: column;
  gap: 6px;
}.scenario-tab {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 22px 19px;
  background: transparent;
  border: 1px solid transparent;
  border-bottom-color: #e1e8f0;
  text-align: left;
  border-radius: 7px;
  transition: background .3s, border-color .3s;
}.scenario-tab.active {
  background: #edf2f9;
  border-color: #e0e8f4;
}.scenario-tab>span {
  font-size: 8px;
  color: #b3bfd0;
  letter-spacing: 1px;
}.scenario-tab>.icon {
  width: 20px;
  height: 20px;
  color: #a0b1c9;
}.scenario-tab>strong {
  font-size: 15px;
  font-weight: 500;
  color: #8498b5;
  white-space: nowrap;
}.scenario-tab.active>strong {
  color: #3a567e;
}.scenario-tab.active>.icon {
  color: #7297d1;
}.scenario-tab .scenario-arrow {
  margin-left: auto;
  height: 16px;
  width: 16px;
  opacity: 0;
  transform: translateX(-7px);
  transition: opacity .3s, transform .3s;
}.scenario-tab.active .scenario-arrow {
  opacity: 1;
  transform: none;
}.scenario-panel {
  padding: 29px 34px 27px;
  border: 1px solid #e2e9f3;
  border-radius: 12px;
  background: #fff;
  position: relative;
  min-height: 263px;
}.scenario-panel:before {
  content: "";
  height: 80px;
  width: 80px;
  background: radial-gradient(circle, #7bacf50c, transparent 65%);
  position: absolute;
  right: 25px;
  top: 5px;
  pointer-events: none;
}.scenario-label {
  font-size: 8px;
  letter-spacing: 1.8px;
  color: #9eafc7;
}.scenario-panel h3 {
  font-size: 22px;
  line-height: 1.6;
  letter-spacing: -.5px;
  font-weight: 550;
  color: #344a69;
  margin: 12px 0 10px;
}.scenario-panel>p {
  font-size: 11px;
  line-height: 2;
  color: #98a7ba;
  margin: 0;
  max-width: 570px;
}.scenario-path {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-top: 23px;
  flex-wrap: wrap;
}.scenario-path>span {
  font-size: 9px;
  padding: 6px 12px;
  background: #f1f5fb;
  border: 1px solid #e9eff9;
  border-radius: 5px;
  color: #8a9fbc;
}.scenario-path .icon {
  height: 13px;
  width: 13px;
  color: #c0cde0;
}.scenario-note {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-top: 19px;
  font-size: 9px;
  color: #b5c0cf;
}.note-line {
  height: 1px;
  width: 15px;
  background: #c1d3e9;
}.scenario-panel.switching {
  animation: panel-arrive .55s var(--ease) both;
} .closing-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #080e1c;
  text-align: center;
  min-height: 500px;
  border-top: 1px solid #1b2d48;
}.closing-content {
  position: relative;
  z-index: 3;
  padding-block: 84px 100px;
}.closing-content .section-kicker {
  justify-content: center;
  font-size: 8px;
  letter-spacing: 2px;
  color: #4f6b90;
  margin-bottom: 24px;
}.closing-content .section-kicker>i {
  border-color: #48688f;
}.closing-content h2 {
  font-size: clamp(32px, 3.4vw, 47px);
  font-weight: 500;
  line-height: 1.6;
  letter-spacing: -1px;
  margin: 0;
}.closing-content p {
  font-size: 12px;
  color: #6d809e;
  letter-spacing: .4px;
  margin: 18px 0 28px;
}.closing-content .button {
  min-height: 52px;
  padding-inline: 27px;
  gap: 26px;
}.closing-aurora {
  width: 650px;
  height: 300px;
  position: absolute;
  left: 50%;
  bottom: -60px;
  transform: translateX(-50%);
  border-radius: 50%;
  background: radial-gradient(ellipse, #2442ae33, #1763800e 40%, transparent 72%);
  filter: blur(40px);
  animation: closing-glow 12s ease-in-out infinite;
  z-index: 1;
}.closing-orbits {
  position: absolute;
  width: 100%;
  height: 500px;
  left: 0;
  bottom: -295px;
  transform: perspective(1000px) rotateX(57deg);
  z-index: 1;
  pointer-events: none;
}.closing-orbits>i {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 900px;
  height: 900px;
  border: 1px solid #45699318;
  border-radius: 50%;
}.closing-orbits>i:nth-child(2) {
  width: 1100px;
  height: 1100px;
  border-style: dashed;
  animation: closing-ring 90s linear infinite;
}.closing-orbits>i:nth-child(3) {
  width: 1400px;
  height: 1400px;
  opacity: .6;
}.closing-wordmark {
  font-size: 170px;
  line-height: 1;
  font-weight: 750;
  letter-spacing: -10px;
  color: #24427410;
  position: absolute;
  bottom: -22px;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
  pointer-events: none;
  z-index: 0;
}.site-footer {
  background: #080d19;
  border-top: 1px solid #ffffff08;
}.footer-inner {
  min-height: 108px;
  display: flex;
  align-items: center;
  gap: 27px;
}.footer-inner .brand strong {
  font-size: 18px;
}.footer-inner .brand small {
  font-size: 10px;
}.footer-inner .brand {
  gap: 8px;
}.footer-inner>p {
  margin: 0;
  border-left: 1px solid #ffffff10;
  padding-left: 27px;
  font-size: 10px;
  letter-spacing: .5px;
  color: #425372;
}.footer-back {
  margin-left: auto;
  display: flex;
  gap: 10px;
  align-items: center;
  font-size: 10px;
  color: #7587a6;
  padding-block: 10px;
  transition: color .3s;
}.footer-back .icon {
  height: 15px;
  width: 15px;
  transition: transform .3s;
}.footer-back:hover {
  color: #c1d7fa;
}.footer-back:hover .icon {
  transform: translate(2px, -2px);
}.back-to-top {
  position: fixed;
  right: 24px;
  bottom: 24px;
  height: 41px;
  width: 41px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  border: 1px solid #6b83993b;
  background: #101c2deb;
  backdrop-filter: blur(10px);
  color: #a9c9ea;
  z-index: 25;
  box-shadow: 0 6px 23px #0002;
}.back-to-top .icon {
  height: 18px;
  width: 18px;
}.back-to-top:hover {
  background: #203552;
}.reveal {
  opacity: 1;
  transform: none;
}.reveal-ready .reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .8s var(--ease), transform .8s var(--ease);
}.reveal-ready .reveal.is-visible {
  opacity: 1;
  transform: none;
}.reveal-ready .capability-card:nth-child(2) {
  transition-delay: 70ms;
}.motion-paused *,
.motion-paused *:before,
.motion-paused *:after {
  animation-play-state: paused!important;
}.motion-paused .live-dot:after {
  display: none;
}.motion-paused .flow-progress {
  animation-play-state: paused!important;
}
@keyframes hero-in {
  from {
    opacity: 0;
    transform: translateY(22px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes equalize {
  0%,
  100% {
    transform: scaleY(.5);
  }
  50% {
    transform: scaleY(1);
  }
}
@keyframes dot-pulse {
  0% {
    transform: scale(.65);
    opacity: .6;
  }
  90%,
  100% {
    transform: scale(1.7);
    opacity: 0;
  }
}
@keyframes text-flow {
  0%,
  100% {
    background-position: 0 50%;
  }
  50% {
    background-position: 100% 50%;
  }
}
@keyframes button-shine {
  0%,
  60% {
    transform: translateX(-60%);
  }
  85%,
  100% {
    transform: translateX(60%);
  }
}
@keyframes aurora-drift {
  0%,
  100% {
    transform: translate(0, 0);
  }
  50% {
    transform: translate(-35px, 25px);
  }
}
@keyframes center-float {
  0%,
  100% {
    transform: translateY(-3px);
  }
  50% {
    transform: translateY(4px);
  }
}
@keyframes orbital-dot {
  to {
    transform: rotate(360deg);
  }
}
@keyframes label-float {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
}
@keyframes node-blink {
  0%,
  100% {
    opacity: .4;
  }
  50% {
    opacity: 1;
  }
}
@keyframes rail-run {
  from {
    left: 0;
    opacity: 0;
  }
  10%,
  90% {
    opacity: .7;
  }
  to {
    left: calc(100% - 100px);
    opacity: 0;
  }
}
@keyframes scroll-tick {
  0%,
  100% {
    transform: translateY(0);
    opacity: .3;
  }
  50% {
    transform: translateY(6px);
    opacity: 1;
  }
}
@keyframes flow-fill {
  to {
    transform: scaleX(1);
  }
}
@keyframes panel-arrive {
  from {
    opacity: .25;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes item-arrive {
  from {
    opacity: .3;
    transform: translateX(8px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
@keyframes caret-blink {
  0%,
  49% {
    opacity: 1;
  }
  50%,
  100% {
    opacity: 0;
  }
}
@keyframes timeline-event {
  0%,
  100% {
    filter: brightness(1);
  }
  50% {
    filter: brightness(.97);
  }
}
@keyframes timeline-scan {
  0%,
  100% {
    left: 0;
    opacity: .3;
  }
  50% {
    left: 100%;
    opacity: 1;
  }
}
@keyframes radar-spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes keyword-drift {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}
@keyframes radar-dot {
  0%,
  100% {
    opacity: .3;
  }
  50% {
    opacity: 1;
    box-shadow: 0 0 0 5px #8ab7ea12;
  }
}
@keyframes template-drift {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}
@keyframes writer-line {
  0%,
  100% {
    background-position: 150% 0;
  }
  50% {
    background-position: 0 0;
  }
}
@keyframes site-glow {
  0%,
  100% {
    border-color: #4c6e9933;
  }
  50% {
    border-color: #85b0de77;
    box-shadow: 0 0 15px #4c97c40c;
  }
}
@keyframes ops-data {
  0% {
    top: 2%;
    opacity: 0;
  }
  20%,
  80% {
    opacity: 1;
  }
  100% {
    top: 98%;
    opacity: 0;
  }
}
@keyframes ops-scan {
  0%,
  100% {
    top: 0;
    opacity: .2;
  }
  50% {
    top: 100%;
    opacity: .8;
  }
}
@keyframes closing-glow {
  0%,
  100% {
    opacity: .5;
  }
  50% {
    opacity: 1;
  }
}
@keyframes closing-ring {
  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
@media(min-width:1500px) {
  .hero-layout {
    gap: 65px;
    min-height: 700px;
  }.hero h1 {
    font-size: 52px;
  }.engine-scene {
    height: 545px;
  }.hero {
    padding-top: 5px;
  }.hero-bottom {
    min-height: 136px;
  }
}
@media(max-width:1190px) {
  .container {
    width: calc(100% - 72px);
  }.nav-shell {
    gap: 20px;
  }.main-nav {
    gap: 28px;
    margin-left: 0;
  }.nav-actions {
    gap: 18px;
  }.hero-layout {
    gap: 22px;
    grid-template-columns: 1.08fr 1fr;
    min-height: 600px;
    padding-block: 55px;
  }.hero h1 {
    font-size: clamp(34px, 3.6vw, 43px);
    letter-spacing: -1.3px;
  }.hero-lead {
    font-size: 16px;
  }.hero-description {
    font-size: 12px;
  }.hero-actions {
    gap: 11px;
  }.hero-actions .button {
    font-size: 12px;
    padding-inline: 19px;
    gap: 13px;
  }.hero-footnote {
    font-size: 9px;
    gap: 9px;
  }.engine-scene {
    height: 465px;
  }.engine-scene canvas {
    inset: -8% -10%;
    width: 120%;
    height: 116%;
  }.engine-orbit {
    width: 340px;
    height: 340px;
  }.engine-orbit:after {
    transform-origin: 0 171px;
  }.orbit-b {
    width: 390px;
    height: 390px;
  }.orbit-b:after {
    transform-origin: 0 196px;
  }.engine-label {
    padding: 10px 11px;
    gap: 8px;
  }.engine-label strong {
    font-size: 10px;
  }.engine-label small {
    font-size: 6px;
    letter-spacing: 1.1px;
  }.label-keyword {
    left: -8px;
    top: 57px;
  }.label-create {
    right: -12px;
    top: 225px;
  }.label-publish {
    left: 0;
    bottom: 50px;
  }.engine-node {
    width: 26px;
    height: 26px;
  }.engine-node .icon {
    height: 14px;
    width: 14px;
  }.hero-bottom {
    gap: 35px;
  }.hero-bottom>p strong {
    font-size: 10px;
  }.hero-capability {
    font-size: 10px;
    gap: 9px;
  }.section-intro h2 {
    font-size: 35px;
  }.intro-aside {
    font-size: 11px;
  }.studio-sidebar {
    width: 143px;
    padding-inline: 9px;
  }.sidebar-menu {
    font-size: 10px;
    gap: 8px;
  }.studio-main {
    padding: 24px 22px;
  }.studio-main-heading h3 {
    font-size: 15px;
  }.studio-inspector {
    width: 178px;
    padding: 25px 17px;
  }.studio-inspector h4 {
    font-size: 12px;
  }.studio-inspector p {
    font-size: 9px;
  }.inspector-note {
    left: 17px;
    font-size: 6px;
  }.inspector-setting strong {
    font-size: 9px;
  }.table-row strong {
    font-size: 9px;
  }.table-row small {
    font-size: 7px;
  }.flow-tab {
    padding-inline: 14px;
    gap: 10px;
  }.flow-tab strong {
    font-size: 12px;
  }.flow-tab small {
    font-size: 8px;
  }.flow-tab>.icon {
    width: 16px;
    height: 16px;
  }.flow-number {
    font-size: 9px;
  }.mock-search {
    font-size: 8px;
  }.small-action {
    font-size: 8px;
    padding-inline: 8px;
  }.panel-subtitle {
    gap: 6px;
    font-size: 7px;
  }.capability-card {
    padding-inline: 25px;
  }.capability-card h3 {
    font-size: 23px;
  }.capability-card>p {
    font-size: 10px;
  }.card-bottom {
    gap: 10px;
    font-size: 10px;
  }.card-bottom small {
    font-size: 8px;
  }.writer-sheet {
    margin-inline: 8px;
    padding-inline: 18px;
  }.writer-sheet>strong {
    font-size: 12px;
  }.writer-template {
    max-width: 90%;
    padding-inline: 11px;
  }.writer-template>span {
    font-size: 9px;
  }.operations-panel {
    gap: 30px;
    padding: 37px 32px;
    grid-template-columns: .85fr 1.7fr;
  }.operations-visual {
    gap: 35px;
  }.ops-calendar {
    width: 240px;
  }.ops-link {
    right: -19px;
    width: 19px;
  }.ops-link:before {
    left: 18px;
    width: 16px;
  }.operations-copy h3 {
    font-size: 27px;
  }.operations-copy p {
    font-size: 10px;
  }.ops-site {
    padding: 13px 10px;
    gap: 8px;
  }.site-graphic {
    width: 26px;
    height: 26px;
  }.ops-site strong {
    font-size: 9px;
  }.ops-site small {
    font-size: 6px;
  }.ops-calendar-head {
    padding: 10px;
  }.ops-calendar-head>span {
    font-size: 8px;
  }.scenario-panel h3 {
    font-size: 20px;
  }.scenario-tab {
    gap: 12px;
  }.scenario-layout {
    gap: 27px;
  }.scenario-tab>strong {
    font-size: 14px;
  }.scenario-panel {
    padding-inline: 28px;
  }
}
@media(max-width:960px) {
  .container {
    width: calc(100% - 56px);
  }.site-header {
    height: 77px;
  }.brand strong {
    font-size: 20px;
  }.brand img {
    width: 39px;
    height: 37px;
  }.main-nav {
    gap: 22px;
  }.main-nav a {
    font-size: 11px;
  }.nav-actions {
    gap: 15px;
  }.button-back {
    font-size: 10px;
    padding-inline: 13px;
  }.hero-layout {
    grid-template-columns: 1fr 1fr;
    gap: 17px;
    min-height: 580px;
    padding-block: 50px;
  }.hero h1 {
    font-size: 33px;
    line-height: 1.6;
    letter-spacing: -1px;
  }.hero-eyebrow {
    font-size: 7px;
    letter-spacing: 1.5px;
    margin-bottom: 22px;
    gap: 9px;
  }.hero-lead {
    font-size: 14px;
    letter-spacing: .5px;
  }.hero-description {
    font-size: 11px;
  }.desktop-break {
    display: none;
  }.hero-actions {
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 26px;
  }.hero-actions .button {
    min-height: 45px;
    font-size: 11px;
    padding-inline: 16px;
    gap: 11px;
  }.hero-actions .button .icon {
    width: 17px;
    height: 17px;
  }.hero-actions .button-ghost {
    padding-inline: 13px;
    font-size: 10px;
  }.hero-footnote {
    gap: 8px;
    font-size: 8px;
    margin-top: 26px;
    letter-spacing: 0;
  }.hero-footnote>span {
    width: 10px;
  }.engine-scene {
    height: 410px;
  }.engine-scene canvas {
    inset: 0 -16%;
    width: 132%;
    height: 100%;
  }.engine-orbit {
    width: 280px;
    height: 280px;
  }.engine-orbit:after {
    transform-origin: 0 141px;
  }.orbit-b {
    height: 325px;
    width: 325px;
  }.orbit-b:after {
    transform-origin: 0 163px;
  }.engine-center img {
    width: 44px;
    height: 42px;
  }.engine-center>span {
    font-size: 8px;
    letter-spacing: 2px;
  }.engine-label strong {
    font-size: 8px;
    letter-spacing: .2px;
  }.engine-label small {
    font-size: 5px;
    letter-spacing: .8px;
  }.engine-label {
    padding: 9px;
    gap: 7px;
    border-radius: 7px;
  }.engine-node {
    width: 22px;
    height: 22px;
    border-radius: 5px;
  }.engine-node .icon {
    height: 12px;
    width: 12px;
  }.label-keyword {
    top: 60px;
    left: -9px;
  }.label-create {
    top: 200px;
    right: -12px;
  }.label-publish {
    bottom: 54px;
    left: 5px;
  }.scene-coordinate {
    font-size: 6px;
    left: 0;
    letter-spacing: 1px;
  }.coord-top>span {
    font-size: 6px;
  }.coord-bottom {
    font-size: 6px;
  }.scene-axis {
    font-size: 8px;
  }.hero-bottom {
    min-height: 105px;
    gap: 23px;
  }.hero-bottom>p {
    font-size: 8px;
  }.hero-bottom>p strong {
    font-size: 8px;
  }.hero-capability {
    font-size: 8px;
    gap: 7px;
  }.hero-capability>span {
    font-size: 7px;
  }.scroll-cue {
    gap: 5px;
    padding-left: 0;
  }.scroll-cue>span {
    width: 15px;
    height: 24px;
  }.scroll-cue>span:after {
    left: 6px;
  }.scroll-cue .icon {
    display: none;
  }.workflow-section {
    padding-block: 80px 65px;
  }.section-intro {
    gap: 25px;
    margin-bottom: 35px;
  }.section-intro h2 {
    font-size: 29px;
    letter-spacing: -.7px;
  }.section-kicker {
    font-size: 8px;
    letter-spacing: 1.2px;
    margin-bottom: 17px;
  }.intro-aside {
    font-size: 10px;
    max-width: 235px;
  }.workflow-selector {
    gap: 10px;
    margin-bottom: 17px;
  }.flow-tab {
    padding: 14px 12px;
    gap: 9px;
    min-height: 75px;
  }.flow-tab strong {
    font-size: 11px;
  }.flow-tab small {
    font-size: 7px;
  }.flow-tab>.icon {
    display: none;
  }.flow-number {
    font-size: 8px;
  }.studio-sidebar {
    width: 127px;
    padding-inline: 8px;
  }.sidebar-brand {
    font-size: 13px;
    gap: 6px;
    margin-inline: 8px;
    margin-bottom: 27px;
  }.sidebar-brand img {
    width: 22px;
    height: 21px;
  }.sidebar-menu {
    font-size: 9px;
    padding-inline: 10px;
    gap: 7px;
  }.sidebar-menu .icon {
    height: 13px;
    width: 13px;
  }.sidebar-caption {
    font-size: 6px;
    left: 19px;
  }.studio-main {
    padding: 22px 20px;
  }.studio-main-heading h3 {
    font-size: 15px;
  }.studio-inspector {
    display: none;
  }.studio-body {
    min-height: 377px;
  }.studio-site {
    font-size: 8px;
  }.table-row strong {
    font-size: 10px;
  }.table-row small {
    font-size: 8px;
  }.mock-search {
    font-size: 9px;
  }.small-action {
    font-size: 9px;
  }.panel-subtitle {
    font-size: 8px;
  }.studio-bottom {
    font-size: 7px;
  }.studio-disclaimer {
    font-size: 9px;
  }.capabilities-section {
    padding-block: 78px 65px;
  }.capability-grid {
    grid-template-columns: 1fr 1fr;
    gap: 17px;
  }.capability-card {
    padding: 24px 22px 0;
  }.card-identity {
    font-size: 7px;
    letter-spacing: 1.2px;
  }.card-identity .icon {
    width: 16px;
    height: 16px;
  }.capability-card h3 {
    font-size: 22px;
    margin-top: 17px;
    line-height: 1.55;
    letter-spacing: -.6px;
  }.capability-card>p {
    font-size: 10px;
    min-height: 60px;
  }.writer-visual,
  .radar-visual {
    height: 239px;
  }.writer-visual {
    padding-top: 24px;
    margin-inline: -7px;
  }.writer-template {
    max-width: 92%;
    padding: 9px 10px;
  }.writer-template>span {
    font-size: 8px;
    gap: 5px;
  }.writer-template .template-applied {
    font-size: 7px;
  }.writer-sheet {
    padding: 22px 14px 15px;
    margin-inline: 3px;
  }.writer-sheet>strong {
    font-size: 10px;
  }.writer-sheet .sheet-label {
    font-size: 5px;
  }.sheet-image {
    width: 51px;
    height: 33px;
  }.card-bottom {
    font-size: 9px;
    gap: 7px;
    min-height: 59px;
  }.card-bottom small {
    font-size: 7px;
    letter-spacing: 0;
  }.radar-grid {
    width: 220px;
    height: 220px;
  }.radar-word {
    font-size: 8px;
    padding: 5px 9px;
  }.radar-sweep {
    height: 218px;
    width: 218px;
    margin-left: -109px;
    margin-top: -109px;
  }.radar-center {
    height: 39px;
    width: 39px;
  }.word-a {
    left: 0;
  }.word-c {
    left: -3px;
  }.word-b {
    right: -3px;
  }.word-d {
    right: 2%;
    bottom: 27px;
  }.operations-panel {
    grid-template-columns: 1fr;
    gap: 30px;
    padding: 32px;
    min-height: 0;
  }.operations-copy {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 25px;
    align-items: center;
  }.operations-copy>.card-identity {
    grid-column: 1 / 3;
    font-size: 7px;
  }.operations-copy h3 {
    font-size: 27px;
    grid-row: 2 / 4;
    margin: 12px 0 0;
  }.operations-copy h3 br {
    display: none;
  }.operations-copy p {
    font-size: 10px;
    max-width: none;
    grid-column: 2;
    grid-row: 2;
    margin-top: 12px;
  }.operations-tags {
    grid-column: 2;
    grid-row: 3;
    margin-top: 12px;
  }.operations-visual {
    gap: 42px;
    max-width: 600px;
    width: 100%;
    margin-inline: auto;
    justify-content: center;
  }.ops-sites {
    max-width: 210px;
  }.ops-site {
    padding: 15px 16px;
    gap: 12px;
  }.ops-site strong {
    font-size: 11px;
  }.ops-site small {
    font-size: 8px;
  }.site-graphic {
    width: 32px;
    height: 32px;
  }.ops-calendar {
    width: 280px;
  }.ops-link {
    right: -22px;
    width: 22px;
  }.ops-link:before {
    left: 21px;
    width: 20px;
  }.ops-calendar-head {
    padding: 12px;
  }.ops-calendar-head>span {
    font-size: 9px;
  }.principles {
    gap: 20px;
    margin-top: 30px;
  }.principles>div {
    padding-left: 0;
    grid-template-columns: 22px 1fr;
    column-gap: 8px;
  }.principles strong {
    font-size: 10px;
  }.principles>div>span {
    font-size: 8px;
  }.principles .icon {
    width: 18px;
    height: 18px;
  }.scenarios-section {
    padding-block: 10px 78px;
  }.scenarios-section .section-intro {
    padding-top: 54px;
  }.scenario-layout {
    gap: 22px;
    grid-template-columns: .78fr 1.7fr;
  }.scenario-tab {
    padding: 20px 14px;
    gap: 10px;
  }.scenario-tab>strong {
    font-size: 13px;
  }.scenario-tab>span {
    font-size: 7px;
  }.scenario-tab>.icon {
    height: 17px;
    width: 17px;
  }.scenario-tab .scenario-arrow {
    height: 13px;
    width: 13px;
  }.scenario-panel {
    padding: 26px 25px;
    min-height: 244px;
  }.scenario-panel h3 {
    font-size: 18px;
    margin-top: 11px;
  }.scenario-panel>p {
    font-size: 10px;
  }.scenario-path {
    gap: 9px;
    margin-top: 21px;
  }.scenario-path>span {
    font-size: 8px;
    padding: 5px 8px;
  }.scenario-path .icon {
    height: 11px;
    width: 11px;
  }.scenario-note {
    font-size: 8px;
    margin-top: 17px;
  }.closing-content {
    padding-block: 75px 83px;
  }.closing-content h2 {
    font-size: 37px;
    letter-spacing: -.8px;
  }.closing-content p {
    font-size: 11px;
  }.closing-section {
    min-height: 445px;
  }.closing-wordmark {
    font-size: 150px;
  }.closing-content .section-kicker {
    font-size: 7px;
  }.footer-inner {
    min-height: 100px;
  }
}
@media(max-width:700px) {
  .main-nav {
    display: none;
  }.nav-actions {
    gap: 20px;
  }.container {
    width: calc(100% - 40px);
  }.hero-layout {
    grid-template-columns: 1fr;
    gap: 20px;
    padding-block: 46px 15px;
  }.hero-copy {
    text-align: center;
  }.hero-eyebrow {
    justify-content: center;
    font-size: 8px;
    letter-spacing: 1.6px;
    margin-bottom: 22px;
  }.hero h1 {
    font-size: clamp(31px, 7.4vw, 42px);
    line-height: 1.52;
    letter-spacing: -1px;
    margin-bottom: 19px;
  }.hero-lead {
    font-size: 15px;
    letter-spacing: .8px;
    margin-bottom: 8px;
  }.hero-description {
    font-size: 12px;
    max-width: 365px;
    margin-inline: auto;
    line-height: 2;
  }.hero-actions {
    justify-content: center;
    margin-top: 24px;
    gap: 12px;
  }.hero-actions .button {
    min-height: 46px;
    font-size: 12px;
    padding-inline: 22px;
    gap: 17px;
  }.hero-actions .button-ghost {
    font-size: 11px;
    padding-inline: 18px;
  }.hero-footnote {
    justify-content: center;
    margin-top: 24px;
    font-size: 9px;
    gap: 10px;
  }.engine-scene {
    width: min(430px, 100%);
    height: 370px;
    margin-inline: auto;
  }.engine-scene canvas {
    inset: -8% -11%;
    width: 122%;
    height: 116%;
  }.engine-orbit {
    width: 285px;
    height: 285px;
  }.engine-orbit:after {
    transform-origin: 0 143.5px;
  }.orbit-b {
    width: 335px;
    height: 335px;
  }.orbit-b:after {
    transform-origin: 0 168.5px;
  }.scene-coordinate {
    font-size: 6px;
    letter-spacing: 1px;
  }.coord-top {
    top: 12px;
  }.coord-bottom {
    bottom: 12px;
    font-size: 6px;
  }.coord-top>span {
    font-size: 6px;
  }.engine-center img {
    width: 44px;
    height: 42px;
  }.engine-center>span {
    font-size: 8px;
  }.engine-label {
    padding: 9px 10px;
    gap: 7px;
  }.engine-label strong {
    font-size: 9px;
  }.engine-label small {
    font-size: 5px;
    letter-spacing: 1px;
  }.engine-node {
    width: 24px;
    height: 24px;
  }.label-keyword {
    top: 51px;
    left: 0;
  }.label-create {
    right: -2px;
    top: 177px;
  }.label-publish {
    bottom: 43px;
    left: 9px;
  }.hero-bottom {
    min-height: 100px;
    gap: 13px;
    justify-content: space-between;
  }.hero-bottom>p {
    display: none;
  }.hero-capability {
    font-size: 8px;
    gap: 6px;
  }.hero-capability>span {
    font-size: 6px;
  }.scroll-cue {
    display: none;
  }.hero-bottom:before {
    width: 70px;
  }.workflow-section {
    padding-block: 58px 52px;
  }.section-intro {
    display: block;
    margin-bottom: 27px;
  }.section-intro h2 {
    font-size: 29px;
    line-height: 1.55;
    letter-spacing: -.5px;
  }.section-kicker {
    font-size: 7px;
    letter-spacing: 1.2px;
    margin-bottom: 17px;
    gap: 8px;
  }.section-kicker>i {
    width: 4px;
    height: 4px;
  }.intro-aside {
    font-size: 10px;
    margin-top: 17px;
    max-width: none;
    line-height: 1.9;
  }.intro-aside br {
    display: none;
  }.workflow-selector {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 18px;
  }.flow-tab {
    min-height: 75px;
    padding: 15px 13px;
    gap: 12px;
    border-radius: 7px;
  }.flow-number {
    font-size: 9px;
  }.flow-tab strong {
    font-size: 12px;
  }.flow-tab small {
    font-size: 8px;
  }.flow-tab>.icon {
    display: block;
    height: 16px;
    width: 16px;
  }.studio {
    border-radius: 10px;
  }.studio-topbar {
    height: 33px;
    padding-inline: 12px;
    gap: 10px;
  }.window-dots {
    gap: 4px;
  }.window-dots>i {
    height: 5px;
    width: 5px;
  }.studio-title {
    font-size: 6px;
    letter-spacing: .5px;
  }.interface-badge {
    font-size: 6px;
    padding: 2px 4px;
  }.studio-sidebar {
    display: none;
  }.studio-main {
    padding: 22px 19px 20px;
  }.studio-main-heading {
    margin-bottom: 20px;
    align-items: center;
  }.studio-main-heading small {
    font-size: 6px;
    letter-spacing: 1.3px;
  }.studio-main-heading h3 {
    font-size: 15px;
  }.studio-site {
    font-size: 7px;
    padding: 3px 5px;
    gap: 4px;
  }.studio-site .icon {
    height: 10px;
    width: 10px;
  }.studio-body {
    min-height: 354px;
  }.flow-panel {
    min-height: 245px;
  }.mock-search {
    font-size: 8px;
    padding: 8px 9px;
  }.small-action {
    font-size: 7px;
    padding: 7px 8px;
  }.panel-toolbar {
    margin-bottom: 15px;
    gap: 8px;
  }.table-row {
    padding: 15px 9px;
    gap: 8px;
  }.table-row strong {
    font-size: 10px;
  }.table-row small {
    font-size: 7px;
    margin-top: 4px;
  }.table-head {
    font-size: 8px;
    padding-inline: 9px;
  }.tag {
    font-size: 7px;
    padding-inline: 5px;
  }.panel-note {
    font-size: 7px;
    gap: 5px;
    margin-top: 15px;
    line-height: 1.8;
    align-items: flex-start;
  }.panel-note .icon {
    width: 11px;
    height: 11px;
    margin-top: 1px;
  }.check-box {
    height: 9px;
    width: 9px;
  }.check-box.checked:after {
    width: 4px;
    left: 1px;
    top: 1.5px;
  }.studio-bottom {
    font-size: 7px;
    gap: 10px;
    padding: 11px 12px;
    align-items: flex-start;
  }.studio-bottom>span {
    gap: 6px;
    line-height: 1.8;
  }.studio-bottom>span>.live-dot {
    margin-top: 5px;
  }.studio-disclaimer {
    font-size: 8px;
    letter-spacing: .2px;
    margin-top: 15px;
  }.panel-subtitle {
    font-size: 7px;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }.panel-subtitle .tag {
    font-size: 7px;
  }.panel-subtitle>strong {
    font-size: 11px;
  }.panel-toolbar .small-action {
    margin-left: auto;
  }.document-toolbar {
    font-size: 9px;
    padding-bottom: 11px;
  }.document-status {
    font-size: 7px;
  }.demo-document {
    padding: 17px 3px 5px;
  }.document-category {
    font-size: 7px;
  }.demo-document h4 {
    font-size: 14px;
    line-height: 1.65;
    margin-block: 9px 13px;
  }.demo-document>p {
    font-size: 11px;
    line-height: 2.2;
  }.document-outline {
    gap: 6px;
    margin-top: 19px;
  }.document-outline>span {
    font-size: 7px;
    padding: 5px 6px;
  }.timeline-body {
    height: 173px;
  }.timeline-event {
    font-size: 7px;
    padding: 7px;
    margin: 5px;
    gap: 4px;
  }.timeline-event small {
    font-size: 6px;
  }.timeline-event .icon {
    width: 10px;
    height: 10px;
  }.timeline-days {
    font-size: 8px;
  }.capabilities-section {
    padding-block: 58px 47px;
  }.capability-grid {
    grid-template-columns: 1fr;
    gap: 17px;
  }.capability-card {
    padding: 25px 24px 0;
    border-radius: 13px;
  }.card-identity {
    font-size: 7px;
    letter-spacing: 1.5px;
  }.capability-card h3 {
    font-size: 26px;
    line-height: 1.6;
    margin: 18px 0 11px;
    letter-spacing: -.6px;
  }.capability-card>p {
    font-size: 11px;
    line-height: 2;
    min-height: 0;
    max-width: 340px;
  }.radar-visual,
  .writer-visual {
    height: 259px;
  }.radar-grid {
    height: 240px;
    width: 240px;
  }.radar-sweep {
    height: 238px;
    width: 238px;
    margin-left: -119px;
    margin-top: -119px;
  }.radar-center {
    width: 43px;
    height: 43px;
  }.radar-word {
    font-size: 9px;
    padding: 6px 11px;
  }.word-a {
    left: 2%;
    top: 39px;
  }.word-c {
    left: 0;
    bottom: 63px;
  }.word-b {
    right: 0;
    top: 95px;
  }.word-d {
    right: 6%;
    bottom: 28px;
  }.card-bottom {
    min-height: 61px;
    font-size: 10px;
    gap: 9px;
  }.card-bottom small {
    font-size: 8px;
  }.writer-visual {
    padding-top: 25px;
    margin-inline: 0;
  }.writer-template {
    max-width: 91%;
    padding: 11px 13px;
  }.writer-template>span {
    font-size: 9px;
    gap: 7px;
  }.writer-template .template-applied {
    font-size: 8px;
  }.writer-sheet {
    margin-inline: 8px;
    padding: 24px 20px 16px;
  }.writer-sheet>strong {
    font-size: 12px;
  }.writer-sheet .sheet-label {
    font-size: 6px;
  }.sheet-image {
    width: 60px;
    height: 38px;
  }.writer-lines {
    gap: 8px;
    margin-top: 15px;
  }.sheet-bottom {
    margin-top: 16px;
  }.sheet-spark {
    height: 34px;
    width: 34px;
    right: -12px;
  }.operations-panel {
    padding: 28px 23px;
    gap: 26px;
    border-radius: 13px;
    margin-top: 17px;
  }.operations-copy {
    display: block;
  }.operations-copy>.card-identity {
    font-size: 6px;
  }.operations-copy h3 {
    font-size: 29px;
    margin-top: 18px;
    margin-bottom: 12px;
  }.operations-copy h3 br {
    display: none;
  }.operations-copy p {
    font-size: 11px;
    max-width: 320px;
    margin: 0;
  }.operations-tags {
    margin-top: 16px;
  }.operations-tags>span {
    font-size: 8px;
  }.operations-visual {
    gap: 18px;
    align-items: center;
    flex-direction: column;
    max-width: 100%;
  }.ops-sites {
    flex-direction: row;
    gap: 10px;
    max-width: none;
    width: 100%;
    flex: auto;
  }.ops-site {
    flex: 1;
    min-width: 0;
    padding: 12px 10px;
    gap: 9px;
  }.ops-site strong {
    font-size: 10px;
  }.ops-site small {
    font-size: 7px;
  }.site-graphic {
    height: 27px;
    width: 27px;
    flex: none;
  }.site-graphic .icon {
    height: 16px;
    width: 16px;
  }.ops-site>i {
    display: none;
  }.ops-link {
    display: none;
  }.ops-calendar {
    width: 100%;
    max-width: 340px;
    border-radius: 7px;
  }.ops-calendar-head {
    padding: 13px;
  }.ops-calendar-head>span {
    font-size: 9px;
  }.ops-calendar-head>span:last-child {
    font-size: 7px;
  }.ops-calendar-week {
    font-size: 8px;
    padding: 10px 0;
  }.ops-calendar-grid {
    height: 130px;
  }.ops-event {
    font-size: 8px;
    padding-inline: 10px;
  }.ops-calendar-foot {
    font-size: 8px;
    padding: 10px 13px;
  }.principles {
    grid-template-columns: 1fr;
    gap: 19px;
    margin: 31px 0 0;
    padding-inline: 4px;
  }.principles>div {
    grid-template-columns: 25px auto 1fr;
    column-gap: 10px;
    row-gap: 0;
  }.principles .icon {
    grid-row: 1;
    height: 19px;
    width: 19px;
  }.principles strong {
    font-size: 10px;
  }.principles>div>span {
    font-size: 9px;
    justify-self: end;
  }.scenarios-section {
    padding-block: 0 59px;
  }.scenarios-section .section-intro {
    padding-top: 47px;
  }.scenario-layout {
    display: block;
  }.scenario-tabs {
    flex-direction: row;
    gap: 7px;
    margin-bottom: 15px;
  }.scenario-tab {
    flex: 1;
    min-width: 0;
    justify-content: center;
    gap: 6px;
    padding: 13px 8px;
    border: 1px solid #e4eaf3;
    border-radius: 6px;
    background: #fff;
  }.scenario-tab>strong {
    font-size: 11px;
  }.scenario-tab>.icon {
    height: 14px;
    width: 14px;
  }.scenario-tab>span {
    display: none;
  }.scenario-tab .scenario-arrow {
    display: none;
  }.scenario-tab.active {
    background: #eaf0fa;
    border-color: #d4e1f3;
  }.scenario-panel {
    padding: 25px 23px 24px;
    min-height: 263px;
    border-radius: 10px;
  }.scenario-label {
    font-size: 7px;
    letter-spacing: 1.5px;
  }.scenario-panel h3 {
    font-size: 21px;
    line-height: 1.6;
    max-width: 300px;
    margin: 12px 0;
  }.scenario-panel>p {
    font-size: 11px;
    line-height: 2;
  }.scenario-path {
    gap: 8px;
    flex-wrap: nowrap;
    margin-top: 22px;
  }.scenario-path>span {
    font-size: 8px;
    white-space: nowrap;
    padding: 5px 7px;
  }.scenario-path>.icon {
    height: 10px;
    width: 10px;
  }.scenario-note {
    font-size: 8px;
    margin-top: 18px;
    gap: 6px;
  }.note-line {
    width: 10px;
  }.closing-section {
    min-height: 398px;
  }.closing-content {
    padding-block: 67px 76px;
  }.closing-content .section-kicker {
    font-size: 6px;
    letter-spacing: 1.3px;
    margin-bottom: 23px;
    gap: 7px;
  }.closing-content .section-kicker>i {
    height: 4px;
    width: 4px;
  }.closing-content h2 {
    font-size: clamp(25px, 5.8vw, 37px);
    line-height: 1.65;
    letter-spacing: -.6px;
  }.closing-content p {
    font-size: 10px;
    margin: 17px 0 25px;
    letter-spacing: 0;
  }.closing-content .button {
    min-height: 47px;
    font-size: 12px;
    gap: 20px;
    padding-inline: 23px;
  }.closing-wordmark {
    font-size: 110px;
    bottom: -16px;
    letter-spacing: -7px;
  }.closing-orbits {
    bottom: -350px;
  }.closing-aurora {
    width: 450px;
  }.footer-inner {
    min-height: 112px;
    gap: 17px;
    flex-wrap: wrap;
    padding-block: 25px;
  }.footer-inner .brand strong {
    font-size: 17px;
  }.footer-inner .brand img {
    width: 33px;
    height: 31px;
  }.footer-inner .brand small {
    font-size: 8px;
    letter-spacing: .7px;
  }.footer-inner>p {
    border: 0;
    padding: 0;
    font-size: 8px;
    letter-spacing: 0;
  }.footer-back {
    font-size: 9px;
    gap: 5px;
  }.footer-back .icon {
    height: 13px;
    width: 13px;
  }.back-to-top {
    height: 36px;
    width: 36px;
    right: 14px;
    bottom: 14px;
    border-radius: 6px;
  }.back-to-top .icon {
    height: 16px;
    width: 16px;
  }.reveal-ready .reveal {
    transform: translateY(18px);
  }.reveal-ready .capability-card:nth-child(2) {
    transition-delay: 0;
  }
}
@media(max-width:400px) {
  .hero h1 {
    font-size: 31px;
    letter-spacing: -.7px;
  }.hero-eyebrow {
    font-size: 7px;
    letter-spacing: 1.3px;
  }.hero-lead {
    font-size: 14px;
  }.hero-description {
    font-size: 11px;
    max-width: 310px;
  }.hero-actions .button {
    font-size: 11px;
    padding-inline: 18px;
    gap: 12px;
  }.hero-actions .button-ghost {
    font-size: 10px;
    padding-inline: 15px;
  }.hero-footnote {
    font-size: 8px;
    gap: 8px;
  }.engine-scene {
    height: 345px;
  }.engine-orbit {
    width: 255px;
    height: 255px;
  }.engine-orbit:after {
    transform-origin: 0 128.5px;
  }.orbit-b {
    width: 295px;
    height: 295px;
  }.orbit-b:after {
    transform-origin: 0 148.5px;
  }.label-keyword {
    top: 47px;
    left: 0;
  }.label-create {
    top: 160px;
    right: -2px;
  }.label-publish {
    bottom: 42px;
    left: 6px;
  }.engine-label strong {
    font-size: 8px;
  }.engine-label small {
    font-size: 5px;
  }.engine-label {
    gap: 6px;
    padding: 8px;
  }.engine-node {
    width: 22px;
    height: 22px;
  }.hero-capability {
    font-size: 7px;
    gap: 5px;
  }.hero-bottom {
    min-height: 86px;
    gap: 10px;
  }.hero-capability>span {
    font-size: 6px;
  }.section-intro h2 {
    font-size: 26px;
  }.intro-aside {
    font-size: 9px;
  }.flow-tab {
    gap: 9px;
    padding: 14px 11px;
  }.flow-tab strong {
    font-size: 11px;
  }.flow-tab small {
    font-size: 7px;
  }.flow-tab>.icon {
    height: 14px;
    width: 14px;
  }.flow-number {
    font-size: 8px;
  }.studio-main {
    padding-inline: 15px;
  }.studio-main-heading h3 {
    font-size: 13px;
  }.studio-site {
    font-size: 6px;
    gap: 3px;
  }.studio-main-heading small {
    font-size: 5px;
  }.studio-main-heading {
    gap: 8px;
  }.table-row strong {
    font-size: 9px;
  }.table-row small {
    font-size: 6px;
  }.tag {
    font-size: 6px;
    padding-inline: 4px;
  }.studio-title {
    font-size: 5px;
  }.studio-topbar {
    padding-inline: 10px;
  }.interface-badge {
    font-size: 5px;
  }.window-dots>i {
    height: 4px;
    width: 4px;
  }.panel-note {
    font-size: 6px;
  }.studio-bottom {
    font-size: 6px;
    padding-inline: 10px;
  }.mock-search {
    font-size: 7px;
  }.small-action {
    font-size: 6px;
    padding-inline: 6px;
  }.table-head {
    font-size: 7px;
  }.demo-document h4 {
    font-size: 13px;
  }.demo-document>p {
    font-size: 10px;
  }.document-outline {
    gap: 5px;
  }.document-outline>span {
    font-size: 6px;
    padding-inline: 5px;
  }.document-status {
    font-size: 6px;
  }.panel-subtitle {
    font-size: 6px;
  }.timeline-event {
    font-size: 6px;
  }.timeline-event small {
    font-size: 5px;
  }.capability-card {
    padding-inline: 21px;
  }.capability-card h3 {
    font-size: 23px;
  }.capability-card>p {
    font-size: 10px;
  }.card-bottom {
    font-size: 9px;
  }.card-bottom small {
    font-size: 7px;
  }.writer-sheet>strong {
    font-size: 11px;
  }.writer-template>span {
    font-size: 8px;
  }.operations-panel {
    padding-inline: 20px;
  }.operations-copy h3 {
    font-size: 27px;
  }.operations-copy p {
    font-size: 10px;
  }.ops-site {
    padding: 11px 9px;
    gap: 7px;
  }.ops-site strong {
    font-size: 9px;
  }.ops-site small {
    font-size: 6px;
  }.site-graphic {
    height: 24px;
    width: 24px;
  }.principles>div {
    grid-template-columns: 23px auto 1fr;
    gap: 7px;
  }.principles strong {
    font-size: 9px;
  }.principles>div>span {
    font-size: 8px;
  }.scenario-tab {
    gap: 5px;
    padding-inline: 6px;
  }.scenario-tab>strong {
    font-size: 10px;
  }.scenario-panel {
    padding-inline: 21px;
  }.scenario-panel h3 {
    font-size: 19px;
  }.scenario-panel>p {
    font-size: 10px;
  }.scenario-path {
    gap: 5px;
  }.scenario-path>span {
    font-size: 7px;
    padding: 5px 6px;
  }.scenario-path>.icon {
    height: 9px;
    width: 9px;
  }.scenario-note {
    font-size: 7px;
  }.footer-inner {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 14px;
  }.footer-inner>p {
    grid-column: 1;
    grid-row: 2;
  }.footer-back {
    grid-column: 2;
    grid-row: 1 / 3;
    font-size: 10px;
  }.footer-inner .brand strong {
    font-size: 18px;
  }.footer-inner .brand small {
    font-size: 9px;
  }.nav-actions {
    gap: 16px;
  }
}
@media(max-width:340px) {
  .container {
    width: calc(100% - 32px);
  }.site-header {
    height: 71px;
  }.brand strong {
    font-size: 18px;
  }.brand small {
    font-size: 9px;
  }.brand img {
    width: 34px;
    height: 32px;
  }.brand {
    gap: 7px;
  }.button-back {
    font-size: 9px;
    padding-inline: 10px;
    gap: 7px;
  }.nav-actions {
    gap: 16px;
  }.hero h1 {
    font-size: 27px;
  }.hero-eyebrow {
    font-size: 6px;
  }.hero-actions {
    gap: 9px;
  }.hero-actions .button {
    font-size: 10px;
    padding-inline: 16px;
  }.hero-actions .button-ghost {
    font-size: 9px;
    padding-inline: 13px;
  }.hero-lead {
    font-size: 13px;
  }.hero-description {
    font-size: 10px;
    max-width: 280px;
  }.hero-footnote {
    font-size: 7px;
    gap: 7px;
  }.engine-scene {
    height: 315px;
  }.engine-label strong {
    font-size: 7px;
  }.engine-label small {
    font-size: 4px;
    letter-spacing: .6px;
  }.engine-node {
    width: 20px;
    height: 20px;
  }.label-keyword {
    top: 46px;
  }.label-create {
    top: 147px;
  }.label-publish {
    bottom: 41px;
  }.engine-orbit {
    width: 235px;
    height: 235px;
  }.engine-orbit:after {
    transform-origin: 0 118.5px;
  }.orbit-b {
    height: 270px;
    width: 270px;
  }.orbit-b:after {
    transform-origin: 0 136px;
  }.engine-center img {
    width: 38px;
    height: 36px;
  }.scene-coordinate {
    font-size: 5px;
  }.scene-coordinate.coord-bottom {
    font-size: 5px;
  }.hero-capability {
    font-size: 6px;
  }.section-intro h2 {
    font-size: 23px;
  }.section-kicker {
    font-size: 6px;
  }.flow-tab strong {
    font-size: 10px;
  }.flow-tab small {
    font-size: 6px;
  }.flow-tab>.icon {
    display: none;
  }.studio-main-heading h3 {
    font-size: 12px;
  }.studio-site {
    display: none;
  }.panel-toolbar {
    gap: 6px;
  }.panel-toolbar .small-action {
    font-size: 5px;
  }.table-row strong {
    font-size: 8px;
  }.table-row small {
    font-size: 5px;
  }.document-outline>span {
    font-size: 5px;
  }.document-status {
    font-size: 5px;
  }.capability-card h3 {
    font-size: 21px;
  }.capability-card>p {
    font-size: 9px;
  }.card-bottom small {
    font-size: 6px;
  }.writer-sheet>strong {
    font-size: 10px;
  }.operations-copy h3 {
    font-size: 25px;
  }.ops-site strong {
    font-size: 8px;
  }.ops-site small {
    font-size: 5px;
  }.ops-site {
    gap: 6px;
    padding-inline: 8px;
  }.site-graphic {
    height: 22px;
    width: 22px;
  }.principles strong {
    font-size: 8px;
  }.principles>div>span {
    font-size: 7px;
  }.scenario-panel h3 {
    font-size: 17px;
  }.scenario-panel>p {
    font-size: 9px;
  }.scenario-path>span {
    font-size: 6px;
  }.closing-content h2 {
    font-size: 22px;
  }.closing-content .section-kicker {
    font-size: 5px;
  }.closing-content p {
    font-size: 8px;
  }.closing-content .button {
    font-size: 11px;
  }
}
@media(hover:none) {
  .capability-card:hover,
  .button-primary:hover {
    transform: none;
  }.spotlight-card:before {
    display: none;
  }
}
@media(prefers-reduced-motion:reduce) {
  html:not(.motion-on) {
    scroll-behavior: auto;
  }
  html:not(.motion-on) *,
  html:not(.motion-on) *:before,
  html:not(.motion-on) *:after {
    animation: none!important;
    transition: none!important;
    scroll-behavior: auto!important;
  }
  html:not(.motion-on) .reveal {
    opacity: 1;
    transform: none;
  }
  html:not(.motion-on) .engine-orbit:after {
    transform: rotate(65deg);
  }
  html:not(.motion-on) .typing-caret {
    display: none;
  }
}
/* 阅读层级：业务正文保持足够对比度，示意图细节与装饰信息适度退后。 */
.hero-description {
  color: #8c9cb6;
}.text-muted {
  color: #8594ab;
}.light-section .intro-aside {
  color: #6b7c94;
}.capability-card>p {
  color: #687990;
}.card-bottom {
  color: #607998;
}.card-bottom small {
  color: #8091aa;
}.operations-copy p {
  color: #91a5c0;
}.scenario-panel>p {
  color: #697b94;
}.scenario-note {
  color: #8999b0;
}.scenario-path>span {
  color: #7086a5;
}.principles strong {
  color: #647b9a;
}.principles>div>span {
  color: #8294ad;
}
@media(min-width:961px) {
  .capability-card>p {
    font-size: 13px;
  }.intro-aside {
    font-size: 12px;
  }.operations-copy p {
    font-size: 12px;
  }.scenario-panel>p {
    font-size: 12px;
  }.card-bottom small {
    font-size: 10px;
  }.card-bottom {
    font-size: 12px;
  }.scenario-note {
    font-size: 10px;
  }
}
@media(min-width:701px) and (max-width:960px) {
  .capability-card>p {
    font-size: 11px;
  }.operations-copy p {
    font-size: 11px;
  }.scenario-panel>p {
    font-size: 11px;
  }
}
@media(max-width:700px) {
  .capability-card>p {
    font-size: 12px;
  }.operations-copy p {
    font-size: 12px;
  }.scenario-panel>p {
    font-size: 12px;
  }.scenario-note {
    font-size: 9px;
  }.intro-aside {
    font-size: 11px;
  }.card-bottom small {
    font-size: 9px;
  }
}
@media(max-width:400px) {
  .capability-card>p,
  .operations-copy p,
  .scenario-panel>p {
    font-size: 11px;
  }.intro-aside {
    font-size: 10px;
  }.card-bottom small {
    font-size: 8px;
  }.scenario-note {
    font-size: 8px;
  }
}