@media (max-width: 1180px) {
  .top-content {
    padding: 0.5rem 3rem;
  }
  .header-content {
    padding: 0 3rem;
  }
  .hero-features {
    padding: 0 3rem;
  }
  .category-container {
    padding: 0 3rem;
  }
  .arrivals {
    padding: 5rem 3rem;
  }
  .featured {
    padding: 5rem 3rem;
  }
  .latest {
    padding: 5rem 3rem;
  }
  .bottom-content {
    padding: 0 3rem;
  }
}

/* --------------------------------------- */

@media (max-width: 800px) {
  .header-content {
    flex-direction: column;
  }

  .header-content > * {
    margin-bottom: 2rem;
  }

  .bottom-content {
    flex-direction: column;
  }

  .bottom-content > * {
    margin-bottom: 2rem;
  }
}

/* ------------------------------------ */

@media (max-width: 750px) {
  .top-content {
    display: flex;
    justify-content: center;
  }
  .top-left {
    display: none;
  }
}

/* ------------------------------------ */

@media (max-width: 500px) {
  html {
    font-size: 8px;
  }
  .nav-item:not(:last-child) {
    margin-right: 1rem;
  }
  .nav-item:not(:last-child)::after {
    content: "/";
    color: var(--color-red);
    margin-left: 1rem;
  }
}