/* Mensthetic production typography.
 * Loaded after page-specific styles and intentionally scoped away from admin/study pages.
 */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url('../fonts/manrope-latin-variable.woff2') format('woff2');
}

body.menst-refined,
body.shop-page,
body.booking-brand-page {
  font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  font-kerning: normal;
}

/* Controls do not inherit the body face consistently across browsers. */
.menst-refined :where(button, input, select, textarea),
.shop-page :where(button, input, select, textarea),
body.booking-brand-page :where(button, input, select, textarea) {
  font-family: inherit;
}

/* One family throughout; explicit because earlier component styles name Inter. */
.menst-refined :where(h1, h2, h3, h4, h5, h6, .ebook-title),
.shop-page :where(h1, h2, h3, h4, h5, h6),
body.booking-brand-page :where(h1, h2, h3, h4, h5, h6) {
  font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* The approved hierarchy uses one restrained semibold heading weight. */
.menst-refined :where(h1, h2, h3, h4, h5, h6),
.shop-page :where(h1, h2, h3, h4, h5, h6),
body.booking-brand-page :where(h1, h2, h3, h4, h5, h6) {
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-wrap: balance;
}

/* Tight tracking is reserved for display headings that stay at least 32px. */
.menst-refined h1,
.shop-page .shop-intro h1 {
  letter-spacing: -0.02em !important;
}

/* The ebook offer has intentionally self-contained legacy font shorthands. */
.menst-refined .hair-guide-nav,
body.menst-refined #hair-guide-dialog,
body.menst-refined #hair-guide-dialog h2,
body.menst-refined #hair-guide-dialog p,
body.menst-refined #hair-guide-dialog button,
body.menst-refined #hair-guide-dialog .hair-guide-kicker {
  font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* Match the specificity of earlier important card/ebook heading declarations. */
.menst-refined .performance-packs .pack-item h3,
.menst-refined .ebook-card .ebook-panel h2 {
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

/* Text fallbacks retain the selected 650 brand weight where no image mark is used. */
.menst-refined .logo,
.shop-page .shop-wordmark,
body.booking-brand-page .wordmark {
  font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-weight: 650 !important;
  letter-spacing: 0.03em;
}

/* The outlined wordmark has an 8.81:1 canvas; the profile shares its cap height. */
.menst-refined .logo,
.shop-page .shop-wordmark,
body.booking-brand-page .wordmark {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  min-height: 44px;
}

.menst-refined .logo .menst-brand-logo,
.shop-page .shop-wordmark .menst-brand-logo,
body.booking-brand-page .wordmark .menst-brand-logo {
  display: block;
  width: 172px;
  max-width: none;
  height: auto;
  flex: 0 0 auto;
}

@media (max-width: 767px) {
  .menst-refined .logo .menst-brand-logo,
  .shop-page .shop-wordmark .menst-brand-logo,
  body.booking-brand-page .wordmark .menst-brand-logo {
    width: 148px;
  }
}
