/* Redesign (AUD-2136 mockup, ported in AUD-2143). Scoped to `.rd`: only the home and
   de-artifact pages load this file, and only their <main class="rd"> matches. The
   site-wide header and footer keep site.css. */
/* Intrect redesign mockup (AUD-2136) — one shared stylesheet for home and product.
   Studio black ground, graphite panels, one action blue. Amber belongs to the
   product imagery only and never appears as a CSS colour here. */

/* Keep the shared sticky nav on the window scroll container for these two pages. */
.rd-page { height: auto; overflow-x: clip; }

.rd {
  --ground: #0b0b10;
  --panel: #1a1a22;
  --inset: #121218;
  --well: #0e0e14;
  --raise: #22222c;
  --text: #e8e8ec;
  --accent: #5aa7f0;
  --accent-hover: #7cbaf4;
  --accent-wash: rgba(90, 167, 240, 0.14);
  --accent-line: rgba(90, 167, 240, 0.62);
  /* Text tiers. --muted ≈ 9.4:1 and --quiet ≈ 5.8:1 on ground, ≥5.5:1 on panel. */
  --muted: rgba(232, 232, 236, 0.74);
  --quiet: rgba(232, 232, 236, 0.58);
  /* Lines only — never text. */
  --line: rgba(232, 232, 236, 0.09);
  --line-lit: rgba(232, 232, 236, 0.17);
  --line-strong: rgba(232, 232, 236, 0.30);
  --sans: "Archivo", "Helvetica Neue", Arial, sans-serif;
  /* Brand face for names and headlines, kept from production (operator, 2026-10-13):
     weight 700 only, tight tracking, never 800 (the family ships 600 and 700). */
  --brand: "Stack Sans Notch", "Archivo", "Helvetica Neue", Arial, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --gutter: 64px;
  --maxw: 1440px;
  --r-panel: 8px;
  --r-ctl: 4px;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  color-scheme: dark;
}

@media (max-width: 1100px) { .rd { --gutter: 40px; } }
@media (max-width: 640px) { .rd { --gutter: 16px; } }

.rd *,
.rd *::before,
.rd *::after { box-sizing: border-box; }
.rd { -webkit-text-size-adjust: 100%; scrollbar-color: #34343f var(--ground); scrollbar-width: thin; }
.rd {
  margin: 0; background: var(--ground); color: var(--text);
  font-family: var(--sans); font-size: 16px; line-height: 1.6; font-stretch: 100%;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  font-variant-numeric: tabular-nums; caret-color: var(--accent);
  /* clip, not hidden: production's body is a 100%-height flex column, and hidden turns
     <main class="rd"> into its own vertical scroll container (the window stops scrolling). */
  overflow-x: clip;
}
.rd h1,
.rd h2,
.rd h3,
.rd h4,
.rd p,
.rd ul,
.rd ol,
.rd dl,
.rd dd,
.rd figure { margin: 0; padding: 0; }
.rd ul,
.rd ol { list-style: none; }
.rd img,
.rd video,
.rd svg { display: block; max-width: 100%; }
.rd img { height: auto; }
.rd button,
.rd select,
.rd input { font: inherit; color: inherit; }
.rd ::selection { background: rgba(90, 167, 240, 0.34); color: #fff; }





.rd a { color: inherit; text-decoration: none; }
.rd :focus { outline: none; }
.rd :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 2px; }

.rd a.inline {
  color: var(--text); text-decoration: underline; text-decoration-color: var(--line-strong);
  text-decoration-thickness: 1px; text-underline-offset: 0.24em;
  transition: text-decoration-color 0.2s ease, color 0.2s ease;
}
.rd a.inline:hover { text-decoration-color: var(--accent); }

/* Mono is reserved for measured values: probabilities, benchmark figures, durations,
   frequencies, latency and axes (plus literal code tokens). Prices and counts stay in
   Archivo with tabular figures. */
.rd .mono { font-family: var(--mono); font-feature-settings: "zero" 0; letter-spacing: 0; }
.rd .fig { font-family: var(--sans); font-variant-numeric: tabular-nums lining-nums; letter-spacing: 0; }
.rd .sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}



.rd .wrap { width: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 var(--gutter); }
.rd .icon { width: 16px; height: 16px; flex: none; }

/* Mockup marker: small, fixed, out of the content's way. */


/* ------------------------------------------------------------------ header */















@media (max-width: 900px) {
  
  
}

/* ------------------------------------------------------------------ buttons */
.rd .btn {
  height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 0 22px; border-radius: var(--r-ctl); font-size: 16px; font-weight: 600;
  white-space: nowrap; border: 1px solid transparent; cursor: pointer;
  transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}
.rd .btn .icon { transition: transform 0.2s var(--ease-out); }
.rd .btn:hover .icon { transform: translateX(2px); }
.rd .btn-primary { background: var(--accent); color: var(--ground); }
.rd .btn-primary:hover { background: var(--accent-hover); }
.rd .btn-ghost { border-color: var(--line-strong); color: var(--text); }
.rd .btn-ghost:hover { border-color: var(--text); }
.rd .btn-sm { height: 40px; padding: 0 16px; font-size: 14.5px; }
.rd .link-arrow { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; color: var(--text); }
.rd .link-arrow .icon { color: var(--accent); transition: transform 0.2s var(--ease-out); }
.rd .link-arrow:hover .icon { transform: translateX(3px); }
.rd .link-arrow:hover { color: #fff; }

/* ------------------------------------------------------------------ actions and prices */
.rd .cta { display: flex; flex-direction: column; gap: 9px; }
.rd .cta .note { font-size: 12.5px; color: var(--quiet); padding-left: 2px; line-height: 1.4; }

.rd .price-fig { display: flex; align-items: baseline; gap: 12px; }
.rd .price-now { font-family: var(--sans); font-variant-numeric: tabular-nums lining-nums; font-size: 46px; font-weight: 700; font-stretch: 88%; letter-spacing: -0.01em; line-height: 1; }
.rd .price-was { font-family: var(--sans); font-variant-numeric: tabular-nums lining-nums; font-size: 19px; font-weight: 500; color: var(--quiet); text-decoration: line-through; text-decoration-thickness: 1px; }
.rd .price-meta { margin-top: 9px; font-size: 13px; color: var(--muted); line-height: 1.4; }

.rd .price-fine { grid-column: 1 / -1; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--line); font-size: 12.5px; color: var(--quiet); line-height: 1.5; }

/* Load moment: the first strip a visitor sees (the A/B strip under the window) is revealed
   once, left to right, like a playhead sweep. A curtain in the well colour slides off the
   strip; the strip itself never animates, so switching variants cannot replay it. With
   reduced motion the curtain is not rendered at all. */
.rd .reveal { display: none; }
@media (prefers-reduced-motion: no-preference) {
  .rd .reveal {
    display: block; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: var(--well); border-left: 2px solid rgba(232, 232, 236, 0.9);
    animation: rd-strip-reveal 1.9s var(--ease-out) 0.35s both;
  }
}
@keyframes rd-strip-reveal { from { transform: translateX(0); } to { transform: translateX(101%); } }
.rd .mini-strip .playhead { z-index: 2; }

.rd .window {
  position: relative; z-index: 1; margin: 0;
  background: var(--inset); border: 1px solid #262630; border-radius: var(--r-panel); overflow: hidden;
  box-shadow: 0 24px 48px -16px rgba(0, 0, 0, 0.85), 0 8px 16px -8px rgba(0, 0, 0, 0.6);
  max-width: 800px;
}
.rd .window img { width: 100%; height: auto; }

/* ------------------------------------------------------------------ A/B transport */
.rd .transport {
  position: relative; z-index: 1; margin-top: 12px; max-width: 800px;
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-panel);
}
.rd .tp-main { display: flex; align-items: center; gap: 14px; padding: 12px 14px; }
.rd .tp-foot {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 18px; align-items: center;
  padding: 10px 14px 12px; border-top: 1px solid var(--line);
}
.rd .play {
  width: 48px; height: 48px; flex: none; border-radius: 50%; border: 0; cursor: pointer;
  background: var(--accent); color: var(--ground); display: grid; place-items: center;
  transition: background 0.18s ease, opacity 0.18s ease;
}
.rd .play:hover:not(:disabled) { background: var(--accent-hover); }
.rd .play:disabled { cursor: progress; opacity: 0.45; }
.rd .play svg { width: 18px; height: 18px; }
.rd .play .i-pause { display: none; }
.rd [data-state="playing"] .play .i-play,
.rd .play[data-playing="true"] .i-play { display: none; }
.rd [data-state="playing"] .play .i-pause,
.rd .play[data-playing="true"] .i-pause { display: block; }
.rd .play .i-play { margin-left: 2px; }

.rd .seg {
  display: flex; flex: none; padding: 3px; gap: 2px;
  background: var(--ground); border: 1px solid var(--line); border-radius: 6px;
}
.rd .seg button {
  appearance: none; border: 0; background: transparent; cursor: pointer; color: var(--text);
  width: 108px; height: 46px; border-radius: var(--r-ctl); white-space: nowrap;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
  transition: background 0.15s ease, color 0.15s ease;
}
.rd .seg button:hover { background: var(--raise); }
.rd .seg .t { font-size: 14.5px; font-weight: 650; line-height: 1.2; }
.rd .seg .s { font-size: 12px; color: var(--quiet); line-height: 1.2; }
.rd .seg .k { font-family: var(--mono); font-size: 12px; color: var(--quiet); margin-right: 5px; }
.rd .seg button[aria-pressed="true"] { background: var(--accent); color: var(--ground); }
.rd .seg button[aria-pressed="true"] .s,
.rd .seg button[aria-pressed="true"] .k { color: rgba(11, 11, 16, 0.72); }

