/* Desktop field layout. Touch layout extends it in mobile-motion.css. */
.shift-product-field, .shift-loop-toggle { display: none; }
.shift-hero-stage { position: relative; height: 100%; min-height: inherit; isolation: isolate; overflow: clip; }
@media (min-width: 960px) {
  .shift-hero {
    --shift-stage-height: max(650px, 100svh);
    height: calc(var(--shift-stage-height) * 2);
    min-height: 0;
    overflow: visible;
    background: #eeeae3;
  }
  .shift-hero-stage { position: sticky; top: 0; height: var(--shift-stage-height); min-height: 0; background: #eeeae3; }
  .shift-business { z-index: 2; margin-top: calc(max(650px, 100svh) * -1); }
  .shift-hero-image, .shift-hero-wash { display: none; }
  .shift-product-field {
    position: absolute;
    inset: 0;
    display: block;
    overflow: clip;
    contain: layout paint;
    pointer-events: none;
  }
  .shift-product-item {
    position: absolute;
    top: 50%;
    left: 50%;
    width: clamp(240px, 25vw, 400px);
    aspect-ratio: 1.5;
    opacity: 0;
    transform-origin: center;
    backface-visibility: hidden;
  }
  .shift-product-item img { display: block; width: 100%; height: 100%; object-fit: contain; opacity: 0; }
  .shift-product-item.is-loaded img { opacity: 1; }
  .shift-hero-layout {
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 100px 8.5vw 110px;
    pointer-events: none;
  }
  .shift-hero-title {
    width: auto;
    font-size: clamp(44px, 4.25vw, 72px);
    line-height: 1.35;
    text-align: center;
    letter-spacing: -.045em;
  }
  .shift-title-line--sans { margin-left: 0; font-weight: 600; letter-spacing: -.055em; }
  .shift-hero-bottom { margin: 24px 0 0; text-align: center; }
  .shift-hero-bottom p { font-size: 14px; letter-spacing: .01em; }
  .shift-hero-bottom .shift-text-link { margin-top: 14px; gap: 32px; pointer-events: auto; }
  .shift-loop-toggle {
    position: absolute;
    z-index: 2;
    right: 4vw;
    bottom: 32px;
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid #a5a79e;
    border-radius: 50%;
    background: transparent;
    color: #343b36;
    cursor: pointer;
  }
  .shift-loop-toggle::before { content: ''; width: 7px; height: 10px; border-inline: 2px solid currentColor; }
  .shift-loop-toggle[aria-pressed="true"]::before {
    width: 0;
    height: 0;
    margin-left: 2px;
    border: 5px solid transparent;
    border-right: 0;
    border-left: 8px solid currentColor;
  }
  .shift-loop-toggle:hover { background: rgb(255 255 255 / 30%); }
  .shift-loop-toggle:disabled { visibility: hidden; }
  .shift-loop-toggle:focus-visible { outline: 2px solid #8b4437; outline-offset: 5px; }
}
@media (min-width: 960px) and (prefers-reduced-motion: no-preference) {
  .shift-product-item { will-change: transform, opacity; }
}
@media (prefers-reduced-motion: reduce) {
  .shift-loop-toggle { display: none; }
}

/* Static first paint survives delayed or failed component/animation downloads. */
.shift-product-fallback { position:absolute; inset:0; pointer-events:none; }
.shift-product-fallback img { position:absolute; width:clamp(90px,14vw,220px); height:auto; object-fit:contain; opacity:.65; }
.shift-product-fallback img:nth-child(1) { left:10%; top:20%; }
.shift-product-fallback img:nth-child(2) { left:24%; bottom:14%; width:clamp(70px,10vw,160px); }
.shift-product-fallback img:nth-child(3) { right:10%; top:24%; }
.has-live-products .shift-product-fallback { display:none; }