.page-products {
  --sv-line: #22384F;
  --sv-soft: rgba(167, 183, 200, .16);
  --sv-glow: rgba(242, 178, 51, .16);
  --sv-pad: clamp(18px, 4vw, 34px);
  background: var(--ink-900);
  color: var(--text-main);
  font-family: var(--font-body);
  overflow-x: hidden;
}

.page-products .container {
  width: 100%;
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 var(--gutter);
  box-sizing: border-box;
}

.page-products .eyebrow {
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--amber-500);
  margin: 0 0 12px;
}

.page-products .mono {
  font-family: var(--font-mono);
  letter-spacing: .04em;
}

.page-products .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 20px;
  border-radius: var(--radius-s);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  border: 1px solid transparent;
  transition: background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease), transform .2s var(--ease);
}

.page-products .btn-primary {
  background: var(--amber-500);
  color: var(--ink-900);
}

.page-products .btn-primary:hover {
  background: var(--amber-200);
  transform: translateY(-2px);
}

.page-products .btn-ghost {
  background: transparent;
  color: var(--text-main);
  border-color: var(--ink-600);
}

.page-products .btn-ghost:hover {
  border-color: var(--amber-500);
  color: var(--amber-200);
}

.page-products a:focus-visible,
.page-products .sv-step:focus-visible,
.page-products summary:focus-visible {
  outline: 2px solid var(--amber-500);
  outline-offset: 3px;
  border-radius: var(--radius-s);
}

/* 面包屑 */
.page-products .sv-crumb-list {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 22px 0 0;
  font-size: 13px;
  color: var(--slate-300);
}

.page-products .sv-crumb-list li + li::before {
  content: "/";
  margin-right: 8px;
  color: var(--ink-600);
}

.page-products .sv-crumb-link {
  color: var(--slate-300);
  text-decoration: none;
  border-bottom: 1px solid transparent;
}

.page-products .sv-crumb-link:hover {
  color: var(--amber-200);
  border-bottom-color: var(--amber-200);
}

.page-products .sv-crumb-current {
  color: var(--text-main);
}

/* 首屏 */
.page-products .sv-hero {
  background:
    radial-gradient(900px 520px at 88% -12%, var(--sv-glow), transparent 62%),
    radial-gradient(760px 460px at -8% 108%, rgba(86, 196, 164, .10), transparent 60%),
    var(--ink-900);
  border-bottom: 1px solid var(--ink-600);
  padding-bottom: 32px;
}

.page-products .sv-hero-inner {
  display: grid;
  gap: 28px;
  padding: 22px 0 30px;
}

.page-products h1 {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(34px, 7.4vw, 62px);
  line-height: 1.04;
  letter-spacing: -.02em;
  margin: 0 0 18px;
  color: #fff;
}

.page-products .sv-lede {
  font-size: 16px;
  line-height: 1.78;
  color: var(--slate-300);
  max-width: 36em;
  margin: 0 0 22px;
}

.page-products .sv-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.page-products .sv-hero-figure {
  margin: 0;
}

.page-products .media-frame {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--ink-600);
  border-radius: var(--radius-m);
  background: linear-gradient(160deg, var(--ink-700), var(--ink-800));
  box-shadow: var(--shadow-1);
}

.page-products .media-frame img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

.page-products .sv-hero-figure .media-frame {
  max-width: 420px;
}

.page-products .media-caption {
  margin: 12px 0 0;
  font-size: 13px;
  line-height: 1.6;
  color: var(--slate-300);
  border-left: 2px solid var(--amber-500);
  padding-left: 10px;
}

.page-products .sv-tally {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  padding: 0;
  background: var(--ink-600);
  border: 1px solid var(--ink-600);
  border-radius: var(--radius-m);
  overflow: hidden;
}

