/**
 * Homepage subtle animations only — does not change layout.
 * Respects prefers-reduced-motion.
 */

/* Hero entrance */
body.home-page .hero-content-band .hero-badge,
body.home-page .hero-content-band h1,
body.home-page .hero-content-band .lead,
body.home-page .hero-content-band .home-hero-actions,
body.home-page .hero-content-band .hero-card {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity .55s ease, transform .55s ease;
}
body.home-page.hp-ready .hero-content-band .hero-badge { opacity: 1; transform: none; transition-delay: .05s; }
body.home-page.hp-ready .hero-content-band h1 { opacity: 1; transform: none; transition-delay: .12s; }
body.home-page.hp-ready .hero-content-band .lead { opacity: 1; transform: none; transition-delay: .2s; }
body.home-page.hp-ready .hero-content-band .home-hero-actions { opacity: 1; transform: none; transition-delay: .28s; }
body.home-page.hp-ready .hero-content-band .hero-card { opacity: 1; transform: none; transition-delay: .36s; }

/* Scroll reveal sections */
body.home-page .home-section.hp-reveal {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .55s ease, transform .55s ease;
}
body.home-page .home-section.hp-reveal.hp-in {
  opacity: 1;
  transform: none;
}

/* How-it-works sequential steps */
body.home-page .steps-grid .step-card {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .45s ease, transform .45s ease;
}
body.home-page .home-section.hp-in .steps-grid .step-card { opacity: 1; transform: none; }
body.home-page .home-section.hp-in .steps-grid .step-card:nth-child(1) { transition-delay: .05s; }
body.home-page .home-section.hp-in .steps-grid .step-card:nth-child(2) { transition-delay: .12s; }
body.home-page .home-section.hp-in .steps-grid .step-card:nth-child(3) { transition-delay: .19s; }
body.home-page .home-section.hp-in .steps-grid .step-card:nth-child(4) { transition-delay: .26s; }
body.home-page .home-section.hp-in .steps-grid .step-card:nth-child(5) { transition-delay: .33s; }
body.home-page .home-section.hp-in .steps-grid .step-card:nth-child(6) { transition-delay: .4s; }

/* Stats */
body.home-page .stats-row .stat-box {
  transition: transform .25s ease, box-shadow .25s ease;
}
body.home-page .stats-row .stat-box:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 22px rgba(15, 23, 42, .08);
}

/* Quick actions / contact / portfolio cards */
body.home-page .contact-card {
  transition: transform .25s ease, box-shadow .25s ease;
}
body.home-page .contact-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 28px rgba(15, 23, 42, .1);
}
body.home-page .contact-card .ico {
  display: inline-block;
  transition: transform .25s ease;
}
body.home-page .contact-card:hover .ico {
  transform: translateY(-2px);
}

/* Category chips */
body.home-page .cat-chip {
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}
body.home-page .cat-chip:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(15, 23, 42, .08);
}

/* Gallery subtle */
body.home-page .gallery-grid img,
body.home-page .gallery-item img,
body.home-page [class*="gallery"] img {
  transition: transform .35s ease;
}
body.home-page .gallery-grid a:hover img,
body.home-page .gallery-item:hover img {
  transform: scale(1.03);
}

/* Portfolio cards on home (#portfolio) */
body.home-page #portfolio .contact-card img {
  transition: transform .4s ease;
}
body.home-page #portfolio .contact-card:hover img {
  transform: scale(1.04);
}

/* Leader cards if any */
body.home-page .leader-card,
body.home-page .leaders-grid > * {
  transition: transform .25s ease, box-shadow .25s ease;
}
body.home-page .leader-card:hover,
body.home-page .leaders-grid > *:hover {
  transform: translateY(-3px);
}

