/* ============================================================
   Homepage v2 — page stylesheet (linked from src/pages/index.astro)
   Builds on the tokens in /styles.css. Class prefix: hv-
   Minimum text size is 10px (owner decision 2026-10-31).
   ============================================================ */

.hv-accent { color: var(--accent); }
.hv-mono-xs { font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; color: var(--fg-dim); text-transform: uppercase; }
.hv-label { font-family: var(--mono); font-size: 10px; letter-spacing: 0.16em; color: var(--fg-dim); text-transform: uppercase; }
.hv-push { margin-top: auto; }
.hv-on-ink-dim { color: rgba(245, 244, 240, 0.75); }
.hv-on-ink-accent { color: #8494EC; }
.hv-mono-xs.hv-accent, .hv-label.hv-accent { color: var(--accent); }
.hv-mono-xs.hv-on-ink-accent { color: #8494EC; }

.hv-eyebrow {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--fg-muted); display: inline-flex; align-items: center; gap: 8px;
}
.hv-eyebrow::before { content: ""; width: 6px; height: 6px; background: var(--accent); border-radius: 50%; flex: none; }
.hv-eyebrow--inverse { color: rgba(245, 244, 240, 0.6); }
.hv-eyebrow--inverse::before { background: var(--accent-2); }

.hv-h2 {
  font-size: clamp(30px, 3.4vw, 44px); font-weight: 800; letter-spacing: -0.02em; line-height: 1.05;
  margin: 16px 0 0; max-width: 24ch; text-wrap: balance;
}
.hv-h3 { font-size: clamp(24px, 2.6vw, 34px); font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; margin: 0; }
.hv-lede { font-size: 17px; line-height: 1.5; color: var(--fg-muted); margin: 0; max-width: 56ch; text-wrap: pretty; }
.hv-lede--below { margin-top: 16px; max-width: 60ch; }

.hv-link { color: var(--accent); font-weight: 600; font-size: 14px; }
.hv-link:hover { color: var(--accent-2); }
.hv-link--inverse { color: #8494EC; font-size: 15px; }
.hv-link--inverse:hover { color: #C2CAF6; }
.hv-link-underline { color: var(--accent); font-weight: 500; border-bottom: 1px solid currentColor; }
.hv-link-underline:hover { color: var(--accent-2); }

.hv-hl { background: rgba(31, 59, 204, 0.12); color: var(--fg); border-bottom: 2px solid var(--accent); padding: 0 1px; }

.hv-section { padding: 80px 0; }
/* In-page anchors (nav links, "Discuss your study") land with the section's eyebrow
   ~28px below the sticky nav (65px tall) instead of under it — on every viewport. */
.hv-section[id] { scroll-margin-top: calc(65px + 28px - 80px); }
#demo { scroll-margin-top: calc(65px + 24px); }
.hv-section--white { background: var(--bg-elev); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.hv-section--rule { border-top: 1px solid var(--border); }
@media (max-width: 700px) { .hv-section { padding: 56px 0; } .hv-section[id] { scroll-margin-top: calc(65px + 28px - 56px); } }

/* chips, pills, origin tags */
.hv-chip {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.08em; white-space: nowrap;
  color: #F5F4F0; background: rgba(19, 21, 26, 0.72); padding: 3px 8px; border-radius: 3px;
}
.hv-chip--on-image { position: absolute; top: 10px; left: 10px; z-index: 2; pointer-events: none; }
.hv-pill {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.06em; white-space: nowrap;
  padding: 4px 10px; border-radius: 999px; border: 1px solid var(--border); color: var(--fg-muted);
}
.hv-pill--alert { border-color: var(--alert); color: var(--alert); }
.hv-pill--accent { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }

.hv-origin {
  align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; white-space: nowrap;
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.12em; color: var(--fg);
  background: var(--bg-elev); border: 1px solid var(--border-strong); border-radius: 3px; padding: 4px 8px;
}
/* Long origin tags (e.g. "HUMAN INTERVIEW · TRANSCRIPT EXCERPT") wrap on phones rather than overflow. */
@media (max-width: 420px) {
  .hv-origin { white-space: normal; max-width: 100%; }
}
.hv-mark { width: 9px; height: 9px; display: block; flex: none; box-sizing: border-box; }
.hv-mark--human { background: var(--fg); }
.hv-mark--twin { border: 1.5px solid var(--fg); }
.hv-mark--focus { background: var(--bg-elev); border: 1.5px solid var(--fg); box-shadow: 2px 2px 0 -0.5px var(--bg-elev), 2px 2px 0 1px var(--fg); }
.hv-mark--emo { background: var(--fg); border-radius: 50%; }
.hv-mark--traced { border: 1.5px dashed var(--fg); }

/* ------------------------------------------------------------
   HERO
   ------------------------------------------------------------ */
.hv-hero { padding: 44px 0 48px; }
.hv-hero__grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr));
  gap: 56px; align-items: center;
}
.hv-hero__copy { min-width: 0; }
.hv-hero__title { margin-top: 24px; font-size: clamp(42px, 5vw, 68px); }
.hv-hero__title > span { display: block; }
.hv-hero__lede { font-size: 19px; line-height: 1.5; color: var(--fg-muted); max-width: 44ch; margin: 24px 0 0; text-wrap: pretty; }
.hv-hero__ctas { display: flex; gap: 12px; margin-top: 32px; flex-wrap: wrap; }
.hv-hero__twins { font-size: 14px; line-height: 1.5; color: var(--fg-muted); margin: 20px 0 0; }

.hv-demo {
  min-width: 0; background: var(--bg-elev); border: 1px solid var(--border-strong); border-radius: var(--radius-md);
  box-shadow: 6px 6px 0 var(--accent); overflow: hidden;
}
.hv-demo__chrome { display: flex; align-items: center; gap: 6px; padding: 10px 14px; border-bottom: 1px solid var(--border); }
.hv-demo__chrome i { width: 8px; height: 8px; border-radius: 50%; background: var(--border); display: block; }
.hv-demo__title { font-family: var(--mono); font-size: 10px; color: var(--fg-dim); margin-left: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hv-demo__body { padding: 16px; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; }
.hv-demo__frame { position: relative; border-radius: var(--radius-sm); background: var(--bg-inverse); min-height: 150px; overflow: hidden; }
.hv-demo__frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hv-demo__quote { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.hv-demo__quote-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.hv-demo__quote-head .hv-origin { padding: 2px 6px; }
.hv-demo__quote p { font-size: 13px; line-height: 1.5; margin: 0; color: var(--fg-muted); }
.hv-demo__signal { grid-column: 1 / -1; border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 12px; display: flex; align-items: center; gap: 14px; }
.hv-bars { display: flex; align-items: flex-end; gap: 3px; flex: 1; height: 30px; overflow: hidden; min-width: 0; }
/* Bars shrink (5px → 1px) instead of clipping, so the hesitation spike stays visible at 320px. */
.hv-bars i { flex: 0 1 5px; min-width: 1px; background: var(--border); border-radius: 1px; display: block; }
.hv-bars i.is-hot { background: var(--alert); }
@media (max-width: 420px) { .hv-bars { gap: 2px; } }
.hv-demo__verdict {
  grid-column: 1 / -1; border-radius: var(--radius-sm); padding: 12px; background: var(--bg-inverse); color: var(--fg-inverse);
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px;
  font-size: 12.5px; font-weight: 800; letter-spacing: 0.01em;
}

.hv-logos { margin-top: 56px; padding-top: 24px; border-top: 1px solid var(--border); display: flex; flex-direction: column; gap: 20px; }
.hv-logos__row {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 16px 32px; align-items: center;
}
.hv-logos__row li { height: 44px; display: flex; align-items: center; justify-content: center; }
.hv-logos__row img { max-height: 44px; max-width: 100%; width: auto; height: auto; object-fit: contain; }

/* ------------------------------------------------------------
   QUESTIONS
   ------------------------------------------------------------ */
.hv-decide__grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr));
  gap: 32px; margin-top: 40px; align-items: start;
}
.hv-decide__list { display: flex; flex-direction: column; border-top: 1px solid var(--border); }
.hv-decide__q {
  display: flex; align-items: center; gap: 16px; text-align: left; border-bottom: 1px solid var(--border);
  padding: 18px 4px; color: var(--fg); transition: background-color 160ms;
}
.hv-decide__q:hover { background: var(--bg); }
.hv-decide__n { font-family: var(--mono); font-size: 11px; letter-spacing: 0.1em; color: var(--fg-dim); width: 22px; flex: none; }
.hv-decide__t { font-size: 20px; font-weight: 500; letter-spacing: -0.01em; flex: 1; }
.hv-decide__arrow { font-size: 18px; color: var(--accent); }
.hv-decide__q.is-on .hv-decide__n { color: var(--accent); }
.hv-decide__q.is-on .hv-decide__t { font-weight: 700; }
.hv-decide__panel {
  background: var(--bg); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 28px;
  display: flex; flex-direction: column; gap: 20px; min-width: 0;
}
.hv-decide__methods { display: flex; flex-wrap: wrap; gap: 8px; }
.hv-decide__why { font-size: 17px; line-height: 1.5; margin: 0; text-wrap: pretty; }
.hv-decide__get { display: flex; flex-direction: column; gap: 10px; }
.hv-decide__get ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.hv-decide__get li { display: flex; gap: 10px; font-size: 15px; line-height: 1.45; }
.hv-decide__get li::before { content: "—"; color: var(--accent); flex: none; }
.hv-decide__limit { font-size: 14px; line-height: 1.5; color: var(--fg-muted); padding-top: 16px; border-top: 1px solid var(--border); }
.hv-decide__limit .hv-label { margin-right: 8px; }
.hv-decide__example {
  display: flex; flex-direction: column; gap: 6px; background: var(--bg-elev); border: 1px solid var(--border);
  border-radius: var(--radius-sm); padding: 14px 16px; color: var(--fg); transition: border-color 160ms;
}
.hv-decide__example:hover { border-color: var(--border-strong); }
.hv-decide__ex-title { font-size: 15px; font-weight: 600; line-height: 1.35; }
@media (max-width: 500px) {
  .hv-decide__t { font-size: 17px; }
  .hv-decide__panel { padding: 20px; }
}

