/* Dukes Buying Guide — buyer's field guide, August 2026.
   Page-scoped by body class; the shared shell and every other route are untouched. */

.page--buyers-guide {
  --bgf-forest: #102a21;
  --bgf-forest-2: #193a2e;
  --bgf-ink: #17221d;
  --bgf-stone: #f3efe7;
  --bgf-paper: #fbf8f1;
  --bgf-parchment: #e6dcc9;
  --bgf-oxblood: #58383b;
  --bgf-oxblood-deep: #3f282b;
  --bgf-brass: #c8aa73;
  --bgf-brass-deep: #8c6b3f;
  --bgf-rule: rgb(23 34 29 / 20%);
  --bgf-rule-light: rgb(251 248 241 / 22%);
  --bgf-shell: min(92vw, 1480px);
  background: var(--bgf-stone);
  color: var(--bgf-ink);
}

.page--buyers-guide ::selection {
  background: var(--bgf-brass);
  color: var(--bgf-forest);
}

.page--buyers-guide :focus-visible {
  outline: 3px solid var(--bgf-brass);
  outline-offset: 4px;
}

.page--buyers-guide .main {
  overflow: clip;
}

.page--buyers-guide .crumbs {
  margin: 0;
  max-width: none;
  padding: 0.7rem 4vw;
  background: var(--bgf-forest);
  border-bottom: 1px solid rgb(251 248 241 / 16%);
}

.page--buyers-guide .crumbs__list {
  width: var(--bgf-shell);
  margin-inline: auto;
}

.page--buyers-guide .crumbs__link,
.page--buyers-guide .crumbs__current,
.page--buyers-guide .crumbs__item::after {
  color: rgb(251 248 241 / 72%);
}

.page--buyers-guide .bgf {
  min-width: 0;
  background: var(--bgf-stone);
}

.page--buyers-guide .bgf h1,
.page--buyers-guide .bgf h2,
.page--buyers-guide .bgf h3,
.page--buyers-guide .bgf-hero h1 {
  text-wrap: balance;
}

.page--buyers-guide .bgf a,
.page--buyers-guide .bgf button,
.page--buyers-guide .bgf-dock a,
.page--buyers-guide .bgf-dock button {
  text-underline-offset: 0.22em;
  text-decoration-thickness: 1px;
}

/* Full-width campaign opening */
.page--buyers-guide .bgf-hero {
  position: relative;
  min-height: clamp(700px, 77vh, 860px);
  isolation: isolate;
  display: grid;
  align-items: end;
  overflow: hidden;
  background: var(--bgf-forest);
  color: var(--bgf-paper);
}

.page--buyers-guide .bgf-hero__media,
.page--buyers-guide .bgf-hero__mount,
.page--buyers-guide .bgf-hero__mount .mount__scene {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
}

.page--buyers-guide .bgf-hero__mount .media-mount__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 57% 50%;
  animation: bgf-hero-arrive 700ms cubic-bezier(.16, 1, .3, 1) both;
}

.page--buyers-guide .bgf-hero__media figcaption {
  position: absolute;
  right: 2rem;
  bottom: 1.35rem;
  z-index: 4;
  max-width: 34rem;
  padding: 0.55rem 0.75rem;
  background: rgb(16 42 33 / 88%);
  color: rgb(251 248 241 / 82%);
  font-size: 0.67rem;
  line-height: 1.35;
}

.page--buyers-guide .bgf-hero__veil {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgb(10 31 23 / 98%) 0%, rgb(12 37 28 / 94%) 31%, rgb(12 37 28 / 73%) 48%, rgb(12 37 28 / 10%) 72%),
    linear-gradient(0deg, rgb(10 31 23 / 48%) 0%, transparent 38%);
  pointer-events: none;
}

.page--buyers-guide .bgf-hero__copy {
  position: relative;
  z-index: 2;
  width: min(42vw, 660px);
  margin-left: clamp(1.5rem, 6vw, 7rem);
  margin-bottom: clamp(11rem, 22vh, 14rem);
}

.page--buyers-guide .bgf-hero__copy h1 {
  margin: 0;
  color: var(--bgf-paper);
  font-family: Gloock, Georgia, serif;
  font-size: clamp(4.7rem, 8.2vw, 8.8rem);
  font-weight: 400;
  line-height: 0.78;
  letter-spacing: -0.035em;
}

.page--buyers-guide .bgf-hero__statement {
  margin: 2rem 0 0;
  color: var(--bgf-brass);
  font-family: Gloock, Georgia, serif;
  font-size: clamp(2rem, 3.2vw, 3.25rem);
  line-height: 1.02;
  letter-spacing: -0.025em;
}

.page--buyers-guide .bgf-hero__lead {
  max-width: 43ch;
  margin: 1.1rem 0 0;
  color: rgb(251 248 241 / 82%);
  font-size: clamp(1rem, 1.2vw, 1.2rem);
  line-height: 1.58;
}

.page--buyers-guide .bgf-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 1.35rem;
  margin-top: 1.8rem;
}

.page--buyers-guide .bgf-button {
  display: inline-flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  padding: 0.8rem 1.35rem;
  border: 1px solid transparent;
  border-radius: 6px;
  font: 650 0.95rem/1 Manrope, system-ui, sans-serif;
  text-decoration: none;
  transition: background-color 150ms ease, color 150ms ease, border-color 150ms ease;
}

.page--buyers-guide .bgf-button--light {
  background: var(--bgf-paper);
  color: var(--bgf-forest);
}

.page--buyers-guide .bgf-text-link {
  color: inherit;
  font-weight: 650;
  text-decoration: underline;
}

@media (hover: hover) and (pointer: fine) {
  .page--buyers-guide .bgf-button--light:hover {
    background: var(--bgf-brass);
  }

  .page--buyers-guide .bgf-text-link:hover {
    color: var(--bgf-brass);
  }
}

.page--buyers-guide .bgf-hero__promise {
  position: absolute;
  z-index: 2;
  bottom: 2.2rem;
  left: clamp(1.5rem, 6vw, 7rem);
  width: min(42vw, 660px);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  border-top: 1px solid rgb(251 248 241 / 34%);
}

.page--buyers-guide .bgf-hero__promise > div {
  min-width: 0;
  padding: 1rem 1rem 0 0;
}

.page--buyers-guide .bgf-hero__promise > div + div {
  padding-left: 1rem;
  border-left: 1px solid rgb(251 248 241 / 22%);
}

