/* ============================================================
   Legacy → v3 bridge
   Harmonises still-on-v2 page bodies (vs-*, deep use-cases,
   tutorial details) with the v3 shell: v3 type, v3 orange
   accent, comfortable spacing under the sticky v3 header.
   Loaded AFTER front.full.min.css so these rules win.
   ============================================================ */

/* ---- type: pull legacy bodies onto Inter ---- */
.uj-legacy-main,
.uj-legacy-main p,
.uj-legacy-main li,
.uj-legacy-main a,
.uj-legacy-main span,
.uj-legacy-main div,
.uj-legacy-main td,
.uj-legacy-main th,
.uj-legacy-main h1,
.uj-legacy-main h2,
.uj-legacy-main h3,
.uj-legacy-main h4,
.uj-legacy-main h5,
.uj-legacy-main button,
.uj-legacy-main input,
.uj-legacy-main label {
  font-family: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif;
}
.uj-legacy-main code,
.uj-legacy-main pre,
.uj-legacy-main .mono {
  font-family: "JetBrains Mono", "Geist Mono", ui-monospace, monospace;
}

/* ---- spacing: legacy body sits flush under the v3 header ---- */
.uj-legacy-main { display: block; }
.uj-legacy-main > :first-child { margin-top: 0; }

/* ---- accent harmonisation: v2 salmon / blue → v3 orange ---- */
/* v2 primary CTA buttons. NOTE: .get-started-btn is a *wrapper* div (button +
   sub-text) — never give it a background; its .btn is styled in use-cases.css. */
.uj-legacy-main .btn-primary,
.uj-legacy-main .primary-btn,
.uj-legacy-main .cta-button,
.uj-legacy-main .submitBtn,
.uj-legacy-main button.primary {
  background: var(--uj-accent) !important;
  border-color: var(--uj-accent) !important;
  color: #fff !important;
  border-radius: 8px !important;
}
.uj-legacy-main .btn-primary:hover,
.uj-legacy-main .primary-btn:hover,
.uj-legacy-main .cta-button:hover,
.uj-legacy-main .submitBtn:hover {
  background: var(--uj-accent2) !important;
  border-color: var(--uj-accent2) !important;
}
/* links + inline accents */
.uj-legacy-main a:hover { color: var(--uj-accent); }
.uj-legacy-main .winner-section,
.uj-legacy-main .cta-section { background: var(--uj-ink) !important; color: #fff; }

/* ---- card surfaces: v3 rounding + border on common legacy cards ---- */
.uj-legacy-main .stat-card,
.uj-legacy-main .feature-card,
.uj-legacy-main .challenge-card,
.uj-legacy-main .use-case-detailed-card,
.uj-legacy-main .pros-cons-card,
.uj-legacy-main .comparison-card,
.uj-legacy-main .related-card,
.uj-legacy-main .tutorial-card {
  border-radius: 14px !important;
  border: 1px solid var(--uj-line) !important;
  box-shadow: 0 1px 2px rgba(15,23,42,0.04) !important;
}

/* ---- section headers ---- */
.uj-legacy-main .section-header h2,
.uj-legacy-main .section-title {
  letter-spacing: -0.02em;
}

/* keep the v2 inner banner / hero from colliding with the sticky header */
.uj-legacy-main .innerBn { margin-top: 0; }