/* Contact page: one clear content surface, with only the address and map
   retained as information cards.  Scoped to this page so shared templates
   and the homepage are not affected. */
body.contact-page {
    --contact-ink: #102a43;
    --contact-blue: #1769a6;
    --contact-teal: #168f96;
    --contact-line: #dbe8ef;
    --contact-soft: #f5fafc;
    background: var(--contact-soft) !important;
}

body.contact-page #content {
    background: transparent !important;
}

body.contact-page #content > .breadcrumb {
    margin: 0 auto !important;
    padding: 18px 0 12px !important;
    border-bottom: 1px solid var(--contact-line);
    color: #6d8190 !important;
}

body.contact-page #content > .breadcrumb a {
    color: var(--contact-blue) !important;
}

body.contact-page #title-16045790 {
    margin: 0 auto !important;
    padding: 34px 0 28px !important;
    color: var(--contact-ink) !important;
    font-size: clamp(30px, 3vw, 42px) !important;
    line-height: 1.2 !important;
    text-align: left !important;
}

body.contact-page #title-16045790::after {
    margin: 16px 0 0 !important;
    background: var(--contact-teal) !important;
}

/* Remove the legacy outer card around the page description. */
body.contact-page .descriptionContainer,
body.contact-page .main-section-container,
body.contact-page .main-section-loader,
body.contact-page .inner {
    width: 100% !important;
    max-width: none !important;
}

body.contact-page .description {
    width: auto !important;
    max-width: none !important;
    margin: 0 auto !important;
    padding: 0 0 54px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* The shared standard sheet uses an ID-heavy selector for this legacy
   wrapper, so repeat the scope with #content to make the reset authoritative. */
body.contact-page #content .description {
    width: 100% !important;
    max-width: none !important;
    margin: 0 auto !important;
    padding: 0 0 54px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Contact information becomes the single main section instead of a framed
   panel containing another framed panel. */
body.contact-page .contact-info-section {
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 46px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
}

body.contact-page .contact-info-section > h2 {
    margin: 0 0 22px !important;
    color: var(--contact-ink) !important;
    font-size: clamp(24px, 2.1vw, 31px) !important;
    line-height: 1.3 !important;
    text-align: left !important;
}

body.contact-page .contact-info-section > h2::after {
    content: "";
    display: block;
    width: 58px;
    height: 4px;
    margin-top: 12px;
    border-radius: 999px;
    background: var(--contact-teal);
}

body.contact-page .contact-info-section > div {
    display: grid !important;
    grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr) !important;
    gap: 24px !important;
    width: 100% !important;
    max-width: none !important;
    align-items: stretch !important;
}

body.contact-page .contact-info-section > div > div:first-child,
body.contact-page .contact-info-section > div > div:last-child {
    box-sizing: border-box !important;
    min-width: 0 !important;
    background: #fff !important;
    border: 1px solid var(--contact-line) !important;
    border-radius: 18px !important;
    box-shadow: 0 10px 28px rgba(16, 42, 67, .07) !important;
}

body.contact-page .contact-info-section > div > div:first-child {
    padding: 30px !important;
}

body.contact-page .contact-info-section > div > div:last-child {
    overflow: hidden !important;
    padding: 0 !important;
}

body.contact-page .contact-info-section h3 {
    margin: 0 0 14px !important;
    color: var(--contact-ink) !important;
    font-size: 21px !important;
    line-height: 1.35 !important;
}

body.contact-page .contact-info-section h3 i {
    width: 30px;
    color: var(--contact-teal) !important;
    text-align: center;
}

body.contact-page .contact-info-section p {
    margin: 0 !important;
    color: #405b70 !important;
    font-size: 17px !important;
    line-height: 1.85 !important;
}

body.contact-page .contact-info-section h3:nth-of-type(2) {
    margin-top: 28px !important;
}

body.contact-page #content .contact-info-section a[href*="maps.google"] {
    margin-top: 22px !important;
    padding: 12px 18px !important;
    background: var(--contact-blue) !important;
    color: #fff !important;
    border-radius: 10px !important;
    box-shadow: 0 6px 16px rgba(23, 105, 166, .2) !important;
    font-size: 16px !important;
}

body.contact-page #content .contact-info-section a[href*="maps.google"] i {
    color: #fff !important;
}

body.contact-page #content .contact-info-section a[href*="maps.google"]:hover {
    background: var(--contact-teal) !important;
}

body.contact-page .contact-info-section iframe {
    display: block;
    width: 100% !important;
    min-height: 450px;
    height: 100% !important;
    border: 0 !important;
}

/* Long-form SEO guidance is kept, but presented as content rather than
   another floating card. */
body.contact-page .content-enhancement {
    margin: 0 0 48px !important;
    padding: 42px 0 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-top: 1px solid var(--contact-line) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

body.contact-page .content-enhancement h2 {
    color: var(--contact-ink) !important;
}

body.contact-page .content-enhancement h2::after {
    background: var(--contact-teal) !important;
}

/* Align every main content block to the same 1,120px reading width.  The
   legacy template gives the lower sections 1,160px while the description
   column is 1,120px, which creates the uneven edges seen on the page. */
body.contact-page #content > .service-standard-cta,
body.contact-page #content > .service-related-links,
body.contact-page #content > .why-choose-us,
body.contact-page #content > .process-flow,
body.contact-page #content > .testimonials-section,
body.contact-page #content > .cta-section,
body.contact-page #content > .related-articles {
    box-sizing: border-box !important;
    width: calc(100% - 40px) !important;
    max-width: 1120px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

@media (max-width: 760px) {
    body.contact-page #content > .breadcrumb,
    body.contact-page #title-16045790,
    body.contact-page .description {
        width: calc(100% - 32px) !important;
    }

    body.contact-page #title-16045790 {
        padding: 26px 0 22px !important;
        font-size: 30px !important;
    }

    body.contact-page .contact-info-section > div {
        grid-template-columns: 1fr !important;
    }

    body.contact-page .contact-info-section > div > div:first-child {
        padding: 24px 20px !important;
    }

    body.contact-page .contact-info-section iframe {
        min-height: 330px;
    }

    body.contact-page .content-enhancement {
        padding-top: 32px !important;
    }

    body.contact-page #content > .service-standard-cta,
    body.contact-page #content > .service-related-links,
    body.contact-page #content > .why-choose-us,
    body.contact-page #content > .process-flow,
    body.contact-page #content > .testimonials-section,
    body.contact-page #content > .cta-section,
    body.contact-page #content > .related-articles {
        width: calc(100% - 32px) !important;
    }
}