/* feat-20261027-buzzar-ui-handover (parity round): additions the handover stylesheet (hv.css) does not carry.
   hv.css is generated from the supplied reference and must not be edited by hand; everything Buzzar needs on
   top of it lives here: the account menu, the session block, honest labels and the live-data states.
   Colours come from the handover tokens only (--bg, --paper, --ink, --muted, --line, --green, --bright, --mint, --sage, --dark). */

body.hv .preview {
  display: none;
}

body.hv .skip {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 100;
  padding: 10px 14px;
  background: var(--dark);
  color: #fff;
  border-radius: 6px;
}
body.hv .skip:focus {
  left: 12px;
  top: 8px;
}

/* ---- header: right end ---- */
body.hv .header-tools .header-signin {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--ink);
  background: var(--paper);
  white-space: nowrap;
}
body.hv .header-tools .header-signin[hidden] {
  display: none;
}
body.hv .header-tools .header-signin:hover {
  border-color: var(--green);
}
body.hv .header-tools button.profile-link {
  display: inline-grid;
  place-items: center;
  min-width: 44px;
  min-height: 44px;
  cursor: pointer;
  border: 0;
}
body.hv .header-tools button.profile-link .account-glyph {
  width: 20px;
  height: 20px;
}
body.hv .header-tools button.profile-link .account-initials[hidden],
body.hv .header-tools button.profile-link .account-glyph[hidden] {
  display: none;
}
body.hv .header-tools .utility {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

/* ---- account menu ---- */
body.hv .account-menu[hidden] {
  display: none;
}
body.hv .account-menu {
  position: fixed;
  inset: 0;
  z-index: 60;
}
body.hv .account-menu-scrim {
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, var(--dark) 38%, transparent);
}
body.hv .account-menu-panel {
  position: absolute;
  top: 12px;
  right: 12px;
  bottom: 12px;
  width: min(380px, calc(100vw - 24px));
  display: flex;
  flex-direction: column;
  background: var(--paper);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: var(--shadow);
  overflow: hidden;
}
body.hv .account-menu-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--green);
}
body.hv .account-menu-close {
  width: 44px;
  height: 44px;
  font-size: 24px;
  line-height: 1;
  border-radius: 8px;
}
body.hv .account-menu-body {
  overflow-y: auto;
  padding: 6px 18px 18px;
}
body.hv .account-menu-group {
  display: flex;
  flex-direction: column;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}
body.hv .account-menu-group:last-child {
  border-bottom: 0;
}
body.hv .account-menu-group[aria-label='Role tools']:not(:has(a:not([hidden]))) {
  display: none;
}
body.hv .account-menu-title {
  margin: 0 0 4px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: var(--muted);
}
body.hv .account-menu-group a,
body.hv .account-menu-group .account-theme {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 0 8px;
  margin: 0 -8px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 550;
  text-align: left;
  color: var(--ink);
}
body.hv .account-menu-group a[hidden] {
  display: none;
}
body.hv .account-menu-group a:hover,
body.hv .account-menu-group .account-theme:hover {
  background: var(--sage);
}
body.hv .account-menu-group a[aria-current='page'] {
  color: var(--green);
}
body.hv #account-session .bff-session {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
}
body.hv #account-session .bff-session-who {
  font-size: 14.5px;
  color: var(--muted);
  overflow-wrap: anywhere;
}
body.hv #account-session .bff-session a,
body.hv #account-session .bff-session button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--paper);
  color: var(--ink);
  font-size: 15.5px;
  font-weight: 600;
}
body.hv #account-session .bff-session a:hover,
body.hv #account-session .bff-session button:hover {
  border-color: var(--green);
}
html.bzr-scroll-lock,
html.bzr-scroll-lock body {
  overflow: hidden;
}

/* ---- footer: reference bottom bar, Buzzar links ---- */
body.hv #footer .footer-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 6px;
}
body.hv #footer .footer-controls .footer-button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}
body.hv #footer .footer-controls .footer-button[hidden] {
  display: none;
}
body.hv[data-page='home'] #footer .footer-extra,
body.hv[data-page='ask'] #footer .footer-extra {
  display: none;
}

/* The app wrapper sits between body and main; the one-screen pages need main to be a direct flex child of body. */
body.hv[data-page='home'] #app,
body.hv[data-page='ask'] #app {
  display: contents;
}

/* main frame on the one-screen pages: the header gutters (--gutter) and no centred max-width from older sheets */
body.hv[data-page='home'] #main,
body.hv[data-page='ask'] #main {
  max-width: none;
  margin: 0;
  padding: 0 var(--gutter);
}

/* footer links: 32px high on pointer devices (the reference bottom bar is 46px), 44px on touch screens */
body.hv #footer .footer-controls .footer-button {
  min-height: 32px;
}
@media (pointer: coarse), (max-width: 900px) {
  body.hv #footer .footer-controls .footer-button {
    min-height: 44px;
  }
}

