/* ========================================================================== 
   AKFA Energy 0.7.0 — refined layout, visual hierarchy and interaction layer
   Loaded after the legacy stylesheet so every rule below is an intentional
   production override. The engineering calculation remains unchanged.
   ========================================================================== */

:root {
  --v7-page: #f4f6f9;
  --v7-page-warm: #fbfafb;
  --v7-ink: #0d1118;
  --v7-ink-soft: #202735;
  --v7-muted: #687385;
  --v7-line: rgba(74, 88, 108, .14);
  --v7-line-strong: rgba(74, 88, 108, .22);
  --v7-red: #ed1c2b;
  --v7-red-dark: #ca1020;
  --v7-red-soft: #fff0f2;
  --v7-blue: #3f9df4;
  --v7-blue-soft: #eaf5ff;
  --v7-orange: #ff9a45;
  --v7-green: #12a768;
  --v7-surface: rgba(255, 255, 255, .92);
  --v7-surface-solid: #fff;
  --v7-shadow-xs: 0 2px 8px rgba(18, 27, 41, .05);
  --v7-shadow-sm: 0 16px 40px rgba(18, 27, 41, .08);
  --v7-shadow-md: 0 30px 82px rgba(18, 27, 41, .12);
  --v7-shadow-lg: 0 48px 130px rgba(13, 20, 31, .17);
  --v7-radius-sm: 14px;
  --v7-radius: 20px;
  --v7-radius-lg: 28px;
  --v7-radius-xl: 38px;
  --v7-container: 1440px;
  --v7-header: 72px;
  --v7-ease: cubic-bezier(.16, .84, .24, 1);
  --v7-spot-x: 50%;
  --v7-spot-y: 50%;
}

html {
  scroll-padding-top: 96px;
  background: var(--v7-page);
}

