/* Marry Me typography source of truth
   Body/UI: Instrument Sans | Display: Fraunces | Brand M: Chopin Script */

@font-face {
  font-family: "MarryMeChopin";
  src: local("ChopinScript"), url("../fonts/ChopinScript.otf?v=clean3") format("opentype");
  font-style: normal;
  font-weight: 400;
  font-display: block;
  unicode-range: U+004D;
}

:root {
  --mm-font-body: "Instrument Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mm-font-display: "Fraunces", Georgia, serif;
}

html body,
html body p,
html body li,
html body label,
html body small,
html body input,
html body select,
html body textarea,
html body button,
html body table,
html body th,
html body td,
html body .nav-list,
html body .mm-nav-utilities,
html body .product-meta,
html body .price,
html body .price-block,
html body .footer-heading,
html body .footer-link,
html body .filter-toolbar,
html body .filter-panel,
html body .quick-browse,
html body .mm-shop-section,
html body .mm-content-page {
  font-family: var(--mm-font-body) !important;
}

html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6,
html body .main-title,
html body .section-title,
html body .presentation-title,
html body .product-name,
html body .er-title,
html body .mm-editorial-title,
html body .mm-cta-title,
html body .mm-craft-title,
html body .mm-collections-hero h1,
html body .mm-collection-tile h2,
html body .collection-label,
html body .mm-search-input,
html body .home-reviews-heading h2 {
  font-family: var(--mm-font-display) !important;
}

/* Header brand: real logo image + Chopin only on the two capital M letters. */
html body .nav-brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

html body .nav-brand-logo {
  display: block !important;
  width: 40px !important;
  height: 40px !important;
  flex: 0 0 40px !important;
  object-fit: contain !important;
  object-position: center !important;
}

html body .nav-brand-name {
  display: inline-flex !important;
  align-items: baseline !important;
  overflow: visible !important;
  white-space: nowrap !important;
  color: var(--mm-teal, #0B6B63) !important;
  line-height: 1 !important;
}

html body .brand-fancy-m,
html body .main-floating-nav.mm-static-header .brand-fancy-m {
  display: inline-block !important;
  overflow: visible !important;
  font-family: "MarryMeChopin" !important;
  font-style: normal !important;
  font-weight: 400 !important;
  font-synthesis: none !important;
  font-size: 2.78rem !important;
  line-height: .80 !important;
  letter-spacing: 0 !important;
  transform: translateY(.045em) !important;
}

html body .brand-fancy-m-second {
  margin-left: .08em !important;
}

html body .brand-rest,
html body .main-floating-nav.mm-static-header .brand-rest {
  font-family: var(--mm-font-body) !important;
  font-style: normal !important;
  font-weight: 400 !important;
  font-size: .95rem !important;
  line-height: 1 !important;
  letter-spacing: .01em !important;
  position: relative !important;
  top: -.16em !important;
}

/* Do not override icon-font stacks. */
.fa, .fas, .far, .fal, .fab,
[class^="fa-"], [class*=" fa-"] {
  font-family: "Font Awesome 6 Free", "Font Awesome 6 Brands" !important;
}

@media (max-width: 980px) {
  html body .nav-brand-logo {
    width: 36px !important;
    height: 36px !important;
    flex-basis: 36px !important;
  }
  html body .brand-fancy-m,
  html body .main-floating-nav.mm-static-header .brand-fancy-m {
    font-size: 2.42rem !important;
  }
  html body .brand-rest,
  html body .main-floating-nav.mm-static-header .brand-rest {
    font-size: .88rem !important;
  }
}

@media (max-width: 520px) {
  html body .nav-brand { gap: 6px !important; }
  html body .nav-brand-logo {
    width: 32px !important;
    height: 32px !important;
    flex-basis: 32px !important;
  }
  html body .brand-fancy-m,
  html body .main-floating-nav.mm-static-header .brand-fancy-m {
    font-size: 2.13rem !important;
  }
  html body .brand-rest,
  html body .main-floating-nav.mm-static-header .brand-rest {
    font-size: .80rem !important;
    top: -.14em !important;
  }
}