:root {
    --navy: #303c96;
    --navy-2: #252f7d;
    --blue: #303c96;
    --blue-2: #4856b2;
    --teal: #52c447;
    --green: #52c447;
    --ink: #343746;
    --muted: #687087;
    --line: #e0e4e8;
    --soft: #f7fbf6;
    --sky: #f4f7ff;
    --sky-2: #f8f9ff;
    --reference-mint: #eef9ed;
    --reference-lime: #a7dd69;
    --reference-aqua: #72cfcd;
    --reference-pink: #edb8df;
    --shadow: 0 16px 34px rgba(48, 60, 150, .1);
    --site-max-width: 1180px;
    --site-gutter: clamp(18px, 4vw, 32px);
}

body {
    background: #ffffff;
    color: var(--ink);
}

h1, h2, h3, h4,
.service-card-title,
.feature-title,
.clinical-title,
.journey-title,
.doctor-title,
.story-title {
    color: var(--ink);
}

p { color: var(--muted); }

.wrap {
    width: 100%;
    max-width: calc(var(--site-max-width) + (var(--site-gutter) * 2));
    margin-inline: auto;
    padding-inline: var(--site-gutter);
}

.topbar {
    position: relative;
    overflow: hidden;
    background: linear-gradient(90deg, var(--navy) 0%, #39499a 43%, var(--green) 100%);
    color: #ffffff;
}

.topbar::after {
    content: "";
    position: absolute;
    inset: 0;
    background: url("../images/ekuphileni-watermark-transparent.png") right 58% / 420px auto no-repeat;
    opacity: .04;
    pointer-events: none;
}

.topbar .wrap {
    position: relative;
    z-index: 1;
    min-height: 34px;
    align-items: center;
    padding: 5px 0;
}

.topbar-contact,
.topbar-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 16px;
}

.topbar a,
.topbar span { color: rgba(255,255,255,.96); }
.topbar a:hover { text-decoration: underline; text-underline-offset: 3px; }
.topbar-actions a { font-weight: 800; }

.topbar-socials {
    display: flex;
    align-items: center;
    gap: 7px;
}

.topbar-social {
    width: 24px;
    height: 24px;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 50%;
    background: rgba(255,255,255,.1);
    color: #fff;
    font-size: 11px;
    font-weight: 850;
    line-height: 1;
}