.rd .tp-time { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.rd .mini-strip {
  position: relative; height: 40px; border-radius: 3px; overflow: hidden; cursor: pointer;
  background: var(--well); border: 1px solid var(--line); touch-action: none;
}
/* The strip shows only the audible variant's spectrogram; the others are taken out of
   rendering rather than kept at zero opacity, so the switch is as immediate as the audio. */
.rd .mini-strip img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: fill; display: none; opacity: 0.95; }
.rd [data-variant-active="0"] .mini-strip img[data-variant="0"],
.rd [data-variant-active="1"] .mini-strip img[data-variant="1"],
.rd [data-variant-active="2"] .mini-strip img[data-variant="2"] { display: block; }
.rd .time-row { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; font-family: var(--mono); font-size: 12px; color: var(--muted); }
.rd .time-row .now { color: var(--text); }
.rd .time-row > span:first-child { white-space: nowrap; }
.rd .time-row .track-name { font-family: var(--sans); font-size: 12px; color: var(--quiet); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.rd .playhead { position: absolute; inset: 0; pointer-events: none; will-change: transform; }
.rd .playhead::before {
  content: ""; position: absolute; left: -1px; top: 0; bottom: 0; width: 2px;
  background: var(--text); box-shadow: 0 0 0 1px rgba(11, 11, 16, 0.55);
}
.rd [data-progress="0"] .playhead::before { opacity: 0.5; }

.rd .caveat { font-size: 12.5px; line-height: 1.45; color: var(--muted); }
.rd .caveat b { color: var(--text); font-weight: 600; }

.rd .field-select {
  position: relative; display: flex; align-items: center;
}
.rd .field-select select {
  appearance: none; -webkit-appearance: none; height: 34px; max-width: 220px;
  padding: 0 30px 0 10px; border-radius: var(--r-ctl); cursor: pointer;
  background: var(--ground); border: 1px solid var(--line-lit); font-size: 12.5px; color: var(--text);
  text-overflow: ellipsis;
}
.rd .field-select select:hover { border-color: var(--line-strong); }
.rd .field-select select option { background: var(--panel); color: var(--text); }
.rd .field-select svg { position: absolute; right: 9px; width: 12px; height: 12px; pointer-events: none; color: var(--muted); }
.rd .toggle { display: flex; border: 1px solid var(--line-lit); border-radius: var(--r-ctl); overflow: hidden; flex: none; }
.rd .toggle button {
  appearance: none; border: 0; background: transparent; cursor: pointer; height: 32px; padding: 0 12px;
  font-size: 12.5px; font-weight: 500; color: var(--muted);
}
.rd .toggle button + button { border-left: 1px solid var(--line-lit); }
/* Pressed is a filled segment, not a tint: the state must clear 3:1 against the unpressed one (WCAG 1.4.11). */
.rd .toggle button[aria-pressed="true"] { background: rgba(232, 232, 236, 0.88); color: var(--ground); }
.rd .toggle button[aria-disabled="true"] { color: var(--quiet); cursor: not-allowed; text-decoration: line-through; text-decoration-thickness: 1px; }

.rd .status-line { display: none; align-items: center; gap: 10px; grid-column: 1 / -1; }
.rd [data-state="loading"] .status-line,
.rd [data-state="error"] .status-line,
.rd .status-line:has(.status:not(:empty)) { display: flex; }
.rd .status { font-size: 12.5px; color: var(--muted); }
.rd .status:empty { display: none; }
.rd [data-state="error"] .status { color: #f3b2a8; }
.rd .retry {
  display: none; appearance: none; height: 30px; padding: 0 12px; border-radius: var(--r-ctl); cursor: pointer;
  background: transparent; border: 1px solid var(--accent-line); color: var(--accent); font-size: 12.5px; font-weight: 600;
}
.rd .retry:hover { background: var(--accent-wash); }
.rd [data-state="error"] .retry { display: inline-flex; align-items: center; }
.rd .spinner { width: 12px; height: 12px; border-radius: 50%; border: 1.5px solid var(--line-strong); border-top-color: var(--accent); display: none; }
.rd [data-state="loading"] .spinner { display: block; }
@media (prefers-reduced-motion: no-preference) { .rd .spinner { animation: rd-spin 0.9s linear infinite; } }
@keyframes rd-spin { to { transform: rotate(360deg); } }
.rd [aria-busy="true"] .mini-strip,
.rd [aria-busy="true"] .sono-strip { cursor: progress; }

/* Track without rendered spectrograms: neutral timeline, explicit note. */
.rd .no-art-note { display: none; }
.rd [data-art="none"] .mini-strip img,
.rd [data-art="none"] .sono-row img { display: none !important; }
.rd [data-art="none"] .mini-strip { background: repeating-linear-gradient(90deg, var(--well) 0 7px, #15151c 7px 8px); }
.rd [data-art="none"] .no-art-note { display: flex; }

/* ------------------------------------------------------------------ sections */
.rd .section { padding: 128px 0 0; }

.rd .h2 {
  font-size: clamp(32px, 3.4vw, 48px); line-height: 1.06; font-weight: 700; font-stretch: 82%;
  letter-spacing: -0.012em; text-wrap: balance;
}
.rd .lede { margin-top: 16px; font-size: 17px; line-height: 1.62; color: var(--muted); max-width: 34em; }
.rd .split { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; }

/* Hear band: Original / Cleaned / Diff spectrograms bound to the player. */
.rd .hear-copy { grid-column: 1 / span 4; }
.rd .hear-board { grid-column: 5 / span 8; }
.rd .kbd-list { margin-top: 26px; display: grid; grid-template-columns: auto 1fr; gap: 9px 14px; font-size: 13.5px; color: var(--muted); align-items: center; }
.rd kbd {
  font-family: var(--mono); font-size: 12px; color: var(--text); min-width: 26px; text-align: center;
  padding: 3px 7px; border: 1px solid var(--line-lit); border-bottom-width: 2px; border-radius: var(--r-ctl);
  background: var(--panel); display: inline-block; line-height: 1.3;
}
.rd .hear-play { margin-top: 28px; display: flex; align-items: center; gap: 14px; }
.rd .hear-play .time-row { font-size: 13px; gap: 6px; justify-content: flex-start; }

.rd .sono-board { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-panel); padding: 16px; }
.rd .sono-grid { display: grid; grid-template-columns: 176px minmax(0, 1fr); column-gap: 16px; }
.rd .sono-labels { display: grid; grid-template-rows: repeat(3, 1fr); gap: 8px; }
.rd .sono-label {
  appearance: none; text-align: left; cursor: pointer; width: 100%;
  background: transparent; border: 1px solid var(--line); border-radius: var(--r-ctl);
  padding: 10px 12px; display: flex; flex-direction: column; justify-content: flex-start; gap: 2px;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.rd .sono-label:hover { border-color: var(--line-strong); }
.rd .sono-label .t { font-size: 15px; font-weight: 650; line-height: 1.2; display: flex; align-items: center; gap: 8px; }
.rd .sono-label .s { font-size: 12px; color: var(--quiet); }
.rd .sono-label .caveat { margin-top: 6px; font-size: 12px; }
.rd .sono-label[aria-pressed="true"] { border-color: var(--accent-line); background: var(--accent-wash); }
.rd .sono-label[aria-pressed="true"] .t { color: var(--accent); }
.rd .sono-label .dot { width: 7px; height: 7px; border-radius: 50%; border: 1.5px solid currentColor; opacity: 0.6; }
.rd .sono-label[aria-pressed="true"] .dot { background: currentColor; opacity: 1; }

.rd .sono-strip { position: relative; display: grid; grid-template-rows: repeat(3, 1fr); gap: 8px; cursor: pointer; touch-action: none; }
.rd .sono-row { position: relative; height: 128px; border-radius: 3px; overflow: hidden; background: var(--well); border: 1px solid var(--line); }
.rd .sono-row img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: fill; transition: opacity 0.2s linear, filter 0.2s linear; opacity: 0.42; filter: saturate(0.6); }
.rd [data-variant-active="0"] .sono-row[data-variant="0"] img,
.rd [data-variant-active="1"] .sono-row[data-variant="1"] img,
.rd [data-variant-active="2"] .sono-row[data-variant="2"] img { opacity: 1; filter: none; }
.rd .f-axis { position: absolute; right: 6px; top: 0; bottom: 0; pointer-events: none; }
.rd .f-axis span { position: absolute; right: 0; transform: translateY(50%); font-family: var(--mono); font-size: 12px; color: rgba(232, 232, 236, 0.86);
  background: rgba(11, 11, 16, 0.62); padding: 0 4px; border-radius: 2px; line-height: 1.5; white-space: nowrap; }
.rd .sono-strip > .playhead { inset: 0; }
.rd .sono-strip > .playhead::before { width: 2px; }
.rd .t-axis { grid-column: 2; display: flex; justify-content: space-between; margin-top: 8px; font-family: var(--mono); font-size: 12px; color: var(--quiet); }
.rd .no-art-note {
  position: absolute; inset: 0; align-items: center; justify-content: center; text-align: center; padding: 16px;
  font-size: 13.5px; color: var(--text); pointer-events: none;
}
.rd .no-art-note span { background: rgba(11, 11, 16, 0.88); border: 1px solid var(--line-lit); border-radius: var(--r-ctl); padding: 8px 12px; max-width: 30em; }
.rd .sono-cap { margin-top: 14px; font-size: 12.5px; line-height: 1.5; color: var(--quiet); }

/* Framed screenshots. */
.rd .shot {
  border-radius: var(--r-panel); overflow: hidden; border: 1px solid #262630; background: var(--inset);
  box-shadow: 0 32px 64px -28px rgba(0, 0, 0, 0.85);
}
.rd .shot img { width: 100%; }

.rd .tag-soon {
  display: inline-block; vertical-align: middle; margin-left: 10px; font: 600 12px/1 var(--sans);
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted);
  border: 1px solid var(--line-strong); border-radius: var(--r-ctl); padding: 5px 7px; position: relative; top: -4px;
}

/* Three ways to run it: a real comparison table. */
.rd .ways-table-wrap { margin-top: 48px; border: 1px solid var(--line); border-radius: var(--r-panel); overflow: hidden; background: var(--panel); }
.rd .ways { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.rd .ways th,
.rd .ways td { text-align: left; vertical-align: top; padding: 16px 22px; border-top: 1px solid var(--line); }
.rd .ways thead th { border-top: 0; padding-top: 24px; padding-bottom: 20px; }
.rd .ways thead th + th,
.rd .ways td { border-left: 1px solid var(--line); }
.rd .ways tbody th { width: 17%; font-size: 12px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--quiet); padding-top: 18px; }
.rd .ways .col-name { font-size: 24px; font-weight: 700; font-stretch: 84%; letter-spacing: -0.005em; line-height: 1.1; }
.rd .ways .col-price { display: block; margin-top: 8px; font-family: var(--sans); font-variant-numeric: tabular-nums lining-nums; font-size: 16px; font-weight: 600; color: var(--text); letter-spacing: 0; }
.rd .ways .col-price small { font-family: var(--sans); font-size: 12.5px; color: var(--quiet); font-weight: 400; letter-spacing: 0; }
.rd .ways td { color: var(--muted); line-height: 1.55; }
.rd .ways td strong { color: var(--text); font-weight: 600; }
.rd .ways td .fig { color: var(--text); }
.rd .ways tfoot td { border-top: 1px solid var(--line-lit); padding-top: 18px; padding-bottom: 22px; }
.rd .ways tfoot th { border-top: 1px solid var(--line-lit); }
.rd .ways .is-pick { background: rgba(90, 167, 240, 0.045); }
.rd .ways-note { margin-top: 14px; font-size: 12.5px; color: var(--quiet); }

/* Closing: trial + buy (product page) and the shared close padding. */
.rd .close { padding: 128px 0 120px; }
.rd .close-grid { margin-top: 44px; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: stretch; }
.rd .close-trial { grid-column: 1 / span 7; }
.rd .close-buy { grid-column: 9 / span 4; }
.rd .dl-list { margin-top: 18px; border-top: 1px solid var(--line); }
.rd .dl-list li { border-bottom: 1px solid var(--line); }
.rd .dl-list a { display: grid; grid-template-columns: 26px 1fr auto auto; gap: 14px; align-items: center; padding: 16px 4px; transition: background 0.15s ease; }
.rd .dl-list a:hover { background: rgba(232, 232, 236, 0.03); }
.rd .dl-list .os { font-size: 15px; font-weight: 600; }
.rd .dl-list .file { font-family: var(--mono); font-size: 12.5px; color: var(--muted); display: block; font-weight: 400; margin-top: 2px; overflow-wrap: anywhere; }
.rd .dl-list .size { font-family: var(--mono); font-size: 12.5px; color: var(--muted); white-space: nowrap; }
.rd .dl-list .icon { color: var(--accent); }
.rd .dl-list .os-ic { width: 20px; height: 20px; color: var(--muted); }
.rd .trial-terms { font-size: 15px; color: var(--muted); max-width: 38em; }
.rd .trial-req { margin-top: 16px; font-size: 12.5px; color: var(--quiet); line-height: 1.55; }
.rd .buy-panel { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-panel); padding: 28px; height: 100%; display: flex; flex-direction: column; }
.rd .buy-panel h3 { font-size: 22px; font-weight: 700; font-stretch: 86%; }
.rd .buy-panel .price-fig { margin-top: 18px; }
.rd .buy-panel .price-meta { margin-top: 10px; }
.rd .buy-panel .btn { margin-top: 24px; width: 100%; }
.rd .buy-panel .price-fine { margin-top: auto; padding-top: 18px; border-top: 1px solid var(--line); grid-column: auto; }
.rd .buy-panel .alt { margin: 16px 0 22px; font-size: 14px; color: var(--muted); }

/* Footer */











.rd .sono-caveat-m { display: none; margin-top: 10px; }
.rd .dl-list .file .sz-m { display: none; }

/* ------------------------------------------------------------------ responsive */

@media (max-width: 1279px) {
  .rd .seg button { width: 100px; }
  .rd .tp-foot { grid-template-columns: 1fr; }

}
@media (max-width: 1100px) {
  .rd .window,
.rd .transport { max-width: none; }
  .rd .hear-copy,
.rd .hear-board { grid-column: 1 / -1; }
  .rd .hear-board { margin-top: 36px; }
  .rd .close-trial,
.rd .close-buy { grid-column: 1 / -1; }
  .rd .close-buy { margin-top: 40px; max-width: 520px; }
  
  
}
.rd .ways-cards { display: none; }
@media (max-width: 760px) {
  .rd .ways-table-wrap { display: none; }
  .rd .ways-cards { display: grid; gap: 16px; margin-top: 32px; }
  .rd .way-card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-panel); padding: 20px; }
  .rd .way-card h3 { font-size: 24px; font-weight: 700; font-stretch: 84%; line-height: 1.1; }
  .rd .way-card .col-price { display: block; margin-top: 6px; font-size: 14px; color: var(--muted); }
  .rd .way-card .col-price .fig { font-size: 16px; font-weight: 600; color: var(--text); }
  .rd .way-card dl { margin-top: 14px; display: grid; gap: 10px; border-top: 1px solid var(--line); padding-top: 14px; }
  .rd .way-card dt { font-size: 12px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--quiet); }
  .rd .way-card dd { margin-top: 2px; font-size: 14.5px; color: var(--muted); }
  .rd .way-card dd .fig { color: var(--text); }
  .rd .way-card .link-arrow { margin-top: 16px; }
}
@media (max-width: 640px) {
  .rd .cta { width: 100%; }
  .rd .cta .btn { width: 100%; }
  .rd .price-now { font-size: 38px; }
  .rd .tp-main { flex-wrap: wrap; gap: 12px; padding: 12px; }
  .rd .tp-main .seg { order: 2; flex: 1 1 100%; }
  .rd .seg button { flex: 1; width: auto; height: 50px; }
  .rd .tp-time { order: 1; flex: 1 1 0; }
  .rd .tp-foot { padding: 12px; }
  .rd .field-select select { max-width: none; width: 100%; height: 44px; font-size: 14px; }
  .rd .toggle { width: 100%; }
  .rd .toggle button { flex: 1; height: 44px; font-size: 14px; }
  .rd .section { padding-top: 88px; }
  .rd .sono-grid { grid-template-columns: 1fr; }
  .rd .sono-labels { grid-template-rows: none; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-bottom: 10px; }
  .rd .sono-label { padding: 9px 10px; min-height: 48px; }
  .rd .sono-label .s { display: none; }
  .rd .sono-label .caveat { display: none; }
  .rd .sono-caveat-m { display: block !important; }
  .rd .sono-row { height: 84px; }
  .rd .t-axis { grid-column: 1; }
  .rd .sono-board { padding: 12px; }
  .rd .dl-list a { grid-template-columns: 22px 1fr auto; }
  .rd .dl-list .size { display: none; }
  .rd .dl-list .file .sz-m { display: inline; }
  
  .rd .close { padding: 96px 0 88px; }
  
}

