/* HugoMojo Unified Product UI System 2026-06-07
   Direction: popular-web-designs references from Stripe + Cal.com.
   Goal: clear decision-product layout, consistent type color, restrained cards, and mobile-first readability. */
:root {
  --hm-bg: #f7f9fc;
  --hm-bg-2: #eef3f8;
  --hm-surface: #ffffff;
  --hm-surface-2: #fbfdff;
  --hm-surface-3: #f6f9fc;
  --hm-heading: #061b31;
  --hm-text: #102033;
  --hm-muted: #5f6f82;
  --hm-soft: #8a96a8;
  --hm-line: #e5edf5;
  --hm-line-strong: #d4e0eb;
  --hm-accent: #b56f32;
  --hm-accent-strong: #8f5428;
  --hm-accent-soft: #fff7ed;
  --hm-warm: #b56f32;
  --hm-warm-soft: #fff7ed;
  --hm-success: #128343;
  --hm-danger: #b42318;
  --hm-shadow: 0 18px 44px rgba(15, 35, 60, 0.08), 0 1px 0 rgba(6, 27, 49, 0.04);
  --hm-shadow-soft: 0 12px 30px rgba(15, 35, 60, 0.06), 0 1px 0 rgba(6, 27, 49, 0.035);
  --hm-shadow-focus: 0 0 0 4px rgba(181, 111, 50, 0.16);
  --hm-radius: 14px;
  --hm-radius-sm: 10px;
  --hm-radius-xs: 7px;
  --hm-shell: 1120px;
  --hm-reading: 720px;
  --hm-form: 760px;
}

