/* ==========================================================================
   Eden — Responsive mobile (réf sixtystones, breakpoints 1024 / 640 / 480)
   Chargé APRÈS main.css + pages.css + product.css → surcharge l'existant.
   Couche 1 : SHELL global (burger/drawer, topbar, header, nav, footer) + home + boutique.
   ========================================================================== */

/* ---------- Sécurité globale ---------- */
img, video, iframe, svg { max-width: 100%; }
* { -webkit-text-size-adjust: 100%; }

/* Desktop : description catégorie resserrée en haut UNIQUEMENT quand tous les
   produits sont affichés (plus de bouton « Voir plus de produits »). */
@media (min-width: 641px) {
	body:not(:has(.shop-loadmore-wrap)) .cat-description { margin-top: 12px !important; }
}
@media (max-width: 768px) {
	/* Évite tout débordement horizontal */
	input, select, textarea { max-width: 100%; }
	/* Tableaux WooCommerce (commandes, totaux) scrollables au lieu de déborder */
	.woocommerce table.shop_table,
	.acc-section table:not(.acc-no-scroll) { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* ---------- Burger + drawer + loupe : cachés en desktop ---------- */
.eden-burger { display: none; }
.eden-mnav, .eden-mnav__backdrop { display: none; }
.eden-search-toggle { display: none; } /* loupe mobile uniquement */

/* ==========================================================================
   ≤ 1024px — bascule en navigation mobile
   ========================================================================== */
@media (max-width: 1024px) {

	/* Burger visible, nav horizontale masquée */
	.eden-burger {
		display: inline-flex;
		flex-direction: column;
		justify-content: center;
		gap: 5px;
		width: 42px;
		height: 42px;
		padding: 10px;
		margin: 0 2px 0 -2px;
		border: 0;
		background: none;
		cursor: pointer;
		flex: 0 0 auto;
		-webkit-tap-highlight-color: transparent;
	}
	.eden-burger span {
		display: block;
		width: 100%;
		height: 2px;
		background: var(--ink, #1a1a1a);
		border-radius: 2px;
		transition: transform .25s ease, opacity .2s ease;
	}
	body.eden-mnav-open .eden-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
	body.eden-mnav-open .eden-burger span:nth-child(2) { opacity: 0; }
	body.eden-mnav-open .eden-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

	.nav { display: none; }

	/* ---------- Header : burger | logo | utils, recherche en dessous ---------- */
	.header { padding-top: 10px !important; padding-bottom: 0 !important; }
	.header-inner {
		display: flex;
		align-items: center;
		flex-wrap: wrap;
		gap: 10px 8px;
		padding-top: 6px;
		padding-bottom: 6px;
	}
	.header-inner .logo { margin: 0 auto 0 0; }
	.header-inner .logo-img { max-height: 64px; width: auto; }
	.header-inner .utils { margin-left: auto; gap: 4px; }
	/* La barre de recherche sort du header → loupe + champ dans le menu mobile */
	.header-inner .search-wrap { display: none !important; }
	.eden-search-toggle { display: inline-flex; }
	.utils .icon-btn { width: 46px; height: 46px; }
	.utils .icon-btn svg { width: 24px; height: 24px; }

	/* Champ de recherche en haut du drawer mobile */
	.eden-mnav__search {
		display: flex; align-items: center; gap: 8px;
		margin: 14px 16px 6px;
		padding: 8px 12px;
		background: #fff;
		border: 1.5px solid var(--rose-soft, #e8c8dc);
		border-radius: 10px;
	}
	.eden-mnav__search svg { color: var(--rose-deep, #a66898); flex: 0 0 auto; }
	.eden-mnav__search input {
		flex: 1; min-width: 0; border: 0; background: none; outline: none;
		font: inherit; font-size: 15px; color: var(--ink, #1a1a1a);
	}

	/* ---------- Drawer mobile — plein écran façon SixtyStones, couleurs Eden ---------- */

	/* BACKDROP : plus nécessaire en plein écran, on le masque */
	.eden-mnav__backdrop { display: none !important; }
	/* Burger caché quand le menu est ouvert */
	body.eden-mnav-open .eden-burger { display: none; }

	.eden-mnav {
		display: flex;
		flex-direction: column;
		position: fixed;
		inset: 0;
		width: 100%; max-width: 100%;
		background: var(--cream, #fffcf7);
		z-index: 1200;
		padding: 0 !important;
		overflow: hidden;
		-webkit-overflow-scrolling: touch;
		transform: translateX(-100%);
		transition: transform .28s cubic-bezier(.4,0,.2,1);
		visibility: hidden;
	}
	body.eden-mnav-open .eden-mnav { transform: none; visibility: visible; }

	/* HEAD : logo + bouton fermer */
	.eden-mnav__head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 14px 20px;
		border-bottom: 1px solid var(--rose-soft, #e8c8dc);
		flex: 0 0 auto;
	}
	.eden-mnav__logo img { max-height: 44px; width: auto; display: block; }
	.eden-mnav__close {
		width: 42px; height: 42px;
		display: inline-flex; align-items: center; justify-content: center;
		border: 0; background: var(--rose-mist, #f8e8f1); color: var(--rose-deep, #a66898);
		border-radius: 12px; cursor: pointer; flex: 0 0 auto;
	}

	/* SCROLL : zone défilante centrale */
	.eden-mnav__scroll { flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; padding-bottom: 8px; }

	/* Barre de recherche */
	.eden-mnav__search {
		display: flex; align-items: center; gap: 8px;
		margin: 10px 20px 8px;
		padding: 8px 12px;
		background: #fff;
		border: 1.5px solid var(--rose-soft, #e8c8dc);
		border-radius: 12px;
	}
	.eden-mnav__search svg { color: var(--rose-deep, #a66898); flex: 0 0 auto; }
	.eden-mnav__search input {
		flex: 1; min-width: 0; border: 0; background: none; outline: none;
		font: inherit; font-size: 15px; color: var(--ink, #1a1a1a); outline: none;
	}

	/* MENU ACCORDION */
	.eden-mnav__nav .nav-inner { display: block; padding: 6px 0; justify-content: flex-start; }
	.eden-mnav__nav .nav-item { width: 100%; justify-content: flex-start; text-align: left; }
	.eden-mnav__nav .nav-item-wrap {
		display: block; position: static;
		border-bottom: 1px solid rgba(204,139,185,.1);
	}
	.eden-mnav__nav .nav-item-wrap:last-child { border-bottom: 0; }
	.eden-mnav__nav .nav-item {
		display: flex; align-items: center; gap: 10px;
		padding: 16px 20px;
		font-size: 15.5px; font-weight: 500;
		color: var(--ink, #1a1a1a);
		background: none !important;
		border-radius: 0; min-height: 54px;
		transition: background .15s, color .15s;
	}
	.eden-mnav__nav .nav-item:active { background: var(--rose-mist, #f8e8f1) !important; color: var(--rose-deep, #a66898); }
	.eden-mnav__nav .nav-item img,
	.eden-mnav__nav .nav-item svg { width: 20px; height: 20px; flex: 0 0 auto; }

	/* Chevron SVG propre (pas d'artefact d'angle contrairement au border-trick) */
	.eden-mnav__nav .nav-item-wrap.has-children > .nav-item::after {
		content: "";
		margin-left: auto;
		flex: 0 0 auto;
		width: 14px; height: 14px;
		background: var(--rose-deep, #a66898);
		-webkit-mask: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2 3.5 L5 6.5 L8 3.5' stroke='black' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
		mask: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M2 3.5 L5 6.5 L8 3.5' stroke='black' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
		transition: transform .25s ease;
	}
	.eden-mnav__nav .nav-item-wrap.has-children.is-open > .nav-item::after { transform: rotate(180deg); }

	/* Item ouvert */
	.eden-mnav__nav .nav-item-wrap.has-children.is-open > .nav-item {
		color: var(--rose-deep, #a66898);
	}

	/* Sous-menu accordéon */
	.eden-mnav__nav .nav-submenu {
		position: static !important;
		display: none !important;
		opacity: 1 !important; visibility: visible !important;
		transform: none !important; box-shadow: none !important;
		background: transparent !important;
		border: 0 !important; width: auto !important;
		top: auto !important; left: auto !important; right: auto !important;
		padding: 4px 0 10px !important; margin: 0 !important;
		pointer-events: auto !important;
	}
	.eden-mnav__nav .nav-item-wrap.is-open > .nav-submenu { display: block !important; }
	.eden-mnav__nav .nav-submenu-inner {
		display: grid !important;
		grid-template-columns: 1fr 1fr !important;
		max-width: none !important;
		margin: 0 !important; padding: 4px 6px !important; gap: 0 !important;
	}
	.eden-mnav__nav .nav-submenu .nav-pill,
	.eden-mnav__nav .nav-submenu a {
		display: flex !important; align-items: center;
		justify-content: flex-start !important; flex: 0 0 auto !important;
		width: auto !important; gap: 10px;
		margin: 2px 14px !important; padding: 10px 14px !important;
		border: 0 !important; border-radius: 10px !important;
		background: transparent !important;
		font-size: 14px !important; font-weight: 500 !important;
		color: var(--ink-soft, #4f4f4f) !important;
		text-transform: none !important; letter-spacing: 0 !important;
		white-space: normal !important;
	}
	.eden-mnav__nav .nav-submenu a:active { background: rgba(204,139,185,.14) !important; }
	.eden-mnav__nav .nav-submenu a img,
	.eden-mnav__nav .nav-submenu a svg { width: 18px; height: 18px; }

	/* FOOT : liens Mon compte + Recherche, épinglés en bas */
	.eden-mnav__links {
		display: flex; flex-direction: column;
		padding: 8px 0;
		border-top: 1px solid var(--rose-soft, #e8c8dc);
		flex: 0 0 auto;
	}
	.eden-mnav__links a {
		display: flex; align-items: center; gap: 12px;
		padding: 14px 20px; font-size: 14.5px;
		color: var(--ink, #1a1a1a); font-weight: 500;
	}
	.eden-mnav__links a svg { color: var(--rose-deep, #a66898); }
	.eden-mnav__links a:active { background: var(--rose-mist, #f8e8f1); }

	/* Socials */
	.eden-mnav__socials {
		display: flex; gap: 10px; padding: 10px 20px 20px;
		border-top: 1px solid var(--rose-soft, #e8c8dc);
		flex: 0 0 auto;
	}
	.eden-mnav__socials a {
		width: 40px; height: 40px; border-radius: 12px;
		display: inline-flex; align-items: center; justify-content: center;
		background: var(--rose-mist, #f8e8f1); color: var(--rose-deep, #a66898);
	}

	/* ---------- Gutter latéral : 12px PARTOUT en mobile (au lieu de 24px desktop) ---------- */
	.container,
	.header-inner, .topbar-inner, .nav-inner, .eden-announce__inner,
	.footer-grid, .footer-bottom__inner,
	.product-page .wrap, .shop-wide, .shop-layout,
	.bp-layout, .au-page, .cart-page, .co-page, .cm-page, .ct-page, .log-page, .acc-page, .err-page,
	.cm-content, .or-page {
		padding-left: 12px !important;
		padding-right: 12px !important;
	}
	/* Cartes : padding interne réduit pour gagner en largeur de contenu */
	.acc-section, .acc-card, .co-card { padding-left: 16px !important; padding-right: 16px !important; }

	/* ---------- Footer ---------- */
	.footer-grid { grid-template-columns: 1fr 1fr !important; gap: 28px 20px; }

	/* ---------- Home : hero remonté (top réduit, min-height retirée) ---------- */
	.hero-inner {
		grid-template-columns: 1fr !important;
		text-align: center;
		gap: 18px;
		padding-top: 18px !important;
		padding-bottom: 30px !important;
		min-height: 0 !important;
	}
	.hero-deco { display: none; }

	/* ---------- Boutique : grille produits ---------- */
	.shop-grid { grid-template-columns: repeat(3, 1fr) !important; gap: 14px; }
}

/* ==========================================================================
   ≤ 640px — téléphone
   ========================================================================== */
@media (max-width: 640px) {

	/* Plus d'espace en bas du contenu compte avant le footer (sur mobile) */
	.acc-page { padding-bottom: 24px !important; }
	/* (Les blocs/sections restent alignés à GAUCHE — seul le hero est centré, voir plus haut.) */
	/* En-tête de commande : titre+date+statut puis bouton, empilés à gauche, sans espace sous le bouton */
	.acc-ov-head { flex-direction: column; align-items: flex-start; gap: 10px; margin-bottom: 5px !important; }
	.acc-ov-meta { flex-wrap: wrap; gap: 6px 10px; margin-top: 4px; }
	/* Bloc « Numéro de suivi » : contenu centré sur mobile */
	.acc-track { flex-direction: column; align-items: center; text-align: center; }
	.acc-track-info { align-items: center; }
	.acc-track-btn { width: 100%; }

	/* Topbar : UNIQUEMENT le texte défilant, centré (langue, Discord, support, socials masqués) */
	.topbar-inner { display: flex !important; align-items: center; gap: 8px; padding-top: 8px !important; padding-bottom: 8px !important; min-height: 34px; justify-content: center !important; }
	.topbar-left-group { display: none !important; } /* drapeau langue + Discord → masqués */
	.topbar-account { display: none !important; }    /* support + socials → dispo dans le drawer */
	.topbar-center { flex: 0 1 auto; min-width: 0; text-align: center; justify-content: center; }
	.topbar-center .topbar-rotator { justify-content: center; text-align: center; margin: 0 auto; min-width: 0; max-width: 100%; }

	/* Header */
	.header-inner .logo-img { max-height: 60px; }
	.utils .icon-btn { width: 44px; height: 44px; }
	.utils .icon-btn svg { width: 23px; height: 23px; }
	.quiz-trigger span { display: none; } /* garde l'icône conseil, libère de la place */

	/* Recherche : bouton icône seule + champ ramassé */
	.header-inner form.search { padding-left: 12px; }
	.header-inner form.search input { font-size: 13.5px; }
	.header-inner form.search button { font-size: 0; padding: 7px 10px; gap: 0; }
	.header-inner form.search button svg { width: 16px; height: 16px; }

	/* Bloc « aucun produit » : marge basse sur mobile */
	.shop-empty { margin-bottom: 15px; }

	/* Barre de filtres « tout visible » : en colonne sur mobile (filtres au-dessus, tri en dessous) */
	.shop-toolbar-v2 { flex-direction: column; align-items: stretch; gap: 12px; padding: 12px; }
	.shop-toolbar-v2__filters { gap: 8px 12px; overflow: visible !important; flex-wrap: wrap !important; }
	.shop-toolbar-v2__meta { justify-content: space-between; }
	.shop-sort-v2 { flex: 1; }
	.shop-sort-v2 select { width: 100%; }
	.shop-fgroup { flex: 1 1 100%; flex-wrap: wrap; }
	.shop-fprice input { width: 56px; }

	/* Grilles produits → 2 colonnes */
	.shop-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 12px; }
	/* Cartes produit : titre + prix un peu plus petits (cartes étroites en 2 col) */
	.shop-wide .product-name { font-size: 15px; min-height: 2.5em; }
	.shop-wide .product-price { font-size: 20px; }
	.shop-wide .product-price-cents, .shop-wide .product-price small { font-size: 12.5px; }
	/* Bouton d'action des cartes : moins haut */
	.shop-wide .product-cta--long { height: 36px; font-size: 12.5px; border-radius: 10px; }
	.shop-wide .product-cta--long svg { width: 15px; height: 15px; }
	/* Rupture de stock → juste « Rupture » sur mobile */
	.product-cta--oos .oos-suffix { display: none; }
	.footer-grid { grid-template-columns: 1fr 1fr !important; }

	/* Modales du site (.eden-modal) : version mobile plus compacte + bien centrée */
	.eden-modal { padding: 16px !important; }
	.eden-modal__box { padding: 22px 20px 18px !important; border-radius: 16px !important; margin-bottom: 0 !important; max-width: 360px; }
	.eden-modal__icon { width: 46px !important; height: 46px !important; margin-bottom: 12px !important; }
	.eden-modal__box h3 { font-size: 18px !important; }
	.eden-modal__box p { font-size: 13.5px !important; margin-bottom: 18px !important; }

	/* Typo : on adoucit les très gros titres */
	h1, .h1 { font-size: clamp(26px, 7vw, 38px); }
	h2, .h2 { font-size: clamp(22px, 6vw, 30px); }

	/* Bloc stats du bandeau catégorie (X articles / Livraison 48h / Sélection éleveurs) masqué sur mobile */
	.cat-stat { display: none !important; }

	/* Bloc description SEO en bas des catégories (mobile) :
	   - quand TOUS les produits sont affichés (plus de bouton « Voir plus de produits ») → marge haute resserrée
	   - tant qu'il reste le bouton « Voir plus de produits » → marge haute normale */
	.cat-description { margin-top: 9px !important; margin-bottom: -27px !important; }
	body:has(.shop-loadmore-wrap) .cat-description { margin-top: 27px !important; }

	/* Cartes produit : retirer le mot « Fréquent » (badge nutri) + désactiver les popups au survol (tactile) */
	.nutri-card > span { display: none; }
	/* Badge nutri à la même taille que le badge note (icône agrandie pour égaliser la hauteur) */
	.nutri-card { padding: 3px 7px !important; gap: 0 !important; }
	.nutri-card > svg { width: 16px !important; height: 16px !important; }
	.nutri-card__pop,
	.product-reviews__pop,
	.shop-wide .product-reviews__pop { display: none !important; }

	/* Hero de page (cat-banner : compte, catégorie, etc.) : titre décollé du haut + tailles réduites + CENTRÉ */
	.cat-banner { padding-top: 40px !important; text-align: center !important; }
	/* Pages catégorie/boutique : on resserre fort sous le bandeau (stats masquées) */
	.tax-product_cat .cat-banner,
	.post-type-archive-product .cat-banner,
	.term-description .cat-banner,
	.woocommerce-shop .cat-banner { padding-bottom: 8px !important; margin-bottom: -8px !important; }
	.cat-banner__inner { flex-direction: column !important; align-items: center !important; justify-content: center !important; text-align: center !important; }
	.cat-banner__content { text-align: center !important; align-items: center !important; width: 100%; }
	.cat-lead-wrap, .cat-banner__lead { margin-left: auto !important; margin-right: auto !important; }
	.cat-banner h1 { font-size: 23px !important; margin-top: 0 !important; text-align: center !important; }
	.cat-banner__lead, .cat-banner p { font-size: 13.5px !important; line-height: 1.55; }
}

/* ==========================================================================
   ≤ 420px — petits téléphones
   ========================================================================== */
@media (max-width: 420px) {
	.footer-grid { grid-template-columns: 1fr !important; }
	.shop-grid { gap: 10px; }
}

/* ==========================================================================
   PAGES — mises en page multi-colonnes qui doivent s'empiler en mobile
   ========================================================================== */

/* ---- Layouts à colonne latérale : empilent dès ≤ 960px ---- */
@media (max-width: 960px) {
	/* Espace client : nav latérale + contenu → 1 colonne */
	.acc-layout { grid-template-columns: 1fr !important; gap: 16px !important; }
	/* Espacement vertical UNIFORME entre tous les blocs du compte (16px partout) */
	.acc-welcome, .acc-heat-line, .acc-cards, .acc-section, .acc-orders { margin-bottom: 16px !important; }
	.acc-page > .acc-layout > div > :last-child,
	.acc-section:last-child, .acc-orders:last-child { margin-bottom: 0 !important; }
	/* Nav compte : liste verticale propre, pleine largeur (dé-stické) */
	.acc-nav {
		position: static !important;
		top: auto !important;
		display: block !important;
	}
	.acc-nav a { font-size: 14px; padding: 11px 12px; }
	/* Accordéon : titres de section repliables avec chevron */
	.acc-nav .acc-nav-title {
		display: flex !important;
		align-items: center;
		cursor: pointer;
		user-select: none;
		padding-top: 14px;
		padding-bottom: 12px;
		margin: 6px 0 0;
		font-size: 14px;
		font-weight: 500; /* pas gras */
	}
	.acc-nav .acc-nav-title::after {
		content: "";
		margin-left: auto;
		width: 8px; height: 8px;
		border-right: 2px solid var(--rose-deep, #a66898);
		border-bottom: 2px solid var(--rose-deep, #a66898);
		transform: rotate(45deg) translateY(-2px); /* remonte le chevron au centre */
		transition: transform .2s ease;
	}
	.acc-nav .acc-nav-title.is-open::after { transform: rotate(-135deg) translateY(-2px); }
	.acc-nav .acc-nav-group { display: none; }
	.acc-nav .acc-nav-group.is-open { display: block; }
	/* Espace entre le titre de section et son premier lien */
	.acc-nav .acc-nav-group > a:first-child { margin-top: 6px; }
	/* Moins d'espace sous le dernier item de chaque section */
	.acc-nav .acc-nav-group > a:last-child { padding-bottom: 8px; margin-bottom: 0; }
	/* Espace avant le séparateur quand « Avantages » est REPLIÉ (sinon collé au trait) */
	.acc-nav .acc-nav-div { margin-top: 16px !important; }
	/* Mais quand « Avantages » est DÉROULÉ : espace bas normal (comme Mon compte) */
	.acc-nav .acc-nav-group.is-open + .acc-nav-div { margin-top: 6px !important; }

	/* Panier & commande : récap qui passe sous le contenu */
	.cart-layout, .co-layout { grid-template-columns: 1fr !important; gap: 16px !important; }
	/* Checkout : le récap est forcé en grid-column:2 sur desktop → on le ramène en
	   pleine largeur ET en HAUT (avant les étapes) sur mobile, sinon il écrase la
	   colonne de gauche. */
	.co-page--wc .co-layout > .co-summary { grid-column: 1 / -1 !important; grid-row: 1 !important; }
	.co-page--wc .co-layout > #customer_details { grid-row: 2 !important; }

	/* Contact : formulaire + infos empilés */
	.ct-grid { grid-template-columns: 1fr !important; gap: 22px !important; }

	/* En-tête bienvenue compte */
	.acc-welcome { grid-template-columns: 1fr !important; text-align: left; gap: 14px !important; }
}

/* ---- Grilles de cartes : 2 colonnes ≤ 760px ---- */
@media (max-width: 760px) {
	.acc-cards { grid-template-columns: 1fr 1fr !important; gap: 12px !important; }
	.acc-card { padding: 16px 16px !important; }
	/* « Niveau fidélité » (3e carte) sur toute la largeur */
	.acc-cards .acc-card:nth-child(3) { grid-column: 1 / -1; }
	.acc-card-value { font-size: 23px !important; }
	.acc-card-value small { font-size: 13px !important; }
	.acc-card-label { font-size: 16px; }
	.or-meta { grid-template-columns: 1fr 1fr !important; }
	.bp-grid { grid-template-columns: 1fr 1fr !important; gap: 16px !important; }
	.sp-related-grid { grid-template-columns: 1fr 1fr !important; }
	.cart-crosssell-grid { grid-template-columns: repeat(2, 1fr) !important; }
	.nutri-guide__legend { grid-template-columns: 1fr !important; }
	.product-trust { grid-template-columns: 1fr !important; gap: 10px !important; }
	.acc-addr-grid { grid-template-columns: 1fr !important; }

	/* Lignes de commande (5 colonnes) → carte empilée lisible */
	.acc-order-row { grid-template-columns: 1fr 1fr !important; row-gap: 8px; }

	/* Adresse + saisie wishlist/profil public */
	.acc-pub-fields, .acc-pub-link-row { grid-template-columns: 1fr !important; flex-direction: column; }
}

/* ---- Téléphone ≤ 560px : tout en 1 colonne ---- */
@media (max-width: 560px) {
	.acc-cards { grid-template-columns: 1fr 1fr !important; } /* commandes + cashback côte à côte */
	.or-meta { grid-template-columns: 1fr 1fr !important; }
	.bp-grid { grid-template-columns: 1fr !important; }
	.sp-related-grid { grid-template-columns: 1fr 1fr !important; }
	.acc-order-row { grid-template-columns: 1fr !important; row-gap: 4px; }
	.acc-order-row > * { padding: 1px 0; }

	/* Items panier / commande : vignette plus petite */
	.cart-item { grid-template-columns: 72px 1fr !important; row-gap: 10px; }
	.cart-item > :last-child { grid-column: 1 / -1; }
	.product-gallery-thumbs { grid-template-columns: repeat(5, 1fr); }
}

/* ==========================================================================
   HOME — sections (hero, about, univers, marquee, newsletter, blog, seo…)
   ========================================================================== */

/* ---- Sécurité anti-overflow global ---- */
body { overflow-x: hidden; }

/* ---- Anti-overflow : marquees animés + conteneurs ---- */
.reviews, .univers-marquee, .marquee, .sxs-related__viewport {
	overflow: hidden !important;
	max-width: 100vw;
}
html { overflow-x: hidden; }

@media (max-width: 1024px) {

	/* ---------- Hero slider ---------- */
	.hero-slider { padding: 40px 16px 32px; min-height: 0; }
	.hero-slide.active {
		grid-template-columns: 1fr !important;
		gap: 24px;
	}
	.hero-slide-text { padding: 0 !important; }
	.hero-slide-h1 { font-size: clamp(32px, 8vw, 46px) !important; line-height: 1.05; }
	.hero-slide-sub { font-size: 14px; margin-bottom: 18px; }
	.hero-slide-ctas { gap: 10px; }
	.hero-slide-visual { max-width: 100%; order: -1; }
	.hero-slide-img, .hero-slide-img-2 { height: 260px !important; min-height: 0 !important; }
	.hero-arrow-btn { display: none; }
	.hero-dots { bottom: 10px; }
	.hero-floor { display: none; }

	/* ---------- Section titres ---------- */
	.section-title, .section-h2 { font-size: clamp(22px, 6vw, 32px) !important; }
	.section-sub { font-size: 13.5px; }

	/* ---------- Marquee confiance ---------- */
	.marquee { overflow: hidden; }
	.marquee-track { gap: 24px; }
	.marquee-item { font-size: 12px; gap: 6px; }

	/* ---------- Univers (marquee cartes) ---------- */
	.univers { padding: 32px 0; }
	.univers-track { gap: 12px; }
	.univers-card { min-width: 200px; }

	/* ---------- About ---------- */
	.about-grid { grid-template-columns: 1fr !important; gap: 24px; }
	.about-portrait { max-width: 200px; margin: 0 auto; }
	.about-pillars { grid-template-columns: 1fr 1fr !important; gap: 12px; }
	.about-inner { padding: 32px 16px !important; }

	/* ---------- Bloc SEO (onglets) ---------- */
	.seo-inner { padding: 32px 16px !important; }
	.seo-tabs { overflow-x: auto; -webkit-overflow-scrolling: touch; gap: 8px; flex-wrap: nowrap; padding-bottom: 4px; }
	.seo-tabs button, .seo-tab { white-space: nowrap; font-size: 13px; padding: 6px 14px !important; }
	.seo-panels { margin-top: 20px; }
	.seo-panel { grid-template-columns: 1fr !important; gap: 20px; }
	.seo-panel-visual { order: -1; height: 220px; }
	.seo-panel-text h2 { font-size: 22px !important; }

	/* ---------- Reviews / avis marquee ---------- */
	.reviews-inner { padding: 0 16px; }
	.review-text { font-size: 13px; }

	/* ---------- Newsletter ---------- */
	.newsletter { padding: 32px 16px !important; }
	.newsletter form { flex-direction: column !important; gap: 10px; }
	.newsletter input[type="email"] { width: 100% !important; border-radius: 10px !important; }
	.newsletter button[type="submit"] { width: 100% !important; border-radius: 10px !important; }

	/* ---------- Blog cards ---------- */
	.blog-inner { grid-template-columns: 1fr !important; gap: 16px; }
	.blog-card { flex-direction: column !important; }
	.blog-img { height: 200px !important; width: 100% !important; min-width: 0 !important; }

	/* ---------- Browse / catégories grid ---------- */
	.browse { grid-template-columns: repeat(2, 1fr) !important; gap: 10px; padding: 0 16px; }
}

@media (max-width: 640px) {
	/* Hero encore plus compact */
	.hero-slider { padding: 28px 16px 24px; }
	.hero-slide-img, .hero-slide-img-2 { height: 200px !important; }
	.hero-slide-h1 { font-size: clamp(26px, 9vw, 38px) !important; }

	/* Univers card plus petites */
	.univers-card { min-width: 160px; }
	.univers-card-img { height: 110px !important; }

	/* About pilliers 1 colonne */
	.about-pillars { grid-template-columns: 1fr !important; }

	/* Browse 2 col petites */
	.browse { padding: 0 12px; }

	/* Newsletter */
	.newsletter { border-radius: 14px !important; }
}