/* Maison M shared typography scale
   Display and editorial text: Fraunces
   Navigation, labels, controls and supporting copy: Be Vietnam Pro */
:root {
  --type-page-title: 50px;
  --type-section-title: 36px;
  --type-card-title: 27px;
  --type-lead: 18px;
  --type-body: 17px;
  --type-label: 15px;
  --type-meta: 13px;
}

body {
  font-family: 'Be Vietnam Pro', sans-serif;
  font-size: 16px;
}

main h1,
.page > .hero h1,
.locations-hero h1,
.facility-hero h1 {
  font-family: 'Fraunces', serif !important;
  font-size: var(--type-page-title) !important;
  font-weight: 600 !important;
  line-height: 1.04 !important;
  letter-spacing: 0 !important;
}

main section > h2,
main section > div > h2,
.section-head h2,
.section-panel-head h2,
.room-list-head h2,
.photo-library-head h2,
.quick-map-copy h2,
.base-map-copy h2,
.quick-book-copy h2,
.location-details h2,
.audience-section h2,
.faq-section h2,
.rules-actions h2 {
  font-family: 'Fraunces', serif !important;
  font-size: var(--type-section-title) !important;
  font-weight: 600 !important;
  line-height: 1.1 !important;
  letter-spacing: 0 !important;
}

.booking-main > h2,
.about .booking-main > h2 {
  font-family: 'Fraunces', serif !important;
  font-size: var(--type-section-title) !important;
  font-weight: 600 !important;
  line-height: 1.1 !important;
  letter-spacing: 0 !important;
}

.booking-policy h3,
.room-card h3,
.booking-result h3 {
  font-family: 'Fraunces', serif !important;
  font-size: var(--type-card-title) !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
}

main article h2,
main article h3,
.service-card h2,
.guide-card h2,
.contact-card h2,
.rules-group h2,
.location-card h3,
.coming h3,
.room-copy > b,
.room-name,
.value-card h3,
.stay-info h3 {
  font-family: 'Fraunces', serif !important;
  font-size: var(--type-card-title) !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
  letter-spacing: 0 !important;
}

html body main .location-rate-card h3,
html body main .rate-card h3,
html body main .facility-rate-head h3 {
  font-family: 'Fraunces', serif !important;
  font-size: var(--type-card-title) !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
}

.page > .hero > div > p:not(.kicker):not(.eyebrow),
.page-hero > div > p:not(.kicker):not(.eyebrow),
.locations-hero p:not(.eyebrow),
.section-head > p,
.room-list-head > p,
.photo-library-head > p,
.hero-summary p,
.story-subtitle {
  font-size: var(--type-lead) !important;
  line-height: 1.55 !important;
}

main p:not(.kicker):not(.eyebrow):not(.detail-kicker):not(.story-label):not(.location-card-label):not(.fine-print):not(.unified-footer-tagline),
main li,
.facility-hero .hero-copy > p:not(.facility-label),
.booking-main > p,
.room-desc,
.rules-intro,
.rules-group li,
.contact-card p,
.guide-card p,
.service-card p {
  font-size: var(--type-body) !important;
  font-weight: 500 !important;
  line-height: 1.6 !important;
  letter-spacing: 0 !important;
}

.booking-main > p,
.booking-policy p,
.booking-policy li,
.room-card p,
.booking-result p {
  font-size: var(--type-body) !important;
  font-weight: 500 !important;
  line-height: 1.6 !important;
}

.booking-form label,
.bf-row label,
.booking-field label {
  font-family: 'Be Vietnam Pro', sans-serif !important;
  font-size: var(--type-meta) !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  letter-spacing: .08em !important;
}

/* Dynamic availability cards, including long-stay results. */
.availability-head b {
  font-family: 'Fraunces', serif !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
}

.availability-head span {
  font-family: 'Be Vietnam Pro', sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
}

.room-status-facility {
  font-family: 'Be Vietnam Pro', sans-serif !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  letter-spacing: .05em !important;
}

.room-status-pick {
  font-family: 'Fraunces', serif !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
}

.room-status-copy small {
  font-family: 'Be Vietnam Pro', sans-serif !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
}