.page-products .sv-tally li {
  background: var(--ink-800);
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.page-products .sv-tally-num {
  font-size: 24px;
  font-weight: 700;
  color: var(--amber-500);
  line-height: 1.1;
}

.page-products .sv-tally-label {
  font-size: 13px;
  color: var(--slate-300);
}

/* 章节通用 */
.page-products .section {
  padding: 52px 0;
}

.page-products .section--tall {
  padding: 68px 0;
}

.page-products h2 {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(26px, 4.2vw, 38px);
  line-height: 1.14;
  letter-spacing: -.015em;
  margin: 0 0 14px;
  color: #fff;
}

.page-products h3 {
  font-size: 17px;
  font-weight: 700;
  margin: 0 0 8px;
  color: #fff;
}

/* 总览 */
.page-products .sv-overview {
  display: grid;
  gap: 34px;
}

.page-products .sv-overview-text {
  font-size: 16px;
  line-height: 1.8;
  color: var(--slate-300);
  max-width: 34em;
  margin: 0 0 14px;
}

.page-products .sv-overview-note {
  font-size: 14px;
  line-height: 1.7;
  color: var(--slate-300);
  border-left: 2px solid var(--celadon-400);
  padding-left: 12px;
  margin: 0;
  max-width: 34em;
}

.page-products .sv-tree {
  position: relative;
  list-style: none;
  margin: 0;
  padding: 6px 0 6px 0;
  display: grid;
  gap: 20px;
}

.page-products .sv-tree::before {
  content: "";
  position: absolute;
  left: 17px;
  top: 10px;
  bottom: 22px;
  width: 2px;
  background: linear-gradient(180deg, var(--amber-500), var(--ink-600) 46%, var(--celadon-700));
  opacity: .7;
}

.page-products .sv-ability {
  position: relative;
  padding-left: 50px;
}

.page-products .sv-node {
  position: absolute;
  left: 0;
  top: 20px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--ink-900);
  border: 2px solid var(--amber-500);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 0 5px var(--ink-900);
}

.page-products .sv-node .mono {
  font-size: 12px;
  font-weight: 700;
  color: var(--amber-500);
}

.page-products .sv-ability-card {
  display: block;
  text-decoration: none;
  background: var(--ink-700);
  border: 1px solid var(--ink-600);
  border-radius: var(--radius-m);
  padding: 18px 18px 16px;
  box-shadow: var(--shadow-1);
  transition: transform .24s var(--ease), border-color .24s var(--ease), box-shadow .24s var(--ease);
}

.page-products .sv-ability-card:hover {
  transform: translateY(-4px);
  border-color: var(--amber-500);
  box-shadow: var(--shadow-2);
}

.page-products .sv-ability-card .tag {
  display: inline-block;
  font-size: 12px;
  padding: 3px 9px;
  border-radius: 100px;
  margin-bottom: 10px;
}

.page-products .tag-amber {
  background: var(--amber-500);
  color: var(--ink-900);
  font-weight: 700;
}

.page-products .tag-celadon {
  background: transparent;
  color: var(--celadon-400);
  border: 1px solid var(--celadon-700);
}

.page-products .sv-ability-card .tag:not(.tag-amber):not(.tag-celadon) {
  background: transparent;
  color: var(--slate-300);
  border: 1px solid var(--ink-600);
}

.page-products .sv-ability-title {
  font-size: 18px;
  margin: 0 0 6px;
}

.page-products .sv-ability-text {
  font-size: 14px;
  line-height: 1.7;
  color: var(--slate-300);
  margin: 0 0 12px;
}

.page-products .sv-output {
  display: inline-block;
  font-size: 12px;
  color: var(--amber-200);
  background: rgba(242, 178, 51, .1);
  border: 1px dashed rgba(242, 178, 51, .45);
  border-radius: var(--radius-s);
  padding: 4px 9px;
}

/* 能力章节 */
.page-products .sv-cap-head {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding-bottom: 20px;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--ink-600);
}

.page-products .sv-cap-num {
  flex: none;
  font-size: 13px;
  font-weight: 700;
  color: var(--ink-900);
  background: var(--amber-500);
  border-radius: var(--radius-s);
  padding: 4px 7px;
  margin-top: 6px;
}

.page-products .sv-cap-head h2 {
  margin-bottom: 6px;
}

.page-products .sv-cap-sub {
  margin: 0;
  font-size: 14px;
  line-height: 1.7;
  color: var(--slate-300);
}

.page-products .sv-cap-body {
  display: grid;
  gap: 28px;
}

.page-products .sv-triple {
  display: grid;
  gap: 16px;
}

.page-products .sv-triple-item {
  background: var(--ink-800);
  border: 1px solid var(--ink-600);
  border-left: 3px solid var(--ink-600);
  border-radius: var(--radius-s);
  padding: 16px 18px;
}

.page-products .sv-triple-item p {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.75;
  color: var(--slate-300);
}

.page-products .sv-problem {
  border-left-color: var(--slate-300);
  background: transparent;
}

.page-products .sv-result {
  border-left-color: var(--celadon-400);
}

.page-products .sv-figure {
  margin: 0;
}

/* 批次编号 */
.page-products .sv-code-wrap {
  background: var(--ink-800);
  border: 1px solid var(--ink-600);
  border-radius: var(--radius-m);
  padding: 18px;
}

.page-products .sv-code-intro {
  margin: 0 0 12px;
  font-size: 14px;
  color: var(--slate-300);
}

