/* Containers, gutters, section rhythm.
   Breakpoints for reference: mobile <640, tablet 640-1023,
   desktop 1024-1439, wide >=1440. All multi-column grids collapse below 640. */
:root{
  --w-site:1200px;   /* full site content */
  --w-doc:780px;     /* print deliverable column */
  --w-prose:640px;   /* prose measure, about 68 characters */
  --w-narrow:480px;  /* forms, modals */

  --gutter-mobile:24px;
  --gutter-tablet:40px;
  --gutter-desktop:52px;

  --pad-section:96px;      /* screen section, vertical, desktop */
  --pad-section-mobile:56px;
  --pad-doc-section:52px;  /* document section, all sides */
  --pad-card-sm:22px; --pad-card-md:28px; --pad-card-lg:36px;
}