.page--buyers-guide .bgf-hero__promise dt {
  color: var(--bgf-brass);
  font-size: 0.7rem;
  font-weight: 750;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.page--buyers-guide .bgf-hero__promise dd {
  margin: 0.25rem 0 0;
  color: rgb(251 248 241 / 68%);
  font-size: 0.76rem;
}

@keyframes bgf-hero-arrive {
  from { opacity: 0.72; transform: scale(1.025); filter: saturate(.82); }
  to { opacity: 1; transform: scale(1); filter: saturate(1); }
}

/* Local route shelf */
.page--buyers-guide .bgf-dock {
  position: sticky;
  top: 0;
  z-index: 25;
  display: grid;
  grid-template-columns: minmax(16rem, 1.5fr) repeat(3, minmax(9rem, .75fr)) auto;
  min-height: 72px;
  align-items: stretch;
  background: rgb(251 248 241 / 97%);
  border-bottom: 1px solid var(--bgf-rule);
  box-shadow: 0 18px 36px -34px rgb(16 42 33 / 70%);
}

.page--buyers-guide .bgf-dock > * {
  min-width: 0;
  margin: 0;
  border: 0;
  border-left: 1px solid var(--bgf-rule);
  background: transparent;
  color: var(--bgf-ink);
}

.page--buyers-guide .bgf-dock p {
  display: grid;
  align-content: center;
  gap: 0.15rem;
  padding: 0.75rem 1.5rem 0.75rem 4vw;
  border-left: 0;
}

.page--buyers-guide .bgf-dock p strong {
  font-family: Gloock, Georgia, serif;
  font-size: 1.15rem;
  font-weight: 400;
}

.page--buyers-guide .bgf-dock p span {
  color: rgb(23 34 29 / 62%);
  font-size: 0.68rem;
}

.page--buyers-guide .bgf-dock a,
.page--buyers-guide .bgf-dock button {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.75rem 1rem;
  font: 700 0.78rem/1.2 Manrope, system-ui, sans-serif;
  text-decoration: none;
  cursor: pointer;
}

.page--buyers-guide .bgf-dock a span {
  color: var(--bgf-brass-deep);
  font-variant-numeric: tabular-nums;
}

.page--buyers-guide .bgf-dock a[aria-current="true"] {
  background: var(--bgf-forest);
  color: var(--bgf-paper);
}

.page--buyers-guide .bgf-dock button {
  justify-content: center;
  padding-inline: 1.25rem;
}

/* Route overview */
.page--buyers-guide .bgf-route {
  width: var(--bgf-shell);
  margin-inline: auto;
  padding-block: clamp(5rem, 9vw, 9rem);
  display: grid;
  grid-template-columns: minmax(18rem, .82fr) minmax(32rem, 1.18fr);
  gap: clamp(3rem, 7vw, 8rem);
  align-items: start;
}

.page--buyers-guide .bgf-route__copy h2 {
  max-width: 12ch;
  margin: 0;
  font-family: Gloock, Georgia, serif;
  font-size: clamp(3rem, 5.2vw, 6rem);
  font-weight: 400;
  line-height: 0.98;
  letter-spacing: -0.03em;
}

.page--buyers-guide .bgf-route__copy p {
  max-width: 46ch;
  margin: 1.6rem 0 0;
  color: rgb(23 34 29 / 72%);
  font-size: 1.05rem;
  line-height: 1.65;
}

.page--buyers-guide .bgf-route__list {
  border-top: 1px solid var(--bgf-rule);
}

.page--buyers-guide .bgf-route__list a {
  display: grid;
  grid-template-columns: 3rem minmax(0, 1fr) auto;
  gap: 1.2rem;
  align-items: center;
  min-height: 132px;
  padding: 1.4rem 0;
  border-bottom: 1px solid var(--bgf-rule);
  color: var(--bgf-ink);
  text-decoration: none;
}

.page--buyers-guide .bgf-route__number,
.page--buyers-guide .bgf-route__range {
  color: var(--bgf-brass-deep);
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-variant-numeric: tabular-nums;
}

.page--buyers-guide .bgf-route__list strong {
  display: block;
  font-family: Gloock, Georgia, serif;
  font-size: clamp(1.55rem, 2.4vw, 2.35rem);
  font-weight: 400;
  line-height: 1.05;
}

.page--buyers-guide .bgf-route__list small {
  display: block;
  max-width: 58ch;
  margin-top: 0.45rem;
  color: rgb(23 34 29 / 66%);
  font-size: 0.78rem;
  line-height: 1.45;
}

/* Three editorial chapters */
.page--buyers-guide .bgf-phase {
  --bgf-phase-ink: var(--bgf-ink);
  --bgf-phase-soft: rgb(23 34 29 / 68%);
  --bgf-phase-rule: var(--bgf-rule);
  background: var(--bgf-paper);
  color: var(--bgf-phase-ink);
  scroll-margin-top: 76px;
}

.page--buyers-guide .bgf-phase--2 {
  --bgf-phase-ink: var(--bgf-paper);
  --bgf-phase-soft: rgb(251 248 241 / 72%);
  --bgf-phase-rule: var(--bgf-rule-light);
  background: var(--bgf-oxblood);
}

.page--buyers-guide .bgf-phase--3 {
  --bgf-phase-ink: var(--bgf-paper);
  --bgf-phase-soft: rgb(251 248 241 / 70%);
  --bgf-phase-rule: var(--bgf-rule-light);
  background: var(--bgf-forest);
}

.page--buyers-guide .bgf-phase__head {
  min-height: clamp(560px, 57vw, 760px);
  display: grid;
  grid-template-columns: minmax(22rem, .8fr) minmax(36rem, 1.2fr);
  align-items: stretch;
}

.page--buyers-guide .bgf-phase--2 .bgf-phase__copy { order: 2; }
.page--buyers-guide .bgf-phase--2 .bgf-phase__visual { order: 1; }

.page--buyers-guide .bgf-phase__copy {
  display: grid;
  align-content: center;
  padding: clamp(4rem, 8vw, 8rem) clamp(2rem, 6vw, 7rem);
}

.page--buyers-guide .bgf-phase__chapter {
  margin: 0 0 1.15rem;
  color: var(--bgf-brass);
  font-size: 0.71rem;
  font-weight: 750;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.page--buyers-guide .bgf-phase__copy h2 {
  max-width: 12ch;
  margin: 0;
  color: var(--bgf-phase-ink);
  font-family: Gloock, Georgia, serif;
  font-size: clamp(3.1rem, 5.4vw, 6.3rem);
  font-weight: 400;
  line-height: 0.94;
  letter-spacing: -0.032em;
}

.page--buyers-guide .bgf-phase__copy > p:last-child {
  max-width: 48ch;
  margin: 1.6rem 0 0;
  color: var(--bgf-phase-soft);
  font-size: 1.03rem;
  line-height: 1.65;
}

.page--buyers-guide .bgf-phase__visual,
.page--buyers-guide .bgf-phase__mount,
.page--buyers-guide .bgf-phase__mount .mount__scene {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 560px;
  margin: 0;
}

.page--buyers-guide .bgf-phase__mount .media-mount__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.page--buyers-guide .bgf-phase--1 .bgf-phase__mount .media-mount__image { object-position: 51% 47%; }
.page--buyers-guide .bgf-phase--2 .bgf-phase__mount .media-mount__image { object-position: 52% 48%; }
.page--buyers-guide .bgf-phase--3 .bgf-phase__mount .media-mount__image { object-position: 50% 43%; }

.page--buyers-guide .bgf-phase__visual figcaption {
  position: absolute;
  right: 1.5rem;
  bottom: 1.5rem;
  padding: 0.5rem 0.65rem;
  background: rgb(16 42 33 / 86%);
  color: rgb(251 248 241 / 78%);
  font-size: 0.65rem;
}

/* Contextual deposit tool */
.page--buyers-guide .bgf-budget {
  position: relative;
  width: var(--bgf-shell);
  margin: clamp(3rem, 6vw, 6rem) auto;
  padding: clamp(2rem, 4vw, 3.5rem);
  display: grid;
  grid-template-columns: minmax(18rem, .9fr) minmax(24rem, 1.25fr) minmax(14rem, .72fr);
  gap: clamp(2rem, 4vw, 4.5rem);
  align-items: center;
  overflow: hidden;
  background: var(--bgf-forest);
  color: var(--bgf-paper);
}

.page--buyers-guide .bgf-budget__intro h3 {
  margin: 0;
  color: var(--bgf-paper);
  font-family: Gloock, Georgia, serif;
  font-size: clamp(2rem, 3.1vw, 3.3rem);
  font-weight: 400;
  line-height: 1;
}

.page--buyers-guide .bgf-budget__intro p {
  margin: 1rem 0;
  color: rgb(251 248 241 / 72%);
  font-size: 0.82rem;
  line-height: 1.5;
}

.page--buyers-guide .bgf-budget__intro a { color: var(--bgf-brass); font-weight: 700; }

.page--buyers-guide .bgf-budget__tool {
  display: grid;
  gap: 0.85rem;
}

.page--buyers-guide .bgf-budget__tool label {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  color: rgb(251 248 241 / 70%);
  font-size: 0.74rem;
  font-weight: 700;
}

.page--buyers-guide .bgf-budget__tool output {
  color: var(--bgf-paper);
  font-size: 0.9rem;
  font-variant-numeric: tabular-nums;
}

.page--buyers-guide .bgf-budget input[type="range"] {
  width: 100%;
  accent-color: var(--bgf-brass);
}

.page--buyers-guide .bgf-budget__figures {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin: 0;
}

.page--buyers-guide .bgf-budget__figures div {
  padding-top: 0.9rem;
  border-top: 1px solid rgb(251 248 241 / 25%);
}

.page--buyers-guide .bgf-budget__figures dt {
  color: rgb(251 248 241 / 62%);
  font-size: 0.68rem;
}

.page--buyers-guide .bgf-budget__figures dd {
  margin: 0.35rem 0 0;
  color: var(--bgf-brass);
  font-family: Gloock, Georgia, serif;
  font-size: clamp(1.35rem, 2.2vw, 2.15rem);
  font-variant-numeric: tabular-nums;
}

.page--buyers-guide .bgf-budget__line {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 4px;
  background: rgb(251 248 241 / 14%);
}

.page--buyers-guide .bgf-budget__line i {
  display: block;
  width: calc(var(--deposit-scale, .15) * 100%);
  height: 100%;
  background: var(--bgf-brass);
}

/* Concise decision disclosures */
.page--buyers-guide .bgf-phase__decisions {
  width: var(--bgf-shell);
  margin-inline: auto;
  padding-bottom: clamp(5rem, 8vw, 8rem);
  border-top: 1px solid var(--bgf-phase-rule);
}

.page--buyers-guide .bgf-decision {
  scroll-margin-top: 84px;
  border-bottom: 1px solid var(--bgf-phase-rule);
  color: var(--bgf-phase-ink);
}

.page--buyers-guide .bgf-decision > summary {
  display: grid;
  grid-template-columns: 4rem minmax(0, 1fr) minmax(9rem, auto);
  gap: clamp(1rem, 2.4vw, 2.25rem);
  align-items: center;
  min-height: 148px;
  padding: 1.35rem 0;
  list-style: none;
  cursor: pointer;
}

.page--buyers-guide .bgf-decision > summary::-webkit-details-marker { display: none; }

.page--buyers-guide .bgf-decision__number {
  color: var(--bgf-brass);
  font-size: 0.78rem;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
}

.page--buyers-guide .bgf-decision__heading strong {
  display: block;
  color: var(--bgf-phase-ink);
  font-family: Gloock, Georgia, serif;
  font-size: clamp(1.55rem, 2.5vw, 2.55rem);
  font-weight: 400;
  line-height: 1.08;
}

.page--buyers-guide .bgf-decision__heading small {
  display: block;
  max-width: 64ch;
  margin-top: 0.5rem;
  color: var(--bgf-phase-soft);
  font-size: 0.79rem;
  line-height: 1.45;
}

.page--buyers-guide .bgf-decision__action {
  justify-self: end;
  color: var(--bgf-brass);
  font-size: 0.72rem;
  font-weight: 750;
  text-decoration: underline;
  text-underline-offset: 0.25em;
}

.page--buyers-guide .bgf-decision__action span:last-child,
.page--buyers-guide .bgf-decision[open] .bgf-decision__action span:first-child { display: none; }
.page--buyers-guide .bgf-decision[open] .bgf-decision__action span:last-child { display: inline; }

.page--buyers-guide .bgf-decision[open] > summary {
  border-bottom: 1px solid var(--bgf-phase-rule);
}

.page--buyers-guide .bgf-decision__body {
  display: grid;
  grid-template-columns: minmax(18rem, .78fr) minmax(28rem, 1.22fr);
  gap: clamp(2rem, 5vw, 5rem);
  padding: clamp(2rem, 4vw, 4rem) 0 clamp(3rem, 5vw, 5rem) 4rem;
}

.page--buyers-guide .bgf-decision__move h3 {
  margin: 0 0 1rem;
  color: var(--bgf-brass);
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.page--buyers-guide .bgf-decision__move ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.page--buyers-guide .bgf-decision__move li {
  position: relative;
  padding: 0.75rem 0 0.75rem 1.55rem;
  border-top: 1px solid var(--bgf-phase-rule);
  color: var(--bgf-phase-ink);
  font-size: 0.88rem;
  line-height: 1.45;
}

.page--buyers-guide .bgf-decision__move li::before {
  content: "";
  position: absolute;
  top: 1.07rem;
  left: 0;
  width: 8px;
  height: 8px;
  border: 1px solid var(--bgf-brass);
  transform: rotate(45deg);
}

.page--buyers-guide .bgf-handoff {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--bgf-phase-rule);
  border-left: 1px solid var(--bgf-phase-rule);
}

.page--buyers-guide .bgf-handoff > div {
  min-width: 0;
  padding: 1rem;
  border-right: 1px solid var(--bgf-phase-rule);
  border-bottom: 1px solid var(--bgf-phase-rule);
}

.page--buyers-guide .bgf-handoff dt {
  color: var(--bgf-brass);
  font-size: 0.65rem;
  font-weight: 750;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.page--buyers-guide .bgf-handoff dd {
  margin: 0.45rem 0 0;
  color: var(--bgf-phase-ink);
  font-size: 0.82rem;
  line-height: 1.45;
}

.page--buyers-guide .bgf-decision__distinction {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(12rem, auto) auto minmax(12rem, auto) 1fr;
  align-items: center;
  gap: 0.8rem 1rem;
  margin: 0;
  padding: 1.25rem;
  background: var(--bgf-brass);
  color: var(--bgf-forest);
}

.page--buyers-guide .bgf-decision__distinction strong {
  font-family: Gloock, Georgia, serif;
  font-size: 1.15rem;
  font-weight: 400;
}

.page--buyers-guide .bgf-decision__distinction span {
  font-size: 0.68rem;
  font-weight: 750;
  text-transform: uppercase;
}

.page--buyers-guide .bgf-decision__distinction small {
  line-height: 1.45;
}

.page--buyers-guide .bgf-decision__checks {
  grid-column: 1 / -1;
  padding-top: 1.25rem;
  border-top: 1px solid var(--bgf-phase-rule);
}

.page--buyers-guide .bgf-decision__checks > p {
  max-width: 75ch;
  margin: 0 0 2rem;
  color: var(--bgf-phase-soft);
  line-height: 1.65;
}

.page--buyers-guide .bgf-decision__checks > dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 2.25rem;
  margin: 0;
}

.page--buyers-guide .bgf-decision__checks > dl > div {
  padding: 1rem 0;
  border-top: 1px solid var(--bgf-phase-rule);
}

.page--buyers-guide .bgf-decision__checks dt {
  color: var(--bgf-phase-ink);
  font-weight: 750;
}

.page--buyers-guide .bgf-decision__checks dd {
  margin: 0.4rem 0 0;
  color: var(--bgf-phase-soft);
  font-size: 0.82rem;
  line-height: 1.55;
}

.page--buyers-guide .bgf-decision__link { grid-column: 1 / -1; margin: 0; }
.page--buyers-guide .bgf-decision__link a { color: var(--bgf-brass); font-weight: 750; }

/* Important differences — one ruled field, not cards */
.page--buyers-guide .bgf-distinctions {
  padding: clamp(5rem, 8vw, 9rem) 4vw;
  background: var(--bgf-parchment);
}

.page--buyers-guide .bgf-distinctions > h2,
.page--buyers-guide .bgf-distinctions > div {
  width: var(--bgf-shell);
  margin-inline: auto;
}

.page--buyers-guide .bgf-distinctions > h2 {
  max-width: 13ch;
  margin-top: 0;
  margin-bottom: clamp(3rem, 5vw, 5rem);
  font-family: Gloock, Georgia, serif;
  font-size: clamp(3rem, 5vw, 5.8rem);
  font-weight: 400;
  line-height: 0.98;
  letter-spacing: -0.03em;
}

.page--buyers-guide .bgf-distinctions > div { border-top: 1px solid rgb(23 34 29 / 28%); }

.page--buyers-guide .bgf-distinctions p {
  display: grid;
  grid-template-columns: minmax(13rem, .85fr) auto minmax(13rem, .85fr) 1.4fr auto;
  gap: 1.2rem;
  align-items: center;
  min-height: 132px;
  margin: 0;
  padding: 1.2rem 0;
  border-bottom: 1px solid rgb(23 34 29 / 28%);
}

.page--buyers-guide .bgf-distinctions strong {
  font-family: Gloock, Georgia, serif;
  font-size: clamp(1.35rem, 2vw, 2.1rem);
  font-weight: 400;
  line-height: 1.06;
}

.page--buyers-guide .bgf-distinctions p > span {
  color: var(--bgf-oxblood);
  font-size: 0.68rem;
  font-weight: 800;
  text-transform: uppercase;
}

.page--buyers-guide .bgf-distinctions small {
  color: rgb(23 34 29 / 66%);
  line-height: 1.5;
}

.page--buyers-guide .bgf-distinctions a {
  color: var(--bgf-oxblood);
  font-size: 0.72rem;
  font-weight: 800;
  white-space: nowrap;
}

/* Quick answers */
.page--buyers-guide .bgf-answers {
  width: var(--bgf-shell);
  margin-inline: auto;
  padding-block: clamp(5rem, 9vw, 9rem);
  display: grid;
  grid-template-columns: minmax(18rem, .7fr) minmax(34rem, 1.3fr);
  gap: clamp(3rem, 7vw, 8rem);
}

.page--buyers-guide .bgf-answers__head h2 {
  max-width: 10ch;
  margin: 0;
  font-family: Gloock, Georgia, serif;
  font-size: clamp(3rem, 5vw, 5.5rem);
  font-weight: 400;
  line-height: 0.98;
  letter-spacing: -0.03em;
}

.page--buyers-guide .bgf-answers__head p {
  max-width: 38ch;
  margin: 1.5rem 0 0;
  color: rgb(23 34 29 / 68%);
  line-height: 1.6;
}

.page--buyers-guide .bgf-answers__list { border-top: 1px solid var(--bgf-rule); }
.page--buyers-guide .bgf-answer { border-bottom: 1px solid var(--bgf-rule); }

.page--buyers-guide .bgf-answer > summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1.5rem;
  align-items: center;
  min-height: 128px;
  padding: 1.25rem 0;
  list-style: none;
  cursor: pointer;
}

.page--buyers-guide .bgf-answer > summary::-webkit-details-marker { display: none; }
.page--buyers-guide .bgf-answer summary strong { display: block; font-size: 1.1rem; line-height: 1.25; }
.page--buyers-guide .bgf-answer summary small { display: block; margin-top: .45rem; color: rgb(23 34 29 / 62%); line-height: 1.45; }
.page--buyers-guide .bgf-answer summary > span:last-child { color: var(--bgf-oxblood); font-size: .72rem; font-weight: 800; text-decoration: underline; }
.page--buyers-guide .bgf-answer summary > span:last-child span:last-child,
.page--buyers-guide .bgf-answer[open] summary > span:last-child span:first-child { display: none; }
.page--buyers-guide .bgf-answer[open] summary > span:last-child span:last-child { display: inline; }

.page--buyers-guide .bgf-answer > div {
  max-width: 65ch;
  padding: 0 0 2rem;
  color: rgb(23 34 29 / 74%);
  line-height: 1.62;
}

.page--buyers-guide .bgf-answer > div p { margin: 0 0 .75rem; }
.page--buyers-guide .bgf-answer > div a { color: var(--bgf-oxblood); font-weight: 750; }

/* Human hand-off */
.page--buyers-guide .bgf-handover {
  min-height: 650px;
  display: grid;
  grid-template-columns: minmax(32rem, 1.12fr) minmax(28rem, .88fr);
  background: var(--bgf-forest);
  color: var(--bgf-paper);
}

.page--buyers-guide .bgf-handover > figure,
.page--buyers-guide .bgf-handover__mount,
.page--buyers-guide .bgf-handover__mount .mount__scene {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 650px;
  margin: 0;
}

.page--buyers-guide .bgf-handover__mount .media-mount__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.page--buyers-guide .bgf-handover figcaption {
  position: absolute;
  bottom: 1.25rem;
  left: 1.25rem;
  padding: .5rem .65rem;
  background: rgb(16 42 33 / 86%);
  color: rgb(251 248 241 / 76%);
  font-size: .65rem;
}

.page--buyers-guide .bgf-handover > div {
  display: grid;
  align-content: center;
  padding: clamp(4rem, 7vw, 8rem);
}

.page--buyers-guide .bgf-handover h2 {
  max-width: 10ch;
  margin: 0;
  color: var(--bgf-paper);
  font-family: Gloock, Georgia, serif;
  font-size: clamp(3.4rem, 5vw, 6rem);
  font-weight: 400;
  line-height: .95;
  letter-spacing: -.03em;
}

.page--buyers-guide .bgf-handover > div > p:not(.bgf-handover__actions) {
  max-width: 48ch;
  margin: 1.4rem 0 0;
  color: rgb(251 248 241 / 76%);
  line-height: 1.6;
}

.page--buyers-guide .bgf-handover__boundary {
  padding-top: 1.2rem;
  border-top: 1px solid var(--bgf-rule-light);
  color: var(--bgf-brass) !important;
  font-size: .84rem;
}

.page--buyers-guide .bgf-handover__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 1.3rem;
  align-items: center;
  margin: 2rem 0 0;
}

