/* Our Values — the four EAT pillars. Four equal cards, no imagery: the page is a
   statement, and photographs would make it a brochure.

   COMPACTED 2026-08-14 ("compact this page vertically massively"). The page carries four
   short paragraphs and used to run past a laptop fold on nothing but padding: three
   stacked .section blocks at clamp(40px,6vw,80px) top and bottom, a .page-head with its
   own clamp(30px,4vw,48px), and card padding up to 32px. The words did not change; the
   air between them did.

   Everything below is scoped to .values so no other page inherits a tighter rhythm than
   its own content wants. */
.values.section { padding: clamp(22px, 3vw, 34px) 0 clamp(28px, 4vw, 44px); }
.values .page-head { padding-top: 0; }
.values .page-head h1 { font-size: clamp(1.7rem, 3.4vw, 2.4rem); }
.values .page-head p { margin-top: 8px; }

/* The grid is the page, so it starts right under the lede rather than a band away. */
.values-grid {
  display: grid;
  gap: clamp(12px, 1.6vw, 18px);
  margin-top: clamp(18px, 2.4vw, 26px);
}
/* Two across earlier (600px, not 760px) — these cards are text-only and read fine
   narrow, and pairing them sooner halves the scroll on a tablet. */
@media (min-width: 600px) { .values-grid { grid-template-columns: 1fr 1fr; } }

.value-card {
  padding: clamp(16px, 2vw, 22px);
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r);
}
.value-card__h { margin: 0 0 6px; font-size: clamp(1.1rem, 1.9vw, 1.3rem); }
.value-card__b { margin: 0; color: var(--ink-2); line-height: 1.55; }

.values-more { margin: clamp(18px, 2.4vw, 26px) 0 0; color: var(--text-muted); }