/* Explain: Enhanced professional motion layer for site-wide animations. */
/* ===== Enhanced professional motion layer ===== */

/* Header gains depth once the page starts scrolling */
.site-pinned {
    transition: box-shadow .35s ease, background-color .35s ease;
}
.site-pinned.is-scrolled {
    box-shadow: 0 16px 34px -26px rgba(11, 33, 55, .6);
    background-color: var(--background-color);
}

/* Counting numbers stay width-stable while animating */
.stat-value {
    font-variant-numeric: tabular-nums;
    letter-spacing: .01em;
}

/* Gentle pulse on small accent icons */
.hero-badge i,
.study-eyebrow i,
.phones-title i {
    animation: motionPulse 2.6s ease-in-out infinite;
}
@keyframes motionPulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.18); }
}

/* Richer icon reaction on hover */
.service-card:hover .service-icon {
    transform: translateY(-4px) scale(1.08) rotate(-4deg);
}
.value-card:hover .value-icon {
    transform: translateY(-4px) scale(1.08) rotate(4deg);
}

/* Keep transforms GPU-friendly */
.service-card,
.value-card,
.branch-card,
.stat-card,
.why-media,
.study-band {
    will-change: transform;
}

/* Respect reduced-motion preferences */
@media (prefers-reduced-motion: reduce) {
    .hero-badge i,
    .study-eyebrow i,
    .phones-title i {
        animation: none !important;
    }
    .site-pinned {
        transition: none;
    }
    .service-card:hover .service-icon,
    .value-card:hover .value-icon {
        transform: none;
    }
}