/*
 * MJENGO — FINAL TYPOGRAPHY SYSTEM
 * Quattrocento Sans supports 400 and 700. This file is loaded LAST so the
 * entire public site uses one controlled, responsive type scale without
 * synthetic extra-bold weights or forced text overflow.
 */
:root {
  --mj-font: "Quattrocento Sans", Arial, sans-serif;
  --mj-type-body: 16px;
  --mj-type-small: 14px;
  --mj-type-body-line: 1.58;
  --mj-type-heading-line: 1.08;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body,
button,
input,
select,
textarea {
  font-family: var(--mj-font) !important;
}

body {
  font-size: var(--mj-type-body);
  font-weight: 400;
  line-height: var(--mj-type-body-line);
  letter-spacing: 0;
}

/* Quattrocento Sans only ships 400/700 in the selected Google family. */
strong,
b,
button,
.button,
.site-nav a,
.header-quote,
.category-card h3,
.quote-card h3,
.product-card h3,
.store-product-card h3,
.project-card h3,
.step-copy h2,
.benefit-card h3,
.trust-value-card h3,
.contact-method-card h3,
.policy-card h2,
.policy-section h2,
.cart-item__info h3,
.checkout-item h3 {
  font-weight: 700 !important;
}

/* Prevent textual overflow without creating ugly mid-word breaks. */
main h1,
main h2,
main h3,
main p,
main li,
.mj-footer p,
.mj-footer li {
  max-width: 100%;
  overflow-wrap: break-word;
  word-break: normal;
}

main h1,
main h2,
main h3 {
  text-wrap: balance;
}

/* Header — compact, readable and stable. */
.site-topbar__assist,
.site-topbar__location {
  font-weight: 700 !important;
}

.site-topbar__assist {
  font-size: 12px !important;
  letter-spacing: 0 !important;
}

.site-topbar__location {
  font-size: 11.5px !important;
}

.site-nav a {
  font-size: 14px !important;
  letter-spacing: 0 !important;
}

.header-quote {
  font-size: 13.5px !important;
}

/* Hero */
.hero-slide__eyebrow {
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: .12em !important;
}

.hero-slide h1,
.hero-slide h2 {
  max-width: 760px !important;
  font-size: clamp(44px, 4vw, 58px) !important;
  font-weight: 700 !important;
  line-height: 1.04 !important;
  letter-spacing: -.025em !important;
}

.hero-title__line {
  display: block;
  white-space: normal !important;
}

.hero-slide__copy {
  max-width: 650px !important;
  margin: 18px 0 24px !important;
  font-size: clamp(16px, 1.15vw, 18px) !important;
  line-height: 1.52 !important;
  letter-spacing: 0 !important;
}

.hero-slide__actions .button {
  font-size: 14px !important;
  font-weight: 700 !important;
}

/* Homepage section headings */
.categories-section__eyebrow,
.featured-products__eyebrow,
.project-stage__eyebrow,
.section-heading__eyebrow {
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}

.categories-section__title {
  font-size: clamp(34px, 2.8vw, 42px) !important;
  font-weight: 700 !important;
  line-height: var(--mj-type-heading-line) !important;
  letter-spacing: -.02em !important;
}

.categories-section__intro,
.featured-products__intro,
.section-heading__intro {
  max-width: 760px !important;
  font-size: 16.5px !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
}

.category-card h3 {
  font-size: clamp(21px, 1.55vw, 26px) !important;
  line-height: 1.06 !important;
  letter-spacing: -.015em !important;
}

.quote-card h3 {
  font-size: clamp(22px, 1.7vw, 28px) !important;
  line-height: 1.08 !important;
  letter-spacing: -.015em !important;
}

.quote-card p {
  font-size: 15px !important;
  line-height: 1.48 !important;
}

.featured-products h2 {
  font-size: clamp(31px, 2.35vw, 38px) !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
  letter-spacing: -.02em !important;
}

.product-card h3,
.store-product-card h3 {
  font-size: 16.5px !important;
  line-height: 1.26 !important;
  letter-spacing: 0 !important;
}

.project-stage h2 {
  font-size: clamp(34px, 2.85vw, 42px) !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
  letter-spacing: -.02em !important;
}

.project-stage__intro {
  max-width: 760px !important;
  font-size: 16.5px !important;
  line-height: 1.55 !important;
  letter-spacing: 0 !important;
}

.project-card h3 {
  font-size: 23px !important;
  line-height: 1.12 !important;
  letter-spacing: -.01em !important;
}

.project-card li {
  font-size: 15.5px !important;
  line-height: 1.42 !important;
  letter-spacing: 0 !important;
}

.project-card__link {
  font-size: 16px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

.section-heading h1,
.section-heading h2,
.section-heading--why h2 {
  font-size: clamp(33px, 2.7vw, 40px) !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
  letter-spacing: -.02em !important;
}

.step-copy h2 {
  font-size: 17px !important;
  line-height: 1.18 !important;
  letter-spacing: 0 !important;
}

.step-copy p,
.step-copy__delivery,
.step:last-child .step-copy__delivery {
  font-size: 14px !important;
  line-height: 1.5 !important;
  letter-spacing: 0 !important;
}

.step-copy__delivery span {
  display: inline !important;
  white-space: normal !important;
}

.benefit-card h3 {
  font-size: 17px !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
}

.benefit-card p {
  font-size: 14px !important;
  line-height: 1.5 !important;
}

/* Shop / product / content pages */
.store-page-hero h1,
.commerce-hero h1,
.trust-hero__copy h1,
.contact-hero-grid h1,
.policy-hub-hero h1,
.policy-hero h1 {
  font-size: clamp(36px, 3.1vw, 46px) !important;
  font-weight: 700 !important;
  line-height: 1.07 !important;
  letter-spacing: -.022em !important;
}

.store-page-hero p,
.commerce-hero p,
.trust-hero__copy > p,
.contact-hero-grid > div > p,
.policy-hub-hero > p,
.policy-hero > p {
  font-size: 16.5px !important;
  line-height: 1.58 !important;
  letter-spacing: 0 !important;
}

.product-details h1 {
  font-size: clamp(32px, 2.65vw, 40px) !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
  letter-spacing: -.02em !important;
}

.related-products__head h2,
.content-card h2,
.form-card h2,
.trust-intro-grid h2,
.trust-section__head h2,
.trust-process-panel h2,
.trust-identity-grid h2,
.contact-form-panel h2,
.contact-info-panel h2,
.policy-assurance h2 {
  font-size: clamp(27px, 2.2vw, 34px) !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  letter-spacing: -.018em !important;
}

.content-card h3,
.contact-card h3,
.trust-value-card h3,
.contact-info-panel h3,
.contact-help-grid h3,
.policy-help h3 {
  font-size: 19px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
}

.policy-card h2,
.policy-section h2 {
  font-size: clamp(21px, 1.7vw, 25px) !important;
  line-height: 1.18 !important;
  letter-spacing: -.01em !important;
}

.cart-panel__head h2,
.order-summary h2,
.checkout-summary h2,
.checkout-card__header h2,
.empty-cart h2,
.order-modal h2,
.shop-empty h2 {
  font-size: clamp(23px, 2vw, 29px) !important;
  font-weight: 700 !important;
  line-height: 1.12 !important;
  letter-spacing: -.015em !important;
}

.cart-item__info h3,
.checkout-item h3 {
  font-size: 16px !important;
  line-height: 1.25 !important;
}

/* Footer */
.mj-footer__description {
  font-size: 15.5px !important;
  line-height: 1.62 !important;
  letter-spacing: 0 !important;
  white-space: normal !important;
}

.mj-footer__heading {
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
}

.mj-footer__links a,
.mj-footer__contact-item {
  font-size: 15px !important;
  line-height: 1.45 !important;
  letter-spacing: 0 !important;
}

.mj-footer__copyright,
.mj-footer__powered {
  font-size: 13px !important;
}

@media (max-width: 760px) {
  :root {
    --mj-type-body: 15.5px;
    --mj-type-small: 13.5px;
  }

  .site-topbar__assist {
    font-size: clamp(10.5px, 3vw, 11.5px) !important;
    white-space: nowrap !important;
  }

  .site-nav a {
    font-size: 15px !important;
  }

  .hero-slide__eyebrow {
    max-width: 310px;
    font-size: 10.5px !important;
    line-height: 1.35 !important;
    letter-spacing: .105em !important;
  }

  .hero-slide h1,
  .hero-slide h2 {
    max-width: 355px !important;
    font-size: clamp(30px, 8.2vw, 34px) !important;
    line-height: 1.05 !important;
    letter-spacing: -.02em !important;
  }

  .hero-title__line {
    white-space: normal !important;
  }

  .hero-slide__copy {
    max-width: 345px !important;
    margin: 14px 0 19px !important;
    font-size: 15px !important;
    line-height: 1.48 !important;
  }

  .hero-slide__actions .button {
    font-size: 13.5px !important;
  }

  .categories-section__title,
  .featured-products h2,
  .project-stage h2,
  .section-heading h1,
  .section-heading h2,
  .section-heading--why h2 {
    font-size: clamp(28px, 7.8vw, 32px) !important;
    line-height: 1.08 !important;
    letter-spacing: -.015em !important;
  }

  .categories-section__intro,
  .project-stage__intro,
  .featured-products__intro,
  .section-heading__intro {
    font-size: 15px !important;
    line-height: 1.52 !important;
  }

  .category-card h3 {
    font-size: clamp(17px, 4.7vw, 20px) !important;
    line-height: 1.08 !important;
  }

  .quote-card h3 {
    font-size: clamp(18px, 4.8vw, 21px) !important;
    line-height: 1.1 !important;
  }

  .quote-card p {
    font-size: 13px !important;
    line-height: 1.42 !important;
  }

  .product-card h3,
  .store-product-card h3 {
    font-size: 14.5px !important;
    line-height: 1.28 !important;
  }

  .project-card h3 {
    font-size: 20px !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
  }

  .project-card li {
    font-size: 15px !important;
  }

  .step-copy h2 {
    font-size: 16.5px !important;
  }

  .step-copy p,
  .step-copy__delivery,
  .step:last-child .step-copy__delivery {
    font-size: 13.5px !important;
    line-height: 1.48 !important;
  }

  .benefit-card h3 {
    font-size: 16.5px !important;
  }

  .benefit-card p {
    font-size: 13.5px !important;
  }

  .store-page-hero h1,
  .commerce-hero h1,
  .trust-hero__copy h1,
  .contact-hero-grid h1,
  .policy-hub-hero h1,
  .policy-hero h1 {
    font-size: clamp(29px, 8vw, 33px) !important;
    line-height: 1.08 !important;
  }

  .store-page-hero p,
  .commerce-hero p,
  .trust-hero__copy > p,
  .contact-hero-grid > div > p,
  .policy-hub-hero > p,
  .policy-hero > p {
    font-size: 15px !important;
  }

  .product-details h1 {
    font-size: clamp(28px, 7.5vw, 32px) !important;
  }

  .related-products__head h2,
  .content-card h2,
  .form-card h2,
  .trust-intro-grid h2,
  .trust-section__head h2,
  .trust-process-panel h2,
  .trust-identity-grid h2,
  .contact-form-panel h2,
  .contact-info-panel h2,
  .policy-assurance h2 {
    font-size: clamp(25px, 6.8vw, 29px) !important;
  }

  .content-card h3,
  .contact-card h3,
  .trust-value-card h3,
  .contact-info-panel h3,
  .contact-help-grid h3,
  .policy-help h3 {
    font-size: 18px !important;
  }

  .policy-card h2,
  .policy-section h2 {
    font-size: 21px !important;
  }

  .cart-panel__head h2,
  .order-summary h2,
  .checkout-summary h2,
  .checkout-card__header h2,
  .empty-cart h2,
  .order-modal h2,
  .shop-empty h2 {
    font-size: 23px !important;
  }

  .mj-footer__description {
    font-size: 15px !important;
    line-height: 1.58 !important;
  }

  .mj-footer__heading {
    font-size: 17px !important;
  }

  .mj-footer__links a,
  .mj-footer__contact-item {
    font-size: 15px !important;
  }
}

@media (max-width: 360px) {
  .hero-slide h1,
  .hero-slide h2 {
    font-size: 29px !important;
  }

  .categories-section__title,
  .featured-products h2,
  .project-stage h2,
  .section-heading h1,
  .section-heading h2,
  .section-heading--why h2 {
    font-size: 28px !important;
  }

  .site-topbar__assist {
    font-size: 10px !important;
  }
}