/* Helix GTM design layer (run 7, 26 September 2026): the approved design sample applied to every page of the 7 sites.
   Loaded LAST on every page, after each site's own styles, brand.css and app.css, so it restyles the shared classes
   without touching content, forms or field names. Helix colours only: oxblood #641220, signal #C1121F,
   paper #FAF8F6, ink #1A0E10, clay #EAD9D5. Type: Archivo (display and text) and IBM Plex Mono (labels). */

:root {
  --h7-ox: #641220; --h7-signal: #C1121F; --h7-paper: #FAF8F6; --h7-ink: #1A0E10; --h7-clay: #EAD9D5;
  --h7-ink-70: rgba(26, 14, 16, .72); --h7-ink-12: rgba(26, 14, 16, .12); --h7-paper-70: rgba(250, 248, 246, .78);
  --h7-mono: "IBM Plex Mono", ui-monospace, Consolas, monospace;
  --h7-display: "Archivo", Arial, sans-serif;
}

/* ---------- base ---------- */
body { font-size: 17px; line-height: 1.55; overflow-wrap: anywhere; }
h1, h2, h3 { letter-spacing: -.025em; }
img, svg { max-width: 100%; height: auto; }
:focus-visible { outline: 3px solid var(--h7-signal) !important; outline-offset: 3px; }
.hx7-label, .hx-eyebrow, .hx-card-kicker, .hx-foot-h { font-family: var(--h7-mono) !important; font-size: 12px !important; font-weight: 600 !important; letter-spacing: .12em !important; text-transform: uppercase; }

/* ---------- header ---------- */
header.hx-header { border-bottom: 1.5px solid var(--h7-ink-12) !important; }
.hx-header-row { min-height: 64px; padding-top: 10px !important; padding-bottom: 10px !important; }
nav.hx-nav a { font-size: 12px; letter-spacing: .1em; border-bottom: 0 !important; }
nav.hx-nav a:hover { background: var(--h7-clay); color: var(--h7-ink) !important; }
nav.hx-nav a.is-active { color: var(--h7-ox) !important; box-shadow: inset 0 -2px 0 var(--h7-signal); }
nav.hx-nav a.hx-cta { background: var(--h7-ox); }
nav.hx-nav a.hx-cta:hover { background: var(--h7-signal); color: var(--h7-paper) !important; }

/* ---------- hero: sized so the whole first screen fits (G2) ---------- */
.hx-hero { padding: clamp(24px, 4.5vh, 64px) 0 clamp(28px, 5vh, 64px) !important; border-bottom: 1.5px solid var(--h7-ink-12) !important; }
.hx-hero .hx-hero-inner, .hx-hero .hero-content, .hx-hero .section-header { max-width: 980px; }
.hx-hero h1 {
  font-weight: 800 !important; letter-spacing: -.035em !important; line-height: .98 !important;
  font-size: clamp(34px, min(6.4vw, 8.2vh), 88px) !important; margin: 10px 0 14px !important; max-width: 18ch;
}
.hx-hero .hx-eyebrow, .hx-hero .hero-badge, .hx-hero .section-badge { color: var(--h7-ox) !important; display: inline-flex !important; align-items: baseline; gap: 10px; }
.hx-hero .hx-eyebrow::after { content: ""; width: 72px; border-bottom: 2px dotted var(--h7-signal); transform: translateY(-4px); }
.hx-hero p, .hx-hero .hx-lead, .hx-hero .hero-subtitle { font-size: clamp(16px, 1.25vw + 8px, 20px) !important; line-height: 1.5; }
.hx-hero .hx-byline { font-family: var(--h7-mono); font-size: 12.5px !important; }
.hx-cta-row, .hx-hero .hero-cta { display: flex; flex-wrap: wrap; gap: 12px 26px; align-items: center; margin-top: 18px !important; }

/* ---------- buttons: a solid oxblood block and an underlined text link ---------- */
.hx-btn, .hx-hero .btn-primary, .btn-primary {
  background: var(--h7-ox) !important; color: var(--h7-paper) !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  font-family: var(--h7-mono) !important; font-weight: 600 !important; font-size: 13px !important; letter-spacing: .08em; text-transform: uppercase;
  padding: 13px 18px !important; text-decoration: none !important; display: inline-block;
}
.hx-btn:hover, .hx-btn:focus-visible, .btn-primary:hover { background: var(--h7-signal) !important; color: var(--h7-paper) !important; }
.hx-btn-ghost, .hx-hero .btn-secondary, .btn-secondary {
  background: transparent !important; color: var(--h7-ink) !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  font-family: var(--h7-display) !important; font-weight: 700 !important; font-size: 18px !important; letter-spacing: -.01em; text-transform: none;
  padding: 6px 0 !important; text-decoration: underline !important; text-decoration-thickness: 3px !important; text-underline-offset: 7px; text-decoration-color: var(--h7-signal) !important;
}
.hx-btn-ghost:hover, .btn-secondary:hover { color: var(--h7-ox) !important; background: transparent !important; }

/* ---------- sections: a signal square and a rule open each one ---------- */
.hx-section { padding-top: clamp(40px, 6vw, 72px) !important; }
.hx-section + .hx-section { border-top: 1.5px solid var(--h7-ink-12); }
.hx-section > h2, .hx-qa > h2, .section-title {
  font-weight: 800 !important; letter-spacing: -.035em !important; line-height: 1 !important;
  font-size: clamp(30px, 4.6vw, 56px) !important; max-width: 20ch; color: var(--h7-ink);
}
.hx-section > h2::before, .hx-qa > h2::before { content: ""; display: block; width: 10px; height: 10px; background: var(--h7-signal); margin: 0 0 18px; }
.hx-sub, .hx-prose { color: var(--h7-ink-70); }

