/* ===== CONSOLIDATED LEGACY STYLES ===== */
/* Footer compartido en todas las páginas */
.site-footer {
    position: relative;
    overflow: hidden;
    color: #dbe9f3;
    background:
        radial-gradient(circle at 88% 8%, rgba(18, 143, 232, 0.13), transparent 20rem),
        linear-gradient(145deg, #061827 0%, #08273d 100%);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.site-footer__inner {
    width: min(1240px, calc(100% - 56px));
    margin-inline: auto;
    padding: clamp(34px, 4vw, 48px) 0 18px;
}

.site-footer__grid {
    display: grid;
    grid-template-columns: minmax(250px, 1.25fr) repeat(3, minmax(140px, 0.65fr));
    gap: clamp(24px, 3.5vw, 48px);
    align-items: start;
}

.site-footer__brand img {
    width: 142px;
    height: 58px;
    object-fit: contain;
    object-position: left center;
}

.site-footer__brand p {
    max-width: 350px;
    margin: 12px 0 0;
    color: #a9bfd0;
    font-size: 0.86rem;
    line-height: 1.55;
}

.site-footer h2,
.site-footer h3 {
    color: #ffffff;
}

.site-footer h3 {
    margin: 3px 0 13px;
    font-size: 0.77rem;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.site-footer__links {
    display: grid;
    gap: 8px;
}

.site-footer__links a,
.site-footer__placeholder {
    min-width: 0;
    color: #a9bfd0;
    font-size: 0.83rem;
    line-height: 1.4;
    overflow-wrap: anywhere;
    transition: color 200ms ease, transform 200ms ease;
}

.site-footer__links a {
    text-decoration: none;
}

.site-footer__links a:hover,
.site-footer__links a:focus-visible {
    color: #ffffff;
    transform: translateX(3px);
}

.site-footer__phone {
    color: #ffffff !important;
    font-weight: 800;
}

.site-footer__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    margin-top: 16px;
    padding: 9px 15px;
    border-radius: 9px;
    color: #061827;
    background: #ffffff;
    font-size: 0.8rem;
    font-weight: 800;
    text-decoration: none;
    transition: transform 220ms ease, background-color 220ms ease;
}

.site-footer__cta:hover,
.site-footer__cta:focus-visible {
    transform: translateY(-2px);
    background: #cfeeff;
}

.site-footer__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-top: clamp(26px, 3.5vw, 40px);
    padding-top: 15px;
    border-top: 1px solid rgba(255, 255, 255, 0.10);
    color: #819aad;
    font-size: 0.72rem;
    line-height: 1.4;
}

@media (max-width: 1050px) {
    .site-footer__grid {
        grid-template-columns: minmax(240px, 1.1fr) repeat(2, minmax(150px, 0.7fr));
    }

    .site-footer__contact-column {
        grid-column: 2 / -1;
    }
}

@media (max-width: 760px) {
    .site-footer__inner {
        width: min(100% - 36px, 680px);
        padding-top: 34px;
    }

    .site-footer__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 26px 22px;
    }

    .site-footer__brand,
    .site-footer__contact-column {
        grid-column: 1 / -1;
    }

    .site-footer__brand {
        display: grid;
        grid-template-columns: 130px minmax(0, 1fr);
        column-gap: 20px;
        align-items: center;
    }

    .site-footer__brand img {
        width: 130px;
        height: 54px;
    }

    .site-footer__brand p {
        margin-top: 0;
    }

    .site-footer__cta {
        grid-column: 1 / -1;
        justify-self: start;
        margin-top: 10px;
    }
}

@media (max-width: 520px) {
    .site-footer__inner {
        width: calc(100% - 28px);
        padding: 29px 0 16px;
    }

    .site-footer__grid {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .site-footer__brand,
    .site-footer__contact-column {
        grid-column: auto;
    }

    .site-footer__brand {
        display: block;
    }

    .site-footer__brand img {
        width: 122px;
        height: 50px;
    }

    .site-footer__brand p {
        margin-top: 10px;
        font-size: 0.82rem;
    }

    .site-footer__bottom {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
        margin-top: 25px;
        padding-top: 13px;
    }
}
/* === SOCIAL LINKS · FOOTER === */

.site-footer__socials {
    margin-top: 19px;

    display: flex;

    align-items: center;

    gap: 13px;
}

.site-footer__social-label {
    color: #ffffff;

    font-size: 0.69rem;

    font-weight: 850;

    letter-spacing: 0.10em;

    text-transform: uppercase;
}

.site-footer__social-links {
    display: flex;

    align-items: center;

    gap: 8px;
}

.site-footer__social-link {
    width: 38px;
    height: 38px;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            0.14
        );

    border-radius: 50%;

    color: #dbe9f3;

    background:
        rgba(
            255,
            255,
            255,
            0.06
        );

    text-decoration: none;

    transition:
        color 180ms ease,
        background-color 180ms ease,
        border-color 180ms ease,
        transform 180ms ease;
}

.site-footer__social-link svg {
    width: 18px;
    height: 18px;

    display: block;
}

.site-footer__social-link:hover,
.site-footer__social-link:focus-visible {
    color: #ffffff;

    background: #128fe8;

    border-color: #128fe8;

    transform:
        translateY(-2px);

    outline: none;
}

@media (max-width: 520px) {

    .site-footer__socials {
        margin-top: 15px;
    }

    .site-footer__social-link {
        width: 36px;
        height: 36px;
    }

}

/* === /SOCIAL LINKS · FOOTER === */

/* === ULTRA WASH MOBILE FOOTER CENTERING <= 520PX === */
@media (max-width: 520px) {
    .site-footer,
    .site-footer__inner,
    .site-footer__brand,
    .site-footer__contact-column {
        text-align: center;
    }

    .site-footer__brand img {
        margin-left: auto;
        margin-right: auto;

    }

    .site-footer__brand p {
        margin-left: auto;
        margin-right: auto;
    }

    .site-footer__links {
        justify-items: center;
    }

    .site-footer__cta {
        margin-left: auto;
        margin-right: auto;
    }

    .site-footer__bottom {
        align-items: center;
        text-align: center;
    }
}
/* === /ULTRA WASH MOBILE FOOTER CENTERING <= 520PX === */

/* PATCH 05 - MOBILE CONTENT CENTERING - SHARED FOOTER */
@media (max-width: 520px) {
    .site-footer__grid,
    .site-footer__brand,
    .site-footer__contact-column,
    .site-footer__links,
    .site-footer__bottom {
        text-align: center;
    }

    .site-footer__brand img,
    .site-footer__brand p,
    .site-footer__cta {
        margin-inline: auto;
    }

    .site-footer__brand img {
        object-position: center center;
    }

    .site-footer__cta {
        justify-self: center;
    }

    .site-footer__socials,
    .site-footer__social-links {
        justify-content: center;
    }

    .site-footer__bottom {
        align-items: center !important;
    }
}
/* === PRIVACY POLICY LINK · FOOTER === */

.site-footer__privacy-link {
    color: inherit;
    text-decoration: none;
    transition: color 180ms ease;
}

.site-footer__privacy-link:hover,
.site-footer__privacy-link:focus-visible {
    color: #ffffff;
}

@media (max-width: 520px) {
    .site-footer__privacy-link {
        align-self: center;
    }
}

/* === /PRIVACY POLICY LINK · FOOTER === */

/* =========================================================
   RESPONSIVE SHARED PASS · HOME → CONTACT
   El archivo ya se carga de último en todas las páginas públicas.
   Aquí quedan solo salvaguardas compartidas de tamaño/adaptación.
========================================================= */