* { box-sizing: border-box; }
html {
  background: var(--hm-bg) !important;
  scroll-behavior: smooth;
}
body {
  min-height: 100vh;
  margin: 0;
  background:
    radial-gradient(circle at 50% -18%, rgba(181, 111, 50, 0.08), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, var(--hm-bg) 52%, #f3f6fa 100%) !important;
  color: var(--hm-text) !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  line-height: 1.55;
  letter-spacing: 0 !important;
  overflow-x: hidden;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
body::before,
body::after,
.mist-layer { display: none !important; content: none !important; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--hm-accent-strong); }
img, svg, video { max-width: 100%; }

.site-shell,
.shell,
.vault-shell,
.page {
  width: min(100% - 48px, var(--hm-shell)) !important;
  max-width: var(--hm-shell) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
#app {
  width: min(100% - 40px, var(--hm-form)) !important;
  max-width: var(--hm-form) !important;
  margin: 0 auto !important;
  padding: clamp(28px, 4vw, 48px) 0 72px !important;
}

.topbar,
.topline,
.nav,
.scanner-topbar {
  background: rgba(255, 255, 255, 0.92) !important;
  border-bottom: 1px solid var(--hm-line) !important;
  color: var(--hm-text) !important;
  box-shadow: none !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.topbar,
.scanner-topbar { position: sticky !important; top: 0 !important; z-index: 80 !important; }
.topline,
.nav {
  min-height: 72px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
}
.brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  color: var(--hm-heading) !important;
  font: 750 15px/1 Inter, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.brand-mark,
.mark {
  width: 36px !important;
  height: 36px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid var(--hm-line-strong) !important;
  border-radius: 10px !important;
  background: var(--hm-surface) !important;
  color: var(--hm-accent) !important;
  box-shadow: 0 1px 2px rgba(15, 35, 60, 0.04) !important;
  font: 800 13px/1 Inter, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.brand-name { color: var(--hm-heading) !important; font: 750 15px/1 Inter, system-ui, sans-serif !important; }
.links,
.nav-links,
.footer-links {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 18px !important;
  color: var(--hm-muted) !important;
  font: 650 14px/1.2 Inter, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.links a,
.nav-links a,
.footer-links a,
.toplink { color: inherit !important; }
.links a:hover,
.nav-links a:hover,
.nav-links a.active,
.footer-links a:hover,
.footer-links a.active,
.toplink:hover { color: var(--hm-accent) !important; }

.hero,
.page-hero,
header.hero,
.scanner-intro {
  min-height: auto !important;
  padding: clamp(52px, 7vw, 86px) 0 clamp(28px, 4vw, 46px) !important;
  display: block !important;
  text-align: left !important;
}
.hero-inner {
  width: min(100%, var(--hm-reading)) !important;
  margin: 0 !important;
  display: grid !important;
  justify-items: start !important;
  gap: 18px !important;
}
h1,
.hero-title,
.page-title,
.screen-title,
.result-name,
.display,
.content h1 {
  max-width: var(--hm-reading) !important;
  margin: 0 0 18px !important;
  color: var(--hm-heading) !important;
  font-family: Inter, system-ui, sans-serif !important;
  font-size: clamp(36px, 5.1vw, 56px) !important;
  font-weight: 780 !important;
  line-height: 1.07 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-align: left !important;
  text-wrap: balance;
  text-shadow: none !important;
  filter: none !important;
}
h1 span,
.hero-title span,
.section-head h2 span { display: block; }
h2,
.content h2,
.section-head h2,
.fit-copy h2,
.team-card h2,
.card h2,
.panel h2,
.delivery-card h2,
.pricing-name,
.upsell-title,
#delivery-match-title {
  margin: 0 0 14px !important;
  color: var(--hm-heading) !important;
  font-family: Inter, system-ui, sans-serif !important;
  font-size: clamp(25px, 3vw, 36px) !important;
  font-weight: 740 !important;
  line-height: 1.16 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-align: left !important;
  text-wrap: balance;
}
h3,
.contact-card h3,
.fit-return h3,
.answer-card strong,
.path-card h3,
.step-title,
.delivery-role-name {
  margin: 0 0 10px !important;
  color: var(--hm-heading) !important;
  font-family: Inter, system-ui, sans-serif !important;
  font-size: 19px !important;
  font-weight: 720 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
p,
.hero-desc,
.hero-copy,
.page-copy,
.lead,
.subtitle,
.sub-title,
.card-copy,
.purpose,
.content p,
.matrix-value,
.answer-card,
.path-card p,
.hero-note,
.step-copy,
.business-note,
.fine-print,
.direct {
  margin: 0 0 16px !important;
  color: var(--hm-muted) !important;
  font-family: Inter, system-ui, sans-serif !important;
  font-size: 16px !important;
  font-weight: 450 !important;
  line-height: 1.62 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-shadow: none !important;
}
.lead,
.page-copy,
.hero-desc,
.hero-copy,
.direct { max-width: 680px !important; font-size: 18px !important; }
.eyebrow,
.kicker,
.label,
.micro,
.module-kicker,
.contact-label,
.privacy-label,
.terms-label,
.refund-label,
.section-kicker,
.tag,
.role,
.badge,
.pay-tag,
.meta-line,
.price-note,
.matrix-key,
.brief-label,
.log-label,
.step-number,
.scanner-intro-kicker {
  display: inline-flex !important;
  align-items: center !important;
  width: fit-content !important;
  margin: 0 0 14px !important;
  color: var(--hm-accent) !important;
  font-family: Inter, system-ui, sans-serif !important;
  font-size: 12px !important;
  font-weight: 760 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.accent-serif { font-family: inherit !important; font-style: normal !important; color: inherit !important; }
.signal-dot,
.dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 999px !important;
  background: var(--hm-accent) !important;
  box-shadow: none !important;
}

.section,
.contact-section,
.privacy-section,
.terms-section,
.refund-section,
.path-section,
.fit-section,
.team-strip,
main.article {
  padding: clamp(40px, 6vw, 72px) 0 !important;
  border-top: 1px solid var(--hm-line) !important;
}
.section-head {
  width: min(100%, var(--hm-reading)) !important;
  max-width: var(--hm-reading) !important;
  margin: 0 0 26px !important;
  display: grid !important;
  justify-items: start !important;
  gap: 8px !important;
  text-align: left !important;
}
.section-head h2 { font-size: clamp(28px, 3.4vw, 38px) !important; }
.section-head p { max-width: 620px !important; }

.panel,
.card,
.delivery-card,
.pricing-card,
.contact-card,
.privacy-card,
.terms-card,
.refund-card,
.answer-card,
.path-card,
.cta-card,
.fit-panel,
.fit-card,
.fit-return,
.team-card,
.content,
.action,
.signal,
.brief-item,
.log-cell,
.scan-brief-item,
.day,
.table-wrap,
.role-card,
.pay-option,
.result-blueprint,
.trust-strip,
.terminal-card,
.next-steps,
.step-card,
.delivery-role-card,
.diagnosis-card,
.atomic-action,
.mechanism-proof,
.answer-review,
.preview-proof-item,
.locked-preview {
  border: 1px solid var(--hm-line) !important;
  border-radius: var(--hm-radius) !important;
  background: var(--hm-surface) !important;
  color: var(--hm-text) !important;
  box-shadow: var(--hm-shadow-soft) !important;
  text-shadow: none !important;
  filter: none !important;
}
.panel,
.card,
.delivery-card,
.pricing-card,
.contact-card,
.privacy-card,
.terms-card,
.refund-card,
.fit-panel,
.team-card,
.content,
.terminal-card,
.next-steps {
  padding: clamp(22px, 3vw, 34px) !important;
}
.answer-card,
.path-card,
.pay-option,
.signal,
.brief-item,
.log-cell,
.scan-brief-item,
.day,
.action,
.step-card,
.delivery-role-card,
.diagnosis-card,
.atomic-action,
.mechanism-proof,
.answer-review,
.preview-proof-item,
.locked-preview { padding: 18px !important; }
.answer-card:hover,
.path-card:hover,
.pay-option:hover,
.delivery-card:hover,
.pricing-card:hover,
.btn-opt:hover {
  transform: translateY(-2px);
  border-color: var(--hm-line-strong) !important;
  box-shadow: var(--hm-shadow) !important;
}
.card::before { display: none !important; }

.grid,
.grid-2,
.grid-3,
.path-grid,
.pricing-grid,
.contact-grid,
.privacy-grid,
.terms-grid,
.refund-grid,
.cards-3,
.brief-grid,
.scan-brief,
.fit-grid,
.fit-panel-wide,
.delivery-diagnosis-grid,
.business-form-grid {
  display: grid !important;
  gap: 18px !important;
  align-items: stretch !important;
}
.grid,
.grid-3,
.path-grid,
.cards-3,
.brief-grid,
.scan-brief { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
.grid-2,
.pricing-grid,
.contact-grid,
.privacy-grid,
.terms-grid,
.refund-grid,
.fit-panel-wide,
.delivery-diagnosis-grid,
.business-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
.fit-panel-wide {
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.88fr) !important;
  align-items: start !important;
  padding: clamp(24px, 4vw, 34px) !important;
}
.fit-copy h2 { max-width: 620px !important; font-size: clamp(28px, 3.2vw, 36px) !important; }
.fit-copy p { max-width: 640px !important; }
.fit-return { padding: 22px !important; }
.fit-return ul,
.pay-items,
.list,
.sprint,
.timeline,
.next-steps { display: grid !important; gap: 10px !important; margin: 0 !important; padding: 0 !important; list-style: none !important; }
.fit-return li,
.check-list span,
.pay-item,
.list-item,
.timeline li,
.content li {
  min-height: 44px;
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  padding: 11px 13px !important;
  border: 1px solid var(--hm-line) !important;
  border-radius: var(--hm-radius-sm) !important;
  background: var(--hm-surface-2) !important;
  color: var(--hm-text) !important;
  font-family: Inter, system-ui, sans-serif !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.42 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.fit-return li::before,
.check-list span::before,
.pay-item span:first-child,
.content li::marker {
  color: var(--hm-accent) !important;
}
.fit-return li::before,
.check-list span::before {
  content: "";
  flex: 0 0 8px;
  width: 8px;
  height: 8px;
  margin-top: 7px;
  border-radius: 999px;
  background: var(--hm-accent);
}
.check-list,
.check-list-wide { display: grid !important; gap: 12px !important; }
.check-list-wide { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; grid-column: 1 / -1 !important; }

.path-top,
.path-left,
.path-title-row,
.delivery-role-top,
.pay-name,
.terminal-stat {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
.path-top { justify-content: space-between !important; margin-bottom: 14px !important; }
.path-left { min-width: 0 !important; }
.path-title-row { flex-wrap: wrap !important; gap: 8px !important; }
.path-title-row h3 { margin: 0 !important; }
.path-mark,
.role-animal,
.delivery-role-animal {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid var(--hm-line-strong) !important;
  border-radius: 11px !important;
  background: var(--hm-surface-3) !important;
  color: var(--hm-accent) !important;
  font-size: 20px !important;
  box-shadow: none !important;
}
.role-label,
.path-type,
.badge,
.pay-tag,
.delivery-role-mode,
.role-mode {
  display: inline-flex !important;
  align-items: center !important;
  width: fit-content !important;
  min-height: 24px !important;
  padding: 4px 8px !important;
  border-radius: 999px !important;
  border: 1px solid var(--hm-line) !important;
  background: var(--hm-accent-soft) !important;
  color: var(--hm-accent) !important;
  font-family: Inter, system-ui, sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.path-card p { margin: 0 !important; color: var(--hm-muted) !important; }

.btn-primary,
.btn-secondary,
.link-secondary,
.btn,
.btn.primary,
.btn.secondary,
.cta-buy,
button[type="submit"],
.pay-cta {
  min-height: 50px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  border-radius: 10px !important;
  padding: 0 20px !important;
  font-family: Inter, system-ui, sans-serif !important;
  font-size: 15px !important;
  font-weight: 720 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-decoration: none !important;
  transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease !important;
  cursor: pointer;
}
.btn-primary,
.btn,
.btn.primary,
.cta-buy,
button[type="submit"],
.pay-cta {
  border: 1px solid var(--hm-accent) !important;
  background: var(--hm-accent) !important;
  color: #ffffff !important;
  box-shadow: 0 10px 24px rgba(181, 111, 50, 0.22) !important;
}
.btn-secondary,
.btn.secondary,
.link-secondary {
  border: 1px solid var(--hm-line-strong) !important;
  background: var(--hm-surface) !important;
  color: var(--hm-text) !important;
  box-shadow: none !important;
}
.btn-primary:hover,
.btn:hover,
.btn.primary:hover,
.cta-buy:hover,
button[type="submit"]:hover,
.pay-cta:hover {
  transform: translateY(-2px);
  background: var(--hm-accent-strong) !important;
  border-color: var(--hm-accent-strong) !important;
  color: #ffffff !important;
}
.btn-secondary:hover,
.btn.secondary:hover,
.link-secondary:hover {
  transform: translateY(-2px);
  border-color: var(--hm-line-strong) !important;
  color: var(--hm-accent) !important;
}
.cta-row,
.action-stack,
.actions,
.cta-stack {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 12px !important;
}
.cta-stack .hero-note { flex-basis: 100% !important; max-width: 620px !important; margin-top: 2px !important; }

.btn-opt,
.email-input,
input,
textarea,
select {
  border: 1px solid var(--hm-line) !important;
  border-radius: 12px !important;
  background: var(--hm-surface) !important;
  color: var(--hm-text) !important;
  box-shadow: none !important;
  font-family: Inter, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.btn-opt {
  width: 100% !important;
  min-height: 58px !important;
  padding: 15px 16px !important;
  color: var(--hm-text) !important;
  font-size: 16px !important;
  font-weight: 650 !important;
  line-height: 1.36 !important;
  text-align: left !important;
  transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease !important;
}
.btn-opt:hover,
.btn-opt.selected,
.btn-opt:focus-visible {
  border-color: rgba(181, 111, 50, 0.34) !important;
  background: var(--hm-accent-soft) !important;
  box-shadow: var(--hm-shadow-focus) !important;
  outline: none !important;
}
.btn-opt::after { display: none !important; }
.email-input,
input,
textarea,
select {
  min-height: 52px !important;
  padding: 12px 14px !important;
  font-size: 15px !important;
}
textarea { min-height: 132px !important; resize: vertical; }
input:focus,
textarea:focus,
select:focus,
.email-input:focus {
  border-color: rgba(181, 111, 50, 0.42) !important;
  box-shadow: var(--hm-shadow-focus) !important;
  outline: none !important;
}

/* Scanner and result flow */
body.scanner-page {
  display: block !important;
  align-items: initial !important;
  justify-content: initial !important;
  padding-top: 0 !important;
  background:
    radial-gradient(circle at 50% -18%, rgba(181, 111, 50, 0.08), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, var(--hm-bg) 58%, #f3f6fa 100%) !important;
}
.scanner-page #app { width: min(100% - 40px, 760px) !important; max-width: 760px !important; padding-top: clamp(28px, 4vw, 46px) !important; }
.scanner-page .scanner-intro {
  padding: 0 0 22px !important;
  margin: 0 auto 10px !important;
  max-width: 760px !important;
  text-align: center !important;
}
.scanner-page .scanner-intro h1 {
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  font-size: clamp(36px, 5vw, 54px) !important;
  line-height: 1.08 !important;
  text-align: center !important;
}
.scanner-page .scanner-intro p {
  max-width: 620px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  color: var(--hm-muted) !important;
  font-size: 17px !important;
}
.scanner-page .status {
  display: grid !important;
  grid-template-columns: 12px 1fr auto !important;
  align-items: center !important;
  gap: 18px !important;
  margin: 0 0 18px !important;
  color: var(--hm-muted) !important;
  font: 700 13px/1 Inter, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
}
.progress-track,
.progress-fill { height: 4px !important; border-radius: 999px !important; }
.progress-track { background: var(--hm-line) !important; }
.progress-fill { background: var(--hm-accent) !important; box-shadow: none !important; }
.scanner-page .card {
  max-width: 760px !important;
  margin: 0 auto !important;
  padding: clamp(28px, 4vw, 40px) !important;
  border-radius: 18px !important;
  background: var(--hm-surface) !important;
  box-shadow: var(--hm-shadow) !important;
}
#q-h,
.question-title { display: none !important; }
#q-t,
.sub-title,
.question-copy {
  color: var(--hm-text) !important;
  font-family: Inter, system-ui, sans-serif !important;
  font-size: clamp(22px, 2.8vw, 28px) !important;
  font-weight: 720 !important;
  line-height: 1.28 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  margin: 0 0 26px !important;
  text-transform: none !important;
}
#opts { display: grid !important; gap: 12px !important; }
.screen-copy,
.result-copy,
.preview-proof-v,
.answer-review-item,
.mechanism-proof-copy,
.pay-item,
.pay-note,
.answer-review-decision,
.role-copy,
.delivery-role-copy {
  color: var(--hm-text) !important;
  font-family: Inter, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-shadow: none !important;
}
.screen-title,
.result-name,
#res-name,
.preview-score,
.match-percent {
  color: var(--hm-heading) !important;
  font-family: Inter, system-ui, sans-serif !important;
  font-weight: 780 !important;
  line-height: 1.12 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  filter: none !important;
}
#res-name { font-size: clamp(28px, 4vw, 40px) !important; }
.result-match-row,
.match-score-small,
.preview-pill {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 28px !important;
  padding: 5px 10px !important;
  border: 1px solid var(--hm-line) !important;
  border-radius: 999px !important;
  background: var(--hm-accent-soft) !important;
  color: var(--hm-accent) !important;
  font: 700 12px/1.2 Inter, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.role-card-top { display: grid !important; grid-template-columns: 46px 1fr !important; gap: 12px !important; align-items: center !important; }
.role-name { color: var(--hm-heading) !important; font-size: 22px !important; font-weight: 760 !important; }
.role-path { color: var(--hm-muted) !important; font-size: 14px !important; font-weight: 600 !important; }
.result-blueprint { margin: 20px 0 !important; }
.pricing-stack { display: grid !important; gap: 12px !important; margin: 18px 0 24px !important; }
.pay-option { display: block !important; text-decoration: none !important; }
.pay-name { justify-content: space-between !important; color: var(--hm-heading) !important; font-size: 16px !important; font-weight: 720 !important; }
.pay-price,
.pricing-price { color: var(--hm-heading) !important; font-size: clamp(30px, 4vw, 42px) !important; font-weight: 780 !important; }
.pay-note { color: var(--hm-muted) !important; margin-top: 8px !important; font-size: 14px !important; }
.pay-items { margin-top: 14px !important; }
.pay-item { color: var(--hm-text) !important; background: transparent !important; border: 0 !important; padding: 0 !important; min-height: auto !important; box-shadow: none !important; }
.pay-option.featured { border-color: rgba(181, 111, 50, 0.32) !important; box-shadow: var(--hm-shadow) !important; animation: none !important; }
.pay-option.muted { background: var(--hm-surface-2) !important; }
.email-error { color: var(--hm-danger) !important; font: 600 13px/1.4 Inter, system-ui, sans-serif !important; letter-spacing: 0 !important; text-transform: none !important; }
.vault-link {
  position: static !important;
  display: block !important;
  width: min(100% - 40px, var(--hm-form)) !important;
  margin: 18px auto 0 !important;
  color: var(--hm-accent) !important;
  font: 700 14px/1.4 Inter, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Delivery, success, docs */
.delivery-access .page-hero,
.success-hero { padding-bottom: 22px !important; }
.delivery-role-top { display: grid !important; grid-template-columns: 46px 1fr !important; gap: 12px !important; align-items: center !important; }
.delivery-role-name { margin: 0 !important; }
.delivery-diagnosis-grid { margin-top: 18px !important; }
.matrix-key,
.stat-name { color: var(--hm-muted) !important; font-weight: 650 !important; }
.stat-value { color: var(--hm-heading) !important; font-weight: 720 !important; }
.atomic-action { border-left: 3px solid var(--hm-accent) !important; background: var(--hm-accent-soft) !important; }
.terminal-stat { justify-content: space-between !important; border-top: 1px solid var(--hm-line) !important; padding: 10px 0 !important; }
.cover,
.content,
header.hero { border-radius: var(--hm-radius) !important; }
.cover {
  min-height: auto !important;
  padding: clamp(26px, 4vw, 42px) !important;
  margin: 30px 0 !important;
  background: var(--hm-surface) !important;
}
.content h1 { display: none !important; }
.content h2 { margin: 32px 0 12px !important; padding-top: 14px !important; border-top: 1px solid var(--hm-line) !important; }
main.article { display: grid !important; gap: 18px !important; }
.article .card + .card { margin-top: 0 !important; }
.path,
.related a {
  display: grid !important;
  gap: 6px !important;
  padding: 14px !important;
  border: 1px solid var(--hm-line) !important;
  border-radius: var(--hm-radius-sm) !important;
  background: var(--hm-surface-2) !important;
  color: var(--hm-text) !important;
}
.path strong { color: var(--hm-heading) !important; }
.path span,
.related a { color: var(--hm-muted) !important; }
pre,
code {
  border-radius: 10px !important;
  background: var(--hm-surface-3) !important;
  color: var(--hm-text) !important;
  border: 1px solid var(--hm-line) !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
}
pre { padding: 16px !important; overflow: auto; }
table { width: 100%; border-collapse: collapse; }
th,
td { border-bottom: 1px solid var(--hm-line) !important; color: var(--hm-muted) !important; padding: 12px !important; }
th { color: var(--hm-heading) !important; background: var(--hm-surface-3) !important; }
.trust-strip { box-shadow: none !important; padding: 16px 0 !important; background: transparent !important; border-left: 0 !important; border-right: 0 !important; border-radius: 0 !important; }
.footer,
footer {
  border-top: 1px solid var(--hm-line) !important;
  color: var(--hm-soft) !important;
  padding: 28px 0 38px !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}
.footer-inner,
.footer-links { display: flex !important; flex-wrap: wrap !important; gap: 12px 18px !important; align-items: center !important; justify-content: space-between !important; }

@media (max-width: 980px) {
  .grid,
  .grid-3,
  .path-grid,
  .cards-3,
  .brief-grid,
  .scan-brief,
  .grid-2,
  .pricing-grid,
  .contact-grid,
  .privacy-grid,
  .terms-grid,
  .refund-grid,
  .fit-panel-wide,
  .delivery-diagnosis-grid,
  .business-form-grid,
  .team-card {
    grid-template-columns: 1fr !important;
  }
  .team-card .btn-primary { width: 100% !important; }
  .fit-return { padding: 18px !important; }
}
@media (max-width: 720px) {
  .site-shell,
  .shell,
  .vault-shell,
  .page,
  #app,
  .vault-link { width: min(100% - 30px, 460px) !important; }
  .topline,
  .nav {
    min-height: 62px !important;
    align-items: flex-start !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 13px 0 !important;
  }
  .links,
  .nav-links {
    width: 100% !important;
    justify-content: flex-start !important;
    gap: 10px 14px !important;
    font-size: 13px !important;
  }
  .nav-links a:nth-child(1),
  .nav-links a:nth-child(5) { display: none; }
  .hero,
  .page-hero,
  header.hero,
  .scanner-intro { padding: 38px 0 26px !important; }
  h1,
  .hero-title,
  .page-title,
  .screen-title,
  .result-name,
  .display,
  .content h1 {
    max-width: 430px !important;
    font-size: clamp(32px, 8.4vw, 40px) !important;
    line-height: 1.1 !important;
  }
  h2,
  .content h2,
  .section-head h2,
  .fit-copy h2,
  .team-card h2,
  .card h2,
  .panel h2,
  .delivery-card h2,
  .pricing-name,
  #delivery-match-title {
    font-size: clamp(24px, 7vw, 32px) !important;
    line-height: 1.18 !important;
  }
  p,
  .hero-desc,
  .hero-copy,
  .page-copy,
  .lead,
  .subtitle,
  .sub-title,
  .card-copy,
  .purpose,
  .content p,
  .matrix-value,
  .answer-card,
  .path-card p,
  .hero-note,
  .direct { font-size: 15.5px !important; line-height: 1.56 !important; }
  .lead,
  .page-copy,
  .hero-desc,
  .hero-copy,
  .direct { font-size: 16px !important; }
  .section,
  .contact-section,
  .privacy-section,
  .terms-section,
  .refund-section,
  .path-section,
  .fit-section,
  .team-strip,
  main.article { padding: 34px 0 !important; }
  .panel,
  .card,
  .delivery-card,
  .pricing-card,
  .contact-card,
  .privacy-card,
  .terms-card,
  .refund-card,
  .fit-panel,
  .team-card,
  .content,
  .cover,
  .terminal-card,
  .next-steps { padding: 18px !important; border-radius: 14px !important; }
  .btn-primary,
  .btn-secondary,
  .link-secondary,
  .btn,
  .btn.primary,
  .btn.secondary,
  .cta-buy,
  button[type="submit"],
  .pay-cta { width: 100% !important; min-height: 50px !important; font-size: 15px !important; }
  .cta-row,
  .action-stack,
  .actions,
  .cta-stack { display: grid !important; width: 100% !important; }
  .check-list-wide { grid-template-columns: 1fr !important; }
  .path-top { align-items: flex-start !important; }
  .path-type { margin-top: 3px !important; }
  .scanner-page #app { width: min(100% - 28px, 460px) !important; padding-top: 24px !important; }
  .scanner-page .scanner-intro h1 { font-size: clamp(30px, 8vw, 36px) !important; }
  .scanner-page .scanner-intro p { font-size: 15px !important; }
  .scanner-page .status { gap: 12px !important; }
  .scanner-page .card { padding: 20px !important; }
  #q-t { font-size: clamp(20px, 6vw, 24px) !important; line-height: 1.32 !important; margin-bottom: 20px !important; }
  .btn-opt { min-height: 56px !important; font-size: 15px !important; padding: 14px !important; }
  .footer,
  footer { padding: 24px 0 32px !important; }
}
@media (max-width: 390px) {
  .site-shell,
  .shell,
  .vault-shell,
  .page,
  #app,
  .vault-link { width: min(100% - 24px, 366px) !important; }
  h1,
  .hero-title,
  .page-title,
  .screen-title,
  .result-name,
  .display { font-size: 31px !important; }
  .scanner-page .scanner-intro h1 { font-size: 29px !important; }
  #q-t { font-size: 20px !important; }
  .btn-opt { font-size: 14.5px !important; }
  .path-top { display: grid !important; gap: 10px !important; }
}


/* Final card balance pass */
.path-top {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 12px !important;
}
.path-left {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 12px !important;
}
.path-title-row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}
.path-type,
.role-label {
  white-space: normal !important;
  line-height: 1.15 !important;
}
.path-type { max-width: 96px !important; justify-content: center !important; text-align: center !important; }
.path-card { min-height: 186px !important; }
.team-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 24px !important;
}
@media (max-width: 980px) {
  .team-card { grid-template-columns: 1fr !important; }
}
@media (max-width: 720px) {
  .path-top { grid-template-columns: 1fr !important; }
  .path-type { max-width: none !important; justify-content: flex-start !important; text-align: left !important; }
  .path-card { min-height: auto !important; }
}


/* Final line-break and wrapping pass */
h1,
h2,
h3,
.hero-title,
.page-title,
.screen-title,
.result-name,
.section-head h2,
.fit-copy h2,
.card h2,
.panel h2,
.delivery-card h2,
#delivery-match-title,
#q-t {
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
}
p,
li,
.hero-desc,
.page-copy,
.card-copy,
.path-card p,
.delivery-role-copy,
.step-copy,
.matrix-value {
  word-break: normal !important;
  overflow-wrap: break-word !important;
  hyphens: none !important;
}
.role-label,
.path-type,
.badge,
.pay-tag,
.delivery-role-mode,
.role-mode,
.module-kicker,
.kicker,
.eyebrow,
.label,
.price-note,
.meta-line {
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
}
.btn-primary,
.btn-secondary,
.link-secondary,
.btn,
.btn.primary,
.btn.secondary,
.cta-buy,
button[type="submit"],
.pay-cta,
.btn-opt {
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
  text-align: center !important;
}
.btn-opt { text-align: left !important; }
.path-top {
  grid-template-columns: 1fr !important;
  align-items: start !important;
  gap: 10px !important;
}
.path-type {
  max-width: none !important;
  width: fit-content !important;
  margin-left: 54px !important;
  justify-content: flex-start !important;
  text-align: left !important;
}
.path-title-row { flex-wrap: nowrap !important; min-width: 0 !important; }
.path-title-row h3 { flex: 0 0 auto !important; }
.role-label { flex: 0 0 auto !important; }
@media (max-width: 720px) {
  .path-title-row { flex-wrap: wrap !important; }
  .path-type { margin-left: 54px !important; }
  .btn-primary,
  .btn-secondary,
  .link-secondary,
  .btn,
  .btn.primary,
  .btn.secondary,
  .cta-buy,
  button[type="submit"],
  .pay-cta { white-space: normal !important; line-height: 1.2 !important; }
}
@media (max-width: 390px) {
  .module-kicker,
  .kicker,
  .eyebrow,
  .label { white-space: normal !important; }
  .path-title-row { gap: 6px !important; }
}


/* 2026-06-08 compact problem-answer hierarchy */
.hero,
.page-hero,
header.hero,
.scanner-intro {
  padding: clamp(28px, 4.2vw, 52px) 0 clamp(18px, 2.6vw, 30px) !important;
}
.hero-inner {
  gap: 14px !important;
}
h1,
.hero-title,
.page-title,
.screen-title,
.result-name,
.display,
.content h1 {
  font-size: clamp(30px, 4vw, 46px) !important;
  line-height: 1.08 !important;
  margin-bottom: 10px !important;
}
.lead,
.page-copy,
.hero-desc,
.hero-copy,
.direct {
  font-size: 16px !important;
  line-height: 1.56 !important;
}
.problem-answer-strip {
  width: min(100%, 760px) !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin: 4px 0 8px !important;
}
.pa-card {
  min-height: 86px !important;
  padding: 14px 16px !important;
  border: 1px solid var(--hm-line) !important;
  border-radius: var(--hm-radius-sm) !important;
  background: rgba(255, 255, 255, 0.82) !important;
  box-shadow: var(--hm-shadow-soft) !important;
}
.pa-card span {
  display: block !important;
  margin-bottom: 7px !important;
  color: var(--hm-accent) !important;
  font-size: 12px !important;
  font-weight: 780 !important;
  line-height: 1.2 !important;
}
.pa-card strong {
  display: block !important;
  color: var(--hm-heading) !important;
  font-size: 15px !important;
  font-weight: 680 !important;
  line-height: 1.38 !important;
}
.cta-stack {
  margin-top: 10px !important;
}
.scanner-page #app {
  padding-top: clamp(14px, 2.4vw, 24px) !important;
}
.scanner-page .scanner-intro {
  max-width: 760px !important;
  padding: 0 0 12px !important;
  margin: 0 auto 8px !important;
  text-align: left !important;
}
.scanner-page .scanner-intro h1 {
  max-width: 680px !important;
  margin: 0 0 12px !important;
  font-size: clamp(30px, 4vw, 44px) !important;
  text-align: left !important;
}
.scanner-page .scanner-intro .module-kicker {
  margin-bottom: 8px !important;
}
.scanner-page .status {
  margin: 8px 0 14px !important;
}
.scanner-page .card {
  padding: clamp(22px, 3vw, 32px) !important;
}
#q-t,
.sub-title,
.question-copy {
  font-size: clamp(21px, 2.5vw, 26px) !important;
  margin-bottom: 18px !important;
}
@media (max-width: 720px) {
  .hero,
  .page-hero,
  header.hero,
  .scanner-intro {
    padding: 22px 0 18px !important;
  }
  h1,
  .hero-title,
  .page-title,
  .screen-title,
  .result-name,
  .display,
  .content h1 {
    font-size: clamp(27px, 7.2vw, 34px) !important;
    line-height: 1.1 !important;
  }
  .problem-answer-strip {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  .pa-card {
    min-height: auto !important;
    padding: 13px 14px !important;
  }
  .pa-card strong {
    font-size: 14.5px !important;
  }
  .scanner-page #app {
    padding-top: 14px !important;
  }
  .scanner-page .scanner-intro h1 {
    font-size: clamp(27px, 7.2vw, 34px) !important;
  }
  #q-t {
    font-size: clamp(20px, 5.8vw, 23px) !important;
  }
}
@media (max-width: 390px) {
  h1,
  .hero-title,
  .page-title,
  .screen-title,
  .result-name,
  .display,
  .scanner-page .scanner-intro h1 {
    font-size: 28px !important;
  }
}


/* 2026-06-08 minimal scanner test page */
.scanner-page #app {
  width: min(100% - 40px, 720px) !important;
  max-width: 720px !important;
  padding-top: clamp(18px, 3vw, 34px) !important;
}
.scanner-page .scanner-intro {
  padding: 0 !important;
  margin: 0 0 16px !important;
  text-align: left !important;
}
.scanner-page .scanner-intro h1 {
  max-width: 720px !important;
  margin: 0 !important;
  color: var(--hm-heading) !important;
  font-size: clamp(30px, 4vw, 42px) !important;
  line-height: 1.08 !important;
  text-align: left !important;
}
.scanner-page .scanner-intro .module-kicker,
.scanner-page .scanner-intro .problem-answer-strip,
.scanner-page .scanner-intro p {
  display: none !important;
}
.scanner-page .status {
  margin: 10px 0 14px !important;
}
.scanner-page .card {
  padding: clamp(24px, 3.5vw, 36px) !important;
}
#q-t, .sub-title, .question-copy {
  margin-bottom: 20px !important;
}
@media (max-width: 720px) {
  .scanner-page #app { width: min(100% - 28px, 460px) !important; padding-top: 14px !important; }
  .scanner-page .scanner-intro { margin-bottom: 12px !important; }
  .scanner-page .scanner-intro h1 { font-size: clamp(28px, 7.4vw, 34px) !important; }
}


/* 2026-06-08 scanner page: theme + question + options only */
.scanner-page #app {
  width: min(100% - 40px, 760px) !important;
  max-width: 760px !important;
  padding-top: clamp(18px, 3.2vw, 40px) !important;
}
.scanner-page .scanner-intro {
  margin: 0 0 18px !important;
  padding: 0 !important;
  text-align: left !important;
}
.scanner-page .scanner-intro h1 {
  max-width: 680px !important;
  margin: 0 !important;
  color: var(--hm-heading) !important;
  font-size: clamp(30px, 3.6vw, 42px) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.045em !important;
  text-align: left !important;
}
.scanner-page .status,
.scanner-page .question-title {
  display: none !important;
}
.scanner-page .card {
  padding: clamp(26px, 3.5vw, 38px) !important;
}
.scanner-page #q-t {
  margin: 0 0 22px !important;
  color: var(--hm-heading) !important;
  font-size: clamp(25px, 3.1vw, 34px) !important;
  line-height: 1.15 !important;
  letter-spacing: -0.035em !important;
  text-align: left !important;
}
.scanner-page .btn-opt {
  color: var(--hm-heading) !important;
  font-size: 16.5px !important;
  line-height: 1.32 !important;
}
@media (max-width: 720px) {
  .scanner-page #app {
    width: min(100% - 28px, 460px) !important;
    padding-top: 12px !important;
  }
  .scanner-page .scanner-intro { margin-bottom: 12px !important; }
  .scanner-page .scanner-intro h1 {
    max-width: 360px !important;
    font-size: clamp(26px, 7vw, 32px) !important;
  }
  .scanner-page .card { padding: 22px 16px !important; }
  .scanner-page #q-t {
    margin-bottom: 18px !important;
    font-size: clamp(22px, 6vw, 27px) !important;
  }
  .scanner-page .btn-opt {
    min-height: 54px !important;
    font-size: 15.5px !important;
  }
}