/* ---------- cards: a ruled grid, not floating boxes ---------- */
.hx-cards { gap: 0 !important; border-top: 1.5px solid var(--h7-ink); border-left: 1.5px solid var(--h7-ink); }
.hx-card, .hx-card-static { border: 0 !important; border-right: 1.5px solid var(--h7-ink) !important; border-bottom: 1.5px solid var(--h7-ink) !important; border-radius: 0 !important; box-shadow: none !important; background: var(--h7-paper) !important; }
.hx-card h3, .hx-card-static h3 { font-size: 22px !important; letter-spacing: -.02em; }
.hx-card a:hover { background: var(--h7-clay) !important; }
.feature-card, .pricing-card, .tool-card { border-radius: 0 !important; box-shadow: none !important; border: 1.5px solid var(--h7-ink) !important; }

/* ---------- tables, panels, code ---------- */
.hx-table th { font-family: var(--h7-mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; background: var(--h7-ink) !important; color: var(--h7-paper) !important; }
.hx-table td, .hx-table th { border-color: var(--h7-ink-12) !important; }
.hx-panel { border: 1.5px solid var(--h7-ink) !important; border-top: 6px solid var(--h7-ox) !important; border-radius: 0 !important; box-shadow: none !important; }
.hx-addr, .hx-code-block, pre { border-radius: 0 !important; }

/* ---------- forms ---------- */
.hx-field input[type=text], .hx-field input[type=number], .hx-field select, .hx-field textarea { border: 1.5px solid var(--h7-ink) !important; border-radius: 0 !important; background: #fff; }

/* ---------- questions: square plus and minus toggles ---------- */
.hx-qa details { border-top: 1.5px solid var(--h7-ink-12) !important; }
.hx-qa summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 6px 0; font-family: var(--h7-mono); font-size: 15px; font-weight: 600; }
.hx-qa summary::-webkit-details-marker { display: none; }
.hx-qa summary::after { content: "+"; flex: none; width: 28px; height: 28px; display: grid; place-items: center; border: 1.5px solid var(--h7-ink); font-size: 18px; line-height: 1; }
.hx-qa details[open] summary::after { content: "\2212"; background: var(--h7-signal); border-color: var(--h7-signal); color: var(--h7-paper); }
.hx-qa details p { padding-left: 14px; border-left: 2px solid var(--h7-signal); }

/* ---------- credentials band (D2b): straight after the hero on home pages ---------- */
.hx7-cred { background: var(--h7-clay); padding: clamp(32px, 5vw, 56px) 0; border-bottom: 1.5px solid var(--h7-ink-12); }
.hx7-cred-grid { display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr); gap: clamp(20px, 4vw, 48px); align-items: start; }
.hx7-cred-photo img { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; box-shadow: 8px 8px 0 var(--h7-ox); }
.hx7-cred h2 { font-size: clamp(30px, 4.4vw, 52px); font-weight: 800; letter-spacing: -.035em; line-height: 1; margin: 6px 0 6px; }
.hx7-label { color: var(--h7-ox); margin: 0; }
.hx7-role { margin: 0 0 16px; font-size: 18px; color: var(--h7-ink-70); }
.hx7-facts, .hx7-results, .hx7-awards { list-style: none; margin: 0; padding: 0; }
.hx7-facts { display: flex; flex-wrap: wrap; gap: 8px 28px; margin-bottom: 16px; }
.hx7-facts b { display: block; font-size: clamp(30px, 3.6vw, 44px); font-weight: 800; letter-spacing: -.04em; line-height: 1; color: var(--h7-ox); }
.hx7-facts span { font-size: 14px; color: var(--h7-ink-70); }
.hx7-results { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 1.5px solid var(--h7-ink); margin-bottom: 14px; }
.hx7-results li { padding: 12px 14px 12px 0; }
.hx7-results li + li { border-left: 1.5px solid rgba(26, 14, 16, .25); padding-left: 14px; }
.hx7-results b { display: block; font-size: 20px; letter-spacing: -.02em; }
.hx7-results span { display: block; font-size: 14px; color: var(--h7-ink-70); }
.hx7-awards li { font-size: 14.5px; padding: 4px 0 4px 16px; position: relative; }
.hx7-awards li::before { content: ""; position: absolute; left: 0; top: .75em; width: 7px; height: 7px; background: var(--h7-signal); }
.hx7-links { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 14px 0 0; }
.hx7-links a, .hx7-built-links a, .hx7-strip a { color: var(--h7-ink) !important; font-weight: 700; text-decoration: underline; text-decoration-color: var(--h7-signal); text-underline-offset: 4px; }
@media (max-width: 760px) { .hx7-cred-grid { grid-template-columns: 1fr; } .hx7-cred-photo { max-width: 160px; } .hx7-results { grid-template-columns: 1fr; } .hx7-results li + li { border-left: 0; padding-left: 0; border-top: 1px solid rgba(26, 14, 16, .2); } }

/* ---------- "Built by" strip (D2c): tool and plugin pages ---------- */
.hx7-strip { background: var(--h7-clay); border-bottom: 1.5px solid var(--h7-ink-12); }
.hx7-strip-row { display: flex; align-items: center; gap: 14px; padding-top: 10px; padding-bottom: 10px; flex-wrap: wrap; }
.hx7-strip-photo img { width: 44px; height: 44px; display: block; }
.hx7-strip p { margin: 0; flex: 1 1 260px; font-size: 15px; }

