.site-page {
    --site-header-height: 4.5rem;
    --site-gutter: clamp(1rem, 3vw, 1.875rem);
}

.site-page .container,
.site-page .container-medium {
    width: 100%;
    max-width: 91.25rem;
    margin-inline: auto;
    padding-inline: var(--site-gutter);
}

.site-page .container-medium { max-width: 85rem; }
.site-main { min-width: 0; max-width: 100%; }
.site-arrow-icon {
    display: inline-block;
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
    vertical-align: middle;
}

.site-page :where(.grid, .flex) > :where(div, article, section, form, a, h1, h2, h3) { min-width: 0; }
.site-page :where(h1, h2, h3, h4, p, li) { overflow-wrap: break-word; }
.site-page :where(h1, h2) { max-width: 100%; white-space: normal; }

:where(.site-page) h1 {
    font-size: clamp(2rem, 5vw, 5rem);
    line-height: 1.15;
}

.site-page :where(img, video, iframe, input, textarea, select) { max-width: 100%; }
.site-page :where(.service-rich-text, .contact-email, .site-footer) { overflow-wrap: anywhere; }

.site-page .service-rich-text table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
}

.site-header { position: sticky; top: 0; z-index: 80; width: 100%; }
.site-navbar { position: relative; width: 100%; padding: 0.75rem 0.875rem; }

.site-navbar__inner {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
}

.site-navbar__links { display: none; }
.site-navbar__brand { display: inline-flex; width: fit-content; max-width: 100%; min-width: 0; align-items: center; }

#navbar .site-navbar__brand .site-logo {
    width: 7.75rem;
    max-width: 100%;
    height: auto;
}

.site-navbar__actions { display: flex; align-items: center; justify-self: end; gap: 0.75rem; }
.site-navbar__appointment { display: none; white-space: nowrap; }
.site-navbar__survey { display: none; flex-shrink: 0; white-space: nowrap; }

.site-navbar__menu-toggle {
    display: inline-flex;
    width: 2.75rem;
    height: 2.75rem;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
}

.site-mobile-menu {
    position: fixed;
    inset-inline: var(--site-gutter);
    top: calc(var(--site-header-height) + 0.5rem);
    z-index: 79;
    max-height: calc(100vh - var(--site-header-height) - 1.5rem);
    max-height: calc(100dvh - var(--site-header-height) - 1.5rem);
}

.site-mobile-menu a { display: block; padding: 0.625rem 0.25rem; }
.site-footer__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; }
.site-footer__grid > * { min-width: 0; }
.site-footer { padding-top: clamp(3rem, 7vw, 8rem); }
.site-footer__address { white-space: pre-line; }

.site-page .service-card h3 {
    font-size: clamp(1.25rem, 2.7vw, 2.75rem);
    line-height: 1.2;
}

.service-card__toggle > span:first-child { min-width: 0; }
.service-card__toggle > span:first-child > span { min-width: 0; overflow-wrap: anywhere; }
.site-main .hs-accordion-toggle { gap: 1rem; align-items: flex-start; }
.site-page .blog-card-grid { display: grid; grid-template-columns: minmax(0, 1fr); }
.blog-card-grid > a > div:first-child { height: auto; aspect-ratio: 4 / 3; }
.blog-card-grid > a > .flex { flex-wrap: wrap; }
.blog-detail-hero { height: auto; max-height: 40rem; aspect-ratio: 16 / 10; }
.site-page .contact-layout { grid-template-columns: minmax(0, 1fr); }

.site-page .about-intro h2,
.site-page .contact-intro h2 {
    font-size: clamp(1.75rem, 3.5vw, 3.25rem);
    line-height: 1.2;
}

.site-page .about-profile-grid,
.site-page .about-care__features { grid-template-columns: minmax(0, 1fr); }
.about-care__features > div:nth-child(2) > div { width: min(100%, 24.5rem); height: auto; aspect-ratio: 3 / 4; }
.about-care__features > div:nth-child(2) { min-width: 0; }

@media (max-width: 1199px) {
    .about-care__features > div:first-child > div { flex-direction: row; justify-content: flex-start; text-align: left; }
    .about-care__features > div:first-child p { max-width: none; margin-inline: 0; }
    .about-care__features > div:first-child > div > :last-child { order: -1; }
}

@media (min-width: 480px) {
    .site-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .site-footer__brand,
    .site-footer__contact { grid-column: 1 / -1; }
}

@media (min-width: 640px) {
    .site-page { --site-header-height: 5.25rem; }
    .site-navbar { padding: 1rem 1.25rem; }
    #navbar .site-navbar__brand .site-logo { width: 8.5rem; }
    .site-navbar__appointment { display: inline-flex; }
    .site-page .blog-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
    .site-navbar__survey { display: inline-flex; }
    .site-page .contact-layout,
    .site-page .about-profile-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .site-footer__grid { grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)); }
    .site-footer__brand,
    .site-footer__contact { grid-column: auto; }
}

@media (min-width: 1100px) {
    .site-page .blog-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 1200px) {
    .site-page .about-care__features { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 1280px) {
    .site-navbar__inner { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 1.5rem; }
    .site-navbar__links { display: flex; align-items: center; gap: 1rem; white-space: nowrap; font-size: 0.9375rem; }
    .site-navbar__menu-toggle { display: none; }
    .site-mobile-menu { display: none !important; }
}