@media (prefers-reduced-motion: reduce) {
  .rd *,
.rd *::before,
.rd *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}
.rd [data-art="none"] .f-axis { display: none; }

/* ==================================================================
   Product page (/products/de-artifact/). Everything below is scoped to
   classes the home page does not use, so home renders unchanged.
   ================================================================== */

.rd .pg-product [id] { scroll-margin-top: 76px; }

/* Product bar: fixed, revealed by js/product-bar.js once the hero actions leave view. */
.rd .pbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 30;
  background: #101016; border-bottom: 1px solid var(--line-lit);
  box-shadow: 0 12px 24px -16px rgba(0, 0, 0, 0.8);
  transform: translateY(-100%); visibility: hidden;
  transition: transform 0.28s var(--ease-out), visibility 0s linear 0.28s;
}
.rd .pbar[data-shown="true"] { transform: none; visibility: visible; transition: transform 0.28s var(--ease-out), visibility 0s; }
.rd .pbar .wrap { height: 60px; display: flex; align-items: center; gap: 18px; }
.rd .pbar-name { font-family: var(--brand); font-size: 19px; font-weight: 700; letter-spacing: -0.02em; white-space: nowrap; }
.rd .pbar-nav { display: flex; gap: 24px; margin-left: 18px; font-size: 14px; font-weight: 500; }
.rd .pbar-nav a { color: var(--muted); transition: color 0.15s ease; }
.rd .pbar-nav a:hover { color: var(--text); }
.rd .pbar-price { margin-left: auto; display: flex; align-items: baseline; gap: 8px; font-family: var(--sans); font-variant-numeric: tabular-nums lining-nums; white-space: nowrap; }
.rd .pbar-price .now { font-size: 17px; font-weight: 700; }
.rd .pbar-price s { font-size: 13px; color: var(--quiet); text-decoration-thickness: 1px; }
.rd .pbar .btn-sm { height: 38px; padding: 0 14px; font-size: 14px; }
.rd .pbar-buy .sm { display: none; }

/* Product hero */
.rd .p-hero { position: relative; padding: 32px 0 0; isolation: isolate; overflow-x: clip; }
.rd .p-hero-top {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: end;
  position: relative; z-index: 2;
}
.rd .p-id { grid-column: 1 / span 7; }
.rd .p-hero h1 {
  font-family: var(--brand); font-size: clamp(56px, 6vw, 84px); line-height: 0.98; font-weight: 700;
  letter-spacing: -0.03em;
}
.rd .p-tagline { margin-top: 14px; font-size: clamp(22px, 2vw, 28px); line-height: 1.2; font-weight: 620; font-stretch: 88%; color: var(--accent); letter-spacing: -0.005em; }
.rd .p-sub { margin-top: 14px; font-size: 16.5px; line-height: 1.6; color: var(--muted); max-width: 34em; }
.rd .p-offer { grid-column: 8 / span 5; }
.rd .p-deal { background: var(--panel); border: 1px solid var(--line-lit); border-radius: var(--r-panel); padding: 24px; }
.rd .p-price { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.rd .p-price-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; font-size: 13px; color: var(--muted); line-height: 1.4; text-align: right; padding-bottom: 2px; }
.rd .p-actions { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 12px; }
.rd .p-actions .btn { height: 50px; padding: 0 18px; font-size: 15.5px; flex: 1 1 auto; }
.rd .p-fine { margin-top: 12px; font-size: 12.5px; color: var(--quiet); text-align: right; }

