/* Homepage-only motion. The default state stays fully visible if JavaScript is unavailable. */
:root {
  --br-motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

body.home.home-motion-ready .home-reveal {
  opacity: 0;
  --home-reveal-y: 1.25rem;
  transform: translate3d(0, var(--home-reveal-y), 0);
  transition:
    opacity 0.7s var(--br-motion-ease),
    transform 0.7s var(--br-motion-ease);
  transition-delay: var(--home-reveal-delay, 0ms);
}

body.home.home-motion-ready .home-reveal.is-visible {
  opacity: 1;
  --home-reveal-y: 0rem;
}

/* A little more lift on tactile elements makes the page feel responsive without adding noise. */
body.home .button,
body.home .header-cta,
body.home .hero-price-link,
body.home .trust-card,
body.home .home-pricing-row,
body.home .process-home-card,
body.home .delivery-timeline-card,
body.home .domain-hosting-card,
body.home .service-item,
body.home .business-index-list a,
body.home .faq-home-item summary {
  transition-timing-function: var(--br-motion-ease);
}

body.home .button,
body.home .header-cta {
  transition-duration: 220ms;
}

body.home .button:hover,
body.home .button:focus-visible,
body.home .header-cta:hover,
body.home .header-cta:focus-visible {
  transform: translateY(-3px);
}

body.home .button span[aria-hidden="true"],
body.home .digital-stats-action a span[aria-hidden="true"],
body.home .home-pricing-link span[aria-hidden="true"],
body.home .process-home-cta span[aria-hidden="true"],
body.home .business-index-arrow,
body.home .contact-actions .button span[aria-hidden="true"] {
  display: inline-block;
  transition: transform 220ms var(--br-motion-ease);
}

body.home .button:hover span[aria-hidden="true"],
body.home .button:focus-visible span[aria-hidden="true"],
body.home .digital-stats-action a:hover span[aria-hidden="true"],
body.home .digital-stats-action a:focus-visible span[aria-hidden="true"],
body.home .home-pricing-link:hover span[aria-hidden="true"],
body.home .home-pricing-link:focus-visible span[aria-hidden="true"],
body.home .process-home-cta:hover span[aria-hidden="true"],
body.home .process-home-cta:focus-visible span[aria-hidden="true"],
body.home .business-index-list a:hover .business-index-arrow,
body.home .business-index-list a:focus-visible .business-index-arrow,
body.home .contact-actions .button:hover span[aria-hidden="true"],
body.home .contact-actions .button:focus-visible span[aria-hidden="true"] {
  transform: translateX(0.28rem);
}

body.home .trust-card:hover .trust-icon,
body.home .trust-card:focus-within .trust-icon {
  transform: translateY(-1px) rotate(-4deg);
  color: var(--ink);
}

body.home .hero-copy > * {
  animation: br-home-hero-in 700ms var(--br-motion-ease) both;
}

body.home .hero-copy > :nth-child(2) { animation-delay: 90ms; }
body.home .hero-copy > :nth-child(3) { animation-delay: 160ms; }
body.home .hero-copy > :nth-child(4) { animation-delay: 230ms; }

body.home .hero-visual {
  animation: br-home-hero-visual 850ms var(--br-motion-ease) 110ms both;
}

@keyframes br-home-hero-in {
  from { opacity: 0; transform: translate3d(0, 1rem, 0); }
  to { opacity: 1; transform: none; }
}

@keyframes br-home-hero-visual {
  from { opacity: 0; transform: translate3d(0, 1.4rem, 0) scale(0.985); }
  to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  body.home.home-motion-ready .home-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }

  body.home .hero-copy > *,
  body.home .hero-visual {
    animation: none;
  }

  body.home .button,
  body.home .header-cta,
  body.home .button span[aria-hidden="true"],
  body.home .digital-stats-action a span[aria-hidden="true"],
  body.home .home-pricing-link span[aria-hidden="true"],
  body.home .process-home-cta span[aria-hidden="true"],
  body.home .business-index-arrow,
  body.home .contact-actions .button span[aria-hidden="true"] {
    transition: none;
  }
}
