/* ═══════════════════════════════════════════════════════════
   HORTIS — THEME CSS
   Identité : Cocooning moderne urbain
   Palette : Terracotta brûlée + crème + vert mousse + bois doux
   Fonts : Fraunces (headings) + Inter (body)
   ═══════════════════════════════════════════════════════════ */

/* ── Variables ─────────────────────────────────────────── */
:root {
  --primary: #2A3326;          /* vert mousse profond */
  --primary-soft: #3D4B36;
  --cta: #3D5236;              /* vert mousse profond saturé (ex-terracotta) */
  --cta-hover: #2A3326;
  --accent: #8B9F7E;           /* sauge mousse */
  --accent-soft: #B4C0A4;
  --wood: #B4906A;             /* bois doux / tan */
  --wood-soft: #D9C3A6;
  --bg: #FFFBF4;               /* crème lumineuse */
  --bg-alt: #F5EFE2;           /* crème chaude */
  --bg-tint: #ECE3CF;          /* sable */
  --bg-deep: #2A3326;          /* mousse profond pour sections sombres */
  --ink: #1F2519;
  --ink-soft: #3A3F32;
  --border: #D6CDB6;
  --border-light: #ECE2C9;
  --muted: #6E6A5C;
  --muted-light: #9D998A;
  --danger: #B0413E;
  --success: #5F7F45;
  --stars: #E4A93B;            /* doré pour étoiles */
  --terra-soft: #B4C0A4;       /* sauge clair (ex-terracotta soft) */
  --radius: 10px;
  --radius-sm: 6px;
  --radius-lg: 18px;
  --shadow: 0 2px 14px rgba(42,51,38,.08);
  --shadow-lg: 0 12px 36px rgba(42,51,38,.16);
  --transition: .25s ease;
  --container: 1480px;
  --header-h: 72px;
  --utility-h: 36px;
  --font-heading: 'Instrument Sans', system-ui, sans-serif;
  --font-body: 'Instrument Sans', system-ui, sans-serif;
}

