/* Desktop/tablet stability layer. Mobile styles remain untouched. */
@media (min-width: 768px) {
  html { overflow-x: hidden; }
  body { min-width: 0; }
  .reveal {
    opacity: 0;
    transform: translate3d(0, 72px, 0) scale(.94);
    filter: blur(10px);
    clip-path: inset(0 0 14% 0 round 20px);
    transition:
      opacity .85s cubic-bezier(.16,1,.3,1),
      transform 1s cubic-bezier(.16,1,.3,1),
      filter .85s ease,
      clip-path 1s cubic-bezier(.16,1,.3,1);
    transition-delay: var(--stagger, 0ms);
    will-change: opacity, transform, filter, clip-path;
  }
  .reveal.visible {
    opacity: 1 !important;
    transform: translate3d(0,0,0) scale(1) !important;
    filter: none !important;
    clip-path: inset(0) !important;
    translate: none !important;
  }
  .hero-photo,
  .studio-photo,
  .detail > img,
  .shop-foot-art {
    transform: translate3d(0,var(--desktop-shift,0px),0);
    transition: transform .18s linear;
    will-change: transform;
  }
  .mesh { transform: translateZ(0); }
  .mesh i,.mesh b,.marquee > div,.badge,.closing:before,
  .footer-orb,.footer-ring,.footer-star,.floating-chips span {
    animation-play-state: running !important;
  }
}

@media (min-width: 768px) and (max-width: 1180px) {
  .hero { padding-left: 4vw; padding-right: 4vw; gap: 4vw; }
  .hero h1 { font-size: clamp(64px,8vw,100px); }
  .hero-photo { height: min(700px,72vw); }
  .collection,.detail,.shop,.commerce-shell { padding-left: 4vw; padding-right: 4vw; }
  .product-photo { height: 430px; }
  .footer-main { gap: 45px; }
}

@media (min-width: 1181px) {
  .hero,.collection,.detail,.shop,.commerce-shell {
    width: min(100%,1800px);
    margin-left: auto;
    margin-right: auto;
  }
}