body {
  color: var(--v7-ink);
  background:
    radial-gradient(circle at 7% 1%, rgba(237, 28, 43, .055), transparent 31rem),
    radial-gradient(circle at 94% 13%, rgba(63, 157, 244, .055), transparent 36rem),
    linear-gradient(180deg, #fafbfc 0%, var(--v7-page) 44%, #eef2f6 100%);
}

body::before {
  opacity: .16;
  background-size: 72px 72px;
  mask-image: linear-gradient(to bottom, #000 0, rgba(0,0,0,.55) 25%, transparent 74%);
}

.container {
  width: min(calc(100% - 64px), var(--v7-container));
}

main > section {
  scroll-margin-top: 94px;
}

/* Typography: fewer oversized blocks and no unreadable microcopy. */
.section-kicker,
.eyebrow,
.modal-kicker,
.recommendation-family,
.recommendation-badge,
.series-feature__copy small,
.series-card__eyebrow {
  letter-spacing: .09em;
}

.section-heading h2,
.advisor-heading h2,
.results-toolbar h2,
.methodology-layout h2,
.technology-section h2 {
  font-weight: 810;
  letter-spacing: -.052em;
}

.section-heading p,
.advisor-heading > p,
.hero__lead,
.series-feature__copy p,
.recommendation-hero__content > p {
  color: var(--v7-muted);
}

/* Status strip and header: one calm navigation system, not three competing ones. */
.pilot-strip {
  min-height: 28px;
  background: rgba(243, 245, 248, .92);
  border-bottom-color: rgba(74, 88, 108, .08);
}

.pilot-strip__inner {
  min-height: 28px;
}

.pilot-strip__inner > span,
.pilot-strip__inner button {
  font-size: 10px;
}

.site-header,
.site-header.is-scrolled {
  height: var(--v7-header);
  background: rgba(250, 251, 253, .89);
  border-bottom: 1px solid rgba(74, 88, 108, .11);
  box-shadow: 0 8px 28px rgba(14, 22, 34, .055);
  backdrop-filter: blur(24px) saturate(1.16);
  transition: height .24s var(--v7-ease), background .24s ease, box-shadow .24s ease;
}

.site-header.is-scrolled {
  height: 66px;
  background: rgba(250, 251, 253, .96);
  box-shadow: 0 14px 42px rgba(14, 22, 34, .095);
}

.site-header__inner,
.site-header.is-scrolled .site-header__inner {
  height: 100%;
  gap: 20px;
}

.brand--official .brand__logo {
  width: 148px;
  height: auto;
}

.brand__product {
  gap: 1px;
}

.brand__product b,
.brand__product strong {
  font-size: 14px;
  letter-spacing: -.02em;
}

.brand__product small {
  font-size: 8px;
}

.desktop-nav {
  gap: 2px;
  margin-left: auto;
  padding: 4px;
  background: rgba(237, 240, 244, .72);
  border: 1px solid rgba(74, 88, 108, .08);
  border-radius: 15px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}

.desktop-nav a {
  min-height: 38px;
  padding: 0 14px;
  border-radius: 11px;
  color: #596475;
  font-size: 12px;
  font-weight: 740;
}

.desktop-nav a:hover,
.desktop-nav a.is-active {
  color: var(--v7-ink);
  background: #fff;
  box-shadow: 0 7px 20px rgba(17, 25, 38, .07), inset 0 -2px 0 var(--v7-red);
}

.header-actions {
  gap: 8px;
}

.header-icon-button,
.mobile-menu-toggle {
  border-color: var(--v7-line);
  background: rgba(255,255,255,.78);
  box-shadow: var(--v7-shadow-xs);
}

.language-switch {
  height: 40px;
  background: rgba(235, 238, 242, .86);
  border-color: rgba(74,88,108,.1);
  border-radius: 12px;
}

.button--header {
  min-height: 46px;
  padding-inline: 18px;
  border-radius: 13px;
}

.desktop-section-rail {
  display: none !important;
}

/* Global surfaces and tactile spotlight. */
.v7-interactive-surface {
  --spot-x: 50%;
  --spot-y: 50%;
  position: relative;
  isolation: isolate;
}

.v7-interactive-surface::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  border-radius: inherit;
  opacity: 0;
  pointer-events: none;
  background: radial-gradient(420px circle at var(--spot-x) var(--spot-y), rgba(255,255,255,.22), transparent 60%);
  transition: opacity .28s ease;
}

.v7-interactive-surface.is-v7-pointer::after {
  opacity: 1;
}

.button,
.header-icon-button,
.series-card,
.choice-card > span,
.solution-type-card > span,
.priority-grid label > span {
  transition:
    transform .22s var(--v7-ease),
    box-shadow .22s ease,
    border-color .22s ease,
    background .22s ease,
    color .22s ease;
}

.button:hover:not(:disabled) {
  transform: translateY(-2px);
}

.button:focus-visible,
.header-icon-button:focus-visible,
.desktop-nav a:focus-visible,
.series-card button:focus-visible,
.advisor-step-rail button:focus-visible {
  outline: 3px solid rgba(63, 157, 244, .32);
  outline-offset: 3px;
}

/* Hero: balanced, cinematic but still readable in the first viewport. */
.hero {
  min-height: min(840px, calc(100svh - 100px));
  padding: 68px 0 76px;
  background:
    radial-gradient(circle at 82% 12%, rgba(237, 28, 43, .105), transparent 31rem),
    radial-gradient(circle at 91% 75%, rgba(63, 157, 244, .095), transparent 34rem),
    radial-gradient(circle at 8% 92%, rgba(237, 28, 43, .045), transparent 26rem),
    linear-gradient(180deg, #fbfcfd 0%, #f3f6f9 100%);
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .34;
  background-image:
    linear-gradient(rgba(74,88,108,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(74,88,108,.035) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(90deg, #000 0, rgba(0,0,0,.6) 45%, transparent 86%);
}

.hero__grid-bg {
  opacity: .35;
}

.hero__layout {
  position: relative;
  z-index: 1;
  grid-template-columns: minmax(0, .86fr) minmax(580px, 1.14fr);
  gap: clamp(42px, 5vw, 78px);
  align-items: center;
}

.hero__content {
  max-width: 710px;
}

.eyebrow {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 6px 10px;
  color: var(--v7-red-dark);
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(237,28,43,.12);
  border-radius: 999px;
  box-shadow: var(--v7-shadow-xs);
  backdrop-filter: blur(12px);
}

.hero h1 {
  max-width: 700px;
  margin: 24px 0 20px;
  font-size: clamp(58px, 5.45vw, 86px);
  line-height: .94;
  letter-spacing: -.068em;
  text-wrap: balance;
}

.hero h1 em {
  position: relative;
  color: var(--v7-red);
  text-shadow: 0 18px 44px rgba(237,28,43,.12);
}

.hero h1 em::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: -.04em;
  right: -.04em;
  bottom: .06em;
  height: .17em;
  background: linear-gradient(90deg, rgba(237,28,43,.13), rgba(237,28,43,.02));
  border-radius: 999px;
  transform: rotate(-1.5deg);
}

.hero__lead {
  max-width: 650px;
  margin-bottom: 22px;
  font-size: 17px;
  line-height: 1.65;
}

.hero__actions {
  gap: 12px;
}

.hero__actions .button {
  min-height: 58px;
  border-radius: 16px;
}

.hero__trust {
  margin-top: 18px;
  gap: 18px;
}

.hero__trust span {
  color: #687385;
  font-size: 11px;
}

.hero-quick-start {
  margin-top: 24px;
}

.hero-quick-start > span {
  color: #8992a0;
  font-size: 9px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.hero-quick-start button {
  min-height: 42px;
  padding-inline: 14px;
  background: rgba(255,255,255,.78);
  border-color: rgba(74,88,108,.12);
  box-shadow: var(--v7-shadow-xs);
}

.hero-lab {
  min-height: 650px;
  padding: 24px;
  overflow: hidden;
  background:
    radial-gradient(circle at 87% 10%, rgba(237,28,43,.17), transparent 18rem),
    radial-gradient(circle at 10% 87%, rgba(63,157,244,.15), transparent 23rem),
    rgba(255,255,255,.72);
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 38px;
  box-shadow: var(--v7-shadow-lg), inset 0 1px 0 rgba(255,255,255,.95);
  backdrop-filter: blur(24px) saturate(1.15);
}

.hero-lab::before {
  opacity: .18;
  background-size: 46px 46px;
}

.hero-lab__top {
  min-height: 58px;
  padding: 0 4px;
}

.hero-lab__top span {
  font-size: 9px;
}

.hero-lab__top strong {
  font-size: 22px;
  letter-spacing: -.035em;
}

.climate-scene {
  min-height: 440px;
  border-radius: 28px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.68), 0 18px 44px rgba(18,27,41,.09);
}

.hero-lab__bottom {
  margin-top: 13px;
  padding: 14px 16px;
  background: rgba(255,255,255,.64);
  border: 1px solid rgba(255,255,255,.78);
  border-radius: 20px;
  backdrop-filter: blur(18px);
}

.hero-compare-control {
  margin-top: 12px;
}

/* How / general content: denser rhythm and fewer floating gaps. */
.how-section,
.technology-section,
.methodology-section {
  padding-block: 92px;
}

.section-heading {
  gap: 32px;
  margin-bottom: 30px;
}

.section-heading h2,
.methodology-layout h2,
.technology-section h2 {
  font-size: clamp(45px, 4.7vw, 68px);
  line-height: .98;
  text-wrap: balance;
}

/* Series: remove the huge empty prelude and make the catalogue feel like a product studio. */
.series-section {
  padding: 90px 0 96px;
  background:
    radial-gradient(circle at 8% 8%, rgba(237,28,43,.08), transparent 27rem),
    radial-gradient(circle at 96% 84%, rgba(63,157,244,.09), transparent 31rem),
    linear-gradient(180deg, #f7f9fb 0%, #edf2f7 100%);
}

.series-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 34px;
  margin-bottom: 26px;
}

.series-heading > div:first-child {
  max-width: 870px;
}

.series-heading h2 {
  max-width: 850px;
  margin-bottom: 16px;
  font-size: clamp(50px, 5vw, 74px);
  line-height: .94;
  letter-spacing: -.062em;
  text-wrap: balance;
}

.series-heading p {
  max-width: 760px;
  margin-bottom: 0;
  font-size: 15px;
  line-height: 1.62;
}

.series-heading__stat {
  min-width: 250px;
  grid-template-columns: auto 1fr;
  align-items: center;
  column-gap: 14px;
  padding: 17px 20px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(255,255,255,.94);
  border-radius: 20px;
  box-shadow: var(--v7-shadow-sm);
}

.series-heading__stat strong {
  grid-row: 1 / 3;
  font-size: 48px;
}

.series-heading__stat span {
  margin-top: 0;
  font-size: 12px;
}

.series-heading__stat small {
  margin-top: 0;
  font-size: 9px;
}

.series-dashboard {
  grid-template-columns: minmax(390px, .88fr) minmax(0, 1.62fr);
  min-height: 690px;
  overflow: visible;
  background: rgba(255,255,255,.84);
  border: 1px solid rgba(255,255,255,.96);
  border-radius: 34px;
  box-shadow: var(--v7-shadow-md);
}

.series-dashboard__feature {
  min-height: 690px;
  padding: 28px;
  border-radius: 34px 0 0 34px;
  background:
    radial-gradient(circle at 88% 10%, rgba(237,28,43,.38), transparent 26%),
    radial-gradient(circle at 5% 88%, rgba(63,157,244,.28), transparent 34%),
    linear-gradient(145deg, #10151d 0%, #171f2a 55%, #263244 100%);
  box-shadow: 20px 0 50px rgba(13,20,31,.08);
}

.series-profile-hero {
  min-height: 286px;
  margin-block: 4px 8px;
}

.series-profile-render {
  height: 111%;
  filter: drop-shadow(0 26px 34px rgba(0,0,0,.38));
}

.series-feature__copy h3 {
  max-width: 330px;
  margin: 4px 0 10px;
  font-size: clamp(35px, 3.1vw, 48px);
  line-height: .93;
}

.series-feature__copy p {
  min-height: 0;
  margin-bottom: 16px;
  font-size: 13px;
}

.series-feature__metrics {
  margin-bottom: 13px;
}

.series-feature__metrics span {
  min-height: 60px;
  padding: 11px;
}

.series-feature__metrics small {
  font-size: 8px;
}

.series-feature__metrics b {
  font-size: 12px;
}

.series-feature-score {
  margin-top: 4px;
}

.series-feature__actions {
  margin-top: 14px;
}

.series-dashboard__catalog {
  min-height: 690px;
  padding: 22px;
  border-radius: 0 34px 34px 0;
}

.series-controls {
  position: sticky;
  z-index: 6;
  top: 80px;
  margin: -2px -2px 16px;
  padding: 12px 12px 14px;
  background: rgba(255,255,255,.91);
  border: 1px solid rgba(74,88,108,.08);
  border-radius: 18px;
  box-shadow: 0 13px 32px rgba(18,27,41,.07);
  backdrop-filter: blur(20px);
}

.series-controls__primary,
.series-controls__secondary {
  gap: 10px;
}

.series-filters {
  gap: 6px;
}

.series-filters button {
  min-height: 38px;
  padding-inline: 13px;
  font-size: 10px;
}

.series-search {
  min-height: 42px;
  border-radius: 13px;
}

.series-sort {
  min-height: 40px;
  border-radius: 12px;
}

.series-controls__hint {
  display: none;
}

.series-rail {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.series-card {
  border-radius: 18px;
  box-shadow: 0 7px 22px rgba(18,27,41,.045);
}

.series-card:hover,
.series-card.is-selected {
  transform: translateY(-4px);
  box-shadow: 0 18px 44px rgba(18,27,41,.11);
}

.series-card__select {
  grid-template-columns: 58px minmax(0, 1fr) 42px;
  gap: 9px;
  padding: 11px;
}

.series-card__visual {
  width: 58px;
  height: 66px;
  border-radius: 13px;
}

.series-card__copy strong,
.series-card__copy h3 {
  font-size: 14px;
}

.series-card__copy em,
.series-card__copy p {
  font-size: 9px;
  line-height: 1.35;
}

.series-card__score b,
.series-card__score strong {
  font-size: 21px;
}

.series-card__facts {
  margin-inline: 10px;
  padding: 8px 0;
}

.series-card__facts small {
  font-size: 7px;
}

.series-card__facts b {
  font-size: 9px;
}

.series-card__foot {
  padding: 9px 11px 10px;
  font-size: 8px;
}

.series-dashboard__footer {
  margin-top: auto;
  padding-top: 14px;
}

/* Advisor: a real one-screen workspace on desktop. */
.advisor-section {
  padding: 88px 0 100px;
  background:
    radial-gradient(circle at 85% 7%, rgba(237,28,43,.075), transparent 30rem),
    radial-gradient(circle at 10% 92%, rgba(63,157,244,.055), transparent 30rem),
    linear-gradient(180deg, #f8fafc 0%, #eff3f7 100%);
}

.advisor-heading {
  grid-template-columns: minmax(0, .9fr) minmax(340px, .55fr);
  align-items: end;
  gap: 48px;
  margin-bottom: 22px;
}

.advisor-heading h2 {
  max-width: 720px;
  margin-bottom: 0;
  font-size: clamp(50px, 5vw, 72px);
  line-height: .93;
  text-wrap: balance;
}

.advisor-heading > p {
  max-width: 520px;
  margin-bottom: 5px;
  font-size: 15px;
  line-height: 1.65;
}

.advisor-mode-bar {
  min-height: 70px;
  margin-bottom: 18px;
  padding: 8px 10px 8px 16px;
  border: 1px solid rgba(74,88,108,.10);
  border-radius: 20px;
  box-shadow: var(--v7-shadow-sm);
}

.advisor-mode-copy {
  gap: 12px;
}

.mode-icon {
  width: 42px;
  height: 42px;
  border-radius: 13px;
}

.advisor-mode-switch {
  padding: 4px;
  border-radius: 15px;
}

.advisor-mode-switch button {
  min-width: 132px;
  min-height: 48px;
  border-radius: 12px;
}

.advisor-shell {
  display: grid;
  grid-template-columns: 196px minmax(0, 1fr);
  grid-template-rows: auto 1fr;
  gap: 0;
  padding: 0;
  overflow: visible;
  background: rgba(255,255,255,.84);
  border: 1px solid rgba(255,255,255,.96);
  border-radius: 32px;
  box-shadow: var(--v7-shadow-md);
  backdrop-filter: blur(22px);
}

.advisor-progress {
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: stretch;
  min-width: 0;
  padding: 22px 16px;
  color: #fff;
  background:
    radial-gradient(circle at 30% 0%, rgba(237,28,43,.27), transparent 22rem),
    linear-gradient(180deg, #111720 0%, #1b2431 100%);
  border-radius: 31px 0 0 31px;
  box-shadow: 16px 0 44px rgba(13,20,31,.10);
}

.advisor-progress__meta {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 9px;
  align-items: center;
  padding: 4px 4px 14px;
}

.advisor-progress__meta > span {
  grid-row: 1 / 3;
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  color: #fff;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 14px;
  font-size: 11px;
}

.advisor-progress__meta strong {
  color: #fff;
  font-size: 12px;
}

.advisor-progress__meta em {
  color: rgba(255,255,255,.48);
  font-size: 9px;
}

.advisor-progress .progress-track {
  height: 4px;
  margin: 0 4px 16px;
  background: rgba(255,255,255,.09);
}

.advisor-step-rail {
  display: grid;
  grid-template-columns: 1fr;
  gap: 5px;
  overflow: visible;
  padding: 0;
}

.advisor-step-rail button {
  min-width: 0;
  min-height: 44px;
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: center;
  justify-items: start;
  gap: 9px;
  padding: 6px 8px;
  color: rgba(255,255,255,.44);
  background: transparent;
  border: 1px solid transparent;
  border-radius: 12px;
  text-align: left;
}

.advisor-step-rail button span {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  color: inherit;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 9px;
  font-size: 8px;
}

.advisor-step-rail button b {
  overflow: hidden;
  color: inherit;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.advisor-step-rail button.is-active {
  color: #fff;
  background: linear-gradient(135deg, rgba(237,28,43,.22), rgba(255,255,255,.055));
  border-color: rgba(237,28,43,.32);
  box-shadow: inset 3px 0 0 var(--v7-red);
}

.advisor-step-rail button.is-active span {
  color: #fff;
  background: var(--v7-red);
  border-color: var(--v7-red);
  box-shadow: 0 8px 20px rgba(237,28,43,.25);
}

.advisor-step-rail button.is-complete {
  color: rgba(255,255,255,.72);
}

.advisor-step-rail button:not(:disabled):hover {
  color: #fff;
  background: rgba(255,255,255,.065);
}

.advisor-context-ribbon {
  grid-column: 2;
  grid-row: 1;
  margin: 0;
  padding: 12px 16px;
  background: rgba(248,250,252,.88);
  border: 0;
  border-bottom: 1px solid rgba(74,88,108,.09);
  border-radius: 0 31px 0 0;
}

.advisor-context-ribbon > button {
  min-height: 48px;
  padding: 8px 10px;
  background: #fff;
  border-color: rgba(74,88,108,.10);
  border-radius: 13px;
}

.advisor-autosave {
  min-height: 48px;
  border-radius: 13px;
}

.advisor-layout {
  grid-column: 2;
  grid-row: 2;
  grid-template-columns: minmax(0, 1fr) 330px;
  align-items: start;
  gap: 18px;
  padding: 18px;
}

.advisor-main {
  min-width: 0;
  padding: 16px;
  background: #fff;
  border: 1px solid rgba(74,88,108,.09);
  border-radius: 24px;
  box-shadow: 0 12px 34px rgba(18,27,41,.055);
}

.engineer-message {
  margin-bottom: 14px;
  padding: 12px 14px;
  border-radius: 16px;
  background: linear-gradient(120deg, #f8fafc, #fff5f6);
  border-color: rgba(237,28,43,.1);
}

.engineer-avatar {
  width: 38px;
  height: 38px;
  border-radius: 12px;
}

.question-step {
  min-height: 468px;
  padding: 18px;
  border: 1px solid rgba(74,88,108,.09);
  border-radius: 21px;
  background: linear-gradient(180deg, #fff, #fbfcfd);
}

.question-head {
  margin-bottom: 18px;
}

.question-head > span {
  width: 43px;
  height: 43px;
  border-radius: 13px;
  box-shadow: 0 10px 24px rgba(237,28,43,.22);
}

.question-head h3 {
  font-size: clamp(25px, 2.25vw, 34px);
  line-height: 1.04;
  letter-spacing: -.04em;
}

.question-head p {
  max-width: 720px;
  font-size: 12px;
}

.choice-card > span,
.solution-type-card > span,
.priority-grid label > span {
  min-height: 112px;
  border-radius: 18px;
  box-shadow: 0 6px 18px rgba(18,27,41,.035);
}

.choice-card > span:hover,
.solution-type-card > span:hover,
.priority-grid label > span:hover {
  transform: translateY(-3px);
  border-color: rgba(237,28,43,.28);
  box-shadow: 0 16px 34px rgba(18,27,41,.085);
}

.advisor-controls {
  position: sticky;
  z-index: 7;
  bottom: 12px;
  margin-top: 14px;
  padding: 10px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(74,88,108,.10);
  border-radius: 18px;
  box-shadow: 0 16px 40px rgba(18,27,41,.12);
  backdrop-filter: blur(18px);
}

.advisor-controls .button {
  min-height: 48px;
  border-radius: 13px;
}

.advisor-live {
  position: sticky;
  top: 92px;
  min-height: 594px;
  padding: 20px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 24px;
  background:
    radial-gradient(circle at 85% 5%, rgba(63,157,244,.25), transparent 16rem),
    radial-gradient(circle at 5% 88%, rgba(237,28,43,.24), transparent 18rem),
    linear-gradient(160deg, #131a24 0%, #202b3a 100%);
  box-shadow: 0 28px 64px rgba(13,20,31,.21);
}

.advisor-live__head strong {
  font-size: 19px;
  line-height: 1.12;
}

.live-window {
  min-height: 245px;
  margin-block: 12px;
  border-radius: 19px;
}

.live-facts {
  gap: 7px;
}

.live-facts > div {
  padding: 9px;
  border-radius: 12px;
}

.live-tip {
  margin-top: 10px;
  border-radius: 14px;
}

/* Results: compact app header, stronger recommendation hierarchy. */
.results {
  padding-top: 28px;
}

.results-toolbar {
  position: relative;
  min-height: 94px;
  align-items: center;
  gap: 24px;
  padding: 18px 20px;
  background: rgba(255,255,255,.84);
  border: 1px solid rgba(255,255,255,.94);
  border-radius: 24px;
  box-shadow: var(--v7-shadow-sm);
  backdrop-filter: blur(20px);
}

.results-toolbar h2 {
  margin: 2px 0 4px;
  font-size: clamp(38px, 4vw, 56px);
  line-height: .95;
}

.results-toolbar p {
  margin: 0;
  font-size: 10px;
}

.results-actions {
  flex-wrap: nowrap;
  gap: 7px;
}

.results-actions button {
  min-height: 46px;
  padding-inline: 13px;
  border-radius: 13px;
  background: #fff;
  box-shadow: var(--v7-shadow-xs);
}

.result-section-nav {
  position: sticky;
  z-index: 25;
  top: 78px;
  margin: 12px 0 18px;
  padding: 6px;
  background: rgba(255,255,255,.9);
  border: 1px solid rgba(74,88,108,.10);
  border-radius: 18px;
  box-shadow: 0 12px 32px rgba(18,27,41,.08);
  backdrop-filter: blur(20px);
}

.result-section-nav a {
  min-height: 44px;
  border-radius: 13px;
}

.result-section-nav a.is-active {
  background: linear-gradient(135deg, var(--v7-red), #d61424);
  box-shadow: 0 10px 24px rgba(237,28,43,.22);
}

.recommendation-hero {
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, .8fr) minmax(285px, .56fr);
  min-height: 520px;
  padding: 30px;
  border-radius: 34px;
  background:
    radial-gradient(circle at 56% 50%, rgba(63,157,244,.15), transparent 27rem),
    radial-gradient(circle at 18% 85%, rgba(237,28,43,.12), transparent 25rem),
    linear-gradient(135deg, #fff 0%, #f6f9fc 56%, #f9eef0 100%);
  border: 1px solid rgba(255,255,255,.96);
  box-shadow: var(--v7-shadow-md);
}

.recommendation-hero__content {
  align-self: center;
  padding: 8px 0 8px 8px;
}

.recommendation-badge {
  min-height: 32px;
  padding: 6px 10px;
  border-radius: 999px;
}

.recommendation-family {
  margin-top: 26px;
}

.recommendation-hero__content h3 {
  max-width: 600px;
  margin: 5px 0 12px;
  font-size: clamp(52px, 5.1vw, 76px);
  line-height: .91;
  letter-spacing: -.07em;
}

.recommendation-hero__content > p {
  max-width: 580px;
  font-size: 16px;
  line-height: 1.55;
}

.reason-chips {
  gap: 7px;
  margin-block: 18px 22px;
}

.reason-chips span {
  min-height: 30px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.76);
  border-color: rgba(74,88,108,.11);
  box-shadow: var(--v7-shadow-xs);
}

.recommendation-actions {
  gap: 10px;
}

.recommendation-actions .button {
  min-height: 52px;
  border-radius: 15px;
}

.recommendation-profile-v4 {
  min-height: 450px;
  align-self: center;
  border-radius: 26px;
}

.recommendation-profile-render {
  height: 108%;
  filter: drop-shadow(0 30px 38px rgba(15,23,36,.25));
}

.energy-score-card {
  align-self: stretch;
  min-width: 0;
  padding: 22px;
  border-radius: 26px;
  background:
    radial-gradient(circle at 85% 8%, rgba(237,28,43,.20), transparent 16rem),
    linear-gradient(160deg, #141b25 0%, #222d3d 100%);
  box-shadow: 0 28px 60px rgba(13,20,31,.22);
}

.score-comparison {
  gap: 11px;
}

.score-gauge {
  width: 92px;
  height: 92px;
}

.score-gauge strong {
  font-size: 31px;
}

.score-card-highlights {
  grid-template-columns: 1fr;
  gap: 7px;
  margin-top: auto;
}

.score-card-highlights > span {
  min-height: 58px;
  padding: 9px 10px;
  border-radius: 13px;
}

.decision-summary {
  margin-top: 16px;
  padding: 17px 20px;
  border-radius: 21px;
  box-shadow: var(--v7-shadow-sm);
}

.metric-grid {
  gap: 12px;
  margin-top: 16px;
}

.metric-grid article {
  min-height: 172px;
  padding: 20px;
  border-radius: 22px;
  box-shadow: 0 12px 30px rgba(18,27,41,.06);
}

.metric-grid strong {
  font-size: clamp(28px, 2.6vw, 40px);
}

.result-panel,
.comfort-simulator,
.family-section,
.options-section,
.catalog-match-section,
.system-studio,
.premium-explanation,
.savings-section,
.confidence-section,
.result-cta {
  border-radius: 28px;
  box-shadow: 0 18px 46px rgba(18,27,41,.075);
}

.results-two-column {
  gap: 14px;
  margin-top: 14px;
}

.panel-heading h3 {
  font-size: clamp(28px, 2.8vw, 42px);
  line-height: 1;
  letter-spacing: -.045em;
}

/* Technology / methodology become visually coherent with the app surfaces. */
.technology-grid {
  gap: 14px;
}

.technology-card {
  border-radius: 24px;
  box-shadow: 0 14px 36px rgba(18,27,41,.065);
}

.methodology-layout {
  border-radius: 34px;
  box-shadow: var(--v7-shadow-md);
}

/* Modal visual polish. */
.modal-card {
  border-radius: 28px;
  box-shadow: 0 40px 110px rgba(13,20,31,.28);
}

.modal-head {
  padding: 22px 24px;
}

.modal-body {
  padding: 22px 24px;
}

.modal-actions {
  padding: 15px 24px 22px;
}

/* Footer: quieter and more premium. */
.site-footer {
  background: linear-gradient(155deg, #0d1219, #182230);
}

/* Desktop responsive transitions. */
@media (max-width: 1320px) {
  .container {
    width: min(calc(100% - 48px), 1220px);
  }

  .desktop-nav a {
    padding-inline: 11px;
  }

  .hero__layout {
    grid-template-columns: minmax(0, .88fr) minmax(500px, 1.12fr);
    gap: 38px;
  }

  .hero h1 {
    font-size: clamp(54px, 5.2vw, 73px);
  }

  .hero-lab {
    min-height: 610px;
  }

  .series-dashboard {
    grid-template-columns: 380px minmax(0, 1fr);
  }

  .series-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .advisor-shell {
    grid-template-columns: 182px minmax(0, 1fr);
  }

  .advisor-layout {
    grid-template-columns: minmax(0, 1fr) 300px;
  }

  .recommendation-hero {
    grid-template-columns: minmax(0, 1fr) minmax(270px, .72fr) 280px;
  }
}

@media (max-width: 1100px) {
  .desktop-nav {
    display: none;
  }

  .button--header {
    display: inline-flex;
  }

  .mobile-menu-toggle {
    display: inline-grid;
  }

  .hero {
    min-height: auto;
  }

  .hero__layout {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .hero__content {
    max-width: 860px;
  }

  .hero h1 {
    max-width: 860px;
  }

  .hero-lab {
    min-height: 610px;
  }

  .series-heading {
    grid-template-columns: 1fr auto;
  }

  .series-dashboard {
    grid-template-columns: 350px minmax(0, 1fr);
  }

  .advisor-shell {
    display: block;
    overflow: hidden;
  }

  .advisor-progress {
    padding: 15px;
    border-radius: 31px 31px 0 0;
  }

  .advisor-progress__meta {
    display: flex;
    align-items: center;
  }

  .advisor-progress__meta > span {
    grid-row: auto;
  }

  .advisor-step-rail {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    overflow-x: auto;
    padding-bottom: 3px;
    scrollbar-width: none;
  }

  .advisor-step-rail::-webkit-scrollbar {
    display: none;
  }

  .advisor-step-rail button {
    min-width: 112px;
  }

  .advisor-context-ribbon {
    border-radius: 0;
  }

  .advisor-layout {
    grid-template-columns: minmax(0, 1fr) 300px;
  }

  .recommendation-hero {
    grid-template-columns: minmax(0, 1fr) minmax(280px, .78fr);
  }

  .energy-score-card {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(220px, .65fr);
    align-items: center;
    gap: 18px;
  }

  .energy-score-card__title {
    align-self: start;
  }

  .score-card-highlights {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Tablet and mobile. */
@media (max-width: 900px) {
  .container {
    width: min(calc(100% - 32px), 820px);
  }

  .button--header {
    display: none;
  }

  .hero {
    padding: 48px 0 62px;
  }

  .hero h1 {
    font-size: clamp(50px, 9vw, 70px);
  }

  .series-heading,
  .advisor-heading {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .series-heading__stat {
    width: fit-content;
  }

  .series-dashboard {
    grid-template-columns: 1fr;
  }

  .series-dashboard__feature {
    min-height: 600px;
    border-radius: 34px 34px 0 0;
  }

  .series-dashboard__catalog {
    min-height: auto;
    border-radius: 0 0 34px 34px;
  }

  .series-controls {
    position: static;
  }

  .advisor-layout {
    grid-template-columns: 1fr;
  }

  .advisor-live {
    position: relative;
    top: auto;
    min-height: 480px;
  }

  .recommendation-hero {
    grid-template-columns: 1fr 1fr;
  }

  .energy-score-card {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  :root {
    --v7-header: 64px;
  }

  html {
    scroll-padding-top: 76px;
  }

  .pilot-strip {
    min-height: 25px;
  }

  .pilot-strip__inner {
    min-height: 25px;
  }

  .pilot-strip__inner button {
    display: none;
  }

  .container {
    width: min(calc(100% - 24px), 620px);
  }

  .site-header,
  .site-header.is-scrolled {
    height: 64px;
  }

  .site-header__inner,
  .site-header.is-scrolled .site-header__inner {
    height: 64px;
  }

  .brand--official .brand__logo {
    width: 124px;
  }

  .site-header__inner > .brand .brand__product {
    display: none;
  }

  .header-actions {
    gap: 6px;
  }

  .language-switch {
    height: 38px;
  }

  .hero {
    min-height: auto;
    padding: 30px 0 48px;
  }

  .hero::before {
    background-size: 48px 48px;
  }

  .hero__layout {
    gap: 24px;
  }

  .eyebrow {
    min-height: 29px;
    padding: 5px 8px;
    font-size: 9px;
  }

  .hero h1 {
    margin: 16px 0 15px;
    font-size: clamp(40px, 11.8vw, 54px);
    line-height: .92;
    letter-spacing: -.066em;
  }

  .hero__lead {
    margin-bottom: 14px;
    font-size: 14px;
    line-height: 1.55;
  }

  .hero__trust {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .hero__trust span {
    min-height: 34px;
    padding: 7px 9px;
    background: rgba(255,255,255,.7);
    border: 1px solid rgba(74,88,108,.09);
    border-radius: 11px;
  }

  .hero__trust span:last-child {
    grid-column: 1 / -1;
  }

  .hero-quick-start {
    margin-top: 17px;
  }

  .hero-quick-start > div {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
  }

  .hero-quick-start button {
    min-width: 0;
    padding-inline: 7px;
    font-size: 10px;
  }

  .hero-mobile-glance {
    min-height: 188px;
    border-radius: 24px;
    box-shadow: 0 22px 50px rgba(13,20,31,.17);
  }

  .hero-mobile-glance__render {
    height: 116%;
  }

  .hero__actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .hero__actions .button {
    width: 100%;
    min-height: 54px;
  }

  .how-section,
  .series-section,
  .advisor-section,
  .technology-section,
  .methodology-section {
    padding-block: 64px;
  }

  .section-heading h2,
  .series-heading h2,
  .advisor-heading h2,
  .methodology-layout h2,
  .technology-section h2 {
    font-size: clamp(38px, 10.5vw, 50px);
    line-height: .94;
  }

  .series-heading {
    margin-bottom: 18px;
  }

  .series-heading__stat {
    width: 100%;
    min-width: 0;
  }

  .series-dashboard {
    border-radius: 26px;
  }

  .series-dashboard__feature {
    min-height: 515px;
    padding: 20px;
    border-radius: 26px 26px 0 0;
  }

  .series-profile-hero {
    min-height: 206px;
  }

  .series-feature__copy h3 {
    font-size: 32px;
  }

  .series-feature__copy p {
    font-size: 12px;
  }

  .series-dashboard__catalog {
    padding: 14px;
    border-radius: 0 0 26px 26px;
  }

  .series-controls {
    margin: 0 0 12px;
    padding: 10px;
    border-radius: 16px;
  }

  .series-controls__primary,
  .series-controls__secondary {
    display: grid;
    grid-template-columns: 1fr;
  }

  .series-filters {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 3px;
    scrollbar-width: none;
  }

  .series-filters::-webkit-scrollbar {
    display: none;
  }

  .series-filters button {
    flex: 0 0 auto;
  }

  .series-rail {
    grid-template-columns: 1fr;
  }

  .series-card__select {
    grid-template-columns: 66px minmax(0, 1fr) 48px;
    padding: 12px;
  }

  .series-card__visual {
    width: 64px;
    height: 72px;
  }

  .series-card__copy strong,
  .series-card__copy h3 {
    font-size: 16px;
  }

  .series-card__copy em,
  .series-card__copy p {
    font-size: 10px;
  }

  .advisor-heading {
    margin-bottom: 16px;
  }

  .advisor-mode-bar {
    display: grid;
    gap: 10px;
    padding: 11px;
  }

  .advisor-mode-switch {
    width: 100%;
  }

  .advisor-mode-switch button {
    min-width: 0;
    flex: 1;
  }

  .advisor-shell {
    border-radius: 26px;
  }

  .advisor-progress {
    padding: 12px;
    border-radius: 25px 25px 0 0;
  }

  .advisor-progress__meta {
    padding-bottom: 10px;
  }

  .advisor-progress__meta > span {
    width: 40px;
    height: 40px;
  }

  .advisor-step-rail {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: 92px;
  }

  .advisor-step-rail button {
    min-width: 92px;
    min-height: 40px;
    grid-template-columns: 25px 1fr;
    gap: 6px;
    padding: 5px 6px;
  }

  .advisor-step-rail button span {
    width: 24px;
    height: 24px;
  }

  .advisor-step-rail button b {
    font-size: 8px;
  }

  .advisor-context-ribbon {
    display: flex;
    overflow-x: auto;
    padding: 9px 10px;
    border-radius: 0;
    scrollbar-width: none;
  }

  .advisor-context-ribbon::-webkit-scrollbar {
    display: none;
  }

  .advisor-context-ribbon > button,
  .advisor-autosave {
    flex: 0 0 148px;
  }

  .advisor-layout {
    display: block;
    padding: 10px;
  }

  .advisor-main {
    padding: 10px;
    border-radius: 20px;
  }

  .engineer-message {
    padding: 10px;
  }

  .question-step {
    min-height: 0;
    padding: 14px;
    border-radius: 18px;
  }

  .question-head {
    align-items: flex-start;
  }

  .question-head > span {
    width: 38px;
    height: 38px;
  }

  .question-head h3 {
    font-size: 25px;
  }

  .choice-card > span,
  .solution-type-card > span,
  .priority-grid label > span {
    min-height: 102px;
  }

  .advisor-controls {
    bottom: 8px;
    grid-template-columns: auto 1fr auto;
    gap: 7px;
    padding: 8px;
    border-radius: 16px;
  }

  .advisor-controls__center {
    min-width: 0;
  }

  .advisor-controls__hint,
  .advisor-controls__center .autosave-status {
    display: none;
  }

  .advisor-controls .button {
    min-height: 46px;
    padding-inline: 13px;
  }

  .advisor-live {
    margin-top: 10px;
    min-height: 440px;
    padding: 17px;
    border-radius: 20px;
  }

  .results-toolbar {
    display: grid;
    min-height: 0;
    padding: 15px;
    border-radius: 20px;
  }

  .results-toolbar h2 {
    font-size: 37px;
  }

  .results-actions {
    display: flex;
    overflow-x: auto;
    padding-bottom: 3px;
    scrollbar-width: none;
  }

  .results-actions::-webkit-scrollbar {
    display: none;
  }

  .results-actions button {
    flex: 0 0 auto;
  }

  .result-section-nav {
    top: 68px;
    margin-block: 9px 13px;
    overflow-x: auto;
    justify-content: flex-start;
    scrollbar-width: none;
  }

  .result-section-nav::-webkit-scrollbar {
    display: none;
  }

  .result-section-nav a {
    flex: 0 0 112px;
  }

  .recommendation-hero {
    display: grid;
    grid-template-columns: 1fr;
    min-height: 0;
    padding: 18px;
    border-radius: 26px;
  }

  .recommendation-hero__content {
    padding: 0;
  }

  .recommendation-family {
    margin-top: 20px;
  }

  .recommendation-hero__content h3 {
    font-size: clamp(44px, 12.5vw, 58px);
  }

  .recommendation-hero__content > p {
    font-size: 14px;
  }

  .reason-chips {
    margin-block: 14px 17px;
  }

  .recommendation-actions {
    display: grid;
  }

  .recommendation-actions .button {
    width: 100%;
  }

  .recommendation-profile-v4 {
    grid-row: 2;
    min-height: 300px;
    border-radius: 20px;
  }

  .energy-score-card {
    display: block;
    grid-column: auto;
    padding: 18px;
    border-radius: 21px;
  }

  .score-card-highlights {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .score-card-highlights > span {
    min-height: 70px;
    padding: 8px;
  }

  .decision-summary {
    display: grid;
    gap: 12px;
    padding: 15px;
  }

  .metric-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .metric-grid article {
    min-height: 154px;
    padding: 16px;
  }

  .metric-grid strong {
    font-size: 28px;
  }

  .results-two-column {
    grid-template-columns: 1fr;
  }

  .result-panel,
  .comfort-simulator,
  .family-section,
  .options-section,
  .catalog-match-section,
  .system-studio,
  .premium-explanation,
  .savings-section,
  .confidence-section,
  .result-cta {
    border-radius: 22px;
  }

  .panel-heading h3 {
    font-size: 30px;
  }

  .modal-card {
    border-radius: 24px 24px 0 0;
  }
}

@media (max-width: 420px) {
  .container {
    width: calc(100% - 20px);
  }

  .hero h1 {
    font-size: clamp(38px, 11.8vw, 49px);
  }

  .hero__trust {
    grid-template-columns: 1fr;
  }

  .hero__trust span:last-child {
    grid-column: auto;
  }

  .hero-quick-start > div {
    grid-template-columns: 1fr;
  }

  .hero-quick-start button {
    justify-content: flex-start;
  }

  .series-feature__metrics {
    grid-template-columns: 1fr;
  }

  .series-feature__actions {
    grid-template-columns: 1fr;
  }

  .series-card__select {
    grid-template-columns: 58px minmax(0, 1fr) 43px;
    gap: 8px;
  }

  .series-card__visual {
    width: 56px;
    height: 66px;
  }

  .advisor-controls .button span {
    display: none;
  }

  .advisor-controls .button .icon {
    margin: 0;
  }

  .metric-grid {
    grid-template-columns: 1fr;
  }

  .score-card-highlights {
    grid-template-columns: 1fr;
  }

  .score-card-highlights > span {
    min-height: 58px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .v7-interactive-surface::after,
  .button,
  .series-card,
  .choice-card > span,
  .solution-type-card > span,
  .priority-grid label > span {
    transition: none !important;
  }
}

@media print {
  .pilot-strip,
  .site-header,
  .result-section-nav,
  .mobile-bottom-nav,
  .result-dock,
  .advisor-controls {
    display: none !important;
  }

  .recommendation-hero,
  .energy-score-card,
  .result-panel,
  .metric-grid article {
    box-shadow: none !important;
  }
}

/* JavaScript-enhanced interaction helpers. */
.v7-magnetic {
  --mag-x: 0px;
  --mag-y: 0px;
  transform: translate3d(var(--mag-x), var(--mag-y), 0);
  will-change: transform;
}

.v7-magnetic:hover:not(:disabled) {
  transform: translate3d(var(--mag-x), calc(var(--mag-y) - 2px), 0);
}

.v7-magnetic:active:not(:disabled) {
  transform: translate3d(var(--mag-x), var(--mag-y), 0) scale(.985);
}

html[data-v7-ready="true"] .hero__content > * {
  animation: v7HeroReveal .76s var(--v7-ease) both;
}

html[data-v7-ready="true"] .hero__content > *:nth-child(2) { animation-delay: .05s; }
html[data-v7-ready="true"] .hero__content > *:nth-child(3) { animation-delay: .10s; }
html[data-v7-ready="true"] .hero__content > *:nth-child(4) { animation-delay: .15s; }
html[data-v7-ready="true"] .hero__content > *:nth-child(5) { animation-delay: .20s; }
html[data-v7-ready="true"] .hero__content > *:nth-child(6) { animation-delay: .25s; }
html[data-v7-ready="true"] .hero__content > *:nth-child(7) { animation-delay: .30s; }

@keyframes v7HeroReveal {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .v7-magnetic,
  .v7-magnetic:hover,
  .v7-magnetic:active,
  html[data-v7-ready="true"] .hero__content > * {
    animation: none !important;
    transform: none !important;
  }
}

/* --------------------------------------------------------------------------
   0.7.0 release-candidate corrections after browser review
   -------------------------------------------------------------------------- */

/* The three-dimensional demo focus is a real segmented control, not raw UI. */
.hero-focus-switch {
  position: absolute;
  z-index: 12;
  top: 73px;
  left: 50%;
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(255,255,255,.94);
  border-radius: 14px;
  box-shadow: 0 13px 34px rgba(25,35,49,.11), inset 0 1px 0 #fff;
  backdrop-filter: blur(18px) saturate(1.18);
  transform: translateX(-50%);
}

.hero-focus-switch button {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 12px;
  color: #667284;
  background: transparent;
  border: 0;
  border-radius: 10px;
  font-size: 10px;
  font-weight: 820;
  letter-spacing: -.01em;
  white-space: nowrap;
  cursor: pointer;
  transition: color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s var(--v7-ease);
}

.hero-focus-switch button:hover {
  color: #111925;
  background: rgba(244,247,250,.9);
  transform: translateY(-1px);
}

.hero-focus-switch button.is-active,
.hero-focus-switch button[aria-selected="true"] {
  color: #fff;
  background: linear-gradient(135deg, #f52b3b, #d81222);
  box-shadow: 0 8px 18px rgba(237,28,43,.24), inset 0 1px 0 rgba(255,255,255,.25);
}

.hero-focus-switch .icon {
  width: 14px;
  height: 14px;
}

/* Keep all copy readable on the dark live-preview surface. */
.advisor-live__head span {
  color: #ff8791 !important;
}

.advisor-live__head strong {
  color: #fff !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.18);
}

.advisor-live .live-score strong,
.advisor-live .live-score b,
.advisor-live .live-facts strong,
.advisor-live .live-facts b,
.advisor-live .live-tip strong,
.advisor-live .live-tip b {
  color: #fff;
}

.advisor-live .live-score small,
.advisor-live .live-facts small,
.advisor-live .live-tip p,
.advisor-live .live-tip span {
  color: rgba(233,239,247,.70);
}

/* Slightly improve scanning of system cards without growing the catalog. */
.series-card__copy em,
.series-card__copy p {
  color: #727d8d;
  font-size: 9.5px;
  line-height: 1.42;
}

.series-card__facts b {
  color: #202a37;
  font-size: 9.5px;
}

.series-card__foot {
  color: #778294;
}

/* Avoid viewport-wide paint overflow caused by legacy carousel offsets. */
html,
body {
  max-width: 100%;
  overflow-x: clip;
}

@media (max-width: 1100px) {
  .hero-focus-switch {
    top: 75px;
  }
}

@media (max-width: 760px) {
  html,
  body,
  .page-shell,
  main {
    max-width: 100%;
    overflow-x: clip;
  }

  /* Restore the complete secondary CTA hidden by an older mobile override. */
  .hero__actions .button--ghost,
  .recommendation-actions .button--ghost {
    width: 100% !important;
    min-width: 0 !important;
    padding-inline: 18px !important;
  }

  .hero__actions .button--ghost span,
  .recommendation-actions .button--ghost span {
    display: inline !important;
  }

  /* Mobile trust markers remain in the content column instead of bleeding out. */
  .hero__trust {
    width: 100% !important;
    margin: 14px 0 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    grid-auto-flow: row !important;
    grid-auto-columns: auto !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    scroll-snap-type: none !important;
  }

  .hero__trust span {
    width: auto !important;
    min-width: 0 !important;
    scroll-snap-align: none !important;
  }

  .hero__trust span:last-child {
    grid-column: 1 / -1 !important;
  }

  /* Retain a swipeable explainer without negative page margins. */
  .how-grid {
    width: 100% !important;
    margin-inline: 0 !important;
    padding: 2px 0 12px !important;
    grid-auto-columns: minmax(255px, 84%) !important;
    overscroll-behavior-inline: contain;
  }

  /* Catalog becomes a predictable one-column list on phones. */
  .series-rail,
  .series-rail:not(.is-compact),
  .series-rail.is-compact {
    width: 100% !important;
    display: grid !important;
    grid-auto-flow: row !important;
    grid-template-columns: 1fr !important;
    grid-auto-columns: auto !important;
    gap: 9px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    scroll-snap-type: none !important;
  }

  .series-rail .series-card {
    width: 100% !important;
    min-width: 0 !important;
    scroll-snap-align: none !important;
  }

  .series-controls,
  .series-dashboard__catalog,
  .series-dashboard,
  .series-section,
  .series-orbit {
    min-width: 0;
    max-width: 100%;
  }

  .hero-focus-switch {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    margin: 9px 0 10px;
    transform: none;
  }

  .hero-focus-switch button {
    flex: 1 1 0;
    min-width: 0;
    padding-inline: 8px;
  }

  .advisor-live {
    min-height: 450px;
  }

  .advisor-live__head {
    gap: 5px;
  }

  .advisor-live__head strong {
    font-size: 18px;
  }
}

@media (max-width: 420px) {
  .hero__trust {
    grid-template-columns: 1fr !important;
  }

  .hero__trust span:last-child {
    grid-column: auto !important;
  }

  .how-grid {
    grid-auto-columns: 91% !important;
  }

  .hero-focus-switch button span {
    font-size: 9px;
  }
}

/* Custom section headers must not inherit the generic 780 px editorial cap. */
.series-heading,
.advisor-heading {
  width: 100%;
  max-width: none;
}

@media (min-width: 1101px) {
  .series-heading {
    grid-template-columns: minmax(0, 1fr) minmax(250px, 305px);
    align-items: center;
  }

  .advisor-heading {
    grid-template-columns: minmax(0, 1fr) minmax(390px, 500px);
    align-items: end;
  }

  .advisor-heading > div {
    max-width: 760px;
  }
}

/* ========================================================================== 
   AKFA Energy 0.7.0 — final layout audit patch
   Fixes the regressions found during real viewport review: duplicated anchor
   offsets, constrained section headings, low-contrast result typography,
   oversized mobile product studio and ambiguous mobile actions.
   ========================================================================== */

/* One sticky offset only. Previously scroll-padding and scroll-margin were
   added together, leaving ~180 px of dead space after navigation clicks. */
html {
  scroll-padding-top: 102px;
}

main > section,
section[id] {
  scroll-margin-top: 0 !important;
}

/* The generic .section-heading has max-width: 780px in the legacy layer.
   Product explorer and advisor are application workspaces and must use the
   full container width. */
.series-heading,
.advisor-heading {
  width: 100%;
  max-width: none;
}

/* Desktop hero: a slightly wider copy column produces fewer artificial line
   breaks and brings all primary actions into the first common viewport. */
@media (min-width: 1101px) {
  .hero {
    min-height: min(790px, calc(100svh - 98px));
    padding-block: 48px 56px;
  }

  .hero__layout {
    grid-template-columns: minmax(0, .96fr) minmax(560px, 1.04fr);
    gap: clamp(34px, 4.2vw, 64px);
  }

  .hero h1 {
    max-width: 760px;
    margin-block: 20px 17px;
    font-size: clamp(56px, 4.85vw, 78px);
    line-height: .94;
  }

  .hero__lead {
    margin-bottom: 18px;
  }

  .hero-quick-start {
    margin-top: 18px;
  }

  .hero-lab {
    min-height: 600px;
    padding: 21px;
  }

  .climate-scene {
    min-height: 397px;
  }

  .hero-lab__bottom {
    padding-block: 11px;
  }
}

/* Product catalogue heading: one coherent header instead of a small card
   floating in a large empty field. */
.series-heading {
  grid-template-columns: minmax(0, 1fr) minmax(270px, 360px);
  align-items: stretch;
  padding: 26px 28px;
  background:
    radial-gradient(circle at 93% 15%, rgba(237, 28, 43, .095), transparent 17rem),
    linear-gradient(135deg, rgba(255,255,255,.94), rgba(248,250,253,.86));
  border-color: rgba(255,255,255,.98);
  box-shadow: 0 22px 58px rgba(18,27,41,.085), inset 0 1px 0 #fff;
}

.series-heading > div:first-child {
  align-self: center;
}

.series-heading__tools {
  display: grid;
  grid-template-columns: 1fr;
  align-content: stretch;
}

.series-heading__stat,
.series-heading__compare {
  width: 100%;
}

.series-heading__stat {
  min-height: 104px;
}

.series-heading__compare {
  justify-content: center;
}

/* Make the cards/compact switch visually native to the control bar. */
.series-view-switch {
  display: inline-flex;
  flex: 0 0 auto;
  gap: 3px;
  padding: 3px;
  background: #e9edf2;
  border: 1px solid rgba(74,88,108,.11);
  border-radius: 12px;
  box-shadow: inset 0 1px 2px rgba(18,27,41,.04);
}

.series-view-switch button {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 10px;
  color: #677285;
  background: transparent;
  border: 0;
  border-radius: 9px;
  font-size: 9px;
  font-weight: 780;
  transition: color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease;
}

.series-view-switch button:hover {
  color: var(--v7-ink);
}

.series-view-switch button.is-active {
  color: var(--v7-red);
  background: #fff;
  box-shadow: 0 7px 18px rgba(18,27,41,.09), inset 0 -2px 0 var(--v7-red);
}

.series-view-switch .icon {
  width: 14px;
  height: 14px;
}

/* Compact mode is a true scan view, not merely smaller cards. */
.series-rail.is-compact {
  display: grid;
  grid-template-columns: 1fr;
  gap: 7px;
}

.series-rail.is-compact .series-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  min-height: 78px;
}

.series-rail.is-compact .series-card__select {
  grid-template-columns: 54px minmax(0, 1fr) 58px;
  min-height: 78px;
  padding: 8px 10px;
}

.series-rail.is-compact .series-card__visual,
.series-rail.is-compact .series-card__visual[data-system-type="sliding"] {
  width: 50px;
  height: 60px;
}

.series-rail.is-compact .series-card__copy em {
  min-height: 0;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.series-rail.is-compact .series-card__facts,
.series-rail.is-compact .series-card__foot > span,
.series-rail.is-compact .series-card__open {
  display: none;
}

.series-rail.is-compact .series-card__foot {
  min-width: 116px;
  padding: 0 10px 0 0;
  border-top: 0;
}

.series-rail.is-compact .series-card__compare {
  min-height: 38px;
  justify-content: center;
  padding-inline: 10px;
  background: #f7f9fb;
  border: 1px solid rgba(74,88,108,.10);
  border-radius: 10px;
}

/* Advisor intro uses the entire width and becomes a concise product header. */
.advisor-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .72fr);
  align-items: end;
  gap: 54px;
}

.advisor-heading > div:first-child {
  max-width: 840px;
}

.advisor-heading h2 {
  max-width: 820px;
  font-size: clamp(48px, 4.4vw, 66px);
  line-height: .96;
}

.advisor-heading > p {
  max-width: 590px;
  padding-bottom: 8px;
}

/* Recommendation card had inherited white typography from the old dark card
   while the new v7 surface is light. Explicit colors restore contrast. */
.recommendation-hero {
  color: var(--v7-ink);
  background:
    linear-gradient(rgba(255,255,255,.13) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.13) 1px, transparent 1px),
    radial-gradient(circle at 55% 48%, rgba(63,157,244,.18), transparent 27rem),
    radial-gradient(circle at 11% 87%, rgba(237,28,43,.13), transparent 24rem),
    linear-gradient(135deg, #ffffff 0%, #f4f8fc 57%, #f9ecef 100%);
  background-size: 40px 40px, 40px 40px, auto, auto, auto;
  border-color: rgba(255,255,255,.98);
}

.recommendation-hero::before {
  opacity: .34;
  background-image:
    radial-gradient(circle at 18% 24%, rgba(237,28,43,.10), transparent 2px),
    radial-gradient(circle at 82% 73%, rgba(63,157,244,.12), transparent 2px);
  background-size: 34px 34px, 42px 42px;
  mask-image: linear-gradient(90deg, #000 0, rgba(0,0,0,.28) 70%, transparent 100%);
}

.recommendation-badge {
  color: var(--v7-red-dark);
  background: rgba(255,238,240,.92);
  border-color: rgba(237,28,43,.22);
  box-shadow: 0 8px 20px rgba(237,28,43,.08), inset 0 1px 0 #fff;
}

.recommendation-badge i {
  background: var(--v7-red);
  box-shadow: 0 0 0 5px rgba(237,28,43,.10);
}

.recommendation-family {
  color: #788496;
}

.recommendation-hero__content h3 {
  color: var(--v7-ink);
  text-shadow: none;
}

.recommendation-hero__content > p {
  color: #687589;
}

.reason-chips span {
  color: #4f5b6d;
  background: rgba(255,255,255,.84);
  border-color: rgba(74,88,108,.11);
  box-shadow: 0 7px 18px rgba(18,27,41,.055), inset 0 1px 0 #fff;
}

.recommendation-actions .button--ghost {
  color: var(--v7-ink);
  background: rgba(255,255,255,.80);
  border-color: rgba(74,88,108,.14);
  box-shadow: var(--v7-shadow-xs);
}

.recommendation-actions .button--ghost:hover {
  color: var(--v7-red);
  border-color: rgba(237,28,43,.24);
}

/* A quieter back-to-top control. Mobile already has a persistent Home tab. */
.back-to-top {
  right: 20px;
  bottom: 20px;
}

@media (max-width: 1100px) {
  .series-heading,
  .advisor-heading {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .series-heading__tools {
    grid-template-columns: minmax(0, 1fr) auto;
  }
}

@media (max-width: 760px) {
  html {
    scroll-padding-top: 94px;
  }

  main > section,
  section[id] {
    scroll-margin-top: 0 !important;
  }

  /* Keep both hero actions understandable. An icon-only white rectangle looked
     like a rendering error in the previous mobile build. */
  .hero__actions {
    grid-template-columns: minmax(0, 1fr) 104px;
  }

  .hero__actions .button--ghost {
    width: auto;
    padding-inline: 10px;
  }

  .hero__actions .button--ghost span {
    display: inline;
    font-size: 9px;
  }

  /* Product studio: show the chosen system and its essentials in one compact
     card so the catalogue controls appear without an extra full-screen scroll. */
  .series-heading {
    width: 100%;
    padding: 16px;
  }

  .series-heading__tools {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .series-dashboard__feature {
    min-height: 0;
    display: grid;
    grid-template-columns: 118px minmax(0, 1fr);
    grid-template-areas:
      "top top"
      "visual copy"
      "metrics metrics"
      "score score"
      "actions actions";
    column-gap: 12px;
    row-gap: 8px;
    padding: 14px;
  }

  .series-feature__top {
    grid-area: top;
  }

  .series-profile-hero {
    grid-area: visual;
    width: 118px;
    height: 146px;
    min-height: 146px;
    margin: 0;
    align-self: center;
    border-radius: 16px;
  }

  .series-profile-render {
    bottom: -12%;
    height: 112%;
  }

  .series-feature__copy {
    grid-area: copy;
    align-self: center;
  }

  .series-feature__copy h3 {
    margin-block: 4px 7px;
    font-size: clamp(24px, 7.1vw, 29px);
    line-height: .96;
  }

  .series-feature__copy p {
    -webkit-line-clamp: 3;
    font-size: 10px;
  }

  .series-feature__metrics {
    grid-area: metrics;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0;
  }

  .series-feature__metrics span {
    min-height: 48px;
  }

  .series-feature-score {
    grid-area: score;
    margin: 0;
  }

  .series-feature__actions {
    grid-area: actions;
    margin: 0;
  }

  .series-controls {
    position: sticky;
    top: 62px;
  }

  .series-rail.is-compact .series-card {
    grid-template-columns: 1fr auto;
  }

  .series-rail.is-compact .series-card__select {
    grid-template-columns: 52px minmax(0, 1fr) 48px;
  }

  .series-rail.is-compact .series-card__foot {
    min-width: 46px;
    padding-right: 6px;
  }

  .series-rail.is-compact .series-card__compare {
    width: 40px;
    padding: 0;
  }

  .series-rail.is-compact .series-card__compare span {
    display: none;
  }

  .advisor-heading {
    width: 100%;
    gap: 6px;
  }

  .advisor-heading h2 {
    max-width: 100%;
  }

  /* Result card is readable immediately, before the image and score modules. */
  .recommendation-hero__content {
    padding-top: 20px;
  }

  .recommendation-family {
    margin-top: 15px;
  }

  .recommendation-hero__content h3 {
    font-size: clamp(38px, 10.8vw, 48px);
  }

  .recommendation-profile-v4 {
    min-height: 220px;
  }

  .back-to-top {
    display: none !important;
  }
}

@media (max-width: 420px) {
  .hero__actions {
    grid-template-columns: minmax(0, 1fr) 96px;
  }

  .series-dashboard__feature {
    grid-template-columns: 104px minmax(0, 1fr);
  }

  .series-profile-hero {
    width: 104px;
    height: 136px;
    min-height: 136px;
  }

  .series-feature__metrics small {
    font-size: 6.5px;
  }

  .series-feature__metrics b {
    font-size: 10px;
  }
}

@media (max-width: 760px) {
  /* Long mobile workspaces can never reach a percentage-based reveal threshold.
     They must be visible as soon as their section enters the viewport. */
  .series-dashboard.reveal,
  .advisor-shell.reveal {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ========================================================================== 
   0.7.0 final design audit — hierarchy, density and mobile usability
   The rules below deliberately resolve issues found in real browser captures:
   oversized hero wrapping, catalog overlength, clipped wizard navigation and
   low-contrast recommendation content.
   ========================================================================== */

:root {
  --v7-container: 1392px;
  --v7-content-gutter: clamp(20px, 3.2vw, 48px);
  --v7-copy: #151b25;
  --v7-copy-muted: #667286;
  --v7-card: rgba(255, 255, 255, .92);
  --v7-card-line: rgba(92, 108, 130, .13);
}

.container {
  width: min(calc(100% - (var(--v7-content-gutter) * 2)), var(--v7-container));
}

/* Hero: fewer line breaks, one clear story and a denser interactive demo. */
.hero {
  min-height: auto;
  padding: clamp(32px, 4vh, 48px) 0 clamp(46px, 5vh, 62px);
}

.hero__layout {
  grid-template-columns: minmax(0, .98fr) minmax(610px, 1.02fr);
  gap: clamp(34px, 3.6vw, 54px);
  align-items: center;
}

.hero__content {
  max-width: 680px;
}

.hero h1 {
  max-width: 680px;
  margin: 18px 0 16px;
  font-size: clamp(52px, 4.65vw, 67px);
  line-height: .94;
  letter-spacing: -.066em;
  text-wrap: balance;
}

.hero__lead {
  max-width: 630px;
  margin-bottom: 20px;
  font-size: 15.5px;
  line-height: 1.58;
}

.hero__actions {
  gap: 10px;
}

.hero__actions .button {
  min-height: 53px;
}

.hero__trust {
  margin-top: 14px;
}

.hero-quick-start {
  margin-top: 13px;
}

.hero-lab {
  min-height: 578px;
  border-radius: 30px;
}

.hero-lab__top {
  min-height: 74px;
  padding: 14px 18px 11px;
}

.hero-focus-switch {
  top: 78px;
}

.climate-scene {
  min-height: 352px;
}

.hero-product-layer {
  min-height: 352px;
}

.hero-dashboard-card--score {
  width: 146px;
  min-height: 112px;
  color: #1a2330;
  background: rgba(255,255,255,.90);
  border-color: rgba(255,255,255,.96);
  box-shadow: 0 18px 42px rgba(18,27,41,.13);
  backdrop-filter: blur(18px) saturate(1.12);
}

.hero-dashboard-card--score small {
  color: #7a8594;
}

.hero-dashboard-card--score strong {
  color: #121923;
}

.scene-result {
  color: #1a2330;
  background: rgba(255,255,255,.92);
  border-color: rgba(255,255,255,.96);
  box-shadow: 0 16px 36px rgba(20,31,48,.12);
  backdrop-filter: blur(16px) saturate(1.12);
}

.scene-result span,
.scene-result span b,
.scene-result > span {
  color: #202936 !important;
}

.scene-result strong,
.scene-result strong b {
  color: var(--v7-red) !important;
}

.hero-lab__bottom {
  padding-bottom: 13px;
}

.hero-lab__telemetry > span {
  min-height: 47px;
}

/* Section headings no longer behave like second hero screens. */
.section-heading,
.series-heading,
.advisor-heading {
  max-width: none;
}

.how-section,
.series-section,
.advisor-section,
.technology-section,
.methodology-section {
  content-visibility: auto;
  contain-intrinsic-size: 900px;
}

.how-section {
  padding: 64px 0 68px;
}

.how-section .section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 420px);
  align-items: end;
  gap: 32px;
  margin-bottom: 24px;
}

.how-section .section-heading h2 {
  max-width: 780px;
  margin: 6px 0 0;
  font-size: clamp(36px, 3.6vw, 52px);
}

.how-section .section-heading p {
  margin: 0;
}

.how-grid article {
  min-height: 192px;
  padding: 22px;
}

/* Catalog: selected product stays premium, while the whole line remains scannable. */
.series-section {
  padding: 66px 0 76px;
}

.series-heading {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 22px;
  margin-bottom: 14px;
  padding: 21px 22px;
  border-radius: 24px;
}

.series-heading h2 {
  max-width: 760px;
  margin: 5px 0 8px;
  font-size: clamp(36px, 3.45vw, 52px);
  line-height: .98;
}

.series-heading p {
  max-width: 700px;
  font-size: 13px;
}

.series-heading__tools {
  grid-template-columns: 168px 228px;
  align-items: stretch;
}

.series-heading__stat {
  min-width: 0;
  min-height: 96px;
  padding: 13px 15px;
}

.series-heading__stat strong {
  font-size: 38px;
}

.series-dashboard {
  grid-template-columns: minmax(340px, 385px) minmax(0, 1fr);
  gap: 13px;
  padding: 13px;
  border-radius: 28px;
}

.series-dashboard__feature {
  top: 82px;
  min-height: 610px;
  padding: 18px;
  border-radius: 22px;
}

.series-profile-hero {
  min-height: 255px;
}

.series-profile-render {
  bottom: -16%;
  height: 116%;
}

.series-feature__copy h3 {
  font-size: clamp(30px, 2.55vw, 39px);
}

.series-feature__copy p {
  min-height: 0;
  font-size: 12px;
}

.series-feature__metrics span {
  min-height: 55px;
}

.series-feature-score {
  margin-top: 8px;
}

.series-controls {
  top: 76px;
  margin-bottom: 10px;
  padding: 10px;
}

.series-search {
  min-height: 44px;
}

@media (min-width: 1180px) {
  .series-rail:not(.is-compact) {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 9px !important;
  }

  .series-rail:not(.is-compact) .series-card {
    min-height: 168px;
    border-radius: 16px;
  }

  .series-rail:not(.is-compact) .series-card__select {
    grid-template-columns: 61px minmax(0, 1fr) 44px !important;
    min-height: 99px !important;
    padding: 10px !important;
  }

  .series-rail:not(.is-compact) .series-card__visual,
  .series-rail:not(.is-compact) .series-card__visual[data-system-type="sliding"] {
    width: 58px !important;
    height: 74px !important;
  }

  .series-rail:not(.is-compact) .series-card__copy strong {
    font-size: 12px !important;
    line-height: 1.15;
  }

  .series-rail:not(.is-compact) .series-card__copy em {
    min-height: 30px !important;
    font-size: 8.5px !important;
    line-height: 1.35;
  }

  .series-rail:not(.is-compact) .series-card__eyebrow {
    font-size: 7.5px;
  }

  .series-rail:not(.is-compact) .series-card__score b {
    font-size: 21px !important;
  }

  .series-rail:not(.is-compact) .series-card__facts {
    gap: 6px;
    padding: 0 9px 7px !important;
  }

  .series-rail:not(.is-compact) .series-card__facts span {
    min-height: 35px;
  }

  .series-rail:not(.is-compact) .series-card__foot {
    min-height: 39px;
  }
}

/* Advisor: the first question appears immediately; navigation never competes with it. */
.advisor-section {
  padding: 66px 0 76px;
}

.advisor-heading {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(320px, .58fr);
  align-items: end;
  gap: 38px;
  margin-bottom: 20px;
}

.advisor-heading h2 {
  max-width: 700px;
  margin-top: 5px;
  font-size: clamp(39px, 3.65vw, 55px);
  line-height: .96;
}

.advisor-heading > p {
  margin: 0 0 3px;
  font-size: 14px;
}

.advisor-mode-bar {
  min-height: 68px;
  margin-bottom: 12px;
  padding: 8px 10px 8px 15px;
}

.advisor-shell {
  border-radius: 28px;
}

.advisor-progress {
  width: 194px;
}

.advisor-context-ribbon {
  min-height: 66px;
}

.advisor-main {
  padding: 16px;
}

.engineer-message {
  min-height: 72px;
}

.question-step {
  min-height: 405px;
}

.advisor-live {
  min-height: 620px;
}

/* Results: explicit contrast instead of relying on the former dark background. */
.results {
  scroll-margin-top: 92px;
  padding-top: 24px;
}

.results-toolbar {
  min-height: 92px;
  padding: 17px 20px;
}

.results-toolbar h2 {
  max-width: 780px;
  font-size: clamp(37px, 3.65vw, 52px);
}

.result-section-nav {
  top: 72px;
}

.recommendation-hero {
  grid-template-columns: minmax(0, 1.02fr) minmax(300px, .72fr) minmax(280px, .58fr);
  min-height: 510px;
  padding: 26px;
  overflow: hidden;
  background:
    radial-gradient(circle at 59% 48%, rgba(73,158,255,.18), transparent 24rem),
    radial-gradient(circle at 9% 89%, rgba(237,28,43,.10), transparent 23rem),
    linear-gradient(135deg, #ffffff 0%, #f8fafc 48%, #eff6fc 70%, #fff2f4 100%);
  border: 1px solid rgba(255,255,255,.98);
}

.recommendation-hero::before {
  opacity: .14;
  background-image:
    linear-gradient(rgba(31,43,58,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(31,43,58,.055) 1px, transparent 1px);
}

.recommendation-hero__content {
  color: var(--v7-copy);
  align-self: center;
  padding: 8px 0 8px 8px;
}

.recommendation-badge {
  color: #dd1c2a;
  background: #fff0f2;
  border-color: rgba(237,28,43,.28);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}

.recommendation-family {
  color: #d71a28;
  margin-top: 22px;
}

.recommendation-hero__content h3 {
  max-width: 620px;
  color: #111720;
  margin: 5px 0 11px;
  font-size: clamp(48px, 4.6vw, 68px);
  line-height: .92;
  text-shadow: none;
}

.recommendation-hero__content > p {
  max-width: 560px;
  color: #647186;
  font-size: 15px;
}

.reason-chips span {
  color: #283241;
  background: rgba(255,255,255,.88);
  border-color: rgba(92,108,130,.14);
  box-shadow: 0 8px 20px rgba(20,31,48,.055);
}

.reason-chips span::before {
  background: #17aa6b;
}

.recommendation-actions .button--ghost {
  color: #1b2430;
  background: rgba(255,255,255,.82);
  border-color: rgba(92,108,130,.17);
  box-shadow: 0 9px 24px rgba(20,31,48,.07);
}

.recommendation-actions .button--ghost:hover {
  color: #d91a28;
  background: #fff;
  border-color: rgba(237,28,43,.24);
}

.recommendation-profile-v4 {
  min-height: 430px;
  align-self: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 52% 46%, rgba(255,255,255,.98), transparent 26%),
    radial-gradient(circle at 28% 52%, rgba(255,157,67,.17), transparent 33%),
    radial-gradient(circle at 78% 51%, rgba(73,158,255,.22), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.55), rgba(225,235,246,.70));
  border: 1px solid rgba(255,255,255,.92);
  box-shadow: inset 0 1px 0 #fff, 0 22px 54px rgba(20,31,48,.10);
}

.recommendation-profile-render {
  bottom: -13%;
  width: min(100%, 370px);
  height: 112%;
  object-fit: contain;
  filter: drop-shadow(0 30px 36px rgba(20,31,48,.28));
  mask-image: linear-gradient(to bottom, transparent 0, #000 7%, #000 91%, transparent 100%);
}

.recommendation-profile-v4__label {
  color: #fff;
  background: rgba(17,24,34,.82);
  border-color: rgba(255,255,255,.13);
  backdrop-filter: blur(14px);
}

.energy-score-card {
  min-height: 458px;
  padding: 21px;
  color: #fff;
}

.energy-score-card__title,
.energy-score-card p,
.energy-score-card span,
.energy-score-card small,
.energy-score-card strong {
  color: inherit;
}

.score-card-highlights > span {
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.09);
}

.decision-summary {
  background: rgba(255,255,255,.92);
}

/* -----------------------------------------------------------------------
   Mobile: one-screen priority, compact catalog and unobstructed form/result.
   ----------------------------------------------------------------------- */
@media (max-width: 760px) {
  :root {
    --v7-content-gutter: 10px;
  }

  html {
    scroll-padding-top: 68px;
  }

  body {
    background: linear-gradient(180deg, #fafbfc 0%, #eef2f6 100%);
  }

  .pilot-strip {
    display: none;
  }

  .site-header,
  .site-header__inner,
  .site-header.is-scrolled,
  .site-header.is-scrolled .site-header__inner {
    height: 60px;
  }

  .site-header {
    top: 0;
  }

  .brand--official .brand__logo {
    width: 125px;
  }

  .hero {
    padding: 20px 0 24px;
  }

  .hero__layout {
    display: block;
  }

  .hero__content {
    max-width: none;
  }

  .eyebrow {
    min-height: 28px;
    margin-bottom: 12px;
  }

  .hero h1 {
    max-width: 365px;
    margin: 0 0 12px;
    font-size: clamp(39px, 11.4vw, 47px);
    line-height: .96;
    letter-spacing: -.061em;
  }

  .hero__lead {
    margin-bottom: 12px;
    font-size: 12.5px;
    line-height: 1.5;
  }

  .hero-mobile-glance {
    min-height: 176px;
    margin: 10px 0 12px;
    border-radius: 20px;
  }

  .hero-mobile-glance__scene {
    width: 52%;
  }

  .hero-mobile-glance__score {
    left: 52%;
    padding: 16px 12px;
  }

  .hero-mobile-glance__score strong b {
    font-size: 39px;
  }

  .hero-mobile-glance__score p {
    gap: 4px;
  }

  .hero-mobile-glance__score p span {
    padding: 5px 6px;
  }

  .hero__actions {
    gap: 8px;
  }

  .hero__actions .button {
    min-height: 50px;
    border-radius: 15px;
    font-size: 12px;
  }

  .hero__trust {
    margin-top: 10px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }

  .hero__trust span {
    min-height: 34px;
    padding: 7px 8px;
    font-size: 8.5px;
  }

  .hero__trust span:last-child {
    grid-column: 1 / -1 !important;
  }

  .hero-quick-start {
    display: none;
  }

  .how-section {
    padding: 46px 0 50px;
  }

  .how-section .section-heading,
  .advisor-heading {
    display: block;
    margin-bottom: 17px;
  }

  .how-section .section-heading h2,
  .advisor-heading h2 {
    font-size: 35px;
  }

  .how-section .section-heading p,
  .advisor-heading > p {
    margin-top: 10px;
    font-size: 12.5px;
  }

  .series-section {
    padding: 46px 0 54px;
  }

  .series-heading {
    display: block;
    padding: 17px;
    margin-bottom: 10px;
    border-radius: 20px;
  }

  .series-heading h2 {
    font-size: 35px;
  }

  .series-heading__tools {
    display: grid;
    grid-template-columns: 104px minmax(0, 1fr);
    margin-top: 14px;
  }

  .series-heading__stat {
    min-height: 74px;
    padding: 10px;
  }

  .series-heading__stat strong {
    font-size: 30px;
  }

  .series-heading__compare {
    min-height: 74px;
  }

  .series-dashboard {
    display: block;
    padding: 9px;
    border-radius: 22px;
  }

  .series-dashboard__feature {
    position: relative;
    top: auto;
    min-height: 0;
    padding: 14px;
    border-radius: 18px;
  }

  .series-profile-hero {
    min-height: 188px;
    margin-bottom: 7px;
  }

  .series-profile-render {
    bottom: -18%;
    height: 120%;
  }

  .series-feature__copy h3 {
    font-size: 31px;
  }

  .series-feature__copy p {
    font-size: 11px;
  }

  .series-feature__metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .series-feature__metrics span {
    min-height: 49px;
    padding: 8px;
  }

  .series-feature__metrics span small {
    font-size: 6.5px;
  }

  .series-feature__actions {
    grid-template-columns: 1fr auto;
  }

  .series-dashboard__catalog {
    padding: 9px 0 0;
  }

  .series-controls {
    position: relative;
    top: auto;
    margin: 0 0 9px;
    padding: 9px;
    border-radius: 16px;
  }

  .series-controls__primary,
  .series-controls__secondary {
    gap: 6px;
  }

  .series-filter {
    flex: 1 1 auto;
    min-height: 34px;
    padding-inline: 9px;
  }

  .series-search {
    min-height: 42px;
  }

  .series-sort,
  .series-view-switch {
    flex: 1 1 0;
  }

  .series-rail,
  .series-rail:not(.is-compact),
  .series-rail.is-compact {
    gap: 7px !important;
  }

  .series-rail .series-card,
  .series-rail:not(.is-compact) .series-card,
  .series-rail.is-compact .series-card {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 42px !important;
    min-height: 88px !important;
    border-radius: 15px !important;
  }

  .series-rail .series-card__select,
  .series-rail:not(.is-compact) .series-card__select,
  .series-rail.is-compact .series-card__select {
    grid-template-columns: 54px minmax(0, 1fr) 46px !important;
    min-height: 88px !important;
    gap: 8px !important;
    padding: 8px !important;
  }

  .series-rail .series-card__visual,
  .series-rail .series-card__visual[data-system-type="sliding"] {
    width: 52px !important;
    height: 67px !important;
    border-radius: 11px !important;
  }

  .series-rail .series-card__copy strong {
    font-size: 11px !important;
  }

  .series-rail .series-card__copy em {
    min-height: 0 !important;
    display: block !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 8px !important;
  }

  .series-rail .series-card__eyebrow {
    font-size: 6.5px !important;
  }

  .series-rail .series-card__score b {
    font-size: 19px !important;
  }

  .series-rail .series-card__facts,
  .series-rail .series-card__foot > span,
  .series-rail .series-card__open,
  .series-rail .series-source {
    display: none !important;
  }

  .series-rail .series-card__foot {
    min-height: 0 !important;
    padding: 0 6px 0 0 !important;
    background: transparent !important;
    border: 0 !important;
  }

  .series-rail .series-card__compare {
    width: 36px;
    min-width: 36px;
    min-height: 36px;
    padding: 0 !important;
  }

  .series-rail .series-card__compare span {
    display: none;
  }

  .series-dashboard__footer {
    display: grid;
    gap: 8px;
    margin-top: 9px;
    padding: 12px;
  }

  .series-compare-shelf {
    bottom: 76px;
  }

  .advisor-section {
    padding: 46px 0 54px;
  }

  .advisor-mode-bar {
    display: grid;
    gap: 9px;
    padding: 10px;
  }

  .advisor-mode-switch {
    width: 100%;
  }

  .advisor-shell {
    overflow: visible;
    border-radius: 21px;
  }

  .advisor-progress {
    display: none !important;
  }

  .advisor-context-ribbon {
    position: sticky;
    z-index: 22;
    top: 60px;
    padding: 7px;
    background: rgba(250,252,254,.95);
    border: 1px solid rgba(92,108,130,.11);
    border-radius: 16px 16px 0 0;
    box-shadow: 0 10px 28px rgba(20,31,48,.08);
    backdrop-filter: blur(18px);
  }

  .advisor-context-ribbon > button,
  .advisor-autosave {
    flex-basis: 128px;
    min-height: 45px;
  }

  .advisor-layout {
    padding: 7px;
  }

  .advisor-main {
    padding: 7px;
    border-radius: 17px;
  }

  .engineer-message {
    min-height: 0;
    padding: 10px;
    border-radius: 15px;
  }

  .question-step {
    padding: 13px;
  }

  .advisor-live {
    display: none;
  }

  .advisor-controls {
    z-index: 35;
    bottom: max(7px, env(safe-area-inset-bottom));
  }

  .back-to-top {
    display: none !important;
  }

  .results {
    scroll-margin-top: 70px;
    padding-top: 17px;
  }

  .results-toolbar {
    gap: 12px;
    padding: 15px;
  }

  .results-toolbar h2 {
    max-width: 340px;
    font-size: clamp(32px, 9.8vw, 39px);
    line-height: .92;
  }

  .results-actions {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
    overflow: visible;
  }

  .results-actions button {
    min-width: 0;
    min-height: 50px;
    display: grid;
    place-items: center;
    gap: 3px;
    padding: 6px 3px;
    font-size: 7px;
    text-align: center;
    white-space: normal;
  }

  .result-section-nav {
    top: 60px;
  }

  .recommendation-hero {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    min-height: 0;
    padding: 14px;
    border-radius: 22px;
  }

  .recommendation-hero__content {
    order: 1;
    padding: 0;
  }

  .recommendation-family {
    margin-top: 15px;
  }

  .recommendation-hero__content h3 {
    max-width: 330px;
    margin-block: 4px 9px;
    color: #111720;
    font-size: clamp(40px, 11.6vw, 50px);
    line-height: .91;
  }

  .recommendation-hero__content > p {
    color: #657185;
    font-size: 13px;
  }

  .reason-chips {
    margin-block: 12px 14px;
  }

  .reason-chips span {
    color: #293341;
    background: #fff;
  }

  .recommendation-actions {
    grid-template-columns: 1fr;
    gap: 7px;
  }

  .recommendation-actions .button--ghost,
  .recommendation-actions .button--ghost span {
    width: 100% !important;
    display: inline-flex !important;
  }

  .recommendation-profile-v4 {
    order: 2;
    min-height: 245px;
    border-radius: 18px;
  }

  .recommendation-profile-render {
    bottom: -23%;
    height: 127%;
  }

  .energy-score-card,
  .recommendation-hero .energy-score-card {
    order: 3;
    min-height: 0;
    margin: 0;
    padding: 14px;
    border-radius: 18px;
  }

  .score-comparison {
    max-width: 310px;
    margin-inline: auto;
  }

  .score-card-highlights {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .score-card-highlights > span {
    min-height: 62px;
  }

  .decision-summary {
    margin-top: 10px;
  }

  .metric-grid {
    gap: 8px;
  }

  .metric-grid article {
    min-height: 142px;
    padding: 14px;
  }

  .toast-region {
    bottom: 76px;
  }
}

@media (max-width: 420px) {
  .hero h1 {
    font-size: clamp(38px, 11.2vw, 45px);
  }

  .hero__trust {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .hero__trust span:last-child {
    grid-column: 1 / -1 !important;
  }

  .series-feature__metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .question-head h3 {
    font-size: 24px;
  }

  .results-actions button span {
    font-size: 7px;
  }

  .recommendation-hero__content h3 {
    font-size: clamp(38px, 11vw, 46px);
  }

  .metric-grid {
    grid-template-columns: 1fr;
  }
}

/* Final contrast and first-viewport refinements after screenshot review. */
@media (min-width: 761px) {
  html {
    scroll-padding-top: 76px;
  }
}

.series-heading__stat {
  color: #fff;
  background:
    radial-gradient(circle at 82% 14%, rgba(255,255,255,.22), transparent 34%),
    linear-gradient(145deg, #f42b38, #cb101d 80%);
  border-color: rgba(255,255,255,.28);
  box-shadow: 0 18px 42px rgba(210,21,30,.20), inset 0 1px 0 rgba(255,255,255,.20);
}

.series-heading__stat strong,
.series-heading__stat span {
  color: #fff;
}

.series-heading__stat small {
  color: rgba(255,255,255,.72);
}

/* The live score is printed on a light card even though the surrounding
   advisor preview is dark. Do not inherit white text into the gauge. */
.advisor-live .score-orbit strong {
  color: #111823 !important;
}

.advisor-live .score-orbit small {
  color: #768194 !important;
}

.advisor-live .live-score > div:last-child b {
  color: var(--v7-red) !important;
}

.advisor-live .live-score > div:last-child p {
  color: #7a8596 !important;
}

.hero-demo-short {
  display: none;
}

@media (max-width: 760px) {
  .hero-demo-long {
    display: none !important;
  }

  .hero-demo-short {
    display: inline !important;
  }

  .hero__actions .button--ghost .icon {
    width: 14px;
    height: 14px;
  }

  /* The question itself must enter the first mobile viewport. */
  .advisor-section {
    padding-top: 34px;
  }

  .advisor-heading {
    margin-bottom: 8px;
  }

  .advisor-heading > p {
    display: none;
  }

  .advisor-heading h2 {
    margin-block: 8px 2px;
    font-size: clamp(32px, 8.8vw, 37px);
    line-height: .98;
  }

  .advisor-mode-bar {
    grid-template-columns: minmax(0, 1fr) minmax(170px, .9fr);
    align-items: center;
    gap: 8px;
    padding: 8px;
  }

  .advisor-mode-copy {
    gap: 7px;
  }

  .advisor-mode-copy > span {
    width: 34px;
    height: 34px;
  }

  .advisor-mode-copy b {
    font-size: 10px;
    line-height: 1.25;
  }

  .advisor-mode-switch button {
    min-height: 39px;
    padding-inline: 7px;
  }
}

@media (max-width: 420px) {
  .hero__trust {
    display: flex !important;
    grid-template-columns: none !important;
    gap: 7px;
    margin-inline: -10px;
    padding-inline: 10px;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }

  .hero__trust::-webkit-scrollbar {
    display: none;
  }

  .hero__trust span,
  .hero__trust span:last-child {
    grid-column: auto !important;
    flex: 0 0 auto;
    min-height: 31px;
    scroll-snap-align: start;
  }

  .advisor-mode-bar {
    grid-template-columns: minmax(0, 1fr) 168px;
  }
}

/* Final browser-pass fixes: readable catalog summary and compact phone controls. */
.series-heading__stat,
.series-heading__stat small,
.series-heading__stat span,
.series-heading__stat b {
  color: #19212c;
}

.series-heading__stat small {
  opacity: .66;
}

.series-heading__stat strong {
  color: var(--v7-red);
}

.series-heading__compare {
  color: #222b38;
  background: rgba(255,255,255,.72);
}

.series-dashboard__feature {
  min-height: 582px;
}

.series-profile-hero {
  min-height: 235px;
}

@media (max-width: 760px) {
  .hero-mobile-glance {
    overflow: hidden;
  }

  .hero-mobile-glance__scene {
    width: 48%;
  }

  .hero-mobile-glance__score {
    left: 48%;
    right: 0;
    width: auto;
    min-width: 0;
    overflow: hidden;
  }

  .hero-mobile-glance__score small {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .hero-mobile-glance__score strong b {
    font-size: 36px;
  }

  .hero-mobile-glance__score p {
    display: flex;
    flex-wrap: wrap;
  }

  .hero-mobile-glance__score p span {
    flex: 0 0 auto;
  }

  .hero__actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .hero__actions .button,
  .hero__actions .button--ghost {
    width: 100% !important;
  }

  .series-heading {
    padding: 16px;
  }

  .series-heading h2 {
    font-size: 33px;
  }

  .series-heading p {
    font-size: 12px;
    line-height: 1.48;
  }

  .series-heading__tools {
    margin-top: 12px;
  }

  .series-dashboard__feature {
    min-height: 0;
  }

  .series-profile-hero {
    min-height: 176px;
  }

  .series-feature__metrics {
    gap: 5px;
  }

  .series-feature__metrics span {
    min-height: 46px;
    padding: 7px 6px;
  }

  .series-feature__metrics span b {
    font-size: 10px;
  }

  .series-feature-score {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 92px;
    align-items: center;
    gap: 7px;
    min-height: 47px;
    padding: 8px 10px;
  }

  .series-feature-score > p {
    display: none;
  }

  .series-feature-score > i {
    margin: 0;
  }

  .series-feature__actions .button {
    min-height: 44px;
  }

  .series-controls__primary {
    display: grid;
    grid-template-columns: 1fr;
  }

  .series-filters {
    display: flex;
    gap: 5px;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: none;
  }

  .series-filters::-webkit-scrollbar {
    display: none;
  }

  .series-filters button {
    flex: 0 0 auto;
  }

  .series-controls__secondary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 6px;
  }

  .series-controls__hint {
    display: none;
  }

  .series-sort,
  .series-view-switch {
    width: 100%;
    min-width: 0;
  }

  .series-sort select {
    min-width: 0;
  }

  .series-compare-inline[disabled],
  .series-compare-inline[aria-disabled="true"] {
    display: none;
  }

  .series-compare-inline:not([disabled]) {
    grid-column: 1 / -1;
  }
}

/* ========================================================================== 
   v0.7.0 release cascade lock
   These are the final browser-verified rules and intentionally sit last.
   ========================================================================== */

@media (min-width: 1101px) {
  .series-heading__tools {
    grid-template-columns: 200px minmax(0, 1fr) !important;
  }
}

.series-heading__stat {
  color: #fff !important;
  background:
    radial-gradient(circle at 82% 14%, rgba(255,255,255,.22), transparent 34%),
    linear-gradient(145deg, #f42b38, #cb101d 80%) !important;
  border-color: rgba(255,255,255,.28) !important;
  box-shadow: 0 18px 42px rgba(210,21,30,.20), inset 0 1px 0 rgba(255,255,255,.20) !important;
}

.series-heading__stat strong,
.series-heading__stat span,
.series-heading__stat b {
  color: #fff !important;
}

.series-heading__stat small {
  color: rgba(255,255,255,.74) !important;
  opacity: 1 !important;
}

.advisor-live .score-orbit strong {
  color: #111823 !important;
}

.advisor-live .score-orbit small {
  color: #768194 !important;
}

.advisor-live .live-score > div:last-child b {
  color: var(--v7-red) !important;
}

.advisor-live .live-score > div:last-child p {
  color: #7a8596 !important;
}

@media (max-width: 760px) {
  .hero__actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 96px !important;
    gap: 8px !important;
  }

  .hero__actions .button,
  .hero__actions .button--ghost {
    width: auto !important;
    min-width: 0 !important;
  }

  .hero__actions .button--ghost {
    padding-inline: 8px !important;
  }

  .hero-demo-long {
    display: none !important;
  }

  .hero-demo-short {
    display: inline !important;
  }

  .hero-mobile-glance__scene {
    width: 46% !important;
  }

  .hero-mobile-glance__score {
    left: 46% !important;
    right: 0 !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 15px 11px 12px 10px !important;
    overflow: hidden !important;
  }

  .hero-mobile-glance__score small {
    max-width: 100% !important;
    font-size: 6.5px !important;
    letter-spacing: .07em !important;
    white-space: normal !important;
  }

  .hero-mobile-glance__score > strong,
  .hero-mobile-glance__score strong b {
    font-size: 31px !important;
  }

  .hero-mobile-glance__score p {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
  }

  .hero-mobile-glance__score p span {
    flex: 0 0 auto !important;
    min-width: 0 !important;
  }

  .advisor-section {
    padding-top: 34px !important;
  }

  .advisor-heading > p {
    display: none !important;
  }

  .advisor-mode-bar {
    grid-template-columns: minmax(0, 1fr) minmax(168px, .9fr) !important;
  }

  .back-to-top {
    display: none !important;
  }
}

@media (max-width: 420px) {
  .hero__trust {
    display: flex !important;
    grid-template-columns: none !important;
    gap: 7px !important;
    margin-inline: -10px !important;
    padding-inline: 10px !important;
    overflow-x: auto !important;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }

  .hero__trust span,
  .hero__trust span:last-child {
    grid-column: auto !important;
    flex: 0 0 auto !important;
    min-height: 31px !important;
    scroll-snap-align: start;
  }
}

@media (max-width: 760px) {
  .hero-mobile-glance {
    grid-template-columns: 48% 52% !important;
  }

  .hero-mobile-glance__scene {
    width: auto !important;
  }

  .hero-mobile-glance__score {
    left: 0 !important;
    right: auto !important;
    width: auto !important;
  }

  .hero-mobile-glance__score > small {
    font-size: 6.5px;
    letter-spacing: .055em;
  }

  .hero-mobile-glance__score p span:nth-child(3) {
    display: none;
  }

  .hero-demo-short {
    display: none !important;
  }

  .hero-demo-long {
    display: inline !important;
  }
}

/* 0.7.0 immutable final phone CTA override — keep both actions readable. */
@media (max-width: 760px) {
  .hero__actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .hero__actions .button,
  .hero__actions .button--ghost {
    width: 100% !important;
    min-width: 0 !important;
    padding-inline: 16px !important;
  }

  .hero-demo-long {
    display: inline !important;
  }

  .hero-demo-short {
    display: none !important;
  }
}

/* Definitive mobile trust-row behavior. */
@media (max-width: 420px) {
  .hero__trust {
    flex-wrap: nowrap !important;
  }
}

/* v0.7.0 final mobile legibility pass: every trust statement is visible
   without requiring a hidden horizontal swipe. */
@media (max-width: 420px) {
  .hero__trust {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
    margin-inline: 0 !important;
    padding-inline: 0 !important;
    overflow: visible !important;
    scroll-snap-type: none !important;
  }

  .hero__trust span,
  .hero__trust span:last-child {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 31px !important;
    flex: initial !important;
    justify-content: center !important;
    white-space: normal !important;
    text-align: center !important;
    line-height: 1.15 !important;
  }

  .hero__trust span:last-child {
    grid-column: 1 / -1 !important;
  }
}

/* Mobile navigation audit: keep the global header and its menu trigger above
   the drawer. The drawer starts below the 60 px mobile header, so the same
   button can both open and close it without being intercepted by the panel. */
@media (max-width: 900px) {
  .site-header,
  .site-header.is-scrolled {
    z-index: 150 !important;
  }

  .mobile-menu {
    z-index: 140 !important;
    top: 60px !important;
    height: calc(100dvh - 60px) !important;
  }

  .mobile-menu__panel {
    height: 100% !important;
  }

  .mobile-menu__head {
    display: none !important;
  }
}

/* Large workspaces must never remain translucent while the observer evaluates
   a tall section. Smaller cards keep their own micro-animations. */
.series-dashboard.reveal,
.advisor-shell.reveal {
  opacity: 1 !important;
  transform: none !important;
}

/* When the mobile dock is intentionally hidden inside the advisor, remove it
   from hit testing and keyboard focus as well as from view. */
@media (max-width: 760px) {
  .mobile-bottom-nav {
    visibility: visible;
    transition:
      transform .28s var(--v7-ease),
      opacity .22s ease,
      visibility 0s linear 0s;
  }

  .mobile-bottom-nav.is-peek-hidden {
    visibility: hidden;
    transition:
      transform .28s var(--v7-ease),
      opacity .22s ease,
      visibility 0s linear .28s;
  }
}