/* ==========================================================================
   THEME — written by the admin panel. Safe to overwrite.

   Everything the panel controls about fonts and text size lives here, so the
   main stylesheet never has to be touched. If this file is ever deleted or
   broken, the site falls back to its built-in defaults and still renders.

   Size controls are multipliers, not fixed pixel values, so text keeps
   scaling correctly between a phone and a large monitor instead of being
   frozen at one size.
   ========================================================================== */
:root{
  /* --- Fonts ------------------------------------------------------------
     Bundled and ready to use (no licence to buy, all self-hosted):
       'Aspekta'     — current heading/body font
       'Elms Sans'   — geometric sans
       'Space Mono'  — monospace, used for small labels and nav
     An uploaded font is added here by the panel automatically.            */
  --font-primary:   'Aspekta';
  --font-secondary: 'Space Mono';

  /* --- Text sizes -------------------------------------------------------
     1 = the designed size. The panel keeps these between 0.85 and 1.10.
     That ceiling is measured, not guessed: above 1.10 the "Built to be
     specified" section's text column stops fitting one screen on a
     1366x657 laptop, which is the most common laptop size.                */
  --s-heading:    1;    /* big section titles and page headlines */
  --s-subheading: 1;    /* card and column titles */
  --s-body:       1;    /* paragraphs */
  --s-button:     1;    /* button labels */
  --s-label:      1;    /* small monospace labels, nav, spec keys */
}

/* --------------------------------------------------------------------------
   The multipliers applied. Each rule repeats the designed size and scales it,
   so the responsive behaviour is preserved exactly at a multiplier of 1.
   -------------------------------------------------------------------------- */

/* Headings */
.claims .head h2, .split-head h2, .faq-head h2, .specified-left h2,
.page-hero h1, .product-grid-head h2, .access-head h2, .spec-head h2{
  font-size:calc(clamp(32px, 2.8vw, 46px) * var(--s-heading));
}
.hero-copy h1{ font-size:calc(clamp(22px, 2.1vw, 34px) * var(--s-heading)); }
.spotlight h2, .spotlight h3{ font-size:calc(clamp(24px, 2.1vw, 34px) * var(--s-heading)); }

/* Sub-headings */
.claim-col h3{ font-size:calc(clamp(20px, 1.5vw, 25px) * var(--s-subheading)); }
.split-col h3{ font-size:calc(clamp(22px, 1.7vw, 28px) * var(--s-subheading)); }
.specify-card h4, .spec-item h4{ font-size:calc(clamp(16px, 1.2vw, 19px) * var(--s-subheading)); }
.product-card h3{ font-size:calc(clamp(16px, 1.2vw, 20px) * var(--s-subheading)); }

/* Body text */
.claims .head p, .page-hero .intro, .specified-left .lead{
  font-size:calc(clamp(15px, 1.15vw, 18px) * var(--s-body));
}
.claim-col p, .split-col p{ font-size:calc(clamp(14px, 1.05vw, 16px) * var(--s-body)); }
.spec-item p, .product-card p{ font-size:calc(clamp(13px, 1vw, 15px) * var(--s-body)); }
.faq-row .text, .faq-row .a span{ font-size:calc(clamp(15px, 1.15vw, 18px) * var(--s-body)); }

/* Buttons */
.btn{ font-size:calc(clamp(14px, 1.05vw, 15px) * var(--s-button)); }

/* Small monospace labels: nav, section kickers, spec keys, footer headings */
.nav-link, .kicker, .spec-row .k, .access-item p, .footer-col h5, .breadcrumb{
  font-size:calc(clamp(11px, 0.9vw, 13px) * var(--s-label));
}
