.hero-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity 1100ms ease,visibility 0s 1100ms;pointer-events:none;will-change:opacity}
.hero-slide.is-active{opacity:1;visibility:visible;transition:opacity 1100ms ease,visibility 0s}
.hero-slide img{width:100%;height:100%;object-fit:contain;object-position:center}
.hero-title,.design-caption{z-index:2}
.carousel-controls{position:absolute;inset-inline-end:20px;bottom:18px;z-index:3;display:flex;align-items:center;gap:4px;padding:3px 6px;background:#f8f7f3ed;border:1px solid #7e87756b;color:#273022}
.carousel-controls[hidden]{display:none}
.carousel-controls button{display:grid;place-items:center;min-width:44px;width:44px;height:44px;border:0;background:transparent;color:inherit;transition:background 180ms ease}
.carousel-controls button:hover{background:#dfe5d8}
.carousel-controls button:focus-visible{outline:2px solid #45573a;outline-offset:-4px}
.carousel-controls svg{width:20px;height:20px;stroke-width:1.5}
.carousel-count{padding-inline:9px;font-size:10px;letter-spacing:.12em;white-space:nowrap;font-variant-numeric:tabular-nums}
.carousel-count b{font-weight:500}
.carousel-dots{display:flex;gap:0}
.carousel-dots button{min-width:26px;width:26px}
.carousel-dots span{width:5px;height:5px;display:block;border-radius:50%;background:#b6bdaf;transition:background 220ms ease,transform 220ms ease}
.carousel-dots [aria-pressed=true] span{background:#4f6044;transform:scale(1.55)}
.carousel-toggle .play-icon{display:none}
.carousel-toggle.is-paused .play-icon{display:block}
.carousel-toggle.is-paused .pause-icon{display:none}
.carousel-progress{position:absolute;bottom:0;inset-inline:0;height:3px;background:#ffffff4d;z-index:3;overflow:hidden}
.carousel-progress i{display:block;width:100%;height:100%;background:#54654a;transform:scaleX(0);transform-origin:left center}
[dir=rtl] .carousel-progress i{transform-origin:right center}
.motion-reveal{opacity:0;transform:translateY(32px);transition:opacity 850ms cubic-bezier(.16,1,.3,1),transform 850ms cubic-bezier(.16,1,.3,1);transition-delay:var(--reveal-delay,0ms)}
.motion-reveal[data-motion-visible=true]{opacity:1;transform:none}
@media(max-width:680px){.hero-slide img{object-position:50% 100%}.carousel-controls{inset-inline-end:10px;bottom:13px;gap:0;padding:2px 3px}.carousel-count{padding-inline:5px;font-size:9px}.carousel-controls button{min-width:38px;width:38px;height:42px}.carousel-dots button{min-width:24px;width:24px}.editorial-hero .design-caption{bottom:70px}.carousel-controls svg{width:18px;height:18px}}
@media(prefers-reduced-motion:reduce){.hero-slide{transition:none!important;transform:none!important;will-change:auto}.motion-reveal{opacity:1;transform:none;transition:none!important}.carousel-progress{display:none}}
.editorial-hero .hero-stage{height:auto;overflow:visible}
.hero-visual{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;background:#e8e4dc}
.hero-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:64px;padding:7px 20px;background:var(--paper);position:relative;border-bottom:1px solid var(--line)}
.editorial-hero .design-caption{position:static;padding:0;background:transparent;font-size:10px;color:#51594b}
.carousel-controls{position:static;background:transparent;border:0;padding:0;flex-shrink:0}
.hero-toolbar .carousel-progress{bottom:-1px}
.editorial-hero .hero-title{top:6%;pointer-events:none}
@media(min-width:681px){.editorial-hero .hero-title{top:2%}.editorial-hero h1{font-size:clamp(54px,5.5vw,80px)}[lang=ar-SA] .editorial-hero h1,[lang=ko] .editorial-hero h1,[lang=ja] .editorial-hero h1{font-size:clamp(40px,4vw,60px);line-height:1.3}}
@media(max-width:680px){.editorial-hero .hero-stage{display:flex;flex-direction:column}.editorial-hero .hero-title{position:static;order:-1;padding:30px 20px 28px}.hero-visual{aspect-ratio:16/9}.hero-slide img{object-fit:contain;object-position:center}.hero-toolbar{padding:9px 18px 8px;flex-wrap:wrap;justify-content:center;gap:3px}.editorial-hero .design-caption{flex-basis:100%;font-size:9px}.carousel-controls{align-self:auto}.carousel-controls button{min-height:44px;height:44px}}