/* Diagnostic Ledger visual direction: mature stop-loss audit brand */
:root {
  --hm-bg: #f7f2e9;
  --hm-surface: #fffdf8;
  --hm-surface-2: #fbf6ee;
  --hm-heading: #20231f;
  --hm-text: #4e584d;
  --hm-muted: #717a6e;
  --hm-line: #e5dbcd;
  --hm-accent: #b87333;
  --hm-accent-strong: #945820;
  --hm-accent-soft: rgba(184, 115, 51, 0.12);
}
html, body {
  background: var(--hm-bg) !important;
  color: var(--hm-text) !important;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}
body {
  background:
    linear-gradient(180deg, #fffdf8 0%, var(--hm-bg) 48%, #f3eadf 100%) !important;
}
a { color: inherit; }
.site-shell,
.page {
  width: min(100% - 48px, 1120px) !important;
  max-width: 1120px !important;
}
.topbar,
.topline {
  background: rgba(255, 253, 248, 0.88) !important;
  border-bottom: 1px solid var(--hm-line) !important;
  backdrop-filter: blur(16px) !important;
}
.topline { min-height: 70px !important; }
.brand-mark {
  border: 1px solid rgba(184, 115, 51, 0.28) !important;
  background: rgba(184, 115, 51, 0.07) !important;
  color: var(--hm-accent) !important;
  border-radius: 12px !important;
}
.brand-name { color: var(--hm-heading) !important; font-weight: 800 !important; }
.nav-links { color: var(--hm-muted) !important; }
.nav-links a.active,
.nav-links a:hover { color: var(--hm-accent) !important; }
.hero,
.page-hero,
.delivery-hero,
.success-hero {
  min-height: auto !important;
  padding: clamp(42px, 7vw, 86px) 0 clamp(24px, 4vw, 44px) !important;
  text-align: left !important;
  place-items: start !important;
}
.hero-inner {
  width: min(100%, 980px) !important;
  display: grid !important;
  justify-items: start !important;
  text-align: left !important;
}
h1,
.hero-title,
.page-title,
.delivery-title,
.screen-title,
#home-title {
  max-width: 880px !important;
  color: var(--hm-heading) !important;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: clamp(42px, 6.1vw, 76px) !important;
  line-height: 0.98 !important;
  letter-spacing: -0.065em !important;
  text-align: left !important;
  text-wrap: balance !important;
}
#home-title span { display: inline !important; }
.hero-desc,
.hero-copy,
.page-copy,
.delivery-copy,
.sub-title {
  max-width: 650px !important;
  color: var(--hm-text) !important;
  font-size: clamp(16px, 1.8vw, 20px) !important;
  line-height: 1.52 !important;
  text-align: left !important;
}
.module-kicker,
.eyebrow,
.label,
.badge,
.preview-pill,
.result-match-row {
  color: var(--hm-accent) !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-weight: 800 !important;
}
.problem-answer-strip {
  width: min(100%, 980px) !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
  margin: 28px 0 0 !important;
}
.pa-card,
.panel,
.delivery-card,
.pricing-card,
.legal-block,
.fit-panel,
.path-card,
.product-card,
.card,
.diagnosis-tile,
.pay-option,
.preview-proof-item,
.answer-review-item,
.mechanism-proof {
  border: 1px solid var(--hm-line) !important;
  background: rgba(255,253,248,0.92) !important;
  color: var(--hm-text) !important;
  border-radius: 18px !important;
  box-shadow: 0 18px 44px rgba(74, 61, 45, 0.07) !important;
}
.pa-card { padding: 18px 20px !important; min-height: auto !important; }
.pa-card span { color: var(--hm-accent) !important; font-size: 13px !important; font-weight: 800 !important; }
.pa-card strong { color: var(--hm-heading) !important; font-size: 16px !important; line-height: 1.45 !important; }
.fit-panel-wide,
.fit-panel { padding: clamp(24px, 4vw, 38px) !important; }
.fit-copy h2,
.section-head h2,
.panel h2,
.delivery-card h2,
.path-card h3,
.pricing-name {
  color: var(--hm-heading) !important;
  letter-spacing: -0.045em !important;
  text-align: left !important;
}
.fit-copy p,
.card-copy,
.list-item,
.path-card p,
.fit-return li,
.check-list span,
.meta-line,
.fine-print {
  color: var(--hm-text) !important;
}
.btn-primary,
.cta-buy,
.pay-cta {
  background: var(--hm-accent) !important;
  color: #fffdf8 !important;
  border: 1px solid var(--hm-accent) !important;
  border-radius: 14px !important;
  box-shadow: 0 16px 30px rgba(184, 115, 51, 0.20) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.btn-primary:hover,
.cta-buy:hover,
.pay-cta:hover { background: var(--hm-accent-strong) !important; }
.btn-secondary,
.link-secondary {
  color: var(--hm-accent-strong) !important;
  border-color: rgba(184,115,51,0.25) !important;
  background: rgba(255,253,248,0.68) !important;
  border-radius: 14px !important;
}
.section { padding: clamp(28px, 5vw, 54px) 0 !important; }
.footer { border-top: 1px solid var(--hm-line) !important; color: var(--hm-muted) !important; }
@media (max-width: 760px) {
  .site-shell,
  .page { width: min(100% - 30px, 460px) !important; }
  .topline,
  .topbar .nav { min-height: 62px !important; }
  h1,
  .hero-title,
  .page-title,
  .delivery-title,
  .screen-title,
  #home-title {
    font-size: clamp(34px, 10.5vw, 46px) !important;
    line-height: 1.02 !important;
  }
  .hero,
  .page-hero,
  .delivery-hero,
  .success-hero { padding: 34px 0 24px !important; }
  .problem-answer-strip { grid-template-columns: 1fr !important; gap: 10px !important; margin-top: 20px !important; }
  .pa-card { padding: 15px 16px !important; }
  .pa-card strong { font-size: 15px !important; }
}


