/**
 * Refonte fiche produit (maquettes Figma) — §0 Design tokens et espacements
 * internes du bloc d'achat (lot 1, intégré sans test A/B).
 * Scope strict : page produit (body#product).
 *
 * Les nouvelles valeurs d'espacement sont redéfinies sur la racine de la page
 * produit, PAS dans le :root de global.css : les utilitaires .p-*, .gap-*,
 * .m*-* qui consomment ces variables sont partagés par d'autres pages
 * (catégorie, footer, modale panier, recherche…) qui ne doivent pas bouger.
 */
body#product {
  --spacing-xs: 8px;
  --spacing-sm: 12px;
  --spacing-md: 16px;
  --spacing-lg: 20px;
  --spacing-xl: 24px;
}

/* ---------- Bloc d'achat : espacements internes (desktop) ---------- */

@media (min-width: 1000px) {
  #product .product-info-and-attributes {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 20px;
  }

  #product .product-info-and-attributes > *,
  #product .product-info-and-attributes > #prices-brand,
  #product .product-info-and-attributes > .page-product-box {
    margin-top: 0;
    margin-bottom: 0;
  }

  #product .product-actions {
    margin-bottom: 12px;
    padding: 12px 24px;
  }

  #product .product-links {
    margin-top: 0;
  }
}