/* ── Reset ─────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + 16px); }
body { font-family: var(--font-body); font-size: 16px; line-height: 1.6; color: var(--ink); background: var(--bg); -webkit-font-smoothing: antialiased; }
img, video { max-width: 100%; height: auto; display: block; }
a { color: var(--cta); text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--cta-hover); }
button { cursor: pointer; font-family: inherit; border: none; background: none; }
ul, ol { list-style: none; }
input, select, textarea { font-family: inherit; font-size: inherit; }
::selection { background: var(--cta); color: #fff; }

/* ── Skip link ────────────────────────────────────────── */
.skip-link { position: absolute; top: -100%; left: 8px; padding: 8px 16px; background: var(--primary); color: #fff; z-index: 9999; border-radius: var(--radius-sm); }
.skip-link:focus { top: 8px; }

/* ── Container ────────────────────────────────────────── */
.container { max-width: var(--container); margin: 0 auto; padding: 0 20px; }

/* ── Typography ───────────────────────────────────────── */
h1, h2, h3, h4 { font-family: var(--font-heading); font-weight: 700; line-height: 1.2; color: var(--ink); }
h1 { font-size: clamp(2rem, 5vw, 3.2rem); }
h2 { font-size: clamp(1.6rem, 4vw, 2.4rem); }
h3 { font-size: clamp(1.2rem, 3vw, 1.6rem); }
.section-title { text-align: center; margin-bottom: 40px; position: relative; }
.section-title::after { content: ''; display: block; width: 60px; height: 3px; background: var(--cta); margin: 12px auto 0; border-radius: 2px; }
.section-subtitle { text-align: center; color: var(--muted); max-width: 600px; margin: -24px auto 40px; }

/* ── Buttons ──────────────────────────────────────────── */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 28px; font-weight: 600; font-size: .95rem; border-radius: var(--radius); transition: all var(--transition); white-space: nowrap; }
.btn-primary { background: var(--cta); color: #fff; }
.btn-primary:hover { background: var(--cta-hover); color: #fff; transform: translateY(-1px); box-shadow: var(--shadow); }
.btn-secondary { background: transparent; color: var(--cta); border: 2px solid var(--cta); }
.btn-secondary:hover { background: var(--cta); color: #fff; }
.btn-ghost { background: transparent; color: var(--ink); border: 2px solid var(--border); }
.btn-ghost:hover { border-color: var(--cta); color: var(--cta); }
.btn-lg { padding: 16px 36px; font-size: 1.05rem; }
.btn-sm { padding: 8px 16px; font-size: .85rem; }
.btn-white { background: #fff; color: var(--primary); }
.btn-white:hover { background: var(--bg-alt); color: var(--primary); }

/* ── Announcement Bar ─────────────────────────────────── */
.announcement-bar { background: var(--primary); color: #fff; text-align: center; padding: 10px 20px; font-size: .85rem; font-weight: 500; }
.announcement-bar a { color: #fff; text-decoration: underline; }
.announcement-bar .container { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.announcement-bar a, .announcement-bar span { display: inline-block; max-width: 100%; vertical-align: middle; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ═══════════════════════════════════════════════════════════
   HEADER
   ═══════════════════════════════════════════════════════════ */
.site-header { position: sticky; top: 0; z-index: 100; background: var(--bg); border-bottom: 1px solid var(--border-light); transition: box-shadow var(--transition); height: var(--header-h); }
.site-header.scrolled { box-shadow: var(--shadow); }
.header-inner { display: flex; align-items: center; justify-content: space-between; height: 100%; gap: 24px; }

/* Logo */
.logo { flex-shrink: 0; }
.logo a { display: flex; align-items: center; gap: 8px; color: var(--primary); }
.logo-text { font-family: var(--font-heading); font-size: 1.5rem; font-weight: 800; color: var(--primary); letter-spacing: -.02em; }
.logo img { height: 40px; width: auto; }

/* Desktop nav */
.nav-desktop { display: flex; align-items: center; gap: 4px; flex: 1; justify-content: center; }
.nav-desktop > a,
.nav-dropdown > a.nav-dropdown-trigger { display: flex; align-items: center; gap: 4px; padding: 8px 14px; font-weight: 500; font-size: .93rem; color: var(--ink); border-radius: var(--radius-sm); transition: all var(--transition); white-space: nowrap; }
.nav-desktop > a:hover,
.nav-dropdown:hover > a.nav-dropdown-trigger { color: var(--cta); background: var(--bg-tint); }
.nav-arrow { font-size: .65rem; transition: transform var(--transition); }
.nav-dropdown:hover .nav-arrow { transform: rotate(180deg); }

/* Dropdown */
.nav-dropdown { position: relative; }
.nav-dropdown-menu { position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(8px); min-width: 220px; background: var(--bg); border: 1px solid var(--border-light); border-radius: var(--radius); box-shadow: var(--shadow-lg); padding: 8px; opacity: 0; visibility: hidden; transition: all var(--transition); z-index: 50; }
.nav-dropdown:hover .nav-dropdown-menu { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); }
.nav-dropdown-item { display: block; padding: 8px 12px; color: var(--ink); border-radius: var(--radius-sm); font-size: .9rem; transition: all var(--transition); }
.nav-dropdown-item:hover { background: var(--bg-tint); color: var(--cta); }
.nav-dropdown-all { font-weight: 600; border-bottom: 1px solid var(--border-light); margin-bottom: 4px; padding-bottom: 10px; }

/* Header actions */
.header-actions { display: flex; align-items: center; gap: 8px; }
.header-icon-btn { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: 50%; transition: background var(--transition); font-size: 1.2rem; position: relative; color: var(--ink); }
.header-icon-btn:hover { background: var(--bg-tint); }
.cart-count { position: absolute; top: 2px; right: 2px; background: var(--cta); color: #fff; font-size: .65rem; width: 18px; height: 18px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; }

/* Mobile burger */
.burger-btn { display: none; width: 40px; height: 40px; flex-direction: column; align-items: center; justify-content: center; gap: 5px; }
.burger-btn-left { display: none; background: transparent; border: 0; cursor: pointer; padding: 0; }
.burger-line { display: block; width: 22px; height: 2px; background: var(--ink); transition: all var(--transition); border-radius: 2px; }

/* ── Mobile nav overlay + drawer ──────────────────────── */
.mobile-nav-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.5); opacity: 0; visibility: hidden; transition: all var(--transition); z-index: 199; }
.mobile-nav-overlay.open { opacity: 1; visibility: visible; }

.mobile-nav { position: fixed; top: 0; left: 0; width: min(340px, 85vw); height: 100%; background: var(--bg); z-index: 200; transform: translateX(-100%); transition: transform .3s ease; overflow-y: auto; display: flex; flex-direction: column; }
.mobile-nav.open { transform: translateX(0); }
.mobile-nav-header { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--border-light); }
.mobile-nav-header .logo-text { font-size: 1.2rem; }
.mobile-nav-close { font-size: 1.5rem; color: var(--ink); width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; }
.mobile-nav-links { padding: 8px 0; flex: 1; }
.mobile-nav-links > a { display: block; padding: 14px 20px; font-size: 1rem; font-weight: 500; color: var(--ink); border-bottom: 1px solid var(--border-light); transition: background var(--transition); }
.mobile-nav-links > a:hover { background: var(--bg-tint); color: var(--cta); }
.mobile-nav-child { padding-left: 40px !important; font-size: .9rem !important; font-weight: 400 !important; color: var(--muted) !important; }

/* ── Search overlay ───────────────────────────────────── */
.search-overlay { position: fixed; inset: 0; z-index: 300; background: rgba(0,0,0,.5); display: flex; align-items: flex-start; justify-content: center; padding-top: 120px; opacity: 0; visibility: hidden; transition: all var(--transition); }
.search-overlay.open { opacity: 1; visibility: visible; }
.search-box { background: var(--bg); border-radius: var(--radius); padding: 24px; width: min(600px, 90vw); box-shadow: var(--shadow-lg); }
.search-form { display: flex; align-items: center; gap: 8px; }
.search-form input { flex: 1; padding: 14px 20px; border: 2px solid var(--border); border-radius: var(--radius); font-size: 1.1rem; outline: none; transition: border-color var(--transition); }
.search-form input:focus { border-color: var(--cta); }
.search-form button { font-size: 1.2rem; padding: 8px; }
.search-close { color: var(--muted); }
.search-results { margin-top: 16px; max-height: 400px; overflow-y: auto; }
.search-results a { display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: var(--radius-sm); transition: background var(--transition); color: var(--ink); }
.search-results a:hover { background: var(--bg-tint); }
.search-results img { width: 48px; height: 48px; object-fit: cover; border-radius: var(--radius-sm); }
.search-result-info { flex: 1; }
.search-result-info strong { display: block; font-size: .9rem; color: var(--ink); }
.search-result-info span { font-size: .85rem; color: var(--muted); }

/* ── Cart overlay + drawer ────────────────────────────── */
.cart-overlay { position: fixed; inset: 0; z-index: 249; background: rgba(0,0,0,.5); opacity: 0; visibility: hidden; transition: all var(--transition); }
.cart-overlay.open { opacity: 1; visibility: visible; }
.cart-drawer { position: fixed; top: 0; right: 0; width: min(420px, 90vw); height: 100%; z-index: 250; background: var(--bg); box-shadow: -4px 0 24px rgba(0,0,0,.1); transform: translateX(100%); transition: transform .3s ease; display: flex; flex-direction: column; }
.cart-drawer.open { transform: translateX(0); }
.cart-header { display: flex; align-items: center; justify-content: space-between; padding: 20px; border-bottom: 1px solid var(--border-light); }
.cart-header h3 { font-family: var(--font-heading); margin: 0; }
.cart-close { font-size: 1.5rem; color: var(--ink); }
.cart-body { flex: 1; overflow-y: auto; padding: 16px 20px; }
.cart-items { display: flex; flex-direction: column; }
.cart-item { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border-light); }
.cart-item img { width: 64px; height: 64px; object-fit: cover; border-radius: var(--radius-sm); }
.cart-item-info { flex: 1; }
.cart-item-info strong { font-size: .9rem; }
.cart-item-price { color: var(--cta); font-weight: 600; }
.cart-item-qty { display: flex; align-items: center; gap: 8px; margin-top: 4px; }
.cart-item-qty button { width: 28px; height: 28px; border: 1px solid var(--border); border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: .9rem; }
.cart-item-remove { color: var(--danger); font-size: .8rem; cursor: pointer; margin-top: 4px; }
.cart-empty { text-align: center; padding: 40px 20px; color: var(--muted); }
.cart-empty-icon { font-size: 3rem; display: block; margin-bottom: 12px; }
.cart-footer { padding: 20px; border-top: 1px solid var(--border-light); }
.cart-promo { display: flex; gap: 8px; margin-bottom: 8px; }
.cart-promo input { flex: 1; padding: 8px 12px; border: 1px solid var(--border); border-radius: var(--radius-sm); font-size: .85rem; }
.cart-promo button { padding: 8px 14px; background: var(--bg-tint); border-radius: var(--radius-sm); font-weight: 600; font-size: .85rem; color: var(--cta); }
.cart-promo-msg { font-size: .8rem; margin-bottom: 8px; }
.cart-promo-msg.success { color: var(--success); }
.cart-promo-msg.error { color: var(--danger); }
.cart-totals { margin-bottom: 16px; }
.cart-total-row { display: flex; justify-content: space-between; font-size: 1.1rem; }
.cart-total-row strong { font-weight: 700; }
.cart-checkout-btn { width: 100%; }

/* ═══════════════════════════════════════════════════════════
   HERO
   ═══════════════════════════════════════════════════════════ */
.hero-main { position: relative; overflow: hidden; }
.hero-bg { min-height: 540px; background-size: cover; background-position: center; display: flex; align-items: center; position: relative; }
.hero-overlay { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(31,58,46,.78) 0%, rgba(31,58,46,.35) 50%, rgba(31,58,46,.78) 100%); }
.hero-content { position: relative; z-index: 1; text-align: center; padding: 80px 20px; max-width: 720px; margin: 0 auto; }
.hero-title { color: #fff; font-size: clamp(2.2rem, 6vw, 3.8rem); margin-bottom: 16px; text-shadow: 0 2px 8px rgba(0,0,0,.2); }
.hero-title span { color: var(--accent); }
.hero-subtitle { color: rgba(255,255,255,.85); font-size: clamp(1rem, 2.5vw, 1.25rem); max-width: 600px; margin: 0 auto 32px; }
.hero-ctas { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

/* ═══════════════════════════════════════════════════════════
   USPs
   ═══════════════════════════════════════════════════════════ */
.usps-icons { padding: 48px 0; border-bottom: 1px solid var(--border-light); }
.usps-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; }
.usp-card { display: flex; align-items: center; gap: 16px; padding: 20px; background: var(--bg); border-radius: var(--radius); }
.usp-icon { font-size: 2rem; width: 56px; height: 56px; display: flex; align-items: center; justify-content: center; background: var(--bg-tint); border-radius: var(--radius); flex-shrink: 0; }
.usp-text { display: flex; flex-direction: column; gap: 2px; }
.usp-text strong { font-size: .95rem; color: var(--ink); }
.usp-text span { font-size: .85rem; color: var(--muted); }

/* ═══════════════════════════════════════════════════════════
   CATEGORIES SLIDER
   ═══════════════════════════════════════════════════════════ */
.categories-slider { padding: 80px 0; }
.categories-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 20px; }
.category-tile { position: relative; border-radius: var(--radius); overflow: hidden; aspect-ratio: 3/4; display: flex; align-items: flex-end; }
.category-tile-image { position: absolute; inset: 0; }
.category-tile-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.category-tile:hover .category-tile-image img { transform: scale(1.05); }
.category-tile-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 30%, rgba(31,58,46,.85) 100%); }
.category-tile-name { position: relative; z-index: 1; color: #fff; font-family: var(--font-heading); font-size: 1.2rem; font-weight: 600; padding: 20px; }

/* ═══════════════════════════════════════════════════════════
   CATEGORY PAGE — sidebar filtres + grid (responsive)
   ═══════════════════════════════════════════════════════════ */
/* Sur la page catégorie, on déborde du container pour exploiter toute la largeur écran */
.category-page > .container { max-width: min(1800px, calc(100vw - 32px)); padding: 0 16px; }
.category-layout { display: grid; grid-template-columns: 240px 1fr; gap: 90px; align-items: start; margin-top: 20px; }

/* ─── Box filtres : redesign carte premium ─── */
.category-sidebar { background: #fff; border: 1px solid #e9e6df; border-radius: 14px; padding: 22px 20px; position: sticky; top: calc(var(--header-h) + 16px); max-height: calc(100vh - var(--header-h) - 32px); overflow-y: auto; box-shadow: 0 1px 3px rgba(31,58,46,.04), 0 4px 12px rgba(31,58,46,.03); }
.category-sidebar::-webkit-scrollbar { width: 6px; }
.category-sidebar::-webkit-scrollbar-thumb { background: #d8d3c8; border-radius: 3px; }
.filters-sidebar-header { display: flex; align-items: center; gap: 8px; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid #f0ede5; }
.filters-sidebar-header strong { font-size: 1.05rem; color: var(--ink); font-family: var(--font-heading); letter-spacing: .02em; flex: 1; }
.filters-clear-btn { background: none; border: none; color: var(--muted); cursor: pointer; font-size: .8rem; padding: 4px 8px; border-radius: 6px; transition: all .15s ease; }
.filters-clear-btn:hover { color: var(--cta); background: rgba(31,58,46,.05); }
.filters-mobile-close { display: none; background: none; border: none; cursor: pointer; font-size: 1.4rem; color: var(--muted); padding: 0 8px; }

.filter-group { margin-bottom: 20px; padding-bottom: 18px; border-bottom: 1px solid #f5f2eb; }
.filter-group:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.filter-group-title { font-size: 1rem; font-weight: 700; color: var(--ink); margin-bottom: 12px; }

.filter-option { display: flex; align-items: center; gap: 10px; padding: 7px 8px; margin: 0 -8px; cursor: pointer; font-size: .9rem; color: var(--ink); border-radius: 6px; transition: background .15s ease; }
.filter-option:hover { background: #f7f4ec; }
.filter-option input[type=checkbox] { appearance: none; -webkit-appearance: none; width: 17px; height: 17px; border: 1.5px solid #c9c3b3; border-radius: 4px; cursor: pointer; background: #fff; flex-shrink: 0; transition: all .15s ease; position: relative; }
.filter-option input[type=checkbox]:hover { border-color: var(--cta); }
.filter-option input[type=checkbox]:checked { background: var(--cta); border-color: var(--cta); }
.filter-option input[type=checkbox]:checked::after { content: '✓'; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; font-size: 12px; font-weight: 700; line-height: 1; }
.filter-option-label { flex: 1; font-weight: 500; }
.filter-option-count { color: var(--muted); font-size: .75rem; background: #f5f2eb; padding: 2px 8px; border-radius: 10px; font-variant-numeric: tabular-nums; }
.filter-option input[type=checkbox]:checked ~ .filter-option-label { color: var(--cta); font-weight: 600; }
.filters-mobile-btn { display: none; background: var(--bg); border: 1px solid var(--border-light); border-radius: 8px; padding: 8px 14px; font-size: .9rem; font-weight: 600; color: var(--ink); cursor: pointer; }
.filters-mobile-btn:hover { background: var(--bg-alt); }
.filters-mobile-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 999; }
.filters-mobile-overlay.open { display: block; }

@media (max-width: 880px) {
  .category-layout { grid-template-columns: 1fr; gap: 16px; }
  .category-sidebar { position: fixed; top: 0; left: -320px; width: 300px; height: 100vh; max-height: 100vh; z-index: 1000; transition: left .3s ease; border-radius: 0; padding: 18px 16px; }
  .category-sidebar.open { left: 0; }
  .filters-mobile-btn { display: inline-block; }
  .filters-mobile-close { display: block; }
}

/* ═══════════════════════════════════════════════════════════
   PRODUCT CARDS (shared)
   ═══════════════════════════════════════════════════════════ */
.product-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--border-light); border-radius: var(--radius); overflow: hidden; transition: all var(--transition); color: var(--ink); }
.product-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.1); transform: translateY(-4px); border-color: var(--cta); color: var(--ink); }
.product-card-image { position: relative; aspect-ratio: 1; overflow: hidden; background: #fff; padding: 18px; }
.product-card-image img { width: 100%; height: 100%; object-fit: contain; padding: 0; transition: transform .4s ease; }
.product-card:hover .product-card-image img { transform: scale(1.03); }
.product-card-placeholder { display: flex; align-items: center; justify-content: center; height: 100%; font-size: 2rem; color: var(--muted); }
.product-card-badges { position: absolute; top: 8px; left: 8px; display: flex; flex-direction: column; gap: 4px; z-index: 2; }
.badge { display: inline-block; padding: 4px 10px; border-radius: 20px; font-size: .75rem; font-weight: 700; color: #fff; background: var(--cta); }
.badge-new { background: var(--cta); }
.badge-promo { background: var(--danger); }
.badge-best { background: var(--stars); }
.product-card-compare { position: absolute; top: 8px; right: 8px; width: 32px; height: 32px; background: rgba(255,255,255,.9); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: .85rem; opacity: 0; transition: opacity var(--transition); z-index: 2; }
.product-card:hover .product-card-compare { opacity: 1; }
/* Petit rond indicateur de variantes (ns rule 2026-05-30) */
.product-card-variants-dot { position: absolute; left: 50%; bottom: 8px; transform: translateX(-50%); width: 9px; height: 9px; border-radius: 50%; background: var(--cta, #6b8e23); box-shadow: 0 0 0 3px rgba(255,255,255,.85); z-index: 2; pointer-events: none; }
/* Color swatches — Amazon-style row sous l'image (ns 2026-06-07) */
.product-card-swatches { display: flex; align-items: center; gap: 6px; margin: 0 0 6px; min-height: 18px; flex-wrap: wrap; }
.product-card-swatches .swatch { width: 18px; height: 18px; border-radius: 50%; border: 1px solid rgba(0,0,0,.18); cursor: pointer; transition: transform .12s ease, box-shadow .12s ease; display: inline-block; flex: 0 0 auto; }
.product-card-swatches .swatch:hover, .product-card-swatches .swatch:focus, .product-card-swatches .swatch.is-hover { transform: scale(1.15); outline: none; box-shadow: 0 0 0 2px var(--cta, #6b8e23); }
.product-card-swatches .swatch.is-active { box-shadow: 0 0 0 2px #111; }
.product-card-swatches .swatch.is-viewonly { cursor: default; opacity: 0.7; }
.product-card-swatches .swatch.is-viewonly:hover { transform: none; box-shadow: 0 0 0 2px rgba(0,0,0,0.3); }
.product-card-swatches .swatch-more { font-size: 0.75rem; color: #6b7280; padding-left: 2px; font-weight: 500; }
/* Hide green dot when swatches visible (redondant) */
.product-card:has(.product-card-swatches) .product-card-variants-dot { display: none; }
.product-card-body { padding: 16px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.product-card-title { font-family: var(--font-heading); font-size: 1rem; font-weight: 600; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.35; min-height: calc(1rem * 1.35 * 2); }
.product-card-price-row { display: flex; align-items: baseline; gap: 10px; margin-top: auto; }
.product-card-price-row .price-current { font-weight: 700; color: var(--ink); font-size: 1.05rem; }
.product-card-price-row .price-original { text-decoration: line-through; color: var(--muted); font-size: .9rem; }
.price-original { text-decoration: line-through; color: var(--muted); font-size: .85rem; }
.price-current { font-weight: 700; color: var(--primary); font-size: 1.1rem; }
.product-card-add { margin-top: auto; }
.product-card-sm .product-card-image { aspect-ratio: 1/1; }
.product-card-sm .product-card-body { padding: 12px; }

/* ═══════════════════════════════════════════════════════════
   BESTSELLERS
   ═══════════════════════════════════════════════════════════ */
.bestsellers { padding: 80px 0; background: var(--bg-alt); }
.bestsellers-scroll { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 24px; }

/* ═══════════════════════════════════════════════════════════
   CATEGORY SLIDERS
   ═══════════════════════════════════════════════════════════ */
.category-sliders { padding: 80px 0; }
.cat-slider-block { margin-bottom: 48px; }
.cat-slider-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.cat-slider-header h3 { font-family: var(--font-heading); }
.cat-slider-all { font-weight: 600; color: var(--cta); }
.cat-slider-row { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 20px; }
.cat-slider-empty { color: var(--muted); font-style: italic; }

/* ═══════════════════════════════════════════════════════════
   COUNTDOWN PROMO
   ═══════════════════════════════════════════════════════════ */
.countdown-promo { position: relative; background-size: cover; background-position: center; padding: 80px 0; text-align: center; color: #fff; }
.countdown-overlay { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(31,58,46,.88), rgba(122,158,92,.55)); }
.countdown-content { position: relative; z-index: 1; }
.countdown-title { color: #fff; margin-bottom: 12px; }
.countdown-subtitle { color: rgba(255,255,255,.85); margin-bottom: 32px; }
.countdown-timer { display: flex; justify-content: center; gap: 8px; margin-bottom: 32px; }
.countdown-unit { display: flex; flex-direction: column; align-items: center; background: rgba(255,255,255,.1); backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,.15); border-radius: var(--radius); padding: 16px 20px; min-width: 70px; }
.countdown-num { font-family: var(--font-heading); font-size: 2rem; font-weight: 700; color: var(--accent); }
.countdown-label { font-size: .75rem; text-transform: uppercase; letter-spacing: 1px; opacity: .8; }
.countdown-sep { font-size: 2rem; font-weight: 700; display: flex; align-items: center; }

/* ═══════════════════════════════════════════════════════════
   COMPARATOR EXPRESS
   ═══════════════════════════════════════════════════════════ */
.comparator-express { padding: 80px 0; background: var(--bg-alt); }
.comparator-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.comparator-table { width: 100%; border-collapse: collapse; background: var(--bg); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); }
.comparator-table th, .comparator-table td { padding: 14px 16px; text-align: center; border-bottom: 1px solid var(--border-light); font-size: .9rem; }
.comparator-table th { background: var(--primary); color: #fff; font-weight: 600; }
.comparator-table th span { display: block; margin-top: 8px; font-size: .85rem; }
.comparator-img { width: 80px; height: 80px; object-fit: cover; border-radius: var(--radius-sm); margin: 0 auto 8px; }
.comparator-label { text-align: left; font-weight: 600; background: var(--bg-alt); }
.comparator-prix { font-weight: 700; color: var(--cta); }
.comparator-mobile { display: none; }
/* Mobile comparator cards */
.comparator-cards { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; gap: 16px; padding-bottom: 12px; }
.comparator-cards::-webkit-scrollbar { height: 4px; }
.comparator-cards::-webkit-scrollbar-thumb { background: var(--cta); border-radius: 4px; }
.comparator-cards::-webkit-scrollbar-track { background: var(--border-light); }
.comparator-card { flex: 0 0 75%; scroll-snap-align: start; background: var(--bg); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; display: flex; flex-direction: column; }
.comparator-card-img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.comparator-card-name { font-family: var(--font-heading); font-size: 1rem; font-weight: 600; padding: 16px 16px 0; }
.comparator-card-price { font-size: 1.3rem; font-weight: 700; color: var(--cta); padding: 4px 16px 12px; }
.comparator-card-specs { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--border-light); }
.comparator-card-specs li { display: flex; justify-content: space-between; padding: 10px 16px; border-bottom: 1px solid var(--border-light); font-size: .9rem; }
.comparator-card-specs .spec-label { font-weight: 600; color: var(--muted); }
.comparator-card-specs .spec-value { font-weight: 500; }
.comparator-card-cta { margin: 16px; text-align: center; }

/* ═══════════════════════════════════════════════════════════
   BUYING QUIZ
   ═══════════════════════════════════════════════════════════ */
.buying-quiz { padding: 80px 0; }
.quiz-container { max-width: 640px; margin: 0 auto; }
.quiz-progress { height: 6px; background: var(--border-light); border-radius: 3px; margin-bottom: 24px; }
.quiz-progress-bar { height: 100%; background: var(--cta); border-radius: 3px; transition: width .4s ease; }
.quiz-question { font-family: var(--font-heading); font-size: 1.3rem; text-align: center; margin-bottom: 24px; }
.quiz-q-icon { margin-right: 8px; }
.quiz-options { display: grid; gap: 12px; }
.quiz-option { padding: 16px 20px; border: 2px solid var(--border); border-radius: var(--radius); font-size: 1rem; font-weight: 500; text-align: center; transition: all var(--transition); }
.quiz-option:hover { border-color: var(--cta); background: var(--bg-tint); }
.quiz-result { text-align: center; }
.quiz-result-card { background: var(--bg-tint); border-radius: var(--radius); padding: 32px; margin-bottom: 16px; }
.quiz-result-card h3 { font-family: var(--font-heading); margin-bottom: 12px; }
.quiz-restart { margin-top: 16px; }

/* ═══════════════════════════════════════════════════════════
   TESTIMONIALS
   ═══════════════════════════════════════════════════════════ */
.testimonials { padding: 80px 0; background: var(--primary); color: #fff; }
.testimonials .section-title { color: #fff; }
.testimonials .section-title::after { background: var(--accent); }
.testimonials .section-subtitle { color: rgba(255,255,255,.6); }
.testimonials-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 24px; }
.testimonial-card { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); border-radius: var(--radius); padding: 28px; display: flex; flex-direction: column; }
.testimonial-stars { color: var(--stars); font-size: 1.1rem; margin-bottom: 12px; letter-spacing: 2px; }
.testimonial-text { font-style: italic; color: rgba(255,255,255,.75); margin-bottom: 16px; line-height: 1.7; flex: 1 0 auto; }
.testimonial-author { display: flex; align-items: center; gap: 12px; margin-top: auto; }
.testimonial-avatar { width: 40px; height: 40px; border-radius: 50%; background: var(--cta); display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 700; font-size: .9rem; flex-shrink: 0; }
.testimonial-name { color: #fff; font-weight: 600; }
.testimonial-loc { display: block; font-size: .8rem; color: rgba(255,255,255,.5); }
.testimonial-product { margin-top: 12px; font-size: .85rem; color: rgba(255,255,255,.5); }

/* ═══════════════════════════════════════════════════════════
   REASSURANCE
   ═══════════════════════════════════════════════════════════ */
.reassurance { padding: 60px 0; background: var(--bg-alt); }
.reassurance-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 24px; text-align: center; }
.reassurance-item { padding: 24px; background: var(--bg); border-radius: var(--radius); box-shadow: var(--shadow); }
.reassurance-icon { font-size: 2.5rem; display: block; margin-bottom: 12px; }
.reassurance-item strong { display: block; margin-bottom: 4px; }
.reassurance-item p { font-size: .85rem; color: var(--muted); }

/* ═══════════════════════════════════════════════════════════
   FAQ HOME
   ═══════════════════════════════════════════════════════════ */
.faq-home { padding: 80px 0; }
.faq-list { max-width: 800px; margin: 0 auto; }
.faq-item { border-bottom: 1px solid var(--border-light); }
.faq-question { padding: 18px 0; font-weight: 600; cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.faq-question::-webkit-details-marker { display: none; }
.faq-question::after {
  content: '';
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background-color: var(--primary, #222);
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  transition: transform .25s ease;
}
.faq-item[open] .faq-question::after { transform: rotate(-180deg); }
.faq-answer { padding: 0 0 18px; color: var(--muted); line-height: 1.7; }

/* ═══════════════════════════════════════════════════════════
   BLOG LATEST
   ═══════════════════════════════════════════════════════════ */
.blog-latest { padding: 80px 0; background: var(--bg-alt); }
.blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 24px; }
.blog-card { border-radius: var(--radius); overflow: hidden; border: 1px solid var(--border-light); background: var(--bg); transition: all var(--transition); }
.blog-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-2px); }
.blog-card img { width: 100%; height: 200px; object-fit: cover; }
.blog-card-body { padding: 20px; }
.blog-card-body h3 { font-size: 1.1rem; margin-bottom: 8px; }
.blog-card-body p { font-size: .9rem; color: var(--muted); }

/* ═══════════════════════════════════════════════════════════
   NEWSLETTER
   ═══════════════════════════════════════════════════════════ */
.newsletter-signup { padding: 80px 0; background: var(--primary); color: #fff; }
.newsletter-box { max-width: 600px; margin: 0 auto; text-align: center; }
.newsletter-box h2 { color: #fff; margin-bottom: 8px; }
.newsletter-box p { color: rgba(255,255,255,.7); margin-bottom: 8px; }
.newsletter-incentive { font-weight: 700; font-size: 1.1rem; color: var(--accent); margin-bottom: 24px; }
.newsletter-form { display: flex; gap: 12px; }
.newsletter-form input { flex: 1; padding: 14px 20px; border: none; border-radius: var(--radius); font-size: 1rem; }
.newsletter-form .btn { flex-shrink: 0; background: var(--cta); color: #fff; font-weight: 700; }
.newsletter-form .btn:hover { background: var(--cta-hover); }
.newsletter-msg { margin-top: 12px; font-size: .9rem; }
.newsletter-msg.success { color: #A7F3D0; }
.newsletter-msg.error { color: #FCA5A5; }

/* ═══════════════════════════════════════════════════════════
   CUSTOM: SPA FINDER
   ═══════════════════════════════════════════════════════════ */
.spa-finder { padding: 80px 0; background: var(--bg-alt); }
.finder-wizard { max-width: 700px; margin: 0 auto; }
.finder-progress { height: 6px; background: var(--border-light); border-radius: 3px; margin-bottom: 24px; }
.finder-progress-bar { height: 100%; background: var(--cta); border-radius: 3px; transition: width .4s ease; }
.finder-step { background: var(--bg); border-radius: var(--radius); padding: 32px; box-shadow: var(--shadow); }
.finder-step-title { font-family: var(--font-heading); display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.finder-step-num { width: 36px; height: 36px; background: var(--cta); color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: .9rem; font-weight: 700; font-family: var(--font-body); }
.finder-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; }
.finder-opt { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 20px 16px; border: 2px solid var(--border); border-radius: var(--radius); transition: all var(--transition); }
.finder-opt:hover { border-color: var(--cta); background: var(--bg-tint); transform: translateY(-2px); }
.finder-opt-icon { font-size: 2rem; }
.finder-results { text-align: center; }
.finder-results h3 { font-family: var(--font-heading); margin-bottom: 24px; }
.finder-products { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 20px; margin-bottom: 24px; }
.finder-why { font-size: .85rem; color: var(--muted); margin-top: 4px; }

/* ═══════════════════════════════════════════════════════════
   CUSTOM: MATERIAL GUIDE
   ═══════════════════════════════════════════════════════════ */
.material-guide { padding: 80px 0; }
.material-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; margin-top: 32px; }
.material-card { background: var(--bg); border: 1px solid var(--border-light); border-radius: var(--radius); overflow: hidden; transition: all var(--transition); display: flex; flex-direction: column; }
.material-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-4px); border-color: var(--cta); }
.material-card-banner { padding: 28px 20px; text-align: center; color: #fff; }
.material-card-icon { font-size: 2.6rem; display: block; margin-bottom: 8px; }
.material-card-name { font-family: var(--font-heading); font-size: 1.25rem; font-weight: 700; margin: 0; }
.material-card-body { padding: 20px; flex: 1; display: flex; flex-direction: column; gap: 14px; }
.material-card-tagline { font-style: italic; color: var(--muted); font-size: .9rem; line-height: 1.5; }
.material-rating-row { display: flex; align-items: center; justify-content: space-between; font-size: .85rem; }
.material-rating-row strong { color: var(--ink); }
.material-rating-bar { display: inline-flex; gap: 3px; }
.material-rating-bar span { width: 12px; height: 12px; border-radius: 2px; background: var(--border); }
.material-rating-bar span.filled { background: var(--cta); }
.material-pros, .material-cons { font-size: .85rem; line-height: 1.55; }
.material-pros li, .material-cons li { padding-left: 22px; position: relative; margin-bottom: 4px; }
.material-pros li::before { content: '✓'; position: absolute; left: 0; color: var(--success); font-weight: 700; }
.material-cons li::before { content: '–'; position: absolute; left: 0; color: var(--muted); font-weight: 700; }
.material-card-foot { padding: 16px 20px; background: var(--bg-alt); border-top: 1px solid var(--border-light); display: flex; justify-content: space-between; align-items: center; }
.material-card-foot small { color: var(--muted); font-size: .8rem; }
.material-card-foot strong { color: var(--primary); font-size: 1.1rem; font-family: var(--font-heading); }
.material-tip { margin-top: 32px; background: var(--bg-tint); border-left: 4px solid var(--cta); border-radius: var(--radius-sm); padding: 16px 20px; font-size: .9rem; color: var(--ink); }

/* ═══════════════════════════════════════════════════════════
   CUSTOM: INSTALLATION PLANNER
   ═══════════════════════════════════════════════════════════ */
.installation-planner { padding: 80px 0; background: var(--bg-alt); }
.planner-layout { display: grid; grid-template-columns: 1.2fr .8fr; gap: 40px; }
.planner-progress-header { display: flex; justify-content: space-between; margin-bottom: 8px; font-size: .9rem; }
.planner-bar { height: 8px; background: var(--border-light); border-radius: 4px; margin-bottom: 24px; }
.planner-bar-fill { height: 100%; background: var(--cta); border-radius: 4px; transition: width .4s ease; }
.planner-check { display: flex; gap: 12px; padding: 16px; background: var(--bg); border-radius: var(--radius); margin-bottom: 8px; cursor: pointer; transition: all var(--transition); border: 1px solid transparent; align-items: flex-start; }
.planner-check:hover { border-color: var(--border); }
.planner-check.checked { border-color: var(--cta); background: var(--bg-tint); }
.planner-check input { margin-top: 4px; accent-color: var(--cta); width: 18px; height: 18px; flex-shrink: 0; }
.planner-check-icon { font-size: 1.5rem; flex-shrink: 0; }
.planner-check strong { display: block; margin-bottom: 2px; }
.planner-check p { font-size: .85rem; color: var(--muted); margin: 0; }
.planner-tips { background: var(--bg); border-radius: var(--radius); padding: 28px; box-shadow: var(--shadow); position: sticky; top: calc(var(--header-h) + 20px); }
.planner-tips h3 { margin-bottom: 16px; }
.planner-tips-list { display: flex; flex-direction: column; gap: 10px; }
.planner-tips-list li { padding-left: 20px; position: relative; font-size: .9rem; color: var(--muted); }
.planner-tips-list li::before { content: '→'; position: absolute; left: 0; color: var(--cta); }
.planner-tips .btn { margin-top: 20px; width: 100%; }

/* ═══════════════════════════════════════════════════════════
   CUSTOM: SEASONAL RITUALS
   ═══════════════════════════════════════════════════════════ */
.seasonal-rituals { padding: 80px 0; }
.seasons-nav { display: flex; justify-content: center; gap: 8px; margin-bottom: 32px; flex-wrap: wrap; }
.season-tab { padding: 12px 24px; border-radius: var(--radius); border: 2px solid var(--border); font-weight: 600; display: flex; align-items: center; gap: 8px; transition: all var(--transition); }
.season-tab:hover { border-color: var(--season-color, var(--cta)); }
.season-tab.active { background: var(--season-color, var(--cta)); color: #fff; border-color: var(--season-color, var(--cta)); }
.season-icon { font-size: 1.3rem; }
.season-content { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; }
.season-info h3 { margin-bottom: 12px; }
.season-meta { display: flex; gap: 16px; margin-bottom: 16px; font-weight: 600; color: var(--cta); }
.season-ritual { color: var(--muted); line-height: 1.7; margin-bottom: 16px; }
.season-products-tip { background: var(--bg-tint); padding: 12px 16px; border-radius: var(--radius-sm); font-size: .9rem; }
.season-image { border-radius: var(--radius); overflow: hidden; }
.season-image img { width: 100%; height: 350px; object-fit: cover; }

/* ═══════════════════════════════════════════════════════════
   BREADCRUMB
   ═══════════════════════════════════════════════════════════ */
.breadcrumb { padding: 16px 0; font-size: .85rem; color: var(--muted); }
.breadcrumb a { color: var(--muted); }
.breadcrumb a:hover { color: var(--cta); }
.breadcrumb span { margin: 0 6px; }
.breadcrumb .current { color: var(--ink); }

/* ═══════════════════════════════════════════════════════════
   CATEGORY PAGE
   ═══════════════════════════════════════════════════════════ */
.category-page { padding: 40px 0 80px; }
.category-header { margin-bottom: 32px; }
.category-header h1 { margin-bottom: 8px; }
.category-desc { color: var(--muted); max-width: 700px; }
.subcategory-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 24px; }
.chip { padding: 8px 18px; border: 1px solid var(--border); border-radius: 50px; font-size: .85rem; font-weight: 500; color: var(--ink); transition: all var(--transition); }
.chip:hover { border-color: var(--cta); background: var(--bg-tint); color: var(--cta); }
.category-toolbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; flex-wrap: wrap; gap: 12px; }
.category-count { color: var(--muted); font-size: .9rem; }
.category-filters { display: flex; gap: 8px; }
.category-filters select { padding: 8px 14px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg); color: var(--ink); cursor: pointer; }
.product-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
@media (max-width: 1100px) { .product-grid { grid-template-columns: repeat(3, 1fr); gap: 20px; } }
@media (max-width: 800px)  { .product-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; } }
@media (max-width: 480px)  { .product-grid { grid-template-columns: repeat(2, 1fr); } }
.category-empty { text-align: center; padding: 60px 20px; color: var(--muted); }
.category-empty .btn { margin-top: 16px; }

/* Pagination */
.pagination { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 48px; }
.pagination-btn { padding: 10px 20px; border: 1px solid var(--border); border-radius: var(--radius); font-weight: 600; transition: all var(--transition); color: var(--ink); }
.pagination-btn:hover { border-color: var(--cta); color: var(--cta); }
.pagination-info { color: var(--muted); font-size: .9rem; }

/* ═══════════════════════════════════════════════════════════
   PRODUCT PAGE
   ═══════════════════════════════════════════════════════════ */
.product-page { padding: 40px 0 80px; }
.product-top { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: clamp(32px, 4vw, 56px); margin-bottom: 64px; align-items: start; }
.product-gallery { position: sticky; top: calc(var(--header-h) + 20px); }
.product-main-image { position: relative; border-radius: var(--radius); overflow: hidden; background: #fff; margin-bottom: 12px; }
.gallery-swiper { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.gallery-swiper::-webkit-scrollbar { display: none; }
.gallery-slide { flex: 0 0 100%; scroll-snap-align: start; aspect-ratio: 1; }
.gallery-slide img { width: 100%; height: 100%; object-fit: contain; padding: 8px; }
.gallery-counter { position: absolute; bottom: 12px; right: 12px; background: rgba(0,0,0,.55); color: #fff; padding: 4px 12px; border-radius: 20px; font-size: .85rem; font-weight: 600; pointer-events: none; }
.product-thumbnails { display: flex; gap: 8px; overflow-x: auto; }
.product-thumb { width: 72px; height: 72px; border-radius: var(--radius-sm); overflow: hidden; border: 2px solid transparent; cursor: pointer; transition: border-color var(--transition); flex-shrink: 0; }
.product-thumb.active, .product-thumb:hover { border-color: var(--cta); }
.product-thumb img { width: 100%; height: 100%; object-fit: cover; }
.product-info { display: flex; flex-direction: column; gap: 16px; }
.product-title { font-size: clamp(1.4rem, 3.5vw, 1.9rem); line-height: 1.3; margin: 0; }
.product-name { margin-bottom: 0; }
.product-badges { display: flex; gap: 6px; flex-wrap: wrap; }
.product-price-block { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.product-price { font-size: clamp(1.6rem, 4vw, 2rem); font-weight: 700; color: var(--primary); font-family: var(--font-heading); }
.product-price-original { font-size: 1rem; text-decoration: line-through; color: var(--muted); }
.product-discount { background: var(--danger); color: #fff; padding: 3px 10px; border-radius: 20px; font-size: .78rem; font-weight: 700; }
.product-installment { font-size: .9rem; color: var(--muted); }
.product-highlights { display: flex; flex-direction: column; gap: 6px; }
.product-highlights li { display: flex; align-items: center; gap: 8px; font-size: .9rem; }
.product-highlights li::before { content: '✓'; color: var(--cta); font-weight: 700; }
.product-variants { display: flex; flex-direction: column; gap: 12px; }
.variant-group label { display: block; font-weight: 600; margin-bottom: 6px; font-size: .9rem; }
.variant-group select { width: 100%; padding: 10px 14px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg); }
.product-actions { display: flex; flex-direction: column; gap: 10px; }
.product-actions-row { display: flex; gap: 10px; align-items: center; }
.product-actions-row .quantity-selector { flex-shrink: 0; }
.product-actions-row .product-add-cart { flex: 1; }
.quantity-selector { display: flex; align-items: center; border: 1px solid var(--border); border-radius: 999px; overflow: hidden; background: var(--bg-alt); }
.quantity-selector .qty-btn { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; background: none; border: none; cursor: pointer; color: var(--ink); }
.quantity-selector input { width: 40px; height: 44px; text-align: center; border: none; font-weight: 600; font-size: 1rem; background: transparent; -moz-appearance: textfield; }
.quantity-selector input::-webkit-outer-spin-button,
.quantity-selector input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.product-add-cart { width: 100%; border-radius: 999px; background: var(--primary); color: #fff; font-size: 1rem; font-weight: 600; padding: 14px 24px; text-align: center; }
.product-add-cart:hover { background: #274a3a; }
.product-buy-now { width: 100%; border-radius: 999px; background: transparent; color: var(--primary); font-size: 1rem; font-weight: 600; padding: 14px 24px; text-align: center; border: 2px solid var(--primary); transition: all var(--transition); }
.product-buy-now:hover { background: var(--primary); color: #fff; }
.qty-control { display: flex; align-items: center; border: 1px solid var(--border); border-radius: var(--radius-sm); }
.qty-control button { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; }
.qty-control input { width: 48px; height: 40px; text-align: center; border: none; border-left: 1px solid var(--border); border-right: 1px solid var(--border); font-weight: 600; }
.product-actions .btn { min-width: 0; }
.btn-buy { background: var(--primary); color: #fff; border-radius: 999px; }
.btn-buy:hover { background: #274a3a; }
.product-stock { display: flex; align-items: center; gap: 8px; font-size: 1.1rem; }
.stock-ok { color: var(--success); font-weight: 600; }
.stock-low { color: var(--danger); font-weight: 600; }
.stock-out { color: var(--muted); }
.product-reassurance { display: flex; flex-direction: column; gap: 0; border: 1px solid var(--border-light); border-radius: var(--radius); overflow: hidden; background: #fff; }
.product-reassurance .reassurance-item { display: flex; align-items: center; gap: 12px; padding: 14px 18px; font-size: 1rem; font-weight: 600; color: var(--ink); border-bottom: 1px solid var(--border-light); white-space: normal; overflow: visible; box-shadow: none; background: transparent; border-radius: 0; }
.product-reassurance .reassurance-item:last-child { border-bottom: none; }
.product-reassurance .reassurance-icon { font-size: 1.6rem; flex-shrink: 0; margin: 0; }
.delivery-countdown { font-size: .85rem; color: var(--muted); }
.product-description { margin-bottom: 48px; }
.product-description h2 { margin-bottom: 16px; }
.product-description .rich-content { color: var(--muted); line-height: 1.8; }
.product-features { margin-bottom: 48px; }
.feature-row { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; padding: 40px 0; }
.feature-row:nth-child(even) { direction: rtl; }
.feature-row:nth-child(even) > * { direction: ltr; }
.feature-row-text h3 { margin-bottom: 8px; }
.feature-row-text p { color: var(--muted); }
.feature-row-image { border-radius: var(--radius); overflow: hidden; }
.feature-row-image img { width: 100%; height: 250px; object-fit: cover; }
.product-aplus { margin-bottom: 48px; }
.aplus-gallery { display: flex; flex-direction: column; gap: 0; }
.aplus-image { max-width: 100%; width: auto; height: auto; display: block; border-radius: var(--radius); margin: 0 auto 16px; image-rendering: -webkit-optimize-contrast; }
.product-specs { margin-bottom: 48px; }
.specs-table { width: 100%; border-collapse: collapse; }
.specs-table tr:nth-child(odd) { background: var(--bg-alt); }
.specs-table th, .specs-table td { padding: 12px 16px; text-align: left; font-size: .9rem; }
.specs-table th { font-weight: 600; width: 40%; }
.product-guarantees { margin-bottom: 48px; }
.guarantee-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; }
.guarantee-card { text-align: center; padding: 20px; background: var(--bg-alt); border-radius: var(--radius); }
.guarantee-card .icon { font-size: 2rem; margin-bottom: 8px; }
.guarantee-card strong { display: block; margin-bottom: 4px; }
.guarantee-card p { font-size: .8rem; color: var(--muted); margin: 0; }
.product-faq { margin-bottom: 48px; }
.product-related { margin-bottom: 48px; }
.related-grid { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; gap: 20px; padding-bottom: 12px; }
.related-grid::-webkit-scrollbar { height: 4px; }
.related-grid::-webkit-scrollbar-thumb { background: var(--cta); border-radius: 4px; }
.related-grid::-webkit-scrollbar-track { background: var(--border-light); }
.related-grid > * { flex: 0 0 240px; scroll-snap-align: start; }
.recently-viewed { margin-bottom: 48px; }
.recently-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 16px; }
.mobile-sticky-bar { display: none; position: fixed; bottom: 0; left: 0; right: 0; z-index: 90; background: var(--bg); border-top: 1px solid var(--border-light); padding: 12px 20px; box-shadow: 0 -2px 12px rgba(0,0,0,.08); }
.mobile-sticky-inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.mobile-sticky-price { font-weight: 700; color: var(--primary); font-size: 1.1rem; }
.mobile-sticky-bar .btn { flex: 1; }

/* ═══════════════════════════════════════════════════════════
   STATIC PAGE
   ═══════════════════════════════════════════════════════════ */
.static-page { padding: 40px 0 80px; }
.static-page h1 { margin: 24px 0; }
.rich-content { max-width: 800px; color: var(--muted); line-height: 1.8; }
.rich-content h2, .rich-content h3 { color: var(--ink); margin: 24px 0 12px; }
.rich-content p { margin-bottom: 16px; }
.rich-content ul, .rich-content ol { margin: 16px 0; padding-left: 24px; }
.rich-content li { margin-bottom: 8px; list-style: disc; }
.rich-content a { color: var(--cta); text-decoration: underline; }

/* ═══════════════════════════════════════════════════════════
   COMPARE BAR
   ═══════════════════════════════════════════════════════════ */
.compare-bar { position: fixed; bottom: 0; left: 0; right: 0; z-index: 80; background: var(--bg); border-top: 2px solid var(--cta); padding: 16px 20px; transform: translateY(100%); transition: transform .3s ease; box-shadow: 0 -4px 24px rgba(0,0,0,.1); }
.compare-bar.visible { transform: translateY(0); }
.compare-bar-inner { display: flex; align-items: center; justify-content: space-between; max-width: var(--container); margin: 0 auto; }
.compare-items { display: flex; gap: 8px; }
.compare-chip { display: flex; align-items: center; gap: 6px; padding: 6px 12px; background: var(--bg-tint); border-radius: 20px; font-size: .85rem; }
.compare-chip button { font-size: .8rem; color: var(--danger); }

/* ═══════════════════════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════════════════════ */
.site-footer { background: var(--primary); color: rgba(255,255,255,.8); padding: 60px 0 0; margin-top: 80px; }
.footer-grid { display: grid; grid-template-columns: 1.2fr repeat(3, 1fr); gap: 40px; }
.footer-brand { max-width: 280px; }
.footer-brand h4 { font-family: var(--font-heading); font-size: 1.4rem; color: #fff; font-weight: 800; margin-bottom: 12px; }
.footer-baseline { font-size: .9rem; line-height: 1.6; color: rgba(255,255,255,.6); }
.footer-col h4 { color: #fff; font-family: var(--font-heading); margin-bottom: 16px; font-size: 1.05rem; }
.footer-col ul { display: flex; flex-direction: column; }
.footer-col a { display: block; padding: 4px 0; font-size: .9rem; color: rgba(255,255,255,.6); transition: color var(--transition); }
.footer-col a:hover { color: #fff; }
.footer-socials { display: flex; gap: 12px; margin-top: 16px; }
.footer-social-link { width: 36px; height: 36px; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: .9rem; transition: all var(--transition); color: rgba(255,255,255,.7); }
.footer-social-link:hover { border-color: var(--accent); background: rgba(255,255,255,.1); color: #fff; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.1); margin-top: 40px; padding: 20px 0; text-align: center; font-size: .8rem; color: rgba(255,255,255,.5); }
.footer-bottom a, .footer-cookies button { color: rgba(255,255,255,.5); background: none; border: none; cursor: pointer; font-size: .8rem; }
.footer-cookies button:hover { color: #fff; text-decoration: underline; }

/* ═══════════════════════════════════════════════════════════
   ANIMATIONS
   ═══════════════════════════════════════════════════════════ */
.fade-in { opacity: 0; transform: translateY(24px); transition: opacity .6s ease, transform .6s ease; }
.fade-in.visible { opacity: 1; transform: translateY(0); }

/* ═══════════════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 1024px) {
  .product-top { grid-template-columns: 1fr; gap: 32px; }
  .product-gallery { position: static; }
  .feature-row { grid-template-columns: 1fr; gap: 16px; }
  .feature-row:nth-child(even) { direction: ltr; }
  .temp-visual { grid-template-columns: 1fr; }
  .planner-layout { grid-template-columns: 1fr; }
  .season-content { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 768px) {
  :root { --header-h: 60px; }
  .nav-desktop { display: none; }
  .burger-btn { display: flex; }
  /* Header mobile : burger gauche | logo centre | actions droite (ns rule 2026-05-31) */
  .header-inner { display: grid !important; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; }
  .burger-btn-left { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; grid-column: 1; justify-self: start; }
  .burger-btn-left .burger-line { display: block; width: 22px; height: 2px; background: #111; margin: 2px 0; border-radius: 2px; }
  .logo { grid-column: 2; justify-self: center; }
  .logo img { max-height: 36px; width: auto; }
  .header-actions { grid-column: 3; justify-self: end; gap: 4px; }
  .header-actions .burger-btn { display: none !important; }
  .hero-bg { min-height: 400px; }
  .hero-ctas { flex-direction: column; align-items: center; }
  .categories-grid, .bestsellers-scroll, .cat-slider-row, .recently-viewed .product-grid {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 16px;
    padding-bottom: 12px;
    scroll-padding: 0 16px;
  }
  .categories-grid::-webkit-scrollbar, .bestsellers-scroll::-webkit-scrollbar, .cat-slider-row::-webkit-scrollbar, .recently-viewed .product-grid::-webkit-scrollbar {
    height: 4px;
  }
  .categories-grid::-webkit-scrollbar-thumb, .bestsellers-scroll::-webkit-scrollbar-thumb, .cat-slider-row::-webkit-scrollbar-thumb, .recently-viewed .product-grid::-webkit-scrollbar-thumb {
    background: var(--cta); border-radius: 4px;
  }
  .categories-grid::-webkit-scrollbar-track, .bestsellers-scroll::-webkit-scrollbar-track, .cat-slider-row::-webkit-scrollbar-track, .recently-viewed .product-grid::-webkit-scrollbar-track {
    background: var(--border-light);
  }
  .categories-grid > * {
    flex: 0 0 45%;
    scroll-snap-align: start;
  }
  .bestsellers-scroll > * {
    flex: 0 0 55%;
    scroll-snap-align: start;
  }
  .cat-slider-row > * {
    flex: 0 0 55%;
    scroll-snap-align: start;
  }
  .recently-viewed .product-grid > * {
    flex: 0 0 55%;
    scroll-snap-align: start;
  }
  .product-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }

  .category-page { padding-bottom: 100px; }
  .product-page { padding-bottom: 20px; }
  .countdown-timer { gap: 4px; }
  .countdown-unit { padding: 12px 14px; min-width: 56px; }
  .countdown-num { font-size: 1.5rem; }
  .newsletter-form { flex-direction: column; }
  .footer-grid { grid-template-columns: 1fr; gap: 24px; }
  .reassurance .reassurance-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 12px; }
  .reassurance .reassurance-grid .reassurance-item { padding: 16px 12px; white-space: normal; overflow: visible; flex-direction: column; text-align: center; }
  .product-reassurance {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border: none;
    gap: 10px;
    background: transparent;
  }
  .product-reassurance .reassurance-item {
    border: 1px solid var(--border-light);
    border-radius: var(--radius);
    flex-direction: column;
    text-align: center;
    padding: 14px 10px;
    white-space: normal;
    font-size: .78rem;
    gap: 6px;
  }
  .product-reassurance .reassurance-item:last-child { border-bottom: 1px solid var(--border-light); }
  .product-reassurance .reassurance-icon { font-size: 1.4rem; }
  .testimonials-grid {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 16px;
    padding-bottom: 12px;
  }
  .testimonials-grid > * {
    flex: 0 0 85%;
    scroll-snap-align: start;
  }
  .testimonials-grid::-webkit-scrollbar { height: 4px; }
  .testimonials-grid::-webkit-scrollbar-thumb { background: var(--cta); border-radius: 4px; }
  .testimonials-grid::-webkit-scrollbar-track { background: var(--border-light); }
  .blog-grid {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 16px;
    padding-bottom: 12px;
  }
  .blog-grid > * {
    flex: 0 0 82%;
    scroll-snap-align: start;
  }
  .blog-grid::-webkit-scrollbar { height: 4px; }
  .blog-grid::-webkit-scrollbar-thumb { background: var(--cta); border-radius: 4px; }
  .blog-grid::-webkit-scrollbar-track { background: var(--border-light); }
  .comparator-desktop { display: none; }
  .comparator-mobile { display: block; }
  .seasons-nav { gap: 4px; }
  .season-tab { padding: 10px 16px; font-size: .85rem; }
  .usps-grid { grid-template-columns: 1fr 1fr; }
  .usp-card { flex-direction: column; text-align: center; padding: 14px 8px; gap: 8px; }
  .usp-icon { width: 72px; height: 72px; font-size: 2.8rem; }
}

@media (max-width: 480px) {
  .categories-grid > * {
    flex: 0 0 70%;
  }
  .bestsellers-scroll > * {
    flex: 0 0 75%;
  }
  .cat-slider-row > * {
    flex: 0 0 75%;
  }
  .recently-viewed .product-grid > * {
    flex: 0 0 75%;
  }
  .product-grid { grid-template-columns: repeat(2, 1fr); }
  .product-card-sm .product-card-image { aspect-ratio: 1/1; }
  .hero-title { font-size: 1.8rem; }
  .usps-grid { grid-template-columns: 1fr 1fr; }
}

/* ── Utility: visually hidden ─────────────────────────── */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }

/* ── Print ────────────────────────────────────────────── */
@media print {
  .site-header, .site-footer, .mobile-sticky-bar, .cart-drawer, .cart-overlay, .search-overlay, .compare-bar, .mobile-nav, .mobile-nav-overlay { display: none !important; }
  body { color: #000; }
  a { color: #000; text-decoration: underline; }
}


/* ─── Footer grid : max 4 colonnes (brand + 3 cols) sur 1 ligne, wrap sinon ─── */
.footer-grid {
  display: grid;
  grid-template-columns: 1.4fr repeat(auto-fit, minmax(160px, 1fr));
  gap: 36px;
  align-items: start;
}
@media (max-width: 900px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 28px; }
}
@media (max-width: 540px) {
  .footer-grid { grid-template-columns: 1fr; gap: 22px; }
}


/* ─── Footer bottom : copyright + legal strip + cookies sur 1 ligne ─── */
.footer-bottom {
  display: flex;
  flex-wrap: wrap; row-gap: 14px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-top: 24px;
  margin-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.footer-bottom .footer-copyright {
  margin: 0;
  font-size: 13px;
  opacity: 0.7;
  order: 1;
}
.footer-legal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  order: 2;
  font-size: 13px;
}
.footer-legal a {
  color: inherit;
  opacity: 0.85;
  text-decoration: none;
  transition: opacity .15s;
}
.footer-legal a:hover { opacity: 1; text-decoration: underline; }
.footer-legal-sep {
  opacity: 0.4;
  font-size: 11px;
  user-select: none;
}
.footer-bottom .footer-cookies {
  margin: 0;
  order: 3;
}
.footer-bottom .footer-cookies button {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: inherit;
  padding: 6px 14px;
  border-radius: 100px;
  font-size: 12px;
  cursor: pointer;
  opacity: 0.85;
  transition: opacity .15s, border-color .15s;
}
.footer-bottom .footer-cookies button:hover {
  opacity: 1;
  border-color: rgba(255, 255, 255, 0.4);
}
@media (max-width: 700px) {
  .footer-bottom { flex-direction: column; align-items: flex-start; gap: 12px; }
  .footer-bottom .footer-copyright { order: 3; }
  .footer-legal { order: 1; }
  .footer-bottom .footer-cookies { order: 2; }
}


/* ─── Testimonials : single-row horizontal scroll (DiceBear avatars) ─── */
.testimonials-grid {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 18px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 4px 4px 16px;
  margin: 0 -4px;
  scroll-snap-type: x proximity;
  scroll-padding: 4px;
  -webkit-overflow-scrolling: touch;
}
.testimonials-grid::-webkit-scrollbar { height: 8px; }
.testimonials-grid::-webkit-scrollbar-track { background: rgba(255,255,255,0.04); border-radius: 4px; }
.testimonials-grid::-webkit-scrollbar-thumb { background: rgba(127,127,127,0.35); border-radius: 4px; }
.testimonials-grid::-webkit-scrollbar-thumb:hover { background: rgba(127,127,127,0.55); }
.testimonials-grid { scrollbar-width: thin; }
.testimonials-grid > .testimonial-card {
  flex: 0 0 320px;
  scroll-snap-align: start;
}
.testimonial-avatar-wrap {
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  position: relative;
}
.testimonial-avatar-wrap .testimonial-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
}
@media (max-width: 600px) {
  .testimonials-grid > .testimonial-card { flex: 0 0 280px; }
}
/* --- Bestsellers en 1 ligne avec scroll horizontal --- */
.bestsellers-scroll,
.bestsellers .products-grid,
.bestsellers .bestsellers-grid {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 18px !important;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 4px 4px 16px;
  margin: 0 -4px;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  grid-template-columns: none !important;
}
.bestsellers-scroll > .product-card,
.bestsellers .products-grid > .product-card,
.bestsellers .bestsellers-grid > .product-card {
  flex: 0 0 240px !important;
  scroll-snap-align: start;
  width: auto !important;
}
.bestsellers-scroll::-webkit-scrollbar { height: 8px; }
.bestsellers-scroll::-webkit-scrollbar-track { background: rgba(255,255,255,0.04); border-radius: 4px; }
.bestsellers-scroll::-webkit-scrollbar-thumb { background: rgba(127,127,127,0.35); border-radius: 4px; }
.bestsellers-scroll::-webkit-scrollbar-thumb:hover { background: rgba(127,127,127,0.55); }
@media (max-width: 600px) {
  .bestsellers-scroll > .product-card,
  .bestsellers .products-grid > .product-card { flex: 0 0 200px !important; }
}

/* --- Footer 4 cols explicites en desktop --- */
@media (min-width: 700px) {
  .footer-grid {
    display: grid !important;
    grid-template-columns: 1.4fr 1fr 1fr 1fr !important;
    gap: 36px !important;
    align-items: start !important;
  }
}
@media (max-width: 699px) and (min-width: 480px) {
  .footer-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 28px !important;
  }
}
@media (max-width: 479px) {
  .footer-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 22px !important;
  }
}

/* --- Reassurance cards : texte qui wrap (jamais tronqué) --- */
.reassurance .reassurance-item,
.reassurance-grid .reassurance-item {
  white-space: normal !important;
  overflow: visible !important;
  display: block !important;
  text-align: center !important;
  padding: 28px 20px !important;
  border-bottom: none !important;
}
.reassurance .reassurance-item p,
.reassurance-grid .reassurance-item p {
  white-space: normal !important;
  overflow: visible !important;
  word-wrap: break-word !important;
  font-size: 0.9rem !important;
  line-height: 1.5 !important;
}
.reassurance .reassurance-item strong,
.reassurance-grid .reassurance-item strong {
  white-space: normal !important;
  overflow: visible !important;
}
/* --- Bestsellers + Categories en 1 ligne avec scroll horizontal --- */
.bestsellers-scroll,
.bestsellers .products-grid,
.bestsellers .bestsellers-grid,
.categories-grid,
.categories-slider .categories-grid,
.cat-slider-row,
.category-sliders .cat-slider-row {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 18px !important;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 4px 4px 16px;
  margin: 0 -4px;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  grid-template-columns: none !important;
}
.bestsellers-scroll > .product-card,
.bestsellers .products-grid > .product-card,
.bestsellers .bestsellers-grid > .product-card {
  flex: 0 0 240px !important;
  scroll-snap-align: start;
  width: auto !important;
}
.categories-grid > .category-tile,
.categories-grid > * {
  flex: 0 0 200px !important;
  scroll-snap-align: start;
  width: auto !important;
  min-width: 200px;
}
.cat-slider-row > * {
  flex: 0 0 240px !important;
  scroll-snap-align: start;
}
.bestsellers-scroll::-webkit-scrollbar,
.categories-grid::-webkit-scrollbar,
.cat-slider-row::-webkit-scrollbar { height: 8px; }
.bestsellers-scroll::-webkit-scrollbar-track,
.categories-grid::-webkit-scrollbar-track,
.cat-slider-row::-webkit-scrollbar-track { background: rgba(255,255,255,0.04); border-radius: 4px; }
.bestsellers-scroll::-webkit-scrollbar-thumb,
.categories-grid::-webkit-scrollbar-thumb,
.cat-slider-row::-webkit-scrollbar-thumb { background: rgba(127,127,127,0.35); border-radius: 4px; }
.bestsellers-scroll::-webkit-scrollbar-thumb:hover,
.categories-grid::-webkit-scrollbar-thumb:hover,
.cat-slider-row::-webkit-scrollbar-thumb:hover { background: rgba(127,127,127,0.55); }
@media (max-width: 600px) {
  .bestsellers-scroll > .product-card,
  .bestsellers .products-grid > .product-card { flex: 0 0 200px !important; }
  .categories-grid > .category-tile,
  .categories-grid > * { flex: 0 0 160px !important; min-width: 160px; }
}

/* --- Footer 4 cols explicites en desktop --- */
@media (min-width: 700px) {
  .footer-grid {
    display: grid !important;
    grid-template-columns: 1.4fr 1fr 1fr 1fr !important;
    gap: 36px !important;
    align-items: start !important;
  }
}
@media (max-width: 699px) and (min-width: 480px) {
  .footer-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 28px !important;
  }
}
@media (max-width: 479px) {
  .footer-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 22px !important;
  }
}

/* --- Reassurance cards : texte qui wrap (jamais tronqué) --- */
.reassurance .reassurance-item,
.reassurance-grid .reassurance-item {
  white-space: normal !important;
  overflow: visible !important;
  display: block !important;
  text-align: center !important;
  padding: 28px 20px !important;
  border-bottom: none !important;
}
.reassurance .reassurance-item p,
.reassurance-grid .reassurance-item p {
  white-space: normal !important;
  overflow: visible !important;
  word-wrap: break-word !important;
  font-size: 0.9rem !important;
  line-height: 1.5 !important;
}
.reassurance .reassurance-item strong,
.reassurance-grid .reassurance-item strong {
  white-space: normal !important;
  overflow: visible !important;
}
/* --- Bestsellers + Categories en 1 ligne avec scroll horizontal --- */
.bestsellers-scroll,
.bestsellers .products-grid,
.bestsellers .bestsellers-grid,
.categories-grid,
.categories-slider .categories-grid,
.cat-slider-row,
.category-sliders .cat-slider-row {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 18px !important;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 4px 4px 16px;
  margin: 0 -4px;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  grid-template-columns: none !important;
}
.bestsellers-scroll > .product-card,
.bestsellers .products-grid > .product-card,
.bestsellers .bestsellers-grid > .product-card {
  flex: 0 0 240px !important;
  scroll-snap-align: start;
  width: auto !important;
}
.categories-grid > .category-tile,
.categories-grid > * {
  flex: 0 0 200px !important;
  scroll-snap-align: start;
  width: auto !important;
  min-width: 200px;
}
.cat-slider-row > * {
  flex: 0 0 240px !important;
  scroll-snap-align: start;
}
.bestsellers-scroll::-webkit-scrollbar,
.categories-grid::-webkit-scrollbar,
.cat-slider-row::-webkit-scrollbar { height: 8px; }
.bestsellers-scroll::-webkit-scrollbar-track,
.categories-grid::-webkit-scrollbar-track,
.cat-slider-row::-webkit-scrollbar-track { background: rgba(255,255,255,0.04); border-radius: 4px; }
.bestsellers-scroll::-webkit-scrollbar-thumb,
.categories-grid::-webkit-scrollbar-thumb,
.cat-slider-row::-webkit-scrollbar-thumb { background: rgba(127,127,127,0.35); border-radius: 4px; }
.bestsellers-scroll::-webkit-scrollbar-thumb:hover,
.categories-grid::-webkit-scrollbar-thumb:hover,
.cat-slider-row::-webkit-scrollbar-thumb:hover { background: rgba(127,127,127,0.55); }
@media (max-width: 600px) {
  .bestsellers-scroll > .product-card,
  .bestsellers .products-grid > .product-card { flex: 0 0 200px !important; }
  .categories-grid > .category-tile,
  .categories-grid > * { flex: 0 0 160px !important; min-width: 160px; }
}

/* --- Footer 4 cols explicites en desktop --- */
@media (min-width: 700px) {
  .footer-grid {
    display: grid !important;
    grid-template-columns: 1.4fr 1fr 1fr 1fr !important;
    gap: 36px !important;
    align-items: start !important;
  }
}
@media (max-width: 699px) and (min-width: 480px) {
  .footer-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 28px !important;
  }
}
@media (max-width: 479px) {
  .footer-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 22px !important;
  }
}

/* --- Wizards step-based : seul le step .active est visible.
       Couvre les sections custom_*_finder, buying_quiz, deck_builder, etc.
       qui ont une structure <div class="X-step active"></div><div class="X-step"></div> --- */
.finder-step:not(.active),
.wizard-step:not(.active),
.quiz-step:not(.active),
.deck-builder-step:not(.active),
.builder-step:not(.active),
.step:not(.active):not(.warranty-steps .step):not(.warranty-steps li),
[data-step]:not(.active):not(.timeline-item) {
  display: none !important;
}
/* Le step .active reste en block */
.finder-step.active,
.wizard-step.active,
.quiz-step.active,
.deck-builder-step.active,
.builder-step.active {
  display: block !important;
}
/* Options dans un wizard : grid responsive de cards */
.finder-options,
.wizard-options,
.quiz-options {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  gap: 12px !important;
  margin-top: 16px;
}
.finder-option,
.wizard-option,
.quiz-option {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 22px 16px;
  border: 2px solid var(--border, #e5e5e5);
  border-radius: 10px;
  background: #fff;
  transition: border-color .2s, background .2s, transform .2s;
  font-size: .9rem;
  font-weight: 500;
  color: var(--ink, #1a1a1a);
  cursor: pointer;
  text-align: center;
}
.finder-option:hover,
.wizard-option:hover,
.quiz-option:hover {
  border-color: var(--accent, #FFCB05);
  transform: translateY(-2px);
}
.finder-option.selected,
.wizard-option.selected,
.quiz-option.selected {
  border-color: var(--cta, #d62828);
  background: var(--bg-tint, #fff8e0);
}
.finder-option-icon,
.wizard-option-icon,
.quiz-option-icon { font-size: 2rem; }
.finder-progress,
.wizard-progress,
.quiz-progress {
  height: 4px;
  background: var(--border-light, #f0f0f0);
  border-radius: 2px;
  margin-bottom: 24px;
  overflow: hidden;
}
.finder-progress-bar,
.wizard-progress-bar,
.quiz-progress-bar {
  height: 100%;
  background: var(--accent, #FFCB05);
  border-radius: 2px;
  transition: width .4s ease;
}
.finder-step-label,
.wizard-step-label,
.quiz-step-label {
  font-size: .85rem;
  color: var(--muted, #777);
  margin-bottom: 16px;
  font-weight: 600;
}
.finder-question,
.wizard-question,
.quiz-question {
  font-size: 1.4rem;
  margin-bottom: 20px;
  font-weight: 600;
}
.finder-result,
.wizard-result,
.quiz-result { text-align: center; padding: 32px 20px; }
.finder-result-icon { font-size: 3rem; display: block; margin-bottom: 16px; }

/* --- Reassurance cards : texte qui wrap (jamais tronqué) --- */
.reassurance .reassurance-item,
.reassurance-grid .reassurance-item {
  white-space: normal !important;
  overflow: visible !important;
  display: block !important;
  text-align: center !important;
  padding: 28px 20px !important;
  border-bottom: none !important;
}
.reassurance .reassurance-item p,
.reassurance-grid .reassurance-item p {
  white-space: normal !important;
  overflow: visible !important;
  word-wrap: break-word !important;
  font-size: 0.9rem !important;
  line-height: 1.5 !important;
}
.reassurance .reassurance-item strong,
.reassurance-grid .reassurance-item strong {
  white-space: normal !important;
  overflow: visible !important;
}


/* ═══════════════════════════════════════════════════════════
   LAYOUT FIXES (propagate-layout-fixes.js — 2026-05-09 v4)
   - Bestsellers + Categories : single-row horizontal scroll
   - Footer : 4 cols explicites en desktop
   - Reassurance cards : pas de troncature de texte
   - Wizards step-based : seul .active visible (finder/quiz/wizard)
   - Premium polish : material/comparator cards en cards arrondies + ombres
     + check/cross stylés en pastilles + CTA boutons pill
   ═══════════════════════════════════════════════════════════ */

/* --- Bestsellers + Categories en 1 ligne avec scroll horizontal --- */
.bestsellers-scroll,
.bestsellers .products-grid,
.bestsellers .bestsellers-grid,
.categories-grid,
.categories-slider .categories-grid,
.cat-slider-row,
.category-sliders .cat-slider-row {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 18px !important;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 4px 4px 16px;
  margin: 0 -4px;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  grid-template-columns: none !important;
}
.bestsellers-scroll > .product-card,
.bestsellers .products-grid > .product-card,
.bestsellers .bestsellers-grid > .product-card {
  flex: 0 0 240px !important;
  scroll-snap-align: start;
  width: auto !important;
}
.categories-grid > .category-tile,
.categories-grid > * {
  flex: 0 0 200px !important;
  scroll-snap-align: start;
  width: auto !important;
  min-width: 200px;
}
.cat-slider-row > * {
  flex: 0 0 240px !important;
  scroll-snap-align: start;
}
.bestsellers-scroll::-webkit-scrollbar,
.categories-grid::-webkit-scrollbar,
.cat-slider-row::-webkit-scrollbar { height: 8px; }
.bestsellers-scroll::-webkit-scrollbar-track,
.categories-grid::-webkit-scrollbar-track,
.cat-slider-row::-webkit-scrollbar-track { background: rgba(255,255,255,0.04); border-radius: 4px; }
.bestsellers-scroll::-webkit-scrollbar-thumb,
.categories-grid::-webkit-scrollbar-thumb,
.cat-slider-row::-webkit-scrollbar-thumb { background: rgba(127,127,127,0.35); border-radius: 4px; }
.bestsellers-scroll::-webkit-scrollbar-thumb:hover,
.categories-grid::-webkit-scrollbar-thumb:hover,
.cat-slider-row::-webkit-scrollbar-thumb:hover { background: rgba(127,127,127,0.55); }
@media (max-width: 600px) {
  .bestsellers-scroll > .product-card,
  .bestsellers .products-grid > .product-card { flex: 0 0 200px !important; }
  .categories-grid > .category-tile,
  .categories-grid > * { flex: 0 0 160px !important; min-width: 160px; }
}

/* --- Footer 4 cols explicites en desktop --- */
@media (min-width: 700px) {
  .footer-grid {
    display: grid !important;
    grid-template-columns: 1.4fr 1fr 1fr 1fr !important;
    gap: 36px !important;
    align-items: start !important;
  }
}
@media (max-width: 699px) and (min-width: 480px) {
  .footer-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 28px !important;
  }
}
@media (max-width: 479px) {
  .footer-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 22px !important;
  }
}

/* --- Wizards step-based : seul le step .active est visible.
       Couvre les sections custom_*_finder, buying_quiz, deck_builder, etc.
       qui ont une structure <div class="X-step active"></div><div class="X-step"></div> --- */
.finder-step:not(.active),
.wizard-step:not(.active),
.quiz-step:not(.active),
.deck-builder-step:not(.active),
.builder-step:not(.active),
.step:not(.active):not(.warranty-steps .step):not(.warranty-steps li),
[data-step]:not(.active):not(.timeline-item) {
  display: none !important;
}
/* Le step .active reste en block */
.finder-step.active,
.wizard-step.active,
.quiz-step.active,
.deck-builder-step.active,
.builder-step.active {
  display: block !important;
}
/* Options dans un wizard : grid responsive de cards */
.finder-options,
.wizard-options,
.quiz-options {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important;
  gap: 12px !important;
  margin-top: 16px;
}
.finder-option,
.wizard-option,
.quiz-option {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 22px 16px;
  border: 2px solid var(--border, #e5e5e5);
  border-radius: 10px;
  background: #fff;
  transition: border-color .2s, background .2s, transform .2s;
  font-size: .9rem;
  font-weight: 500;
  color: var(--ink, #1a1a1a);
  cursor: pointer;
  text-align: center;
}
.finder-option:hover,
.wizard-option:hover,
.quiz-option:hover {
  border-color: var(--accent, #FFCB05);
  transform: translateY(-2px);
}
.finder-option.selected,
.wizard-option.selected,
.quiz-option.selected {
  border-color: var(--cta, #d62828);
  background: var(--bg-tint, #fff8e0);
}
.finder-option-icon,
.wizard-option-icon,
.quiz-option-icon { font-size: 2rem; }
.finder-progress,
.wizard-progress,
.quiz-progress {
  height: 4px;
  background: var(--border-light, #f0f0f0);
  border-radius: 2px;
  margin-bottom: 24px;
  overflow: hidden;
}
.finder-progress-bar,
.wizard-progress-bar,
.quiz-progress-bar {
  height: 100%;
  background: var(--accent, #FFCB05);
  border-radius: 2px;
  transition: width .4s ease;
}
.finder-step-label,
.wizard-step-label,
.quiz-step-label {
  font-size: .85rem;
  color: var(--muted, #777);
  margin-bottom: 16px;
  font-weight: 600;
}
.finder-question,
.wizard-question,
.quiz-question {
  font-size: 1.4rem;
  margin-bottom: 20px;
  font-weight: 600;
}
.finder-result,
.wizard-result,
.quiz-result { text-align: center; padding: 32px 20px; }
.finder-result-icon { font-size: 3rem; display: block; margin-bottom: 16px; }

/* --- Material/Comparator cards : style premium homogène pour TOUTE
       section qui compare des options (matières, gammes, formules, plans) --- */
.materials-grid,
.comparator-grid,
.options-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 24px;
  margin-top: 32px;
}
@media (min-width: 1100px) {
  .materials-grid,
  .comparator-grid,
  .options-grid { grid-template-columns: repeat(4, 1fr); }
}
.material-card,
.comparator-card,
.option-card-premium {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 16px;
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 16px rgba(0, 0, 0, 0.03);
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  position: relative;
}
.material-card:hover,
.comparator-card:hover,
.option-card-premium:hover {
  transform: translateY(-6px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.06), 0 24px 48px rgba(0, 0, 0, 0.08);
  border-color: var(--accent, #FFCB05);
}
.material-card-top,
.comparator-card-top,
.option-card-top {
  background: linear-gradient(135deg, var(--bg-tint, #fff8e0) 0%, var(--bg-alt, #faf6ef) 100%);
  padding: 28px 24px 20px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  text-align: center;
}
.material-icon,
.comparator-icon,
.option-icon {
  font-size: 2.6rem;
  display: block;
  margin: 0 auto 12px;
  width: 64px;
  height: 64px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.7);
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.06), 0 2px 8px rgba(0, 0, 0, 0.04);
}
.material-name,
.comparator-name {
  font-family: var(--font-heading, serif);
  font-size: 1.5rem !important;
  margin: 0 0 6px !important;
  color: var(--ink, #1a1a1a);
  letter-spacing: 0.01em;
  font-style: normal;
}
.material-tagline,
.comparator-tagline {
  font-size: 0.85rem;
  color: var(--muted, #777);
  margin: 0 !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600;
}
.material-desc,
.comparator-desc {
  padding: 20px 24px 0;
  font-size: 0.92rem;
  line-height: 1.65;
  color: var(--muted, #555);
  margin: 0 0 16px;
}
.material-pros-cons,
.comparator-pros-cons {
  padding: 0 24px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-bottom: 16px;
}
.material-pros h4,
.material-cons h4,
.comparator-pros h4,
.comparator-cons h4 {
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin: 0 0 8px !important;
  color: var(--ink, #1a1a1a);
  font-family: var(--font-body, system-ui, sans-serif) !important;
  font-style: normal;
}
.material-pros ul,
.material-cons ul,
.comparator-pros ul,
.comparator-cons ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0;
}
.material-pros li,
.comparator-pros li {
  font-size: 0.86rem;
  color: var(--ink, #2a2a2a);
  padding: 4px 0 4px 22px;
  position: relative;
  line-height: 1.5;
}
.material-pros li::before,
.comparator-pros li::before {
  content: '✓';
  position: absolute;
  left: 0;
  top: 4px;
  width: 16px;
  height: 16px;
  background: #22c55e;
  color: #fff;
  border-radius: 50%;
  font-size: 11px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.material-cons li,
.comparator-cons li {
  font-size: 0.86rem;
  color: var(--muted, #777);
  padding: 4px 0 4px 22px;
  position: relative;
  line-height: 1.5;
}
.material-cons li::before,
.comparator-cons li::before {
  content: '−';
  position: absolute;
  left: 0;
  top: 4px;
  width: 16px;
  height: 16px;
  background: #f0f0f0;
  color: #999;
  border-radius: 50%;
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.material-ideal,
.comparator-ideal {
  margin: auto 24px 0;
  padding: 14px 16px;
  background: var(--bg-tint, #fff8e0);
  border-radius: 8px;
  font-size: 0.85rem;
  line-height: 1.5;
  color: var(--ink, #2a2a2a);
}
.material-ideal strong,
.comparator-ideal strong {
  color: var(--cta, #d62828);
  font-weight: 700;
}
.material-cta,
.comparator-cta,
.option-card-cta {
  margin: 16px 24px 24px !important;
  padding: 12px 20px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
  text-decoration: none;
  font-size: 0.9rem !important;
  font-weight: 700;
  border-radius: 100px !important;
  background: var(--ink, #1a1a1a);
  color: #fff !important;
  border: none !important;
  transition: background .2s, transform .2s;
  text-align: center;
}
.material-cta:hover,
.comparator-cta:hover,
.option-card-cta:hover {
  background: var(--cta, #d62828);
  color: #fff !important;
  transform: translateY(-1px);
}
.material-cta::after,
.comparator-cta::after,
.option-card-cta::after {
  content: '→';
  font-size: 1.1em;
  transition: transform .2s;
}
.material-cta:hover::after,
.comparator-cta:hover::after { transform: translateX(3px); }

/* --- Premium polish global : section titles + spacing + cards --- */
.section-title {
  position: relative;
  margin-bottom: 8px;
  letter-spacing: -0.01em;
}
.section-subtitle {
  max-width: 560px;
  margin: 0 auto 32px;
  text-align: center;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--muted, #777);
}

/* --- Reassurance cards : texte qui wrap (jamais tronqué) --- */
.reassurance .reassurance-item,
.reassurance-grid .reassurance-item {
  white-space: normal !important;
  overflow: visible !important;
  display: block !important;
  text-align: center !important;
  padding: 28px 20px !important;
  border-bottom: none !important;
}
.reassurance .reassurance-item p,
.reassurance-grid .reassurance-item p {
  white-space: normal !important;
  overflow: visible !important;
  word-wrap: break-word !important;
  font-size: 0.9rem !important;
  line-height: 1.5 !important;
}
.reassurance .reassurance-item strong,
.reassurance-grid .reassurance-item strong {
  white-space: normal !important;
  overflow: visible !important;
}

/* ═══════════════════════════════════════════════════════════
   HORTIS — UTILITY BAR (au-dessus du header)
   ═══════════════════════════════════════════════════════════ */
.utility-bar { background: var(--primary); color: rgba(255,255,255,.85); font-size: .8rem; line-height: 1; }
.utility-bar-inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; height: var(--utility-h); }
.utility-bar-left, .utility-bar-right { display: flex; align-items: center; gap: 18px; }
.utility-bar a { color: rgba(255,255,255,.85); transition: color var(--transition); }
.utility-bar a:hover { color: #fff; }
.utility-bar-pill { display: inline-flex; align-items: center; gap: 6px; background: rgba(255,255,255,.08); padding: 5px 10px; border-radius: 99px; font-weight: 500; }
.utility-bar-dot { width: 6px; height: 6px; border-radius: 50%; background: #B4C0A4; box-shadow: 0 0 0 4px rgba(180,192,164,.18); animation: hortis-pulse 2s infinite; }
@keyframes hortis-pulse { 0%,100% { opacity: 1; } 50% { opacity: .5; } }
.utility-bar-sep { width: 1px; height: 14px; background: rgba(255,255,255,.18); }
@media (max-width: 768px) { .utility-bar { display: none; } }

/* ═══════════════════════════════════════════════════════════
   FOOTER HORTIS — 6 colonnes + ribbon trust + payment chips
   ═══════════════════════════════════════════════════════════ */
.footer-ribbon { background: var(--bg-tint); border-top: 1px solid var(--border-light); border-bottom: 1px solid var(--border-light); padding: 28px 0; }
.footer-ribbon-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 20px; }
.footer-ribbon-item { display: flex; align-items: center; gap: 14px; }
.footer-ribbon-icon { width: 44px; height: 44px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: var(--bg); border-radius: 50%; font-size: 1.4rem; box-shadow: var(--shadow); }
.footer-ribbon-text strong { display: block; font-size: .92rem; color: var(--ink); margin-bottom: 2px; }
.footer-ribbon-text span { font-size: .8rem; color: var(--muted); }

.site-footer { background: var(--primary); color: rgba(255,255,255,.78); padding: 64px 0 0; }
.site-footer h4 { color: #fff; font-family: var(--font-heading); font-size: 1.05rem; font-weight: 600; margin-bottom: 18px; }
.site-footer a { color: rgba(255,255,255,.7); transition: color var(--transition); }
.site-footer a:hover { color: var(--terra-soft); }
.footer-inner { padding: 0; }
/* Footer = 1 seul étage : 4 colonnes max (brand 2x + 3 cols liens). Voir feedback_footer_single_row. */
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1.2fr 1fr; gap: 48px; padding-bottom: 48px; padding-top: 8px; }
.footer-col h4 { letter-spacing: .02em; }
.footer-col ul li { margin-bottom: 10px; font-size: .9rem; }
.footer-brand p { font-size: .9rem; line-height: 1.6; margin-bottom: 18px; }
.footer-baseline { color: rgba(255,255,255,.85); }
.footer-socials { display: flex; gap: 10px; margin-bottom: 24px; }
.footer-social-link { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,.08); transition: all var(--transition); }
.footer-social-link:hover { background: var(--cta); transform: translateY(-2px); }
.footer-newsletter-mini { background: rgba(255,255,255,.06); padding: 14px 16px; border-radius: var(--radius); margin-top: 8px; }
.footer-newsletter-mini h5 { color: #fff; font-size: .95rem; margin-bottom: 6px; font-weight: 600; }
.footer-newsletter-mini p { font-size: .8rem; margin-bottom: 10px; color: rgba(255,255,255,.65); }
.footer-newsletter-mini form { display: flex; gap: 6px; }
.footer-newsletter-mini input { flex: 1; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); border-radius: 6px; padding: 8px 12px; color: #fff; font-size: .85rem; outline: none; }
.footer-newsletter-mini input::placeholder { color: rgba(255,255,255,.45); }
.footer-newsletter-mini button { background: var(--cta); color: #fff; border-radius: 6px; padding: 8px 14px; font-size: .85rem; font-weight: 600; cursor: pointer; border: none; }
.footer-newsletter-mini button:hover { background: var(--cta-hover); }

/* Paiements : supprimé en tant que bandeau séparé — les logos sont déplacés dans footer-bottom à droite */
.footer-payments { display: none; }
.footer-payments-label { display: none; }
.footer-payment-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.footer-payment-chip { padding: 6px 12px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); border-radius: 6px; font-size: .75rem; color: rgba(255,255,255,.85); font-weight: 600; letter-spacing: .03em; }
.footer-payment-chip strong { color: #fff; }

.footer-bottom { padding: 20px 0; border-top: 1px solid rgba(255,255,255,.1); display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; row-gap: 14px; gap: 12px; font-size: .8rem; color: rgba(255,255,255,.55); }
.footer-copyright { color: rgba(255,255,255,.55); margin: 0; }
.footer-legal { display: flex; gap: 10px; align-items: center; }
.footer-legal a { font-size: .8rem; }
.footer-legal-sep { color: rgba(255,255,255,.3); }
.footer-cookies { margin: 0; }
.footer-cookies button { color: rgba(255,255,255,.55); font-size: .8rem; cursor: pointer; background: none; border: none; }
.footer-cookies button:hover { color: var(--terra-soft); }

/* Mobile = wrap autorisé, mais desktop ≥ 1024px = strictement 1 rangée. */
@media (max-width: 900px) { .footer-grid { grid-template-columns: repeat(2, 1fr); gap: 32px; } .footer-brand { grid-column: 1 / -1; } }
@media (max-width: 540px) { .footer-grid { grid-template-columns: 1fr; } .footer-payments { flex-direction: column; align-items: flex-start; } }

/* ═══════════════════════════════════════════════════════════
   SECTION HEADER COMMUN
   ═══════════════════════════════════════════════════════════ */
.section-padding { padding: 96px 0; }
.section-padding-sm { padding: 64px 0; }
.section-header { text-align: center; max-width: 720px; margin: 0 auto 56px; }
.section-header .eyebrow { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; background: var(--bg-tint); color: var(--primary); font-size: .78rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; border-radius: 99px; margin-bottom: 20px; }
.section-header .eyebrow-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--cta); }
.section-header .section-title { margin-bottom: 16px; }
.section-header .section-subtitle { color: var(--muted); max-width: 600px; margin: 0 auto; }

/* ═══════════════════════════════════════════════════════════
   ATELIER CREDS
   ═══════════════════════════════════════════════════════════ */
.atelier-creds-section { background: var(--bg); }
.atelier-creds-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 64px; align-items: center; }
.atelier-creds-img { position: relative; aspect-ratio: 5/4; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-lg); }
.atelier-creds-img img { width: 100%; height: 100%; object-fit: cover; }
.atelier-creds-badge { position: absolute; bottom: 24px; left: 24px; background: rgba(255,251,244,.94); backdrop-filter: blur(8px); padding: 14px 18px; border-radius: var(--radius); box-shadow: var(--shadow); display: flex; align-items: center; gap: 12px; }
.atelier-creds-badge-icon { font-size: 1.6rem; }
.atelier-creds-badge strong { display: block; font-size: .92rem; color: var(--ink); }
.atelier-creds-badge span { font-size: .8rem; color: var(--muted); }
.atelier-creds-content h2 { margin-bottom: 20px; }
.atelier-creds-content p { color: var(--ink-soft); margin-bottom: 18px; line-height: 1.7; }
.atelier-creds-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 28px 0; }
.atelier-creds-stat { background: var(--bg-alt); padding: 18px 14px; border-radius: var(--radius); text-align: center; border-left: 3px solid var(--cta); }
.atelier-creds-stat-num { font-family: var(--font-heading); font-size: 1.6rem; font-weight: 700; color: var(--primary); display: block; line-height: 1; margin-bottom: 6px; }
.atelier-creds-stat-label { font-size: .78rem; color: var(--muted); }
.atelier-creds-signature { display: flex; align-items: center; gap: 12px; padding-top: 20px; border-top: 1px solid var(--border-light); }
.atelier-creds-signature-avatar { width: 44px; height: 44px; border-radius: 50%; background: var(--wood-soft); display: flex; align-items: center; justify-content: center; font-weight: 700; color: var(--primary); font-family: var(--font-heading); }
.atelier-creds-signature-text strong { display: block; color: var(--ink); font-size: .9rem; }
.atelier-creds-signature-text span { font-size: .8rem; color: var(--muted); }
@media (max-width: 900px) { .atelier-creds-grid { grid-template-columns: 1fr; gap: 40px; } }

/* ═══════════════════════════════════════════════════════════
   PRESS STRIP
   ═══════════════════════════════════════════════════════════ */
.press-strip-section { background: var(--bg-alt); padding: 64px 0; }
.press-strip-label { text-align: center; color: var(--muted); font-size: .8rem; letter-spacing: .15em; text-transform: uppercase; margin-bottom: 36px; }
.press-strip-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 24px; }
.press-strip-card { background: var(--bg); border: 1px solid var(--border-light); border-radius: var(--radius); padding: 26px; transition: all var(--transition); }
.press-strip-card:hover { box-shadow: var(--shadow); border-color: var(--accent-soft); }
.press-strip-source { font-family: var(--font-heading); font-weight: 700; color: var(--primary); font-size: 1.1rem; letter-spacing: .02em; margin-bottom: 14px; }
.press-strip-quote { font-size: .92rem; color: var(--ink); line-height: 1.6; margin-bottom: 14px; font-style: italic; }
.press-strip-foot { display: flex; align-items: center; justify-content: space-between; font-size: .78rem; color: var(--muted); padding-top: 14px; border-top: 1px solid var(--border-light); }

/* ═══════════════════════════════════════════════════════════
   WARRANTY GRID
   ═══════════════════════════════════════════════════════════ */
.warranty-grid-section { background: var(--bg); }
.warranty-grid-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 24px; }
.warranty-card { background: var(--bg-alt); border: 1px solid var(--border-light); border-radius: var(--radius-lg); padding: 32px 28px; position: relative; overflow: hidden; transition: all var(--transition); }
.warranty-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: linear-gradient(90deg, var(--cta), var(--accent)); }
.warranty-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.warranty-card-icon { width: 56px; height: 56px; background: var(--bg); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.6rem; margin-bottom: 18px; box-shadow: var(--shadow); }
.warranty-card-years { font-family: var(--font-heading); font-size: 2.4rem; font-weight: 700; color: var(--cta); line-height: 1; margin-bottom: 8px; }
.warranty-card-years sup { font-size: 1rem; vertical-align: 1.2em; }
.warranty-card-title { font-family: var(--font-heading); font-size: 1.15rem; font-weight: 600; color: var(--ink); margin-bottom: 10px; }
.warranty-card-desc { font-size: .9rem; color: var(--muted); line-height: 1.6; margin-bottom: 16px; }
.warranty-card-bullets { list-style: none; padding: 0; margin: 0; }
.warranty-card-bullets li { font-size: .85rem; color: var(--ink-soft); padding: 6px 0 6px 22px; position: relative; }
.warranty-card-bullets li::before { content: '✓'; position: absolute; left: 0; top: 6px; color: var(--accent); font-weight: 700; }

/* ═══════════════════════════════════════════════════════════
   GLOSSARY
   ═══════════════════════════════════════════════════════════ */
.glossary-section { background: var(--bg-alt); }
.glossary-tabs { display: flex; gap: 6px; justify-content: center; margin-bottom: 32px; flex-wrap: wrap; }
.glossary-tab { padding: 8px 18px; background: var(--bg); border: 1px solid var(--border-light); border-radius: 99px; font-size: .82rem; color: var(--muted); cursor: pointer; transition: all var(--transition); font-family: var(--font-body); font-weight: 500; }
.glossary-tab.active, .glossary-tab:hover { background: var(--primary); color: #fff; border-color: var(--primary); }
.glossary-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; }
.glossary-entry { background: var(--bg); border-radius: var(--radius); padding: 22px; border-left: 3px solid var(--accent); transition: all var(--transition); }
.glossary-entry:hover { border-left-color: var(--cta); box-shadow: var(--shadow); transform: translateX(4px); }
.glossary-term { font-family: var(--font-heading); font-size: 1.1rem; font-weight: 700; color: var(--primary); margin-bottom: 8px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.glossary-term-tag { font-size: .7rem; font-weight: 600; color: var(--cta); background: rgba(61,82,54,.12); padding: 2px 8px; border-radius: 99px; letter-spacing: .04em; text-transform: uppercase; font-family: var(--font-body); }
.glossary-def { font-size: .9rem; color: var(--ink-soft); line-height: 1.6; }
.glossary-def strong { color: var(--ink); }

/* ═══════════════════════════════════════════════════════════
   LIVE ACTIVITY
   ═══════════════════════════════════════════════════════════ */
.live-activity-section { background: var(--bg); }
.live-activity-strip { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; background: var(--bg-alt); border-radius: var(--radius-lg); padding: 24px 32px; margin-bottom: 32px; }
.live-activity-pulse { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; color: var(--primary); }
.live-activity-pulse-dot { width: 10px; height: 10px; border-radius: 50%; background: #5F7F45; box-shadow: 0 0 0 5px rgba(95,127,69,.18); animation: hortis-pulse 1.6s infinite; }
.live-activity-stat { text-align: center; }
.live-activity-stat-num { font-family: var(--font-heading); font-size: 1.5rem; font-weight: 700; color: var(--primary); display: block; line-height: 1; }
.live-activity-stat-label { font-size: .75rem; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; margin-top: 4px; }
.live-activity-feed { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; }
.live-activity-item { display: flex; align-items: center; gap: 14px; background: var(--bg-alt); border-radius: var(--radius); padding: 14px 18px; border: 1px solid var(--border-light); }
.live-activity-icon { width: 38px; height: 38px; flex-shrink: 0; background: var(--bg); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.05rem; }
.live-activity-text { flex: 1; font-size: .87rem; color: var(--ink-soft); line-height: 1.5; }
.live-activity-text strong { color: var(--ink); }
.live-activity-time { font-size: .75rem; color: var(--muted); white-space: nowrap; }

/* ═══════════════════════════════════════════════════════════
   SUPPORT CENTER
   ═══════════════════════════════════════════════════════════ */
.support-center-section { background: var(--bg-alt); }
.support-cards-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; }
.support-card { background: var(--bg); border: 1px solid var(--border-light); border-radius: var(--radius-lg); padding: 28px; transition: all var(--transition); color: var(--ink); display: flex; flex-direction: column; }
.support-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); border-color: var(--accent-soft); color: var(--ink); }
.support-card-icon { font-size: 2rem; width: 56px; height: 56px; display: flex; align-items: center; justify-content: center; background: var(--bg-tint); border-radius: var(--radius); margin-bottom: 18px; }
.support-card--terra .support-card-icon { background: rgba(61,82,54,.14); }
.support-card--moss .support-card-icon { background: rgba(139,159,126,.18); }
.support-card--wood .support-card-icon { background: rgba(180,144,106,.18); }
.support-card-title { font-family: var(--font-heading); font-size: 1.15rem; font-weight: 600; margin-bottom: 10px; color: var(--primary); }
.support-card-desc { font-size: .9rem; color: var(--muted); line-height: 1.6; margin-bottom: 18px; flex: 1; }
.support-card-cta { display: inline-flex; align-items: center; gap: 6px; color: var(--cta); font-weight: 600; font-size: .88rem; margin-top: auto; transition: gap var(--transition); }
.support-card:hover .support-card-cta { gap: 10px; }
.support-live-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--success); margin-right: 6px; box-shadow: 0 0 0 3px rgba(95,127,69,.2); animation: hortis-pulse 2s infinite; }

/* ═══════════════════════════════════════════════════════════
   AMBIANCES JARDIN (galerie d'inspirations)
   ═══════════════════════════════════════════════════════════ */
.ambiances-section { background: var(--bg); }
.ambiances-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; }
.ambiance-card { position: relative; border-radius: var(--radius-lg); overflow: hidden; aspect-ratio: 4/5; cursor: pointer; transition: all var(--transition); text-decoration: none; }
.ambiance-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.ambiance-card.span-3 { grid-column: span 3; }
.ambiance-card.span-4 { grid-column: span 4; }
.ambiance-card.span-6 { grid-column: span 6; aspect-ratio: 5/4; }
.ambiance-card.span-8 { grid-column: span 8; aspect-ratio: 5/4; }
.ambiance-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.ambiance-card:hover img { transform: scale(1.07); }
.ambiance-card-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 40%, rgba(42,51,38,.85) 100%); padding: 22px; display: flex; flex-direction: column; justify-content: flex-end; color: #fff; }
.ambiance-card-tag { display: inline-block; font-size: .72rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--terra-soft); margin-bottom: 8px; }
.ambiance-card-title { font-family: var(--font-heading); font-size: 1.2rem; font-weight: 600; color: #fff; margin-bottom: 4px; }
.ambiance-card-desc { font-size: .82rem; color: rgba(255,255,255,.88); line-height: 1.5; }
@media (max-width: 900px) {
  .ambiances-grid { grid-template-columns: repeat(6, 1fr); }
  .ambiance-card.span-3, .ambiance-card.span-4 { grid-column: span 3; }
  .ambiance-card.span-6, .ambiance-card.span-8 { grid-column: span 6; }
}
@media (max-width: 540px) {
  .ambiances-grid { grid-template-columns: repeat(2, 1fr); }
  .ambiance-card.span-3, .ambiance-card.span-4, .ambiance-card.span-6, .ambiance-card.span-8 { grid-column: span 2; aspect-ratio: 4/5; }
}

/* ═══════════════════════════════════════════════════════════
   ŒUF SUSPENDU FOCUS
   ═══════════════════════════════════════════════════════════ */
.oeuf-suspendu-section { background: linear-gradient(135deg, var(--bg-tint) 0%, var(--bg-alt) 100%); position: relative; overflow: hidden; }
.oeuf-suspendu-section::before { content: ''; position: absolute; top: -120px; right: -120px; width: 360px; height: 360px; background: radial-gradient(circle, rgba(61,82,54,.18) 0%, transparent 70%); border-radius: 50%; }
.oeuf-suspendu-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 64px; align-items: center; position: relative; z-index: 1; }
.oeuf-suspendu-visual { position: relative; aspect-ratio: 4/5; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-lg); }
.oeuf-suspendu-visual img { width: 100%; height: 100%; object-fit: cover; }
.oeuf-suspendu-visual-badge { position: absolute; top: 24px; left: 24px; background: rgba(255,251,244,.95); backdrop-filter: blur(8px); padding: 10px 16px; border-radius: 99px; font-size: .78rem; font-weight: 600; color: var(--primary); letter-spacing: .04em; }
.oeuf-suspendu-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: .8rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--cta); margin-bottom: 18px; }
.oeuf-suspendu-eyebrow::before { content: ''; width: 24px; height: 1px; background: var(--cta); }
.oeuf-suspendu-content h2 { font-size: clamp(2rem, 4vw, 2.8rem); margin-bottom: 20px; line-height: 1.15; }
.oeuf-suspendu-lead { font-size: 1.05rem; color: var(--ink-soft); line-height: 1.7; margin-bottom: 28px; }
.oeuf-suspendu-features { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-bottom: 32px; }
.oeuf-suspendu-feature { display: flex; gap: 12px; }
.oeuf-suspendu-feature-icon { width: 36px; height: 36px; flex-shrink: 0; background: var(--bg); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: .95rem; box-shadow: var(--shadow); }
.oeuf-suspendu-feature-text strong { display: block; font-size: .92rem; color: var(--ink); margin-bottom: 2px; }
.oeuf-suspendu-feature-text span { font-size: .82rem; color: var(--muted); line-height: 1.5; }
.oeuf-suspendu-ctas { display: flex; gap: 12px; flex-wrap: wrap; }
.oeuf-suspendu-price { display: flex; align-items: baseline; gap: 12px; margin-bottom: 24px; padding-top: 24px; border-top: 1px dashed var(--border); }
.oeuf-suspendu-price-from { font-size: .8rem; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; }
.oeuf-suspendu-price-value { font-family: var(--font-heading); font-size: 2rem; font-weight: 700; color: var(--primary); }
.oeuf-suspendu-price-vs { font-size: .9rem; color: var(--muted); text-decoration: line-through; }
@media (max-width: 900px) { .oeuf-suspendu-grid { grid-template-columns: 1fr; gap: 40px; } .oeuf-suspendu-features { grid-template-columns: 1fr; } }

/* ═══════════════════════════════════════════════════════════
   MANIFESTO BLOCK
   ═══════════════════════════════════════════════════════════ */
.manifesto-section { background: var(--primary); color: #fff; padding: 120px 0; position: relative; overflow: hidden; }
.manifesto-section::before { content: ''; position: absolute; bottom: -180px; left: -180px; width: 480px; height: 480px; background: radial-gradient(circle, rgba(61,82,54,.22) 0%, transparent 70%); border-radius: 50%; }
.manifesto-inner { max-width: 820px; margin: 0 auto; text-align: center; position: relative; z-index: 1; }
.manifesto-eyebrow { display: inline-block; font-size: .82rem; font-weight: 600; letter-spacing: .15em; text-transform: uppercase; color: var(--terra-soft); margin-bottom: 24px; }
.manifesto-text { font-family: var(--font-heading); font-size: clamp(1.4rem, 3vw, 2rem); line-height: 1.4; font-weight: 500; color: #fff; margin-bottom: 32px; }
.manifesto-text em { color: var(--terra-soft); font-style: italic; }
.manifesto-signature { display: inline-flex; align-items: center; gap: 14px; padding-top: 28px; border-top: 1px solid rgba(255,255,255,.18); }
.manifesto-signature-avatar { width: 48px; height: 48px; border-radius: 50%; background: var(--wood-soft); display: flex; align-items: center; justify-content: center; color: var(--primary); font-weight: 700; font-family: var(--font-heading); }
.manifesto-signature-text { text-align: left; }
.manifesto-signature-text strong { display: block; color: #fff; font-size: .9rem; }
.manifesto-signature-text span { font-size: .8rem; color: rgba(255,255,255,.65); }

/* ═══════════════════════════════════════════════════════════
   HERO HORTIS — Mosaïque + trust badges
   ═══════════════════════════════════════════════════════════ */
.hero-hortis { background: linear-gradient(135deg, var(--bg-tint) 0%, var(--bg-alt) 100%); position: relative; overflow: hidden; padding: 80px 0; }
.hero-hortis::before { content: ''; position: absolute; top: -200px; right: -200px; width: 600px; height: 600px; background: radial-gradient(circle, rgba(61,82,54,.14) 0%, transparent 60%); border-radius: 50%; pointer-events: none; }
.hero-hortis::after { content: ''; position: absolute; bottom: -120px; left: -120px; width: 360px; height: 360px; background: radial-gradient(circle, rgba(139,159,126,.18) 0%, transparent 60%); border-radius: 50%; pointer-events: none; }
.hero-hortis-inner { display: grid; grid-template-columns: 1fr 1.1fr; gap: 56px; align-items: center; position: relative; z-index: 1; }

.hero-hortis-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: .82rem; font-weight: 600; letter-spacing: .04em; color: var(--primary); background: rgba(139,159,126,.18); padding: 8px 16px; border-radius: 99px; margin-bottom: 24px; }
.hero-hortis-eyebrow-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--cta); box-shadow: 0 0 0 4px rgba(61,82,54,.2); animation: hortis-pulse 2s infinite; }

.hero-hortis-title { font-family: var(--font-heading); font-size: clamp(2.4rem, 5.5vw, 4rem); line-height: 1.05; color: var(--primary); margin: 0 0 20px; letter-spacing: -.02em; }
.hero-hortis-subtitle { font-size: 1.1rem; line-height: 1.65; color: var(--ink-soft); margin-bottom: 36px; max-width: 540px; }

.hero-hortis-ctas { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 40px; }
.hero-hortis-ctas .btn-lg { padding: 18px 32px; font-size: 1rem; }
.hero-hortis-ctas .btn-primary { box-shadow: 0 8px 24px rgba(61,82,54,.28); }
.hero-hortis-ctas .btn-primary:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(61,82,54,.36); }

.hero-hortis-badges { display: flex; flex-wrap: wrap; gap: 18px; padding-top: 28px; border-top: 1px dashed var(--border); }
.hero-hortis-badge { display: inline-flex; align-items: center; gap: 8px; font-size: .85rem; color: var(--ink-soft); font-weight: 500; }
.hero-hortis-badge-icon { font-size: 1.1rem; }

.hero-hortis-visual { position: relative; }
.hero-hortis-mosaic { display: grid; grid-template-columns: 1.4fr 1fr; gap: 14px; aspect-ratio: 1/1.15; }
.hero-hortis-mosaic-main { position: relative; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-lg); }
.hero-hortis-mosaic-main img { width: 100%; height: 100%; object-fit: cover; }
.hero-hortis-mosaic-side { display: grid; grid-template-rows: 1fr 1.2fr; gap: 14px; }
.hero-hortis-mosaic-top, .hero-hortis-mosaic-bot { position: relative; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow); }
.hero-hortis-mosaic-top img, .hero-hortis-mosaic-bot img { width: 100%; height: 100%; object-fit: cover; }
.hero-hortis-single { position: relative; aspect-ratio: 4/4.6; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-lg); }
.hero-hortis-single img { width: 100%; height: 100%; object-fit: cover; }

.hero-hortis-sticker { position: absolute; background: rgba(255,251,244,.96); backdrop-filter: blur(8px); padding: 12px 16px; border-radius: var(--radius); box-shadow: var(--shadow); display: flex; flex-direction: column; gap: 2px; line-height: 1.2; }
.hero-hortis-sticker strong { font-family: var(--font-heading); font-size: 1.2rem; color: var(--primary); }
.hero-hortis-sticker span { font-size: .76rem; color: var(--muted); }
.hero-hortis-sticker-1 { top: 24px; left: 24px; transform: rotate(-3deg); }
.hero-hortis-sticker-2 { bottom: 18px; right: -8px; transform: rotate(2deg); }
.hero-hortis-sticker-2 strong { font-size: .92rem; }

@media (max-width: 900px) {
  .hero-hortis-inner { grid-template-columns: 1fr; gap: 40px; }
  .hero-hortis-visual { order: -1; max-width: 480px; margin: 0 auto; }
  .hero-hortis-mosaic { aspect-ratio: 1/1; }
}

/* ═══════════════════════════════════════════════════════════
   HORTIS VS — comparateur différenciation
   ═══════════════════════════════════════════════════════════ */
.hortis-vs-section { background: var(--bg-alt); }
.hortis-vs-table { background: var(--bg); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-lg); border: 1px solid var(--border-light); }
.hortis-vs-head { display: grid; grid-template-columns: 1.2fr 1.5fr 1.5fr; background: var(--primary); color: #fff; }
.hortis-vs-head-cell { padding: 22px 24px; font-family: var(--font-heading); font-size: .95rem; font-weight: 600; display: flex; align-items: center; gap: 10px; }
.hortis-vs-head-left { background: rgba(61,82,54,.22); border-left: 3px solid var(--cta); }
.hortis-vs-head-right { color: rgba(255,255,255,.55); border-left: 1px solid rgba(255,255,255,.1); }
.hortis-vs-logo { font-size: 1.3rem; }
.hortis-vs-logo-grey { font-size: 1.3rem; filter: grayscale(1) opacity(.6); }

.hortis-vs-row { display: grid; grid-template-columns: 1.2fr 1.5fr 1.5fr; border-top: 1px solid var(--border-light); transition: background var(--transition); }
.hortis-vs-row:hover { background: var(--bg-alt); }
.hortis-vs-cell { padding: 18px 24px; font-size: .9rem; line-height: 1.55; display: flex; align-items: flex-start; gap: 10px; }
.hortis-vs-cell-criteria { font-weight: 600; color: var(--primary); background: var(--bg-tint); }
.hortis-vs-cell-left { background: rgba(61,82,54,.04); border-left: 3px solid var(--cta); color: var(--ink); }
.hortis-vs-cell-left.is-strong { font-weight: 500; }
.hortis-vs-cell-right { color: var(--muted); border-left: 1px solid var(--border-light); }
.hortis-vs-check { color: var(--success); font-weight: 700; flex-shrink: 0; font-size: 1.1rem; line-height: 1.3; }
.hortis-vs-cross { color: var(--danger); font-weight: 700; flex-shrink: 0; font-size: 1.05rem; line-height: 1.3; }
.hortis-vs-cell-left .hortis-vs-cross { color: var(--muted); }

.hortis-vs-footer { text-align: center; margin-top: 40px; }
.hortis-vs-footer p { color: var(--ink-soft); font-size: 1rem; margin-bottom: 20px; max-width: 700px; margin-left: auto; margin-right: auto; }

@media (max-width: 768px) {
  .hortis-vs-head, .hortis-vs-row { grid-template-columns: 1fr; }
  .hortis-vs-cell-criteria { background: var(--primary); color: #fff; padding: 12px 20px; }
  .hortis-vs-cell { padding: 14px 20px; }
}

/* ═══════════════════════════════════════════════════════════
   ATELIER PROCESS — timeline 4 étapes
   ═══════════════════════════════════════════════════════════ */
.atelier-process-section { background: var(--bg); }
.atelier-process-timeline { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; list-style: none; padding: 0; counter-reset: process; position: relative; }
.atelier-process-timeline::before { content: ''; position: absolute; top: 32px; left: 8%; right: 8%; height: 2px; background: linear-gradient(90deg, var(--cta) 0%, var(--accent) 100%); z-index: 0; opacity: .35; }
.atelier-process-step { position: relative; z-index: 1; }
.atelier-process-num { width: 64px; height: 64px; margin: 0 auto 20px; background: var(--bg); border: 3px solid var(--cta); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: var(--font-heading); font-weight: 700; font-size: 1.2rem; color: var(--cta); box-shadow: var(--shadow); }
.atelier-process-card { background: var(--bg-alt); border-radius: var(--radius-lg); padding: 26px 22px; border: 1px solid var(--border-light); text-align: center; transition: all var(--transition); height: 100%; }
.atelier-process-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: var(--accent-soft); }
.atelier-process-icon { font-size: 2rem; margin-bottom: 14px; }
.atelier-process-title { font-family: var(--font-heading); font-size: 1.15rem; font-weight: 600; color: var(--primary); margin-bottom: 10px; }
.atelier-process-desc { font-size: .88rem; color: var(--muted); line-height: 1.6; margin-bottom: 16px; }
.atelier-process-duration { display: inline-block; font-size: .78rem; color: var(--cta); background: rgba(61,82,54,.1); padding: 5px 12px; border-radius: 99px; font-weight: 600; }
@media (max-width: 900px) { .atelier-process-timeline { grid-template-columns: repeat(2, 1fr); } .atelier-process-timeline::before { display: none; } }
@media (max-width: 540px) { .atelier-process-timeline { grid-template-columns: 1fr; } }

/* ═══════════════════════════════════════════════════════════
   BUNDLE KITS — packs prêts à monter
   ═══════════════════════════════════════════════════════════ */
.bundle-kits-section { background: var(--bg-alt); }
.bundle-kits-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 28px; }
.bundle-kit { background: var(--bg); border: 1px solid var(--border-light); border-radius: var(--radius-lg); overflow: hidden; transition: all var(--transition); display: flex; flex-direction: column; }
.bundle-kit:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.bundle-kit-image { position: relative; aspect-ratio: 16/10; overflow: hidden; }
.bundle-kit-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.bundle-kit:hover .bundle-kit-image img { transform: scale(1.05); }
.bundle-kit-badge { position: absolute; top: 16px; left: 16px; background: var(--cta); color: #fff; padding: 6px 14px; border-radius: 99px; font-size: .85rem; font-weight: 700; letter-spacing: .04em; box-shadow: var(--shadow); }
.bundle-kit--terra .bundle-kit-badge { background: var(--cta); }
.bundle-kit--moss .bundle-kit-badge { background: var(--accent); }
.bundle-kit--wood .bundle-kit-badge { background: var(--wood); }
.bundle-kit-body { padding: 24px; display: flex; flex-direction: column; flex: 1; }
.bundle-kit-label { font-family: var(--font-heading); font-size: 1.3rem; font-weight: 700; color: var(--primary); margin-bottom: 8px; }
.bundle-kit-desc { font-size: .9rem; color: var(--muted); line-height: 1.5; margin-bottom: 18px; }
.bundle-kit-items { list-style: none; padding: 0; margin: 0 0 20px; border-top: 1px solid var(--border-light); }
.bundle-kit-items li { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--border-light); font-size: .85rem; gap: 10px; }
.bundle-kit-item-name { color: var(--ink-soft); flex: 1; }
.bundle-kit-item-price { color: var(--muted); font-weight: 500; white-space: nowrap; }
.bundle-kit-total { display: flex; align-items: center; justify-content: space-between; padding: 14px 0 18px; margin-top: auto; }
.bundle-kit-total-label { font-size: .82rem; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; font-weight: 600; }
.bundle-kit-total-prices { display: flex; align-items: baseline; gap: 10px; }
.bundle-kit-total-strike { font-size: .9rem; color: var(--muted); text-decoration: line-through; }
.bundle-kit-total-value { font-family: var(--font-heading); font-size: 1.5rem; font-weight: 700; color: var(--cta); }
.bundle-kit-cta { width: 100%; }

/* ═══════════════════════════════════════════════════════════
   AVANT/APRÈS — galerie transformations
   ═══════════════════════════════════════════════════════════ */
.avant-apres-section { background: var(--bg); }
.avant-apres-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 28px; }
.avant-apres-card { background: var(--bg-alt); border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--border-light); transition: all var(--transition); }
.avant-apres-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.avant-apres-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: var(--border); }
.avant-apres-figure { position: relative; aspect-ratio: 1; overflow: hidden; margin: 0; background: var(--bg); }
.avant-apres-figure img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.avant-apres-figure-before img { filter: grayscale(.4) brightness(.95); }
.avant-apres-card:hover .avant-apres-figure-after img { transform: scale(1.04); }
.avant-apres-label { position: absolute; top: 10px; left: 10px; background: rgba(255,251,244,.94); backdrop-filter: blur(8px); padding: 4px 12px; border-radius: 99px; font-size: .72rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.avant-apres-label-after { background: var(--cta); color: #fff; }
.avant-apres-body { padding: 22px; }
.avant-apres-meta { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.avant-apres-client { font-family: var(--font-heading); font-size: 1.05rem; color: var(--primary); font-weight: 600; }
.avant-apres-budget { font-size: .8rem; color: var(--cta); background: rgba(61,82,54,.1); padding: 4px 10px; border-radius: 99px; font-weight: 600; }
.avant-apres-product { font-size: .85rem; color: var(--muted); margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--border-light); }
.avant-apres-quote { font-size: .9rem; color: var(--ink); line-height: 1.6; font-style: italic; margin: 0; }

/* ═══════════════════════════════════════════════════════════
   CARTE INSTALLATIONS — France SVG + stats
   ═══════════════════════════════════════════════════════════ */
.carte-installations-section { background: var(--bg-alt); }
.carte-installations-stats { display: flex; justify-content: center; gap: 48px; margin-bottom: 32px; flex-wrap: wrap; }
.carte-installations-stat { text-align: center; }
.carte-installations-stat-num { display: block; font-family: var(--font-heading); font-size: 2.4rem; font-weight: 700; color: var(--cta); line-height: 1; margin-bottom: 6px; }
.carte-installations-stat-label { font-size: .82rem; color: var(--muted); text-transform: uppercase; letter-spacing: .1em; }

.carte-installations-map { max-width: 720px; margin: 0 auto; background: var(--bg); border-radius: var(--radius-lg); padding: 32px; box-shadow: var(--shadow); }
.carte-svg { width: 100%; height: auto; max-height: 560px; }
.carte-city-glow { fill: rgba(61,82,54,.18); }
.carte-city.is-hot .carte-city-glow { fill: rgba(61,82,54,.32); animation: hortis-pulse 2.4s infinite; }
.carte-city-dot { fill: var(--cta); }
.carte-city.is-hot .carte-city-dot { fill: var(--primary); }
.carte-city-name { font-family: var(--font-body); font-size: 13px; font-weight: 600; fill: var(--primary); }
.carte-city-count { font-size: 11px; fill: var(--muted); }
.carte-atelier-label { font-size: 14px; font-weight: 700; fill: var(--cta); font-family: var(--font-heading); }

.carte-installations-foot { text-align: center; margin-top: 24px; color: var(--ink-soft); font-size: .92rem; }
.carte-installations-foot a { color: var(--cta); font-weight: 600; text-decoration: underline; }

/* ═══════════════════════════════════════════════════════════
   ERREURS À ÉVITER — pédagogie liste
   ═══════════════════════════════════════════════════════════ */
.erreurs-section { background: var(--bg); }
.erreurs-list { max-width: 920px; margin: 0 auto; display: flex; flex-direction: column; gap: 18px; }
.erreur-item { display: grid; grid-template-columns: 72px 1fr; gap: 22px; background: var(--bg-alt); border-radius: var(--radius-lg); padding: 26px 28px; border: 1px solid var(--border-light); border-left: 4px solid var(--danger); transition: all var(--transition); }
.erreur-item:hover { transform: translateX(4px); box-shadow: var(--shadow); border-left-color: var(--cta); }
.erreur-num { font-family: var(--font-heading); font-size: 2.4rem; font-weight: 800; color: var(--cta); line-height: 1; opacity: .35; }
.erreur-content { flex: 1; }
.erreur-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; gap: 14px; flex-wrap: wrap; }
.erreur-title { font-family: var(--font-heading); font-size: 1.2rem; font-weight: 600; color: var(--primary); margin: 0; }
.erreur-danger { font-size: .72rem; font-weight: 700; color: var(--danger); background: rgba(176,65,62,.12); padding: 4px 10px; border-radius: 99px; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.erreur-desc { font-size: .92rem; color: var(--ink-soft); line-height: 1.65; margin-bottom: 14px; }
.erreur-fix { background: rgba(139,159,126,.14); border-radius: var(--radius); padding: 12px 16px; font-size: .9rem; color: var(--ink); line-height: 1.55; }
.erreur-fix strong { color: var(--success); margin-right: 4px; }

@media (max-width: 640px) { .erreur-item { grid-template-columns: 56px 1fr; gap: 14px; padding: 20px; } }

/* ═══════════════════════════════════════════════════════════
   STICKY MOBILE CTA — bouton fixe en bas (mobile only)
   ═══════════════════════════════════════════════════════════ */
.sticky-mobile-cta { display: none; }
@media (max-width: 768px) {
  .sticky-mobile-cta {
    display: flex; position: fixed; bottom: 0; left: 0; right: 0; z-index: 60;
    background: rgba(255,251,244,.96); backdrop-filter: blur(12px);
    border-top: 1px solid var(--border-light); padding: 12px 16px; gap: 10px;
    box-shadow: 0 -4px 16px rgba(42,51,38,.1);
  }
  .sticky-mobile-cta .btn { flex: 1; padding: 14px; font-size: .95rem; }
  body { padding-bottom: 80px; }
}

/* ═══════════════════════════════════════════════════════════
   FREE SHIPPING PROGRESS BAR (dans drawer panier)
   ═══════════════════════════════════════════════════════════ */
.shipping-progress { background: var(--bg-alt); border-radius: var(--radius); padding: 14px 16px; margin-bottom: 16px; border: 1px solid var(--border-light); }
.shipping-progress-text { font-size: .82rem; color: var(--ink-soft); margin-bottom: 8px; line-height: 1.4; }
.shipping-progress-text strong { color: var(--cta); }
.shipping-progress-text.is-unlocked { color: var(--success); font-weight: 600; }
.shipping-progress-bar { height: 6px; background: var(--border-light); border-radius: 99px; overflow: hidden; }
.shipping-progress-fill { height: 100%; background: linear-gradient(90deg, var(--cta), var(--accent)); border-radius: 99px; transition: width .4s ease; width: 0; }
.shipping-progress.is-unlocked .shipping-progress-fill { background: var(--success); width: 100% !important; }

/* ═══════════════════════════════════════════════════════════
   SCROLL REVEAL — animations légères
   ═══════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: no-preference) {
  .section-padding > .container > * { animation: hortis-fade-up .6s ease both; }
  .section-padding > .container > *:nth-child(2) { animation-delay: .08s; }
  .section-padding > .container > *:nth-child(3) { animation-delay: .16s; }
}
@keyframes hortis-fade-up {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ═══════════════════════════════════════════════════════════
   BACK TO TOP — bouton flottant
   ═══════════════════════════════════════════════════════════ */
.back-to-top { position: fixed; bottom: 24px; right: 24px; width: 48px; height: 48px; border-radius: 50%; background: var(--primary); color: #fff; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; box-shadow: var(--shadow-lg); opacity: 0; visibility: hidden; transform: translateY(20px); transition: all var(--transition); z-index: 50; }
.back-to-top.visible { opacity: 1; visibility: visible; transform: translateY(0); }
.back-to-top:hover { background: var(--cta); transform: translateY(-4px); }
@media (max-width: 768px) { .back-to-top { bottom: 80px; right: 16px; } }

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   USPs PRO — SVG line icons, layout aéré, hairline separators
   Remplace .usps-icons / .usp-card de la version emoji.
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */
.usps-pro-section { background: var(--bg); padding: 32px 0; border-top: 1px solid var(--border-light); border-bottom: 1px solid var(--border-light); }
.usps-pro-grid { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
.usps-pro-item { display: flex; align-items: center; gap: 18px; padding: 22px 28px; position: relative; transition: background var(--transition); }
.usps-pro-item:hover { background: var(--bg-alt); }

/* Hairline separators verticales entre items (Г©purГ©) */
.usps-pro-item:not(:last-child)::after {
  content: '';
  position: absolute;
  right: 0;
  top: 28px;
  bottom: 28px;
  width: 1px;
  background: var(--border-light);
}

.usps-pro-icon {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--primary);
  transition: color var(--transition), transform var(--transition);
}
.usps-pro-icon svg { display: block; }
.usps-pro-item:hover .usps-pro-icon { color: var(--cta); transform: translateY(-2px); }

.usps-pro-text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.usps-pro-title {
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 600;
  color: var(--primary);
  line-height: 1.2;
  letter-spacing: -0.005em;
}
.usps-pro-sub {
  font-size: .82rem;
  color: var(--muted);
  line-height: 1.4;
  letter-spacing: .01em;
}

/* Responsive : 2 cols sur tablette, 1 col sur mobile, separators horizontaux */
@media (max-width: 900px) {
  .usps-pro-grid { grid-template-columns: repeat(2, 1fr); }
  .usps-pro-item:not(:last-child)::after { display: none; }
  .usps-pro-item:nth-child(odd):not(:last-child) {
    border-right: 1px solid var(--border-light);
  }
  .usps-pro-item:not(:nth-last-child(-n+2)) {
    border-bottom: 1px solid var(--border-light);
  }
}
@media (max-width: 540px) {
  .usps-pro-grid { grid-template-columns: 1fr; }
  .usps-pro-item { padding: 18px 20px; }
  .usps-pro-item:nth-child(odd):not(:last-child) { border-right: none; }
  .usps-pro-item:not(:last-child) { border-bottom: 1px solid var(--border-light); }
}


/* ═══════════════════════════════════════════════════════════
   USPs PRO — SVG line icons, layout aéré, hairline separators (empire)
   ═══════════════════════════════════════════════════════════ */
.usps-pro-section { background: var(--bg, #fff); padding: 32px 0; border-top: 1px solid var(--border-light, #eee); border-bottom: 1px solid var(--border-light, #eee); }
.usps-pro-grid { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
.usps-pro-item { display: flex; align-items: center; gap: 18px; padding: 22px 28px; position: relative; transition: background .25s ease; }
.usps-pro-item:hover { background: var(--bg-alt, var(--bg-tint, #f7f7f7)); }
.usps-pro-item:not(:last-child)::after {
  content: '';
  position: absolute;
  right: 0;
  top: 28px;
  bottom: 28px;
  width: 1px;
  background: var(--border-light, #eee);
}
.usps-pro-icon {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--primary, #222);
  transition: color .25s ease, transform .25s ease;
}
.usps-pro-icon svg { display: block; }
.usps-pro-item:hover .usps-pro-icon { color: var(--cta, var(--accent, #555)); transform: translateY(-2px); }
.usps-pro-text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.usps-pro-title {
  font-family: var(--font-heading, inherit);
  font-size: 1rem;
  font-weight: 600;
  color: var(--primary, #222);
  line-height: 1.2;
  letter-spacing: -0.005em;
}
.usps-pro-sub {
  font-size: .82rem;
  color: var(--muted, #888);
  line-height: 1.4;
  letter-spacing: .01em;
}
@media (max-width: 900px) {
  .usps-pro-grid { grid-template-columns: repeat(2, 1fr); }
  .usps-pro-item:not(:last-child)::after { display: none; }
  .usps-pro-item:nth-child(odd):not(:last-child) { border-right: 1px solid var(--border-light, #eee); }
  .usps-pro-item:not(:nth-last-child(-n+2)) { border-bottom: 1px solid var(--border-light, #eee); }
}
@media (max-width: 540px) {
  .usps-pro-grid { grid-template-columns: 1fr; }
  .usps-pro-item { padding: 18px 20px; }
  .usps-pro-item:nth-child(odd):not(:last-child) { border-right: none; }
  .usps-pro-item:not(:last-child) { border-bottom: 1px solid var(--border-light, #eee); }
}

/* в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ
   WARRANTY V2 — refonte propre, 4 cards strict, métrique inline
   в•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђв•ђ */
.warranty-v2-section { background: var(--bg, #fff); }
.warranty-v2-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  max-width: 1200px;
  margin: 0 auto;
}
.warranty-v2-card {
  background: var(--bg-alt, #f5efe2);
  border: 1px solid var(--border-light, #ece2c9);
  border-radius: var(--radius-lg, 18px);
  padding: 32px 28px;
  display: flex;
  flex-direction: column;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.warranty-v2-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg, 0 12px 36px rgba(0,0,0,.12));
  border-color: var(--accent-soft, #B4C0A4);
}

/* Top : icГґne Г  gauche, mГ©trique Г  droite, alignГ©s sur mГЄme ligne */
.warranty-v2-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--border-light, #ece2c9);
}
.warranty-v2-card-icon {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--bg, #fff);
  border-radius: 50%;
  color: var(--primary, #2A3326);
}
.warranty-v2-card-icon svg { display: block; }

/* MГ©trique : chiffre BIG + unit en petit dessous, alignГ©s Г  droite */
.warranty-v2-card-metric {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  line-height: 1;
}
.warranty-v2-card-num {
  font-family: var(--font-heading, Georgia, serif);
  font-size: 2.2rem;
  font-weight: 700;
  color: var(--cta, var(--primary, #2A3326));
  letter-spacing: -0.02em;
  line-height: 1;
}
.warranty-v2-card-unit {
  font-size: .72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--muted, #6E6A5C);
  margin-top: 4px;
}

.warranty-v2-card-title {
  font-family: var(--font-heading, Georgia, serif);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--ink, #1F2519);
  margin: 0 0 10px;
  line-height: 1.25;
  letter-spacing: -0.005em;
}
.warranty-v2-card-desc {
  font-size: .88rem;
  color: var(--muted, #6E6A5C);
  line-height: 1.55;
  margin: 0 0 16px;
}
.warranty-v2-card-bullets {
  list-style: none;
  padding: 0;
  margin: auto 0 0;
  border-top: 1px dashed var(--border, #d6cdb6);
  padding-top: 14px;
}
.warranty-v2-card-bullets li {
  font-size: .82rem;
  color: var(--ink-soft, #3A3F32);
  padding: 5px 0 5px 22px;
  position: relative;
  line-height: 1.45;
}
.warranty-v2-card-bullets li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 9px;
  width: 12px;
  height: 7px;
  border-left: 2px solid var(--success, #5F7F45);
  border-bottom: 2px solid var(--success, #5F7F45);
  transform: rotate(-45deg);
}

@media (max-width: 1024px) {
  .warranty-v2-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
}
@media (max-width: 540px) {
  .warranty-v2-grid { grid-template-columns: 1fr; }
  .warranty-v2-card { padding: 24px 22px; }
}

/* Footer payment mini — petits logos compacts dans la barre footer-bottom, à droite */
.footer-payment-mini { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-left: 0; }
.footer-payment-mini .pay-mini { display: inline-flex; width: 40px; height: 24px; border-radius: 3px; overflow: hidden; box-shadow: 0 1px 2px rgba(0,0,0,.15); background: #fff; line-height: 0; transition: transform .2s ease; }
.footer-payment-mini .pay-mini:hover { transform: translateY(-1px); }
.footer-payment-mini .pay-mini svg { display: block; width: 100%; height: 100%; }
@media (max-width: 768px) { .footer-payment-mini { margin-left: 0; margin-top: 8px; } }
/* Legacy .footer-payment-logos (gardé caché si présent dans cache) */
.footer-payment-logos { display: none; }

.footer-payment-mini .pay-mini img[alt="CB"] { object-fit: cover; }
.site-footer { overflow-x: hidden; }
/* Footer doit respecter le container global avec petit padding latéral */
.footer-inner.container { max-width: var(--container); padding-left: 20px; padding-right: 20px; overflow-x: hidden; }
.site-footer .footer-bottom { padding-left: 20px; padding-right: 20px; }

/* Anti scroll-horizontal global : confiner les carrousels dans leur section */
html, body { overflow-x: hidden; max-width: 100vw; }
.bestsellers, .categories-slider, .category-sliders, .ambiances-section, .hero-main, .testimonials, .atelier-creds-section, .warranty-v2-section { overflow-x: hidden; }
.bestsellers-scroll, .categories-grid, .cat-slider-row, .recently-viewed .product-grid { max-width: 100%; box-sizing: border-box; }


/* ═══ Prix en couleur CTA ═══ */
.product-card-price-row .price-current { color: var(--cta) !important; }

/* ═══ Aplus images cap 800px ═══ */
.aplus-image { width: 100% !important; height: auto !important; max-width: 100% !important; margin: 0 !important; display: block !important; border-radius: 8px; }
.aplus-gallery { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important; gap: 16px !important; max-width: 100% !important; margin: 0 auto !important; align-items: start !important; }

/* ═══ A+ HTML original Amazon — styles minimaux ═══ */
.aplus-original-content { max-width: 1400px; margin: 0; font-size: 15px; line-height: 1.6; color: var(--ink); }
.aplus-original-content img { max-width: 100%; height: auto; display: block; border-radius: 4px; }
.aplus-original-content h2, .aplus-original-content h3, .aplus-original-content h4 { font-family: var(--font-heading); margin: 24px 0 12px; }
.aplus-original-content h2 { font-size: 1.5rem; }
.aplus-original-content h3 { font-size: 1.2rem; }
.aplus-original-content h4 { font-size: 1rem; }
.aplus-original-content p { margin: 10px 0; }
.aplus-original-content .a-section, .aplus-original-content .aplus-module, .aplus-original-content .aplus-module-wrapper { margin-bottom: 24px; }
.aplus-original-content .aplus-3p-fixed-width, .aplus-original-content .aplus-v2 { max-width: 100%; }
.aplus-original-content table { width: 100%; border-collapse: collapse; margin: 16px 0; }
.aplus-original-content table th, .aplus-original-content table td { padding: 10px; border: 1px solid var(--border-light); text-align: left; vertical-align: top; }
.aplus-original-content table th { background: var(--bg-alt); font-weight: 600; }
.aplus-original-content hr { border: 0; border-top: 1px solid var(--border-light); margin: 32px 0; }
.aplus-original-content .a-spacing-large, .aplus-original-content .a-spacing-medium { margin-bottom: 20px; }
.aplus-original-content .aplus-tech-spec-table { font-size: 13px; }
/* Hide bucketDivider / éléments Amazon UI internes inutiles */
.aplus-original-content .bucketDivider, .aplus-original-content [class*=brandstory-feedback] { display: none; }

/* ═══ A+ Amazon module classes (apm-*) ═══ */
.aplus-original-content .apm-flex { display: flex; flex-wrap: wrap; gap: 16px; align-items: stretch; margin: 16px 0; }
.aplus-original-content .apm-flex-item-fourth-width { flex: 1 1 calc(25% - 12px); min-width: 180px; }
.aplus-original-content .apm-flex-item-third-width { flex: 1 1 calc(33.33% - 11px); min-width: 200px; }
.aplus-original-content .apm-floatleft { float: left; margin: 0 16px 8px 0; }
.aplus-original-content .apm-floatnone { float: none; }
.aplus-original-content .apm-text-center { text-align: center; }
.aplus-original-content .apm-hero-image, .aplus-original-content .apm-hero-image img { display: block; width: 100%; max-width: 970px; margin: 0 auto; }
.aplus-original-content .apm-fixed-width { max-width: 970px; margin: 0 auto; }
.aplus-original-content .apm-spacing { margin-bottom: 20px; }

/* Tables comparatives */
.aplus-original-content .apm-tablemodule, .aplus-original-content .apm-tablemodule-table { width: 100%; border-collapse: collapse; margin: 16px 0; }
.aplus-original-content .apm-tablemodule-image, .aplus-original-content .apm-tablemodule-image img { width: 100%; height: auto; display: block; }
.aplus-original-content .apm-tablemodule-keyhead { background: #f5f2eb; font-weight: 600; padding: 10px 12px; text-align: left; border: 1px solid var(--border-light); }
.aplus-original-content .apm-tablemodule-blankkeyhead { background: transparent; border: none; padding: 0; }
.aplus-original-content .apm-tablemodule-valuecell { padding: 10px 12px; border: 1px solid var(--border-light); text-align: center; vertical-align: middle; }
.aplus-original-content .apm-tablemodule-imagerows td { padding: 8px; }
.aplus-original-content .apm-tablemodule-atc { padding: 8px; text-align: center; }

/* Image-text layouts */
.aplus-original-content .apm-leftimage { float: left; margin: 0 24px 16px 0; max-width: 45%; }
.aplus-original-content .apm-leftimage img { max-width: 100%; height: auto; }
.aplus-original-content .apm-lefttwothirdswrap { float: left; width: 66.66%; padding-right: 16px; }
.aplus-original-content .apm-centerthirdcol { float: left; width: 33.33%; }
.aplus-original-content .apm-rightthirdcol { float: right; width: 33.33%; padding-left: 16px; }
.aplus-original-content .apm-rightthirdcol-inner { padding: 0 8px; }
.aplus-original-content .apm-sidemodule { float: left; margin: 0 16px 16px 0; max-width: 50%; }

/* Listbox / bullets */
.aplus-original-content .apm-listbox { background: var(--bg-alt); padding: 16px 20px; border-radius: 6px; margin: 12px 0; }
.aplus-original-content .apm-listbox ul { margin: 0; padding-left: 20px; }
.aplus-original-content .apm-listbox li { margin: 4px 0; }

/* Hidden */
.aplus-original-content .apm-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
.aplus-original-content .apm-hidden { display: none; }

/* Clearfix sur les wrappers */
.aplus-original-content .aplus-module-wrapper::after,
.aplus-original-content .aplus-module-section::after,
.aplus-original-content .aplus-content-wrapper::after { content: ''; display: table; clear: both; }

/* Headings A+ */
.aplus-original-content .aplus-13-heading { font-family: var(--font-heading); font-size: 1.5rem; font-weight: 600; margin: 24px 0 12px; }

@media (max-width: 700px) {
  .aplus-original-content .apm-flex-item-fourth-width,
  .aplus-original-content .apm-flex-item-third-width { flex: 1 1 calc(50% - 8px); }
  .aplus-original-content .apm-leftimage,
  .aplus-original-content .apm-lefttwothirdswrap,
  .aplus-original-content .apm-centerthirdcol,
  .aplus-original-content .apm-rightthirdcol,
  .aplus-original-content .apm-sidemodule { float: none; width: 100%; max-width: 100%; margin: 8px 0; padding: 0; }
}

/* ═══ A+ Premium Amazon (premium-aplus-*) ═══ */
.aplus-original-content .premium-aplus-four-column,
.aplus-original-content .premium-aplus-three-column,
.aplus-original-content .premium-aplus-two-column { display: flex; flex-wrap: wrap; gap: 20px; align-items: stretch; margin: 24px 0; }
.aplus-original-content .premium-aplus-four-column > .premium-aplus-column { flex: 1 1 calc(25% - 15px); min-width: 180px; }
.aplus-original-content .premium-aplus-three-column > .premium-aplus-column { flex: 1 1 calc(33.33% - 14px); min-width: 200px; }
.aplus-original-content .premium-aplus-two-column > .premium-aplus-column { flex: 1 1 calc(50% - 10px); min-width: 240px; }
.aplus-original-content .premium-aplus-column { display: flex; flex-direction: column; }
.aplus-original-content .premium-aplus-column img { width: 100%; height: auto; display: block; border-radius: 6px; margin-bottom: 12px; }
.aplus-original-content .premium-aplus-column .column-heading { margin: 0; }
.aplus-original-content .premium-aplus-column .column-heading h1,
.aplus-original-content .premium-aplus-column .column-heading h2,
.aplus-original-content .premium-aplus-column .column-heading h3,
.aplus-original-content .premium-aplus-column .aplus-h3 { font-size: 1.1rem; font-weight: 700; margin: 6px 0; }
.aplus-original-content .premium-aplus-column .column-description { font-size: .8rem; color: var(--ink); line-height: 1.6; }
/* Paragraphes A+ multi-col : taille réduite + clamp à 8 lignes max + paragraphe par phrase */
.aplus-original-content .premium-aplus-column .column-description p,
.aplus-original-content .apm-flex-item-fourth-width p,
.aplus-original-content .apm-flex-item-third-width p {
  font-size: .8rem;
  line-height: 1.55;
  margin: 0 0 .6em;
}
.aplus-original-content .premium-aplus-column .column-description p:last-child,
.aplus-original-content .apm-flex-item-fourth-width p:last-child,
.aplus-original-content .apm-flex-item-third-width p:last-child { margin-bottom: 0; }
/* Si paragraphe trop long, on clamp à 8 lignes (Amazon balance souvent 200+ mots dans 1 paragraphe) */
.aplus-original-content .premium-aplus-column .column-description {
  display: -webkit-box;
  -webkit-line-clamp: 10;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.aplus-original-content .aplus-h1, .aplus-original-content .premium-module-3-heading { font-family: var(--font-heading); font-size: 1.5rem; font-weight: 600; text-align: center; margin: 32px 0 20px; }
.aplus-original-content .a-text-center { text-align: center; }
.aplus-original-content .a-text-bold { font-weight: 700; }
.aplus-original-content .a-spacing-none { margin: 0; }
.aplus-original-content .premium-module { margin: 32px 0; }
.aplus-original-content .a-lazy-loaded { display: block; }

@media (max-width: 700px) {
  .aplus-original-content .premium-aplus-four-column > .premium-aplus-column,
  .aplus-original-content .premium-aplus-three-column > .premium-aplus-column { flex: 1 1 calc(50% - 10px); }
}

/* ═══ A+ Align all left ═══ */
.aplus-original-content { max-width: 100% !important; margin: 0 !important; text-align: left !important; }
.aplus-original-content h1, .aplus-original-content h2, .aplus-original-content h3, .aplus-original-content h4, .aplus-original-content p { text-align: left !important; }
.aplus-original-content .a-text-center, .aplus-original-content .aplus-h1, .aplus-original-content .premium-module-3-heading, .aplus-original-content .apm-text-center { text-align: left !important; }
.aplus-original-content .apm-hero-image, .aplus-original-content .apm-hero-image img, .aplus-original-content .apm-fixed-width { margin-left: 0 !important; margin-right: auto !important; }
.aplus-original-content img { margin-left: 0 !important; margin-right: auto !important; }
.aplus-original-content .premium-aplus-four-column, .aplus-original-content .premium-aplus-three-column, .aplus-original-content .premium-aplus-two-column { justify-content: flex-start; }

/* ═══ A+ apm-* flex override v2 ═══ */
.aplus-original-content .apm-spacing { display: flex !important; flex-wrap: wrap; gap: 24px; align-items: flex-start; margin: 16px 0; }
.aplus-original-content .apm-lefttwothirdswrap { float: none !important; width: auto !important; padding: 0 !important; flex: 2 1 0; display: flex; gap: 20px; align-items: flex-start; min-width: 0; }
.aplus-original-content .apm-lefttwothirdswrap .apm-leftimage { float: none !important; margin: 0 !important; flex: 0 0 45%; max-width: 45%; }
.aplus-original-content .apm-lefttwothirdswrap .apm-leftimage img { width: 100%; height: auto; display: block; }
.aplus-original-content .apm-lefttwothirdswrap .apm-centerthirdcol { float: none !important; width: auto !important; flex: 1 1 0; min-width: 0; padding: 0; }
.aplus-original-content .apm-rightthirdcol { float: none !important; width: auto !important; padding: 0 !important; flex: 1 1 240px; min-width: 200px; }
.aplus-original-content .apm-rightthirdcol-inner { padding: 0 !important; }
.aplus-original-content .apm-leftimage:not(.apm-lefttwothirdswrap .apm-leftimage) { float: none; max-width: 100%; margin: 0 0 16px 0; }

@media (max-width: 800px) {
  .aplus-original-content .apm-spacing { flex-direction: column; }
  .aplus-original-content .apm-lefttwothirdswrap { flex-direction: column; }
  .aplus-original-content .apm-lefttwothirdswrap .apm-leftimage { flex: 1 1 auto; max-width: 100%; }
}

/* ═══ Aplus fixed-width override (use full width) ═══ */
.aplus-original-content .apm-fixed-width,
.aplus-original-content .apm-3p-fixed-width,
.aplus-original-content .aplus-3p-fixed-width { max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }

/* ═══ Notice PDF Amazon ═══ */
.product-manual-link { display: inline-flex; align-items: center; gap: 10px; margin-top: 14px; padding: 12px 18px; background: var(--bg-alt); border: 1px solid var(--border-light); border-radius: 8px; color: var(--ink); text-decoration: none; font-size: .95rem; font-weight: 600; transition: all .15s ease; }
.product-manual-link:hover { background: var(--cta); color: #fff; border-color: var(--cta); }
.product-manual-link .pdf-icon { font-size: 1.3rem; }

/* ═══ A+ Specs cards (Technicité/Dimensions/Livraison) ═══ */
/* Stylise les colonnes apm-flex qui contiennent une liste UL — les transforme en cards type tableau */
.aplus-original-content .apm-flex-item-third-width:has(ul),
.aplus-original-content .apm-flex-item-fourth-width:has(ul) {
  background: #fafaf6;
  border: 1px solid #e8e4d8;
  border-radius: 10px;
  padding: 18px 20px;
}
.aplus-original-content .apm-flex-item-third-width:has(ul) h2,
.aplus-original-content .apm-flex-item-third-width:has(ul) h3,
.aplus-original-content .apm-flex-item-third-width:has(ul) h4,
.aplus-original-content .apm-flex-item-fourth-width:has(ul) h4 {
  font-size: 1.05rem !important;
  font-weight: 700;
  margin: 0 0 12px !important;
  padding-bottom: 10px;
  border-bottom: 2px solid #d8d3c8;
  color: var(--ink);
  text-align: left !important;
}
.aplus-original-content ul.a-unordered-list,
.aplus-original-content .apm-flex-item-third-width ul,
.aplus-original-content .apm-flex-item-fourth-width ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.aplus-original-content ul.a-unordered-list li,
.aplus-original-content .apm-flex-item-third-width ul li,
.aplus-original-content .apm-flex-item-fourth-width ul li {
  padding: 9px 0 !important;
  border-bottom: 1px solid #e8e4d8;
  font-size: .9rem;
  line-height: 1.5;
  list-style: none !important;
  display: block;
}
.aplus-original-content ul.a-unordered-list li:last-child,
.aplus-original-content .apm-flex-item-third-width ul li:last-child,
.aplus-original-content .apm-flex-item-fourth-width ul li:last-child {
  border-bottom: none;
}
.aplus-original-content .a-list-item { color: var(--ink); display: inline; }
/* Retire les <p> vides Amazon qui créent des espaces moches */
.aplus-original-content .apm-flex-item-third-width p:empty,
.aplus-original-content .apm-flex-item-fourth-width p:empty { display: none; }

/* ═══ A+ Specs cards → tableau zebra (override) ═══ */
/* Remplace le style cards arrondies par un style "tableau zebra" plat comme les Caractéristiques techniques */
.aplus-original-content .apm-flex-item-third-width:has(ul),
.aplus-original-content .apm-flex-item-fourth-width:has(ul) {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
}
.aplus-original-content .apm-flex-item-third-width:has(ul) h2,
.aplus-original-content .apm-flex-item-third-width:has(ul) h3,
.aplus-original-content .apm-flex-item-third-width:has(ul) h4,
.aplus-original-content .apm-flex-item-fourth-width:has(ul) h4 {
  font-size: 1.15rem !important;
  font-weight: 700;
  margin: 0 0 14px !important;
  padding-bottom: 0;
  border-bottom: none !important;
  color: var(--ink);
}
.aplus-original-content .apm-flex-item-third-width ul,
.aplus-original-content .apm-flex-item-fourth-width ul,
.aplus-original-content ul.a-unordered-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.aplus-original-content .apm-flex-item-third-width ul li,
.aplus-original-content .apm-flex-item-fourth-width ul li,
.aplus-original-content ul.a-unordered-list li {
  padding: 12px 16px !important;
  border-bottom: none !important;
  font-size: .9rem;
  line-height: 1.5;
  list-style: none !important;
  display: block;
  background: transparent;
}
/* Zebra striping — lignes impaires en beige (comme les Caractéristiques techniques) */
.aplus-original-content .apm-flex-item-third-width ul li:nth-child(odd),
.aplus-original-content .apm-flex-item-fourth-width ul li:nth-child(odd),
.aplus-original-content ul.a-unordered-list li:nth-child(odd) {
  background: #f4f1e8 !important;
}
.aplus-original-content .apm-flex-item-third-width p:empty,
.aplus-original-content .apm-flex-item-fourth-width p:empty { display: none !important; }

/* ═══ A+ Carousel/Slider Amazon → stack all visible ═══ */
/* Force tous les slides à être visibles (au lieu de "1 seul" en mode slider) */
.aplus-original-content .a-carousel-container,
.aplus-original-content .aplus-carousel-container { display: block !important; position: static !important; }
.aplus-original-content .a-carousel-viewport { overflow: visible !important; height: auto !important; position: static !important; }
.aplus-original-content .a-carousel { display: block !important; width: 100% !important; }
.aplus-original-content .a-carousel-row { display: block !important; transform: none !important; left: 0 !important; }
.aplus-original-content .a-carousel-row-inner { display: block !important; }
.aplus-original-content .a-carousel-col,
.aplus-original-content .a-carousel-card { display: block !important; width: 100% !important; max-width: 100% !important; opacity: 1 !important; visibility: visible !important; transform: none !important; left: 0 !important; position: static !important; float: none !important; margin-bottom: 32px !important; }
.aplus-original-content .a-carousel-firstvisibleitem,
.aplus-original-content .a-carousel-card[aria-hidden="true"] { display: block !important; opacity: 1 !important; visibility: visible !important; }

/* Cache toute la navigation (flèches, dots, "Previous/Next page", "1: Gazebo 2:...") */
.aplus-original-content .a-carousel-controls,
.aplus-original-content .a-carousel-overlay-buttons,
.aplus-original-content .a-carousel-goto-prevpage,
.aplus-original-content .a-carousel-goto-nextpage,
.aplus-original-content .aplus-goto-btn,
.aplus-original-content .a-icon-previous-rounded,
.aplus-original-content .a-icon-next-rounded,
.aplus-original-content .a-carousel-pagination-dots,
.aplus-original-content .aplus-carousel-index,
.aplus-original-content .aplus-carousel-label,
.aplus-original-content .a-button-search,
.aplus-original-content [class*="goto-prevpage"],
.aplus-original-content [class*="goto-nextpage"],
.aplus-original-content [class*="-overlay-buttons"] { display: none !important; }

/* Texte "Previous page", "Next page", "X: Label" qui apparaît en fallback no-JS */
.aplus-original-content .a-carousel a-begin,
.aplus-original-content .a-carousel-static .a-button-text { display: none !important; }

/* ═══ A+ Carousel ULTRA override v2 ═══ */
.aplus-original-content [class*="a-carousel"],
.aplus-original-content .aplus-carousel-container,
.aplus-original-content .premium-module-13-carousel,
.aplus-original-content [class*="module-13"] {
  display: block !important;
  position: static !important;
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  width: 100% !important;
  transform: none !important;
  left: 0 !important; top: 0 !important; right: auto !important; bottom: auto !important;
}
.aplus-original-content .a-carousel-card,
.aplus-original-content .a-carousel-col {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  opacity: 1 !important;
  visibility: visible !important;
  margin: 0 0 40px !important;
  padding: 0 !important;
}

/* ═══ A+ Slider fonctionnel avec nav < > ═══ */
/* Override la règle précédente "show all stacked" — on en revient au comportement slider 1 visible */
.aplus-original-content [class*="a-carousel"],
.aplus-original-content .aplus-carousel-container,
.aplus-original-content .premium-module-13-carousel,
.aplus-original-content [class*="module-13"] {
  position: relative !important;
  display: block !important;
  overflow: hidden !important;
  height: auto !important;
  min-height: 300px;
}
.aplus-original-content .a-carousel-viewport {
  position: relative;
  overflow: hidden !important;
  height: auto !important;
  width: 100% !important;
  display: block !important;
}
.aplus-original-content .a-carousel-row,
.aplus-original-content .a-carousel-row-inner {
  display: flex !important;
  flex-wrap: nowrap !important;
  transition: transform 0.4s ease;
  width: max-content !important;
  position: relative !important;
  transform: none !important;
}
.aplus-original-content .a-carousel-card,
.aplus-original-content .a-carousel-col {
  display: block !important;
  flex: 0 0 100% !important;
  width: 100% !important;
  max-width: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  margin: 0 !important;
  padding: 0 !important;
}
.aplus-original-content .a-carousel-card:not(:first-child),
.aplus-original-content .a-carousel-col:not(:first-child) {
  width: 100% !important;
}
/* Empêche le .a-carousel-card vide d'afficher avec hauteur 0 (forcer flex sizing) */
.aplus-original-content .a-carousel-card:empty { display: none !important; }

/* Navigation injectée par JS */
.aplus-slider-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin-top: 16px;
}
.aplus-slider-arrow {
  background: var(--bg-alt);
  border: 1px solid var(--border-light);
  border-radius: 50%;
  width: 44px; height: 44px;
  cursor: pointer;
  font-size: 1.3rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--ink);
  transition: all .15s ease;
  user-select: none;
}
.aplus-slider-arrow:hover { background: var(--cta); color: #fff; border-color: var(--cta); }
.aplus-slider-arrow:disabled { opacity: .4; cursor: not-allowed; }
.aplus-slider-dots {
  display: flex;
  gap: 8px;
}
.aplus-slider-dot {
  width: 10px; height: 10px;
  border-radius: 50%;
  background: var(--border-light);
  cursor: pointer;
  border: none;
  padding: 0;
  transition: background .15s;
}
.aplus-slider-dot.active { background: var(--cta); }

/* Cache les contrôles Amazon natifs + indicateurs texte */
.aplus-original-content .a-carousel-controls,
.aplus-original-content .a-carousel-overlay-buttons,
.aplus-original-content .aplus-goto-btn,
.aplus-original-content .aplus-carousel-index,
.aplus-original-content .aplus-carousel-label,
.aplus-original-content [class*="goto-prevpage"],
.aplus-original-content [class*="goto-nextpage"] { display: none !important; }

/* ═══ A+ Slider v3 — clean ═══ */
/* Cache le carousel Amazon original (on va le remplacer par notre slider propre) */
.aplus-original-content [class*="a-carousel-container"][data-replaced="1"],
.aplus-original-content .aplus-carousel-container[data-replaced="1"] { display: none !important; }

/* Notre slider propre */
.aplus-slider-clean { position: relative; margin: 24px 0; }
.aplus-slider-clean-viewport { overflow: hidden; border-radius: 8px; }
.aplus-slider-clean-track { display: flex; transition: transform 0.45s cubic-bezier(.4,0,.2,1); }
.aplus-slider-clean-slide { flex: 0 0 100%; min-width: 100%; box-sizing: border-box; padding: 0; }
.aplus-slider-clean-slide > * { max-width: 100%; }
.aplus-slider-clean-slide img { max-width: 100%; height: auto; display: block; }

.aplus-slider-clean-nav { display: flex; justify-content: center; align-items: center; gap: 16px; margin-top: 20px; }
.aplus-slider-clean-arrow { background: var(--bg-alt); border: 1px solid var(--border-light); border-radius: 50%; width: 44px; height: 44px; cursor: pointer; font-size: 1.4rem; display: inline-flex; align-items: center; justify-content: center; color: var(--ink); transition: all .15s; user-select: none; font-family: inherit; line-height: 1; padding: 0; }
.aplus-slider-clean-arrow:hover { background: var(--cta); color: #fff; border-color: var(--cta); }
.aplus-slider-clean-arrow:active { transform: scale(0.95); }
.aplus-slider-clean-dots { display: flex; gap: 8px; }
.aplus-slider-clean-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--border-light); cursor: pointer; border: none; padding: 0; transition: background .15s; }
.aplus-slider-clean-dot.active { background: var(--cta); width: 24px; border-radius: 5px; }

/* ═══ A+ Slider flèches en overlay sur image ═══ */
/* Flèches en overlay absolu sur les côtés du viewport */
.aplus-slider-clean { position: relative; }
.aplus-slider-clean .aplus-slider-clean-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  background: rgba(255,255,255,0.92);
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  width: 48px; height: 48px;
}
.aplus-slider-clean .aplus-slider-clean-arrow:hover {
  background: var(--cta);
  color: #fff;
}
.aplus-slider-clean .aplus-slider-clean-arrow:first-child { left: 16px; }
.aplus-slider-clean .aplus-slider-clean-arrow:last-child { right: 16px; }
/* Nav contient maintenant juste les dots, centrés sous le viewport */
.aplus-slider-clean .aplus-slider-clean-nav {
  position: static;
  margin-top: 16px;
  justify-content: center;
}

/* ═══ A+ images : fonds blancs se fondent avec fond shop ═══ */
/* Les images A+ Amazon ont souvent un fond blanc (photo catalog) qui ressort moche sur fond beige du shop.
   mix-blend-mode: multiply fait fondre les pixels blancs avec le fond beige derriere. */
.aplus-original-content .apm-flex-item-fourth-width img,
.aplus-original-content .apm-flex-item-third-width img,
.aplus-original-content .apm-flex-item-half-width img,
.aplus-original-content .premium-aplus-column img,
.aplus-original-content .apm-leftimage img,
.aplus-original-content .apm-hero-image img,
.aplus-original-content .aplus-card-image img {
  mix-blend-mode: multiply;
}
/* Pour le 1er module hero (grande image en haut), garder normal — souvent une scene lifestyle */
.aplus-original-content > .aplus-module:first-child img { mix-blend-mode: normal; }

/* ═══ A+ container + hero images : limite la largeur ═══ */
/* Limite la largeur du contenu A+ global (sinon les hero images Amazon prennent tout l'écran 1800px+) */
.aplus-original-content { max-width: 1400px !important; margin: 0 !important; }
/* Hero image en haut : full container width (= 970px max) au lieu de prendre tout l'écran */
.aplus-original-content .apm-hero-image img,
.aplus-original-content .aplus-card-image img,
.aplus-original-content > .aplus-module:first-child img {
  max-width: 100% !important;
  width: auto !important;
  height: auto !important;
  display: block;
  margin: 0 auto;
}

/* ═══ A+ Aligne à gauche (override le centrage) ═══ */
/* Override : aligne à gauche au lieu de centré (caractéristiques techniques en bas est à gauche, faut cohérence) */
.aplus-original-content { max-width: 1400px !important; margin: 0 !important; }
.aplus-original-content .apm-hero-image img,
.aplus-original-content .aplus-card-image img,
.aplus-original-content > .aplus-module:first-child img {
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* ═══ Section Commentaires avec images (avis clients) === customer-images-v1 === */
.product-customer-images { margin-bottom: 48px; max-width: 970px; }
.product-customer-images h2 { font-size: 1.5rem; font-weight: 700; color: #1a1a1a; margin: 0 0 6px; }
.customer-images-subtitle { font-size: .9rem; color: #666; margin: 0 0 18px; }
.customer-images-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 10px;
}
.customer-image-tile {
  appearance: none; border: 0; padding: 0; cursor: pointer;
  background: #f7f7f7; border-radius: 8px; overflow: hidden;
  aspect-ratio: 1 / 1;
  display: block;
  transition: transform .15s ease, box-shadow .15s ease;
}
.customer-image-tile:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
}
.customer-image-tile img {
  width: 100%; height: 100%; object-fit: cover;
  display: block;
}
@media (max-width: 768px) {
  .customer-images-grid { grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 6px; }
}

/* Lightbox plein écran */
.customer-images-lightbox {
  position: fixed; inset: 0;
  background: rgba(0, 0, 0, .92);
  z-index: 9999;
  display: none;
  align-items: center; justify-content: center;
}
.customer-images-lightbox.open { display: flex; }
.customer-images-lightbox .ci-lb-image {
  max-width: 90vw; max-height: 88vh;
  object-fit: contain;
  border-radius: 4px;
  box-shadow: 0 8px 32px rgba(0,0,0,.5);
}
.customer-images-lightbox .ci-lb-close,
.customer-images-lightbox .ci-lb-prev,
.customer-images-lightbox .ci-lb-next {
  position: absolute;
  background: rgba(255,255,255,.92);
  border: 0;
  cursor: pointer;
  font-size: 28px; font-weight: 400; line-height: 1;
  color: #1a1a1a;
  width: 48px; height: 48px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  transition: background .15s ease;
}
.customer-images-lightbox .ci-lb-close:hover,
.customer-images-lightbox .ci-lb-prev:hover,
.customer-images-lightbox .ci-lb-next:hover { background: #fff; }
.customer-images-lightbox .ci-lb-close { top: 24px; right: 24px; }
.customer-images-lightbox .ci-lb-prev { left: 24px; top: 50%; transform: translateY(-50%); }
.customer-images-lightbox .ci-lb-next { right: 24px; top: 50%; transform: translateY(-50%); }
.customer-images-lightbox .ci-lb-counter {
  position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%);
  color: #fff; font-size: .9rem;
  background: rgba(0,0,0,.5); padding: 6px 14px; border-radius: 14px;
}
@media (max-width: 600px) {
  .customer-images-lightbox .ci-lb-close { top: 14px; right: 14px; }
  .customer-images-lightbox .ci-lb-prev { left: 8px; }
  .customer-images-lightbox .ci-lb-next { right: 8px; }
}


/* ═══ Section Commentaires avec images (avis clients) === customer-images-v1 === */
.product-customer-images { margin-bottom: 48px; max-width: 970px; }
.product-customer-images h2 { font-size: 1.5rem; font-weight: 700; color: #1a1a1a; margin: 0 0 6px; }
.customer-images-subtitle { font-size: .9rem; color: #666; margin: 0 0 18px; }
.customer-images-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 10px;
}
.customer-image-tile {
  appearance: none; border: 0; padding: 0; cursor: pointer;
  background: #f7f7f7; border-radius: 8px; overflow: hidden;
  aspect-ratio: 1 / 1;
  display: block;
  transition: transform .15s ease, box-shadow .15s ease;
}
.customer-image-tile:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
}
.customer-image-tile img {
  width: 100%; height: 100%; object-fit: cover;
  display: block;
}
@media (max-width: 768px) {
  .customer-images-grid { grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 6px; }
}

/* Lightbox plein écran */
.customer-images-lightbox {
  position: fixed; inset: 0;
  background: rgba(0, 0, 0, .92);
  z-index: 9999;
  display: none;
  align-items: center; justify-content: center;
}
.customer-images-lightbox.open { display: flex; }
.customer-images-lightbox .ci-lb-image {
  max-width: 90vw; max-height: 88vh;
  object-fit: contain;
  border-radius: 4px;
  box-shadow: 0 8px 32px rgba(0,0,0,.5);
}
.customer-images-lightbox .ci-lb-close,
.customer-images-lightbox .ci-lb-prev,
.customer-images-lightbox .ci-lb-next {
  position: absolute;
  background: rgba(255,255,255,.92);
  border: 0;
  cursor: pointer;
  font-size: 28px; font-weight: 400; line-height: 1;
  color: #1a1a1a;
  width: 48px; height: 48px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  transition: background .15s ease;
}
.customer-images-lightbox .ci-lb-close:hover,
.customer-images-lightbox .ci-lb-prev:hover,
.customer-images-lightbox .ci-lb-next:hover { background: #fff; }
.customer-images-lightbox .ci-lb-close { top: 24px; right: 24px; }
.customer-images-lightbox .ci-lb-prev { left: 24px; top: 50%; transform: translateY(-50%); }
.customer-images-lightbox .ci-lb-next { right: 24px; top: 50%; transform: translateY(-50%); }
.customer-images-lightbox .ci-lb-counter {
  position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%);
  color: #fff; font-size: .9rem;
  background: rgba(0,0,0,.5); padding: 6px 14px; border-radius: 14px;
}
@media (max-width: 600px) {
  .customer-images-lightbox .ci-lb-close { top: 14px; right: 14px; }
  .customer-images-lightbox .ci-lb-prev { left: 8px; }
  .customer-images-lightbox .ci-lb-next { right: 8px; }
}

/* ═══ Section avis clients avec photos === customer-reviews-v2 === */
/* Mirror du style homepage testimonials, mais avec photo au-dessus + adapté au fond clair */
.product-customer-reviews { margin-bottom: 48px; }
.product-customer-reviews h2 { font-size: 1.5rem; font-weight: 700; color: #1a1a1a; margin: 0 0 6px; }
.customer-reviews-subtitle { font-size: .9rem; color: #666; margin: 0 0 22px; }

.customer-reviews-row {
  display: flex;
  flex-wrap: nowrap;
  gap: 18px;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 4px 4px 18px;
  margin: 0 -4px;
  scroll-snap-type: x proximity;
  scroll-padding: 4px;
  -webkit-overflow-scrolling: touch;
}
.customer-reviews-row::-webkit-scrollbar { height: 8px; }
.customer-reviews-row::-webkit-scrollbar-track { background: rgba(0,0,0,.04); border-radius: 4px; }
.customer-reviews-row::-webkit-scrollbar-thumb { background: rgba(0,0,0,.2); border-radius: 4px; }
.customer-reviews-row::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,.35); }
.customer-reviews-row { scrollbar-width: thin; }

.customer-review-card {
  flex: 0 0 320px;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--border-light, #e6e0d4);
  border-radius: var(--radius, 12px);
  padding: 0;
  overflow: hidden;
}
.customer-review-image {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  background: #f4f1e8;
  border: 0;
  padding: 0;
  cursor: pointer;
  overflow: hidden;
}
.customer-review-image img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .3s ease;
}
.customer-review-image:hover img { transform: scale(1.04); }

.customer-review-stars {
  color: #ff9900;
  font-size: 1.05rem;
  letter-spacing: 2px;
  padding: 18px 22px 0;
}
.customer-review-stars .star-empty { color: #e0d8c8; }

.customer-review-text {
  font-style: italic;
  color: #4a4a4a;
  margin: 10px 0 16px;
  padding: 0 22px;
  line-height: 1.65;
  font-size: .95rem;
  flex: 1 0 auto;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.customer-review-author {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: auto;
  padding: 0 22px 22px;
}
.customer-review-avatar-wrap {
  width: 44px; height: 44px;
  flex-shrink: 0;
  position: relative;
}
.customer-review-avatar {
  width: 44px; height: 44px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--accent, #C8956D);
}
.customer-review-author strong {
  display: block;
  color: #1a1a1a;
  font-weight: 600;
  font-size: .95rem;
}
.customer-review-loc {
  display: block;
  font-size: .8rem;
  color: #888;
  margin-top: 2px;
}

@media (max-width: 600px) {
  .customer-review-card { flex: 0 0 280px; }
}

/* ═══ Variants Amazon (couleur + taille) === variants-v1 === */
.product-variants .variant-current { font-weight: 400; color: #888; margin-left: 6px; font-size: .85rem; }
.product-variants .variant-options { display: flex; flex-wrap: wrap; gap: 8px; }

/* Variant text button (taille, style) */
.variant-btn {
  appearance: none;
  display: inline-flex;
  align-items: center; justify-content: center;
  min-width: 56px;
  padding: 8px 14px;
  background: #fff;
  border: 1.5px solid var(--border-light, #e6e0d4);
  border-radius: var(--radius-sm, 8px);
  color: #1a1a1a;
  font-size: .9rem;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition: border-color .15s ease, transform .1s ease;
}
.variant-btn:hover { border-color: var(--cta, #6b8e3d); }
.variant-btn.active {
  border-color: var(--cta, #6b8e3d);
  border-width: 2px;
  padding: 7px 13px;  /* compense l'augmentation de bord */
  background: rgba(107, 142, 61, 0.06);
}
.variant-btn.unavailable {
  opacity: .4;
  cursor: not-allowed;
  text-decoration: line-through;
}

/* Variant photo swatch (couleur) */
.variant-btn-photo {
  padding: 4px;
  min-width: auto;
  width: 56px; height: 56px;
  overflow: hidden;
}
.variant-btn-photo img {
  width: 100%; height: 100%;
  object-fit: cover;
  border-radius: 4px;
  display: block;
}
.variant-btn-photo.active {
  padding: 3px;
  outline: 2px solid var(--cta, #6b8e3d);
  outline-offset: 1px;
}

/* Variantes pas en stock : cliquables pour aperçu (image swap) — ns 2026-06-07 */
.variant-btn.not-in-shop {
  opacity: .75;
  cursor: pointer;
  border-style: dashed;
  border-color: #ccc;
}
.variant-btn.not-in-shop:hover {
  border-color: var(--cta, #6b8e3d);
  opacity: 1;
}
.variant-btn.not-in-shop.active {
  border-style: solid;
  opacity: 1;
}

/* ═══ Mobile UX cleanup === mobile-cleanup-v1 === */
@media (max-width: 768px) {
  /* 1) Cache le fil d'Ariane sur mobile (prend trop de place) */
  .breadcrumb { display: none !important; }

  /* 2) Reassurance compactée : 3 lignes courtes avec bullets, taille réduite */
  .product-reassurance {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 8px !important;
    background: transparent !important;
    border: none !important;
    padding: 12px 0 6px !important;
    margin: 12px 0 !important;
  }
  .product-reassurance .reassurance-item {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: left !important;
    gap: 10px !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    font-size: .9rem !important;
    font-weight: 500 !important;
    color: #4a4a4a !important;
    box-shadow: none !important;
  }
  .product-reassurance .reassurance-item::before {
    content: "•" !important;
    color: var(--cta, #6b8e3d) !important;
    font-size: 1.5rem !important;
    line-height: 0 !important;
    flex-shrink: 0 !important;
  }
  .product-reassurance .reassurance-icon {
    font-size: 1.1rem !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
  }
  .product-reassurance .reassurance-item > span:last-child {
    flex: 1 !important;
    line-height: 1.4 !important;
  }
}

/* === mobile-overflow-fix v1 === Grid items doivent rétrécir sous leur contenu intrinsèque */
@media (max-width: 768px) {
  .product-top, .product-top > * { min-width: 0; max-width: 100%; }
  .product-gallery, .product-main-image, .gallery-swiper { width: 100%; max-width: 100%; min-width: 0; overflow: hidden; }
  .product-info { min-width: 0; max-width: 100%; }
}

/* === mobile-highlights-order v1 (ns rule 2026-05-31) ===
   Sur mobile, déplacer .product-highlights SOUS .product-reassurance ("Garantie 5 ans")
   au lieu de juste sous le prix. .product-info est déjà flex-column donc CSS order suffit. */
@media (max-width: 768px) {
  .product-info .product-highlights { order: 10; }
  .product-info .product-manual-link { order: 11; }
}

/* === header-search-v1 === Recherche inline desktop + loupe SVG */
.header-search-inline {
  display: flex;
  align-items: center;
  background: rgba(255,255,255,0.6);
  border: 1px solid var(--border-light, #e6e0d4);
  border-radius: 999px;
  padding: 0 6px 0 14px;
  height: 38px;
  width: 240px;
  transition: border-color .15s ease, background .15s ease;
}
.header-search-inline:focus-within {
  border-color: var(--cta, #6b8e3d);
  background: #fff;
}
.header-search-inline input {
  flex: 1;
  border: 0;
  background: transparent;
  outline: none;
  font-size: .9rem;
  color: var(--ink, #1a1a1a);
  min-width: 0;
}
.header-search-inline input::placeholder { color: #999; font-style: normal; }
.header-search-inline button {
  background: transparent;
  border: 0;
  padding: 6px;
  cursor: pointer;
  color: var(--ink, #1a1a1a);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.header-search-inline button:hover { color: var(--cta, #6b8e3d); }

/* Mobile : cache search inline, montre juste le bouton loupe */
.header-icon-search-mobile { display: none; }
@media (max-width: 900px) {
  .header-search-inline { display: none; }
  .header-icon-search-mobile { display: inline-flex; align-items: center; justify-content: center; }
}

/* SVG dans header-icon-btn : couleur + alignement */
.header-icon-btn svg { display: block; color: currentColor; }

/* === cart-fly-animation v1 === Animation produit qui vole vers le panier au clic */
@keyframes flyToCart {
  0%   { transform: translate(0, 0) scale(1); opacity: 1; }
  60%  { opacity: 0.85; }
  100% { transform: var(--fly-translate, translate(0, -300px)) scale(0.2); opacity: 0; }
}
.cart-fly-clone {
  position: fixed;
  z-index: 9999;
  pointer-events: none;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0,0,0,0.25);
  animation: flyToCart 0.7s cubic-bezier(.5,-0.1,.7,1) forwards;
  background: #fff;
}
.cart-fly-clone img {
  width: 100%; height: 100%;
  object-fit: cover;
}
@keyframes cartBump {
  0%   { transform: scale(1); }
  35%  { transform: scale(1.25) rotate(-6deg); }
  60%  { transform: scale(0.92) rotate(3deg); }
  100% { transform: scale(1); }
}
#cart-toggle.cart-bump { animation: cartBump 0.5s ease-out; }
.cart-count.cart-pop {
  animation: cartBump 0.4s ease-out;
}

/* === category-cards-redesign v1 === Castorama-style : image full-square + texte dehors */
.category-page .product-card {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  overflow: visible !important;
  box-shadow: none !important;
  transition: transform .15s ease;
}
.category-page .product-card:hover {
  transform: translateY(-3px);
}
.category-page .product-card-image {
  background: #fff !important;
  border: 1px solid var(--border-light, #e6e0d4);
  border-radius: 10px;
  padding: 0 !important;
  aspect-ratio: 1 !important;
  overflow: hidden;
  position: relative;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.category-page .product-card:hover .product-card-image {
  border-color: var(--cta, #6b8e3d);
  box-shadow: 0 6px 16px rgba(0,0,0,0.08);
}
.category-page .product-card-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  padding: 8px !important;
  display: block;
}
.category-page .product-card-body {
  padding: 10px 4px 4px !important;
  gap: 2px !important;
  background: transparent !important;
  border: none !important;
}
.category-page .product-card-title {
  font-size: .95rem !important;
  font-weight: 600 !important;
  color: var(--ink, #1a1a1a) !important;
  margin: 0 0 2px !important;
  line-height: 1.3 !important;
  min-height: 0 !important;
}
.category-page .product-card-price-row {
  display: flex !important;
  align-items: baseline !important;
  gap: 8px !important;
  margin-top: auto !important;
}
.category-page .price-current {
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  color: var(--ink, #1a1a1a) !important;
  order: 0;
}
.category-page .price-original {
  font-size: .85rem !important;
  color: #999 !important;
  text-decoration: line-through;
  order: 1;
}
/* Badges positionnés sur le coin top-left de l'image card */
.category-page .product-card-badges {
  top: 8px !important;
  left: 8px !important;
}

/* === category-toolbar-redesign v4 === Toolbar entière scrollable horizontal */
.category-toolbar {
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  flex-wrap: nowrap;
  margin-bottom: 16px;
  padding: 8px 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  cursor: grab;
  user-select: none;
}
.category-toolbar.dragging { cursor: grabbing; }
.category-toolbar::-webkit-scrollbar { display: none; }
.category-toolbar > * { flex-shrink: 0; }
/* Plus de wrapper interne, les pills sont juste flex enfants */
.quick-pills-wrap { position: static; flex: 0 0 auto; display: contents; }
.quick-pills-wrap::after, .quick-pills-wrap::before { display: none; }
.quick-filter-pills { display: contents; }
/* Sur desktop : la sidebar est déjà visible → cacher le bouton Filtres */
@media (min-width: 769px) {
  #filters-mobile-toggle.cat-tool-btn { display: none !important; }
}
.category-toolbar .category-count,
.category-toolbar .category-filters { display: none !important; }
/* Boutons identiques "Filtres" et "Trier par" */
.cat-tool-btn {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  background: #fff !important;
  color: var(--ink, #1a1a1a) !important;
  border: 1px solid var(--border-light, #d9d2c2) !important;
  border-radius: 999px !important;
  padding: 8px 18px !important;
  font-size: .9rem !important;
  font-weight: 600 !important;
  cursor: pointer;
  transition: border-color .15s, background .15s;
  white-space: nowrap;
}
.cat-tool-btn:hover {
  border-color: var(--ink, #1a1a1a) !important;
  background: #f8f4ec !important;
}
/* Icône entonnoir pour Filtres */
#filters-mobile-toggle.cat-tool-btn::before {
  content: "";
  width: 14px; height: 14px;
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3'/%3E%3C/svg%3E");
  -webkit-mask-size: contain; mask-size: contain;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
}
/* Sort dropdown menu */
.sort-dropdown { position: relative; display: inline-block; }
.sort-menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  background: #fff;
  border: 1px solid var(--border-light, #d9d2c2);
  border-radius: 12px;
  padding: 6px;
  margin: 0;
  list-style: none;
  min-width: 180px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.1);
  z-index: 100;
}
.sort-menu li {
  padding: 8px 14px;
  border-radius: 8px;
  font-size: .9rem;
  cursor: pointer;
  color: var(--ink, #1a1a1a);
  user-select: none;
}
.sort-menu li:hover { background: #f4f1e8; }
.sort-menu li[aria-selected="true"] { font-weight: 700; color: var(--cta, #6b8e3d); }
.sort-menu li[aria-selected="true"]::after { content: " ✓"; }

/* === category-side-padding-reduce v4 === ultra serré à gauche */
@media (max-width: 768px) {
  .category-page,
  .category-page section,
  .category-page .container,
  .category-page > .container,
  .category-layout { padding-left: 4px !important; padding-right: 4px !important; margin-left: 0 !important; margin-right: 0 !important; }
  .product-grid { gap: 8px !important; }
  .category-toolbar { margin-left: 0 !important; padding-left: 0 !important; }
}

/* === quick-filter-pills v3 === Inline slider + chevron scroll hint */
.quick-pills-wrap {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
  margin-left: -2px;
}
.quick-pills-wrap::after {
  content: "";
  position: absolute;
  top: 0; right: 0;
  width: 36px; height: 100%;
  pointer-events: none;
  background: linear-gradient(to left, var(--bg, #faf6ee) 30%, transparent);
  z-index: 2;
}
.quick-pills-wrap::before {
  content: "›";
  position: absolute;
  top: 50%; right: 8px;
  transform: translateY(-50%);
  z-index: 3;
  font-size: 1.4rem;
  color: var(--ink, #1a1a1a);
  pointer-events: none;
  font-weight: 700;
  line-height: 1;
}
.quick-filter-pills {
  display: flex;
  flex-wrap: nowrap;
  gap: 6px;
  margin: 0;
  padding: 0 32px 0 4px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.quick-filter-pills::-webkit-scrollbar { display: none; }
.quick-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: var(--ink, #1a1a1a);
  border: 1px solid var(--border-light, #d9d2c2);
  border-radius: 999px;
  padding: 6px 14px;
  font-size: .85rem;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background .15s, border-color .15s, color .15s;
}
.quick-pill:hover {
  border-color: var(--ink, #1a1a1a);
  background: #f8f4ec;
}
.quick-pill.active {
  background: var(--cta, #6b8e3d);
  border-color: var(--cta, #6b8e3d);
  color: #fff;
  font-weight: 600;
}
/* overflow: visible removed — toolbar needs overflow-x: auto pour scroller */

/* === pills-drag-cursor v1 === Curseur drag pour scrolling souris */
.quick-filter-pills { cursor: grab; user-select: none; }
.quick-filter-pills.dragging { cursor: grabbing; }
.quick-filter-pills.dragging .quick-pill { pointer-events: none; }

/* === toolbar-arrows-v1 === Flèches navigation cliquables */
.toolbar-wrap { position: relative; margin-bottom: 16px; }
.toolbar-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #fff;
  border: 1px solid var(--border-light, #d9d2c2);
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  color: var(--ink, #1a1a1a);
  cursor: pointer;
  z-index: 10;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: background .15s;
}
.toolbar-arrow:hover { background: #f8f4ec; }
.toolbar-arrow[hidden] { display: none; }
.toolbar-arrow-left { left: -4px; }
.toolbar-arrow-right { right: -4px; }
/* Gradient fade pour estomper les bords pendant le scroll */
.toolbar-wrap::before,
.toolbar-wrap::after {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  width: 32px;
  pointer-events: none;
  z-index: 5;
  transition: opacity .2s;
}
.toolbar-wrap::before {
  left: 0;
  background: linear-gradient(to right, var(--bg, #faf6ee), transparent);
  opacity: 0;
}
.toolbar-wrap::after {
  right: 0;
  background: linear-gradient(to left, var(--bg, #faf6ee), transparent);
  opacity: 1;
}
.toolbar-wrap.scrolled-start::before { opacity: 1; }
.toolbar-wrap.scrolled-end::after { opacity: 0; }
/* Padding minimal à gauche (flèche gauche s'overlay sur le contenu déjà scrollé) */
.toolbar-wrap .category-toolbar { padding-left: 2px !important; padding-right: 36px !important; }

/* === discount-badge-v1 === Badge réduction top-left de l'image, style sekholia */
.product-card-discount {
  position: absolute;
  top: 8px;
  left: 8px;
  background: #d93636;
  color: #fff;
  font-weight: 700;
  font-size: .8rem;
  padding: 4px 8px;
  border-radius: 4px;
  z-index: 3;
  letter-spacing: .02em;
  box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

/* === footer-mobile-hide-catalogue === Cache la col "Catalogue" sur mobile */
@media (max-width: 768px) {
  .footer-col:has(h4):where(*:has(h4:is(:contains('Catalogue')))) { display: none; }
}
/* Fallback : cache toute col dont le h4 contient "Catalogue" via JS (CSS :contains pas supporté) */

/* === toolbar-ultra-tight === Réduit encore l'espace Filtres-Trier-pills */
@media (max-width: 768px) {
  .category-toolbar { gap: 4px !important; padding-left: 0 !important; }
  .toolbar-wrap .category-toolbar { padding-left: 0 !important; padding-right: 30px !important; }
  .toolbar-arrow-right { right: 0 !important; }
  /* Boutons Filtres / Trier par plus compacts */
  .cat-tool-btn { padding: 7px 12px !important; font-size: .85rem !important; }
  .cat-tool-btn-dropdown svg { margin-left: 2px; }
}


/* === category-white-bg v1 === Fond blanc sur les pages catégorie */
body:has(.category-page) { background: #fff !important; }
.category-page { background: #fff !important; }

/* === product-accordion v3 === Accordéons UNIQUEMENT pour specs/livraison/garantie/faq (pas description, features, customer_images, related) */
.product-content > section[data-section="specs"],
.product-content > section[data-section="livraison"],
.product-content > section[data-section="garantie"],
.product-content > section[data-section="faq"] {
  border-top: 1px solid var(--border-light, #e6e0d4);
  margin: 0 !important;
  padding: 0 !important;
}
.product-content > section[data-section="faq"] {
  border-bottom: 1px solid var(--border-light, #e6e0d4);
}
.product-content > section[data-section="specs"] > h2,
.product-content > section[data-section="livraison"] > h2,
.product-content > section[data-section="garantie"] > h2,
.product-content > section[data-section="faq"] > h2 {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  margin: 0 !important;
  padding: 18px 16px !important;
  font-size: 1.05rem !important;
  font-weight: 700;
  cursor: pointer;
  position: relative;
  list-style: none;
  text-align: left !important;
  border: none !important;
}
.product-content > section[data-section="specs"] > h2::after,
.product-content > section[data-section="livraison"] > h2::after,
.product-content > section[data-section="garantie"] > h2::after,
.product-content > section[data-section="faq"] > h2::after {
  content: "";
  width: 16px; height: 16px;
  flex-shrink: 0;
  background-color: var(--ink, #1a1a1a);
  -webkit-mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  -webkit-mask-size: contain; mask-size: contain;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  transition: transform .25s ease;
}
.product-content > section[data-section="specs"].is-open > h2::after,
.product-content > section[data-section="livraison"].is-open > h2::after,
.product-content > section[data-section="garantie"].is-open > h2::after,
.product-content > section[data-section="faq"].is-open > h2::after { transform: rotate(180deg); }
.product-content > section[data-section="specs"] > *:not(h2),
.product-content > section[data-section="livraison"] > *:not(h2),
.product-content > section[data-section="garantie"] > *:not(h2),
.product-content > section[data-section="faq"] > *:not(h2) {
  display: none !important;
  padding: 0 16px 18px;
}
.product-content > section[data-section="specs"].is-open > *:not(h2),
.product-content > section[data-section="livraison"].is-open > *:not(h2),
.product-content > section[data-section="garantie"].is-open > *:not(h2),
.product-content > section[data-section="faq"].is-open > *:not(h2) {
  display: block !important;
}
.product-content > section[data-section="specs"].is-open .specs-table { display: table !important; }

/* Info lists (Livraison / Garantie) */
.info-list { list-style: none; padding: 0; margin: 0; }
.info-list li {
  padding: 12px 0;
  border-bottom: 1px solid var(--border-light, #f0ede5);
  font-size: .95rem;
  line-height: 1.6;
  color: var(--ink, #1a1a1a);
}
.info-list li:last-child { border-bottom: none; }

/* === discount-badge color v2 === Couleur du site (var(--cta)) au lieu du rouge */
.product-card-discount { background: var(--cta, #6b8e3d) !important; }

/* === reassurance-box-v2 === Box style sekholia avec icônes SVG */
@media (max-width: 768px) {
  .product-reassurance {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    background: #fff !important;
    border: 1px solid var(--border-light, #e6e0d4) !important;
    border-radius: 12px !important;
    padding: 6px 16px !important;
    margin: 16px 0 !important;
    gap: 0 !important;
  }
  .product-reassurance .reassurance-item {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: left !important;
    gap: 14px !important;
    padding: 14px 0 !important;
    background: transparent !important;
    border: none !important;
    border-bottom: 1px dashed var(--border-light, #e6e0d4) !important;
    border-radius: 0 !important;
    font-size: .9rem !important;
    font-weight: 400 !important;
    color: var(--ink, #1a1a1a) !important;
    box-shadow: none !important;
  }
  .product-reassurance .reassurance-item:last-child { border-bottom: none !important; }
  .product-reassurance .reassurance-item::before { content: none !important; display: none !important; }
  .product-reassurance .reassurance-icon {
    width: 36px; height: 36px;
    background: var(--bg-alt, #f4f1e8);
    border-radius: 50%;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    color: var(--cta, #6b8e3d);
    flex-shrink: 0 !important;
    margin: 0 !important;
    font-size: inherit !important;
  }
  .product-reassurance .reassurance-icon svg { display: block; }
  .product-reassurance .reassurance-item > span:last-child {
    flex: 1 !important;
    line-height: 1.4 !important;
    color: var(--ink, #1a1a1a);
  }
  .product-reassurance .reassurance-item strong { color: var(--ink, #1a1a1a); font-weight: 700; }
}

/* === product-amazon-link bottom === Lien Amazon en bas, discret */
.product-amazon-link-bottom {
  text-align: center;
  margin: 32px 0 20px;
  padding: 12px 0;
  border-top: 1px solid var(--border-light, #e6e0d4);
}
.product-amazon-link-bottom a {
  color: #888;
  font-size: .82rem;
  text-decoration: none;
}
.product-amazon-link-bottom a:hover { color: var(--cta, #6b8e3d); text-decoration: underline; }

/* === product-page-white-bg v1 === Fond blanc sur les pages produit (pas beige) */
body:has(.product-page) { background: #fff !important; }
.product-page { background: #fff !important; }

/* === stock-cta-badge v3 (ns rule 2026-05-31) === Stock juste au-dessus du CTA, noir */
.product-stock-cta {
  margin: 6px 0 8px !important;
  padding: 0 !important;
}
.product-stock-cta .stock-low,
.product-stock-cta .stock-out {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 1rem;
  color: #111 !important;
  font-weight: 600;
}
.product-stock-cta .stock-low strong { font-weight: 700; font-size: 1.05rem; color: #111 !important; }
@media (max-width: 768px) {
  .product-stock-cta { margin: 4px 0 6px !important; }
  /* Resserre espace après le bloc reassurance avant la 1ère section */
  .product-reassurance { margin-bottom: 8px !important; }
  .product-content { margin-top: 0 !important; padding-top: 0 !important; }
  .product-top { margin-bottom: 0 !important; }
  .product-info { margin-bottom: 0 !important; padding-bottom: 0 !important; }
}

/* === product-page-top-spacing v1 (ns rule 2026-05-31) === Resserre l'espace entre header et photo produit */
.product-page { padding-top: 16px !important; }
@media (max-width: 768px) {
  .product-page { padding-top: 8px !important; }
}

/* === announcement-bar-one-line v1 (ns rule 2026-05-31) === Banner top TOUJOURS sur 1 ligne sur mobile, peu importe le texte */
@media (max-width: 768px) {
  .announcement-bar { padding: 8px 12px !important; font-size: .78rem !important; }
  .announcement-bar .container { padding-left: 0 !important; padding-right: 0 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
  .announcement-bar a, .announcement-bar span { display: block !important; max-width: 100% !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
}

/* === faq-answer-paragraphs v1 (ns rule 2026-05-31) === 1 ligne par point + saut de ligne entre points */
.faq-answer p { margin: 0 0 8px; line-height: 1.55; }
.faq-answer p:last-child { margin-bottom: 0; }
.faq-answer p + p { margin-top: 4px; }

/* === reassurance-one-line v1 (ns rule 2026-06-05) === Chaque item du bloc reassurance
   DOIT tenir sur 1 ligne en desktop. Inline le strong + reduce font + nowrap. */
@media (min-width: 769px) {
  .product-reassurance .reassurance-item {
    white-space: nowrap !important;
    overflow: hidden;
    font-size: 0.92rem !important;
    padding: 12px 16px !important;
  }
  .product-reassurance .reassurance-item strong {
    display: inline !important;
    margin-bottom: 0 !important;
  }
  .product-reassurance .reassurance-item > span:not(.reassurance-icon) {
    text-overflow: ellipsis;
    overflow: hidden;
    min-width: 0;
    flex: 1;
  }
  .product-reassurance .reassurance-icon {
    font-size: 1.4rem !important;
  }
}

/* === faq-accordion-fix === FAQ section h2 alignée comme les autres + padding correct */
@media (max-width: 768px) {
  .product-content > section.product-faq > h2 {
    padding: 18px 16px !important;
    margin: 0 !important;
    text-align: left !important;
    border: none !important;
    text-decoration: none !important;
  }
  .product-content > section.product-faq > h2::before,
  .product-content > section.product-faq > h2::after {
    /* assure que ::after pointe vers le chevron de l'accordéon, pas le underline de section-title */
  }
  .product-content > section.product-faq > h2::after {
    background-color: var(--ink, #1a1a1a) !important;
  }
  /* Liste FAQ : pas de bordure de section-title */
  .product-content > section.product-faq .faq-list {
    padding: 0 16px 18px !important;
    max-width: none !important;
  }
  .product-content > section.product-faq .faq-item {
    border-bottom: 1px solid var(--border-light, #f0ede5);
  }
  .product-content > section.product-faq .faq-question {
    padding: 14px 0 !important;
    font-size: .92rem !important;
  }
  .product-content > section.product-faq .faq-answer {
    padding-bottom: 14px !important;
    font-size: .9rem !important;
  }
}

/* === aplus-premium-module-fix v3 === Zero gap, image naturelle, vire les divs empty */
.aplus-original-content [class*="premium-module-2"],
.aplus-original-content .premium-aplus-module-2,
.aplus-original-content .premium-background-wrapper,
.aplus-original-content .background-image {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0;
}
.aplus-original-content [class*="premium-module-2"] > div,
.aplus-original-content .premium-aplus-module-2 > div {
  margin: 0 !important;
  padding: 0 !important;
}
.aplus-original-content .background-image img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  vertical-align: top;
}
/* Vire les divs vides qui créent de l'espace */
.aplus-original-content .a-section.a-text-center:empty,
.aplus-original-content .a-section.a-text-center:not(:has(*:not(br))),
.aplus-original-content div:empty,
.aplus-original-content .a-section:not(:has(img)):not(:has(p)):not(:has(h1)):not(:has(h2)):not(:has(h3)):not(:has(h4)) {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* === hide-jsonld-script === Les script JSON-LD ne doivent JAMAIS être visibles */
script[type="application/ld+json"] { display: none !important; }

/* === product-accordions-title v1 === Titre umbrella au-dessus des accordéons */
.product-accordions-title {
  font-family: var(--font-heading, 'Instrument Sans');
  font-size: 2rem;
  font-weight: 700;
  margin: 32px 0 12px;
  padding: 0;
  color: var(--ink, #1a1a1a);
}
@media (max-width: 768px) {
  .product-accordions-title { font-size: 1.5rem; }
}

/* === faq-full-fix v1 === FAQ plein-texte (sous A+) alignée à gauche + espace au-dessus */
.product-faq-full {
  margin-top: 60px !important;
  text-align: left !important;
  padding: 0 !important;
}
.product-faq-full .section-title {
  text-align: left !important;
  margin-bottom: 24px !important;
}
.product-faq-full .faq-list {
  max-width: none !important;
  margin: 0 !important;
  text-align: left !important;
}
.product-faq-full .faq-question {
  text-align: left !important;
}

/* === faq-fix-v4 === Reset max-width + margin pour aligner FAQ accordéon à gauche sur DESKTOP */
.product-faq[data-section="faq"] .faq-list {
  max-width: none !important;
  margin: 0 !important;
  text-align: left !important;
}
.product-faq[data-section="faq"] .faq-question,
.product-faq[data-section="faq"] .faq-answer,
.product-faq[data-section="faq"] .faq-item {
  text-align: left !important;
}
.product-faq[data-section="faq"] .faq-question {
  justify-content: flex-start !important;
}
/* Encore plus d'espace entre A+ et FAQ-full */
.product-faq-full { margin-top: 120px !important; }

/* === post-accordion-spacing v1 === Espace entre les accordéons et la section suivante (A+ / description) */
.product-content > .product-aplus,
.product-content > .product-description,
.product-content > .product-features {
  margin-top: 80px;
}

/* === specs-bottom v1 === Caractéristiques détaillées en pleine largeur sous FAQ (quand pas d'A+) */
.product-specs-bottom {
  margin-top: 80px;
  margin-bottom: 60px;
  padding: 0;
  text-align: left;
}
.product-specs-bottom .section-title {
  font-family: var(--font-heading, inherit);
  font-size: 2rem;
  font-weight: 700;
  margin: 0 0 28px;
  text-align: left;
  color: var(--ink, #1a1a1a);
}
.product-specs-bottom .specs-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .98rem;
}
.product-specs-bottom .specs-table tr {
  border-bottom: 1px solid var(--border-light, #e6e0d4);
}
.product-specs-bottom .specs-table th,
.product-specs-bottom .specs-table td {
  padding: 14px 18px;
  text-align: left;
  vertical-align: top;
  line-height: 1.5;
}
.product-specs-bottom .specs-table th {
  font-weight: 600;
  color: var(--ink, #1a1a1a);
  width: 38%;
  background: transparent;
}
.product-specs-bottom .specs-table td {
  color: var(--muted, #555);
}
@media (max-width: 768px) {
  .product-specs-bottom { margin-top: 48px; }
  .product-specs-bottom .section-title { font-size: 1.5rem; }
  .product-specs-bottom .specs-table th,
  .product-specs-bottom .specs-table td {
    padding: 12px 14px;
    font-size: .92rem;
  }
  .product-specs-bottom .specs-table th { width: 45%; }
}

/* ──────────────────────────────────────────────────────────────────────
   Fix layout 3-colonnes A+ Amazon — wrapper `.apm-floatleft`
   ──────────────────────────────────────────────────────────────────────
   Certains modules A+ (ex: Outsunny B0GLP5HXDS) utilisent .apm-floatleft
   comme wrapper de 3 sous-colonnes (leftimage / rightthirdcol / centerthirdcol)
   au lieu de .apm-lefttwothirdswrap déjà géré plus haut. Sans cette règle,
   les 3 colonnes restent en float et s'empilent (texte "Contenu du colis"
   sous l'image au lieu d'être à côté). */
.aplus-original-content .apm-floatleft {
  display: flex !important;
  flex-wrap: wrap;
  gap: 16px;
  align-items: flex-start;
  float: none !important;
  margin: 0 0 16px 0 !important;
}
.aplus-original-content .apm-floatleft > .apm-leftimage,
.aplus-original-content .apm-floatleft > .apm-rightthirdcol,
.aplus-original-content .apm-floatleft > .apm-centerthirdcol {
  float: none !important;
  width: auto !important;
  max-width: 100% !important;
  flex: 1 1 240px;
  min-width: 0;
  padding: 0 !important;
  margin: 0 !important;
}
/* Ordre visuel Amazon : leftimage → centerthirdcol (description + bullets) → rightthirdcol (PAQUET + contenu).
   Dans le DOM Amazon, rightthirdcol vient AVANT centerthirdcol, donc on réordonne via `order`. */
.aplus-original-content .apm-floatleft > .apm-leftimage { order: 1; }
.aplus-original-content .apm-floatleft > .apm-centerthirdcol { order: 2; flex: 1.4 1 320px; }
.aplus-original-content .apm-floatleft > .apm-rightthirdcol { order: 3; flex: 0.8 1 200px; }
.aplus-original-content .apm-floatleft > .apm-leftimage img,
.aplus-original-content .apm-floatleft > .apm-rightthirdcol img,
.aplus-original-content .apm-floatleft > .apm-rightthirdcol-inner img {
  width: 100% !important;
  max-width: 100%;
  height: auto;
  display: block;
}
.aplus-original-content .apm-floatleft .apm-rightthirdcol-inner p {
  margin: 4px 0;
}
@media (max-width: 720px) {
  .aplus-original-content .apm-floatleft { flex-direction: column; gap: 16px; }
}

/* ═══════════════════════════════════════════════════════════════════
   PORTABLE-MERGE-20260608 — blocs ajoutés sur PC portable le 7 juin
   (refonte homepage : hero fullbleed + split-feature + responsive)
   ═══════════════════════════════════════════════════════════════════ */

/* === stock-top-badge v2 === Stock plus grand + marges resserrées */
.product-stock-top {
  margin: 4px 0 4px !important;
  padding: 0 !important;
}

/* Best-sellers : container plus contenu pour pas prendre toute la largeur */
.bestsellers > .container { max-width: 1240px; }

/* ─── Hero full-bleed (image plein écran, texte overlay) ─── */
.hero-fullbleed { position: relative; min-height: 90vh; display: flex; align-items: center; overflow: hidden; isolation: isolate; }
.hero-fullbleed > .container { width: 100%; }
.hero-fullbleed-bg { position: absolute; inset: 0; background-size: cover; background-position: center center; z-index: 0; transform: scale(1.02); will-change: transform; }
.hero-fullbleed-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0.55) 60%, rgba(0,0,0,0.7) 100%); z-index: 1; }
.hero-fullbleed-content { position: relative; z-index: 2; color: #fff; max-width: 620px; padding: clamp(60px, 8vw, 100px) 0; margin: 0; }
.hero-fullbleed-eyebrow { display: inline-flex; align-items: center; gap: 10px; font-size: 0.85rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(255,255,255,0.9); padding: 8px 16px; border: 1px solid rgba(255,255,255,0.35); border-radius: 999px; backdrop-filter: blur(4px); }
.hero-fullbleed-eyebrow-dot { width: 8px; height: 8px; border-radius: 50%; background: #6BC785; box-shadow: 0 0 12px rgba(107,199,133,0.7); }
.hero-fullbleed-title { font-family: var(--font-display, 'Instrument Sans', serif); font-size: clamp(2.5rem, 5.5vw, 4.2rem); line-height: 1.1; font-weight: 700; margin: 24px 0 20px; color: #fff; text-shadow: 0 2px 20px rgba(0,0,0,0.3); }
.hero-fullbleed-subtitle { font-size: clamp(1.05rem, 1.4vw, 1.25rem); line-height: 1.6; color: rgba(255,255,255,0.92); max-width: 600px; margin: 0 0 36px; }
.hero-fullbleed-ctas { display: flex; flex-wrap: wrap; gap: 14px; }
.hero-fullbleed-ctas .btn-ghost-light { background: rgba(255,255,255,0.12); color: #fff; border: 1.5px solid rgba(255,255,255,0.45); backdrop-filter: blur(6px); }
.hero-fullbleed-ctas .btn-ghost-light:hover { background: rgba(255,255,255,0.22); border-color: rgba(255,255,255,0.7); }
@media (max-width: 768px) {
  .hero-fullbleed { min-height: 75vh; }
  .hero-fullbleed-content { padding: 60px 0; }
  .hero-fullbleed-title { font-size: clamp(2rem, 9vw, 2.8rem); }
}

/* ─── Section split-feature (image + texte côte à côte style etevila) ─── */
.split-feature { padding: clamp(48px, 6vw, 80px) 0; background: var(--bg, #FAFAF8); }
.split-feature-inner { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(24px, 2.5vw, 44px); align-items: center; }
.split-feature--right .split-feature-inner { grid-template-columns: 1fr 1.1fr; }
.split-feature--right .split-feature-image { order: 2; }
.split-feature--right .split-feature-content { order: 1; }
.split-feature-image { position: relative; border-radius: 14px; overflow: hidden; aspect-ratio: 4/3; box-shadow: 0 8px 32px rgba(0,0,0,0.08); }
.split-feature-image img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.6s ease; }
.split-feature-image:hover img { transform: scale(1.03); }
.split-feature-badge { position: absolute; top: 18px; left: 18px; padding: 8px 16px; background: var(--ink, #1A1A1F); color: #fff; font-size: 0.78rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; border-radius: 999px; box-shadow: 0 4px 12px rgba(0,0,0,0.15); }
.split-feature-eyebrow { display: block; font-size: 0.82rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--accent, #2A6F4F); margin-bottom: 16px; }
.split-feature-title { font-family: var(--font-display, 'Instrument Sans', serif); font-size: clamp(1.8rem, 3vw, 2.6rem); line-height: 1.15; font-weight: 700; margin: 0 0 20px; color: var(--ink, #1A1A1F); }
.split-feature-text { font-size: 1.05rem; line-height: 1.65; color: var(--ink-muted, #555); margin: 0 0 28px; max-width: 520px; }
.split-feature-bullets { list-style: none; padding: 0; margin: 0 0 36px; display: flex; flex-direction: column; gap: 14px; }
.split-feature-bullets li { display: flex; align-items: flex-start; gap: 14px; font-size: 1rem; color: var(--ink, #1A1A1F); line-height: 1.5; }
.split-feature-check { flex-shrink: 0; width: 26px; height: 26px; border-radius: 50%; background: rgba(42, 111, 79, 0.12); color: var(--accent, #2A6F4F); display: inline-flex; align-items: center; justify-content: center; margin-top: 1px; }
.split-feature-cta { display: inline-flex; align-items: center; gap: 10px; }
@media (max-width: 900px) {
  .split-feature { padding: 56px 0; }
  .split-feature-inner, .split-feature--right .split-feature-inner { grid-template-columns: 1fr; gap: 36px; }
  .split-feature--right .split-feature-image { order: 1; }
  .split-feature--right .split-feature-content { order: 2; }
  .split-feature-image { aspect-ratio: 16/10; }
}

/* ═══════════════════════════════════════════════════════════════════
   A+ Amazon — Carousels & multi-column responsive (2026-06-11)
   Convertit les wrappers Amazon (carousel, blockGrid, etc.) en grid responsive.
   Désactive les flèches/dots de carousel (pas de JS Amazon importé chez nous).
   ═══════════════════════════════════════════════════════════════════ */

/* La zone A+ prend toute la largeur du container parent (au lieu de 1400px cap) */
.aplus-original-content { max-width: 100% !important; }

/* Tous les wrappers carousel Amazon → grid 4 colonnes responsive */
.aplus-original-content .apm-carousel,
.aplus-original-content .aplus-carousel,
.aplus-original-content .aplus-3p-carousel-anchor,
.aplus-original-content .a-carousel-container,
.aplus-original-content .a-carousel-viewport,
.aplus-original-content [class*="carousel-container"],
.aplus-original-content [class*="carousel-card-grid"],
.aplus-original-content [class*="a-carousel"] > ol,
.aplus-original-content [class*="a-carousel"] > ul {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(12px, 1.5vw, 24px) !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 24px 0 !important;
  list-style: none !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

/* Cartes individuelles du carousel : reset width Amazon */
.aplus-original-content [class*="carousel"] > li,
.aplus-original-content [class*="carousel"] > .a-carousel-card,
.aplus-original-content .apm-carousel > *,
.aplus-original-content .aplus-carousel > * {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  flex: none !important;
  margin: 0 !important;
  list-style: none !important;
}

/* Hide les contrôles de carousel (flèches gauche/droite + dots pagination) */
.aplus-original-content .a-carousel-controls,
.aplus-original-content .a-carousel-button,
.aplus-original-content .a-carousel-goto-prevpage,
.aplus-original-content .a-carousel-goto-nextpage,
.aplus-original-content .a-carousel-pagination,
.aplus-original-content .a-carousel-pagination-dots,
.aplus-original-content .a-carousel-row-inner,
.aplus-original-content [class*="carousel-control"],
.aplus-original-content [class*="carousel-button"],
.aplus-original-content [class*="carousel-pagination"],
.aplus-original-content [class*="carousel-arrow"] {
  display: none !important;
}

/* Block grids Amazon (apm-tablemodule-blockGrid, etc.) → grid responsive */
.aplus-original-content .apm-tablemodule-blockGrid,
.aplus-original-content .aplus-tech-block-grid,
.aplus-original-content [class*="blockGrid"] {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(12px, 1.5vw, 24px) !important;
  width: 100% !important;
  max-width: 100% !important;
}
.aplus-original-content [class*="blockGrid"] > * { width: 100% !important; max-width: 100% !important; min-width: 0 !important; }

/* Images dans les modules : remplissent leur cell */
.aplus-original-content [class*="carousel"] img,
.aplus-original-content [class*="blockGrid"] img,
.aplus-original-content .premium-aplus-four-column img,
.aplus-original-content .premium-aplus-three-column img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 8px;
}

/* Tablette : 2 colonnes */
@media (max-width: 1100px) {
  .aplus-original-content .apm-carousel,
  .aplus-original-content .aplus-carousel,
  .aplus-original-content [class*="carousel-container"],
  .aplus-original-content [class*="carousel-card-grid"],
  .aplus-original-content [class*="a-carousel"] > ol,
  .aplus-original-content [class*="a-carousel"] > ul,
  .aplus-original-content [class*="blockGrid"],
  .aplus-original-content .premium-aplus-four-column,
  .aplus-original-content .premium-aplus-three-column {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Mobile : 1 colonne */
@media (max-width: 600px) {
  .aplus-original-content .apm-carousel,
  .aplus-original-content .aplus-carousel,
  .aplus-original-content [class*="carousel-container"],
  .aplus-original-content [class*="carousel-card-grid"],
  .aplus-original-content [class*="a-carousel"] > ol,
  .aplus-original-content [class*="a-carousel"] > ul,
  .aplus-original-content [class*="blockGrid"] {
    grid-template-columns: 1fr !important;
  }
}

/* ═══ Fix layout cat sans sidebar (2026-06-11) ═══
   Quand hasFilters est false côté server, .category-sidebar n'est pas rendu.
   Sans ça, .category-main prend la col 240px du grid au lieu de toute la largeur.
   :only-child marche universellement (vs :has limité). */
.category-layout > .category-main:only-child {
  grid-column: 1 / -1;
  width: 100%;
}

/* ═══════════════════════════════════════════════════════════════════
   A+ Amazon — Mobile (≤768px) — ajouté 2026-06-12
   ═══════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .aplus-gallery { max-width: 100% !important; gap: 12px !important; padding: 0 8px; }
  .aplus-image { width: 100% !important; }
  .aplus-original-content { max-width: 100% !important; padding: 0 8px; box-sizing: border-box; }
  .aplus-original-content .apm-carousel,
  .aplus-original-content .aplus-carousel,
  .aplus-original-content .aplus-3p-carousel-anchor,
  .aplus-original-content .a-carousel-container,
  .aplus-original-content .a-carousel-viewport,
  .aplus-original-content [class*="carousel-container"],
  .aplus-original-content [class*="carousel-card-grid"],
  .aplus-original-content [class*="a-carousel"] > ol,
  .aplus-original-content [class*="a-carousel"] > ul,
  .aplus-original-content .apm-tablemodule-blockGrid,
  .aplus-original-content .aplus-tech-block-grid,
  .aplus-original-content [class*="blockGrid"] {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════
   Nav sous-dropdown imbriqué (3e niveau cat) — 2026-06-12
   ═══════════════════════════════════════════════════════════════════ */
.nav-dropdown-item-sub { position: relative; }
.nav-dropdown-item-has-sub { display: flex !important; justify-content: space-between; align-items: center; gap: 8px; }
.nav-sub-arrow { font-size: .75em; opacity: .55; transition: transform .15s ease, opacity .15s ease; }
.nav-dropdown-item-sub:hover .nav-sub-arrow { opacity: 1; transform: translateX(2px); }

.nav-dropdown-submenu {
  position: absolute;
  top: -8px;
  left: 100%;
  margin-left: 4px;
  min-width: 220px;
  background: var(--bg);
  border: 1px solid var(--border-light);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  padding: 8px;
  opacity: 0;
  visibility: hidden;
  transition: all var(--transition);
  z-index: 60;
}
.nav-dropdown-item-sub:hover > .nav-dropdown-submenu { opacity: 1; visibility: visible; }
.nav-dropdown-item-sub:hover > .nav-dropdown-item-has-sub { background: var(--bg-tint); color: var(--cta); }

/* Mobile drawer : indentation sous-cats */
.mobile-nav-cat-root { font-weight: 600 !important; margin-top: 8px; }
.mobile-nav-cat-sub { padding-left: 20px !important; font-size: .93rem !important; opacity: .92; }
.mobile-nav-cat-grand { padding-left: 40px !important; font-size: .88rem !important; opacity: .78; }

/* ═══════════════════════════════════════════════════════════════════
   A+ Amazon — cache les boutons "Acheter" cross-sell — 2026-06-12
   Garde le slider image + texte overlay, vire juste le CTA Amazon.
   ═══════════════════════════════════════════════════════════════════ */
.aplus-original-content .a-button,
.aplus-original-content .a-button-input,
.aplus-original-content .a-button-text,
.aplus-original-content .shoppable-asin-cta-button,
.aplus-original-content .aplus-card-cta,
.aplus-original-content [class*="-cta-button"],
.aplus-original-content [class*="buy-now"] {
  display: none !important;
}


/* NS 2026-07-06 review formatting */
.customer-review-text {
  white-space: pre-line !important;
  display: block !important;
  -webkit-line-clamp: unset !important;
  max-height: 320px;
  overflow-y: auto;
}
.customer-review-image {
  aspect-ratio: 4 / 3 !important;
  height: auto !important;
  max-height: 260px;
}
.customer-review-image img {
  object-fit: cover !important;
  object-position: center !important;
}


/* NS 2026-07-07 desc line spacing */
.desc-summary-paragraph .desc-line {
  margin: 0 0 12px 0 !important;
  line-height: 1.6;
}
.desc-summary-paragraph .desc-line:last-child { margin-bottom: 0 !important; }
/* NS 2026-07-08 : pilules variantes taille (non-couleur) */
.product-card-swatches .swatch-pill {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 44px; height: 26px; padding: 0 10px;
  font-size: 12px; font-weight: 500; color: #2a2a2a;
  background: #f4efe4; border: 1px solid #e0d5c1; border-radius: 6px;
  cursor: pointer; transition: border-color 0.15s ease, background 0.15s ease;
  white-space: nowrap; letter-spacing: 0.01em;
}
.product-card-swatches .swatch-pill:hover { background: #eae3d1; border-color: #c5b699; }
.product-card-swatches .swatch-pill.is-active { background: #2a2a2a; color: #fff; border-color: #2a2a2a; }
.product-card-swatches .swatch-pill.is-viewonly { cursor: default; opacity: 0.6; }
.product-card-swatches { gap: 6px; flex-wrap: wrap; }