/* Protected-review banner geometry and motion unification.
 * This stylesheet is deliberately loaded last on every page that owns a
 * .home-hero or .page-hero. Page-specific imagery and overlays remain intact.
 */

:root {
  --review-banner-height: 520px;
  --review-banner-ease: cubic-bezier(.2, .65, .25, 1);
}

body .home-hero,
body .page-hero,
html[data-site-theme-preview] body.site-theme-preview-active .page-hero,
html[data-site-theme-preview] body.site-theme-preview-active.page-products .page-hero,
html[data-site-theme-preview] body.site-theme-preview-active.page-products.product-hero-photo-sample .page-hero,
body.redesign-2w .home-hero,
body.redesign-2w .page-hero,
body.redesign-2w .page-hero.rfq-hero,
body.redesign-2w.page-products.product-hero-photo-sample .page-hero {
  box-sizing: border-box;
  width: 100%;
  height: var(--review-banner-height) !important;
  min-height: var(--review-banner-height) !important;
  max-height: var(--review-banner-height) !important;
  overflow: hidden;
}

body .home-hero > .home-video-media,
body .page-hero > picture,
html[data-site-theme-preview] body.product-hero-photo-sample .page-hero > picture,
html[data-site-theme-preview] body[data-product-hero-sample="finished-blades"] .page-hero > picture {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-height: none;
}

body .home-hero > .home-video-media :is(picture, video, img),
body .page-hero > picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Remove the older mix of clip wipes and mobile-only image scaling. */
body .home-hero > .home-video-media.c1-image-wipe,
body .page-hero > picture.c1-page-hero-media-wipe,
html.c1-subpage-motion-ready[data-review-concept="1"] body.site-theme-preview-active .page-hero > picture.c1-page-hero-media-wipe:not(.is-visible) {
  clip-path: inset(0) !important;
  transition: none !important;
}

body.page-quality .page-hero.quality-real-banner img.hero-media {
  transform: none !important;
  transform-origin: center !important;
}

body .home-hero > .hero-inner,
body .page-hero > .page-hero-inner,
body.full-style-preview.page-home-video .hero-inner.container,
html[data-site-theme-preview] body.product-hero-photo-sample .page-hero-inner {
  box-sizing: border-box;
  min-height: 100% !important;
  padding-top: 56px !important;
  padding-bottom: 52px !important;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
}

@media (prefers-reduced-motion: no-preference) {
  body .home-hero > .home-video-media,
  body .page-hero > picture {
    animation: review-banner-media-in 680ms var(--review-banner-ease) both !important;
  }

  body .home-hero > .hero-inner,
  body .page-hero > .page-hero-inner {
    animation: review-banner-copy-in 520ms var(--review-banner-ease) 90ms both !important;
  }
}

@keyframes review-banner-media-in {
  from {
    opacity: .68;
    transform: scale(1.025);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes review-banner-copy-in {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 479px) {
  :root {
    --review-banner-height: 560px;
  }

  body .home-hero > .hero-inner,
  body .page-hero > .page-hero-inner,
  body.full-style-preview.page-home-video .hero-inner.container,
  html[data-site-theme-preview] body.product-hero-photo-sample .page-hero-inner {
    padding-top: 42px !important;
    padding-bottom: 38px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body .home-hero > .home-video-media,
  body .page-hero > picture,
  body .home-hero > .hero-inner,
  body .page-hero > .page-hero-inner {
    opacity: 1 !important;
    clip-path: inset(0) !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }
}
