/* ========================================================
   ARIA ONE × MONACO MMXXVI — Programme
   Dark midnight card (VIP+ credential register) on darker
   backdrop, bone/cream type. Canela / Cormorant throughout.
   ======================================================== */

:root {
  /* ============================================================
     PALETTE — credential system, exact values from the spec sheet
     ANTHRACITE #1E2024  · VVIP
     CHROME WHITE #BFC2C8 · VIP
     SIGNAL RED #C4252D  · GA
     LAGARIA GREEN #1E5C44 · Sponsor
     PURE WHITE #F1EEE5  · Staff
     ============================================================ */
  --anthracite:      #1E2024;
  --chrome:          #BFC2C8;
  --signal:          #C4252D;
  --lagaria:         #1E5C44;
  --pure:            #F1EEE5;

  --backdrop:        #0a0b0d;   /* deeper than the card; lets the edge read on desktop */
  --card:            #1E2024;   /* Anthracite — VVIP credential face */
  --card-warm:       #25272c;   /* one notch up for placeholders / tracks */

  --bone:            #F1EEE5;   /* Pure White — primary type on anthracite */
  --bone-warm:       #FBF8F2;
  --bone-soft:       rgba(241, 238, 229, 0.68);
  --bone-mute:       rgba(241, 238, 229, 0.48);
  --bone-faint:      rgba(241, 238, 229, 0.30);

  --rule:            rgba(241, 238, 229, 0.16);
  --rule-soft:       rgba(241, 238, 229, 0.09);

  /* Tier inks — used as accents throughout */
  --crimson:         #C4252D;   /* Signal Red — GA */
  --emerald:         #1E5C44;   /* Lagaria Green — Sponsor */
  --silver:          #BFC2C8;   /* Chrome White — VIP */

  /* ============================================================
     TYPE — per spec
     Masthead/editorial:  Canela 500 (→ Cormorant Garamond fallback)
     Tier display:        Canela 900 tracked (→ Cormorant 700)
     Support / readouts:  Inter Tight 500, generously tracked
     ============================================================ */
  --canela:          "Canela", "Canela Deck", "Cormorant Garamond", "EB Garamond", Georgia, serif;
  --canela-text:     "Canela Text", "Canela", "Cormorant Garamond", Georgia, serif;
  /* All text — including small tracked labels — sets in Canela. */
  --support:         "Canela", "Canela Deck", "Cormorant Garamond", "EB Garamond", Georgia, serif;
  --mono:            "Canela", "Canela Deck", "Cormorant Garamond", "EB Garamond", Georgia, serif;

  /* Measurements */
  --card-width:      820px;
  --gutter:          88px;
  --section-gap:     128px;
}

* { box-sizing: border-box; }

html, body { margin: 0; padding: 0; }

body {
  background: var(--backdrop);
  color: var(--bone);
  font-family: var(--canela);
  font-size: 17px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Pinstripe — very low contrast, taken from the credential ornamentation */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image:
    repeating-linear-gradient(
      135deg,
      rgba(241,238,229,0.012) 0 1px,
      transparent 1px 7px
    );
  z-index: 0;
}

/* ===== The card ===== */
.card {
  position: relative;
  max-width: var(--card-width);
  margin: 64px auto 64px;
  background: var(--card);
  color: var(--bone);
  box-shadow:
    0 0 0 0.5px rgba(241, 238, 229, 0.06),
    0 0 80px rgba(0, 0, 0, 0.62),
    0 2px 0 rgba(0,0,0,0.3);
  z-index: 1;
  overflow: hidden;
}

/* ===== Typography ===== */
.meta {
  font-family: var(--canela);
  font-weight: 500;
  font-style: italic;
  font-size: 13px;
  letter-spacing: 0.04em;
  color: var(--bone-soft);
  text-transform: none;
}

/* Per spec: SUPPORT · SMALL CAPS — Inter Tight 500, generously tracked */
.smallcaps {
  font-family: var(--support);
  font-weight: 500;
  font-size: 10.5px;
  letter-spacing: 0.36em;
  text-transform: uppercase;
  color: var(--bone-mute);
  font-style: normal;
}

.meta-num {
  font-family: var(--support);
  font-weight: 400;
  font-style: normal;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--bone-soft);
  font-variant-numeric: tabular-nums;
}

h1, h2, h3, h4 {
  font-family: var(--canela);
  font-weight: 400;
  margin: 0;
  letter-spacing: -0.005em;
  text-wrap: balance;
  color: var(--bone);
}

/* Display sizes */
.h-section {
  font-family: var(--canela);
  font-weight: 400;
  font-size: clamp(44px, 5.5vw, 64px);
  line-height: 1.02;
  letter-spacing: -0.014em;
}

