@media (max-width: 1280px) {
  .gj-header__nav {
    gap: 16px;
    font-size: 0.88rem;
  }

  .gj-home-category-card {
    flex-basis: 236px;
  }

  .gj-home-category-card--featured {
    flex-basis: 390px;
  }

  .gj-home-chipbar {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .gj-home-jobgrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .gj-home-guidegrid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1024px) {
  .gj-header__nav,
  .gj-header__actions {
    display: none;
  }

  .gj-header__mobile {
    display: flex;
  }

  .gj-home-hero__stage,
  .gj-home-feed,
  .gj-home-shindan {
    grid-template-columns: 1fr;
  }

  .gj-home-hero__copy {
    order: 2;
    padding: 34px 28px 30px;
  }

  .gj-home-hero__visual {
    order: 1;
    min-height: 500px;
  }

  .gj-home-categories {
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 8px;
  }

  .gj-home-category-card--featured,
  .gj-home-guidecard {
    grid-template-columns: 1fr;
  }

  .gj-home-category-card,
  .gj-home-category-card--featured {
    flex-basis: min(72vw, 360px);
    scroll-snap-align: center;
  }

  .gj-home-category-card__media {
    min-height: 280px;
  }

  .gj-home-category-card__body {
    padding-top: 22px;
  }

  .gj-home-shindan {
    padding: 18px;
  }

  .gj-home-carousel {
    grid-template-columns: 1fr;
  }

  .gj-home-carousel__nav {
    display: none;
  }

  .gj-home-feed__articles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .gj-home-feed__articles .gj-home-subhead {
    grid-column: 1 / -1;
    margin-bottom: 0;
  }

  .gj-home-feed__articles > .gj-home-article + .gj-home-article {
    margin-top: 0;
  }

  .gj-home-support {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .gj-page-category .gj-page-hero__inner,
  .gj-article-hero--reference,
  .gj-shindan-modal,
  .gj-article-layout {
    grid-template-columns: 1fr;
  }

  .gj-page-category .gj-meter-grid,
  .gj-page-category .gj-linked-card-grid,
  .gj-page-article .gj-linked-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1025px) {
  .gj-header__mobile {
    display: none;
  }

  .gj-top-reference-page .gj-header__mobile {
    display: flex;
  }
}

@media (max-width: 767px) {
  .gj-container {
    width: min(100% - 24px, 100%);
  }

  .gj-home-section {
    padding-top: 20px;
  }

  .gj-home-hero {
    padding-top: 8px;
  }

  .gj-home-hero__stage {
    border-radius: 28px;
  }

  .gj-home-hero__copy {
    padding: 26px 20px 24px;
    gap: 14px;
  }

  .gj-home-hero__copy h1 {
    font-size: 2.35rem;
  }

  .gj-home-hero__text {
    font-size: 1rem;
  }

  .gj-home-hero__visual {
    min-height: 360px;
  }

  .gj-home-title h2,
  .gj-home-subhead h2,
  .gj-home-guidecard h2,
  .gj-home-supportband h2 {
    font-size: 1.5rem;
  }

  .gj-home-chipbar,
  .gj-home-jobgrid,
  .gj-home-feed__articles,
  .gj-home-support {
    grid-template-columns: 1fr;
  }

  .gj-home-categories {
    gap: 14px;
  }

  .gj-home-shindan {
    gap: 14px;
    padding: 14px;
  }

  .gj-home-shindan__visual {
    max-height: 220px;
  }

  .gj-home-shindan__body h2 {
    font-size: 2.6rem;
  }

  .gj-home-shindan__body p:not(.gj-home-shindan__lead) {
    font-size: 1rem;
  }

  .gj-home-shindan__body ul {
    display: grid;
    gap: 8px;
  }

  .gj-home-shindan__visual::after {
    width: 112px;
    height: 112px;
  }

  .gj-home-shindan__visual::before {
    right: 24px;
    bottom: 38px;
    font-size: 1.15rem;
  }

  .gj-home-article {
    grid-template-columns: 110px minmax(0, 1fr);
  }

  .gj-home-guidecard {
    padding: 18px;
  }

  .gj-home-guidecard img {
    height: 180px;
  }

  .gj-home-supportband {
    flex-direction: column;
    align-items: flex-start;
    padding: 22px 18px;
  }

  .gj-page-category .gj-meter-grid,
  .gj-page-category .gj-four-grid,
  .gj-page-category .gj-linked-card-grid,
  .gj-page-article .gj-linked-card-grid,
  .gj-page-category .gj-support-band__grid {
    grid-template-columns: 1fr;
  }

  .gj-shindan-modal__visual {
    min-height: 420px;
  }
}

@media (max-width: 430px) {
  .gj-home-hero__copy h1 {
    font-size: 2.02rem;
  }

  .gj-home-hero__cta {
    min-width: 100%;
    min-height: 58px;
    font-size: 1rem;
  }

  .gj-home-category-card {
    padding: 18px;
    min-height: auto;
  }

  .gj-home-category-card--featured {
    flex-basis: 82vw;
  }

  .gj-home-category-card__badge {
    top: 12px;
  }

  .gj-home-job h3,
  .gj-home-article h3 {
    font-size: 0.96rem;
  }

  .gj-home-support article {
    min-height: auto;
    padding: 18px 14px;
  }
}
