/* Stay hub: camping leads; rooms and storage stay proportionate. No page JavaScript. */
@layer components {
  .mp-stay { --_stay-light: var(--mp-white); --_stay-hover: var(--mp-green-text); --mp-color-text-2: color-mix(in srgb, var(--mp-color-text) 80%, var(--mp-color-surface)); }
  .mp-stay > * { grid-column: wide; }
  .mp-stay p { max-inline-size: none; }
  /* Match Ride: a contained panorama fading into a light, in-flow introduction. */
  .mp-prose > .mp-stay--opening { padding-block: var(--mp-space-m) 0; }
  .mp-stay__opening { isolation: isolate; }
  .mp-stay__intro { position: relative; margin-block-start: calc(-1 * var(--mp-space-2xl)); min-inline-size: 0; }
  .mp-stay__intro .mp-hero { min-block-size: 0; margin: 0; border-radius: 0; background: none; color: inherit; overflow: visible; }
  .mp-stay .mp-stay__intro .mp-hero__body { padding: 0; background: none; }
  .mp-stay .mp-stay__intro .mp-hero__title { font-size: var(--mp-fs-display-xl); max-inline-size: none; }
  .mp-stay__intro .mp-hero__lede { max-inline-size: 35em; color: var(--mp-color-text-2); }
  .mp-stay__intro .mp-hero__body > .mp-eyebrow { color: var(--mp-color-text); }
  .mp-stay__intro .mp-hero__actions { margin-block-start: var(--mp-space-s); }
  .mp-stay__photo--hero { position: relative; }
  .mp-stay__photo--hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, transparent 48%, color-mix(in srgb, var(--mp-color-surface) 75%, transparent) 78%, var(--mp-color-surface)); pointer-events: none; }
  .mp-stay__photo--hero .mp-stay__image { aspect-ratio: 1; object-position: 50% 0%; }
  /* Phone (Nick 2026-11-05): the panorama breaks out to the screen edges, square and flush under
     the header; the intro stays on the page gutter, a gutter in from the photo's edge. */
  @media (width < 48rem) {
    .mp-prose > .mp-stay--opening { padding-block-start: 0; }
    .mp-stay__photo.mp-stay__photo--hero { margin-inline: calc(-1 * var(--mp-gutter)); } /* over .mp-stay__photo's margin: 0 */
    .mp-stay__photo--hero .mp-stay__image { border-radius: 0; }
  }
  .mp-stay__hero-facts { display: grid; gap: var(--mp-space-m); padding-block: var(--mp-space-m); border-block: var(--mp-border) solid var(--mp-color-line); }
  .mp-stay--opening > .mp-stay__hero-facts { margin-block-start: var(--mp-space-l); }
  .mp-stay__hero-facts > div { display: grid; gap: var(--mp-space-3xs); }
  .mp-stay__hero-facts strong { font: var(--mp-weight-ui) var(--mp-fs-lead) / var(--mp-lh-snug) var(--mp-font-ui); }
  .mp-stay__hero-facts > div:first-child strong { color: var(--mp-color-accent-text); font: var(--mp-weight-display) var(--mp-fs-display-xs) / var(--mp-lh-tight) var(--mp-font-display); }
  .mp-stay__hero-facts span { font-size: var(--mp-fs-sm); color: var(--mp-color-text-2); }
  .mp-stay__label { text-transform: uppercase; letter-spacing: var(--mp-track-caps); font-weight: var(--mp-weight-ui); }
  .mp-prose > .mp-stay--nav { padding-block: var(--mp-space-m) 0; }
  .mp-stay__nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--mp-border); border: var(--mp-border) solid var(--mp-color-line); border-radius: var(--mp-radius-md); overflow: hidden; background: var(--mp-color-line); }
  .mp-stay__nav a { display: flex; align-items: center; justify-content: space-between; gap: var(--mp-space-xs); padding: var(--mp-space-s); min-block-size: var(--mp-tap); background: var(--mp-ink); color: var(--_stay-light); font-weight: var(--mp-weight-ui); font-size: var(--mp-fs-sm); text-decoration: none; }
  .mp-stay__nav a:hover, .mp-stay__nav a:focus-visible { background: var(--_stay-hover); }
  .mp-stay__nav a:focus-visible { outline-color: var(--_stay-light); outline-offset: calc(-1 * var(--mp-space-3xs)); }
  .mp-stay__feature, .mp-stay__rooms { display: grid; align-items: center; gap: var(--mp-space-l) var(--mp-space-xl); }
  .mp-stay__copy { display: grid; gap: var(--mp-space-s); min-inline-size: 0; }
  .mp-stay__copy > * { margin: 0; }
  .mp-stay__title { margin: 0; font-size: var(--mp-fs-display-m); }
  .mp-stay__subhead { margin: 0; font-size: var(--mp-fs-display-xs); }
  .mp-stay__lede { font-size: var(--mp-fs-lead); color: var(--mp-color-text-2); }
  .mp-stay__photo { margin: 0; min-inline-size: 0; }
  .mp-stay__image { display: block; inline-size: 100%; block-size: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--mp-radius-lg); }
  .mp-stay__actions { display: flex; flex-wrap: wrap; gap: var(--mp-space-xs); }
  .mp-stay .mp-btn { max-inline-size: 100%; white-space: normal; text-align: center; }
  .mp-stay__nightly-rates { display: grid; gap: var(--mp-space-m); border-block: var(--mp-border) solid var(--mp-color-line); padding-block: var(--mp-space-l); }
  .mp-stay__nightly-rates h3 { margin: 0; font-size: var(--mp-fs-display-xs); }
  .mp-stay__nightly-rates p { margin-block: var(--mp-space-xs) 0; color: var(--mp-color-text-2); }
  .mp-stay__nightly-rates dl { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--mp-space-m); margin: 0; }
  .mp-stay__nightly-rates dt { font-weight: var(--mp-weight-ui); font-size: var(--mp-fs-sm); }
  .mp-stay__nightly-rates dd { margin: var(--mp-space-xs) 0 0; font: var(--mp-weight-display) var(--mp-fs-display-xs) / var(--mp-lh-tight) var(--mp-font-display); }
  .mp-stay__nightly-rates dd span { display: block; margin-block-start: var(--mp-space-xs); color: var(--mp-color-text-2); font: var(--mp-weight-body) var(--mp-fs-sm) / var(--mp-lh-body) var(--mp-font-body); }
  .mp-stay__seasonal-options { display: grid; gap: var(--mp-space-m); }
  .mp-stay__seasonal-card { 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-stay__seasonal-card .mp-eyebrow { margin-block: 0 var(--mp-space-xs); }
  .mp-stay__seasonal-card h3 { font-size: var(--mp-fs-display-xs); margin: 0; }
  .mp-stay__seasonal-facts { inline-size: 100%; margin-block: 0 var(--mp-space-m); }
  .mp-stay__seasonal-facts > div { border-block-start: var(--mp-border) solid var(--mp-color-line); padding-block: var(--mp-space-s); }
  .mp-stay__seasonal-facts dt { font-weight: var(--mp-weight-ui); }
  .mp-stay__seasonal-facts dd { margin: var(--mp-space-2xs) 0 0; }
  .mp-stay__seasonal-actions { display: grid; justify-items: start; gap: var(--mp-space-xs); margin-block-start: auto; }
  .mp-stay__seasonal-card > .mp-stay__note { margin-block: var(--mp-space-xs) 0; }
  .mp-stay > .mp-stay__renewals { margin-block-start: var(--mp-space-xl); }
  .mp-stay__renewals h3, .mp-stay__waiting-list h3 { margin: 0; font-size: var(--mp-fs-display-xs); }
  .mp-stay__renewals > p { margin-block: var(--mp-space-xs) var(--mp-space-l); }
  .mp-stay__renewal-dates { display: grid; gap: var(--mp-space-l); list-style: none; padding: 0; margin: 0; }
  .mp-stay__renewal-dates li { border-block-start: var(--mp-border) solid var(--mp-color-line); padding-block-start: var(--mp-space-m); }
  .mp-stay__date { display: block; color: var(--mp-color-accent-text); font: var(--mp-weight-display) var(--mp-fs-display-xs) / var(--mp-lh-tight) var(--mp-font-display); }
  .mp-stay__renewal-dates h4, .mp-stay__form-placeholder h4 { font-size: var(--mp-fs-lead); margin-block: var(--mp-space-s) var(--mp-space-xs); }
  .mp-stay__renewal-dates p { margin: 0; }
  .mp-stay > .mp-stay__waiting-list { margin-block-start: var(--mp-space-xl); }
  .mp-stay__waiting-list { display: grid; gap: var(--mp-space-l); padding: var(--mp-space-m); border: var(--mp-border) solid var(--mp-color-line); border-radius: var(--mp-radius-lg); }
  .mp-stay__waiting-list .mp-eyebrow { margin-block: 0 var(--mp-space-xs); }
  .mp-stay__waiting-list p:last-child { margin-block-end: 0; }
  .mp-stay__form-placeholder { padding: var(--mp-space-m); border: var(--mp-border) dashed var(--mp-color-line-strong); border-radius: var(--mp-radius-md); }
  .mp-stay__form-placeholder h4 { margin-block-start: 0; }
  .mp-stay__amount { display: block; font: var(--mp-weight-display) var(--mp-fs-display-xs) / var(--mp-lh-tight) var(--mp-font-display); margin-block: var(--mp-space-m) var(--mp-space-3xs); }
  .mp-stay__amount small { font-size: var(--mp-fs-sm); }
  .mp-stay__unit { font-size: var(--mp-fs-sm); color: var(--mp-color-text-2); margin-block-start: 0; }
  .mp-stay__link { display: inline-flex; align-items: center; min-block-size: var(--mp-tap); font-weight: var(--mp-weight-ui); text-underline-offset: .22em; }
  .mp-stay__note { font-size: var(--mp-fs-sm); color: var(--mp-color-text-2); }
  .mp-stay__head { display: grid; gap: var(--mp-space-m); margin-block-end: var(--mp-space-m); }
  .mp-stay__head p { margin: 0; }
  .mp-stay__head .mp-eyebrow { margin-block-end: var(--mp-space-xs); }
  .mp-stay__amenities { display: grid; gap: var(--mp-space-l); }
  .mp-stay__amenities h3 { font-size: var(--mp-fs-display-2xs); margin: 0; }
  .mp-stay__amenities p { margin-block: var(--mp-space-xs) 0; }
  .mp-stay__utility { display: flex; flex-wrap: wrap; gap: var(--mp-space-xs) var(--mp-space-l); }
  .mp-stay__rules { border-block-start: var(--mp-border) solid var(--mp-color-line); padding-block-start: var(--mp-space-m); display: flex; flex-wrap: wrap; gap: var(--mp-space-xs) var(--mp-space-l); align-items: center; }
  .mp-stay__rules p { flex: 1 1 28em; margin: 0; }
  .mp-stay__room-photos { display: grid; gap: var(--mp-space-s); }
  .mp-stay__room-photos .mp-stay__image { aspect-ratio: 3 / 2; }
  .mp-stay__room-list { display: grid; margin: 0; }
  .mp-stay__room-list > div { border-block-start: var(--mp-border) solid var(--mp-color-line); padding-block: var(--mp-space-s); }
  .mp-stay__room-list dt { font-weight: var(--mp-weight-ui); font-size: var(--mp-fs-lead); }
  .mp-stay__room-list dt span { display: block; font-size: var(--mp-fs-sm); font-weight: var(--mp-weight-body); color: var(--mp-color-text-2); }
  .mp-stay__room-list dd { margin: var(--mp-space-xs) 0 0; }
  .mp-stay__room-list dd p { margin-block: var(--mp-space-3xs) 0; font-size: var(--mp-fs-sm); }
  .mp-stay__visit-grid { display: grid; gap: var(--mp-space-l); }
  .mp-stay__visit-grid article { border-block-start: var(--mp-border) solid var(--mp-color-line); padding-block-start: var(--mp-space-l); }
  .mp-stay__visit-grid h3 { margin: 0; font-size: var(--mp-fs-display-xs); }
  .mp-stay__storage { display: grid; gap: var(--mp-space-m) var(--mp-space-xl); align-items: center; }
  .mp-stay__storage .mp-eyebrow { margin-block: 0 var(--mp-space-xs); }
  .mp-stay__storage p { max-inline-size: 40em; margin-block-end: 0; }
  .mp-stay__storage .mp-stay__amount { margin-block-start: 0; }
  .mp-stay__storage .mp-stay__unit { display: block; }
  .mp-stay--closing { text-align: center; }
  .mp-stay--closing .mp-cta { padding: 0; border-radius: 0; background: none; }
  @media (width < 48rem) {
    .mp-stay .mp-stay__intro .mp-hero__title { font-size: var(--mp-fs-display-l); }
    .mp-stay--opening .mp-hero__actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); inline-size: 100%; }
    .mp-stay--opening .mp-hero__actions .mp-btn { padding-inline: var(--mp-space-xs); }
    .mp-stay__hero-facts { gap: var(--mp-space-s); border-block-start: var(--mp-border) solid var(--mp-color-line); }
    .mp-stay__hero-facts > div:first-child { grid-template-columns: 1fr auto; align-items: center; }
    .mp-stay__hero-facts > div:first-child strong { grid-column: 2; grid-row: 1 / 3; }
    .mp-stay__hero-facts > div:first-child span:last-child { grid-column: 1; }
    .mp-stay__room-photos { grid-template-columns: repeat(2,minmax(0,1fr)); }
  }
  @media (width >= 48rem) {
    .mp-stay__nightly-rates { grid-template-columns: repeat(2,minmax(0,1fr)); align-items: center; }
    .mp-stay__seasonal-options, .mp-stay__waiting-list { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .mp-stay__seasonal-card, .mp-stay__waiting-list { padding: var(--mp-space-l); }
    .mp-stay__renewal-dates { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .mp-stay__photo--hero .mp-stay__image { aspect-ratio: 2 / 1; }
    .mp-stay__intro { margin-block-start: calc(-1 * var(--mp-space-3xl)); padding-inline: var(--mp-space-l); }
    .mp-stay__hero-facts { grid-template-columns: repeat(3,minmax(0,1fr)); align-items: center; }
    .mp-stay__hero-facts > div + div { padding-inline-start: var(--mp-space-l); border-inline-start: var(--mp-border) solid var(--mp-color-line); }
    .mp-stay__nav { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .mp-stay__feature, .mp-stay__head, .mp-stay__visit-grid, .mp-stay__storage { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .mp-stay__amenities { grid-template-columns: repeat(4,minmax(0,1fr)); }
    .mp-stay__rooms { grid-template-columns: minmax(0,2fr) minmax(0,3fr); }
    .mp-stay__head { align-items: end; column-gap: var(--mp-space-xl); }
  }
  @media (width >= 64rem) {
    .mp-stay__intro { margin-block-start: calc(-2 * var(--mp-space-3xl)); }
    .mp-stay__nav { grid-template-columns: repeat(6,minmax(0,1fr)); }
    .mp-stay__room-list > div { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: var(--mp-space-m); }
    .mp-stay__room-list dd { margin: 0; }
  }
}

@layer schemes {
  .mp-stay__intro .mp-hero { background: none; color-scheme: light; --mp-color-surface: var(--mp-white); --mp-color-surface-2: var(--mp-tint); --mp-color-text: var(--mp-ink); --mp-color-text-2: var(--mp-ink-2); --mp-color-accent-text: var(--mp-green-text); --mp-color-line: var(--mp-hairline); --mp-color-line-strong: var(--mp-stone); --mp-color-line-hover: var(--mp-ink); }
}
