/* ==========================================================================
   Typography system (loaded last). Heading = var(--font-heading) (default Plus Jakarta Sans),
   body/UI/prices = var(--font-body) (default Inter). Both self-hosted, see css/fonts.css.
   Rules: no condensed fonts, no all-caps headings; uppercase only for tiny labels/badges and the
   ORDER NOW call-to-action; prices bold + tabular figures; product titles clamp to 2 lines.
   ========================================================================== */
:root{
  --fs-xs:12px; --fs-sm:13px; --fs-base:15px; --fs-md:16px;
  --fs-h1:clamp(24px,1.1rem + 1.6vw,38px);
  --fs-h2:clamp(20px,1rem + .9vw,28px);
  --fs-h3:clamp(16px,.95rem + .3vw,19px);
  --lh-tight:1.2; --lh-body:1.55;
  --tr-tight:-.015em; --tr-label:.08em;
}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--font-body);font-size:var(--fs-base);line-height:var(--lh-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-feature-settings:'kern','calt'}
@media (max-width:430px){body{font-size:14.5px}}

/* ---- Headings: one hierarchy everywhere, sentence case ---- */
h1,h2,h3,h4,h5{font-family:var(--font-heading);font-weight:700;line-height:var(--lh-tight);letter-spacing:var(--tr-tight);text-transform:none}
h1{font-size:var(--fs-h1)} h2{font-size:var(--fs-h2)} h3{font-size:var(--fs-h3)} h4{font-size:16px}
.hero h1,.hero-dark h1,.cat-hero h1,.offer-banner h2,.dotd h2,.flash-title h2,.story h2,.gb-copy h2,.city-copy h2,
.section-head h2,.theme-bright .section-head h2,.mk-head h2,.om-head h2,.cm-text b,.band-text b,.mega-promo-text b,.guarantee b,.cat-tile .cat-label strong{
  font-family:var(--font-heading);text-transform:none;letter-spacing:var(--tr-tight);font-weight:700}
.hero h1,.hero-dark h1{font-size:clamp(30px,1.2rem + 3vw,54px);line-height:1.08}
.cat-hero h1{font-size:clamp(26px,1rem + 2vw,40px)}
.offer-banner h2,.dotd h2,.flash-title h2,.story h2,.gb-copy h2{font-size:clamp(22px,1rem + 1.6vw,36px);text-shadow:none}
.city-copy h2{font-size:clamp(19px,.9rem + 1vw,26px)}
.section-head h2,.theme-bright .section-head h2,.mk-head h2{font-size:clamp(19px,.95rem + .8vw,25px)}
.om-head h2{font-size:19px}
.cm-text b,.band-text b,.mega-promo-text b{font-size:clamp(18px,.9rem + .8vw,24px);line-height:1.15}
.guarantee b{font-size:16px;line-height:1.3}
.cat-tile .cat-label strong{font-size:16px}
.mk-title{font-family:var(--font-heading);font-weight:800;letter-spacing:-.02em;line-height:1.12;font-size:clamp(20px,1rem + 1.5vw,34px)}
.mk-sub{font-size:clamp(13px,.8rem + .25vw,15px);line-height:1.45}
.offer-banner .big{letter-spacing:0}

/* ---- Small labels / eyebrows / badges: the only uppercase ---- */
.eyebrow,.mk-eyebrow,.dotd-eyebrow,.mega-h,.p-card .p-cat,.br-l,.mk-side-h,.om-totals-title,.pay-choice legend,.ap-amount small,.countdown small,.band-text small{
  font-family:var(--font-body);font-size:11px;font-weight:700;letter-spacing:var(--tr-label);text-transform:uppercase}
