/* Active navigation: a persistent underline as well as a colour cue. */
.site-header nav a,
.site-header .mobile-navigation a {
    position: relative;
}
.site-header nav a::after,
.home .site-header nav a::after {
    content: "";
    position: absolute;
    inset: auto 0 7px;
    height: 2px;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 150ms cubic-bezier(0.16, 1, 0.3, 1);
}
.site-header nav a:is(:hover, :focus-visible, .active)::after,
.home .site-header nav a:is(:hover, :focus-visible, .active)::after {
    transform: scaleX(1);
}
.site-header nav a.active,
.site-header .mobile-navigation a.active {
    color: var(--green-deep);
}
.site-header .mobile-navigation a.active {
    background: var(--sage);
    box-shadow: inset 3px 0 var(--green-deep);
    text-decoration: underline;
    text-underline-offset: 4px;
}
.site-header a:focus-visible {
    outline: 2px solid var(--green-deep);
    outline-offset: 4px;
}
.site-header nav a:focus-visible::after {
    transition: none;
}

/* The shared reveal replaces the source's separate homepage entrance. */
.vd-motion-on .home-reveal {
    animation: none;
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .vd-motion-on main :is(.editorial-hero-media, .editorial-section-media,
    .home-about-portrait, .home-signals-image, .home-cabinet-photo, .legal-hero,
    .legal-section, .contact-simple-portrait) img {
        transition: scale 150ms cubic-bezier(0.16, 1, 0.3, 1);
    }
    .vd-motion-on main :is(.editorial-hero-media, .editorial-section-media,
    .home-about-portrait, .home-signals-image, .home-cabinet-photo, .legal-hero,
    .legal-section, .contact-simple-portrait) img:hover {
        scale: 1.02;
    }
    .vd-motion-on .home-service img,
    .vd-motion-on .pricing-card {
        transition: transform 150ms cubic-bezier(0.16, 1, 0.3, 1);
    }
    .vd-motion-on .pricing-card:hover {
        transform: translateY(-4px);
    }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .home-reveal { animation: none; }
    .site-header *, main *, .social-proof * {
        animation: none !important;
        transition: none !important;
    }
    .home-service:hover img { transform: none; }
}