.rd .p-stage {
  position: relative; margin-top: 30px;
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: start;
}
.rd .p-window { grid-column: 1 / span 8; margin: 0; position: relative; }
.rd .p-window .window {
  max-width: none;
  /* Depth, not glow: one contact shadow and one soft offset, on the single studio ground. */
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5), 0 28px 48px -16px rgba(0, 0, 0, 0.85);
}
.rd .p-window-cap { margin-top: 14px; font-size: 12.5px; color: var(--quiet); }
.rd .p-stage-note { margin-top: 18px; font-size: 13.5px; color: var(--quiet); position: relative; z-index: 1; }

/* A/B rack beside the window: same player, vertical. */
.rd .rack {
  grid-column: 9 / span 4; position: relative; z-index: 1; align-self: stretch;
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-panel);
  padding: 16px; display: flex; flex-direction: column; gap: 12px;
}
.rd .rack-head { display: flex; align-items: center; gap: 14px; }
.rd .rack-readout { flex: 1; min-width: 0; }
.rd .rack-title { font-size: 15px; font-weight: 650; line-height: 1.3; }
.rd .rack .time-row { margin-top: 4px; }
.rd .rack-strip { height: auto; flex: 1 1 56px; min-height: 56px; max-height: 196px; }
.rd .rack-vars { display: grid; gap: 6px; }
.rd .rack-vars button {
  appearance: none; cursor: pointer; text-align: left; color: var(--text); width: 100%;
  display: grid; grid-template-columns: 16px auto minmax(0, 1fr); align-items: baseline; column-gap: 10px;
  min-height: 46px; padding: 12px 14px; border-radius: var(--r-ctl);
  background: var(--ground); border: 1px solid var(--line);
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.rd .rack-vars button:hover { border-color: var(--line-strong); }
.rd .rack-vars .k { font-family: var(--mono); font-size: 12px; color: var(--quiet); }
.rd .rack-vars .t { font-size: 15px; font-weight: 650; line-height: 1.2; }
.rd .rack-vars .s { font-size: 12px; color: var(--quiet); text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rd .rack-vars button[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: var(--ground); }
.rd .rack-vars button[aria-pressed="true"] .k,
.rd .rack-vars button[aria-pressed="true"] .s { color: rgba(11, 11, 16, 0.72); }
.rd .rack-caveat { margin-top: -2px; }
.rd .rack-src { margin-top: auto; display: flex; gap: 8px; align-items: center; }
.rd .rack-src .field-select { flex: 1 1 auto; min-width: 0; }
.rd .rack-src .field-select select { max-width: none; width: 100%; }
.rd .rack .status-line { margin-top: -2px; }

/* Specifications */
.rd .p-split { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; }
.rd .p-split-head { grid-column: 1 / span 4; }
.rd .p-specs-src { margin-top: 16px; font-size: 13.5px; color: var(--quiet); max-width: 22em; }
.rd .p-specs-man { margin-top: 28px; }
.rd .p-specs-mannote { margin-top: 6px; font-size: 13.5px; color: var(--quiet); }
.rd .spec-table { grid-column: 5 / span 8; border-top: 1px solid var(--line-lit); }
.rd .spec-table .row { display: grid; grid-template-columns: 150px minmax(0, 1fr); column-gap: 24px; padding: 20px 0 22px; border-bottom: 1px solid var(--line); }
.rd .spec-table dt { font-size: 12px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--quiet); padding-top: 7px; }
.rd .spec-table .v { display: block; font-size: 22px; line-height: 1.3; font-weight: 620; font-stretch: 86%; letter-spacing: -0.005em; }
.rd .spec-table .v.mono { font-size: 19px; font-weight: 500; letter-spacing: -0.01em; }
.rd .spec-table .v-q { color: var(--muted); font-weight: 500; }
.rd .spec-table .q { display: block; margin-top: 6px; font-size: 13.5px; line-height: 1.55; color: var(--muted); max-width: 62em; }
.rd .spec-table .q .mono { font-size: 12.5px; color: var(--text); }

/* Videos */
.rd .p-videos { margin-top: 44px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.rd .p-video { margin: 0; }
.rd .p-video-frame {
  aspect-ratio: 16 / 9; border-radius: var(--r-panel); overflow: hidden; background: var(--inset);
  border: 1px solid #262630; box-shadow: 0 32px 64px -28px rgba(0, 0, 0, 0.85);
}
.rd .p-video video { width: 100%; height: 100%; object-fit: cover; background: var(--inset); }
.rd .p-video video::cue { font-family: var(--sans); background: rgba(11, 11, 16, 0.82); color: var(--text); }
.rd .p-video figcaption { margin-top: 14px; font-size: 14px; line-height: 1.55; color: var(--muted); max-width: 40em; }
.rd .p-video .cap-t { display: block; margin-bottom: 4px; font-size: 15px; font-weight: 650; color: var(--text); }
.rd .p-video .cap-t .mono { font-size: 13px; font-weight: 500; color: var(--muted); }
.rd .p-videos-note { margin-top: 18px; font-size: 12.5px; color: var(--quiet); }

/* Full A/B board, bound to the hero rack */
.rd .p-board { margin-top: 112px; }
.rd .h3-lg { font-size: clamp(26px, 2.3vw, 32px); line-height: 1.1; font-weight: 700; font-stretch: 84%; letter-spacing: -0.008em; text-wrap: balance; }
.rd .p-board .lede { font-size: 16px; }
.rd .hear-read { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.rd .hear-track { font-size: 13px; line-height: 1.4; color: var(--quiet); }
.rd .hear-track [data-view="track-name"] { color: var(--muted); }
.rd .p-tip { margin-top: 22px; font-size: 13.5px; line-height: 1.55; color: var(--quiet); }

/* What it does + fit */
.rd .p-what { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: center; }
.rd .p-what-shot { grid-column: 1 / span 7; margin: 0; }
.rd .p-what-cap { margin-top: 10px; font-size: 12.5px; line-height: 1.5; color: var(--quiet); }
.rd .p-what-text { grid-column: 9 / span 4; }
.rd .p-what-text .lede + .lede { margin-top: 14px; }
.rd .p-fit { margin-top: 128px; }
.rd .fit-cols { margin-top: 44px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 48px; }
.rd .fit-col h3,
.rd .fit-not-h { font-size: 21px; line-height: 1.2; font-weight: 700; font-stretch: 86%; letter-spacing: -0.005em; }
.rd .fit-col h3 { padding-bottom: 14px; border-bottom: 1px solid var(--line-lit); }
.rd .fit-list li { padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 15.5px; line-height: 1.55; color: var(--muted); }
.rd .fit-not-h { margin-top: 64px; padding-bottom: 14px; border-bottom: 1px solid var(--line-lit); }
.rd .fit-not { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 48px; }
.rd .fit-not > div { padding: 18px 0 20px; border-bottom: 1px solid var(--line); }
.rd .fit-not dt { font-size: 16px; font-weight: 650; line-height: 1.35; }
.rd .fit-not dd { margin-top: 6px; font-size: 14.5px; line-height: 1.6; color: var(--muted); }

/* How harmonic and percussive control works */
.rd .p-how { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: start; }
.rd .p-how-text { grid-column: 1 / span 4; }
.rd .how-steps { margin-top: 28px; border-top: 1px solid var(--line); counter-reset: none; }
.rd .how-steps li { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.rd .how-steps .st { font-size: 15px; font-weight: 650; }
.rd .how-steps .sd { font-size: 14.5px; line-height: 1.55; color: var(--muted); }
.rd .p-how-note { margin-top: 20px; font-size: 14px; line-height: 1.6; color: var(--muted); }
.rd .p-how-note b { color: var(--text); font-weight: 600; }
.rd .p-how-link { margin-top: 22px; }
.rd .p-how-art {
  grid-column: 6 / span 7; display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 28px; align-items: start;
}
.rd .gui-crop { margin: 0; }
.rd .gui-crop-box {
  position: relative; width: 246px; overflow: hidden;
  border-radius: var(--r-panel); border: 1px solid #262630; background: var(--inset);
  box-shadow: 0 32px 64px -28px rgba(0, 0, 0, 0.85);
}
/* Shown at the crop's intrinsic pixel size, so "actual size" stays literally true. */
.rd .gui-crop-box img { width: 244px; height: 682px; max-width: none; }
.rd .gui-crop figcaption { margin-top: 10px; font-size: 12.5px; color: var(--quiet); max-width: 246px; }

.rd .flow { display: flex; flex-direction: column; align-items: stretch; padding-top: 2px; }
.rd .flow .node {
  display: block; text-align: center; padding: 8px 10px; font-size: 13px; line-height: 1.25; color: var(--text);
  background: var(--panel); border: 1px solid var(--line-lit); border-radius: var(--r-ctl);
}
.rd .flow .node small { display: block; margin-top: 2px; font-size: 12px; color: var(--quiet); }
.rd .flow .node-k { border-color: var(--accent-line); }
.rd .flow-chain { display: flex; flex-direction: column; align-items: center; }
.rd .flow-chain .node { width: min(100%, 220px); }
.rd .flow-ar { width: 14px; height: 14px; color: var(--line-strong); margin: 2px auto; flex: none; }
.rd .flow-fork,
.rd .flow-join { position: relative; height: 26px; }
.rd .flow-fork::before,
.rd .flow-join::before { content: ""; position: absolute; left: 50%; width: 1px; background: rgba(232, 232, 236, 0.30); }
.rd .flow-fork::before { top: 0; height: 13px; }
.rd .flow-join::before { bottom: 0; height: 13px; }
.rd .flow-fork::after,
.rd .flow-join::after { content: ""; position: absolute; left: calc(25% - 4px); right: calc(25% - 4px); border: 1px solid rgba(232, 232, 236, 0.30); }
.rd .flow-fork::after { top: 13px; bottom: 0; border-bottom: 0; }
.rd .flow-join::after { top: 0; bottom: 13px; border-top: 0; }
.rd .flow-lanes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.rd .lane { display: flex; flex-direction: column; align-items: stretch; }
.rd .lane-name { text-align: center; font-size: 12px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); margin: 4px 0 6px; }

/* Presets */
.rd .presets-head { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: end; }
.rd .presets-head .h2 { grid-column: 1 / span 5; }
.rd .presets-head .lede { grid-column: 7 / span 6; margin-top: 0; }
.rd .presets-wrap { margin-top: 40px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-panel); overflow: hidden; }
.rd .presets { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.rd .presets th,
.rd .presets td { text-align: left; vertical-align: top; padding: 14px 22px; border-top: 1px solid var(--line); }
.rd .presets thead th { border-top: 0; padding: 16px 22px 14px; font-size: 12px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--quiet); }
.rd .presets tbody th { width: 31%; font-weight: 400; }
.rd .presets td { line-height: 1.55; }
.rd .presets td:nth-child(2) { width: 33%; color: var(--text); }
.rd .presets td:nth-child(3) { color: var(--muted); }
.rd .presets tbody tr { transition: background 0.15s ease; }
.rd .presets tbody tr:hover { background: rgba(232, 232, 236, 0.025); }
.rd .presets .pn { font-size: 16px; font-weight: 650; color: var(--text); margin-right: 8px; }
.rd .presets .pc {
  display: inline-block; margin: 2px 6px 0 0; font-size: 12px; line-height: 1.5; color: var(--quiet);
  border: 1px solid var(--line-lit); border-radius: 3px; padding: 0 6px; vertical-align: 2px; white-space: nowrap;
}
.rd .presets .pc-on { color: var(--text); border-color: var(--line-strong); }
.rd .presets .pc-new { color: var(--accent); border-color: var(--accent-line); }

/* Detection, quiet */
.rd .p-detect { padding-top: 112px; }
.rd .p-detect-inner { max-width: 820px; padding-top: 28px; border-top: 1px solid var(--line); }
.rd .p-detect-h { font-size: 22px; line-height: 1.25; font-weight: 700; font-stretch: 86%; }
.rd .p-detect-inner p { margin-top: 10px; font-size: 15px; color: var(--muted); }
.rd .p-detect-inner .p-detect-q { margin-top: 14px; font-size: 13.5px; line-height: 1.6; color: var(--quiet); }
.rd .p-detect-q b { color: var(--muted); font-weight: 600; }

/* Close: trial, requirements, buy */
.rd .p-close { padding-top: 112px; }
.rd .p-close .close-buy { grid-row: 1 / span 2; align-self: start; position: sticky; top: 84px; }
.rd .p-req { grid-column: 1 / span 7; }
.rd .nw { white-space: nowrap; }
.rd .p-close .buy-panel { height: auto; }
.rd .p-close .buy-panel .price-fine { margin-top: 0; padding-top: 0; border-top: 0; }
.rd .buy-facts { margin: 0 0 18px; border-top: 1px solid var(--line); font-size: 14px; }
.rd .buy-facts li { padding: 9px 0; border-bottom: 1px solid var(--line); }
.rd .req-h { margin-top: 48px; font-size: 13px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--quiet); }
.rd .req { margin-top: 12px; border-top: 1px solid var(--line); }
.rd .req > div { display: grid; grid-template-columns: 132px minmax(0, 1fr); column-gap: 16px; padding: 11px 0; border-bottom: 1px solid var(--line); font-size: 13.5px; line-height: 1.55; }
.rd .req dt { color: var(--quiet); }
.rd .req dd { color: var(--muted); }

/* Product page responsive */
@media (max-width: 1360px) {
  .rd .p-id { grid-column: 1 / span 6; }
  .rd .p-offer { grid-column: 7 / span 6; }
}
@media (max-width: 1279px) {
  .rd .rack-vars .s { display: none; }
  .rd .rack-vars button { grid-template-columns: 16px minmax(0, 1fr); }
}
@media (max-width: 1100px) {
  .rd .p-hero-top { display: flex; flex-direction: column; align-items: stretch; gap: 24px; }
  .rd .p-offer { max-width: 600px; }
  .rd .p-stage { display: flex; flex-direction: column; gap: 14px; }
  .rd .rack { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px 16px; align-items: center; }
  .rd .rack-vars { grid-column: 1 / -1; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rd .rack-vars .s { display: block; }
  .rd .rack-vars button { grid-template-columns: 16px auto; grid-template-rows: auto auto; row-gap: 1px; }
  .rd .rack-vars .s { grid-column: 2; text-align: left; }
  .rd .rack-caveat,
.rd .rack-src,
.rd .rack .status-line { grid-column: 1 / -1; }
  .rd .rack-caveat { margin-top: 0; }
  .rd .p-split-head,
.rd .spec-table { grid-column: 1 / -1; }
  .rd .spec-table { margin-top: 32px; }
  .rd .p-what-shot,
.rd .p-what-text { grid-column: 1 / -1; }
  .rd .p-what-text { margin-top: 32px; max-width: 640px; }
  .rd .p-how-text,
.rd .p-how-art { grid-column: 1 / -1; }
  .rd .p-how-text { max-width: 640px; }
  .rd .p-how-art { margin-top: 44px; }
  .rd .presets-head .h2,
.rd .presets-head .lede { grid-column: 1 / -1; }
  .rd .presets-head .lede { margin-top: 16px; }
  .rd .p-close .close-buy { position: static; grid-row: auto; }
  .rd .p-req { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
  .rd .pbar-nav { display: none; }
}
@media (max-width: 760px) {
  .rd .p-videos { grid-template-columns: 1fr; gap: 40px; }
}
@media (max-width: 640px) {
  .rd .pg-product [id] { scroll-margin-top: 68px; }
  .rd .pbar .wrap { height: 56px; gap: 8px; }
  .rd .pbar-name { font-size: 17px; }
  .rd .pbar-price s { display: none; }
  .rd .pbar .btn-sm { height: 40px; padding: 0 12px; }
  .rd .pbar-buy .lg { display: none; }
  .rd .pbar-buy .sm { display: inline; }
  .rd .p-hero { padding-top: 24px; }
  .rd .p-hero h1 { font-size: 54px; }
  .rd .p-tagline { font-size: 22px; }
  .rd .p-sub { font-size: 16px; }
  .rd .p-actions { flex-direction: column; }
  .rd .p-actions .btn { width: 100%; }
  .rd .p-price-meta { align-items: flex-start; text-align: left; }
  .rd .p-price { justify-content: flex-start; }
  .rd .rack { grid-template-columns: 1fr; padding: 12px; }
  .rd .rack-vars button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; min-height: 54px; padding: 6px 4px; text-align: center; }
  .rd .rack-vars .k { display: none; }
  .rd .rack-vars .s { text-align: center; font-size: 12px; white-space: normal; }
  .rd .rack-src { flex-wrap: wrap; }
  .rd .rack-src .field-select { flex: 1 1 100%; }
  .rd .p-board { margin-top: 80px; }
  .rd .spec-table .row { grid-template-columns: 1fr; row-gap: 6px; padding: 16px 0 18px; }
  .rd .spec-table dt { padding-top: 0; }
  .rd .spec-table .v { font-size: 19px; }
  .rd .spec-table .v.mono { font-size: 17px; }
  .rd .p-fit { margin-top: 96px; }
  .rd .fit-cols,
.rd .fit-not { grid-template-columns: 1fr; }
  .rd .fit-cols { row-gap: 40px; }
  .rd .fit-not-h { margin-top: 48px; }
  .rd .how-steps li { grid-template-columns: 1fr; gap: 2px; }
  .rd .p-how-art { grid-template-columns: 1fr; row-gap: 40px; }
  .rd .presets thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .rd .presets,
.rd .presets tbody,
.rd .presets tr,
.rd .presets th,
.rd .presets td { display: block; width: auto !important; }
  .rd .presets tbody tr { padding: 14px 16px 16px; border-top: 1px solid var(--line); }
  .rd .presets tbody tr:first-child { border-top: 0; }
  .rd .presets tbody th,
.rd .presets td { padding: 0; border-top: 0; }
  .rd .presets td { margin-top: 6px; }
  .rd .presets .pn { display: block; margin: 0 0 4px; }
  .rd .req > div { grid-template-columns: 1fr; row-gap: 2px; }
  .rd .p-detect { padding-top: 88px; }
  .rd .p-close { padding-top: 88px; }
}

/* ==================================================================
   Home (/): ArtifactNet and de-artifact sections. Everything below
   is scoped to classes the product page does not use.
   ================================================================== */

/* First viewport: one headline, two equal columns on shared rows. */
.rd .duo { position: relative; padding: 12px 0 0; }
.rd .duo > .wrap { position: relative; z-index: 1; }
.rd .duo-sono {
  position: absolute; z-index: 0; left: 0; right: 0; top: 0; height: 176px; overflow: hidden; pointer-events: none;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 16%, #000 84%, transparent 100%),
                      linear-gradient(180deg, #000 0, #000 34%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent 0, #000 16%, #000 84%, transparent 100%),
              linear-gradient(180deg, #000 0, #000 34%, transparent 100%);
  mask-composite: intersect;
}
.rd .duo-sono img { width: 100%; height: 100%; object-fit: cover; object-position: center 38%; opacity: 0.24; }

/* Keep "AI-generated music." whole: the brand face is wider than the body face, so on
   phones the hyphen became the break point and "music." was left alone on a line. */
.rd .duo-h .nw { white-space: nowrap; }
.rd .duo-h {
  font-family: var(--brand); font-size: clamp(36px, 3.6vw, 52px); line-height: 1.08; font-weight: 700;
  letter-spacing: -0.03em; text-wrap: balance;
}
.rd .duo-grid {
  margin-top: 40px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: auto 1fr auto; column-gap: 64px; row-gap: 12px;
}
.rd .duo-col { position: relative; min-width: 0; grid-row: span 3; display: grid; grid-template-rows: subgrid; }
.rd .duo-clean::before { content: ""; position: absolute; top: 2px; bottom: 0; left: -32px; width: 1px; background: var(--line-lit); }
.rd .duo-head h2 { font-family: var(--brand); font-size: 28px; line-height: 1.1; font-weight: 700; letter-spacing: -0.02em; }
.rd .duo-head p { margin-top: 3px; font-size: 16px; line-height: 1.45; color: var(--muted); }
.rd .duo-proof { min-width: 0; display: flex; flex-direction: column; gap: 10px; container-type: inline-size; }
.rd .duo .window { max-width: none; }
.rd .duo-act { display: flex; flex-wrap: wrap; gap: 12px 12px; align-items: flex-start; }
.rd .duo-act .btn { height: 50px; }
.rd .duo-act .cta { gap: 7px; }
.rd .duo-line {
  margin-top: 14px; padding-top: 9px; border-top: 1px solid var(--line);
  text-align: center; font-size: 15px; line-height: 1.5; color: var(--text);
}
/* Small screens: two equal jump links under the headline, one per product. */
.rd .duo-jump { display: none; }
.rd .duo-col { scroll-margin-top: 16px; }

/* Example detection results: real production-model output on two public demo clips.
   AI red and real green appear only inside this display. */
.rd .result {
  --ai: #f87171; --ai-wash: rgba(248, 113, 113, 0.13); --ai-line: rgba(248, 113, 113, 0.5);
  --real: #5fd39a; --real-wash: rgba(95, 211, 154, 0.12); --real-line: rgba(95, 211, 154, 0.45);
  --thr: 20%;
  margin: 0; height: 100%; display: flex; flex-direction: column;
  background: var(--inset); border: 1px solid #262630; border-radius: var(--r-panel); overflow: hidden;
  box-shadow: 0 24px 48px -16px rgba(0, 0, 0, 0.85), 0 8px 16px -8px rgba(0, 0, 0, 0.6);
}
.rd .result-bar {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 16px; background: #15151c; border-bottom: 1px solid var(--line);
}
.rd .result-title { font-size: 14px; font-weight: 650; color: var(--text); line-height: 1.3; }

.rd .rs { padding: 14px 20px; }
.rd .rs + .rs { border-top: 1px solid var(--line); }
.rd .rs-main { flex: 1; display: flex; flex-direction: column; gap: 12px; min-height: 0; }
.rd .rs-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.rd .rs-clip { display: flex; align-items: baseline; gap: 8px; min-width: 0; font-size: 15px; font-weight: 650; color: var(--text); line-height: 1.3; }
.rd .rs-clip .icon { align-self: center; color: var(--muted); }
.rd .rs-clip-q { font-size: 13px; font-weight: 400; color: var(--muted); white-space: nowrap; }
.rd .rs-verdict {
  flex: none; padding: 4px 11px; border-radius: 999px; white-space: nowrap;
  font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; line-height: 1.35;
}
.rd .rs-verdict.is-ai { color: var(--ai); background: var(--ai-wash); border: 1px solid var(--ai-line); }
.rd .rs-verdict.is-real { color: var(--real); background: var(--real-wash); border: 1px solid var(--real-line); }

.rd .rs-read { display: grid; gap: 8px; }
.rd .rs-prob { display: flex; align-items: baseline; gap: 12px; }
.rd .rs-prob .num {
  font-family: var(--mono); font-variant-numeric: tabular-nums; font-size: 48px; font-weight: 500;
  line-height: 1; letter-spacing: -0.02em; color: var(--text);
}
.rd .rs-prob .unit { font-size: 14px; color: var(--muted); }
.rd .pmeter { position: relative; height: 10px; border-radius: 3px; background: var(--well); border: 1px solid var(--line); }
.rd .pmeter-fill { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 2px 0 0 2px; }
.rd .pmeter.is-ai .pmeter-fill { background: rgba(248, 113, 113, 0.82); }
.rd .pmeter.is-real .pmeter-fill { background: rgba(95, 211, 154, 0.85); }
.rd .pmeter-tick { position: absolute; top: -5px; bottom: -5px; width: 2px; margin-left: -1px; background: var(--text); }
.rd .pmeter-scale { position: relative; height: 16px; font-family: var(--mono); font-size: 12px; line-height: 16px; color: var(--quiet); }
.rd .pmeter-scale span { position: absolute; top: 0; }
.rd .pmeter-scale span:first-child { left: 0; }
.rd .pmeter-scale span:last-child { right: 0; }
.rd .pmeter-scale .thr { transform: translateX(-50%); color: var(--text); }

.rd .segs { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.rd .segs-h { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 13px; color: var(--muted); }
.rd .segs-key { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; white-space: nowrap; }
.rd .segs-key .mono { color: var(--text); }
.rd .segs-key-line { width: 14px; border-top: 1px dashed var(--text); }
.rd .segs-row {
  position: relative; flex: 1; min-height: 44px; margin-top: 8px;
  display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 5px; align-items: end;
  border-bottom: 1px solid var(--line-strong);
}
.rd .segs-row::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: var(--thr); height: 0;
  border-top: 1px dashed rgba(232, 232, 236, 0.75); pointer-events: none;
}
.rd .segs-row li { position: relative; height: 100%; }
.rd .segs-row li::before {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: max(var(--p), 2px);
  border-radius: 2px 2px 0 0;
}
.rd .segs-row li.is-ai::before { background: rgba(248, 113, 113, 0.66); box-shadow: inset 0 2px 0 rgba(248, 113, 113, 0.95); }
.rd .segs-row li.is-low::before { background: rgba(232, 232, 236, 0.45); }
.rd .segs-axis {
  margin-top: 6px; display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 5px;
  font-family: var(--mono); font-size: 12px; color: var(--quiet);
}
.rd .rs-meta { font-family: var(--mono); font-size: 12px; line-height: 1.5; color: var(--muted); }
.rd .rs-meta span { white-space: nowrap; }

.rd .rs-alt {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto; grid-template-areas: "clip verdict prob" "meter meter mini";
  align-items: center; gap: 10px 14px; padding-top: 14px; padding-bottom: 16px;
}
.rd .rs-alt .rs-clip { grid-area: clip; }
.rd .rs-alt .rs-verdict { grid-area: verdict; }
.rd .rs-prob-sm { grid-area: prob; font-family: var(--mono); font-variant-numeric: tabular-nums; font-size: 20px; font-weight: 500; letter-spacing: -0.01em; line-height: 1; color: var(--text); min-width: 3.4em; text-align: right; }
.rd .pmeter-sm { grid-area: meter; height: 8px; }
.rd .segs-mini { grid-area: mini; display: grid; grid-template-columns: repeat(8, 10px); gap: 3px; height: 18px; align-items: end; border-bottom: 1px solid var(--line-strong); }
.rd .segs-mini li { position: relative; height: 100%; }
.rd .segs-mini li::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: max(var(--p), 2px); background: rgba(232, 232, 236, 0.45); }
.rd .segs-mini li.is-ai::before { background: rgba(248, 113, 113, 0.8); }

.rd .result-foot { padding: 11px 20px 12px; border-top: 1px solid var(--line); background: #121218; }
.rd .result-evidence { font-size: 14px; font-weight: 600; line-height: 1.45; color: var(--text); }

/* Real screenshot detail with a quiet label. */
.rd .window-cap {
  position: absolute; left: 10px; top: 10px; z-index: 1; margin: 0; pointer-events: none;
  padding: 3px 8px; border-radius: var(--r-ctl); background: rgba(11, 11, 16, 0.82); border: 1px solid var(--line-lit);
  font-size: 12px; line-height: 1.4; color: var(--muted);
}
.rd .window-detail img { aspect-ratio: 616 / 336; }
/* Two-column hero: the screenshot gives up its top rows (Bypass/MAX read-out) before the
   one line under both columns leaves the first viewport. */
@media (min-width: 1101px) {
  .rd .window-detail img { max-height: max(240px, calc(100vh - 524px)); object-fit: cover; object-position: 50% 85%; }
}

/* Compact A/B transport under the window; track choice lives in the listening band. */
.rd .duo-tp { margin-top: 0; max-width: none; }
.rd .duo-tp .seg { border: 0; padding: 4px; }
.rd .duo-tp .tp-main { padding: 10px 14px; }
.rd .duo-tp .mini-strip { height: 32px; }
.rd .duo-tp .tp-foot { grid-template-columns: minmax(0, 1fr) auto; padding: 9px 14px 10px; }
.rd .tp-more {
  font-size: 12.5px; font-weight: 600; color: var(--text); white-space: nowrap;
  text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 0.24em;
}
.rd .tp-more:hover { text-decoration-color: var(--accent); }
/* Loading, error and blocked-playback notes sit over the window's lower edge,
   so the columns keep their height and nothing below them moves. */
.rd .duo-tp .status-line {
  position: absolute; z-index: 2; left: 10px; bottom: calc(100% + 20px); max-width: calc(100% - 20px);
  padding: 8px 10px 8px 12px; background: rgba(14, 14, 20, 0.95); border: 1px solid var(--line-lit);
  border-radius: var(--r-ctl); box-shadow: 0 10px 24px -12px rgba(0, 0, 0, 0.85);
}
.rd .duo-tp .status-line .retry { flex: none; }
@container (min-width: 441px) and (max-width: 600px) {
  .duo-tp .tp-main { flex-wrap: wrap; }
  .duo-tp .tp-time { flex: 1 1 100%; order: 3; }
}

/* Product blocks below the fold. */
.rd .block { padding-top: 144px; }
.rd .block-head {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: end;
  padding-bottom: 26px; border-bottom: 1px solid var(--line-lit);
}
.rd .block-name {
  grid-column: 1 / span 7; font-size: clamp(36px, 3.7vw, 54px); line-height: 1.02; font-weight: 740;
  font-stretch: 78%; letter-spacing: -0.014em; text-wrap: balance;
}
.rd .block-sub { grid-column: 9 / span 4; font-size: 16px; line-height: 1.55; color: var(--muted); }
.rd .sub-h { font-size: clamp(28px, 2.6vw, 38px); line-height: 1.08; font-weight: 700; font-stretch: 82%; letter-spacing: -0.01em; text-wrap: balance; }

/* How it reads a track: text beside a stage diagram. */
.rd .d-how { margin-top: 72px; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: start; }
.rd .d-how-text { grid-column: 1 / span 4; }
.rd .d-paper { margin-top: 16px; font-size: 14px; line-height: 1.6; color: var(--quiet); }
.rd .d-paper cite { font-style: normal; }
.rd .pipe { grid-column: 5 / span 8; margin: 0; }
.rd .pipe-row {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-panel);
}
.rd .pipe-node { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 20px 18px 20px; min-height: 176px; }
.rd .pipe-node + .pipe-node { border-left: 1px solid var(--line); }
.rd .pipe-key { background: rgba(232, 232, 236, 0.025); }
.rd .pipe-ar {
  position: absolute; left: -11px; top: 22px; width: 22px; height: 22px; padding: 3px;
  color: var(--accent); background: var(--ground); border: 1px solid var(--line-lit); border-radius: 50%;
}
.rd .pn-t { font-size: 16px; font-weight: 680; line-height: 1.25; }
.rd .pipe-node + .pipe-node .pn-t { padding-left: 8px; }
.rd .pn-v { font-size: 13px; color: var(--muted); }
.rd .pn-v .fig { font-size: 19px; font-weight: 650; font-stretch: 88%; color: var(--text); margin-right: 3px; }
.rd .pn-d { margin-top: auto; font-size: 13px; line-height: 1.5; color: var(--muted); }
.rd .pipe figcaption { margin-top: 12px; font-size: 12.5px; line-height: 1.5; color: var(--quiet); }
.rd .pipe figcaption .fig { color: var(--muted); }

/* Benchmark readout with its scope. */
.rd .d-bench { margin-top: 112px; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: start; }
.rd .d-bench-text { grid-column: 1 / span 4; }
.rd .d-bench-text .link-arrow { margin-top: 22px; }
.rd .bench { grid-column: 5 / span 8; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-panel); padding: 24px 26px 22px; }
.rd .bench-model { font-size: 16px; font-weight: 650; }
.rd .bench-row { margin-top: 16px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line-lit); }
.rd .bench-row > div { padding: 16px 18px 2px; border-left: 1px solid var(--line); }
.rd .bench-row > div:first-child { padding-left: 0; border-left: 0; }
.rd .bench-row dt { font-size: 13.5px; color: var(--muted); }
.rd .bench-row .v { margin-top: 6px; font-family: var(--mono); font-size: 32px; font-weight: 500; line-height: 1.1; letter-spacing: -0.03em; }
.rd .bench-row .q { margin-top: 4px; font-size: 12.5px; line-height: 1.45; color: var(--quiet); }
.rd .bench-scope { margin-top: 20px; padding-top: 14px; border-top: 1px solid var(--line); font-size: 13px; line-height: 1.55; color: var(--muted); }
.rd .bench-scope .mono,
.rd .bench-note .mono { font-size: 12px; color: var(--text); }
.rd .bench-note { margin-top: 8px; font-size: 13px; line-height: 1.55; color: var(--quiet); }

/* Batch, exports, API: the real dashboard row and the API's fields. */
.rd .d-batch { margin-top: 112px; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: start; }
.rd .d-batch-art { grid-column: 1 / span 7; }
.rd .d-batch-text { grid-column: 9 / span 4; padding-top: 4px; }
.rd .d-batch-text .link-arrow { margin-top: 22px; }
.rd .d-shot img { width: 100%; }
.rd .d-shot-cap { margin-top: 10px; font-size: 12.5px; color: var(--quiet); }
.rd .d-limits { margin-top: 14px; font-size: 14px; line-height: 1.6; color: var(--quiet); }
.rd .api-fields { margin-top: 24px; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-panel); padding: 16px 22px 4px; }
.rd .api-h { font-size: 14px; font-weight: 650; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.rd .api-fields dl > div { display: grid; grid-template-columns: 168px minmax(0, 1fr); gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 13.5px; line-height: 1.5; }
.rd .api-fields dl > div:last-child { border-bottom: 0; }
.rd .api-fields dt { font-size: 12.5px; color: var(--text); }
.rd .api-fields dd { color: var(--muted); }
.rd .api-fields dd .mono { font-size: 12.5px; color: var(--text); }

/* Detection plans, one row. */
.rd .plans { margin-top: 96px; }
.rd .plans-h { font-size: 24px; line-height: 1.15; font-weight: 700; font-stretch: 84%; }
.rd .plan-row { margin-top: 16px; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border-top: 1px solid var(--line-lit); border-bottom: 1px solid var(--line); }
.rd .plan-row > div { padding: 18px 18px 20px; border-left: 1px solid var(--line); }
.rd .plan-row > div:first-child { padding-left: 0; border-left: 0; }
.rd .plan-row dt { font-size: 15px; font-weight: 650; }
.rd .plan-row .v { margin-top: 6px; font-size: 24px; line-height: 1.2; font-weight: 600; font-stretch: 86%; }
.rd .plan-row .v .fig { font-size: 24px; font-weight: 650; }
.rd .plan-row .v small { margin-left: 2px; font-family: var(--sans); font-size: 13px; font-weight: 400; color: var(--muted); }
.rd .plan-row .q { margin-top: 4px; font-size: 13px; line-height: 1.45; color: var(--muted); }
.rd .plan-row .q .fig { color: var(--text); }
.rd .plans-src { margin-top: 12px; font-size: 12.5px; color: var(--quiet); }
.rd .plans-src .fig { color: var(--muted); }

/* Cleanup: listening band, compact plug-in line, three ways. */
.rd .c-listen { margin-top: 72px; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; }
.rd .hear-src { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 8px; }
.rd .hear-src .field-select { flex: 1 1 200px; min-width: 0; }
.rd .hear-src .field-select select { max-width: none; width: 100%; }
.rd .c-line { margin-top: 120px; }
.rd .c-line-head .lede { max-width: 40em; }
.rd .shelf { margin-top: 32px; border-top: 1px solid var(--line-lit); }
.rd .shelf-item {
  display: grid; grid-template-columns: 280px minmax(0, 3fr) minmax(0, 2.2fr) minmax(0, 1.5fr); column-gap: 32px;
  align-items: center; padding: 16px 0; border-bottom: 1px solid var(--line);
}
.rd .shelf-shot { margin: 0; aspect-ratio: 1600 / 1018; border-radius: 6px; overflow: hidden; border: 1px solid #262630; background: var(--inset); }
.rd .shelf-shot img { width: 100%; height: 100%; object-fit: contain; }
.rd .shelf-id h4 { font-family: var(--brand); font-size: 24px; line-height: 1.15; font-weight: 700; letter-spacing: -0.02em; }
.rd .shelf-id h4 a { text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 0.2em; text-decoration-thickness: 1px; transition: text-decoration-color 0.18s ease; }
.rd .shelf-id h4 a:hover { text-decoration-color: var(--accent); }
.rd .shelf-id p { margin-top: 4px; font-size: 15px; line-height: 1.45; color: var(--muted); }
.rd .shelf-fmt { font-size: 14px; line-height: 1.45; color: var(--muted); }
.rd .shelf-price { justify-self: end; text-align: right; font-size: 14px; color: var(--muted); white-space: nowrap; }
.rd .shelf-price .fig { font-size: 18px; font-weight: 650; color: var(--text); }
.rd .shelf-price s { margin-left: 6px; color: var(--quiet); text-decoration-thickness: 1px; }
.rd .shelf-price s.fig { font-size: 14px; font-weight: 400; color: var(--quiet); }
.rd .shelf-price .tag-soon { margin-left: 0; top: 0; }
.rd .shelf-q { color: var(--quiet); }
.rd .is-soon .shelf-shot { opacity: 0.82; }
.rd .c-ways { margin-top: 120px; }
.rd .pg-home .way-card h4 { font-size: 24px; font-weight: 700; font-stretch: 84%; line-height: 1.1; }

/* One balance for both products. */
.rd .credit-note { padding-top: 104px; }
.rd .credit-band { position: relative; }
.rd .credit-band::before,
.rd .credit-band::after {
  content: ""; position: absolute; left: var(--gutter); right: var(--gutter); height: 1px; background: var(--line-lit);
}
.rd .credit-band::before { top: 0; }
.rd .credit-band::after { bottom: 0; }
.rd .credit-note p {
  max-width: 38em; margin: 0 auto; padding: 18px 0; text-wrap: balance;
  text-align: center; font-size: 15.5px; line-height: 1.55; color: var(--muted);
}
.rd .credit-note .fig { color: var(--text); }
/* Footnotes keep a readable measure even where their column is wide. */
.rd .bench-scope,
.rd .bench-note,
.rd .bench-v2,
.rd .pipe figcaption,
.rd .pg-home .sono-cap,
.rd .pg-home .ways-note,
.rd .plans-src { max-width: 34em; }

/* Close: both free first steps, side by side. */
.rd .duo-close { padding-top: 112px; }
.rd .close-duo { margin-top: 36px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.rd .close-panel { display: flex; flex-direction: column; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-panel); padding: 30px 30px 26px; }
.rd .close-panel h3 { font-size: 27px; line-height: 1.12; font-weight: 720; font-stretch: 84%; letter-spacing: -0.008em; }
.rd .close-panel > p:not(.close-more) { margin-top: 12px; font-size: 15.5px; line-height: 1.6; color: var(--muted); max-width: 36em; }
.rd .close-panel .fig { color: var(--text); }
.rd .close-btns { margin-top: auto; padding-top: 26px; display: flex; flex-wrap: wrap; gap: 12px; }
.rd .close-more { margin-top: 16px; font-size: 13px; line-height: 1.5; color: var(--quiet); }

/* Home responsive */
@media (max-width: 1100px) {
  .rd .duo-grid { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; row-gap: 72px; }
  .rd .duo-col { grid-row: auto; display: flex; flex-direction: column; gap: 16px; }
  .rd .duo-clean::before { left: 0; right: 0; top: -36px; bottom: auto; width: auto; height: 1px; }
  .rd .result { height: auto; }
  .rd .duo-line { text-align: left; }
  .rd .block-name,
.rd .block-sub { grid-column: 1 / -1; }
  .rd .block-sub { margin-top: 14px; max-width: 40em; }
  .rd .d-how-text,
.rd .pipe,
.rd .d-bench-text,
.rd .bench,
.rd .d-batch-art,
.rd .d-batch-text { grid-column: 1 / -1; }
  .rd .d-how-text,
.rd .d-bench-text,
.rd .d-batch-text { max-width: 640px; }
  .rd .pipe,
.rd .bench { margin-top: 36px; }
  .rd .d-batch-text { order: -1; margin-bottom: 36px; }
  .rd .plan-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rd .plan-row > div:nth-child(4) { padding-left: 0; border-left: 0; }
  .rd .plan-row > div:nth-child(n+4) { border-top: 1px solid var(--line); }
  .rd .shelf-item { grid-template-columns: 240px minmax(0, 1fr) auto; row-gap: 6px; }
  .rd .shelf-shot { grid-row: span 2; }
  .rd .shelf-id { grid-column: 2; }
  .rd .shelf-fmt { grid-column: 2; grid-row: 2; }
  .rd .shelf-price { grid-column: 3; grid-row: 1 / span 2; }
  .rd .close-duo { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .rd .pipe-row { grid-template-columns: minmax(0, 1fr); }
  .rd .pipe-node { min-height: 0; padding: 16px 18px 16px; }
  .rd .pipe-node + .pipe-node { border-left: 0; border-top: 1px solid var(--line); }
  .rd .pipe-ar { left: 18px; top: -11px; transform: rotate(90deg); }
  .rd .pipe-node + .pipe-node .pn-t { padding-left: 0; padding-top: 4px; }
  .rd .pn-d { margin-top: 2px; }
}
@media (max-width: 640px) {
  .rd .duo { padding-top: 22px; }
  .rd .duo-h { font-size: min(36px, 8.4vw); line-height: 1.08; }
  .rd .duo-h span { display: block; }
  .rd .duo-grid { margin-top: 24px; row-gap: 64px; }
  .rd .duo-clean::before { top: -32px; }
  .rd .duo-head h2 { font-size: 26px; }
  .rd .duo-act { flex-direction: column; gap: 14px; }
  .rd .duo-act .cta { width: 100%; }
  .rd .duo-act .btn { width: 100%; }
  .rd .duo-tp .tp-foot { grid-template-columns: minmax(0, 1fr); }
  .rd .tp-more { justify-self: start; }
  .rd .duo-line { font-size: 14.5px; }
  .rd .block { padding-top: 112px; }
  .rd .block-name { font-size: 36px; }
  .rd .d-how,
.rd .c-listen { margin-top: 48px; }
  .rd .d-bench,
.rd .d-batch { margin-top: 88px; }
  .rd .bench { padding: 18px; }
  .rd .bench-row { grid-template-columns: minmax(0, 1fr); }
  .rd .bench-row > div,
.rd .bench-row > div:first-child { padding: 14px 0 12px; border-left: 0; border-bottom: 1px solid var(--line); }
  .rd .bench-row > div:last-child { border-bottom: 0; }
  .rd .bench-row .v { font-size: 28px; }
  .rd .api-fields { padding: 14px 16px 4px; }
  .rd .api-fields dl > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .rd .plans { margin-top: 72px; }
  .rd .plan-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rd .plan-row > div,
.rd .plan-row > div:nth-child(4) { padding: 14px 12px 16px 14px; border-left: 1px solid var(--line); }
  .rd .plan-row > div:nth-child(odd) { padding-left: 0; border-left: 0; }
  .rd .plan-row > div:nth-child(n+3) { border-top: 1px solid var(--line); }
  .rd .c-line,
.rd .c-ways { margin-top: 88px; }
  .rd .shelf-item { grid-template-columns: 128px minmax(0, 1fr); column-gap: 16px; row-gap: 4px; align-items: start; padding: 14px 0; }
  .rd .shelf-shot { grid-row: span 3; }
  .rd .shelf-id,
.rd .shelf-fmt,
.rd .shelf-price { grid-column: 2; grid-row: auto; }
  .rd .shelf-price { justify-self: start; text-align: left; }
  .rd .shelf-id h4 { font-size: 21px; }
  .rd .shelf-id p { font-size: 14px; }
  .rd .shelf-fmt { font-size: 13px; }
  .rd .credit-note { padding-top: 80px; }
  .rd .credit-note p { text-align: left; font-size: 15px; }
  .rd .duo-close { padding-top: 88px; }
  .rd .close-panel { padding: 22px 18px 20px; }
  .rd .close-panel h3 { font-size: 24px; }
  .rd .close-btns { flex-direction: column; }
  .rd .close-btns .btn { width: 100%; }
}

/* Benchmark: the later protocol, kept visibly separate from v1.1. */
.rd .bench-v2 { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--line-lit); font-size: 13px; line-height: 1.55; color: var(--muted); }
.rd .bench-v2 b { color: var(--text); font-weight: 600; }
.rd .bench-v2 .mono { font-size: 12px; color: var(--text); }

/* Published research, as a list of real links. */
.rd .d-papers { margin-top: 112px; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: start; }
.rd .d-papers-text { grid-column: 1 / span 4; }
.rd .papers { grid-column: 5 / span 8; border-top: 1px solid var(--line-lit); }
.rd .papers li { border-bottom: 1px solid var(--line); }
.rd .papers li a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 20px; align-items: baseline; padding: 15px 0; }
.rd .papers .r-title { font-size: 16px; line-height: 1.4; color: var(--text); }
.rd .papers .r-id { font-family: var(--mono); font-size: 12.5px; color: var(--muted); white-space: nowrap; }
.rd .papers .r-sub { grid-column: 1 / -1; font-size: 13.5px; color: var(--quiet); }
.rd .papers li a:hover .r-title { text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 0.24em; }
@media (max-width: 1100px) {
  .rd .d-papers-text,
.rd .papers { grid-column: 1 / -1; }
  .rd .d-papers-text { max-width: 640px; }
  .rd .papers { margin-top: 32px; }
}
@media (max-width: 640px) {
  .rd .d-papers { margin-top: 88px; }
  .rd .papers li a { grid-template-columns: minmax(0, 1fr); }
}

/* Short desktop viewports (1280x800, 1366x768): both primary actions stay above the fold.
   Scoped to the two-column layout so phones (390x844) are untouched. */
@media (min-width: 1101px) and (max-height: 860px) {
  .rd .duo { padding-top: 10px; }
  .rd .duo-h { font-size: 42px; }
  .rd .duo-grid { row-gap: 10px; }
  .rd .duo-head h2 { font-size: 27px; }
  .rd .duo-head p { margin-top: 2px; font-size: 15px; }
  .rd .duo-proof { gap: 8px; }
  .rd .window-detail img { max-height: max(240px, calc(100vh - 492px)); }
  .rd .duo-tp .tp-main { padding: 8px 12px; flex-wrap: nowrap; gap: 12px; }
  .rd .duo-tp .tp-time { flex: 1 1 0; order: 0; }
  .rd .duo-tp .seg button { height: 42px; width: 94px; }
  .rd .duo-tp .track-name { display: none; }
  .rd .duo-tp .tp-foot { padding: 7px 12px 8px; }
  .rd .rs { padding: 12px 16px; }
  .rd .rs-main { gap: 10px; }
  .rd .rs-prob .num { font-size: 42px; }
  .rd .segs-row { min-height: 32px; }
  .rd .rs-alt { grid-template-areas: "clip verdict prob"; padding-top: 10px; padding-bottom: 11px; }
  .rd .rs-alt .pmeter-sm,
.rd .rs-alt .segs-mini { display: none; }
  .rd .result-foot { padding: 10px 16px 11px; }
  .rd .duo-act .btn { height: 48px; }
  .rd .duo-act .cta { gap: 5px; }
  .rd .duo-act .note { font-size: 12px; }
  .rd .duo-line { margin-top: 6px; padding-top: 6px; font-size: 14.5px; }
}

@media (max-width: 700px) {
  .rd .duo-jump { margin-top: 18px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .rd .duo-jump a {
    display: flex; flex-direction: column; justify-content: center; min-height: 52px; padding: 7px 12px;
    border: 1px solid var(--line-strong); border-radius: var(--r-ctl);
    font-size: 15px; font-weight: 650; line-height: 1.25; color: var(--text);
  }
  .rd .duo-jump a span { font-size: 13px; font-weight: 400; color: var(--muted); }
  .rd .duo-jump a:hover { border-color: var(--text); }
}
@media (max-width: 640px) {
  .rd .duo-grid { margin-top: 32px; }
  .rd .result-bar { padding: 9px 14px; }
  .rd .result-title { font-size: 13.5px; }
  .rd .rs { padding: 14px; }
  .rd .rs-main { gap: 12px; }
  .rd .rs-clip { font-size: 14.5px; }
  .rd .rs-clip-q { display: none; }
  .rd .rs-prob .num { font-size: 40px; }
  .rd .segs-row { min-height: 52px; flex: none; }
  .rd .rs-alt { grid-template-areas: "clip verdict prob"; padding-top: 12px; padding-bottom: 12px; }
  .rd .rs-alt .pmeter-sm,
.rd .rs-alt .segs-mini { display: none; }
  .rd .rs-prob-sm { font-size: 17px; min-width: 0; }
  .rd .result-foot { padding: 11px 14px 12px; }
  .rd .result-evidence { font-size: 13.5px; }
  .rd .wc-more { display: none; }
  .rd .window-cap { left: 8px; top: 8px; }
}
