/* Mobile/tablet tweaks – safe, Bootstrap-friendly */

/* HERO */
@media (max-width: 767.98px) {
  .home-header .container {
    padding-top: 2.5rem !important;
    padding-bottom: 2.5rem !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  .home-header h1 {
    font-size: 2rem;
    line-height: 1.15;
  }

  .home-header p {
    font-size: 1rem;
  }

  .home-header .btn-lg {
    width: 100%;
  }

  .home-header .search-box-wrapper {
    max-width: 100% !important;
  }
}

/* TABLET */
@media (min-width: 768px) and (max-width: 991.98px) {
  .home-header h1 {
    font-size: 2.4rem;
    line-height: 1.15;
  }
}

/* Featured grids spacing */
@media (max-width: 991.98px) {
  .white-section {
    padding-top: 2.5rem !important;
    padding-bottom: 2.5rem !important;
  }

  .creators-wrapper .row {
    padding-left: .5rem !important;
    padding-right: .5rem !important;
  }
}

/* Suggestion card */
.suggestion-card-hover {
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
  will-change: transform, box-shadow;
}

@media (hover: hover) and (pointer: fine) {
  .suggestion-card-hover:hover {
    transform: translateY(-6px) scale(1.01);
    filter: brightness(1.02);
  }
  .suggestion-card-hover:hover .suggestion-header-bg {
    filter: brightness(1.05);
    transition: filter .18s ease;
  }
  .suggestion-card-hover.is-premium:hover {
    box-shadow:
      0 0 0 1px rgba(255,255,255,.10),
      0 24px 60px rgba(0,0,0,.55) !important;
  }
}

/* On touch devices: no hover lift */
@media (hover: none) and (pointer: coarse) {
  .suggestion-card-hover:hover {
    transform: none;
    filter: none;
  }
}

@media (max-width: 767.98px) {
  /* badge smaller on phones */
  .premium-badge {
    padding: .35rem .55rem !important;
    font-size: .65rem !important;
    letter-spacing: .06em !important;
  }

  /* reduce inner spacing */
  .creator-card-wrap {
    padding-top: 1.25rem !important;
    padding-bottom: 1.25rem !important;
  }

  /* title spacing */
  .suggestion-box .h6 {
    font-size: 1rem;
  }
}