/* Quiet, progressive motion. Content remains visible without JavaScript. */
:root {
  --motion-ease: cubic-bezier(.22, .68, 0, 1);
  --motion-quick: 180ms;
  --motion-gentle: 420ms;
}

.site-header::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 1px;
  pointer-events: none;
  box-shadow: 0 8px 24px #17171712;
  opacity: 0;
  transition: opacity 240ms var(--motion-ease);
}
.site-header.is-scrolled::after { opacity: 1; }

.button, .filter-button, .gallery-dialog-head button, .menu-toggle {
  transition: color var(--motion-quick) ease,
    background-color var(--motion-quick) ease,
    border-color var(--motion-quick) ease,
    transform var(--motion-quick) var(--motion-ease);
}
.button:active:not(:disabled), .filter-button:active:not(:disabled),
.gallery-dialog-head button:active, .menu-toggle:active {
  transform: translateY(1px);
}
.button:disabled { cursor: wait; }
.text-link, .footer-links a, .chapter-nav a, .context-link,
.product-buying-questions a, .collection-buying-guides a {
  transition: color var(--motion-quick) ease, border-color var(--motion-quick) ease;
}

.product-photo img, .format-photo img, .family-art img,
.home-application-image img, .news-entry-image img, .factory-shot img {
  transition: transform var(--motion-gentle) var(--motion-ease);
}
.family-card { transition: border-color 240ms ease; }
.hero-carousel-arrow {
  transition: color var(--motion-quick) ease,
    background-color var(--motion-quick) ease, opacity var(--motion-quick) ease;
}
.hero-carousel-dot::before {
  transition: width 240ms var(--motion-ease), background-color 240ms ease;
}
.hero-carousel-viewport { -webkit-overflow-scrolling: touch; }
.hero-carousel-slide { overflow: hidden; }
.wa-float { transition: transform 240ms var(--motion-ease); }

.gallery-dialog {
  border-radius: 12px;
  box-shadow: 0 24px 80px #15151533;
}
.gallery-dialog-head { border-bottom: 1px solid var(--line); }
.gallery-dialog-head button { border-radius: 22px; }
.gallery-dialog[open] {
  animation: luxuryade-preview-in 220ms var(--motion-ease);
}
.gallery-dialog[open]::backdrop { animation: luxuryade-backdrop-in 180ms ease; }
.page-detail[open] > :not(summary), .faq details[open] > :not(summary) {
  animation: luxuryade-content-in 220ms ease;
}

/* Each image and its caption enter as one unit, at most once. */
.motion-enter {
  animation: luxuryade-enter var(--reveal-duration, 900ms) var(--motion-ease) both;
  animation-delay: var(--reveal-delay, 0ms);
}
.motion-from-left { --reveal-x: -48px; --reveal-y: 20px; --reveal-scale: 1; }
.motion-from-right { --reveal-x: 48px; --reveal-y: 20px; --reveal-scale: 1; }
.motion-frame { --reveal-y: 54px; --reveal-scale: .965; --reveal-duration: 1200ms; }
.motion-copy { --reveal-y: 34px; --reveal-scale: 1; --reveal-duration: 800ms; }
.motion-enter:focus-within { animation: none; }

@keyframes luxuryade-enter {
  from {
    opacity: .08;
    transform: translate(var(--reveal-x, 0px), var(--reveal-y, 48px)) scale(var(--reveal-scale, .98));
  }
  to { opacity: 1; transform: translate(0, 0) scale(1); }
}
@keyframes luxuryade-preview-in {
  from { opacity: .65; transform: translateY(10px) scale(.995); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes luxuryade-backdrop-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes luxuryade-content-in {
  from { opacity: .65; }
  to { opacity: 1; }
}
@keyframes luxuryade-menu-in {
  from { opacity: .65; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (min-width: 1021px) {
  .desktop-nav a:not(.button)::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 3px;
    height: 1px;
    background: var(--accent);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 240ms var(--motion-ease);
  }
  .desktop-nav a[aria-current="page"]:not(.button)::after,
  .desktop-nav a:not(.button):focus-visible::after { transform: scaleX(1); }
}
@media (max-width: 1020px) {
  .desktop-nav.is-open {
    box-shadow: 0 16px 28px #1717170c;
    animation: luxuryade-menu-in 200ms var(--motion-ease);
  }
}
@media (hover: hover) and (pointer: fine) {
  .button:hover:not(:disabled), .wa-float:hover { transform: translateY(-2px); }
  .button:active:not(:disabled) { transform: translateY(1px); }
  .desktop-nav a:not(.button):hover::after { transform: scaleX(1); }
  .product-photo:hover img, .format-photo:hover img { transform: scale(1.025); }
  .family-card:hover .family-art img,
  .home-application-card:hover .home-application-image img,
  .news-entry:hover .news-entry-image img { transform: scale(1.02); }
  .factory-shot .gallery-open:hover img { transform: scale(1.025); }
}
@media (hover: none), (pointer: coarse) {
  .product-photo:hover img, .format-photo:hover img,
  .factory-shot .gallery-open:hover img { transform: none; }
}
@media (max-width: 1100px) {
  .motion-from-left { --reveal-x: -24px; }
  .motion-from-right { --reveal-x: 24px; }
}
@media (max-width: 820px) {
  .motion-enter {
    --reveal-x: 0px;
    --reveal-y: 32px;
    --reveal-scale: 1;
    --reveal-duration: 750ms;
    animation-delay: 0ms;
  }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .site-header::after, .button, .filter-button, .menu-toggle,
  .gallery-dialog-head button, .text-link, .footer-links a, .chapter-nav a,
  .context-link, .product-buying-questions a, .collection-buying-guides a,
  .product-photo img, .format-photo img, .family-art img,
  .home-application-image img, .news-entry-image img, .factory-shot img,
  .family-card, .hero-carousel-arrow, .hero-carousel-dot::before,
  .desktop-nav a:not(.button)::after, .wa-float { transition: none; }
  .motion-enter, .gallery-dialog[open], .gallery-dialog[open]::backdrop,
  .page-detail[open] > :not(summary), .faq details[open] > :not(summary),
  .desktop-nav.is-open { animation: none; }
  .button:hover:not(:disabled), .button:active:not(:disabled),
  .filter-button:active:not(:disabled), .menu-toggle:active,
  .gallery-dialog-head button:active, .wa-float:hover,
  .product-photo:hover img, .format-photo:hover img,
  .family-card:hover .family-art img,
  .home-application-card:hover .home-application-image img,
  .news-entry:hover .news-entry-image img,
  .factory-shot .gallery-open:hover img { transform: none; }
}