/* ------------------------------------------------------------------
   Type tokens — the single source of truth for every text size on
   every template (home, about, services, portfolio, clients, contact,
   project pages, search, 404).

   Anchors:
     --fs-body-b  body text size      → lead / small / label / micro / logo
     --fs-h2-b    section heading size → hero / page title / display /
                                         services / CTA / stats / h3 / cards
     --fs-scale   one multiplier for everything

   Component CSS never hard-codes a font size; it multiplies a token,
   so editing an anchor reflows the whole site at once.
   ------------------------------------------------------------------ */
:root{
  --fs-scale: 1;

  /* Unitless family factors: keep the fluid (vw) part of every clamp in
     step with the anchor, so a size change is not capped by a fixed
     viewport term. Defaults = design. */
  --fs-b-k: 1;
  --fs-h-k: 1;

  --fs-body-b: 16px;
  --fs-h2-b: 52px;

  /* text family */
  --fs-lead: calc(var(--fs-body-b) * 1.125 * var(--fs-scale));
  --fs-small: calc(var(--fs-body-b) * 0.9375 * var(--fs-scale));
  --fs-label: calc(var(--fs-body-b) * 0.75 * var(--fs-scale));
  --fs-micro: calc(var(--fs-body-b) * 0.625 * var(--fs-scale));
  --fs-logo: calc(var(--fs-body-b) * 1.3125 * var(--fs-scale));
  --fs-body: calc(var(--fs-body-b) * var(--fs-scale));

  /* display family */
  --fs-h2: calc(var(--fs-h2-b) * var(--fs-scale));
  --fs-h3: calc(var(--fs-h2) * 0.5);
  --fs-card: calc(var(--fs-h2) * 0.576923);
  --fs-hero: calc(var(--fs-h2) * 1.923077);
  --fs-title: calc(var(--fs-h2) * 2.5);
  --fs-display: calc(var(--fs-h2) * 1.730769);
  --fs-service: calc(var(--fs-h2) * 1.230769);
  --fs-cta: calc(var(--fs-h2) * 1.5);
  --fs-stat: calc(var(--fs-h2) * 1.846154);
}

/* Content headings (not the home hero, whose stacked overlap is the design):
   Boldonse's ink box is ~1.19em, so anything below ~1.24 collides with
   itself at every width. */
.c-h2, .c-services__big, .c-clients__title, .c-cta h2, .c-card__title,
.c-panel__tag, .c-foot__contacts h3,
.cg-page-hero h1, .cg-sec-title, .cg-services__row h3, .cg-services__title,
.cg-cta h2, .cg-clients-sec__top h2, .cg-quote blockquote,
.cg-block-wrap .wp-block-heading, .cg-portfolio-cat h2,
.cg-about-split h2, .cg-founders-note h2, .cg-awards h2,
.cg-svc h3, .cg-value h3, .cg-team__card h3, .cg-benefit h3,
.cg-card__title, .cg-testi__item h3, .cg-award__year {
  line-height: max(var(--lh-head, 1.3), 1.3);
}

/* ---------------------------------------------------------------
   Display type: every heading, both markup generations.

   Boldonse has a very tall ink box (~1.19em), so the reference
   design's stacked leading collides on narrow screens: lines become
   unreadable. These floors only raise leading on phones/tablets; a
   larger value from the panel always wins, and desktop (≥1025px)
   keeps the original design untouched.
   --------------------------------------------------------------- */
@media (max-width: 1024px) {
  .c-hero__l1, .c-hero__l2, .c-h2, .c-services__big, .c-clients__title,
  .c-cta h2, .c-card__title, .c-panel__tag, .c-foot__contacts h3,
  .cg-hero h1, .cg-hero__title, .cg-page-hero h1, .cg-sec-title,
  .cg-services__row h3, .cg-services__title, .cg-cta h2,
  .cg-clients-sec__top h2, .cg-quote blockquote,
  .cg-block-wrap .wp-block-heading, .cg-portfolio-cat h2,
  .cg-about-split h2, .cg-founders-note h2, .cg-awards h2,
  .cg-svc h3, .cg-value h3, .cg-team__card h3, .cg-benefit h3,
  .cg-card__title, .cg-testi__item h3, .cg-award__year {
    line-height: max(var(--lh-head, 1.28), 1.28);
  }
}

@media (max-width: 640px) {
  .c-hero__l1, .c-hero__l2, .c-h2, .c-services__big, .c-clients__title,
  .c-cta h2, .c-card__title, .c-panel__tag, .c-foot__contacts h3,
  .cg-hero h1, .cg-hero__title, .cg-page-hero h1, .cg-sec-title,
  .cg-services__row h3, .cg-services__title, .cg-cta h2,
  .cg-clients-sec__top h2, .cg-quote blockquote,
  .cg-block-wrap .wp-block-heading, .cg-portfolio-cat h2,
  .cg-about-split h2, .cg-founders-note h2, .cg-awards h2,
  .cg-svc h3, .cg-value h3, .cg-team__card h3, .cg-benefit h3,
  .cg-card__title, .cg-testi__item h3, .cg-award__year {
    line-height: max(var(--lh-head, 1.35), 1.35);
  }
}

/* Never let a heading overflow its column at small widths. */
.cg-page-hero h1, .cg-hero h1, .cg-hero__title {
  overflow-wrap: break-word;
  hyphens: auto;
}