body .primary-button,
body .secondary-button,
body .property-card__button,
body .results-gallery-button,
body .why-story__button,
body .service-stage__cta,
body .services-methods__cta,
body .services-final-cta__button,
body .areas-orbit-card__cta,
body .areas-custom-coverage__button,
body .gallery-hero__button,
body .gallery-submission__submit,
body .about-expect-cta__button,
body .contact-submit,
body .contact-call-button {
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

@media (max-width: 600px) {
    body .primary-button,
    body .secondary-button,
    body .property-card__button,
    body .results-gallery-button,
    body .why-story__button,
    body .service-stage__cta,
    body .services-methods__cta,
    body .services-final-cta__button,
    body .areas-custom-coverage__button,
    body .gallery-hero__button,
    body .gallery-submission__submit,
    body .about-expect-cta__button,
    body .contact-submit,
    body .contact-call-button {
        width: min(100%, 420px);
        min-height: 46px;
        margin-inline: auto;
        padding-inline: clamp(12px, 4vw, 20px);
        white-space: normal;
        overflow-wrap: anywhere;
        line-height: 1.25;
        text-align: center;
    }

    body .hero-buttons,
    body .services-final-cta__actions,
    body .areas-final-cta__actions,
    body .about-expect-cta__actions {
        width: 100%;
        max-width: 440px;
        margin-inline: auto;
    }
}

/* Header compacto para teléfonos realmente angostos. */
@media (max-width: 420px) {
    .main-header:not(:has(.main-navigation.is-open)),
    .main-header.scrolled:not(:has(.main-navigation.is-open)),
    .main-header.theme-dark:not(:has(.main-navigation.is-open)),
    .main-header.theme-light:not(:has(.main-navigation.is-open)) {
        grid-template-columns: minmax(94px, 1fr) 42px auto;
        gap: 6px;
        padding-inline: clamp(8px, 3vw, 12px) !important;
    }

    .main-header:not(:has(.main-navigation.is-open)) .logo-link,
    .main-header.scrolled:not(:has(.main-navigation.is-open)) .logo-link {
        width: clamp(98px, 29vw, 112px);
        height: 54px;
    }

    .main-header:not(:has(.main-navigation.is-open)) .menu-toggle,
    .main-header.scrolled:not(:has(.main-navigation.is-open)) .menu-toggle {
        width: 42px;
        height: 42px;
    }

    .main-header:not(:has(.main-navigation.is-open)) .quote-button,
    .main-header.scrolled:not(:has(.main-navigation.is-open)) .quote-button {
        min-height: 38px;
        padding: 8px 9px;
        font-size: clamp(10px, 2.75vw, 11px);
    }
}

/* En monitores grandes, la sección 2 de Inicio no queda encajonada. */
@media (min-width: 1600px) {
    body.home-page .property-services {
        padding-top: clamp(58px, 4vw, 82px);
        padding-right: max(5vw, calc((100vw - 1760px) / 2));
        padding-bottom: clamp(34px, 3vw, 60px);
        padding-left: max(5vw, calc((100vw - 1760px) / 2));
    }

    body.home-page .property-services__container {
        width: min(1680px, 92vw);
    }

    body.home-page .property-services__grid {
        width: min(1540px, 90vw);
        gap: clamp(30px, 2vw, 44px);
    }

    body.home-page .property-services__heading {
        max-width: 840px;
        margin-bottom: clamp(38px, 3vw, 56px);
    }

    body.home-page .property-services__heading h2 {
        font-size: clamp(40px, 2.65vw, 56px);
    }

    body.home-page .property-services__heading p {
        max-width: 820px;
        font-size: clamp(16px, 1vw, 19px);
    }
}

@media (min-width: 1600px) {
    .main-header {
        grid-template-columns: clamp(260px, 15vw, 330px) 1fr auto;
        gap: clamp(24px, 1.6vw, 38px);
        padding-inline: clamp(4.5%, 5vw, 6%);
    }

    .main-header.scrolled {
        padding-inline: clamp(4.5%, 5vw, 6%);
    }

    .logo-link {
        width: clamp(168px, 10vw, 205px);
        height: clamp(72px, 4.5vw, 86px);
    }

    .main-navigation {
        gap: clamp(28px, 1.65vw, 42px);
    }

    .nav-link,
    .call-link {
        font-size: clamp(13px, 0.78vw, 15px);
    }

    .quote-button {
        min-height: 44px;
        padding: 11px clamp(18px, 1.25vw, 26px);
        font-size: clamp(13px, 0.78vw, 15px);
    }

    body .primary-button,
    body .secondary-button,
    body .property-card__button,
    body .results-gallery-button,
    body .why-story__button,
    body .service-stage__cta,
    body .services-methods__cta,
    body .services-final-cta__button,
    body .areas-custom-coverage__button,
    body .gallery-hero__button,
    body .gallery-submission__submit,
    body .about-expect-cta__button,
    body .contact-submit,
    body .contact-call-button {
        min-height: clamp(48px, 2.7vw, 58px);
        padding-inline: clamp(20px, 1.35vw, 30px);
        font-size: clamp(13px, 0.82vw, 16px);
    }
}

@media (min-width: 2000px) {
    body.home-page .property-card__overlay h3 {
        font-size: clamp(34px, 1.7vw, 42px);
    }

    body.home-page .property-card__overlay p {
        max-width: 600px;
        font-size: clamp(16px, 0.86vw, 19px);
    }
}

@media (prefers-reduced-motion: reduce) {
    body .primary-button,
    body .secondary-button,
    body .property-card__button,
    body .results-gallery-button,
    body .why-story__button,
    body .service-stage__cta,
    body .services-methods__cta,
    body .services-final-cta__button,
    body .areas-orbit-card__cta,
    body .areas-custom-coverage__button,
    body .gallery-hero__button,
    body .about-expect-cta__button,
    body .contact-submit,
    body .contact-call-button {
        transition: none;
    }
}

/* =========================================================
   REVIEWS · BADGE VISUAL UNIFICADO
   Las tarjetas reales y de muestra usan una etiqueta neutral.
========================================================= */

.gallery-customer-review__source {
    color: #08734f !important;
    border-color: rgba(14, 132, 91, 0.18) !important;
    background: #e5f6ef !important;
    font-size: 0 !important;
}

.gallery-customer-review__source::before {
    content: "Customer Experience";
    font-size: 0.57rem;
    font-weight: 800;
    line-height: 1.2;
}

/* =========================================================
   SERVICE AREAS · FONDO INTERACTIVO 3 REGIONES
   Maryland / Virginia / Washington D.C.
   Normal: 33 / 33 / 33
   Hover/focus: 50 / 25 / 25
========================================================= */

.areas-page .areas-coverage-card {
    isolation: isolate;
}

.areas-page .areas-coverage-card__header {
    position: relative;
    z-index: 6;
}

.areas-page .areas-coverage-scene {
    z-index: 4;
}

/* Reutilizamos los tres elementos decorativos existentes como paneles fotográficos. */
.areas-page .areas-coverage-scene__circle,
.areas-page .areas-coverage-scene__route--one,
.areas-page .areas-coverage-scene__route--two {
    position: absolute !important;
    top: -118px !important;
    bottom: -20px !important;
    height: auto !important;
    right: auto !important;
    transform: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    pointer-events: none !important;
    opacity: 0.52;
    filter: saturate(0.95) contrast(1.02) brightness(0.82);
    background-repeat: no-repeat !important;
    background-size: cover !important;
    box-shadow: none !important;
    transition:
        left 440ms cubic-bezier(0.22, 0.8, 0.22, 1),
        width 440ms cubic-bezier(0.22, 0.8, 0.22, 1),
        opacity 320ms ease,
        filter 320ms ease !important;
}

.areas-page .areas-coverage-scene__circle {
    left: 0 !important;
    width: 33.333% !important;
    z-index: 0;
    background-image:
        linear-gradient(rgba(2, 21, 35, 0.46), rgba(2, 25, 41, 0.64)),
        url("../assets/areas/photos/maryland.jpg") !important;
    background-position: center 54% !important;
}

.areas-page .areas-coverage-scene__route--one {
    left: 33.333% !important;
    width: 33.334% !important;
    z-index: 0;
    background-image:
        linear-gradient(rgba(2, 21, 35, 0.46), rgba(2, 25, 41, 0.64)),
        url("../assets/areas/photos/virginia.jpg") !important;
    background-position: center 52% !important;
}

.areas-page .areas-coverage-scene__route--two {
    left: 66.667% !important;
    width: 33.333% !important;
    z-index: 0;
    background-image:
        linear-gradient(rgba(2, 21, 35, 0.46), rgba(2, 25, 41, 0.64)),
        url("../assets/areas/photos/washington-dc.jpg") !important;
    background-position: center 48% !important;
}

.areas-page .areas-coverage-scene__dot {
    display: none !important;
}

/* Las tarjetas ya no llevan la foto; quedan como vidrio oscuro sobre el fondo. */
.areas-page .areas-region-card,
.areas-page .areas-region-card--virginia,
.areas-page .areas-region-card--maryland,
.areas-page .areas-region-card--dc {
    background-image:
        linear-gradient(
            155deg,
            rgba(6, 28, 45, 0.84),
            rgba(8, 50, 78, 0.72)
        ) !important;
    background-color: rgba(5, 34, 54, 0.70) !important;
    background-position: center !important;
    background-size: auto !important;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

/* Maryland activo: 50 / 25 / 25 */
.areas-page .areas-coverage-scene:has(.areas-region-card--maryland:hover) .areas-coverage-scene__circle,
.areas-page .areas-coverage-scene:has(.areas-region-card--maryland:focus-within) .areas-coverage-scene__circle,
.areas-page .areas-coverage-scene:has(.areas-region-card--maryland.is-active) .areas-coverage-scene__circle {
    left: 0 !important;
    width: 50% !important;
    opacity: 0.74;
    filter: saturate(1.05) contrast(1.05) brightness(0.92);
}

.areas-page .areas-coverage-scene:has(.areas-region-card--maryland:hover) .areas-coverage-scene__route--one,
.areas-page .areas-coverage-scene:has(.areas-region-card--maryland:focus-within) .areas-coverage-scene__route--one,
.areas-page .areas-coverage-scene:has(.areas-region-card--maryland.is-active) .areas-coverage-scene__route--one {
    left: 50% !important;
    width: 25% !important;
}

.areas-page .areas-coverage-scene:has(.areas-region-card--maryland:hover) .areas-coverage-scene__route--two,
.areas-page .areas-coverage-scene:has(.areas-region-card--maryland:focus-within) .areas-coverage-scene__route--two,
.areas-page .areas-coverage-scene:has(.areas-region-card--maryland.is-active) .areas-coverage-scene__route--two {
    left: 75% !important;
    width: 25% !important;
}

/* Virginia activa: 25 / 50 / 25 */
.areas-page .areas-coverage-scene:has(.areas-region-card--virginia:hover) .areas-coverage-scene__circle,
.areas-page .areas-coverage-scene:has(.areas-region-card--virginia:focus-within) .areas-coverage-scene__circle,
.areas-page .areas-coverage-scene:has(.areas-region-card--virginia.is-active) .areas-coverage-scene__circle {
    left: 0 !important;
    width: 25% !important;
}

.areas-page .areas-coverage-scene:has(.areas-region-card--virginia:hover) .areas-coverage-scene__route--one,
.areas-page .areas-coverage-scene:has(.areas-region-card--virginia:focus-within) .areas-coverage-scene__route--one,
.areas-page .areas-coverage-scene:has(.areas-region-card--virginia.is-active) .areas-coverage-scene__route--one {
    left: 25% !important;
    width: 50% !important;
    opacity: 0.74;
    filter: saturate(1.05) contrast(1.05) brightness(0.92);
}

.areas-page .areas-coverage-scene:has(.areas-region-card--virginia:hover) .areas-coverage-scene__route--two,
.areas-page .areas-coverage-scene:has(.areas-region-card--virginia:focus-within) .areas-coverage-scene__route--two,
.areas-page .areas-coverage-scene:has(.areas-region-card--virginia.is-active) .areas-coverage-scene__route--two {
    left: 75% !important;
    width: 25% !important;
}

/* Washington D.C. activo: 25 / 25 / 50 */
.areas-page .areas-coverage-scene:has(.areas-region-card--dc:hover) .areas-coverage-scene__circle,
.areas-page .areas-coverage-scene:has(.areas-region-card--dc:focus-within) .areas-coverage-scene__circle,
.areas-page .areas-coverage-scene:has(.areas-region-card--dc.is-active) .areas-coverage-scene__circle {
    left: 0 !important;
    width: 25% !important;
}

.areas-page .areas-coverage-scene:has(.areas-region-card--dc:hover) .areas-coverage-scene__route--one,
.areas-page .areas-coverage-scene:has(.areas-region-card--dc:focus-within) .areas-coverage-scene__route--one,
.areas-page .areas-coverage-scene:has(.areas-region-card--dc.is-active) .areas-coverage-scene__route--one {
    left: 25% !important;
    width: 25% !important;
}

.areas-page .areas-coverage-scene:has(.areas-region-card--dc:hover) .areas-coverage-scene__route--two,
.areas-page .areas-coverage-scene:has(.areas-region-card--dc:focus-within) .areas-coverage-scene__route--two,
.areas-page .areas-coverage-scene:has(.areas-region-card--dc.is-active) .areas-coverage-scene__route--two {
    left: 50% !important;
    width: 50% !important;
    opacity: 0.74;
    filter: saturate(1.05) contrast(1.05) brightness(0.92);
}

/* En móvil mantenemos el fondo dividido y evitamos un hover pegajoso de táctil. */
@media (max-width: 700px) {
    .areas-page .areas-coverage-scene__circle {
        left: 0 !important;
        width: 33.333% !important;
    }

    .areas-page .areas-coverage-scene__route--one {
        left: 33.333% !important;
        width: 33.334% !important;
    }

    .areas-page .areas-coverage-scene__route--two {
        left: 66.667% !important;
        width: 33.333% !important;
    }

    .areas-page .areas-coverage-scene__circle,
    .areas-page .areas-coverage-scene__route--one,
    .areas-page .areas-coverage-scene__route--two {
        opacity: 0.34 !important;
        filter: saturate(0.88) brightness(0.72) !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .areas-page .areas-coverage-scene__circle,
    .areas-page .areas-coverage-scene__route--one,
    .areas-page .areas-coverage-scene__route--two {
        transition: none !important;
    }
}

/* ===== CONSOLIDATED LEGACY STYLES ===== */
/* =========================================================
   SERVICE AREAS · VISUAL REFINE V2
   Solo tratamiento visual. No modifica posiciones, slots,
   transforms ni la animación de mezcla/reparto.
========================================================= */

/* ---------------------------------------------------------
   1) TABS DE REGIÓN · FOTO MÁS VISIBLE + TEXTO LEGIBLE
--------------------------------------------------------- */
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__tabs .areas-orbit__tab {
    background-size: cover !important;
    background-repeat: no-repeat !important;
    color: #ffffff !important;
    text-shadow:
        0 2px 9px rgba(0, 0, 0, 0.78),
        0 1px 2px rgba(0, 0, 0, 0.72) !important;
}

html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__tabs .areas-orbit__tab[data-orbit-tab="virginia"] {
    background-image:
        linear-gradient(
            90deg,
            rgba(3, 24, 38, 0.62) 0%,
            rgba(3, 24, 38, 0.28) 52%,
            rgba(3, 24, 38, 0.08) 100%
        ),
        url("../assets/areas/photos/virginia.jpg") !important;
    background-position: center 47% !important;
}

html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__tabs .areas-orbit__tab[data-orbit-tab="maryland"] {
    background-image:
        linear-gradient(
            90deg,
            rgba(3, 24, 38, 0.60) 0%,
            rgba(3, 24, 38, 0.24) 52%,
            rgba(3, 24, 38, 0.06) 100%
        ),
        url("../assets/areas/photos/maryland.jpg") !important;
    background-position: center 45% !important;
}

html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__tabs .areas-orbit__tab[data-orbit-tab="dc"] {
    background-image:
        linear-gradient(
            90deg,
            rgba(3, 24, 38, 0.62) 0%,
            rgba(3, 24, 38, 0.27) 52%,
            rgba(3, 24, 38, 0.08) 100%
        ),
        url("../assets/areas/photos/washington-dc.jpg") !important;
    background-position: center 44% !important;
}

html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__tabs .areas-orbit__tab.is-active {
    border-color: rgba(47, 171, 255, 0.92) !important;
    box-shadow:
        0 14px 30px rgba(4, 80, 134, 0.20),
        inset 0 0 0 1px rgba(255, 255, 255, 0.16) !important;
}

html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__tabs .areas-orbit__tab > span,
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__tabs .areas-orbit__tab > small {
    color: #ffffff !important;
}

/* ---------------------------------------------------------
   2) TARJETAS · FOTO VISIBLE SIN TAPAR EL TEXTO
--------------------------------------------------------- */
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card {
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    border-color: rgba(77, 153, 193, 0.34) !important;
}

/* Laterales: apoyo claro solo detrás del texto, foto visible a la derecha. */
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card:not([data-orbit-slot="0"]) {
    background-image:
        linear-gradient(
            90deg,
            rgba(249, 252, 254, 0.94) 0%,
            rgba(244, 250, 253, 0.82) 46%,
            rgba(236, 247, 251, 0.50) 72%,
            rgba(230, 244, 250, 0.28) 100%
        ),
        var(--areas-region-photo) !important;
}

/* Central: zona oscura a la izquierda; fotografía mucho más visible al fondo. */
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card[data-orbit-slot="0"] {
    background-image:
        linear-gradient(
            90deg,
            rgba(3, 45, 69, 0.93) 0%,
            rgba(4, 67, 101, 0.76) 48%,
            rgba(4, 76, 113, 0.46) 72%,
            rgba(4, 76, 113, 0.24) 100%
        ),
        var(--areas-region-photo) !important;
    border-color: rgba(101, 211, 255, 0.46) !important;
}

/* Texto lateral más definido. */
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card:not([data-orbit-slot="0"])
    .areas-orbit-card__region,
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card:not([data-orbit-slot="0"])
    .areas-orbit-card__number,
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card:not([data-orbit-slot="0"])
    .areas-orbit-card__type,
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card:not([data-orbit-slot="0"])
    h3,
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card:not([data-orbit-slot="0"])
    p {
    text-shadow:
        0 1px 0 rgba(255, 255, 255, 0.92),
        0 1px 3px rgba(255, 255, 255, 0.60) !important;
}

/* Texto central protegido aunque la foto sea más visible. */
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card[data-orbit-slot="0"]
    .areas-orbit-card__region,
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card[data-orbit-slot="0"]
    .areas-orbit-card__number,
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card[data-orbit-slot="0"]
    .areas-orbit-card__type,
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card[data-orbit-slot="0"] h3,
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card[data-orbit-slot="0"] p,
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card[data-orbit-slot="0"]
    .areas-orbit-card__cta {
    text-shadow:
        0 2px 8px rgba(0, 0, 0, 0.48),
        0 1px 2px rgba(0, 0, 0, 0.52) !important;
}

/* ---------------------------------------------------------
   3) PROFUNDIDAD · MENOS EFECTO "FANTASMA"
   No se toca ningún transform ni posición.
--------------------------------------------------------- */
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card[data-orbit-slot="-1"],
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card[data-orbit-slot="1"] {
    opacity: 0.96 !important;
    filter: saturate(1.02) contrast(1.01) !important;
}

html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card[data-orbit-slot="-2"],
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card[data-orbit-slot="2"] {
    opacity: 0.82 !important;
    filter: saturate(0.98) contrast(1.01) !important;
}

html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card[data-orbit-slot="-3"],
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card[data-orbit-slot="3"] {
    opacity: 0.62 !important;
    filter: saturate(0.92) contrast(1.00) !important;
}

/* ---------------------------------------------------------
   4) MAPA REAL DEL ESTADO · VISIBLE ARRIBA A LA DERECHA
--------------------------------------------------------- */
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card::before {
    z-index: 1 !important;
    top: 48px !important;
    right: 10px !important;
    bottom: auto !important;
    width: 100px !important;
    height: 76px !important;
    opacity: 0.28 !important;
    background-size: contain !important;
    background-position: center !important;
    filter:
        brightness(0)
        saturate(100%)
        invert(42%)
        sepia(89%)
        saturate(1192%)
        hue-rotate(174deg)
        brightness(86%)
        contrast(94%) !important;
    transform: rotate(-4deg) scale(1) !important;
    pointer-events: none !important;
}

html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card[data-orbit-slot="0"]::before {
    opacity: 0.40 !important;
    filter:
        brightness(0)
        saturate(100%)
        invert(92%)
        sepia(20%)
        saturate(867%)
        hue-rotate(163deg)
        brightness(105%)
        contrast(101%) !important;
    transform: rotate(-3deg) scale(1.04) !important;
}

html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card__top,
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card__pin,
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card__body,
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card__condition,
html body.areas-page main.areas-main section.areas-orbit
    .areas-orbit__stage .areas-orbit-card__cta {
    position: relative !important;
    z-index: 2 !important;
}

/* ---------------------------------------------------------
   5) RESPONSIVE · MISMA ESTRUCTURA, SOLO AJUSTE VISUAL
--------------------------------------------------------- */
@media (max-width: 1020px) {
    html body.areas-page main.areas-main section.areas-orbit
        .areas-orbit__stage .areas-orbit-card::before {
        top: 45px !important;
        width: 90px !important;
        height: 68px !important;
    }
}

@media (max-width: 700px) {
    html body.areas-page main.areas-main section.areas-orbit
        .areas-orbit__tabs .areas-orbit__tab {
        text-shadow:
            0 2px 8px rgba(0, 0, 0, 0.82),
            0 1px 2px rgba(0, 0, 0, 0.72) !important;
    }

    html body.areas-page main.areas-main section.areas-orbit
        .areas-orbit__stage .areas-orbit-card:not([data-orbit-slot="0"]) {
        background-image:
            linear-gradient(
                90deg,
                rgba(249, 252, 254, 0.95) 0%,
                rgba(244, 250, 253, 0.84) 52%,
                rgba(232, 246, 251, 0.44) 100%
            ),
            var(--areas-region-photo) !important;
    }

    html body.areas-page main.areas-main section.areas-orbit
        .areas-orbit__stage .areas-orbit-card[data-orbit-slot="0"] {
        background-image:
            linear-gradient(
                90deg,
                rgba(3, 45, 69, 0.94) 0%,
                rgba(4, 67, 101, 0.78) 55%,
                rgba(4, 76, 113, 0.34) 100%
            ),
            var(--areas-region-photo) !important;
    }

    html body.areas-page main.areas-main section.areas-orbit
        .areas-orbit__stage .areas-orbit-card::before {
        top: 42px !important;
        right: 8px !important;
        width: 78px !important;
        height: 58px !important;
        opacity: 0.24 !important;
    }

    html body.areas-page main.areas-main section.areas-orbit
        .areas-orbit__stage .areas-orbit-card[data-orbit-slot="0"]::before {
        opacity: 0.34 !important;
    }
}

/* ===== CONSOLIDATED LEGACY STYLES ===== */
/* =========================================================
   SERVICE AREAS · HERO · ICONOS REALES DE ESTADO
   Solo mejora visibilidad de los PNG existentes.
   No modifica posiciones ni animacion de las tarjetas.
========================================================= */

body.areas-page .areas-hero__visual .areas-coverage-card
    .areas-region-card .areas-region-card__map {
    display: block !important;
    position: absolute !important;
    z-index: 4 !important;
    left: auto !important;
    object-fit: contain !important;
    object-position: center !important;
    opacity: 0.76 !important;
    filter:
        brightness(0)
        saturate(100%)
        invert(78%)
        sepia(27%)
        saturate(1220%)
        hue-rotate(165deg)
        brightness(108%)
        contrast(94%)
        drop-shadow(0 5px 8px rgba(0, 18, 34, 0.30)) !important;
    transform-origin: center !important;
    pointer-events: none !important;
    transition:
        opacity 210ms ease,
        transform 210ms ease,
        filter 210ms ease !important;
}

body.areas-page .areas-hero__visual .areas-coverage-card
    .areas-region-card .areas-region-card__map--maryland {
    top: 18px !important;
    right: 13px !important;
    width: 82px !important;
    height: 82px !important;
    transform: rotate(-7deg) scale(1) !important;
}

body.areas-page .areas-hero__visual .areas-coverage-card
    .areas-region-card .areas-region-card__map--virginia {
    top: 18px !important;
    right: 14px !important;
    width: 78px !important;
    height: 78px !important;
    transform: rotate(6deg) scale(1) !important;
}

body.areas-page .areas-hero__visual .areas-coverage-card
    .areas-region-card .areas-region-card__map--dc {
    top: 20px !important;
    right: 16px !important;
    width: 68px !important;
    height: 68px !important;
    transform: rotate(-5deg) scale(1) !important;
}

/* Reserva una zona limpia a la derecha para que el mapa no tape texto. */
body.areas-page .areas-hero__visual .areas-coverage-card
    .areas-region-card h3,
body.areas-page .areas-hero__visual .areas-coverage-card
    .areas-region-card p,
body.areas-page .areas-hero__visual .areas-coverage-card
    .areas-region-card a {
    max-width: calc(100% - 72px) !important;
}

body.areas-page .areas-hero__visual .areas-coverage-card
    .areas-region-card.is-hover-stable .areas-region-card__map,
body.areas-page .areas-hero__visual .areas-coverage-card
    .areas-region-card:hover .areas-region-card__map,
body.areas-page .areas-hero__visual .areas-coverage-card
    .areas-region-card:focus-visible .areas-region-card__map,
body.areas-page .areas-hero__visual .areas-coverage-card
    .areas-region-card.is-active .areas-region-card__map {
    opacity: 0.98 !important;
    transform: rotate(0deg) scale(1.08) !important;
    filter:
        brightness(0)
        saturate(100%)
        invert(88%)
        sepia(21%)
        saturate(1030%)
        hue-rotate(163deg)
        brightness(112%)
        contrast(96%)
        drop-shadow(0 7px 10px rgba(0, 18, 34, 0.34)) !important;
}

/* Tablet y tactil: misma silueta visible, siempre recta. */
@media (hover: none), (pointer: coarse) {
    body.areas-page .areas-hero__visual .areas-coverage-card
        .areas-region-card .areas-region-card__map,
    body.areas-page .areas-hero__visual .areas-coverage-card
        .areas-region-card.is-active .areas-region-card__map {
        opacity: 0.86 !important;
        transform: rotate(0deg) scale(1) !important;
    }
}

@media (max-width: 700px) {
    body.areas-page .areas-hero__visual .areas-coverage-card
        .areas-region-card .areas-region-card__map--maryland {
        top: 16px !important;
        right: 12px !important;
        width: 74px !important;
        height: 74px !important;
    }

    body.areas-page .areas-hero__visual .areas-coverage-card
        .areas-region-card .areas-region-card__map--virginia {
        top: 17px !important;
        right: 13px !important;
        width: 70px !important;
        height: 70px !important;
    }

    body.areas-page .areas-hero__visual .areas-coverage-card
        .areas-region-card .areas-region-card__map--dc {
        top: 18px !important;
        right: 14px !important;
        width: 62px !important;
        height: 62px !important;
    }
}

/* ===== CONSOLIDATED LEGACY STYLES ===== */
/* =========================================================
   SERVICE AREAS · HERO REGION CARDS · GLASS
   Solo cambia el acabado visual de las tres tarjetas.
   No modifica posiciones, inclinacion ni animaciones.
========================================================= */

html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene .areas-region-card {
    background:
        linear-gradient(
            145deg,
            rgba(24, 91, 132, 0.46) 0%,
            rgba(9, 53, 80, 0.34) 58%,
            rgba(4, 31, 48, 0.28) 100%
        ) !important;
    background-color: rgba(8, 43, 65, 0.30) !important;
    border-color: rgba(221, 245, 255, 0.32) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 18px 34px rgba(0, 25, 42, 0.20) !important;
    backdrop-filter: blur(12px) saturate(1.16) !important;
    -webkit-backdrop-filter: blur(12px) saturate(1.16) !important;
}

html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene .areas-region-card::before {
    background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.10),
        rgba(255, 255, 255, 0.015) 42%,
        transparent 68%
    ) !important;
    opacity: 1 !important;
}

html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene .areas-region-card h3,
html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene .areas-region-card p,
html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene .areas-region-card a {
    text-shadow: 0 2px 10px rgba(0, 18, 31, 0.62) !important;
}

/* En dispositivos tactiles reducimos el blur para cuidar rendimiento. */
@media (hover: none), (pointer: coarse), (max-width: 700px) {
    html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene .areas-region-card {
        background:
            linear-gradient(
                145deg,
                rgba(24, 91, 132, 0.50) 0%,
                rgba(8, 49, 75, 0.39) 60%,
                rgba(4, 31, 48, 0.34) 100%
            ) !important;
        backdrop-filter: blur(7px) saturate(1.10) !important;
        -webkit-backdrop-filter: blur(7px) saturate(1.10) !important;
    }
}

/* ===== CONSOLIDATED LEGACY STYLES ===== */
/* SERVICE AREAS · SECCION 2 · READABILITY */

html body.areas-page main.areas-main section.areas-orbit .areas-orbit__tabs .areas-orbit__tab {
    opacity: 1 !important;
    visibility: visible !important;
}

html body.areas-page main.areas-main section.areas-orbit .areas-orbit__tabs .areas-orbit__tab > span {
    font-size: clamp(1.08rem, 1.20vw, 1.30rem) !important;
    line-height: 1.05 !important;
}

html body.areas-page main.areas-main section.areas-orbit .areas-orbit__tabs .areas-orbit__tab > small {
    font-size: clamp(0.80rem, 0.88vw, 0.94rem) !important;
    line-height: 1.16 !important;
}

html body.areas-page main.areas-main section.areas-orbit .areas-orbit__header h2,
html body.areas-page main.areas-main section.areas-orbit .areas-orbit__header > p:not(.areas-orbit__eyebrow),
html body.areas-page main.areas-main section.areas-orbit .areas-orbit__status {
    color: #071a29 !important;
    text-shadow: none !important;
}

html body.areas-page main.areas-main section.areas-orbit .areas-orbit__status {
    font-weight: 800 !important;
}

html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card:not([data-orbit-slot="0"]) .areas-orbit-card__region,
html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card:not([data-orbit-slot="0"]) .areas-orbit-card__number,
html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card:not([data-orbit-slot="0"]) .areas-orbit-card__type,
html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card:not([data-orbit-slot="0"]) h3,
html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card:not([data-orbit-slot="0"]) p,
html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card:not([data-orbit-slot="0"]) .areas-orbit-card__condition,
html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card:not([data-orbit-slot="0"]) .areas-orbit-card__cta {
    color: #071a29 !important;
    text-shadow: none !important;
}

html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card[data-orbit-slot="0"] h3,
html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card[data-orbit-slot="0"] p,
html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card[data-orbit-slot="0"] .areas-orbit-card__type {
    color: #ffffff !important;
}

html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card__region,
html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card__number {
    font-size: clamp(0.78rem, 0.82vw, 0.90rem) !important;
}

html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card__type {
    font-size: clamp(0.82rem, 0.90vw, 0.98rem) !important;
}

html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card h3 {
    font-size: clamp(1.55rem, 1.72vw, 1.92rem) !important;
    line-height: 1.04 !important;
}

html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card p {
    font-size: clamp(0.88rem, 0.94vw, 1.02rem) !important;
    line-height: 1.38 !important;
}

html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card__cta {
    font-size: clamp(0.86rem, 0.92vw, 1rem) !important;
}

@media (max-width: 1020px) {
    html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card h3 {
        font-size: clamp(1.45rem, 2.55vw, 1.75rem) !important;
    }

    html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card p {
        font-size: clamp(0.86rem, 1.55vw, 0.98rem) !important;
    }
}

@media (max-width: 700px) {
    html body.areas-page main.areas-main .areas-coverage-scene.is-mobile-carousel {
        overflow-x: auto !important;
        overflow-y: hidden !important;
        touch-action: pan-x !important;
        overscroll-behavior-x: contain !important;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x mandatory;
        user-select: none;
        -webkit-user-select: none;
        cursor: grab;
    }

    html body.areas-page main.areas-main .areas-coverage-scene.is-mobile-carousel:active {
        cursor: grabbing;
    }

    html body.areas-page main.areas-main .areas-coverage-scene.is-mobile-carousel .areas-region-card,
    html body.areas-page main.areas-main .areas-coverage-scene.is-mobile-carousel .areas-region-card * {
        user-select: none;
        -webkit-user-select: none;
    }

    html body.areas-page main.areas-main .areas-coverage-scene.is-mobile-carousel .areas-region-card {
        pointer-events: auto !important;
        scroll-snap-align: center;
        -webkit-user-drag: none;
    }

    html body.areas-page main.areas-main section.areas-orbit .areas-orbit__tabs .areas-orbit__tab > span {
        font-size: 1.02rem !important;
    }

    html body.areas-page main.areas-main section.areas-orbit .areas-orbit__tabs .areas-orbit__tab > small {
        font-size: 0.78rem !important;
    }

    html body.areas-page main.areas-main section.areas-orbit .areas-orbit__status {
        font-size: 0.86rem !important;
        line-height: 1.30 !important;
    }

    html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card h3 {
        font-size: 1.52rem !important;
    }

    html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card p,
    html body.areas-page main.areas-main section.areas-orbit .areas-orbit__stage .areas-orbit-card__cta {
        font-size: 0.90rem !important;
    }
}

/* ===== CONSOLIDATED LEGACY STYLES ===== */
/* SERVICE AREAS · STATUS FINAL CONTRAST
   Este mismo elemento muestra Virginia, Maryland o Washington D. C.
   Se fuerza oscuro para que siempre sea legible sobre el fondo claro. */
html body.areas-page main.areas-main section#areas-orbit-coverage.areas-orbit div#areasOrbitStatus.areas-orbit__status {
    color: #071a29 !important;
    text-shadow: none !important;
    font-weight: 800 !important;
    opacity: 1 !important;
}

