/* Furnixo-style typography (site-wide): Jost headings + Lato body */
@import url("https://fonts.googleapis.com/css2?family=Jost:wght@400;500;600;700&family=Lato:wght@400;700&display=swap");

:root {
  --cm-font-body: "Lato", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --cm-font-heading: "Jost", "Lato", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --cm-fs-body: 16px;
  --cm-lh-body: 1.7;
  --cm-fs-small: 14px;
  --cm-fs-h1: clamp(2rem, 3.2vw, 2.75rem);
  --cm-fs-h2: clamp(1.65rem, 2.4vw, 2.15rem);
  --cm-fs-h3: clamp(1.15rem, 1.5vw, 1.35rem);
  --cm-fs-nav: 15px;
  --cm-fs-btn: 13px;
}

html {
  font-size: 16px
}

body,
.cm-page,
.main-content,
.container,
.cm-wide {
  font-family: var(--cm-font-body) !important;
  font-size: var(--cm-fs-body);
  line-height: var(--cm-lh-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.display-1, .display-2, .display-3, .display-4, .display-5, .display-6,
.cm-center h2,
.cm-promo h3,
.cm-popular-card h3,
.cm-blog-text h3,
.cm-category-name,
.cm-brand-info h3,
.cm-quality-card h3,
.navbar .nav-link,
.cm-account-hero h1,
.cm-products-hero h1,
.cm-page-hero h1 {
  font-family: var(--cm-font-heading) !important;
  letter-spacing: .01em
}

h1, .h1, .display-5, .display-6 {
  font-size: var(--cm-fs-h1);
  font-weight: 600;
  line-height: 1.25
}

h2, .h2 {
  font-size: var(--cm-fs-h2);
  font-weight: 600;
  line-height: 1.3
}

h3, .h3 {
  font-size: var(--cm-fs-h3);
  font-weight: 600;
  line-height: 1.35
}

p, li, label, .form-control, .form-select, .text-muted, .cm-cat, .cm-price {
  font-family: var(--cm-font-body) !important;
  font-size: inherit
}

.navbar .nav-link,
.cm-account-nav a,
.cm-account-logout {
  font-family: var(--cm-font-heading) !important;
  font-size: var(--cm-fs-nav);
  font-weight: 500
}

.btn,
button,
.cm-add-cart,
.cm-promo-button,
.cm-blog-read,
.cm-explore-link {
  font-family: var(--cm-font-heading) !important;
  font-size: var(--cm-fs-btn);
  font-weight: 600;
  letter-spacing: .04em
}

.cm-eyebrow,
.badge {
  font-family: var(--cm-font-heading) !important;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .08em
}

.cm-blog-text p,
.cm-quality-card p,
.cm-center > p {
  font-size: var(--cm-fs-small);
  line-height: 1.7
}

.small, small {
  font-size: 13px
}

input, textarea, select, .form-control, .form-select {
  font-size: 15px !important
}
