/*
 * AMC Secure — Appointment page column alignment
 * Hero + booking form share the same centered 1180px shell as career/contact.
 */

body:not(.admin-body) main.appointment-page {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 0 28px !important;
    gap: var(--page-flow-gap, 10px) !important;
    align-items: center !important;
    background:
        radial-gradient(circle at 18% 8%, rgba(18, 168, 107, 0.12), transparent 28%),
        radial-gradient(circle at 82% 18%, rgba(11, 78, 162, 0.12), transparent 30%),
        #eef4f8 !important;
}

body:not(.admin-body) main.appointment-page > .hero-galaxy-banner {
    width: var(--page-shell-width, min(100% - 28px, 1180px));
    max-width: var(--site-content-max, 1180px);
    margin-inline: auto;
}

body:not(.admin-body) main.appointment-page > .page-flow {
    width: var(--page-shell-width, min(100% - 28px, 1180px));
    max-width: var(--site-content-max, 1180px);
    margin-inline: auto;
}

body:not(.admin-body) main.appointment-page .appointment-alert,
body:not(.admin-body) main.appointment-page .appointment-layout {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

body:not(.admin-body) main.appointment-page .appointment-layout {
    gap: var(--page-flow-gap, 10px) !important;
}

@media (max-width: 1024px) {
    body:not(.admin-body) main.appointment-page > .hero-galaxy-banner,
    body:not(.admin-body) main.appointment-page > .page-flow {
        width: min(100% - 20px, 1180px);
    }
}

@media (max-width: 900px) {
    body:not(.admin-body) main.appointment-page .appointment-layout {
        grid-template-columns: 1fr;
    }

    body:not(.admin-body) main.appointment-page .appointment-panel {
        order: -1;
    }
}