.room-status-gallery,
.room-status-select,
.slot-chip.requested {
  font-family: 'Be Vietnam Pro', sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

.slot-chip.requested {
  min-height: 48px;
}

.kicker,
.eyebrow,
.detail-kicker,
.story-label,
.facility-label,
.section-kicker,
.service-card > span,
.guide-card > span,
.contact-card .label,
.rules-group > span {
  font-family: 'Be Vietnam Pro', sans-serif !important;
  font-size: var(--type-label) !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase;
}

main small,
.room-meta,
.room-features,
.fine-print,
.detail-note,
.rate-item span,
.rate-notes span,
.modal-meta,
.modal-spec small,
.bf-hint {
  font-family: 'Be Vietnam Pro', sans-serif !important;
  font-size: var(--type-meta) !important;
  line-height: 1.5 !important;
  letter-spacing: 0 !important;
}

label,
input,
select,
button,
.btn,
.room-link,
.book-button,
.location-cta,
.facility-section-tabs a {
  font-family: 'Be Vietnam Pro', sans-serif !important;
}

@media (max-width: 760px) {
  :root {
    --type-page-title: 38px;
    --type-section-title: 30px;
    --type-card-title: 24px;
    --type-lead: 17px;
    --type-body: 16px;
    --type-label: 13px;
    --type-meta: 12px;
  }

  html body main h1,
  html body .page > .hero h1,
  html body .page-hero h1,
  html body .locations-hero h1,
  html body .facility-hero h1 {
    font-size: var(--type-page-title) !important;
    line-height: 1.06 !important;
  }

  html body main section > h2,
  html body main section > div > h2,
  html body .detail-title,
  html body .brand-intro h2,
  html body .section-head h2,
  html body .section-panel-head h2,
  html body .room-list-head h2,
  html body .photo-library-head h2,
  html body .quick-map-copy h2,
  html body .base-map-copy h2,
  html body .quick-book-copy h2,
  html body .location-details h2,
  html body .audience-section h2,
  html body .faq-section h2,
  html body .rules-actions h2 {
    font-size: var(--type-section-title) !important;
    line-height: 1.1 !important;
  }

  html body .booking-main > h2,
  html body .about .booking-main > h2 {
    font-size: var(--type-section-title) !important;
  }

  html body .booking-policy h3,
  html body .room-card h3,
  html body .booking-result h3 {
    font-size: var(--type-card-title) !important;
  }

  html body main article h2,
  html body main article h3,
  html body .service-card h2,
  html body .guide-card h2,
  html body .contact-card h2,
  html body .rules-group h2,
  html body .location-rate-card h3,
  html body .location-card h3,
  html body .coming h3,
  html body .room-copy > b,
  html body .room-name,
  html body .value-card h3,
  html body .stay-info h3 {
    font-size: var(--type-card-title) !important;
    line-height: 1.15 !important;
  }

  html body main .service-grid .service-card h2,
  html body main .guide-grid .guide-card h2,
  html body main .contact-grid .contact-card h2,
  html body main .rules-card .rules-group h2,
  html body main .location-rate-card h3,
  html body main .rate-card h3,
  html body main .facility-rate-head h3 {
    font-size: var(--type-card-title) !important;
  }

  html body .kicker,
  html body .eyebrow,
  html body .detail-kicker,
  html body .story-label,
  html body .facility-label,
  html body .section-kicker,
  html body .service-card > span,
  html body .guide-card > span,
  html body .contact-card .label {
    font-size: var(--type-label) !important;
  }

  html body main .service-grid .service-card > span,
  html body main .guide-grid .guide-card > span,
  html body main .contact-grid .contact-card .label {
    font-size: var(--type-label) !important;
  }

  html body main .hero .kicker,
  html body main .page-hero .eyebrow,
  html body main .facility-rate-card .kicker,
  html body main .loyalty .kicker {
    font-size: var(--type-label) !important;
  }

  html body .availability-head b { font-size: 18px !important; }
  html body .availability-head span { font-size: 13px !important; }
  html body .room-status-facility { font-size: 12px !important; }
  html body .room-status-pick { font-size: 20px !important; }
  html body .room-status-copy small { font-size: 15px !important; }
  html body .room-status-gallery,
  html body .room-status-select,
  html body .slot-chip.requested { font-size: 13px !important; }
}