em, i, .italic {
  font-style: italic;
  font-family: var(--canela);
}

p { margin: 0 0 1.1em; color: var(--bone); }
p:last-child { margin-bottom: 0; }

p.lede {
  font-family: var(--canela);
  font-weight: 400;
  font-size: 23px;
  line-height: 1.42;
  color: var(--bone);
  text-wrap: pretty;
}

p.body {
  font-family: var(--canela);
  font-weight: 400;
  font-size: 17px;
  line-height: 1.62;
  color: var(--bone-soft);
  text-wrap: pretty;
  max-width: 56ch;
}
p.body em { color: var(--bone); font-style: italic; }

a { color: inherit; text-decoration: none; }

/* ===== Section structure ===== */
.section {
  padding: 0 var(--gutter);
  position: relative;
}

.section-head {
  padding: var(--section-gap) 0 40px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 32px;
  align-items: end;
}

.section-num {
  font-family: var(--support);
  font-style: normal;
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.24em;
  color: var(--crimson);
  align-self: start;
  padding-top: 16px;
  font-variant-numeric: tabular-nums;
}

.section-title {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.section-title .kicker {
  font-family: var(--support);
  font-weight: 500;
  font-size: 10.5px;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--bone-mute);
}

/* Diamond rule divider */
.diamond-rule {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  padding: 88px 0 24px;
  color: var(--bone-mute);
}
.diamond-rule .line {
  flex: 0 0 80px;
  height: 0;
  border-top: 0.75px solid currentColor;
}
.diamond-rule .diamond {
  width: 7px;
  height: 7px;
  background: var(--crimson);
  transform: rotate(45deg);
}

/* ===== §01 Hero ===== */
.hero {
  position: relative;
  padding: 0;
  height: 1180px;
  overflow: hidden;
  background: #000;
}
.hero-img {
  position: absolute;
  inset: 0;
  background: url("assets/03_bdn_aerial_topdown.png") center/cover no-repeat;
  filter: brightness(0.78) contrast(1.06);
}
.hero-img::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(6,7,10,0.65) 0%, rgba(6,7,10,0.05) 22%, rgba(6,7,10,0.05) 55%, rgba(6,7,10,0.92) 100%);
}
.hero-top, .hero-bottom {
  position: absolute;
  left: var(--gutter);
  right: var(--gutter);
  z-index: 2;
  color: var(--bone);
}
.hero-top {
  top: 56px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  font-family: var(--support);
  font-size: 10.5px;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: rgba(241, 238, 229, 0.86);
  font-weight: 500;
}
.hero-bottom { bottom: 64px; }

.hero-mark {
  width: 110px;
  margin-bottom: 40px;
  opacity: 0.96;
}
.hero-mark img { width: 100%; height: auto; display: block; }

.hero-title {
  font-family: var(--canela);
  font-weight: 400;
  font-size: clamp(60px, 8.2vw, 108px);
  line-height: 0.94;
  letter-spacing: -0.022em;
  color: var(--bone);
  text-wrap: balance;
  margin: 0 0 32px;
  max-width: 12ch;
}
.hero-title em { font-style: italic; }

.hero-dates {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 32px;
}
.hero-dates .top {
  font-family: var(--canela);
  font-style: italic;
  font-size: 18px;
  color: var(--bone-soft);
}
.hero-dates .roman {
  font-family: var(--support);
  font-weight: 500;
  font-style: normal;
  font-size: 11px;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: rgba(241, 238, 229, 0.82);
}

.hero-cta {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding: 14px 0 12px;
  font-family: var(--support);
  font-size: 10.5px;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--bone);
  border-top: 0.5px solid rgba(241, 238, 229, 0.42);
  border-bottom: 0.5px solid rgba(241, 238, 229, 0.42);
  font-weight: 500;
}
.hero-cta::after { content: "→"; font-size: 14px; color: var(--crimson); }

.scroll-cue {
  position: absolute;
  left: 50%;
  bottom: 28px;
  transform: translateX(-50%);
  z-index: 3;
  font-family: var(--support);
  font-size: 9.5px;
  letter-spacing: 0.44em;
  text-transform: uppercase;
  color: rgba(241, 238, 229, 0.72);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  font-weight: 500;
}
.scroll-cue .stem {
  display: block;
  width: 0.5px;
  height: 32px;
  background: rgba(236, 236, 232, 0.45);
}

