:root{
  /* Base ramp. The site is built on a 4px rhythm with odd in-between
     values kept verbatim where the original design used them. */
  --ehr-space-1:4px;
  --ehr-space-2:8px;
  --ehr-space-3:12px;
  --ehr-space-4:16px;
  --ehr-space-5:20px;
  --ehr-space-6:24px;
  --ehr-space-7:28px;
  --ehr-space-8:32px;
  --ehr-space-10:40px;
  --ehr-space-12:48px;
  --ehr-space-16:64px;

  /* Fluid rhythm — these exact clamps drive every section on the site. */
  --ehr-section-y:clamp(52px,6.5vw,104px); /* @kind spacing */
  --ehr-section-y-sm:clamp(44px,5.5vw,84px); /* @kind spacing */
  --ehr-gutter-x:clamp(14px,4vw,56px); /* @kind spacing */
  --ehr-card-pad:clamp(20px,2.2vw,28px);
  --ehr-card-pad-lg:clamp(22px,2.8vw,38px);
  --ehr-grid-gap:clamp(16px,2vw,24px);
  --ehr-grid-gap-lg:clamp(28px,4vw,66px);
  --ehr-heading-gap:clamp(24px,3vw,40px);

  --ehr-container:1340px;

  /* Radii. There are none. This is a deliberate, load-bearing decision:
     every corner in the system is 90°, mirroring the logo's hard chevron. */
  --ehr-radius:0px;

  /* Tap targets — trades work, people tap with gloves on. */
  --ehr-tap-sm:44px;
  --ehr-tap:52px;
  --ehr-tap-lg:58px;
  --ehr-tap-xl:64px;

  /* Accent rules — the blue/ink bar that tops a card or opens a section. */
  --ehr-rule-accent:3px;
  --ehr-rule-accent-lg:4px;
  --ehr-rule-underline:2px;
}