/* framework.css — lean Client-First-style utilities
   Ships alongside normalize.css; site.css overrides where needed. */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; }

/* ---- Layout shell ---- */
.page-wrap { overflow: clip; }
.padding-global { padding-left: 5%; padding-right: 5%; }
.container-large  { width: 100%; max-width: 80rem; margin-left: auto; margin-right: auto; }
.container-medium { width: 100%; max-width: 64rem; margin-left: auto; margin-right: auto; }
.container-small  { width: 100%; max-width: 48rem; margin-left: auto; margin-right: auto; }

.padding-section-small  { padding-top: 3rem; padding-bottom: 3rem; }
.padding-section-medium { padding-top: 5rem; padding-bottom: 5rem; }
.padding-section-large  { padding-top: 7rem; padding-bottom: 7rem; }

/* ---- Spacing scale ---- */
.spacer-xsmall  { padding-top: .5rem; }
.spacer-small   { padding-top: 1rem; }
.spacer-medium  { padding-top: 2rem; }
.spacer-large   { padding-top: 3rem; }
.spacer-xlarge  { padding-top: 4rem; }

/* ---- Text utilities ---- */
.text-align-center { text-align: center; }
.text-style-allcaps { text-transform: uppercase; letter-spacing: .06em; }
.text-color-white { color: var(--utility--white); }
.text-color-primary { color: var(--primary--color); }
.text-color-secondary { color: var(--secondary--color); }
.text-weight-normal { font-weight: 400; }
.text-weight-bold { font-weight: 800; }

/* ---- Responsive helpers ---- */
@media (max-width: 767px) {
  .padding-section-small  { padding-top: 2rem; padding-bottom: 2rem; }
  .padding-section-medium { padding-top: 3rem; padding-bottom: 3rem; }
  .padding-section-large  { padding-top: 4rem; padding-bottom: 4rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation: none !important; transition: none !important; }
}