/* ===== Two-column editorial block ===== */
.two-col {
  display: grid;
  grid-template-columns: 0.85fr 1.4fr;
  gap: 64px;
  align-items: start;
}
.two-col .side-label {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.two-col .side-label .smallcaps { margin-bottom: 4px; }

/* Pull quote */
.pullquote {
  margin: 64px 0 0;
  padding: 40px 0 12px;
  border-top: 0.5px solid var(--rule);
}
.pullquote p {
  font-family: var(--canela);
  font-style: italic;
  font-size: 30px;
  line-height: 1.28;
  color: var(--bone);
  text-wrap: balance;
  margin: 0 0 20px;
  font-weight: 400;
}
.pullquote .attr {
  font-family: var(--support);
  font-size: 10.5px;
  letter-spacing: 0.36em;
  text-transform: uppercase;
  color: var(--bone-mute);
  font-weight: 500;
}

/* ===== Surface swap: bone card sections =====
   Each .section--bone behaves like flipping the credential over:
   the surface becomes Staff-card bone, and all type inverts to midnight
   by overriding the bone-named variables in-place. The crimson and
   emerald tier inks stay the same — they read on both surfaces. */
.section--bone {
  --bone:         #1E2024;                      /* Anthracite ink on Pure White */
  --bone-warm:    #25272c;
  --bone-soft:    rgba(30, 32, 36, 0.72);
  --bone-mute:    rgba(30, 32, 36, 0.52);
  --bone-faint:   rgba(30, 32, 36, 0.30);
  --rule:         rgba(30, 32, 36, 0.16);
  --rule-soft:    rgba(30, 32, 36, 0.08);
  --silver:       #6b6d72;                      /* Chrome-grey ink that reads on Pure White */
  --card-warm:    #e8e4d8;                      /* placeholders, bar tracks */
  background: #F1EEE5;                          /* Pure White — Staff face */
  color: #1E2024;
}
.section--bone .placeholder {
  background:
    repeating-linear-gradient(135deg, rgba(30,32,36,0.05) 0 1px, transparent 1px 9px),
    var(--card-warm);
}
.section--bone .bar-row .track { background: rgba(30,32,36,0.10); }
.section--bone .bar-row .fill  { background: var(--crimson); }
.section--bone .bar-row .pct   { color: var(--bone-soft); opacity: 1; }
.section--bone { padding-bottom: 96px; }
/* Last item inside a bone section keeps breathing room above the bone edge */
.section--bone > *:last-child { margin-bottom: 0; }
figure { margin: 0; }
figure img { display: block; width: 100%; height: auto; }
figure.bleed { margin-left: calc(-1 * var(--gutter)); margin-right: calc(-1 * var(--gutter)); }
figure.tall { aspect-ratio: 3 / 4; overflow: hidden; }
figure.tall img { width: 100%; height: 100%; object-fit: cover; }
figure.wide { aspect-ratio: 16 / 9; overflow: hidden; }
figure.wide img { width: 100%; height: 100%; object-fit: cover; }
figure.sq { aspect-ratio: 1 / 1; overflow: hidden; }
figure.sq img { width: 100%; height: 100%; object-fit: cover; }

figcaption {
  font-family: var(--support);
  font-size: 10.5px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--bone-mute);
  padding: 14px 0 0;
  display: flex;
  justify-content: space-between;
  gap: 24px;
  font-weight: 500;
}

/* Image placeholder */
.placeholder {
  position: relative;
  background:
    repeating-linear-gradient(135deg, rgba(236,236,232,0.04) 0 1px, transparent 1px 9px),
    var(--card-warm);
  color: var(--bone-mute);
  border: 0.5px solid var(--rule);
}
.placeholder::after {
  content: attr(data-label);
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--canela);
  font-style: italic;
  font-size: 13px;
  letter-spacing: 0.04em;
  color: var(--bone-mute);
  text-align: center;
  padding: 24px;
  white-space: pre-line;
}

/* ===== §04 Programme: day blocks + timeline ===== */
.day-block { margin-top: 64px; }
.day-block:first-of-type { margin-top: 0; }

.day-head {
  display: grid;
  grid-template-columns: 130px 1fr auto;
  gap: 28px;
  align-items: baseline;
  padding-bottom: 22px;
  border-bottom: 0.5px solid var(--rule);
}
.day-head .day-num {
  font-family: var(--support);
  font-weight: 500;
  font-style: normal;
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--bone-mute);
  font-variant-numeric: tabular-nums;
}
.day-head .day-name {
  font-family: var(--canela);
  font-size: 40px;
  line-height: 1;
  letter-spacing: -0.012em;
  color: var(--crimson);
}
.day-head .day-name em { font-style: italic; }
.day-head .day-date {
  font-family: var(--support);
  font-size: 10.5px;
  letter-spacing: 0.36em;
  text-transform: uppercase;
  color: var(--bone-mute);
  font-weight: 500;
}
.day-line {
  font-family: var(--canela);
  font-style: italic;
  font-size: 21px;
  line-height: 1.4;
  color: var(--bone-soft);
  margin: 22px 0 32px;
  max-width: 58ch;
}