.pct-badge,.save-badge,.o-badge,.offer .o-badge,.badge,.p-badges span{font-family:var(--font-body);font-weight:700;letter-spacing:.02em}
.divider-title,.promo-label{font-family:var(--font-heading);text-transform:none;letter-spacing:-.01em;font-weight:700;font-size:16px}
.site-footer h4{font-family:var(--font-heading);text-transform:none;letter-spacing:0;font-size:15px;font-weight:700}
.cat-box h4{font-family:var(--font-heading);text-transform:none;letter-spacing:0;font-size:15px}
.ticker,.theme-bright .ticker{font-family:var(--font-body);text-transform:none;letter-spacing:0;font-weight:600;font-size:13px}

/* ---- Header, mega menu, drawer, bottom nav ---- */
.announce{font-size:12.5px;letter-spacing:0}
.mega-link{font-size:14px;font-weight:600;letter-spacing:0}
.hdr-act{font-size:13.5px;font-weight:600;letter-spacing:0}
.mk-side a,.mk-side li{font-size:14px}
.mk-card b{font-weight:700;font-size:14px;letter-spacing:-.005em}
input,select,textarea,button{font-family:var(--font-body)}

/* ---- Buttons: sentence case, bold, no tracking ---- */
.btn{font-family:var(--font-body);font-weight:700;letter-spacing:0;text-transform:none}
.btn-shopall,.btn-load{text-transform:none;letter-spacing:0;font-weight:700}
/* ORDER NOW: tidy uppercase with tracking */
.btn-order{font-family:var(--font-heading);text-transform:none}
.btn-order .row1,.btn-order-xl .row1{font-family:var(--font-heading);font-weight:800;font-size:18px;letter-spacing:.05em;text-transform:uppercase}
.btn-order-sub,.btn-order-xl .btn-order-sub{font-family:var(--font-body);font-weight:500;letter-spacing:0;text-transform:none;font-size:12.5px}
.btn-order-dark{font-family:var(--font-heading);font-weight:800;letter-spacing:.04em;text-transform:uppercase;font-size:15px}
@media (max-width:430px){.btn-order .row1,.btn-order-xl .row1{font-size:17px}}

/* ---- Prices & numbers: bold, tabular ---- */
.price,.compare,.pdp-price,.sb-price,.om-totals,.success-items,.order-no,.countdown,.countdown b,.pct-badge,.save-badge,.ct-off,.dotd-pct,[data-q],[data-live-total]{
  font-variant-numeric:tabular-nums lining-nums}
.price,.theme-bright .p-card .price{font-family:var(--font-body);font-weight:800;letter-spacing:-.01em}
.compare{font-weight:500}
.pdp-price .price{font-size:clamp(26px,1.2rem + 1vw,32px)}
.pdp-price .compare{font-size:16px}
.sticky-buy .sb-price strong{font-family:var(--font-body);font-weight:800;font-size:18px}
.order-no{font-family:var(--font-body);font-weight:800;letter-spacing:.04em}
.steps b{font-family:var(--font-heading);font-weight:800}

/* ---- Product cards: 2-line titles ---- */
.p-card h3,.theme-bright .p-card h3{font-family:var(--font-body);font-weight:500;font-size:14px;line-height:1.4;letter-spacing:0;
  display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.8em}
.p-card .price{font-size:17px}
@media (max-width:430px){.p-card h3,.theme-bright .p-card h3{font-size:13px}.p-card .price,.theme-bright .p-card .price{font-size:15.5px}}

/* ---- Product page ---- */
.pdp-info h1{font-family:var(--font-heading);font-weight:700;font-size:clamp(21px,1rem + 1vw,30px);line-height:1.25;letter-spacing:-.015em;text-transform:none}
.pdp-info p,.pdp-desc,.pdp-info li{line-height:1.6}

/* ---- Popup & success ---- */
.om-totals{font-size:14px}
.om-totals .grand{font-family:var(--font-heading);font-weight:800;font-size:17px}
.success-card h1{font-size:clamp(22px,1rem + 1.2vw,30px)}

/* ---- Store reviews ---- */
.sr-card blockquote{font-size:14.5px;line-height:1.55}