.page--buyers-guide .bgf-handover__actions button {
  min-height: 44px;
  border: 0;
  background: transparent;
  color: var(--bgf-paper);
  font: 700 .85rem/1 Manrope, sans-serif;
  text-decoration: underline;
  cursor: pointer;
}

/* Notes and sources */
.page--buyers-guide .bgf-notes {
  width: var(--bgf-shell);
  margin-inline: auto;
  padding-block: clamp(3rem, 5vw, 5rem);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(3rem, 8vw, 9rem);
}

.page--buyers-guide .bgf-notes h2 {
  margin: 0 0 1rem;
  font-family: Gloock, Georgia, serif;
  font-size: 1.6rem;
  font-weight: 400;
}

.page--buyers-guide .bgf-notes p {
  max-width: 62ch;
  margin: 0;
  color: rgb(23 34 29 / 66%);
  font-size: .78rem;
  line-height: 1.6;
}

.page--buyers-guide .bgf-notes p + p { margin-top: .75rem; }
.page--buyers-guide .bgf-notes ul { margin: 0; padding: 0; list-style: none; columns: 2; column-gap: 2rem; }
.page--buyers-guide .bgf-notes li { break-inside: avoid; padding: .35rem 0; }
.page--buyers-guide .bgf-notes a { color: var(--bgf-oxblood); font-size: .76rem; font-weight: 700; }

