/* Calm Chaos root — additive layout corrections. Nothing here
   edits an existing rule; each block states the measurement it answers.

   1. THE FIVE-CARD ROW.
   .verticals resolves to four columns while holding five cards. The previous
   correction spanned the last card across the full row — which produced the
   defect it was meant to fix: a full-width band carrying one short line of text
   and roughly three columns of empty black (measured at 1440: card 1078px wide,
   text block 197px). Five equal columns puts every card in one row and leaves
   no empty span. Below 1200px the natural wrap is correct and is left alone. */
@media (min-width: 1200px) {
  .verticals { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .verticals > .vertical:last-child { grid-column: auto; }
}

/* 2. THE GAP BEFORE "THE WORK".
   Measured at 1440 on the live root: .contact-line ends at y=1196 (it already
   carries 44px of its own padding-bottom), .section starts at y=1268 with
   margin-top 72px and padding-top 120px, so the heading lands at y=1388 —
   239px of empty black below a single line of text. A first attempt that only
   added margin made it worse, which is why the number is written down here.
   Collapsing the section's own margin and halving its top padding leaves ~100px
   from the email to the heading: a section break, not a void. */
.section { margin-top: 0; padding-top: 3.5rem; }
@media (min-width: 1200px) { .section { padding-top: 4rem; } }

/* 3. TWO INLINE STYLES THE ROOT'S OWN CSP REFUSES.
   The live root ships style="width:100%" on .wrap and style="text-align:center"
   on .contact-line. Its response header sets style-src 'self' with no
   'unsafe-inline', so Chrome logs two violations on every load and applies
   NEITHER declaration: measured on live, .contact-line computes text-align
   "start", not "center". The markup looked centred and was not. Moving both
   into this stylesheet makes them take effect and silences the violations. */
.wrap { width: 100%; }
.contact-line { text-align: center; }

/* 4. THE SUPPORT LINK'S TARGET SIZE.
   Measured 216x15 CSS px at all nine viewports and both densities — a 15px-tall
   pointer target. Padding the anchor gives it a 44px box without moving the
   text, which is the only interactive control on the upper half of the page. */
.contact-line a {
  display: inline-block;
  padding: 0.75rem 0.5rem;
  min-height: 44px;
  line-height: 1.6;
}