/*
DEL MONACO V214 — TYPOGRAPHY REFERENCE SYSTEM
Reference masters supplied by client:
1) TITLE: About title ("A legacy of scent, craftsmanship, and excellence.")
2) BODY: About paragraph typography
3) EYEBROW: "ABOUT DEL MONACO"

Purpose:
- Normalize typography only.
- Preserve existing responsive font sizes/layout/spacing where possible.
- No new @import: reuse already-loaded Manrope and system serif fallback.
- Loaded last so legacy page-specific font-family rules cannot override it.
*/

:root{
  --dm214-title-font: Georgia, "Times New Roman", Times, serif;
  --dm214-body-font: "Manrope", Arial, Helvetica, sans-serif;
  --dm214-eyebrow-font: "Manrope", Arial, Helvetica, sans-serif;
}

/* =========================================================
   1. GLOBAL BODY COPY — reference: About paragraph
   ========================================================= */
html body main,
html body .site-footer{
  font-family:var(--dm214-body-font) !important;
}

html body main p,
html body main li,
html body main dd,
html body main dt,
html body main blockquote,
html body main figcaption,
html body main .hero-text,
html body main [class*="description"],
html body main [class*="copy"] > p,
html body main [class*="text"]:not(h1):not(h2):not(h3),
html body .site-footer p,
html body .site-footer li,
html body .site-footer a:not(.btn){
  font-family:var(--dm214-body-font) !important;
  font-weight:500 !important;
  font-style:normal;
}

/* Keep the About reference rhythm without forcing one universal font size. */
html body main p,
html body main .hero-text,
html body main [class*="description"],
html body main [class*="copy"] > p{
  line-height:1.72 !important;
  letter-spacing:-0.018em !important;
}

/* =========================================================
   2. TITLES — reference: About title
   All editorial/display headings use one serif identity.
   Existing responsive font sizes remain untouched.
   ========================================================= */
html body main h1,
html body main h2,
html body main h3,
html body main h4,
html body main [class*="title"]:not([class*="eyebrow"]):not([class*="kicker"]):not([class*="label"]),
html body main [class*="heading"],
html body main .card-caption h3,
html body main .product-card h3,
html body main .proof-card h3,
html body main .process-list strong,
html body .site-footer h2,
html body .site-footer h3{
  font-family:var(--dm214-title-font) !important;
  font-weight:700 !important;
  font-style:normal;
  letter-spacing:-0.035em !important;
}

/* Reference title is compact, elegant and editorial. */
html body main h1,
html body main h2,
html body main [class*="title"]:not([class*="eyebrow"]):not([class*="kicker"]):not([class*="label"]),
html body main [class*="heading"]{
  line-height:1.02 !important;
}

/* Gold/emphasis inside titles keeps exactly the same title font. */
html body main h1 em,
html body main h1 strong,
html body main h2 em,
html body main h2 strong,
html body main h3 em,
html body main h3 strong,
html body main [class*="title"] em,
html body main [class*="title"] strong{
  font-family:inherit !important;
  font-weight:inherit !important;
  font-style:normal !important;
}

/* =========================================================
   3. EYEBROW / SECTION HEADER — reference: ABOUT DEL MONACO
   ========================================================= */
html body main .eyebrow,
html body main [class*="eyebrow"],
html body main [class*="kicker"],
html body main .dm204-type-eyebrow,
html body main .dm189-kicker,
html body main .dm180-hero-kicker,
html body main .dm147-meta,
html body main .dm148-headline-row,
html body main .dm125-collection,
html body main .dm141-story-label,
html body main .dm148-panel-label{
  font-family:var(--dm214-eyebrow-font) !important;
  font-weight:700 !important;
  font-style:normal !important;
  text-transform:uppercase !important;
  letter-spacing:.075em !important;
  line-height:1.2 !important;
}

/* Do not enlarge the reference eyebrow; normalize only if a legacy page made it huge. */
html body main .eyebrow,
html body main [class*="eyebrow"],
html body main [class*="kicker"],
html body main .dm204-type-eyebrow{
  font-size:11px !important;
}

/* =========================================================
   PRODUCTS PAGE — remove Helvetica / Arial / Cormorant split
   while preserving the approved product-page layout.
   ========================================================= */
html body.dm200-products-page .dm200-hero h1,
html body.dm200-products-page .dm200-brand-title h2,
html body.dm200-products-page .dm200-section-head h2,
html body.dm200-products-page .dm200-hero-card strong,
html body.dm200-products-page h1,
html body.dm200-products-page h2,
html body.dm200-products-page h3{
  font-family:var(--dm214-title-font) !important;
  font-weight:700 !important;
}

html body.dm200-products-page .dm200-hero__copy > p,
html body.dm200-products-page p{
  font-family:var(--dm214-body-font) !important;
  font-weight:500 !important;
}

html body.dm200-products-page .dm200-eyebrow,
html body.dm200-products-page .dm200-brand-title > span,
html body.dm200-products-page .dm200-section-head > a,
html body.dm200-products-page .dm200-hero-card small{
  font-family:var(--dm214-eyebrow-font) !important;
}

/* =========================================================
   PRODUCT DETAIL ROUTES — normalize legacy generations
   ========================================================= */
html body[class*="dm-live-v125"] main h1,
html body[class*="dm-live-v125"] main h2,
html body[class*="dm-live-v125"] main h3,
html body[class*="dm-live-v14"] main h1,
html body[class*="dm-live-v14"] main h2,
html body[class*="dm-live-v14"] main h3,
html body[class*="dm-live-v15"] main h1,
html body[class*="dm-live-v15"] main h2,
html body[class*="dm-live-v15"] main h3{
  font-family:var(--dm214-title-font) !important;
}

html body[class*="dm-live-v125"] main p,
html body[class*="dm-live-v14"] main p,
html body[class*="dm-live-v15"] main p{
  font-family:var(--dm214-body-font) !important;
}

/* =========================================================
   HEADER / NAV / BUTTONS
   Keep their sizing/layout exactly as approved; only eliminate
   accidental font-family drift.
   ========================================================= */
html body .site-header .nav,
html body .site-header .nav a,
html body .site-header .nav-cta,
html body .site-header button,
html body main .btn,
html body main button,
html body main [class*="button"],
html body main [class*="actions"] a{
  font-family:var(--dm214-eyebrow-font) !important;
}

/* =========================================================
   RESPONSIVE TYPOGRAPHY
   Do not alter existing responsive title/body sizes.
   Only keep the reference type families consistent.
   ========================================================= */
@media (max-width:900px){
  html body main .eyebrow,
  html body main [class*="eyebrow"],
  html body main [class*="kicker"],
  html body main .dm204-type-eyebrow{
    font-size:10px !important;
    letter-spacing:.07em !important;
  }
}

@media (max-width:560px){
  html body main p,
  html body main .hero-text,
  html body main [class*="description"],
  html body main [class*="copy"] > p{
    line-height:1.68 !important;
  }
}