/* Responsive translation */
@media (max-width: 72rem) {
  .page--buyers-guide .bgf-hero__copy,
  .page--buyers-guide .bgf-hero__promise { width: min(48vw, 600px); }
  .page--buyers-guide .bgf-dock { grid-template-columns: minmax(13rem, 1fr) repeat(3, minmax(7.5rem, .75fr)); }
  .page--buyers-guide .bgf-dock button { display: none; }
  .page--buyers-guide .bgf-route { grid-template-columns: minmax(18rem, .75fr) minmax(28rem, 1.25fr); }
  .page--buyers-guide .bgf-phase__head { grid-template-columns: minmax(20rem, .88fr) minmax(30rem, 1.12fr); }
  .page--buyers-guide .bgf-budget { grid-template-columns: minmax(16rem, .8fr) minmax(22rem, 1.2fr); }
  .page--buyers-guide .bgf-budget__figures { grid-column: 1 / -1; }
  .page--buyers-guide .bgf-decision__body { grid-template-columns: minmax(16rem, .72fr) minmax(24rem, 1.28fr); }
  .page--buyers-guide .bgf-distinctions p { grid-template-columns: minmax(11rem, .8fr) auto minmax(11rem, .8fr) 1.4fr; }
  .page--buyers-guide .bgf-distinctions a { grid-column: 4; }
}