/* phone: the one-screen pages keep the footer links on a single scrolling row so the page never scrolls */
@media (max-width: 700px) {
  body.hv[data-page='home'] #footer .footer-controls,
  body.hv[data-page='ask'] #footer .footer-controls {
    flex-wrap: nowrap;
    overflow-x: auto;
    max-width: 100%;
    scrollbar-width: none;
  }
}

/* live-data notes inside the reference panels */
body.hv .live-note {
  display: grid;
  gap: 10px;
  justify-items: start;
  padding: 18px 0;
  color: var(--muted);
}
body.hv .live-note p {
  margin: 0;
  font-size: 15px;
}

/* ---- Ask Buzzar: the quiet Refine row, status line and the answer's extras ---- */
body.hv .ask-examples {
  flex-wrap: wrap;
  row-gap: 8px;
}
body.hv .ask-examples .ask-refine {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}
body.hv .ask-refine-label {
  font-size: 10px;
  letter-spacing: 1.4px;
  color: var(--muted);
}
body.hv .ask-refine-field {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  color: var(--muted);
}
body.hv .ask-refine-field select {
  margin: 0;
  min-height: 34px;
  max-width: 150px;
  padding: 0 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--paper);
  color: var(--ink);
  font-size: 12px;
}
body.hv .ask-examples a.prompt {
  display: inline-flex;
  align-items: center;
}
body.hv .ask-status {
  margin: 0;
  min-height: 0;
  font-size: 12.5px;
  color: var(--muted);
}
body.hv .ask-status:empty {
  display: none;
}
body.hv .canvas-status .button,
body.hv .canvas-status .text-link {
  font-size: 12.5px;
  min-height: 32px;
  padding: 0 12px;
}
body.hv .recommendation-toggles {
  display: inline-flex;
  gap: 14px;
}
body.hv .recommendation-note .text-link {
  margin-left: auto;
  font-size: 11.5px;
}
body.hv .recommendation-copy h3 a {
  color: inherit;
}
body.hv .answer-detail {
  overflow: auto;
}
body.hv dialog .bzr-advisor-matched {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  list-style: none;
  padding: 0;
}
body.hv dialog .bzr-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

body.hv .ask-examples {
  align-items: center;
}
body.hv .ask-refine-field select {
  min-height: 28px;
}
body.hv [tabindex='-1']:focus {
  outline: none;
}
body.hv .ask-foot .bzr-ai-note {
  font-size: 11.5px;
  line-height: 1.35;
}
@media (max-width: 700px) {
  body.hv .ask-examples {
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
    padding-bottom: 2px;
  }
  body.hv .ask-examples > *,
  body.hv .ask-examples .ask-refine > * {
    flex: 0 0 auto;
    white-space: nowrap;
  }
  body.hv .ask-examples .ask-refine {
    margin-left: 0;
    flex-wrap: nowrap;
  }
  body.hv .ask-refine-field select {
    min-height: 40px;
  }
  body.hv .ask-foot .bzr-ai-note {
    font-size: 10px;
    line-height: 1.3;
    white-space: normal;
    min-width: 0;
    flex: 1;
    text-align: left;
  }
  /* the advisory note is longer than the reference's simulated-advisor line: give it two lines */
  body.hv .ask-page.ask-v2 {
    grid-template-rows: 67px 75px minmax(39px, auto) minmax(0, 1fr) 44px;
  }
  body.hv .ask-v2 .ask-foot {
    align-items: center;
    justify-content: flex-start;
  }
}

