/* GrowCart Ecom | Reference-inspired motion 2026-11-09
   Page-specific progressive enhancement. All source copy, layout and links are untouched.
   Preserve the existing homepage sticky-services controller and native .reveal system. */

/* A restrained entrance for original cards, not the nested sticky homepage cards. */
@media (prefers-reduced-motion: no-preference) {
  html.gc-motion-ready .gc-motion-card {
    transition: opacity .68s cubic-bezier(.22,1,.36,1),
                translate .68s cubic-bezier(.22,1,.36,1),
                border-color .3s ease, box-shadow .3s ease,
                transform .3s ease;
    transition-delay: var(--gc-motion-delay, 0ms);
  }
  html.gc-motion-ready .gc-motion-card:not(.gc-motion-shown):not(:focus-within) {
    opacity: 0;
    translate: 0 22px;
  }
  html.gc-motion-ready .gc-motion-card.gc-motion-shown,
  html.gc-motion-ready .gc-motion-card:focus-within {
    opacity: 1;
    translate: 0 0;
  }
  html.gc-motion-ready .gc-about-refresh #who-we-are .story-media.is-visible img {
    animation: gc-reference-image-settle .9s cubic-bezier(.22,1,.36,1) both;
  }
  @keyframes gc-reference-image-settle {
    from { transform: scale(1.035); }
    to { transform: scale(1); }
  }
}

/* Reference-style progression above the EXISTING five/four process cards. */
html.gc-motion-ready .gc-home-refresh #process .gc-step-grid.gc-motion-timeline,
html.gc-motion-ready main #process .process-list.gc-motion-timeline {
  position: relative;
  padding-top: 26px;
  isolation: isolate;
}
html.gc-motion-ready .gc-home-refresh #process .gc-step-grid.gc-motion-timeline::before,
html.gc-motion-ready .gc-home-refresh #process .gc-step-grid.gc-motion-timeline::after,
html.gc-motion-ready main #process .process-list.gc-motion-timeline::before,
html.gc-motion-ready main #process .process-list.gc-motion-timeline::after {
  content: "";
  position: absolute;
  inset: 8px 0 auto;
  height: 2px;
  border-radius: 1px;
  pointer-events: none;
}
html.gc-motion-ready .gc-home-refresh #process .gc-step-grid.gc-motion-timeline::before,
html.gc-motion-ready main #process .process-list.gc-motion-timeline::before {
  background: #DEE4F5;
}
html.gc-motion-ready .gc-home-refresh #process .gc-step-grid.gc-motion-timeline::after,
html.gc-motion-ready main #process .process-list.gc-motion-timeline::after {
  background: #0077FC;
  transform: scaleX(var(--gc-motion-progress,0));
  transform-origin: left center;
  transition: transform .15s linear;
}
html.gc-motion-ready .gc-home-refresh #process .gc-step.gc-motion-current,
html.gc-motion-ready main #process .process-step.gc-motion-current {
  border-color: #0077FC;
  box-shadow: 0 9px 25px rgba(4,0,55,.075), inset 0 3px 0 #0077FC;
}
html.gc-motion-ready .gc-home-refresh #process .gc-step.gc-motion-current .gc-step-num,
html.gc-motion-ready main #process .process-step.gc-motion-current .process-num {
  color: #0058C4;
}

/* About uses its EXISTING two-column process grid, not a forced horizontal layout. */
html.gc-motion-ready .gc-about-refresh #how-we-work .gc-about-process .diff-card.gc-motion-current {
  border-color: #0077FC;
  box-shadow: inset 3px 0 0 #0077FC, 0 9px 25px rgba(4,0,55,.075);
}
html.gc-motion-ready .gc-about-refresh #how-we-work .gc-about-process .diff-card.gc-motion-current .num {
  color: #0058C4;
}

/* Small tactile feedback without adding any text, cards, imagery or new colors. */
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  html.gc-motion-ready .gc-about-refresh #what-we-do .diff-card.gc-motion-shown:hover,
  html.gc-motion-ready .gc-about-refresh #values .diff-card.gc-motion-shown:hover,
  html.gc-motion-ready main #components .component-card.gc-motion-shown:hover {
    translate: 0 -4px;
    border-color: #0077FC;
    box-shadow: 0 13px 28px rgba(4,0,55,.09);
  }
}

/* Mobile keeps all items in their original reading order with no horizontal track. */
@media (max-width: 767px), (max-height: 620px) {
  html.gc-motion-ready .gc-home-refresh #process .gc-step-grid.gc-motion-timeline,
  html.gc-motion-ready main #process .process-list.gc-motion-timeline {
    padding-top: 0;
  }
  html.gc-motion-ready .gc-home-refresh #process .gc-step-grid.gc-motion-timeline::before,
  html.gc-motion-ready .gc-home-refresh #process .gc-step-grid.gc-motion-timeline::after,
  html.gc-motion-ready main #process .process-list.gc-motion-timeline::before,
  html.gc-motion-ready main #process .process-list.gc-motion-timeline::after {
    display: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  html.gc-motion-ready .gc-motion-card,
  html.gc-motion-ready .gc-motion-card:not(.gc-motion-shown) {
    opacity: 1 !important;
    translate: none !important;
    transition: none !important;
    animation: none !important;
  }
  html.gc-motion-ready .gc-home-refresh #process .gc-step-grid.gc-motion-timeline::after,
  html.gc-motion-ready main #process .process-list.gc-motion-timeline::after {
    transform: none;
    transition: none;
  }
}
@media print {
  html.gc-motion-ready .gc-motion-card,
  html.gc-motion-ready .gc-motion-card:not(.gc-motion-shown) {
    opacity: 1 !important;
    translate: none !important;
  }
  html.gc-motion-ready .gc-home-refresh #process .gc-step-grid.gc-motion-timeline::after,
  html.gc-motion-ready main #process .process-list.gc-motion-timeline::after { display: none; }
}