@media (max-width: 58rem) {
  .page--buyers-guide .bgf-hero {
    min-height: 0;
    display: grid;
    grid-template-areas: "copy" "media" "promise";
    align-items: stretch;
  }

  .page--buyers-guide .bgf-hero__veil { display: none; }

  .page--buyers-guide .bgf-hero__copy {
    grid-area: copy;
    width: auto;
    margin: 0;
    padding: clamp(3.5rem, 9vw, 6rem) 5vw;
    background: var(--bgf-forest);
  }

  .page--buyers-guide .bgf-hero__copy h1 { font-size: clamp(4rem, 14vw, 7rem); }

  .page--buyers-guide .bgf-hero__media,
  .page--buyers-guide .bgf-hero__mount,
  .page--buyers-guide .bgf-hero__mount .mount__scene {
    grid-area: media;
    position: relative;
    min-height: 58vw;
  }

  .page--buyers-guide .bgf-hero__mount .media-mount__image { min-height: 58vw; object-position: 57% 50%; }
  .page--buyers-guide .bgf-hero__media figcaption { right: 1rem; bottom: 1rem; left: 1rem; max-width: none; }

  .page--buyers-guide .bgf-hero__promise {
    grid-area: promise;
    position: static;
    width: auto;
    padding: 1.2rem 5vw 1.5rem;
    background: var(--bgf-forest);
    border-top-color: rgb(251 248 241 / 25%);
  }

  .page--buyers-guide .bgf-dock {
    position: static;
    display: flex;
    min-height: 60px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
  }

  .page--buyers-guide .bgf-dock::-webkit-scrollbar { display: none; }

  .page--buyers-guide .bgf-dock p { display: none; }
  .page--buyers-guide .bgf-dock a { flex: 0 0 auto; min-width: 10rem; }

  .page--buyers-guide .bgf-route,
  .page--buyers-guide .bgf-answers {
    grid-template-columns: 1fr;
  }

  .page--buyers-guide .bgf-route { gap: 3rem; }
  .page--buyers-guide .bgf-route__copy h2 { max-width: 14ch; }

  .page--buyers-guide .bgf-phase__head {
    min-height: 0;
    grid-template-columns: 1fr;
  }

  .page--buyers-guide .bgf-phase--2 .bgf-phase__copy { order: 1; }
  .page--buyers-guide .bgf-phase--2 .bgf-phase__visual { order: 2; }
  .page--buyers-guide .bgf-phase__copy { padding: clamp(4rem, 10vw, 6rem) 5vw; }
  .page--buyers-guide .bgf-phase__copy h2 { max-width: 13ch; }

  .page--buyers-guide .bgf-phase__visual,
  .page--buyers-guide .bgf-phase__mount,
  .page--buyers-guide .bgf-phase__mount .mount__scene,
  .page--buyers-guide .bgf-phase__mount .media-mount__image {
    min-height: 62vw;
    max-height: 640px;
  }

  .page--buyers-guide .bgf-budget,
  .page--buyers-guide .bgf-decision__body,
  .page--buyers-guide .bgf-handover,
  .page--buyers-guide .bgf-notes {
    grid-template-columns: 1fr;
  }

  .page--buyers-guide .bgf-budget { gap: 2rem; }
  .page--buyers-guide .bgf-budget__figures { grid-column: auto; }

  .page--buyers-guide .bgf-decision > summary {
    grid-template-columns: 3rem minmax(0, 1fr);
  }

  .page--buyers-guide .bgf-decision__action {
    grid-column: 2;
    justify-self: start;
  }

  .page--buyers-guide .bgf-decision__body { padding-left: 3rem; }
  .page--buyers-guide .bgf-decision__distinction { grid-template-columns: 1fr auto 1fr; }
  .page--buyers-guide .bgf-decision__distinction small { grid-column: 1 / -1; }

  .page--buyers-guide .bgf-distinctions p {
    grid-template-columns: 1fr auto 1fr;
    gap: .8rem 1rem;
  }

  .page--buyers-guide .bgf-distinctions small,
  .page--buyers-guide .bgf-distinctions a { grid-column: 1 / -1; }

  .page--buyers-guide .bgf-handover > figure,
  .page--buyers-guide .bgf-handover__mount,
  .page--buyers-guide .bgf-handover__mount .mount__scene,
  .page--buyers-guide .bgf-handover__mount .media-mount__image { min-height: 60vw; max-height: 620px; }

  .page--buyers-guide .bgf-handover > div { padding: clamp(4rem, 10vw, 6rem) 5vw; }
}

