/* Homepage refinements: retain the native Bricks content and WooCommerce data. */
.home .footwear:not(.is-paused) .footwear__ribbon:hover .footwear__marquee {
  animation-play-state:running;
}
.home .footwear .footwear__ribbon:focus-within .footwear__marquee {
  animation-play-state:paused;
}

@media(max-width:800px) {
  /* A visible edge of the following product teaches the existing swipe gesture. */
  .home .featured .product-track {
    --slide-gap:12px;
    width:calc(100% - 2 * var(--gutter));
    margin-inline:var(--gutter);
  }
  .home .featured .product-track__slides>.product-card {
    flex-basis:86%;
  }
  .home .featured>.carousel-controls {
    display:none;
  }

  .home .footwear__marquee {
    gap:24px;
  }
  .home .footwear__marquee h2,
  .home .footwear__marquee>span:not(.marquee-arrow) {
    font-size:clamp(2rem,7.8vw,2.5rem);
    line-height:1.1;
  }
  .home .footwear__marquee .marquee-arrow .icon {
    width:44px;
    height:44px;
  }
  .home .footwear__marquee .button {
    width:224px;
    max-width:224px;
    min-height:44px;
  }
  .home .footwear__marquee .button .button__label {
    font-size:14px;
  }
  .home .footwear__bottom>p {
    font-size:16px;
    line-height:1.5;
    max-width:30ch;
  }

  /* Every story remains visible in the page flow; this is no longer a scroll rail. */
  .home .stories__cards {
    grid-template-columns:minmax(0,1fr);
    gap:24px;
    width:100%;
    min-width:0;
    padding-bottom:0;
    overflow:visible;
    scroll-snap-type:none;
  }
  .home .stories .story,
  .home .stories .story>a {
    min-width:0;
  }
  .home .stories .story>a {
    display:grid;
    grid-template-columns:minmax(96px,30%) minmax(0,1fr);
    grid-template-rows:auto 1fr auto;
    column-gap:18px;
    align-items:start;
  }
  .home .stories .story__image {
    grid-column:1;
    grid-row:1 / 4;
    height:100%;
    min-height:156px;
    aspect-ratio:3 / 4;
    object-fit:cover;
  }
  .home .stories .story__category {
    margin:2px 0 8px;
  }
  .home .stories .story h3 {
    font-size:20px;
    line-height:1.2;
    margin:0;
    overflow-wrap:break-word;
  }
  .home .stories .story__link {
    margin-top:10px;
    gap:12px;
    min-height:44px;
    align-self:end;
  }

  /* Four smaller photographs surround the same message without hidden images. */
  .home .social {
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:28px 12px;
    padding:48px var(--gutter) 64px;
  }
  .home .social__message {
    grid-column:1 / -1;
    grid-row:1;
    width:100%;
  }
  .home .social__message h2 {
    font-size:clamp(1.75rem,6.5vw,2.25rem);
    max-width:15ch;
    margin-inline:auto;
  }
  .home .social__photos {
    display:contents;
  }
  .home .social__photos img,
  .home .social__photos img:last-child {
    display:block;
    width:100%;
    max-width:100%;
    grid-row:2;
    margin:0!important;
    aspect-ratio:3 / 4;
    object-fit:cover;
  }
  .home .social__photos--left img:first-child {grid-column:1;transform:rotate(-6deg)}
  .home .social__photos--left img:last-child {grid-column:2;transform:rotate(5deg)}
  .home .social__photos--right img:first-child {grid-column:3;transform:rotate(-5deg)}
  .home .social__photos--right img:last-child {grid-column:4;transform:rotate(6deg)}
}

@media(max-width:380px) {
  .home .stories__intro {grid-template-columns:minmax(0,1fr);gap:16px}
  .home .stories__intro>p {max-width:28ch}
  .home .stories .story>a {column-gap:14px}
  .home .stories .story h3 {font-size:18px}
  .home .social {column-gap:10px}
}
