/* AeroRede V2 — motion layer
   Movimento suave, rápido e reversível. Baseline: visual-approved-v2-2026-09-17.
*/

:root {
    --v2-motion-fast: 220ms;
    --v2-motion-base: 320ms;
    --v2-motion-slow: 520ms;
    --v2-motion-ease: cubic-bezier(.2,.72,.2,1);
}

html,
body,
.site-header,
.v2-hero,
.v2-section,
.v2-plan-card,
.v2-benefit-tile,
.v2-solution-card,
.v2-magazine-card,
.v2-footer,
.v2-region-dialog,
.v2-button,
.v2-theme-button,
.v2-region-chip,
.v2-chat-button {
    transition:
        background-color var(--v2-motion-base) var(--v2-motion-ease),
        border-color var(--v2-motion-base) var(--v2-motion-ease),
        color var(--v2-motion-fast) var(--v2-motion-ease),
        box-shadow var(--v2-motion-base) var(--v2-motion-ease),
        opacity var(--v2-motion-base) var(--v2-motion-ease),
        transform var(--v2-motion-base) var(--v2-motion-ease);
}

/* Entrada progressiva conforme o scroll */
.motion-enabled .v2-motion-item {
    opacity: 0;
    transform: translate3d(0, 18px, 0);
    will-change: opacity, transform;
}

.motion-enabled .v2-motion-item.motion-from-left {
    transform: translate3d(-20px, 0, 0);
}

.motion-enabled .v2-motion-item.motion-from-right {
    transform: translate3d(20px, 0, 0);
}

.motion-enabled .v2-motion-item.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition-delay: var(--motion-delay, 0ms);
}

/* Hero vivo, mas sem virar parque de diversões */
.v2-home .v2-hero-visual::before {
    background-position:
        calc(50% + var(--hero-shift-x, 0px))
        calc(50% + var(--hero-shift-y, 0px));
    animation: v2HeroBreath 8s ease-in-out infinite alternate;
    transition: background-position 180ms ease-out, filter var(--v2-motion-base) ease;
}

.v2-home .v2-hero-visual::after {
    animation: v2HeroGlow 5.5s ease-in-out infinite alternate;
}

.v2-home .v2-hero-orbit {
    animation: v2OrbitBreath 7s ease-in-out infinite alternate;
}

@keyframes v2HeroBreath {
    from { transform: scale(1.005); }
    to   { transform: scale(1.025); }
}

@keyframes v2HeroGlow {
    from { opacity: .72; }
    to   { opacity: 1; }
}

@keyframes v2OrbitBreath {
    from { opacity: .32; transform: scale(.99); }
    to   { opacity: .62; transform: scale(1.02); }
}

/* Cards: elevação curta, não salto */
@media (hover:hover) and (pointer:fine) {
    .v2-plan-card:hover,
    .v2-benefit-tile:hover,
    .v2-solution-card:hover,
    .v2-magazine-card:hover {
        transform: translateY(-5px);
    }

    .v2-plan-card:hover {
        box-shadow: 0 18px 42px color-mix(in srgb, var(--v2-accent) 10%, transparent);
    }

    .v2-button:hover,
    .v2-chat-button:hover,
    .v2-plan-action:hover {
        transform: translateY(-2px);
    }

    .v2-theme-button:hover,
    .v2-region-chip:hover,
    .v2-region-select:hover {
        transform: translateY(-1px);
    }
}

.v2-plan-card.is-featured {
    animation: v2FeaturedGlow 3.8s ease-in-out infinite alternate;
}

@keyframes v2FeaturedGlow {
    from { box-shadow: 0 12px 34px color-mix(in srgb, var(--v2-accent) 8%, transparent); }
    to   { box-shadow: 0 18px 48px color-mix(in srgb, var(--v2-accent) 18%, transparent); }
}

/* Filtros: troca com sensação de encaixe */
.v2-plan-filter button,
.v2-region-pills button {
    transition:
        color var(--v2-motion-fast) var(--v2-motion-ease),
        background var(--v2-motion-fast) var(--v2-motion-ease),
        border-color var(--v2-motion-fast) var(--v2-motion-ease),
        transform var(--v2-motion-fast) var(--v2-motion-ease);
}

.v2-plan-card.is-filter-entering {
    animation: v2FilterIn 320ms var(--v2-motion-ease) both;
}

@keyframes v2FilterIn {
    from { opacity: 0; transform: translateY(8px) scale(.985); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* Mapa e pins respirando discretamente */
.v2-coverage-map .map-pin i {
    animation: v2PinPulse 2.8s ease-in-out infinite;
}

.v2-coverage-map .map-pin:nth-of-type(2n) i { animation-delay: .45s; }
.v2-coverage-map .map-pin:nth-of-type(3n) i { animation-delay: .9s; }

@keyframes v2PinPulse {
    0%, 100% { transform: scale(1); box-shadow: 0 0 0 0 color-mix(in srgb, var(--v2-accent) 22%, transparent); }
    50%      { transform: scale(1.08); box-shadow: 0 0 0 8px transparent; }
}

/* Botão flutuante de atendimento */
.v2-chat-fab {
    animation: v2ChatPulse 3.4s ease-in-out infinite;
}

@keyframes v2ChatPulse {
    0%, 100% { box-shadow: 0 10px 30px color-mix(in srgb, var(--v2-accent) 16%, transparent); }
    50%      { box-shadow: 0 12px 38px color-mix(in srgb, var(--v2-accent) 28%, transparent); }
}

/* Abre modais sem estalo */
.region-modal:not([hidden]) .v2-region-dialog,
.benefit-dialog:not([hidden]) .benefit-dialog-panel {
    animation: v2DialogIn 260ms var(--v2-motion-ease) both;
}

@keyframes v2DialogIn {
    from { opacity: 0; transform: translateY(10px) scale(.985); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
    }

    .motion-enabled .v2-motion-item {
        opacity: 1 !important;
        transform: none !important;
    }
}