.timeline { margin-top: 4px; }
.tl-row {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: 28px;
  padding: 20px 0;
  border-bottom: 0.5px dashed var(--rule);
  align-items: baseline;
}
.tl-row:last-child { border-bottom: 0; }
.tl-time {
  font-family: var(--support);
  font-weight: 500;
  font-style: normal;
  font-size: 12px;
  letter-spacing: 0.06em;
  color: var(--bone-mute);
  font-variant-numeric: tabular-nums;
  padding-top: 6px;
}
.tl-body { display: flex; flex-direction: column; gap: 6px; }
.tl-head {
  font-family: var(--canela);
  font-size: 23px;
  line-height: 1.15;
  letter-spacing: -0.005em;
  color: var(--bone);
}
.tl-head em { font-style: italic; }
.tl-desc {
  font-family: var(--canela);
  font-style: italic;
  font-size: 16px;
  line-height: 1.5;
  color: var(--bone-soft);
}

/* ===== §05 Partners as moments ===== */
.partner-block {
  display: grid;
  grid-template-columns: 0.85fr 1.4fr;
  gap: 48px;
  align-items: start;
  padding: 44px 0;
  border-top: 0.5px solid var(--rule);
}
.partner-block:last-of-type { border-bottom: 0.5px solid var(--rule); }
.partner-block .partner-name {
  font-family: var(--canela);
  font-size: 30px;
  line-height: 1.08;
  letter-spacing: -0.01em;
  color: var(--bone);
}
.partner-block .partner-name em {
  font-style: italic;
  color: var(--emerald);
}
.partner-block .partner-role {
  font-family: var(--canela);
  font-style: italic;
  font-size: 14px;
  color: var(--bone-mute);
  margin-top: 8px;
}
.partner-block p.body { margin-top: 0; }

/* ===== §06 Nights — portrait grid ===== */
.nights-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px 28px;
  margin-top: 56px;
}
.night {
  display: flex;
  flex-direction: column;
}
.night figure { aspect-ratio: 3 / 4; overflow: hidden; }
.night figure img { width: 100%; height: 100%; object-fit: cover; }
.night .night-meta {
  display: flex;
  justify-content: space-between;
  font-family: var(--support);
  font-size: 10.5px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--bone-mute);
  padding: 16px 0 8px;
  border-bottom: 0.5px solid var(--rule);
  font-weight: 500;
}
.night .night-artist {
  font-family: var(--canela);
  font-size: 28px;
  line-height: 1.1;
  margin: 14px 0 10px;
  letter-spacing: -0.008em;
  color: var(--bone);
}
.night .night-artist em { font-style: italic; }
.night .night-artist .with {
  display: block;
  font-family: var(--canela);
  font-style: italic;
  font-size: 14px;
  line-height: 1.3;
  color: var(--bone-mute);
  margin-top: 8px;
  letter-spacing: 0;
}
.night .night-desc {
  font-family: var(--canela);
  font-style: italic;
  font-size: 16px;
  line-height: 1.45;
  color: var(--bone-soft);
  max-width: 30ch;
}

/* ===== §07 The Room — data ===== */
.data-block {
  margin-top: 56px;
  padding: 40px 0;
  border-top: 0.5px solid var(--rule);
  border-bottom: 0.5px solid var(--rule);
}
.data-block + .data-block { margin-top: 40px; }
.data-block .data-label {
  font-family: var(--support);
  font-weight: 500;
  font-size: 10.5px;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--bone-mute);
  margin-bottom: 28px;
}
.bar-row {
  display: grid;
  grid-template-columns: 220px 1fr 60px;
  gap: 22px;
  align-items: center;
  padding: 13px 0;
  border-bottom: 0.5px dashed var(--rule);
}
.bar-row:last-child { border-bottom: 0; }
.bar-row .label {
  font-family: var(--canela);
  font-size: 19px;
  line-height: 1.2;
  color: var(--bone);
}
.bar-row .label em { font-style: italic; }
.bar-row .track {
  height: 1.5px;
  background: rgba(241,238,229,0.10);
  position: relative;
}
.bar-row .fill {
  position: absolute;
  inset: 0 auto 0 0;
  background: var(--silver);
  height: 100%;
}
.bar-row .pct {
  font-family: var(--support);
  font-weight: 500;
  font-style: normal;
  font-size: 12px;
  letter-spacing: 0.04em;
  color: var(--silver);
  text-align: right;
  font-variant-numeric: tabular-nums;
  opacity: 0.95;
}

