/* ============================================================
   FOUNDER COCKPIT — LAYOUT WIDTH
   One gutter. One container. Loaded last, on purpose.

   Before this file the page had ten different answers to "how wide is
   the content": seven `--container` values in premium.css, three more in
   depth-3d.css, each in its own media query, the later file quietly
   winning at every breakpoint above 1440. The result was the same shape
   at every desktop size — a column with about a tenth of the screen dead
   on each side. Measured: 176px of nothing before the logo at 1728,
   277px at 2560. On a wide display the site read as a narrow document
   floating in a window rather than as the window.

   The replacement is one token. `--gutter` is the only horizontal
   measurement on the page, it is fluid, and the container is simply the
   screen minus it. There is no breakpoint here and no second system to
   keep in sync — a viewport width in between two sizes gets a layout in
   between them, which is what "adapts to any screen" has to mean.

   All of it sits on `:root` and on a bare `.container`, the same places
   the old values did, so this file supersedes them by load order alone.
   Scoped rules elsewhere (.legal-page .container, .hero-cinematic
   .container, section#results.cases > .container) are more specific and
   still win — deliberately: a legal page wants a narrow measure, and the
   hero owns its own vertical rhythm.

   THE READING MEASURE MOVED OFF THE SHELL AND ONTO THE TEXT. That is
   what makes the full width safe: widening a container that also sets
   line length trades one defect for a worse one — a 2000px paragraph at
   200 characters a line is less readable than a narrow page, and looks
   like a stretched template rather than a designed one. Prose carries
   `--measure` itself, so the shell can grow to the edge of any display
   and a line of body copy stays the length it was drawn at.
   ============================================================ */

:root {
  /* 20px on a phone, a tenth of a 1440 laptop, and it stops growing at
     112 — past roughly 2800 the screen is wide enough that more gutter
     is just a bigger frame around the same picture. */
  --gutter: clamp(20px, 4vw, 112px);

  /* The container no longer caps anything; it is the viewport, and the
     gutter does the shaping. Kept as a variable because the old rules
     read it and because a client page may still want a cap. */
  --container: 100%;

  /* One line of German body copy. Used by the prose caps below. */
  --measure: 68ch;
}

.container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

/* The nav is chrome: it belongs to the window, not to the text column,
   so it runs to the same gutter as everything else and no further. This
   is the line Danilo actually reported — the logo now starts one gutter
   in, at 69px on a 1728 display instead of 176. */
.site-nav .container {
  padding-inline: var(--gutter);
}

/* ---- the measure, applied where prose actually is ----------------
   Only blocks that are read as sentences. Headlines are display type
   and are allowed to run wide; cards, grids and tables carry their own
   width from their own layout.

   Every selector here was found by measuring, not by guessing: the page
   was walked at 2560 with the stylesheet on and off, and each block's
   width converted to characters per line against its own computed font.
   All of these were already past 80 characters BEFORE this file existed
   — the widest ran to 138 — and widening the shell added another 14 to
   26 each. So the cap is not a repair of this change; it is the half of
   "adapts to any screen" the old breakpoints never did. */
.about-lead,
.about-body,
.contact-lead,
.pill-v960-desc,
.fcp__caption,
#results .outcome-flow-list li,
#cookieBanner p,
.section-head p,
.hero-sub,
.faq-item p,
.legal-page p {
  max-width: var(--measure);
}

/* Centred blocks keep their measure centred rather than flush left —
   otherwise the cap reads as an accident rather than a decision. */
.section-sub,
.pillars-v960-sub,
.rv-footnote {
  max-width: var(--measure);
  margin-inline: auto;
}