/* ------------------------------------------------------------
   SAMPLE STUDY
   ------------------------------------------------------------ */
.hv-split-head {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
  gap: 24px 56px; align-items: end;
}
.hv-study { margin-top: 40px; background: var(--bg-elev); border: 1px solid var(--border); border-radius: var(--radius-md); overflow: hidden; }
.hv-study__meta {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; padding: 14px 20px;
  border-bottom: 1px solid var(--border); font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.1em; color: var(--fg-dim);
}
.hv-study__grid { display: grid; grid-template-columns: minmax(220px, 1fr) 2fr; }
.hv-study__steps { display: flex; flex-direction: column; border-right: 1px solid var(--border); padding: 8px 0; }
.hv-study__step {
  display: flex; align-items: baseline; gap: 12px; text-align: left; border-left: 3px solid transparent;
  padding: 14px 20px; color: var(--fg); font-size: 15px; font-weight: 500; transition: background-color 160ms;
}
.hv-study__step:hover { background: var(--bg); }
.hv-study__step.is-on { background: var(--bg); border-left-color: var(--accent); font-weight: 700; }
.hv-study__n { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.1em; color: var(--fg-dim); }
.hv-study__step.is-on .hv-study__n { color: var(--accent); }
.hv-study__panel { padding: clamp(24px, 3vw, 40px); min-height: 360px; display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.hv-study__verbatim { font-size: clamp(22px, 2.4vw, 30px); line-height: 1.3; font-weight: 500; letter-spacing: -0.01em; margin: 0; max-width: 30ch; text-wrap: pretty; }
.hv-study__note { font-size: 15px; line-height: 1.5; color: var(--fg-muted); margin: 0; max-width: 56ch; }
.hv-study__body { font-size: 17px; line-height: 1.5; color: var(--fg-muted); margin: 0; max-width: 56ch; }
.hv-study__stat { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; font-size: 15px; color: var(--fg-muted); }
.hv-study__num { font-family: var(--mono); font-size: 40px; font-weight: 500; letter-spacing: -0.02em; color: var(--fg); }
.hv-study__evidence { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 12px; }
.hv-study__ev { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.hv-study__ev p { font-size: 15px; line-height: 1.5; margin: 0; }
.hv-study__rec {
  border: 1px solid var(--border-strong); border-radius: var(--radius-sm); box-shadow: 4px 4px 0 var(--accent);
  padding: 24px; display: flex; flex-direction: column; gap: 14px; max-width: 640px; background: var(--bg-elev);
}
.hv-study__rec p { font-size: 16px; line-height: 1.55; margin: 0; }
.hv-study__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.hv-study__nav { margin-top: auto; display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; padding-top: 8px; }
.hv-study__navbtns { display: flex; gap: 8px; }
.hv-study__navbtns .btn { border-color: var(--border); }
.hv-study__navbtns .btn:last-child { border-color: var(--border-strong); }
.hv-study__navbtns .btn:disabled { opacity: 0.45; cursor: default; }
@media (max-width: 760px) {
  .hv-study__grid { grid-template-columns: 1fr; }
  .hv-study__steps { flex-direction: row; flex-wrap: wrap; gap: 6px; border-right: 0; border-bottom: 1px solid var(--border); padding: 12px; }
  .hv-study__step { border: 1px solid var(--border); border-radius: 999px; padding: 8px 12px; font-size: 14px; gap: 8px; white-space: nowrap; }
  .hv-study__step.is-on { border-color: var(--accent); }
  .hv-study__panel { min-height: 0; }
}

.hv-numlist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; border-top: 1px solid var(--border); }
.hv-numlist li { display: flex; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--border); font-size: 16px; line-height: 1.5; }
.hv-numlist li > span:first-child { font-family: var(--mono); font-size: 11px; color: var(--fg-dim); padding-top: 3px; min-width: 2.2em; }
.hv-numlist li > span.hv-accent { color: var(--accent); }
.hv-numlist--inverse { border-top-color: rgba(245, 244, 240, 0.18); margin-top: 8px; }
.hv-numlist--inverse li { border-bottom-color: rgba(245, 244, 240, 0.18); }
.hv-numlist--inverse li > span:first-child { color: rgba(245, 244, 240, 0.5); }
.hv-numlist--inverse li > span.hv-on-ink-accent { color: #8494EC; }
.hv-mono-xs.hv-accent, .hv-label.hv-accent { color: var(--accent); }
.hv-mono-xs.hv-on-ink-accent { color: #8494EC; }

/* ------------------------------------------------------------
   METHODS
   ------------------------------------------------------------ */
.hv-divider { display: flex; align-items: center; gap: 16px; margin-top: 40px; }
.hv-divider span { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em; color: var(--fg-muted); min-width: 0; text-wrap: balance; }
.hv-divider i { flex: 1; height: 1px; background: var(--border); min-width: 24px; }
.hv-methods__people { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: 16px; margin-top: 20px; }
.hv-methods__synthetic { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 16px; margin-top: 20px; }

.hv-method {
  background: var(--bg-elev); border: 1px solid var(--border); border-radius: var(--radius-md);
  padding: 20px; display: flex; flex-direction: column; gap: 12px; min-width: 0;
}
.hv-method--media { padding: 0; overflow: hidden; gap: 0; }
.hv-method__media { background: var(--bg-inverse); position: relative; } /* sized by the 16:10 frame alone */
.hv-method__frame { position: relative; aspect-ratio: 16 / 10; width: 100%; }
.hv-method__frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* Captions sit over the bottom of the image, so both "from real people" cards are the same 16:10 window. */
.hv-method__caption {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 40px 14px 12px;
  display: flex; flex-direction: column; gap: 8px;
  background: linear-gradient(to top, rgba(19, 21, 26, 0.94) 0%, rgba(19, 21, 26, 0.8) 55%, rgba(19, 21, 26, 0) 100%);
}
.hv-method__caption-row { display: flex; justify-content: flex-end; gap: 12px; flex-wrap: wrap; }
.hv-method__quote { font-size: 14px; line-height: 1.45; color: var(--fg-inverse); }
.hv-method__quote u { text-decoration: none; border-bottom: 2px solid #8494EC; }
.hv-emo { display: flex; align-items: flex-end; gap: 2px; height: 30px; }
.hv-emo i { flex: 1; display: block; background: rgba(245, 244, 240, 0.28); }
.hv-emo i.is-peak { background: #8494EC; }
.hv-method__body { padding: 24px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
.hv-method__title { font-size: 21px; font-weight: 800; letter-spacing: -0.01em; margin: 4px 0 0; }
.hv-method__title--lg { font-size: 26px; }
.hv-method__desc { font-size: 15px; line-height: 1.5; color: var(--fg-muted); margin: 0; max-width: 48ch; text-wrap: pretty; }
.hv-method__meta {
  margin: auto 0 0; padding-top: 14px; border-top: 1px solid var(--border);
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px 20px;
}
.hv-method__meta div { display: flex; flex-direction: column; gap: 2px; }
.hv-method__meta dt { font-family: var(--mono); font-size: 10px; letter-spacing: 0.14em; color: var(--fg-dim); }
.hv-method__meta dd { margin: 0; font-size: 13.5px; line-height: 1.45; }
.hv-method__viz {
  background: var(--bg-elev-2); border-radius: var(--radius-sm); padding: 14px; min-height: 148px;
  display: flex; flex-direction: column; gap: 10px;
}
.hv-dist { display: flex; flex-direction: column; gap: 4px; }
.hv-dist__row { display: flex; justify-content: space-between; font-family: var(--mono); font-size: 10px; color: var(--fg); margin-top: 6px; }
.hv-dist__row--muted { color: var(--fg-muted); margin-top: 0; }
.hv-dist__track { height: 10px; background: var(--bg-elev); }
.hv-dist__track i { display: block; height: 100%; background: var(--accent); }
.hv-dist__track i.is-muted { background: #9A9DA3; }
.hv-persona { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.4; }
.hv-persona__tag {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; white-space: nowrap; flex: none;
  background: var(--bg-elev); border: 1px solid var(--border-strong); border-radius: 3px; padding: 2px 6px;
}
.hv-trace { list-style: none; margin: 0; padding: 0; }
.hv-trace li {
  display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 10px; padding: 6px 0; border-bottom: 1px solid var(--border);
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.04em;
}
.hv-trace li span { color: var(--fg-dim); }
.hv-trace li.is-fail { color: var(--alert); }

/* ------------------------------------------------------------
   TWINS (ink band)
   ------------------------------------------------------------ */
.hv-twins { padding: 88px 0; }
.hv-twins__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: 48px 72px; }
.hv-twins__copy, .hv-twins__proof { display: flex; flex-direction: column; gap: 20px; }
.hv-twins__proof { gap: 18px; }
.hv-twins__title { font-size: clamp(34px, 4vw, 54px); }
.hv-twins__lede { font-size: 18px; line-height: 1.5; color: rgba(245, 244, 240, 0.86); margin: 0; max-width: 48ch; text-wrap: pretty; }
.hv-replica { border: 1px solid rgba(245, 244, 240, 0.18); border-radius: var(--radius-md); overflow: hidden; }
.hv-replica__row {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px 20px; padding: 18px 20px;
  border-bottom: 1px solid rgba(245, 244, 240, 0.12); background: #1B1E26; font-size: 15px; line-height: 1.4;
}
.hv-replica__row:last-child { border-bottom: 0; }
.hv-replica__nums { font-family: var(--mono); font-size: 13px; line-height: 1.5; color: rgba(245, 244, 240, 0.6); }
.hv-replica__nums i { font-style: normal; color: rgba(245, 244, 240, 0.4); }
.hv-replica__nums b { font-weight: 400; color: #F5F4F0; }
.hv-twins__caveat { font-size: 14px; line-height: 1.55; color: rgba(245, 244, 240, 0.6); margin: 0; text-wrap: pretty; }
@media (max-width: 700px) { .hv-twins { padding: 64px 0; } }

/* ------------------------------------------------------------
   WORD FROM THE ROOM
   ------------------------------------------------------------ */
.hv-room { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 40px 48px; margin-top: 32px; }
.hv-room__item { margin: 0; display: flex; flex-direction: column; gap: 18px; padding-top: 20px; border-top: 1px solid var(--border); }
.hv-room__item blockquote { margin: 0; font-size: 15.5px; line-height: 1.55; text-wrap: pretty; }
.hv-room__item figcaption { display: flex; align-items: center; gap: 12px; margin-top: auto; }
.hv-room__item img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex: none; }
.hv-room__item figcaption > span { display: flex; flex-direction: column; gap: 2px; font-size: 13px; color: var(--fg-muted); }
.hv-room__item figcaption b { font-size: 14px; font-weight: 700; color: var(--fg); }

/* ------------------------------------------------------------
   TRUST + METHOD LINKS
   ------------------------------------------------------------ */
.hv-trustlinks { padding: 0 0 72px; }
.hv-trustlinks__box {
  border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--bg-elev); padding: 24px;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 24px;
}
.hv-trustlinks__col { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.hv-trustlinks__tags { display: flex; flex-wrap: wrap; gap: 8px; }
.hv-trustlinks__a { font-size: 15px; font-weight: 500; color: var(--fg); }
.hv-trustlinks__a:hover { color: var(--accent); }
@media (max-width: 760px) { .hv-trustlinks__box { grid-template-columns: 1fr; } }

/* ------------------------------------------------------------
   CLOSE
   ------------------------------------------------------------ */
.hv-close { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 40px 72px; align-items: start; }
.hv-close__copy, .hv-close__action { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.hv-close__title { font-size: clamp(36px, 4.4vw, 60px); }
.hv-close { align-items: end; }
.hv-close__action { gap: 10px; }
.hv-close__both { margin: 0; font-size: clamp(17px, 1.5vw, 20px); line-height: 1.45; color: var(--fg); max-width: 34ch; text-wrap: pretty; }
.hv-close__signin { font-size: 14px; color: var(--fg-muted); }
.hv-close__signin:hover { color: var(--fg); }

/* Two paths side by side: book a call | send a brief (stack on narrow screens). */
.hv-paths { margin-top: 48px; display: flex; flex-direction: column; gap: 20px; }
.hv-paths__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: 16px; align-items: stretch; }
.hv-path {
  background: var(--bg-elev); border: 1px solid var(--border); border-radius: var(--radius-md);
  padding: clamp(18px, 2.4vw, 28px); display: flex; flex-direction: column; gap: 20px; min-width: 0;
}
.hv-path:focus-within { border-color: var(--border-strong); box-shadow: 4px 4px 0 var(--accent); }
.hv-path__head { display: flex; flex-direction: column; gap: 8px; }
.hv-path__title { margin: 0; font-size: clamp(24px, 2.2vw, 30px); font-weight: 700; letter-spacing: -0.01em; }
.hv-path__desc { margin: 0; font-size: 15px; line-height: 1.5; color: var(--fg-muted); }
.hv-path__out { display: flex; flex-direction: column; gap: 10px; }
.hv-path__out .hv-numlist li { padding: 11px 0; font-size: 15px; }
/* once the scheduler is loaded it carries the detail itself — drop the list so the widget sits up top */
.hv-path:has(.calendly-embed__widget) .hv-path__out { display: none; }
.hv-path__foot { margin-top: auto; display: flex; flex-direction: column; gap: 6px; align-items: flex-start; font-size: 13px; color: var(--fg-dim); }
/* the shared consent-gated Calendly embed: a button until loaded, then the widget fills the card */
.hv-path .calendly-embed { margin: 0; max-width: none; border: 0; box-shadow: none; background: transparent; padding: 0; }
.hv-path .calendly-embed__widget { border: 1px solid var(--border); border-radius: var(--radius-sm); overflow: hidden; }
/* the brief form sits flat inside its card */
.hv-path .hv-brief { background: none; border: 0; border-radius: 0; padding: 0; }
.hv-path .hv-brief--sent { border: 1px solid var(--accent); border-radius: var(--radius-sm); padding: 20px; box-shadow: 4px 4px 0 var(--accent); }
.hv-brief__both a { color: var(--accent); text-decoration: underline; }

/* ------------------------------------------------------------
   SEND A BRIEF (contact form, second path card in the close section)
   ------------------------------------------------------------ */
.hv-brief {
  background: var(--bg-elev); border: 1px solid var(--border-strong); border-radius: var(--radius-md);
  padding: 22px; display: flex; flex-direction: column; gap: 14px;
}
.hv-brief__row { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 14px; }
.hv-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.hv-field > span { font-size: 13px; font-weight: 600; color: var(--fg); }
.hv-field > span i { font-style: normal; font-weight: 400; color: var(--fg-dim); margin-left: 4px; }
.hv-field input, .hv-field select, .hv-field textarea {
  font: inherit; font-size: 15px; color: var(--fg); background: var(--bg-elev);
  border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 10px 12px; width: 100%; min-width: 0;
}
.hv-field textarea { resize: vertical; min-height: 104px; line-height: 1.5; }
.hv-field input:focus, .hv-field select:focus, .hv-field textarea:focus {
  outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-ring);
}
.hv-brief__hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.hv-brief__note { margin: 0; font-size: 13px; color: var(--fg-muted); }
.hv-brief__actions { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.hv-brief__actions .btn:disabled { opacity: 0.6; cursor: default; }
.hv-brief__err { margin: 0; font-size: 14px; color: var(--alert); }
.hv-brief__err a { color: var(--accent); text-decoration: underline; }
.hv-brief__privacy { margin: 0; font-size: 12px; color: var(--fg-dim); }
.hv-brief__privacy a { text-decoration: underline; }
.hv-brief--sent { gap: 8px; border-color: var(--accent); box-shadow: 4px 4px 0 var(--accent); }
.hv-brief--sent p { margin: 0; font-size: 16px; line-height: 1.5; }