/* ===== §08 Stay — room cards ===== */
.room {
  padding: 40px 0;
  border-top: 0.5px solid var(--rule);
  display: grid;
  grid-template-columns: 0.9fr 1.3fr 0.8fr;
  gap: 40px;
  align-items: start;
}
.room:last-of-type { border-bottom: 0.5px solid var(--rule); }
.room .room-num {
  font-family: var(--support);
  font-weight: 500;
  font-style: normal;
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--bone-mute);
  font-variant-numeric: tabular-nums;
}
.room .room-name {
  font-family: var(--canela);
  font-size: 32px;
  line-height: 1.05;
  letter-spacing: -0.012em;
  margin-top: 6px;
  color: var(--bone);
}
.room .room-name em { font-style: italic; }
.room .room-line {
  font-family: var(--canela);
  font-style: italic;
  font-size: 18px;
  line-height: 1.45;
  color: var(--bone-soft);
  margin-bottom: 18px;
}
.room .room-spec {
  font-family: var(--support);
  font-weight: 400;
  font-size: 11.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--bone-mute);
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-style: normal;
}
.room .room-price { text-align: right; }
.room .room-price .price {
  font-family: var(--support);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.2;
  letter-spacing: 0.04em;
  color: var(--bone);
  font-variant-numeric: tabular-nums;
}
.room .room-price .price-meta {
  font-family: var(--support);
  font-weight: 400;
  font-size: 10.5px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--bone-mute);
  margin-top: 6px;
}

.includes {
  margin-top: 64px;
  padding-top: 36px;
  border-top: 0.5px solid var(--rule);
}
.includes .label {
  font-family: var(--support);
  font-weight: 500;
  font-size: 10.5px;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--bone-mute);
  margin-bottom: 20px;
}
.includes .list {
  font-family: var(--canela);
  font-size: 18px;
  line-height: 1.55;
  color: var(--bone);
  max-width: 60ch;
}
.includes .list em { font-style: italic; color: var(--bone-soft); }

/* Arrival by tender — subgroup list inside an .includes block */
.includes .arrival-groups {
  margin-top: 28px;
  display: grid;
  gap: 22px;
}
.includes .arrival-group .arrival-head {
  font-family: var(--canela);
  font-weight: 500;
  font-size: 17px;
  color: var(--bone);
  margin-bottom: 4px;
}
.includes .arrival-group .arrival-body {
  font-family: var(--canela);
  font-size: 17px;
  line-height: 1.5;
  color: var(--bone-soft);
}
.includes .arrival-note {
  margin: 28px 0 0;
  font-family: var(--canela);
  font-style: italic;
  font-size: 15px;
  line-height: 1.5;
  color: var(--bone-mute);
  max-width: 60ch;
}
@media (max-width: 880px) {
  .includes .arrival-group .arrival-head { font-size: 19px; }
  .includes .arrival-group .arrival-body { font-size: 19px; }
  .includes .arrival-note { font-size: 16px; }
}

/* ===== §09 Pass options ===== */
.pass {
  display: grid;
  grid-template-columns: 130px 1fr auto;
  gap: 32px;
  padding: 36px 0;
  border-top: 0.5px solid var(--rule);
  align-items: baseline;
}
.pass:last-of-type { border-bottom: 0.5px solid var(--rule); }
.pass .pass-num {
  font-family: var(--support);
  font-weight: 500;
  font-style: normal;
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--bone-mute);
  font-variant-numeric: tabular-nums;
}
.pass .pass-body { display: flex; flex-direction: column; gap: 10px; }
.pass .pass-name {
  font-family: var(--canela);
  font-size: 26px;
  line-height: 1.1;
  letter-spacing: -0.008em;
  color: var(--bone);
}
.pass .pass-name em {
  font-style: italic;
  color: var(--silver);
}
.pass .pass-access {
  font-family: var(--canela);
  font-style: italic;
  font-size: 17px;
  line-height: 1.4;
  color: var(--bone-soft);
}
.pass .pass-price { text-align: right; }
.pass .pass-price .num {
  font-family: var(--support);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.2;
  letter-spacing: 0.04em;
  color: var(--bone);
  font-variant-numeric: tabular-nums;
}
.pass .pass-price .per {
  font-family: var(--support);
  font-weight: 400;
  font-size: 10.5px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--bone-mute);
  margin-top: 6px;
}

/* ===== §10 Partners grid ===== */
.partners-grid {
  margin-top: 56px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 0.5px solid var(--rule);
  border-left: 0.5px solid var(--rule);
}
.partners-grid .partner-cell {
  border-right: 0.5px solid var(--rule);
  border-bottom: 0.5px solid var(--rule);
  aspect-ratio: 4 / 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px;
  text-align: center;
  gap: 8px;
}

/* Logo variant — single sponsor band; logos sit on one horizontal axis
   with equalised optical weight (cap heights, not box heights). */
