/* Tablet */
@media (min-width: 768px) {
  .header__inner {
    flex-direction: row;
    justify-content: space-between;
  }

  .header__brand {
    font-size: 1.6rem;
  }

  .header__logo {
    height: 50px;
  }

  .hero {
    padding: 56px 0 40px;
  }

  .hero__title {
    font-size: 2.25rem;
  }

  .hero__subtitle {
    font-size: 1rem;
  }

  .search__input {
    max-width: 480px;
    margin: 0 auto;
    display: block;
  }

  .filters__list {
    justify-content: center;
    flex-wrap: wrap;
  }

  .products__grid {
    gap: 20px;
  }

  .card__body {
    padding: 16px;
  }

  .card__name {
    font-size: 1.05rem;
  }

  .card__description {
    font-size: 0.85rem;
    -webkit-line-clamp: 3;
  }

  .card__actions {
    flex-direction: row;
  }

  .card__actions .btn {
    flex: 1;
  }

  /* Modal desktop-like */
  .modal-overlay {
    align-items: center;
  }

  .modal {
    max-width: 640px;
    max-height: 85vh;
    border-radius: var(--radius-lg);
    transform: translateY(30px);
    opacity: 0;
  }

  .modal-overlay--active .modal {
    transform: translateY(0);
    opacity: 1;
  }

  .modal__gallery {
    aspect-ratio: 16 / 10;
  }

  .modal__content {
    padding: 28px 32px 36px;
  }

  .modal__name {
    font-size: 1.75rem;
  }

  .modal__actions {
    flex-direction: row;
  }

  .modal__actions .btn {
    flex: 1;
  }
}

/* Desktop */
@media (min-width: 1024px) {
  .header__logo {
    height: 60px;
  }
  .hero {
    padding: 64px 0 48px;
  }

  .hero__title {
    font-size: 2.5rem;
  }

  .products__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
  }

  .card__body {
    padding: 20px;
  }

  .card__name {
    font-size: 1.1rem;
  }
}

/* Large Desktop */
@media (min-width: 1280px) {
  .products__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}