/* Design kit for the supporting pages (Leo, 2026-10-22). Loaded only on pages with body class "theme-ds"
   (templates/head.js); markup from templates/blocks.js. The home-b language: dark navy bands, orange labels,
   large sans headings, framed visuals, generous negative space. Light "paper" bands carry tables and the FAQ
   so long reading stays comfortable. */

.theme-ds { background: var(--navy-900); color: #fff; }
.theme-ds main { overflow-x: clip; }
.theme-ds h1, .theme-ds h2, .theme-ds h3 { font-family: var(--font-sans); letter-spacing: -.025em; }
.theme-ds main a:not([class]) { color: #fff; text-decoration-color: rgba(255, 102, 0, .6); }
.theme-ds main a:not([class]):hover { color: var(--orange-400); }

/* ---------- labels and buttons ---------- */
.ds-label { display: inline-flex; gap: 6px; margin: 0 0 16px; font-size: .74rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--orange-500); }
.ds-hook { font-weight: 700; }
.ds-btns { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.ds-btns.ds-center { justify-content: center; }
.ds-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 24px; border-radius: 999px; font-weight: 600; font-size: .95rem; text-decoration: none; transition: background .2s, color .2s, transform .2s; }
.ds-btn-solid { background: #fff; color: var(--slate-900) !important; }
.ds-btn-solid:hover { background: var(--orange-500); color: #fff !important; }
.ds-btn-line { border: 1px solid rgba(255, 255, 255, .45); color: #fff !important; }
.ds-btn-line:hover { background: rgba(255, 255, 255, .1); }
.ds-light .ds-btn-solid { background: var(--navy-900); color: #fff !important; }
.ds-light .ds-btn-line { border-color: var(--slate-300, #cbd5e1); color: var(--slate-900) !important; }
/* Older components (h.btn, h.demoBtn) used inside the kit. */
.theme-ds .btn-light { background: #fff; color: var(--slate-900); }
.theme-ds .btn-ghost { border-color: rgba(255, 255, 255, .45); color: #fff; }
@media (prefers-reduced-motion: no-preference) { .ds-btn:hover { transform: translateY(-1px); } }

/* ---------- hero ---------- */
.ds-hero { position: relative; padding: 150px 0 72px; background:
  radial-gradient(900px 480px at 85% 10%, rgba(42, 74, 115, .55), transparent 70%),
  radial-gradient(700px 360px at 10% 110%, rgba(255, 102, 0, .14), transparent 70%),
  repeating-linear-gradient(90deg, rgba(143, 165, 189, .045) 0 1px, transparent 1px 64px),
  var(--navy-900); border-bottom: 1px solid rgba(255, 255, 255, .06); }
.ds-hero-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 64px; align-items: center; }
.ds-hero-solo { grid-template-columns: minmax(0, 860px); }
.ds-hero .breadcrumbs { margin-bottom: 26px; }
.ds-hero .breadcrumbs a, .ds-hero .breadcrumbs span { color: var(--navy-100); text-decoration: none; }
.ds-hero .breadcrumbs a:hover { color: #fff; }
.ds-hero h1 { font-size: clamp(2.4rem, 4.8vw, 3.9rem); line-height: 1.05; font-weight: 600; margin: 0 0 24px; color: #fff; max-width: 18ch; }
.ds-hero-lede { color: var(--navy-50); font-size: 1.08rem; line-height: 1.7; max-width: 640px; }
.ds-hero-lede p { margin: 0 0 14px; }
.ds-promise { margin: 18px 0 0; font-size: 1.15rem; font-weight: 600; color: #fff; }
.ds-hero .last-updated { margin: 22px 0 0; font-size: .82rem; color: var(--navy-100); }
.ds-hero-media { position: relative; }
.ds-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 0; margin: 64px 0 0; padding: 28px 0 0; border-top: 1px solid rgba(255, 255, 255, .1); }
.ds-stats > div { padding: 0 24px; border-left: 1px solid rgba(255, 255, 255, .1); }
.ds-stats > div:first-child { border-left: 0; padding-left: 0; }
.ds-stats dt { font-size: .8rem; color: var(--navy-100); margin: 0 0 6px; }
.ds-stats dd { margin: 0; font-size: clamp(1.4rem, 2.4vw, 2rem); font-weight: 600; letter-spacing: -.02em; color: #fff; }

/* ---------- jump nav ---------- */
.ds-jump { position: sticky; top: 0; z-index: 40; background: rgba(4, 10, 23, .88); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid rgba(255, 255, 255, .08); }
.ds-jump .container { display: flex; align-items: center; gap: 16px; padding-top: 12px; padding-bottom: 12px; overflow-x: auto; }
.ds-jump-title { flex: none; font-size: .74rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--orange-500); }
.ds-jump ul { list-style: none; display: flex; gap: 6px; margin: 0; padding: 0; }
.ds-jump a { display: block; white-space: nowrap; padding: 6px 14px; border-radius: 999px; font-size: .88rem; color: var(--navy-50) !important; text-decoration: none; border: 1px solid rgba(255, 255, 255, .1); }
.ds-jump a:hover { border-color: var(--orange-500); color: #fff !important; }
.theme-ds [id] { scroll-margin-top: 72px; }

/* ---------- bands and headings ---------- */
.ds-band { padding: 112px 0; }
.ds-dark { background: var(--navy-900); }
.ds-deep { background: repeating-linear-gradient(90deg, rgba(143, 165, 189, .05) 0 1px, transparent 1px 14px), var(--navy-800); border-top: 1px solid rgba(255, 255, 255, .05); border-bottom: 1px solid rgba(255, 255, 255, .05); }
.ds-light { background: #f4f6fa; color: var(--slate-900); }
.ds-light h2, .ds-light h3 { color: var(--slate-900); }
.ds-light .ds-lead, .ds-light p { color: var(--slate-700); }
.ds-light a:not([class]) { color: var(--navy-500) !important; }
.ds-band + .ds-band.ds-dark, .ds-dark + .ds-dark { border-top: 1px solid rgba(255, 255, 255, .06); }
.ds-narrow { max-width: 860px; }
.ds-head { max-width: 780px; margin: 0 0 56px; }
.ds-head.ds-center, .ds-center { margin-left: auto; margin-right: auto; text-align: center; }
.ds-head h2, .ds-feature h2, .ds-faq-grid h2, .ds-cta h2 { font-size: clamp(1.9rem, 3.4vw, 2.75rem); line-height: 1.1; font-weight: 600; margin: 0 0 18px; }
.ds-lead { color: var(--navy-50); font-size: 1.08rem; line-height: 1.7; }
.ds-lead p { margin: 0 0 14px; }
.ds-lead p:last-child { margin-bottom: 0; }

/* ---------- feature rows ---------- */
.ds-feature { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); gap: 80px; align-items: center; }
.ds-reverse .ds-feature-copy { order: 2; }
.ds-feature-copy { max-width: 560px; }
.ds-points { list-style: none; margin: 28px 0 0; padding: 0; display: grid; gap: 16px; }
.ds-points li { display: grid; grid-template-columns: 36px 1fr; gap: 14px; align-items: start; color: var(--navy-50); line-height: 1.6; }
.ds-points strong { color: #fff; font-weight: 600; }
.ds-light .ds-points li { color: var(--slate-700); }
.ds-light .ds-points strong { color: var(--slate-900); }
.ds-pt-icon { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 10px; background: rgba(255, 102, 0, .12); color: var(--orange-500); }
.ds-feature-media { position: relative; }
.ds-feature-media::before { content: ""; position: absolute; inset: 8% 4% -6% 8%; background: radial-gradient(closest-side, rgba(255, 102, 0, .16), transparent); filter: blur(30px); z-index: 0; }
.ds-feature-media > * { position: relative; z-index: 1; }

/* ---------- media ---------- */
.ds-window { border-radius: 14px; overflow: hidden; background: #fff; box-shadow: 0 40px 80px -24px rgba(0, 0, 0, .7), 0 0 0 1px rgba(255, 255, 255, .08); }
.ds-window .ds-dots { display: flex; gap: 6px; padding: 10px 14px; background: #e9edf3; }
.ds-window .ds-dots i { width: 10px; height: 10px; border-radius: 50%; background: #c3cbd6; }
.ds-window img { display: block; width: 100%; height: auto; }
.ds-tilt { transform: perspective(1400px) rotateY(-8deg) rotateX(3deg); }
.ds-reverse .ds-tilt { transform: perspective(1400px) rotateY(8deg) rotateX(3deg); }
.ds-video { margin: 0; }
.ds-video video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border: 3px solid var(--orange-500); border-radius: 16px; background: #0b1220; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .7), 0 0 0 6px rgba(255, 102, 0, .12); }
.ds-art { display: block; width: 100%; height: auto; border-radius: 18px; border: 1px solid rgba(255, 255, 255, .08); }

/* ---------- vignettes (skeleton product UI) ---------- */
.ds-vig { border-radius: 18px; padding: 22px; background: linear-gradient(180deg, #0d1c35 0%, #0a1629 100%); border: 1px solid rgba(255, 255, 255, .09); box-shadow: 0 30px 60px -24px rgba(0, 0, 0, .7); color: var(--navy-50); font-size: .86rem; }
.ds-vig svg { flex: none; }
.vg-title { display: flex; align-items: center; gap: 8px; margin: 0 0 16px; font-weight: 600; color: #fff; }
.vg-title svg { color: var(--orange-500); }
.vg-bar { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 12px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 102, 0, .5); color: #fff; }
.vg-bar svg { color: var(--orange-500); }
.vg-chips, .ds-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; padding: 0; list-style: none; }
.vg-chips span { padding: 4px 10px; border-radius: 999px; font-size: .76rem; background: rgba(255, 102, 0, .14); color: #ffb37a; border: 1px solid rgba(255, 102, 0, .3); }
.vg-rows { display: grid; gap: 10px; margin-top: 6px; }
.vg-row { display: grid; grid-template-columns: 28px 1fr 54px; gap: 12px; align-items: center; padding: 10px 12px; border-radius: 10px; background: rgba(255, 255, 255, .035); }
.vg-row b { width: 28px; height: 28px; border-radius: 8px; background: rgba(43, 90, 155, .45); }
.vg-row i, .vg-td i, .vg-kv i, .vg-a i { display: block; height: 8px; width: var(--w, 60%); border-radius: 999px; background: rgba(197, 212, 228, .28); }
.vg-row em { height: 8px; border-radius: 999px; background: rgba(255, 102, 0, .55); }
.vg-item { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 10px; background: rgba(255, 255, 255, .04); margin-bottom: 8px; color: #fff; }
.vg-badge { font-style: normal; font-size: .72rem; font-weight: 600; padding: 3px 9px; border-radius: 999px; background: rgba(15, 143, 124, .2); color: #5fd3c0; }
.vg-grid { display: grid; grid-template-columns: repeat(var(--cols), minmax(0, 1fr)); gap: 6px; }
.vg-th { font-size: .72rem; font-weight: 600; color: #fff; padding: 6px 8px; border-bottom: 1px solid rgba(255, 255, 255, .12); }
.vg-td { padding: 9px 8px; border-radius: 6px; background: rgba(255, 255, 255, .03); }
.vg-td:nth-child(4n+5) i { background: rgba(255, 102, 0, .5); }
.vg-note { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border-radius: 12px; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .06); margin-bottom: 10px; }
.vg-note svg { color: var(--navy-100); margin-top: 2px; }
.vg-note.is-new { border-color: rgba(255, 102, 0, .5); background: rgba(255, 102, 0, .08); }
.vg-note.is-new svg { color: var(--orange-500); }
.vg-note strong { display: block; color: #fff; font-weight: 600; }
.vg-note span { font-size: .8rem; color: var(--navy-100); }
.vg-record { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 12px; background: rgba(43, 90, 155, .25); color: #fff; margin-bottom: 14px; }
.vg-files { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px; }
.vg-file { display: flex; flex-direction: column; gap: 10px; padding: 16px 14px; border-radius: 12px; background: rgba(255, 255, 255, .05); border: 1px dashed rgba(255, 255, 255, .18); color: #fff; }
.vg-file svg { color: var(--orange-500); }
.vg-spark { display: block; width: 100%; height: 56px; margin: 0 0 14px; }
.vg-kv { display: grid; grid-template-columns: 120px 1fr; gap: 12px; align-items: center; padding: 8px 0; border-top: 1px solid rgba(255, 255, 255, .06); }
.vg-q { margin-left: auto; max-width: 85%; padding: 12px 16px; border-radius: 16px 16px 4px 16px; background: rgba(255, 102, 0, .16); color: #fff; margin-bottom: 14px; }
.vg-a { display: flex; gap: 12px; padding: 14px 16px; border-radius: 16px 16px 16px 4px; background: rgba(255, 255, 255, .05); max-width: 90%; }
.vg-a svg { color: var(--orange-500); }
.vg-a > div { flex: 1; display: grid; gap: 8px; padding-top: 4px; }
.vg-src { display: inline-flex; align-items: center; gap: 6px; margin-top: 14px; padding: 6px 12px; border-radius: 999px; background: rgba(43, 90, 155, .3); font-size: .76rem; color: #c5d4e4; }
.vg-folder { display: grid; grid-template-columns: 22px 1fr 60px; gap: 10px; align-items: center; padding: 11px 12px; border-radius: 10px; background: rgba(255, 255, 255, .04); margin-bottom: 8px; color: #fff; font-family: var(--font-display); font-size: .8rem; }
.vg-folder svg { color: var(--orange-500); }
.vg-folder em { height: 8px; border-radius: 999px; background: rgba(197, 212, 228, .25); }

/* ---------- bento, tiles, steps, chips ---------- */
.ds-bento { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: minmax(220px, auto); gap: 18px; }
.ds-bento-item { display: flex; flex-direction: column; justify-content: flex-end; gap: 18px; padding: 26px; border-radius: 20px; background: rgba(15, 32, 59, .6); border: 1px solid rgba(255, 255, 255, .08); color: #fff; text-decoration: none; overflow: hidden; transition: border-color .2s, transform .25s; }
a.ds-bento-item:hover { border-color: rgba(255, 102, 0, .55); color: #fff; }
.ds-bento-item.ds-wide { grid-column: span 2; }
.ds-bento-item.ds-tall { grid-row: span 2; }
.ds-bento-visual { flex: 1; display: flex; align-items: center; }
.ds-bento-visual > * { width: 100%; }
.ds-bento-icon { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(255, 102, 0, .12); color: var(--orange-500); margin-bottom: 14px; }
.ds-bento-text h3 { font-size: 1.2rem; margin: 0 0 8px; color: #fff; }
.ds-bento-text p { margin: 0; color: var(--navy-100); font-size: .95rem; line-height: 1.6; }
.ds-more { display: inline-block; margin-top: 14px; font-weight: 600; font-size: .9rem; color: #fff; }
a.ds-bento-item:hover .ds-more { color: var(--orange-400); }
.ds-tiles { display: grid; gap: 14px; }
.ds-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ds-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ds-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ds-tile { padding: 24px; border-radius: 16px; background: rgba(15, 32, 59, .55); border: 1px solid rgba(255, 255, 255, .07); }
.ds-tile-icon { display: inline-flex; color: var(--orange-500); margin-bottom: 14px; }
.ds-tile h3 { font-size: 1.02rem; margin: 0 0 8px; color: #fff; }
.ds-tile p { margin: 0; color: var(--navy-100); font-size: .92rem; line-height: 1.6; }
.ds-light .ds-tile, .ds-light .ds-bento-item { background: #fff; border-color: #e2e8f0; }
.ds-light .ds-tile h3, .ds-light .ds-bento-text h3 { color: var(--slate-900); }
.ds-light .ds-tile p, .ds-light .ds-bento-text p { color: var(--slate-600, #475569); }
.ds-steps { list-style: none; counter-reset: s; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; margin: 0; padding: 0; }
.ds-steps li { position: relative; padding: 28px 26px; border-radius: 18px; background: rgba(15, 32, 59, .55); border: 1px solid rgba(255, 255, 255, .08); }
.ds-steps li::after { content: ""; position: absolute; top: 46px; right: -18px; width: 18px; height: 1px; background: rgba(255, 102, 0, .5); }
.ds-steps li:last-child::after { display: none; }
.ds-step-n { display: inline-block; font-family: var(--font-display); font-size: .9rem; font-weight: 600; color: var(--orange-500); padding: 6px 10px; border-radius: 8px; background: rgba(255, 102, 0, .12); margin-bottom: 16px; }
.ds-steps h3 { font-size: 1.12rem; margin: 0 0 10px; color: #fff; }
.ds-steps p { margin: 0 0 10px; color: var(--navy-50); line-height: 1.65; }
.ds-light .ds-steps li { background: #fff; border-color: #e2e8f0; }
.ds-light .ds-steps h3 { color: var(--slate-900); }
.ds-light .ds-steps p { color: var(--slate-700); }
.ds-chips li { padding: 6px 12px; border-radius: 999px; font-size: .84rem; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12); color: var(--navy-50); }
.ds-chips .ds-chip-more { background: var(--orange-500); border-color: var(--orange-500); color: #fff; font-weight: 600; }
.ds-light .ds-chips li { background: #fff; border-color: #dbe3ee; color: var(--slate-700); }
.ds-light .ds-chips .ds-chip-more { background: var(--navy-900); border-color: var(--navy-900); color: #fff; }
.ds-callout { margin: 32px 0 0; padding: 4px 0 4px 22px; border-left: 3px solid var(--orange-500); font-size: 1.2rem; line-height: 1.5; font-weight: 500; color: #fff; }
.ds-light .ds-callout { color: var(--slate-900); }

/* ---------- tables in the kit ---------- */
.ds-table .table-wrap { border-radius: 16px; overflow: hidden; border: 1px solid rgba(255, 255, 255, .1); background: rgba(15, 32, 59, .5); }
.ds-table table { width: 100%; border-collapse: collapse; color: var(--navy-50); }
.ds-table caption { text-align: left; padding: 16px 20px; font-weight: 600; color: #fff; caption-side: top; }
.ds-table th, .ds-table td { padding: 14px 20px; border-top: 1px solid rgba(255, 255, 255, .07); text-align: left; vertical-align: top; }
.ds-table thead th { font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; color: var(--navy-100); background: rgba(255, 255, 255, .03); }
.ds-table tbody th { color: #fff; font-weight: 600; }
.ds-light .ds-table .table-wrap { background: #fff; border-color: #e2e8f0; }
.ds-light .ds-table table { color: var(--slate-700); }
.ds-light .ds-table caption, .ds-light .ds-table tbody th { color: var(--slate-900); }
.ds-light .ds-table th, .ds-light .ds-table td { border-top-color: #edf1f6; }
.ds-light .ds-table thead th { background: #f8fafc; color: var(--slate-500, #64748b); }

/* ---------- charts ---------- */
.ds-chart { margin: 0; padding: 24px; border-radius: 18px; background: rgba(15, 32, 59, .55); border: 1px solid rgba(255, 255, 255, .08); }
.ds-chart figcaption { font-weight: 600; color: #fff; margin: 0 0 18px; }
.ds-hbars { display: grid; gap: 12px; }
.hb-row { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 2fr) auto; gap: 14px; align-items: center; font-size: .9rem; }
.hb-label { color: var(--navy-50); }
.hb-track { height: 10px; border-radius: 999px; background: rgba(255, 255, 255, .06); overflow: hidden; }
.hb-track i { display: block; height: 100%; border-radius: 999px; }
.hb-val { font-weight: 600; color: #fff; font-variant-numeric: tabular-nums; }
.ds-cols { display: block; width: 100%; height: auto; }
.ds-cols text { fill: var(--navy-100); font-size: 11px; font-family: var(--font-sans); }
.ds-legend { display: flex; flex-wrap: wrap; gap: 16px; margin: 12px 0 0; font-size: .82rem; color: var(--navy-100); }
.ds-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; vertical-align: middle; }
.ds-chart-note { margin: 12px 0 0; font-size: .8rem; color: var(--navy-100); }
.ds-light .ds-chart { background: #fff; border-color: #e2e8f0; }
.ds-light .ds-chart figcaption, .ds-light .hb-val { color: var(--slate-900); }
.ds-light .hb-label, .ds-light .ds-legend, .ds-light .ds-chart-note { color: var(--slate-600, #475569); }
.ds-light .hb-track { background: #eef2f7; }
.ds-light .ds-cols text { fill: #64748b; }

/* ---------- FAQ, links, CTA ---------- */
.ds-faq-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.8fr); gap: 72px; align-items: start; }
.ds-faq-grid > div:first-child { position: sticky; top: 90px; }
.ds-faq details { border-bottom: 1px solid #dfe5ee; }
.ds-faq details:first-child { border-top: 1px solid #dfe5ee; }
.ds-faq summary { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 22px 0; cursor: pointer; list-style: none; }
.ds-faq summary::-webkit-details-marker { display: none; }
.ds-faq summary::after { content: "+"; flex: none; display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; border: 1px solid #cbd5e1; color: var(--orange-600); font-size: 1.2rem; transition: transform .2s; }
.ds-faq details[open] summary::after { transform: rotate(45deg); }
.ds-faq summary h3 { margin: 0; font-size: 1.06rem; font-weight: 600; color: var(--slate-900); letter-spacing: -.01em; }
.ds-faq details p { margin: 0 0 22px; color: var(--slate-700); line-height: 1.7; max-width: 680px; }
.ds-links { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; margin: 0; padding: 0; }
.ds-links a { display: flex; justify-content: space-between; align-items: center; gap: 12px; height: 100%; padding: 18px 20px; border-radius: 14px; background: rgba(15, 32, 59, .55); border: 1px solid rgba(255, 255, 255, .08); color: #fff; text-decoration: none; font-weight: 500; transition: border-color .2s; }
.ds-links a svg { color: var(--orange-500); flex: none; transition: transform .2s; }
.ds-links a:hover { border-color: rgba(255, 102, 0, .55); }
.ds-links a:hover svg { transform: translateX(3px); }
.ds-cta { overflow: hidden; padding: 140px 0 260px; background: linear-gradient(180deg, var(--navy-900) 0%, rgba(4, 10, 23, 0) 40%), url("../img/b/cta-harbor.svg") center bottom / max(100%, 1500px) auto no-repeat, var(--navy-900); }
.ds-cta .container { max-width: 900px; }
.ds-cta-text { color: var(--navy-50); font-size: 1.12rem; line-height: 1.7; margin: 0 auto; max-width: 720px; }
.ds-cta .ds-btn-line { background: rgba(4, 10, 23, .55); backdrop-filter: blur(6px); }

/* Content from older builders placed inside the kit (prose, check lists, product boxes). */
.theme-ds .check-list li { color: var(--navy-50); }
.ds-light .check-list li { color: var(--slate-700); }
.theme-ds .product-cta { background: rgba(15, 32, 59, .6); border: 1px solid rgba(255, 255, 255, .1); color: #fff; }
.theme-ds .product-cta p { color: var(--navy-50); }

/* ---------- responsive ---------- */
@media (max-width: 1080px) {
  .ds-hero-grid, .ds-feature, .ds-faq-grid { grid-template-columns: minmax(0, 1fr); gap: 48px; }
  .ds-reverse .ds-feature-copy { order: 0; }
  .ds-feature-copy { max-width: none; }
  .ds-faq-grid > div:first-child { position: static; }
  .ds-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ds-cols-3, .ds-cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ds-tilt, .ds-reverse .ds-tilt { transform: none; }
}
@media (max-width: 640px) {
  .ds-hero { padding: 130px 0 56px; }
  .ds-band { padding: 72px 0; }
  .ds-bento, .ds-cols-2, .ds-cols-3, .ds-cols-4 { grid-template-columns: minmax(0, 1fr); }
  .ds-bento-item.ds-wide { grid-column: auto; }
  .ds-bento-item.ds-tall { grid-row: auto; }
  .ds-stats > div { padding: 0 0 16px; border-left: 0; }
  .ds-steps li::after { display: none; }
  .hb-row { grid-template-columns: minmax(0, 1fr) auto; }
  .hb-track { grid-column: 1 / -1; grid-row: 2; }
  .ds-cta { padding: 96px 0 180px; }
}

/* fixes after the Atlas pilot (2026-10-22) */
.ds-table th, .ds-table td { border-bottom: 0; }
.ds-table tbody tr:first-child th, .ds-table tbody tr:first-child td { border-top-color: rgba(255, 255, 255, .1); }
.ds-bento-item:not(:has(.ds-bento-visual)) { justify-content: flex-start; }
.ds-chips a { text-decoration: none; color: inherit !important; }
.ds-chips li:has(a):hover { border-color: var(--orange-500); }

/* ---- Products pages (agent) ---- */
/* /files/, /es/files/, /mcp/, /es/atlas/, /fr/atlas/ (2026-10-22). Components from src/pages/_lib/ds-extra-products.js. */
.dsx-gap { margin-top: 72px; }
.dsx-gap-s { margin-top: 16px; }
.dsx-top { align-items: start; }
.dsx-video { max-width: 960px; margin: 72px auto 0; }
.dsx-cta-tile { margin-top: 28px; }
.dsx-cta-tile .ds-btns { margin-top: 18px; }
.dsx-two { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 32px; align-items: start; margin-top: 56px; }

/* flow: nodes joined by arrows */
.dsx-flow { display: flex; align-items: stretch; gap: 0; }
.dsx-node { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 6px; padding: 20px 18px; border-radius: 16px; background: linear-gradient(180deg, #0d1c35 0%, #0a1629 100%); border: 1px solid rgba(255, 255, 255, .1); box-shadow: 0 24px 48px -24px rgba(0, 0, 0, .7); }
.dsx-node strong { color: #fff; font-weight: 600; font-size: .98rem; line-height: 1.3; }
.dsx-node small { color: var(--navy-100); font-size: .8rem; line-height: 1.45; }
.dsx-node-icon { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 12px; background: rgba(43, 90, 155, .35); color: #c5d4e4; margin-bottom: 6px; }
.dsx-node.is-hot { border-color: rgba(255, 102, 0, .6); background: linear-gradient(180deg, rgba(255, 102, 0, .14) 0%, #0a1629 100%); }
.dsx-node.is-hot .dsx-node-icon { background: rgba(255, 102, 0, .18); color: var(--orange-500); }
.dsx-arrow { flex: 0 0 36px; display: flex; align-items: center; justify-content: center; }
.dsx-arrow i { position: relative; display: block; width: 100%; height: 2px; background: linear-gradient(90deg, rgba(255, 102, 0, .2), rgba(255, 102, 0, .8)); }
.dsx-arrow i::after { content: ""; position: absolute; right: -1px; top: -4px; border: 5px solid transparent; border-left: 7px solid rgba(255, 102, 0, .9); border-right: 0; }
.dsx-flow-v { flex-direction: column; max-width: 420px; margin: 0 auto; }
.dsx-flow-v .dsx-node { flex: none; flex-direction: row; align-items: center; flex-wrap: wrap; column-gap: 14px; row-gap: 2px; }
.dsx-flow-v .dsx-node-icon { margin: 0; grid-row: span 2; }
.dsx-flow-v .dsx-node strong { flex: 1 1 60%; }
.dsx-flow-v .dsx-node small { flex: 0 0 100%; padding-left: 54px; }
.dsx-flow-v .dsx-arrow { flex: 0 0 40px; }
.dsx-flow-v .dsx-arrow i { width: 2px; height: 100%; background: linear-gradient(180deg, rgba(255, 102, 0, .2), rgba(255, 102, 0, .8)); }
.dsx-flow-v .dsx-arrow i::after { right: -4px; top: auto; bottom: -1px; border: 5px solid transparent; border-top: 7px solid rgba(255, 102, 0, .9); border-bottom: 0; }
.ds-band .ds-head + .dsx-flow { margin-top: -8px; }

/* fan-out: one source to many destinations */
.dsx-fan { display: grid; grid-template-columns: minmax(0, 190px) minmax(40px, 1fr) minmax(0, 230px); align-items: center; }
.dsx-fan-lines { width: 100%; height: 100%; overflow: visible; }
.dsx-fan-lines path { fill: none; stroke: rgba(255, 102, 0, .45); stroke-width: 1.4; vector-effect: non-scaling-stroke; }
.dsx-fan ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.dsx-fan li { display: flex; align-items: center; gap: 10px; padding: 11px 14px; border-radius: 12px; background: rgba(255, 255, 255, .045); border: 1px solid rgba(255, 255, 255, .09); color: #fff; font-size: .88rem; }
.dsx-fan li svg { color: var(--orange-500); flex: none; }

/* JSON skeleton */
.dsx-code pre { margin: 0; padding: 16px; border-radius: 12px; background: rgba(0, 0, 0, .28); font-family: var(--font-display, ui-monospace, monospace); font-size: .84rem; line-height: 1.9; color: var(--navy-100); white-space: pre; overflow: hidden; }
.dsx-code .dsx-k { color: #ffb37a; }
.dsx-code .dsx-p { color: var(--navy-100); }
.dsx-code pre i { display: inline-block; vertical-align: middle; height: 8px; width: calc(var(--w, 50%) * 2.2); max-width: 46%; border-radius: 999px; background: rgba(197, 212, 228, .28); }

/* stacked rows inside one band */
.dsx-rows { display: grid; gap: 96px; }
.dsx-row h3 { font-size: clamp(1.35rem, 2.2vw, 1.75rem); line-height: 1.2; font-weight: 600; margin: 0 0 16px; color: #fff; }
.dsx-row .ds-step-n { margin-bottom: 18px; }

/* scene image cropped in a frame */
.dsx-scene { overflow: hidden; border-radius: 20px; border: 1px solid rgba(255, 255, 255, .08); box-shadow: 0 30px 60px -24px rgba(0, 0, 0, .7); max-width: 460px; margin: 0 auto; }
.dsx-scene img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* /mcp/ request form on a dark band */
.dsx-request .mcp-grid { gap: 40px; }
.dsx-request .mcp-form { background: rgba(15, 32, 59, .7); border: 1px solid rgba(255, 255, 255, .1); border-radius: 22px; padding: 40px; box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .7); }
.dsx-request .mcp-form h2 { font-size: clamp(1.7rem, 3vw, 2.3rem); font-weight: 600; margin: 0 0 28px; color: #fff; }
.dsx-request .mcp-field { color: var(--navy-50); }
.dsx-request .mcp-field input, .dsx-request .mcp-field textarea { background: rgba(4, 10, 23, .55); border: 1px solid rgba(255, 255, 255, .16); color: #fff; }
.dsx-request .mcp-field input::placeholder, .dsx-request .mcp-field textarea::placeholder { color: rgba(197, 212, 228, .55); }
.dsx-request .mcp-form legend { color: #fff; }
.dsx-request .mcp-opt > span { border-color: rgba(255, 255, 255, .18); color: var(--navy-50); background: rgba(255, 255, 255, .03); }
.dsx-request .mcp-opt:hover > span { border-color: rgba(255, 102, 0, .6); }
.dsx-request .mcp-opt input:checked + span { background: var(--orange-500); border-color: var(--orange-500); color: #fff; }
.dsx-request .mcp-card small { color: inherit; }
.dsx-request .mcp-note { color: var(--navy-100); }
.dsx-request .mcp-done { background: rgba(255, 102, 0, .16); color: #fff; }
.dsx-request .dsx-submit { border: 0; cursor: pointer; font: inherit; font-weight: 600; margin-top: 8px; }
.dsx-request .dsx-submit:disabled { opacity: .6; cursor: default; }
.dsx-request .mcp-side { gap: 18px; position: sticky; top: 90px; }
.dsx-request .mcp-side .ds-btns { margin-top: 18px; }

@media (max-width: 1080px) {
  .dsx-two { grid-template-columns: minmax(0, 1fr); }
  .dsx-request .mcp-side { position: static; }
}
@media (max-width: 760px) {
  .dsx-flow:not(.dsx-flow-v) { flex-direction: column; }
  .dsx-flow:not(.dsx-flow-v) .dsx-arrow { flex: 0 0 28px; }
  .dsx-flow:not(.dsx-flow-v) .dsx-arrow i { width: 2px; height: 100%; background: linear-gradient(180deg, rgba(255, 102, 0, .2), rgba(255, 102, 0, .8)); }
  .dsx-flow:not(.dsx-flow-v) .dsx-arrow i::after { right: -4px; top: auto; bottom: -1px; border: 5px solid transparent; border-top: 7px solid rgba(255, 102, 0, .9); border-bottom: 0; }
  .dsx-fan { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .dsx-fan-lines { display: none; }
  .dsx-fan ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dsx-rows { gap: 64px; }
  .dsx-request .mcp-form { padding: 24px 20px; }
}

/* ---- Solutions, use cases, industries (agent) ---- */
/* /solutions/*, /use-cases/*, /industries/* and their hubs (2026-10-22). Body class "dss-page"; builders in
   src/pages/_lib/{solution,usecase,industry}.js, helpers in src/pages/_lib/ds-extra-solutions.js. */
.dss-gap { margin-top: 72px; }
.dss-gap-s { margin-top: 28px; }
.dss-top { align-items: start; }
/* reading width: no paragraph block wider than about 680px */
.dss-page .ds-head .ds-lead, .dss-page .ds-feature-copy .ds-lead { max-width: 680px; }
.dss-page .ds-head:not(.ds-center) .ds-lead { margin-right: auto; }
.dss-page .ds-hero h1 { max-width: 20ch; }
.dss-page .ds-hero-media .ds-vig { max-width: 560px; margin-left: auto; }
.dss-page .ds-stats dd { font-size: clamp(1.25rem, 2vw, 1.7rem); }
.dss-page .ds-faq-grid h2 { font-size: clamp(1.6rem, 2.8vw, 2.25rem); }
.dss-after { max-width: 680px; margin: 22px 0 0; line-height: 1.7; }
.ds-light .dss-after { color: var(--slate-700); }
.theme-ds .ds-dark .dss-after, .theme-ds .ds-deep .dss-after { color: var(--navy-50); }
.dss-small { margin: 18px 0 0; font-size: .86rem; color: var(--slate-500, #64748b); }
.dss-lead-dark { margin: 0; max-width: 680px; font-size: 1.12rem; line-height: 1.75; }
/* regions with market chips (solutions markets band) */
.dss-regions { display: grid; gap: 6px; margin-top: 28px; }
.dss-region { margin: 0; font-size: .74rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--orange-600, #e05a00) !important; }
.dss-regions .ds-chips { margin: 8px 0 12px; }
.dss-map { border: 0; border-radius: 0; }
/* the map's labels are white: give it a navy frame on light bands */
.ds-light .dss-map { padding: 28px; border-radius: 22px; background: radial-gradient(600px 300px at 30% 20%, rgba(42, 74, 115, .5), transparent 70%), var(--navy-900); box-shadow: 0 30px 60px -28px rgba(4, 10, 23, .55); }
/* bento cards without visuals: shorter rows */
.dss-page .ds-bento { grid-auto-rows: minmax(170px, auto); }
/* products bento: 3 equal cards with visuals on top */
.dss-products .ds-bento { grid-auto-rows: auto; }
.dss-products .ds-bento-item { justify-content: flex-start; }
.dss-products .ds-bento-visual { flex: none; min-height: 230px; align-items: flex-start; }
.dss-products .ds-bento-visual .ds-vig { padding: 16px; font-size: .8rem; }
.dss-products .ds-bento-visual .ds-window { box-shadow: 0 20px 40px -20px rgba(0, 0, 0, .7); }
.dss-products .ds-bento-text p { color: var(--navy-50); }
.dss-bento-2 .ds-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: minmax(180px, auto); }
.dss-page .ds-bento-text p { max-width: 620px; }
/* two-column split: heading left, content right */
.dss-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: 72px; align-items: start; }
.dss-split h2 { font-size: clamp(1.6rem, 2.8vw, 2.25rem); line-height: 1.12; font-weight: 600; margin: 0; }
.dss-split .ds-chips { margin-top: 4px; }
/* product box and the raw-data note inside a feature row */
.dss-box { margin-top: 36px; padding: 28px; border-color: rgba(255, 102, 0, .35); }
.dss-box h3 { font-size: 1.2rem; }
.dss-box p { font-size: .98rem; color: var(--navy-50); }
.dss-box .ds-btns { margin-top: 20px; }
.dss-note { display: grid; grid-template-columns: 36px 1fr; gap: 14px; align-items: start; margin-top: 24px; }
.dss-note svg { color: var(--orange-500); margin: 2px auto 0; }
.dss-note p { margin: 0; color: var(--navy-50); line-height: 1.65; }
.dss-note strong { color: #fff; }
/* closing link groups */
.dss-linkcols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 48px; align-items: start; }
.dss-linkcols.dss-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dss-linkgroup h2 { font-size: clamp(1.3rem, 1.8vw, 1.55rem); line-height: 1.15; font-weight: 600; margin: 0 0 24px; }
.dss-linkgroup .ds-links { grid-template-columns: minmax(0, 1fr); }
.dss-cols-2 .dss-linkgroup .ds-links { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
/* tables inside a feature column, and the hub band right under the hero */
.dss-page .ds-feature .ds-table td, .dss-page .ds-feature .ds-table th { padding: 12px 16px; }
.dss-tight-top { padding-top: 72px; }
.dss-page .ds-chart .hb-label { font-size: .86rem; }

@media (max-width: 1080px) {
  .dss-split { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .dss-linkcols, .dss-linkcols.dss-cols-2 { grid-template-columns: minmax(0, 1fr); gap: 56px; }
  .dss-page .ds-hero-media .ds-vig { margin-left: 0; }
}
@media (max-width: 640px) {
  .dss-bento-2 .ds-bento { grid-template-columns: minmax(0, 1fr); }
  .dss-products .ds-bento-visual { min-height: 0; }
  .dss-gap { margin-top: 56px; }
  .dss-box { padding: 22px; }
  .dss-page .ds-hero h1 { font-size: clamp(2rem, 9vw, 2.6rem); }
  /* tables with 3+ columns scroll sideways instead of squeezing into tall rows */
  .dss-page .ds-table .table-wrap { overflow-x: auto; }
  .dss-page .ds-table table:has(thead th:nth-child(3)) { min-width: 620px; }
  .dss-page .ds-table table:has(thead th:nth-child(5)) { min-width: 1040px; }
}

/* ---- Coverage pages (agent) ---- */
/* /coverage/ hub, regional pages and the 8 country pages, en/es/fr (2026-10-22). Builder src/pages/_lib/coverage.js,
   helpers src/pages/_lib/ds-extra-coverage.js. Charts sit on light bands so the navy export series keeps contrast. */
.cv-gap-lg { margin-top: 72px; }
.theme-ds .ds-hero .ds-label .flag { width: 18px; height: 18px; margin-right: 2px; }
/* hero market card */
.cv-card { border-radius: 22px; padding: 28px; max-width: 520px; margin-left: auto; background: linear-gradient(180deg, #0d1c35 0%, #0a1629 100%); border: 1px solid rgba(255, 255, 255, .09); box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .75); color: var(--navy-50); font-size: .9rem; }
.cv-card-head { display: flex; align-items: center; gap: 18px; padding-bottom: 20px; margin-bottom: 18px; border-bottom: 1px solid rgba(255, 255, 255, .08); }
.cv-flags { display: inline-flex; }
.cv-flags .flag { box-shadow: 0 0 0 3px rgba(255, 255, 255, .12), 0 12px 24px -8px rgba(0, 0, 0, .6); }
.cv-flags .flag + .flag { margin-left: -14px; }
.cv-card-name { font-size: 1.6rem; font-weight: 600; letter-spacing: -.02em; color: #fff; }
.cv-card-label { margin: 0 0 8px; font-size: .7rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--orange-500); }
.cv-card-rows { list-style: none; margin: 0 0 18px; padding: 0; display: grid; gap: 8px; }
.cv-card-rows li { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; padding: 10px 14px; border-radius: 10px; background: rgba(255, 255, 255, .04); }
.cv-card-rows span { color: #fff; font-weight: 500; }
.cv-card-rows em { font-style: normal; font-size: .8rem; color: var(--navy-100); text-align: right; }
.cv-card .vg-chips { margin: 0 0 16px; }
.cv-card .vg-chips span { font-size: .78rem; }
.cv-card .vg-rows { opacity: .7; }
.theme-ds .ds-hero .ds-stats dd { font-size: clamp(1.25rem, 2.1vw, 1.75rem); }
.theme-ds .ds-hero .ds-stats dd a { color: #fff; }
/* snapshot: flow tiles, top chapters, charts */
.cv-flows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.cv-flows .snap-tile { grid-column: auto; padding: 26px 28px; border-radius: 18px; border: 1px solid #e2e8f0; border-top: 4px solid var(--orange-500); box-shadow: 0 18px 40px -28px rgba(15, 32, 59, .35); }
.cv-flows .snap-tile:nth-child(2) { border-top-color: #2b5a9b; }
.cv-flows .snap-label { font-family: var(--font-sans); font-size: .76rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--slate-500, #64748b); }
.cv-flows .snap-flow dl { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 16px; margin-top: 8px; }
.cv-flows .snap-flow dd { font-family: var(--font-sans); font-size: 1.55rem; letter-spacing: -.02em; }
.cv-flows .snap-note { max-width: 560px; }
.cv-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 18px; align-items: start; }
.cv-pair.cv-one { grid-template-columns: minmax(0, 1fr); }
.cv-charts { margin-top: 0; }
.cv-charts.cv-odd > :last-child { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 40px; align-items: start; }
.cv-charts.cv-odd > :last-child > * { grid-column: 2; }
.cv-charts.cv-odd > :last-child > svg { grid-column: 1; grid-row: 1 / span 4; }
.ds-light .ds-chart { box-shadow: 0 18px 40px -28px rgba(15, 32, 59, .35); }
.ds-light .ds-chart figcaption { font-size: .98rem; line-height: 1.45; }
.cv-hs { color: var(--slate-500, #64748b); font-size: .85em; white-space: nowrap; }
.cv-source { max-width: 900px; margin-top: 18px; }
.cv-sub { margin-top: 120px; }
.cv-chart .cv-grid { stroke: #e7ecf3; stroke-width: 1; }
.cv-cols text { font-size: 13px; }
.cv-chart .cv-gap { fill: #94a3b8; font-size: 12px; }
.cv-chart .ds-legend { align-items: center; }
.cv-unit-note { margin-left: auto; font-style: italic; }
.cv-numbers { margin-top: 14px; border-top: 1px solid #edf1f6; padding-top: 12px; }
.cv-numbers summary { cursor: pointer; font-size: .84rem; font-weight: 600; color: var(--navy-500); }
.cv-numbers .table-wrap { margin-top: 12px; }
.cv-numbers table { width: 100%; border-collapse: collapse; font-size: .85rem; color: var(--slate-700); }
.cv-numbers caption { text-align: left; font-size: .8rem; color: var(--slate-500, #64748b); padding: 0 0 8px; }
.cv-numbers th, .cv-numbers td { padding: 6px 10px; border-top: 1px solid #edf1f6; text-align: right; font-variant-numeric: tabular-nums; }
.cv-numbers th:first-child { text-align: left; font-weight: 500; }
.cv-numbers thead th { font-size: .74rem; text-transform: uppercase; letter-spacing: .06em; color: var(--slate-500, #64748b); }
/* datasets */
.cv-datasets { display: grid; gap: 22px; }
.cv-dataset { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 56px; padding: 40px; border-radius: 22px; background: rgba(15, 32, 59, .6); border: 1px solid rgba(255, 255, 255, .08); }
.cv-dataset h3 { font-size: clamp(1.3rem, 2vw, 1.6rem); line-height: 1.2; margin: 14px 0 14px; color: #fff; }
.cv-dataset-copy p { margin: 0; color: var(--navy-50); line-height: 1.7; }
.cv-dataset-n { display: inline-block; font-family: var(--font-display); font-size: .9rem; font-weight: 600; color: var(--orange-500); padding: 6px 10px; border-radius: 8px; background: rgba(255, 102, 0, .12); }
.cv-dataset-fields .ds-label { margin-bottom: 6px; }
.cv-dataset-fields .ds-chips { margin: 8px 0 0; }
.cv-badge { display: inline-block; vertical-align: middle; margin-left: 8px; padding: 3px 10px; border-radius: 999px; font-size: .72rem; font-weight: 600; letter-spacing: 0; background: rgba(15, 143, 124, .2); color: #5fd3c0; }
.cv-research { margin-top: 28px; max-width: 860px; }
.cv-research p { margin: 0; color: var(--navy-50); line-height: 1.7; }
/* kept sections with tables (light band) */
.cv-tablesec .ds-head { margin-bottom: 32px; }
.cv-prose > p { max-width: 760px; line-height: 1.7; }
.cv-prose .table-wrap { margin: 28px 0; }
.cv-prose .muted { font-size: .86rem; }
.ds-light .cv-prose a:not([class]) { color: var(--navy-500) !important; }
.ds-feature .ds-lead .check-list { margin-top: 18px; }
.ds-feature .ds-lead .check-list li { margin-bottom: 10px; }
/* uses bento: 2 x 2 */
.cv-uses .ds-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: minmax(200px, auto); max-width: 1080px; margin: 0 auto; }
/* reports teaser + related */
.cv-reports { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 80px; align-items: start; }
.cv-reports h2, .cv-related h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); line-height: 1.12; font-weight: 600; margin: 0 0 18px; }
.cv-report-links { list-style: none; margin: 28px 0 0; padding: 0; display: grid; gap: 12px; }
.cv-report-links li { display: flex; gap: 14px; align-items: center; padding: 18px 20px; border-radius: 14px; background: rgba(255, 102, 0, .08); border: 1px solid rgba(255, 102, 0, .3); color: var(--navy-50); line-height: 1.55; }
.cv-report-links .flag { box-shadow: 0 0 0 2px rgba(255, 255, 255, .15); }
.cv-related .ds-links { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.cv-related-full .ds-links { margin-top: 28px; }
/* legacy layout extras (Hispaniola) */
.cv-note { margin: 18px 0 0; font-size: .92rem; }
.cv-latest .latest-month { border-radius: 18px; padding: 28px; background: rgba(15, 32, 59, .6); border: 1px solid rgba(255, 255, 255, .1); color: var(--navy-50); }
.cv-latest .latest-month h3 { color: #fff; margin-top: 0; }
.cv-latest .latest-month p { color: var(--navy-50); }
.cv-steps p { margin: 0; }
.cv-product { border-color: rgba(255, 255, 255, .12); padding: 32px; }
.cv-product .ds-btns { margin-top: 20px; }
/* hub and regional pages */
.cv-regions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.cv-region { display: flex; flex-direction: column; gap: 14px; padding: 30px; border-radius: 20px; background: rgba(15, 32, 59, .6); border: 1px solid rgba(255, 255, 255, .08); }
.cv-region h3 { margin: 0; font-size: 1.25rem; line-height: 1.25; }
.cv-region h3 a { color: #fff !important; text-decoration: none; }
.cv-region h3 a:hover { color: var(--orange-400) !important; }
.cv-region p { margin: 0; color: var(--navy-50); line-height: 1.65; font-size: .95rem; }
.cv-markets { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 18px; }
.cv-market { display: flex; flex-direction: column; gap: 12px; padding: 26px; border-radius: 18px; background: rgba(15, 32, 59, .6); border: 1px solid rgba(255, 255, 255, .08); }
.cv-market-head { display: flex; align-items: center; gap: 12px; }
.cv-market h3 { margin: 0; font-size: 1.15rem; }
.cv-market h3 a { color: #fff !important; text-decoration: none; }
.cv-market h3 a:hover { color: var(--orange-400) !important; }
.cv-market p { margin: 0; color: var(--navy-50); line-height: 1.65; font-size: .94rem; }
.cv-flagrow { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
.cv-flagrow a { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px 6px 6px; border-radius: 999px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12); color: #fff !important; text-decoration: none; font-size: .88rem; }
.cv-flagrow a:hover { border-color: var(--orange-500); }
.cv-gap-s { margin-top: 18px; }
.cv-steps-1 { grid-template-columns: minmax(0, 1fr); gap: 12px; margin: 26px 0; }
.cv-steps-1 li { display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: start; padding: 18px 20px; }
.cv-steps-1 .ds-step-n { margin: 0; }
.cv-steps-1 li::after { display: none; }
.cv-card .cv-flagrow { margin-top: 4px; }

@media (max-width: 1080px) {
  .cv-dataset { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .cv-reports { grid-template-columns: minmax(0, 1fr); gap: 64px; }
  .cv-card { margin-left: 0; }
  .cv-regions { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .cv-flows, .cv-pair, .cv-uses .ds-bento { grid-template-columns: minmax(0, 1fr); }
  .cv-dataset { padding: 26px 22px; }
  .cv-sub { margin-top: 80px; }
  .cv-card { padding: 22px; }
  .cv-charts.cv-odd > :last-child { display: block; }
  .cv-page .ds-table .table-wrap { overflow-x: auto; }
  .cv-page .ds-table table { min-width: 560px; }
  .cv-cols text { font-size: 17px; }
  .cv-chart .cv-gap { font-size: 17px; }
}
/* ---- end Coverage pages (agent) ---- */
/* Products pages (agent): wide folder screenshot shown cropped to its name column, so it reads at a larger size. */
.dsx-shot-crop .ds-window img { aspect-ratio: 16 / 10; object-fit: cover; object-position: left top; }
/* Products pages (agent): Files custom enrichment skeleton, the added columns in orange (2026-10-23). */
.dsx-enrich .vg-td i { background: rgba(197, 212, 228, .28); }
.dsx-enrich .vg-th.is-new { color: #ffb37a; background: rgba(255, 102, 0, .12); border-radius: 6px 6px 0 0; border-bottom-color: rgba(255, 102, 0, .55); }
.dsx-enrich .vg-td.is-new { background: rgba(255, 102, 0, .08); box-shadow: inset 0 0 0 1px rgba(255, 102, 0, .3); }
.dsx-enrich .vg-td.is-new i { background: rgba(255, 102, 0, .6); }
#enrichment .ds-points + .ds-btns { margin-top: 22px; }

/* ---- Academics and pricing (agent) ---- */
/* /academics/, /es/academics/, /pricing/ (2026-10-23). Body class "dsa-page"; layout and helpers in
   src/pages/_lib/ds-extra-academics.js. */
.dsa-gap { margin-top: 56px; }
.dsa-page .ds-hero h1 { max-width: 20ch; }
.dsa-page .ds-hero .promise { margin: 0 0 14px; }
.dsa-page .ds-hero .promise strong { color: #fff; font-weight: 600; }
.dsa-page .ds-stats dd { font-size: clamp(1.2rem, 2vw, 1.65rem); }
.dsa-page .ds-head .ds-lead, .dsa-page .ds-feature-copy .ds-lead { max-width: 680px; }
.dsa-hero-vig { max-width: 520px; margin-left: auto; }
.dsa-hero-vig .ds-vig { padding: 26px; }
.dsa-prose p { margin: 0 0 16px; max-width: 680px; line-height: 1.7; }
.dsa-ids .ds-chips { margin: 18px 0 0; }
.dsa-ids .ds-chips li { font-family: var(--font-display); font-weight: 600; color: #ffb37a; border-color: rgba(255, 102, 0, .35); background: rgba(255, 102, 0, .08); }
.dsa-uses .ds-bento { grid-auto-rows: minmax(170px, auto); }
.dsa-callout { max-width: 820px; margin: 56px auto 0; }
.dsa-callout .ds-callout { margin: 0; }
.dsa-after { max-width: 760px; margin: 28px 0 0; line-height: 1.7; }
.ds-dark .dsa-after, .ds-deep .dsa-after { color: var(--navy-50); }
.ds-light .dsa-after { color: var(--slate-700); }
.dsa-page .ds-tile h3 { font-size: 1.06rem; }
/* delivery cards: equal cards, visual on top */
.dsa-page .dss-products .ds-bento { grid-auto-rows: auto; }
.dsa-page .dss-products .ds-bento-visual { flex: none; height: 300px; align-items: center; overflow: hidden; }
.dsa-page .dss-products .ds-bento-visual .ds-vig { padding: 16px; font-size: .8rem; }
.dsa-page .dss-products .dsx-code pre { padding: 12px 14px; line-height: 1.7; }
.dsa-page .dss-products .dsx-code .vg-title { margin-bottom: 10px; }
/* suggested citation card */
.dsa-cite { margin: 0 0 18px; padding: 26px 28px; border-radius: 18px; background: rgba(255, 102, 0, .08); border: 1px solid rgba(255, 102, 0, .35); }
.dsa-cite figcaption { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; font-size: .74rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--orange-500); }
.dsa-cite p { margin: 0; font-family: var(--font-display); font-size: .98rem; line-height: 1.7; color: #fff; overflow-wrap: anywhere; }
.dsa-page .dss-box { margin-top: 0; }
/* pricing: plan cards */
.dsa-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; align-items: stretch; }
.dsa-plan { display: flex; flex-direction: column; padding: 32px 30px; border-radius: 22px; background: rgba(15, 32, 59, .6); border: 1px solid rgba(255, 255, 255, .09); box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .7); }
.dsa-plan.is-hot { border: 2px solid var(--orange-500); background: linear-gradient(180deg, rgba(255, 102, 0, .12) 0%, rgba(15, 32, 59, .7) 45%); }
.dsa-plan-head { display: flex; align-items: center; gap: 14px; }
.dsa-plan-head .ds-bento-icon { margin: 0; }
.dsa-plan h3 { margin: 0; font-size: 1.7rem; font-weight: 600; color: #fff; }
.dsa-plan-sub { margin: 14px 0 0; font-size: 1.08rem; color: #fff; font-weight: 500; }
.dsa-plan-best { margin: 12px 0 0; color: var(--navy-100); font-size: .92rem; line-height: 1.6; }
.dsa-plan-best strong, .dsa-plan-price strong { color: #fff; }
.dsa-plan-list { list-style: none; margin: 22px 0 0; padding: 22px 0 0; border-top: 1px solid rgba(255, 255, 255, .1); display: grid; gap: 12px; flex: 1; align-content: start; }
.dsa-plan-list li { display: grid; grid-template-columns: 20px 1fr; gap: 10px; color: var(--navy-50); line-height: 1.5; font-size: .95rem; }
.dsa-plan-list svg { color: var(--orange-500); margin-top: 3px; }
.dsa-plan-price { margin: 22px 0 0; padding: 14px 16px; border-radius: 12px; background: rgba(255, 255, 255, .05); color: var(--navy-50); font-size: .92rem; }
.dsa-plan .ds-btns { margin-top: 22px; }
.dsa-plan .ds-btns { gap: 8px; }
.dsa-plan .ds-btn { padding: 0 15px; font-size: .88rem; }
.dsa-plans-note { margin: 36px auto 0; text-align: center; color: var(--navy-50); }
/* pricing hero: stacked plan cards */
.dsa-stack { display: grid; gap: 14px; max-width: 480px; margin-left: auto; }
.dsa-stack-card { display: grid; grid-template-columns: auto 1fr 64px; gap: 16px; align-items: center; padding: 22px; border-radius: 18px; background: linear-gradient(180deg, #0d1c35 0%, #0a1629 100%); border: 1px solid rgba(255, 255, 255, .1); box-shadow: 0 30px 60px -24px rgba(0, 0, 0, .7); }
.dsa-stack-card:nth-child(2) { margin-left: 36px; }
.dsa-stack-card:nth-child(3) { margin-left: 72px; }
.dsa-stack-card .dsx-node-icon { margin: 0; }
.dsa-stack-card strong { display: block; color: #fff; font-size: 1.1rem; font-weight: 600; }
.dsa-stack-card small { color: var(--navy-100); font-size: .84rem; }
.dsa-stack-card i { height: 8px; border-radius: 999px; background: rgba(197, 212, 228, .25); }
.dsa-stack-card.is-hot { border-color: rgba(255, 102, 0, .6); background: linear-gradient(180deg, rgba(255, 102, 0, .14) 0%, #0a1629 100%); }
.dsa-stack-card.is-hot .dsx-node-icon { background: rgba(255, 102, 0, .18); color: var(--orange-500); }
.dsa-stack-card.is-hot i { background: rgba(255, 102, 0, .55); }

@media (max-width: 1080px) {
  .dsa-plans { grid-template-columns: minmax(0, 1fr); max-width: 640px; margin: 0 auto; }
  .dsa-hero-vig, .dsa-stack { margin-left: 0; }
}
@media (max-width: 640px) {
  .dsa-stack-card:nth-child(n) { margin-left: 0; margin-right: 0; }
  .dsa-page .ds-hero h1 { font-size: clamp(2rem, 9vw, 2.6rem); }
  .dsa-page .ds-table .table-wrap { overflow-x: auto; }
  .dsa-page .ds-table table:has(thead th:nth-child(3)) { min-width: 620px; }
  .dsa-page .ds-table table:has(thead th:nth-child(5)) { min-width: 860px; }
  .dsa-plan { padding: 26px 22px; }
}
/* ---- end Academics and pricing (agent) ---- */

/* ---- Files visual and Claudio requests (agent) ---- */
/* /reports/claudio/ and /reports/below-deck/ on the kit (2026-10-23) */
.ds-light .cp-latest li { border-color: #e2e8f0; border-radius: 16px; box-shadow: 0 16px 34px -24px rgba(15, 32, 59, .35); transition: border-color .15s, transform .15s; }
.ds-light .cp-latest li:hover { border-color: rgba(255, 102, 0, .55); transform: translateY(-2px); }
.ds-light .cp-latest a { color: inherit !important; }
.ds-light .cp-head { color: var(--slate-900); font-size: 1.05rem; }
.dsc-series .ds-tile.is-current { border-color: rgba(255, 102, 0, .6); }
.dsc-series .dsc-tag { margin: 0 0 4px; font-size: .78rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--orange-500) !important; }
.dsc-series h3 a { color: #fff; text-decoration: none; }
.dsc-series h3 a:hover { color: var(--orange-400); }
.dsx-request .mcp-form > p { color: var(--navy-50); }
.dsx-request .mcp-field small { font-weight: 400; font-size: .84rem; color: var(--navy-100); margin-top: -2px; }
.dsx-request .mcp-side .ds-tile h3 { margin-top: 12px; }
.dsc-steps { margin: 10px 0 0; padding-left: 20px; color: var(--navy-50); font-size: .94rem; }
.dsc-steps li { margin-bottom: 10px; }
.dsc-steps strong { color: #fff; }
#custom-reports .ds-btns { margin-top: 26px; }

/* ---- Coverage round 2 (agent) ---- */
/* Leo, 2026-10-23: Haiti "exclusive" accent, one-tile snapshot row, reports and analysis cards, and the
   /home-b/ "Product" closing section (markup and base styles .bx-cta-product in site.css) on country pages. */
.ds-excl { color: var(--orange-500); font-weight: 700; }
.cv-flows.cv-flows-one { align-items: start; }
.cv-flows.cv-flows-one .ds-chart { margin: 0; }
.cv-res-band .ds-head { margin-bottom: 48px; }
.cv-res-band .ds-head .ds-lead { max-width: 720px; margin-left: auto; margin-right: auto; }
.cv-res.ds-bento { grid-auto-rows: auto; }
.cv-res-card { justify-content: space-between; gap: 26px; padding: 32px 30px; border-top: 3px solid var(--orange-500); background: linear-gradient(180deg, rgba(255, 102, 0, .07) 0%, rgba(15, 32, 59, .6) 45%); }
.cv-res-card .ds-bento-text h3 { font-size: 1.35rem; }
.cv-res-card .ds-bento-text p { font-size: 1rem; color: var(--navy-50); }
.cv-res-links { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.cv-res-links a { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 12px; background: rgba(255, 102, 0, .1); border: 1px solid rgba(255, 102, 0, .35); color: #fff; text-decoration: none; font-weight: 600; font-size: .94rem; line-height: 1.4; transition: border-color .2s, background .2s; }
.cv-res-links a svg { color: var(--orange-500); flex: none; transition: transform .2s; }
.cv-res-links a:hover { background: rgba(255, 102, 0, .18); border-color: var(--orange-500); }
.cv-res-links a:hover svg { transform: translateX(3px); }
.cv-cta-product h2 { margin-bottom: 18px; }
.cv-cta-product .bx-lead { max-width: 560px; }
.cv-cta-product .ds-btns { margin-top: 8px; }
@media (max-width: 1080px) {
  .cv-res.ds-bento { grid-template-columns: minmax(0, 1fr); }
  .cv-cta-product .ds-btns { justify-content: center; }
  .cv-cta-product .bx-lead { margin-left: auto; margin-right: auto; }
}
@media (max-width: 760px) {
  .cv-flows.cv-flows-one { grid-template-columns: minmax(0, 1fr); }
}
/* ---- end Coverage round 2 (agent) ---- */

/* ---- Atlas round 2 (agent) ---- */
/* Leo, 2026-10-23: Vault in three rows (data grid, AI report, pivot table), Track for B/L and container status,
   Contacts company list. Skeleton visuals from src/pages/_lib/ds-extra-products.js (no names, no figures). */
.dsx-vault .ds-head { margin-bottom: 72px; }
.dsx-vault .ds-feature { grid-template-columns: minmax(0, .82fr) minmax(0, 1.25fr); gap: 64px; }
.dsx-vault .ds-feature.ds-reverse { grid-template-columns: minmax(0, 1.25fr) minmax(0, .82fr); }
.dsx-vault .ds-reverse .ds-feature-media { order: 1; }
.dsx-vault .dsx-row .ds-step-n { margin-bottom: 14px; }
.dsx-sk { display: block; height: 7px; width: var(--w, 60%); border-radius: 999px; background: rgba(197, 212, 228, .26); }
.dsx-tb { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.dsx-tb .vg-title { margin: 0; }
.dsx-newpill { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; font-size: .72rem; font-weight: 600; background: rgba(15, 143, 124, .18); color: #5fd3c0; white-space: nowrap; }
.dsx-newpill b { width: 7px; height: 7px; border-radius: 50%; background: #5fd3c0; box-shadow: 0 0 0 3px rgba(95, 211, 192, .2); }
.dsx-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 14px; }
.dsx-tool { display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; border-radius: 8px; font-size: .74rem; color: #fff; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .1); white-space: nowrap; }
.dsx-tool.is-hot { background: rgba(255, 102, 0, .16); border-color: rgba(255, 102, 0, .45); color: #ffb37a; }
.dsx-toggle { display: inline-flex; align-items: center; gap: 7px; margin-left: auto; font-size: .74rem; color: var(--navy-50); white-space: nowrap; }
.dsx-toggle b { position: relative; width: 26px; height: 15px; border-radius: 999px; background: var(--orange-500); }
.dsx-toggle b::after { content: ""; position: absolute; top: 2px; right: 2px; width: 11px; height: 11px; border-radius: 50%; background: #fff; }
/* (a) data grid */
.dsx-gwrap { overflow: hidden; border-radius: 10px; border: 1px solid rgba(255, 255, 255, .08); -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); }
.dsx-gtable { display: grid; min-width: calc(var(--cols) * 92px); }
.dsx-gr { display: grid; grid-template-columns: 76px 96px repeat(var(--rest), minmax(84px, 1fr)); border-top: 1px solid rgba(255, 255, 255, .06); }
.dsx-gr > span { padding: 9px 10px; border-left: 1px solid rgba(255, 255, 255, .05); min-width: 0; }
.dsx-gh { border-top: 0; background: rgba(255, 255, 255, .05); }
.dsx-gh > span { font-size: .68rem; font-weight: 600; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dsx-gr.is-new { background: rgba(15, 143, 124, .14); }
.dsx-gr.is-new > span:first-child { box-shadow: inset 3px 0 0 #5fd3c0; }
.dsx-gr.is-new .dsx-sk { background: rgba(95, 211, 192, .38); }
.dsx-gr > span.is-edit { outline: 2px solid var(--orange-500); outline-offset: -2px; background: rgba(255, 102, 0, .1); }
.dsx-gr > span.is-edit .dsx-sk { background: rgba(255, 102, 0, .7); }
/* (b) AI report */
.dsx-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-bottom: 14px; }
.dsx-kpi { display: grid; gap: 8px; padding: 12px; border-radius: 10px; background: rgba(255, 255, 255, .045); border: 1px solid rgba(255, 255, 255, .06); }
.dsx-kpi small { font-size: .7rem; color: var(--navy-100); }
.dsx-kpi .is-val { height: 12px; background: rgba(255, 255, 255, .5); }
.dsx-delta { display: block; width: 34px; height: 12px; border-radius: 999px; background: rgba(15, 143, 124, .35); }
.dsx-delta.is-down { background: rgba(255, 102, 0, .35); }
.dsx-narr { display: flex; gap: 10px; padding: 12px 14px; border-radius: 10px; background: rgba(255, 102, 0, .07); border-left: 3px solid var(--orange-500); margin-bottom: 14px; }
.dsx-narr svg { color: var(--orange-500); margin-top: 1px; }
.dsx-narr > div { flex: 1; display: grid; gap: 8px; padding-top: 3px; }
.dsx-charts { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 10px; margin-bottom: 14px; }
.dsx-chart { padding: 12px; border-radius: 10px; background: rgba(255, 255, 255, .035); }
.dsx-chart small { display: block; margin-bottom: 10px; font-size: .7rem; font-weight: 600; color: #fff; }
.dsx-gbars { display: flex; align-items: flex-end; gap: 8px; height: 86px; border-bottom: 1px solid rgba(255, 255, 255, .12); }
.dsx-gbars span { flex: 1; display: flex; align-items: flex-end; gap: 2px; height: 100%; }
.dsx-gbars i { flex: 1; height: var(--h); border-radius: 3px 3px 0 0; background: #a7b1c2; opacity: .55; }
.dsx-gbars i.is-cur { background: #e05a00; opacity: 1; }
.dsx-hb { display: grid; grid-template-columns: 38% 1fr; gap: 8px; align-items: center; margin-bottom: 8px; }
.dsx-hb > span i { display: block; height: 9px; width: var(--w); border-radius: 0 4px 4px 0; background: #2b5a9b; }
.dsx-ask { display: flex; align-items: center; gap: 10px; padding: 11px 14px; border-radius: 12px; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 102, 0, .45); color: var(--navy-100); font-size: .8rem; }
.dsx-ask span { flex: 1; }
.dsx-ask svg { color: var(--orange-500); }
/* (c) pivot table and editor */
.dsx-pivot { display: grid; grid-template-columns: minmax(0, 1fr) 150px; gap: 14px; }
.dsx-ptable { display: grid; border-radius: 10px; overflow: hidden; border: 1px solid rgba(255, 255, 255, .08); }
.dsx-pr { display: grid; grid-template-columns: minmax(96px, 1.5fr) repeat(var(--cols), minmax(0, 1fr)); border-top: 1px solid rgba(255, 255, 255, .05); }
.dsx-pr > span { padding: 8px 7px; min-width: 0; }
.dsx-ph { border-top: 0; background: rgba(255, 255, 255, .05); }
.dsx-ph > span { font-size: .68rem; font-weight: 600; color: #fff; text-align: center; }
.dsx-pk { display: flex; align-items: center; gap: 6px; }
.dsx-pk b { flex: none; width: 0; height: 0; border: 4px solid transparent; border-top: 5px solid var(--orange-500); border-bottom: 0; }
.dsx-pr.lvl-1 .dsx-pk { padding-left: 16px; }
.dsx-pr.lvl-2 .dsx-pk { padding-left: 30px; }
.dsx-pr.lvl-0 { background: rgba(255, 255, 255, .035); }
.dsx-pr.lvl-0 .dsx-sk { background: rgba(255, 255, 255, .45); }
.dsx-pc { background: rgba(255, 102, 0, calc(var(--a) * .35)); }
.dsx-pc .dsx-sk { margin-left: auto; background: rgba(255, 255, 255, .3); }
.dsx-pv-ed { padding: 12px; border-radius: 12px; background: rgba(255, 255, 255, .045); border: 1px solid rgba(255, 255, 255, .08); align-self: start; }
.dsx-pv-ed > p { margin: 0 0 10px; font-weight: 600; font-size: .8rem; color: #fff; }
.dsx-zone { display: flex; flex-direction: column; gap: 5px; padding: 8px 0; border-top: 1px solid rgba(255, 255, 255, .07); }
.dsx-zone small { font-size: .66rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--orange-500); }
.dsx-zone span { padding: 4px 8px; border-radius: 6px; font-size: .72rem; color: #fff; background: rgba(43, 90, 155, .4); }
.dsx-zone em { display: block; height: 22px; border-radius: 6px; border: 1px dashed rgba(255, 255, 255, .2); }
/* Track */
.dsx-ids { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 10px; }
.dsx-id { display: grid; gap: 8px; padding: 12px; border-radius: 10px; background: rgba(255, 255, 255, .045); border: 1px solid rgba(255, 255, 255, .08); }
.dsx-id.is-on { border-color: rgba(255, 102, 0, .55); background: rgba(255, 102, 0, .08); }
.dsx-id small, .dsx-carrier small { font-size: .7rem; font-weight: 600; color: #fff; }
.dsx-sk.is-mono { height: 10px; background: repeating-linear-gradient(90deg, rgba(197, 212, 228, .35) 0 8px, transparent 8px 11px); border-radius: 2px; }
.dsx-carrier { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 10px; background: rgba(43, 90, 155, .25); margin-bottom: 14px; }
.dsx-carrier svg { color: var(--orange-500); }
.dsx-carrier .dsx-sk { flex: 1; max-width: 140px; }
.dsx-steps { list-style: none; margin: 0 0 14px; padding: 0 0 0 4px; }
.dsx-steps li { position: relative; display: grid; grid-template-columns: 16px 1fr 90px; gap: 12px; align-items: center; padding: 8px 0; color: var(--navy-100); }
.dsx-steps li::before { content: ""; position: absolute; left: 7px; top: 22px; bottom: -8px; width: 2px; background: rgba(255, 255, 255, .12); }
.dsx-steps li:last-child::before { display: none; }
.dsx-steps li b { position: relative; z-index: 1; width: 16px; height: 16px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .25); background: #0a1629; }
.dsx-steps li.is-done b { border-color: var(--orange-500); background: var(--orange-500); }
.dsx-steps li.is-done::before { background: rgba(255, 102, 0, .6); }
.dsx-steps li.is-now b { border-color: var(--orange-500); box-shadow: 0 0 0 4px rgba(255, 102, 0, .25); }
.dsx-steps li.is-done span, .dsx-steps li.is-now span { color: #fff; }
.dsx-steps li em { height: 7px; border-radius: 999px; background: rgba(197, 212, 228, .1); }
.dsx-track .vg-note { margin-bottom: 0; }
/* Contacts */
.dsx-contacts .vg-chips { margin: 0 0 12px; }
.dsx-contacts .vg-chips span { display: inline-flex; align-items: center; gap: 5px; }
.dsx-co { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 11px 12px; border-radius: 12px; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .06); margin-bottom: 8px; }
.dsx-av { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 10px; background: rgba(43, 90, 155, .45); color: #c5d4e4; }
.dsx-co-main { display: grid; gap: 8px; }
.dsx-co-main .dsx-sk { height: 9px; background: rgba(255, 255, 255, .45); }
.dsx-co-tags { display: flex; gap: 5px; flex-wrap: wrap; }
.dsx-co-tags span { padding: 2px 8px; border-radius: 999px; font-size: .68rem; background: rgba(255, 102, 0, .14); color: #ffb37a; }
.dsx-co-links { display: grid; gap: 5px; }
.dsx-co-links span { display: inline-flex; align-items: center; gap: 6px; font-size: .7rem; color: rgba(197, 212, 228, .35); }
.dsx-co-links span.is-on { color: var(--navy-50); }
.dsx-co-links span.is-on svg, .dsx-co-links span.is-on b { color: var(--orange-500); }
.dsx-co-links b { display: inline-flex; width: 13px; justify-content: center; font-size: .66rem; font-weight: 800; }
@media (max-width: 1080px) {
  .dsx-vault .ds-feature { grid-template-columns: minmax(0, 1fr); gap: 40px; }
}
@media (max-width: 640px) {
  .dsx-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dsx-charts, .dsx-pivot { grid-template-columns: minmax(0, 1fr); }
  .dsx-steps li { grid-template-columns: 16px 1fr 60px; }
}
/* ---- end Atlas round 2 (agent) ---- */

/* ---- Atlas hero visual and product footers (agent) ---- */
/* Leo, 2026-10-23: x.explorerChart (skeleton of the Atlas Explorer screenshot) in the Atlas hero and footer, and
   the product-style closing section (x.productFooter, .bx-cta-product base styles in site.css) on Atlas, Files, MCP. */
.dsx-explorer { display: grid; grid-template-columns: 34px 150px minmax(0, 1fr); padding: 0; overflow: hidden; font-size: .7rem; }
.dsx-ex-rail { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 12px 0; background: rgba(255, 255, 255, .03); border-right: 1px solid rgba(255, 255, 255, .07); }
.dsx-ex-rail b { width: 18px; height: 18px; border-radius: 5px; background: linear-gradient(135deg, var(--orange-500), #e05a00); margin-bottom: 4px; }
.dsx-ex-rail span { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 7px; color: rgba(197, 212, 228, .55); }
.dsx-ex-rail span.is-on { color: #fff; background: rgba(255, 102, 0, .2); box-shadow: inset 0 0 0 1px rgba(255, 102, 0, .5); }
.dsx-ex-side { padding: 12px 10px; border-right: 1px solid rgba(255, 255, 255, .07); background: rgba(255, 255, 255, .015); min-width: 0; }
.dsx-ex-h { display: flex; align-items: center; gap: 6px; margin: 0 0 10px; padding-bottom: 8px; border-bottom: 1px solid rgba(255, 255, 255, .07); font-size: .64rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #fff; }
.dsx-ex-h svg { color: var(--orange-500); }
.dsx-ex-side > small { display: block; margin: 0 0 5px; font-size: .64rem; font-weight: 600; color: var(--navy-100); }
.dsx-ex-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 9px; }
.dsx-ex-chips span { padding: 2px 6px; border-radius: 5px; font-size: .6rem; color: var(--navy-50); background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1); white-space: nowrap; }
.dsx-ex-chips span.is-on { color: #ffb37a; background: rgba(255, 102, 0, .14); border-color: rgba(255, 102, 0, .5); }
.dsx-ex-range { display: grid; grid-template-columns: 1fr 8px 1fr; gap: 4px; align-items: center; margin-bottom: 10px; }
.dsx-ex-range > span { padding: 6px 6px; border-radius: 5px; border: 1px solid rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .03); }
.dsx-ex-range em { height: 1px; background: rgba(197, 212, 228, .4); }
.dsx-ex-grp { display: flex; align-items: center; gap: 6px; padding: 7px 0; border-top: 1px solid rgba(255, 255, 255, .07); color: #fff; font-size: .66rem; white-space: nowrap; overflow: hidden; }
.dsx-ex-grp b { width: 0; height: 0; border: 3px solid transparent; border-left: 4px solid rgba(197, 212, 228, .6); border-right: 0; }
.dsx-ex-grp.is-open b { border: 3px solid transparent; border-top: 4px solid var(--orange-500); border-bottom: 0; }
.dsx-ex-grp svg { color: var(--navy-100); }
.dsx-ex-sel { display: grid; gap: 5px; padding: 0 0 8px 12px; }
.dsx-ex-sel span { height: 16px; border-radius: 5px; border: 1px solid rgba(255, 255, 255, .1); background: rgba(255, 255, 255, .03); }
.dsx-ex-main { display: flex; flex-direction: column; min-width: 0; padding: 10px 12px 10px; }
.dsx-ex-tb { display: flex; align-items: center; gap: 6px; margin-bottom: 10px; }
.dsx-ex-tb > span { display: inline-flex; align-items: center; gap: 5px; padding: 4px 8px; border-radius: 6px; font-size: .62rem; color: var(--navy-50); background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .1); white-space: nowrap; }
.dsx-ex-search { flex: 0 1 34%; min-width: 0; overflow: hidden; color: rgba(197, 212, 228, .6) !important; }
.dsx-ex-view { flex: 1; min-width: 0; overflow: hidden; }
.dsx-ex-view b { width: 0; height: 0; border: 3px solid transparent; border-top: 4px solid var(--orange-500); border-bottom: 0; }
.dsx-ex-view .dsx-sk { flex: 1; max-width: 90px; height: 5px; }
.dsx-ex-map { margin-left: auto; border-radius: 999px !important; }
.dsx-ex-map svg { color: var(--orange-500); }
.dsx-ex-plot { display: grid; grid-template-columns: 16px minmax(0, 1fr); gap: 6px; flex: 1; min-height: 0; }
.dsx-ex-y { display: flex; flex-direction: column; justify-content: space-between; padding: 22px 0 58px; }
.dsx-ex-y i { display: block; width: 14px; height: 4px; border-radius: 2px; background: rgba(197, 212, 228, .22); }
.dsx-ex-chart { display: flex; flex-direction: column; min-width: 0; }
.dsx-ex-bars { position: relative; flex: 1 1 0; min-height: 150px; border-bottom: 1px solid rgba(255, 255, 255, .14); }
.dsx-ex-bars svg { position: absolute; inset: 0; display: block; width: 100%; height: 100%; overflow: visible; }
.dsx-ex-bars .gl line { stroke: rgba(255, 255, 255, .06); stroke-dasharray: 2 4; vector-effect: non-scaling-stroke; }
.dsx-ex-bars .yrs line { stroke: rgba(122, 162, 214, .3); vector-effect: non-scaling-stroke; }
.dsx-ex-bars .yrs rect { fill: rgba(197, 212, 228, .28); }
.dsx-ex-bars .b rect { fill: #6f9fdb; }
.dsx-ex-bars .b rect.is-part { fill: rgba(111, 159, 219, .35); }
.dsx-ex-x { position: relative; height: 12px; margin: 5px 0 4px; }
.dsx-ex-x i { position: absolute; top: 3px; width: 14px; height: 4px; margin-left: -7px; border-radius: 2px; background: rgba(197, 212, 228, .24); }
.dsx-ex-delta { display: block; width: 100%; height: 30px; }
.dsx-ex-delta .up { fill: #4cc595; opacity: .8; }
.dsx-ex-delta .dn { fill: #ef7a7a; opacity: .8; }
.dsx-ex-sum { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 8px; padding-top: 8px; border-top: 1px solid rgba(255, 255, 255, .08); }
.dsx-ex-sum span { display: inline-flex; align-items: center; gap: 6px; }
.dsx-ex-sum small { font-size: .62rem; color: var(--navy-100); white-space: nowrap; }
.dsx-ex-sum .dsx-sk.is-val { width: 26px; height: 6px; background: rgba(255, 255, 255, .5); }
.ds-hero-media .dsx-explorer { width: 112%; max-width: none; }
/* product footers */
.dsx-cta-product .dsx-cta-media > * { width: 118%; transform: perspective(1400px) rotateY(-12deg) rotate(1deg); box-shadow: 0 40px 80px rgba(0, 0, 0, .55), 0 0 0 1px rgba(255, 255, 255, .08), 0 0 80px rgba(255, 102, 0, .22); }
.dsx-cta-product .dsx-cta-media > .ds-window { width: 100%; max-width: 560px; }
.dsx-cta-product .dsx-cta-media > .ds-vig-chat, .dsx-cta-product .dsx-cta-media > .dsx-mcp-chat { width: 100%; max-width: 560px; }
@media (max-width: 1080px) {
  .ds-hero-media .dsx-explorer { width: 100%; }
  .dsx-cta-product .dsx-cta-media > * { width: 100%; transform: none; margin: 0 auto; }
}
@media (max-width: 640px) {
  .dsx-explorer { grid-template-columns: 112px minmax(0, 1fr); }
  .dsx-ex-rail { display: none; }
  .dsx-ex-side { padding: 10px 8px; }
  .dsx-ex-search { display: none !important; }
  .dsx-ex-bars { min-height: 130px; }
}
@media (max-width: 420px) {
  .dsx-explorer { grid-template-columns: minmax(0, 1fr); }
  .dsx-ex-side { display: none; }
}
/* ---- end Atlas hero visual and product footers (agent) ---- */

/* Snapshot tiles: compact figures on one row (Leo, 2026-10-23). Labels may wrap; values line up and never wrap. */
.cv-flows .snap-flow dl { grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); align-items: stretch; }
.cv-flows .snap-flow dl div { justify-content: space-between; gap: 6px; }
.cv-flows .snap-flow dd { white-space: nowrap; font-size: clamp(1.3rem, 2vw, 1.6rem); font-variant-numeric: tabular-nums; }
.cv-flows .snap-flow dl { display: flex; flex-wrap: wrap; column-gap: 36px; row-gap: 14px; }
.cv-flows .snap-flow dl div { flex: 0 1 auto; }

/* ---- Use cases round 2 (agent) ---- */
/* Leo, 2026-10-23: /use-cases/ shows the six use cases as one balanced grid (3 x 2, 2 columns on tablets, 1 on
   phones); use-case pages with five steps keep them on one row on desktop. */
.ucx-grid .ds-bento { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: auto; }
.ucx-grid .ds-bento-item { justify-content: flex-start; min-height: 230px; }
.ucx-grid .ds-bento-text { display: flex; flex-direction: column; height: 100%; }
.ucx-grid .ds-bento-text p { flex: 1; }
.ucx-mods { display: block; margin-top: 12px; font-family: 'IBM Plex Mono', monospace; font-size: .78rem; letter-spacing: .02em; color: var(--orange-400, #ff8533); }
.ucx-grid .ds-more { margin-top: 18px; }
.ucx-page .ds-steps:has(> li:nth-child(5):last-child) { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.ucx-page .ds-steps:has(> li:nth-child(5):last-child) li { padding: 24px 20px; }
.ucx-page .ds-feature-media .dsx-explorer, .ucx-page .ds-feature-media .dsx-vgrid, .ucx-page .ds-feature-media .dsx-report { width: 100%; }
@media (max-width: 1080px) {
  .ucx-grid .ds-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ucx-page .ds-steps:has(> li:nth-child(5):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .ucx-grid .ds-bento, .ucx-page .ds-steps:has(> li:nth-child(5):last-child) { grid-template-columns: minmax(0, 1fr); }
  .ucx-grid .ds-bento-item { min-height: 0; }
}
/* ---- end Use cases round 2 (agent) ---- */

/* ---- Solutions round 2 (agent) ---- */
/* /solutions/ hub (Leo, 2026-10-23): eight company types in a balanced 4 x 2 grid, 2 columns on tablets, 1 on phones;
   six use cases in a 3 x 2 grid. */
.dss-types .ds-bento { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: auto; }
.dss-types .ds-bento-item { justify-content: flex-start; min-height: 0; }
.dss-types .ds-bento-text { display: flex; flex-direction: column; height: 100%; }
.dss-types .ds-bento-text .ds-more { margin-top: auto; padding-top: 14px; }
.dss-uc6 .ds-bento { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: auto; }
.dss-uc6 .ds-bento-item { justify-content: flex-start; }
/* Atlas Explorer visual inside the products card: chart only, the filter sidebar does not fit a third-width card */
.dss-products .dsx-explorer { grid-template-columns: minmax(0, 1fr); }
.dss-products .dsx-ex-rail, .dss-products .dsx-ex-side { display: none; }
.dss-products .dsx-ex-bars { min-height: 110px; }
@media (max-width: 1080px) {
  .dss-types .ds-bento, .dss-uc6 .ds-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .dss-types .ds-bento, .dss-uc6 .ds-bento { grid-template-columns: minmax(0, 1fr); }
}
/* ---- end Solutions round 2 (agent) ---- */

/* ---- Industries round 2 (agent) ---- */
/* Leo, 2026-10-23: industry Explorer skeleton (ds-extra-industries.js) adds an active-filter row (HS search, origins,
   ports) and a chart title with the industry metric above the shared .dsx-explorer plot; Files folders get a
   "new increment" pill. */
.dsx-ix-tags { display: flex; flex-wrap: wrap; gap: 5px; margin: -2px 0 9px; }
.dsx-ix-tags span { display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px; border-radius: 999px; font-size: .6rem; color: var(--navy-50); background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .12); white-space: nowrap; }
.dsx-ix-tags span svg { color: var(--navy-100); }
.dsx-ix-tags span.is-hs { color: #ffb37a; background: rgba(255, 102, 0, .14); border-color: rgba(255, 102, 0, .5); font-weight: 600; }
.dsx-ix-tags span.is-hs svg { color: var(--orange-500); }
.dsx-ix-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 8px; font-size: .7rem; color: #fff; }
.dsx-ix-title strong { font-family: var(--font-display); font-weight: 600; letter-spacing: .01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dsx-ix-title span { display: inline-flex; align-items: center; gap: 5px; font-size: .6rem; color: var(--navy-100); white-space: nowrap; }
.dsx-ix-title span b { width: 8px; height: 8px; border-radius: 2px; background: #6f9fdb; }
.dsx-ix-files .vg-title { margin-bottom: 12px; }
.dsx-ix-files .vg-folder em.dsx-ix-new { background: rgba(95, 211, 192, .45); }
.dsi-page #delivery .ds-feature-media .ds-vig { width: 100%; }
@media (max-width: 640px) {
  .dsx-ix-tags span:nth-child(n+4) { display: none; }
}
/* ---- end Industries round 2 (agent) ---- */
/* ---- Academics round 2 (agent) ---- */
/* /academics/ and /es/academics/ (Leo, 2026-10-23 round 2): classroom browser visual (dsa-cl-), "Data you can
   trust" cards (dsa-trust-). Markup in src/pages/_lib/ds-extra-academics.js. The classroom frames are a static
   cascade; with motion allowed, each step is highlighted in turn (pure CSS, no JS). */
.dsa-page .dss-products .ds-bento-visual .dsa-cl { padding: 0; height: 100%; font-size: .72rem; }
.dsa-cl { display: flex; flex-direction: column; overflow: hidden; }
.dsa-cl-bar { display: flex; align-items: center; gap: 12px; padding: 9px 12px; background: rgba(255, 255, 255, .04); border-bottom: 1px solid rgba(255, 255, 255, .07); }
.dsa-cl-dots { display: flex; gap: 5px; }
.dsa-cl-dots i { width: 8px; height: 8px; border-radius: 50%; background: rgba(197, 212, 228, .25); }
.dsa-cl-dots i:first-child { background: rgba(255, 102, 0, .7); }
.dsa-cl-url { flex: 1; display: flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; background: rgba(0, 0, 0, .25); color: var(--navy-100); font-size: .66rem; letter-spacing: .02em; }
.dsa-cl-steps { list-style: none; margin: 0; padding: 9px 12px 0; display: flex; gap: 6px; }
.dsa-cl-steps li { flex: 1; display: flex; align-items: center; gap: 6px; padding: 5px 7px; border-radius: 8px; color: var(--navy-50); font-weight: 600; font-size: .66rem; white-space: nowrap; overflow: hidden; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .06); }
.dsa-cl-steps li span:last-child { overflow: hidden; text-overflow: ellipsis; }
.dsa-cl-n { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 17px; height: 17px; border-radius: 50%; background: var(--orange-500); color: #fff; font-family: var(--font-display); font-size: .62rem; font-weight: 700; }
.dsa-cl-stage { position: relative; flex: 1; margin: 10px 12px 12px; min-height: 0; }
.dsa-cl-f { position: absolute; width: 72%; height: 72%; overflow: hidden; border-radius: 10px; background: #0b1930; border: 1px solid rgba(255, 255, 255, .12); box-shadow: 0 16px 30px -12px rgba(0, 0, 0, .8); }
.dsa-cl-f > .dsa-cl-n { position: absolute; top: 6px; right: 6px; z-index: 2; box-shadow: 0 0 0 3px #0b1930; }
.dsa-cl-f.f1 { left: 0; top: 0; z-index: 1; }
.dsa-cl-f.f2 { left: 14%; top: 14%; z-index: 2; }
.dsa-cl-f.f3 { left: 28%; top: 28%; z-index: 3; border-color: rgba(255, 102, 0, .55); }
.dsa-cl-zoom { width: 560px; zoom: .4; }
.dsa-cl-zoom .ds-vig { border: 0; border-radius: 0; box-shadow: none; padding: 18px; font-size: .86rem; }
.dsa-cl-search { padding: 9px 10px; }
.dsa-cl-t { display: flex; align-items: center; gap: 5px; margin: 0 22px 7px 0; color: #fff; font-weight: 600; font-size: .62rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dsa-cl-t svg { color: var(--orange-500); flex: none; }
.dsa-cl-q { display: flex; align-items: center; gap: 6px; padding: 5px 8px; border-radius: 7px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 102, 0, .45); color: #fff; font-size: .64rem; white-space: nowrap; overflow: hidden; }
.dsa-cl-chips { display: flex; flex-wrap: wrap; gap: 4px; margin: 7px 0 6px; }
.dsa-cl-chips span { padding: 2px 7px; border-radius: 999px; font-size: .58rem; color: var(--navy-100); border: 1px solid rgba(255, 255, 255, .14); }
.dsa-cl-chips span.is-on { color: #ffb37a; border-color: rgba(255, 102, 0, .45); background: rgba(255, 102, 0, .1); }
.dsa-cl-res { margin: 0 0 4px; font-size: .56rem; letter-spacing: .1em; text-transform: uppercase; color: var(--navy-100); }
.dsa-cl-row { display: grid; grid-template-columns: 12px 1fr 34px; gap: 6px; align-items: center; padding: 4px 0; border-top: 1px solid rgba(255, 255, 255, .06); color: var(--orange-500); }
.dsa-cl-row .dsx-sk { height: 5px; }
@media (prefers-reduced-motion: no-preference) {
  .dsa-cl-f { animation: dsa-cl-frame 9s infinite both; }
  .dsa-cl-f.f2 { animation-delay: -6s; }
  .dsa-cl-f.f3 { animation-delay: -3s; }
  .dsa-cl-steps li { animation: dsa-cl-step 9s infinite both; }
  .dsa-cl-steps li.s2 { animation-delay: -6s; }
  .dsa-cl-steps li.s3 { animation-delay: -3s; }
}
@keyframes dsa-cl-frame {
  0%, 31% { z-index: 5; opacity: 1; border-color: rgba(255, 102, 0, .75); transform: scale(1.03); }
  35%, 100% { z-index: 1; opacity: .6; border-color: rgba(255, 255, 255, .12); transform: none; }
}
@keyframes dsa-cl-step {
  0%, 31% { background: rgba(255, 102, 0, .16); border-color: rgba(255, 102, 0, .5); color: #fff; }
  35%, 100% { background: rgba(255, 255, 255, .04); border-color: rgba(255, 255, 255, .06); color: var(--navy-50); }
}
.dsa-trust { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.dsa-trust-card { display: flex; flex-direction: column; padding: 28px 24px; border-radius: 20px; background: rgba(15, 32, 59, .6); border: 1px solid rgba(255, 255, 255, .09); }
.dsa-trust-card h3 { margin: 0 0 10px; font-size: 1.1rem; font-weight: 600; color: #fff; }
.dsa-trust-card p { margin: 0 0 22px; color: var(--navy-50); line-height: 1.6; font-size: .95rem; }
.dsa-trust-logos { list-style: none; margin: auto 0 0; padding: 22px 0 0; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; }
.dsa-trust-card p + .dsa-trust-logos { border-top: 1px solid rgba(255, 255, 255, .08); }
.dsa-trust-logos img { display: block; height: 22px; width: auto; opacity: .92; }
.dsa-trust-logos li:first-child img[src$="ft.svg"] { height: 14px; }
.dsa-trust-logos img[src$="bbc.svg"] { height: 20px; }
.dsa-trust-name { font-family: Georgia, "Times New Roman", serif; font-size: 1.05rem; color: #fff; letter-spacing: -.01em; white-space: nowrap; }
.dsa-trust-note { margin: 28px 0 0; color: var(--navy-100); font-size: .88rem; }
@media (max-width: 1080px) { .dsa-trust { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .dsa-trust { grid-template-columns: minmax(0, 1fr); } }
/* Records-by-market chart, eight markets (2026-10-26): shared columns so every bar starts and ends at the same x
   whatever the width of its value label ("110 million" vs "more than 250 million"). */
@media (min-width: 641px) {
  .dsa-page .ds-hbars { grid-template-columns: minmax(0, 1.3fr) minmax(0, 2fr) auto; }
  .dsa-page .hb-row { grid-column: 1 / -1; grid-template-columns: subgrid; }
}
/* ---- end Academics round 2 (agent) ---- */

/* Explorer visual: the real CargoFax icon (logo-icon-light, for dark backgrounds) instead of the orange square (Leo, 2026-10-23). */
.dsx-ex-rail .dsx-ex-logo { display: block; width: 22px; height: 22px; margin-bottom: 4px; }

/* ---- Academic brochure form (agent) ---- */
/* /academics/ Methodology: "Request the full brochure" button under the tiles (Leo, 2026-10-26). */
.dsab-cta { margin-top: 32px; }
.dsab-cta + .dsa-after { margin-top: 20px; }
/* /academics/brochure/ form card: builds on .dsx-request; adds the select fields and the side list. */
.dsab-form .mcp-field select { font: inherit; font-weight: 400; padding: 10px 12px; border-radius: 10px; background: rgba(4, 10, 23, .55); border: 1px solid rgba(255, 255, 255, .16); color: #fff; }
.dsab-form .mcp-field select option { background: #0f203b; color: #fff; }
.dsab-form .mcp-field select:focus { outline: 2px solid var(--orange-500); outline-offset: 1px; border-color: transparent; }
.dsab-form .mcp-field input, .dsab-form .mcp-field select { box-sizing: border-box; min-height: 46px; }
.dsab-covers { margin: 10px 0 0; padding-left: 18px; color: var(--navy-50); font-size: .94rem; }
.dsab-covers li { margin-bottom: 10px; line-height: 1.55; }
.dsab-covers strong { color: #fff; }
.dsab-page .ds-vig-files .vg-chips:empty { display: none; }
/* ---- end Academic brochure form (agent) ---- */
/* ---- Demo intake form (agent) ---- */
/* /demo/, /es/demo/, /fr/demo/: builds on .dsx-request (the MCP and brochure form cards). Product cards in three
   columns, the "Other markets" box under the market pills (always shown without JavaScript; site.js hides it until
   Other is ticked). */
.dsd-form .dsd-products { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.dsd-form .mcp-card > span { height: 100%; box-sizing: border-box; }
.dsd-form .mcp-card strong { color: inherit; }
.dsd-form .mcp-field input { box-sizing: border-box; min-height: 46px; }
.dsd-form .dsd-other { margin: 14px 0 0; }
.dsd-form .dsd-other[hidden] { display: none; }
.dsd-page .ds-hero .ds-hero-lede .promise { margin-bottom: 10px; }
@media (max-width: 900px) { .dsd-form .dsd-products { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .dsd-form .dsd-products { grid-template-columns: minmax(0, 1fr); } }
/* ---- end Demo intake form (agent) ---- */
/* ---- Contact form (agent) ---- */
/* /contact/, /es/contact/, /fr/contact/ (Leo, 2026-10-26): builds on .dsx-request; the topic select matches the
   brochure form's selects. Builder in src/pages/_lib/contact-form.js. */
.dsc-form .mcp-field select { font: inherit; font-weight: 400; padding: 10px 12px; border-radius: 10px; background: rgba(4, 10, 23, .55); border: 1px solid rgba(255, 255, 255, .16); color: #fff; }
.dsc-form .mcp-field select option { background: #0f203b; color: #fff; }
.dsc-form .mcp-field select:focus { outline: 2px solid var(--orange-500); outline-offset: 1px; border-color: transparent; }
.dsc-form .mcp-field input, .dsc-form .mcp-field select { box-sizing: border-box; min-height: 46px; }
.dsc-page .ds-hero .ds-hero-lede p + p { margin-top: 10px; }
/* ---- end Contact form (agent) ---- */

/* ---- Academics round 3 (agent) ---- */
/* /academics/ datasets overview and record section (Leo, 2026-10-26): market flag tiles, the brochure CTA panel,
   and the high-level record skeleton. Builders in src/pages/_lib/ds-extra-academics.js. */
.dsa-mkts { list-style: none; margin: 36px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.dsa-mkts a { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 14px; background: #fff; border: 1px solid #dbe3ee; color: var(--slate-900) !important; font-weight: 600; text-decoration: none; transition: border-color .15s, transform .15s; }
.dsa-mkts a:hover { border-color: var(--orange-500); transform: translateY(-1px); }
.dsa-mkts .flag { box-shadow: 0 0 0 1px #dbe3ee; }
.dsa-ov { margin-top: 40px; }
.dsa-ov .ds-points { margin-top: 0; }
.dsa-bro { margin: 28px 0 0; padding: 22px 24px; border-radius: 16px; background: rgba(255, 102, 0, .07); border: 1px solid rgba(255, 102, 0, .3); }
.dsa-bro p { margin: 0 0 16px; line-height: 1.6; max-width: 620px; }
.dsa-bro .ds-btns { margin: 0; }
.ds-light .dsa-bro p { color: var(--slate-700); }
.ds-dark .dsa-bro, .ds-deep .dsa-bro { background: rgba(255, 102, 0, .08); border-color: rgba(255, 102, 0, .35); }
.ds-dark .dsa-bro p, .ds-deep .dsa-bro p { color: var(--navy-50); }
.dsa-rec ul { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 10px; }
.dsa-rec li { display: grid; grid-template-columns: 32px minmax(0, 11rem) minmax(0, 1fr); gap: 12px; align-items: center; padding: 12px 14px; border-radius: 12px; background: rgba(0, 0, 0, .22); border: 1px solid rgba(255, 255, 255, .06); }
.dsa-rec-ic { display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; background: rgba(255, 102, 0, .14); color: var(--orange-500); }
.dsa-rec-l { color: #fff; font-weight: 600; font-size: .92rem; }
.dsa-rec .vg-title { margin-bottom: 14px; }
@media (max-width: 900px) { .dsa-mkts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .dsa-rec li { grid-template-columns: 32px minmax(0, 1fr); } .dsa-rec li .dsx-sk { display: none; } }
/* ---- end Academics round 3 (agent) ---- */

/* Academics market tiles: pairs read top over bottom on desktop (Leo, 2026-10-26); the list is in pair order,
   so on smaller screens the pairs stay together. */
@media (min-width: 901px) { .dsa-mkts { grid-template-rows: repeat(2, auto); grid-auto-flow: column; } }

/* Academics methodology: the sixth card is the brochure call to action (Leo, 2026-10-26). */
.dsa-method-cta { display: flex; flex-direction: column; border-color: rgba(255, 102, 0, .55) !important; background: linear-gradient(160deg, rgba(255, 102, 0, .16), rgba(15, 32, 59, .6) 70%) !important; }
.dsa-method-cta h3 { color: #fff; }
.dsa-method-cta .ds-btns { margin-top: auto; padding-top: 18px; }

/* ---- Reports hub (agent) ---- */
/* /reports/ on the kit (Leo, 2026-10-26): series cards with flags, sources table in a light band. */
.dsr-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.dsr-card { display: flex; flex-direction: column; padding: 26px 24px 22px; border-radius: 16px; background: rgba(15, 32, 59, .55); border: 1px solid rgba(255, 255, 255, .08); color: var(--navy-50) !important; text-decoration: none; transition: border-color .15s, transform .15s, background .15s; }
.dsr-card:hover { border-color: rgba(255, 102, 0, .55); background: rgba(15, 32, 59, .8); transform: translateY(-2px); }
.dsr-flag .flag { box-shadow: 0 0 0 3px rgba(255, 255, 255, .1), 0 10px 20px -8px rgba(0, 0, 0, .6); }
.dsr-card h3 { margin: 16px 0 6px; font-size: 1.2rem; line-height: 1.3; color: #fff; }
.dsr-src { margin: 0 0 18px; font-size: .92rem; line-height: 1.5; color: var(--navy-100); }
.dsr-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: auto 0 0; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .08); }
.dsr-meta dt { font-size: .72rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--navy-100); }
.dsr-meta dd { margin: 4px 0 0; font-size: .92rem; color: #fff; }
.dsr-card .ds-more { color: var(--orange-500); }
.dsr-note { margin: 20px 0 0; max-width: 860px; font-size: .95rem; line-height: 1.65; }
#sources .ds-table td:first-child a { font-weight: 600; }
@media (max-width: 1080px) { .dsr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) {
  #sources .ds-table .table-wrap { overflow-x: auto; }
  #sources .ds-table table { min-width: 860px; }
}
@media (max-width: 640px) { .dsr-grid { grid-template-columns: minmax(0, 1fr); } }
/* ---- end Reports hub (agent) ---- */


/* ---- Partners page (agent) ---- */
/* /partners/ on the kit (Leo, 2026-10-26): MCP early-access tile beside the delivery list, note under the markets table. */
.dsx-ptn-tile { display: flex; flex-direction: column; padding: 26px 24px 24px; border-radius: 16px; background: linear-gradient(160deg, rgba(255, 102, 0, .14), rgba(15, 32, 59, .6) 70%); border: 1px solid rgba(255, 102, 0, .45); }
.dsx-ptn-tile h3 { color: #fff; margin: 14px 0 8px; }
.dsx-ptn-tile p { color: var(--navy-100); }
.dsx-ptn-tile .ds-btns { margin-top: 18px; }
.dsx-ptn-note { margin: 20px 0 0; max-width: 860px; font-size: .95rem; line-height: 1.65; }
#markets .ds-table td:first-child a { font-weight: 600; }
/* ---- end Partners page (agent) ---- */

/* Partners: each "where it fits" point ends with the benefit to the partner's customers (Leo, 2026-10-26). */
.dsx-ptn-benefit { display: block; margin-top: 4px; color: var(--orange-400); font-weight: 500; }

/* ---- About page (agent) ---- */
/* /about/ on the kit (Leo, 2026-10-26): story timeline beside "Why CargoFax exists", mission tiles and callout,
   the sources map as a large coverage visual with market chips, light "At a glance" table. */
.dsx-ab-p { margin: 18px 0 0; max-width: 680px; line-height: 1.75; color: var(--navy-50); }
.dsx-ab-time { position: relative; list-style: none; margin: 0; padding: 28px 26px; display: grid; gap: 22px; border-radius: 20px; background: radial-gradient(520px 260px at 20% 0%, rgba(42, 74, 115, .45), transparent 70%), rgba(15, 32, 59, .6); border: 1px solid rgba(255, 255, 255, .08); box-shadow: 0 30px 60px -30px rgba(4, 10, 23, .7); }
.dsx-ab-time::before { content: ""; position: absolute; left: 53px; top: 52px; bottom: 52px; width: 2px; background: linear-gradient(rgba(255, 102, 0, .7), rgba(255, 255, 255, .12)); }
.dsx-ab-time li { position: relative; display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 16px; align-items: center; }
.dsx-ab-yr { position: relative; z-index: 1; display: inline-grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--navy-900, #0b1a33); border: 2px solid rgba(255, 255, 255, .16); color: #fff; font-size: .82rem; font-weight: 700; letter-spacing: .02em; }
.dsx-ab-time li:first-child .dsx-ab-yr, .dsx-ab-time li.is-now .dsx-ab-yr { border-color: var(--orange-500); color: var(--orange-400); }
.dsx-ab-time li.is-now .dsx-ab-yr { background: var(--orange-500); color: #fff; font-size: .74rem; }
.dsx-ab-time strong { display: block; color: #fff; font-size: 1.02rem; }
.dsx-ab-time li div span { display: block; margin-top: 3px; color: var(--navy-100); font-size: .9rem; line-height: 1.5; }
#mission .ds-tiles { margin-top: 36px; }
#mission .ds-tile p a, #values .ds-tile p a { color: var(--orange-400); }
#mission .ds-callout { margin-top: 40px; max-width: 860px; font-size: clamp(1.15rem, 1.8vw, 1.45rem); }
.dsx-ab-map { margin: 40px auto 0; max-width: 1100px; border: 0; border-radius: 0; }
.dsx-ab-mkts .ds-chips { justify-content: center; margin-top: 28px; }
.dsx-ab-mkts .ds-chips a { color: inherit; text-decoration: none; }
.dsx-ab-mkts .ds-chips li:hover { border-color: rgba(255, 102, 0, .6); }
#glance .ds-table td:first-child { font-weight: 600; white-space: nowrap; }
@media (max-width: 640px) {
  .dsx-ab-time { padding: 22px 18px; }
  .dsx-ab-time::before { left: 45px; }
  #glance .ds-table td:first-child { white-space: normal; }
}
/* ---- end About page (agent) ---- */

/* ---- North America and Hispaniola (agent) ---- */
/* /coverage/north-america/ (Leo, 2026-10-26): two rows of flow tiles (US side, Mexico side), imports orange and
   exports navy on each row, a side heading with the flag, and the market cards with field chips. */
.na-side { display: flex; align-items: center; gap: 10px; margin: 30px 0 14px; font-size: 1.05rem; }
.na-side:first-of-type { margin-top: 8px; }
.na-side svg, .na-side img { border-radius: 4px; flex: none; }
.na-flows .snap-tile.na-imports { border-top-color: var(--orange-500); }
.na-flows .snap-tile.na-exports { border-top-color: #2b5a9b; }
.na-note { max-width: 860px; margin-top: 24px; }
.na-markets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.na-markets .ds-chips { margin: 4px 0 0; }
.na-market-link { margin-top: auto !important; padding-top: 8px; }
.na-market-link a { color: var(--orange-400); font-weight: 600; text-decoration: none; }
.na-market-link a:hover { text-decoration: underline; }
@media (max-width: 760px) {
  .na-markets { grid-template-columns: minmax(0, 1fr); }
}
/* ---- end North America and Hispaniola (agent) ---- */

/* ---- Hispaniola visuals (agent) ---- */
/* /coverage/hispaniola/ (Leo, 2026-10-26): the two-colour island in the hero card (Haiti orange, DR navy-blue)
   and the island flow map in "How do the two datasets differ?" (hispaniolaMap in _lib/ds-extra-coverage.js). */
.cv-hisp svg { display: block; width: 100%; height: auto; overflow: visible; }
.cv-hisp-hero { margin-top: 4px; padding: 14px 10px 6px; border-radius: 14px; background: radial-gradient(120% 90% at 50% 40%, rgba(43, 90, 155, .18), rgba(255, 255, 255, .02) 70%); border: 1px solid rgba(255, 255, 255, .06); }
.cv-hisp-flows { margin: 0; padding: 22px 18px 16px; border-radius: 22px; background: linear-gradient(180deg, #0d1c35 0%, #0a1629 100%); border: 1px solid rgba(255, 255, 255, .09); box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .75); }
@media (max-width: 640px) {
  .cv-hisp-flows { padding: 14px 8px 10px; border-radius: 16px; }
}
/* ---- end Hispaniola visuals (agent) ---- */

/* ---------- Monthly report pages on the design kit (Leo, 2026-10-26) ---------- */
/* page.js renders the report sections as kit bands (.dsr-body inside .ds-dark / .ds-light). */
.dsr-page .ds-hero .ds-hero-lede p { font-size: 1.08rem; }
.dsr-page .ds-hero .ds-stats dd .chg { font: inherit; }
.dsr-page .ds-hero .ds-chart { margin: 0; }
.dsr-body > h2, .dsr-body .narrow > h2 { margin: 0 0 18px; font-size: clamp(1.5rem, 2.4vw, 2.1rem); }
.dsr-body h3 { margin: 32px 0 14px; font-size: 1.15rem; }
.dsr-body .ds-chart { margin: 0 0 24px; }
.dsr-body .ds-table { margin: 0 0 8px; }
.dsr-body .narrow { max-width: 860px; margin: 0 auto; }
.dsr-body .table-note { margin: 10px 0 0; font-size: .88rem; }
.dsr-body .period-range { display: inline-block; margin-top: 2px; font-size: .86em; font-weight: 400; }
.ds-dark .dsr-body, .ds-deep .dsr-body { color: var(--navy-50); }
.ds-dark .dsr-body h2, .ds-dark .dsr-body h3 { color: #fff; }
.ds-dark .dsr-body p, .ds-dark .dsr-body li { color: var(--navy-50); }
.ds-dark .dsr-body .muted, .ds-dark .dsr-body .facts-meta { color: rgba(214, 224, 238, .68); }
.theme-ds .ds-dark .chg.up, .theme-ds .ds-hero .chg.up { color: #5ad48a; }
.theme-ds .ds-dark .chg.down, .theme-ds .ds-hero .chg.down { color: #ff7b7b; }
.theme-ds .ds-dark .chg.flat, .theme-ds .ds-hero .chg.flat { color: var(--navy-100); }
/* facts box, narrative, takeaway, teaser */
.ds-dark .dsr-body .facts-box { background: rgba(15, 32, 59, .6); border: 1px solid rgba(255, 255, 255, .1); border-left: 4px solid var(--orange-500); border-radius: 0 16px 16px 0; }
.ds-dark .dsr-body .facts-box li { margin-bottom: 6px; }
.ds-dark .dsr-body .narrative h2 { color: #fff; font-size: clamp(1.35rem, 2.2vw, 1.8rem); }
.ds-dark .dsr-body .takeaway { background: rgba(255, 102, 0, .08); border-left-color: var(--orange-500); }
.ds-dark .dsr-body .takeaway p { color: #fff; }
.ds-dark .dsr-body .report-teaser { background: rgba(255, 102, 0, .08); border-color: rgba(255, 102, 0, .35); color: #fff; }
.dsr-body .report-teaser .ds-btn { margin-left: auto; }
/* gated importers, product box, key facts, report navigation */
.dsr-body .gated .table-wrap { border-radius: 16px; overflow: hidden; border: 1px solid rgba(255, 255, 255, .1); background: rgba(15, 32, 59, .5); }
.dsr-body .gated table { width: 100%; border-collapse: collapse; }
.dsr-body .gated th, .dsr-body .gated td { padding: 12px 20px; border-top: 1px solid rgba(255, 255, 255, .07); text-align: left; }
.dsr-body .gated thead th { font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; color: var(--navy-100); background: rgba(255, 255, 255, .03); }
.ds-dark .dsr-body .gated td { color: var(--navy-50); }
.ds-dark .dsr-body .blur-bar { background: linear-gradient(90deg, rgba(255, 102, 0, .7), rgba(255, 255, 255, .25)); }
.ds-light .dsr-body .gated .table-wrap { background: #fff; border-color: #e2e8f0; }
.ds-light .dsr-body .gated th, .ds-light .dsr-body .gated td { border-top-color: #edf1f6; color: var(--slate-700); }
.ds-light .dsr-body .gated thead th { background: #f8fafc; color: var(--slate-500, #64748b); }
.dsr-body .gated p:last-child { margin-top: 18px; }
.dsr-body .product-cta { display: flex; flex-wrap: wrap; gap: 20px 32px; align-items: center; justify-content: space-between; padding: 28px 32px; border-radius: 20px; }
.ds-light .dsr-body .product-cta { background: #fff; border: 1px solid #e2e8f0; }
.ds-dark .dsr-body .product-cta h3 { margin-top: 0; }
.dsr-body .key-facts { margin-bottom: 36px; }
.ds-dark .dsr-body .key-facts li { margin-bottom: 8px; }
.ds-dark .dsr-body .link-row a { background: rgba(255, 255, 255, .04); border-color: rgba(255, 255, 255, .16); color: #fff; }
.ds-dark .dsr-body .link-row a:hover { border-color: var(--orange-500); color: #fff; }
.ds-dark .dsr-body .link-row span { display: inline-block; padding: 6px 14px; border: 1px dashed rgba(255, 255, 255, .14); border-radius: 999px; color: rgba(214, 224, 238, .55); font-size: .92rem; }
@media (max-width: 760px) {
  .dsr-body .ds-table .table-wrap { overflow-x: auto; }
  .dsr-body .ds-table table:has(thead th:nth-child(4)) { min-width: 620px; }
  .dsr-body .ds-table .periods-table { min-width: 760px; }
}
/* Country report indexes on the kit: year bands of report cards */
.dsr-index + .dsr-index { padding-top: 0; }
.dsr-index .rpt-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 18px; box-shadow: 0 16px 34px -24px rgba(15, 32, 59, .35); overflow: hidden; }
.dsr-index .rpt-card h3 a { color: var(--slate-900) !important; text-decoration: none; }
.dsr-index .rpt-card h3 a:hover { color: var(--orange-600, #e05a00) !important; }

/* ===== Compare pages: /compare/panjiva-alternative/ (en, es), audit 2026-10-26 item 11 ===== */
.cmp-card .cv-card-rows { gap: 6px; }
.cmp-card .cv-card-rows li { padding: 8px 14px; }
.cmp-card .cv-card-rows .flag { vertical-align: -3px; margin-right: 4px; }
.cmp-table th[scope="row"] { width: 18%; white-space: normal; }
.cmp-table thead th:nth-child(2) { color: var(--orange-600, #e05a00); }
.cmp-table td { vertical-align: top; line-height: 1.5; }
.cmp-table td:nth-child(2) { background: rgba(255, 102, 0, .04); }
.ds-light .cmp-table a.cmp-src { color: var(--slate-500, #64748b) !important; font-size: .82em; white-space: nowrap; text-decoration: underline; text-underline-offset: 2px; }
.ds-light .cmp-table a.cmp-src:hover { color: var(--orange-600, #e05a00) !important; }
.cmp-note { margin-top: 18px; font-size: .95rem; }
@media (max-width: 760px) {
  .cmp-table { min-width: 620px; }
}
.dsr-index .rpt-card-link { color: var(--navy-500) !important; font-weight: 600; text-decoration-color: rgba(255, 102, 0, .6); }
.dsr-index .rpt-card p, .dsr-index .rpt-card-date { color: var(--slate-600, #475569); }

/* ===== Claudio Report and Below Deck articles on the design kit (Leo, 2026-10-26; src/pages/claudio-latest.js) ===== */
/* body.dsa-page also keeps .claudio-public, so the chart rules in site.css still apply (white chart cards). */
.dsa-page .ds-hero h1 { font-size: clamp(2rem, 4vw, 3.1rem); max-width: 24ch; }
.dsa-page .ds-hero-lede { max-width: 760px; }
.dsa-page .ds-hero-lede .cp-answer { color: #fff; font-size: 1.14rem; }
.dsa-page .ds-hero-lede .cp-byline { font-size: .96rem; color: var(--navy-100); }
.dsa-page .ds-hero-lede a { color: #fff; text-decoration: underline; text-decoration-color: rgba(255, 102, 0, .7); text-underline-offset: 3px; }
.dsa-band { padding: 88px 0 104px; }
.dsa-layout { grid-template-columns: 220px minmax(0, 1fr); gap: 56px; }
.dsa-toc { top: 96px; border-left-color: var(--orange-500); }
.dsa-toc .cp-toc-title { color: #fff; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; }
.dsa-toc a { color: var(--navy-100); }
.dsa-toc a:hover { color: #fff; }
.dsa-article { max-width: 760px; color: var(--navy-50); }
.dsa-article p, .dsa-article li { color: var(--navy-50); line-height: 1.75; }
.dsa-article h2 { color: #fff; font-size: clamp(1.4rem, 2.4vw, 1.85rem); border-top-color: rgba(255, 255, 255, .1); }
.dsa-article h3 { color: #fff; }
.dsa-article strong { color: #fff; }
.dsa-article a:not([class]) { color: #ffb37a; text-decoration: underline; text-decoration-color: rgba(255, 179, 122, .45); text-underline-offset: 2px; }
.dsa-article a:not([class]):hover { color: #fff; }
.dsa-article .muted, .dsa-article em { color: rgba(214, 224, 238, .75); }
.dsa-article blockquote { background: rgba(255, 102, 0, .08); border-left-color: var(--orange-500); }
.dsa-article code { background: rgba(255, 255, 255, .08); color: #fff; }
.dsa-article hr { border-top-color: rgba(255, 255, 255, .1); }
.dsa-article .cp-nlhead { background: rgba(255, 102, 0, .08); border-left-color: var(--orange-500); }
.dsa-article .cp-nlhead strong { color: #fff; }
.dsa-article .cp-nlhead span { color: var(--navy-100); }
/* Markdown tables on dark */
.dsa-article > .tbl table, .dsa-article > table { color: var(--navy-50); }
.dsa-article > .tbl { border: 1px solid rgba(255, 255, 255, .1); border-radius: 14px; background: rgba(15, 32, 59, .5); }
.dsa-article > .tbl th, .dsa-article > .tbl td { border-bottom-color: rgba(255, 255, 255, .08); padding: 9px 12px; }
.dsa-article > .tbl th { background: rgba(255, 255, 255, .04); color: #fff; }
/* Chart cards stay white: restore dark text inside them */
.dsa-article .ix-chart { color: var(--slate-900); border-color: transparent; box-shadow: 0 20px 40px -24px rgba(0, 0, 0, .6); }
.dsa-article .ix-chart p, .dsa-article .ix-chart li, .dsa-article .ix-chart td, .dsa-article .ix-chart strong { color: var(--slate-900); }
.dsa-article .ix-chart .ix-src, .dsa-article .ix-chart .ix-leg, .dsa-article .ix-chart summary, .dsa-article .ix-chart figcaption span { color: var(--slate-600, #475569); }
.dsa-article .ix-chart th { background: var(--slate-50); color: var(--slate-900); }
.dsa-article .ix-chart th, .dsa-article .ix-chart td { border-bottom-color: var(--slate-200); }
.dsa-article .ix-chart a:not([class]) { color: var(--navy-500); }
.dsa-article .ix-chart .kpi strong { color: var(--navy); }
/* Sources panel */
.dsa-article .tier.t1 { background: var(--orange-500); color: #fff; }
.dsa-article .tier.t2 { background: rgba(255, 255, 255, .08); color: var(--navy-50); border-color: rgba(255, 255, 255, .16); }
.dsa-article a.arch { color: var(--navy-100); }
/* Related links */
.dsa-related .ds-head { margin-bottom: 32px; }
.dsa-related .ds-head h2 { font-size: clamp(1.5rem, 2.6vw, 2.1rem); }
.dsa-links { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.dsa-more { margin: 44px 0 18px; color: #fff; font-size: 1.1rem; }
@media (max-width: 900px) { .dsa-layout { grid-template-columns: minmax(0, 1fr); } }

/* Chart tooltips and table details (Leo, 2026-10-26) */
.ds-chart.has-tip { position: relative; }
.ds-chart.has-tip .ds-col { cursor: pointer; }
.ds-chart.has-tip .ds-col rect:not(.ds-col-hit) { transition: opacity .15s; }
.ds-chart.has-tip:hover .ds-col:not(.is-on) rect:not(.ds-col-hit) { opacity: .45; }
.ds-tip { position: absolute; z-index: 5; pointer-events: none; display: flex; flex-direction: column; gap: 2px; min-width: 130px; padding: 10px 12px; border-radius: 10px; background: #fff; color: var(--slate-900); font-size: .84rem; line-height: 1.35; box-shadow: 0 14px 30px -12px rgba(4, 10, 23, .55); white-space: nowrap; }
.ds-tip strong { font-size: .86rem; margin-bottom: 2px; }
.ds-tip span { color: var(--slate-700); }
.ds-light .ds-tip { background: var(--navy-900); color: #fff; }
.ds-light .ds-tip span { color: var(--navy-50); }
.dsr-body .period-flow { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--orange-500); }
/* "On this page" highlight on Claudio and Below Deck articles */
.cp-toc a { padding: 5px 10px; border-radius: 6px; transition: background .15s, color .15s; }
.cp-toc a.is-active { background: rgba(255, 102, 0, .14); color: var(--orange-400, #ff8a3d) !important; box-shadow: inset 2px 0 0 var(--orange-500); }
.ds-tip .is-pos { color: #1f9d55; font-weight: 600; }
.ds-tip .is-neg { color: #d64545; font-weight: 600; }
.ds-light .ds-tip .is-pos { color: #5ad48a; }
.ds-light .ds-tip .is-neg { color: #ff7b7b; }
.ds-tip[hidden] { display: none; }

/* About: "Where has CargoFax data been cited?" (Leo, 2026-10-26) */
.ab-press { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.ab-press a { display: flex; flex-direction: column; gap: 8px; height: 100%; padding: 22px; border-radius: 16px; background: rgba(15, 32, 59, .55); border: 1px solid rgba(255, 255, 255, .08); color: #fff !important; text-decoration: none; transition: border-color .2s, transform .2s; }
.ab-press a:hover { border-color: rgba(255, 102, 0, .6); transform: translateY(-2px); }
.ab-press-outlet { font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; color: var(--orange-500); font-weight: 700; }
.ab-press-title { font-weight: 600; line-height: 1.35; }
.ab-press-used { font-size: .9rem; color: var(--navy-100); }

/* ---- Yearly statistics pages (agent) ---- */
/* /reports/{country}/2025/ (Leo, 2026-10-26; src/pages/reports-yearly.js): reuses the monthly report kit
   (.dsr-page, .dsr-body); adds the two year-over-year charts side by side and the "2025 in numbers" card on
   the country report indexes. */
.dsy-charts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin: 0 0 24px; }
.dsy-charts .ds-chart { margin: 0; }
.dsy-page .dsr-body .ds-table + p { margin-top: 18px; }
.dsy-page .ds-deep .dsr-body h2, .dsy-page .ds-deep .dsr-body h3 { color: #fff; }
.dsy-page .ds-deep .dsr-body p { color: var(--navy-50); }
.dsy-promo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 32px 48px; align-items: center; }
.dsy-promo h2 { margin: 0 0 12px; color: #fff; }
.dsy-promo p { color: var(--navy-50); }
.dsy-promo-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 14px; margin: 0; }
.dsy-promo-stats > div { padding: 20px 22px; border-radius: 16px; background: rgba(15, 32, 59, .6); border: 1px solid rgba(255, 255, 255, .1); }
.dsy-promo-stats dt { font-size: .8rem; color: var(--navy-100); margin: 0 0 6px; }
.dsy-promo-stats dd { margin: 0; font-size: clamp(1.1rem, 1.6vw, 1.35rem); white-space: nowrap; font-weight: 600; letter-spacing: -.02em; color: #fff; }
.theme-ds .dsy-promo-stats .chg.up { color: #5ad48a; }
.theme-ds .dsy-promo-stats .chg.down { color: #ff7b7b; }
@media (max-width: 900px) { .dsy-charts, .dsy-promo { grid-template-columns: minmax(0, 1fr); } }
/* ---- end Yearly statistics pages (agent) ---- */