/* 2026-06-08 final ivory background correction */
:root {
  --hm-bg: #f8f6f0 !important;
  --hm-surface: #fffdf8 !important;
  --hm-surface-2: #f5f2ec !important;
  --hm-line: #e4ded4 !important;
  --hm-accent: #b87535 !important;
  --hm-accent-strong: #915821 !important;
  --hm-accent-soft: rgba(184, 117, 53, 0.10) !important;
}
html, body {
  background: #f8f6f0 !important;
}
body {
  background:
    linear-gradient(180deg, #fffdf8 0%, #f8f6f0 46%, #f5f2ec 100%) !important;
}
.topbar,
.topline {
  background: rgba(255, 253, 248, 0.92) !important;
}
.hero,
.page-hero,
.delivery-hero,
.success-hero,
.section,
.fit-section,
.path-section,
.team-strip {
  background: transparent !important;
}
.pa-card,
.panel,
.delivery-card,
.pricing-card,
.legal-block,
.fit-panel,
.path-card,
.product-card,
.card,
.diagnosis-tile,
.pay-option,
.preview-proof-item,
.answer-review-item,
.mechanism-proof {
  background: rgba(255, 253, 248, 0.94) !important;
  border-color: #e4ded4 !important;
  box-shadow: 0 16px 40px rgba(58, 48, 35, 0.055) !important;
}
.btn-primary,
.cta-buy,
.pay-cta {
  background: #b87535 !important;
  border-color: #b87535 !important;
  box-shadow: 0 14px 26px rgba(145, 88, 33, 0.16) !important;
}
.btn-primary:hover,
.cta-buy:hover,
.pay-cta:hover {
  background: #915821 !important;
  border-color: #915821 !important;
}


/* 2026-06-08 mobile footer + scanner title correction */
.scanner-page .scanner-intro {
  margin: 0 0 12px !important;
  padding: 18px 0 8px !important;
}
.scanner-page .scanner-intro h1 {
  max-width: none !important;
  margin: 0 !important;
  color: var(--hm-accent) !important;
  font-size: clamp(18px, 2.2vw, 24px) !important;
  line-height: 1.2 !important;
  font-weight: 760 !important;
  letter-spacing: 0 !important;
}
@media (max-width: 760px) {
  .scanner-page #app { padding-top: 8px !important; }
  .scanner-page .scanner-intro { margin-bottom: 10px !important; padding: 8px 0 4px !important; }
  .scanner-page .scanner-intro h1 { font-size: 18px !important; }
  .scanner-page #q-t { font-size: clamp(22px, 6.4vw, 28px) !important; line-height: 1.14 !important; }
  .footer { text-align: left !important; }
  .footer-links,
  .footer-inner .footer-links {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 13px 24px !important;
    align-items: start !important;
    justify-content: stretch !important;
  }
  .footer-links a {
    display: block !important;
    min-width: 0 !important;
    font-size: 15px !important;
    line-height: 1.25 !important;
    text-align: left !important;
    white-space: normal !important;
  }
}

/* 2026-06-09 Tavily-inspired typography and scanner balance */
:root {
  --hm-bg: #fbfaf7;
  --hm-bg-2: #f5f1ea;
  --hm-surface: #fffefb;
  --hm-surface-2: #fbf8f2;
  --hm-heading: #081a2f;
  --hm-text: #223244;
  --hm-muted: #667487;
  --hm-line: #e6ded4;
  --hm-line-strong: #d9cfc2;
  --hm-accent: #b87333;
  --hm-accent-strong: #935723;
  --hm-accent-soft: rgba(184, 115, 51, 0.10);
}
html,
body {
  background: linear-gradient(180deg, #fffefa 0%, var(--hm-bg) 58%, var(--hm-bg-2) 100%) !important;
  color: var(--hm-text) !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-feature-settings: "cv02", "cv03", "cv04", "cv11";
}
h1,
.hero-title,
.page-title,
.screen-title,
.result-name,
.display,
.content h1 {
  color: var(--hm-heading) !important;
  font-weight: 720 !important;
  letter-spacing: -0.035em !important;
}
h2,
.content h2,
.section-head h2,
.fit-copy h2,
.team-card h2,
.card h2,
.panel h2,
.delivery-card h2,
.pricing-name,
.upsell-title,
#delivery-match-title {
  color: var(--hm-heading) !important;
  font-weight: 700 !important;
  letter-spacing: -0.028em !important;
}
p,
li,
.hero-desc,
.hero-copy,
.page-copy,
.card-copy,
.path-card p,
.delivery-role-copy,
.step-copy,
.matrix-value {
  color: var(--hm-muted) !important;
  font-weight: 440 !important;
}
.module-kicker,
.kicker,
.eyebrow,
.label,
.pay-tag,
.preview-pill,
.result-match-row,
.match-score-small {
  color: var(--hm-accent) !important;
  font-weight: 720 !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
}
.scanner-page #app {
  width: min(100% - 48px, 760px) !important;
  max-width: 760px !important;
  padding-top: clamp(28px, 4vw, 48px) !important;
}
.scanner-page .scanner-intro {
  margin: 0 0 18px !important;
  padding: 0 !important;
}
.scanner-page .scanner-intro h1 {
  color: var(--hm-accent) !important;
  font-size: clamp(22px, 2.4vw, 28px) !important;
  font-weight: 720 !important;
  line-height: 1.16 !important;
  letter-spacing: -0.018em !important;
  margin: 0 !important;
}
.scanner-page .status {
  margin: 0 0 18px !important;
  color: #8490a0 !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
}
.scanner-page .progress-track {
  height: 4px !important;
  border-radius: 999px !important;
  background: #edf1f4 !important;
  margin: 0 18px !important;
}
.scanner-page .progress-fill {
  height: 4px !important;
  border-radius: 999px !important;
  background: var(--hm-accent) !important;
  box-shadow: none !important;
}
.scanner-page .card {
  background: rgba(255, 254, 251, 0.96) !important;
  border: 1px solid var(--hm-line) !important;
  border-radius: 24px !important;
  box-shadow: 0 18px 48px rgba(21, 39, 63, 0.07), 0 1px 0 rgba(8, 26, 47, 0.04) !important;
  padding: clamp(30px, 4vw, 44px) !important;
}
.scanner-page #q-t {
  color: var(--hm-heading) !important;
  font-family: Inter, ui-sans-serif, system-ui, sans-serif !important;
  font-size: clamp(27px, 2.6vw, 34px) !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 1.18 !important;
  letter-spacing: -0.032em !important;
  margin: 0 0 24px !important;
  max-width: 680px !important;
  text-wrap: balance !important;
}
.scanner-page .btn-opt {
  min-height: 58px !important;
  padding: 16px 18px !important;
  margin-bottom: 12px !important;
  border: 1px solid var(--hm-line) !important;
  border-radius: 16px !important;
  background: #fffefb !important;
  color: var(--hm-heading) !important;
  box-shadow: 0 8px 22px rgba(21, 39, 63, 0.035) !important;
  font-family: Inter, ui-sans-serif, system-ui, sans-serif !important;
  font-size: clamp(16.5px, 1.25vw, 18px) !important;
  font-weight: 620 !important;
  line-height: 1.36 !important;
  letter-spacing: -0.012em !important;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease !important;
}
.scanner-page .btn-opt:hover,
.scanner-page .btn-opt:focus-visible {
  border-color: rgba(184, 115, 51, 0.42) !important;
  background: #fffaf3 !important;
  box-shadow: 0 12px 28px rgba(184, 115, 51, 0.10) !important;
  color: var(--hm-heading) !important;
  transform: translateY(-1px) !important;
}
.scanner-page .btn-opt::after {
  width: 3px !important;
  border-radius: 999px !important;
  background: var(--hm-accent) !important;
}
.scanner-page .cta-buy,
.scanner-page .pay-cta {
  border-radius: 14px !important;
  font-size: 16px !important;
  font-weight: 740 !important;
  letter-spacing: -0.006em !important;
}
@media (max-width: 720px) {
  .scanner-page #app {
    width: min(100% - 28px, 460px) !important;
    padding-top: 18px !important;
  }
  .scanner-page .scanner-intro h1 {
    font-size: clamp(20px, 5.3vw, 25px) !important;
  }
  .scanner-page .status {
    margin-bottom: 12px !important;
  }
  .scanner-page .card {
    padding: 22px 18px !important;
    border-radius: 20px !important;
  }
  .scanner-page #q-t {
    font-size: clamp(22px, 6vw, 26px) !important;
    line-height: 1.2 !important;
    margin-bottom: 20px !important;
  }
  .scanner-page .btn-opt {
    min-height: 56px !important;
    padding: 14px 15px !important;
    font-size: clamp(15.5px, 4.1vw, 16.5px) !important;
    font-weight: 620 !important;
    line-height: 1.34 !important;
  }
}
@media (max-width: 390px) {
  .scanner-page #app { width: min(100% - 24px, 366px) !important; }
  .scanner-page #q-t { font-size: clamp(21px, 6.1vw, 24px) !important; }
  .scanner-page .btn-opt { font-size: 15.25px !important; }
}