.partners-grid--logos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 24px 20px;
  border: 0;
  padding: 36px 0;
  border-top: 0.5px solid var(--rule);
  border-bottom: 0.5px solid var(--rule);
}
.partners-grid--logos .partner-cell {
  border: 0;
  aspect-ratio: auto;
  padding: 0;
  gap: 0;
  flex: 1 1 0;
  min-width: 0;
  height: 88px;
}
.partners-grid--logos .logo-wrap {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.partners-grid--logos .logo-wrap img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}
.partners-grid--logos .logo-wrap--wordmark .wordmark {
  font-family: var(--canela);
  font-weight: 500;
  font-size: 13px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--emerald);
  line-height: 1;
  padding-left: 0.22em;
  white-space: nowrap;
}
.partners-grid--logos .partner-cell:has(.logo-wrap--wordmark) { flex: 1.5 1 0; }
.partners-grid .partner-cell .pn {
  font-family: var(--canela);
  font-size: 24px;
  line-height: 1.1;
  letter-spacing: 0.005em;
  color: var(--bone);
}
.partners-grid .partner-cell .pn em {
  font-style: italic;
  color: var(--emerald);
}
.partners-grid .partner-cell .ps {
  font-family: var(--canela);
  font-style: italic;
  font-size: 12px;
  color: var(--bone-mute);
}

.partners-note {
  margin-top: 22px;
  font-family: var(--support);
  font-weight: 400;
  font-size: 10.5px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--bone-faint);
  text-align: center;
}

/* ===== §10 Partners — Tiered logo grid ===== */
.partners-tiered {
  margin-top: 56px;
  display: flex;
  flex-direction: column;
  gap: 52px;
}
.partner-tier-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding-bottom: 12px;
  margin-bottom: 24px;
  border-bottom: 0.5px solid rgba(30,32,36,0.16);
}
.partner-tier-head .tier-name {
  font-family: var(--support);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(30,32,36,0.78);
}
.partner-tier-head .tier-num {
  font-family: var(--support);
  font-weight: 500;
  font-size: 10.5px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(30,32,36,0.45);
  font-variant-numeric: tabular-nums;
}
.logo-grid {
  display: grid;
  gap: 14px;
}
.logo-grid--main      { grid-template-columns: repeat(2, 1fr); gap: 18px; }
.logo-grid--secondary { grid-template-columns: repeat(3, 1fr); }
.logo-grid--service   { grid-template-columns: repeat(5, 1fr); gap: 10px; }
.logo-grid--curated   { display: flex; justify-content: center; }

.logo-slot {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 28px;
  background: rgba(30,32,36,0.02);
  border: 0.5px solid rgba(30,32,36,0.10);
}
.logo-grid--main .logo-slot      { height: 200px; padding: 32px 36px; }
.logo-grid--secondary .logo-slot { height: 92px; padding: 16px 18px; }
.logo-grid--service .logo-slot   { height: 62px; padding: 10px 12px; }
.logo-grid--curated .logo-slot   { height: 110px; width: 220px; padding: 16px 22px; }

.logo-slot .logo-wrap {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.logo-slot .logo-wrap img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}

/* Empty placeholder cell — hairline striped pattern with text */
.logo-slot.empty {
  position: relative;
  background:
    repeating-linear-gradient(135deg, rgba(30,32,36,0.05) 0 1px, transparent 1px 9px),
    rgba(30,32,36,0.025);
  border-style: dashed;
  border-color: rgba(30,32,36,0.18);
}
.logo-slot.empty::after {
  content: attr(data-label);
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-family: var(--support);
  font-size: 9.5px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(30,32,36,0.42);
  padding: 6px;
  white-space: pre-line;
}

/* Curated by — centered hairline rule + label, then the single slot */
.partner-tier--curated { margin-top: 16px; }
.curated-rule {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 22px;
}
.curated-rule .line {
  flex: 1;
  height: 0.5px;
  background: rgba(30,32,36,0.18);
}
.curated-rule .label {
  font-family: var(--canela);
  font-style: italic;
  font-size: 18px;
  color: rgba(30,32,36,0.72);
  letter-spacing: 0.01em;
}

/* ===== §11 Apply ===== */
.apply { text-align: center; padding: 96px 0 24px; }
.apply .apply-mark { width: 88px; margin: 0 auto 28px; opacity: 0.95; }
.apply .apply-mark img { width: 100%; height: auto; display: block; }
.apply .apply-headline {
  font-family: var(--canela);
  font-size: clamp(40px, 5.5vw, 60px);
  line-height: 1.05;
  letter-spacing: -0.014em;
  max-width: 18ch;
  margin: 24px auto 32px;
  color: var(--bone);
}
.apply .apply-headline em { font-style: italic; }
.apply p.body {
  margin: 0 auto 44px;
  text-align: center;
  max-width: 50ch;
  color: var(--bone-soft);
  font-family: var(--canela);
  font-style: italic;
  font-size: 19px;
  line-height: 1.5;
}
.apply .apply-cta {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  padding: 20px 32px;
  font-family: var(--support);
  font-size: 11px;
  letter-spacing: 0.42em;
  text-transform: uppercase;
  color: var(--card);
  background: var(--bone);
  font-weight: 600;
}
.apply .apply-cta::after { content: "→"; font-size: 14px; }
.apply .contact {
  margin-top: 64px;
  display: flex;
  justify-content: center;
  gap: 40px;
  font-family: var(--support);
  font-weight: 400;
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--bone-mute);
}

