/* ZENITH SPA — restrained motion layer. Shared by all five Korean pages. */
/* Cross-fade preserves original hero element sizes, overlays, and typography. */
.motion-hero-ready > img.motion-hero-slide {
  opacity: 0;
  transition: opacity 1750ms ease-in-out;
  pointer-events: none;
}
.motion-hero-ready > img.motion-hero-slide.is-current {opacity: 1;}
/* Existing hero base styles already position photos. Preserve CONTACT negative layer. */
.contact-v2-hero.motion-hero-ready > img.motion-hero-slide {z-index: -2;}
.motion-hero-ready > img.motion-hero-slide:not(.is-current) {visibility:visible;}
.motion-hero-controls {
  position:absolute;
  left: clamp(14px, 3.2vw, 48px);
  bottom: 15px;
  z-index: 6;
  display:flex;
  align-items:center;
  gap: 14px;
  padding: 6px 9px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 30px;
  background: rgba(18,24,19,.23);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.motion-hero-dots {display:flex;align-items:center;gap:7px;}
.motion-hero-dot {
  appearance:none;
  padding:0;
  width:7px;height:7px;
  border:0;border-radius:99px;
  background:rgba(255,255,255,.45);
  transition: width 350ms ease,background 350ms ease;
  cursor:pointer;
}
.motion-hero-dot.is-current {width:21px;background:#f5e8d1;}
.motion-hero-pause {
  display:flex;align-items:center;justify-content:center;
  min-width:25px;height:24px;
  color:#fff;background:transparent;border:0;
  cursor:pointer;
  font-size:13px;line-height:1;
}
.motion-hero-dot:focus-visible,.motion-hero-pause:focus-visible {outline:2px solid #fff;outline-offset:4px;}
/* Progressive enhancement: all content remains visible when JavaScript is off. */
.motion-armed .motion-item {
  opacity:0;
  transform:translate3d(0,17px,0);
  transition:opacity 820ms cubic-bezier(.23,1,.32,1), transform 820ms cubic-bezier(.23,1,.32,1);
  transition-delay:var(--motion-delay,0ms);
}
.motion-armed .motion-item.motion-visible {opacity:1;transform:translate3d(0,0,0);}
.motion-hero-ready .home-hero-center,
.motion-hero-ready .course-hero-inner,
.motion-hero-ready .guide-hero-copy,
.motion-hero-ready .about-hero-copy,
.motion-hero-ready .contact-v2-hero-copy {
  animation: zenith-hero-text 1050ms cubic-bezier(.2,.7,.2,1) both;
}
@keyframes zenith-hero-text {
  from {opacity:.16;transform:translateY(11px)}
  to {opacity:1;transform:translateY(0)}
}
@media (hover:hover) and (pointer:fine) {
  .service-tile, .course-entry, .guide-visit-card, .about-gallery-item, .contact-v2-channel, .hero-book,
  .course-entry-action,.contact-v2-map-link,.guide-info-strip a {
    transition:transform 320ms ease,box-shadow 320ms ease,background-color 320ms ease;
  }
  .service-tile:hover,.course-entry:hover,.guide-visit-card:hover,
  .about-gallery-item:hover,.contact-v2-channel.is-enabled:hover {transform:translateY(-3px);}
  .service-tile:hover,.course-entry:hover,.guide-visit-card:hover {box-shadow:0 13px 30px rgba(51,50,38,.09);}
  .service-tile-img img,.course-entry-visual img,.about-gallery-item img,.guide-visit-image img {
    transition:transform 750ms cubic-bezier(.25,.6,.2,1);
  }
  .service-tile:hover .service-tile-img img,
  .course-entry:hover .course-entry-visual img,
  .about-gallery-item:hover img,
  .guide-visit-card:hover .guide-visit-image img {transform:scale(1.035);}
}
/* Motion is optional; honor OS accessibility preferences. */
@media(prefers-reduced-motion: reduce) {
  .motion-hero-ready > img.motion-hero-slide {transition:none!important;}
  .motion-hero-controls {display:none!important;}
  .motion-armed .motion-item {opacity:1!important;transform:none!important;transition:none!important;}
  .motion-hero-ready .home-hero-center,
  .motion-hero-ready .course-hero-inner,
  .motion-hero-ready .guide-hero-copy,
  .motion-hero-ready .about-hero-copy,
  .motion-hero-ready .contact-v2-hero-copy {animation:none!important;}
  .service-tile,.course-entry,.guide-visit-card,.about-gallery-item,.contact-v2-channel {transition:none!important;transform:none!important;}
  .service-tile-img img,.course-entry-visual img,.about-gallery-item img,.guide-visit-image img {transition:none!important;transform:none!important;}
}
@media (max-width:600px) {
  .motion-hero-controls {left:12px;bottom:10px;padding:4px 7px;gap:10px;}
  .motion-hero-dot {width:6px;height:6px;}
  .motion-hero-dot.is-current {width:16px;}
  .motion-hero-pause {min-width:24px;height:26px;}
  .motion-armed .motion-item {transform:translate3d(0,12px,0);transition-duration:700ms;}
}
