/* One size for every section title on the page.
 *
 * The Figma file draws all of them the same: Gotham Black at 94px over the 1512px frame —
 * Key Features, Specifications, True Colour (RGB), Connectivity, Image Gallery, Promotion
 * Video. The mirror sets 60px on the two it ships (`.features h2`, `.specific h2`) and the
 * rebuilt sections each carried their own copy of the 94px ramp, so the page had two title
 * sizes and four places to change them. This file is the one place.
 *
 * Two things are deliberate:
 *
 * - **The ramp is a custom property, not a repeated clamp.** A section that needs a different
 *   size should override `font-size`; nothing should restate the numbers.
 * - **700, not Black.** The design sets Gotham Black; the mirror only ships
 *   Light/Book/Medium/Bold, so 700 is the heaviest weight actually available. The same
 *   substitution every rebuilt section was already making.
 *
 * `.features h2` and `.specific h2` are single-class selectors, the same weight as the
 * mirror's own rules in css/page/top.css — this file wins on load order, which is why it is
 * loaded after it.
 */

:root {
  /* 94px at the drawing's 1512px, shrinking with the viewport. */
  --section-title: clamp(3.6rem, 6.2vw, 9.4rem);
}

.features h2,
.specific h2,
.point__4 .truecolour-title,
.connectivity .connectivity-title,
.gallery-video .gallery-title,
.gallery-video .promo-title {
  font-size: var(--section-title);
  font-weight: 700;
  line-height: 1.1;
}