/* Concierge block — tail-end of the apply section */
.apply .concierge {
  margin-top: 56px;
  padding-top: 40px;
  border-top: 0.5px solid var(--rule);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 4px;
}
.apply .concierge .conc-label {
  font-family: var(--canela);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--bone-mute);
  margin-bottom: 16px;
}
.apply .concierge .conc-house {
  font-family: var(--canela);
  font-weight: 500;
  font-size: 18px;
  color: var(--bone);
}
.apply .concierge .conc-name {
  font-family: var(--canela);
  font-style: italic;
  font-size: 22px;
  color: var(--bone);
  margin-top: 2px;
}
.apply .concierge .conc-line {
  font-family: var(--canela);
  font-size: 16px;
  color: var(--bone-soft);
  letter-spacing: 0.01em;
  margin-top: 2px;
}
.apply .concierge .conc-line a { color: inherit; text-decoration: none; }
.apply .concierge .conc-note {
  margin: 18px 0 0;
  font-family: var(--canela);
  font-style: italic;
  font-size: 14px;
  color: var(--bone-mute);
}

/* ===== Card colophon (footer) ===== */
.colophon {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: end;
  padding: 96px var(--gutter) 64px;
  font-family: var(--support);
  font-size: 10.5px;
  letter-spacing: 0.36em;
  text-transform: uppercase;
  color: var(--bone-mute);
  gap: 32px;
  font-weight: 500;
}
.colophon .left, .colophon .right { display: flex; flex-direction: column; gap: 8px; }
.colophon .right { text-align: right; }
.colophon .mark-footer { width: 48px; opacity: 0.85; }
.colophon .mark-footer img { width: 100%; height: auto; display: block; }

/* ===== Brow (between hero and §02) ===== */
.brow {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 40px var(--gutter) 0;
  font-family: var(--support);
  font-size: 10.5px;
  letter-spacing: 0.36em;
  text-transform: uppercase;
  color: var(--bone-mute);
  gap: 32px;
  font-weight: 500;
}
.brow .b-right { text-align: right; }
.brow .b-mark { width: 28px; }
.brow .b-mark img { width: 100%; height: auto; display: block; }