/* ---- Guided discovery page: the reference's discovery scene as a page ---- */
body.hv[data-page='discover'] #main {
  width: 100%;
  max-width: 940px;
  margin: 0 auto;
  padding: 36px var(--gutter) 64px;
}
body.hv .bzr-discover .phase-heading h1 {
  font-size: clamp(30px, 4vw, 44px);
  letter-spacing: -1.4px;
  font-weight: 500;
  margin: 0 0 12px;
}
body.hv .bzr-discover .phase-heading p:not(.eyebrow) {
  font-size: 15.5px;
  color: var(--muted);
}
body.hv .bzr-discover .discovery-path {
  margin: 22px 0 8px;
}
body.hv .bzr-discover .discovery-path button {
  min-height: 44px;
}
body.hv .bzr-discover .guide-scene {
  min-height: 0;
  border: 0;
  box-shadow: none;
  background: transparent;
  padding: 18px 0 8px;
}
body.hv .bzr-discover .guide-scene h3 {
  font-size: 24px;
  letter-spacing: -0.7px;
  font-weight: 500;
  margin: 8px 0 18px;
}
body.hv .bzr-discover .guide-options button {
  min-height: 52px;
  font-size: 15.5px;
}
body.hv .bzr-discover .guide-context {
  font-size: 13.5px;
}
/* the reference option arrow, as decoration (the button's own text stays the option) */
body.hv .bzr-discover .guide-options button::after {
  content: '↗';
  flex: none;
  color: var(--green);
}
/* radios and checkboxes stay small controls (the reference input rule would stretch them to the field width) */
body.hv input[type='radio'],
body.hv input[type='checkbox'] {
  width: 18px;
  height: 18px;
  min-height: 0;
  padding: 0;
  margin: 2px 0 0;
  flex: none;
  accent-color: var(--green);
}
body.hv .bzr-choice {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: var(--paper);
  cursor: pointer;
}
body.hv .bzr-choice:has(input:checked) {
  border-color: var(--green);
  background: var(--sage);
}
body.hv .offering-hero .bzr-toolbar {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin: 18px 0 0;
}
body.hv .offering-hero .bzr-lead,
body.hv .offering-hero .bzr-by {
  color: var(--muted);
}
body.hv .bzr-request-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 22px 0;
}
body.hv .bzr-crumbs,
body.hv .bzr-crumbs a {
  font-size: 12.5px;
  color: var(--muted);
  text-decoration: none;
}
body.hv .bzr-crumbs a {
  font-weight: 600;
  color: var(--ink);
}
/* provider tiles are cards, not inline links */
body.hv .bzr-page a.provider-tile,
body.hv .bzr-page a.provider-tile:hover {
  color: var(--ink);
  text-decoration: none;
}
body.hv .bzr-page a.provider-tile > span:last-child {
  color: var(--green);
  font-weight: 600;
}
body.hv .guide-match-list {
  display: grid;
  border-top: 1px solid var(--line);
}
body.hv .guide-match-row {
  display: grid;
  gap: 6px;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
}
body.hv .guide-match-link {
  display: grid;
  grid-template-columns: 150px 1fr 14px;
  gap: 12px;
  align-items: center;
}
body.hv .guide-match-link span {
  font-size: 11.5px;
  color: var(--green);
}
body.hv .guide-match-link strong {
  font-size: 16.5px;
  font-weight: 500;
  line-height: 1.4;
}
body.hv .guide-match-link i {
  font-style: normal;
  color: var(--green);
}
body.hv .guide-match-why {
  margin: 0 0 0 162px;
  font-size: 14px;
  line-height: 1.6;
  color: var(--muted);
}
body.hv .guide-match-why b {
  color: var(--ink);
  font-weight: 600;
}
body.hv .guide-match-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px;
  margin-left: 162px;
}
body.hv .guide-match-actions .text-link,
body.hv .guide-match-actions .bzr-toggle {
  min-height: 44px;
  font-size: 13.5px;
}
body.hv .bzr-discover .guide-back {
  min-height: 44px;
  margin-top: 8px;
}
@media (max-width: 620px) {
  body.hv .guide-match-link {
    grid-template-columns: 1fr 14px;
  }
  body.hv .guide-match-link span {
    grid-column: 1 / -1;
  }
  body.hv .guide-match-why,
  body.hv .guide-match-actions {
    margin-left: 0;
  }
}

/* ---- Catalogue: the reference's marketplace layout around the live, paged catalogue ---- */
body.hv .catalog-layout {
  align-items: start;
}
body.hv .catalog-layout .filter-fields {
  display: grid;
  gap: 4px;
}
body.hv .catalog-layout .filter-fields .bzr-filter-field {
  display: grid;
  gap: 6px;
}
body.hv .catalog-layout .bzr-facets {
  display: grid;
  gap: 18px;
  margin-top: 18px;
}
body.hv .catalog-layout .bzr-facet {
  border: 0;
  padding: 0;
  margin: 0;
  min-width: 0;
}
body.hv .catalog-layout .bzr-facet legend {
  padding: 0;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--muted);
}
body.hv .catalog-layout .bzr-check {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  font-size: 14.5px;
}
body.hv .catalog-layout .bzr-facet-note,
body.hv .catalog-layout .bzr-facet-none {
  font-size: 13px;
  color: var(--muted);
}
body.hv .catalog-results {
  min-width: 0;
}
body.hv ul.card-grid {
  list-style: none;
  padding: 0;
  margin: 0;
}
body.hv ul.card-grid > li {
  display: contents;
}
body.hv .offering-card .live-offering-meta,
body.hv .offering-card .live-offering-facets,
body.hv .offering-card .live-offering-provider {
  margin: 0 0 6px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--muted);
}
body.hv .offering-card .live-offering-provider a {
  color: var(--green);
  font-weight: 600;
}
body.hv .offering-card .bzr-summary {
  font-size: 14.5px;
}
body.hv .offering-card .bzr-more {
  min-height: 44px;
  padding: 0 4px;
  font-size: 13.5px;
  color: var(--green);
}
body.hv .offering-card .bzr-badge-new {
  display: inline-block;
  margin-bottom: 6px;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--mint);
  color: var(--green);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.6px;
  text-transform: uppercase;
}
body.hv .offering-card .card-actions .bzr-toggle {
  min-height: 44px;
  font-size: 13.5px;
}
body.hv .live-catalogue-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin: 24px 0;
}
body.hv .results-count {
  margin: 0 0 14px;
}