/* 2026-06-09 sitewide line-break protocol
   Display headlines may avoid widows; question, option, card, and delivery text
   must use normal wrapping so the right side of the layout does not look empty. */
:where(
  h1,
  .hero-title,
  .page-title,
  .screen-title,
  .display,
  .content h1,
  .section-head h2,
  .fit-copy h2
) {
  text-wrap: pretty !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: manual !important;
}

:where(
  h2,
  h3,
  p,
  li,
  .hero-desc,
  .hero-copy,
  .page-copy,
  .lead,
  .subtitle,
  .direct,
  .card-copy,
  .path-card p,
  .delivery-role-copy,
  .step-copy,
  .matrix-value,
  .answer-card,
  .business-note,
  .fine-print
) {
  text-wrap: wrap !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
  hyphens: manual !important;
}

:where(
  .btn,
  .btn-primary,
  .button,
  button,
  .btn-opt,
  .cta-buy,
  .pay-cta,
  .nav-links a,
  .links a,
  .footer-links a,
  .path-chip,
  .pill,
  .preview-pill,
  .result-match-row,
  .pay-tag,
  .option-card,
  .decision-pill,
  .signal,
  .day,
  .brief-item,
  .log-cell
) {
  text-wrap: wrap !important;
  white-space: normal !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
}