/* ===== Responsive ===== */
@media (max-width: 880px) {
  :root { --gutter: 24px; --section-gap: 72px; }
  body { font-size: 20px; line-height: 1.55; }
  .card { margin: 0 auto; box-shadow: none; }
  body::before { display: none; }
  .hero { height: 760px; }
  .two-col, .partner-block { grid-template-columns: 1fr; gap: 24px; }
  .nights-grid { grid-template-columns: 1fr; }
  .partners-grid { grid-template-columns: repeat(2, 1fr); }
  .room { grid-template-columns: 1fr; gap: 16px; }
  .room .room-price { text-align: left; }
  .pass { grid-template-columns: auto 1fr; }
  .pass .pass-price { grid-column: 2; text-align: left; }
  .day-head { grid-template-columns: 1fr; gap: 10px; padding-bottom: 18px; }
  .bar-row { grid-template-columns: 1fr 70px; }
  .bar-row .track { grid-column: 1 / -1; order: 3; }
  .colophon { grid-template-columns: 1fr; text-align: center; padding: 64px var(--gutter) 48px; }
  .colophon .right, .colophon .left { text-align: center; align-items: center; }
  .brow { grid-template-columns: 1fr; justify-items: center; text-align: center; padding-top: 32px; }
  .brow .b-right { text-align: center; }

  /* ===== iPhone-readable text ============================
     Bumped: nothing under 15px. Tracked-label minimum 15px,
     body prose 20px, descriptions 20px, display sizes scaled
     up so hierarchy holds. */
  .meta                              { font-size: 16px; }
  .smallcaps                         { font-size: 15px; letter-spacing: 0.24em; }
  .meta-num                          { font-size: 16px; }
  .section-num                       { font-size: 16px; padding-top: 8px; letter-spacing: 0.20em; }
  .section-title .kicker             { font-size: 15px; letter-spacing: 0.26em; }
  .hero-top                          { font-size: 14px; letter-spacing: 0.26em; }
  .hero-dates .top                   { font-size: 22px; }
  .hero-dates .roman                 { font-size: 15px; letter-spacing: 0.26em; }
  .scroll-cue                        { font-size: 14px; letter-spacing: 0.28em; }
  .pullquote p                       { font-size: 26px; line-height: 1.3; }
  .pullquote .attr                   { font-size: 15px; letter-spacing: 0.22em; }
  figcaption                         { font-size: 15px; letter-spacing: 0.20em; }
  .day-head .day-num                 { font-size: 16px; letter-spacing: 0.20em; }
  .day-head .day-name                { font-size: 36px; }
  .day-head .day-date                { font-size: 15px; letter-spacing: 0.22em; }
  .day-line                          { font-size: 22px; margin: 20px 0 28px; }
  .tl-row                            { grid-template-columns: 1fr; gap: 8px; padding: 20px 0; }
  .tl-time                           { font-size: 16px; letter-spacing: 0.10em; padding-top: 0; color: var(--crimson); }
  .tl-head                           { font-size: 24px; }
  .tl-desc                           { font-size: 20px; line-height: 1.45; }
  .night-meta                        { font-size: 15px; letter-spacing: 0.20em; }
  .night-artist                      { font-size: 34px; }
  .night-artist .with                { font-size: 18px; }
  .night-desc                        { font-size: 20px; max-width: none; }
  .data-label                        { font-size: 15px; letter-spacing: 0.24em; }
  .bar-row .label                    { font-size: 20px; }
  .bar-row .pct                      { font-size: 17px; }
  .room-num                          { font-size: 16px; letter-spacing: 0.20em; }
  .room-name                         { font-size: 32px; }
  .room-line                         { font-size: 20px; }
  .room-spec                         { font-size: 15px; letter-spacing: 0.10em; }
  .room-price .price                 { font-size: 22px; }
  .room-price .price-meta            { font-size: 15px; letter-spacing: 0.20em; }
  .includes .label                   { font-size: 15px; letter-spacing: 0.24em; }
  .includes .list                    { font-size: 20px; }
  .pass-num                          { font-size: 16px; letter-spacing: 0.20em; }
  .pass-name                         { font-size: 28px; }
  .pass-access                       { font-size: 19px; }
  .pass-price .num                   { font-size: 22px; }
  .pass-price .per                   { font-size: 15px; letter-spacing: 0.20em; }
  .partner-tier-head .tier-name      { font-size: 16px; letter-spacing: 0.20em; }
  .partner-tier-head .tier-num       { font-size: 15px; letter-spacing: 0.16em; }
  .partners-note                     { font-size: 15px; letter-spacing: 0.20em; }
  .apply .contact                    { font-size: 16px; letter-spacing: 0.16em; gap: 18px; flex-direction: column; align-items: center; }
  .apply .concierge .conc-label      { font-size: 14px; letter-spacing: 0.36em; }
  .apply .concierge .conc-house      { font-size: 20px; }
  .apply .concierge .conc-name       { font-size: 24px; }
  .apply .concierge .conc-line       { font-size: 17px; }
  .apply .concierge .conc-note       { font-size: 15px; }
  .colophon                          { font-size: 15px; letter-spacing: 0.20em; }
  .brow                              { font-size: 15px; letter-spacing: 0.20em; gap: 18px; }
  p.lede                             { font-size: 24px; line-height: 1.4; }
  p.body                             { font-size: 20px; line-height: 1.6; }
  .partner-block .partner-name       { font-size: 30px; }
  .partner-block .partner-role       { font-size: 17px; }
  .apply .apply-headline             { font-size: 44px; }
  .apply p.body                      { font-size: 21px; }

  /* Tighten the partner-logo grids so they don't squeeze tiny */
  .logo-grid--main      { grid-template-columns: 1fr; gap: 14px; }
  .logo-grid--main .logo-slot      { height: 160px; padding: 24px 28px; }
  .logo-grid--secondary { grid-template-columns: repeat(2, 1fr); }
  .logo-grid--secondary .logo-slot { height: 80px; }
  .logo-grid--service   { grid-template-columns: repeat(2, 1fr); }
  .logo-grid--service .logo-slot   { height: 56px; }

  /* Diamond rule shows less aggressively on small screens */
  .diamond-rule { padding: 56px 0 16px; }
}

/* ===== Print — Chromium PDF export ===== */
@page {
  size: A4;
  margin: 0;
}

@media print {
  body { background: var(--card); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  body::before { display: none; }
  .card { margin: 0 auto; max-width: 100%; box-shadow: none; }
  figure, .room, .pass, .partner-block, .data-block, .night, .day-block { break-inside: avoid; }
  .section-head { break-after: avoid; }
  .hero { height: 100vh; page-break-after: always; }
}