/* =============================================
   TABLETTE — Media queries 1024px – 1280px
   ============================================= */

@media (max-width: 1280px) {
  :root { --side-pad: 80px; }
}

@media (max-width: 1200px) {
  /* Checkout */
  .ck-form {
    grid-template-columns: 1fr;
    max-width: 640px;
    padding: 0 24px;
  }
  .ck-back { margin-left: 24px; }
  .ck-right { order: -1; }
  .ck-right__logo { display: none; }
  .ck-summary__items { max-height: none; }
}

@media (max-width: 1024px) {
  :root { --side-pad: 40px; }

  /* Header */
  .navbar__info { display: none; }
  .navbar__links { display: none; }
  .navbar__sep-menu { display: block; }
  .navbar__logo img { width: 120px; height: auto; }

  /* Home — Cosmonaute (masqué en tablet) */
  .cosmo-hand,
  .cosmo-scooter,
  .cosmo-scooter-track { display: none; }
  .cosmo-section { height: 0; margin: 0; overflow: hidden; }

  /* Home — Loyalty */
  .loyalty-grid {
    grid-template-columns: 1fr;
  }
  .loyalty-card { min-width: auto; }
  .loyalty-card__images img { width: 140px; height: 164px; }
  .loyalty-deco { width: 350px; height: 350px; }

  /* Home — FAQ */
  .faq-section__inner {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  /* Home — Effects */
  .effects-cosmo,
  .effects-floating-img { display: none; }
  .effects-content {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 20px;
  }
  .effects-text { width: 55%; flex: 0 0 55%; }
  .effects-tags { width: 40%; flex: 0 0 40%; }
  .effects-desc { padding-right: 0; font-size: 16px; }

  /* Footer */
  .footer-reassurance__inner {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
  }
  .reassurance-item { flex: 1 1 calc(50% - 16px); min-width: 140px; }
  .shops-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .footer-bottom {
    grid-template-columns: 1fr;
  }

  /* Home — Categories */
  .categories-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Home — Blog */
  .blog-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Archive — better card sizing */
  .products-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
  }
  .subcategories-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .product-card__effet { width: 42px; height: 42px; }

  /* Single Product */
  .sp-attrs__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .sp-related-carousel__track .product-card {
    flex: 0 0 calc(33.333% - 16px);
  }

  /* Blog page — smaller cards */
  .blog-row { gap: 20px; }
  .blog-card__title { font-size: 17px; line-height: 22px; }

  /* Checkout — scale inputs */
  .ck-cosmo { width: 200px; height: auto; }
}