/*
 * Global scroll entrance system.
 *
 * Attributes are added only to content that begins below the initial viewport.
 * prop-for-that supplies --const-has-entered through the shared dg-enter source.
 */
[data-dg-motion]:where(:not([data-dg-motion="pin-source"])) {
  --dg-motion-x: 0rem;
  --dg-motion-y: .85rem;
  --dg-motion-scale-start: .985;
  --dg-motion-blur: 0px;
  opacity: 0;
  translate: var(--dg-motion-x) var(--dg-motion-y);
  scale: var(--dg-motion-scale-start);
  filter: blur(var(--dg-motion-blur));
  animation-duration: 680ms;
  animation-delay: 0ms;
  animation-fill-mode: both;
  animation-timing-function: cubic-bezier(.22, 1, .36, 1);
}

[data-dg-motion][data-dg-entered]:where(:not([data-dg-motion="pin-source"])) {
  animation-name: dg-motion-enter;
}

[data-dg-motion="heading"] {
  --dg-motion-x: .12em;
  --dg-motion-y: -.16em;
  --dg-motion-scale-start: 1.055;
  --dg-motion-blur: 7px;
  transform-origin: 0 55%;
  animation-duration: 1.05s;
  animation-timing-function: cubic-bezier(.18, .84, .32, 1.04);
}

[data-dg-motion="eyebrow"] {
  --dg-motion-y: -.55rem;
  --dg-motion-scale-start: 1;
  animation-duration: 520ms;
}

[data-dg-motion="card"] {
  --dg-motion-y: 1rem;
  --dg-motion-scale-start: .975;
  animation-duration: 720ms;
}

[data-dg-motion="visual"] {
  --dg-motion-y: 1.15rem;
  --dg-motion-scale-start: .965;
  animation-duration: 880ms;
  animation-timing-function: cubic-bezier(.16, 1, .3, 1);
}

[data-dg-motion="pin-source"] .home-locations__pin {
  opacity: 0;
  translate: 0 -4.5rem;
  filter: blur(3px);
}

[data-dg-motion="pin-source"][data-dg-entered] .home-locations__pin {
  animation: dg-pin-drop 920ms 180ms cubic-bezier(.2, .75, .28, 1) both;
}

@keyframes dg-motion-enter {
  from {
    opacity: 0;
    translate: var(--dg-motion-x) var(--dg-motion-y);
    scale: var(--dg-motion-scale-start);
    filter: blur(var(--dg-motion-blur));
  }

  to {
    opacity: 1;
    translate: 0 0;
    scale: 1;
    filter: blur(0);
  }
}

@keyframes dg-pin-drop {
  0% {
    opacity: 0;
    translate: 0 -4.5rem;
    filter: blur(3px);
  }

  58% {
    opacity: 1;
    translate: 0 .42rem;
    filter: blur(0);
  }

  76% { translate: 0 -.24rem; }
  90% { translate: 0 .12rem; }
  100% { opacity: 1; translate: 0 0; filter: blur(0); }
}

/*
 * Native sibling functions keep all component sequences declarative. Count
 * slightly relaxes longer sets; index supplies the capped cascade. Dense
 * grids reset the index for every visual row so later rows retain the same
 * rhythm instead of sharing one capped delay.
 */
@supports (animation-delay: calc(mod(sibling-index() - 1, 4) * 1ms)) and (animation-duration: calc(1ms * sibling-count())) {
  [data-dg-motion-sequence] {
    --dg-sequence-row-size: sibling-count();
    --dg-sequence-step: min(mod(sibling-index() - 1, var(--dg-sequence-row-size)), 6);
    animation-delay: calc(var(--dg-sequence-step) * 72ms);
    animation-duration: calc(620ms + (min(sibling-count(), 8) * 12ms));
  }

  .editorial-grid > [data-dg-motion-sequence] { --dg-sequence-row-size: 3; }
  .dg-product-grid > [data-dg-motion-sequence] { --dg-sequence-row-size: 4; }

  [data-dg-motion-sequence][data-dg-motion="heading"] {
    animation-duration: calc(980ms + (min(sibling-count(), 8) * 14ms));
  }

  [data-dg-motion-sequence][data-dg-motion="eyebrow"] {
    animation-duration: calc(470ms + (min(sibling-count(), 8) * 10ms));
  }

  @media (max-width: 85rem) {
    .dg-product-grid > [data-dg-motion-sequence] { --dg-sequence-row-size: 3; }
  }

  @media (max-width: 74rem) {
    .editorial-grid > [data-dg-motion-sequence] { --dg-sequence-row-size: 2; }
  }

  @media (max-width: 60rem) {
    .editorial-grid > [data-dg-motion-sequence] { --dg-sequence-row-size: 1; }
  }

  @media (max-width: 58rem) {
    .dg-product-grid > [data-dg-motion-sequence] { --dg-sequence-row-size: 2; }
  }

  @media (max-width: 36rem) {
    .dg-product-grid > [data-dg-motion-sequence] { --dg-sequence-row-size: 1; }
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-dg-motion]:not([data-dg-motion="pin-source"]) {
    opacity: 1 !important;
    translate: none !important;
    scale: 1 !important;
    filter: none !important;
    animation: none !important;
  }

  [data-dg-motion="pin-source"] .home-locations__pin {
    opacity: 1 !important;
    translate: none !important;
    filter: none !important;
    animation: none !important;
  }
}

@media print {
  [data-dg-motion]:not([data-dg-motion="pin-source"]) {
    opacity: 1 !important;
    translate: none !important;
    scale: 1 !important;
    filter: none !important;
    animation: none !important;
  }

  [data-dg-motion="pin-source"] .home-locations__pin {
    opacity: 1 !important;
    translate: none !important;
    filter: none !important;
    animation: none !important;
  }
}