/* ---- standard pages: the reference frame (shared header gutters, no centred max-width) and no older eyebrow rule ---- */
body.hv #app > main,
body.hv #app.internal > main {
  max-width: none;
  margin-inline: auto;
  padding: 0 var(--gutter) 52px;
  min-height: calc(100vh - 210px);
}
body.hv .page-head .eyebrow::before {
  content: none;
}
body.hv {
  min-height: 100dvh;
}
body.hv:not([data-page='home']):not([data-page='ask']) {
  display: flex;
  flex-direction: column;
}
body.hv:not([data-page='home']):not([data-page='ask']) #app {
  flex: 1 0 auto;
}

/* ---- headings on every page: the reference page-head scale (43px, tight tracking), green eyebrow ---- */
body.hv .page-head h1,
body.hv .bzr-page h1,
body.hv .bzr-detail-main h1 {
  font-size: clamp(34px, 3vw, 43px);
  font-weight: 550;
  letter-spacing: -1.8px;
  line-height: 1.08;
  margin: 12px 0;
}
body.hv .bzr-eyebrow {
  display: block;
  margin: 0 0 10px;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 1.65px;
  text-transform: uppercase;
  color: var(--green);
}
body.hv .bzr-page {
  padding: 38px 0 40px;
}
body.hv .bzr-page > .page-head {
  padding-top: 0;
}

/* live catalogue cards: the art runs edge to edge, the text sits in the reference card-content padding */
body.hv .card.live-offering {
  padding: 0;
  gap: 0;
  background: var(--paper);
  border-color: var(--line);
}
body.hv .live-offering .card-content {
  padding: 22px;
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 8px;
}
body.hv .provider-find {
  display: grid;
  gap: 6px;
  max-width: 420px;
  margin: 0 0 24px;
  font-weight: 600;
}

/* ---- fix round: catalogue search, landing blocks, Recently viewed, How it works (handover style) ---- */
body.hv .bzr-catalog-search {
  display: grid;
  gap: 6px;
  max-width: 640px;
  margin: 0 0 22px;
  font-weight: 600;
}
body.hv .bzr-catalog-search-row {
  display: flex;
  gap: 10px;
}
body.hv .bzr-catalog-search-row input {
  flex: 1;
  min-width: 0;
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--paper);
  color: var(--ink);
  font: inherit;
}
body.hv .bzr-catalog-search-row button {
  min-height: 44px;
  padding: 0 20px;
  border: 0;
  border-radius: var(--radius);
  background: var(--green);
  color: var(--paper);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
body.hv .bzr-catalog-landing {
  display: grid;
  gap: 26px;
  margin: 0 0 30px;
}
body.hv .bzr-stat-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 28px;
  padding: 16px 20px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--sage);
}
body.hv .bzr-stat-strip .bzr-stat-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  border: 0;
  padding: 0;
}
body.hv .bzr-stat-strip .bzr-stat-item strong {
  font-size: 23.5px;
  letter-spacing: -0.6px;
  color: var(--green);
}
body.hv .bzr-stat-strip .bzr-stat-item span {
  font-size: 13.5px;
  color: var(--muted);
}
body.hv .bzr-need-lanes h2,
body.hv .bzr-recently-published h2,
body.hv .bzr-recently-viewed h2,
body.hv .bzr-how-steps h2,
body.hv .bzr-explainer h2 {
  font-size: 23.5px;
  letter-spacing: -0.6px;
  margin: 0 0 12px;
}
body.hv .bzr-lanes {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 12px;
}
body.hv a.bzr-lane,
body.hv span.bzr-lane {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 64px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--paper);
  color: var(--ink);
  font-weight: 700;
  text-decoration: none;
}
body.hv a.bzr-lane:hover,
body.hv a.bzr-lane:focus-visible {
  border-color: var(--green);
}
body.hv .bzr-lane-count {
  font-size: 14.5px;
  font-weight: 500;
  color: var(--muted);
}
body.hv .bzr-recently-viewed,
body.hv .bzr-recently-published {
  margin: 0 0 26px;
}
body.hv .bzr-how {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 14px;
  counter-reset: how;
}
body.hv .bzr-how li {
  counter-increment: how;
  padding: 18px 20px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--paper);
  line-height: 1.5;
}
body.hv .bzr-how li strong,
body.hv .bzr-how li span {
  display: block;
}
body.hv .bzr-how li strong {
  font-size: 19.5px;
  margin-bottom: 4px;
}
body.hv .bzr-how li span {
  color: var(--muted);
}
body.hv .bzr-how li::before {
  content: counter(how);
  display: block;
  margin-bottom: 8px;
  font-size: 13.5px;
  font-weight: 700;
  color: var(--green);
}
body.hv .bzr-explainer {
  margin-top: 30px;
}
body.hv .bzr-explainer ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
}
body.hv .bzr-explainer li {
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--paper);
}
body.hv .bzr-explainer li p {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.5;
}
@media (max-width: 480px) {
  body.hv .bzr-catalog-search-row {
    flex-direction: column;
  }
}

/* ---- staff, partner and checker screens: undo what the global resets took from them ----
   body.hv button { background: none; border: 0 } and the heading/paragraph resets apply to every page, so buttons
   styled only by the older sheets (.secondary, .btn) lost their outline, and panel cards lost their spacing. */
