/* GM SEO Services layout system (2026-09-24), loaded after tailwind.min.css.
   One vertical rhythm for every page: heroes and sections take their padding
   from these tokens instead of eleven different pt/pb/py combinations. */
:root {
  --gm-hero-top: 4rem;       --gm-hero-top-sm: 5rem;
  --gm-hero-bottom: 5rem;    --gm-hero-bottom-sm: 7rem;
  --gm-section-y: 5rem;      --gm-section-y-sm: 7rem;
}
.gm-hero { padding-top: var(--gm-hero-top); padding-bottom: var(--gm-hero-bottom); }
.gm-section { padding-top: var(--gm-section-y); padding-bottom: var(--gm-section-y); }
@media (min-width: 640px) {
  .gm-hero { padding-top: var(--gm-hero-top-sm); padding-bottom: var(--gm-hero-bottom-sm); }
  .gm-section { padding-top: var(--gm-section-y-sm); padding-bottom: var(--gm-section-y-sm); }
}