/*
 * Layout primitives: container, grid utilities, spacing helpers.
 * Breakpoints mirror the PRD's required test widths: 320, 375, 414, 768,
 * 1024, 1280, 1440.
 */

.container {
    width: 100%;
    max-width: var(--container-max);
    margin-inline: auto;
    padding-inline: var(--space-4);
}

@media (min-width: 768px) {
    .container {
        padding-inline: var(--space-6);
    }
}

@media (min-width: 1024px) {
    .container {
        padding-inline: var(--space-7);
    }
}

.grid {
    display: grid;
    gap: var(--space-5);
}

.grid--2 { grid-template-columns: repeat(2, 1fr); }
.grid--3 { grid-template-columns: repeat(3, 1fr); }
.grid--4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 767px) {
    .grid--2 {
        grid-template-columns: repeat(2, 1fr);
    }
    /* 3-up and 4-up grids (contact's testimonial cards, feature/"why us"
       cards) stack fully on mobile — 2-up at narrow widths squeezed their
       icon+heading+paragraph+button content into a column too narrow to
       hold it, overflowing the viewport at 320-375px. */
    .grid--3,
    .grid--4 {
        grid-template-columns: 1fr;
    }
}

.stack {
    display: flex;
    flex-direction: column;
}

.cluster {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-3);
}

.section {
    padding-block: var(--space-8);
}

@media (max-width: 767px) {
    .section {
        padding-block: var(--space-7);
    }
}

.visually-hide-below-md {
    display: none;
}

@media (min-width: 768px) {
    .visually-hide-below-md {
        display: revert;
    }
    .visually-hide-from-md {
        display: none;
    }
}

/* overflow-x:hidden on html/body used to live here as a catch-all against
   horizontal scroll — removed because it silently breaks position:sticky
   for every descendant (the site header included) and was masking real
   per-component overflow bugs from ever showing up in testing instead of
   actually fixing them. Every overflow source found this way has since
   been fixed at the component level; if a new one shows up, fix it there
   instead of reinstating a global clip. */