/* Keep these changes on the home page: other public layouts share site.css. */
.home-page {
    animation: none;
}

.home-page.intro-complete .header-left li,
.home-page.intro-complete .header-right li,
.home-page.intro-complete .header-login-btn,
.home-page.intro-complete .header-mobile-toggle {
    transition-delay: 0ms;
    transition-duration: 180ms;
}

/* Large blurred layers repaint the entire section while scrolling. */
.home-page .reveal,
.home-page .reveal.visible {
    opacity: 1;
    transform: none;
    filter: none;
    will-change: auto;
    transition: opacity 360ms ease, transform 360ms cubic-bezier(.22, 1, .36, 1);
}

.home-page.reveal-ready section.reveal:not(.visible) {
    opacity: 0;
    transform: translateY(12px);
}

.home-page .media-fade {
    opacity: 1;
    transform: none;
    filter: none;
    animation: none;
    background: none;
    transition: transform 420ms ease;
}

.home-page .cards-hero::before {
    opacity: 1;
    transform: none;
    filter: none;
    transition: none;
}

.home-page .cards-hero-video,
.home-page .cards-hero-media.is-playing .cards-hero-video {
    will-change: auto;
    transform: none;
    transition: none;
}

.home-page .cards-hero-media.is-finishing .cards-hero-video {
    filter: none;
    transform: none;
    transition: opacity 400ms ease;
}

.home-page .cards-hero-media.is-finishing .cards-hero-transition::before {
    animation-duration: 550ms;
}

.home-page.is-scrolled .header {
    background: rgba(17, 17, 17, .98);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .home-page.reveal-ready section.reveal:not(.visible) {
        opacity: 1;
        transform: none;
    }
}

/* Match Fran's head height to Lucio's while showing more of the original photo.
   Blend the photo's edges into its neutral background without another request. */
.home-page .nosotros-card--fran::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(transparent 50%, #111 90%), linear-gradient(90deg, #c9ccd4, #cacdd5 50%, #bfc4ce);
    filter: grayscale(1);
    transition: filter 500ms ease;
}
.home-page .nosotros-card--fran .nosotros-card-img {
    position: relative;
    width: 111.111111%;
    max-width: none;
    margin-left: -5.555556%;
    transform: translateY(-1.2%) scale(.9);
    transform-origin: center;
    mask-image: linear-gradient(transparent, #000 3%, #000 74%, transparent 100%);
}
.home-page .nosotros-card--fran:hover::before { filter: grayscale(0); }
.home-page .nosotros-card--fran:hover .nosotros-card-img { transform: translateY(-1.2%) scale(.936); }
@media (max-width: 768px) {
    .home-page .nosotros-cards { max-width: 380px; }
    .home-page .nosotros-card-img { object-position: center top !important; }
}

/* Reuse the portrait cards' existing button style for the team invitation. */
.home-page .nosotros-team-action {
    display: flex;
    justify-content: center;
    margin-top: 32px;
}
.home-page .nosotros-team-link {
    justify-content: center;
    max-width: 100%;
    min-height: 44px;
    margin-top: 0;
    text-decoration: none;
    transition: background-color 300ms, color 300ms, border-color 300ms;
}
.home-page .nosotros-team-link:hover,
.home-page .nosotros-team-link:focus-visible,
.home-page .nosotros-team-link:active {
    background: var(--white);
    color: var(--black);
    border-color: var(--white);
}
.home-page .nosotros-team-link:focus-visible {
    outline: 2px solid var(--white);
    outline-offset: 4px;
}
@media (prefers-reduced-motion: reduce) {
    .home-page .nosotros-team-link { transition: none; }
}