.scanner-page #q-t {
  width: 100% !important;
  max-width: none !important;
  text-wrap: wrap !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
  hyphens: manual !important;
  font-size: clamp(25px, 2.15vw, 31px) !important;
  line-height: 1.22 !important;
  letter-spacing: -0.024em !important;
}

.scanner-page .btn-opt {
  width: 100% !important;
  display: block !important;
  text-align: left !important;
  font-size: clamp(16px, 1.15vw, 17.25px) !important;
  line-height: 1.34 !important;
}

.scanner-page .card {
  padding: clamp(28px, 3.4vw, 40px) !important;
}

.answer-page h1,
.answers-page h1,
.geo-page h1,
.vault-page h1,
.delivery-page h1,
.content h1 {
  max-width: min(100%, 860px) !important;
}

@media (max-width: 720px) {
  :where(h1, .hero-title, .page-title, .screen-title, .display, .content h1) {
    text-wrap: pretty !important;
    max-width: 100% !important;
  }

  :where(.lead, .page-copy, .hero-desc, .hero-copy, .direct, .subtitle) {
    max-width: 100% !important;
  }

  .scanner-page #q-t {
    font-size: clamp(21px, 5.45vw, 24px) !important;
    line-height: 1.24 !important;
    letter-spacing: -0.018em !important;
    margin-bottom: 18px !important;
  }

  .scanner-page .btn-opt {
    min-height: 54px !important;
    padding: 14px 15px !important;
    font-size: clamp(15.75px, 4.15vw, 16.75px) !important;
    line-height: 1.32 !important;
  }

  .scanner-page .card {
    padding: 20px 16px !important;
  }
}

