/* Affichage uniquement : toutes les règles sont limitées aux petites largeurs. */
@media screen and (max-width: 900px) {
  body[data-mobile-page], body[data-mobile-page] *, body[data-mobile-page] *::before,
  body[data-mobile-page] *::after { box-sizing: border-box; }
  body[data-mobile-page] { min-width: 0; -webkit-text-size-adjust: 100%; }
  body[data-mobile-page] main, body[data-mobile-page] section,
  body[data-mobile-page] article, body[data-mobile-page] form,
  body[data-mobile-page] .columns > *, body[data-mobile-page] .grid > * { min-width: 0; }
  body[data-mobile-page] main { max-width: 100%; }
  body[data-mobile-page] p, body[data-mobile-page] h1, body[data-mobile-page] h2,
  body[data-mobile-page] h3, body[data-mobile-page] label,
  body[data-mobile-page] a, body[data-mobile-page] td, body[data-mobile-page] th {
    overflow-wrap: break-word; overflow-wrap: anywhere;
  }
  body[data-mobile-page] input, body[data-mobile-page] select,
  body[data-mobile-page] textarea { max-width: 100%; min-width: 0; font-size: 16px; }
  body[data-mobile-page] input:not([type=checkbox]):not([type=radio]),
  body[data-mobile-page] select { min-height: 44px; }
  body[data-mobile-page] button { max-width: 100%; }
  body[data-mobile-page] img, body[data-mobile-page] video,
  body[data-mobile-page] iframe { max-width: 100%; }
  /* Les images recadrées du logo et des bannières conservent leur cadrage. */
  body[data-mobile-page] .crop img { max-width: none; }
  body[data-mobile-page] dialog {
    width: calc(100% - 24px); max-width: calc(100vw - 24px);
    max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); padding: 18px;
  }
  body[data-mobile-page] .language-bar { flex-wrap: wrap; gap: 8px; padding-inline: 4%; }
  body[data-mobile-page] .language-bar select { max-width: 100%; }
  body[data-mobile-page] .spec-table, body[data-mobile-page] .rich-spec-table {
    width: 100%; table-layout: fixed;
  }
  body[data-mobile-page] .columns {
    width: 100%; grid-template-columns: minmax(0, 1fr); gap: 12px;
  }
  body[data-mobile-page] .columns section { max-width: 100%; }
  body[data-mobile-page] .row { min-width: 0; flex-wrap: wrap; gap: 8px 14px; }
  body[data-mobile-page] .row > :first-child { min-width: 0; }
  body[data-mobile-page] .row > :last-child { margin-inline-start: auto; }
  body[data-mobile-page] .row > strong { white-space: nowrap; }
  body[data-mobile-page] .payment-options { min-width: 0; }
  body[data-mobile-page] .payment-options button { min-width: 0; }
  body[data-mobile-page] .checkout-addon { min-width: 0; }
  body[data-mobile-page] .checkout-addon select { width: 100%; }
  body[data-mobile-page=panier] main {
    width: calc(100% - 24px); max-width: 850px; margin: 24px auto; padding: 20px;
  }
  body[data-mobile-page=panier] header { gap: 12px; flex-wrap: wrap; align-items: center; }
  body[data-mobile-page=panier] article { min-width: 0; flex-wrap: wrap; }
  body[data-mobile-page=panier] .cart-product { min-width: 0; flex: 1 1 100%; }
  body[data-mobile-page=panier] .cart-product > div { min-width: 0; }
  body[data-mobile-page=panier] input { min-width: 60px; }
  body[data-mobile-page=pack-famille] header { gap: 12px; flex-wrap: wrap; }
}
@media screen and (max-width: 760px) {
  body[data-mobile-page=pack-famille] .grid { grid-template-columns: minmax(0, 1fr); }
  body[data-mobile-page=pack-famille] .card { min-width: 0; padding: 18px; }
  body[data-mobile-page=pack-famille] .card select { min-width: 0; max-width: 100%; }
  body[data-mobile-page=pack-famille] .summary button { max-width: 100%; white-space: normal; }
  body[data-mobile-page=index] .products, body[data-mobile-page=index] .categories {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  body[data-mobile-page=index] .product,
  body[data-mobile-page=index] .accessory-tile { min-width: 0; }
  body[data-mobile-page=index] .contact { grid-template-columns: minmax(0, 1fr); }
  body[data-mobile-page=index] .contact form { grid-template-columns: minmax(0, 1fr); }
  body[data-mobile-page=index] #integrated-product .product-page-hero {
    grid-template-columns: minmax(0, 1fr);
  }
  body[data-mobile-page=index] #integrated-product .rich-highlights {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media screen and (max-width: 700px) {
  body[data-mobile-page=index] header {
    display: grid; grid-template-columns: minmax(0, 1fr) auto 44px;
    gap: 8px; padding: 12px 4%; align-items: center;
  }
  body[data-mobile-page=index] header .brand {
    grid-column: 1; grid-row: 1; width: 100%; max-width: 170px; min-width: 0;
  }
  body[data-mobile-page=index] header .cart-header {
    grid-column: 2; grid-row: 1; padding: 8px; font-size: 13px;
  }
  body[data-mobile-page=index] header .menu {
    grid-column: 3; grid-row: 1; width: 44px; min-height: 44px; padding: 4px;
  }
  body[data-mobile-page=index] header .product-search {
    grid-column: 1 / span 2; grid-row: 2; width: 100%; min-width: 0;
  }
  body[data-mobile-page=index] header .product-search input { margin: 0; min-width: 0; }
  body[data-mobile-page=index] header .search-toggle {
    grid-column: 3; grid-row: 2; width: 44px; min-height: 44px; padding: 4px;
  }
  body[data-mobile-page=index] .product-search-results { width: 100%; max-width: 100%; }
  body[data-mobile-page=index] #nav {
    max-height: calc(100vh - 200px); max-height: calc(100dvh - 200px);
    overflow-y: auto; overscroll-behavior: contain;
  }
  body[data-mobile-page=index] .catalog-mega {
    max-width: 100%; max-height: calc(100vh - 200px); overflow-y: auto;
  }
  body[data-mobile-page=index] .family-promo-inner { padding-inline: 16px; }
  body[data-mobile-page=index] .family-promo-inner > * { max-width: 100%; }
  body[data-mobile-page=index] .hero-copy h1 { font-size: clamp(30px, 8vw, 45px); }
  body[data-mobile-page=index] .rich-equipment { grid-template-columns: minmax(0, 1fr); }
  body[data-mobile-page=index] .rich-equipment:nth-of-type(even) img { order: 0; }
  body[data-mobile-page] header { min-width: 0; }
  body[data-mobile-page] header > nav { max-width: 100%; }
  body[data-mobile-page] footer { overflow-wrap: anywhere; }
}
@media screen and (max-width: 480px) {
  body[data-mobile-page] main { padding-inline: 4%; }
  body[data-mobile-page] .columns section { padding: 16px; }
  body[data-mobile-page] .payment-options { grid-template-columns: minmax(0, 1fr); }
  body[data-mobile-page] .notice { padding: 14px; }
  body[data-mobile-page] h1 { font-size: clamp(26px, 8vw, 34px); }
  body[data-mobile-page] section { padding: 16px; }
  body[data-mobile-page] header { flex-wrap: wrap; gap: 12px; }
  body[data-mobile-page] .spec-table td, body[data-mobile-page] .spec-table th,
  body[data-mobile-page] .rich-spec-table td, body[data-mobile-page] .rich-spec-table th {
    padding: 10px 6px;
  }
  body[data-mobile-page=panier] main { padding: 16px; margin-block: 16px; }
  body[data-mobile-page=panier] .cart-product { gap: 10px; }
  body[data-mobile-page=panier] .cart-product img { width: 76px; height: 72px; flex-shrink: 0; }
  body[data-mobile-page=panier] .buy { width: 100%; text-align: center; }
  body[data-mobile-page=pack-famille] .summary { padding: 16px; }
  body[data-mobile-page=pack-famille] .summary button { width: 100%; padding-inline: 16px; }
  body[data-mobile-page=pack-famille] .price { font-size: 21px; }
  body[data-mobile-page=index] .product-page-actions { flex-direction: column; align-items: stretch; }
  body[data-mobile-page=index] #integrated-product .product-page-summary h1 { font-size: 28px; }
  body[data-mobile-page=index] #integrated-product .rich-highlights { grid-template-columns: minmax(0, 1fr); }
  body[data-mobile-page=index] .product-page-tabs { gap: 8px 14px; }
}
@media screen and (max-width: 380px) {
  body[data-mobile-page=index] .products,
  body[data-mobile-page=index] #accessories-catalog .accessory-grid,
  body[data-mobile-page=index] .service-grid { grid-template-columns: minmax(0, 1fr); }
  body[data-mobile-page=index] .product .product-actions .btn { font-size: 13px; }
  body[data-mobile-page=index] .product .color-preview { min-height: 0; }
  body[data-mobile-page=index] .benefit-grid { grid-template-columns: minmax(0, 1fr); }
}