/* ------------------------------------------------------------------
   Type scale — one size per text role. Use rem, never px, so browser
   zoom works. Nothing smaller than --fs-tag (12px).

   Role         token          size
   Hero title   --fs-h1        48px
   Section      --fs-h2        40px
   Sub-section  --fs-h3        32px
   Group title  --fs-h4        24px
   Card title   --fs-h5        20px
   Lead text    --fs-lead      18px
   Body         --fs-body      16px
   Small text   --fs-small     14px
   Label / btn  --fs-label     14px
   Tag / badge  --fs-tag       12px

   Step 1: applied to shared chrome (header, footer, whatsapp box) and
   the new components. The page bodies still use their old sizes until
   step 2.
   ------------------------------------------------------------------ */

:root {
  --fs-h1: 3rem;
  --fs-h2: 2.5rem;
  --fs-h3: 2rem;
  --fs-h4: 1.5rem;
  --fs-h5: 1.25rem;
  --fs-lead: 1.125rem;
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-label: 0.875rem;
  --fs-tag: 0.75rem;
}

/* Header ---------------------------------------------------------- */
.header .nav-link-2,
.header .nav-dropdown-link-2,
.header .text-block-21,
.header .nav-link,
.header .nav-link-dark {
  font-size: var(--fs-label);
}

.header .button-7 {
  font-size: var(--fs-label);
  line-height: 1.3;
}

/* Footer --------------------------------------------------------- */
.footer-dark .title-small,
.footer-dark .footer-link,
.footer-copyright-center {
  font-size: var(--fs-label);
  line-height: 1.5;
}

.footer-dark .text-block-22 {
  font-size: var(--fs-small);
  line-height: 1.6;
}

/* WhatsApp chat widget ------------------------------------------- */
.wa-button .live-chat-top-text {
  font-size: var(--fs-label);
}

.wa-button .live-chat-bottom-text {
  font-size: var(--fs-tag);
}

.wa-button .live-chat-text {
  font-size: var(--fs-label);
}
