/* Homepage editorial scenes: media and typography animate on independent layers. */
.hero { height: 100svh; min-height: 640px; padding: 0; background: #060b13; }
.hero::after { display: none; }
.hero-stage { z-index: 0; }
.hero-slide,.hero-slide.is-current,.hero-slide.is-leaving,.hero-slide.is-entering { transform: none; background: transparent; transition: none; }
.hero-media { position: absolute; inset: 0; overflow: hidden; background: #060b13; transform: translate3d(var(--entry-x,100%),0,0); transition: transform 1.15s cubic-bezier(.76,0,.24,1); }
.hero-slide.is-current .hero-media { transform: translate3d(0,0,0); }
.hero-slide.is-leaving .hero-media { transform: translate3d(var(--exit-x,-100%),0,0); }
.hero-scene-image,.product .hero-scene-image { inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; border-radius: 0; }
.laboratory .hero-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,#f8f6f0f5,#f8f6f0d9 32%,#f8f6f030 65%,transparent); }
.hero-copy { position: absolute; left: var(--shell); top: 50%; margin-top: 10px; transform: translateY(-50%); width: 45%; max-width: 580px; z-index: 2; }
.hero h1 { font-size: clamp(34px,4.1vw,62px); }
.hero-caption { top: 50%; bottom: auto; right: 9%; width: 38%; transform: translateY(-42%); color: #fff; z-index: 2; }
.hero-caption h2 { font-family: Manrope,sans-serif; font-size: clamp(34px,4.2vw,68px); font-weight: 800; text-transform: uppercase; line-height: 1.02; letter-spacing: -.055em; margin: 0 0 30px; max-width: 640px; }
.hero-caption .hero-label { color: #d6c29a; font-size: 11px; letter-spacing: .22em; margin: 0 0 18px; }
.hero-caption .hero-detail { text-transform: none; letter-spacing: 0; font-size: 15px; font-weight: 400; line-height: 1.75; color: #d4d8df; border-top: 1px solid #ffffff30; padding-top: 24px; margin-bottom: 28px; max-width: 440px; }
.hero-product-link { display: inline-flex; align-items: center; gap: 24px; color: #fff; text-decoration: none; text-transform: uppercase; font-size: 11px; font-weight: 700; letter-spacing: .12em; }
.hero-product-link span { display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid #ffffff60; border-radius: 50%; font-size: 20px; transition: background .2s; }
.hero-product-link:hover span { background: #ffffff25; }
.hero-caption > *, .hero-copy > * { opacity: 0; transform: translate3d(var(--entry-x,100%),0,0); transition: transform .9s cubic-bezier(.22,.7,.24,1),opacity .7s; }
.is-current .hero-caption > *, .is-current .hero-copy > * { opacity: 1; transform: translate3d(0,0,0); transition-delay: .24s; }
.is-current .hero-caption > :nth-child(2), .is-current .hero-copy > :nth-child(2) { transition-delay: .32s; }
.is-current .hero-caption > :nth-child(3), .is-current .hero-copy > :nth-child(3) { transition-delay: .40s; }
.is-current .hero-caption > :nth-child(4), .is-current .hero-copy > :nth-child(4) { transition-delay: .48s; }
.is-leaving .hero-caption > *, .is-leaving .hero-copy > * { opacity: 0; transform: translate3d(var(--exit-x,-100%),0,0); transition-duration: .65s; transition-delay: 0s; }
.hero-peek { top: var(--header-height); width: 3.5%; min-width: 28px; border-color: #ffffff22; background: #060b13; backdrop-filter: none; }
.hero-controls { bottom: 30px; }
.is-product .hero-controls .arrow-button,.is-product .hero-pause { color: #fff; border-color: #ffffff45; background: #ffffff12; }
.is-product .slide-dots button::after { background: #ffffff50; border-color: #ffffff80; }
.is-product .slide-dots button[aria-pressed="true"]::after { background: #d6c29a; border-color: #d6c29a; }
@media(min-width: 901px) and (max-aspect-ratio: 4/3) {
 .product .hero-scene-image { object-fit: contain; }
 .hero-caption { width: 40%; right: 6%; }
}
@media(max-width: 900px) {
 .hero { height: 100svh; min-height: 760px; }
 .hero-copy { left: 7%; top: 46%; width: 78%; max-width: 560px; }
 .hero-copy .hero-lede { font-size: 16px; }
 .product .hero-media { background: #060b13; }
 .product .hero-scene-image { top: var(--header-height); height: 47%; width: 180%; max-width: none; object-fit: cover; object-position: left center; }
 .product .hero-media::after { content: ''; position: absolute; inset: 42% 0 0; background: linear-gradient(transparent,#060b13 20%); }
 .hero-caption { top: 58%; right: 9%; left: 7%; bottom: auto; width: auto; transform: none; }
 .hero-caption h2 { font-size: clamp(28px,5.5vw,46px); margin-bottom: 14px; max-width: 560px; }
 .hero-caption .hero-label { margin-bottom: 10px; }
 .hero-caption .hero-detail { font-size: 13px; line-height: 1.5; padding-top: 12px; margin-bottom: 12px; max-width: 530px; }
 .hero-product-link span { width: 36px; height: 36px; }
 .hero-controls { left: 7%; bottom: 18px; }
 .hero-peek { width: 24px; min-width: 24px; }
 .hero-peek span { width: 22px; height: 22px; }
}
@media(max-width: 580px) {
 .hero { min-height: 780px; }
 .hero-caption { top: 54%; }
 .hero-caption h2 { font-size: clamp(28px,8vw,40px); }
 .hero-controls { gap: 5px; }
 .hero-controls .slide-dots { margin-right: 3px; }
 .hero-controls .arrow-button { width: 34px; height: 34px; }
 .hero-copy { top: 44%; }
}
@media(prefers-reduced-motion: reduce) {
 .hero-media,.hero-caption > *,.hero-copy > * { transition: none !important; }
}