.page-products .sv-code {
  background: var(--ink-700);
  border: 1px solid var(--ink-600);
  border-radius: var(--radius-s);
  padding: 0 14px;
}

.page-products .sv-code summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 14px 0;
}

.page-products .sv-code summary::-webkit-details-marker {
  display: none;
}

.page-products .sv-code-value {
  font-size: clamp(16px, 3.4vw, 20px);
  font-weight: 700;
  color: var(--ink-900);
  background: var(--amber-200);
  border-radius: var(--radius-s);
  padding: 5px 10px;
  word-break: break-all;
}

.page-products .sv-code-hint {
  font-size: 13px;
  color: var(--slate-300);
  border-bottom: 1px dashed var(--ink-600);
}

.page-products .sv-code[open] summary {
  border-bottom: 1px solid var(--ink-600);
}

.page-products .sv-code-list {
  margin: 0;
  padding: 4px 0 16px;
  display: grid;
  gap: 14px;
}

.page-products .sv-code-item {
  display: grid;
  gap: 4px;
}

.page-products .sv-code-item dt {
  font-size: 13px;
  font-weight: 700;
  color: var(--amber-200);
}

.page-products .sv-code-item dd {
  margin: 0;
  font-size: 14px;
  line-height: 1.7;
  color: var(--slate-300);
}

/* 状态 */
.page-products .sv-status-list {
  display: grid;
  gap: 14px;
}

.page-products .sv-status-card {
  background: var(--ink-800);
  border: 1px solid var(--ink-600);
  border-radius: var(--radius-m);
  padding: 16px 18px;
}

.page-products .sv-status-card p:last-child {
  margin: 8px 0 0;
  font-size: 14px;
  line-height: 1.72;
  color: var(--slate-300);
}

.page-products .sv-status-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0;
}

.page-products .sv-status-name {
  font-size: 16px;
  font-weight: 700;
  color: #fff;
}

.page-products .status-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
  flex: none;
  background: var(--ink-600);
}

.page-products .status-dot[data-state="live"] {
  background: var(--celadon-400);
  box-shadow: 0 0 0 4px rgba(86, 196, 164, .18);
}

.page-products .status-dot[data-state="watching"] {
  background: var(--amber-500);
  box-shadow: 0 0 0 4px rgba(242, 178, 51, .18);
}

.page-products .status-dot[data-state="queued"] {
  background: transparent;
  border: 2px solid var(--celadon-700);
}

.page-products .sv-cap-aside {
  background: var(--ink-700);
  border: 1px solid var(--ink-600);
  border-radius: var(--radius-m);
  padding: 20px;
}

.page-products .sv-aside-list {
  list-style: none;
  margin: 0 0 18px;
  padding: 0;
  display: grid;
  gap: 10px;
}

.page-products .sv-aside-list li {
  position: relative;
  padding-left: 16px;
  font-size: 14px;
  line-height: 1.72;
  color: var(--slate-300);
}

.page-products .sv-aside-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .72em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--amber-500);
}

.page-products .sv-aside-btn {
  width: 100%;
}

/* 移动版 */
.page-products .sv-mobile-text {
  display: grid;
  gap: 16px;
}

/* 季度 */
.page-products .sv-quarter-body {
  display: grid;
  gap: 24px;
}

.page-products .sv-quarter-text p {
  margin: 0 0 14px;
  font-size: 15px;
  line-height: 1.8;
  color: var(--slate-300);
  max-width: 34em;
}

/* 场景 */
.page-products .sv-scenes-section {
  background: linear-gradient(180deg, var(--ink-800), var(--ink-900));
  border-top: 1px solid var(--ink-600);
  border-bottom: 1px solid var(--ink-600);
}

.page-products .sv-section-head {
  margin-bottom: 28px;
}

.page-products .sv-section-head h2 {
  margin-bottom: 0;
}

.page-products .sv-scenes {
  display: grid;
  gap: 16px;
}

.page-products .sv-scene {
  position: relative;
  background: var(--ink-700);
  border: 1px solid var(--ink-600);
  border-top: 3px solid var(--ink-600);
  border-radius: var(--radius-m);
  padding: 20px 18px;
  box-shadow: var(--shadow-1);
}

.page-products .sv-scene--amber {
  border-top-color: var(--amber-500);
}

.page-products .sv-scene--celadon {
  border-top-color: var(--celadon-400);
}

.page-products .sv-scene--paper {
  border-top-color: var(--paper-100);
}

.page-products .sv-scene-tag {
  font-size: 12px;
  color: var(--slate-300);
  margin: 0 0 8px;
}

