/* MP Cup: event details use shared dates, rate shortcodes and native FAQs. */
@layer components {
  .mp-cup > * { grid-column: wide; }
  .mp-cup--hero { padding-block: 0; }
  .mp-cup--hero .mp-hero { grid-column: full; margin: 0; border-radius: 0; min-block-size: calc(var(--mp-space-3xl) * 5.5); }
  .mp-cup--hero .mp-hero__body { padding: var(--mp-space-2xl) max(var(--mp-gutter), calc((100% - var(--mp-w-max)) / 2)); background-image: var(--mp-scrim-even); }
  .mp-cup--hero .mp-hero__title { font-size: var(--mp-fs-display-2xl); max-inline-size: 100%; margin: 0; }
  .mp-cup--hero .mp-hero__title em { color: var(--mp-color-accent); }
  .mp-cup--hero .mp-hero__lede { max-inline-size: var(--mp-measure); color: var(--mp-color-text); }
  .mp-cup--hero .mp-hero__actions { margin-block-start: var(--mp-space-m); }
  .mp-cup__head { display: grid; gap: var(--mp-space-s) var(--mp-space-xl); align-items: end; }
  .mp-cup__head .mp-eyebrow { margin: 0 0 var(--mp-space-xs); }
  .mp-cup__heading { font-size: var(--mp-fs-display-l); margin: 0; }
  .mp-cup__lede { margin: 0; max-inline-size: var(--mp-measure); color: var(--mp-color-text-2); }
  .mp-cup__nav { display: flex; flex-wrap: wrap; gap: 0 var(--mp-space-l); padding-block-start: var(--mp-space-s); border-block-start: var(--mp-border) solid var(--mp-color-line); }
  .mp-cup__nav a { display: flex; align-items: center; gap: var(--mp-space-s); min-block-size: var(--mp-h-control); color: var(--mp-color-text); text-decoration: none; font-weight: var(--mp-weight-ui); font-size: var(--mp-fs-sm); }
  .mp-cup__nav a:hover { color: var(--mp-color-accent-text); }
  .mp-cup__fees { display: grid; gap: var(--mp-space-m); margin-block-start: var(--mp-space-l); }
  .mp-cup__fee { padding: var(--mp-space-card); border: var(--mp-border) solid var(--mp-color-line); border-radius: var(--mp-radius-md); background: var(--mp-color-surface-2); }
  .mp-cup__fee h3 { margin: 0 0 var(--mp-space-m); font-size: var(--mp-fs-display-s); }
  .mp-cup__prices { margin: 0; }
  .mp-cup__prices > div { display: flex; justify-content: space-between; align-items: baseline; gap: var(--mp-space-s); padding-block: var(--mp-space-s); border-block-end: var(--mp-border) solid var(--mp-color-line); }
  .mp-cup__prices dt { color: var(--mp-color-text-2); }
  .mp-cup__prices dd { margin: 0; text-align: right; font-weight: var(--mp-weight-ui); }
  .mp-cup__fee .mp-cup__prices dd { font-size: var(--mp-fs-lead); }
  .mp-cup__fee .mp-cup__prices > div:first-child dd { color: var(--mp-color-accent); }
  .mp-cup__small { font-size: var(--mp-fs-xs); color: var(--mp-color-text-2); margin: var(--mp-space-s) 0 0; }
  .mp-cup__fee-note { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--mp-space-m); }
  .mp-cup__fee-note p { max-inline-size: var(--mp-measure); margin: 0; color: var(--mp-color-text-2); font-size: var(--mp-fs-sm); }
  .mp-cup__classes { display: grid; gap: var(--mp-space-l); margin-block-start: var(--mp-space-xl); }
  .mp-cup__class-group { border-block-start: var(--mp-border) solid var(--mp-color-line); padding-block-start: var(--mp-space-m); }
  .mp-cup__class-group .mp-cup__small { margin: 0 0 var(--mp-space-2xs); }
  .mp-cup__class-group h3 { font-size: var(--mp-fs-display-s); margin: 0 0 var(--mp-space-s); }
  .mp-cup__class-group ul { list-style: none; padding: 0; margin: 0; }
  .mp-cup__class-group li { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: var(--mp-space-3xs) var(--mp-space-xs); padding-block: var(--mp-space-2xs); font-size: var(--mp-fs-sm); }
  .mp-cup__pay { color: var(--mp-color-accent-text); font-size: var(--mp-fs-xs); font-weight: var(--mp-weight-ui); }
  .mp-cup__note { margin-block-start: var(--mp-space-l); max-inline-size: var(--mp-measure); color: var(--mp-color-text-2); font-size: var(--mp-fs-sm); }
  .mp-cup__entry-status { padding: var(--mp-space-m) var(--mp-space-card); border-radius: var(--mp-radius-md); background: var(--mp-color-surface-2); }
  .mp-cup__entry-status p { margin: var(--mp-space-2xs) 0 0; color: var(--mp-color-text-2); }
  .mp-cup__entry-status .mp-link { display: inline-flex; align-items: center; min-block-size: var(--mp-h-control); margin-block-start: var(--mp-space-xs); }
  .mp-cup__steps { list-style: none; margin: var(--mp-space-l) 0 0; padding: 0; display: grid; gap: var(--mp-space-l); }
  .mp-cup__steps > li { display: grid; grid-template-columns: auto 1fr; gap: var(--mp-space-m); border-block-start: var(--mp-border) solid var(--mp-color-line); padding-block-start: var(--mp-space-m); }
  .mp-cup__step-no { font: var(--mp-weight-display) var(--mp-fs-display-s) / 1 var(--mp-font-display); color: var(--mp-color-text-2); }
  .mp-cup__steps h3 { margin: 0 0 var(--mp-space-xs); font-size: var(--mp-fs-display-xs); }
  .mp-cup__steps p { margin: 0; color: var(--mp-color-text-2); font-size: var(--mp-fs-sm); }
  .mp-cup__split { display: grid; gap: var(--mp-space-l) var(--mp-space-2xl); align-items: center; }
  .mp-cup__split .mp-cup__head { display: block; margin-block-end: var(--mp-space-m); }
  .mp-cup__list { list-style: disc; padding-inline-start: var(--mp-space-m); margin-block: var(--mp-space-m); }
  .mp-cup__list li + li { margin-block-start: var(--mp-space-xs); }
  .mp-cup__rental { padding: var(--mp-space-card); border-radius: var(--mp-radius-md); }
  .mp-cup__rental h3 { font-size: var(--mp-fs-display-s); margin: var(--mp-space-xs) 0; }
  .mp-cup__rental-price { font: var(--mp-weight-display) var(--mp-fs-display-s) / var(--mp-lh-tight) var(--mp-font-display); margin: var(--mp-space-m) 0 var(--mp-space-2xs); }
  .mp-cup__rental p:not([class]) { margin: 0; color: var(--mp-color-text-2); font-size: var(--mp-fs-sm); }
  .mp-cup__rental .mp-cup__list { font-size: var(--mp-fs-sm); margin-block-end: 0; }
  .mp-cup__weekend-grid { display: grid; gap: var(--mp-space-m); margin-block-start: var(--mp-space-l); }
  .mp-cup__info { background: var(--mp-color-surface-2); border-radius: var(--mp-radius-md); padding: var(--mp-space-card); }
  .mp-cup__info h3, .mp-cup__practical h3 { font-size: var(--mp-fs-display-xs); margin: 0 0 var(--mp-space-s); }
  .mp-cup__info p, .mp-cup__practical p { color: var(--mp-color-text-2); font-size: var(--mp-fs-sm); margin: var(--mp-space-s) 0; }
  .mp-cup__info .mp-cup__prices { font-size: var(--mp-fs-sm); }
  .mp-cup__info .mp-cup__prices > div { flex-wrap: wrap; padding-block: var(--mp-space-xs); }
  .mp-cup__info .mp-cup__free { color: var(--mp-color-accent-text); font-weight: var(--mp-weight-ui); margin-block-end: 0; }
  .mp-cup__hours { margin: var(--mp-space-m) 0 0; font-size: var(--mp-fs-sm); }
  .mp-cup__hours > div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--mp-space-2xs) var(--mp-space-s); padding-block: var(--mp-space-2xs); }
  .mp-cup__hours dd { margin: 0; }
  .mp-cup__practical { display: grid; gap: var(--mp-space-l); margin-block-start: var(--mp-space-xl); }
  .mp-cup__practical article { border-block-start: var(--mp-border) solid var(--mp-color-line); padding-block-start: var(--mp-space-m); }
  .mp-cup--faq .mp-faq { padding: 0; background: transparent; }
  @media (width >= 48rem) {
    .mp-cup__head { grid-template-columns: 1fr 1fr; }
    .mp-cup__fees, .mp-cup__split { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .mp-cup__classes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .mp-cup__steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .mp-cup__steps > li { display: block; }
    .mp-cup__step-no { display: block; margin-block-end: var(--mp-space-m); }
    .mp-cup__weekend-grid, .mp-cup__practical { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  }
  @media (width < 48rem) {
    .mp-cup--hero .mp-hero { min-block-size: calc(var(--mp-space-3xl) * 5); }
    .mp-cup--hero .mp-hero__title { font-size: var(--mp-fs-display-xl); }
    .mp-cup--hero .mp-hero__body { padding-block: var(--mp-space-xl); }
    .mp-cup--hero .mp-hero__actions .mp-btn { padding-inline: var(--mp-space-s); font-size: var(--mp-fs-sm); }
    .mp-cup__nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--mp-space-s); }
    .mp-cup__nav a { justify-content: space-between; border-block-end: var(--mp-border) solid var(--mp-color-line); }
  }
}
