/* Cinematic motion layer — compositor-only, loads last */

.site-header {
  transition: background-color var(--motion-med, 450ms) var(--ease-cinematic, cubic-bezier(0.32, 0.72, 0, 1)),
    box-shadow var(--motion-med, 450ms) var(--ease-cinematic, cubic-bezier(0.32, 0.72, 0, 1));
}

.site-header.is-scrolled {
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--navy) 8%, var(--line));
}

.btn-text {
  position: relative;
  transition: color var(--motion-med, 450ms) var(--ease-cinematic, cubic-bezier(0.32, 0.72, 0, 1)),
    border-color var(--motion-med, 450ms) var(--ease-cinematic, cubic-bezier(0.32, 0.72, 0, 1));
}

.btn-text:hover .btn-icon {
  transform: translate(2px, -1px);
}

.product-categories-section .product-category-card > img,
.capabilities-section .capability-image img,
.why-birdi-section .facility-photo img,
.infrastructure-section .infrastructure-hero-image img,
.infrastructure-section .infrastructure-strip-image img,
.quality-section .quality-visual img,
.partnership-section .partnership-testimonial img {
  transition: transform var(--motion-slow, 700ms) var(--ease-cinematic, cubic-bezier(0.32, 0.72, 0, 1));
}

.product-categories-section .product-category-link span,
.why-birdi-section .facility-link span,
.partnership-section .partnership-conversation-cta span:last-child,
.footer-link::before {
  transition: transform var(--motion-fast, 280ms) var(--ease-cinematic, cubic-bezier(0.32, 0.72, 0, 1));
}

.partnership-section .partnership-conversation-cta {
  transition: transform var(--motion-fast, 280ms) var(--ease-cinematic, cubic-bezier(0.32, 0.72, 0, 1)),
    background-color var(--motion-med, 450ms) var(--ease-cinematic, cubic-bezier(0.32, 0.72, 0, 1));
}

.partnership-section .partnership-conversation-cta:hover span:last-child {
  transform: translate(2px, -1px);
}

.partnership-section .partnership-conversation-cta:active {
  transform: scale(0.98);
}

.site-footer .footer-link {
  transition: color var(--motion-fast, 280ms) var(--ease-cinematic, cubic-bezier(0.32, 0.72, 0, 1));
}

.capability-image,
.facility-photo,
.infrastructure-hero-image,
.infrastructure-strip-image,
.quality-visual {
  overflow: hidden;
}

.product-category-link:focus-visible,
.facility-link:focus-visible,
.partnership-conversation-cta:focus-visible,
.footer-link:focus-visible,
.nav-cta:focus-visible {
  outline: 2px solid var(--red, var(--birdi-red));
  outline-offset: 3px;
}

html.motion-fallback .hero-copy-main,
html.motion-fallback .hero-copy > .hero-cta,
html.motion-fallback .hero-banner-visual,
html.motion-fallback .hero-meta {
  opacity: 1;
  visibility: visible;
  transform: none;
}

html.has-cinematic.js:not(.motion-fallback) .hero-copy-main,
html.has-cinematic.js:not(.motion-fallback) .hero-copy > .hero-cta,
html.has-cinematic.js:not(.motion-fallback) .hero-banner-visual {
  opacity: 0;
  visibility: hidden;
}

@media (max-width: 1023px) {
  html.has-smooth-scroll {
    scroll-behavior: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.has-cinematic.js .hero-copy-main,
  html.has-cinematic.js .hero-copy > .hero-cta,
  html.has-cinematic.js .hero-banner-visual {
    opacity: 1;
    visibility: visible;
    transform: none;
  }
  .site-header,
  .btn-text,
  .product-categories-section .product-category-card > img,
  .capabilities-section .capability-image img,
  .why-birdi-section .facility-photo img,
  .infrastructure-section .infrastructure-hero-image img,
  .infrastructure-section .infrastructure-strip-image img,
  .quality-section .quality-visual img,
  .partnership-section .partnership-testimonial img,
  .product-categories-section .product-category-link span,
  .why-birdi-section .facility-link span,
  .partnership-section .partnership-conversation-cta,
  .partnership-section .partnership-conversation-cta span:last-child,
  .footer-link::before,
  .site-footer .footer-link {
    transition: none;
  }

  .partnership-section .partnership-conversation-cta:hover,
  .partnership-section .partnership-conversation-cta:active,
  .partnership-section .partnership-conversation-cta:hover span:last-child {
    transform: none;
  }
}

@media (pointer: coarse) {
  .btn:active {
    transform: none;
  }
}