.page-products .sv-scene p {
  margin: 0 0 12px;
  font-size: 14.5px;
  line-height: 1.75;
  color: var(--slate-300);
}

.page-products .sv-scene h3 {
  margin-bottom: 8px;
}

.page-products .sv-scene-path {
  margin: 0;
  font-size: 12.5px;
  color: var(--amber-200);
  padding-top: 12px;
  border-top: 1px dashed var(--ink-600);
}

/* 步骤 */
.page-products .sv-steps {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 14px;
  counter-reset: svstep;
}

.page-products .sv-step {
  position: relative;
  background: var(--ink-800);
  border: 1px solid var(--ink-600);
  border-radius: var(--radius-m);
  padding: 18px;
  transition: border-color .24s var(--ease), background .24s var(--ease), transform .24s var(--ease);
}

.page-products .sv-step:hover,
.page-products .sv-step:focus {
  border-color: var(--amber-500);
  background: var(--ink-700);
  transform: translateY(-2px);
}

.page-products .sv-step-num {
  display: block;
  font-size: 34px;
  font-weight: 700;
  line-height: 1;
  color: var(--amber-500);
  margin-bottom: 10px;
}

.page-products .sv-step h3 {
  font-size: 16px;
  margin-bottom: 6px;
}

.page-products .sv-step p {
  margin: 0;
  font-size: 14px;
  line-height: 1.72;
  color: var(--slate-300);
}

/* 开放范围：反色分区 */
.page-products .sv-access-section {
  padding-bottom: 72px;
}

.page-products .sv-access {
  background: var(--paper-100);
  color: var(--ink-900);
  border-radius: var(--radius-m);
  padding: var(--sv-pad);
  display: grid;
  gap: 26px;
  box-shadow: var(--shadow-2);
}

.page-products .sv-access-eyebrow {
  color: #8a5c05;
}

.page-products .sv-access h2 {
  color: var(--ink-900);
}

.page-products .sv-access-main p {
  margin: 0 0 12px;
  font-size: 15px;
  line-height: 1.78;
  color: #253546;
  max-width: 34em;
}

.page-products .sv-access-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
}

.page-products .sv-access .btn-primary {
  background: var(--ink-900);
  color: var(--paper-100);
}

.page-products .sv-access .btn-primary:hover {
  background: var(--ink-700);
}

.page-products .sv-access .btn-ghost {
  color: var(--ink-900);
  border-color: rgba(8, 18, 31, .28);
}

.page-products .sv-access .btn-ghost:hover {
  border-color: var(--ink-900);
  color: var(--ink-900);
  background: rgba(8, 18, 31, .06);
}

.page-products .sv-access-list {
  margin: 0;
  display: grid;
  gap: 1px;
  background: rgba(8, 18, 31, .14);
  border: 1px solid rgba(8, 18, 31, .14);
  border-radius: var(--radius-s);
  overflow: hidden;
}

.page-products .sv-access-list > div {
  background: var(--paper-100);
  padding: 12px 14px;
}

.page-products .sv-access-list dt {
  font-size: 12px;
  letter-spacing: .08em;
  color: #5c6b7b;
  margin-bottom: 4px;
}

.page-products .sv-access-list dd {
  margin: 0;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--ink-900);
  word-break: break-word;
}

.page-products .sv-access-list a {
  color: var(--ink-900);
  text-decoration: none;
  border-bottom: 1px solid rgba(8, 18, 31, .35);
}

.page-products .sv-access-list a:hover {
  border-bottom-color: var(--ink-900);
}

/* 滚动显现 */
.page-products [data-reveal] {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .38s var(--ease), transform .38s var(--ease);
}

