/* Page transitions — native View Transitions, matching Wix's timings. */
@view-transition { navigation: auto; }

@keyframes slide-horizontal-old { to { transform: translateX(-100%); } }
@keyframes slide-horizontal-new { from { transform: translateX(100%); } }
@keyframes out-in-old { to { opacity: 0; } }
@keyframes out-in-new { from { opacity: 0; } }
@keyframes motion-fadeIn { from { opacity: 0; } to { opacity: 1; } }

::view-transition-old(root) {
  animation: 0.35s cubic-bezier(.22, 1, .36, 1) both out-in-old;
}
::view-transition-new(root) {
  animation: 0.35s cubic-bezier(.64, 0, .78, 0) 0.35s both out-in-new;
}

/* Wix's custom element has no definition once its runtime is stripped. */
wow-image { display: block; }

/* Lightbox */
.mirror-lightbox {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, .92);
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s cubic-bezier(.22, 1, .36, 1), visibility .3s;
}
.mirror-lightbox[data-open="true"] { opacity: 1; visibility: visible; }
.mirror-lightbox img {
  max-width: 92vw;
  max-height: 88vh;
  object-fit: contain;
  transform: scale(.96);
  transition: transform .3s cubic-bezier(.22, 1, .36, 1);
}
.mirror-lightbox[data-open="true"] img { transform: scale(1); }
.mirror-lightbox__caption {
  position: absolute;
  bottom: 4vh;
  width: 100%;
  text-align: center;
  color: #fff;
  font: 400 14px/1.4 system-ui, sans-serif;
  letter-spacing: .04em;
}
.mirror-lightbox__btn {
  position: absolute;
  background: none;
  border: 0;
  color: #fff;
  font-size: 40px;
  line-height: 1;
  cursor: pointer;
  padding: 16px;
  opacity: .7;
  transition: opacity .2s;
}
.mirror-lightbox__btn:hover { opacity: 1; }
.mirror-lightbox__btn[data-dir="prev"] { left: 2vw; }
.mirror-lightbox__btn[data-dir="next"] { right: 2vw; }
.mirror-lightbox__btn[data-dir="close"] { top: 2vh; right: 2vw; font-size: 32px; }

/* Menus — the transition classes already exist in Wix's captured CSS; these
   drive the open/closed state our script toggles. */
/* Renderings flyout.

   Wix builds its visible dropdown in JavaScript, so the captured DOM contains
   only the hidden accessibility list (display:none inline, correct links).
   We position that list absolutely and style it to match the live dropdown:
   179px wide, background rgb(181,177,169), z-index 99999.

   position:absolute is load-bearing. Without it the list sits in normal flow
   and stacks the whole navigation vertically. */
[data-mirror="nav-submenu-toggle"] { position: relative; }

[data-mirror="nav-submenu"] {
  display: block !important;
  position: absolute;
  top: 100%;
  right: 0;
  width: 179px;
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: center;
  background: rgb(181, 177, 169);
  z-index: 99999;
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s cubic-bezier(.37, 0, .63, 1), visibility .2s;
}
[data-mirror="nav-submenu"][data-open="true"] { opacity: 1; visibility: visible; }
[data-mirror="nav-submenu"] > li {
  display: block;
  height: 31px;
  white-space: nowrap;
  list-style: none;
}
/* The captured list holds bare <a> elements. Wix's visible dropdown wraps its
   text in a <p> carrying the colour, so without these the links fall back to
   the browser's default blue. Values taken from the live dropdown. */
[data-mirror="nav-submenu"] > li a {
  display: block;
  color: rgb(0, 0, 0);
  font-family: "futura-lt-w01-light", "Futura", sans-serif;
  font-size: 16px;
  line-height: 31px;
  text-decoration: none;
}

[data-mirror="mobile-menu"] {
  transition: transform .4s cubic-bezier(.87, 0, .13, 1);
}
[data-mirror="mobile-menu"][data-open="false"] { transform: translateX(-100%); }
[data-mirror="mobile-menu"][data-open="true"] { transform: translateX(0); }

body { animation: motion-fadeIn .4s ease both; }

@media (prefers-reduced-motion: reduce) {
  *, ::view-transition-old(root), ::view-transition-new(root) {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}


/* ---------------------------------------------------------------------------
   Wix mobile action bar (menu / tap-to-call / email).

   Its positioning CSS is injected at runtime through
   CSSStyleSheet.insertRule(), which never appears in document.outerHTML - so
   the capture could not see it and the bar rendered as a zero-height static
   div. Restored here from the live site's computed styles. Targets
   data-testid, which renaming never touches.

   Collapsed to bottom:-58px exactly as Wix does; tapping the knob slides it up.
   --------------------------------------------------------------------------- */
[data-testid="mobileactionsmenu"] {
  position: fixed;
  left: 0;
  right: 0;
  bottom: -58px;
  z-index: 98;
  transition: bottom .2s ease-in-out;
}
[data-testid="mobileactionsmenu"][data-open="true"] { bottom: 0; }

[data-testid="mobileactionsmenu"] ul {
  display: flex;
  margin: 0;
  padding: 0;
  list-style: none;
  background: rgb(62, 62, 62);
  box-shadow: 0 -5px 15px rgba(0, 0, 0, .5);
}
[data-testid="mobileactionsmenu"] ul > li {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 53px;
  border-right: 1px solid rgb(87, 87, 87);
}
[data-testid="mobileactionsmenu"] ul > li:last-child { border-right: 0; }
[data-testid="mobileactionsmenu"] ul > li a,
[data-testid="mobileactionsmenu"] ul > li > div {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
[data-testid="mobileactionsmenu-knob"] {
  height: 40px;
  cursor: pointer;
  background: url("/assets/26b2bbae951fc9e6.png") no-repeat center top;
}