/* ---------- footer (D2d): ink band with the Built by block and a large wordmark ---------- */
footer.hx-footer { background: var(--h7-ink) !important; color: var(--h7-paper-70) !important; border-top: 0 !important; margin-top: 64px !important; padding-top: 40px !important; }
footer.hx-footer p, footer.hx-footer a { color: var(--h7-paper-70) !important; }
footer.hx-footer a:hover { color: var(--h7-paper) !important; text-decoration: underline; text-decoration-color: var(--h7-signal); }
footer.hx-footer .hx-foot-h, footer.hx-footer h4 { color: var(--h7-clay) !important; }
footer.hx-footer .hx-wordmark { color: var(--h7-paper) !important; }
footer.hx-footer .hx-footer-bottom { border-top-color: rgba(250, 248, 246, .2) !important; color: var(--h7-paper-70) !important; }
.hx7-built { display: flex; gap: 16px; align-items: flex-start; padding: 0 0 28px; margin: 0 0 28px; border-bottom: 1.5px solid rgba(250, 248, 246, .2); }
.hx7-built-photo img { width: 72px; height: 72px; display: block; }
.hx7-built p { margin: 0 0 6px !important; }
.hx7-built-h { color: var(--h7-paper) !important; font-weight: 800; font-size: 20px; letter-spacing: -.02em; }
.hx7-built-links { display: flex; flex-wrap: wrap; gap: 6px 18px; }
footer.hx-footer .hx7-built-links a { display: inline; margin: 0; color: var(--h7-paper) !important; }
.hx7-giant { font-family: var(--h7-display); font-weight: 800; letter-spacing: -.05em; line-height: .85; font-size: clamp(52px, 14vw, 200px); color: var(--h7-clay) !important; margin: 28px 0 8px !important; white-space: nowrap; overflow: hidden; }

/* ---------- About page (D2a) ---------- */
.hx7-about-grid { display: grid; grid-template-columns: minmax(0, 280px) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.hx7-about-grid .hx7-cred-photo img { box-shadow: 10px 10px 0 var(--h7-clay); }
.hx7-list { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--h7-ink); }
.hx7-list li { padding: 12px 0; border-bottom: 1.5px solid var(--h7-ink-12); }
.hx7-list b { font-weight: 800; }
@media (max-width: 760px) { .hx7-about-grid { grid-template-columns: 1fr; } .hx7-about-grid .hx7-cred-photo { max-width: 200px; } }

/* ---------- hub home (the approved sample) ---------- */
.h7-hero-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: center; }
.h7-hero-grid h1 .h7-not { color: var(--h7-signal); }
@media (max-width: 900px) { .h7-hero-grid { grid-template-columns: 1fr; } }
.h7-demo { margin: 0; width: 100%; max-width: 560px; justify-self: end; }
.h7-demo svg { display: block; width: 100%; height: auto; background: var(--h7-ink); box-shadow: 8px 8px 0 var(--h7-clay); }
.h7-demo text { font-family: var(--h7-mono); white-space: pre; }
.h7-demo figcaption { font-family: var(--h7-mono); font-size: 12.5px; color: var(--h7-ink-70); margin-top: 12px; }
@media (max-width: 900px) { .h7-demo { justify-self: start; } }
.t-line { animation: t-in .5s steps(24, end) both; clip-path: inset(0 100% 0 0); }
.t1 { animation-delay: .2s; } .t2 { animation-delay: .6s; } .t3 { animation-delay: 1.1s; } .t4 { animation-delay: 1.7s; } .t5 { animation-delay: 2.2s; }
.t6 { animation-delay: 2.7s; } .t7 { animation-delay: 3.2s; } .t8 { animation-delay: 3.7s; } .t9 { animation-delay: 4.2s; }
.t-cursor { animation: blink 1s steps(1) 4.8s infinite both; opacity: 0; }
@keyframes t-in { to { clip-path: inset(0 0 0 0); } }
@keyframes blink { 0% { opacity: 1; } 50% { opacity: 0; } }
.h7-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 40px); margin-top: 28px; }
.h7-col { border-left: 2px solid var(--h7-ox); padding: 2px 0 2px 18px; }
.h7-col h3 { font-size: 21px; margin: 8px 0 6px; }
.h7-col p { margin: 0; color: var(--h7-ink-70); }
@media (max-width: 820px) { .h7-cols { grid-template-columns: 1fr; } }
.h7-proof { background: var(--h7-clay); padding: clamp(40px, 6vw, 72px) 0; margin-top: clamp(40px, 6vw, 72px); }
.h7-proof h2 { font-size: clamp(38px, 7vw, 96px); font-weight: 800; letter-spacing: -.04em; line-height: .95; margin: 0; max-width: 14ch; }
.h7-note { font-family: var(--h7-mono); font-size: 13px; color: var(--h7-ink-70); margin: 18px 0 0; max-width: 72ch; }
.h7-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 2px solid var(--h7-ink); margin-top: 32px; }
.h7-stat { padding: 18px 16px 4px 0; }
.h7-stat + .h7-stat { border-left: 1.5px solid rgba(26, 14, 16, .25); padding-left: 16px; }
.h7-stat b { display: block; font-size: clamp(40px, 5.5vw, 72px); font-weight: 800; letter-spacing: -.04em; line-height: 1; color: var(--h7-ox); }
.h7-stat span { display: block; margin-top: 8px; font-size: 15px; color: var(--h7-ink-70); }
@media (max-width: 820px) { .h7-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .h7-stat:nth-child(3) { border-left: 0; padding-left: 0; } }
.h7-fit { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); align-items: start; margin-top: 28px; }
.h7-diagram { width: 100%; max-width: 480px; }
.h7-diagram text { font-family: var(--h7-mono); }
.flow { stroke-dasharray: 5 7; animation: flow 1.6s linear infinite; }
@keyframes flow { to { stroke-dashoffset: -24; } }
@media (max-width: 900px) { .h7-fit { grid-template-columns: 1fr; } .h7-diagram { margin: 0 auto; } }
.h7-panel dl { margin: 0; display: grid; grid-template-columns: 8em minmax(0, 1fr); gap: 8px 14px; font-size: 16px; }
.h7-panel dt { font-family: var(--h7-mono); font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--h7-ox); padding-top: 3px; }
.h7-panel dd { margin: 0; }
.h7-panel .tag { display: inline-block; background: var(--h7-ink); color: var(--h7-paper); padding: 3px 8px; }
@media (max-width: 420px) { .h7-panel dl { grid-template-columns: 1fr; gap: 2px; } }
.h7-icon { width: 36px; height: 36px; flex: none; }
.h7-icon .st { fill: none; stroke: var(--h7-ox); stroke-width: 2; stroke-linecap: square; }
.h7-icon .fl { fill: var(--h7-signal); }
.h7-card-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.h7-dev { display: inline-block; background: var(--h7-signal); color: var(--h7-paper); font-family: var(--h7-mono); font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; padding: 3px 8px; }