body.hv .panel button.secondary,
body.hv .bzr-panel button.secondary,
body.hv .bzr-panel button.btn,
body.hv #bzr-recommender-live button.btn,
body.hv #bzr-outcome-measures-live button.secondary,
body.hv .bzr-review-row button.secondary,
body.hv .bzr-grant-row button.secondary,
body.hv .bzr-live-row button.secondary,
body.hv .bzr-seller-row button.secondary,
body.hv .bzr-reject-form button.secondary {
  min-height: 44px;
  padding: 0 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: transparent;
  color: var(--ink);
  font-weight: 600;
}
body.hv .panel button.secondary:hover,
body.hv .bzr-panel button.secondary:hover,
body.hv .bzr-panel button.btn:hover,
body.hv #bzr-recommender-live button.btn:hover,
body.hv #bzr-outcome-measures-live button.secondary:hover {
  border-color: var(--green);
  background: var(--sage);
}
body.hv #bzr-recommender-live .bzr-rec-stages button[aria-pressed='true'] {
  border-color: var(--green);
  background: var(--mint);
}
body.hv .bzr-panel button.btn.primary,
body.hv #bzr-recommender-live button.btn.primary {
  border-color: transparent;
  background: var(--green);
  color: var(--paper);
}
body.hv .bzr-panel button.btn.primary:disabled {
  background: var(--muted);
}
/* a work screen that is a bare panel starts clear of the header and separates its rows */
body.hv #main > section.panel {
  margin-top: 28px;
  margin-bottom: 28px;
  padding: 24px 28px;
}
body.hv #main > section.panel > h2 {
  margin: 22px 0 10px;
}
body.hv #main > section.panel > h2:first-child {
  margin-top: 0;
}
body.hv .bzr-review-row,
body.hv .bzr-grant-row,
body.hv .bzr-live-row,
body.hv .bzr-seller-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin: 0 0 14px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--paper);
}
body.hv .bzr-review-row > :not(button),
body.hv .bzr-grant-row > :not(button),
body.hv .bzr-live-row > :not(button),
body.hv .bzr-seller-row > :not(button) {
  flex: 0 0 100%;
}
body.hv .bzr-review-row p,
body.hv .bzr-grant-row p,
body.hv .bzr-live-row p,
body.hv .bzr-seller-row p {
  margin: 0;
}
body.hv .bzr-review-content {
  margin: 8px 0;
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--sage);
}
body.hv .bzr-review-content summary {
  min-height: 32px;
  align-items: center;
}
body.hv .bzr-review-content[open] > :not(summary) {
  margin-top: 10px;
}
body.hv #bzr-seller form {
  margin-top: 22px;
}
body.hv #bzr-seller form label {
  display: block;
  margin-top: 14px;
}

/* phone footer row scrolls sideways: a sticky chevron on a fading edge reads as "more" */
@media (max-width: 700px) {
  body.hv[data-page='home'] #footer .footer-controls,
  body.hv[data-page='ask'] #footer .footer-controls {
    padding-right: 0;
  }
  body.hv[data-page='home'] #footer .footer-controls::after,
  body.hv[data-page='ask'] #footer .footer-controls::after {
    content: '\203A';
    pointer-events: none; /* decorative: it must not cover the last footer link */
    position: sticky;
    right: 0;
    flex: none;
    margin-left: auto;
    padding: 0 6px 0 28px;
    color: var(--ink, currentColor);
    font-size: 23.5px;
    line-height: 1;
    background: linear-gradient(to right, transparent, var(--bg) 45%);
  }
}

/* one page frame: header, subnav, footer and every page main share the same side gutters, so content lines up
   with the header at every width. Up to a 1600px frame it is 5vw; wider screens centre a 1600px frame. */
body.hv {
  --gutter: max(5vw, calc((100vw - 1600px) / 2));
}
body.hv #header,
body.hv #subnav,
body.hv #footer,
body.hv main,
body.hv #app > main,
body.hv #app.internal > main {
  padding-inline: var(--gutter);
}
body.hv main,
body.hv #app > main,
body.hv #app.internal > main,
body.hv[data-page='home'] #main,
body.hv[data-page='ask'] #main {
  max-width: none;
}
body.hv[data-page='discover'] #main {
  padding-inline: 0;
}

