/* ── RESPONSIVE COMPLET — LIGHT THEME ── */

/* Nav full-width sur mobile */
@media (max-width: 768px) {
  .nav { padding: 0 20px; }
  .nav__group { display: none; }
  .nav__burger { display: flex; }
  .nav .btn-discord { display: none; }
  .container { padding: 0 20px; }
  .bento { grid-template-columns: 1fr; padding: 0 20px 64px; }
  .bento__cell--portfolio, .bento__cell--shop, .bento__cell--tech { grid-column: 1; grid-row: auto; }
  .section-block { padding: 56px 0; }
  .discord-cta-wrap { padding: 0 20px 56px; }
  .discord-cta { padding: 32px 28px; flex-direction: column; gap: 20px; }
  .discord-cta__btn { align-self: flex-start; }
  .footer-rich { padding: 40px 0 0; }
  .footer-rich__grid { grid-template-columns: 1fr 1fr; gap: 28px; padding: 0 20px 40px; }
  .footer-rich__bottom { padding: 16px 20px; flex-direction: column; align-items: flex-start; gap: 10px; }
  .hero__title { font-size: clamp(32px, 9vw, 56px); }
  .shop-grid { grid-template-columns: 1fr 1fr !important; gap: 12px; }
  .softwares-grid { grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 480px) {
  .nav { padding: 0 16px; }
  .container { padding: 0 16px; }
  .bento { padding: 0 16px 56px; }
  .discord-cta-wrap { padding: 0 16px 56px; }
  .hero__title { font-size: clamp(28px, 10vw, 46px); }
  .hero__actions { flex-direction: column; width: 100%; }
  .hero__cta { width: 100%; text-align: center; }
  .shop-grid { grid-template-columns: 1fr !important; }
  .team-grid { grid-template-columns: 1fr 1fr; }
  .footer-rich__grid { grid-template-columns: 1fr; }
  .contact-cards { grid-template-columns: 1fr 1fr; }
  .softwares-grid { grid-template-columns: repeat(2,1fr); }
}

@media (min-width: 769px) and (max-width: 1024px) {
  .shop-grid { grid-template-columns: repeat(3,1fr) !important; }
  .bento { grid-template-columns: 1fr 1fr; padding: 0 28px 80px; }
  .bento__cell--portfolio { grid-column:1; grid-row:1; }
  .bento__cell--shop { grid-column:2; grid-row:1/3; }
  .bento__cell--tech { grid-column:1; grid-row:2; }
  .footer-rich__grid { grid-template-columns: 1.5fr 1fr 1fr; }
  .footer-rich__grid > div:last-child { grid-column: 1 / -1; }
}

/* Gallery thumbs scrollable mobile */
@media (max-width: 768px) {
  .gallery__thumbs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .gallery__thumbs::-webkit-scrollbar { display: none; }
  .gallery__thumb { flex-shrink: 0; }
  .contact-layout { grid-template-columns: 1fr; }
  .portfolio-masonry { columns: 1; }
}

/* Touch: désactiver transforms hover */
@media (hover: none) {
  .shop-item:hover,
  .service-card:hover,
  .partner-card:hover,
  .product:hover,
  .contact-card:hover,
  .team-card:hover { transform: none; }
  .btn--primary:hover,
  .btn-discord:hover { transform: none; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
  .partners-track { animation: none; }
  .reveal { opacity: 1; transform: none; }
}

/* Safe areas iOS */
@supports (padding: env(safe-area-inset-top)) {
  .nav { padding-left: max(40px, env(safe-area-inset-left)); padding-right: max(40px, env(safe-area-inset-right)); }
  .footer-rich__bottom { padding-bottom: max(18px, env(safe-area-inset-bottom)); }
}

/* ══════════════════════════════════════════════════════
   GRILLES — CORRECTIFS RESPONSIVE COMPLETS
   Tous les éléments multi-colonnes couverts
══════════════════════════════════════════════════════ */

/* ── latest-grid (Dernières créations) ── */
.latest-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

/* ── similar-grid (Produits similaires) ── */
.similar-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

/* ── DESKTOP large ≥ 1400px ── */
@media (min-width: 1400px) {
  .latest-grid  { grid-template-columns: repeat(4, 1fr); }
  .similar-grid { grid-template-columns: repeat(4, 1fr); }
  .shop-grid    { grid-template-columns: repeat(4, 1fr) !important; }
}

/* ── LAPTOP 1024–1400px ── */
@media (min-width: 1024px) and (max-width: 1399px) {
  .latest-grid  { grid-template-columns: repeat(4, 1fr); gap: 16px; }
  .similar-grid { grid-template-columns: repeat(4, 1fr); gap: 14px; }
  .shop-grid    { grid-template-columns: repeat(3, 1fr) !important; }
}

/* ── TABLETTE PAYSAGE 768–1023px ── */
@media (min-width: 768px) and (max-width: 1023px) {
  .latest-grid  { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  .similar-grid { grid-template-columns: repeat(3, 1fr); gap: 12px; }
  .shop-grid    { grid-template-columns: repeat(2, 1fr) !important; gap: 14px; }

  /* Bento : shop pleine largeur */
  .bento__cell--shop .products-grid { gap: 10px; }

  /* Stats accueil */
  .services-grid { grid-template-columns: repeat(3, 1fr) !important; }
}

/* ── TABLETTE PORTRAIT 560–767px ── */
@media (min-width: 560px) and (max-width: 767px) {
  .latest-grid  { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .similar-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .shop-grid    { grid-template-columns: repeat(2, 1fr) !important; gap: 12px; }
  .services-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .contact-cards { grid-template-columns: repeat(2, 1fr); }
  .team-grid    { grid-template-columns: repeat(2, 1fr) !important; }
  .softwares-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ── MOBILE 0–559px ── */
@media (max-width: 559px) {
  .latest-grid  { grid-template-columns: 1fr; gap: 12px; }
  .similar-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .shop-grid    { grid-template-columns: 1fr !important; gap: 12px; }
  .services-grid { grid-template-columns: 1fr 1fr !important; gap: 10px; }
  .contact-cards { grid-template-columns: 1fr !important; }
  .team-grid    { grid-template-columns: repeat(2, 1fr) !important; }
  .softwares-grid { grid-template-columns: repeat(2, 1fr); }

  /* Cartes produit sur mobile : description cachée, tags réduits */
  .product .product__tags .tag:nth-child(n+3),
  .shop-item .shop-item__tags .tag:nth-child(n+3) { display: none; }

  /* Bento 1 colonne */
  .bento { gap: 10px; }

  /* Section header plus compact */
  .section-head { margin-bottom: 28px; }
  .section-head__sub { font-size: 14px; }
}

/* ── MOBILE TRÈS PETIT < 400px ── */
@media (max-width: 399px) {
  .latest-grid  { grid-template-columns: 1fr; }
  .similar-grid { grid-template-columns: 1fr; }
  .services-grid { grid-template-columns: 1fr !important; }
  .team-grid    { grid-template-columns: 1fr !important; }
  .softwares-grid { grid-template-columns: repeat(2, 1fr); }

  /* Produit détail */
  .product-info__name { font-size: 20px !important; }
  .product-info__price { font-size: 26px !important; }

  /* Boutique */
  .shop-header__title { font-size: 28px !important; }
}

/* ── CORRECTIONS TEXTE OVERFLOW partout ── */
.product__name,
.product-card .card__name,
.shop-item__name,
.shop-card__name,
.partner-card__name,
.team-card__name {
  overflow-wrap: break-word;
  word-break: break-word;
  hyphens: auto;
}

/* Empêche les prix de déborder */
.product__price,
.shop-item__price,
.card__price-tag,
.product-info__price {
  white-space: nowrap;
}

/* Boutons trop petits sur mobile */
@media (max-width: 559px) {
  .product__btn,
  .shop-item__buy {
    padding: 10px;
    font-size: 12px;
  }
  .card__actions { gap: 6px; }
  .card__btn-detail,
  .card__btn-buy { padding: 8px 6px; font-size: 10px; }
}

/* Bento panels : min-width pour éviter l'écrasement */
.bento__panel { min-width: 0; overflow: hidden; }
.products-grid .product { min-width: 0; }
.product__name { white-space: normal; }
