/* Tablet + small-laptop tuning (768px - 1440px). Loaded last on every page.
   The 1920px desktop design (1441px and up) and phones (767px and below) are not touched:
   everything here lives inside the media query below. Typography and section spacing are
   reduced ~20-25% / ~35% through the shared tokens so every page follows. */

@media (min-width: 768px) and (max-width: 1440px) {
  :root {
    --fs-h1: clamp(1.75rem, 0.8rem + 2.6vw, 3rem);          /* 64 -> ~40-48 */
    --fs-h2: clamp(1.5rem, 0.9rem + 1.6vw, 2rem);           /* 40 -> ~27-32 */
    --fs-h3: clamp(1.125rem, 1rem + 0.35vw, 1.25rem);       /* 24 -> ~19-20 */
    --fs-lead: clamp(0.9375rem, 0.85rem + 0.3vw, 1.0625rem); /* 20 -> ~16-17 */
    --fs-body: clamp(0.9375rem, 0.88rem + 0.15vw, 1rem);     /* 18 -> ~16 */

    --section-space: clamp(72px, 9.4vw, 100px);              /* 150 -> ~96-100 */
    --space-heading: clamp(24px, 2.4vw, 36px);               /* 60 -> ~25-35 */
    --space-dark: clamp(48px, 4.6vw, 72px);                  /* 120 -> ~48-66 */
  }

  /* Eyebrows */
  .eyebrow,
  .intro .eyebrow,
  .why__eyebrow,
  .pool-services .eyebrow { font-size: clamp(1rem, 0.9rem + 0.35vw, 1.1875rem); }
  .eyebrow--rule { font-size: clamp(0.9375rem, 0.85rem + 0.3vw, 1.0625rem); }
  .eyebrow--rule::before { width: 40px; height: 3px; }

  /* Sub-headings that carry their own clamp() */
  .trust__title,
  .founder-strip h2,
  .blog__title,
  .portfolio__title,
  .service-row h2,
  .service-row h3 { font-size: clamp(1.25rem, 1rem + 0.9vw, 1.5rem); }
  .project__name,
  .gallery__title { font-size: clamp(1.125rem, 1rem + 0.5vw, 1.375rem); }
  .accordion__trigger { font-size: clamp(1rem, 0.9rem + 0.4vw, 1.1875rem); padding-block: 18px; }
  .case-facts dd,
  .case-body__sticky p { font-size: clamp(1rem, 0.92rem + 0.3vw, 1.125rem); }

  /* Heroes */
  .hero { min-height: clamp(480px, 40vw, 640px); padding-top: 120px; }
  .page-hero { min-height: clamp(400px, 32vw, 500px); padding-top: 120px; }
  .page-hero--short { min-height: clamp(340px, 24vw, 420px); }
  .hero__title,
  .page-hero__title { gap: 12px; }
  .hero__aside,
  .page-hero__aside,
  .blog-hero__aside { gap: 24px; }
  .page-hero__inner { gap: 28px; }
  .case-hero__copy { gap: 24px; }

  /* Gaps between a heading and its copy, and between blocks of copy */
  .section-heading,
  .projects-feat__head,
  .water__head,
  .areas__head,
  .process__text,
  .journey__block { gap: 14px; }
  .why__text,
  .founder-strip__text { gap: 28px; }
  .why__text .copy,
  .founder-strip__text .copy,
  .trust__list-wrap,
  .case-block { gap: 14px; }
  .cta-banner__inner { gap: 28px; }
  .cta-banner { min-height: clamp(260px, 22vw, 320px); }
  .card,
  .post-card { gap: 20px; }
  .card__body,
  .post-card__body { gap: 10px; }
  .services__grid { margin-top: 32px; }
  .blog__grid { margin-top: 32px; gap: 32px 24px; }
  .blog__head,
  .portfolio__head { gap: 20px; padding-bottom: 28px; }
  .portfolio__head { margin-bottom: 28px; }
  .case-body__main { gap: clamp(28px, 2.6vw, 40px); }
  .article__head { gap: 32px; }
  .article__body { gap: 40px; margin-top: 32px; }
  .journey__subs { gap: 32px; }
  .process__steps { gap: 28px; }
  .start__section { padding-top: clamp(104px, 8vw, 132px); }
  .case-facts__list > div { padding-block: 32px; }

  /* Dark band / footer rhythm */
  .site-footer { padding-top: calc(clamp(110px, 8.65vw, 166px) + clamp(40px, 4.2vw, 64px)); }
  .footer__bottom { margin-top: 40px; padding-block: 24px; }
}