/* ===== CONSOLIDATED LEGACY STYLES ===== */
/* =========================================================
   SERVICE AREAS · HERO PHOTO TOP FILL
   Evita que aparezca una franja oscura sobre las tres fotos
   cuando el encabezado ocupa más altura (responsive/traducción).
   No modifica posiciones ni animaciones de las tarjetas.
========================================================= */

@media (min-width: 701px) {
    html body.areas-page main.areas-main .areas-hero .areas-hero__visual .areas-coverage-card #areasCoverageScene .areas-coverage-scene__circle,
    html body.areas-page main.areas-main .areas-hero .areas-hero__visual .areas-coverage-card #areasCoverageScene .areas-coverage-scene__route--one,
    html body.areas-page main.areas-main .areas-hero .areas-hero__visual .areas-coverage-card #areasCoverageScene .areas-coverage-scene__route--two {
        top: -230px !important;
        bottom: -28px !important;
        height: auto !important;
    }
}

/* =========================================================
   SERVICE AREAS · HERO REGIONES
   Escritorio: 33/33/33 -> 50/25/25 por hover.
   Móvil: misma interacción por tarjeta activa, sin levantar
   ni inclinar las tarjetas.
========================================================= */

body.areas-page .areas-hero__visual .areas-coverage-card {
    background: #071016 !important;
    isolation: isolate;
}