@media (max-width: 40rem) {
  .page--buyers-guide .bgf-hero__copy { padding-inline: 1.25rem; }
  .page--buyers-guide .bgf-hero__copy h1 { font-size: clamp(3.8rem, 21vw, 6rem); }
  .page--buyers-guide .bgf-hero__statement { font-size: 1.85rem; }
  .page--buyers-guide .bgf-hero__actions { align-items: stretch; flex-direction: column; }
  .page--buyers-guide .bgf-button { width: 100%; }
  .page--buyers-guide .bgf-hero__promise { padding-inline: 1.25rem; grid-template-columns: 1fr; }
  .page--buyers-guide .bgf-hero__promise > div { display: flex; justify-content: space-between; gap: 1rem; padding: .75rem 0; }
  .page--buyers-guide .bgf-hero__promise > div + div { padding-left: 0; border-left: 0; border-top: 1px solid rgb(251 248 241 / 18%); }
  .page--buyers-guide .bgf-hero__promise dd { margin: 0; }

  .page--buyers-guide .bgf-route,
  .page--buyers-guide .bgf-phase__decisions,
  .page--buyers-guide .bgf-budget,
  .page--buyers-guide .bgf-answers,
  .page--buyers-guide .bgf-notes { width: min(100% - 2.5rem, 1480px); }

  .page--buyers-guide .bgf-route__list a { grid-template-columns: 2.25rem minmax(0, 1fr); min-height: 116px; }
  .page--buyers-guide .bgf-route__range { grid-column: 2; }
  .page--buyers-guide .bgf-phase__copy { padding-inline: 1.25rem; }
  .page--buyers-guide .bgf-phase__copy h2 { font-size: clamp(2.8rem, 14vw, 4.4rem); }
  .page--buyers-guide .bgf-budget { margin-block: 1.25rem 3.5rem; padding: 1.5rem; }
  .page--buyers-guide .bgf-budget__figures { grid-template-columns: 1fr; }

  .page--buyers-guide .bgf-decision > summary { grid-template-columns: 2rem minmax(0, 1fr); min-height: 130px; gap: .75rem; }
  .page--buyers-guide .bgf-decision__heading strong { font-size: 1.55rem; }
  .page--buyers-guide .bgf-decision__body { padding: 1.5rem 0 2.5rem 2rem; gap: 2rem; }
  .page--buyers-guide .bgf-handoff,
  .page--buyers-guide .bgf-decision__checks > dl { grid-template-columns: 1fr; }
  .page--buyers-guide .bgf-decision__distinction { grid-template-columns: 1fr; }
  .page--buyers-guide .bgf-decision__distinction span { padding-block: .15rem; }

  .page--buyers-guide .bgf-distinctions { padding-inline: 1.25rem; }
  .page--buyers-guide .bgf-distinctions > h2,
  .page--buyers-guide .bgf-distinctions > div { width: 100%; }
  .page--buyers-guide .bgf-distinctions > h2 { font-size: clamp(2.8rem, 13vw, 4.4rem); }
  .page--buyers-guide .bgf-distinctions p { grid-template-columns: 1fr; align-items: start; padding-block: 1.5rem; }
  .page--buyers-guide .bgf-answers { gap: 2.5rem; }
  .page--buyers-guide .bgf-answer > summary { min-height: 116px; grid-template-columns: 1fr; gap: .8rem; }
  .page--buyers-guide .bgf-answer summary > span:last-child { justify-self: start; }
  .page--buyers-guide .bgf-handover > div { padding-inline: 1.25rem; }
  .page--buyers-guide .bgf-handover h2 { font-size: clamp(3rem, 15vw, 5rem); }
  .page--buyers-guide .bgf-handover__actions { align-items: stretch; flex-direction: column; }
  .page--buyers-guide .bgf-notes { gap: 2.5rem; }
  .page--buyers-guide .bgf-notes ul { columns: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .page--buyers-guide .bgf-hero__mount .media-mount__image,
  .page--buyers-guide .bgf-button,
  .page--buyers-guide .bgf-text-link { animation: none; transition: none; }
}

@media print {
  .page--buyers-guide .site-head,
  .page--buyers-guide .crumbs,
  .page--buyers-guide .bgf-dock,
  .page--buyers-guide .bgf-hero__actions,
  .page--buyers-guide .bgf-handover__actions,
  .page--buyers-guide #dukes-receptionist,
  .page--buyers-guide .site-foot,
  .page--buyers-guide .launcher { display: none !important; }
  .page--buyers-guide .bgf-hero { min-height: 26rem; }
  .page--buyers-guide .bgf-phase,
  .page--buyers-guide .bgf-distinctions,
  .page--buyers-guide .bgf-handover { break-before: page; }
  .page--buyers-guide .bgf-decision__body { display: grid !important; }
  .page--buyers-guide .bgf-phase--2,
  .page--buyers-guide .bgf-phase--3,
  .page--buyers-guide .bgf-handover { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}

/* =====================================================================
   Buying Guide repair layer — 18 August 2026.

   Five faults, fixed in place. Nothing above this line was deleted; this
   layer only overrides what measured wrong in the browser.

   1. The shell sets p { max-width: var(--measure) } (dukes.css:2861).
      Every grid built on a <p> inherited it: the three-differences field
      measured 705px inside a 1325px column and wrapped its detail text to
      two words a line. Same fault inside the open decisions brass plate.
   2. .bgf-distinctions > h2 carried width: var(--bgf-shell) AND
      max-width: 13ch with margin-inline: auto, so the narrower max-width
      won and the headline centred itself. Every other headline on the
      page is left-aligned.
   3. Photograph captions were opaque dark boxes floating on top of the
      image. They now sit under the media, in the ground the section
      already owns.
   4. Chapter heads ran ~450px of copy against a 760px photograph and
      left the rest of the column empty. The chapter's own decisions now
      fill it — real navigation, not filler.
   5. Route rows, decision rows and answer rows were hairlines on flat
      ground with a large void mid-row. They now carry a hover ground,
      an inset, and a bounded measure.
   ===================================================================== */

/* --- 1. the inherited measure, on every grid built from a <p> ---------- */
.page--buyers-guide .bgf-distinctions p,
.page--buyers-guide .bgf-decision__distinction,
.page--buyers-guide .bgf-handover__actions { max-width: none; }

/* --- 2 + the three differences as plates ------------------------------ */
.page--buyers-guide .bgf-distinctions {
  display: grid;
  justify-items: stretch;
}

.page--buyers-guide .bgf-distinctions__head {
  width: var(--bgf-shell);
  margin-inline: auto;
  border-top: 0;
}

.page--buyers-guide .bgf-distinctions__head h2 {
  width: auto;
  max-width: 22ch;
  margin: 0 0 clamp(2.5rem, 4vw, 3.75rem);
  text-align: left;
}

.page--buyers-guide .bgf-distinctions__grid {
  width: var(--bgf-shell);
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1rem, 1.6vw, 1.6rem);
  align-items: stretch;
  border-top: 0;
}

.page--buyers-guide .bgf-distinctions__grid p {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-height: 0;
  gap: 0;
  padding: clamp(1.75rem, 2.4vw, 2.5rem);
  background: var(--bgf-forest);
  color: var(--bgf-paper);
  border: 0;
  border-top: 3px solid var(--bgf-brass);
}

.page--buyers-guide .bgf-distinctions__grid strong {
  color: var(--bgf-paper);
  font-size: clamp(1.45rem, 1.9vw, 2rem);
  line-height: 1.04;
}

.page--buyers-guide .bgf-distinctions__grid strong:last-of-type { color: var(--bgf-brass); }

.page--buyers-guide .bgf-distinctions__grid p > span {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  margin: 0.7rem 0;
  color: var(--bgf-brass);
  letter-spacing: 0.14em;
}

.page--buyers-guide .bgf-distinctions__grid p > span::after {
  content: "";
  flex: 1;
  height: 1px;
  background: rgb(200 170 115 / 45%);
}

.page--buyers-guide .bgf-distinctions__grid small {
  margin-top: auto;
  padding-top: 1.4rem;
  color: rgb(251 248 241 / 74%);
  font-size: 0.84rem;
  line-height: 1.55;
}

.page--buyers-guide .bgf-distinctions__grid a {
  margin-top: 1.4rem;
  padding-top: 1.1rem;
  width: 100%;
  color: var(--bgf-brass);
  border-top: 1px solid rgb(251 248 241 / 18%);
  text-decoration: underline;
  text-underline-offset: 0.3em;
}

/* the same plate, inside an open decision */
.page--buyers-guide .bgf-decision__distinction {
  grid-template-columns: minmax(10rem, auto) auto minmax(10rem, auto) minmax(0, 1.5fr);
  padding: clamp(1.25rem, 2vw, 1.75rem);
}

.page--buyers-guide .bgf-decision__distinction small { max-width: 58ch; }

/* --- 3. captions belong under the photograph -------------------------- */
.page--buyers-guide .bgf-hero__media figcaption {
  right: auto;
  left: clamp(1.5rem, 6vw, 7rem);
  bottom: 1.1rem;
  padding: 0;
  background: none;
  color: rgb(251 248 241 / 62%);
  font-size: 0.63rem;
  letter-spacing: 0.06em;
  text-shadow: 0 1px 10px rgb(10 31 23 / 90%);
}

.page--buyers-guide .bgf-phase__visual {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  min-height: 0;
}

.page--buyers-guide .bgf-phase__frame {
  position: relative;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}

.page--buyers-guide .bgf-phase__visual figcaption {
  position: static;
  padding: 0.85rem clamp(1.25rem, 2.5vw, 2rem);
  background: none;
  color: var(--bgf-phase-soft);
  font-size: 0.66rem;
  letter-spacing: 0.05em;
  border-top: 1px solid var(--bgf-phase-rule);
}

.page--buyers-guide .bgf-handover > figure {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  min-height: 0;
}

.page--buyers-guide .bgf-handover__frame {
  position: relative;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}

.page--buyers-guide .bgf-handover figcaption {
  position: static;
  padding: 0.85rem clamp(1.25rem, 2.5vw, 2rem);
  background: none;
  color: rgb(23 34 29 / 60%);
  font-size: 0.66rem;
  letter-spacing: 0.05em;
  border-top: 1px solid var(--bgf-rule);
}

/* --- 4. the chapter's own decisions, in the empty half of the head ---- */
.page--buyers-guide .bgf-phase__steps {
  margin: clamp(2rem, 3.5vw, 3rem) 0 0;
  padding: 0;
  max-width: 30rem;
  list-style: none;
  border-top: 1px solid var(--bgf-phase-rule);
}

.page--buyers-guide .bgf-phase__steps a {
  display: grid;
  grid-template-columns: 2.6rem minmax(0, 1fr);
  align-items: baseline;
  gap: 0.5rem;
  padding: 0.72rem 0.6rem 0.72rem 0;
  color: var(--bgf-phase-ink);
  font-size: 0.94rem;
  line-height: 1.35;
  text-decoration: none;
  border-bottom: 1px solid var(--bgf-phase-rule);
  transition: background-color 160ms ease, padding-left 160ms ease;
}

.page--buyers-guide .bgf-phase__steps span {
  color: var(--bgf-brass);
  font-size: 0.7rem;
  font-weight: 750;
  letter-spacing: 0.08em;
  font-variant-numeric: tabular-nums;
}

/* --- 5. rows that carry their own weight ------------------------------ */
.page--buyers-guide .bgf-route__list a,
.page--buyers-guide .bgf-decision > summary,
.page--buyers-guide .bgf-answer > summary {
  padding-inline: clamp(0.75rem, 1.4vw, 1.35rem);
  transition: background-color 170ms ease;
}

.page--buyers-guide .bgf-route__list small { max-width: 48ch; }
.page--buyers-guide .bgf-decision__heading small { max-width: 52ch; }

.page--buyers-guide .bgf-decision__action {
  padding: 0.6rem 1rem;
  border: 1px solid currentcolor;
  border-radius: 999px;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color 170ms ease, color 170ms ease;
}

.page--buyers-guide .bgf-answer summary > span:last-child {
  padding: 0.6rem 1rem;
  border: 1px solid currentcolor;
  border-radius: 999px;
  text-decoration: none;
  white-space: nowrap;
}

/* the route overview no longer stacks its copy against 300px of nothing */
.page--buyers-guide .bgf-route { align-items: center; }

@media (hover: hover) and (pointer: fine) {
  .page--buyers-guide .bgf-route__list a:hover,
  .page--buyers-guide .bgf-answer > summary:hover { background: rgb(23 34 29 / 5%); }
  .page--buyers-guide .bgf-decision > summary:hover { background: rgb(127 127 127 / 9%); }
  .page--buyers-guide .bgf-decision > summary:hover .bgf-decision__action,
  .page--buyers-guide .bgf-answer > summary:hover > span:last-child {
    background: var(--bgf-brass);
    border-color: var(--bgf-brass);
    color: var(--bgf-forest);
  }
  .page--buyers-guide .bgf-phase__steps a:hover {
    padding-left: 0.6rem;
    background: rgb(127 127 127 / 12%);
  }
  .page--buyers-guide .bgf-distinctions__grid a:hover { color: var(--bgf-paper); }
}

@media (prefers-reduced-motion: reduce) {
  .page--buyers-guide .bgf-phase__steps a { transition: none; }
  .page--buyers-guide .bgf-phase__steps a:hover { padding-left: 0; }
}

@media (max-width: 72rem) {
  .page--buyers-guide .bgf-distinctions__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page--buyers-guide .bgf-distinctions__grid p { grid-template-columns: none; }
  .page--buyers-guide .bgf-distinctions__grid a { grid-column: auto; }
}

@media (max-width: 58rem) {
  .page--buyers-guide .bgf-distinctions__grid { grid-template-columns: 1fr; }
  .page--buyers-guide .bgf-distinctions__grid p { grid-template-columns: none; }
  .page--buyers-guide .bgf-distinctions__grid small,
  .page--buyers-guide .bgf-distinctions__grid a { grid-column: auto; }
  .page--buyers-guide .bgf-phase__visual,
  .page--buyers-guide .bgf-handover > figure { min-height: 0; max-height: none; }
  .page--buyers-guide .bgf-phase__frame,
  .page--buyers-guide .bgf-handover__frame { min-height: 62vw; max-height: 640px; }
  .page--buyers-guide .bgf-phase__steps { max-width: none; }
}

@media (max-width: 40rem) {
  .page--buyers-guide .bgf-distinctions__head,
  .page--buyers-guide .bgf-distinctions__grid { width: 100%; }
  .page--buyers-guide .bgf-distinctions__grid p { padding: 1.5rem; }
  .page--buyers-guide .bgf-hero__media figcaption { left: 1.25rem; right: 1.25rem; }
  .page--buyers-guide .bgf-route__list a,
  .page--buyers-guide .bgf-decision > summary,
  .page--buyers-guide .bgf-answer > summary { padding-inline: 0; }
}

/* --- repair layer, second pass ---------------------------------------
   Three things the first pass moved and had to put back:

   a. `.bgf-phase__copy > p:last-child` carried the support paragraph's
      margin, colour and size. The chapter step list is now the last
      child, so that selector stopped matching and the support line
      collided with the headline's descenders. Bound to `h2 + p` instead,
      which is what it always meant.
   b. Wrapping the photograph in a frame made the frame's height
      indefinite, so `height: 100%` on the image fell back to its natural
      2:3 ratio and the chapter head grew from 760px to 1340px. The frame
      now contributes nothing intrinsic and the image fills it absolutely,
      which is what the un-framed figure did before.
   c. The distinctions headline moved into a wrapper, so
      `.bgf-distinctions > h2` stopped matching and it lost Gloock.
   --------------------------------------------------------------------- */

.page--buyers-guide .bgf-phase__copy h2 + p {
  max-width: 48ch;
  margin: 1.6rem 0 0;
  color: var(--bgf-phase-soft);
  font-size: 1.03rem;
  line-height: 1.65;
}

.page--buyers-guide .bgf-phase__frame > *,
.page--buyers-guide .bgf-handover__frame > * {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
}

.page--buyers-guide .bgf-phase__frame .mount__scene,
.page--buyers-guide .bgf-handover__frame .mount__scene {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
}

.page--buyers-guide .bgf-phase__frame .media-mount__image,
.page--buyers-guide .bgf-handover__frame .media-mount__image {
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: none;
  object-fit: cover;
}

.page--buyers-guide .bgf-phase__visual {
  min-height: clamp(560px, 57vw, 760px);
  max-height: none;
}

.page--buyers-guide .bgf-handover > figure { min-height: clamp(520px, 46vw, 700px); }

.page--buyers-guide .bgf-distinctions > .bgf-distinctions__head,
.page--buyers-guide .bgf-distinctions > .bgf-distinctions__grid { border-top: 0; }

.page--buyers-guide .bgf-distinctions .bgf-distinctions__head h2 {
  font-family: Gloock, Georgia, serif;
  font-size: clamp(3rem, 5vw, 5.8rem);
  font-weight: 400;
  line-height: 0.98;
  letter-spacing: -0.03em;
  max-width: 16ch;
}

@media (max-width: 58rem) {
  .page--buyers-guide .bgf-phase__visual { min-height: 0; }
  .page--buyers-guide .bgf-phase__frame { min-height: 62vw; max-height: 640px; }
  .page--buyers-guide .bgf-handover > figure { min-height: 0; }
  .page--buyers-guide .bgf-handover__frame { min-height: 60vw; max-height: 620px; }
}

/* --- repair layer, third pass ----------------------------------------
   d. The hero caption, unboxed, sat directly under the promise rail's
      first cell. It goes back to the right edge, where the rail is not.
   e. The handover caption inherited ink on a forest ground and rendered
      invisible. Its section is dark; the caption is cream.
   --------------------------------------------------------------------- */
.page--buyers-guide .bgf-hero__media figcaption {
  left: auto;
  right: clamp(1.5rem, 3vw, 3rem);
  text-align: right;
}

.page--buyers-guide .bgf-handover figcaption {
  color: rgb(251 248 241 / 60%);
  border-top-color: rgb(251 248 241 / 18%);
}

@media (max-width: 40rem) {
  .page--buyers-guide .bgf-hero__media figcaption { left: 1.25rem; text-align: left; }
}

/* --- repair layer, fourth pass ---------------------------------------
   f. This whole layer sits after the file's media queries, so its
      unconditional rules were beating them. The rebuilt
      `.bgf-decision__distinction` grid held four columns down to 390px
      and pushed the open decision body 92px past the viewport. The
      narrow-screen stacks are restated here, where they now win.
   --------------------------------------------------------------------- */
@media (max-width: 58rem) {
  .page--buyers-guide .bgf-decision__distinction { grid-template-columns: 1fr auto 1fr; }
  .page--buyers-guide .bgf-decision__distinction small { grid-column: 1 / -1; max-width: none; }
}

@media (max-width: 40rem) {
  .page--buyers-guide .bgf-decision__distinction { grid-template-columns: 1fr; }
}
