/* ===================================================================
   BRAND TYPOGRAPHY
   -------------------------------------------------------------------
   Fraunces for display headings, Poppins for everything else.

   Fraunces is a warm, high-legibility serif with soft terminals - it
   carries bakery character without the readability cost of a script
   face. Scripts were tested and rejected: they fall apart at heading
   sizes on mobile and in the navbar.

   TO CHANGE THE DISPLAY FONT:
     1. Swap the Google Fonts <link> in templates/base.html
     2. Change --font-display below
   Nothing else needs editing.
   =================================================================== */

:root {
  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body: 'Poppins', sans-serif;
}

/* -------------------------------------------------------------------
   Brand wordmark in the navbar
   ------------------------------------------------------------------- */
.navbar-brand span {
  font-family: var(--font-display);
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  line-height: 1.1;
}

/* -------------------------------------------------------------------
   Hero and section display headings
   ------------------------------------------------------------------- */
.jp-title-line,
.jp-title-main,
.featured-title-main,
.featured-title-top,
.series-title,
.promise-title-line-1,
.promise-title-line-2,
.testimonials-title .title-line-1,
.testimonials-title .title-line-2,
.page-hero-title .title-line-1,
.page-hero-title .title-line-2,
.about-cta-title,
.jp-section-title .jp-title-main,
.products-container h2,
.rich-content-section h3 {
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.12;
}

/* The accent line in two-line hero titles carries the brand colour */
.jp-title-line.accent {
  color: var(--brand-accent, #e8829f);
}

/* -------------------------------------------------------------------
   Everything else stays on the body sans - stated explicitly so a
   future global heading rule cannot leak the display face into UI
   text, prices or form controls.
   ------------------------------------------------------------------- */
.card-title,
.product-name,
.price,
.price-value,
.btn,
.nav-link,
.dropdown-item,
.footer-heading,
.footer-link,
.form-label,
input, select, textarea,
.breadcrumb,
.spec-item,
.review-text {
  font-family: var(--font-body);
}

/* -------------------------------------------------------------------
   Responsive
   ------------------------------------------------------------------- */
@media (max-width: 991px) {
  .navbar-brand span { font-size: 1.25rem; }
}

@media (max-width: 575px) {
  .navbar-brand span { font-size: 1.1rem; }
}