/* Tablet and phone: the five-column grid folds into one column; reduced motion shows final states. */
@media (max-width: 1000px) {
  .grid5 {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 18px;
  }
  .grid5 > *,
  .plan.rec,
  .plan.docs,
  .foot-col:first-child {
    grid-column: 1 / -1;
    grid-row: auto;
  }
  .hero-feature {
    max-width: 200px;
    margin-top: 28px;
  }
  .how-steps {
    grid-template-columns: minmax(0, 1fr);
  }
  .how-step {
    padding-right: 0;
  }
  .shots {
    grid-template-columns: minmax(0, 1fr);
  }
  .shot-art {
    min-height: 0;
  }
  .shot-copy {
    max-width: 52ch;
  }
  .provider-logos {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    gap: 28px 32px;
    padding: 12px 0;
  }
  .plan {
    min-height: 0;
  }
  .foot-cols {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .foot-cols > * {
    grid-column: auto;
  }
}

@media (max-width: 640px) {
  .bar-signin {
    display: none;
  }
  .period-note {
    flex-basis: 100%;
    margin: 8px 0 0;
  }
  .provider-logos img {
    height: 48px;
  }
  .provider-logos .square img {
    height: 54px;
  }
  .hero-actions .btn {
    width: 100%;
  }
  .hero-actions .btn > span:first-child {
    flex: 1;
  }
  .foot-cols {
    grid-template-columns: minmax(0, 1fr);
  }
  .film-frame {
    border-width: 6px;
  }
  .film-play {
    gap: 9px;
    min-height: 44px;
    padding: 0 12px 0 11px;
    bottom: 6%;
    font-size: 0.8125rem;
  }
  .film-play::before {
    border-width: 6px 0 6px 10px;
  }
}