body.areas-page .areas-hero__visual .areas-coverage-card::before {
    opacity: 0.035 !important;
}

body.areas-page .areas-hero__visual .areas-coverage-card__header {
    position: relative;
    z-index: 10;
}

body.areas-page .areas-hero__visual .areas-coverage-card__header h2,
body.areas-page .areas-hero__visual .areas-coverage-card__header p,
body.areas-page .areas-hero__visual .areas-coverage-card__status {
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.72);
}

/* =========================================================
   ESCRITORIO · FONDO FULL BLEED
========================================================= */

html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene__circle,
html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene__route--one,
html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene__route--two {
    top: -118px !important;
    bottom: -20px !important;
    height: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-color: transparent !important;
    opacity: 0.84 !important;
    filter: saturate(1.02) contrast(1.02) brightness(0.88) !important;
    box-shadow: none !important;
}

html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene__circle {
    left: -23px !important;
    width: calc(33.333% + 23px) !important;
    background-image:
        linear-gradient(rgba(5, 8, 10, 0.10), rgba(5, 8, 10, 0.18)),
        url("../assets/areas/photos/maryland.jpg") !important;
    background-position: center 54% !important;
}

html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene__route--one {
    left: 33.333% !important;
    width: 33.334% !important;
    background-image:
        linear-gradient(rgba(5, 8, 10, 0.10), rgba(5, 8, 10, 0.18)),
        url("../assets/areas/photos/virginia.jpg") !important;
    background-position: center 50% !important;
}

