/* ===== Responsive (tablette et mobile) ===== */
html, body { overflow-x: clip; }
.wrap, .promo-grid > *, .cat-grid > *, .brands-grid > *, .carousel, .track, .section-head > * { min-width: 0; }
img, svg { max-width: 100%; }

/* ---- Tablette (≤ 1100px) ---- */
@media (max-width: 1100px) {
    .cat-grid { grid-template-columns: repeat(3, 1fr); }
    .brands-band .brands-grid { grid-template-columns: 1fr; gap: 22px; }
    .brands-slider .brand-logos { grid-auto-columns: calc((100% - 3 * 14px) / 4); }
    .hero .trust { flex-wrap: wrap; }
}

/* ---- Petite tablette / mobile (≤ 860px) ---- */
@media (max-width: 860px) {
    .topbar .wrap { justify-content: center; }
    .header-main { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 14px; padding-block: 10px; }
    .header-main .logo { order: 1; }
    .header-main .logo img { height: 46px; }
    .header-actions { order: 2; margin-left: auto; gap: 16px; }
    .header-main .search { order: 3; flex: 1 1 100%; max-width: none; width: 100%; padding: 4px 4px 4px 18px; }
    .search button { width: 38px; height: 38px; }
    .burger { display: grid; place-items: center; }
    .nav { display: none; flex-direction: column; align-items: stretch; gap: 4px; padding: 8px 0 16px; }
    .nav.open { display: flex; }
    .nav .nav-item { width: 100%; }
    .nav-link, .nav-all { padding: 10px 0; width: 100%; justify-content: flex-start; }
    .nav-promo { margin: 8px 0 0; align-self: flex-start; }

    /* Héros */
    .hero { background: linear-gradient(180deg, rgba(255, 255, 255, .92) 0%, rgba(255, 255, 255, .78) 42%, rgba(255, 255, 255, 0) 68%), var(--hero-img) 62% bottom / auto 62% no-repeat, #f6fafc; }
    .hero .hero-grid { min-height: 0; aspect-ratio: auto; padding: 26px 0 270px; }
    .hero .hero-copy { max-width: none; }
    .hero h1 { font-size: clamp(1.7rem, 7.5vw, 2.3rem); }
    .hero .trust { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 8px; padding: 14px 16px; width: 100%; background: rgba(255, 255, 255, .88); }
    .hero .trust li { border: 0 !important; padding: 0; min-width: 0; }
    .hero .trust li > span { min-width: 0; }
    .hero .trust .icon { flex: none; width: 40px; height: 40px; min-width: 40px; min-height: 40px; padding: 9px; }

    /* Sections */
    .section { padding-top: 40px; }
    .section-head { flex-direction: column; align-items: flex-start; gap: 8px; margin-bottom: 18px; }
    .section-head > .side-whale, .side-cta .best-note, .best-heart { display: none; }
    .side-cta { display: block; margin: 0; }
    .promo-grid { grid-template-columns: 1fr; gap: 16px; }
    .promo-feature { min-height: 300px; height: auto; }
    .promo-carousel .track, #best .track { grid-auto-columns: 78%; }
    .cat-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
    .cat { min-height: 150px; padding: 14px; }
    .cat p { max-width: 100%; font-size: .66rem; }
    .cat-big { width: 76px; height: 76px; right: 8px; bottom: 8px; }
    .cat-big .icon { width: 42px; height: 42px; }
    .cat h3 { font-size: .85rem; }

    /* Marques */
    .brands-band { padding: 34px 0 28px; }
    .brands-band::after { display: none; }
    .brands-slider .brand-logos { grid-template-rows: repeat(2, 76px); grid-auto-columns: calc((100% - 14px) / 2); }
    .brands-slider .prev { left: 4px; }
    .brands-slider .next { right: 4px; }

    /* Newsletter */
    .newsletter { padding-block: 32px 150px; }
    .newsletter::before { background: linear-gradient(180deg, rgba(255, 255, 255, .85) 0%, rgba(255, 255, 255, .6) 50%, rgba(255, 255, 255, 0) 80%), var(--news-img) 70% bottom / auto 55% no-repeat; }
    .news-form { flex-wrap: wrap; border-radius: 22px; padding: 8px; }
    .news-form input { flex: 1 1 140px; padding: 6px; }
    .news-form .btn { flex: 1 1 100%; }

    /* Pied de page */
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 26px 18px; }
    .f-brand { grid-column: 1 / -1; }
    .copy { flex-direction: column; gap: 6px; align-items: flex-start; }
}

