/*
 * Autos Esquivel — racing polish for the public footer.
 * Small cached override: fixes CTA contrast and adds subtle motorsport light effects
 * without images, libraries or additional JavaScript.
 */

/* The generic `.ae-footer a { color: inherit; }` selector is more specific than
 * the base primary-button class. Keep the CTA text explicitly black on white. */
.ae-footer a.ae-footer__button--primary,
.ae-footer a.ae-footer__button--primary:visited {
    color: #080809;
}

.ae-footer a.ae-footer__button--primary span,
.ae-footer a.ae-footer__button--primary i {
    color: inherit;
}

/* Give the CTA a more automotive silhouette and keep the highlight clipped. */
.ae-footer__button {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border-radius: 4px;
}

.ae-footer__button--primary {
    box-shadow:
        0 10px 30px rgba(0, 0, 0, .24),
        inset 0 0 0 1px rgba(0, 0, 0, .04);
}

/* Fast, narrow light sweep: more headlight reflection than glossy web-button. */
.ae-footer__button--primary::before {
    content: "";
    position: absolute;
    inset: -35% auto -35% -42%;
    z-index: -1;
    width: 28%;
    background: linear-gradient(105deg, transparent 12%, rgba(255,255,255,.15) 34%, rgba(255,255,255,.88) 50%, rgba(255,255,255,.15) 66%, transparent 88%);
    transform: skewX(-18deg);
    opacity: 0;
    pointer-events: none;
}

.ae-footer__button--primary:hover::before,
.ae-footer__button--primary:focus-visible::before {
    animation: ae-footer-button-flash 720ms cubic-bezier(.2,.75,.2,1) both;
}

/* A thin dark racing notch keeps the white CTA from looking like a plain rectangle. */
.ae-footer__button--primary::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 54px;
    height: 4px;
    background: repeating-linear-gradient(115deg, #111 0 8px, transparent 8px 12px);
    opacity: .92;
    pointer-events: none;
}

/* Speed-line atmosphere behind the footer CTA. Pure CSS and intentionally faint. */
.ae-footer::after {
    content: "";
    position: absolute;
    z-index: -1;
    top: 18px;
    right: -11vw;
    width: min(64vw, 900px);
    height: 310px;
    background:
        linear-gradient(112deg, transparent 0 55%, rgba(255,255,255,.05) 55.2% 55.55%, transparent 55.8% 100%),
        linear-gradient(112deg, transparent 0 65%, rgba(255,255,255,.035) 65.15% 65.42%, transparent 65.65% 100%),
        linear-gradient(112deg, transparent 0 75%, rgba(255,255,255,.025) 75.1% 75.3%, transparent 75.55% 100%);
    transform: skewX(-9deg);
    opacity: .85;
    pointer-events: none;
}

/* The new logo has three forward slashes. Echo them as a tiny racing signature. */
.ae-footer__logo {
    position: relative;
    isolation: isolate;
    overflow: visible;
    padding-right: 34px;
}

.ae-footer__logo::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 8px;
    width: 25px;
    height: 8px;
    background:
        linear-gradient(115deg, transparent 0 8%, #fff 9% 28%, transparent 29% 38%, #fff 39% 59%, transparent 60% 69%, #fff 70% 91%, transparent 92%);
    opacity: .82;
    filter: drop-shadow(0 0 7px rgba(255,255,255,.2));
    transform: skewX(-10deg);
    transition: opacity 180ms ease, transform 220ms cubic-bezier(.2,.8,.2,1), filter 220ms ease;
    pointer-events: none;
}

.ae-footer__logo:hover::after,
.ae-footer__logo:focus-visible::after {
    opacity: 1;
    filter: drop-shadow(0 0 9px rgba(255,255,255,.48));
    transform: translateX(3px) skewX(-10deg);
}

/* A controlled lens glint around the logo instead of a permanent glow. */
.ae-footer__logo::before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 23%;
    top: 47%;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #fff;
    box-shadow:
        0 0 5px rgba(255,255,255,.95),
        0 0 16px rgba(255,255,255,.42),
        0 0 34px rgba(255,255,255,.18);
    opacity: 0;
    transform: scale(.5);
    pointer-events: none;
    animation: ae-footer-logo-glint 6.8s ease-in-out infinite;
}

/* Small star-like flashes placed sparsely in the CTA zone. */
.ae-footer__cta-copy {
    position: relative;
}

.ae-footer__cta-copy::after {
    content: "";
    position: absolute;
    left: min(72%, 610px);
    top: -16px;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #fff;
    box-shadow:
        0 0 6px rgba(255,255,255,.95),
        0 0 18px rgba(255,255,255,.35),
        24px 38px 0 -1px rgba(255,255,255,.5),
        -38px 74px 0 -1px rgba(255,255,255,.35);
    opacity: .7;
    animation: ae-footer-spark-pulse 4.8s ease-in-out infinite;
    pointer-events: none;
}

/* Mantiene el mismo lenguaje editorial del hero: mayúsculas, primera línea sólida
 * y segunda línea fina/outline. */
.ae-footer__cta h2 {
    max-width: 900px;
    display: grid;
    gap: .08em;
    font-size: clamp(46px, 5.15vw, 78px);
    font-weight: 700;
    line-height: .92;
    letter-spacing: -.047em;
    text-transform: uppercase;
    text-wrap: initial;
}