html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene__route--two {
    left: 66.667% !important;
    width: calc(33.333% + 23px) !important;
    background-image:
        linear-gradient(rgba(5, 8, 10, 0.10), rgba(5, 8, 10, 0.18)),
        url("../assets/areas/photos/washington-dc.jpg") !important;
    background-position: center 48% !important;
}

html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene[data-hover-region="maryland"] .areas-coverage-scene__circle {
    left: -23px !important;
    width: calc(50% + 23px) !important;
    opacity: 1 !important;
    filter: saturate(1.05) contrast(1.04) brightness(1.01) !important;
}

html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene[data-hover-region="maryland"] .areas-coverage-scene__route--one {
    left: 50% !important;
    width: 25% !important;
}

html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene[data-hover-region="maryland"] .areas-coverage-scene__route--two {
    left: 75% !important;
    width: calc(25% + 23px) !important;
}

html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene[data-hover-region="virginia"] .areas-coverage-scene__circle {
    left: -23px !important;
    width: calc(25% + 23px) !important;
}

html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene[data-hover-region="virginia"] .areas-coverage-scene__route--one {
    left: 25% !important;
    width: 50% !important;
    opacity: 1 !important;
    filter: saturate(1.05) contrast(1.04) brightness(1.01) !important;
}

