/* ============================================================
   Adventure with Alphabet — 2026-09-05
   Social footer only.
   Retailer carousel is intentionally left to the original site CSS,
   restoring auto-movement and pause-on-hover.
   ============================================================ */

/* Footer: brand + Explore + Follow Us + Connect */
.expanded-footer .footer-grid.footer-grid-streamlined {
  grid-template-columns: minmax(260px, 1.45fr) minmax(160px, .8fr) minmax(190px, .9fr) minmax(190px, .9fr) !important;
  gap: clamp(24px, 3vw, 46px) !important;
  align-items: start !important;
}

.footer-social-column {
  min-width: 0;
}

.footer-social-icons {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}

.footer-social-link {
  display: inline-flex !important;
  align-items: center;
  gap: 9px;
  min-height: 36px;
  color: #4f5d51 !important;
  text-decoration: none !important;
  font-size: .88rem !important;
}

.footer-social-link svg {
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  padding: 6px;
  border-radius: 50%;
  fill: #476c45;
  background: rgba(255,255,255,.74);
  border: 1px solid rgba(67,108,65,.16);
  box-shadow: 0 5px 12px rgba(58,88,55,.06);
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}

.footer-social-link:hover svg,
.footer-social-link:focus-visible svg {
  transform: translateY(-2px);
  background: #fff;
  box-shadow: 0 8px 16px rgba(58,88,55,.12);
}

.footer-social-link:hover,
.footer-social-link:focus-visible {
  color: #365b38 !important;
  text-decoration: none !important;
}

@media (max-width: 1050px) {
  .expanded-footer .footer-grid.footer-grid-streamlined {
    grid-template-columns: 1.35fr 1fr 1fr !important;
  }
  .expanded-footer .footer-brand-block {
    grid-row: span 2;
  }
}

@media (max-width: 800px) {
  .expanded-footer .footer-grid.footer-grid-streamlined {
    grid-template-columns: 1fr 1fr !important;
  }
  .expanded-footer .footer-brand-block {
    grid-column: 1 / -1;
    grid-row: auto;
  }
}

@media (max-width: 600px) {
  .expanded-footer .footer-grid.footer-grid-streamlined {
    grid-template-columns: 1fr !important;
  }
  .footer-social-icons {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 12px 16px;
  }
  .footer-social-link span {
    display: none;
  }
  .footer-social-link svg {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
  }
}


/* ============================================================
   2026-09-05 — Retailer carousel guaranteed auto-motion
   This rule is intentionally last so older fallback rules cannot
   leave the retailer track stationary.
   ============================================================ */
.retailer-marquee {
  overflow: hidden !important;
  mask-image: linear-gradient(to right, transparent, #000 3%, #000 97%, transparent) !important;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 3%, #000 97%, transparent) !important;
}

.retailer-marquee .retailer-track {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: max-content !important;
  max-width: none !important;
  animation-name: awa-retailer-guaranteed-sweep !important;
  animation-duration: 42s !important;
  animation-timing-function: linear !important;
  animation-iteration-count: infinite !important;
  animation-direction: alternate !important;
  animation-fill-mode: none !important;
  animation-play-state: running !important;
  will-change: transform;
}

.retailer-marquee:hover .retailer-track,
.retailer-marquee:focus-within .retailer-track {
  animation-play-state: paused !important;
}

@keyframes awa-retailer-guaranteed-sweep {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(calc(-100% + 100vw - 84px), 0, 0);
  }
}

/* Keep the moving strip usable on smaller screens too. */
@media (max-width: 900px) {
  .retailer-marquee .retailer-track {
    animation-duration: 34s !important;
  }
}

@media (max-width: 520px) {
  .retailer-marquee .retailer-track {
    animation-duration: 30s !important;
  }
}