@media (max-width: 1024px) {
  :root {
    --abk-section-space: 56px;
    --abk-hero-space: 64px;
  }

  .apotek-bpjs-kediri__card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  :root {
    --abk-section-space: 56px;
    --abk-hero-space: 58px;
  }

  .apotek-bpjs-kediri__hero-grid,
  .apotek-bpjs-kediri__split {
    grid-template-columns: 1fr;
  }

  .apotek-bpjs-kediri__split--reverse > :first-child {
    order: initial;
  }

  .apotek-bpjs-kediri__card-grid--three {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 480px) {
  :root {
    --abk-section-space: 46px;
    --abk-hero-space: 50px;
    --abk-grid-gap: 14px;
  }

  .apotek-bpjs-kediri__container {
    width: min(calc(100% - 28px), var(--abk-container));
  }

  .apotek-bpjs-kediri__card-grid,
  .apotek-bpjs-kediri__card-grid--three,
  .apotek-bpjs-kediri__card-grid--two {
    grid-template-columns: 1fr;
  }

  .apotek-bpjs-kediri__hero-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .apotek-bpjs-kediri__button {
    width: 100%;
  }
}