.topbar-social svg { width: 13px; height: 13px; }
.topbar-social:hover { background: #fff; color: var(--navy); text-decoration: none; transform: translateY(-1px); }

.nav {
    background: rgba(255,255,255,.98);
    box-shadow: 0 8px 24px rgba(48,60,150,.06);
    border-bottom: 0;
}

.nav::after {
    height: 2px;
    background: linear-gradient(90deg, var(--navy) 0%, var(--green) 100%);
    opacity: 1;
}

.nav .wrap {
    min-height: 82px;
    padding-inline: var(--site-gutter);
}
.brand-logo { width: clamp(148px, 15vw, 190px); }
.navlinks {
    flex: 1 1 auto;
    gap: 7px;
    color: #53607a;
    font-size: 12px;
    font-weight: 760;
    flex-wrap: nowrap;
}
.navlinks .button {
    flex: 0 0 auto;
    min-height: 38px;
    padding-inline: 10px;
    font-size: 12px;
    white-space: nowrap;
}
.navlinks > a:not(.button), .nav-group-link { min-height: 40px; align-items: center; white-space: nowrap; }
.navlinks > a.is-active:not(.button),
.nav-group.is-current .nav-group-link { color: var(--navy); border-bottom-color: var(--green); }

.nav-dropdown {
    border-top: 3px solid var(--green);
    box-shadow: 0 20px 42px rgba(48,60,150,.15);
}

.nav-dropdown a:hover,
.nav-dropdown a.is-active { background: var(--reference-mint); }

.button {
    background: linear-gradient(105deg, var(--navy) 0%, #4350a8 42%, var(--green) 100%);
    box-shadow: 0 10px 22px rgba(48,60,150,.2);
}

.button:hover {
    background: linear-gradient(105deg, var(--navy-2) 0%, #364397 40%, #43b53e 100%);
    box-shadow: 0 13px 26px rgba(48,60,150,.26);
}

.button.secondary {
    background: #ffffff;
    color: var(--navy);
    border-color: #bfc7ed;
    box-shadow: none;
}

.button.secondary:hover { background: var(--sky-2); border-color: var(--navy); }
.button.ghost { background: var(--sky-2); color: var(--navy); border-color: #d8def4; box-shadow: none; }
.button.light { background: #ffffff; color: var(--navy); box-shadow: none; }
.text-link { color: var(--navy); }

.eyebrow {
    color: #3f9f3e;
    font-size: 12px;
}

.section { position: relative; }
.section.soft,
.section.tint,
.stories-section,
.about-purpose-section,
.about-management-section {
    overflow: hidden;
    background:
        linear-gradient(110deg, rgba(238,249,237,.98) 0%, rgba(255,255,255,.96) 52%, rgba(241,251,250,.96) 100%);
}

.section.soft::after,
.section.tint::after,
.stories-section::after,
.about-purpose-section::after,
.about-management-section::after {
    content: "";
    position: absolute;
    right: -100px;
    bottom: -54px;
    width: 430px;
    height: 220px;
    background: url("../images/ekuphileni-watermark-transparent.png") center / cover no-repeat;
    opacity: .04;
    pointer-events: none;
}

.section > .wrap,
.section > .wrap > * { position: relative; z-index: 1; }

.card, .panel {
    border-color: var(--line);
    box-shadow: var(--shadow);
}

.card:hover, .panel:hover { border-color: #c7d0ed; }

.badge {
    background: #eef1ff;
    color: var(--navy);
}

.badge.green { background: var(--reference-mint); color: #2d7e32; }

.page-hero {
    min-height: 290px;
    display: flex;
    align-items: center;
    background:
        linear-gradient(100deg, rgba(238,249,237,.98) 0%, rgba(255,255,255,.96) 58%, rgba(238,249,237,.9) 100%);
    border-bottom: 4px solid var(--green);
}

.page-hero::before {
    background:
        linear-gradient(100deg, rgba(255,255,255,.98) 0%, rgba(255,255,255,.88) 64%, rgba(255,255,255,.52) 100%),
        url("../images/ekuphileni-watermark-transparent.png") right center / 600px auto no-repeat;
}

.page-hero::after { border-radius: var(--radius) 0 0 var(--radius) !important; }
.page-hero .breadcrumbs { color: #6b7390; }
.page-hero .lead-dark { color: #59627d; }

.form-panel,
.booking-help-panel,
.contact-form-panel,
.filter-panel,
.specialist-filter-panel {
    border-top: 4px solid var(--green);
}

input, select, textarea {
    border-color: #d5dbe6;
    background: #ffffff;
}

input:hover, select:hover, textarea:hover { border-color: #aeb9d9; }
input:focus, select:focus, textarea:focus {
    border-color: var(--navy);
    box-shadow: 0 0 0 3px rgba(48,60,150,.12);
}

.request-progress span:nth-child(1) { border-top: 4px solid var(--reference-pink); }
.request-progress span:nth-child(2) { border-top: 4px solid var(--reference-lime); }
.request-progress span:nth-child(3) { border-top: 4px solid var(--reference-aqua); }

.portal-band,
.about-cta-band,
.media-cta-split {
    background: var(--navy);
    border-top-color: var(--green);
}

.portal-menu a.is-active,
.portal-menu a:hover { background: var(--reference-mint); color: var(--navy); }

.footer {
    position: relative;
    overflow: hidden;
    background: var(--navy);
    color: #ffffff;
    border-top: 7px solid var(--green);
    padding: 48px 0;
}

.footer::after {
    content: "";
    position: absolute;
    right: -90px;
    bottom: -32px;
    width: 520px;
    height: 260px;
    background: url("../images/ekuphileni-watermark-transparent.png") center / cover no-repeat;
    opacity: .04;
    pointer-events: none;
}

.footer .wrap { position: relative; z-index: 1; }
.footer-grid { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(220px,.82fr) minmax(220px,.78fr); gap: 54px; align-items: start; }
.footer-logo { display: block; width: min(100%, 330px); padding: 0; border-radius: 0; background: transparent; }
.footer-brand > p { max-width: 390px; }
.footer h3 { color: var(--green); }
.footer p, .footer a, .footer-credit small { color: rgba(255,255,255,.86); }
.footer a:hover { color: #ffffff; }
.footer-credit { border-left-color: var(--green); }
.footer-credit strong, .footer-credit a { color: #ffffff; }
.footer-socials { display: flex; align-items: center; gap: 9px; margin: 18px 0 20px; }
.footer-socials a { width: 36px; height: 36px; display: inline-grid; place-items: center; border: 1px solid rgba(255,255,255,.28); border-radius: 50%; background: rgba(255,255,255,.09); color: #fff; font-size: 13px; font-weight: 850; line-height: 1; transition: transform .16s ease, background .16s ease, border-color .16s ease; }
.footer-socials svg { width: 18px; height: 18px; }
.footer-socials a:hover { transform: translateY(-2px); border-color: var(--green); background: var(--green); color: #fff; text-decoration: none; }
.footer-contact-list, .footer-link-list { display: grid; gap: 13px; margin: 0; padding: 0; list-style: none; }
.footer-contact-list li { display: grid; grid-template-columns: 22px minmax(0,1fr); gap: 11px; align-items: start; color: rgba(255,255,255,.86); font-size: 14px; line-height: 1.55; }
.footer-contact-list svg { width: 20px; height: 20px; margin-top: 2px; color: var(--green); }
.footer-link-list { gap: 4px; }
.footer-link-list a { display: inline-flex; align-items: center; gap: 8px; min-height: 31px; font-size: 14px; }
.footer-link-list svg { width: 14px; height: 14px; color: var(--green); transition: transform .16s ease; }
.footer-link-list a:hover { text-decoration: none; }
.footer-link-list a:hover svg { transform: translateX(3px); }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 34px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.15); color: rgba(255,255,255,.66); font-size: 12px; }
.footer-bottom a { color: rgba(255,255,255,.8); }

.chatbot-toggle {
    background: linear-gradient(135deg, var(--navy), #4654ad);
    box-shadow: 0 16px 30px rgba(48,60,150,.25);
}
.chatbot-head { background: linear-gradient(90deg, var(--navy), #4654ad); }

@media (max-width: 900px) {
    :root { --site-gutter: 18px; }
    .wrap { max-width: calc(var(--site-max-width) + (var(--site-gutter) * 2)); }
    .topbar-actions, .topbar-socials { display: none; }
    .topbar .wrap { justify-content: center; text-align: center; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 34px; }
    .footer-brand { grid-column: 1 / -1; }
    .section.soft::after,
    .section.tint::after,
    .stories-section::after,
    .about-purpose-section::after,
    .about-management-section::after { width: 300px; height: 160px; }
}

@media (max-width: 760px) {
    .nav .wrap {
        min-height: 70px;
        padding-inline: var(--site-gutter);
    }
    .brand-logo { width: 168px; }
    .navlinks { top: calc(100% + 2px); border-top: 3px solid var(--green); }
    .navlinks { font-size: 14px; }
    .page-hero { min-height: 250px; }
}

@media (max-width: 520px) {
    .topbar-contact { justify-content: center; gap: 2px 10px; }
    .topbar-contact .topbar-email { display: none; }
    .footer { padding-bottom: 96px; }
    .footer-grid { grid-template-columns: 1fr; gap: 30px; }
    .footer-brand { grid-column: auto; }
    .footer-bottom { align-items: flex-start; flex-direction: column; }
}

/* Client reference theme across all public, patient and doctor pages. */
.site-page:not(.site-page-home) main {
    background: #ffffff;
}

.site-page:not(.site-page-home) .page-hero {
    position: relative;
    min-height: 330px;
    padding: 60px 0;
    overflow: hidden;
    border-bottom: 5px solid var(--green);
    background: url("../images/ekuphileni-media/pixieset-61-DSCF3196.jpg") center / cover no-repeat;
    color: #ffffff;
}

.site-page:not(.site-page-home) .page-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        url("../images/ekuphileni-watermark-transparent.png") right -80px bottom -65px / 540px auto no-repeat,
        linear-gradient(96deg, rgba(37,47,125,.97) 0%, rgba(48,60,150,.91) 50%, rgba(48,60,150,.66) 100%);
    pointer-events: none;
}

.site-page:not(.site-page-home) .page-hero::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    width: auto;
    height: 5px;
    border-radius: 0 !important;
    background: linear-gradient(90deg, var(--green) 0 35%, var(--reference-aqua) 35% 69%, var(--reference-pink) 69% 100%);
    opacity: 1;
}

.site-page:not(.site-page-home) .page-hero .wrap,
.site-page:not(.site-page-home) .page-hero-shell { position: relative; z-index: 2; }
.site-page:not(.site-page-home) .page-hero h1,
.site-page:not(.site-page-home) .page-hero h2,
.site-page:not(.site-page-home) .page-hero h3 { color: #ffffff; }
.site-page:not(.site-page-home) .page-hero .lead-dark,
.site-page:not(.site-page-home) .page-hero p,
.site-page:not(.site-page-home) .page-hero .hint { color: rgba(255,255,255,.88); }
.site-page:not(.site-page-home) .page-hero .breadcrumbs { color: rgba(255,255,255,.72); }
.site-page:not(.site-page-home) .page-hero .eyebrow { color: #bce9b7; }
.site-page:not(.site-page-home) .page-hero .text-link,
.site-page:not(.site-page-home) .page-hero .inline-chat-link { color: #ffffff; }
.site-page:not(.site-page-home) .page-hero .panel {
    border-color: rgba(255,255,255,.28);
    background: rgba(255,255,255,.94);
    box-shadow: 0 22px 46px rgba(24,32,91,.25);
    backdrop-filter: blur(12px);
}
.site-page:not(.site-page-home) .page-hero .panel h2,
.site-page:not(.site-page-home) .page-hero .panel h3 { color: var(--navy); }
.site-page:not(.site-page-home) .page-hero .panel p,
.site-page:not(.site-page-home) .page-hero .panel span { color: var(--muted); }

.site-page.site-page-specialists-index .page-hero,
.site-page.site-page-specialists-show .page-hero { background-image: url("../images/radiology/mri-scan.jpg"); background-position: center 48%; }
.site-page.site-page-specialists-index .page-hero::before,
.site-page.site-page-specialists-show .page-hero::before {
    background: linear-gradient(96deg, rgba(37,47,125,.97) 0%, rgba(48,60,150,.91) 50%, rgba(48,60,150,.66) 100%);
}
.site-page.site-page-appointments-create .page-hero,
.site-page.site-page-patient-appointments-create .page-hero,
.site-page.site-page-doctor-portal .page-hero { background-image: url("../images/ekuphileni-media/pixieset-50-DSCF3166.jpg"); background-position: center 42%; }
.site-page.site-page-contact .page-hero { background-image: url("../images/ekuphileni-aerial.jpg"); background-position: center 47%; }
.site-page.site-page-library .page-hero,
.site-page.site-page-vacancies .page-hero { background-image: url("../images/ekuphileni-media/pixieset-45-DSCF3153.jpg"); background-position: center 45%; }
.site-page.site-page-pharmacy-index .page-hero,
.site-page.site-page-pharmacy-thanks .page-hero { background-image: url("../images/ekuphileni-media/pixieset-38-DSCF3138.jpg"); background-position: center 44%; }
.site-page.site-page-portal .page-hero,
.site-page.site-page-patient-login .page-hero,
.site-page.site-page-patient-register .page-hero,
.site-page.site-page-patient-dashboard .page-hero,
.site-page.site-page-patient-profile-edit .page-hero,
.site-page.site-page-patient-appointments-index .page-hero,
.site-page.site-page-patient-documents-index .page-hero,
.site-page.site-page-doctor-login .page-hero,
.site-page.site-page-doctor-dashboard .page-hero,
.site-page.site-page-doctor-schedule .page-hero { background-image: url("../images/ekuphileni-media/pixieset-61-DSCF3196.jpg"); }

.site-page:not(.site-page-home) .section:nth-of-type(even):not(.reference-location) {
    overflow: hidden;
    background: linear-gradient(110deg, rgba(238,249,237,.92), #ffffff 53%, rgba(241,251,250,.9));
}
.site-page:not(.site-page-home) .section:nth-of-type(even):not(.reference-location)::after {
    content: "";
    position: absolute;
    right: -100px;
    bottom: -55px;
    width: 420px;
    height: 210px;
    background: url("../images/ekuphileni-watermark-transparent.png") center / cover no-repeat;
    opacity: .0355;
    pointer-events: none;
}
.site-page:not(.site-page-home) .section > .wrap { position: relative; z-index: 1; }

.site-page:not(.site-page-home) main .section-head,
.site-page:not(.site-page-home) main .form-section-title {
    position: relative;
}
.site-page:not(.site-page-home) main .section-head::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -12px;
    width: 76px;
    height: 3px;
    background: linear-gradient(90deg, var(--navy), var(--green));
}

.site-page:not(.site-page-home) main .card,
.site-page:not(.site-page-home) main .panel,
.site-page:not(.site-page-home) main .article-card,
.site-page:not(.site-page-home) main .service-visual-card,
.site-page:not(.site-page-home) main .pharmacy-product-card {
    border-color: rgba(48,60,150,.1);
    box-shadow: 0 14px 30px rgba(48,60,150,.09);
}
.site-page:not(.site-page-home) main .grid > :nth-child(4n+1),
.site-page:not(.site-page-home) main .portal-stats > :nth-child(4n+1) { border-top-color: var(--reference-lime); }
.site-page:not(.site-page-home) main .grid > :nth-child(4n+2),
.site-page:not(.site-page-home) main .portal-stats > :nth-child(4n+2) { border-top-color: var(--reference-pink); }
.site-page:not(.site-page-home) main .grid > :nth-child(4n+3),
.site-page:not(.site-page-home) main .portal-stats > :nth-child(4n+3) { border-top-color: var(--reference-aqua); }
.site-page:not(.site-page-home) main .grid > :nth-child(4n+4),
.site-page:not(.site-page-home) main .portal-stats > :nth-child(4n+4) { border-top-color: #8f9de0; }

.site-page:not(.site-page-home) main .form-panel,
.site-page:not(.site-page-home) main .contact-form-panel,
.site-page:not(.site-page-home) main .pharmacy-checkout-panel,
.site-page:not(.site-page-home) main .filter-panel {
    border-top: 4px solid transparent;
    border-image: linear-gradient(90deg, var(--navy), var(--green), var(--reference-aqua)) 1;
}
.site-page:not(.site-page-home) main input,
.site-page:not(.site-page-home) main select,
.site-page:not(.site-page-home) main textarea {
    min-height: 46px;
    border-color: #d8ddea;
    background-color: #ffffff;
}
.site-page:not(.site-page-home) main textarea { min-height: 110px; }
.site-page:not(.site-page-home) main input:focus,
.site-page:not(.site-page-home) main select:focus,
.site-page:not(.site-page-home) main textarea:focus {
    border-color: var(--navy);
    box-shadow: 0 0 0 4px rgba(48,60,150,.11);
}
.site-page:not(.site-page-home) main .checkbox-row,
.site-page:not(.site-page-home) main .contact-method-grid label {
    border-color: #dce1ef;
    background: #f9fbff;
}
.site-page:not(.site-page-home) main .contact-method-grid label:has(input:checked) {
    border-color: var(--green);
    background: var(--reference-mint);
    box-shadow: 0 0 0 3px rgba(82,196,71,.1);
}

.site-page:not(.site-page-home) main table {
    width: 100%;
    overflow: hidden;
    border: 1px solid var(--line);
    border-collapse: separate;
    border-spacing: 0;
    background: #ffffff;
}
.site-page:not(.site-page-home) main th {
    background: var(--navy);
    color: #ffffff;
    font-weight: 800;
    text-align: left;
}
.site-page:not(.site-page-home) main th,
.site-page:not(.site-page-home) main td { padding: 12px 14px; border-bottom: 1px solid var(--line); }
.site-page:not(.site-page-home) main tbody tr:nth-child(even) { background: #f8fbf7; }
.site-page:not(.site-page-home) main tbody tr:hover { background: var(--reference-mint); }

.site-page:not(.site-page-home) main .portal-menu {
    overflow: hidden;
    padding: 10px;
    border: 1px solid rgba(48,60,150,.1);
    border-top: 4px solid var(--green);
    border-radius: var(--radius);
    background: #ffffff;
    box-shadow: var(--shadow);
}
.site-page:not(.site-page-home) main .portal-menu a,
.site-page:not(.site-page-home) main .portal-menu button { border: 0; box-shadow: none; }
.site-page:not(.site-page-home) main .portal-menu a.is-active {
    background: linear-gradient(105deg, var(--navy), #4654ad 58%, var(--green));
    color: #ffffff;
}

.site-page:not(.site-page-home) .service-story-hero,
.site-page:not(.site-page-home) .story-detail-hero,
.site-page:not(.site-page-home) .about-hero,
.site-page:not(.site-page-home) .media-tour-hero,
.site-page:not(.site-page-home) .services-visual-hero {
    border-bottom: 5px solid var(--green);
}
.site-page:not(.site-page-home) .about-hero::after,
.site-page:not(.site-page-home) .media-tour-hero::after,
.site-page:not(.site-page-home) .services-visual-hero::after {
    background-image: url("../images/ekuphileni-watermark-transparent.png");
}
.site-page:not(.site-page-home) .services-visual-hero .button,
.site-page:not(.site-page-home) .about-hero .button,
.site-page:not(.site-page-home) .media-tour-hero .button,
.site-page:not(.site-page-home) .service-story-hero .button {
    background: linear-gradient(105deg, var(--navy), #4654ad 52%, var(--green));
    border-color: rgba(255,255,255,.24);
}

@media (max-width: 900px) {
    .site-page:not(.site-page-home) .page-hero { min-height: 300px; padding: 48px 0; background-position: center; }
    .site-page:not(.site-page-home) .page-hero::before { background: linear-gradient(96deg, rgba(37,47,125,.94), rgba(48,60,150,.82)); }
}

@media (max-width: 640px) {
    .site-page:not(.site-page-home) .page-hero { min-height: 280px; padding: 40px 0; }
    .site-page:not(.site-page-home) .page-hero h1 { font-size: 31px; }
    .site-page:not(.site-page-home) main table { display: block; overflow-x: auto; white-space: nowrap; }
}

/* Mobile UX: compact navigation, comfortable forms and app-style quick actions. */
.nav-scrim { display: none; }

@media (max-width: 760px) {
    body.nav-menu-open { overflow: hidden; touch-action: none; }
    .nav { background: rgba(255,255,255,.99); }
    .nav .wrap { position: relative; z-index: 3; min-height: 72px; padding: 9px 0; }
    .brand-logo { width: 154px; }
    .nav-toggle { width: 44px; height: 44px; border-color: #d8deeb; box-shadow: 0 5px 16px rgba(48,60,150,.09); }
    .nav-scrim {
        position: fixed;
        z-index: 1;
        inset: 72px 0 0;
        width: 100%;
        border: 0;
        background: rgba(24,31,76,.38);
        backdrop-filter: blur(2px);
    }
    .nav.is-open .nav-scrim { display: block; }
    .navlinks {
        z-index: 4;
        top: calc(100% + 1px);
        max-height: calc(100dvh - 88px);
        overflow-y: auto;
        overscroll-behavior: contain;
        padding: 10px 10px calc(14px + env(safe-area-inset-bottom));
        border-radius: 0 0 var(--radius) var(--radius);
        box-shadow: 0 24px 46px rgba(24,31,76,.22);
    }
    .nav-group.is-current:not(.is-open) .nav-dropdown { display: none; }
    .navlinks > a:not(.button),
    .nav-group-link { min-height: 46px; }
    .nav-dropdown a { min-height: 44px; }

    .site-page:not(.site-page-home) .page-hero {
        min-height: 270px;
        padding: 34px 0 38px;
        background-position: center;
    }
    .site-page:not(.site-page-home) .page-hero h1 { font-size: 30px; line-height: 1.15; }
    .site-page:not(.site-page-home) .page-hero .lead-dark,
    .site-page:not(.site-page-home) .page-hero .lead { font-size: 15px; line-height: 1.55; }

    .request-progress { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; }
    .request-progress span {
        min-height: 62px;
        flex-direction: column;
        justify-content: center;
        gap: 5px;
        padding: 7px 3px;
        text-align: center;
        font-size: 10px;
        line-height: 1.15;
    }
    .request-progress span::before { width: 23px; height: 23px; flex: 0 0 23px; }
    .form-panel { gap: 15px; }
    .form-section-title { padding-bottom: 9px; }
    .form-section-title h2 { font-size: 18px; }
    .site-page main input:not([type="checkbox"]):not([type="radio"]),
    .site-page main select,
    .site-page main textarea {
        min-height: 50px;
        font-size: 16px;
    }
    .site-page main textarea { min-height: 116px; }
    .booking-submit-row { display: grid; grid-template-columns: 1fr; text-align: center; }
    .booking-submit-row .button { width: 100%; min-height: 50px; }
    .checkbox-row { align-items: flex-start; padding: 13px; line-height: 1.45; }
    .checkbox-row input { flex: 0 0 auto; margin-top: 2px; }

    .mobile-cta.compact {
        display: grid;
        grid-template-columns: repeat(4,minmax(0,1fr));
        align-items: stretch;
        gap: 2px;
        padding: 6px 8px calc(6px + env(safe-area-inset-bottom));
        border-top: 1px solid #dce1eb;
        background: rgba(255,255,255,.98);
        box-shadow: 0 -10px 28px rgba(30,40,96,.13);
    }
    .mobile-cta.compact .mobile-cta-item {
        min-width: 0;
        min-height: 52px;
        display: grid;
        place-items: center;
        align-content: center;
        gap: 3px;
        padding: 5px 2px;
        border: 0;
        border-radius: 6px;
        background: transparent;
        color: #697087;
        box-shadow: none;
        font: inherit;
        font-size: 10px;
        font-weight: 800;
        line-height: 1;
        cursor: pointer;
    }
    .mobile-cta.compact .mobile-cta-item svg { width: 21px; height: 21px; }
    .mobile-cta.compact .mobile-cta-item.is-active { background: var(--reference-mint); color: var(--navy); }
    .mobile-cta.compact .mobile-cta-item:first-child svg { color: var(--green); }
    .mobile-cta.compact .mobile-cta-item:focus-visible { outline: 2px solid var(--navy); outline-offset: -2px; }

    .footer { padding-top: 38px; padding-bottom: 94px; }
    .footer-grid { gap: 25px; }
    .footer-logo { width: min(100%, 285px); }
    .footer-column h3 { margin-bottom: 11px; }
    .footer-contact-list a,
    .footer-link-list a { min-height: 36px; align-items: center; }
    .footer-bottom { margin-top: 25px; }
}

@media (max-width: 360px) {
    :root { --site-gutter: 12px; }
    .brand-logo { width: 145px; }
    .site-page:not(.site-page-home) .page-hero h1 { font-size: 28px; }
    .request-progress span { font-size: 9px; }
}