.page-products [data-reveal].is-revealed {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .page-products [data-reveal],
  .page-products [data-reveal].is-revealed {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .page-products .sv-ability-card:hover,
  .page-products .sv-step:hover,
  .page-products .sv-step:focus {
    transform: none;
  }
}

@media (min-width: 620px) {
  .page-products .sv-tally {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .page-products .sv-triple {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .page-products .sv-scenes {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .page-products .sv-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .page-products .sv-access {
    grid-template-columns: minmax(0, 1fr) minmax(0, .85fr);
    align-items: start;
  }
}

@media (min-width: 860px) {
  .page-products .sv-hero-inner {
    grid-template-columns: minmax(0, 1.42fr) minmax(0, .58fr);
    align-items: end;
    gap: 40px;
    padding: 34px 0 42px;
  }
  .page-products .sv-hero-figure .media-frame {
    max-width: none;
  }
  .page-products .sv-tree {
    gap: 16px;
  }
  .page-products .sv-ability {
    padding-left: 64px;
  }
  .page-products .sv-cap-body {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
    align-items: start;
    gap: 32px;
  }
  .page-products .sv-cap-body--batch {
    grid-template-columns: minmax(0, 1fr);
  }
  .page-products .sv-cap-body--batch .sv-triple {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .page-products .sv-cap-body--status {
    grid-template-columns: minmax(0, 1.5fr) minmax(0, .8fr);
  }
  .page-products .sv-status-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .page-products .sv-cap-body--mobile {
    grid-template-columns: minmax(0, 1fr) minmax(0, 340px);
    gap: 40px;
  }
  .page-products .sv-quarter-body {
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
    align-items: center;
    gap: 36px;
  }
  .page-products .sv-steps {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
  }
  .page-products .sv-step + .sv-step::before {
    content: "";
    position: absolute;
    left: -18px;
    top: 40px;
    width: 18px;
    height: 1px;
    background: var(--ink-600);
  }
  .page-products .sv-overview {
    grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr);
    gap: 48px;
    align-items: start;
  }
}

@media (min-width: 1080px) {
  .page-products .section {
    padding: 60px 0;
  }
  .page-products .section--tall {
    padding: 86px 0;
  }
  .page-products .sv-ability-card {
    padding: 20px 22px 18px;
  }
  .page-products .sv-ability-text {
    max-width: 46em;
  }
  .page-products .sv-access {
    padding: 44px;
  }
}



.page-products{--sv-line:#22384F;--sv-glow:rgba(242,178,51,.16);--sv-pad:clamp(18px,4vw,34px);background:var(--ink-900);color:var(--text-main);font-family:var(--font-body);overflow-x:hidden}
.page-products .container{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter);box-sizing:border-box}
.page-products .eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--amber-500);margin:0 0 12px}
.page-products .mono{font-family:var(--font-mono);letter-spacing:.04em}
.page-products .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:var(--radius-s);font-size:15px;font-weight:700;line-height:1.2;text-decoration:none;border:1px solid transparent;transition:background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease),transform .2s var(--ease)}
.page-products .btn-primary{background:var(--amber-500);color:var(--ink-900)}
.page-products .btn-primary:hover{background:var(--amber-200);transform:translateY(-2px)}
.page-products .btn-ghost{background:transparent;color:var(--text-main);border-color:var(--ink-600)}
.page-products .btn-ghost:hover{border-color:var(--amber-500);color:var(--amber-200)}
.page-products a:focus-visible,.page-products .sv-step:focus-visible,.page-products summary:focus-visible{outline:2px solid var(--amber-500);outline-offset:3px;border-radius:var(--radius-s)}
.page-products .sv-crumb-list{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:22px 0 0;font-size:13px;color:var(--slate-300)}
.page-products .sv-crumb-list li+li::before{content:"/";margin-right:8px;color:var(--ink-600)}
.page-products .sv-crumb-link{color:var(--slate-300);text-decoration:none;border-bottom:1px solid transparent}
.page-products .sv-crumb-link:hover{color:var(--amber-200);border-bottom-color:var(--amber-200)}
.page-products .sv-crumb-current{color:var(--text-main)}
.page-products .sv-hero{background:radial-gradient(900px 520px at 88% -12%,var(--sv-glow),transparent 62%),radial-gradient(760px 460px at -8% 108%,rgba(86,196,164,.10),transparent 60%),var(--ink-900);border-bottom:1px solid var(--ink-600);padding-bottom:32px}
.page-products .sv-hero-inner{display:grid;gap:28px;padding:22px 0 30px}
.page-products h1{font-family:var(--font-display);font-weight:900;font-size:clamp(34px,7.4vw,62px);line-height:1.04;letter-spacing:-.02em;margin:0 0 18px;color:#fff}
.page-products .sv-lede{font-size:16px;line-height:1.78;color:var(--slate-300);max-width:36em;margin:0 0 22px}
.page-products .sv-hero-actions{display:flex;flex-wrap:wrap;gap:12px}
.page-products .sv-hero-figure{margin:0}
.page-products .media-frame{position:relative;overflow:hidden;border:1px solid var(--ink-600);border-radius:var(--radius-m);background:linear-gradient(160deg,var(--ink-700),var(--ink-800));box-shadow:var(--shadow-1)}
.page-products .media-frame img{display:block;width:100%;height:auto;object-fit:cover}
.page-products .sv-hero-figure .media-frame{max-width:420px}
.page-products .media-caption{margin:12px 0 0;font-size:13px;line-height:1.6;color:var(--slate-300);border-left:2px solid var(--amber-500);padding-left:10px}
.page-products .sv-tally{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin:0;padding:0;background:var(--ink-600);border:1px solid var(--ink-600);border-radius:var(--radius-m);overflow:hidden}
.page-products .sv-tally li{background:var(--ink-800);padding:16px 18px;display:flex;flex-direction:column;gap:4px}
.page-products .sv-tally-num{font-size:24px;font-weight:700;color:var(--amber-500);line-height:1.1}
.page-products .sv-tally-label{font-size:13px;color:var(--slate-300)}
.page-products .section{padding:52px 0}
.page-products .section--tall{padding:68px 0}
.page-products h2{font-family:var(--font-display);font-weight:900;font-size:clamp(26px,4.2vw,38px);line-height:1.14;letter-spacing:-.015em;margin:0 0 14px;color:#fff}
.page-products h3{font-size:17px;font-weight:700;margin:0 0 8px;color:#fff}
.page-products .sv-overview{display:grid;gap:34px}
.page-products .sv-overview-text{font-size:16px;line-height:1.8;color:var(--slate-300);max-width:34em;margin:0 0 14px}
.page-products .sv-overview-note{font-size:14px;line-height:1.7;color:var(--slate-300);border-left:2px solid var(--celadon-400);padding-left:12px;margin:0;max-width:34em}
.page-products .sv-tree{position:relative;list-style:none;margin:0;padding:6px 0;display:grid;gap:20px}
.page-products .sv-tree::before{content:"";position:absolute;left:17px;top:10px;bottom:22px;width:2px;background:linear-gradient(180deg,var(--amber-500),var(--ink-600) 46%,var(--celadon-700));opacity:.7}
.page-products .sv-ability{position:relative;padding-left:50px}
.page-products .sv-node{position:absolute;left:0;top:20px;width:36px;height:36px;border-radius:50%;background:var(--ink-900);border:2px solid var(--amber-500);display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 5px var(--ink-900)}
.page-products .sv-node .mono{font-size:12px;font-weight:700;color:var(--amber-500)}
.page-products .sv-ability-card{display:block;text-decoration:none;background:var(--ink-700);border:1px solid var(--ink-600);border-radius:var(--radius-m);padding:18px 18px 16px;box-shadow:var(--shadow-1);transition:transform .24s var(--ease),border-color .24s var(--ease),box-shadow .24s var(--ease)}
.page-products .sv-ability-card:hover{transform:translateY(-4px);border-color:var(--amber-500);box-shadow:var(--shadow-2)}
.page-products .sv-ability-card .tag{display:inline-block;font-size:12px;padding:3px 9px;border-radius:100px;margin-bottom:10px}
.page-products .tag-amber{background:var(--amber-500);color:var(--ink-900);font-weight:700}
.page-products .tag-celadon{background:transparent;color:var(--celadon-400);border:1px solid var(--celadon-700)}
.page-products .sv-ability-card .tag:not(.tag-amber):not(.tag-celadon){background:transparent;color:var(--slate-300);border:1px solid var(--ink-600)}
.page-products .sv-ability-title{font-size:18px;margin:0 0 6px}
.page-products .sv-ability-text{font-size:14px;line-height:1.7;color:var(--slate-300);margin:0 0 12px}
.page-products .sv-output{display:inline-block;font-size:12px;color:var(--amber-200);background:rgba(242,178,51,.1);border:1px dashed rgba(242,178,51,.45);border-radius:var(--radius-s);padding:4px 9px}
.page-products .sv-cap-head{display:flex;gap:14px;align-items:flex-start;padding-bottom:20px;margin-bottom:24px;border-bottom:1px solid var(--ink-600)}
.page-products .sv-cap-num{flex:none;font-size:13px;font-weight:700;color:var(--ink-900);background:var(--amber-500);border-radius:var(--radius-s);padding:4px 7px;margin-top:6px}
.page-products .sv-cap-head h2{margin-bottom:6px}
.page-products .sv-cap-sub{margin:0;font-size:14px;line-height:1.7;color:var(--slate-300)}
.page-products .sv-cap-body{display:grid;gap:28px}
.page-products .sv-triple{display:grid;gap:16px}
.page-products .sv-triple-item{background:var(--ink-800);border:1px solid var(--ink-600);border-left:3px solid var(--ink-600);border-radius:var(--radius-s);padding:16px 18px}
.page-products .sv-triple-item p{margin:0;font-size:14.5px;line-height:1.75;color:var(--slate-300)}
.page-products .sv-problem{border-left-color:var(--slate-300);background:transparent}
.page-products .sv-result{border-left-color:var(--celadon-400)}
.page-products .sv-figure{margin:0}
.page-products .sv-code-wrap{background:var(--ink-800);border:1px solid var(--ink-600);border-radius:var(--radius-m);padding:18px}
.page-products .sv-code-intro{margin:0 0 12px;font-size:14px;color:var(--slate-300)}
.page-products .sv-code{background:var(--ink-700);border:1px solid var(--ink-600);border-radius:var(--radius-s);padding:0 14px}
.page-products .sv-code summary{cursor:pointer;list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:14px 0}
.page-products .sv-code summary::-webkit-details-marker{display:none}
.page-products .sv-code-value{font-size:clamp(16px,3.4vw,20px);font-weight:700;color:var(--ink-900);background:var(--amber-200);border-radius:var(--radius-s);padding:5px 10px;word-break:break-all}
.page-products .sv-code-hint{font-size:13px;color:var(--slate-300);border-bottom:1px dashed var(--ink-600)}
.page-products .sv-code[open] summary{border-bottom:1px solid var(--ink-600)}
.page-products .sv-code-list{margin:0;padding:4px 0 16px;display:grid;gap:14px}
.page-products .sv-code-item{display:grid;gap:4px}
.page-products .sv-code-item dt{font-size:13px;font-weight:700;color:var(--amber-200)}
.page-products .sv-code-item dd{margin:0;font-size:14px;line-height:1.7;color:var(--slate-300)}
.page-products .sv-status-list{display:grid;gap:14px}
.page-products .sv-status-card{background:var(--ink-800);border:1px solid var(--ink-600);border-radius:var(--radius-m);padding:16px 18px}
.page-products .sv-status-card p:last-child{margin:8px 0 0;font-size:14px;line-height:1.72;color:var(--slate-300)}
.page-products .sv-status-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0}
.page-products .sv-status-name{font-size:16px;font-weight:700;color:#fff}
.page-products .status-dot{width:10px;height:10px;border-radius:50%;display:inline-block;flex:none;background:var(--ink-600)}
.page-products .status-dot[data-state="live"]{background:var(--celadon-400);box-shadow:0 0 0 4px rgba(86,196,164,.18)}
.page-products .status-dot[data-state="watching"]{background:var(--amber-500);box-shadow:0 0 0 4px rgba(242,178,51,.18)}
.page-products .status-dot[data-state="queued"]{background:transparent;border:2px solid var(--celadon-700)}
.page-products .sv-cap-aside{background:var(--ink-700);border:1px solid var(--ink-600);border-radius:var(--radius-m);padding:20px}
.page-products .sv-aside-list{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:10px}
.page-products .sv-aside-list li{position:relative;padding-left:16px;font-size:14px;line-height:1.72;color:var(--slate-300)}
.page-products .sv-aside-list li::before{content:"";position:absolute;left:0;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--amber-500)}
.page-products .sv-aside-btn{width:100%}
.page-products .sv-mobile-text{display:grid;gap:16px}
.page-products .sv-quarter-body{display:grid;gap:24px}
.page-products .sv-quarter-text p{margin:0 0 14px;font-size:15px;line-height:1.8;color:var(--slate-300);max-width:34em}
.page-products .sv-scenes-section{background:linear-gradient(180deg,var(--ink-800),var(--ink-900));border-top:1px solid var(--ink-600);border-bottom:1px solid var(--ink-600)}
.page-products .sv-section-head{margin-bottom:28px}
.page-products .sv-section-head h2{margin-bottom:0}
.page-products .sv-scenes{display:grid;gap:16px}
.page-products .sv-scene{position:relative;background:var(--ink-700);border:1px solid var(--ink-600);border-top:3px solid var(--ink-600);border-radius:var(--radius-m);padding:20px 18px;box-shadow:var(--shadow-1)}
.page-products .sv-scene--amber{border-top-color:var(--amber-500)}
.page-products .sv-scene--celadon{border-top-color:var(--celadon-400)}
.page-products .sv-scene--paper{border-top-color:var(--paper-100)}
.page-products .sv-scene-tag{font-size:12px;color:var(--slate-300);margin:0 0 8px}
.page-products .sv-scene p{margin:0 0 12px;font-size:14.5px;line-height:1.75;color:var(--slate-300)}
.page-products .sv-scene h3{margin-bottom:8px}
.page-products .sv-scene-path{margin:0;font-size:12.5px;color:var(--amber-200);padding-top:12px;border-top:1px dashed var(--ink-600)}
.page-products .sv-steps{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.page-products .sv-step{position:relative;background:var(--ink-800);border:1px solid var(--ink-600);border-radius:var(--radius-m);padding:18px;transition:border-color .24s var(--ease),background .24s var(--ease),transform .24s var(--ease)}
.page-products .sv-step:hover,.page-products .sv-step:focus{border-color:var(--amber-500);background:var(--ink-700);transform:translateY(-2px)}
.page-products .sv-step-num{display:block;font-size:34px;font-weight:700;line-height:1;color:var(--amber-500);margin-bottom:10px}
.page-products .sv-step h3{font-size:16px;margin-bottom:6px}
.page-products .sv-step p{margin:0;font-size:14px;line-height:1.72;color:var(--slate-300)}
.page-products .sv-access-section{padding-bottom:72px}
.page-products .sv-access{background:var(--paper-100);color:var(--ink-900);border-radius:var(--radius-m);padding:var(--sv-pad);display:grid;gap:26px;box-shadow:var(--shadow-2)}
.page-products .sv-access-eyebrow{color:#8a5c05}
.page-products .sv-access h2{color:var(--ink-900)}
.page-products .sv-access-main p{margin:0 0 12px;font-size:15px;line-height:1.78;color:#253546;max-width:34em}
.page-products .sv-access-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.page-products .sv-access .btn-primary{background:var(--ink-900);color:var(--paper-100)}
.page-products .sv-access .btn-primary:hover{background:var(--ink-700)}
.page-products .sv-access .btn-ghost{color:var(--ink-900);border-color:rgba(8,18,31,.28)}
.page-products .sv-access .btn-ghost:hover{border-color:var(--ink-900);color:var(--ink-900);background:rgba(8,18,31,.06)}
.page-products .sv-access-list{margin:0;display:grid;gap:1px;background:rgba(8,18,31,.14);border:1px solid rgba(8,18,31,.14);border-radius:var(--radius-s);overflow:hidden}
.page-products .sv-access-list>div{background:var(--paper-100);padding:12px 14px}
.page-products .sv-access-list dt{font-size:12px;letter-spacing:.08em;color:#5c6b7b;margin-bottom:4px}
.page-products .sv-access-list dd{margin:0;font-size:14.5px;font-weight:600;color:var(--ink-900);word-break:break-word}
.page-products .sv-access-list a{color:var(--ink-900);text-decoration:none;border-bottom:1px solid rgba(8,18,31,.35)}
.page-products .sv-access-list a:hover{border-bottom-color:var(--ink-900)}
.page-products [data-reveal]{opacity:0;transform:translateY(16px);transition:opacity .38s var(--ease),transform .38s var(--ease)}
.page-products [data-reveal].is-revealed{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.page-products [data-reveal],.page-products [data-reveal].is-revealed{opacity:1;transform:none;transition:none}.page-products .sv-ability-card:hover,.page-products .sv-step:hover,.page-products .sv-step:focus{transform:none}}
@media (min-width:620px){.page-products .sv-tally{grid-template-columns:repeat(4,minmax(0,1fr))}.page-products .sv-triple{grid-template-columns:repeat(3,minmax(0,1fr))}.page-products .sv-scenes{grid-template-columns:repeat(3,minmax(0,1fr))}.page-products .sv-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.page-products .sv-access{grid-template-columns:minmax(0,1fr) minmax(0,.85fr);align-items:start}}
@media (min-width:860px){.page-products .sv-hero-inner{grid-template-columns:minmax(0,1.42fr) minmax(0,.58fr);align-items:end;gap:40px;padding:34px 0 42px}.page-products .sv-hero-figure .media-frame{max-width:none}.page-products .sv-tree{gap:16px}.page-products .sv-ability{padding-left:64px}.page-products .sv-cap-body{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:start;gap:32px}.page-products .sv-cap-body--batch{grid-template-columns:minmax(0,1fr)}.page-products .sv-cap-body--status{grid-template-columns:minmax(0,1.5fr) minmax(0,.8fr)}.page-products .sv-status-list{grid-template-columns:repeat(3,minmax(0,1fr))}.page-products .sv-cap-body--mobile{grid-template-columns:minmax(0,1fr) minmax(0,340px);gap:40px}.page-products .sv-quarter-body{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;gap:36px}.page-products .sv-steps{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.page-products .sv-step+.sv-step::before{content:"";position:absolute;left:-18px;top:40px;width:18px;height:1px;background:var(--ink-600)}.page-products .sv-overview{grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:48px;align-items:start}}
@media (min-width:1080px){.page-products .section{padding:60px 0}.page-products .section--tall{padding:86px 0}.page-products .sv-ability-card{padding:20px 22px 18px}.page-products .sv-ability-text{max-width:46em}.page-products .sv-access{padding:44px}}