/* Rental choices and rider-fit guide. Shared rates, native links and disclosures; no new JS. */
@layer components {
  .mp-rentals { --mp-color-text-2: color-mix(in srgb, var(--mp-color-text) 80%, var(--mp-color-surface)); }
  .mp-rentals > * { grid-column: wide; }
  .mp-rentals p { max-inline-size: none; }
  .mp-rentals .mp-btn { max-inline-size: 100%; white-space: normal; text-align: center; }
  .mp-prose > .mp-rentals--opening { padding-block: var(--mp-space-m) var(--mp-space-l); }
  .mp-rentals__opening { display: grid; align-items: center; gap: var(--mp-space-l); }
  .mp-rentals__intro { display: grid; gap: var(--mp-space-m); min-inline-size: 0; }
  .mp-rentals__intro > * { margin: 0; }
  .mp-rentals__headline { font-size: var(--mp-fs-display-l); max-inline-size: none; }
  .mp-rentals__headline em { font-style: normal; color: var(--mp-color-accent-text); }
  .mp-rentals__intro .mp-rentals__lede { max-inline-size: 32em; }
  .mp-rentals__photo { margin: 0; min-inline-size: 0; }
  .mp-rentals__image { display: block; inline-size: 100%; block-size: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--mp-radius-lg); }
  .mp-rentals__photo--hero .mp-rentals__image { aspect-ratio: 3 / 2; }
  .mp-rentals__facts { display: grid; gap: var(--mp-space-s); padding-block: var(--mp-space-m); border-block: var(--mp-border) solid var(--mp-color-line); }
  .mp-rentals__facts > div { display: grid; gap: var(--mp-space-3xs); }
  .mp-rentals__facts strong { font-weight: var(--mp-weight-ui); }
  .mp-rentals__facts span { color: var(--mp-color-text-2); font-size: var(--mp-fs-sm); }
  .mp-rentals__nav { display: flex; flex-wrap: wrap; gap: var(--mp-space-xs) var(--mp-space-l); }
  .mp-rentals__nav a { display: inline-flex; align-items: center; justify-content: space-between; gap: var(--mp-space-xs); min-block-size: var(--mp-tap); font-weight: var(--mp-weight-ui); font-size: var(--mp-fs-sm); text-underline-offset: .25em; }
  .mp-rentals__head { display: grid; align-items: end; gap: var(--mp-space-m) var(--mp-space-xl); }
  .mp-rentals__head p { margin: 0; }
  .mp-rentals__head .mp-eyebrow { margin-block-end: var(--mp-space-xs); }
  .mp-rentals__title { font-size: var(--mp-fs-display-m); margin: 0; }
  .mp-rentals__subhead { font-size: var(--mp-fs-display-xs); margin: 0; }
  .mp-rentals__lede { font-size: var(--mp-fs-lead); color: var(--mp-color-text-2); }
  .mp-rentals__options { display: grid; gap: var(--mp-space-m); }
  .mp-rentals__option { display: flex; flex-direction: column; align-items: start; min-inline-size: 0; padding: var(--mp-space-m); border: var(--mp-border) solid var(--mp-color-line); border-radius: var(--mp-radius-lg); }
  .mp-rentals__option > .mp-eyebrow { color: var(--mp-color-accent-text); margin: 0 0 var(--mp-space-xs); }
  .mp-rentals__option h3 { font-size: var(--mp-fs-display-s); margin: 0; }
  .mp-rentals__option > p { margin-block: var(--mp-space-s) 0; }
  .mp-rentals__option .mp-rentals__option-lede { font-weight: var(--mp-weight-ui); font-size: var(--mp-fs-lead); }
  .mp-rentals__includes { padding-inline-start: var(--mp-space-m); margin-block: var(--mp-space-m); }
  .mp-rentals__includes li + li { margin-block-start: var(--mp-space-xs); }
  .mp-rentals__option .mp-rentals__price { margin-block-start: auto; }
  .mp-rentals__price { font: var(--mp-weight-display) var(--mp-fs-display-xs) / var(--mp-lh-tight) var(--mp-font-display); }
  .mp-rentals__option-action { margin-block-start: var(--mp-space-m); inline-size: 100%; }
  .mp-rentals__option-action .mp-btn { inline-size: 100%; }
  .mp-rentals__option-action p { margin-block: var(--mp-space-xs) 0; }
  .mp-rentals__option .mp-rentals__footnote { padding-block-start: var(--mp-space-s); border-block-start: var(--mp-border) solid var(--mp-color-line); font-size: var(--mp-fs-sm); }
  .mp-rentals__note { font-size: var(--mp-fs-sm); color: var(--mp-color-text-2); }
  .mp-rentals__difference { display: grid; gap: var(--mp-space-m); padding-block: var(--mp-space-l); border-block: var(--mp-border) solid var(--mp-color-line); }
  .mp-rentals__difference h3, .mp-rentals__small-bike h3, .mp-rentals__rate-extras h3, .mp-rentals__steps h3, .mp-rentals__arrival h3 { font-size: var(--mp-fs-display-xs); margin: 0; }
  .mp-rentals__difference p { margin-block: var(--mp-space-xs) 0; }
  .mp-rentals__clutch { border-block: var(--mp-border) solid var(--mp-color-line); }
  .mp-rentals__clutch summary { padding-block: var(--mp-space-s); font-weight: var(--mp-weight-ui); cursor: pointer; }
  .mp-rentals__clutch p { max-inline-size: 65em; margin-block: 0 var(--mp-space-m); }
  .mp-rentals__bikes { display: grid; gap: var(--mp-space-xl); padding-block: var(--mp-space-m); }
  .mp-rentals__bike { min-inline-size: 0; position: relative; }
  .mp-rentals__bike .mp-rentals__image { aspect-ratio: 3 / 2; object-fit: contain; border-radius: var(--mp-radius-md); }
  .mp-rentals__bike-copy { padding-block-start: var(--mp-space-m); }
  .mp-rentals__bike-copy .mp-eyebrow { margin: 0 0 var(--mp-space-xs); color: var(--mp-color-accent-text); }
  .mp-rentals__bike-copy h3 { margin: 0; font-size: var(--mp-fs-display-xs); }
  .mp-rentals__bike-copy > p:not(.mp-eyebrow) { margin-block: var(--mp-space-xs) var(--mp-space-m); }
  .mp-rentals__specs, .mp-rentals__race-facts, .mp-rentals__rates { margin: 0; }
  .mp-rentals__specs > div, .mp-rentals__rates > div { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,2fr); gap: var(--mp-space-s); padding-block: var(--mp-space-s); border-block-start: var(--mp-border) solid var(--mp-color-line); }
  .mp-rentals__specs dt { font-size: var(--mp-fs-sm); color: var(--mp-color-text-2); }
  .mp-rentals__specs { border-block-start: var(--mp-border) solid var(--mp-color-line); padding-block-start: var(--mp-space-xs); }
  .mp-rentals__specs > div { border: 0; padding-block: var(--mp-space-xs); }
  .mp-rentals__specs dd, .mp-rentals__race-facts dd, .mp-rentals__rates dd { margin: 0; font-weight: var(--mp-weight-ui); }
  .mp-rentals__small-bike { display: grid; gap: var(--mp-space-m); align-items: center; padding: var(--mp-space-m); border: var(--mp-border) solid var(--mp-color-line); border-radius: var(--mp-radius-md); }
  .mp-rentals__small-bike p { margin-block: 0 var(--mp-space-xs); }
  .mp-rentals__small-bike h3 { margin-block-end: var(--mp-space-xs); }
  .mp-rentals__small-bike p:last-child { margin-block-end: 0; }
  .mp-rentals__feature { display: grid; align-items: center; gap: var(--mp-space-l) var(--mp-space-xl); }
  .mp-rentals__copy { display: grid; gap: var(--mp-space-s); min-inline-size: 0; }
  .mp-rentals__copy > * { margin: 0; }
  .mp-rentals__race-facts > div { padding-block: var(--mp-space-s); border-block-start: var(--mp-border) solid var(--mp-color-line); }
  .mp-rentals__race-facts dt { font-size: var(--mp-fs-sm); color: var(--mp-color-text-2); margin-block-end: var(--mp-space-3xs); }
  .mp-rentals__actions { display: flex; flex-wrap: wrap; gap: var(--mp-space-xs) var(--mp-space-m); align-items: center; }
  .mp-rentals__link { display: inline-flex; align-items: center; min-block-size: var(--mp-tap); font-weight: var(--mp-weight-ui); text-underline-offset: .25em; }
  .mp-rentals__table-wrap { min-inline-size: 0; }
  .mp-rentals__table { inline-size: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
  .mp-rentals__table th, .mp-rentals__table td { text-align: start; padding: var(--mp-space-s); border-block-end: var(--mp-border) solid var(--mp-color-line); }
  .mp-rentals__table thead th { background: var(--mp-color-surface-2); font-size: var(--mp-fs-sm); vertical-align: top; }
  .mp-rentals__table thead span { display: block; font-weight: var(--mp-weight-body); }
  .mp-rentals__table tbody th { font-weight: var(--mp-weight-body); }
  .mp-rentals__table td { font-weight: var(--mp-weight-ui); }
  .mp-rentals__rate-extras { display: grid; gap: var(--mp-space-l); padding-block-start: var(--mp-space-m); }
  .mp-rentals__rates { margin-block: var(--mp-space-m); }
  .mp-rentals__rates > div { grid-template-columns: minmax(0,1fr) auto; }
  .mp-rentals__rates dd { text-align: end; }
  .mp-rentals__rates small { color: var(--mp-color-text-2); }
  .mp-rentals__gear { display: grid; gap: var(--mp-space-xs); padding-inline-start: var(--mp-space-m); }
  .mp-rentals__steps { display: grid; gap: var(--mp-space-m); list-style: none; margin: var(--mp-space-l) 0 0; padding: 0; }
  .mp-rentals__steps li { min-inline-size: 0; padding: var(--mp-space-m); border: var(--mp-border) solid var(--mp-color-line); border-radius: var(--mp-radius-lg); background: var(--mp-color-surface); }
  .mp-rentals__step-no { display: grid; place-items: center; inline-size: var(--mp-space-xl); block-size: var(--mp-space-xl); border-radius: var(--mp-radius-sm); background: color-mix(in srgb, var(--mp-color-text) 5%, var(--mp-color-surface)); font: var(--mp-weight-display) var(--mp-fs-display-xs) / var(--mp-lh-tight) var(--mp-font-display); color: var(--mp-color-accent-text); margin-block-end: var(--mp-space-m); }
  .mp-rentals__steps p { margin-block: var(--mp-space-s) 0; }
  .mp-rentals__arrival { display: grid; gap: var(--mp-space-m); margin-block-start: var(--mp-space-m); }
  .mp-rentals__arrival > div { min-inline-size: 0; padding: var(--mp-space-m); border-radius: var(--mp-radius-lg); background: color-mix(in srgb, var(--mp-color-text) 5%, var(--mp-color-surface)); }
  .mp-rentals__arrival p { margin-block: var(--mp-space-s) 0; }
  .mp-rentals__arrival p:last-child { margin-block-end: 0; }
  /* The camp closing CTA, with the rental fleet behind a readable full-width scrim. */
  .mp-rentals--closing { padding-block: var(--mp-space-3xl); }
  .mp-rentals--closing .mp-cta__text { max-inline-size: 36em; font-size: calc(var(--mp-fs-lead) * 1.2); color: var(--mp-color-text); }
  .mp-rentals--closing .mp-cta__actions { max-inline-size: 100%; }
  .mp-rentals--closing .mp-cta--booking .mp-cta__actions .mp-btn { min-block-size: var(--mp-h-control); font-size: var(--mp-fs-lead); text-transform: none; letter-spacing: var(--mp-track-ui); white-space: normal; box-shadow: none; }
  .mp-rentals--closing .mp-cta--booking .mp-cta__actions .mp-btn--secondary { box-shadow: inset 0 0 0 var(--mp-border) var(--mp-color-line-strong); }
  .mp-rentals__close-phone a { color: var(--mp-color-text); }
  .mp-rentals--closing > .mp-rentals__close-phone { grid-column: wide; max-inline-size: none; text-align: center; font-size: var(--mp-fs-lead); margin-block: var(--mp-space-m) 0; }
  .mp-rentals__more { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--mp-space-xs) var(--mp-space-l); border-block-start: var(--mp-border) solid var(--mp-color-line); padding-block-start: var(--mp-space-m); margin-block-start: var(--mp-space-l); font-size: var(--mp-fs-base); text-align: center; }
  .mp-rentals__more a { display: inline-flex; align-items: center; min-block-size: var(--mp-tap); text-underline-offset: .25em; }
  @media (width < 48rem) {
    .mp-rentals__bike + .mp-rentals__bike { border-block-start: var(--mp-border) solid var(--mp-color-line); padding-block-start: var(--mp-space-xl); }
    .mp-rentals__difference > div + div { border-block-start: var(--mp-border) solid var(--mp-color-line); padding-block-start: var(--mp-space-m); }
    .mp-rentals__table th, .mp-rentals__table td { padding-inline: var(--mp-space-xs); font-size: var(--mp-fs-sm); }
    .mp-rentals__table th:first-child { padding-inline-start: 0; }
    .mp-rentals__rates > div { grid-template-columns: minmax(0,1fr); gap: var(--mp-space-2xs); }
    .mp-rentals__rates dd { text-align: start; }
    .mp-rentals--closing { padding-block: var(--mp-space-2xl); }
    .mp-rentals--closing .mp-cta--booking .mp-cta__title { font-size: calc(var(--mp-fs-display-2xl) * 1.1); }
    .mp-rentals--closing .mp-cta__actions { inline-size: 100%; flex-direction: column; align-items: stretch; }
    .mp-rentals--closing .mp-cta--booking .mp-cta__actions .mp-btn { padding-inline: var(--mp-space-s); }
  }
  @media (width >= 48rem) {
    .mp-rentals__options, .mp-rentals__difference, .mp-rentals__head, .mp-rentals__rate-extras, .mp-rentals__arrival { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .mp-rentals__facts { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .mp-rentals__facts > div + div { border-inline-start: var(--mp-border) solid var(--mp-color-line); padding-inline-start: var(--mp-space-m); }
    .mp-rentals__difference { gap: var(--mp-space-xl); }
    .mp-rentals__difference > div { position: relative; }
    .mp-rentals__difference > div + div::before { content: ""; position: absolute; inset-block: 0; inset-inline-start: calc(var(--mp-space-xl) / -2); border-inline-start: var(--mp-border) solid var(--mp-color-line); }
    .mp-rentals__specs > div { grid-template-columns: minmax(0,1fr); gap: var(--mp-space-3xs); }
    .mp-rentals__small-bike { grid-template-columns: minmax(0,1fr) auto; }
    .mp-rentals__table { font-size: var(--mp-fs-lead); }
    .mp-rentals__gear { grid-template-columns: repeat(2,minmax(0,1fr)); }
  }
  @media (48rem <= width < 64rem) {
    .mp-rentals__steps li { display: grid; grid-template-columns: auto minmax(0,1fr); column-gap: var(--mp-space-m); }
    .mp-rentals__step-no { grid-row: 1 / span 2; margin: 0; }
    .mp-rentals__steps p { grid-column: 2; margin-block-start: var(--mp-space-xs); }
    .mp-rentals__bike { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: var(--mp-space-xl); align-items: start; }
    .mp-rentals__bike + .mp-rentals__bike { border-block-start: var(--mp-border) solid var(--mp-color-line); padding-block-start: var(--mp-space-xl); }
    .mp-rentals__bike-copy { padding-block-start: 0; }
    .mp-rentals__specs > div { grid-template-columns: minmax(0,1fr) minmax(0,2fr); }
  }
  @media (width >= 64rem) {
    .mp-rentals__steps { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .mp-rentals__steps li, .mp-rentals__arrival > div { padding: var(--mp-space-l); }
    .mp-rentals__bikes { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .mp-rentals__bike + .mp-rentals__bike::before { content: ""; position: absolute; inset-block: 0; inset-inline-start: calc(var(--mp-space-xl) / -2); border-inline-start: var(--mp-border) solid var(--mp-color-line); }
    .mp-rentals__opening { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: var(--mp-space-xl); }
    .mp-rentals__photo--hero .mp-rentals__image { aspect-ratio: 1; }
    .mp-rentals__headline { font-size: var(--mp-fs-display-xl); }
    .mp-rentals__option { padding: var(--mp-space-l); }
    .mp-rentals__feature { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .mp-rentals__photo--race .mp-rentals__image { aspect-ratio: 1; object-fit: contain; }
    .mp-rentals__specs > div { grid-template-columns: minmax(0,1fr) minmax(0,2fr); }
  }
}