@media (prefers-reduced-motion: reduce) {
  body.home-page .hero-content-band .hero-badge,
  body.home-page .hero-content-band h1,
  body.home-page .hero-content-band .lead,
  body.home-page .hero-content-band .home-hero-actions,
  body.home-page .hero-content-band .hero-card,
  body.home-page .home-section.hp-reveal,
  body.home-page .steps-grid .step-card,
  body.home-page .contact-card,
  body.home-page .cat-chip,
  body.home-page .stats-row .stat-box,
  body.home-page .contact-card .ico,
  body.home-page #portfolio .contact-card img,
  body.home-page .gallery-grid img,
  body.home-page .gallery-item img {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}


/* ===== Hero CTA cards (File / Track / Login) ===== */
body.home-page .home-cta-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
  width: 100%;
  max-width: 640px;
}
body.home-page .home-cta-cards .cta-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.35rem;
  min-height: 72px;
  padding: 0.9rem 1rem;
  text-align: left;
  text-decoration: none;
  border-radius: 12px;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .5s ease, transform .5s ease, box-shadow .25s ease, background-color .25s ease;
}
body.home-page.hp-ready .home-cta-cards .cta-card:nth-child(1) {
  opacity: 1; transform: none; transition-delay: .15s;
}
body.home-page.hp-ready .home-cta-cards .cta-card:nth-child(2) {
  opacity: 1; transform: none; transition-delay: .25s;
}
body.home-page.hp-ready .home-cta-cards .cta-card:nth-child(3) {
  opacity: 1; transform: none; transition-delay: .35s;
}
body.home-page .home-cta-cards .cta-ico {
  font-size: 1.15rem;
  line-height: 1;
  transition: transform .25s ease;
}
body.home-page .home-cta-cards .cta-label {
  font-weight: 700;
  font-size: 0.88rem;
  line-height: 1.25;
}
body.home-page .home-cta-cards .cta-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 26px rgba(0,0,0,.18);
}
body.home-page .home-cta-cards .cta-card:hover .cta-ico {
  transform: scale(1.08);
}
body.home-page .home-cta-cards .cta-card:focus-visible {
  outline: 2px solid #fbbf24;
  outline-offset: 2px;
}
body.home-page .home-cta-cards .cta-card-primary {
  box-shadow: 0 6px 18px rgba(225,29,72,0.28);
}

/* Sticky nav offset for anchors */
body.home-page #about,
body.home-page #portfolio,
body.home-page #leaders,
body.home-page #how,
body.home-page #contact,
body.home-page #quick-actions {
  scroll-margin-top: 80px;
}

/* Active nav link */
body.home-page .home-nav-links a.nav-active {
  background: rgba(255,255,255,0.18);
  font-weight: 700;
}

@media (max-width: 900px) {
  body.home-page .home-cta-cards {
    grid-template-columns: 1fr 1fr;
    max-width: 100%;
  }
  body.home-page .home-cta-cards .cta-card:last-child {
    grid-column: 1 / -1;
  }
}
@media (max-width: 560px) {
  body.home-page .home-cta-cards {
    grid-template-columns: 1fr;
  }
  body.home-page .home-cta-cards .cta-card:last-child {
    grid-column: auto;
  }
  body.home-page .home-cta-cards .cta-card {
    min-height: 64px;
    padding: 0.85rem 1rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.home-page .home-cta-cards .cta-card {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}


/* Homepage portfolio image fit */
body.home-page #portfolio .pf-home-media {
  width: 100%;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #e2e8f0;
}
body.home-page #portfolio .pf-home-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}


/* Never animate the hero photo band */
body.home-page .hero-photo-wrap,
body.home-page .hero-photo-wrap * {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
}

@media (min-width: 901px) {
  body.home-page .hero-photo-wrap,
  body.home-page .hero-photo-wrap img,
  body.home-page .hero-photo-wrap .photo-fallback {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }
}

/* Desktop: hero entrance without translate (avoids stacking during smooth scroll) */
@media (min-width: 768px) {
  body.home-page .hero-content-band .hero-badge,
  body.home-page .hero-content-band h1,
  body.home-page .hero-content-band .lead,
  body.home-page .hero-content-band .home-hero-actions,
  body.home-page .hero-content-band .hero-card {
    transform: none !important;
  }
  body.home-page .home-section.hp-reveal {
    transform: none !important;
  }
  body.home-page .steps-grid .step-card {
    transform: none !important;
  }
}