/* 2026-06-09 trust/legal page title protocol
   Privacy, terms, refund, and contact are support documents, not conversion heroes. */
.vault-shell > .hero {
  padding-top: clamp(42px, 6vw, 64px) !important;
  padding-bottom: clamp(20px, 3vw, 30px) !important;
}
.vault-shell > .hero h1 {
  max-width: 720px !important;
  margin-bottom: 16px !important;
  color: var(--hm-heading) !important;
  font-size: clamp(34px, 4.6vw, 48px) !important;
  font-weight: 760 !important;
  line-height: 1.1 !important;
  letter-spacing: -0.035em !important;
  text-transform: none !important;
  text-wrap: pretty !important;
}
.vault-shell > .hero .hero-desc {
  max-width: 650px !important;
  color: var(--hm-muted) !important;
  font-size: 16.5px !important;
  line-height: 1.6 !important;
  font-weight: 450 !important;
}
@media (max-width: 640px) {
  .vault-shell > .hero {
    padding-top: 32px !important;
    padding-bottom: 18px !important;
  }
  .vault-shell > .hero h1 {
    font-size: clamp(29px, 8vw, 36px) !important;
    line-height: 1.08 !important;
  }
  .vault-shell > .hero .hero-desc {
    font-size: 15.5px !important;
    line-height: 1.55 !important;
  }
}
/* 2026-06-09 support page final typography pass */
.support-page .hero {
  padding-top: clamp(38px, 5vw, 58px) !important;
  padding-bottom: clamp(18px, 2.8vw, 28px) !important;
}
.support-page .hero h1 {
  max-width: 560px !important;
  margin-bottom: 12px !important;
  font-size: clamp(32px, 4.1vw, 44px) !important;
  font-weight: 760 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.02em !important;
  text-wrap: balance !important;
}
.support-page .hero h1 span { display: inline !important; }
.support-page .hero .hero-desc {
  max-width: 620px !important;
  font-size: 16px !important;
  line-height: 1.58 !important;
}
.contact-page .contact-card h2,
.contact-page .contact-card h3 {
  font-size: clamp(20px, 2.1vw, 25px) !important;
  font-weight: 730 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.contact-page .email-line {
  font-size: clamp(18px, 2vw, 22px) !important;
  line-height: 1.28 !important;
  letter-spacing: 0 !important;
}
@media (max-width: 640px) {
  .support-page .hero { padding-top: 30px !important; }
  .support-page .hero h1 { font-size: clamp(30px, 8vw, 36px) !important; }
  .contact-page .contact-card h2,
  .contact-page .contact-card h3 { font-size: 21px !important; }
}