.ae-footer__cta-title-main,
.ae-footer__cta-title-accent {
    display: block;
    white-space: nowrap;
}

.ae-footer__cta-title-accent {
    position: relative;
    width: max-content;
    max-width: 100%;
    color: transparent;
    font-size: .82em;
    font-weight: 380;
    letter-spacing: -.035em;
    -webkit-text-stroke: 1.15px rgba(246, 246, 247, .96);
    text-shadow: 0 0 22px rgba(255,255,255,.025);
    background-image: linear-gradient(108deg,
        transparent 0%,
        transparent 41%,
        rgba(255,255,255,.07) 45%,
        rgba(255,255,255,.8) 49%,
        rgba(214,230,248,.82) 50%,
        rgba(255,255,255,.14) 54%,
        transparent 59%,
        transparent 100%);
    background-size: 280% 100%;
    background-position: 130% 0;
    -webkit-background-clip: text;
    background-clip: text;
    animation: ae-footer-title-specular 7.2s cubic-bezier(.32,.02,.22,1) infinite 1.35s;
}

/* Todo el contenido visible del footer usa mayúsculas. El cambio es únicamente
 * tipográfico: los valores reales del CRM, href, mailto y teléfonos no se alteran. */
.ae-footer :where(
    h1, h2, h3, h4,
    p, a, span, small, strong,
    address, button, time, dt, dd
) {
    text-transform: uppercase !important;
}

/* Editorial typography aligned with the header: uppercase navigation,
 * restrained tracking and lower visual weight. */
.ae-footer__column:not(.ae-footer__contact) > a,
.ae-footer__contact > a:not(.ae-footer__contact-primary):not([href^="mailto:"]),
.ae-footer__whatsapp,
.ae-footer__button {
    text-transform: uppercase;
    letter-spacing: .105em;
}

.ae-footer__column:not(.ae-footer__contact) > a,
.ae-footer__contact > a:not(.ae-footer__contact-primary):not([href^="mailto:"]) {
    font-size: 10.5px;
    font-weight: 520;
    line-height: 1.55;
}

.ae-footer__column:not(.ae-footer__contact) > a:hover,
.ae-footer__column:not(.ae-footer__contact) > a:focus-visible,
.ae-footer__contact > a:not(.ae-footer__contact-primary):not([href^="mailto:"]):hover,
.ae-footer__contact > a:not(.ae-footer__contact-primary):not([href^="mailto:"]):focus-visible {
    letter-spacing: .125em;
}

.ae-footer__button {
    font-size: 10.5px;
    font-weight: 600;
}

.ae-footer__whatsapp {
    font-size: 10px;
    font-weight: 580;
}

.ae-footer__bottom-location {
    font-size: 9.5px;
    font-weight: 520;
    letter-spacing: .09em;
    text-transform: uppercase;
}

@keyframes ae-footer-button-flash {
    0% { left: -42%; opacity: 0; }
    18% { opacity: .8; }
    100% { left: 118%; opacity: 0; }
}

@keyframes ae-footer-logo-glint {
    0%, 71%, 100% { opacity: 0; transform: scale(.45); }
    74% { opacity: .95; transform: scale(1); }
    77% { opacity: .28; transform: scale(.72); }
    80% { opacity: .8; transform: scale(.92); }
    84% { opacity: 0; transform: scale(.5); }
}

@keyframes ae-footer-spark-pulse {
    0%, 45%, 100% { opacity: .18; transform: scale(.7); }
    52% { opacity: .85; transform: scale(1); }
    60% { opacity: .28; transform: scale(.78); }
}

@keyframes ae-footer-title-specular {
    0%, 61%, 100% { background-position: 130% 0; }
    70% { background-position: 72% 0; }
    82% { background-position: -12% 0; }
    90% { background-position: -38% 0; }
}

@media (max-width: 760px) {
    .ae-footer::after {
        right: -48vw;
        width: 130vw;
        opacity: .5;
    }

    .ae-footer__logo {
        padding-right: 30px;
    }

    .ae-footer__cta-copy::after {
        left: 82%;
        top: -8px;
    }

    .ae-footer__cta h2 {
        font-size: clamp(38px, 10.5vw, 58px);
        letter-spacing: -.041em;
    }
}

@media (max-width: 520px) {
    .ae-footer__button--primary::after {
        width: 44px;
    }

    .ae-footer__cta-copy::after {
        display: none;
    }

    .ae-footer__cta h2 {
        font-size: clamp(32px, 9.5vw, 46px);
    }

    .ae-footer__cta-title-accent {
        font-size: .84em;
        -webkit-text-stroke-width: 1px;
    }

    .ae-footer__column:not(.ae-footer__contact) > a,
    .ae-footer__contact > a:not(.ae-footer__contact-primary):not([href^="mailto:"]) {
        letter-spacing: .09em;
    }
}

@media (max-width: 360px) {
    .ae-footer__cta h2 {
        font-size: 30px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ae-footer__button--primary::before,
    .ae-footer__logo::before,
    .ae-footer__cta-copy::after,
    .ae-footer__cta-title-accent {
        animation: none !important;
    }

    .ae-footer__logo::before {
        display: none;
    }
}