/* ---- offering detail alignment (solutions, services, accelerators) ---- */
/* request type options: one control column, then title over description, so every card reads the same */
body.hv .bzr-choices {
  gap: 10px;
}
body.hv .bzr-choice {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  column-gap: 12px;
  row-gap: 2px;
  align-items: start;
}
body.hv .bzr-choice input {
  grid-row: 1 / span 2;
}
body.hv .bzr-choice strong,
body.hv .bzr-choice span {
  grid-column: 2;
  margin: 0;
}
/* outcome journey stages: wide screens share rows (number, name, sub, state, detail), so names and states sit on common lines */
@media (min-width: 900px) {
  body.hv .bzr-stages {
    align-items: start;
  }
  body.hv .bzr-stage {
    grid-row: span 5;
    grid-template-rows: subgrid;
    align-content: start;
  }
}
body.hv .bzr-stage-name,
body.hv .bzr-stage-sub,
body.hv .bzr-stage-state,
body.hv .bzr-stage-detail {
  margin: 0;
  align-self: start;
}
/* actions share the card's left edge */
body.hv .bzr-outcome-journey > .primary,
body.hv .bzr-outcome-journey > button,
body.hv .bzr-outcome-journey > a {
  justify-self: start;
}
body.hv .bzr-benefits {
  padding: 0;
  margin: 0;
}
body.hv .bzr-choice {
  margin: 0;
}
body.hv .bzr-choices legend {
  padding: 0;
}
body.hv .bzr-outcome-journey > button:not(.primary) {
  padding-inline: 0;
  text-align: left;
}
/* detail lists share one label column, and chip lists sit on the section's left edge */
body.hv .bzr-detail-main dl.bzr-kv,
body.hv .bzr-detail-main dl.bzr-facts {
  grid-template-columns: 176px minmax(0, 1fr);
}
body.hv .bzr-detail-main ul.bzr-chips {
  padding-left: 0;
}
@media (max-width: 520px) {
  body.hv .bzr-detail-main dl.bzr-kv,
  body.hv .bzr-detail-main dl.bzr-facts {
    grid-template-columns: 120px minmax(0, 1fr);
  }
}
body.hv .bzr-stages {
  padding: 0;
  margin: 0;
}

/* ---- orbit rings: the outer ring, the middle ring the dot travels on and the inner circle are evenly spaced ----
   --ring-gap is the radial distance between neighbouring rings. The extra pixel on each side allows for the 1px
   borders: the outer ring is drawn from the track's padding edge, the inner one too, the track's own line sits between. */
body.hv .journey-v2 .wheel-canvas {
  --ring-gap: 14px;
}
body.hv .journey-v2 .orbit-outer-spin {
  inset: calc(-1 * (var(--ring-gap) + 1px));
}
body.hv .journey-v2 .orbit-inner {
  inset: calc(var(--ring-gap) - 1px);
}

/* ---- outer ring tail and aura (feat-20261101-buzzar-ring-aura) ----
   Decoration only. The tail is rotated by home-orbit.js with the runner's own transform, so its head is always the
   dot's angle. Motion is transform and opacity only. The old static grey dot and the static green arc
   on the outer ring are gone. Classes on .wheel: aura-travel (longer tail), aura-land (brief brightening after a
   landing), aura-hold (paused: steady low glow), aura-still (reduced motion: a still highlight, no breathing). */
body.hv .journey-v2 .orbit-outer-spin:after {
  content: none;
}
body.hv .journey-v2 .orbit-aura,
body.hv .journey-v2 .orbit-aura-flash,
body.hv .journey-v2 .orbit-tail {
  position: absolute;
  inset: calc(-1 * (var(--ring-gap) + 1px));
  border-radius: 50%;
  pointer-events: none;
}
body.hv .journey-v2 .orbit-aura,
body.hv .journey-v2 .orbit-aura-flash {
  box-shadow:
    0 0 14px 2px color-mix(in srgb, var(--green) 55%, transparent),
    inset 0 0 14px 1px color-mix(in srgb, var(--green) 40%, transparent);
}
body.hv .journey-v2 .orbit-aura {
  opacity: 0.15;
  animation: aura-breathe 5s ease-in-out infinite;
}
body.hv .journey-v2 .orbit-aura-flash {
  opacity: 0;
  transition: opacity 450ms ease-out;
}
body.hv .journey-v2 .aura-land .orbit-aura-flash {
  opacity: 0.3;
  transition-duration: 150ms;
}
body.hv .journey-v2 .aura-hold .orbit-aura,
body.hv .journey-v2 .aura-still .orbit-aura {
  animation: none;
  opacity: 0.2;
}
body.hv .journey-v2 .orbit-tail {
  z-index: 2;
}
body.hv .journey-v2 .orbit-tail i {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  -webkit-mask: radial-gradient(
    farthest-side,
    transparent calc(100% - 3px),
    black calc(100% - 2px)
  );
  mask: radial-gradient(farthest-side, transparent calc(100% - 3px), black calc(100% - 2px));
}
/* the head is at 0deg (the top of the element) and the tail fades to nothing behind it, anticlockwise.
   A gradient holds its last colour, so each one ends with a hard cut back to clear. */
body.hv .journey-v2 .orbit-tail .tail-short {
  background: conic-gradient(
    from -40deg,
    transparent 0deg,
    color-mix(in srgb, var(--green) 85%, transparent) 40deg,
    transparent 40.1deg
  );
}
body.hv .journey-v2 .orbit-tail .tail-long {
  background: conic-gradient(
    from -70deg,
    transparent 0deg,
    color-mix(in srgb, var(--green) 85%, transparent) 70deg,
    transparent 70.1deg
  );
  opacity: 0;
  transition: opacity 500ms ease-in-out;
}
body.hv .journey-v2 .aura-travel .orbit-tail .tail-long {
  opacity: 1;
}
@keyframes aura-breathe {
  0%,
  100% {
    opacity: 0.15;
  }
  50% {
    opacity: 0.35;
  }
}
@media (prefers-reduced-motion: reduce) {
  body.hv .journey-v2 .orbit-aura {
    animation: none;
    opacity: 0.2;
  }
}

