/* Humantic AI brand layer for the comparison matrix and the 22 comparison pages.
   Tokens and components taken from the live humantic.ai homepage and /miia (Oct 2026):
   Manrope body, Cabinet Grotesk headings, navy #110a33, yellow #ffc61e, indigo #341d99,
   lavender #f6f4ff / #ddd6ff, muted #5b6478, border #DDD6FF, pill buttons, 16px cards. */

@font-face{font-family:"Cabinet Grotesk";src:url("fonts/CabinetGrotesk-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}

body.hai{
  --hx-navy:#110a33; --hx-yellow:#ffc61e; --hx-yellow-dk:#ffe8a5; --hx-indigo:#341d99;
  --hx-lav:#f6f4ff; --hx-lav-2:#ddd6ff; --hx-soft:#f6f4ff; --hx-ink:#110a33; --hx-muted:#5b6478;
  --hx-border:#DDD6FF; --hx-green:#341d99; --hx-amber:#110A33; --hx-amber-bg:#fff4d2;
  font-family:Manrope,Arial,sans-serif; color:var(--hx-ink); background:#ffffff;
  -webkit-font-smoothing:antialiased; font-size:16px; line-height:1.6;
}
body.hai h1,body.hai h2,body.hai h3,body.hai h4{font-family:"Cabinet Grotesk",Arial,sans-serif;letter-spacing:-.02em;line-height:1.12;color:var(--hx-ink)}
body.hai :focus-visible{outline:2px solid var(--hx-indigo);outline-offset:3px;border-radius:6px}

/* ---------- Buttons (hp2-btn) ---------- */
.hx-btn{display:inline-flex;align-items:center;gap:11px;border-radius:999px;font-family:"Cabinet Grotesk",Arial,sans-serif;font-size:16px;font-weight:700;text-decoration:none;white-space:nowrap;transition:background .15s,transform .15s,color .15s,border-color .15s;line-height:1}
.hx-btn-primary{background:var(--hx-yellow);color:var(--hx-navy);padding:7px 26px 7px 7px}
.hx-btn-primary:hover{background:var(--hx-yellow-dk);transform:translateY(-1px)}
.hx-btn-ic{width:36px;height:36px;border-radius:50%;background:var(--hx-navy);color:#ffffff;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .2s}
.hx-btn-primary:hover .hx-btn-ic{transform:translateX(3px)}
.hx-btn-ghost{background:transparent;color:var(--hx-navy);border:1.5px solid var(--hx-navy);padding:13px 24px}
.hx-btn-ghost:hover{background:var(--hx-navy);color:#ffffff}
.hx-btn-light{background:#ffffff;color:var(--hx-navy);padding:13px 24px}
.hx-btn-light:hover{background:var(--hx-lav)}

/* Oct 20: legacy nav rules removed. Every page uses the shared shell nav (public/v2/shell/shell.css); these old rules broke its mega menus. */

/* ---------- Page hero (vs-page pattern: eyebrow, claim, one line, one CTA, proof) ---------- */
.hx-hero{background:linear-gradient(#ffe8a5 0%,#ffffff 62%);padding:156px 24px 56px;text-align:center}
.hx-hero-inner{max-width:980px;margin:0 auto}
.hx-eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:"Cabinet Grotesk",Arial,sans-serif;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--hx-navy);background:#ffffff;border:1px solid var(--hx-border);border-radius:999px;padding:8px 16px 8px 8px;margin-bottom:26px;box-shadow:0 1px 3px rgba(17,10,51,.05)}
.hx-eyebrow .hx-vs-logos{display:inline-flex;align-items:center;gap:6px}
.hx-eyebrow .hx-vs-logos img{width:24px;height:24px;border-radius:50%;object-fit:contain;background:#ffffff;border:1px solid var(--hx-border);padding:3px}
.hx-hero h1{font-size:clamp(38px,6vw,76px);line-height:1.06;font-weight:700;max-width:960px;margin:0 auto 22px}
.hx-hero h1 .hx-mark{background:linear-gradient(transparent 58%,#ffe8a5 58%,#ffe8a5 92%,transparent 92%);padding:0 4px}
.hx-hero .hx-sub{font-size:clamp(17px,1.6vw,20px);color:var(--hx-muted);line-height:1.6;max-width:760px;margin:0 auto 34px}
.hx-cta-row{display:flex;justify-content:center;align-items:center;gap:14px;flex-wrap:wrap}
.hx-proof{display:flex;justify-content:center;align-items:center;gap:10px 28px;flex-wrap:wrap;margin-top:30px;font-size:14px;color:var(--hx-muted)}
.hx-proof span{display:inline-flex;align-items:center;gap:8px}
.hx-proof b{color:var(--hx-ink);font-weight:700}
.hx-proof em{font-style:normal}
.hx-proof svg{flex-shrink:0}
.hx-logos{padding:8px 24px 64px;background:#ffffff;text-align:center}
.hx-logos-label{font-size:14px;color:var(--hx-muted);margin-bottom:18px}
.hx-logos-row{display:flex;justify-content:center;align-items:center;gap:20px 44px;flex-wrap:wrap;max-width:1100px;margin:0 auto}
.hx-logos-row img{width:140px;height:44px;object-fit:contain;filter:grayscale(1);opacity:.6;transition:opacity .2s}
.hx-logos-row img:hover{opacity:.9}
@media (max-width:640px){.hx-hero{padding:120px 16px 40px}.hx-logos-row{gap:14px 22px}.hx-logos-row img{width:96px;height:32px}.hx-cta-row .hx-btn{width:100%;justify-content:center}}

/* ---------- Section rhythm ---------- */
body.hai .hx-sec-title{font-size:clamp(27px,3.4vw,44px);font-weight:700;text-align:center;margin-bottom:12px}
body.hai .hx-sec-sub{font-size:17.5px;line-height:1.6;font-weight:400;color:var(--hx-muted);text-align:center;max-width:720px;margin:0 auto 40px}

/* ---------- Comparison table (pages) ---------- */
body.hai .comp-section{background:var(--hx-lav);padding:88px 24px}
body.hai .comp-inner{max-width:1000px}
body.hai .comp-title{font-family:"Cabinet Grotesk",Arial,sans-serif;font-size:clamp(27px,3.4vw,44px);font-weight:700;letter-spacing:-.02em;margin-bottom:10px}
body.hai .comp-sublabel{font-size:17.5px;line-height:1.6;font-weight:400;color:var(--hx-muted);margin-bottom:36px}
body.hai .comp-card{overflow:clip;border:1px solid var(--hx-border);border-radius:20px;box-shadow:0 1px 3px rgba(17,10,51,.05),0 20px 50px -30px rgba(17,10,51,.25)}
body.hai .comp-table thead th{position:sticky;top:96px;z-index:2;background:#ffffff;padding:22px 20px;border-bottom:1px solid var(--hx-border)}
body.hai .comp-table thead th:nth-child(2){background:#fff4d2}
body.hai .comp-table th:first-child{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--hx-muted);font-weight:700}
body.hai .comp-table td{font-size:16px;padding:15px 20px;border-bottom:1px solid #DDD6FF;color:var(--hx-ink)}
body.hai .comp-table td:first-child{font-weight:600}
body.hai .comp-table td:nth-child(2){background:#fff4d2}
body.hai .comp-table tr:hover td{background:#f6f4ff}
body.hai .comp-table tr:hover td:nth-child(2){background:#ffe8a5}
body.hai .row-group-label{background:var(--hx-lav)!important;color:var(--hx-indigo)!important;font-family:"Cabinet Grotesk",Arial,sans-serif;font-size:13px!important;letter-spacing:.12em!important;padding:12px 20px!important;border-bottom:1px solid var(--hx-lav-2)!important}
body.hai .comp-table tr.row-group td:nth-child(2){background:var(--hx-lav)!important}
/* Yes / No / Partial become clear marks; the words stay for screen readers and crawlers */
body.hai td.v-yes,body.hai td.v-no,body.hai td.v-comp{font-weight:700}
body.hai td.v-yes::before,body.hai td.v-no::before{content:"";display:inline-block;width:22px;height:22px;border-radius:50%;vertical-align:-6px;margin-right:8px;background-position:center;background-repeat:no-repeat;background-size:12px}
body.hai td.v-yes{color:var(--hx-green)}
body.hai td.v-yes::before{background-color:#ddd6ff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23341d99' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E")}
body.hai td.v-no{color:#5B6478;font-weight:600}
body.hai td.v-no::before{background-color:#DDD6FF;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a91a5' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M7 7l10 10M17 7L7 17'/%3E%3C/svg%3E")}
body.hai td.v-comp{color:var(--hx-ink);font-weight:600}
body.hai td.v-comp[title]{cursor:help}
body.hai td.v-comp:not(:first-child){font-size:15px}
body.hai td.v-comp[title]:not([title=""])::after{content:"i";display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background:var(--hx-lav-2);color:var(--hx-indigo);font:700 11px/1 Manrope,Arial,sans-serif;margin-left:6px;vertical-align:1px}
body.hai td.v-hai{font-weight:700}
body.hai .sibling-links{margin-top:14px;font-size:15px;color:var(--hx-muted);text-align:center}
body.hai .sibling-links a{color:var(--hx-indigo);font-weight:600;margin:0 6px}
@media (max-width:700px){body.hai .comp-section{padding:56px 12px}body.hai .comp-table td{font-size:14px;padding:12px 10px}body.hai .comp-table thead th{top:78px;padding:14px 8px}body.hai td.v-yes::before,body.hai td.v-no::before{display:block;margin:0 auto 4px}}

/* ---------- Second opinion ---------- */
body.hai .reasons{background:#ffffff;padding:88px 24px}
body.hai .reasons-title{font-family:"Cabinet Grotesk",Arial,sans-serif;font-size:clamp(27px,3.4vw,44px);font-weight:700;margin-bottom:46px}
body.hai .ask-sub{font-size:17.5px;line-height:1.6;font-weight:400;color:var(--hx-muted);max-width:720px}
body.hai .ask-btn{border:1px solid var(--hx-border);font-family:"Cabinet Grotesk",Arial,sans-serif;font-size:16px;font-weight:700;padding:14px 24px;box-shadow:0 1px 3px rgba(17,10,51,.05)}
body.hai .ask-btn:hover{border-color:var(--hx-navy)}

/* ---------- Integrations ---------- */
body.hai .integrations-section{background:var(--hx-soft);padding:64px 24px}
body.hai .integrations-label{font-family:"Cabinet Grotesk",Arial,sans-serif;font-size:24px;font-weight:700;color:var(--hx-ink);margin-bottom:28px}
body.hai .int-logo-item span{font-size:14px;color:var(--hx-muted);font-weight:600}

/* ---------- FAQ ---------- */

/* ---------- Testimonials (big-name customers) ---------- */
.hx-voices{background:var(--hx-lav);padding:88px 24px}
.hx-voices-inner{max-width:1180px;margin:0 auto}
.hx-voices-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr;grid-template-rows:auto auto;gap:20px}
.hx-v{background:#ffffff;border:1px solid var(--hx-border);border-radius:16px;padding:28px;display:flex;flex-direction:column;box-shadow:0 1px 3px rgba(17,10,51,.05);transition:transform .18s,box-shadow .18s,border-color .18s}
.hx-v:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(17,10,51,.12);border-color:var(--hx-navy)}
.hx-v-co{height:26px;width:auto;max-width:120px;object-fit:contain;object-position:left;margin-bottom:18px;filter:brightness(0);opacity:.72}
.hx-v-quote{font-family:"Cabinet Grotesk",Arial,sans-serif;font-size:22px;line-height:1.3;font-weight:700;color:var(--hx-ink);margin:0 0 12px}
.hx-v-ctx{font-size:16px;line-height:1.6;color:var(--hx-muted);margin:0 0 22px}
.hx-v-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.hx-v-person{display:flex;align-items:center;gap:12px}
.hx-v-person img{width:52px;height:52px;border-radius:50%;object-fit:cover;flex-shrink:0}
.hx-v-name{font-size:16px;font-weight:700;color:var(--hx-ink);line-height:1.3}
.hx-v-role{font-size:14px;color:var(--hx-muted);line-height:1.35}
.hx-v-watch{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:700;color:var(--hx-indigo);text-decoration:none;padding:9px 14px;border-radius:999px;background:var(--hx-lav)}
.hx-v-watch:hover{background:var(--hx-lav-2)}
.hx-v-feature{grid-row:span 2;background:var(--hx-navy);border-color:var(--hx-navy)}
.hx-v-feature:hover{border-color:var(--hx-navy)}
.hx-v-feature .hx-v-co{filter:brightness(0) invert(1);opacity:.95}
.hx-v-feature .hx-v-quote{color:#ffffff;font-size:28px}
.hx-v-feature .hx-v-ctx{color:#ddd6ff}
.hx-v-feature .hx-v-name{color:#ffffff}
.hx-v-feature .hx-v-role{color:#ddd6ff}
.hx-v-feature .hx-v-watch{background:var(--hx-yellow);color:var(--hx-navy)}
.hx-v-thumb{position:relative;display:block;border-radius:12px;overflow:hidden;aspect-ratio:16/9;margin:0 0 24px;background:#110A33}
.hx-v-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}
.hx-v-thumb:hover img{transform:scale(1.03)}
.hx-v-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:62px;height:62px;border-radius:50%;background:var(--hx-yellow);color:var(--hx-navy);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 20px rgba(17,10,51,.35)}
.hx-v-stat{font-family:"Cabinet Grotesk",Arial,sans-serif;font-size:40px;font-weight:700;color:var(--hx-indigo);line-height:1;margin:0 0 6px}
.hx-voices-all{display:block;width:max-content;margin:30px auto 0;font-weight:700;color:var(--hx-ink);text-decoration:none;border-bottom:2px solid var(--hx-yellow);padding-bottom:2px}
@media (max-width:1000px){.hx-voices-grid{grid-template-columns:1fr 1fr}.hx-v-feature{grid-column:1/-1;grid-row:auto}}
@media (max-width:640px){.hx-voices{padding:60px 16px}.hx-voices-grid{grid-template-columns:1fr}.hx-v-quote{font-size:20px}.hx-v-feature .hx-v-quote{font-size:23px}}

/* ---------- Closing CTA (homepage "Want to try it yourself?") ---------- */
.hx-cta{background:var(--hx-navy);padding:96px 24px;text-align:center;position:relative;overflow:hidden}
.hx-cta::before{content:"";position:absolute;inset:auto -10% -60% -10%;height:120%;background:radial-gradient(closest-side,rgba(255,198,30,.18),transparent);pointer-events:none}
.hx-cta-inner{position:relative;max-width:760px;margin:0 auto}
body.hai .hx-cta h2{color:#ffffff;font-size:clamp(27px,3.4vw,44px);font-weight:700;margin-bottom:14px}
.hx-cta p{color:#ddd6ff;font-size:17.5px;line-height:1.6;font-weight:400;margin:0 auto 32px;max-width:600px}
.hx-cta .hx-btn-ghost{color:#ffffff;border-color:rgba(255,255,255,.5)}
.hx-cta .hx-btn-ghost:hover{background:#ffffff;color:var(--hx-navy)}

/* ---------- Footer: same structure as humantic.ai ---------- */
.hx-disclaimer{font-size:13px;color:rgba(255,255,255,.5);line-height:1.6;max-width:640px}
.hx-disclaimer a{color:rgba(255,255,255,.7)}

@media (prefers-reduced-motion:reduce){body.hai *{transition:none!important;animation:none!important}}

/* chart empty state: no side column until competitors are picked */
body.hai-matrix .lens-wrap.is-empty{grid-template-columns:1fr!important;grid-template-areas:"plot" "insight"!important}
body.hai-matrix .lens-wrap.is-empty .lens-side{display:none}

/* anchors and scrollIntoView land below the fixed nav */
html:has(body.hai){scroll-padding-top:104px}

/* featured testimonial: official portrait on a brand gradient, play button opens the video */
.hx-v-portrait{aspect-ratio:auto;height:270px;background:radial-gradient(120% 90% at 50% 100%,#341D99 0%,#341d99 45%,#110A33 100%)}
.hx-v-portrait img{width:auto;height:100%;object-fit:contain;object-position:bottom;margin:0 auto}
.hx-v-portrait .hx-v-play{left:auto;right:18px;top:auto;bottom:18px;transform:none;width:54px;height:54px}

/* CTA + proof + customers sit after the table so the comparison comes first (AK, Oct 6) */
.hx-hero{padding-bottom:40px}
.hx-hero .hx-sub{margin-bottom:0}
.hx-after{background:#ffffff;padding:64px 24px 56px;text-align:center;border-bottom:1px solid var(--hx-border)}
.hx-after-inner{max-width:1100px;margin:0 auto}
.hx-after .hx-proof{margin-top:22px}
.hx-after-logos{margin-top:44px}
.hx-logos .hx-proof{margin:0 0 30px}
@media (max-width:640px){.hx-after{padding:44px 16px}.hx-after .hx-cta-row .hx-btn{width:100%;justify-content:center}}

/* comparison identity: same brand language as humantic.ai, but its own hero.
   A faint grid (the comparison table motif) and a light tint per category instead of the homepage yellow. */
body.hai{--hx-tint:#ddd6ff;--hx-tint-2:#f6f4ff}
body.cat-llms{--hx-tint:#ddd6ff;--hx-tint-2:#f6f4ff}
body.cat-broad{--hx-tint:#f6f4ff;--hx-tint-2:#DDD6FF}
body.cat-account{--hx-tint:#ddd6ff;--hx-tint-2:#f6f4ff}
body.cat-people{--hx-tint:#fff4d2;--hx-tint-2:#fff4d2}
body.cat-visitor{--hx-tint:#ffe8a5;--hx-tint-2:#fff4d2}
body.cat-intent{--hx-tint:#ddd6ff;--hx-tint-2:#f6f4ff}
body.cat-matrix{--hx-tint:#ddd6ff;--hx-tint-2:#f6f4ff}
body.hai .hx-hero{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--hx-tint) 0%,var(--hx-tint-2) 46%,#ffffff 100%)}
body.hai .hx-hero::before,body.hai-matrix .stage::before{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(17,10,51,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(17,10,51,.055) 1px,transparent 1px);
  background-size:48px 48px;background-position:center top;
  -webkit-mask-image:radial-gradient(ellipse 70% 80% at 50% 0%,#110A33 30%,transparent 80%);mask-image:radial-gradient(ellipse 70% 80% at 50% 0%,#110A33 30%,transparent 80%)}
body.hai .hx-hero-inner{position:relative}
body.hai-matrix{background:linear-gradient(180deg,var(--hx-tint) 0,var(--hx-tint-2) 380px,#ffffff 680px) no-repeat,#ffffff}
body.hai-matrix .stage{position:relative}
body.hai-matrix .stage::before{bottom:auto;height:640px;z-index:0}
body.hai-matrix .stage>*{position:relative;z-index:1}

/* picker logo chips: site white + border tokens (the script sets per-tool tints inline) */
body.hai-matrix .tile-logo-wrap{background:#ffffff!important;box-shadow:inset 0 0 0 1px #DDD6FF;border-radius:6px}


/* hero v2: split hero with an at-a-glance scorecard (pattern shared by Deel, Rippling, Intercom, Notion, Webflow) */
.hx-hero.has-score{text-align:left;padding-bottom:64px}
.hx-hero.has-score .hx-hero-inner{max-width:1200px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:center}
.hx-hero.has-score h1{margin-left:0;font-size:clamp(38px,6vw,76px)}
.hx-hero.has-score .hx-sub{margin-left:0;max-width:600px}
.hx-score{background:#ffffff;border:1px solid #DDD6FF;border-radius:20px;padding:22px;box-shadow:0 1px 3px rgba(17,10,51,.05),0 24px 60px -30px rgba(17,10,51,.3)}
.hx-score-head{display:flex;flex-direction:column;gap:2px;margin-bottom:16px}
.hx-score-head span{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#5b6478}
.hx-score-head b{font-family:"Cabinet Grotesk",Arial,sans-serif;font-size:22px;color:#110a33;letter-spacing:-.01em}
.hx-score-cols{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hx-score-col{border:1px solid #DDD6FF;border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:6px;background:#f6f4ff}
.hx-score-col.is-us{background:#fff4d2;border-color:#ffe8a5}
.hx-score-who{display:flex;align-items:center;gap:8px;min-height:28px;font-weight:700;font-size:15px;color:#110a33}
.hx-score-logo{height:22px;width:auto;max-width:110px;object-fit:contain}
.hx-score-logo-us{height:20px}
.hx-score-col.is-us .hx-score-who span{display:none}
.hx-score-big{font-family:"Cabinet Grotesk",Arial,sans-serif;font-size:44px;font-weight:700;line-height:1;color:#110a33;margin-top:6px}
.hx-score-big small{font-size:20px;color:#5b6478;margin-left:2px}
.hx-score-col.is-us .hx-score-big{color:#341d99}
.hx-score-lbl{font-size:13.5px;color:#5b6478;line-height:1.35}
.hx-score-g2{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:14px;color:#110a33;margin-top:6px;padding-top:10px;border-top:1px solid #DDD6FF}
.hx-score-g2 span{color:#5b6478}
.hx-score-g2 .hx-score-na{color:#5b6478}
.hx-score-link{display:inline-block;margin-top:16px;font-weight:700;font-size:15px;color:#110a33;text-decoration:none;border-bottom:2px solid #ffc61e;padding-bottom:1px}
.hx-score-link::after{content:"  \2193"}
.hx-score-src{font-size:12.5px;color:#5b6478;margin:10px 0 0}
@media (max-width:960px){.hx-hero.has-score .hx-hero-inner{grid-template-columns:1fr;gap:32px}.hx-hero.has-score{text-align:center}.hx-hero.has-score h1,.hx-hero.has-score .hx-sub{margin-left:auto;margin-right:auto}.hx-score{text-align:left}}
@media (max-width:420px){.hx-score-cols{grid-template-columns:1fr}}
/* matrix cover: Amar's equation as one slim line */
.hx-eq{margin:18px auto 0;font-size:15px;font-weight:600;color:#5b6478;letter-spacing:.01em}
.hx-eq i{font-style:normal;color:#341d99;margin:0 6px}
.hx-eq b{color:#110a33;background:linear-gradient(transparent 58%,#ffe8a5 58%,#ffe8a5 92%,transparent 92%);padding:0 3px}

/* Amar 1:40, "users are older": no readable text below 13px */
body.hai-matrix .deck-btn,body.hai-matrix .archetype-label,body.hai-matrix .lens-leader-tag,body.hai-matrix .lens-quad,
body.hai-matrix .lens-atitle,body.hai-matrix .lens-axis,body.hai-matrix .lens-insight-label,body.hai-matrix .lens-pill-group-label,
body.hai-matrix .board-summary-label,body.hai-matrix .lens-legend-head,body.hai-matrix .lens-legend-head span,
body.hai-matrix table.mx thead th,body.hai-matrix table.mx tbody tr.group-row td{font-size:13px!important}
body.hai-matrix .aeo-pill{font-size:14px}
body.hai-matrix .aeo-badge{font-size:12px;letter-spacing:.04em}
body.hai .comp-table thead th span,body.hai .comp-table thead th small{font-size:14px!important}
body.hai-matrix .th-leading,body.hai-matrix .leading-badge,body.hai-matrix .badge-leading,body.hai-matrix table.mx thead th span{font-size:13px!important}
body.hai-matrix .aeo-badge{font-size:13px}
.hx-score-head span{font-size:13px}
.hx-score-src{font-size:13px}


/* floating nav: slides away on scroll down, returns on scroll up */
/* when the nav slides away, the sticky table header moves up with it */
body.hai .comp-table thead th{transition:top .35s cubic-bezier(.2,.7,.2,1)}
body.hai:has(.hx-nav.hx-hide) .comp-table thead th{top:0}

/* ===== Oct 8 readability pass (AK): heavier body weight, darker long-form text, calmer testimonial rhythm ===== */
:where(body.hai) p,:where(body.hai) li{font-weight:500}
body.hai .hx-sub{font-weight:500}

body.hai .hx-v{padding:30px}
body.hai .hx-v-co{height:24px;max-width:112px;margin-bottom:20px;opacity:.85}
body.hai .hx-v-co[src*="sandler"]{height:30px;max-width:130px;margin-bottom:17px}
body.hai .hx-v-quote{margin-bottom:14px}
body.hai .hx-v-ctx{font-size:17px;line-height:1.65;color:#110A33;margin-bottom:26px}
body.hai .hx-v-role{font-size:15px;line-height:1.4}
body.hai .hx-v-name{font-size:17px}
body.hai .hx-v-feature .hx-v-ctx{color:#f6f4ff}
body.hai .hx-v-feature .hx-v-role{color:#ddd6ff}
/* the featured card spans two rows: let the portrait take the spare height instead of leaving a hole above the name */
body.hai .hx-v-feature .hx-v-portrait{flex:1 1 270px;height:auto;min-height:260px;max-height:440px}
body.hai .hx-v-feature .hx-v-foot{margin-top:0}
@media (max-width:1000px){body.hai .hx-v-feature .hx-v-portrait{flex:none;height:280px}}
body.hai .hx-voices-grid{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,1fr)}
body.hai .hx-v-feature .hx-v-portrait{max-height:none}
body.hai .hx-v-feature .hx-v-portrait img{width:100%;height:100%;object-fit:contain;object-position:bottom center}
@media (max-width:1000px){body.hai .hx-voices-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media (max-width:640px){body.hai .hx-voices-grid{grid-template-columns:minmax(0,1fr)}}
body.hai .hx-v-feature .hx-v-co{height:30px;max-width:140px}

/* customer logos: darker, and even out artwork that ships with lots of padding */
body.hai .hx-logos-row img{opacity:.85;filter:grayscale(1) contrast(1.15)}
body.hai .hx-logos-row img[alt="NextEra Energy"],body.hai .hx-logos-row img[alt="Happiest Minds"]{transform:scale(1.4)}
body.hai .hx-logos-row img[alt="Indegene"]{transform:scale(.85)}
body.hai .hx-logos-label{font-size:15px}
/* multi-tool cells (LLM page): one tool per line */
body.hai .comp-table td .cell-lines{display:block;line-height:1.55}

/* Footer bottom, as on the main site (AK, Oct 11): social icons, legal links and
   copyright on one row, sitting over the large Humantic AI wordmark. */
.hx-disclaimer{margin:40px auto 0;max-width:820px;text-align:center}
/* Small phones (320-380px): keep the nav pill on one line (Oct 13 2026, mobile pass) */

/* Homepage-style compact nav on scroll (desktop), Oct 13 2026 */

/* ===== Oct 20: per-page testimonial layouts (3 or 4 people) + one-to-one links block on the pages ===== */
/* v-f3 = big card + 3 small, v-f2 = big card + 2 small, v-p4 / v-p3 = no big card (plain cards) */
body.hai .hx-voices-grid.v-f3>.hx-v:last-child{grid-column:span 2}
body.hai .hx-voices-grid.v-f2>.hx-v:not(.hx-v-feature){grid-column:span 2}
body.hai .hx-voices-grid.v-p4{grid-template-columns:repeat(2,minmax(0,1fr))}
body.hai .hx-voices-grid.v-p3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1000px){
  body.hai .hx-voices-grid.v-f2>.hx-v:not(.hx-v-feature){grid-column:auto}
  body.hai .hx-voices-grid.v-p3{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.hai .hx-voices-grid.v-p3>.hx-v:last-child{grid-column:span 2}
}
@media (max-width:640px){
  body.hai .hx-voices-grid.v-f3>.hx-v:last-child,
  body.hai .hx-voices-grid.v-p3>.hx-v:last-child{grid-column:auto}
  body.hai .hx-voices-grid.v-p4,body.hai .hx-voices-grid.v-p3{grid-template-columns:minmax(0,1fr)}
}
.aeo-links.hx-aeo{max-width:1180px;margin:0 auto;padding:80px 24px 24px}
.hx-aeo .aeo-title{font-size:clamp(28px,3.4vw,40px);text-align:center;margin:0 0 32px}
.hx-aeo .aeo-rows{display:flex;flex-direction:column}
.hx-aeo .aeo-row{display:grid;grid-template-columns:260px 1fr;gap:14px;align-items:center;padding:14px 0;border-top:1px solid var(--hx-border)}
.hx-aeo .aeo-row:last-child{border-bottom:1px solid var(--hx-border)}
.hx-aeo .aeo-row-label{font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--hx-indigo)}
.hx-aeo .aeo-pills{display:flex;flex-wrap:wrap;gap:8px}
.hx-aeo .aeo-pill{display:inline-flex;align-items:center;gap:6px;font-size:15px;font-weight:700;color:var(--hx-ink);text-decoration:none;padding:8px 16px;border:1px solid var(--hx-border);border-radius:999px;background:#ffffff;transition:border-color .15s,background .15s}
.hx-aeo .aeo-pill:hover{border-color:var(--hx-navy);background:var(--hx-lav)}
.hx-aeo .aeo-badge{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--hx-muted);background:var(--hx-lav);padding:2px 8px;border-radius:999px}
.hx-aeo .aeo-more{text-align:center;margin:22px 0 0;font-size:16px;color:var(--hx-muted)}
.hx-aeo .aeo-more a{color:var(--hx-indigo);font-weight:700}
@media (max-width:720px){.aeo-links.hx-aeo{padding:56px 16px 16px}.hx-aeo .aeo-row{grid-template-columns:1fr;gap:10px}}
/* Oct 20 (Krish rule: a dark band never sits on the dark footer): the closing "Want To Try It Yourself?" band is cream with ink text. */
.hx-cta{background:#FFF4D2}
.hx-cta::before{background:radial-gradient(closest-side,rgba(255,198,30,.22),transparent)}
body.hai .hx-cta h2{color:#110A33}
.hx-cta p{color:#5B6478}
.hx-cta .hx-btn-ghost{color:#110A33;border-color:#110A33}
.hx-cta .hx-btn-ghost:hover{background:#110A33;color:#ffffff}
/* Oct 20 (AK: "this feels broken"): the logo strip is calmer and the Second Opinion block gets room to breathe. */
body.hai .hx-after .hx-logos-row { max-width: 980px; justify-content: space-evenly; gap: 24px 40px; }
body.hai .hx-after .hx-logos-row .hx-lg img { height: calc(var(--h, 30px) * .68); opacity: .72; }
body.hai .hx-after .hx-logos-row .hx-lg:hover img, body.hai .hx-after .hx-logos-row .hx-lg:focus-within img { opacity: 1; }
body.hai .hx-after { padding-bottom: 48px; }
body.hai .hx-after + .reasons { padding-top: 80px !important; padding-bottom: 80px !important; }
@media (max-width: 767px) { body.hai .hx-after .hx-logos-row .hx-lg img { height: calc(var(--h, 30px) * .6); } body.hai .hx-after + .reasons { padding-top: 56px !important; padding-bottom: 56px !important; } }



/* Oct 20 (AK): legacy footer rules removed. Every page uses the one shared shell footer (public/v2/shell/shell.css), same as the homepage. */
/* === trust bento (Oct 20 2026) === */
/* The trust wall (partials/hx-shoutout), rebuilt Oct 20 (AK: "Do a crazy good job").
   Editorial bento of real Shoutout posts on a warm cream field that dissolves into an ink and violet glow at the bottom: one large ink video tile (the CRO
   roundtable) plus a wide video card, a video card and a written post. Each card is one link (the stretched link covers
   the card, so the whole card clicks and keyboard focus rings the whole card). Hover lift and poster zoom on fine
   pointers only; a short staggered entrance when the wall scrolls in (skipped with reduced motion).
   Brand only: ink #110A33, gold #FFC61E, gold 300 #FFE8A5, violet #341D99 (one glow inside the ink tile), lavender
   #DDD6FF (text on ink), mist #F6F4FF, cream #FFF4D2, slate #5B6478, white. Cabinet Grotesk + Manrope, 24px corners,
   fixed shadow scale, 4px spacing steps. Old 3-card styles: 04-build/backups/trust-wall-oct20/shoutout.css. */
.hxs {
  --ink: #110A33; --gold: #FFC61E; --gold3: #FFE8A5; --violet: #341D99; --lav: #DDD6FF; --mist: #F6F4FF; --cream: #FFF4D2; --slate: #5B6478; --white: #fff;
  --sh-sm: 0 2px 8px rgba(17, 10, 51, .08); --sh-md: 0 12px 32px -12px rgba(17, 10, 51, .22); --sh-lg: 0 32px 64px -24px rgba(17, 10, 51, .35);
  --ease: cubic-bezier(.23, 1, .32, 1);
  --disp: "Cabinet Grotesk", Cabinetgrotesk, "Cabinet Fallback", Arial, sans-serif;
  --body: Manrope, "Manrope Fallback", Arial, sans-serif;
  --bg: var(--cream);
  position: relative; isolation: isolate; overflow: clip;
  padding: 56px 24px 56px; background: var(--bg); color: var(--ink); font-family: var(--body); scroll-margin-top: 84px;
}
.hxs--mist { --bg: var(--mist); }
.hxs--white { --bg: var(--white); }
.hxs *, .hxs *::before, .hxs *::after { box-sizing: border-box; }
.hxs-wrap { position: relative; z-index: 1; max-width: 1120px; margin: 0 auto; }

/* header: centred heading, one line of source + the way to the full board */
.hxs-head { text-align: center; margin: 0 0 28px; }
.hxs .hxs-h2 { margin: 0; font: 700 clamp(28px, 2.8vw, 36px)/1.1 var(--disp); letter-spacing: -.01em; color: var(--ink); text-wrap: balance; }
.hxs .hxs-sub { margin: 4px 0 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; column-gap: 12px; font: 500 15px/1.5 var(--body); color: var(--slate); }
/* the way to the whole board: a gold pill sitting on the glow */
.hxs-more { display: flex; justify-content: center; margin-top: 28px; }
.hxs-all { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 12px 24px; border-radius: 999px; background: var(--gold); color: var(--ink);
  font: 800 16px/1.2 var(--body); text-decoration: none; white-space: nowrap; box-shadow: 0 0 0 6px rgba(255, 232, 165, .16), var(--sh-md);
  transition: background-color .2s ease, transform .16s var(--ease); }
.hxs-all:active { transform: scale(.96); }
.hxs .hxs-all:focus-visible { outline: 2px solid var(--white); outline-offset: 3px; }
.hxs-arr { flex: none; transition: transform .25s var(--ease); }

/* the bento */
.hxs-bento { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.hxs-c { position: relative; display: flex; flex-direction: column; min-width: 0; padding: 8px; border-radius: 24px; background: var(--white);
  box-shadow: var(--sh-sm), 0 0 0 1px rgba(17, 10, 51, .05); transition: transform .35s var(--ease), box-shadow .35s var(--ease); }

/* video poster: inset 8px, so its corner is 24 - 8 = 16px */
.hxs-media { position: relative; flex: none; aspect-ratio: 16 / 9; border-radius: 16px; overflow: hidden; background: var(--ink); }
.hxs-media::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(17, 10, 51, .1); pointer-events: none; }
.hxs-media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.hxs-play { position: absolute; left: 50%; top: 50%; width: 52px; height: 52px; margin: -26px 0 0 -26px; border-radius: 50%; display: grid; place-items: center;
  background: var(--gold); color: var(--ink); box-shadow: 0 0 0 6px rgba(255, 232, 165, .5), var(--sh-md); transition: transform .3s var(--ease); }
.hxs-play svg { width: 20px; height: 20px; margin-left: 3px; }
.hxs-time { position: absolute; right: 8px; bottom: 8px; padding: 4px 8px; border-radius: 999px; background: rgba(17, 10, 51, .82); color: var(--white);
  font: 700 12px/1.2 var(--body); font-variant-numeric: tabular-nums; letter-spacing: .02em; }

/* words */
.hxs-body { display: flex; flex-direction: column; gap: 12px; flex: 1 1 auto; min-width: 0; padding: 14px 10px 4px; }
.hxs-who { display: flex; align-items: center; gap: 12px; }
.hxs-ph { position: relative; flex: none; width: 44px; height: 44px; border-radius: 50%; overflow: hidden; background: var(--lav); }
.hxs-ph img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* a transparent cut-out: zoom to the face */
.hxs-ph--cut img { position: absolute; left: 50%; top: 10%; width: 122%; max-width: none; height: auto; transform: translateX(-50%); }
.hxs-id { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.hxs-name { margin: 0; font: 700 15px/1.3 var(--body); color: var(--ink); }
.hxs-role { font: 500 13px/1.35 var(--body); color: var(--slate); }
.hxs-via { flex: none; color: var(--slate); }
.hxs-quote { margin: 0; font: 700 20px/1.25 var(--disp); letter-spacing: -.005em; color: var(--ink); text-wrap: pretty; hanging-punctuation: first; }
.hxs-hl { color: inherit; padding: 0 2px; margin: 0 -2px; background: linear-gradient(180deg, transparent 56%, var(--gold3) 56%, var(--gold3) 92%, transparent 92%);
  -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.hxs-text p { margin: 0; font: 500 14px/1.55 var(--body); color: var(--ink); text-wrap: pretty; }
.hxs-text p + p { margin-top: 8px; }
.hxs-foot { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.hxs-link { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; white-space: nowrap; font: 800 14px/1.2 var(--body); color: var(--ink); text-decoration: none; }
/* stretched link: the whole card is the link */
.hxs-link::after { content: ""; position: absolute; inset: 0; z-index: 2; border-radius: 24px; }
/* the ring goes round the whole card (below), not the words */
.hxs .hxs-c .hxs-link:focus-visible { outline: none !important; box-shadow: none !important; }
/* ink then white ring: the ink reads on the cream top, the white on the dark glow at the bottom */
.hxs-link:focus-visible::after { outline: 3px solid transparent; box-shadow: 0 0 0 3px var(--ink), 0 0 0 6px var(--white); }
.hxs-date { display: inline-flex; align-items: center; gap: 8px; font: 500 12px/1.3 var(--body); color: var(--slate); font-variant-numeric: tabular-nums; white-space: nowrap; }
.hxs-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* feature: the CRO roundtable on ink, the one dark, heavy tile */
.hxs-c--feature { background: var(--ink) radial-gradient(120% 70% at 100% 100%, rgba(52, 29, 153, .75), rgba(52, 29, 153, 0) 70%); color: var(--white);
  box-shadow: var(--sh-lg), inset 0 0 0 1px rgba(221, 214, 255, .1); }
.hxs-c--feature .hxs-media::after { box-shadow: inset 0 0 0 1px rgba(221, 214, 255, .14); }
.hxs-c--feature .hxs-play { width: 72px; height: 72px; margin: -36px 0 0 -36px; box-shadow: 0 0 0 8px rgba(255, 232, 165, .35), var(--sh-lg); }
.hxs-c--feature .hxs-play svg { width: 26px; height: 26px; margin-left: 4px; }
.hxs-c--feature .hxs-body { padding: 20px 16px 12px; gap: 16px; }
.hxs-c--feature .hxs-name { font: 700 clamp(24px, 2.2vw, 28px)/1.12 var(--disp); letter-spacing: -.01em; color: var(--white); text-wrap: balance; }
.hxs-c--feature .hxs-role { margin-top: 6px; font-size: 14px; color: var(--lav); }
.hxs-c--feature .hxs-via { color: var(--lav); }
.hxs-c--feature .hxs-text p { font-size: 17px; line-height: 1.55; color: var(--white); max-width: 46ch; }
.hxs-c--feature .hxs-link { min-height: 44px; padding: 0 20px; border-radius: 999px; background: var(--gold); color: var(--ink); transition: background-color .2s ease; }
.hxs-c--feature .hxs-date { color: var(--lav); }
/* the ring sits outside the card, so it stays ink for every card; over the dark glow it is white (below) */

/* video cards: the person is already in the poster, so one name and role line, no second face (AK, Oct 20) */
.hxs-id--line { display: block; font-size: 13px; line-height: 1.4; }
.hxs-id--line .hxs-name, .hxs-id--line .hxs-role { display: inline; }
.hxs-id--line .hxs-role::before { content: "\00A0\00B7\00A0"; }

/* written post: the quote carries the card */
.hxs-c--post .hxs-body { padding-top: 12px; gap: 16px; }
.hxs-c--post .hxs-quote { font-size: 22px; }
.hxs-c--post .hxs-text p { color: var(--slate); }
.hxs-c--wide .hxs-quote { font-size: 22px; }

/* tablet: the two wide tiles span the row, the feature lays its words beside the video */
@media (min-width: 768px) {
  .hxs-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hxs-c--feature, .hxs-c--wide { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); column-gap: 8px; align-items: stretch; }
  .hxs-c--wide { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .hxs-c--feature .hxs-media, .hxs-c--wide .hxs-media { align-self: center; }
  .hxs-c--feature .hxs-body { padding: 16px 16px 8px 16px; }
}
/* desktop: the editorial bento, feature left across two rows */
@media (min-width: 1024px) {
  .hxs-bento { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .hxs-c--feature { grid-column: 1 / 7; grid-row: 1 / 3; display: flex; }
  .hxs-c--feature .hxs-body { padding: 20px 16px 12px; }
  .hxs-c--wide { grid-column: 7 / 13; grid-row: 1; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); }
  .hxs-c--wide .hxs-quote { font-size: 20px; }
  .hxs-c--video { grid-column: 7 / 10; grid-row: 2; }
  .hxs-c--post { grid-column: 10 / 13; grid-row: 2; }
  /* a shorter set (only / limit) falls back to an even row */
  .hxs-bento--1 .hxs-c, .hxs-bento--2 .hxs-c, .hxs-bento--3 .hxs-c { grid-column: auto / span 6; grid-row: auto; }
  .hxs-bento--3 .hxs-c { grid-column: auto / span 4; }
}

/* fine pointers only: lift, zoom the poster, nudge the arrow */
@media (hover: hover) and (pointer: fine) {
  .hxs-c:hover { transform: translateY(-4px); box-shadow: var(--sh-lg), 0 0 0 1px rgba(17, 10, 51, .06); }
  .hxs-c--feature:hover { box-shadow: 0 40px 72px -24px rgba(17, 10, 51, .5), inset 0 0 0 1px rgba(221, 214, 255, .16); }
  .hxs-c:hover .hxs-media img { transform: scale(1.04); }
  .hxs-c:hover .hxs-play { transform: scale(1.08); }
  .hxs-c:hover .hxs-arr, .hxs-all:hover .hxs-arr { transform: translateX(3px); }
  .hxs-c--post:hover .hxs-arr { transform: translate(2px, -2px); }
  .hxs-c--feature:hover .hxs-link { background: var(--gold3); }
  .hxs-all:hover { background: var(--gold3); }
}
.hxs-c:active { transform: translateY(-2px) scale(.995); }

/* entrance: the tiles settle in once, in board order (JS adds hxs--pre / hxs--in; no JS = no hiding) */
.hxs--pre:not(.hxs--in) .hxs-c { opacity: 0; }
.hxs--in .hxs-c { animation: hxs-in .7s var(--ease) calc(var(--i, 0) * 80ms) backwards; }
@keyframes hxs-in { from { opacity: 0; transform: translateY(16px); filter: blur(4px); } to { opacity: 1; transform: none; filter: none; } }

/* phones */
@media (max-width: 767px) {
  .hxs { padding: 48px 16px 56px; --glow-h: 34%; }
  .hxs-more { margin-top: 32px; }
  .hxs-head { margin-bottom: 24px; }
  .hxs-sub { font-size: 14px; }
  .hxs-c--feature .hxs-play { width: 60px; height: 60px; margin: -30px 0 0 -30px; }
  .hxs-c--feature .hxs-text p { font-size: 15px; }
  .hxs-c--wide .hxs-quote, .hxs-c--post .hxs-quote { font-size: 20px; }
}
@media (max-width: 359px) {
  .hxs-c--feature .hxs-name { font-size: 22px; }
  .hxs-c--feature .hxs-foot { flex-wrap: wrap; }
  .hxs-c--feature .hxs-body { padding: 16px 12px 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .hxs-c, .hxs-media img, .hxs-play, .hxs-arr, .hxs-c--feature .hxs-link, .hxs-all { transition: none; }
  .hxs--in .hxs-c { animation: none; }
  .hxs-c:hover, .hxs-c:active { transform: none; }
  .hxs-c:hover .hxs-media img, .hxs-c:hover .hxs-play { transform: none; }
}

/* comparison pages: three cards (big video, wide card, quote card), no glow */
body.hai .hxs { padding: 72px 24px 72px; font-family: Manrope, Arial, sans-serif; }
body.hai .hxs h2, body.hai .hxs h3 { letter-spacing: normal; }
body.hai .hxs .hxs-h2 { font: 700 clamp(28px, 2.8vw, 36px)/1.1 var(--disp); letter-spacing: -.01em; margin: 0; text-align: center; }
body.hai .hxs .hxs-name { font: 700 15px/1.3 var(--body); margin: 0; }
body.hai .hxs .hxs-c--feature .hxs-name { font: 700 clamp(24px, 2.2vw, 28px)/1.12 var(--disp); letter-spacing: -.01em; color: var(--white); }
body.hai .hxs .hxs-quote { margin: 0; }
body.hai .hxs .hxs-text p { margin: 0; }
body.hai .hxs .hxs-link, body.hai .hxs .hxs-all { text-decoration: none; }
body.hai .hxs .hxs-c--feature .hxs-link { color: var(--ink); }
.hxs-c--static::after { display: none; }
.hxs-media--ph { background: var(--lav); }
.hxs-media--ph img { object-position: 50% 32%; }
@media (hover: hover) and (pointer: fine) { .hxs-c--static:hover { transform: none; box-shadow: var(--sh-sm), 0 0 0 1px rgba(17, 10, 51, .05); } .hxs-c--static:hover .hxs-media img { transform: none; } }
.hxs-bento--cmp .hxs-c--wide .hxs-body, .hxs-bento--cmp .hxs-c--post .hxs-body { justify-content: center; }
.hxs-bento--cmp .hxs-c--post .hxs-body { gap: 20px; }
.hxs-bento--cmp .hxs-c--post .hxs-ph { width: 56px; height: 56px; }
.hxs-bento--cmp3 .hxs-c--post .hxs-quote { font-size: 24px; line-height: 1.25; }
.hxs-bento--cmp3 .hxs-c--post .hxs-text p { font-size: 18px; line-height: 1.45; color: var(--ink); }
.hxs-bento--cmp4 .hxs-c--post .hxs-quote { font-size: 19px; line-height: 1.28; }
.hxs-bento--cmp4 .hxs-c--post .hxs-text p { font-size: 15px; line-height: 1.5; color: var(--ink); }
.hxs-bento--cmp4 .hxs-c--post .hxs-foot { flex-wrap: wrap; row-gap: 4px; }
@media (min-width: 768px) { .hxs-bento--cmp3 .hxs-c--post { grid-column: 1 / -1; } }
@media (min-width: 1024px) {
  .hxs-bento--cmp .hxs-c--feature { grid-column: 1 / 7; grid-row: 1 / 3; }
  .hxs-bento--cmp .hxs-c--wide { grid-column: 7 / 13; grid-row: 1; }
  .hxs-bento--cmp3 .hxs-c--post { grid-column: 7 / 13; grid-row: 2; }
  /* four cards: feature left over two rows, wide card top right, two quote cards side by side underneath */
  .hxs-bento--cmp4 .hxs-c--post:nth-child(3) { grid-column: 7 / 10; grid-row: 2; }
  .hxs-bento--cmp4 .hxs-c--post:nth-child(4) { grid-column: 10 / 13; grid-row: 2; }
}
@media (max-width: 767px) { body.hai .hxs { padding: 56px 16px 56px; } }
/* === /trust bento === */
/* === customer logos (Oct 20 2026) === */
/* One shared strip on every comparison page, same as the V2 proof band (public/v2/shared/proof.css, constants/v2/proof.js):
   each logo's box height (--h) is set so every wordmark carries the same visible ink area; greyscale at rest, own colour on
   hover or keyboard focus, 200 ms (none with reduced motion). */
body.hai .hx-logos-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: nowrap; gap: 24px 32px; width: 100%; max-width: 1100px; margin: 0 auto; }
body.hai .hx-logos-row .hx-lg { display: flex; align-items: center; justify-content: center; min-width: 0; height: 48px; }
body.hai .hx-logos-row .hx-lg img { display: block; width: auto; height: calc(var(--h, 30px) * .9); max-width: 100%; object-fit: contain; filter: grayscale(1); opacity: .65; transform: none; background: none; transition: filter 200ms ease, opacity 200ms ease; }
body.hai .hx-logos-row .hx-lg:hover img, body.hai .hx-logos-row .hx-lg:focus-within img, body.hai .hx-logos-row .hx-lg img:hover { filter: grayscale(0); opacity: 1; }
@media (max-width: 991px) { body.hai .hx-logos-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; } body.hai .hx-logos-row .hx-lg img { height: calc(var(--h, 30px) * .85); } }
@media (max-width: 767px) { body.hai .hx-logos-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; } body.hai .hx-logos-row .hx-lg { height: 40px; } body.hai .hx-logos-row .hx-lg img { height: calc(var(--h, 30px) * .7); } }
@media (max-width: 360px) { body.hai .hx-logos-row .hx-lg img { height: calc(var(--h, 30px) * .58); } }
@media (prefers-reduced-motion: reduce) { body.hai .hx-logos-row .hx-lg img { transition: none; } }
/* === /customer logos === */

/* Oct 20 (AK): comparison pages show when they were last updated, under the hero proof row. */
.hx-updated{margin:10px 0 0;font:600 13px/18px Manrope,"Manrope Fallback",Arial,sans-serif;color:#5B6478}

/* Oct 21 mobile pass (AK, real phone), /comparison hub only (body.hai-matrix): shorter page, small items two per row. Phones only; desktop untouched. */
@media (max-width: 767px) {
  body.hai-matrix .stage { padding-top: 88px; padding-bottom: 32px; }
  body.hai-matrix .hero.cover { padding-bottom: 16px; margin-bottom: 16px; }
  body.hai-matrix .cover .display { margin-bottom: 10px; }
  body.hai-matrix .cover .subtitle { font-size: 15px; line-height: 1.5; }
  body.hai-matrix .cover-equation { margin: 14px 0 10px; gap: 6px 8px; }
  body.hai-matrix .eq-item { font-size: 13px; padding: 6px 10px; }
  body.hai-matrix .deck { margin-bottom: 20px; }
  body.hai-matrix #deck-body { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  body.hai-matrix .archetype-label { min-height: 0; margin-bottom: 6px; align-items: center; }
  body.hai-matrix .tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  body.hai-matrix .tile { min-height: 44px; padding: 6px 8px; gap: 6px; }
  body.hai-matrix .tile-name { font-size: 13.5px; line-height: 1.2; min-width: 0; overflow-wrap: anywhere; }
  body.hai-matrix .lens-section { margin-top: 0; }
  body.hai-matrix .lens-controls { margin-top: 12px; padding: 12px; }
  body.hai-matrix .lens-pill { padding: 8px 12px; font-size: 14px; }
  body.hai-matrix .lens-controls .lens-pill-groups { margin-bottom: 10px; }
  body.hai-matrix .so-line { margin-top: 20px; }
  body.hai-matrix section.hx-logos { padding-bottom: 28px; }
  body.hai-matrix .hxs { padding: 40px 16px 40px; }
  body.hai-matrix .hxs-bento { gap: 12px; }
  body.hai-matrix .aeo-links.hx-aeo { padding: 40px 16px 8px; }
  body.hai-matrix .hx-aeo .aeo-title { margin-bottom: 16px; }
  body.hai-matrix .hx-aeo .aeo-row { padding-block: 10px; gap: 8px; }
  body.hai-matrix .hp2-compound { padding-top: 36px; padding-bottom: 36px; }
  body.hai-matrix .hp2-compound .hp2-caption { margin-bottom: 20px; }
  body.hai-matrix .hp2-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  body.hai-matrix .hp2-fstep { padding: 14px 12px; border-radius: 16px; }
  body.hai-matrix .hp2-fstep .hp2-dot { margin-bottom: 8px; }
  body.hai-matrix .hp2-compound .hp2-closer { margin-top: 20px; font-size: 15px; }
  body.hai-matrix .hx-cta { padding-top: 36px; padding-bottom: 36px; }
  body.hai-matrix .hxs-bento--cmp { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body.hai-matrix .hxs-bento--cmp .hxs-c--feature, body.hai-matrix .hxs-bento--cmp .hxs-c--wide { grid-column: 1 / -1; grid-row: auto; }
  body.hai-matrix .hxs-bento--cmp .hxs-c--post { grid-column: auto; grid-row: auto; }
  body.hai-matrix .hxs-c--wide .hxs-media.hxs-media--ph { aspect-ratio: 16 / 9 !important; height: auto; }
  body.hai-matrix .hxs-c--wide .hxs-media--ph img { object-position: 50% 22%; }
  body.hai-matrix .hxs-c--post .hxs-body { padding: 10px 6px 4px; gap: 10px; }
  body.hai-matrix .hxs-c--post .hxs-who { gap: 8px; }
  body.hai-matrix .hxs-bento--cmp4 .hxs-c--post .hxs-quote { font-size: 15px; line-height: 1.3; }
  body.hai-matrix .hxs-c--post .hxs-role { font-size: 12px; }
  body.hai-matrix .toggle button, body.hai-matrix .deck-btn, body.hai-matrix .lens-pill, body.hai-matrix .lens-empty button, body.hai-matrix .verify-btn { min-height: 44px; }
  body.hai-matrix .aeo-links .aeo-pill, body.hai-matrix a.aeo-pill { min-height: 44px !important; }
  body.hai-matrix .aeo-links .aeo-pills { gap: 6px; }
  body.hai-matrix .lens-pills { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  body.hai-matrix .lens-pills .lens-pill { padding: 6px 10px; font-size: 13.5px; line-height: 1.2; border-radius: 22px; }
  body.hai-matrix .lens-pill-groups { gap: 12px; }
  body.hai-matrix .lens-pill-group { gap: 6px; }
}

/* Customer video pill under the Mitel and Sandler logos (Oct 26). Absolutely placed under its logo, so the row keeps its size and shell.js fit. */
body.hai .hx-logos-row .hx-lg.hxl-has-vid{position:relative;height:auto;align-self:center}
body.hai .hx-logos-row .hx-lg.hxl-has-vid img{display:block}
body.hai .hx-logos-row .hxl-vid{position:absolute;left:50%;top:calc(100% + 8px);transform:translateX(-50%);display:inline-flex;align-items:center;gap:6px;padding:3px 8px;border-radius:999px;background:#DDD6FF;color:#110A33;font:700 12px/16px Manrope,"Manrope Fallback",Arial,sans-serif;text-decoration:none;white-space:nowrap;transition:background 200ms ease}
body.hai .hx-logos-row .hxl-vid:hover{background:#FFFFFF}
body.hai .hx-logos-row .hxl-vid:focus-visible{outline:2px solid #341D99;outline-offset:2px}
body.hai .hx-logos-row .hxl-vid-ico{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;border-radius:50%;background:#FFC61E;flex:none}
body.hai .hx-logos-row .hxl-vid-ico svg{display:block}
body.hai .hx-logos-row.is-grid3:has(.hxl-has-vid){row-gap:34px!important}
@media (prefers-reduced-motion:reduce){body.hai .hx-logos-row .hxl-vid{transition:none}}
/* Oct 28 (AK, G1): the closing band had 96px above and below its content (about 230px of empty cream around the sign-up callout). Oct 27 night: set to the site frame rhythm, 72px desktop, 56px tablet, 40px phone, same above and below. */
.hx-cta{padding:72px 24px}
@media (max-width:1023px){body.hai .hx-cta{padding:56px 24px}}
@media (max-width:767px){body.hai .hx-cta{padding:40px 24px}}
/* W8, Oct 26 PM (Amar #gtm Oct 21-22): his updated report tests on the comparison pages, redesigned in the site
   system. Draup page: #report-test. Frontier LLMs page: #agent-pi-vs-llms and #agent-miia-vs-llms.
   Brand only: ink, gold, gold 300, lavender (chips), mist, cream, slate, white. Cabinet Grotesk + Manrope, 24px corners. */
.rp{--ink:#110A33;--gold:#FFC61E;--gold3:#FFE8A5;--lav:#DDD6FF;--mist:#F6F4FF;--cream:#FFF4D2;--slate:#5B6478;--white:#fff;--sh-sm:0 2px 8px rgba(17,10,51,.08);--ease:cubic-bezier(.23,1,.32,1);--disp:"Cabinet Grotesk",Cabinetgrotesk,Arial,sans-serif;--body:Manrope,"Manrope Fallback",Arial,sans-serif;background:var(--white);color:var(--ink);font-family:var(--body);padding:72px 24px;scroll-margin-top:84px}
.rp--mist{background:var(--mist)}.rp--cream{background:var(--cream)}
.rp *,.rp *::before,.rp *::after{box-sizing:border-box}
:where(.rp) :where(p,ul,ol){margin:0;padding:0}:where(.rp) :where(ul,ol){list-style:none}
.rp-wrap{max-width:1120px;margin:0 auto}
.rp-head{text-align:center;max-width:800px;margin:0 auto 32px}
body.hai .rp h2{font:700 clamp(28px,2.8vw,36px)/1.1 var(--disp);letter-spacing:-.01em;margin:0;color:var(--ink);text-wrap:balance}
.rp-head p{margin-top:12px;font:500 16px/1.6 var(--body);color:var(--slate);text-wrap:pretty}
body.hai .rp h3{font:700 22px/1.2 var(--disp);letter-spacing:-.01em;margin:0 0 8px;color:var(--ink);text-wrap:balance}
body.hai .rp h4{font:700 18px/1.2 var(--disp);letter-spacing:-.01em;margin:0;color:var(--ink)}
.rp-txt{font:500 15px/1.6 var(--body);color:var(--ink);text-wrap:pretty}
.rp-txt+.rp-txt{margin-top:10px}
.rp-panel{background:var(--white);border-radius:24px;box-shadow:var(--sh-sm);padding:24px;min-width:0}
.rp-ink{background:var(--ink);color:#fff;border-radius:24px;padding:28px;min-width:0}
body.hai .rp .rp-ink h3,body.hai .rp .rp-ink h4{color:#fff}
.rp-ink .rp-txt{color:rgba(255,255,255,.88)}
.rp-src{margin-top:16px;font:500 13px/1.55 var(--body);color:var(--slate);text-wrap:pretty}
.rp a.rp-link{color:var(--ink);font-weight:700;border-bottom:2px solid var(--gold);padding-bottom:1px}
.rp-ink a.rp-link{color:#fff}
/* bullet lists: bold lead + Amar's sentence */
.rp-list li{position:relative;padding-left:20px;margin-top:10px;font:500 15px/1.55 var(--body);color:var(--ink);text-wrap:pretty}
.rp-list li::before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;border-radius:2px;background:var(--gold)}
.rp-list--slate li::before{background:var(--slate)}
.rp-list b{font-weight:800}
/* expandable detail: plus that turns to minus, as the homepage FAQ */
.rp-pm{flex:0 0 20px;width:20px;height:20px;position:relative;color:var(--ink)}
.rp-pm::before,.rp-pm::after{content:"";position:absolute;left:4px;right:4px;top:9px;height:2px;border-radius:2px;background:currentColor;transition:transform 200ms var(--ease)}
.rp-pm::after{transform:rotate(90deg)}
details[open]>summary .rp-pm::after{transform:rotate(0)}
.rp summary{list-style:none;cursor:pointer}.rp summary::-webkit-details-marker{display:none}
.rp summary:focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-radius:12px}
.rp-more{margin-top:24px;border-top:1px solid var(--lav)}
.rp-more>summary{display:flex;align-items:center;justify-content:center;gap:10px;padding:18px 8px 6px;font:700 17px/1.3 var(--disp);color:var(--ink)}
.rp-more-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;padding-top:16px}
.rp-prompt{background:var(--white);border-radius:16px;box-shadow:inset 0 0 0 1px var(--lav);padding:16px;font:500 14px/1.6 var(--body);color:var(--ink);white-space:pre-line;overflow-wrap:anywhere}
.rp-prompt+.rp-prompt{margin-top:12px}
.rp-prompt b{display:block;font-weight:800;margin-bottom:4px;white-space:normal}

/* Draup: verdict (ink) + 10-criteria scorecard */
.rp-duo{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:24px;align-items:start}
.rp-tally{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:4px;margin:16px 0 12px}
.rp-tally i{height:28px;border-radius:6px;background:var(--gold)}
.rp-tally i.t{background:var(--lav)}
.rp-tally i.d{background:transparent;box-shadow:inset 0 0 0 2px rgba(255,255,255,.6)}
.rp-key{display:flex;flex-wrap:wrap;gap:8px 20px;margin-bottom:16px;font:600 14px/1.3 var(--body);color:rgba(255,255,255,.88)}
.rp-key li{display:flex;align-items:baseline;gap:6px}
.rp-key b{font:700 26px/1 var(--disp);color:#fff}
.rp-fmt{margin-top:20px;border-top:1px solid rgba(255,255,255,.18);padding-top:16px;display:grid;gap:12px}
.rp-fmt li{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;font:500 14px/1.5 var(--body);color:rgba(255,255,255,.88)}
.rp-fmt b{color:#fff;font-weight:800}
.rp-sc{padding:12px 8px 16px}
.rp-sc-head,.rp-row>summary{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr) minmax(0,1fr) 104px 20px;gap:12px;align-items:center}
.rp-sc-head{padding:4px 12px 10px;font:700 13px/1.3 var(--body);color:var(--slate)}
.rp-row{border-top:1px solid var(--mist)}
.rp-row>summary{padding:11px 12px;border-radius:12px;transition:background-color 150ms ease}
@media (hover:hover){.rp-row>summary:hover{background:var(--mist)}}
.rp-row[open]>summary{background:var(--mist)}
.rp-crit{font:700 15px/1.3 var(--body);color:var(--ink)}
.rp-m{display:flex;align-items:center;gap:3px;min-width:0}
.rp-m i{flex:0 0 18px;height:8px;border-radius:4px;background:var(--mist);box-shadow:inset 0 0 0 1px var(--lav)}
.rp-m--h i.on{background:var(--gold);box-shadow:none}
.rp-m--d i.on{background:var(--slate);box-shadow:none}
.rp-m em{font:600 13px/1 var(--body);font-style:normal;color:var(--slate);margin-left:6px;white-space:nowrap}
.rp-who{display:none}
.rp-win{justify-self:start;font:800 12px/1 var(--body);padding:7px 10px;border-radius:999px;white-space:nowrap;background:var(--lav);color:var(--ink)}
.rp-win--h{background:var(--gold)}.rp-win--t{background:var(--white);box-shadow:inset 0 0 0 1px var(--lav)}
.rp-row .rp-txt{padding:10px 12px 16px;max-width:72ch}
.rp-note{margin:12px 12px 0;font:500 13px/1.55 var(--body);color:var(--slate)}
.rp-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;margin-top:24px}
.rp-close{max-width:820px;margin:32px auto 0;text-align:center}
.rp-close .rp-txt{text-align:left}
.rp-close .rp-step{margin-top:14px;display:inline-block;background:var(--white);border-radius:16px;box-shadow:var(--sh-sm);padding:12px 16px;font:600 15px/1.55 var(--body);color:var(--ink);text-wrap:pretty}

/* DISC chips: colour follows the primary letter, the letters always print */
.dc{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:26px;padding:0 8px;border-radius:999px;font:800 12.5px/1 var(--body);letter-spacing:.02em;white-space:nowrap}
.dc--D{background:var(--ink);color:#fff}.dc--I{background:var(--gold);color:var(--ink)}.dc--S{background:var(--lav);color:var(--ink)}.dc--C{background:var(--white);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.dc-arrow{display:inline-block;margin:0 4px;color:var(--slate);font-weight:700}
.rp-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 16px;margin-top:14px;font:600 13px/1.3 var(--body);color:var(--slate)}
.rp-legend li{display:flex;align-items:center;gap:6px}
/* Pi: three findings, each with its own proof */
.rp-trio{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) minmax(0,1.1fr);gap:16px}
.rp-trio .rp-panel{display:flex;flex-direction:column}
.rp-trio .rp-txt{margin-top:auto;padding-top:14px;font-size:14px;color:var(--slate)}
.rp-rows li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid var(--mist);font:600 14px/1.35 var(--body);color:var(--ink)}
.rp-rows li:first-child{border-top:0}
.rp-rows li small{display:block;font:500 12.5px/1.35 var(--body);color:var(--slate)}
.rp-rows .rp-hl{background:var(--mist);border-radius:12px;padding:8px 10px;border-top:0;margin-top:6px}
.rp-chips{display:flex;align-items:center;flex-wrap:nowrap}
.rp-who-line{font:600 14px/1.35 var(--body);color:var(--slate);margin-bottom:6px}
.rp-who-line b{color:var(--ink);font-weight:800}
/* Pi: all 40 reads, four brackets */
.rp-sub{margin:32px 0 16px;text-align:center}
.rp-sub .rp-txt{max-width:760px;margin:6px auto 0;color:var(--slate);text-align:center}
.rp-brk{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.rp-brk-col{padding:18px 16px 12px}
.rp-brk-col>p{font:500 13px/1.45 var(--body);color:var(--slate);margin:6px 0 10px;min-height:38px}
.rp-brk-col ol li,.rp-brk-colhead{display:grid;grid-template-columns:minmax(0,1fr) 46px 46px;gap:6px;align-items:center}
.rp-brk-colhead{font:700 12px/1.2 var(--body);color:var(--slate);padding-bottom:6px;text-align:center}
.rp-brk-colhead span:first-child{text-align:left}
/* Oct 27 night: the product column head is now the longer name (People Research Agent); let it use 8px of the gap each side so no word runs into the next column. */
.rp-brk-colhead span:nth-child(2){margin-inline:-8px}
.rp-brk-col ol li{padding:6px 0;border-top:1px solid var(--mist)}
.rp-brk-col ol li .dc{min-width:0;width:100%;padding:0 4px}
.rp-nm{font:700 13.5px/1.25 var(--body);color:var(--ink);min-width:0;overflow-wrap:anywhere}
.rp-nm small{display:block;font:500 12px/1.3 var(--body);color:var(--slate)}
.rp-nm .rp-flag{display:block;font:600 12px/1.3 var(--body);color:var(--ink);margin-top:2px}
/* Pi: Level 1 vs Level 2 */
.rp-levels{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:16px;margin-top:24px}
/* Miia: scores at a glance + bottom line */
.rp-bars{display:grid;gap:18px;margin-top:8px}
.rp-bg-h{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font:700 14px/1.3 var(--body);color:var(--ink)}
.rp-gap{font:800 12px/1 var(--body);background:var(--gold);color:var(--ink);border-radius:999px;padding:6px 9px;white-space:nowrap}
.rp-bar-row{display:grid;grid-template-columns:118px minmax(0,1fr) 92px;gap:10px;align-items:center;margin-top:8px;font:600 13px/1.2 var(--body);color:var(--slate)}
.rp-bar{height:14px;border-radius:999px;background:var(--mist);overflow:hidden}
.rp-bar span{display:block;height:100%;width:var(--w);border-radius:inherit;transform-origin:left center}
.rp-bar--h span{background:var(--gold)}.rp-bar--c span{background:var(--slate)}
.rp-bar-row b{font:700 15px/1 var(--body);color:var(--ink);font-variant-numeric:tabular-nums}
.rp-bar-row b small{font:600 12px/1 var(--body);color:var(--slate);margin-left:3px}
/* Miia: 14 criteria x 3 evaluations */
.rp-heat-wrap{margin-top:24px;overflow-x:auto}
.rp-heat{width:100%;border-collapse:separate;border-spacing:4px;font-family:var(--body)}
.rp-heat caption{caption-side:top;text-align:left;padding:0 4px 8px}
.rp-heat thead th{font:700 12.5px/1.3 var(--body);color:var(--slate);text-align:center;padding:4px;vertical-align:bottom}
.rp-heat tbody th,.rp-heat tfoot th{text-align:left;font:600 14px/1.3 var(--body);color:var(--ink);padding:6px 8px 6px 4px}
.rp-heat td{text-align:center;font:700 14px/1 var(--body);font-variant-numeric:tabular-nums;padding:10px 4px;border-radius:10px;background:var(--white);box-shadow:inset 0 0 0 1px var(--lav);white-space:nowrap;width:22%;color:var(--ink)}
.rp-heat td.h{background:var(--gold3);box-shadow:none}
.rp-heat td.c{background:var(--ink);color:#fff;box-shadow:none}
.rp-heat tfoot th{font-weight:800}
.rp-heat tfoot td{background:var(--mist);box-shadow:none;font-weight:800}
.rp-key-sw{display:inline-block;width:14px;height:14px;border-radius:4px;vertical-align:-2px}
.rp-key-sw.h{background:var(--gold3)}.rp-key-sw.c{background:var(--ink)}.rp-key-sw.e{background:var(--white);box-shadow:inset 0 0 0 1px var(--lav)}
/* motion: bars and tally fill once when they scroll in; static without JS or with reduced motion */
.rp-pre .rp-bar span{transform:scaleX(.02)}
.rp-pre .rp-tally i{transform:scaleY(.35);opacity:0}
.rp-in .rp-bar span,.rp-in .rp-tally i{transform:none;opacity:1;transition:transform 700ms var(--ease),opacity 300ms ease;transition-delay:calc(var(--i,0) * 60ms)}
@media (prefers-reduced-motion:reduce){.rp-pre .rp-bar span,.rp-pre .rp-tally i{transform:none;opacity:1}.rp-pm::before,.rp-pm::after{transition:none}}
@media (max-width:1023px){
  .rp-duo{grid-template-columns:minmax(0,1fr)}
  .rp-trio{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .rp-trio>:last-child{grid-column:1/-1}
  .rp-brk{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:767px){
  .rp{padding:56px 16px}
  .rp-head{margin-bottom:24px}.rp-head p{font-size:15px}
  .rp-ink{padding:22px}.rp-panel{padding:20px}
  .rp-pair,.rp-levels,.rp-more-body{grid-template-columns:minmax(0,1fr);gap:16px}
  .rp-trio{grid-template-columns:minmax(0,1fr)}
  .rp-sc{padding:8px 4px 12px}
  .rp-sc-head{display:none}
  .rp-row>summary{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 20px;grid-template-areas:"crit win pm" "d h h";row-gap:8px;padding:12px 8px}
  .rp-row>summary .rp-crit{grid-area:crit}.rp-row>summary .rp-m--d{grid-area:d}.rp-row>summary .rp-m--h{grid-area:h}.rp-row>summary .rp-win{grid-area:win;justify-self:end}.rp-row>summary .rp-pm{grid-area:pm}
  .rp-who{display:block;flex:0 0 100%;font:700 12px/1.2 var(--body);color:var(--ink);margin:0 0 4px;white-space:nowrap}
  .rp-m{flex-wrap:wrap;row-gap:4px}.rp-m i{flex-basis:14px}
  .rp-row .rp-txt{padding:8px 8px 14px}
  .rp-note{margin:10px 8px 0}
  .rp-fmt li{grid-template-columns:minmax(0,1fr);gap:2px}
  .rp-brk{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin:0 -16px;padding:0 16px 8px;scroll-padding:0 16px}
  .rp-brk-col{flex:0 0 86%;scroll-snap-align:start}
  .rp-bar-row{grid-template-columns:96px minmax(0,1fr) 78px;gap:8px}
  .rp-heat tbody th,.rp-heat tfoot th{font-size:13px}
  .rp-heat td{font-size:13px;padding:9px 2px}
  .rp-heat thead th{font-size:12px}
}
@media (max-width:479px){.rp-heat-wrap.rp-panel{padding:16px 8px}.rp-heat-wrap caption{padding:0 6px 8px}.rp-heat{border-spacing:3px}.rp-heat td{font-size:12px;padding:8px 1px;width:54px}.rp-heat tbody th,.rp-heat tfoot th{font-size:12px;padding:4px 2px;hyphens:auto}.rp-heat thead th{font-size:12px;padding:2px}}
@media (max-width:359px){.rp-brk-col{flex-basis:92%}.rp-bar-row{grid-template-columns:84px minmax(0,1fr) 70px}}
.rp-list+.rp-txt{margin-top:12px}
.rp-dim{color:var(--slate)}
.rp-legend--left{justify-content:flex-start;margin-top:0}
.rp-close h3{text-align:center}
body.hai .hx-hero .hx-sub a{color:#110A33;font-weight:700;border-bottom:2px solid #FFC61E;padding-bottom:1px}
/* SEO answer line under the hero sub (Oct 26, SEO pass 2): same type as .hx-sub, one step smaller */