/* ---- Mobile (≤ 480px) ---- */
@media (max-width: 480px) {
    .wrap { width: calc(100% - 32px); }
    .newsletter .wrap.news-grid { width: calc(100% - 32px); }
    .topbar { font-size: .66rem; }
    .topbar .wrap > a, .topbar .wrap > span:nth-child(2) { display: none; }
    .hero .hero-grid { padding-bottom: 230px; }
    .hero .btn { width: 100%; }
    .section h2, .promos .section-head h2 { font-size: 1.55rem; }
    .promo-carousel .track, #best .track { grid-auto-columns: 82%; }
    .promo-carousel .next, #best .carousel .next { right: -4px; }
    .promo-carousel .prev, #best .carousel .prev { left: -4px; }
    .brands-copy .btn, .promo-feature .btn { width: auto; }
    .footer-grid { grid-template-columns: 1fr 1fr; }
    .thanks-wrap { flex-wrap: wrap; }
}

/* ---- Correctifs mobile ---- */
@media (max-width: 860px) {
    .promo-feature { min-height: 380px; }
    .feature-art { height: 42%; }
    .brands-slider .brand-logos { grid-auto-flow: row; grid-template-rows: none; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 76px; overflow: visible; }
    .brands-slider .car-btn { display: none !important; }
    .news-copy p br { display: none; }
}
@media (max-width: 600px) {
    .cat .cat-icon { display: none; }
    .cat-big { top: 10px; bottom: auto; width: 54px; height: 54px; right: 10px; }
    .cat-big::after { display: none; }
    .cat-big .icon { width: 30px; height: 30px; }
    .cat h3 { margin-top: 44px; }
    .cat p { max-width: 100%; }
}
@media (max-width: 860px) { .mega .mega-dd { width: 100%; } }

/* Cartes produit : l'image garde ses proportions et ne chevauche plus le texte */
.product .product-img { flex: none; height: auto; aspect-ratio: 1 / .82; width: 100%; overflow: hidden; position: relative; }
.product .product-img img { position: absolute; inset: 8%; width: 84%; height: 84%; object-fit: contain; }
.product h3, .product .meta, .product .stars, .product .price, .product form { flex: none; }
.product form { margin-top: auto; }

/* ===== Page produits et grilles de cartes : jamais de débordement ===== */
.shop > *, .results, .product-grid > * { min-width: 0; }
.product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 860px) {
    .shop { grid-template-columns: minmax(0, 1fr); padding-block: 22px 10px; }
    .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .product-grid .card.product { padding: 10px 10px 12px; border-radius: 18px; }
    .product-grid .product h3 { font-size: .78rem; }
    .product-grid .product .btn-block { padding: 10px 6px; font-size: .72rem; gap: 5px; }
    .product-grid .product .price strong { font-size: .92rem; }
    .product-grid .product .price s { font-size: .64rem; }
    .results-tools { width: 100%; justify-content: space-between; }
    .dropsel-btn { min-width: 0; }
    .filters { padding: 16px; }
    .f-block:not([open]) { padding-bottom: 14px; }
}
@media (max-width: 420px) {
    .product-grid .product .btn-block svg { display: none; }
    .trust-inline { grid-template-columns: 1fr; }
    .trust-inline li { white-space: normal; border: 0 !important; }
}

/* ===== Corrections mobile : fiche produit, contact, newsletter ===== */
.news-copy p br { display: inline; content: " "; }
@media (max-width: 860px) {
    .news-copy p br { display: none; }
    .news-copy p { white-space: normal; }
    .pdp-price { flex-wrap: wrap; gap: 4px 10px; align-items: center; }
    .pdp-price strong { font-size: 1.5rem; white-space: nowrap; }
    .pdp-price s { white-space: nowrap; }
    .pdp-buy { width: 100%; }
    .pdp-buy .btn { flex: 1; }
    .check-inline { display: block; line-height: 1.6; }
    .check-inline input { margin-right: 8px; vertical-align: middle; }
    .form-foot { align-items: stretch; }
    .form-foot .btn { width: 100%; }
}

/* ===== Tablette (601–860px) : carrousels à 2 cartes, grilles à 3 colonnes ===== */
@media (min-width: 601px) and (max-width: 860px) {
    .promo-carousel .track, #best .track { grid-auto-columns: calc((100% - 16px) / 2); }
    .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .promo-feature { min-height: 320px; }
}
@media (min-width: 861px) and (max-width: 1100px) {
    .promo-carousel .track { grid-auto-columns: calc((100% - 20px) / 2); }
    #best .track { grid-auto-columns: calc((100% - 40px) / 3); }
}
.promo-feature > * { position: relative; z-index: 2; }
.promo-feature > .feature-art { position: absolute; z-index: 0; }
.promo-feature > .promo-leaf, .promo-feature > .promo-heart { position: absolute; z-index: 1; }
@media (min-width: 601px) and (max-width: 860px) {
    .section.tight .product-grid > :nth-child(4) { display: none; }
    .promo-feature { min-height: 380px; }
    .feature-art { height: 40%; }
}