/* ---- guided discovery inline in the home panel ----
   The flow's wrapper adds no box of its own: its path, scene and note are the panel's three rows, as the old
   illustration was. Long match lists scroll inside the scene, never the page. */
body.hv .home-detail .bzr-discover-flow {
  display: contents;
}
body.hv .home-detail .guide-scene {
  overflow-y: auto;
  overscroll-behavior: contain;
  justify-content: flex-start;
  padding-right: 4px;
}
body.hv .home-detail .guide-note {
  align-self: center;
  margin: 0;
  padding-top: 13px;
  border-top: 1px solid var(--line);
  font-size: 12.5px;
  color: var(--muted);
}
body.hv .guide-match-label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin: 14px 0 8px;
}
body.hv .guide-match-label strong {
  font-size: 14.5px;
  color: var(--ink);
}
body.hv .guide-match-label small {
  font-size: 12.5px;
  color: var(--muted);
}
/* loading: three quiet rows, never a count */
body.hv .guide-skeleton {
  display: grid;
  gap: 10px;
  margin: 14px 0;
}
body.hv .guide-skeleton-row {
  height: 74px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: linear-gradient(
    100deg,
    var(--paper) 30%,
    color-mix(in srgb, var(--mint) 45%, var(--paper)) 50%,
    var(--paper) 70%
  );
  background-size: 220% 100%;
  animation: guide-skeleton 1.4s ease-in-out infinite;
}
@keyframes guide-skeleton {
  from {
    background-position: 120% 0;
  }
  to {
    background-position: -20% 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  body.hv .guide-skeleton-row {
    animation: none;
  }
}

/* phone: while the buyer reads matches, the panel takes the room the ring was using; Resume journey stays reachable */
@media (max-width: 700px) {
  body.hv .journey-v2.discover-focus .wheel-canvas {
    display: none;
  }
  body.hv .journey-v2.discover-focus .wheel {
    grid-template-rows: auto;
    height: auto;
  }
  body.hv .journey-v2.discover-focus .home-detail {
    grid-template-rows: auto minmax(0, 1fr);
  }
  body.hv .journey-v2.discover-focus .phase-heading p:not(.eyebrow) {
    display: none;
  }
}
@media (max-width: 700px) {
  body.hv .journey-v2.discover-focus .home-stage {
    grid-template-rows: auto minmax(0, 1fr);
  }
}

/* ---- offering detail: sticky request panel in the journey area, every later section full width ---- */
body.hv .bzr-detail-side {
  position: sticky;
  top: 16px;
  align-self: start;
}
body.hv .bzr-detail-body {
  margin-top: 8px;
  min-width: 0;
}
/* prose keeps a readable line length; tables, cards and detail lists use the full width */
body.hv .bzr-detail-body .bzr-section > p,
body.hv .bzr-detail-body > p,
body.hv .bzr-detail-body .bzr-outcome-journey > p,
body.hv .bzr-detail-body .bzr-presales > p {
  max-width: 72ch;
}
body.hv .bzr-detail-body .bzr-table {
  width: 100%;
}
body.hv .bzr-detail-body dl.bzr-kv,
body.hv .bzr-detail-body dl.bzr-facts {
  grid-template-columns: 176px minmax(0, 1fr);
}
body.hv .bzr-detail-body ul.bzr-chips {
  padding-left: 0;
}
body.hv .bzr-detail-body .bzr-benefits {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
}
@media (max-width: 900px) {
  body.hv .bzr-detail-side {
    position: static;
  }
}
@media (max-width: 520px) {
  body.hv .bzr-detail-body dl.bzr-kv,
  body.hv .bzr-detail-body dl.bzr-facts {
    grid-template-columns: 120px minmax(0, 1fr);
  }
}

/* ---- journey in the left column: the six stages share the narrower column three across, two rows ---- */
@media (min-width: 900px) {
  body.hv .bzr-detail-main .bzr-stages {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  body.hv .bzr-detail-main .bzr-stages::before {
    display: none;
  }
}

/* ---- landing extras: provider spotlight and industry browse stack at full width, so neither box stretches into an empty frame ---- */
body.hv .bzr-landing-extras {
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
}

/* ---- catalogue alignment: one top and bottom edge per row, one left edge per box ---- */
body.hv .bzr-catalog-search-row {
  align-items: stretch;
}
body.hv .bzr-catalog-search-row input,
body.hv .bzr-catalog-search-row button {
  box-sizing: border-box;
  margin: 0;
  height: 52px;
  min-height: 52px;
}
body.hv .catalog-toolbar .sort-label {
  margin: 6px 0 0;
  align-self: flex-start;
}
body.hv .bzr-industries .bzr-chips {
  padding-left: 0;
}

/* Decorative layers never take pointer events. A full-bleed aria-hidden svg or canvas sat over the Ask refine
   row at 1280 and 1440 wide and swallowed every click. Interactive children opt back in with pointer-events: auto.
   The voice orb canvas is left to voice.css. */
body.hv svg[aria-hidden='true'],
body.hv canvas[aria-hidden='true']:not(.bzr-voice-canvas) {
  pointer-events: none;
}
body.hv .ask-canvas > svg {
  pointer-events: none;
}

/* ---- feat-20261029-buzzar-evaluation-layer: "Evaluate my need" under the Ask Buzzar shortlist ---- */
body.hv .ask-eval-host {
  display: block;
  margin: 18px 0 0;
}
body.hv .ask-eval {
  display: grid;
  gap: 16px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--paper);
  box-shadow: var(--shadow);
  overflow-wrap: anywhere;
}
body.hv .ask-eval-launch {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}
body.hv .ask-eval h2,
body.hv .ask-eval h3,
body.hv .ask-eval h4,
body.hv .ask-eval h5,
body.hv .ask-eval p,
body.hv .ask-eval ul,
body.hv .ask-eval dl {
  margin: 0;
}
body.hv .ask-eval h3 {
  font-size: 16px;
}
body.hv .ask-eval h4 {
  font-size: 14px;
}
body.hv .ask-eval-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px 16px;
}
body.hv .ask-eval-need {
  display: grid;
  gap: 8px;
  padding: 14px 16px;
  border-radius: var(--radius);
  background: var(--sage);
}
body.hv .ask-eval-need dl {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 4px 14px;
  font-size: 13.5px;
}
body.hv .ask-eval-need dt {
  color: var(--muted);
}
body.hv .ask-eval-need dd {
  margin: 0;
}
body.hv .ask-eval-need dd.is-empty {
  color: var(--muted);
  font-style: italic;
}
body.hv .ask-eval-form {
  display: grid;
  gap: 14px;
}
body.hv .ask-eval-q {
  display: grid;
  gap: 6px;
}
body.hv .ask-eval-q label,
body.hv .ask-eval-askform label {
  font-weight: 600;
  font-size: 14px;
}
body.hv .ask-eval input[type='text'] {
  box-sizing: border-box;
  width: 100%;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--bg);
  color: var(--ink);
  font: inherit;
}
body.hv .ask-eval input[type='text']:focus-visible,
body.hv .ask-eval button:focus-visible,
body.hv .ask-eval a:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 2px;
}
body.hv .ask-eval .bzr-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
body.hv .ask-eval .bzr-chip {
  min-height: 32px;
}
body.hv .ask-eval-hint,
body.hv .ask-eval-provider,
body.hv .ask-eval-working {
  color: var(--muted);
  font-size: 13px;
}
body.hv .ask-eval-source {
  display: inline-block;
  padding: 6px 10px;
  border-radius: var(--radius);
  background: var(--mint);
  font-size: 12.5px;
}
body.hv .ask-eval-source[data-generated-by='rules'] {
  background: var(--sage);
}
body.hv .ask-eval-result {
  display: grid;
  gap: 14px;
}
body.hv .ask-eval-group {
  display: grid;
  gap: 8px;
}
body.hv .ask-eval-items {
  display: grid;
  gap: 10px;
  padding: 0;
  list-style: none;
}
body.hv .ask-eval-item {
  display: grid;
  gap: 6px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
}
body.hv .ask-eval-item h5 {
  font-size: 15px;
}
body.hv .ask-eval-item h5 a {
  color: inherit;
}
body.hv .ask-eval-covers {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px;
  font-size: 13px;
}
body.hv .ask-eval-covers .bzr-advisor-matched {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 0;
  list-style: none;
}
body.hv .ask-eval-coverage {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
body.hv .ask-eval-coverage ul,
body.hv .ask-eval-gaps ul {
  padding-left: 18px;
  font-size: 13.5px;
}
body.hv .ask-eval-coverage .is-gap {
  color: var(--ink);
}
body.hv .ask-eval-ask {
  display: grid;
  gap: 10px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}
body.hv .ask-eval-askform {
  display: grid;
  gap: 8px;
}
body.hv .ask-eval-answer {
  display: grid;
  gap: 8px;
}
body.hv .ask-eval-answer-text {
  white-space: pre-line;
}
body.hv .ask-eval-error {
  display: grid;
  gap: 8px;
  justify-items: start;
}
@media (max-width: 640px) {
  body.hv .ask-eval {
    padding: 16px;
  }
  body.hv .ask-eval-launch,
  body.hv .ask-eval-coverage {
    grid-template-columns: minmax(0, 1fr);
  }
  body.hv .ask-eval-need dl {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }
  body.hv .ask-eval-need dd {
    margin-bottom: 6px;
  }
}

/* feat-20261101-buzzar-sellable-skus: the buyable badge follows the New badge tokens, light and dark */
body.hv .offering-card .bzr-badge-buyable {
  display: inline-block;
  margin-bottom: 6px;
  padding: 2px 10px;
  border: 0;
  border-radius: 999px;
  background: var(--mint);
  color: var(--green);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.3px;
  overflow-wrap: anywhere;
}