/* ---------- reduced motion: every animated item shows its final state and nothing moves ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .t-line { clip-path: none !important; }
  .t-cursor { opacity: 1 !important; }
}

/* ---------- addendum 1+3 (owner, 11:49 IST) ---------- */
/* Footer: five groups now (brand, site, connectors, Writing, contact) */
.hx-footer-grid { grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr !important; }
@media (max-width: 980px) { .hx-footer-grid { grid-template-columns: 1fr 1fr 1fr !important; } }
@media (max-width: 620px) { .hx-footer-grid { grid-template-columns: 1fr 1fr !important; } }
/* Credentials band results: each line word for word */
.hx7-results li { font-size: 15px; line-height: 1.45; }
/* Hub home: the approved draft's headline size, with less empty space above and below */
.hx-hero.h7-home { padding-top: clamp(14px, 2.5vh, 32px) !important; padding-bottom: clamp(20px, 3vh, 36px) !important; }
.hx-hero.h7-home h1 { font-size: clamp(48px, 9.2vw, 136px) !important; line-height: .92 !important; max-width: none; margin: 8px 0 12px !important; }
.hx-hero.h7-home .hx-eyebrow { margin-top: 0 !important; }
.hx7-cred { padding: clamp(24px, 3.5vw, 44px) 0; }
.hx-body > .hx-section:first-child { padding-top: clamp(28px, 4vw, 48px) !important; }
.h7-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 980px) { .h7-cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .h7-cols-4 { grid-template-columns: 1fr; } }

/* Photos keep their square size inside flex rows (the footer photo was squeezed to 25 x 72 px) */
.hx7-built-photo, .hx7-strip-photo, .hx7-cred-photo { flex: none; display: block; }
.hx7-built-photo { width: 72px; height: 72px; }
.hx7-strip-photo { width: 44px; height: 44px; }

/* ---------- independent verifier fixes (run 7, 14:50 IST) ---------- */
/* Tables: words wrap between words, never inside one; the tool name column keeps a readable width (the table box scrolls on its own if needed). */
.hx-table td, .hx-table th { overflow-wrap: break-word; word-break: normal; }
.hx-table td:first-child, .hx-table th:first-child { min-width: 9rem; }
/* GTM Alpha: centred section headings are centred as boxes too; stat labels never split a word. */
.section-header .section-title { margin-left: auto; margin-right: auto; }
.stat-label, .stat-number { overflow-wrap: normal; word-break: normal; }
@media (max-width: 480px) {
  .stats-grid { gap: 8px !important; }
  .stat-item { padding: 16px 6px !important; }
  .stat-label { font-size: 10px !important; letter-spacing: 0 !important; }
}
/* Verifier re-check (15:04 IST): every table (not only .hx-table) keeps whole words and scrolls in its own box on phones; the wordmark never splits a word. */
main table td, main table th { overflow-wrap: break-word; word-break: normal; }
@media (max-width: 600px) { main table { display: block; max-width: 100%; overflow-x: auto; } }
.hx-wordmark { overflow-wrap: normal; word-break: normal; }
/* Re-check 2 (15:15 IST): in auto-width tables Chrome treats break-word as a break point, so cells use normal wrapping
   (the table box scrolls instead) and only links may break; badges never split. */
main table td, main table th, .hx-table td, .hx-table th { overflow-wrap: normal; }
main table td a, .hx-table td a { overflow-wrap: anywhere; }
.free-badge { white-space: nowrap; }