html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene[data-hover-region="virginia"] .areas-coverage-scene__route--two {
    left: 75% !important;
    width: calc(25% + 23px) !important;
}

html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene[data-hover-region="dc"] .areas-coverage-scene__circle {
    left: -23px !important;
    width: calc(25% + 23px) !important;
}

html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene[data-hover-region="dc"] .areas-coverage-scene__route--one {
    left: 25% !important;
    width: 25% !important;
}

html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene[data-hover-region="dc"] .areas-coverage-scene__route--two {
    left: 50% !important;
    width: calc(50% + 23px) !important;
    opacity: 1 !important;
    filter: saturate(1.05) contrast(1.04) brightness(1.01) !important;
}

/* =========================================================
   TARJETAS REGIONALES
========================================================= */

body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card,
body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card--virginia,
body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card--maryland,
body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card--dc {
    overflow: hidden !important;
    background:
        radial-gradient(
            circle at 88% 10%,
            rgba(61, 181, 255, 0.27),
            transparent 9rem
        ),
        linear-gradient(
            160deg,
            rgba(27, 94, 155, 0.96),
            rgba(9, 48, 88, 0.98)
        ) !important;
    background-color: #0b3155 !important;
    border-color: rgba(112, 210, 255, 0.25) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card__content,
body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card--virginia .areas-region-card__content,
body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card--maryland .areas-region-card__content,
body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card--dc .areas-region-card__content {
    position: relative;
    z-index: 3;
    padding-top: 0 !important;
    transform: translateY(15px) !important;
}

body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card__icon {
    display: none !important;
}

body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card .areas-region-card__map {
    display: block !important;
    position: absolute !important;
    top: 14px !important;
    right: 12px !important;
    left: auto !important;
    z-index: 2 !important;
    width: 72px !important;
    height: 72px !important;
    object-fit: contain !important;
    object-position: center !important;
    opacity: 0.38 !important;
    filter: drop-shadow(0 5px 8px rgba(0, 0, 0, 0.22)) !important;
    transform: rotate(-7deg) scale(1) !important;
    transform-origin: center !important;
    transition: transform 210ms ease, opacity 210ms ease !important;
    pointer-events: none !important;
}

body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card .areas-region-card__map--maryland {
    top: 11px !important;
    right: 8px !important;
    width: 82px !important;
    height: 82px !important;
    transform: rotate(-8deg) scale(1) !important;
}

body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card .areas-region-card__map--virginia {
    top: 12px !important;
    right: 10px !important;
    width: 76px !important;
    height: 76px !important;
    transform: rotate(7deg) scale(1) !important;
}

body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card .areas-region-card__map--dc {
    top: 15px !important;
    right: 12px !important;
    width: 64px !important;
    height: 64px !important;
    transform: rotate(-6deg) scale(1) !important;
}

body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card h3,
body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card p,
body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card a {
    max-width: calc(100% - 58px);
}

body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card.is-hover-stable .areas-region-card__map,
body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card:focus-visible .areas-region-card__map,
body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card.is-active .areas-region-card__map {
    opacity: 0.72 !important;
    transform: rotate(0deg) scale(1.10) !important;
}

/* Táctil/tablet: recto y sin elevación. */
@media (hover: none), (pointer: coarse) {
    body.areas-page .areas-coverage-scene.is-dealt .areas-region-card,
    body.areas-page .areas-coverage-scene.is-settled .areas-region-card,
    body.areas-page .areas-coverage-scene.is-dealt .areas-region-card:hover,
    body.areas-page .areas-coverage-scene.is-dealt .areas-region-card:focus-visible,
    body.areas-page .areas-coverage-scene.is-dealt .areas-region-card.is-active {
        transform:
            translate(
                calc(-50% + var(--card-x)),
                calc(-50% + var(--card-y))
            )
            rotate(0deg)
            scale(1) !important;
    }

    body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card .areas-region-card__map,
    body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card.is-active .areas-region-card__map,
    body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card:focus-visible .areas-region-card__map {
        transform: rotate(0deg) scale(1) !important;
    }
}

/* =========================================================
   MÓVIL · ORDEN DEL FONDO = ORDEN DEL CARRUSEL
   1 Virginia · 2 Maryland · 3 Washington D.C.
========================================================= */

@media (max-width: 700px) {
    body.areas-page .areas-hero__visual .areas-coverage-card {
        background-image:
            linear-gradient(rgba(4, 10, 14, 0.22), rgba(4, 10, 14, 0.34)),
            url("../assets/areas/photos/virginia.jpg"),
            url("../assets/areas/photos/maryland.jpg"),
            url("../assets/areas/photos/washington-dc.jpg") !important;
        background-repeat: no-repeat !important;
        background-size:
            100% 100%,
            33.333% 100%,
            33.334% 100%,
            33.333% 100% !important;
        background-position:
            0 0,
            0% 0,
            50% 0,
            100% 0 !important;
        transition:
            background-size 420ms cubic-bezier(0.22, 0.8, 0.22, 1),
            background-position 420ms cubic-bezier(0.22, 0.8, 0.22, 1) !important;
    }

    /* Virginia */
    body.areas-page .areas-hero__visual .areas-coverage-card:has(.areas-mobile-dot:nth-child(1).is-active) {
        background-size:
            100% 100%,
            50% 100%,
            25% 100%,
            25% 100% !important;
        background-position:
            0 0,
            0% 0,
            66.667% 0,
            100% 0 !important;
    }

    /* Maryland */
    body.areas-page .areas-hero__visual .areas-coverage-card:has(.areas-mobile-dot:nth-child(2).is-active) {
        background-size:
            100% 100%,
            25% 100%,
            50% 100%,
            25% 100% !important;
        background-position:
            0 0,
            0% 0,
            50% 0,
            100% 0 !important;
    }

    /* Washington D.C. */
    body.areas-page .areas-hero__visual .areas-coverage-card:has(.areas-mobile-dot:nth-child(3).is-active) {
        background-size:
            100% 100%,
            25% 100%,
            25% 100%,
            50% 100% !important;
        background-position:
            0 0,
            0% 0,
            33.333% 0,
            100% 0 !important;
    }

    html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene__circle,
    html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene__route--one,
    html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene__route--two {
        display: none !important;
    }

    body.areas-page .areas-coverage-scene.is-mobile-carousel .areas-region-card,
    body.areas-page .areas-coverage-scene.is-mobile-carousel.is-dealt .areas-region-card,
    body.areas-page .areas-coverage-scene.is-mobile-carousel.is-settled .areas-region-card,
    body.areas-page .areas-coverage-scene.is-mobile-carousel .areas-region-card:hover,
    body.areas-page .areas-coverage-scene.is-mobile-carousel .areas-region-card:focus-visible,
    body.areas-page .areas-coverage-scene.is-mobile-carousel .areas-region-card.is-active {
        transform: none !important;
    }

    body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card__content,
    body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card--virginia .areas-region-card__content,
    body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card--maryland .areas-region-card__content,
    body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card--dc .areas-region-card__content {
        transform: translateY(9px) !important;
    }

    body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card .areas-region-card__map,
    body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card .areas-region-card__map--maryland,
    body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card .areas-region-card__map--virginia,
    body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card .areas-region-card__map--dc,
    body.areas-page .areas-hero__visual .areas-coverage-card .areas-region-card.is-active .areas-region-card__map {
        opacity: 0.48 !important;
        transform: rotate(0deg) scale(1) !important;
    }
}

/* =========================================================
   SERVICE AREAS · SECCIÓN 2 SIN FOTOGRAFÍAS DE FONDO
   Mantiene el fondo base y toda la animación de tarjetas.
========================================================= */

body.areas-page .areas-orbit__backdrop {
    background-image: none !important;
    transform: none !important;
    transition: opacity 260ms ease !important;
    will-change: opacity;
}

body.areas-page .areas-orbit__backdrop::before {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

body.areas-page .areas-orbit.is-quick-region-switch .areas-orbit-card {
    transition:
        transform 260ms cubic-bezier(0.22, 0.82, 0.24, 1),
        opacity 180ms ease,
        filter 180ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease,
        background-color 160ms ease !important;
}

/* =========================================================
   SERVICE AREAS · AJUSTE RESPONSIVE FINAL
   1) La tarjeta grande siempre queda llena de borde a borde.
   2) Virginia gana una línea visual para equilibrar contenido.
   3) Las fotos viven en tabs y tarjetas de la sección 2,
      nunca como fondo completo de la sección.
========================================================= */

body.areas-page .areas-hero__visual .areas-coverage-card {
    overflow: hidden !important;
}

body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene {
    overflow: visible !important;
}

@media (min-width: 701px) {
    html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene__circle {
        left: -56px !important;
        width: calc(33.333% + 56px) !important;
    }

    html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene__route--two {
        width: calc(33.333% + 56px) !important;
    }

    html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene[data-hover-region="maryland"] .areas-coverage-scene__circle {
        left: -56px !important;
        width: calc(50% + 56px) !important;
    }

    html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene[data-hover-region="maryland"] .areas-coverage-scene__route--two {
        width: calc(25% + 56px) !important;
    }

    html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene[data-hover-region="virginia"] .areas-coverage-scene__circle,
    html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene[data-hover-region="dc"] .areas-coverage-scene__circle {
        left: -56px !important;
        width: calc(25% + 56px) !important;
    }

    html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene[data-hover-region="virginia"] .areas-coverage-scene__route--two {
        width: calc(25% + 56px) !important;
    }

    html body.areas-page .areas-hero__visual .areas-coverage-card .areas-coverage-scene[data-hover-region="dc"] .areas-coverage-scene__route--two {
        width: calc(50% + 56px) !important;
    }
}

body.areas-page .areas-region-card--virginia .areas-region-card__content > p::after {
    content: " · Nearby Areas";
}

/* Fotos por región: reutilizables sin animarlas ni aplicar blur. */
body.areas-page .areas-orbit__tab[data-orbit-tab="virginia"],
body.areas-page .areas-orbit-card[data-region="virginia"] {
    --areas-region-photo: url("../assets/areas/photos/virginia.jpg");
}

body.areas-page .areas-orbit__tab[data-orbit-tab="maryland"],
body.areas-page .areas-orbit-card[data-region="maryland"] {
    --areas-region-photo: url("../assets/areas/photos/maryland.jpg");
}

body.areas-page .areas-orbit__tab[data-orbit-tab="dc"],
body.areas-page .areas-orbit-card[data-region="dc"] {
    --areas-region-photo: url("../assets/areas/photos/washington-dc.jpg");
}

body.areas-page .areas-orbit__tab {
    background-image:
        linear-gradient(135deg, rgba(7, 34, 52, 0.74), rgba(8, 66, 102, 0.82)),
        var(--areas-region-photo) !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    color: #ffffff !important;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.52);
    overflow: hidden !important;
}

body.areas-page .areas-orbit__tab > span,
body.areas-page .areas-orbit__tab > small {
    color: #ffffff !important;
    position: relative;
    z-index: 2;
}

body.areas-page .areas-orbit__tab:not(.is-active) {
    background-image:
        linear-gradient(135deg, rgba(22, 45, 59, 0.68), rgba(33, 69, 91, 0.76)),
        var(--areas-region-photo) !important;
    opacity: 0.92;
}

body.areas-page .areas-orbit__tab.is-active {
    background-image:
        linear-gradient(135deg, rgba(0, 110, 202, 0.66), rgba(4, 84, 157, 0.82)),
        var(--areas-region-photo) !important;
    box-shadow: 0 14px 30px rgba(4, 80, 134, 0.20) !important;
}

body.areas-page .areas-orbit-card {
    background-image:
        linear-gradient(rgba(247, 251, 254, 0.90), rgba(232, 243, 249, 0.93)),
        var(--areas-region-photo) !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

body.areas-page .areas-orbit-card.is-active {
    background-image:
        linear-gradient(rgba(5, 76, 113, 0.82), rgba(4, 58, 91, 0.91)),
        var(--areas-region-photo) !important;
}

body.areas-page .areas-orbit-card:not(.is-active) .areas-orbit-card__region,
body.areas-page .areas-orbit-card:not(.is-active) .areas-orbit-card__number,
body.areas-page .areas-orbit-card:not(.is-active) .areas-orbit-card__type,
body.areas-page .areas-orbit-card:not(.is-active) h3,
body.areas-page .areas-orbit-card:not(.is-active) p {
    text-shadow: 0 1px 4px rgba(255, 255, 255, 0.72);
}

body.areas-page .areas-orbit-card.is-active .areas-orbit-card__region,
body.areas-page .areas-orbit-card.is-active .areas-orbit-card__number,
body.areas-page .areas-orbit-card.is-active .areas-orbit-card__type,
body.areas-page .areas-orbit-card.is-active h3,
body.areas-page .areas-orbit-card.is-active p,
body.areas-page .areas-orbit-card.is-active .areas-orbit-card__cta {
    text-shadow: 0 1px 7px rgba(0, 0, 0, 0.34);
}

@media (max-width: 1020px) {
    body.areas-page .areas-orbit__tab {
        background-position: center 46% !important;
    }

    body.areas-page .areas-orbit-card {
        background-position: center 48% !important;
    }
}

@media (max-width: 700px) {
    body.areas-page .areas-hero__visual .areas-coverage-card {
        background-origin: border-box !important;
        background-clip: border-box !important;
    }

    body.areas-page .areas-orbit__tab {
        background-position: center !important;
        text-shadow: 0 1px 6px rgba(0, 0, 0, 0.62);
    }

    body.areas-page .areas-orbit-card {
        background-position: center !important;
    }
}

/* =========================================================
   SERVICE AREAS · FOTOS MÁS VISIBLES + TABS MÁS GRANDES
   Mantiene la animación actual y solo mejora lectura/imagen.
========================================================= */

body.areas-page .areas-orbit__tabs {
    width: min(100%, 980px) !important;
    gap: clamp(12px, 1.35vw, 20px) !important;
}

body.areas-page .areas-orbit__tab {
    min-height: 94px !important;
    padding: 16px 22px !important;
    border-radius: 20px !important;
    background-image:
        linear-gradient(135deg, rgba(7, 34, 52, 0.38), rgba(8, 66, 102, 0.50)),
        var(--areas-region-photo) !important;
    text-shadow: 0 2px 9px rgba(0, 0, 0, 0.72) !important;
}

body.areas-page .areas-orbit__tab:not(.is-active) {
    background-image:
        linear-gradient(135deg, rgba(19, 41, 54, 0.34), rgba(22, 61, 83, 0.46)),
        var(--areas-region-photo) !important;
    opacity: 1 !important;
}

body.areas-page .areas-orbit__tab.is-active {
    background-image:
        linear-gradient(135deg, rgba(0, 102, 188, 0.34), rgba(4, 74, 138, 0.52)),
        var(--areas-region-photo) !important;
}

body.areas-page .areas-orbit__tab > span {
    font-size: clamp(1rem, 1.15vw, 1.12rem) !important;
}

body.areas-page .areas-orbit__tab > small {
    font-size: clamp(0.72rem, 0.85vw, 0.82rem) !important;
}

body.areas-page .areas-orbit-card {
    background-image:
        linear-gradient(rgba(247, 251, 254, 0.70), rgba(232, 243, 249, 0.78)),
        var(--areas-region-photo) !important;
}

body.areas-page .areas-orbit-card.is-active {
    background-image:
        linear-gradient(rgba(5, 76, 113, 0.56), rgba(4, 58, 91, 0.73)),
        var(--areas-region-photo) !important;
}

@media (max-width: 1020px) {
    body.areas-page .areas-orbit__tabs {
        width: min(100%, 900px) !important;
    }

    body.areas-page .areas-orbit__tab {
        min-height: 86px !important;
        padding: 14px 18px !important;
        border-radius: 18px !important;
    }
}

@media (max-width: 700px) {
    body.areas-page .areas-orbit__tabs {
        gap: 10px !important;
    }

    body.areas-page .areas-orbit__tab {
        min-height: 76px !important;
        padding: 12px 15px !important;
        border-radius: 16px !important;
    }

    body.areas-page .areas-orbit__tab > span {
        font-size: 0.96rem !important;
    }

    body.areas-page .areas-orbit__tab > small {
        font-size: 0.72rem !important;
    }

    body.areas-page .areas-orbit-card {
        background-image:
            linear-gradient(rgba(247, 251, 254, 0.74), rgba(232, 243, 249, 0.82)),
            var(--areas-region-photo) !important;
    }

    body.areas-page .areas-orbit-card.is-active {
        background-image:
            linear-gradient(rgba(5, 76, 113, 0.60), rgba(4, 58, 91, 0.76)),
            var(--areas-region-photo) !important;
    }
}