/* ---------- run 8: plain EPIC scorecard (hero) ---------- */
.hx8-sc { margin: 0; background: #fff; border: 1.5px solid var(--h7-ink-12); border-top: 4px solid var(--h7-ox); padding: 20px 22px; max-width: 560px; }
.hx8-sc-k { font-family: var(--h7-mono); font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--h7-ox); margin: 0 0 8px; }
.hx8-sc-in { font-family: var(--h7-display); font-size: 18px; line-height: 1.35; color: var(--h7-ink); margin: 0 0 16px; }
.hx8-sc-rows { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.hx8-sc-rows li { display: grid; grid-template-columns: minmax(8.5rem, 11rem) 1fr auto; align-items: center; gap: 12px; font-size: 15px; }
.hx8-sc-l { color: var(--h7-ink); font-weight: 600; }
.hx8-sc-bar { height: 14px; background: var(--h7-clay); position: relative; overflow: hidden; }
.hx8-sc-bar i { position: absolute; inset: 0 auto 0 0; background: var(--h7-ink-70); animation: hx8-grow 1.1s cubic-bezier(.2,.7,.2,1) both; }
.hx8-sc-rows li.is-lead .hx8-sc-bar i { background: var(--h7-signal); }
.hx8-sc-rows li b { font-family: var(--h7-mono); font-size: 15px; color: var(--h7-ink); white-space: nowrap; }
.hx8-sc-rows li b small { font-size: 12px; font-weight: 400; color: var(--h7-ink-70); }
.hx8-sc-v { margin: 18px 0 8px; font-family: var(--h7-display); font-weight: 800; font-size: 22px; color: var(--h7-ox); }
.hx8-sc figcaption { font-size: 13.5px; line-height: 1.5; color: var(--h7-ink-70); }
.hx8-sc-cta { display: inline-block; margin-top: 12px; font-weight: 700; color: var(--h7-ink); text-decoration: underline; text-decoration-color: var(--h7-signal); text-decoration-thickness: 3px; text-underline-offset: 6px; }
@keyframes hx8-grow { from { width: 0; } }
@media (max-width: 420px) { .hx8-sc { padding: 16px 14px; } .hx8-sc-rows li { grid-template-columns: 1fr auto; } .hx8-sc-bar { grid-column: 1 / -1; grid-row: 2; } }
@media (prefers-reduced-motion: reduce) { .hx8-sc-bar i { animation: none; } }

/* ---------- run 8: story section (result tiles, recognition), proof line, collapsed developer block ---------- */
.hx8-story { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; }
@media (min-width: 900px) { .hx8-story { grid-template-columns: 200px minmax(0, 1fr); align-items: start; } }
.hx8-story .hx7-cred-photo img { width: 200px; height: 200px; object-fit: cover; }
.hx8-narr { font-size: 19px; line-height: 1.6; max-width: 62ch; color: var(--h7-ink); margin: 0 0 8px; }
.hx8-role { font-family: var(--h7-mono); font-size: 13px; color: var(--h7-ox); margin: 0 0 18px; }
.hx8-tiles { list-style: none; margin: 24px 0 8px; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
.hx8-tiles li { background: #fff; border: 1.5px solid var(--h7-ink-12); border-top: 3px solid var(--h7-ox); padding: 16px 16px 14px; }
.hx8-tile-co { display: block; font-family: var(--h7-mono); font-size: 12px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--h7-ox); }
.hx8-tiles b { display: block; font-family: var(--h7-display); font-size: 34px; font-weight: 800; line-height: 1.1; color: var(--h7-ink); margin-top: 6px; }
.hx8-tile-l { display: block; font-size: 14px; color: var(--h7-ink-70); margin-bottom: 8px; }
.hx8-tiles p { margin: 0; font-size: 14px; line-height: 1.45; color: var(--h7-ink); }
.hx8-awards { list-style: none; margin: 18px 0 8px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.hx8-awards li { background: var(--h7-clay); color: var(--h7-ink); font-size: 13.5px; padding: 6px 10px; }
.hx8-proof { margin-top: 24px; padding: 14px 16px; background: var(--h7-clay); border-left: 4px solid var(--h7-signal); font-size: 15px; line-height: 1.5; color: var(--h7-ink); }
.hx8-motions { list-style: none; margin: 20px 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 14px; }
.hx8-motions li { background: #fff; border: 1.5px solid var(--h7-ink-12); border-top: 4px solid var(--h7-ox); padding: 18px; }
.hx8-motions li b.hx8-letter { display: inline-block; width: 34px; height: 34px; line-height: 34px; text-align: center; background: var(--h7-signal); color: var(--h7-paper); font-family: var(--h7-display); font-size: 20px; margin-bottom: 8px; }
.hx8-motions h3 { margin: 4px 0 6px; }
.hx8-motions p { margin: 0 0 8px; }
.hx8-dev { margin-top: 32px; border: 1.5px solid var(--h7-ink-12); background: #fff; }
.hx8-dev > summary { cursor: pointer; padding: 12px 16px; font-family: var(--h7-mono); font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--h7-ox); }
.hx8-dev > div { padding: 0 16px 16px; }

/* ---------- run 8 (E9 colour rule: no dark backgrounds): clay footer and table heads; the approved layout is unchanged ---------- */
footer.hx-footer { background: var(--h7-clay) !important; color: var(--h7-ink) !important; border-top: 4px solid var(--h7-ox) !important; }
footer.hx-footer p, footer.hx-footer a { color: var(--h7-ink) !important; }
footer.hx-footer a:hover { color: var(--h7-ox) !important; }
footer.hx-footer .hx-foot-h, footer.hx-footer h4 { color: var(--h7-ox) !important; }
footer.hx-footer .hx-wordmark { color: var(--h7-ink) !important; }
footer.hx-footer .hx-footer-bottom { border-top-color: var(--h7-ink-12) !important; color: var(--h7-ink) !important; }
.hx7-built { border-bottom-color: var(--h7-ink-12); }
.hx7-built-h { color: var(--h7-ink) !important; }
footer.hx-footer .hx7-built-links a { color: var(--h7-ink) !important; }
.hx7-giant { color: rgba(26, 14, 16, .14) !important; }
.hx-table th { background: var(--h7-clay) !important; color: var(--h7-ink) !important; border-bottom: 2px solid var(--h7-ink) !important; }
.h7-demo svg { background: var(--h7-paper); }

/* ---------- run 8: gtmhelix.com hero headline fits its column (no word breaks) ---------- */
.hx-hero.h7-home.hx8-home h1 { font-size: clamp(40px, 4.6vw, 76px) !important; line-height: 1 !important; overflow-wrap: normal !important; word-break: normal !important; hyphens: manual !important; max-width: 14ch; }
.hx8-home .h7-hero-grid { align-items: center; }

/* run 8: scorecard bar widths as classes (strict CSP: no inline style attributes) */
.hx8-v0 { width: 0%; } .hx8-v1 { width: 10%; } .hx8-v2 { width: 20%; } .hx8-v3 { width: 30%; } .hx8-v4 { width: 40%; } .hx8-v5 { width: 50%; } .hx8-v6 { width: 60%; } .hx8-v7 { width: 70%; } .hx8-v8 { width: 80%; } .hx8-v9 { width: 90%; } .hx8-v10 { width: 100%; }

/* ---------- run 8 (E9): code blocks, rules and form fields in Helix colours (no dark areas, no default greys) ---------- */
pre, .hx-code-block, .hx-output pre, .hx-result-body pre { background: #fff !important; color: var(--h7-ink) !important; border: 1.5px solid var(--h7-ink-12) !important; border-left: 4px solid var(--h7-ox) !important; }
pre code { background: transparent !important; color: inherit !important; }
hr { border: 0 !important; border-top: 1.5px solid var(--h7-ink-12) !important; }
.hx-form textarea, .hx-form input:not([type="hidden"]), .hx-field textarea { border: 1.5px solid var(--h7-ink-70) !important; background: #fff !important; color: var(--h7-ink) !important; font: inherit; width: 100%; padding: 10px 12px; box-sizing: border-box; }
.hx7-results { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
@media (max-width: 700px) { .hx7-results { grid-template-columns: 1fr !important; } }

/* ---------- run 8 E5: visual library (work/run8/visuals.py); still under reduced motion ---------- */
.hx8-vis { margin: 24px 0; max-width: 560px; }
.hx8-vis svg { display: block; width: 100%; height: auto; overflow: visible; }
.hx8-vis figcaption { font-size: 13.5px; line-height: 1.5; color: var(--h7-ink-70); margin-top: 8px; }
.hx8-svg text { font-family: var(--h7-display); fill: var(--h7-ink); }
.hx8-svg .v-t { font-size: 14px; } .hx8-svg .v-ts { font-size: 12.5px; } .hx8-svg .v-tb { font-size: 14px; font-weight: 700; }
.hx8-svg .v-tm, .hx8-svg .v-k, .hx8-svg .v-tmp { font-family: var(--h7-mono); font-size: 12px; }
.hx8-svg .v-k { font-weight: 600; letter-spacing: .08em; fill: var(--h7-ox); text-transform: uppercase; }
.hx8-svg .v-tp, .hx8-svg .v-tmp { fill: var(--h7-paper); font-size: 12.5px; }
.hx8-svg .v-letter { font-size: 22px; font-weight: 800; fill: var(--h7-paper); }
.hx8-svg .v-big { font-size: 26px; font-weight: 800; }
.hx8-svg .v-oxt { fill: var(--h7-ox); } .hx8-svg .v-sigt { fill: var(--h7-signal); }
.hx8-svg .v-strike { text-decoration: line-through; fill: var(--h7-ink-70); }
.hx8-svg .v-ox { fill: var(--h7-ox); } .hx8-svg .v-sig { fill: var(--h7-signal); } .hx8-svg .v-ink7 { fill: rgba(26, 14, 16, .72); }
.hx8-svg .v-clay { fill: var(--h7-clay); } .hx8-svg .v-clayd { fill: #EAD9D5; stroke: var(--h7-ox); stroke-width: 1.5; } .hx8-svg .v-paper { fill: var(--h7-paper); }
.hx8-svg .v-paperb { fill: #fff; stroke: rgba(26, 14, 16, .3); stroke-width: 1.5; }
.hx8-svg .v-line { stroke: rgba(26, 14, 16, .3); stroke-width: 1.5; fill: none; }
.hx8-svg .v-link { stroke: var(--h7-ox); stroke-width: 2; fill: none; }
.hx8-svg .v-spine { stroke: var(--h7-ink); stroke-width: 3; fill: none; }
.hx8-svg .v-arc { stroke: var(--h7-clay); stroke-width: 18; fill: none; } .hx8-svg .v-arcv { stroke: var(--h7-signal); stroke-width: 18; fill: none; }
.hx8-svg .v-needle { stroke: var(--h7-ox); stroke-width: 4; }
.hx8-svg .v-ringseg { fill: none; stroke-width: 26; }
.hx8-svg .v-oxs { stroke: var(--h7-ox); } .hx8-svg .v-sigs { stroke: var(--h7-signal); } .hx8-svg .v-ink7s { stroke: rgba(26, 14, 16, .72); fill: rgba(26, 14, 16, .72); } .hx8-svg .v-clayds { stroke: #EAD9D5; }
.hx8-svg .v-clays { fill: var(--h7-clay); stroke: var(--h7-ox); stroke-width: 1.5; }
.hx8-svg .v-grow, .hx8-svg .v-grow-y, .hx8-svg .v-pop, .hx8-svg .v-drop, .hx8-svg .v-slide, .hx8-svg .v-fall { transform-box: fill-box; }
.hx8-svg .v-grow { transform-origin: left center; animation: hx8v-grow .9s cubic-bezier(.2,.7,.2,1) both; }
.hx8-svg .v-grow-y { transform-origin: center bottom; animation: hx8v-growy .9s cubic-bezier(.2,.7,.2,1) both; }
.hx8-svg .v-pop { transform-origin: center; animation: hx8v-pop .6s cubic-bezier(.2,.8,.3,1.2) both; }
.hx8-svg .v-drop { animation: hx8v-drop .6s ease-out both; }
.hx8-svg .v-slide { animation: hx8v-slide .7s ease-out both; }
.hx8-svg .v-fall { animation: hx8v-fall 1.2s ease-in both; }
.hx8-svg .v-fade { animation: hx8v-fade .8s ease-out both; }
.hx8-svg .v-draw { stroke-dasharray: 600; stroke-dashoffset: 0; animation: hx8v-draw 1.2s ease-out both; }
.hx8-svg .v-tilt { transform-box: view-box; transform-origin: 180px 70px; animation: hx8v-tilt 1.6s ease-in-out both; }
.hx8-svg .d1 { animation-delay: .1s; } .hx8-svg .d2 { animation-delay: .2s; } .hx8-svg .d3 { animation-delay: .3s; } .hx8-svg .d4 { animation-delay: .4s; } .hx8-svg .d5 { animation-delay: .5s; }
.hx8-svg .d6 { animation-delay: .6s; } .hx8-svg .d7 { animation-delay: .7s; } .hx8-svg .d8 { animation-delay: .8s; } .hx8-svg .d9 { animation-delay: .9s; }
@keyframes hx8v-grow { from { transform: scaleX(0); } }
@keyframes hx8v-growy { from { transform: scaleY(0); } }
@keyframes hx8v-pop { from { transform: scale(.4); opacity: 0; } }
@keyframes hx8v-drop { from { transform: translateY(-14px); opacity: 0; } }
@keyframes hx8v-slide { from { transform: translateX(-18px); opacity: 0; } }
@keyframes hx8v-fall { from { transform: translateY(0); opacity: 1; } to { transform: translateY(70px); opacity: 0; } }
@keyframes hx8v-fade { from { opacity: 0; } }
@keyframes hx8v-draw { from { stroke-dashoffset: 600; } }
@keyframes hx8v-tilt { 0% { transform: rotate(-6deg); } 100% { transform: rotate(0); } }
@media (prefers-reduced-motion: reduce) { .hx8-svg * { animation: none !important; } }

/* ---------- run 8 (E9, no dark areas): GTM Alpha /integration setup panel and /api-docs code blocks in light Helix colours ---------- */
.page-content { background: var(--h7-paper) !important; color: var(--h7-ink) !important; }
.page-content .section-title, .page-content .tab-panel h3, .page-content h3, .page-content h4 { color: var(--h7-ink) !important; }
.page-content .section-subtitle, .page-content p, .page-content li { color: var(--h7-ink) !important; }
.page-content .tab-btn { background: #fff !important; color: var(--h7-ink) !important; border-color: var(--h7-ink-12) !important; }
.page-content .tab-btn.active { background: var(--h7-ox) !important; color: var(--h7-paper) !important; }
.page-content .tab-content, .page-content .code-container { background: #fff !important; border-color: var(--h7-ink-12) !important; }
.page-content .code-header, .page-content .file-location { background: var(--h7-clay) !important; color: var(--h7-ink) !important; border-color: var(--h7-ink-12) !important; }
.code-block, .code-block .key, .code-block .string, .code-block .bracket, .code-block span { background: #fff !important; color: var(--h7-ink) !important; }
.code-block { border: 1.5px solid var(--h7-ink-12) !important; border-left: 4px solid var(--h7-ox) !important; }
hr { color: var(--h7-ink-12) !important; }
select, textarea, input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]) { border-color: var(--h7-ink-70); }
/* run 8 E5 check (E5-N1): readable GTM Alpha controls and links on the light setup panel; ring segments never filled */
.copy-btn { background: var(--h7-ox) !important; color: var(--h7-paper) !important; border: 0 !important; }
.page-content a:not(.btn-primary):not(.hx-btn):not(.tab-btn) { color: var(--h7-ox) !important; }
.page-content [style*="rgba(250, 248, 246"], .page-content [style*="#FAF8F6"] { color: var(--h7-ink) !important; }
.hx8-svg .v-ringseg { fill: none !important; }

/* ================= run 9 U1: one global header on every page of every site ================= */
header.hx-header { display: none !important; }
.hx9-gh { position: sticky; top: 0; z-index: 50; background: var(--h7-paper); border-bottom: 1.5px solid var(--h7-ink-12); }
.hx9-row1 { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 60px; }
.hx9-logo { display: inline-flex; align-items: center; gap: 10px; text-decoration: none !important; color: var(--h7-ink) !important; }
.hx9-mark { width: 30px; height: 30px; display: inline-grid; place-items: center; background: var(--h7-signal); color: var(--h7-paper); font: italic 700 20px/1 Georgia, serif; }
.hx9-word { font-family: var(--h7-mono); font-weight: 600; font-size: 14px; letter-spacing: .1em; text-transform: uppercase; }
.hx9-nav { display: flex; align-items: center; gap: 4px; }
.hx9-nav a { font-family: var(--h7-mono); font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--h7-ink) !important; text-decoration: none !important; padding: 10px 12px; }
.hx9-nav a:hover { background: var(--h7-clay); }
.hx9-nav a[aria-current="page"] { box-shadow: inset 0 -2px 0 var(--h7-signal); }
.hx9-cta, .hx9-mm-panel .hx9-cta { background: var(--h7-ox) !important; color: var(--h7-paper) !important; }
.hx9-nav .hx9-cta:hover { background: var(--h7-signal) !important; }
.hx9-row2 { border-top: 1px solid var(--h7-ink-12); background: #FAF8F6; }
.hx9-row2-in { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 18px; min-height: 42px; padding-top: 6px; padding-bottom: 6px; }
.hx9-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; font-size: 14px; color: var(--h7-ink-70); }
.hx9-crumbs a { color: var(--h7-ox) !important; text-decoration: underline; text-underline-offset: 3px; }
.hx9-crumbs [aria-current] { color: var(--h7-ink); font-weight: 600; }
.hx9-sep { color: var(--h7-ink-70); }
.hx9-site { display: flex; flex-wrap: wrap; gap: 2px 4px; }
.hx9-site a { font-size: 14px; font-weight: 600; color: var(--h7-ink) !important; text-decoration: none !important; padding: 6px 10px; }
.hx9-site a:hover { background: var(--h7-clay); }
.hx9-site a[aria-current="page"] { box-shadow: inset 0 -2px 0 var(--h7-signal); }
.hx9-mm { display: none; }
@media (max-width: 860px) {
  .hx9-nav { display: none; }
  .hx9-site { display: none; }
  .hx9-mm { display: block; position: fixed; right: 14px; bottom: 14px; z-index: 60; }
  .hx9-mm > summary { list-style: none; cursor: pointer; background: var(--h7-ox); color: var(--h7-paper); font-family: var(--h7-mono); font-weight: 600; font-size: 15px; letter-spacing: .08em; text-transform: uppercase; padding: 14px 22px; min-height: 52px; box-shadow: 0 2px 10px rgba(26, 14, 16, .25); }
  .hx9-mm > summary::-webkit-details-marker { display: none; }
  .hx9-mm[open] > summary { background: var(--h7-signal); }
  .hx9-mm-panel { position: fixed; left: 14px; right: 14px; bottom: 76px; background: var(--h7-paper); border: 1.5px solid var(--h7-ink-12); box-shadow: 0 6px 24px rgba(26, 14, 16, .2); display: grid; max-height: 70vh; overflow-y: auto; }
  .hx9-mm-panel a { display: block; padding: 15px 18px; min-height: 52px; font-size: 17px; font-weight: 600; color: var(--h7-ink) !important; text-decoration: none !important; border-bottom: 1px solid var(--h7-ink-12); }
  .hx9-mm-panel .hx9-cta { text-align: center; border-bottom: 0; }
  body { padding-bottom: 72px; }
}

/* ================= run 9 U3: one type scale for every site ================= */
:root { --fs-h1-home: clamp(36px, 4vw, 60px); --fs-h1: clamp(30px, 3vw, 44px); --fs-h2: clamp(24px, 2.2vw, 32px); --fs-h3: 20px; --fs-body: 17px; --fs-lead: 19px; }
body { font-size: var(--fs-body) !important; }
.hx-hero h1, main h1, .hero h1, .hero-title, .page-header h1, .ob h1 { font-size: var(--fs-h1) !important; line-height: 1.08 !important; letter-spacing: -.02em !important; overflow-wrap: normal !important; word-break: normal !important; }
.hx-hero.hx9-home h1, .hx9-home h1, .hx-hero.h7-home.hx8-home h1 { font-size: var(--fs-h1-home) !important; line-height: 1.02 !important; max-width: 16ch; }
main h2, .hx-section h2, .hx7-cred h2, section h2 { font-size: var(--fs-h2) !important; line-height: 1.12 !important; }
main h3, .hx-section h3, section h3 { font-size: var(--fs-h3) !important; line-height: 1.25 !important; }
.hx-lead, .hx-hero .hx-lead, .hero-subtitle { font-size: var(--fs-lead) !important; line-height: 1.5 !important; }
.hx-sub { font-size: 18px !important; }
.hx-hero { padding-top: clamp(20px, 3.5vh, 44px) !important; padding-bottom: clamp(20px, 3.5vh, 44px) !important; }

/* ================= run 9 U3: photo, never in the hero; sharp 2x source ================= */
.hx8-story { grid-template-columns: minmax(0, 1fr) !important; }
@media (min-width: 900px) { .hx8-story { grid-template-columns: 280px minmax(0, 1fr) !important; } }
.hx8-story .hx7-cred-photo, .hx9-photo { max-width: 280px; }
.hx8-story .hx7-cred-photo img, .hx9-photo img { width: 100% !important; height: auto !important; max-width: 280px; max-height: 40vh; aspect-ratio: 1 / 1; object-fit: cover; }
@media (max-width: 899px) { .hx8-story .hx7-cred-photo img, .hx9-photo img { max-width: 200px; } }

/* ================= run 9 U2: job chooser ================= */
.hx9-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 18px; }
.hx9-chip { font: 600 15px/1 var(--h7-display); padding: 11px 16px; min-height: 44px; background: #FAF8F6; color: var(--h7-ink); border: 1.5px solid var(--h7-ink-70); cursor: pointer; }
.hx9-chip[aria-pressed="true"] { background: var(--h7-ox); color: var(--h7-paper); border-color: var(--h7-ox); }
.hx9-jobs { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 16px; }
.hx9-job { background: #FAF8F6; border: 1.5px solid var(--h7-ink-12); border-top: 4px solid var(--h7-ox); padding: 18px; display: flex; flex-direction: column; transition: opacity .2s; }
.hx9-job h3 { margin: 4px 0 10px; }
.hx9-job-who { font-size: 14px; color: var(--h7-ink-70); margin: 0; }
.hx9-job dl { margin: 0 0 12px; display: grid; grid-template-columns: auto 1fr; gap: 6px 12px; font-size: 15px; }
.hx9-job dt { font-family: var(--h7-mono); font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--h7-ox); padding-top: 2px; }
.hx9-job dd { margin: 0; }
.hx9-job > p:last-child { margin: auto 0 0; }
.hx9-job .hx8-sc { max-width: none; padding: 12px; margin-bottom: 12px; border-top-width: 2px; }
.hx9-job .hx8-sc figcaption, .hx9-job .hx8-sc-cta { display: none; }
.hx9-job.is-dim { opacity: .38; }
.hx9-job.is-hit { border-top-color: var(--h7-signal); box-shadow: 0 0 0 2px var(--h7-signal); }
.hx9-all { margin-top: 18px; font-weight: 700; }
.hx9-all a { color: var(--h7-ink) !important; text-decoration: underline; text-decoration-color: var(--h7-signal); text-decoration-thickness: 3px; text-underline-offset: 6px; }
@media (prefers-reduced-motion: reduce) { .hx9-job { transition: none; } }
/* ================= run 9 U4: terminal and diagram ================= */
.hx8-vis.hx9-term, .hx8-vis.hx9-diagram { max-width: 520px; }
.hx8-svg .v-blink { animation: hx9-blink 1s steps(2, start) 6; }
@keyframes hx9-blink { to { visibility: hidden; } }
@media (prefers-reduced-motion: reduce) { .hx8-svg .v-blink { animation: none !important; } }
.hx9-gh .hx9-nav a.hx9-cta, .hx9-gh .hx9-mm-panel a.hx9-cta { color: var(--h7-paper) !important; background: var(--h7-ox) !important; }
.hx9-gh .hx9-nav a.hx9-cta:hover { background: var(--h7-signal) !important; }
.hx-section h2 { max-width: 30ch !important; }
.hx-hero h1, main h1 { max-width: 26ch !important; }
.hx-hero.hx9-home h1, .hx9-home h1 { max-width: 22ch !important; }
.hx9-steps { counter-reset: s; list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.hx9-steps li { counter-increment: s; background: #FAF8F6; border: 1.5px solid var(--h7-ink-12); border-left: 4px solid var(--h7-ox); padding: 12px 16px; font-weight: 600; }
.hx9-steps li::before { content: counter(s) ". "; color: var(--h7-ox); }
/* run 9 D7: paper instead of white inside visuals; smallest visual text at least 11 px on a 360 px screen */
.hx8-svg .v-paperb { fill: #FAF8F6 !important; }
.hx8-svg .v-tm, .hx8-svg .v-k, .hx8-svg .v-tmp { font-size: 12.5px !important; }
.hx8-svg .v-tp { font-size: 13px !important; }
.hx8-vis { min-width: 0; }
.hx9-visrow { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; margin: 20px 0; }
.hx8-proof { font-size: var(--fs-body) !important; }
.hx-section > h2, .hx-qa > h2, h2.section-title, .section-title { font-size: var(--fs-h2) !important; line-height: 1.12 !important; }
footer.hx-footer .hx-footer-bottom, footer.hx-footer .hx-footer-bottom *, .hx7-label, .hx-eyebrow { font-size: max(12px, 1em) !important; }