/* ==========================================
   Marakush Shop — Fresh theme
   Fond #fafaf7, vert profond #1b4332
   Libre Baskerville (titres) + Manrope (corps)
   ========================================== */

/* Reset */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  color-scheme: light only;
  --bg: #fafaf7;
  --bg-alt: #f0efe9;
  --green: #1b4332;
  --green-light: #2d6a4f;
  --green-pale: #d8f3dc;
  --gold: #b68d40;
  --gold-light: #f5e6c8;
  --text: #1a1a1a;
  --text-muted: #6b6b6b;
  --white: #ffffff;
  --radius: 12px;
  --radius-sm: 8px;
  --shadow: 0 2px 12px rgba(0,0,0,0.06);
  --shadow-lg: 0 8px 32px rgba(0,0,0,0.10);
  --transition: 0.2s ease;
  --font-title: "Libre Baskerville", Georgia, serif;
  --font-body: "Manrope", -apple-system, sans-serif;
  --amber-bright: #c9a96e;
  --cream-soft: #f9f6ee;
  --cream-base: #f5f0e6;
  --amber-border: rgba(201, 169, 110, 0.35);
  --cream-ultralight: #fdfbf3;
  --amber-deep: #a07840;
}

html { overscroll-behavior: none; }
html:has(#catalogue-grid) { background: #070c09; }

body {
  font-family: var(--font-body);
  background: var(--bg);
  color: var(--text);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overscroll-behavior: none;
}

.container {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 20px;
}

/* ==========================================
   Age Gate
   ========================================== */
.age-gate {
  position: fixed; inset: 0;
  z-index: 9999;
  background: rgba(0,0,0,0.7);
  backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center;
}
.age-gate--hidden { display: none; }
.age-gate__card {
  background: var(--white);
  border-radius: var(--radius);
  padding: 48px 40px;
  text-align: center;
  max-width: 420px;
  box-shadow: var(--shadow-lg);
}
.age-gate__title {
  font-family: var(--font-title);
  font-size: 2rem;
  color: var(--green);
  margin-bottom: 16px;
}
.age-gate__text {
  color: var(--text-muted);
  font-size: 0.95rem;
  margin-bottom: 28px;
  line-height: 1.5;
}
.age-gate__buttons { display: flex; gap: 12px; justify-content: center; }

/* ==========================================
   Buttons
   ========================================== */
.btn {
  display: inline-block;
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 0.9rem;
  padding: 12px 28px;
  border-radius: var(--radius-sm);
  border: 2px solid transparent;
  cursor: pointer;
  text-decoration: none;
  transition: all var(--transition);
}
.btn--primary {
  background: var(--green);
  color: var(--white);
  border-color: var(--green);
}
.btn--primary:hover {
  background: var(--green-light);
  border-color: var(--green-light);
}
.btn--outline {
  background: transparent;
  color: var(--green);
  border-color: var(--green);
}
.btn--outline:hover {
  background: var(--green);
  color: var(--white);
}
.btn--lg { padding: 16px 36px; font-size: 1rem; }
.btn--sm { padding: 8px 16px; font-size: 0.8rem; }

/* ==========================================
   Header
   ========================================== */
.header {
  background: var(--white);
  border-bottom: 1px solid rgba(0,0,0,0.06);
  position: sticky;
  top: 0;
  z-index: 100;
}
.header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 64px;
}
.header__logo {
  font-family: var(--font-title);
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--green);
  text-decoration: none;
}
.header__nav { display: flex; gap: 24px; }
.header__link {
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--text-muted);
  text-decoration: none;
  transition: color var(--transition);
}
.header__link:hover,
.header__link--active { color: var(--green); }
.header__cart {
  position: relative;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--green);
}
.header__cart-count {
  position: absolute;
  top: -6px; right: -10px;
  background: var(--green);
  color: var(--white);
  font-size: 0.65rem;
  font-weight: 700;
  width: 18px; height: 18px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}

/* ==========================================
   Hero
   ========================================== */
.hero {
  background: linear-gradient(135deg, var(--green) 0%, var(--green-light) 100%);
  color: var(--white);
  padding: 80px 0;
  text-align: center;
}
.hero__title {
  font-family: var(--font-title);
  font-size: 3rem;
  line-height: 1.2;
  margin-bottom: 16px;
}
.hero__accent { color: var(--green-pale); }
.hero__sub {
  font-size: 1.1rem;
  opacity: 0.85;
  margin-bottom: 32px;
}

/* ==========================================
   Sections
   ========================================== */
.section { padding: 60px 0; }
.section--alt { background: var(--bg-alt); }
.section__title {
  font-family: var(--font-title);
  font-size: 1.8rem;
  color: var(--green);
  margin-bottom: 32px;
  text-align: center;
}
.section__cta { text-align: center; margin-top: 32px; }

/* ==========================================
   Categories grid
   ========================================== */
.categories-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 16px;
}
.cat-card {
  background: var(--white);
  border-radius: var(--radius);
  padding: 24px;
  text-align: center;
  text-decoration: none;
  color: var(--text);
  box-shadow: var(--shadow);
  transition: transform var(--transition), box-shadow var(--transition);
}
.cat-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg);
}
.cat-card__emoji { font-size: 2rem; margin-bottom: 8px; }
.cat-card__name { font-weight: 600; font-size: 0.95rem; }
.cat-card__count { font-size: 0.8rem; color: var(--text-muted); margin-top: 4px; }

/* ==========================================
   Products grid
   ========================================== */
.products-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 20px;
}
.product-card {
  background: var(--white);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
  transition: transform var(--transition), box-shadow var(--transition);
  text-decoration: none;
  color: var(--text);
  display: flex;
  flex-direction: column;
}
.product-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
}
.product-card__img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  background: var(--bg-alt);
}
.product-card__body { padding: 16px; flex: 1; display: flex; flex-direction: column; }
.product-card__top { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.product-card__name {
  font-family: var(--font-title);
  font-size: 1rem;
  font-weight: 700;
  color: var(--green);
}
.product-card__desc {
  font-size: 0.85rem;
  color: var(--text-muted);
  margin-bottom: 12px;
  flex: 1;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.product-card__footer { display: flex; align-items: center; justify-content: space-between; }
.product-card__price {
  font-weight: 700;
  font-size: 1.1rem;
  color: var(--green);
}

/* Badges */
.badge {
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 4px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.badge--cbd { background: var(--green-pale); color: var(--green); }
.badge--he { background: var(--gold-light); color: var(--gold); }
.badge--cbn { background: #e0e7ff; color: #3730a3; }
.badge--resine { background: #fde8cd; color: #92400e; }
.badge--huile { background: #dbeafe; color: #1e40af; }
.badge--gummy { background: #fce7f3; color: #9d174d; }
.badge--accessoire { background: #e5e7eb; color: #374151; }
.badge--vap { background: var(--gold-light); color: var(--gold); }
.badge--recharge_vap { background: var(--green-pale); color: var(--green); }

/* ==========================================
   Filters
   ========================================== */
.filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 28px;
  justify-content: center;
}
.filter-btn {
  font-family: var(--font-body);
  font-size: 0.85rem;
  font-weight: 500;
  padding: 8px 18px;
  border-radius: 20px;
  border: 1px solid #ddd;
  background: var(--white);
  cursor: pointer;
  transition: all var(--transition);
}
.filter-btn:hover { border-color: var(--green); color: var(--green); }
.filter-btn--active {
  background: var(--green);
  color: var(--white);
  border-color: var(--green);
}

/* ==========================================
   Product detail
   ========================================== */
.breadcrumb {
  display: inline-block;
  font-size: 0.9rem;
  color: var(--text-muted);
  text-decoration: none;
  margin-bottom: 24px;
}
.breadcrumb:hover { color: var(--green); }

.product-detail {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: start;
}
.product-detail__img {
  width: 100%;
  border-radius: var(--radius);
  object-fit: cover;
  max-height: 500px;
  background: var(--bg-alt);
}
.product-detail__info { display: flex; flex-direction: column; gap: 16px; }
.product-detail__name {
  font-family: var(--font-title);
  font-size: 2rem;
  color: var(--green);
}
.product-detail__badges { display: flex; gap: 8px; flex-wrap: wrap; }
.product-detail__desc {
  font-size: 0.95rem;
  color: var(--text-muted);
  line-height: 1.7;
}
.product-detail__prices { display: flex; flex-direction: column; gap: 8px; }
.price-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 16px;
  background: var(--bg-alt);
  border-radius: var(--radius-sm);
}
.price-row__label { font-weight: 500; }
.price-row__value { font-weight: 700; color: var(--green); font-size: 1.1rem; }
.product-detail__add { margin-top: 8px; }

/* ==========================================
   Empty state
   ========================================== */
.empty-state {
  text-align: center;
  padding: 60px 0;
  color: var(--text-muted);
  font-size: 1rem;
}

/* ==========================================
   Footer
   ========================================== */
.footer {
  background: var(--green);
  color: rgba(255,255,255,0.7);
  padding: 32px 0;
  text-align: center;
  font-size: 0.85rem;
}
.footer__inner { display: flex; flex-direction: column; gap: 8px; }
.footer__legal { font-size: 0.75rem; opacity: 0.6; }

/* ==========================================
   Responsive
   ========================================== */
@media (max-width: 768px) {
  .hero__title { font-size: 2rem; }
  .hero { padding: 48px 0; }
  .product-detail { grid-template-columns: 1fr; }
  .header__nav { gap: 14px; }
  .header__link { font-size: 0.8rem; }
  .products-grid { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; }
  .product-card__img { height: 140px; }
  .age-gate__card { margin: 16px; padding: 32px 24px; }
}

/* ==========================================
   Catalogue — New luxury design
   ========================================== */
:root {
  --green-deep: #1b4332;
  --green-mid: #2d6a4f;
  --green-soft: #f0f4f2;
  --amber: #c5a059;
  --brown-hash: #5d4037;
  --border-lux: #eceae4;
  --radius-lux: 24px;
  --shadow-lux: 0 20px 60px rgba(27, 67, 50, 0.08);
}

/* Luxury header (catalogue) */
.lux-header {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(20px);
  padding: 18px 5%;
  border-bottom: 1px solid var(--border-lux);
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: sticky;
  top: 0;
  z-index: 1000;
}
.logo {
  font-family: var(--font-title);
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--green-deep);
  text-decoration: none;
}
.logo em { font-style: normal; color: inherit; }
.lux-header__nav { display: flex; gap: 16px; flex: 1; justify-content: center; margin-left: 0; }
.lux-header__link {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text-muted);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  transition: color 0.3s;
}
.lux-header__link:hover,
.lux-header__link--active { color: var(--green-deep); }

/* Cart nav button */
.btn-cart-nav {
  background: #263e30;
  color: white;
  width: 36px;
  height: 36px;
  padding: 0;
  border-radius: 50%;
  font-size: 0;
  text-decoration: none;
  transition: 0.3s;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.btn-cart-nav:hover { opacity: 0.9; }
.cart-icon-svg { display: block !important; width: 18px; height: 18px; flex-shrink: 0; }
.cart-text-desktop { display: none; }
.btn-cart-nav #cart-count {
  font-size: 11px;
  font-weight: 700;
  position: absolute;
  top: -4px;
  right: -4px;
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #c9a96e;
  color: #0f2218;
  border-radius: 50%;
}

/* Shop container & intro */
.shop-container {
  max-width: 1550px;
  margin: 50px auto;
  padding: 0 4%;
}
.shop-intro {
  text-align: center;
  margin-bottom: 50px;
}
.shop-intro h1 {
  font-family: var(--font-title);
  font-size: 3.2rem;
  color: var(--green-deep);
  margin-bottom: 15px;
}
.shop-intro p {
  color: var(--text-muted);
  font-size: 1.05rem;
  max-width: 550px;
  margin: 0 auto;
  line-height: 1.6;
}

/* Filter bar (catalogue design) */
.filter-bar {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-bottom: 60px;
  flex-wrap: wrap;
}
.filter-bar .filter-btn {
  padding: 10px 22px;
  border-radius: 50px;
  border: 1px solid var(--border-lux);
  background: var(--white);
  font-size: 0.7rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--green-deep);
  cursor: pointer;
  transition: 0.3s;
}
.filter-bar .filter-btn {
  display: flex;
  align-items: center;
  gap: 7px;
}
.filter-bar .filter-btn svg { transition: stroke 0.3s; }
.filter-bar .filter-btn:hover,
.filter-bar .filter-btn--active {
  background: var(--green-deep);
  color: white;
  border-color: var(--green-deep);
  box-shadow: 0 10px 20px rgba(27,67,50,0.1);
}
.filter-bar .filter-btn--active svg { stroke: white; }

/* Product grid (catalogue design) */
.product-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 25px;
  margin-bottom: 100px;
}

/* Item card */
.item-card {
  background: var(--white);
  border: 1px solid var(--border-lux);
  border-radius: var(--radius-lux);
  padding: 20px;
  min-height: 420px;
  transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
}
.flip-card:hover { transform: translateY(-8px); }
.flip-card:hover .item-card {
  border-color: var(--amber);
  box-shadow: 0 15px 40px rgba(197, 160, 89, 0.12);
}

/* Image box */
.img-box {
  background: #fafaf9;
  border-radius: 18px;
  height: 240px;
  margin-bottom: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 5rem;
  position: relative;
  overflow: hidden;
  transition: 0.4s;
}
.item-card:hover .img-box {
  background: var(--green-soft);
  transform: scale(0.98);
}

/* Card badges */
.card-badges {
  position: absolute;
  bottom: 12px;
  left: 12px;
  display: flex;
  gap: 6px;
}
.c-badge {
  background: rgba(255,255,255,0.95);
  padding: 5px 12px;
  border-radius: 50px;
  font-size: 0.58rem;
  font-weight: 800;
  text-transform: uppercase;
  color: var(--text-muted);
  border: 1px solid var(--border-lux);
}
.c-badge.green { color: var(--green-mid); border-color: var(--green-mid); }
.c-badge.brown { color: var(--brown-hash); border-color: var(--brown-hash); }
.c-badge-promo { background: #0f2218 !important; color: #c9a96e !important; border: 1px solid #c9a96e !important; }
.c-badge-stock { background: #8b2500 !important; color: #fff !important; border: 1px solid #8b2500 !important; position: absolute; top: 12px; left: 12px; z-index: 1; }
.pp-wrap { display: inline-flex; align-items: baseline; gap: 8px; }
.fbk-fmt.disabled,.sf-btn.disabled { opacity: .35; pointer-events: none; }

/* Card info */
.card-info { padding: 0 5px 12px; }
.card-cat { display: none; }
.card-info h3 {
  min-height: 3.6rem;
  font-family: var(--font-title);
  font-size: 1.5rem;
  color: var(--green-deep);
  margin-bottom: 8px;
}
.card-info p {
  font-size: 0.82rem;
  color: var(--text-muted);
  line-height: 1.5;
  min-height: 3em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Card footer */
.card-footer {
  position: relative;
  margin-top: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 5px 5px;
  padding-right: 44px;
  border-top: 1px solid #f6f5f0;
}
.card-price { display: flex; flex-direction: column; }
.card-price label {
  font-size: 0.55rem;
  font-weight: 800;
  text-transform: uppercase;
  opacity: 0.5;
}
.card-price b {
  font-family: var(--font-title);
  font-size: 1.45rem;
  color: var(--green-deep);
}

/* Discover button */
.btn-discover {
  background: var(--green-soft);
  color: var(--green-deep);
  padding: 10px 20px;
  border-radius: 50px;
  font-size: 0.65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1px;
  transition: all 0.4s;
  position: relative;
  overflow: hidden;
}
.item-card:hover .btn-discover {
  background: var(--amber);
  color: var(--green-deep);
  box-shadow: 0 8px 20px rgba(197, 160, 89, 0.4);
  transform: scale(1.05);
}
.btn-discover::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 50%;
  height: 100%;
  background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 50%, rgba(255,255,255,0) 100%);
  transform: skewX(-25deg);
  transition: 0.6s;
}
.item-card:hover .btn-discover::after { left: 150%; }

/* Flip card (PC quick-buy) */
.flip-scene { perspective: 800px; }
.flip-card { width: 100%; height: 100%; position: relative; transform-style: preserve-3d; transition: transform 0.5s cubic-bezier(0.4,0,0.2,1); }
.flip-card.flipped { transform: rotateY(180deg); }
.flip-card.flipped .card-flip-btn { opacity: 0; pointer-events: none; }
.flip-front, .flip-back { backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.flip-back {
  position: absolute;
  inset: 0;
  transform: rotateY(180deg);
  background: white;
  border-radius: var(--radius-lux);
  border: 2px solid var(--amber);
  overflow: hidden;
}
.flip-back-inner {
  position: relative;
  padding: 14px;
  height: 100%;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}
.flip-back-close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 26px;
  height: 26px;
  background: var(--green-soft);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  font-size: 16px;
  color: var(--green-deep);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}
.flip-back-title-block {
  text-align: center;
  padding-top: 6px;
}
.flip-back-title {
  font-family: var(--font-title);
  font-size: 0.85rem;
  color: var(--green-deep);
  font-weight: 700;
  display: block;
}
.flip-back-subtitle {
  font-size: 0.55rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--amber);
  display: block;
  margin-top: 2px;
}
.flip-back-sep {
  border: none;
  border-top: 1px solid var(--border-lux);
  margin: 8px 0;
}
.flip-back-sub {
  font-size: 0.6rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--text-muted);
  margin-bottom: 8px;
}
.flip-back-formats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5px;
  margin-bottom: 12px;
}
.fbk-fmt {
  padding: 7px 4px;
  border-radius: 8px;
  border: 1.5px solid var(--border-lux);
  background: white;
  text-align: center;
  cursor: pointer;
  transition: all 0.2s;
}
.fbk-fmt.sel {
  border-color: var(--green-deep);
  background: var(--green-soft);
}
.fbk-qty {
  font-family: var(--font-title);
  font-size: 0.85rem;
  color: var(--green-deep);
  font-weight: 700;
  display: block;
}
.fbk-price {
  font-size: 0.58rem;
  color: var(--text-muted);
  display: block;
}
.fbk-qty-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 20px;
  background: var(--bg-alt);
  border-radius: 10px;
  margin-bottom: 12px;
  flex: 1;
}
.fbk-qb {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  font-weight: 700;
  cursor: pointer;
}
.fbk-qb.minus {
  border: 1.5px solid var(--green-deep);
  background: white;
  color: var(--green-deep);
}
.fbk-qb.plus {
  border: none;
  background: var(--green-deep);
  color: white;
}
.fbk-qval {
  font-family: var(--font-title);
  font-size: 1.5rem;
  color: var(--green-deep);
  min-width: 28px;
  text-align: center;
}
.flip-back-add {
  width: 100%;
  padding: 10px;
  background: var(--amber);
  border: none;
  border-radius: 10px;
  font-family: var(--font-body);
  font-size: 0.65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--green-deep);
  cursor: pointer;
  margin-top: auto;
  transition: background 0.2s;
}
.flip-back-add:hover { background: var(--green-deep); color: var(--amber); }
.flip-back-add:active { background: var(--amber); color: var(--green-deep); transform: scale(0.98); }
.card-flip-btn {
  position: absolute;
  bottom: 34px;
  right: 14px;
  z-index: 2;
  width: 34px;
  height: 34px;
  background: var(--amber);
  color: var(--green-deep);
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.card-flip-btn:hover { background: var(--green-deep); color: var(--amber); }
.card-flip-btn:active { transform: scale(0.92); }

/* Mobile quick-buy button (golden cart icon) */
.card-quick-buy-mobile {
  display: none;
  width: 36px;
  height: 36px;
  background: var(--amber);
  color: var(--green-deep);
  border: none;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: transform 0.2s;
}
.card-quick-buy-mobile:active { background: var(--green-deep); color: var(--amber); transform: scale(0.92); }
.card-quick-buy-mobile.active-state { background: var(--green-deep); color: var(--amber); }

/* Mobile sheet overlay */
.mob-sheet-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.4);
  z-index: 199;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s;
}
.mob-sheet-overlay.open { opacity: 1; pointer-events: all; }
.mob-quick-sheet {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%) translateY(100%);
  width: 100%;
  max-width: 430px;
  background: white;
  border-radius: 20px 20px 0 0;
  padding: 20px 20px 40px;
  z-index: 200;
  transition: transform 0.4s cubic-bezier(0.4,0,0.2,1);
  box-shadow: 0 -8px 40px rgba(0,0,0,0.15);
}
.mob-quick-sheet.open { transform: translateX(-50%) translateY(0); }
.mob-sheet-handle {
  width: 40px;
  height: 4px;
  background: var(--border-lux);
  border-radius: 2px;
  margin: 0 auto 20px;
}
.mob-sheet-title {
  font-family: var(--font-title);
  font-size: 1.1rem;
  color: var(--green-deep);
  margin-bottom: 4px;
  text-align: center;
}
.mob-sheet-badge {
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--amber);
  text-align: center;
  margin-bottom: 2px;
}
.mob-sheet-sub {
  font-size: 0.75rem;
  color: var(--text-muted);
  margin-bottom: 20px;
}
.mob-sheet-label {
  font-size: 0.6rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--text-muted);
  margin-bottom: 10px;
  text-align: center;
}
.mob-sheet-formats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-bottom: 20px;
}
.sf-btn {
  padding: 12px 8px;
  border-radius: 10px;
  border: 1.5px solid var(--border-lux);
  background: white;
  text-align: center;
  cursor: pointer;
  transition: all 0.2s;
}
.sf-btn.active {
  border-color: var(--green-deep);
  background: var(--green-soft);
}
.sf-qty {
  font-family: var(--font-title);
  font-size: 1rem;
  color: var(--green-deep);
  font-weight: 700;
  display: block;
}
.sf-price {
  font-size: 0.65rem;
  color: var(--text-muted);
  display: block;
  margin-top: 2px;
}
.mob-sheet-qty-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  padding: 16px;
  background: var(--green-soft);
  border-radius: 12px;
  margin-bottom: 20px;
}
.mob-sq-btn {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  font-weight: 700;
  cursor: pointer;
  transition: transform 0.15s;
}
.mob-sq-btn:active { transform: scale(0.9); }
.mob-sq-minus {
  border: 1.5px solid var(--green-deep);
  background: white;
  color: var(--green-deep);
}
.mob-sq-plus {
  border: none;
  background: var(--green-deep);
  color: white;
}
.mob-sq-val {
  font-family: var(--font-title);
  font-size: 1.5rem;
  color: var(--green-deep);
  min-width: 32px;
  text-align: center;
}
.mob-sheet-add-btn {
  width: 100%;
  padding: 15px;
  background: var(--green-deep);
  border: none;
  border-radius: 12px;
  font-family: var(--font-body);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: white;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.mob-btn-fill {
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: var(--amber);
  transition: none;
}

@media (max-width: 768px) {
  .card-quick-buy-mobile { display: flex; position: absolute; bottom: 34px; right: 14px; z-index: 10; }
  .flip-back { display: none; }
  .card-flip-btn { display: none; }
  .flip-card { transform: none !important; }
  .shop-intro h1 { font-style: italic; }
}

/* Trust seals */
.trust-seal-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  padding-top: 40px;
  border-top: 1px solid var(--border-lux);
}
.seal-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  cursor: pointer;
}
.seal-circle {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 1px solid var(--amber);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
  background: var(--white);
  transition: all 0.3s ease;
}
.seal-circle svg { width: 20px; color: var(--amber); transition: color 0.3s ease; }
.seal-item label {
  font-size: 0.6rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--green-deep);
  cursor: pointer;
}
.seal-desc {
  display: block;
  font-size: 0.55rem;
  color: rgba(201, 169, 110, 0.65);
  font-weight: 400;
  letter-spacing: 0.5px;
  margin-top: 3px;
  text-transform: none;
}
.seal-item:hover .seal-circle { background-color: var(--amber); transform: rotate(15deg); }
.seal-item:hover svg { color: var(--white); }

/* ==========================================
   FOOTER V9b — Global (all breakpoints)
   ========================================== */
.ft {
  background: #070c09;
  position: relative;
  overflow: hidden;
}
.ft a {
  color: inherit;
  text-decoration: none;
}
.ft::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 45% 35% at 90% 5%, rgba(201,169,110,0.045), transparent 50%),
    radial-gradient(ellipse 30% 50% at 3% 85%, rgba(201,169,110,0.06), transparent 40%),
    radial-gradient(circle at 50% 50%, rgba(201,169,110,0.008) 1px, transparent 1px);
  background-size: 100% 100%, 100% 100%, 3px 3px;
  pointer-events: none;
}
.ft::after {
  content: '';
  position: absolute;
  left: 56px; top: 0; bottom: 0;
  width: 1px;
  background: linear-gradient(to bottom,
    rgba(201,169,110,0.09) 0%,
    rgba(201,169,110,0.06) 50%,
    rgba(201,169,110,0.02) 85%,
    transparent 100%);
  pointer-events: none;
  z-index: 1;
}
.ft__accent {
  height: 1px;
  background: linear-gradient(to right,
    rgba(201,169,110,0.4) 0%, rgba(201,169,110,0.4) 12%, rgba(201,169,110,0.06) 45%, transparent 80%);
}
.ft__w {
  max-width: 1080px;
  margin: 0 auto;
  padding: 40px 56px 0;
  position: relative;
  z-index: 2;
}
.ft__hero { text-align: center; margin-bottom: 32px; }
.ft__logo-img {
  width: 60px; height: 60px;
  border-radius: 50%;
  overflow: hidden;
  margin: 0 auto 10px;
  border: 1.5px solid rgba(201,169,110,0.25);
  box-shadow: 0 0 24px rgba(201,169,110,0.06);
}
.ft__logo-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transform: scale(1.3);
}
.ft__tag {
  font-size: 0.48rem; font-weight: 700;
  letter-spacing: 5px; text-transform: uppercase;
  color: rgba(201,169,110,0.3);
}
.ft__hero-line {
  width: 28px; height: 1px;
  background: rgba(201,169,110,0.3);
  margin: 14px auto 0;
}
.ft__grid {
  display: grid;
  grid-template-columns: 1fr 1.3fr 0.9fr;
  gap: 36px;
  padding-bottom: 28px;
  margin-bottom: 0;
  border-bottom: 1px solid rgba(201,169,110,0.035);
  position: relative;
}
.ft__grid::after {
  content: '';
  position: absolute;
  bottom: -1px; left: 0;
  width: 100px; height: 1px;
  background: linear-gradient(to right, rgba(201,169,110,0.18), transparent);
}
.ft__nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3px 24px; align-content: start;
}
.ft__nav-head {
  grid-column: 1 / -1;
  font-size: 0.5rem; font-weight: 700;
  color: rgba(255,255,255,0.55);
  margin-bottom: 8px;
  display: flex; align-items: center; gap: 8px;
}
.ft__nav-head::after {
  content: ''; flex: 1; height: 1px;
  background: linear-gradient(to right, rgba(201,169,110,0.1), transparent);
}
.ft__lk {
  text-decoration: none;
  color: rgba(255,255,255,0.3);
  font-size: 0.68rem; font-weight: 600;
  display: flex; align-items: center;
  gap: 7px; padding: 6px 0;
  position: relative; transition: all 0.25s;
}
.ft__lk::after {
  content: '';
  position: absolute; left: 0; bottom: 2px;
  width: 0; height: 1px;
  background: rgba(201,169,110,0.22);
  transition: width 0.35s cubic-bezier(0.25,0.46,0.45,0.94);
}
.ft__lk:hover { color: #c9a96e; }
.ft__lk:hover::after { width: 100%; }
.ft__lk svg {
  width: 10px; height: 10px;
  stroke: rgba(201,169,110,0.2); fill: none;
  stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
  flex-shrink: 0; transition: stroke 0.25s;
}
.ft__lk:hover svg { stroke: #c9a96e; }
.ft__contact {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 7px; align-content: start;
}
.ft__contact-head {
  grid-column: 1 / -1;
  font-size: 0.5rem; font-weight: 700;
  color: rgba(255,255,255,0.55);
  margin-bottom: 4px;
  display: flex; align-items: center; gap: 8px;
}
.ft__contact-head::after {
  content: ''; flex: 1; height: 1px;
  background: linear-gradient(to right, rgba(201,169,110,0.1), transparent);
}
.ft__ci {
  padding: 10px 12px; border-radius: 10px;
  background: rgba(201,169,110,0.025);
  border: 1px solid rgba(201,169,110,0.045);
  display: flex; align-items: center; gap: 9px;
  transition: all 0.3s;
}
.ft__ci:hover { border-color: rgba(201,169,110,0.35); background: rgba(201,169,110,0.08); transform: translateY(-2px); box-shadow: 0 4px 16px rgba(201,169,110,0.12); }
.ft__ci--w { grid-column: 1 / -1; }
.ft__ci-ic {
  width: 26px; height: 26px; border-radius: 50%;
  background: linear-gradient(135deg, rgba(201,169,110,0.1), rgba(201,169,110,0.03));
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.ft__ci-ic svg {
  width: 10px; height: 10px;
  stroke: #c9a96e; stroke-opacity: 0.6; fill: none;
  stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
  transition: all 0.3s;
}
.ft__ci:hover .ft__ci-ic {
  background: linear-gradient(135deg, rgba(201,169,110,0.25), rgba(201,169,110,0.1));
  box-shadow: 0 0 10px rgba(201,169,110,0.1);
}
.ft__ci:hover .ft__ci-ic svg { stroke-opacity: 1; }
.ft__ci-lb {
  font-size: 0.34rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: 1.5px;
  color: rgba(201,169,110,0.3); margin-bottom: 1px;
  transition: color 0.3s;
}
.ft__ci:hover .ft__ci-lb { color: rgba(201,169,110,0.6); }
.ft__ci-val {
  font-size: 0.64rem; font-weight: 600;
  color: rgba(255,255,255,0.45); line-height: 1.3;
  transition: color 0.3s;
}
.ft__ci:hover .ft__ci-val { color: rgba(255,255,255,0.7); }
.ft__legal { align-content: start; }
.ft__legal-head {
  font-size: 0.5rem; font-weight: 700;
  color: rgba(255,255,255,0.55);
  margin-bottom: 12px;
  display: flex; align-items: center; gap: 8px;
}
.ft__legal-head::after {
  content: ''; flex: 1; height: 1px;
  background: linear-gradient(to right, rgba(201,169,110,0.1), transparent);
}
.ft__legal-list { list-style: none; display: flex; flex-direction: column; gap: 8px; }
.ft__legal-item {
  display: flex; align-items: flex-start; gap: 8px;
  font-size: 0.58rem; font-weight: 600;
  color: rgba(255,255,255,0.25); line-height: 1.5;
}
.ft__legal-item svg {
  width: 10px; height: 10px;
  stroke: rgba(201,169,110,0.35); fill: none;
  stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
  flex-shrink: 0; margin-top: 2px;
}
/* Premium bottom strip */
.ft__strip {
  margin-top: 24px;
  padding: 18px 56px;
  background: linear-gradient(to right,
    rgba(201,169,110,0.03) 0%,
    rgba(201,169,110,0.06) 50%,
    rgba(201,169,110,0.03) 100%);
  border-top: 1px solid rgba(201,169,110,0.06);
  border-bottom: 1px solid rgba(201,169,110,0.03);
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  overflow: hidden;
}
.ft__strip::before {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 50%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(201,169,110,0.04), transparent);
  animation: ft-shimmer 8s ease-in-out infinite;
}
@keyframes ft-shimmer {
  0%, 100% { left: -50%; }
  50% { left: 100%; }
}
.ft__copy {
  font-size: 0.48rem;
  color: rgba(255,255,255,0.15);
  font-weight: 500;
}
.ft__social-group {
  display: flex;
  align-items: center;
  gap: 10px;
}
.ft__soc-label {
  font-size: 0.36rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: 3px;
  color: rgba(201,169,110,0.22);
}
.ft__soc { display: flex; gap: 6px; }
.ft__soc a {
  width: 30px; height: 30px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(201,169,110,0.04);
  border: 1px solid rgba(201,169,110,0.08);
  transition: all 0.3s; text-decoration: none;
}
.ft__soc a:hover {
  background: #c9a96e; border-color: #c9a96e;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(201,169,110,0.1);
}
.ft__soc svg {
  width: 12px; height: 12px;
  stroke: rgba(201,169,110,0.4); fill: none;
  stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
  transition: all 0.3s;
}
.ft__soc a:hover svg { stroke: #070c09; }
.ft__conform {
  font-size: 0.38rem; font-weight: 800;
  letter-spacing: 2px;
  color: rgba(201,169,110,0.16);
  text-transform: uppercase;
  display: flex; align-items: center; gap: 6px;
}
.ft__conform-diamond {
  width: 4px; height: 4px;
  background: rgba(201,169,110,0.2);
  transform: rotate(45deg);
  flex-shrink: 0;
}
/* Footer responsive */
@media (max-width: 900px) {
  .ft__w { padding: 32px 28px 0; }
  .ft__grid { grid-template-columns: 1fr 1fr; gap: 28px; }
  .ft__legal { grid-column: 1 / -1; }
  .ft::after { left: 28px; }
  .ft__strip { padding: 18px 28px; }
}
@media (max-width: 580px) {
  .ft__w { padding: 28px 20px 0; }
  .ft__grid { grid-template-columns: 1fr; gap: 24px; }
  .ft__contact { grid-template-columns: 1fr; }
  .ft__ci--w { grid-column: auto; }
  .ft::after { left: 20px; }
  .ft__logo-img { width: 48px; height: 48px; }
  .ft__strip { flex-direction: column; gap: 12px; padding: 16px 20px; align-items: center; }
}

@media (min-width: 1101px) {
  .ft__ci[href^="tel:"] {
    cursor: default;
  }
}

/* Catalogue responsive */
@media (max-width: 1200px) { .product-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 900px) { .product-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .product-grid { grid-template-columns: 1fr; } .shop-intro h1 { font-size: 2rem; } }

/* ==========================================
   Product detail — Luxury design
   ========================================== */

/* Layout 2 columns */
.layout {
  max-width: 1400px;
  margin: 50px auto;
  padding: 0 5%;
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 90px;
}

/* Left: visuals & specs */
.visual-column { position: static; align-self: start; }

.product-hero {
  background: var(--white);
  border: 1px solid var(--border-lux);
  border-radius: var(--radius-lux);
  height: 600px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11rem;
  box-shadow: var(--shadow-lux);
  position: relative;
  margin-bottom: 35px;
  overflow: hidden;
}

.origin-tag {
  position: absolute;
  top: 30px;
  left: 30px;
  background: var(--amber);
  color: white;
  padding: 8px 18px;
  border-radius: 50px;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 1px;
  z-index: 1;
}

.tech-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  justify-content: center;
}

.tech-card {
  background: var(--white);
  border: 1px solid var(--border-lux);
  padding: 20px;
  border-radius: 18px;
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: 0.4s;
}
.tech-card:hover {
  border-color: var(--amber);
  transform: translateY(-5px);
  box-shadow: var(--shadow-lux);
}
.tech-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background: var(--amber);
  opacity: 0.3;
}
.tech-card svg { width: 22px; color: var(--amber); margin-bottom: 12px; }
.tech-card label {
  display: block;
  font-size: 0.6rem;
  font-weight: 800;
  color: var(--text-muted);
  text-transform: uppercase;
  margin-bottom: 6px;
  letter-spacing: 1px;
}
.tech-card b { font-size: 1.1rem; color: var(--green-deep); }

/* Right: info & purchase */
.info-column h2 {
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 3px;
  color: var(--amber);
  font-weight: 800;
  margin-bottom: 15px;
}
.info-column h1 {
  font-family: var(--font-title);
  font-size: 4rem;
  color: var(--green-deep);
  line-height: 1.1;
  margin-bottom: 25px;
}

.main-desc {
  font-size: 1.1rem;
  color: var(--text-muted);
  line-height: 1.8;
  margin-bottom: 45px;
}

/* Weight selection */
.weight-selection { margin-bottom: 50px; display: flex; flex-direction: column; align-items: center; }
.weight-selection--accessoire { align-items: center; text-align: center; }
.weight-selection--accessoire .weight-head { justify-content: center; }
.weight-selection--accessoire .qty-selector { margin: 0 auto; width: fit-content; max-width: 220px; align-self: center; }
.weight-selection--accessoire .weight-grid { display: flex; justify-content: center; }
.weight-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}
.weight-head b {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 1.5px;
}
.savings-badge {
  background: #e6f1ec;
  color: #1b4332;
  padding: 5px 15px;
  border-radius: 50px;
  font-size: 0.7rem;
  font-weight: 800;
}

.weight-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.weight-box {
  background: var(--white);
  border: 1px solid var(--border-lux);
  padding: 20px 10px;
  border-radius: 16px;
  cursor: pointer;
  text-align: center;
  transition: 0.4s;
}
.weight-box:hover { border-color: var(--amber); background: #fffcf8; }
.weight-box.active {
  background: var(--green-deep);
  border-color: var(--green-deep);
  color: white;
  box-shadow: 0 15px 30px rgba(27,67,50,0.15);
}
.weight-box b { display: block; font-size: 1.3rem; margin-bottom: 4px; }
.weight-box small { font-size: 0.65rem; font-weight: 700; opacity: 0.7; }
.weight-box.best-deal { border: 2px solid var(--amber); position: relative; }
.weight-box.best-deal::after {
  content: 'MEILLEUR PRIX';
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--amber);
  color: white;
  font-size: 0.5rem;
  padding: 2px 8px;
  border-radius: 50px;
  font-weight: 800;
}

/* Action bar */
.action-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--white);
  border: 1px solid var(--border-lux);
  padding: 25px 60px;
  border-radius: 100px;
  box-shadow: var(--shadow-lux);
  margin-bottom: 50px;
  gap: 40px;
}
.price-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 140px;
  min-width: 140px;
  flex-shrink: 0;
}
.price-info label {
  font-size: 0.65rem;
  font-weight: 800;
  text-transform: uppercase;
  opacity: 0.5;
  margin-bottom: -4px;
}
.price-info span {
  font-family: var(--font-title);
  font-size: 2.2rem;
  font-weight: 700;
  color: var(--green-deep);
}

.delivery-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  border-left: 1px solid var(--border-lux);
  padding-left: 30px;
}
.delivery-info span {
  font-size: 0.6rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--text-muted);
}
.delivery-info .express { color: var(--amber); }

.btn-add-to-cart {
  background: var(--green-deep);
  color: white;
  border: none;
  padding: 15px 45px;
  border-radius: 100px;
  font-family: var(--font-body);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  cursor: pointer;
  transition: 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  font-size: 0.85rem;
  position: relative;
  overflow: hidden;
}
.btn-add-to-cart::after {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(45deg, transparent, rgba(255,255,255,0.1), transparent);
  transform: rotate(45deg);
  transition: 0.6s;
  display: none;
}
.btn-add-to-cart:hover {
  background: var(--green-mid);
  box-shadow: 0 10px 30px rgba(27, 67, 50, 0.3);
  transform: scale(1.03);
}
.btn-add-to-cart:hover::after { left: 100%; }
.btn-add-to-cart { min-width: 200px; }
.btn-add-to-cart .btn-fill {
  position: absolute;
  top: 0; left: -100%;
  width: 100%; height: 100%;
  background: #c9a96e;
  transition: none;
  border-radius: 100px;
  z-index: 1;
}
.btn-add-to-cart .btn-label {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  pointer-events: none;
}
.btn-add-to-cart .lbl-default {
  transition: opacity 0.15s;
}
.btn-add-to-cart .lbl-added {
  color: #1a3d28;
}

.product-header-mobile { display: none; }
.main-desc-mobile { display: none; }

.header-logo-img { display: none; }

/* Qty selector */
.qty-selector { display: flex; flex-direction: column; align-items: center; gap: 10px; background: white; border: 1px solid var(--border-lux); border-radius: 14px; padding: 14px; }
.qty-unit-price { font-size: 0.65rem; font-weight: 800; text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted); margin: 0; }
.qty-controls { display: flex; align-items: center; gap: 18px; }
.qty-btn { width: 36px; height: 36px; border-radius: 50%; font-size: 1.2rem; font-weight: 700; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: 0.2s; }
.qty-minus { border: 1.5px solid var(--green-deep); background: white; color: var(--green-deep); }
.qty-plus { border: none; background: var(--green-deep); color: white; }
.qty-value { font-family: var(--font-title); font-size: 1.4rem; font-weight: 700; color: var(--green-deep); min-width: 24px; text-align: center; }

/* Weight selection centered */
.weight-head { width: 100%; }
.weight-grid { width: 100%; }

/* Product detail responsive */
@media (max-width: 1024px) {
  .layout { grid-template-columns: 1fr; gap: 40px; }
  .visual-column { position: static; }
  .product-hero { height: 400px; font-size: 7rem; }
  .info-column h1 { font-size: 2.5rem; }
  .action-bar { padding: 20px 30px; gap: 20px; }
  .weight-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 600px) {
  .layout { padding: 0 4%; margin: 30px auto; }
  .product-header-mobile { display: block; text-align: center; padding: 0 0 12px; }
  .product-header-mobile h1 { font-family: var(--font-title); font-size: 1.8rem; color: var(--green-deep); line-height: 1.1; margin: 0; }
  .main-desc-mobile { display: block; font-size: 0.95rem; color: var(--text-muted); line-height: 1.8; padding: 12px 0 0; }
  .info-column h1 { display: none; }
  .info-column h2 { display: none; }
  .info-column .main-desc { display: none; }
  .product-hero { height: 300px; font-size: 5rem; }
  .tech-grid { justify-content: center; }
  .action-bar { flex-direction: column; border-radius: var(--radius-lux); padding: 18px; gap: 12px; }
  .action-bar .price-info { order: 1; }
  .action-bar .btn-add-to-cart { order: 2; width: 100%; }
  .action-bar .delivery-info { display: none; }
  .weight-grid { grid-template-columns: repeat(2, 1fr); }
  .weight-head { flex-wrap: nowrap; align-items: center; gap: 8px; }
  .savings-badge { font-size: 0.55rem; padding: 4px 8px; white-space: nowrap; flex-shrink: 0; }
  .tech-grid { grid-template-columns: repeat(3, 1fr); gap: 6px; }
  .tech-card { padding: 8px; }
  .tech-card svg { display: none; }
  .tech-card b { font-size: 0.85rem; }
  .visual-column { position: static; }
}

/* Fix: action-bar stable width */
.price-info { min-width: 140px; }
.price-info span { font-variant-numeric: tabular-nums; white-space: nowrap; }

/* ==========================================
   Homepage — Luxury design
   ========================================== */

/* Promo bar */
.promo-bar {
  background: var(--amber);
  color: white;
  text-align: center;
  padding: 10px 5%;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  position: sticky;
  top: 0;
  z-index: 1100;
}
.promo-bar + .lux-header { top: 38px; }

/* Hero section */
.hero-section {
  background: linear-gradient(160deg, var(--green-deep) 0%, var(--green-mid) 50%, var(--amber) 150%);
  color: white;
  padding: 120px 5% 130px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.hero-section::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -20%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(197,160,89,0.15) 0%, transparent 70%);
  border-radius: 50%;
}
.hero-section__inner {
  max-width: 750px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.hero-title {
  font-family: var(--font-title);
  font-size: 4.2rem;
  line-height: 1.1;
  margin-bottom: 25px;
  letter-spacing: -0.5px;
}
.hero-title em {
  font-style: italic;
  color: var(--amber);
}
.hero-sub {
  font-size: 1.15rem;
  opacity: 0.8;
  line-height: 1.7;
  margin-bottom: 45px;
  max-width: 550px;
  margin-left: auto;
  margin-right: auto;
}
.hero-cta {
  display: inline-block;
  background: white;
  color: var(--green-deep);
  padding: 18px 45px;
  border-radius: 50px;
  font-weight: 800;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  text-decoration: none;
  transition: all 0.4s;
  box-shadow: 0 10px 30px rgba(0,0,0,0.15);
}
.hero-cta:hover {
  transform: translateY(-3px);
  box-shadow: 0 15px 40px rgba(0,0,0,0.2);
}
.hero-cta--outline {
  background: transparent;
  color: var(--green-deep);
  border: 2px solid var(--green-deep);
  box-shadow: none;
}
.hero-cta--outline:hover {
  background: var(--green-deep);
  color: white;
  box-shadow: 0 10px 30px rgba(27,67,50,0.15);
}

/* Home sections */
.home-section {
  padding: 80px 0;
}
.home-section--alt {
  background: var(--green-soft);
}
.home-section__title {
  font-family: var(--font-title);
  font-size: 2.5rem;
  color: var(--green-deep);
  text-align: center;
  margin-bottom: 50px;
}
.home-section__cta {
  text-align: center;
  margin-top: 50px;
}

/* Featured grid: limit to 3 cols on home */
.product-grid--home {
  grid-template-columns: repeat(3, 1fr);
}

/* Promo cards */
.promos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 20px;
}
.promo-card {
  background: var(--white);
  border: 1px solid var(--border-lux);
  border-radius: var(--radius-lux);
  padding: 30px 25px;
  position: relative;
  transition: all 0.4s;
  overflow: hidden;
}
.promo-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background: linear-gradient(90deg, var(--amber), var(--green-mid));
}
.promo-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-lux);
  border-color: var(--amber);
}
.promo-card__tag {
  display: inline-block;
  background: var(--amber);
  color: white;
  padding: 4px 14px;
  border-radius: 50px;
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 1px;
  margin-bottom: 15px;
}
.promo-card__title {
  font-family: var(--font-title);
  font-size: 1.3rem;
  color: var(--green-deep);
  margin-bottom: 10px;
}
.promo-card__offre {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--amber);
  margin-bottom: 8px;
}
.promo-card__condition {
  font-size: 0.8rem;
  color: var(--text-muted);
}

/* Badge urgence (fins de stock) */
.badge-urgence {
  background: #ff4444;
  color: white;
  padding: 4px 10px;
  border-radius: 50px;
  font-size: 0.55rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  animation: pulse-urgence 2s infinite;
}
@keyframes pulse-urgence {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.7; }
}

/* ==========================================
   Cart page — Checkout nav & layout
   ========================================== */
@keyframes coin-spin {
  0%   { transform: perspective(400px) rotateY(0deg); }
  100% { transform: perspective(400px) rotateY(360deg); }
}
@keyframes nav-pop-in {
  0%   { transform: scale(0); opacity: 0; }
  60%  { transform: scale(1.2); }
  100% { transform: scale(1); opacity: 1; }
}
.checkout-nav {
  display: flex;
  gap: 40px;
  align-items: center;
  justify-content: center;
  padding: 18px 5%;
  border-bottom: 1px solid var(--border-lux);
  background: var(--white);
}
.nav-step {
  font-size: 0.68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--text-muted);
  display: flex;
  align-items: center;
  gap: 10px;
}
.nav-step span {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1px solid var(--border-lux);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.65rem;
  background: white;
  flex-shrink: 0;
}
/* Étape active — tourne comme une pièce */
.nav-step.active {
  color: var(--green-deep);
}
.nav-step.active span {
  background: linear-gradient(135deg, #1b4332, #c9a96e, #1b4332);
  background-size: 300% 300%;
  border: none;
  color: white;
  font-weight: 800;
  animation: coin-spin 2.5s ease-in-out infinite;
}
/* Étape complétée — vert + check doré */
.nav-step.completed {
  color: var(--amber);
}
.nav-step.completed span {
  background: #1b4332;
  border: none;
  color: transparent;
  position: relative;
  overflow: hidden;
}
.nav-step.completed span svg {
  animation: nav-pop-in 0.4s ease forwards;
}

/* Cart layout */
.cart-layout {
  max-width: 1400px;
  margin: 60px auto;
  padding: 0 4%;
  display: grid;
  grid-template-columns: 1fr 480px;
  gap: 80px;
}

/* Cart header card */
.cart-header {
  background: var(--white);
  border: 1px solid var(--border-lux);
  border-left: 5px solid var(--green-deep);
  box-shadow: var(--shadow-lux);
  border-radius: 12px;
  padding: 30px 45px;
  margin-bottom: 30px;
  box-shadow: var(--shadow-lux);
  background-image: linear-gradient(to right, #ffffff, #fafaf8);
}
.cart-header h1 {
  font-family: var(--font-title);
  font-size: 2.8rem;
  color: var(--green-deep);
  margin-bottom: 5px;
  letter-spacing: -1px;
}
.cart-meta {
  font-size: 0.72rem;
  text-transform: uppercase;
  font-weight: 800;
  color: var(--amber);
  letter-spacing: 2px;
  display: block;
  opacity: 0.9;
}

/* Cart item cards */
.p-item-card {
  display: grid;
  grid-template-columns: 140px 1fr 120px 120px;
  align-items: center;
  padding: 40px 0;
  border-bottom: 1px solid var(--border-lux);
}
.p-item-img {
  width: 110px;
  height: 130px;
  background: var(--white);
  border: 1px solid var(--border-lux);
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 3rem;
  box-shadow: var(--shadow-lux);
  transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  overflow: hidden;
}
.p-item-card:hover .p-item-img {
  transform: translateY(-8px) rotate(-4deg) scale(1.02);
  border-color: var(--amber);
  box-shadow: 0 15px 30px rgba(197, 160, 89, 0.15);
}
.p-item-details h3 {
  font-family: var(--font-title);
  font-size: 1.5rem;
  color: var(--green-deep);
  margin-bottom: 8px;
}
.p-item-details p {
  font-size: 0.85rem;
  color: var(--text-muted);
  font-weight: 500;
}
.p-item-remove {
  margin-top: 15px;
  background: none;
  border: none;
  font-size: 0.62rem;
  font-weight: 800;
  text-transform: uppercase;
  color: #cc4a4a;
  cursor: pointer;
  opacity: 0.6;
  transition: 0.3s;
  letter-spacing: 1.5px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.p-item-remove svg { width: 10px; height: 10px; }
.p-item-remove:hover { opacity: 1; transform: translateX(3px); }

/* Quantity box (pill) */
.p-qty-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--white);
  border: 1.5px solid var(--border-lux);
  padding: 10px 18px;
  border-radius: 100px;
  width: 110px;
}
.p-qty-btn {
  cursor: pointer;
  border: none;
  background: none;
  font-size: 1.3rem;
  color: var(--green-deep);
  transition: 0.2s;
}
.p-qty-btn:hover { color: var(--amber); }
.p-qty-val { font-weight: 800; }

/* Item price */
.p-item-price {
  font-family: var(--font-title);
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--green-deep);
  text-align: right;
}

/* Summary pane */
.summary-pane { position: sticky; top: 120px; height: fit-content; }
.summary-inner {
  background: var(--white);
  border: 1px solid var(--border-lux);
  border-left: 5px solid var(--green-deep);
  padding: 50px;
  border-radius: var(--radius-lux);
  box-shadow: 0 30px 80px rgba(27, 67, 50, 0.06);
}
.summary-inner h2 {
  font-family: var(--font-title);
  font-size: 2rem;
  margin-bottom: 35px;
  color: var(--green-deep);
}

/* Shipping promo box */
.shipping-promo-box {
  background: #fdfcf8;
  border-radius: 14px;
  padding: 16px 18px;
  margin-bottom: 40px;
}
.shipping-promo-box--free {
  background: #f0f7f3;
}
.spb-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 12px;
}
.spb-left {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  flex: 1;
  min-width: 0;
}
.spb-title {
  font-size: 0.72rem;
  color: var(--green-deep);
  line-height: 1.4;
}
.spb-sub {
  font-size: 0.6rem;
  color: #9a8a6a;
  margin-top: 2px;
}
.spb-sub b { color: var(--amber); }
.spb-right {
  text-align: right;
  flex-shrink: 0;
}
.spb-label {
  font-size: 0.48rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #b8985a;
  margin-bottom: 1px;
}
.spb-label--green { color: #2d6a4f; }
.spb-amount {
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--amber);
  font-family: var(--font-title);
  line-height: 1;
}
.spb-amount--green { color: var(--green-deep); }
.spb-bar-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.spb-pct {
  font-size: 0.62rem;
  font-weight: 800;
  color: var(--amber);
  min-width: 26px;
  text-align: right;
}
.meter-bar {
  flex: 1;
  height: 7px;
  background: #ede9df;
  border-radius: 100px;
  overflow: hidden;
}
.meter-bar--green { background: #c8e6d4; }
.meter-progress {
  height: 100%;
  background: linear-gradient(to right, #b8924a, #e8c98a);
  border-radius: 100px;
  transition: width 0.4s ease;
}
.meter-progress--full {
  background: linear-gradient(to right, #1b4332, #40916c);
}
@keyframes spb-pulse {
  0%,100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.15); opacity: 0.8; }
}
.spb-check { animation: spb-pulse 2.5s ease-in-out infinite; }

/* Calculation rows */
.calc-row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 22px;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text-muted);
}
.calc-row.total {
  margin-top: 30px;
  padding-top: 30px;
  border-top: 1.5px solid var(--green-soft);
  font-size: 2.1rem;
  font-weight: 800;
  color: var(--green-deep);
}

/* Checkout button */
.p-btn-checkout {
  display: block;
  width: 100%;
  text-align: center;
  background: var(--green-deep);
  color: var(--amber);
  border: none;
  padding: 24px;
  border-radius: 100px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 3px;
  cursor: pointer;
  margin-top: 40px;
  transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
  font-size: 0.9rem;
  box-shadow: 0 15px 40px rgba(27, 67, 50, 0.18);
  text-decoration: none;
}
.p-btn-checkout:hover {
  background: var(--amber);
  color: var(--green-deep);
  transform: translateY(-5px);
  box-shadow: 0 20px 50px rgba(197, 160, 89, 0.25);
}

/* Trust grid (cart page) */
.p-trust-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
  margin-top: 45px;
  border-top: 1px solid var(--border-lux);
  padding-top: 35px;
}
.p-trust-card {
  text-align: center;
  font-size: 0.6rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--text-muted);
}
.p-trust-circle {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid var(--border-lux);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 12px;
  transition: all 0.4s ease;
  background: var(--white);
}
.p-trust-card svg { width: 20px; height: 20px; color: var(--amber); transition: 0.4s; }
.p-trust-card:hover .p-trust-circle {
  background: var(--green-deep);
  border-color: var(--green-deep);
  transform: translateY(-3px);
}
.p-trust-card:hover svg { color: var(--white); }

/* Cart empty */
.cart-empty {
  text-align: center;
  padding: 80px 20px;
}
.cart-empty__icon {
  color: var(--border-lux);
  margin-bottom: 20px;
}
.cart-empty h2 {
  font-family: var(--font-title);
  font-size: 1.6rem;
  color: var(--green-deep);
  margin-bottom: 8px;
}
.cart-empty p {
  color: var(--text-muted);
  margin-bottom: 24px;
}
.cart-tampons-box {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background: var(--cream-soft);
  border: 1px solid var(--amber-border);
  border-radius: 12px;
  margin: 10px 0 14px;
  cursor: pointer;
  font-size: 0.82rem;
  color: var(--green);
  font-weight: 600;
}
.cart-tampons-box input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--amber-bright);
  flex-shrink: 0;
  cursor: pointer;
}
.cart-login-incitation {
  background: var(--cream-base);
  border: 1px solid var(--amber-bright);
  border-radius: 12px;
  padding: 12px 14px;
  margin: 10px 0 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 0.82rem;
  color: var(--green);
}
.cart-login-incitation a {
  color: var(--green);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.cart-reduction-row {
  color: var(--green);
  font-weight: 700;
}

/* Cart page responsive */
@media (max-width: 1100px) {
  .cart-layout { grid-template-columns: 1fr; gap: 40px; }
  .cart-header { padding: 30px; }
  .summary-pane { position: static; }
}
@media (max-width: 768px) {
  .cart-header {
    border-top: none;
    box-shadow: none;
    border-left: 5px solid var(--green-deep);
  }
  .p-item-card {
    grid-template-columns: 90px 1fr;
    grid-template-rows: auto auto;
    gap: 10px 15px;
  }
  .p-item-img { width: 80px; height: 95px; font-size: 2rem; }
  .p-item-details { grid-column: 2; }
  .p-item-card .p-qty-box {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 16px;
    background: var(--green-soft);
    border: none;
    border-radius: 12px;
    width: auto;
    justify-content: space-between;
    grid-column: 1;
    justify-self: start;
  }
  .p-item-card .p-qty-box .p-qty-btn[data-action="minus"] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1.5px solid var(--green-deep);
    background: white;
    color: var(--green-deep);
    font-size: 1.2rem;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .p-item-card .p-qty-box .p-qty-btn[data-action="plus"] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: none;
    background: var(--green-deep);
    color: white;
    font-size: 1.2rem;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .p-item-card .p-qty-val {
    font-family: var(--font-title);
    font-size: 1.3rem;
    color: var(--green-deep);
    min-width: 28px;
    text-align: center;
  }
  .p-item-price {
    grid-column: 2;
    grid-row: 2;
    text-align: right;
    align-self: center;
    justify-self: end;
    font-size: 1.1rem;
  }
  .cart-header { text-align: center; }
  .cart-header h1 { font-size: 2rem; }
  .checkout-nav { gap: 20px; }
  .summary-inner { padding: 30px; }
  .summary-inner h2 { text-align: center; }
}

/* ==========================================
   Side cart (slide-out panel)
   ========================================== */
/* Side cart overlay */
.side-cart-overlay {
  position: fixed; inset: 0;
  background: rgba(0,0,0,0.4);
  z-index: 9998; opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s;
}
.side-cart-overlay--visible { opacity: 1; pointer-events: auto; }
/* Panel */
.side-cart {
  position: fixed; right: 0; top: 0;
  width: 380px; max-width: 90vw; height: 100dvh;
  background: var(--white);
  display: flex; flex-direction: column;
  z-index: 9999;
  transform: translateX(100%);
  transition: transform 0.35s cubic-bezier(0.4,0,0.2,1);
  box-shadow: -8px 0 40px rgba(27,67,50,0.08);
}
.side-cart--open { transform: translateX(0); }
/* Header */
.side-cart__header {
  display: flex; justify-content: space-between;
  align-items: center; padding: 18px 20px 14px;
  border-bottom: 1px solid var(--border-lux);
  flex-shrink: 0;
}
.side-cart__header-left h3 {
  font-family: var(--font-title);
  font-size: 1.1rem; color: var(--green-deep); margin: 0;
}
.side-cart__header-sub {
  font-size: 0.55rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: 1.5px;
  color: var(--amber); margin-top: 2px;
}
.side-cart__close {
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--green-deep); border: none;
  cursor: pointer; display: flex;
  flex-direction: column;
  align-items: center; justify-content: center;
  gap: 0; position: relative;
  transition: 0.2s; flex-shrink: 0;
}
.sc-close-bar {
  display: block; width: 16px; height: 2px;
  background: var(--amber); border-radius: 2px;
  position: absolute; top: 50%; left: 50%;
  margin-top: -1px; margin-left: -8px; opacity: 1;
}
.sc-close-bar:nth-child(1) { transform: rotate(45deg); }
.sc-close-bar:nth-child(2) { transform: rotate(-45deg); }
/* Items zone */
.side-cart__items {
  flex: 1; overflow-y: auto; padding: 8px 0;
  background: var(--bg-cream, #fafaf7);
}
.side-cart__items::-webkit-scrollbar { width: 3px; }
.side-cart__items::-webkit-scrollbar-thumb { background: var(--border-lux); }
.side-cart__empty {
  text-align: center; padding: 40px 0;
  color: #aaa; font-size: 0.85rem;
}
/* Swipe wrap */
.sc-swipe-wrap {
  margin: 7px 12px;
  border-radius: 14px;
  overflow: hidden;
  position: relative;
}
.sc-swipe-bg {
  position: absolute; inset: 0;
  background: #e74c3c;
  display: flex; align-items: center; justify-content: flex-end;
  padding-right: 20px; border-radius: 14px;
  cursor: pointer;
}
.sc-swipe-bg span {
  font-size: 0.62rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: 1.5px; color: white;
}
/* Cart item card */
.sc-cart-item {
  background: var(--white);
  border: 1px solid var(--border-lux);
  border-radius: 14px;
  padding: 12px 14px;
  position: relative; z-index: 2;
  transform: translateX(0);
  transition: transform .25s cubic-bezier(.4,0,.2,1), border-color .2s;
  cursor: grab; user-select: none;
}
.sc-cart-item:hover { border-color: var(--amber); }
/* Row structure */
.sc-ci-row1 {
  display: flex; align-items: flex-start;
  justify-content: space-between; gap: 8px;
  margin-bottom: 10px;
}
.sc-ci-row2 {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 8px;
  margin-bottom: 0;
}
.sc-ci-left {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column;
}
.sc-ci-right {
  flex-shrink: 0; display: flex;
  align-items: center; justify-content: flex-end;
}
/* Name */
.sc-ci-name {
  font-family: var(--font-title);
  font-weight: 700;
  font-size: 0.78rem; color: var(--green-deep);
  line-height: 1.35; overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.sc-ci-name-link {
  text-decoration: none;
  cursor: pointer;
}
.sc-ci-name-link:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}
/* Border color by category */
.sc-swipe-wrap[data-cat="fleur"] .sc-cart-item,
.sc-swipe-wrap[data-cat="huile"] .sc-cart-item,
.sc-swipe-wrap[data-cat="gummie"] .sc-cart-item {
  border-color: #2d6a4f;
}
.sc-swipe-wrap[data-cat="resine"] .sc-cart-item {
  border-color: #7a5c3a;
}
.sc-swipe-wrap[data-cat="accessoire"] .sc-cart-item {
  border-color: var(--amber);
}
/* Badge */
.sc-ci-badge {
  font-size: 0.58rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: 1px;
  color: var(--green-deep);
  background: rgba(26,61,40,.08);
  padding: 3px 10px; border-radius: 50px;
  white-space: nowrap; align-self: flex-start;
}
.sc-ci-badge--fleur,
.sc-ci-badge--huile,
.sc-ci-badge--gummie {
  color: #1b5c38; background: #e0f0e6;
}
.sc-ci-badge--resine {
  color: #6b4a1e; background: #f5e8d5;
}
.sc-ci-badge--accessoire {
  color: #6b5b2e; background: #f5edda;
}
.sc-ci-badge-promo { background: #0f2218 !important; color: #c9a96e !important; }
/* Qty label */
.sc-ci-qty-label {
  font-size: 0.62rem;
  color: #7a7a72;
  margin-bottom: 5px;
  display: block;
  padding-top: 4px;
}
.sc-ci-qty-label b { color: var(--green-deep); }
/* Qty */
.sc-ci-qty {
  display: flex; align-items: center;
  background: var(--bg-cream, #f5f2eb);
  border-radius: 50px; overflow: hidden;
  width: fit-content;
  justify-self: center;
}
.p-qty-btn,
.sc-ci-qty-btn,
.mob-sq-btn,
.qty-btn {
  touch-action: manipulation;
}
.sc-ci-qty-btn {
  width: 44px; height: 40px;
  background: transparent; border: none;
  font-size: 1.1rem; font-weight: 700;
  color: var(--green-deep); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .15s;
  -webkit-tap-highlight-color: transparent;
}
.sc-ci-qty-btn:active { background: rgba(26,61,40,.12); }
.sc-ci-qty-val {
  font-family: var(--font-title);
  font-size: 0.95rem; color: var(--green-deep);
  min-width: 28px; text-align: center; user-select: none;
}
/* Price */
.sc-ci-price {
  font-family: var(--font-title);
  font-size: 1.05rem; color: var(--green-deep);
  white-space: nowrap;
  display: flex; align-items: center; height: 40px;
}
/* Footer hint bar */
.sc-footer-hint {
  display: flex; align-items: center;
  justify-content: space-between; gap: 10px;
  padding: 8px 0; margin-bottom: 10px;
  border-bottom: 1px solid var(--border-lux);
}
.sc-fh-text { font-size: 0.62rem; color: #7a7a72; }
.sc-fh-btn {
  padding: 5px 12px; background: var(--green-deep);
  color: var(--amber); border-radius: 50px;
  font-size: 0.58rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: 1.5px;
  text-decoration: none; flex-shrink: 0;
}
/* Mobile hint (hidden on desktop) */
.sc-cart-hint-mobile {
  display: none;
}
/* Footer */
.side-cart__footer {
  padding: 12px 20px 16px;
  border-top: 1px solid var(--border-lux);
  flex-shrink: 0;
}
.side-cart__footer-top {
  display: flex; justify-content: space-between;
  align-items: center; margin-bottom: 10px;
}
.side-cart__total-wrap {
  display: flex; align-items: baseline; gap: 6px;
}
.side-cart__total-label {
  font-size: 0.7rem; color: #717171; font-weight: 600;
}
.side-cart__total {
  font-size: 1rem; font-weight: 800;
  color: var(--green-deep); font-family: var(--font-title);
}
.side-cart__clear {
  font-size: 0.52rem; font-weight: 800;
  text-transform: uppercase; letter-spacing: 1px;
  color: #9a9a9a; background: none; border: none;
  cursor: pointer;
  display: inline-flex; align-items: center; gap: 3px;
}
.side-cart__clear:hover { color: #cc4a4a; opacity: 1; }
.side-cart__btn {
  display: block; width: 100%; padding: 10px;
  border-radius: 100px; font-weight: 800;
  text-transform: uppercase; letter-spacing: 2px;
  font-size: 0.65rem; cursor: pointer; text-align: center;
  text-decoration: none;
}
.side-cart__btn--outline {
  background: var(--amber); color: var(--green-deep);
  border: none; margin-bottom: 7px;
}
.side-cart__btn--primary {
  background: var(--green-deep); color: var(--amber);
  border: none; margin-top: 0;
}
/* Mobile */
@media (max-width: 768px) {
  .side-cart { height: 100dvh; }
  .side-cart__close { width: 44px; height: 44px; }
  /* Badge inset mobile */
  .sc-cart-item {
    position: relative;
  }
  .sc-ci-badge {
    position: absolute;
    top: -1px;
    right: -1px;
    border-radius: 0 9px 0 6px;
    padding: 3px 8px;
    align-self: unset;
  }
  /* Items layout mobile compact */
  .sc-ci-row2 {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 8px;
  }
  .sc-ci-qty-label {
    font-size: 0.58rem;
    flex-shrink: 0;
  }
  .sc-ci-qty {
    display: flex;
    justify-content: center;
    align-items: center;
    justify-self: center;
  }
  .sc-ci-price {
    height: auto;
    font-size: 0.92rem;
  }
  /* Boutons qty plus petits mobile */
  .sc-ci-qty-btn {
    width: 30px;
    height: 28px;
    font-size: 0.9rem;
  }
  /* Supprimer bordure colorée sur mobile */
  .sc-swipe-wrap[data-cat] .sc-cart-item {
    border-color: var(--border-lux);
  }
  /* Supprimer encart footer sur mobile */
  .sc-footer-hint {
    display: none;
  }
  /* Animation spin+pop sur le SVG du bouton catalogue */
  @keyframes sc-spinpop {
    0%   { transform: rotate(0deg) scale(1); }
    25%  { transform: rotate(-15deg) scale(1.15); }
    50%  { transform: rotate(10deg) scale(0.95); }
    75%  { transform: rotate(-5deg) scale(1.05); }
    100% { transform: rotate(0deg) scale(1); }
  }
  .sc-hint-cart-svg {
    animation: sc-spinpop 2s ease-in-out infinite;
    display: inline-block;
  }
  /* Mobile hint visible */
  .sc-cart-hint-mobile {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 6px 12px 4px;
    padding: 8px 12px;
    border-radius: 10px;
    background: var(--green-soft);
    border: 1px solid var(--border-lux);
  }
  .sc-ch-text {
    font-size: 0.6rem;
    font-weight: 700;
    color: var(--green-deep);
    font-style: italic;
  }
  .sc-ch-btn-mobile {
    padding: 6px 12px;
    background: var(--green-deep);
    color: var(--amber);
    border-radius: 50px;
    font-size: 0.56rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
  }
}

/* ==========================================
   Livraison page
   ========================================== */
.liv-layout {
  max-width: 1400px;
  margin: 60px auto;
  padding: 0 4%;
  display: grid;
  grid-template-columns: 1fr 480px;
  gap: 90px;
}

/* Shipping header card */
.shipping-header {
  background: var(--white);
  border: 1px solid var(--border-lux);
  border-left: 5px solid var(--green-deep);
  border-radius: 12px;
  padding: 35px 50px;
  margin-bottom: 55px;
  box-shadow: var(--shadow-lux);
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-image: linear-gradient(to right, #ffffff, #fafaf8);
}
.shipping-header h1 {
  font-family: var(--font-title);
  font-size: 2.8rem;
  color: var(--green-deep);
  margin-bottom: 5px;
  letter-spacing: -1px;
}
.shipping-header p {
  font-size: 0.72rem;
  text-transform: uppercase;
  font-weight: 800;
  color: var(--amber);
  letter-spacing: 2.5px;
}


/* Form card */
.form-card {
  background: var(--white);
  border: 1px solid var(--border-lux);
  border-radius: var(--radius-lux);
  padding: 55px;
  margin-bottom: 45px;
  box-shadow: var(--shadow-lux);
  border-left: 5px solid var(--green-deep);
}
.form-card h2 {
  font-family: var(--font-title);
  font-size: 1.8rem;
  margin-bottom: 40px;
  color: var(--green-deep);
  display: flex;
  align-items: center;
  gap: 15px;
}
.form-card h2::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--border-lux);
}

/* Input grid */
.input-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
}
.input-group {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.input-group.full { grid-column: span 2; }
.input-group label {
  font-size: 0.62rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1.8px;
  color: var(--text-muted);
}
.input-group input {
  padding: 18px 22px;
  border-radius: 14px;
  border: 1.5px solid var(--border-lux);
  font-family: var(--font-body);
  font-size: 0.95rem;
  transition: 0.4s;
  background: #fcfcfc;
}
.input-group input:focus {
  border-color: var(--amber);
  outline: none;
  background: #fff;
  box-shadow: 0 10px 25px rgba(197, 160, 89, 0.08);
}

/* Method selection */
.method-selection { margin-top: 60px; }
.method-card {
  display: flex;
  align-items: center;
  gap: 25px;
  padding: 30px;
  border: 1.5px solid var(--border-lux);
  border-radius: 20px;
  margin-bottom: 20px;
  cursor: pointer;
  transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
  background: var(--white);
  position: relative;
  overflow: hidden;
}
.method-card:hover {
  transform: translateY(-8px);
  border-color: var(--amber);
  box-shadow: var(--shadow-lux);
}
.method-card.active {
  border-color: var(--green-deep);
  background: var(--green-soft);
}
.method-card.active::before {
  content: 'S\00c9LECTIONN\00c9';
  position: absolute;
  top: 15px;
  right: -30px;
  transform: rotate(45deg);
  background: var(--green-deep);
  color: white;
  font-size: 0.5rem;
  font-weight: 800;
  padding: 5px 40px;
  letter-spacing: 1px;
}

/* Method icon */
.method-icon {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: var(--white);
  border: 1px solid var(--border-lux);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 20px rgba(0,0,0,0.02);
  transition: 0.5s;
  flex-shrink: 0;
}
.method-card:hover .method-icon,
.method-card.active .method-icon {
  background: var(--green-deep);
  border-color: var(--green-deep);
}
.method-icon svg {
  width: 32px;
  height: 32px;
  fill: var(--green-deep);
  transition: 0.5s;
}
.method-card:hover .method-icon svg,
.method-card.active .method-icon svg { fill: white; }

/* Method info & price */
.method-info b {
  display: block;
  font-family: var(--font-title);
  color: var(--green-deep);
  font-size: 1.2rem;
  margin-bottom: 4px;
}
.method-info span {
  font-size: 0.82rem;
  color: var(--text-muted);
  font-weight: 500;
}
.method-price {
  font-family: var(--font-title);
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--green-deep);
  margin-left: auto;
  white-space: nowrap;
}

/* Pickup note */
.pickup-note {
  background: #fff9eb;
  border: 1px solid #ffeeba;
  color: #856404;
  padding: 20px;
  border-radius: 12px;
  margin-top: 25px;
  font-size: 0.85rem;
  display: flex;
  align-items: center;
  gap: 15px;
}

/* Bloc CTA "Récupérer mes informations" */
.liv-account-cta {
  margin-bottom: 20px;
  padding: 14px 18px;
  background: linear-gradient(135deg, var(--cream-soft) 0%, var(--cream-ultralight) 100%);
  border: 1px solid var(--amber-border);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}
.liv-account-cta__text {
  flex: 1;
  min-width: 200px;
}
.liv-account-cta__title {
  font-family: 'Libre Baskerville', Georgia, serif;
  font-size: 0.95rem;
  color: var(--green);
  font-weight: 700;
  margin-bottom: 2px;
}
.liv-account-cta__subtitle {
  font-size: 0.78rem;
  color: var(--text-muted);
  line-height: 1.4;
}
.liv-account-cta__btn {
  padding: 10px 20px;
  background: var(--green);
  color: var(--amber-bright);
  border: 1px solid var(--green);
  border-radius: 50px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
}

/* Notes/infos livraison (déplacées depuis livraison.html) */
.shipping-zone-note {
  font-size: 0.85rem;
  color: var(--text-muted);
  text-align: center;
  margin-top: 16px;
  font-style: italic;
  opacity: 0.75;
}
.parrainage-info {
  font-size: 0.85rem;
  color: var(--amber-deep);
  background: var(--cream-base);
  border-left: 3px solid var(--amber-bright);
  padding: 8px 12px;
  margin-top: 8px;
  border-radius: 4px;
}

/* Utilitaires petits blocs livraison */
.liv-parrainage-optional {
  font-size: 0.72rem;
  color: var(--text-muted);
  font-weight: 400;
}
.liv-parrainage-hint {
  display: block;
  margin-top: 8px;
  color: var(--text-muted);
  font-size: 0.78rem;
  line-height: 1.5;
}
.pickup-payment-label {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  margin-bottom: 6px;
}
.pickup-payment-label--last {
  margin-bottom: 0;
}

/* Validate button (livraison) */
.liv-btn-validate {
  display: block;
  width: 100%;
  text-align: center;
  background: var(--green-deep);
  color: var(--amber);
  border: none;
  padding: 24px;
  border-radius: 100px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 3px;
  cursor: pointer;
  margin-top: 40px;
  transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);
  font-size: 0.9rem;
  box-shadow: 0 15px 40px rgba(27, 67, 50, 0.18);
  text-decoration: none;
}
.liv-btn-validate:hover {
  background: var(--amber);
  color: var(--green-deep);
  transform: translateY(-5px);
  box-shadow: 0 20px 50px rgba(197, 160, 89, 0.25);
}

/* Livraison responsive */
@media (max-width: 1100px) {
  .liv-layout { grid-template-columns: 1fr; gap: 40px; }
  .shipping-header { padding: 30px; flex-direction: column; align-items: flex-start; gap: 15px; }
  .form-card { padding: 35px; }
}
@media (max-width: 768px) {
  .input-grid { grid-template-columns: 1fr; }
  .input-group.full { grid-column: span 1; }
  .shipping-header h1 { font-size: 2rem; }
  .method-card { flex-wrap: nowrap; padding: 16px; gap: 14px; }
  .method-icon { width: 44px; height: 44px; }
  .method-icon svg { width: 22px; height: 22px; }
  .method-info b { font-size: 1rem; }
  .method-info span { font-size: 0.76rem; }
  .method-price { font-size: 1rem; white-space: nowrap; margin-left: auto; width: auto; }
  .pickup-note { flex-direction: column; align-items: flex-start; gap: 10px; }
  .form-card { padding: 24px; }
}

/* Homepage responsive */
@media (max-width: 1024px) {
  .product-grid--home { grid-template-columns: repeat(2, 1fr); }
  .hero-title { font-size: 3rem; }
}
@media (max-width: 768px) {
  .lux-header__nav { gap: 12px; }
  .lux-header__link { font-size: 0.7rem; }
}
@media (max-width: 600px) {
  .product-grid--home { grid-template-columns: 1fr; }
  .hero-section { padding: 80px 5% 90px; }
  .hero-title { font-size: 2.2rem; }
  .hero-sub { font-size: 1rem; }
  .home-section__title { font-size: 1.8rem; }
  .promo-bar + .lux-header { top: 0; }
  .promo-bar { position: relative; }
}

/* ==========================================
   Confirmation page (conf- prefix)
   ========================================== */
.conf-layout {
  max-width: 1400px;
  margin: 60px auto;
  padding: 0 4%;
  display: grid;
  grid-template-columns: 1fr 480px;
  gap: 90px;
}

.conf-payment-header {
  background: var(--white, #fff);
  border: 1px solid #eceae4;
  border-left: 5px solid var(--green-deep);
  border-radius: 12px;
  padding: 35px 50px;
  margin-bottom: 45px;
  box-shadow: 0 30px 80px rgba(27, 67, 50, 0.06);
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-image: linear-gradient(to right, #ffffff, #fafaf8);
}
.conf-payment-header h1 {
  font-family: var(--font-title);
  font-size: 2.5rem;
  color: var(--green, #1b4332);
  margin-bottom: 5px;
  letter-spacing: -1px;
}
.conf-payment-header p {
  font-size: 0.72rem;
  text-transform: uppercase;
  font-weight: 800;
  color: var(--gold, #c5a059);
  letter-spacing: 2.5px;
}

.conf-info-card {
  background: var(--white, #fff);
  border: 1px solid #eceae4;
  border-left: 5px solid var(--green-deep);
  border-radius: 24px;
  padding: 50px;
  margin-bottom: 30px;
  box-shadow: 0 30px 80px rgba(27, 67, 50, 0.06);
}
.conf-info-card h2 {
  font-family: var(--font-title);
  font-size: 1.6rem;
  margin-bottom: 30px;
  color: var(--green, #1b4332);
  display: flex;
  align-items: center;
  gap: 15px;
}
.conf-info-card h2::after {
  content: '';
  flex: 1;
  height: 1px;
  background: #eceae4;
}

.conf-review-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
}
.conf-review-item h4 {
  font-size: 0.65rem;
  font-weight: 800;
  text-transform: uppercase;
  color: var(--gold, #c5a059);
  letter-spacing: 1.5px;
  margin-bottom: 10px;
}
.conf-review-item p {
  font-size: 1rem;
  color: var(--text, #1a1a1a);
  font-weight: 500;
}

.conf-order-process-info {
  padding: 40px;
  border-radius: 20px;
  background: #fdfdfb;
  border: 1px solid #eceae4;
  border-left: 5px solid var(--green-deep);
}
.conf-step {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
}
.conf-step-num {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--green-deep);
  color: white;
  font-size: 0.65rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 2px;
}
.conf-step p { font-size: 0.9rem; color: var(--text-muted); line-height: 1.7; }
.conf-step b { color: var(--green-deep); }
.conf-order-process-info h3 {
  font-family: var(--font-title);
  font-size: 1.3rem;
  color: var(--green, #1b4332);
  margin-bottom: 20px;
}
.conf-order-process-info p {
  font-size: 0.9rem;
  color: var(--text-muted, #6b6b6b);
  margin-bottom: 15px;
  line-height: 1.8;
}
.conf-order-process-info b {
  color: var(--green, #1b4332);
  font-weight: 700;
}
.conf-client-note {
  margin-top: 25px;
  padding-top: 20px;
  border-top: 1px solid #eceae4;
  font-style: italic;
  color: #2d6a4f;
}
.conf-thanks {
  margin-top: 25px;
  font-weight: 800;
  color: var(--gold, #c5a059);
  text-transform: uppercase;
  letter-spacing: 1px;
}

.conf-btn-submit {
  width: 100%;
  background: var(--green, #1b4332);
  color: var(--amber);
  border: none;
  padding: 24px;
  border-radius: 100px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 3px;
  cursor: pointer;
  margin-top: 40px;
  transition: 0.6s cubic-bezier(0.19, 1, 0.22, 1);
  font-size: 0.9rem;
  box-shadow: 0 15px 40px rgba(27, 67, 50, 0.18);
  font-family: var(--font-body);
}
.conf-btn-submit:hover {
  background: var(--amber);
  color: var(--green-deep);
  transform: translateY(-3px);
  box-shadow: 0 20px 50px rgba(197, 160, 89, 0.25);
}
.conf-btn-submit:active {
  background: var(--amber);
  color: var(--green-deep);
  transform: translateY(0);
}

.conf-viva-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-size: 0.7rem;
  font-weight: 800;
  text-transform: uppercase;
  color: var(--text-muted);
  letter-spacing: 1px;
  padding-top: 12px;
  margin-top: 12px;
  border-top: 1px solid var(--border-lux);
}

/* CGV checkout (art. L221-14) — case d'acceptation au-dessus du bouton.
   ADDITIF uniquement : aucune règle existante modifiée (CSS mobile figé). */
.conf-cgv-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 28px;
  /* -6px : calibré sur le margin-top:24px !important que la page confirmation
     impose au bouton (bloc d'overrides body.page-confirmation .conf-btn-submit,
     plus bas dans ce fichier) → gap effectif 18px, sans toucher ses règles. */
  margin-bottom: -6px;
  font-family: var(--font-body);
  font-size: 0.78rem;
  line-height: 1.45;
  color: var(--text-muted);
  cursor: pointer;
  text-align: left;
}
.conf-cgv-row input[type="checkbox"] {
  flex: none;
  width: 16px;
  height: 16px;
  margin-top: 1px;
  accent-color: var(--green, #1b4332);
  cursor: pointer;
}
.conf-cgv-row a {
  color: var(--green, #1b4332);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.conf-btn-submit[disabled] {
  opacity: 0.55;
  cursor: not-allowed;
  transform: none;
  box-shadow: 0 15px 40px rgba(27, 67, 50, 0.10);
}
/* Pendant DARK de la page confirmation (fond #0f2218, .summary-inner
   transparent, slot mobile sans fond) : sans lui, le lien CGV vert #1b4332
   serait à ~1.5:1 sur le fond sombre — illisible sur la SEULE page où la
   case s'affiche (mustFix revue adverse). Toujours additif. */
body.page-confirmation .conf-cgv-row {
  color: rgba(255, 255, 255, 0.68);
}
body.page-confirmation .conf-cgv-row a {
  color: var(--amber, #c9a96e);
}
body.page-confirmation .conf-cgv-row input[type="checkbox"] {
  accent-color: var(--amber, #c9a96e);
}
/* L'état disabled doit rester perceptible malgré les overrides !important
   du bouton confirmation (cursor:pointer + hover translateY) : contre-règles
   [disabled] à spécificité supérieure, additives. */
body.page-confirmation .conf-btn-submit[disabled],
body.page-confirmation .summary-inner .conf-btn-submit[disabled],
body.page-confirmation .conf-btn-submit[disabled]:hover,
body.page-confirmation .summary-inner .conf-btn-submit[disabled]:hover {
  cursor: not-allowed !important;
  transform: none !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18) !important;
  background: linear-gradient(135deg, #1b4332, #2d6a4f) !important;
  color: #e8c98a !important;
}

/* Success post-submit (confirmation.html) */
.conf-post-submit {
  text-align: center;
  padding: 30px 0;
}
.conf-post-submit__check {
  margin-bottom: 20px;
}
.conf-post-submit__title {
  font-family: var(--font-title);
  color: var(--green);
  margin-bottom: 15px;
}
.conf-post-submit__message {
  color: var(--text-muted);
  line-height: 1.7;
  margin-bottom: 20px;
}
.conf-post-submit__message--last {
  margin-bottom: 35px;
}
.conf-post-submit__btn {
  display: block;
  text-align: center;
  text-decoration: none;
}

.conf-pay-intro {
  background: var(--green-deep);
  border-radius: 10px;
  padding: 12px 14px;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 14px;
}
.conf-pay-intro p { font-size: 0.85rem; color: rgba(255,255,255,0.9); line-height: 1.6; }
.conf-pay-intro b { color: var(--amber); }

#conf-recap-mobile {
  display: none;
  background: var(--white);
  border: 1px solid var(--border-lux);
  border-left: 5px solid var(--green-deep);
  border-radius: var(--radius-lux);
  padding: 30px;
}
#conf-cta-mobile { display: none; }

/* Confirmation responsive */
@media (max-width: 1100px) {
  .conf-layout { grid-template-columns: 1fr; gap: 40px; }
  .conf-payment-header { padding: 30px; flex-direction: column; align-items: flex-start; gap: 15px; }
}
@media (max-width: 768px) {
  .conf-review-grid { grid-template-columns: 1fr; gap: 20px; }
  .conf-payment-header h1 { font-size: 2rem; }
  .conf-info-card { padding: 30px; }
  .conf-order-process-info { padding: 25px; }
  .conf-info-card { border-left: 5px solid var(--green-deep); }
}

/* ==========================================
   Auth page (auth- prefix) — Phase 3 login refonte
   Variables scopées sous .auth-body pour isolation totale.
   Toutes les classes génériques (.field, .btn, .step, etc.)
   sont scopées sous .auth-body pour éviter collision globale.
   ========================================== */
.auth-body {
  --auth-g1: #0f2218;
  --auth-g2: #1a3d28;
  --auth-green: #1b4332;
  --auth-green-mid: #2d6a4f;
  --auth-amber: #c9a96e;
  --auth-amb-d: #a07840;
  --auth-amb-l: #e8c98a;
  --auth-gold-light: #f5e6c8;
  --auth-crm: #f5f0e6;
  --auth-text: #1a1a1a;
  --auth-text-muted: #6b6b6b;
  --auth-border-lux: #eceae4;
  --auth-err: #ef4444;
  --auth-ok: #16a34a;

  font-family: var(--font-body);
  background: #0a0a0a;
  color: var(--auth-text);
  min-height: 100vh;
  margin: 0;
  padding: 0;
}

.auth-body .auth-screen[hidden] { display: none !important; }

.auth-body .auth-page {
  background: radial-gradient(ellipse at top, var(--auth-green-mid) 0%, var(--auth-green) 50%, var(--auth-g1) 100%);
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 24px;
  position: relative;
  overflow: hidden;
}
.auth-body .auth-page::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle at 15% 25%, rgba(201,169,110,.1) 0%, transparent 45%),
    radial-gradient(circle at 85% 75%, rgba(201,169,110,.08) 0%, transparent 50%),
    radial-gradient(circle at 50% 50%, rgba(232,201,138,.04) 0%, transparent 70%);
  pointer-events: none;
}

.auth-body .auth-logo-wrap {
  position: relative;
  z-index: 2;
  text-align: center;
  margin-bottom: 36px;
}
.auth-body .auth-logo {
  font-family: var(--font-title);
  color: #fff;
  font-size: 1.8rem;
  font-weight: 700;
  letter-spacing: .2px;
  display: inline-block;
  padding: 0 4px 14px;
  text-decoration: none;
  position: relative;
}
.auth-body .auth-logo em {
  font-style: italic;
  color: var(--auth-amber);
  font-weight: 700;
}
.auth-body .auth-logo::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 50px;
  height: 1px;
  background: rgba(255,255,255,.3);
}
.auth-body .auth-tag {
  display: block;
  margin-top: 14px;
  font-size: .62rem;
  letter-spacing: 4px;
  color: var(--auth-amber);
  text-transform: uppercase;
  font-weight: 600;
}

.auth-body .auth-card {
  background: #fff;
  border-radius: 28px;
  padding: 0;
  width: 100%;
  max-width: 480px;
  box-shadow: 0 50px 120px rgba(0,0,0,.45), 0 20px 40px rgba(0,0,0,.25);
  position: relative;
  z-index: 2;
  overflow: hidden;
  border: 1px solid rgba(201,169,110,.2);
}
.auth-body .auth-card::before {
  content: '';
  display: block;
  height: 4px;
  background: linear-gradient(90deg, transparent 0%, var(--auth-amber) 25%, var(--auth-amb-l) 50%, var(--auth-amber) 75%, transparent 100%);
}
.auth-body .auth-card-inner { padding: 48px 44px 40px; }

.auth-body .card-header {
  text-align: center;
  margin-bottom: 32px;
  position: relative;
}
.auth-body .card-header .ornament {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: 16px;
}
.auth-body .card-header .ornament .dot {
  width: 5px;
  height: 5px;
  background: var(--auth-amber);
  border-radius: 50%;
}
.auth-body .card-header .ornament .line {
  width: 30px;
  height: 1px;
  background: var(--auth-amber);
  opacity: .5;
}
.auth-body .card-header h1 {
  font-family: var(--font-title);
  font-size: 1.6rem;
  color: var(--auth-green);
  margin-bottom: 10px;
  font-weight: 700;
  letter-spacing: -.5px;
}
.auth-body .card-header .subtitle {
  font-size: .88rem;
  color: var(--auth-text-muted);
  line-height: 1.7;
  max-width: 340px;
  margin: 0 auto;
}

.auth-body .steps {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  margin-bottom: 32px;
}
.auth-body .step {
  display: flex;
  align-items: center;
  gap: 8px;
}
.auth-body .step-num {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .7rem;
  font-weight: 800;
  font-family: var(--font-title);
  background: #f0efe9;
  color: var(--auth-text-muted);
  border: 1.5px solid var(--auth-border-lux);
  transition: .3s;
}
.auth-body .step.active .step-num {
  background: var(--auth-green);
  color: #fff;
  border-color: var(--auth-green);
  box-shadow: 0 6px 16px rgba(27,67,50,.25);
}
.auth-body .step.done .step-num {
  background: var(--auth-amber);
  color: #fff;
  border-color: var(--auth-amber);
}
.auth-body .step-line {
  width: 32px;
  height: 1.5px;
  background: var(--auth-border-lux);
  margin: 0 6px;
}
.auth-body .step.done + .step-line { background: var(--auth-amber); }

.auth-body .field {
  margin-bottom: 20px;
  position: relative;
}
.auth-body .field label {
  display: block;
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--auth-green);
  margin-bottom: 10px;
}
.auth-body .field-input { position: relative; }
.auth-body .field-input svg.icon {
  position: absolute;
  left: 22px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--auth-amb-d);
  width: 18px;
  height: 18px;
  pointer-events: none;
}
.auth-body .field input {
  width: 100%;
  background: #fdfdfb;
  border: 1.5px solid var(--auth-border-lux);
  border-radius: 16px;
  padding: 20px 22px 20px 56px;
  font-family: var(--font-body);
  font-size: .95rem;
  color: var(--auth-text);
  transition: .3s;
  outline: none;
}
.auth-body .field input:focus {
  border-color: var(--auth-amber);
  box-shadow: 0 12px 30px rgba(201,169,110,.12);
  background: #fff;
}
.auth-body .field input::placeholder {
  color: #c0c0c0;
  font-weight: 400;
}

.auth-body .field-readonly {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 22px;
  background: linear-gradient(135deg, #f9f6ee 0%, #fdfbf3 100%);
  border: 1px solid rgba(201,169,110,.25);
  border-radius: 16px;
  margin-bottom: 24px;
}
.auth-body .field-readonly svg {
  color: var(--auth-amb-d);
  flex-shrink: 0;
  width: 18px;
  height: 18px;
}
.auth-body .field-readonly .ro-label {
  font-size: .6rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--auth-amb-d);
  display: block;
  margin-bottom: 3px;
}
.auth-body .field-readonly .ro-value {
  font-size: .92rem;
  color: var(--auth-green);
  font-weight: 600;
  display: block;
}

.auth-body .btn {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 20px 32px;
  border: none;
  border-radius: 100px;
  font-family: var(--font-body);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
  cursor: pointer;
  transition: all .35s cubic-bezier(.2,.8,.2,1);
  text-decoration: none;
  position: relative;
  overflow: hidden;
}
.auth-body .btn-primary {
  background: var(--auth-green);
  color: #fff;
  box-shadow: 0 14px 30px rgba(27,67,50,.25);
}
.auth-body .btn-primary:hover {
  background: var(--auth-g1);
  transform: translateY(-3px);
  box-shadow: 0 22px 50px rgba(27,67,50,.4);
}
.auth-body .btn-primary svg {
  width: 16px;
  height: 16px;
}
.auth-body .btn-primary:disabled {
  opacity: .65;
  cursor: not-allowed;
  transform: none;
  box-shadow: 0 14px 30px rgba(27,67,50,.15);
}
.auth-body .btn-secondary {
  background: transparent;
  color: var(--auth-green);
  border: 1.5px solid var(--auth-border-lux);
  margin-top: 12px;
  letter-spacing: 2px;
}
.auth-body .btn-secondary:hover {
  border-color: var(--auth-amber);
  color: var(--auth-amb-d);
  background: #fdfbf3;
}
.auth-body .btn-text {
  display: block;
  width: 100%;
  background: none;
  border: none;
  color: var(--auth-green);
  font-size: .78rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  padding: 14px;
  text-align: center;
  margin-top: 6px;
  font-family: var(--font-body);
  transition: .3s;
  letter-spacing: .5px;
}
.auth-body .btn-text:hover { color: var(--auth-amb-d); }
.auth-body .btn-text u {
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: var(--auth-amber);
}

.auth-body .success-icon {
  width: 84px;
  height: 84px;
  background: linear-gradient(135deg, #e8f5ee 0%, #f5e6c8 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 24px;
  border: 2px solid var(--auth-amber);
  box-shadow: 0 20px 40px rgba(201,169,110,.25);
}
.auth-body .success-icon svg {
  color: var(--auth-green);
  width: 40px;
  height: 40px;
}

.auth-body .success-text {
  text-align: center;
  font-size: .9rem;
  color: var(--auth-text-muted);
  line-height: 1.8;
  margin: 0 0 32px;
}
.auth-body .success-text strong {
  color: var(--auth-green);
  font-weight: 700;
}
.auth-body .success-text .email-tag {
  display: inline-block;
  margin: 8px 0;
  padding: 6px 14px;
  background: #f9f6ee;
  border: 1px solid rgba(201,169,110,.3);
  border-radius: 20px;
  color: var(--auth-amb-d);
  font-weight: 600;
  font-size: .85rem;
}

.auth-body .timer {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  background: #f0efe9;
  border-radius: 20px;
  font-size: .72rem;
  color: var(--auth-text-muted);
  font-weight: 600;
  margin-top: 12px;
}
.auth-body .timer svg {
  color: var(--auth-amb-d);
  width: 13px;
  height: 13px;
}

.auth-body .divider {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 24px 0 18px;
}
.auth-body .divider::before,
.auth-body .divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--auth-border-lux);
}
.auth-body .divider span {
  font-size: .65rem;
  color: #aaa;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  font-weight: 700;
}

.auth-body .pwd-rules {
  background: #f9f6ee;
  border-left: 3px solid var(--auth-amber);
  padding: 14px 18px;
  border-radius: 10px;
  margin-top: 8px;
  font-size: .74rem;
  color: var(--auth-text-muted);
  line-height: 1.7;
}
.auth-body .pwd-rules .rule {
  display: flex;
  align-items: center;
  gap: 8px;
}
.auth-body .pwd-rules .rule svg {
  color: var(--auth-text-muted);
  width: 11px;
  height: 11px;
  flex-shrink: 0;
}
.auth-body .pwd-rules .rule.ok { color: var(--auth-ok); }
.auth-body .pwd-rules .rule.ok svg { color: var(--auth-ok); }

.auth-body .auth-footer-link {
  text-align: center;
  margin-top: 22px;
  font-size: .78rem;
  color: var(--auth-text-muted);
}
.auth-body .auth-footer-link a {
  color: var(--auth-green);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid var(--auth-amber);
  padding-bottom: 1px;
}
.auth-body .auth-footer-link a:hover { color: var(--auth-amb-d); }

.auth-body .back-shop {
  position: relative;
  z-index: 2;
  margin-top: 30px;
  color: rgba(255,255,255,.5);
  font-size: .7rem;
  letter-spacing: 3px;
  text-transform: uppercase;
  text-decoration: none;
  font-weight: 600;
}
.auth-body .back-shop:hover { color: var(--auth-amber); }

.auth-body .auth-error {
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #991b1b;
  padding: 12px 16px;
  border-radius: 12px;
  font-size: .78rem;
  font-weight: 600;
  margin: 6px 0 14px;
  text-align: left;
}

@media (max-width: 600px) {
  .auth-body .auth-card-inner { padding: 36px 26px 32px; }
  .auth-body .auth-card { max-width: 100%; }
  .auth-body .card-header h1 { font-size: 1.4rem; }
  .auth-body .auth-logo { font-size: 1.55rem; }
}

/* ==========================================
   Mon Compte link in header
   ========================================== */
.lux-header__link--compte {
  color: var(--amber, #c5a059);
  border: 1px solid var(--amber, #c5a059);
  padding: 6px 16px;
  border-radius: 50px;
  font-size: 0.68rem;
  transition: all 0.3s;
}
.lux-header__link--compte:hover {
  background: var(--amber, #c5a059);
  color: #fff;
}

/* ==========================================
   Compte page (compte- prefix)
   ========================================== */
.compte-layout {
  max-width: 1500px;
  margin: 40px auto;
  padding: 0 5%;
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 70px;
  align-items: stretch;
  min-height: calc(100vh - 66px);
}

/* Sidebar */
.compte-sidebar {
  position: sticky;
  top: 110px;
  height: fit-content;
  padding-right: 30px;
  border-right: 1px solid #eceae4;
}
.compte-sidebar h2 {
  font-family: var(--font-title);
  font-size: 2.2rem;
  margin-bottom: 45px;
  color: var(--green-deep, #1b4332);
  line-height: 1;
}

.compte-menu {
  list-style: none;
}
.compte-menu li { margin-bottom: 6px; }
.compte-menu-sep { margin-top: 30px; }
.compte-menu-link {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 16px 20px;
  text-decoration: none;
  color: var(--text-muted, #626262);
  font-weight: 600;
  font-size: 0.95rem;
  border-radius: 12px;
  transition: 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}
.compte-menu-link svg { width: 22px; opacity: 0.7; }
.compte-menu-link:hover {
  color: var(--green-mid, #2d6a4f);
  background: #f0f4f2;
  padding-left: 25px;
}
.compte-menu-link.active {
  background: var(--green-deep, #1b4332);
  color: #fff;
  box-shadow: 0 10px 25px rgba(27, 67, 50, 0.12);
}
.compte-menu-link.active svg { color: var(--amber, #c5a059); opacity: 1; }
.compte-menu-link--logout { color: #ef4444; }
.compte-menu-link--logout:hover { color: #ef4444; background: #fef2f2; }

/* Welcome */
.compte-welcome { margin-bottom: 45px; }
.compte-welcome h1 {
  font-family: var(--font-title);
  font-size: 3rem;
  margin-bottom: 8px;
  color: var(--green-deep, #1b4332);
}
.compte-welcome p {
  color: var(--text-muted, #626262);
  font-size: 1.1rem;
  font-weight: 400;
}

/* Loyalty card */
.compte-loyalty-card {
  background: var(--green-deep, #1b4332);
  color: white;
  border-radius: 20px;
  padding: 25px 35px;
  margin-bottom: 50px;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
  box-shadow: 0 25px 50px rgba(27, 67, 50, 0.15);
}
.compte-loyalty-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 25px;
}
.compte-loyalty-info h4 {
  font-family: var(--font-title);
  font-size: 1.6rem;
  margin-bottom: 5px;
}
.compte-loyalty-info p { opacity: 0.8; font-size: 0.95rem; }
.compte-points-badge { text-align: right; }
.compte-points-badge span {
  font-size: 2.8rem;
  font-weight: 800;
  color: var(--amber, #c5a059);
  display: block;
  line-height: 1;
}
.compte-points-badge label {
  text-transform: uppercase;
  font-size: 0.65rem;
  letter-spacing: 2px;
  font-weight: 800;
  opacity: 0.6;
}
.compte-progress-container {
  width: 100%;
  background: rgba(255,255,255,0.1);
  height: 8px;
  border-radius: 10px;
  position: relative;
}
.compte-progress-bar {
  width: 84%;
  height: 100%;
  background: var(--amber, #c5a059);
  border-radius: 10px;
  box-shadow: 0 0 15px rgba(197, 160, 89, 0.4);
}
.compte-progress-label {
  display: flex;
  justify-content: space-between;
  margin-top: 12px;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  opacity: 0.8;
}

/* Action cards grid */
.compte-grid-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  margin-bottom: 60px;
}
.compte-action-card {
  background: #fff;
  border: 1px solid #eceae4;
  padding: 35px;
  border-radius: 20px;
  transition: 0.5s cubic-bezier(0.19, 1, 0.22, 1);
  box-shadow: 0 20px 50px rgba(27, 67, 50, 0.04);
  position: relative;
}
.compte-action-card:hover {
  transform: translateY(-10px);
  border-color: var(--amber, #c5a059);
}
.compte-card-tag {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  color: var(--amber, #c5a059);
  font-weight: 800;
  margin-bottom: 18px;
  display: block;
}
.compte-action-card h5 {
  font-family: var(--font-title);
  font-size: 1.25rem;
  margin-bottom: 12px;
  color: var(--green-deep, #1b4332);
}
.compte-action-card p {
  font-size: 0.95rem;
  color: var(--text-muted, #626262);
  margin-bottom: 25px;
  line-height: 1.6;
}
.compte-card-link {
  font-size: 0.85rem;
  font-weight: 800;
  color: var(--green-deep, #1b4332);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: 0.3s;
}
.compte-card-link:hover { gap: 15px; color: var(--green-mid, #2d6a4f); }

/* History section */
.compte-section-title {
  font-family: var(--font-title);
  font-size: 2rem;
  margin-bottom: 30px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.compte-section-title h3 {
  font-family: var(--font-title);
  color: var(--green-deep, #1b4332);
}
.compte-section-title a {
  font-family: var(--font-body);
  font-size: 0.85rem;
  color: var(--amber, #c5a059);
  font-weight: 800;
  text-decoration: none;
}

/* Table */
.compte-table {
  width: 100%;
  border-collapse: collapse;
  border-radius: 20px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 20px 50px rgba(27, 67, 50, 0.04);
  border: 1px solid #eceae4;
}
.compte-table th {
  background: #fafaf9;
  text-align: left;
  padding: 22px 35px;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--text-muted, #626262);
  font-weight: 800;
  border-bottom: 1px solid #eceae4;
}
.compte-table td {
  padding: 28px 35px;
  font-size: 0.95rem;
  border-bottom: 1px solid #f6f5f0;
}

.compte-status-pill {
  padding: 7px 16px;
  border-radius: 50px;
  font-size: 0.7rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  display: inline-block;
}
.compte-status-delivery {
  background: #fff8e6;
  color: #9c7b3c;
  border: 1px solid rgba(197, 160, 89, 0.2);
}
.compte-status-done { background: #e6f1ec; color: #1b4332; }

.compte-btn-action {
  color: var(--green-deep, #1b4332);
  font-weight: 800;
  text-decoration: none;
  font-size: 0.85rem;
  border: 1px solid #eceae4;
  padding: 10px 20px;
  border-radius: 8px;
  transition: 0.3s;
}
.compte-btn-action:hover {
  background: var(--green-deep, #1b4332);
  color: white;
  border-color: var(--green-deep, #1b4332);
}

/* Compte responsive */
@media (max-width: 1100px) {
  .compte-layout { grid-template-columns: 1fr; gap: 40px; }
  .compte-sidebar { position: static; border-right: none; border-bottom: 1px solid #eceae4; padding-right: 0; padding-bottom: 30px; }
  .compte-sidebar h2 { font-size: 1.8rem; margin-bottom: 25px; }
}
@media (max-width: 768px) {
  .compte-grid-cards { grid-template-columns: 1fr; }
  .compte-welcome h1 { font-size: 2rem; }
  .compte-loyalty-top { flex-direction: column; gap: 15px; }
  .compte-points-badge { text-align: left; }
  .compte-table th, .compte-table td { padding: 16px 20px; font-size: 0.85rem; }
  .compte-action-card { padding: 20px; }
  .compte-loyalty-card { padding: 20px; }
  .compte-points-value { font-size: 2.2rem; }
  .compte-btn-action { min-height: 44px; }
}
@media (max-width: 600px) {
  .compte-section-title { flex-wrap: wrap; gap: 8px; }
  .compte-table-wrap { overflow-x: visible; }
  .compte-table thead { display: none; }
  .compte-table tr {
    display: block;
    margin-bottom: 16px;
    border: 1px solid var(--border, #e5e0d8);
    border-radius: 14px;
    padding: 16px;
  }
  .compte-table td {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    font-size: 0.85rem;
    border-bottom: 1px solid var(--border, #e5e0d8);
  }
  .compte-table td:last-child { border-bottom: none; }
  .compte-table td::before {
    content: attr(data-label);
    font-weight: 600;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--am);
    flex-shrink: 0;
    margin-right: 12px;
  }
}

/* ========================================
   P0 — Mobile critical fixes
   ======================================== */

/* Fix 1 — iOS auto-zoom prevention (inputs must be >= 16px) */
@media (max-width: 768px) {
  input, select, textarea { font-size: 16px !important; }
}

/* Fix 2 — Touch targets minimum 44px */
@media (max-width: 768px) {
  .p-qty-btn { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
  .p-item-remove { min-width: 44px; min-height: 44px; padding: 10px; display: inline-flex; align-items: center; justify-content: center; }
  .filter-btn { min-height: 44px; padding: 10px 18px; }
}

/* Fix 3 — Table compte horizontal scroll on mobile */
.compte-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ========================================
   P1 — Mobile layout improvements
   ======================================== */

/* Fix P1-1 — Sidebar collapse at 900px for mid-size tablets */
@media (max-width: 900px) {
  .cart-layout, .liv-layout, .conf-layout { grid-template-columns: 1fr; gap: 40px; }
  .summary-pane { position: static; }
  .conf-layout { display: flex; flex-direction: column; }
  .conf-layout .summary-pane { order: -1; }
  #conf-recap-mobile { display: block; }
  #conf-recap-mobile h2 { font-family: var(--font-title); font-size: 1.6rem; color: var(--green-deep); margin-bottom: 20px; }
  .conf-encart {
    border-left: 3px solid var(--amber);
    padding-left: 12px;
    margin-top: 14px;
  }
  .conf-encart-title {
    font-family: var(--font-title);
    font-size: 0.85rem;
    color: var(--green-deep);
    font-weight: 700;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .conf-encart-title::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--border-lux);
  }
  .conf-encart-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .conf-encart-col h4, .conf-encart-mono h4 {
    font-size: 0.62rem;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--amber);
    letter-spacing: 1.5px;
    margin-bottom: 5px;
  }
  .conf-encart-col p, .conf-encart-mono p {
    font-size: 0.85rem;
    color: var(--text);
    font-weight: 500;
    line-height: 1.7;
  }
  .conf-encart-mono p {
    font-weight: 600;
  }
  #conf-cta-mobile { display: block; }
  .conf-layout .summary-pane { display: none; }
  .conf-info-card { display: none; }
  .conf-order-process-info { margin-top: 20px; }
}

/* Fix P1-2 — Cart item compact on small screens */
@media (max-width: 768px) {
  .p-item-card { padding: 20px 0; }
}

/* Fix P1-3 — Promo bar compact on mobile */
@media (max-width: 768px) {
  .promo-bar { font-size: 11px; padding: 6px 12px; }
  .promo-bar + .lux-header { top: 0; }
}

/* ========================================
   Hamburger menu — mobile only
   ======================================== */

/* Hidden on desktop */
.lux-hamburger { display: none; }

@media (max-width: 1024px) {
  /* Header wrapper for mobile menu */
  .lux-header {
    flex-wrap: wrap;
    position: sticky;
    top: 0;
    z-index: 1000;
    background: white;
    gap: 8px;
  }

  .logo { color: var(--amber); position: absolute; left: 50%; transform: translateX(-50%); }

  .header-logo-img {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 50%;
    overflow: hidden;
    margin-left: 6px;
    flex-shrink: 0;
    order: 2;
  }
  .header-logo-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.4);
  }

  /* Hamburger button */
  .lux-hamburger {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    background: #1a3d28;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    padding: 0;
    width: 38px;
    height: 38px;
    min-width: 38px;
    overflow: hidden;
    z-index: 1001;
    order: 1;
  }
  .lux-hamburger span {
    display: block;
    width: 16px;
    height: 2px;
    background: var(--amber);
    border-radius: 2px;
    transition: transform 0.3s, opacity 0.3s;
  }

  /* Hamburger → X animation when open */
  .lux-header--open .lux-hamburger span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
  }
  .lux-header--open .lux-hamburger span:nth-child(2) {
    opacity: 0;
  }
  .lux-header--open .lux-hamburger span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
  }

  /* Nav hidden by default on mobile */
  .lux-header__nav {
    display: none;
    flex-direction: column;
    margin-left: 0;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    z-index: 1000;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    gap: 0;
    padding: 10px 5%;
    border-top: 1px solid var(--border-lux);
    margin-top: 0;
  }
  .lux-header__nav .lux-header__link {
    padding: 12px 0;
    font-size: 0.9rem;
    border-bottom: 1px solid var(--border-lux);
  }
  .lux-header__nav .lux-header__link:last-child {
    border-bottom: none;
  }

  /* Show nav when header has --open class */
  .lux-header--open .lux-header__nav {
    display: flex;
  }

  /* Reorder: hamburger left, logo center, icon + cart right */
  .logo { order: 2; flex: 1; text-align: center; }
  .lux-compte-icon { order: 3; margin-left: 0; margin-right: 0; }
  .lux-hamburger { order: 1; }

  /* Cart button as compact pill on mobile */
  .btn-cart-nav {
    order: 4;
    margin-left: 0;
    width: 36px;
    height: 36px;
    padding: 0;
    border-radius: 50%;
    font-size: 0;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #263e30;
  }
  .btn-cart-nav #cart-count {
    font-size: 12px;
    color: #0f2218;
    font-weight: 600;
  }
  .cart-icon-svg { display: block !important; width: 18px; height: 18px; flex-shrink: 0; }
  .cart-text-desktop { display: none; }
}

/* Compte icon */
.lux-compte-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  text-decoration: none;
  margin-left: auto;
  margin-right: 8px;
  width: 36px;
  height: 36px;
}
.lux-compte-svg { width: 100%; height: 100%; }
/* Initiale du compte (connecté) : aligner la police sur les liens nav (Manrope) —
   bat l'attribut SVG font-family="serif" du letterSvg (CSS > attribut de présentation).
   N'affecte pas la couleur (fill doré thémé) ni le hook JS (swap/clic). */
.lux-header .lux-compte-icon svg text { font-family: var(--font-body); }

/* ==========================================
   Compte mobile design — hidden on desktop
   All new classes, zero modification of existing rules
   ========================================== */

/* Desktop: hide mobile-only blocks */
.compte-mobile-hero,
.compte-mobile-nav,
.compte-mobile-body { display: none; }

/* ==========================================
   Compte mobile — @media ≤768px
   ========================================== */
@media (max-width: 768px) {

  /* Hide desktop compte components */
  .compte-sidebar { display: none !important; }
  .compte-welcome { display: none !important; }
  .compte-loyalty-card { display: none !important; }
  .compte-grid-cards { display: none !important; }
  .compte-history { display: none !important; }

  /* Show mobile components */
  .compte-mobile-hero,
  .compte-mobile-nav,
  .compte-mobile-body { display: block; }

  /* Layout override. align-content: start — la grille a min-height:calc(100vh-66px)
     et align-content par défaut (stretch) étirait ses lignes (dont .compte-mobile-nav)
     quand le contenu de l'onglet est court (ex. Réglages replié) → gros vide sous les
     onglets. start = lignes à hauteur naturelle, l'excédent passe sous la dernière carte. */
  .compte-layout { margin: 0; padding: 0; gap: 0; align-content: start; }

  /* ---- ANIMATIONS ---- */
  @keyframes cpt-b1{0%{transform:translate(0,0)}25%{transform:translate(28px,-32px)}50%{transform:translate(-12px,18px)}75%{transform:translate(36px,10px)}100%{transform:translate(0,0)}}
  @keyframes cpt-b2{0%{transform:translate(0,0)}30%{transform:translate(-30px,25px)}65%{transform:translate(18px,-35px)}100%{transform:translate(0,0)}}
  @keyframes cpt-b3{0%{transform:translate(0,0)}40%{transform:translate(22px,-18px)}70%{transform:translate(-16px,26px)}100%{transform:translate(0,0)}}
  @keyframes cpt-b4{0%{transform:translate(0,0)}35%{transform:translate(-18px,-22px)}65%{transform:translate(26px,16px)}100%{transform:translate(0,0)}}
  @keyframes cpt-shimmer{0%{background-position:200% center}100%{background-position:-200% center}}
  @keyframes cpt-fillBar{from{width:0}to{width:84%}}
  @keyframes cpt-dotpulse{0%,100%{box-shadow:0 0 0 0 rgba(201,169,110,0.8)}70%{box-shadow:0 0 0 7px rgba(201,169,110,0)}}
  @keyframes cpt-fadeup{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

  /* ---- HERO ---- */
  .compte-mobile-hero{background:#0f2218;padding:32px 20px 28px;position:relative;overflow:hidden}
  .compte-mobile-hero .bubble{position:absolute;border-radius:50%;background:rgba(201,169,110,0.16);border:1px solid rgba(201,169,110,0.22)}
  .compte-mobile-hero .b1{width:88px;height:88px;top:-20px;right:28px;animation:cpt-b1 9s ease-in-out infinite}
  .compte-mobile-hero .b2{width:56px;height:56px;top:24px;right:6px;animation:cpt-b2 12s ease-in-out infinite;background:rgba(201,169,110,0.09)}
  .compte-mobile-hero .b3{width:105px;height:105px;bottom:-38px;left:-24px;animation:cpt-b3 11s ease-in-out infinite}
  .compte-mobile-hero .b4{width:42px;height:42px;bottom:28px;left:78px;animation:cpt-b4 7s ease-in-out infinite;background:rgba(201,169,110,0.1)}
  .compte-mobile-hero .b5{width:68px;height:68px;top:45%;right:-18px;animation:cpt-b1 15s ease-in-out infinite reverse;background:rgba(201,169,110,0.07)}
  .compte-mobile-hero .hi{position:relative;z-index:2;animation:cpt-fadeup .6s ease both}
  .compte-mobile-hero .hl{font-size:8px;letter-spacing:4px;color:rgba(201,169,110,0.5);text-transform:uppercase;font-family:sans-serif;margin-bottom:11px}
  .compte-mobile-hero .hn{font-size:36px;color:#fff;line-height:1.05;font-weight:400;margin-bottom:3px}
  .compte-mobile-hero .he{font-size:11px;color:rgba(255,255,255,0.3);font-family:sans-serif;margin-bottom:20px}
  .compte-mobile-hero .prow{display:flex;align-items:flex-end;gap:11px}
  .compte-mobile-hero .pnum{font-size:50px;color:#c9a96e;line-height:1;background:linear-gradient(120deg,#a07840,#c9a96e,#e8c87a,#c9a96e,#a07840);background-size:250% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:cpt-shimmer 4s linear infinite}
  .compte-mobile-hero .paside{padding-bottom:8px;display:flex;flex-direction:column;gap:5px}
  .compte-mobile-hero .punit{font-size:8px;letter-spacing:2px;color:rgba(201,169,110,0.5);text-transform:uppercase;font-family:sans-serif}
  .compte-mobile-hero .lvl{display:inline-flex;align-items:center;gap:3px;background:rgba(201,169,110,0.15);border:1px solid rgba(201,169,110,0.3);border-radius:99px;padding:3px 8px;font-size:8px;color:#c9a96e;font-family:sans-serif;letter-spacing:1.5px;font-weight:700}

  /* ---- NAV CIRCLES ---- */
  .compte-mobile-nav{display:flex;gap:0;justify-content:space-around;padding:14px 16px 10px;background:#f7f4ef}
  .compte-mobile-nav .nav-item{display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer;flex:1;-webkit-tap-highlight-color:transparent}
  .compte-mobile-nav .nav-circle{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:transform .15s}
  .compte-mobile-nav .nav-circle:active{transform:scale(0.88)}
  .compte-mobile-nav .nav-circle.on{background:#0f2218;box-shadow:0 4px 14px rgba(27,67,50,0.3)}
  .compte-mobile-nav .nav-circle.off{background:#fff;border:1.5px solid #e2d9c8}
  .compte-mobile-nav .nav-circle.red{background:#fff8f7;border:1.5px solid #f0c0bc}
  .compte-mobile-nav .nav-lbl{font-size:9px;font-family:sans-serif;font-weight:700;letter-spacing:0.3px}
  .compte-mobile-nav .nav-lbl.on{color:#0f2218}
  .compte-mobile-nav .nav-lbl.off{color:#bbb}
  .compte-mobile-nav .nav-lbl.red{color:#c0392b}
  .compte-mobile-nav .nav-dot{width:4px;height:4px;border-radius:50%;background:#c9a96e;margin-top:-2px}

  /* ---- BODY CONTAINER ---- */
  .compte-mobile-body{padding:10px 20px 28px}

  /* ---- FIDÉLITÉ DORÉE ---- */
  .compte-mobile-body .fid{background:#c9a96e;border-radius:18px;overflow:hidden;position:relative;margin-bottom:12px;animation:cpt-fadeup .7s ease .1s both}
  .compte-mobile-body .fid-deco{position:absolute;top:-30px;right:-30px;width:130px;height:130px;border-radius:50%;background:rgba(27,67,50,0.12);border:1px solid rgba(27,67,50,0.15)}
  .compte-mobile-body .fid-deco2{position:absolute;bottom:-40px;left:-20px;width:100px;height:100px;border-radius:50%;background:rgba(27,67,50,0.08)}
  .compte-mobile-body .fid-in{position:relative;z-index:1;padding:18px 18px 0}
  .compte-mobile-body .fid-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
  .compte-mobile-body .fid-ttl{font-size:13px;color:#1b4332;font-family:sans-serif;font-weight:700;letter-spacing:0.2px}
  .compte-mobile-body .fid-badge{display:inline-flex;align-items:center;gap:4px;background:rgba(27,67,50,0.18);border:1px solid rgba(27,67,50,0.3);border-radius:99px;padding:4px 10px;font-size:8px;color:#1b4332;font-family:sans-serif;letter-spacing:1.5px;font-weight:700}
  .compte-mobile-body .fid-info{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:14px}
  .compte-mobile-body .fid-msg{font-size:11px;color:rgba(27,67,50,0.6);font-family:sans-serif;line-height:1.5}
  .compte-mobile-body .fid-msg b{color:#1b4332;font-family:'Georgia',serif;font-weight:400;font-style:italic}
  .compte-mobile-body .fid-next{text-align:right}
  .compte-mobile-body .fid-next-lbl{font-size:8px;letter-spacing:1.5px;color:rgba(27,67,50,0.5);text-transform:uppercase;font-family:sans-serif;margin-bottom:2px}
  .compte-mobile-body .fid-next-val{font-size:20px;color:rgba(27,67,50,0.7);font-family:sans-serif;font-weight:300;line-height:1}
  .compte-mobile-body .bar-track{height:5px;background:rgba(27,67,50,0.15);border-radius:99px;overflow:visible;margin-bottom:7px;position:relative}
  .compte-mobile-body .bar-fill{height:100%;width:0;background:linear-gradient(90deg,#8a6030,#1b4332);border-radius:99px;animation:cpt-fillBar 1.3s cubic-bezier(.4,0,.2,1) .6s forwards;position:relative}
  .compte-mobile-body .bar-dot{position:absolute;right:-5px;top:50%;transform:translateY(-50%);width:13px;height:13px;background:#1b4332;border-radius:50%;border:2px solid #c9a96e;animation:cpt-dotpulse 2s ease-out infinite 1.2s}
  .compte-mobile-body .bar-lbl{display:flex;justify-content:space-between;font-size:8px;color:rgba(27,67,50,0.4);font-family:sans-serif;margin-bottom:0}
  .compte-mobile-body .bar-lbl b{color:#1b4332;font-weight:700}
  .compte-mobile-body .fid-footer{border-top:1px solid rgba(27,67,50,0.12);margin-top:14px;padding:10px 18px;display:flex;justify-content:space-between;align-items:center;gap:8px}
  .compte-mobile-body .fid-hint{font-size:9px;color:rgba(27,67,50,0.4);font-family:sans-serif;font-style:italic}
  .compte-mobile-body .fid-btns{display:flex;gap:6px}
  .compte-mobile-body .fid-btn{background:#1b4332;border:none;color:#c9a96e;border-radius:99px;padding:6px 14px;font-size:9px;font-family:sans-serif;font-weight:700;letter-spacing:1px;text-transform:uppercase;cursor:pointer}
  .compte-mobile-body .fid-btn-info{background:transparent;border:1px solid rgba(27,67,50,0.3);color:#1b4332;border-radius:99px;padding:6px 14px;font-size:9px;font-family:sans-serif;font-weight:700;letter-spacing:1px;text-transform:uppercase;cursor:pointer}

  /* ==== Lot paliers mobile — 3 nodes de fidélité (statiques, liste verticale maquette) ====
     Scopé .compte-mobile-body .fid .node… ; barre gardée visible (option a). */
  .compte-mobile-body .fid .nodes{display:grid;grid-template-columns:1fr;gap:0;margin-top:8px}
  .compte-mobile-body .fid .node{display:flex;gap:13px;align-items:flex-start;text-align:left;padding:11px 0}
  .compte-mobile-body .fid .node + .node{border-top:1px solid #ece5d4}
  .compte-mobile-body .fid .node .dot{margin:0;flex:none;box-shadow:none;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 30%,#d9bd85,#b8935a)}
  .compte-mobile-body .fid .node .dot svg{width:15px;height:15px;display:block}
  .compte-mobile-body .fid .node .dot svg path{fill:none;stroke:#fbf8f1;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
  .compte-mobile-body .fid .node .tx{flex:1}
  .compte-mobile-body .fid .node b{display:block;font-family:'Libre Baskerville',Georgia,serif;font-size:14px;color:#0f2218}
  .compte-mobile-body .fid .node .at{display:block;font-size:9px;font-weight:800;letter-spacing:0.14em;text-transform:uppercase;color:#9a927e;font-family:'Manrope',system-ui,sans-serif;margin:2px 0 5px}
  .compte-mobile-body .fid .node p{font-size:11px;color:#4a5247;line-height:1.5;font-family:'Manrope',system-ui,sans-serif}

  /* ---- PARRAINAGE ---- */
  .compte-mobile-body .par{background:#fff;border-radius:16px;border:1px solid #ede6d6;overflow:hidden;margin-bottom:12px;animation:cpt-fadeup .7s ease .12s both}
  .compte-mobile-body .par-head{background:linear-gradient(135deg,#1b4332,#2d5a3d);padding:10px 16px;display:flex;align-items:center;gap:8px}
  .compte-mobile-body .par-icon{width:22px;height:22px;background:rgba(201,169,110,0.2);border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .compte-mobile-body .par-tag{font-size:8px;letter-spacing:3px;color:#c9a96e;text-transform:uppercase;font-family:sans-serif;font-weight:700}
  .compte-mobile-body .par-body{padding:13px 16px}
  .compte-mobile-body .par-desc{font-size:11px;color:#888;font-family:sans-serif;line-height:1.5;margin-bottom:12px}
  .compte-mobile-body .par-desc b{color:#1b4332;font-weight:600;font-family:sans-serif}
  .compte-mobile-body .par-code-row{display:flex;align-items:center;justify-content:space-between;background:#f5f2ed;border-radius:10px;padding:10px 14px;border:1px dashed #d4c9b0}
  .compte-mobile-body .par-code{font-size:16px;color:#1b4332;letter-spacing:3px;font-family:sans-serif;font-weight:700}
  .compte-mobile-body .par-btn{background:#1b4332;border:none;color:#c9a96e;border-radius:8px;padding:7px 14px;font-size:9px;font-family:sans-serif;font-weight:700;letter-spacing:1px;text-transform:uppercase;cursor:pointer;white-space:nowrap}

  /* ---- ACTION CARDS ---- */
  .compte-mobile-body .act{background:#fff;border-radius:16px;margin-bottom:10px;border:1px solid #ede6d6;overflow:hidden;animation:cpt-fadeup .7s ease .15s both}
  .compte-mobile-body .act-head{background:linear-gradient(135deg,#1b4332,#2d5a3d);padding:9px 16px;display:flex;align-items:center;gap:8px}
  .compte-mobile-body .act-icon{width:22px;height:22px;background:rgba(201,169,110,0.2);border-radius:6px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .compte-mobile-body .act-tag{font-size:8px;letter-spacing:3px;color:#c9a96e;text-transform:uppercase;font-family:sans-serif;font-weight:700}
  .compte-mobile-body .act-body{padding:12px 16px}
  .compte-mobile-body .act-title{font-size:15px;color:#1b4332;margin-bottom:3px}
  .compte-mobile-body .act-desc{font-size:11px;color:#aaa;font-family:sans-serif;line-height:1.4;margin-bottom:8px}
  .compte-mobile-body .act-link{font-size:8px;letter-spacing:2px;color:#1b4332;text-transform:uppercase;font-family:sans-serif;font-weight:700;border-bottom:1px solid rgba(201,169,110,0.5);padding-bottom:1px;display:inline-block}

  /* ==== Lot 1b-1 — Recolorisation contenu Profil (look crème maquette) — MOBILE ====
     Additif, scopé [data-tab-section="profil"] : aucun markup/hook touché, autres onglets intacts. */
  .compte-mobile-body:has([data-tab-section="profil"].active){background:#efe9dc}
  /* ==== Lot 1b-2 — Carte membre (.mcard) — MOBILE (sous-classes scopées .compte-mobile-body .mcard) ==== */
  .compte-mobile-body .mcard{border-radius:18px;background:linear-gradient(150deg,#1d4230 0%,#0f2218 48%,#0a1810 100%);border:1px solid rgba(201,169,110,0.45);color:#f5f0e6;padding:22px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;box-shadow:0 18px 40px rgba(15,34,24,0.26);margin-bottom:12px}
  .compte-mobile-body .mcard::after{content:"";position:absolute;top:-70px;right:-70px;width:190px;height:190px;border-radius:50%;border:1px solid rgba(201,169,110,0.18)}
  .compte-mobile-body .mcard::before{content:"";position:absolute;top:-30px;right:-30px;width:120px;height:120px;border-radius:50%;border:1px solid rgba(201,169,110,0.26)}
  .compte-mobile-body .mcard .top{display:flex;align-items:flex-start;justify-content:space-between}
  .compte-mobile-body .mcard .logo{font-family:'Libre Baskerville',Georgia,serif;font-size:19px;font-weight:700;color:#f5f0e6}
  .compte-mobile-body .mcard .logo i{color:#c9a96e;font-style:italic}
  .compte-mobile-body .mcard .tier{font-size:9px;font-weight:800;letter-spacing:0.2em;text-transform:uppercase;color:#0f2218;background:linear-gradient(90deg,#e3ca94,#b8935a);border-radius:16px;padding:5px 11px;white-space:nowrap}
  .compte-mobile-body .mcard .k{font-size:10px;font-weight:700;letter-spacing:0.22em;text-transform:uppercase;font-family:'Manrope',system-ui,sans-serif}
  .compte-mobile-body .mcard .mid{margin:16px 0 14px}
  .compte-mobile-body .mcard .mid .k{color:rgba(245,240,230,0.4)}
  .compte-mobile-body .mcard .mid b{display:block;font-family:'Libre Baskerville',Georgia,serif;font-size:22px;letter-spacing:0.06em;margin-top:4px;text-transform:uppercase}
  .compte-mobile-body .mcard .bot{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
  .compte-mobile-body .mcard-cells{display:flex;gap:26px}
  .compte-mobile-body .mcard .cell .k{color:rgba(245,240,230,0.4);display:block;margin-bottom:3px}
  .compte-mobile-body .mcard .cell b{font-family:'Libre Baskerville',Georgia,serif;font-size:16px;letter-spacing:0.12em;color:#c9a96e}
  .compte-mobile-body .mcard .par-btn{background:transparent;border:1px solid rgba(201,169,110,0.55);color:#c9a96e;border-radius:18px;padding:7px 14px;font-size:9px;font-weight:800;letter-spacing:0.14em;text-transform:uppercase;font-family:'Manrope',system-ui,sans-serif;cursor:pointer;white-space:nowrap}
  .compte-mobile-body .mcard .par-btn:hover{background:rgba(201,169,110,0.12)}
  /* Fidélité */
  .compte-mobile-body [data-tab-section="profil"] .fid{background:#fbf8f1;box-shadow:0 12px 30px rgba(15,34,24,0.09)}
  .compte-mobile-body [data-tab-section="profil"] .fid::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent,#c9a96e,transparent);z-index:2}
  .compte-mobile-body [data-tab-section="profil"] .fid-deco,
  .compte-mobile-body [data-tab-section="profil"] .fid-deco2{background:rgba(201,169,110,0.07);border-color:rgba(201,169,110,0.14)}
  .compte-mobile-body [data-tab-section="profil"] .fid-ttl{color:#0f2218;font-family:'Libre Baskerville',Georgia,serif;font-weight:700}
  .compte-mobile-body [data-tab-section="profil"] .fid-badge{background:rgba(201,169,110,0.15);border-color:rgba(201,169,110,0.35);color:#8a6f3f}
  .compte-mobile-body [data-tab-section="profil"] .fid-msg{color:#5a5346;font-family:'Manrope',system-ui,sans-serif}
  .compte-mobile-body [data-tab-section="profil"] .fid-msg b{color:#0f2218;font-family:'Libre Baskerville',Georgia,serif}
  .compte-mobile-body [data-tab-section="profil"] .fid-next-lbl{color:#7a7565;font-family:'Manrope',system-ui,sans-serif}
  .compte-mobile-body [data-tab-section="profil"] .fid-next-val{color:#b8935a}
  .compte-mobile-body [data-tab-section="profil"] .bar-track{background:#e7e0cf}
  .compte-mobile-body [data-tab-section="profil"] .bar-fill{background:linear-gradient(90deg,#d9bd85,#b8935a)}
  .compte-mobile-body [data-tab-section="profil"] .bar-dot{background:#b8935a;border-color:#fbf8f1}
  .compte-mobile-body [data-tab-section="profil"] .bar-lbl{color:#7a7565;font-family:'Manrope',system-ui,sans-serif}
  .compte-mobile-body [data-tab-section="profil"] .bar-lbl b{color:#0f2218}
  .compte-mobile-body [data-tab-section="profil"] .fid-footer{border-top-color:#ece5d4}
  .compte-mobile-body [data-tab-section="profil"] .fid-hint{color:#7a7565;font-family:'Manrope',system-ui,sans-serif}
  .compte-mobile-body [data-tab-section="profil"] .fid-btn{background:#0f2218;color:#f5f0e6}
  .compte-mobile-body [data-tab-section="profil"] .fid-btn-info{background:#fbf8f1;border:1px solid #cfc7b2;color:#0f2218}
  /* Parrainage */
  .compte-mobile-body [data-tab-section="profil"] .par{background:#fbf8f1;border-color:rgba(201,169,110,0.22);box-shadow:0 10px 24px rgba(15,34,24,0.07)}
  .compte-mobile-body [data-tab-section="profil"] .par-head{background:transparent;position:relative}
  .compte-mobile-body [data-tab-section="profil"] .par-head::after{content:"";position:absolute;left:16px;right:16px;bottom:0;height:1.5px;background:rgba(15,34,24,0.85)}
  .compte-mobile-body [data-tab-section="profil"] .par-icon{background:rgba(201,169,110,0.15)}
  .compte-mobile-body [data-tab-section="profil"] .par-tag{color:#8a6f3f;font-size:10px;letter-spacing:.22em}
  .compte-mobile-body [data-tab-section="profil"] .par-desc{color:#7a7565;font-size:12px;line-height:1.65}
  .compte-mobile-body [data-tab-section="profil"] .par-desc b{color:#0f2218}
  .compte-mobile-body [data-tab-section="profil"] .par-code-row{background:rgba(201,169,110,0.07);border:1px dashed #c9a96e}
  .compte-mobile-body [data-tab-section="profil"] .par-code{color:#0f2218;font-family:'Libre Baskerville',Georgia,serif}
  .compte-mobile-body [data-tab-section="profil"] .par-btn{background:#0f2218;color:#f5f0e6}
  /* Cartes action — scopé Profil (onglet Adresses/Réglages intact) */
  .compte-mobile-body [data-tab-section="profil"] .act{background:#fbf8f1;border-color:rgba(201,169,110,0.22);box-shadow:0 10px 24px rgba(15,34,24,0.07);display:flex;flex-direction:column}
  .compte-mobile-body [data-tab-section="profil"] .act-head{background:transparent;position:relative}
  .compte-mobile-body [data-tab-section="profil"] .act-head::after{content:"";position:absolute;left:16px;right:16px;bottom:0;height:1.5px;background:rgba(15,34,24,0.85)}
  .compte-mobile-body [data-tab-section="profil"] .act-icon{background:rgba(201,169,110,0.15)}
  .compte-mobile-body [data-tab-section="profil"] .act-body{flex:1;display:flex;flex-direction:column}
  .compte-mobile-body [data-tab-section="profil"] .act-tag{color:#8a6f3f;font-size:10px;letter-spacing:.22em}
  .compte-mobile-body [data-tab-section="profil"] .act-title{color:#0f2218;font-family:'Libre Baskerville',Georgia,serif;font-size:16.5px}
  .compte-mobile-body [data-tab-section="profil"] .act-desc{color:#7a7565;font-size:12px;line-height:1.65}
  .compte-mobile-body [data-tab-section="profil"] .act-link{color:#0f2218;border-bottom-color:#0f2218;font-size:10.5px;font-weight:800;letter-spacing:.16em;margin-top:auto;align-self:flex-start}

  /* ---- SÉPARATEUR ---- */
  .compte-mobile-body .sep{display:flex;align-items:center;gap:8px;padding:16px 0 14px}
  .compte-mobile-body .sep-line{flex:1;height:1px}
  .compte-mobile-body .sep-line.l{background:linear-gradient(90deg,transparent,#e0d5c0)}
  .compte-mobile-body .sep-line.r{background:linear-gradient(90deg,#e0d5c0,transparent)}
  .compte-mobile-body .sep-ico{display:flex;gap:4px;align-items:center}
  .compte-mobile-body .sep-ds{width:4px;height:4px;border-radius:50%;background:#c9a96e;opacity:.4}
  .compte-mobile-body .sep-dl{width:6px;height:6px;border-radius:50%;background:#c9a96e}
  .compte-mobile-body .sep-dash{width:16px;height:1px;background:#c9a96e;opacity:.5}

  /* ---- SECTION BAND ---- */
  .compte-mobile-body .sec-band{background:#1b4332;border-radius:14px;padding:14px 18px;margin-bottom:12px;display:flex;justify-content:space-between;align-items:flex-end}
  .compte-mobile-body .sec-left .sec-label{font-size:8px;letter-spacing:3px;color:rgba(201,169,110,0.5);text-transform:uppercase;font-family:sans-serif;margin-bottom:4px}
  .compte-mobile-body .sec-left .sec-ttl{font-size:22px;color:#fff;line-height:1.1}
  .compte-mobile-body .sec-right{text-align:right}
  .compte-mobile-body .sec-count{font-size:30px;color:rgba(201,169,110,0.35);font-family:sans-serif;font-weight:300;line-height:1}
  .compte-mobile-body .sec-lnk{font-size:8px;letter-spacing:2px;color:rgba(201,169,110,0.6);text-transform:uppercase;font-family:sans-serif;font-weight:700;border-bottom:1px solid rgba(201,169,110,0.3);padding-bottom:1px;display:inline-block}

  /* ---- ORDER CARDS ---- */
  .compte-mobile-body .ord{background:#1b4332;border-radius:16px;padding:18px;margin-bottom:8px;position:relative;overflow:hidden;animation:cpt-fadeup .7s ease .2s both}
  .compte-mobile-body .ord-deco{position:absolute;top:-25px;right:-25px;width:90px;height:90px;border-radius:50%;opacity:.12}
  .compte-mobile-body .ord-deco2{position:absolute;bottom:-30px;left:-20px;width:70px;height:70px;border-radius:50%;opacity:.08}
  .compte-mobile-body .ord-in{position:relative;z-index:1}
  .compte-mobile-body .ord-st{font-size:8px;letter-spacing:2.5px;text-transform:uppercase;font-family:sans-serif;font-weight:700;margin-bottom:5px}
  .compte-mobile-body .ord-row{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}
  .compte-mobile-body .ord-ref{font-size:15px;color:#fff}
  .compte-mobile-body .ord-amt{font-size:24px;font-weight:700;font-family:sans-serif;line-height:1}
  .compte-mobile-body .ord-date{font-size:10px;color:rgba(255,255,255,0.3);font-family:sans-serif;margin-top:2px}
  .compte-mobile-body .ord-sep{height:1px;background:rgba(255,255,255,0.08);margin:10px 0}
  .compte-mobile-body .ord-lnk{font-size:8px;letter-spacing:2px;text-transform:uppercase;font-family:sans-serif;font-weight:700}

  /* EN TRANSIT — doré */
  .compte-mobile-body .s-transit .ord-deco,.compte-mobile-body .s-transit .ord-deco2{background:#c9a96e}
  .compte-mobile-body .s-transit .ord-st{color:rgba(201,169,110,0.7)}
  .compte-mobile-body .s-transit .ord-amt{color:#c9a96e}
  .compte-mobile-body .s-transit .ord-lnk{color:#c9a96e}

  /* EN PRÉPARATION — doré */
  .compte-mobile-body .s-prep .ord-deco,.compte-mobile-body .s-prep .ord-deco2{background:#c9a96e}
  .compte-mobile-body .s-prep .ord-st{color:rgba(201,169,110,0.7)}
  .compte-mobile-body .s-prep .ord-amt{color:#c9a96e}
  .compte-mobile-body .s-prep .ord-lnk{color:#c9a96e}

  /* RÉCEPTIONNÉ — doré */
  .compte-mobile-body .s-recu .ord-deco,.compte-mobile-body .s-recu .ord-deco2{background:#c9a96e}
  .compte-mobile-body .s-recu .ord-st{color:rgba(201,169,110,0.7)}
  .compte-mobile-body .s-recu .ord-amt{color:#c9a96e}
  .compte-mobile-body .s-recu .ord-lnk{color:#c9a96e}

  /* ANNULÉE — rouge doux */
  .compte-mobile-body .s-cancel .ord-deco,.compte-mobile-body .s-cancel .ord-deco2{background:#e07b72}
  .compte-mobile-body .s-cancel .ord-st{color:rgba(224,123,114,0.7)}
  .compte-mobile-body .s-cancel .ord-amt{color:#e07b72}
  .compte-mobile-body .s-cancel .ord-lnk{display:none}

} /* END @media (max-width: 768px) — compte mobile */

/* ══════════════════════════════════════════════════════════════════════
   COMPTE PC v2 — desktop design (scoped under .compte-main / .compte-sidebar)
   Added AFTER all existing @media — zero modification of existing rules
══════════════════════════════════════════════════════════════════════ */

/* ── PC Keyframes (prefixed pc- to avoid conflict with cpt-*) ── */
@keyframes pc-fillBar{from{width:0}to{width:84%}}
@keyframes pc-dotpulse{0%,100%{box-shadow:0 0 0 0 rgba(201,169,110,0.7)}70%{box-shadow:0 0 0 10px rgba(201,169,110,0)}}
@keyframes pc-shimmer{0%{background-position:200% center}100%{background-position:-200% center}}
@keyframes pc-fadeup{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes pc-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes pc-wiggle{0%,100%{transform:rotate(0)}15%{transform:rotate(-20deg)}35%{transform:rotate(20deg)}55%{transform:rotate(-15deg)}75%{transform:rotate(12deg)}}
@keyframes pc-b1{0%{transform:translate(0,0)}25%{transform:translate(28px,-32px)}50%{transform:translate(-12px,18px)}75%{transform:translate(36px,10px)}100%{transform:translate(0,0)}}
@keyframes pc-b2{0%{transform:translate(0,0)}30%{transform:translate(-30px,25px)}65%{transform:translate(18px,-35px)}100%{transform:translate(0,0)}}

/* ── Hide old desktop / show new ── */
.compte-desktop-hidden { display: none; }
.compte-main { display: block; }

/* At ≤768px: show old (for mobile CSS), hide new desktop */
@media (max-width: 768px) {
  .compte-desktop-hidden { display: block; }
  .compte-main { display: none !important; }
}

/* ══════════════════════════════
   SIDEBAR PC — .compte-sidebar rich design
══════════════════════════════ */
.compte-sidebar {
  background: #0f2218;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
  border-right: none;
  padding: 0;
  height: auto;
  min-height: 100%;
}
.compte-sidebar .sb-orb1{position:absolute;width:110px;height:110px;border-radius:50%;background:rgba(201,169,110,0.16);border:1px solid rgba(201,169,110,0.22);top:-25px;right:-25px;animation:pc-b1 9s ease-in-out infinite}
.compte-sidebar .sb-orb2{position:absolute;width:70px;height:70px;border-radius:50%;background:rgba(201,169,110,0.1);border:1px solid rgba(201,169,110,0.18);top:30px;right:15px;animation:pc-b2 12s ease-in-out infinite}
.compte-sidebar .sb-orb3{position:absolute;width:95px;height:95px;border-radius:50%;background:rgba(201,169,110,0.13);border:1px solid rgba(201,169,110,0.2);bottom:160px;left:-25px;animation:pc-b1 14s ease-in-out infinite reverse}
.compte-sidebar .sb-orb4{position:absolute;width:50px;height:50px;border-radius:50%;background:rgba(201,169,110,0.08);border:1px solid rgba(201,169,110,0.14);bottom:250px;left:55px;animation:pc-b2 8s ease-in-out infinite}

/* Profil */
.compte-sidebar .sb-top { position: relative; z-index: 2; padding: 36px 28px 24px; }
.compte-sidebar .sb-av {
  width: 58px; height: 58px; border-radius: 50%;
  background: rgba(201,169,110,0.15); border: 1.5px solid rgba(201,169,110,0.35);
  display: flex; align-items: center; justify-content: center; margin-bottom: 16px;
}
.compte-sidebar .sb-name { font-size: 24px; color: #fff; line-height: 1.1; margin-bottom: 4px; font-weight: 400; }
.compte-sidebar .sb-email { font-size: 11px; color: rgba(255,255,255,0.3); font-family: sans-serif; margin-bottom: 20px; letter-spacing: 0.2px; }
.compte-sidebar .sb-pts-row { display: flex; align-items: flex-end; gap: 8px; margin-bottom: 14px; }
.compte-sidebar .sb-pts {
  font-size: 40px; line-height: 1;
  background: linear-gradient(120deg,#a07840,#c9a96e,#e8c87a,#c9a96e,#a07840);
  background-size: 250% auto;
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text; animation: pc-shimmer 4s linear infinite;
}
.compte-sidebar .sb-pts-r { padding-bottom: 7px; display: flex; flex-direction: column; gap: 4px; }
.compte-sidebar .sb-pts-lbl { font-size: 8px; letter-spacing: 2px; color: rgba(201,169,110,0.5); text-transform: uppercase; font-family: sans-serif; }
.compte-sidebar .sb-lvl {
  display: inline-flex; align-items: center; gap: 3px;
  background: rgba(201,169,110,0.15); border: 1px solid rgba(201,169,110,0.28);
  border-radius: 99px; padding: 3px 9px; font-size: 8px; color: #c9a96e;
  font-family: sans-serif; letter-spacing: 1.5px; font-weight: 700;
}

/* Barre progression sidebar */
.compte-sidebar .sb-bar-wrap { position: relative; z-index: 2; padding: 0 28px 22px; }
.compte-sidebar .sb-bar-labels { display: flex; justify-content: space-between; font-size: 9px; color: rgba(255,255,255,0.2); font-family: sans-serif; margin-bottom: 8px; }
.compte-sidebar .sb-bar-labels b { color: rgba(201,169,110,0.6); }
.compte-sidebar .sb-track { height: 4px; background: rgba(255,255,255,0.07); border-radius: 99px; overflow: visible; position: relative; }
.compte-sidebar .sb-fill {
  height: 100%; width: 0;
  background: linear-gradient(90deg,#8a6030,#c9a96e,#e8c87a);
  border-radius: 99px; animation: pc-fillBar 1.4s cubic-bezier(.4,0,.2,1) .6s forwards;
  position: relative;
}
.compte-sidebar .sb-dot {
  position: absolute; right: -5px; top: 50%; transform: translateY(-50%);
  width: 12px; height: 12px; background: #e8c87a; border-radius: 50%;
  border: 2px solid #0f2218; animation: pc-dotpulse 2.2s ease-out infinite 1.2s;
}

/* Séparateur sidebar */
.compte-sidebar .sb-sep { position: relative; z-index: 2; height: 1px; background: rgba(255,255,255,0.06); margin: 0 28px; }

/* Menu sidebar */
.compte-sidebar .sb-menu { position: relative; z-index: 2; padding: 10px 0; flex: 1; }
.compte-sidebar .sb-item {
  display: flex; align-items: center; gap: 14px; padding: 12px 28px;
  cursor: pointer; transition: all .18s; border-right: 3px solid transparent;
}
.compte-sidebar .sb-item:hover { background: rgba(255,255,255,0.04); }
.compte-sidebar .sb-item.on { background: rgba(201,169,110,0.1); border-right-color: #c9a96e; }
.compte-sidebar .sb-ico {
  width: 34px; height: 34px; border-radius: 9px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; transition: background .18s, box-shadow .18s;
}
.compte-sidebar .sb-item.on .sb-ico { background: rgba(201,169,110,0.18); }
.compte-sidebar .sb-item.off .sb-ico { background: rgba(255,255,255,0.05); }
.compte-sidebar .sb-item.red .sb-ico { background: rgba(192,57,43,0.12); }
.compte-sidebar .sb-item:hover .sb-ico { box-shadow: 0 0 0 3px rgba(201,169,110,0.1); }
.compte-sidebar .sb-ico svg { transition: transform .18s; }
.compte-sidebar .sb-item:not(.red):hover .sb-ico svg { animation: pc-spin .6s ease; }
.compte-sidebar .sb-item.red:hover .sb-ico svg { animation: pc-wiggle .5s ease; }
.compte-sidebar .sb-lbl { font-size: 13px; font-family: sans-serif; font-weight: 500; letter-spacing: 0.1px; }
.compte-sidebar .sb-item.on .sb-lbl { color: #c9a96e; }
.compte-sidebar .sb-item.off .sb-lbl { color: rgba(255,255,255,0.55); }
.compte-sidebar .sb-item.red .sb-lbl { color: rgba(220,80,70,0.8); }

/* Boutique card */
.compte-sidebar .sb-shop {
  position: relative; z-index: 2; margin: 8px 16px 20px;
  background: rgba(201,169,110,0.08); border: 1px solid rgba(201,169,110,0.18);
  border-radius: 14px; padding: 14px 18px; cursor: pointer; transition: background .2s;
}
.compte-sidebar .sb-shop:hover { background: rgba(201,169,110,0.14); }
.compte-sidebar .sb-shop-tag { font-size: 8px; letter-spacing: 2.5px; color: rgba(201,169,110,0.5); text-transform: uppercase; font-family: sans-serif; margin-bottom: 4px; }
.compte-sidebar .sb-shop-addr { font-size: 11px; color: rgba(255,255,255,0.5); font-family: sans-serif; line-height: 1.5; margin-bottom: 8px; }
.compte-sidebar .sb-shop-cta { font-size: 8px; letter-spacing: 2px; color: #c9a96e; text-transform: uppercase; font-family: sans-serif; font-weight: 700; border-bottom: 1px solid rgba(201,169,110,0.35); display: inline-block; padding-bottom: 1px; }

/* ══════════════════════════════
   MAIN CONTENT — .compte-main scope
══════════════════════════════ */
.compte-main {
  padding: 44px 52px;
  animation: pc-fadeup .5s ease both;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* Welcome */
.compte-main .welcome-tag { font-size: 9px; letter-spacing: 4px; color: #c9a96e; text-transform: uppercase; font-family: sans-serif; margin-bottom: 10px; }
.compte-main .welcome-name { font-size: 48px; color: #1b4332; line-height: 1; margin-bottom: 6px; font-weight: 400; }
.compte-main .welcome-sub { font-size: 13px; color: rgba(27,67,50,0.45); font-family: sans-serif; letter-spacing: 0.2px; }

/* ROW 1 : fidélité + parrainage */
.compte-main .row-top { display: grid; grid-template-columns: 1.5fr 1fr; gap: 14px; }

/* Card fidélité dorée */
.compte-main .fid { background: #c9a96e; border-radius: 20px; padding: 24px 30px; position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; }
.compte-main .fid-bg1 { position: absolute; top: -50px; right: -50px; width: 200px; height: 200px; border-radius: 50%; background: rgba(27,67,50,0.1); border: 1px solid rgba(27,67,50,0.12); }
.compte-main .fid-bg2 { position: absolute; bottom: -60px; left: 180px; width: 160px; height: 160px; border-radius: 50%; background: rgba(27,67,50,0.07); }
.compte-main .fid-in { position: relative; z-index: 1; }
.compte-main .fid-tag { font-size: 9px; letter-spacing: 2px; text-transform: uppercase; font-family: sans-serif; font-weight: 700; color: rgba(27,67,50,0.5); margin-bottom: 6px; }
.compte-main .fid-msg { font-size: 14px; color: #1b4332; line-height: 1.4; margin-bottom: 18px; }
.compte-main .fid-msg em { font-weight: 400; }
.compte-main .fid-bar { height: 5px; background: rgba(27,67,50,0.14); border-radius: 99px; overflow: visible; position: relative; margin-top: 24px; margin-bottom: 7px; max-width: 100%; }
.compte-main .fid-bar-fill { height: 100%; width: 0; background: linear-gradient(90deg,rgba(27,67,50,0.5),#1b4332); border-radius: 99px; animation: pc-fillBar 1.3s cubic-bezier(.4,0,.2,1) .5s forwards; position: relative; }
.compte-main .fid-bar-dot { position: absolute; right: -5px; top: 50%; transform: translateY(-50%); width: 12px; height: 12px; background: #1b4332; border-radius: 50%; border: 2px solid #c9a96e; animation: pc-dotpulse 2s ease-out infinite .8s; }
.compte-main .fid-bar-lbl { display: flex; justify-content: space-between; font-size: 9px; color: rgba(27,67,50,0.4); font-family: sans-serif; }
.compte-main .fid-bar-lbl b { color: #1b4332; }
/* ===== Lot compactage — fidélité PC à la hauteur maquette (en-tête titre+compteur 1 ligne, message 1 ligne) ===== */
.compte-main .fid-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.compte-main .fid-head .fid-tag { margin-bottom: 0; }
.compte-main .fid-head .fid-bar-lbl { flex: 0 0 auto; gap: 8px; }
.compte-main .fid-msg { margin-bottom: 8px; }
.compte-main .fid-msg br { display: none; }
.compte-main .fid-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 16px; padding-top: 14px; border-top: 1px solid rgba(27,67,50,0.1); }
.compte-main .fid-hint { font-size: 10px; color: rgba(27,67,50,0.4); font-family: sans-serif; font-style: italic; }
.compte-main .fid-btns { display: flex; gap: 7px; }
.compte-main .btn-ghost { background: transparent; border: 1.5px solid rgba(27,67,50,0.28); color: #1b4332; border-radius: 99px; padding: 7px 16px; font-size: 9px; font-family: sans-serif; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; cursor: pointer; transition: background .15s; }
.compte-main .btn-ghost:hover { background: rgba(27,67,50,0.08); }
.compte-main .btn-solid { background: #1b4332; border: none; color: #c9a96e; border-radius: 99px; padding: 7px 16px; font-size: 9px; font-family: sans-serif; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; cursor: pointer; transition: transform .15s; }
.compte-main .btn-solid:hover { transform: scale(0.97); }

/* ===== Lot paliers — 3 nodes de fidélité (statiques, look maquette) — PC =====
   Scopé .compte-main .fid .node… ; pastilles posées sur la barre (margin-top négatif). */
.compte-main .fid .nodes { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; margin-top: 2px; }
.compte-main .fid .node { text-align: center; padding-top: 4px; }
.compte-main .fid .node .dot { width: 32px; height: 32px; border-radius: 50%; margin: -32px auto 10px; display: flex; align-items: center; justify-content: center; background: radial-gradient(circle at 35% 30%, #d9bd85, #b8935a); box-shadow: 0 0 0 4px #fbf8f1, 0 4px 10px rgba(138,111,63,0.35); position: relative; z-index: 1; }
.compte-main .fid .node .dot svg { width: 15px; height: 15px; display: block; }
.compte-main .fid .node .dot svg path { fill: none; stroke: #fbf8f1; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.compte-main .fid .node b { display: block; font-family: 'Libre Baskerville', Georgia, serif; font-size: 14px; color: #0f2218; }
.compte-main .fid .node .at { display: block; font-size: 9px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; color: #9a927e; font-family: 'Manrope', system-ui, sans-serif; margin: 2px 0 5px; }
.compte-main .fid .node p { font-size: 11px; color: #4a5247; line-height: 1.5; font-family: 'Manrope', system-ui, sans-serif; }

/* Parrainage */
.compte-main .par { background: #fff; border-radius: 20px; border: 1px solid #e8e0d0; overflow: hidden; display: flex; flex-direction: column; }
.compte-main .par-top { padding: 22px 24px; flex: 1; }
.compte-main .par-tag { font-size: 8px; letter-spacing: 3px; color: #c9a96e; text-transform: uppercase; font-family: sans-serif; font-weight: 700; margin-bottom: 6px; }
.compte-main .par-desc { font-size: 12px; color: #888; font-family: sans-serif; line-height: 1.55; }
.compte-main .par-desc b { color: #1b4332; font-weight: 600; font-family: sans-serif; }
.compte-main .par-bottom { background: linear-gradient(135deg,#1b4332 0%,#2a5240 100%); padding: 16px 24px; display: flex; align-items: center; justify-content: space-between; }
.compte-main .par-code { font-size: 20px; color: #c9a96e; letter-spacing: 5px; font-family: sans-serif; font-weight: 700; }
.compte-main .par-btn { background: rgba(201,169,110,0.15); border: 1px solid rgba(201,169,110,0.3); color: #c9a96e; border-radius: 8px; padding: 8px 16px; font-size: 9px; font-family: sans-serif; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; cursor: pointer; transition: background .15s; }
.compte-main .par-btn:hover { background: rgba(201,169,110,0.25); }

/* ROW 2 : 2 action cards */
.compte-main .row-act { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
/* ===== Lot layout — disposition maquette Profil PC (.compte-hero + .compte-row3) =====
   .row-top dissous ; .row-act conservé mais display:contents pour rejoindre la grille row3. */
.compte-main .compte-hero { display: grid; grid-template-columns: 400px 1fr; gap: 22px; align-items: stretch; }
.compte-main .compte-row3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; align-items: stretch; }
.compte-main .compte-row3 .row-act { display: contents; }
@media (max-width: 1300px) {
  .compte-main .compte-hero { grid-template-columns: 1fr; }
  .compte-main .compte-row3 { grid-template-columns: 1fr 1fr; }
}
.compte-main .act { background: #fff; border-radius: 18px; border: 1px solid #e8e0d0; overflow: hidden; transition: transform .2s; }
.compte-main .act:hover { transform: translateY(-2px); }
.compte-main .act-head { background: linear-gradient(135deg,#1b4332,#2a5240); padding: 10px 20px; display: flex; align-items: center; gap: 10px; }
.compte-main .act-ico { width: 24px; height: 24px; background: rgba(201,169,110,0.2); border-radius: 7px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.compte-main .act-tag { font-size: 8px; letter-spacing: 3px; color: #c9a96e; text-transform: uppercase; font-family: sans-serif; font-weight: 700; }
.compte-main .act-body { padding: 16px 20px; }
.compte-main .act-title { font-size: 16px; color: #1b4332; margin-bottom: 4px; }
.compte-main .act-desc { font-size: 11px; color: #aaa; font-family: sans-serif; line-height: 1.45; margin-bottom: 12px; }
.compte-main .act-link { font-size: 8px; letter-spacing: 2px; color: #1b4332; text-transform: uppercase; font-family: sans-serif; font-weight: 700; border-bottom: 1px solid rgba(201,169,110,0.5); padding-bottom: 1px; display: inline-block; }

/* ===== Lot 1b-1 — Recolorisation contenu Profil (look crème maquette) — PC =====
   Additif, scopé [data-tab-section="profil"] : aucun markup/hook touché, autres onglets intacts. */
/* Fond crème posé sur le <main> (cellule grille étirée pleine hauteur par align-items:stretch),
   et non sur .compte-main (hauteur = contenu) : sinon le body #fafaf7 réapparaît sous le contenu. */
.compte-layout:has([data-tab-section="profil"].active) > main { background: #efe9dc; }
/* ===== Lot 1b-2 — Carte membre (.mcard) — PC =====
   Sous-classes TOUTES scopées .compte-main .mcard (collision .logo/.btn/.top/.k/etc.). */
.compte-main .mcard { border-radius: 18px; background: linear-gradient(150deg, #1d4230 0%, #0f2218 48%, #0a1810 100%); border: 1px solid rgba(201,169,110,0.45); color: #f5f0e6; padding: 24px 26px; display: flex; flex-direction: column; justify-content: space-between; position: relative; overflow: hidden; box-shadow: 0 18px 40px rgba(15,34,24,0.26); }
.compte-main .mcard::after { content: ""; position: absolute; top: -70px; right: -70px; width: 210px; height: 210px; border-radius: 50%; border: 1px solid rgba(201,169,110,0.18); }
.compte-main .mcard::before { content: ""; position: absolute; top: -30px; right: -30px; width: 132px; height: 132px; border-radius: 50%; border: 1px solid rgba(201,169,110,0.26); }
.compte-main .mcard .top { display: flex; align-items: flex-start; justify-content: space-between; }
.compte-main .mcard .logo { font-family: 'Libre Baskerville', Georgia, serif; font-size: 19px; font-weight: 700; color: #f5f0e6; }
.compte-main .mcard .logo i { color: #c9a96e; font-style: italic; }
.compte-main .mcard .tier { font-size: 9.5px; font-weight: 800; letter-spacing: 0.22em; text-transform: uppercase; color: #0f2218; background: linear-gradient(90deg, #e3ca94, #b8935a); border-radius: 16px; padding: 6px 13px; white-space: nowrap; }
.compte-main .mcard .k { font-size: 10px; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; font-family: 'Manrope', system-ui, sans-serif; }
.compte-main .mcard .mid { margin: 18px 0 16px; }
.compte-main .mcard .mid .k { color: rgba(245,240,230,0.4); }
.compte-main .mcard .mid b { display: block; font-family: 'Libre Baskerville', Georgia, serif; font-size: 24px; letter-spacing: 0.06em; margin-top: 4px; text-transform: uppercase; }
.compte-main .mcard .bot { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; }
.compte-main .mcard-cells { display: flex; gap: 34px; }
.compte-main .mcard .cell .k { color: rgba(245,240,230,0.4); display: block; margin-bottom: 3px; }
.compte-main .mcard .cell b { font-family: 'Libre Baskerville', Georgia, serif; font-size: 16px; letter-spacing: 0.12em; color: #c9a96e; }
.compte-main .mcard .par-btn { background: transparent; border: 1px solid rgba(201,169,110,0.55); color: #c9a96e; border-radius: 18px; padding: 7px 15px; font-size: 9.5px; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; font-family: 'Manrope', system-ui, sans-serif; cursor: pointer; white-space: nowrap; }
.compte-main .mcard .par-btn:hover { background: rgba(201,169,110,0.12); }
/* Welcome */
.compte-main [data-tab-section="profil"] .welcome-tag { color: #8a6f3f; font-family: 'Manrope', system-ui, sans-serif; }
.compte-main [data-tab-section="profil"] .welcome-name { color: #0f2218; font-family: 'Libre Baskerville', Georgia, serif; }
.compte-main [data-tab-section="profil"] .welcome-sub { color: #7a7565; font-family: 'Manrope', system-ui, sans-serif; }
/* Fidélité */
.compte-main [data-tab-section="profil"] .fid { background: #fbf8f1; box-shadow: 0 12px 30px rgba(15,34,24,0.09); }
.compte-main [data-tab-section="profil"] .fid::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, transparent, #c9a96e, transparent); z-index: 2; }
.compte-main [data-tab-section="profil"] .fid-bg1,
.compte-main [data-tab-section="profil"] .fid-bg2 { background: rgba(201,169,110,0.07); border-color: rgba(201,169,110,0.14); }
.compte-main [data-tab-section="profil"] .fid-tag { color: #0f2218; font-family: 'Libre Baskerville', Georgia, serif; font-size: 17px; font-weight: 700; text-transform: none; letter-spacing: 0; margin-bottom: 8px; }
.compte-main [data-tab-section="profil"] .fid-msg { color: #5a5346; font-family: 'Manrope', system-ui, sans-serif; }
.compte-main [data-tab-section="profil"] .fid-msg em { color: #0f2218; font-family: 'Libre Baskerville', Georgia, serif; font-style: italic; }
.compte-main [data-tab-section="profil"] .fid-bar { background: #e7e0cf; }
.compte-main [data-tab-section="profil"] .fid-bar-fill { background: linear-gradient(90deg, #d9bd85, #b8935a); }
.compte-main [data-tab-section="profil"] .fid-bar-dot { background: #b8935a; border-color: #fbf8f1; }
.compte-main [data-tab-section="profil"] .fid-bar-lbl { color: #7a7565; font-family: 'Manrope', system-ui, sans-serif; }
.compte-main [data-tab-section="profil"] .fid-bar-lbl b { color: #0f2218; }
.compte-main [data-tab-section="profil"] .fid-foot { border-top-color: #ece5d4; }
.compte-main [data-tab-section="profil"] .fid-hint { color: #7a7565; font-family: 'Manrope', system-ui, sans-serif; }
.compte-main [data-tab-section="profil"] .btn-ghost { background: #fbf8f1; border: 1px solid #cfc7b2; color: #0f2218; font-family: 'Manrope', system-ui, sans-serif; }
.compte-main [data-tab-section="profil"] .btn-ghost:hover { background: rgba(201,169,110,0.12); border-color: #c9a96e; }
.compte-main [data-tab-section="profil"] .btn-solid { background: #0f2218; color: #f5f0e6; font-family: 'Manrope', system-ui, sans-serif; }
.compte-main [data-tab-section="profil"] .btn-solid:hover { background: #1b4332; transform: none; }
/* Parrainage */
.compte-main [data-tab-section="profil"] .par { background: #fbf8f1; border-color: rgba(201,169,110,0.22); box-shadow: 0 10px 24px rgba(15,34,24,0.07); }
.compte-main [data-tab-section="profil"] .par-tag { color: #8a6f3f; font-family: 'Manrope', system-ui, sans-serif; font-size: 10px; letter-spacing: .22em; margin-bottom: 0; }
.compte-main [data-tab-section="profil"] .par-head { background: transparent; position: relative; padding: 20px 24px 12px; display: flex; align-items: center; gap: 10px; }
.compte-main [data-tab-section="profil"] .par-head::after { content: ""; position: absolute; left: 24px; right: 24px; bottom: 0; height: 1.5px; background: rgba(15,34,24,0.85); }
.compte-main [data-tab-section="profil"] .par-icon { width: 24px; height: 24px; background: rgba(201,169,110,0.15); border-radius: 7px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.compte-main [data-tab-section="profil"] .par-body { flex: 1; display: flex; flex-direction: column; padding: 16px 24px 20px; }
.compte-main [data-tab-section="profil"] .par-desc { color: #7a7565; font-family: 'Manrope', system-ui, sans-serif; font-size: 12px; line-height: 1.65; }
.compte-main [data-tab-section="profil"] .par-desc b { color: #0f2218; }
.compte-main [data-tab-section="profil"] .par-bottom { background: rgba(201,169,110,0.07); border: 1.5px dashed #c9a96e; border-radius: 10px; margin: 0 24px 22px; }
.compte-main [data-tab-section="profil"] .par-code { color: #0f2218; font-family: 'Libre Baskerville', Georgia, serif; }
.compte-main [data-tab-section="profil"] .par-btn { background: #0f2218; border: none; color: #f5f0e6; font-family: 'Manrope', system-ui, sans-serif; }
.compte-main [data-tab-section="profil"] .par-btn:hover { background: #1b4332; }
/* Cartes action (commande + adresse) — scopé Profil (onglet Adresses/Réglages intact) */
.compte-main [data-tab-section="profil"] .act { background: #fbf8f1; border-color: rgba(201,169,110,0.22); box-shadow: 0 10px 24px rgba(15,34,24,0.07); display: flex; flex-direction: column; }
.compte-main [data-tab-section="profil"] .act-head { background: transparent; position: relative; padding: 20px 24px 12px; }
.compte-main [data-tab-section="profil"] .act-head::after { content: ""; position: absolute; left: 24px; right: 24px; bottom: 0; height: 1.5px; background: rgba(15,34,24,0.85); }
.compte-main [data-tab-section="profil"] .act-ico { background: rgba(201,169,110,0.15); }
.compte-main [data-tab-section="profil"] .act-body { flex: 1; display: flex; flex-direction: column; padding: 16px 24px 20px; }
.compte-main [data-tab-section="profil"] .act-tag { color: #8a6f3f; font-family: 'Manrope', system-ui, sans-serif; font-size: 10px; letter-spacing: .22em; }
.compte-main [data-tab-section="profil"] .act-title { color: #0f2218; font-family: 'Libre Baskerville', Georgia, serif; font-size: 16.5px; }
.compte-main [data-tab-section="profil"] .act-desc { color: #7a7565; font-family: 'Manrope', system-ui, sans-serif; font-size: 12px; line-height: 1.65; }
.compte-main [data-tab-section="profil"] .act-link { color: #0f2218; border-bottom-color: #0f2218; font-family: 'Manrope', system-ui, sans-serif; font-size: 10.5px; font-weight: 800; letter-spacing: .16em; margin-top: auto; align-self: flex-start; }

/* SÉPARATEUR */
.compte-main .sep { display: flex; align-items: center; gap: 14px; }
.compte-main .sep-l { flex: 1; height: 1px; background: linear-gradient(90deg,transparent,#d4c9b0); }
.compte-main .sep-r { flex: 1; height: 1px; background: linear-gradient(90deg,#d4c9b0,transparent); }
.compte-main .sep-c { display: flex; gap: 5px; align-items: center; }
.compte-main .sep-s { width: 4px; height: 4px; border-radius: 50%; background: #c9a96e; opacity: .4; }
.compte-main .sep-b { width: 7px; height: 7px; border-radius: 50%; background: #c9a96e; }
.compte-main .sep-d { width: 18px; height: 1px; background: #c9a96e; opacity: .5; }

/* SECTION ACQUISITIONS */
.compte-main .sec-head { background: #1b4332; border-radius: 16px; padding: 16px 26px; display: flex; justify-content: space-between; align-items: center; }
.compte-main .sec-left .sec-tag { font-size: 8px; letter-spacing: 3px; color: rgba(201,169,110,0.4); text-transform: uppercase; font-family: sans-serif; margin-bottom: 3px; }
.compte-main .sec-left .sec-title { font-size: 22px; color: #fff; font-weight: 400; }
.compte-main .sec-right { display: flex; align-items: center; gap: 20px; }
.compte-main .sec-count { font-size: 40px; color: rgba(201,169,110,0.25); font-family: sans-serif; font-weight: 300; line-height: 1; }
.compte-main .sec-lnk { font-size: 8px; letter-spacing: 2px; color: rgba(201,169,110,0.6); text-transform: uppercase; font-family: sans-serif; font-weight: 700; border-bottom: 1px solid rgba(201,169,110,0.3); padding-bottom: 1px; cursor: pointer; }

/* COMMANDES */
.compte-main .ords { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.compte-main .ord { background: #1b4332; border-radius: 16px; padding: 20px; position: relative; overflow: hidden; transition: transform .2s; }
.compte-main .ord:hover { transform: translateY(-2px); }
.compte-main .ord-d1 { position: absolute; top: -20px; right: -20px; width: 90px; height: 90px; border-radius: 50%; opacity: .12; }
.compte-main .ord-d2 { position: absolute; bottom: -25px; left: -15px; width: 70px; height: 70px; border-radius: 50%; opacity: .08; }
.compte-main .ord-in { position: relative; z-index: 1; }
.compte-main .ord-st { font-size: 8px; letter-spacing: 2px; text-transform: uppercase; font-family: sans-serif; font-weight: 700; margin-bottom: 6px; }
.compte-main .ord-top { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 10px; }
.compte-main .ord-ref { font-size: 15px; color: #fff; }
.compte-main .ord-date { font-size: 10px; color: rgba(255,255,255,0.28); font-family: sans-serif; margin-top: 3px; }
.compte-main .ord-amt { font-size: 22px; font-weight: 700; font-family: sans-serif; line-height: 1; }
.compte-main .ord-sep { height: 1px; background: rgba(255,255,255,0.07); margin: 10px 0; }
.compte-main .ord-lnk { font-size: 8px; letter-spacing: 2px; text-transform: uppercase; font-family: sans-serif; font-weight: 700; }
/* couleurs accent gold */
.compte-main .gold .ord-st, .compte-main .gold .ord-lnk { color: rgba(201,169,110,0.65); }
.compte-main .gold .ord-amt { color: #c9a96e; }
.compte-main .gold .ord-d1, .compte-main .gold .ord-d2 { background: #c9a96e; }
/* couleurs accent rouge */
.compte-main .red-acc .ord-st, .compte-main .red-acc .ord-amt { color: rgba(224,123,114,0.8); }
.compte-main .red-acc .ord-d1, .compte-main .red-acc .ord-d2 { background: #e07b72; }

/* ── Sidebar hidden at ≤768px (already done by existing @media, but reinforce) ── */
@media (max-width: 768px) {
  .compte-sidebar .sb-top,
  .compte-sidebar .sb-bar-wrap,
  .compte-sidebar .sb-sep,
  .compte-sidebar .sb-menu,
  .compte-sidebar .sb-shop,
  .compte-sidebar .sb-orb1,
  .compte-sidebar .sb-orb2 { display: none !important; }
}

@media (min-width: 1101px) {
  .compte-layout { gap: 0; margin: 0; padding: 0; max-width: 100%; grid-template-columns: 280px 1fr; }
  .compte-sidebar { width: 280px; min-width: 280px; height: auto; min-height: 100%; position: relative; top: auto; }
  .compte-layout > main { padding: 0; min-width: 0; }
}

/* END COMPTE PC v2 */

/* Cercles décoratifs hero — cachés mobile */
.catalogue-hero__circle1,
.catalogue-hero__circle2 { display: none; }

/* Bouton retour en haut */
.back-top-wrap {
  position: fixed;
  bottom: 72px;
  right: 32px;
  left: auto;
  display: flex;
  z-index: 9999;
  pointer-events: none;
  opacity: 0;
  transition: opacity .3s;
}
.back-top-wrap.visible {
  opacity: 1;
}
.back-top-btn {
  pointer-events: all;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: transparent;
  border: 1.5px solid rgba(201,169,110,.4);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: border-color .2s, background .2s;
  color: #c9a96e;
}
.back-top-btn:hover {
  border-color: #c9a96e;
  background: rgba(201,169,110,0.08);
}

/* ===== CATALOGUE PC REDESIGN — Consolidé (ref: catalogue_pc_final.html) ===== */
@media (min-width: 1101px) {

  /* Fond sombre */
  body:has(#catalogue-grid) { background: #0f2218; }
  body:has(#catalogue-grid) .shop-container { background: #0f2218; }
  .product-grid { background: transparent; }
  .shop-intro h1 { color: white; }
  .shop-intro p { color: rgba(255,255,255,.4); }

  /* Carte (.item-card → .pc) */
  .item-card {
    position: relative;
    background: #f5f0e6;
    border: 1px solid rgba(201,169,110,.25);
    border-radius: 18px;
    min-height: unset;
    height: 310px;
    padding: 0;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.165,0.84,0.44,1);
  }
  .item-card:hover {
    background: #ede7d8;
    border-color: rgba(201,169,110,.5);
    transform: translateY(-6px);
    box-shadow: 0 8px 32px rgba(0,0,0,.12);
  }
  .flip-scene { height: 310px; }

  /* Image (.img-box → .pc-img) */
  .img-box {
    height: 170px;
    background: transparent;
    border-bottom: none;
    border-radius: 0;
    margin-bottom: 0;
    padding: 0;
    width: 100%;
    position: relative;
    overflow: hidden;
  }
  .img-box,
  .img-box .card-img-wrap,
  .img-box img {
    border-radius: 18px 18px 0 0 !important;
  }
  .img-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .item-card .card-img-wrap img { transition: transform 0.5s; }
  .item-card:hover .card-img-wrap img { transform: scale(1.05); }

  /* Badge (.c-badge → .bdg) */
  .c-badge {
    background: rgba(15,34,24,.82);
    border: 1px solid rgba(201,169,110,.18);
    padding: 3px 9px;
    border-radius: 6px;
    font-size: 0.46rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: rgba(201,169,110,.85);
  }
  .c-badge.green {
    background: rgba(15,34,24,.82);
    border-color: rgba(201,169,110,.18);
    color: rgba(201,169,110,.85);
  }
  .c-badge.brown {
    background: rgba(15,34,24,.82);
    border-color: rgba(220,170,100,.25);
    color: rgba(220,170,100,.9);
  }

  /* Filtres desktop */
  .filter-bar .filter-btn {
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.1);
    color: rgba(255,255,255,.42);
    font-size: 0.6rem;
    letter-spacing: 1.5px;
  }
  .filter-bar .filter-btn:hover {
    border-color: rgba(201,169,110,.4);
    color: #c9a96e;
    background: transparent;
    box-shadow: none;
  }
  .filter-bar .filter-btn--active {
    background: #c9a96e;
    border-color: #c9a96e;
    color: #0f2218;
  }
  .filter-bar .filter-btn--active:hover {
    background: #c9a96e;
    border-color: #c9a96e;
    color: #0f2218;
  }
  .filter-bar .filter-btn--active svg { stroke: #1b4332 !important; }

  /* Info (.card-info → .pc-body / .pc-name / .pc-desc) */
  .card-info {
    padding-top: 14px;
    border-top: 1px solid rgba(15,34,24,.08);
  }
  .card-cat {
    display: block;
    font-size: 0.52rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: rgba(160,120,64,.8);
    margin-bottom: 5px;
  }
  .card-info h3 {
    color: #0f2218;
    font-size: 0.95rem;
    min-height: unset;
    line-height: 1.25;
    margin-bottom: 5px;
    text-transform: capitalize;
  }
  .card-info p {
    color: rgba(15,34,24,.45);
    font-size: 0.75rem;
    line-height: 1.6;
    min-height: unset;
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  /* Footer (.card-footer → .pc-foot) */
  .card-footer {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    padding: 0 16px 16px;
    padding-top: 10px;
    border-top: 1px solid rgba(15,34,24,.08);
    margin-top: auto;
  }
  .card-price { flex-direction: column; }
  .card-price label {
    display: block;
    color: rgba(15,34,24,.35);
    font-size: 0.5rem;
    font-weight: 700;
    letter-spacing: 1px;
    margin-bottom: 1px;
  }
  .card-price b {
    color: #a07840;
    font-size: 1.1rem;
  }
  .card-price .pp-new {
    font-size: 0.95rem;
  }
  .card-price .pp-old {
    font-size: 0.85rem;
    text-decoration: line-through;
    opacity: 0.6;
  }

  /* Bouton Découvrir (.btn-discover → .pc-cta) */
  .btn-discover {
    display: inline-flex;
    align-items: center;
    color: rgba(15,34,24,.55);
    background: none;
    font-size: 0.55rem;
    padding: 0 0 1px 0;
    border: none;
    border-bottom: 1px solid rgba(15,34,24,.15);
    border-radius: 50px;
    overflow: visible;
    position: static;
    cursor: pointer;
    margin-right: 40px;
    transition: transform 0.25s ease, color 0.25s ease;
  }
  .btn-discover::after {
    content: " \2192";
    display: inline-block;
    position: static;
    width: auto;
    height: auto;
    background: none;
    transform: none;
    margin-left: 4px;
    transition: transform 0.25s ease;
  }
  .item-card:hover .btn-discover {
    color: rgba(15, 34, 24, 0.85);
    transform: translateX(3px);
    background: none;
    box-shadow: none;
    padding: 0 0 1px 0;
  }
  .item-card:hover .btn-discover::after {
    transform: translateX(2px);
  }

  /* Bouton panier (.card-flip-btn → .pc-cart) */
  .card-flip-btn {
    position: absolute;
    bottom: 14px;
    right: 16px;
    background: #b68d40;
    color: #1b4332;
    border: none;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    z-index: 3;
  }
  .card-flip-btn:hover {
    background: #1b4332;
    color: #b68d40;
    transform: scale(1.08);
  }

  /* Header transparent catalogue */
  body:has(#catalogue-grid) .lux-header {
    background: rgba(15,34,24,0);
    backdrop-filter: none;
    border-bottom: 1px solid transparent;
    transition: all .4s;
    padding-left: 56px;
    padding-right: 56px;
  }
  body:has(#catalogue-grid) .lux-header .lux-header__link {
    color: rgba(255,255,255,.38);
    font-size: .63rem;
    font-weight: 700;
    letter-spacing: 2.5px;
  }
  body:has(#catalogue-grid) .lux-header__nav {
    gap: 20px;
  }
  body:has(#catalogue-grid) .lux-header .lux-header__link:hover,
  body:has(#catalogue-grid) .lux-header .lux-header__link--active {
    color: #c9a96e;
  }
  body:has(#catalogue-grid) .lux-header .logo {
    color: white;
    font-family: 'Libre Baskerville', serif;
    font-size: 1.3rem;
    letter-spacing: .2px;
  }
  body:has(#catalogue-grid) .lux-header .logo em {
    color: #c9a96e;
    font-style: italic;
  }
  body:has(#catalogue-grid) .lux-header.scrolled .logo {
    color: #1b4332;
  }
  body:has(#catalogue-grid) .lux-header.scrolled .logo em {
    color: #c9a96e;
  }
  body:has(#catalogue-grid) .lux-header .header-logo-img img {
    filter: brightness(0) invert(1);
  }
  body:has(#catalogue-grid) .lux-header .lux-compte-icon svg circle:first-child {
    fill: transparent;
    stroke: rgba(255,255,255,.12);
    stroke-width: 1;
  }
  body:has(#catalogue-grid) .lux-header .btn-cart-nav {
    background: transparent;
    border: 1px solid rgba(255,255,255,.12);
  }
  body:has(#catalogue-grid) .lux-header .lux-compte-icon:hover svg circle:first-child {
    stroke: rgba(201,169,110,.4);
  }
  body:has(#catalogue-grid) .lux-header .btn-cart-nav:hover {
    border-color: rgba(201,169,110,.4);
  }
  body:has(#catalogue-grid) .lux-header.scrolled .lux-compte-icon svg circle:first-child {
    fill: #c9a96e;
    stroke: none;
    stroke-width: 0;
  }
  body:has(#catalogue-grid) .lux-header.scrolled .btn-cart-nav {
    background: #c9a96e;
    border: none;
  }
  body:has(#catalogue-grid) .lux-header.scrolled .lux-compte-icon svg path {
    fill: #1b4332;
  }
  body:has(#catalogue-grid) .lux-header.scrolled .lux-compte-icon svg text {
    fill: #1b4332;
  }
  body:has(#catalogue-grid) .lux-header.scrolled .btn-cart-nav svg {
    stroke: #1b4332;
  }
  /* Header scrollé catalogue */
  body:has(#catalogue-grid) .lux-header.scrolled {
    background: rgba(250,250,247,.97);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(0,0,0,.06);
  }
  body:has(#catalogue-grid) .lux-header.scrolled .lux-header__link {
    color: rgba(27,61,40,.6);
  }
  body:has(#catalogue-grid) .lux-header.scrolled .lux-header__link:hover,
  body:has(#catalogue-grid) .lux-header.scrolled .lux-header__link--active {
    color: #c9a96e;
  }
  body:has(#catalogue-grid) .lux-header.scrolled .header-logo-img img {
    filter: none;
  }
  /* Hero catalogue desktop */
  body:has(#catalogue-grid) .catalogue-hero {
    display: block;
    background: #0f2218;
    position: relative;
    overflow: hidden;
    padding: 0;
    margin-top: -70px;
    padding-top: 70px;
  }
  body:has(#catalogue-grid) .catalogue-hero::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
      radial-gradient(ellipse 50% 60% at 80% 35%, rgba(201,169,110,.08), transparent 55%),
      radial-gradient(ellipse 30% 40% at 5% 90%, rgba(45,90,61,.45), transparent 50%);
    pointer-events: none;
    z-index: 1;
  }
  body:has(#catalogue-grid) .catalogue-hero::before {
    content: '';
    position: absolute;
    left: 56px;
    top: 0;
    bottom: 0;
    width: 1px;
    background: linear-gradient(to bottom, transparent, rgba(201,169,110,.09) 20%, rgba(201,169,110,.09) 80%, transparent);
    pointer-events: none;
  }
  body:has(#catalogue-grid) .catalogue-hero__circle1,
  body:has(#catalogue-grid) .catalogue-hero__circle2 {
    display: block;
  }
  body:has(#catalogue-grid) .catalogue-hero__circle1 {
    position: absolute;
    width: 700px;
    height: 700px;
    border-radius: 50%;
    border: 1px solid rgba(201,169,110,.05);
    top: -160px;
    right: -160px;
    pointer-events: none;
    z-index: 0;
  }
  body:has(#catalogue-grid) .catalogue-hero__circle2 {
    position: absolute;
    width: 440px;
    height: 440px;
    border-radius: 50%;
    border: 1px solid rgba(201,169,110,.03);
    top: -10px;
    right: 80px;
    pointer-events: none;
    z-index: 0;
  }
  .catalogue-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    border: 1px solid rgba(201,169,110,.2);
    border-radius: 50px;
    padding: 6px 18px;
    margin-bottom: 30px;
    font-size: 0.57rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 3px;
    color: #c9a96e;
  }
  .catalogue-hero__dot {
    width: 5px;
    height: 5px;
    background: #c9a96e;
    border-radius: 50%;
    animation: heroDotBlink 2.5s ease-in-out infinite;
  }
  @keyframes heroDotBlink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
  }
  .catalogue-hero__h1 {
    font-family: 'Libre Baskerville', serif;
    font-size: clamp(3.5rem, 6vw, 6rem);
    color: white;
    line-height: 0.95;
    letter-spacing: -0.8px;
    margin-bottom: 28px;
  }
  .catalogue-hero__h1 em {
    color: #c9a96e;
    font-style: italic;
    display: block;
  }
  .catalogue-hero__p {
    font-size: 0.95rem;
    color: rgba(255,255,255,.4);
    line-height: 1.85;
    max-width: 420px;
    margin-bottom: 44px;
  }
  /* Masquer shop-intro sur desktop catalogue */
  body:has(#catalogue-grid) .shop-intro {
    display: none;
  }
  /* Filtres hero */
  .catalogue-hero__filters {
    display: flex !important;
    gap: 7px;
    flex-wrap: wrap;
  }
  .catalogue-hero__filters .hf {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 18px;
    border-radius: 50px;
    border: 1px solid rgba(255,255,255,.1);
    background: rgba(255,255,255,.04);
    font-family: 'Manrope', sans-serif;
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: rgba(255,255,255,.42);
    cursor: pointer;
    transition: all 0.22s;
  }
  .catalogue-hero__filters .hf:hover {
    border-color: rgba(201,169,110,.4);
    color: #c9a96e;
  }
  .catalogue-hero__filters .hf.on {
    background: #c9a96e;
    border-color: #c9a96e;
    color: #0f2218;
  }
  /* Masquer filter-bar originaux en desktop */
  body:has(#catalogue-grid) .filter-bar {
    display: none;
  }
  /* Hero grid 2 colonnes */
  body:has(#catalogue-grid) .catalogue-hero__inner {
    display: grid;
    grid-template-columns: 1fr 420px;
    gap: 32px;
    align-items: flex-end;
    padding: 50px 56px 28px 58px;
    position: relative;
    z-index: 2;
  }
  /* Slider hero */
  body:has(#catalogue-grid) .catalogue-hero__slider {
    display: block;
    position: relative;
    perspective: 900px;
    perspective-origin: 50% 30%;
  }
  .hero-slides-wrap {
    position: relative;
    height: 380px;
  }
  .hero-slide {
    position: absolute;
    inset: 0;
    background: #f5f0e6;
    border: 1px solid rgba(201,169,110,.35);
    border-radius: 22px;
    padding: 28px;
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    gap: 18px;
    transform-origin: 50% 100%;
    transform-style: preserve-3d;
    backface-visibility: hidden;
    opacity: 0;
    pointer-events: none;
  }
  .hero-slide.active {
    opacity: 1;
    pointer-events: auto;
    animation: heroSlideIn .5s cubic-bezier(.22,1,.36,1) forwards;
  }
  .hero-slide.leaving {
    animation: heroSlideOut .8s cubic-bezier(.55,0,1,.45) forwards;
  }
  @keyframes heroSlideIn {
    0% { opacity: 0; transform: rotateX(-95deg) translateY(-20px); }
    50% { opacity: 1; }
    100% { opacity: 1; transform: rotateX(0deg) translateY(0); }
  }
  @keyframes heroSlideOut {
    0% { opacity: 1; transform: rotateX(0deg); }
    100% { opacity: 0; transform: rotateX(90deg) translateY(30px) scale(.9); }
  }
  .hero-slide__img {
    width: 100%;
    height: 160px;
    background: #F5F0E6;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid rgba(201,169,110,.2);
  }
  .hero-slide__cat {
    font-size: 0.53rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2.5px;
    color: rgba(160,120,64,.75);
  }
  .hero-slide__name {
    font-family: 'Libre Baskerville', serif;
    font-size: 1.5rem;
    color: #0f2218;
    line-height: 1.15;
  }
  .hero-slide__price {
    font-size: 0.68rem;
    color: rgba(15,34,24,.4);
  }
  .hero-slide__price strong {
    color: #a07840;
    font-family: 'Libre Baskerville', serif;
    font-size: 1.1rem;
  }
  .hero-slide__cta {
    font-size: 0.55rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: rgba(160,120,64,.6);
    margin-top: 2px;
  }
  /* Nav slider */
  .hero-slider-nav {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    pointer-events: none;
    z-index: 10;
  }
  .hero-arrow {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 1.5px solid rgba(201,169,110,.4);
    background: rgba(15,34,24,.7);
    backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.22s;
    pointer-events: all;
    color: #c9a96e;
  }
  .hero-arrow:hover {
    border-color: #c9a96e;
    background: rgba(201,169,110,.2);
  }
  .hero-arrow.prev { transform: translateX(-50%); }
  .hero-arrow.next { transform: translateX(50%); }
  /* Dots */
  .hero-slider-dots {
    display: flex;
    gap: 7px;
    justify-content: center;
    margin-top: 16px;
  }
  .hero-dot {
    width: 22px;
    height: 2px;
    border-radius: 2px;
    background: rgba(255,255,255,.12);
    cursor: pointer;
    transition: all 0.3s;
  }
  .hero-dot.on {
    background: #c9a96e;
    width: 32px;
  }

  /* ===== Sections catégorie desktop (étape 10B) ===== */
  body:has(#catalogue-grid) .cat-body-desktop {
    display: block;
    background: #0f2218;
    padding: 0 56px 80px;
    position: relative;
  }
  body:has(#catalogue-grid) .cat-body-desktop::before {
    content: '';
    position: absolute;
    left: 56px;
    top: 0;
    bottom: 0;
    width: 1px;
    background: linear-gradient(to bottom, rgba(201,169,110,.07), rgba(201,169,110,.07));
    pointer-events: none;
  }
  .cat-sec {
    margin-bottom: 28px;
  }
  .cat-sec__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 28px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255,255,255,.07);
    position: relative;
  }
  .cat-sec__head::after {
    content: '';
    position: absolute;
    bottom: -1px;
    right: 0;
    width: 260px;
    height: 1px;
    background: linear-gradient(to left, rgba(201,169,110,.45), transparent);
  }
  .cat-sec__label {
    font-size: 0.55rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 3px;
    color: #c9a96e;
    opacity: 0.7;
    display: block;
    margin-bottom: 8px;
  }
  .cat-sec__title {
    font-family: 'Libre Baskerville', serif;
    font-size: 1.6rem;
    color: white;
    line-height: 1.1;
  }
  .cat-sec__title em {
    color: #c9a96e;
    font-style: italic;
  }
  .cat-sec__count {
    font-size: 0.62rem;
    color: rgba(255,255,255,.25);
    font-weight: 600;
  }
  .cat-sec__divider {
    height: 1px;
    background: linear-gradient(to right, transparent, rgba(201,169,110,.12), transparent);
    margin: 0 0 28px;
  }
  .cat-sec__carousel-wrap {
    position: relative;
    padding: 0 52px;
  }
  .cat-sec__carousel {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding: 16px 0 12px;
  }
  .cat-sec__carousel::-webkit-scrollbar {
    display: none;
  }
  .cat-sec__carousel .flip-scene {
    width: 260px;
    min-width: 260px;
    max-width: 260px;
    flex-shrink: 0;
  }
  .cat-sec__carousel .flip-scene .item-card {
    height: 100%;
  }
  .cat-sec__carousel .flip-scene .card-img-wrap {
    height: 180px;
    overflow: hidden;
  }
  .cat-sec__carousel .flip-scene .card-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .cat-sec__arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1.5px solid rgba(201,169,110,.4);
    background: rgba(15,34,24,.85);
    backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.22s;
    z-index: 10;
    color: #c9a96e;
  }
  .cat-sec__arrow:hover {
    border-color: #c9a96e;
    background: rgba(201,169,110,.2);
  }
  .cat-sec__arrow.prev { left: 0; }
  .cat-sec__arrow.next { right: 0; }

  /* Trust badges override — catalogue only */
  body:has(#catalogue-grid) .trust-seal-strip {
    background: #0f2218;
    padding: 48px 56px 40px;
    border-top: none;
    position: relative;
  }
  body:has(#catalogue-grid) .trust-seal-strip::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(to right, transparent, rgba(201,169,110,.12), transparent);
  }
  body:has(#catalogue-grid) .trust-seal-strip .seal-circle {
    background: transparent;
    border-color: rgba(201,169,110,.3);
  }
  body:has(#catalogue-grid) .trust-seal-strip .seal-circle svg {
    stroke: #c9a96e;
  }
  body:has(#catalogue-grid) .trust-seal-strip label {
    color: #c9a96e;
  }
  body:has(#catalogue-grid) .seal-circle {
    transition: all 0.22s;
  }
  body:has(#catalogue-grid) .seal-item:hover .seal-circle {
    background: #c9a96e;
    border-color: #c9a96e;
  }
  body:has(#catalogue-grid) .seal-item:hover .seal-circle svg {
    stroke: #0f2218;
  }

  /* Masquer grille plate en desktop quand sections actives */
  body:has(.cat-body-desktop) .product-grid {
    display: none;
  }

}

/* Keyframes slider hero (global — utilisés mobile + desktop) */
@keyframes heroSlideInMob {
  0% { opacity: 0; transform: translateY(18px) scale(.96); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes heroSlideOutMob {
  0% { opacity: 1; transform: translateY(0) scale(1); }
  100% { opacity: 0; transform: translateY(-12px) scale(.94); }
}

/* Sections catégorie desktop — caché par défaut (global) */
.cat-body-desktop { display: none; }

/* Hero catalogue — caché par défaut (mobile) */
.catalogue-hero { display: none; }
.catalogue-hero__filters { display: none; }
.catalogue-hero__slider { display: none; }

/* ============================================================
   PAGE CGV — Styles desktop
   ============================================================ */

/* --- Fond sombre CGV + pseudo-éléments grain/ambient --- */
body:has(.cgv-wrap) {
  background-color: #070c09 !important;
  color-scheme: dark !important;
}
body:has(.cgv-wrap)::before {
  content: '';
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 45% 35% at 90% 5%, rgba(201,169,110,0.045), transparent 50%),
    radial-gradient(ellipse 30% 50% at 3% 85%, rgba(201,169,110,0.06), transparent 40%),
    radial-gradient(circle at 50% 50%, rgba(201,169,110,0.008) 1px, transparent 1px);
  background-size: 100% 100%, 100% 100%, 3px 3px;
}


/* --- CGV Hero --- */
.cgv-hero {
  position: relative; z-index: 2;
  padding: 90px 80px 64px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  overflow: hidden;
}
.cgv-hero__ring {
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(201,169,110,0.05);
  pointer-events: none;
}
.cgv-hero__ring--1 { width: 480px; height: 480px; top: -160px; right: -120px; }
.cgv-hero__ring--2 { width: 300px; height: 300px; top: -40px; right: 60px; border-color: rgba(201,169,110,0.03); }
.cgv-hero__ring--3 { width: 560px; height: 560px; bottom: -240px; left: -180px; border-color: rgba(201,169,110,0.03); }

.cgv-hero__top-line {
  width: 1px; height: 48px;
  background: linear-gradient(to bottom, transparent, rgba(201,169,110,0.35));
  margin-bottom: 20px;
}
.cgv-hero__badge {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 5px 14px;
  border: 1px solid rgba(201,169,110,0.12);
  border-radius: 20px;
  background: rgba(201,169,110,0.04);
  margin-bottom: 24px;
}
.cgv-hero__badge svg {
  width: 11px; height: 11px;
  stroke: rgba(201,169,110,0.55); fill: none;
  stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
}
.cgv-hero__badge span {
  font-size: 0.58rem; font-weight: 700;
  letter-spacing: 3.5px; text-transform: uppercase;
  color: rgba(201,169,110,0.45);
}
.cgv-hero__title {
  font-family: 'Libre Baskerville', serif;
  font-size: 3rem; font-weight: 700;
  color: rgba(255,255,255,0.90);
  line-height: 1.15;
  margin-bottom: 14px;
  position: relative; z-index: 2;
}
.cgv-hero__title em { color: #e8c98a; font-style: italic; }
.cgv-hero__diamond {
  display: flex; align-items: center; gap: 14px;
  margin: 12px 0 14px;
}
.cgv-hero__diamond::before,
.cgv-hero__diamond::after {
  content: '';
  height: 1px; width: 80px;
  background: linear-gradient(to right, transparent, rgba(201,169,110,0.25));
}
.cgv-hero__diamond::after {
  background: linear-gradient(to left, transparent, rgba(201,169,110,0.25));
}
.cgv-hero__diamond-gem {
  width: 6px; height: 6px;
  background: #c9a96e;
  transform: rotate(45deg);
  opacity: 0.5;
}
.cgv-hero__sub {
  font-size: 0.7rem; font-weight: 600;
  letter-spacing: 2px; text-transform: uppercase;
  color: rgba(255,255,255,0.22);
  margin-bottom: 4px;
  position: relative; z-index: 2;
}
.cgv-hero__date {
  font-size: 0.62rem; font-weight: 500;
  color: rgba(201,169,110,0.28);
  letter-spacing: 1.5px;
  position: relative; z-index: 2;
}

/* --- CGV Layout principal --- */
body:has(.cgv-wrap) .cgv-wrap {
  max-width: 920px;
  margin: 0 auto;
  padding: 0 80px 100px;
  position: relative; z-index: 2;
}

/* --- CGV Sommaire --- */
.cgv-toc {
  margin-bottom: 52px;
  padding: 0;
  border-radius: 16px;
  background: rgba(201,169,110,0.025);
  border: 1px solid rgba(201,169,110,0.08);
  backdrop-filter: blur(8px);
  overflow: hidden;
}
.cgv-toc__header {
  padding: 18px 28px;
  border-bottom: 1px solid rgba(201,169,110,0.08);
  display: flex; align-items: center; gap: 12px;
}
.cgv-toc__header-icon {
  width: 30px; height: 30px;
  border-radius: 8px;
  background: rgba(201,169,110,0.06);
  border: 1px solid rgba(201,169,110,0.1);
  display: flex; align-items: center; justify-content: center;
}
.cgv-toc__header-icon svg {
  width: 13px; height: 13px;
  stroke: rgba(201,169,110,0.6); fill: none;
  stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
}
.cgv-toc__header-label {
  font-size: 0.6rem; font-weight: 800;
  letter-spacing: 3px; text-transform: uppercase;
  color: rgba(201,169,110,0.4);
}
.cgv-toc__header-line {
  flex: 1; height: 1px;
  background: linear-gradient(to right, rgba(201,169,110,0.1), transparent);
  margin-left: 8px;
}
.cgv-toc__body {
  padding: 20px 28px 24px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2px 24px;
  list-style: none;
}
.cgv-toc__body a {
  display: flex; align-items: center; gap: 12px;
  padding: 8px 10px;
  border-radius: 8px;
  text-decoration: none;
  color: rgba(255,255,255,0.35);
  font-size: 0.72rem; font-weight: 600;
  transition: all 0.22s;
}
.cgv-toc__body a:hover {
  background: rgba(201,169,110,0.04);
  color: rgba(255,255,255,0.75);
  transform: translateX(3px);
}
.cgv-toc__num {
  font-family: 'Libre Baskerville', serif;
  font-size: 0.65rem; font-weight: 700;
  color: rgba(201,169,110,0.28);
  min-width: 24px;
  transition: color 0.22s;
}
.cgv-toc__body a:hover .cgv-toc__num { color: #c9a96e; }

/* --- CGV Sections --- */
.cgv-sec {
  margin-bottom: 10px;
  scroll-margin-top: 80px;
}
.cgv-sec__card {
  padding: 32px 36px;
  border-radius: 16px;
  background: rgba(201,169,110,0.025);
  border: 1px solid rgba(201,169,110,0.08);
  backdrop-filter: blur(6px);
  position: relative;
  overflow: hidden;
  transition: border-color 0.3s, box-shadow 0.3s;
}
.cgv-sec__card:hover {
  border-color: rgba(201,169,110,0.25);
  box-shadow: 0 8px 40px rgba(0,0,0,0.25), inset 0 0 0 1px rgba(201,169,110,0.04);
}
.cgv-sec__card::before {
  content: '';
  position: absolute;
  left: 0; top: 16px; bottom: 16px;
  width: 3px;
  border-radius: 0 2px 2px 0;
  background: linear-gradient(to bottom,
    transparent,
    rgba(201,169,110,0.45) 25%,
    rgba(201,169,110,0.3) 75%,
    transparent);
}
.cgv-sec__wm {
  position: absolute;
  right: 28px; top: 12px;
  font-family: 'Libre Baskerville', serif;
  font-size: 5.5rem; font-weight: 700;
  color: rgba(201,169,110,0.045);
  line-height: 1;
  pointer-events: none;
  user-select: none;
  letter-spacing: -4px;
}
.cgv-sec__head {
  display: flex; align-items: baseline;
  gap: 14px; margin-bottom: 18px;
}
.cgv-sec__num {
  font-family: 'Libre Baskerville', serif;
  font-size: 0.65rem; font-weight: 700;
  color: rgba(201,169,110,0.45);
  padding: 3px 8px;
  border: 1px solid rgba(201,169,110,0.12);
  border-radius: 4px;
  background: rgba(201,169,110,0.04);
  letter-spacing: 1px;
}
.cgv-sec__title {
  font-family: 'Libre Baskerville', serif;
  font-size: 1.05rem; font-weight: 700;
  color: rgba(255,255,255,0.90);
  line-height: 1.25;
}
.cgv-sec__sep {
  height: 1px; margin-bottom: 18px;
  background: linear-gradient(to right, rgba(201,169,110,0.14) 0%, rgba(201,169,110,0.04) 50%, transparent 90%);
}
.cgv-sec__text {
  font-size: 0.79rem; line-height: 1.95;
  color: rgba(255,255,255,0.60); font-weight: 400;
  margin-bottom: 12px;
}
.cgv-sec__text:last-child { margin-bottom: 0; }
.cgv-sec__text strong { color: rgba(255,255,255,0.90); font-weight: 700; }
.cgv-sec__text a {
  color: #e8c98a; text-decoration: none;
  border-bottom: 1px solid rgba(201,169,110,0.22);
  transition: border-color 0.2s;
}
.cgv-sec__text a:hover { border-color: #e8c98a; }

.cgv-sec__list {
  list-style: none;
  margin: 10px 0 14px;
  padding-left: 4px;
}
.cgv-sec__list li {
  font-size: 0.77rem; line-height: 1.9;
  color: rgba(255,255,255,0.52);
  font-weight: 400;
  padding-left: 20px;
  position: relative;
  margin-bottom: 4px;
}
.cgv-sec__list li::before {
  content: '';
  position: absolute;
  left: 0; top: 8px;
  width: 5px; height: 5px;
  background: rgba(201,169,110,0.35);
  transform: rotate(45deg);
}
.cgv-sec__list li strong { color: rgba(255,255,255,0.90); font-weight: 600; }

/* Alert box CGV */
.cgv-sec__alert {
  margin: 16px 0;
  padding: 16px 20px 16px 22px;
  border-radius: 10px;
  background: rgba(201,169,110,0.05);
  border: 1px solid rgba(201,169,110,0.12);
  display: flex; align-items: flex-start; gap: 13px;
  position: relative; overflow: hidden;
}
.cgv-sec__alert::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: linear-gradient(to bottom, #c9a96e, #a07840);
  opacity: 0.6;
}
.cgv-sec__alert svg {
  width: 15px; height: 15px;
  stroke: rgba(201,169,110,0.7);
  fill: none; stroke-width: 1.5;
  stroke-linecap: round; stroke-linejoin: round;
  flex-shrink: 0; margin-top: 2px;
}
.cgv-sec__alert p {
  font-size: 0.74rem; line-height: 1.8;
  color: rgba(255,255,255,0.55); font-weight: 500;
}
.cgv-sec__alert p strong { color: rgba(201,169,110,0.8); font-weight: 700; }

/* --- CGV Scroll reveal --- */
.cgv-reveal {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 0.55s cubic-bezier(0.22,1,0.36,1),
              transform 0.55s cubic-bezier(0.22,1,0.36,1);
}
.cgv-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* --- CGV Header overrides desktop (transparent sur fond sombre) --- */
@media (min-width: 1101px) {
  body:has(.cgv-wrap) .lux-header {
    position: relative !important;
    background: rgba(15,34,24,0);
    backdrop-filter: none;
    border-bottom: 1px solid transparent;
    transition: all .4s;
    padding-left: 56px;
    padding-right: 56px;
  }
  body:has(.cgv-wrap) .lux-header .lux-header__link {
    color: rgba(255,255,255,.38);
    font-size: .63rem;
    font-weight: 700;
    letter-spacing: 2.5px;
  }
  body:has(.cgv-wrap) .lux-header__nav {
    gap: 36px;
  }
  body:has(.cgv-wrap) .lux-header .lux-header__link:hover,
  body:has(.cgv-wrap) .lux-header .lux-header__link--active {
    color: #c9a96e;
  }
  body:has(.cgv-wrap) .lux-header .logo {
    color: white;
    font-family: 'Libre Baskerville', serif;
    font-size: 1.3rem;
    letter-spacing: .2px;
  }
  body:has(.cgv-wrap) .lux-header .logo em {
    color: #c9a96e;
    font-style: italic;
  }
  body:has(.cgv-wrap) .lux-header.scrolled .logo {
    color: #1b4332;
  }
  body:has(.cgv-wrap) .lux-header.scrolled .logo em {
    color: #c9a96e;
  }
  body:has(.cgv-wrap) .lux-header .header-logo-img img {
    filter: brightness(0) invert(1);
  }
  body:has(.cgv-wrap) .lux-header .lux-compte-icon svg circle:first-child {
    fill: transparent;
    stroke: rgba(255,255,255,.12);
    stroke-width: 1;
  }
  body:has(.cgv-wrap) .lux-header .btn-cart-nav {
    background: transparent;
    border: 1px solid rgba(255,255,255,.12);
  }
  body:has(.cgv-wrap) .lux-header .lux-compte-icon:hover svg circle:first-child {
    stroke: rgba(201,169,110,.4);
  }
  body:has(.cgv-wrap) .lux-header .btn-cart-nav:hover {
    border-color: rgba(201,169,110,.4);
  }
  body:has(.cgv-wrap) .lux-header.scrolled .lux-compte-icon svg circle:first-child {
    fill: #c9a96e;
    stroke: none;
    stroke-width: 0;
  }
  body:has(.cgv-wrap) .lux-header.scrolled .btn-cart-nav {
    background: #c9a96e;
    border: none;
  }
  body:has(.cgv-wrap) .lux-header.scrolled .lux-compte-icon svg path {
    fill: #1b4332;
  }
  body:has(.cgv-wrap) .lux-header.scrolled .btn-cart-nav svg {
    stroke: #1b4332;
  }
  body:has(.cgv-wrap) .lux-header.scrolled {
    background: rgba(250,250,247,.97);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(0,0,0,.06);
  }
  body:has(.cgv-wrap) .lux-header.scrolled .lux-header__link {
    color: rgba(27,61,40,.6);
  }
  body:has(.cgv-wrap) .lux-header.scrolled .lux-header__link:hover,
  body:has(.cgv-wrap) .lux-header.scrolled .lux-header__link--active {
    color: #c9a96e;
  }
  body:has(.cgv-wrap) .lux-header.scrolled .header-logo-img img {
    filter: none;
  }
}

/* --- CGV Responsive mobile --- */
@media (max-width: 768px) {
  /* ── Header mobile CGV : fond sombre ── */
  body:has(.cgv-wrap) .lux-header {
    position: relative !important;
    background: transparent;
    backdrop-filter: none !important;
    border-bottom: 1px solid transparent !important;
  }
  body:has(.cgv-wrap) .lux-hamburger {
    background: transparent !important;
    border: 1px solid rgba(201,169,110,0.3);
  }
  body:has(.cgv-wrap) .btn-cart-nav {
    background: transparent !important;
    border: 1px solid rgba(201,169,110,0.3);
  }
  body:has(.cgv-wrap) .header-logo-img .logo-img-dark {
    display: block;
  }
  body:has(.cgv-wrap) .header-logo-img .logo-img-light {
    display: none;
  }
  body:has(.cgv-wrap) .header-logo-img {
    border: 1px solid rgba(201,169,110,0.3);
  }
  body:has(.cgv-wrap) .lux-header__nav {
    background: #070c09;
    border-top: 1px solid rgba(201,169,110,0.08);
    box-shadow: none;
  }
  body:has(.cgv-wrap) .lux-header__nav .lux-header__link {
    color: #c9a96e;
    border-bottom: none;
    background-image: linear-gradient(to right, rgba(201,169,110,0.45), transparent);
    background-repeat: no-repeat;
    background-size: 100% 1px;
    background-position: bottom;
  }
  body:has(.cgv-wrap) .lux-header__nav .lux-header__link:last-child {
    background-image: none;
  }
  body:has(.cgv-wrap) .lux-header__nav .lux-header__link:hover {
    color: #c9a96e;
  }

  /* FIX 1 — Logo taille mobile CGV (1.3rem comme catalogue) */
  body:has(.cgv-wrap) .logo { font-size: 1.3rem; }

  body:has(.cgv-wrap) .lux-compte-icon svg path { fill: #c9a96e; }
  body:has(.cgv-wrap) .lux-compte-icon {
    border: 1px solid rgba(201,169,110,0.3);
    border-radius: 50%;
  }

  .cgv-hero { padding: 25px 24px 48px; }
  .cgv-hero__title { font-size: 1.9rem; }
  .cgv-hero__ring { display: none; }
  body:has(.cgv-wrap) .cgv-wrap { padding: 0 12px 60px !important; }
  .cgv-toc__body { grid-template-columns: 1fr 1fr; gap: 0; }
  .cgv-sec__card { padding: 22px 14px; }
  .cgv-sec__wm { font-size: 3.5rem; }
  .cgv-toc__header, .cgv-toc__body { padding-left: 14px; padding-right: 14px; }
  .back-top-wrap { bottom: 115px; }
}

/* END PAGE CGV */

/* ============================================================
   PHASE 2.5 MOBILE — HERO CATALOGUE
   @media (max-width: 1100px) uniquement — ne touche PAS au PC
   ============================================================ */
@media (max-width: 1100px) {

  /* Fond vert sombre catalogue mobile — scopé body:has */
  body:has(#catalogue-grid) {
    background: #0f2218;
  }

  /* === HERO MOBILE CATALOGUE === */
  body:has(#catalogue-grid) .catalogue-hero {
    display: block;
    background: #0f2218;
    position: relative;
    overflow: hidden;
    padding: 0;
    margin-top: -70px;
    margin-bottom: 0;
  }
  body:has(#catalogue-grid) .catalogue-hero::before {
    content: '';
    position: absolute;
    left: 20px;
    top: 0;
    bottom: 0;
    width: 1px;
    background: linear-gradient(to bottom, transparent,
      rgba(201,169,110,.09) 20%, rgba(201,169,110,.09));
    pointer-events: none;
    z-index: 0;
  }
  body:has(#catalogue-grid) .catalogue-hero::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
      radial-gradient(ellipse 60% 50% at 80% 30%,
        rgba(201,169,110,.08), transparent 55%),
      radial-gradient(ellipse 108% 25% at 20% 90%,
        rgba(45,90,61,.45), transparent 47%);
    pointer-events: none;
    z-index: 0;
  }
  body:has(#catalogue-grid) .catalogue-hero__inner {
    display: flex;
    flex-direction: column;
    padding: 110px 20px 40px;
    position: relative;
    z-index: 2;
  }
  /* Aplatir __left pour que order fonctionne sur ses enfants */
  body:has(#catalogue-grid) .catalogue-hero__left {
    display: contents;
  }
  /* Slider hero mobile — visible empilé sous titre */
  body:has(#catalogue-grid) .catalogue-hero__slider {
    display: block !important;
    position: relative;
    width: 100%;
    margin-top: 24px;
    margin-bottom: 8px;
    order: 1;
  }
  body:has(#catalogue-grid) .hero-slides-wrap {
    position: relative;
    height: 300px;
  }
  body:has(#catalogue-grid) .hero-slide {
    position: absolute;
    inset: 0;
    background: #f5f0e6;
    border: 1px solid rgba(201,169,110,.35);
    border-radius: 18px;
    padding: 16px;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
    opacity: 0;
    pointer-events: none;
  }
  body:has(#catalogue-grid) .hero-slide.active {
    opacity: 1;
    pointer-events: auto;
    animation: heroSlideInMob .5s cubic-bezier(.22,1,.36,1) forwards;
  }
  body:has(#catalogue-grid) .hero-slide.leaving {
    animation: heroSlideOutMob .8s cubic-bezier(.55,0,1,.45) forwards;
  }
  body:has(#catalogue-grid) .hero-slide__img {
    width: 100%;
    height: 150px;
    background: #F5F0E6;
    border-radius: 12px;
    overflow: hidden;
  }
  body:has(#catalogue-grid) .hero-slide__img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }
  body:has(#catalogue-grid) .hero-slide__cat {
    font-size: 0.5rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: rgba(160,120,64,.75);
  }
  body:has(#catalogue-grid) .hero-slide__name {
    font-family: 'Libre Baskerville', serif;
    font-size: 1.1rem;
    color: #0f2218;
    line-height: 1.15;
  }
  body:has(#catalogue-grid) .hero-slide__price {
    font-size: 0.6rem;
    color: rgba(15,34,24,.4);
  }
  body:has(#catalogue-grid) .hero-slide__price strong {
    color: #a07840;
    font-family: 'Libre Baskerville', serif;
    font-size: 0.9rem;
  }
  body:has(#catalogue-grid) .hero-slide__cta {
    font-size: 0.5rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: rgba(160,120,64,.6);
  }
  /* Dots slider mobile */
  body:has(#catalogue-grid) .hero-slider-dots {
    display: flex;
    gap: 6px;
    justify-content: center;
    margin-top: 12px;
  }
  body:has(#catalogue-grid) .hero-dot {
    width: 18px;
    height: 2px;
    border-radius: 2px;
    background: rgba(255,255,255,.12);
  }
  body:has(#catalogue-grid) .hero-dot.on {
    background: #c9a96e;
    width: 26px;
  }
  /* Flèches slider mobile */
  body:has(#catalogue-grid) .hero-slider-nav {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    pointer-events: none;
    z-index: 10;
    padding: 0 8px;
  }
  body:has(#catalogue-grid) .hero-arrow {
    display: none;
  }
  body:has(#catalogue-grid) .catalogue-hero__circle1,
  body:has(#catalogue-grid) .catalogue-hero__circle2 {
    display: none !important;
  }
  body:has(#catalogue-grid) .catalogue-hero__filters {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    order: 2;
    margin-top: 32px;
  }
  /* FIX 1 — Titre, eyebrow, texte visibles sur fond sombre */
  body:has(#catalogue-grid) .catalogue-hero__h1 {
    color: white !important;
    font-size: clamp(2rem, 8vw, 2.5rem);
    line-height: 0.95;
    margin-bottom: 16px;
  }
  body:has(#catalogue-grid) .catalogue-hero__h1 em {
    color: #c9a96e !important;
    font-style: italic;
    display: block;
  }
  body:has(#catalogue-grid) .catalogue-hero__eyebrow {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    border: 1px solid rgba(201,169,110,.2);
    border-radius: 50px;
    width: fit-content;
    padding: 5px 14px;
    margin-bottom: 18px;
    font-size: 0.5rem;
    font-weight: 700;
    letter-spacing: 2.5px;
    color: #c9a96e;
  }
  body:has(#catalogue-grid) .catalogue-hero__p {
    color: rgba(255,255,255,.38) !important;
    font-size: 0.85rem;
    line-height: 1.7;
    margin-bottom: 20px;
  }

  /* FIX 2 — Cacher .shop-intro et #filters (hero les remplace) */
  body:has(#catalogue-grid) .shop-intro {
    display: none !important;
  }
  body:has(#catalogue-grid) #filters {
    display: none !important;
  }

  /* FIX 3 — Style filtres hero mobile */
  body:has(#catalogue-grid) .catalogue-hero__filters .hf {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 50px;
    border: 1px solid rgba(255,255,255,.1);
    background: rgba(255,255,255,.04);
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: rgba(255,255,255,.42);
    cursor: pointer;
    transition: all 0.22s;
  }
  body:has(#catalogue-grid) .catalogue-hero__filters .hf.on {
    background: #c9a96e;
    border-color: #c9a96e;
    color: #0f2218;
  }

  /* === M2 — Header transparent catalogue mobile === */
  body:has(#catalogue-grid) .lux-header {
    background: rgba(15,34,24,0) !important;
    backdrop-filter: none !important;
    border-bottom: 1px solid transparent !important;
    transition: all 0.4s;
  }
  body:has(#catalogue-grid) .lux-header .logo {
    color: white;
    font-family: 'Libre Baskerville', serif;
    font-size: 1.3rem;
    letter-spacing: 0.2px;
  }
  body:has(#catalogue-grid) .lux-header .logo em {
    color: #c9a96e;
  }
  body:has(#catalogue-grid) .lux-header .lux-hamburger {
    background: rgba(15,34,24,0.5);
    border: 1px solid rgba(201,169,110,0.3);
  }
  body:has(#catalogue-grid) .lux-header .lux-hamburger span {
    background: #c9a96e;
  }
  body:has(#catalogue-grid) .lux-header .lux-compte-icon,
  body:has(#catalogue-grid) .lux-header #btn-cart-open {
    background: rgba(15,34,24,0.5);
    border: 1px solid rgba(201,169,110,0.3);
    border-radius: 50%;
  }
  body:has(#catalogue-grid) .lux-header .lux-compte-icon svg path {
    fill: #c9a96e;
  }
  body:has(#catalogue-grid) .lux-header .lux-compte-icon svg circle {
    fill: rgba(15,34,24,0.5);
  }
  body:has(#catalogue-grid) .lux-header #btn-cart-open svg {
    stroke: #c9a96e;
  }
  /* Header scrolled — retour au style normal */
  body:has(#catalogue-grid) .lux-header.scrolled {
    background: rgba(250,250,247,0.97) !important;
    backdrop-filter: blur(20px) !important;
    border-bottom: 1px solid rgba(0,0,0,0.06) !important;
  }
  body:has(#catalogue-grid) .lux-header.scrolled .logo {
    color: #1b4332;
  }
  body:has(#catalogue-grid) .lux-header.scrolled .lux-hamburger {
    background: #1b4332;
    border-color: transparent;
  }
  body:has(#catalogue-grid) .lux-header.scrolled .lux-hamburger span {
    background: #c9a96e;
  }
  body:has(#catalogue-grid) .lux-header.scrolled .lux-compte-icon,
  body:has(#catalogue-grid) .lux-header.scrolled #btn-cart-open {
    background: #1b4332;
    border-color: transparent;
  }
  body:has(#catalogue-grid) .lux-header.scrolled .lux-compte-icon svg path {
    fill: #c9a96e;
  }
  body:has(#catalogue-grid) .lux-header.scrolled .lux-compte-icon svg circle {
    fill: #1b4332;
  }
  body:has(#catalogue-grid) .lux-header.scrolled #btn-cart-open svg {
    stroke: #c9a96e;
  }

  /* Logo image swap au scroll */
  body:has(#catalogue-grid) .header-logo-img .logo-img-dark {
    display: block;
  }
  body:has(#catalogue-grid) .header-logo-img .logo-img-light {
    display: none;
  }
  body:has(#catalogue-grid) .lux-header.scrolled .header-logo-img .logo-img-dark {
    display: none;
  }
  body:has(#catalogue-grid) .lux-header.scrolled .header-logo-img .logo-img-light {
    display: block;
  }

  /* Bordure logo image catalogue mobile */
  body:has(#catalogue-grid) .header-logo-img {
    border: 1px solid rgba(201,169,110,0.3);
  }
  body:has(#catalogue-grid) .lux-header.scrolled .header-logo-img {
    border-color: transparent;
  }

  /* === SECTIONS CATÉGORIE MOBILE === */
  body:has(#catalogue-grid) .cat-body-desktop {
    display: block;
    background: #0f2218;
    padding: 0 20px 40px;
    position: relative;
  }
  body:has(#catalogue-grid) .cat-body-desktop::before {
    content: '';
    position: absolute;
    left: 20px;
    top: -80px;
    bottom: 0;
    width: 1px;
    background: linear-gradient(to bottom,
      rgba(201,169,110,.03) 0%,
      rgba(201,169,110,.09) 15%,
      rgba(201,169,110,.09) 100%);
    pointer-events: none;
  }
  body:has(#catalogue-grid) .cat-sec {
    margin-bottom: 12px;
  }
  body:has(#catalogue-grid) .cat-sec__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(255,255,255,.07);
    position: relative;
  }
  body:has(#catalogue-grid) .cat-sec__head::after {
    content: '';
    position: absolute;
    bottom: -1px;
    right: 0;
    width: 120px;
    height: 1px;
    background: linear-gradient(to left,
      rgba(201,169,110,.45), transparent);
  }
  body:has(#catalogue-grid) .cat-sec__label {
    font-size: 0.5rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2.5px;
    color: #c9a96e;
    opacity: 0.7;
    display: block;
    margin-bottom: 6px;
  }
  body:has(#catalogue-grid) .cat-sec__title {
    font-family: 'Libre Baskerville', serif;
    font-size: 1.3rem;
    color: white;
    line-height: 1.1;
  }
  body:has(#catalogue-grid) .cat-sec__title em {
    color: #c9a96e;
    font-style: italic;
  }
  body:has(#catalogue-grid) .cat-sec__count {
    font-size: 0.55rem;
    color: rgba(255,255,255,.25);
    font-weight: 600;
  }
  body:has(#catalogue-grid) .cat-sec__divider {
    height: 1px;
    background: linear-gradient(to right,
      transparent, rgba(201,169,110,.12), transparent);
    margin: 0 0 12px;
  }
  body:has(#catalogue-grid) .cat-sec__carousel-wrap {
    position: relative;
  }
  body:has(#catalogue-grid) .cat-sec__carousel {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding: 8px 0 4px;
    padding-left: 20px;
    padding-right: 20px;
    -webkit-overflow-scrolling: touch;
  }
  body:has(#catalogue-grid) .cat-sec__carousel::-webkit-scrollbar {
    display: none;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .flip-scene {
    min-width: 200px;
    max-width: 200px;
    flex-shrink: 0;
    height: 290px;
  }
  /* Cacher les flèches sur mobile — swipe natif */
  body:has(#catalogue-grid) .cat-sec__arrow {
    display: none;
  }
  /* Masquer la grille plate */
  body:has(.cat-body-desktop) .product-grid {
    display: none;
  }
  /* Cartes carousel — valeurs ref catalogue_mobile_ref */
  body:has(#catalogue-grid) .cat-sec__carousel .item-card {
    background: #f5f0e6;
    border-radius: 14px;
    border: 1px solid rgba(201,169,110,0.2);
    overflow: visible;
    padding: 0;
    min-height: unset;
    display: flex;
    flex-direction: column;
    position: relative;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .img-box {
    border-radius: 14px 14px 0 0;
    margin-bottom: 0;
    padding: 0;
    height: 120px;
    background: #ede7d8;
    overflow: hidden;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .img-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0 !important;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .card-badges {
    bottom: 6px;
    left: 6px;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .c-badge {
    background: rgba(15,34,24,0.82);
    border: 1px solid rgba(201,169,110,0.18);
    padding: 2px 7px;
    border-radius: 4px;
    font-size: 7px;
    letter-spacing: 0.8px;
    color: rgba(255,255,255,0.6);
  }
  body:has(#catalogue-grid) .cat-sec__carousel .card-info {
    padding: 10px 12px 12px;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .card-info h3 {
    font-family: 'Times New Roman', serif;
    font-size: 12px;
    font-weight: 700;
    color: #0f2218;
    line-height: 1.2;
    margin-bottom: 8px;
    /* Égalisation des cartes du carousel : le nom réserve TOUJOURS 2 lignes
       et ne peut jamais en pousser plus (même motif que la description
       clampée) — un nom long ne fait plus une carte plus haute que ses
       voisines (constat réel 19/07 : Cali x Mango / Jack Herrer). */
    min-height: 2.4em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .card-cat {
    display: block;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 1.5px;
    color: rgba(160,120,64,0.8);
    text-transform: uppercase;
    margin-bottom: 3px;
  }
  /* Description : 1 ligne clampée + espace RÉSERVÉ (min-height) même si la
     description est vide — toutes les cartes restent alignées. Le PC affiche
     déjà 1 ligne (règle du bloc min-1101). ⚠️ Cette règle doit RESTER dans ce
     @media max-1100 : le PC utilise AUSSI .cat-sec__carousel, seul le média
     le protège (prouvé a contrario à l'ÉTAPE 0). */
  body:has(#catalogue-grid) .cat-sec__carousel .card-info p {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 1.6em;
    font-size: 10px;
    line-height: 1.6;
    color: rgba(15,34,24,.45);
    margin: 0 0 4px;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .card-footer {
    padding: 0 12px 12px;
    border-top: 1px solid rgba(15,34,24,0.08);
    padding-top: 8px;
    display: flex;
    align-items: flex-end;
    gap: 8px;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .card-footer > .card-price {
    padding-top: 0;
    border-top: none;
    flex: 1;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .card-price label {
    font-size: 7px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: rgba(15,34,24,0.35);
    opacity: 1;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .card-price b {
    font-family: 'Times New Roman', serif;
    font-size: 14px;
    color: #a07840;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .card-price .pp-new {
    font-size: 12px;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .card-price .pp-old {
    font-size: 11px;
    text-decoration: line-through;
    opacity: 0.6;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .btn-discover {
    display: inline-block;
    background: none;
    border: none;
    border-bottom: 1px solid rgba(15,34,24,0.15);
    border-radius: 0;
    padding: 0 0 2px;
    font-size: 7px;
    color: rgba(15,34,24,0.35);
    margin-right: auto;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .btn-discover:hover,
  body:has(#catalogue-grid) .cat-sec__carousel .btn-discover:active {
    color: #c9a96e;
    border-bottom-color: #c9a96e;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .item-card:hover .btn-discover {
    background: none;
    box-shadow: none;
    transform: none;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .btn-discover::after {
    display: none;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .card-flip-btn {
    position: absolute;
    bottom: 27px;
    right: 10px;
    width: 26px;
    height: 26px;
    background: #0f2218;
    color: white;
    border-radius: 50%;
    flex-shrink: 0;
    z-index: 2;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .card-flip-btn svg {
    stroke: white;
    width: 10px;
    height: 10px;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .card-quick-buy-mobile {
    position: static;
    margin-left: auto;
    width: 26px;
    height: 26px;
    background: #0f2218;
    color: white;
    border-radius: 50%;
    flex-shrink: 0;
    z-index: 2;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .card-quick-buy-mobile svg {
    stroke: #c9a96e;
    width: 10px;
    height: 10px;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .card-quick-buy-mobile:hover,
  body:has(#catalogue-grid) .cat-sec__carousel .card-quick-buy-mobile:active {
    background: #c9a96e;
  }
  body:has(#catalogue-grid) .cat-sec__carousel .card-quick-buy-mobile:hover svg,
  body:has(#catalogue-grid) .cat-sec__carousel .card-quick-buy-mobile:active svg {
    stroke: #0f2218;
  }

  /* Trust badges amber — mobile */
  body:has(#catalogue-grid) .trust-seal-strip {
    background: #0f2218;
    padding: 48px 20px 40px;
    border-top: none;
    position: relative;
  }
  body:has(#catalogue-grid) .trust-seal-strip::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(201,169,110,.18), transparent);
  }
  body:has(#catalogue-grid) .trust-seal-strip .seal-circle {
    background: transparent;
    border-color: rgba(201,169,110,.3);
  }
  body:has(#catalogue-grid) .trust-seal-strip .seal-circle svg {
    stroke: #c9a96e;
  }
  body:has(#catalogue-grid) .seal-circle {
    transition: all 0.22s;
  }
  body:has(#catalogue-grid) .seal-item:hover .seal-circle {
    background: #c9a96e;
    border-color: #c9a96e;
  }
  body:has(#catalogue-grid) .seal-item:hover .seal-circle svg {
    stroke: #0f2218;
  }
  body:has(#catalogue-grid) .trust-seal-strip label {
    color: #c9a96e;
  }

} /* END @media (max-width: 1100px) — hero mobile catalogue */

/* === COOKIE BANNER === */
#mk-cookies {
  position: fixed;
  bottom: 24px;
  right: 24px;
  width: 290px;
  background: #070c09;
  border: 1px solid rgba(201,169,110,0.2);
  border-radius: 14px;
  padding: 18px 20px;
  box-shadow: 0 8px 40px rgba(0,0,0,0.5);
  z-index: 99999;
  font-family: 'Manrope', sans-serif;
  display: none;
}
#mk-cookies.visible { display: block; }
#mk-cookies::before {
  content: '';
  position: absolute;
  top: 0; left: 16px; right: 16px;
  height: 1px;
  background: linear-gradient(to right, transparent, rgba(201,169,110,0.35), transparent);
}
#mk-cookies .ck-head {
  display: flex; align-items: center; gap: 10px; margin-bottom: 10px;
}
#mk-cookies .ck-title {
  font-size: 11.5px; font-weight: 700; color: rgba(255,255,255,0.8);
}
#mk-cookies .ck-text {
  font-size: 10.5px; color: rgba(255,255,255,0.42);
  margin: 0 0 14px; line-height: 1.75;
}
#mk-cookies .ck-text a {
  color: rgba(201,169,110,0.6);
  text-decoration: none;
  border-bottom: 1px solid rgba(201,169,110,0.2);
}
#mk-cookies .ck-btns {
  display: flex; gap: 8px;
}
#mk-cookies .ck-refuse {
  flex: 1; padding: 9px;
  background: transparent;
  border: 1px solid rgba(201,169,110,0.12);
  border-radius: 8px;
  color: rgba(255,255,255,0.3);
  font-size: 10.5px; cursor: pointer;
  font-family: 'Manrope', sans-serif;
}
#mk-cookies .ck-accept {
  flex: 2; padding: 9px;
  background: #c9a96e; border: none;
  border-radius: 8px;
  color: #070c09;
  font-size: 10.5px; font-weight: 800;
  cursor: pointer;
  font-family: 'Manrope', sans-serif;
}
@media (max-width: 768px) {
  #mk-cookies {
    bottom: 16px; right: 16px; left: 16px; width: auto;
  }
}

/* ============================================
   ShopModal — système modal réutilisable
   PC : modal centré avec fade-in scale
   Mobile : bottom-sheet slide-up
   z-index 10000 (au-dessus side-cart 9999, sous cookies 99999)
   ============================================ */
#shop-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 10000;
  display: none;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.25s ease;
}
#shop-modal-overlay.is-open {
  display: flex;
  opacity: 1;
}
#shop-modal {
  position: relative;
  background: #0f2218;
  border: 1px solid rgba(201, 169, 110, 0.25);
  border-radius: 16px;
  width: min(480px, 90vw);
  max-height: 85vh;
  overflow-y: auto;
  padding: 24px;
  transform: scale(0.95);
  transition: transform 0.25s ease;
  color: #e8c98a;
}
#shop-modal-overlay.is-open #shop-modal {
  transform: scale(1);
}
#shop-modal-close {
  position: absolute;
  top: 12px;
  right: 12px;
  background: none;
  border: none;
  color: #c9a96e;
  font-size: 28px;
  cursor: pointer;
  line-height: 1;
  padding: 4px 10px;
  border-radius: 8px;
  transition: background 0.2s;
}
#shop-modal-close:hover {
  background: rgba(201, 169, 110, 0.1);
}
#shop-modal-body {
  padding-top: 8px;
}

/* Mobile : bottom-sheet slide-up */
@media (max-width: 1100px) {
  #shop-modal-overlay {
    align-items: flex-end;
    justify-content: stretch;
  }
  #shop-modal {
    width: 100%;
    max-width: 100%;
    border-radius: 16px 16px 0 0;
    max-height: 85vh;
    transform: translateY(100%);
    transition: transform 0.3s ease;
  }
  #shop-modal-overlay.is-open #shop-modal {
    transform: translateY(0);
  }
}

/* Barre de scroll dorée pour la modal shop */
#shop-modal::-webkit-scrollbar {
  width: 8px;
}
#shop-modal::-webkit-scrollbar-track {
  background: transparent;
}
#shop-modal::-webkit-scrollbar-thumb {
  background: rgba(201, 169, 110, 0.4);
  border-radius: 4px;
}
#shop-modal::-webkit-scrollbar-thumb:hover {
  background: rgba(201, 169, 110, 0.6);
}
#shop-modal {
  scrollbar-width: thin;
  scrollbar-color: rgba(201, 169, 110, 0.4) transparent;
}

/* ============================================
   Newsletter popup — styles nl-popup-*
   Préfixe nl-popup-* pour éviter conflits
   ============================================ */
.nl-popup-title {
  font-family: 'Libre Baskerville', serif;
  font-size: 1.3rem;
  color: #c9a96e;
  margin: 0 0 8px 0;
  font-weight: 400;
}
.nl-popup-intro {
  font-size: 0.85rem;
  color: rgba(232, 201, 138, 0.7);
  margin: 0 0 16px 0;
  line-height: 1.5;
}
.nl-popup-email-display {
  font-size: 0.8rem;
  color: rgba(232, 201, 138, 0.6);
  background: rgba(201, 169, 110, 0.08);
  border: 1px solid rgba(201, 169, 110, 0.15);
  border-radius: 8px;
  padding: 10px 14px;
  margin-bottom: 18px;
}
.nl-popup-email-display strong {
  color: #e8c98a;
  font-weight: 500;
}
.nl-popup-toggleall {
  background: none;
  border: none;
  color: #c9a96e;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  cursor: pointer;
  padding: 4px 0;
  margin-bottom: 12px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.nl-popup-toggleall:hover {
  color: #e8c98a;
}
.nl-popup-section {
  margin-bottom: 16px;
}
.nl-popup-section-title {
  font-size: 0.7rem;
  color: rgba(201, 169, 110, 0.5);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 8px;
}
.nl-popup-check {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  cursor: pointer;
  font-size: 0.9rem;
  color: #e8c98a;
}
.nl-popup-check input[type="checkbox"],
.nl-popup-rgpd input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  border: 1px solid rgba(201, 169, 110, 0.4);
  border-radius: 4px;
  background: #0f2218;
  cursor: pointer;
  position: relative;
  flex-shrink: 0;
  transition: all 0.2s;
}
.nl-popup-check input[type="checkbox"]:checked,
.nl-popup-rgpd input[type="checkbox"]:checked {
  background: #c9a96e;
  border-color: #c9a96e;
}
.nl-popup-check input[type="checkbox"]:checked::after,
.nl-popup-rgpd input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  left: 5px;
  top: 1px;
  width: 5px;
  height: 10px;
  border: solid #0f2218;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.nl-popup-rgpd {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 14px 0;
  margin-top: 8px;
  cursor: pointer;
  font-size: 0.75rem;
  color: rgba(232, 201, 138, 0.7);
  line-height: 1.5;
  border-top: 1px solid rgba(201, 169, 110, 0.15);
}
.nl-popup-actions {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 18px;
}
.nl-popup-confirm {
  background: #c9a96e;
  color: #0f2218;
  border: none;
  border-radius: 50px;
  padding: 14px 24px;
  font-size: 0.8rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  cursor: pointer;
  transition: all 0.25s;
  font-family: inherit;
}
.nl-popup-confirm:hover:not(:disabled) {
  background: #e8c98a;
}
.nl-popup-confirm:disabled {
  opacity: 0.35;
  cursor: not-allowed;
  background: rgba(201, 169, 110, 0.5);
}
.nl-popup-cancel {
  background: none;
  border: none;
  color: rgba(232, 201, 138, 0.5);
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 3px;
  padding: 8px;
  font-family: inherit;
}
.nl-popup-cancel:hover {
  color: #c9a96e;
}

/* ==========================================
   TUNNEL DARK — panier + livraison + confirmation
   Pattern : fond dark #0f2218, cards crème restent claires,
   header dark opaque (pas de scroll transition — pas de JS).
   ========================================== */

/* Fond html + body (match catalogue) */
html:has(#cart-page),
html:has(#livraison-page),
html:has(#confirmation-page) {
  background: #070c09;
}
body:has(#cart-page),
body:has(#livraison-page),
body:has(#confirmation-page) {
  background: #0f2218;
}

/* Header dark opaque */
body:has(#cart-page) .lux-header,
body:has(#livraison-page) .lux-header,
body:has(#confirmation-page) .lux-header {
  background: rgba(15, 34, 24, 0);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  border-bottom: 1px solid transparent;
  padding-left: 56px;
  padding-right: 56px;
  position: relative;
}
body:has(#cart-page) .lux-header .lux-header__link,
body:has(#livraison-page) .lux-header .lux-header__link,
body:has(#confirmation-page) .lux-header .lux-header__link {
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.63rem;
  letter-spacing: 2.5px;
  font-weight: 700;
}
body:has(#cart-page) .lux-header__nav,
body:has(#livraison-page) .lux-header__nav,
body:has(#confirmation-page) .lux-header__nav {
  gap: 36px;
}
body:has(#cart-page) .lux-header .lux-header__link:hover,
body:has(#livraison-page) .lux-header .lux-header__link:hover,
body:has(#confirmation-page) .lux-header .lux-header__link:hover {
  color: #c9a96e;
}
body:has(#cart-page) .lux-header .logo,
body:has(#livraison-page) .lux-header .logo,
body:has(#confirmation-page) .lux-header .logo {
  color: #ffffff;
  font-size: 1.3rem;
  letter-spacing: .2px;
}
body:has(#cart-page) .lux-header .logo em,
body:has(#livraison-page) .lux-header .logo em,
body:has(#confirmation-page) .lux-header .logo em {
  color: #c9a96e;
  font-style: italic;
}
/* Pastille compte header dark */
body:has(#cart-page) .lux-header .lux-compte-icon svg circle:first-child,
body:has(#livraison-page) .lux-header .lux-compte-icon svg circle:first-child,
body:has(#confirmation-page) .lux-header .lux-compte-icon svg circle:first-child {
  fill: transparent;
  stroke: rgba(255, 255, 255, 0.2);
  stroke-width: 1;
}
body:has(#cart-page) .lux-header .lux-compte-icon:hover svg circle:first-child,
body:has(#livraison-page) .lux-header .lux-compte-icon:hover svg circle:first-child,
body:has(#confirmation-page) .lux-header .lux-compte-icon:hover svg circle:first-child {
  stroke: rgba(201, 169, 110, 0.5);
}
/* Bouton panier header dark */
body:has(#cart-page) .lux-header .btn-cart-nav,
body:has(#livraison-page) .lux-header .btn-cart-nav,
body:has(#confirmation-page) .lux-header .btn-cart-nav {
  background: transparent;
  border: 1px solid rgba(255, 255, 255, 0.2);
}
body:has(#cart-page) .lux-header .btn-cart-nav:hover,
body:has(#livraison-page) .lux-header .btn-cart-nav:hover,
body:has(#confirmation-page) .lux-header .btn-cart-nav:hover {
  border-color: rgba(201, 169, 110, 0.5);
}

/* Breadcrumb dark */
body:has(#cart-page) .checkout-nav,
body:has(#livraison-page) .checkout-nav,
body:has(#confirmation-page) .checkout-nav {
  background: transparent;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  margin-top: 20px;
}
body:has(#cart-page) .nav-step,
body:has(#livraison-page) .nav-step,
body:has(#confirmation-page) .nav-step {
  color: rgba(255, 255, 255, 0.4);
}
body:has(#cart-page) .nav-step span,
body:has(#livraison-page) .nav-step span,
body:has(#confirmation-page) .nav-step span {
  border-color: rgba(201, 169, 110, 0.4);
  background: transparent;
}
body:has(#cart-page) .nav-step.active span,
body:has(#livraison-page) .nav-step.active span,
body:has(#confirmation-page) .nav-step.active span {
  background: linear-gradient(135deg, #1b4332, #c9a96e, #1b4332);
  background-size: 300% 300%;
  border: none;
  animation: coin-spin 2.5s ease-in-out infinite;
}
body:has(#cart-page) .nav-step.active,
body:has(#livraison-page) .nav-step.active,
body:has(#confirmation-page) .nav-step.active {
  color: #ffffff;
}
/* .nav-step.active span : conserver le gradient natif coin-spin
   défini dans la base (.nav-step.active span L2030+).
   .nav-step.completed : déjà amber, reste lisible sur dark */

/* Summary-pane livraison + confirmation : border-left amber */
body:has(#livraison-page) .summary-inner,
body:has(#confirmation-page) .summary-inner {
  border-left-color: var(--amber-bright);
}

/* ========================================
   RÉCAPITULATIF PANIER — TUNNEL DARK
   ======================================== */

@media (min-width: 1025px) {
  /* Conteneur : transparent, pas de card pleine */
  body:has(#cart-page) .summary-inner {
    background: transparent;
    border: none;
    border-left: none;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
  }

  /* Eyebrow */
  body:has(#cart-page) .summary-eyebrow {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 6px;
  }
  body:has(#cart-page) .summary-eyebrow-line {
    width: 16px;
    height: 1px;
  }
  body:has(#cart-page) .summary-eyebrow-line--left {
    background: linear-gradient(90deg, transparent, #c9a96e);
  }
  body:has(#cart-page) .summary-eyebrow-line--right {
    background: linear-gradient(90deg, #c9a96e, transparent);
  }
  body:has(#cart-page) .summary-eyebrow-text {
    color: #c9a96e;
    font-size: 10px;
    letter-spacing: 3px;
    font-family: 'Manrope', sans-serif;
    font-weight: 500;
  }

  /* Titre "Votre commande" */
  body:has(#cart-page) .summary-inner h2 {
    color: white;
    font-family: 'Libre Baskerville', Georgia, serif;
    font-size: 22px;
    font-weight: 400;
    letter-spacing: -0.3px;
    margin: 0 0 20px 0;
    text-align: left;
  }

  /* Lignes de calcul */
  body:has(#cart-page) .calc-row {
    color: rgba(255, 255, 255, 0.65);
    font-size: 12px;
    padding: 6px 0;
    border: none;
    margin: 0;
  }
  body:has(#cart-page) .calc-row > span:last-child {
    color: rgba(255, 255, 255, 0.9);
    font-weight: 500;
  }

  /* Ligne réduction fidélité en amber */
  body:has(#cart-page) .calc-row.cart-reduction-row {
    color: #c9a96e;
  }
  body:has(#cart-page) .calc-row.cart-reduction-row > span:last-child {
    color: #c9a96e;
    font-weight: 500;
  }

  /* TOTAL TTC en grand amber */
  body:has(#cart-page) .calc-row.total {
    border-top: none;
    background-image: linear-gradient(90deg, transparent, rgba(201, 169, 110, 0.3) 10%, rgba(201, 169, 110, 0.3) 90%, transparent);
    background-repeat: no-repeat;
    background-size: 100% 1px;
    background-position: top;
    padding-top: 16px;
    margin-top: 12px;
    color: rgba(255, 255, 255, 0.55);
    font-size: 11px;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    font-family: 'Manrope', sans-serif;
    font-weight: 500;
    align-items: baseline;
  }
  body:has(#cart-page) .calc-row.total > span:last-child {
    color: #e8c98a;
    font-family: 'Libre Baskerville', Georgia, serif;
    font-size: 26px;
    font-weight: 400;
    letter-spacing: -0.5px;
    text-transform: none;
  }

  /* Bouton CONTINUER : override pour dark */
  body:has(#cart-page) .p-btn-checkout {
    background: linear-gradient(135deg, #1b4332 0%, #2d6a4f 100%);
    color: #e8c98a;
    border: 1px solid rgba(201, 169, 110, 0.35);
    border-radius: 50px;
    padding: 14px;
    font-size: 10.5px;
    letter-spacing: 3px;
    font-weight: 500;
    margin-top: 20px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15),
                inset 0 1px 0 rgba(201, 169, 110, 0.15);
    transition: transform 0.15s ease;
  }
  body:has(#cart-page) .p-btn-checkout {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
  }
  body:has(#cart-page) .p-btn-checkout svg {
    stroke: #e8c98a;
  }
  body:has(#cart-page) .p-btn-checkout:hover {
    transform: translateY(-1px);
  }

  /* Trait dégradé sous checkbox tampons */
  /* === Card unifiée livraison+tampons PC === */

  /* shipping-promo-box : collée à tampons en bas */
  body:has(#cart-page) .shipping-promo-box {
    margin-bottom: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    position: relative;
  }
  body:has(#cart-page) .shipping-promo-box::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 12px;
    right: 12px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(201, 169, 110, 0.2), transparent);
  }

  /* Variante --free (seuil atteint) : même traitement */
  body:has(#cart-page) .shipping-promo-box--free {
    margin-bottom: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }

  /* cart-tampons-box : collée à shipping-promo-box en haut */
  body:has(#cart-page) .cart-tampons-box {
    position: relative;
    margin-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }
  body:has(#cart-page) .cart-tampons-box::after {
    content: "";
    display: block;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(201, 169, 110, 0.18) 10%, rgba(201, 169, 110, 0.18) 90%, transparent);
    margin: 16px 0 0;
  }

  /* TOTAL TTC sous-labels */
  body:has(#cart-page) .calc-row.total .ct-label-wrap {
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  body:has(#cart-page) .calc-row.total .ct-label {
    color: rgba(255, 255, 255, 0.55);
    font-size: 9px;
    letter-spacing: 2.5px;
    font-weight: 500;
  }
  body:has(#cart-page) .calc-row.total .ct-sublabel {
    color: rgba(255, 255, 255, 0.3);
    font-size: 8px;
    letter-spacing: 0.3px;
    text-transform: none;
  }

  /* Ligne Viva Wallet */
  body:has(#cart-page) .p-secure-line {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 14px;
    color: rgba(255, 255, 255, 0.4);
    font-size: 8.5px;
    letter-spacing: 1.5px;
  }

}

/* Trust badges : les 3 badges sont dans .summary-inner (fond blanc).
   Les couleurs base (text-muted + circle blanc + border beige + SVG
   amber) sont lisibles — aucun override nécessaire. */

/* Cards héro tunnel — fond crème + accent amber (pattern catalogue) */
body:has(#livraison-page) .shipping-header,
body:has(#confirmation-page) .conf-payment-header {
  background: var(--cream-base);
  border-left-color: var(--amber-bright);
}

/* Hero centré "Votre Panier" — PC + mobile */
body:has(#cart-page) .cart-header {
  background: transparent;
  border: none;
  border-left: none;
  border-radius: 0;
  padding: 40px 32px 32px;
  margin: 40px auto 32px auto;
  max-width: 1400px;
  text-align: center;
  box-shadow: none;
  background-image: none;
}
body:has(#cart-page) .cart-header__eyebrow {
  color: #c9a96e;
  font-size: 10px;
  letter-spacing: 3px;
  margin-bottom: 12px;
  font-family: 'Manrope', sans-serif;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
}
body:has(#cart-page) .cart-header__eyebrow-line {
  width: 32px;
  height: 1px;
}
body:has(#cart-page) .cart-header__eyebrow-line--left {
  background: linear-gradient(90deg, transparent, #c9a96e);
}
body:has(#cart-page) .cart-header__eyebrow-line--right {
  background: linear-gradient(90deg, #c9a96e, transparent);
}
body:has(#cart-page) .cart-header h1 {
  color: #ffffff;
  font-size: 38px;
  font-weight: 500;
  font-family: 'Libre Baskerville', Georgia, serif;
  letter-spacing: -0.5px;
  margin: 0;
  padding: 0;
  background: none;
  -webkit-text-fill-color: initial;
}
body:has(#cart-page) .cart-meta {
  display: block;
  color: rgba(255, 255, 255, 0.5);
  font-size: 13px;
  margin-top: 8px;
  letter-spacing: 0;
  font-family: 'Manrope', sans-serif;
  font-weight: 400;
  text-transform: none;
  border: none;
  background: none;
  padding: 0;
}
@media (max-width: 768px) {
  body:has(#cart-page) .cart-header {
    padding: 24px 16px 20px;
    margin: 20px auto 24px auto;
    max-width: 100%;
  }
  body:has(#cart-page) .cart-header h1 {
    font-size: 2.2rem;
  }
  body:has(#cart-page) .cart-header__eyebrow {
    font-size: 9px;
    letter-spacing: 2.5px;
    margin-bottom: 10px;
    gap: 10px;
  }
  body:has(#cart-page) .cart-header__eyebrow-line {
    width: 22px;
  }
  body:has(#cart-page) .cart-meta {
    font-size: 12px;
  }
  body:has(#cart-page) .cart-keep-shopping {
    display: flex !important;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 12px 14px;
    background: transparent;
    border: 1px dashed rgba(201, 169, 110, 0.35);
    border-radius: 12px;
    text-decoration: none;
    cursor: pointer;
    margin-top: 14px;
    box-sizing: border-box;
  }
  body:has(#cart-page) .cart-keep-shopping svg {
    flex-shrink: 0;
  }
  body:has(#cart-page) .cart-keep-shopping__text {
    flex: 1;
    text-align: left;
    color: #c9a96e;
    font-size: 9.5px;
    font-weight: 500;
    letter-spacing: 1.3px;
    font-family: 'Manrope', sans-serif;
  }

  /* ======== CARDS ARTICLES M2-V4 ======== */

  /* A) Grid card : 3 cols, 2 rows */
  body.page-cart .p-item-card {
    display: grid !important;
    grid-template-columns: 52px 1fr auto !important;
    grid-template-rows: auto auto !important;
    gap: 8px 10px !important;
    padding: 10px !important;
    border: 1px solid rgba(201, 169, 110, 0.18) !important;
    border-radius: 12px !important;
    border-bottom: none !important;
    margin-bottom: 8px !important;
    background: var(--cream-base);
    align-items: start !important;
  }

  /* B) Image col 1, span 2 rows */
  body.page-cart .p-item-img {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    width: 52px !important;
    height: 52px !important;
    border-radius: 9px !important;
    box-shadow: inset 0 0 0 1px rgba(201, 169, 110, 0.2) !important;
    align-self: start !important;
  }
  body.page-cart .p-item-img img {
    border-radius: 9px !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
  body.page-cart .p-item-card:hover .p-item-img {
    transform: none !important;
  }

  /* C) Details col 2, row 1 */
  body.page-cart .p-item-details {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 0;
  }
  body.page-cart .p-item-details h3 {
    color: #1b4332;
    font-size: 15px !important;
    font-weight: 400;
    font-family: 'Libre Baskerville', Georgia, serif;
    line-height: 1.2;
    letter-spacing: -0.2px;
    margin: 0 !important;
    text-transform: none !important;
  }
  body.page-cart .p-item-details p {
    color: #8a7a5a;
    font-size: 11px !important;
    font-weight: 400;
    margin: 2px 0 0 !important;
  }

  /* D) Retirer sous format (col 2) */
  body.page-cart .p-item-remove {
    color: rgba(160, 120, 64, 0.85) !important;
    font-size: 9px !important;
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin-top: 4px !important;
    opacity: 1 !important;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-width: 0 !important;
    min-height: 0 !important;
  }
  body.page-cart .p-item-remove svg {
    width: 8px !important;
    height: 8px !important;
    stroke: rgba(160, 120, 64, 0.85);
  }
  body.page-cart .p-item-remove:hover {
    transform: none !important;
    opacity: 1 !important;
    color: rgba(160, 120, 64, 1) !important;
  }

  /* E) Prix col 3, row 1 */
  body.page-cart .p-item-price {
    grid-column: 3 !important;
    grid-row: 1 !important;
    color: #1b4332 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    font-family: 'Libre Baskerville', Georgia, serif !important;
    letter-spacing: -0.2px;
    text-align: right !important;
    align-self: start !important;
    margin: 0 !important;
  }

  /* F) Qty pill col 3, row 2 (sous prix, à droite) */
  body.page-cart .p-qty-box {
    grid-column: 3 !important;
    grid-row: 2 !important;
    display: inline-flex !important;
    align-items: center;
    background: white !important;
    border: 1px solid rgba(201, 169, 110, 0.25) !important;
    border-radius: 50px !important;
    padding: 2px !important;
    gap: 0 !important;
    width: auto !important;
    justify-self: end !important;
    align-self: start !important;
    margin-top: -32px !important;
  }
  body.page-cart .p-qty-btn {
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    border-radius: 50% !important;
    border: none !important;
    background: transparent !important;
    color: #c9a96e !important;
    font-size: 11px !important;
    font-weight: 400;
    line-height: 1;
    padding: 0 !important;
    cursor: pointer;
  }
  body.page-cart .p-qty-btn[data-action="plus"] {
    background: #c9a96e !important;
    color: #1b4332 !important;
    font-weight: 500;
  }
  body.page-cart .p-qty-btn:hover {
    color: #c9a96e;
  }
  body.page-cart .p-qty-val {
    color: #1b4332 !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    font-family: 'Manrope', sans-serif !important;
    min-width: 16px;
    text-align: center;
  }

  /* Fix btn-cart-nav mobile compat iOS (body.page-cart au lieu de body:has) */
  body.page-cart .btn-cart-nav {
    background: rgba(15, 34, 24, 0.5) !important;
    border: 1px solid rgba(201, 169, 110, 0.3) !important;
    width: 36px !important;
    height: 36px !important;
  }
  body.page-livraison .btn-cart-nav,
  body.page-confirmation .btn-cart-nav {
    background: rgba(15, 34, 24, 0.5) !important;
    border: 1px solid rgba(201, 169, 110, 0.3) !important;
    width: 36px !important;
    height: 36px !important;
  }

  /* cart-empty mobile compat iOS (body.page-cart) */
  body.page-cart #cart-empty h2 {
    color: white !important;
  }
  body.page-cart #cart-empty p {
    color: rgba(255, 255, 255, 0.5) !important;
  }

  /* === RÉCAP MOBILE DARK — M3 === */

  /* Container : transparent, no border, padding minimal */
  body.page-cart .summary-inner {
    background: transparent;
    border: none;
    border-left: none;
    padding: 0;
    border-radius: 0;
    box-shadow: none;
  }

  /* Eyebrow : ligne amber gauche + RÉCAPITULATIF */
  body.page-cart .summary-eyebrow {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
  }
  body.page-cart .summary-eyebrow-line {
    display: inline-block;
    width: 12px;
    height: 1px;
    background: #c9a96e;
  }
  body.page-cart .summary-eyebrow-line--right {
    display: none;
  }
  body.page-cart .summary-eyebrow-text {
    color: #c9a96e;
    font-size: 8.5px;
    letter-spacing: 2.5px;
    font-weight: 500;
    text-transform: uppercase;
  }

  /* Titre Votre commande blanc serif */
  body.page-cart .summary-inner h2 {
    color: white;
    font-family: 'Libre Baskerville', Georgia, serif;
    font-size: 17px;
    font-weight: 400;
    text-align: left;
    margin: 0 0 14px 0;
    letter-spacing: -0.2px;
  }

  /* Calc-rows blancs/amber sur fond dark */
  body.page-cart .calc-row {
    display: flex;
    justify-content: space-between;
    padding: 4px 0;
    margin: 0;
    font-size: 10.5px;
    color: rgba(255, 255, 255, 0.65);
    border: none;
  }
  body.page-cart .calc-row > span:last-child {
    font-weight: 500;
    color: rgba(255, 255, 255, 0.9);
  }
  body.page-cart .cart-reduction-row {
    color: #c9a96e;
  }
  body.page-cart .cart-reduction-row > span:last-child {
    color: #c9a96e;
    font-weight: 500;
  }

  /* TOTAL TTC : barre top dégradée + valeur amber */
  body.page-cart .calc-row.total {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 12px 0 14px;
    margin-top: 8px;
    border-top: none;
    background-image: linear-gradient(90deg, transparent, rgba(201, 169, 110, 0.3) 10%, rgba(201, 169, 110, 0.3) 90%, transparent);
    background-repeat: no-repeat;
    background-size: 100% 1px;
    background-position: top;
    font-size: inherit;
    color: inherit;
  }
  body.page-cart .calc-row.total .ct-label-wrap {
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  body.page-cart .calc-row.total .ct-label {
    color: rgba(255, 255, 255, 0.55);
    font-size: 8.5px;
    letter-spacing: 2px;
    font-weight: 500;
  }
  body.page-cart .calc-row.total .ct-sublabel {
    color: rgba(255, 255, 255, 0.3);
    font-size: 7.5px;
    letter-spacing: 0.3px;
    text-transform: none;
  }
  body.page-cart .calc-row.total > span:last-child {
    color: #e8c98a;
    font-family: 'Libre Baskerville', Georgia, serif;
    font-size: 24px;
    font-weight: 400;
    letter-spacing: -0.4px;
  }

  /* Bouton CONTINUER : gradient vert amber */
  body.page-cart .p-btn-checkout {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: linear-gradient(135deg, #1b4332 0%, #2d6a4f 100%);
    color: #e8c98a;
    border: 1px solid rgba(201, 169, 110, 0.35);
    border-radius: 50px;
    padding: 13px;
    font-size: 10px;
    letter-spacing: 2.5px;
    font-weight: 500;
    margin: 12px 0 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15), inset 0 1px 0 rgba(201, 169, 110, 0.15);
    text-transform: uppercase;
  }
  body.page-cart .p-btn-checkout svg {
    stroke: #e8c98a;
    width: 12px;
    height: 12px;
  }

  /* Ligne PAIEMENT SÉCURISÉ · VIVA WALLET */
  body.page-cart .p-secure-line {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    color: rgba(255, 255, 255, 0.4);
    font-size: 8px;
    letter-spacing: 1.3px;
    margin-top: 2px;
  }
}

/* Les cards de contenu restent crème (pattern catalogue).
   .form-card, .method-card, .conf-info-card : inchangées.
   Leur fond crème + bordures restent identiques, lisibles sur dark. */

/* Cart item cards (panier) : items hors .summary-inner sur fond dark */
/* ========================================
   CARDS ARTICLES PANIER — TUNNEL DARK
   ======================================== */

/* Propriétés communes PC + mobile */
body:has(#cart-page) .p-item-card {
  background: var(--cream-base);
  border: 1px solid var(--amber-border);
  border-radius: 12px;
  margin-bottom: 10px;
}

/* Refonte PC uniquement */
@media (min-width: 1025px) {
  body:has(#cart-page) .p-item-card {
    padding: 12px 16px;
    grid-template-columns: 52px 1fr auto auto;
    gap: 14px;
    align-items: center;
  }

  body:has(#cart-page) .p-item-img {
    width: 52px;
    height: 52px;
    border-radius: 10px;
    box-shadow: inset 0 0 0 1px rgba(201, 169, 110, 0.2);
  }

  /* Zoom hover : position relative + pseudo-élément vignette */
  body:has(#cart-page) .p-item-img {
    position: relative;
    cursor: zoom-in;
    overflow: visible;
  }

  body:has(#cart-page) .p-item-img::after {
    content: '';
    position: absolute;
    top: 50%;
    left: calc(100% + 16px);
    width: 240px;
    height: 240px;
    background-image: var(--img);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5),
                0 0 0 1px rgba(201, 169, 110, 0.4);
    transform: translateY(-50%) scale(0.5);
    transform-origin: left center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease,
                transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
    z-index: 100;
  }

  body:has(#cart-page) .p-item-img::before {
    content: '';
    position: absolute;
    top: 50%;
    left: calc(100% + 8px);
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-right: 8px solid #c9a96e;
    transform: translateY(-50%);
    opacity: 0;
    transition: opacity 0.2s ease;
    pointer-events: none;
    z-index: 101;
  }

  body:has(#cart-page) .p-item-img:hover::after {
    opacity: 1;
    transform: translateY(-50%) scale(1);
  }

  body:has(#cart-page) .p-item-img:hover::before {
    opacity: 0.8;
  }

  /* Désactive le zoom hover si pas d'image (--img non défini) */
  body:has(#cart-page) .p-item-img:not([style*="--img"])::after,
  body:has(#cart-page) .p-item-img:not([style*="--img"])::before {
    display: none;
  }

  body:has(#cart-page) .p-item-details h3 {
    font-family: 'Libre Baskerville', Georgia, serif;
    font-size: 15px;
    font-weight: 400;
    color: #1b4332;
    text-transform: none;
    letter-spacing: -0.2px;
    line-height: 1.2;
    margin: 0;
  }

  body:has(#cart-page) .p-item-details p {
    font-size: 10.5px;
    color: #8a7a5a;
    margin: 3px 0 0 0;
    letter-spacing: 0.2px;
  }

  body:has(#cart-page) .p-qty-box {
    background: white;
    border-radius: 50px;
    padding: 3px;
    border: 1px solid rgba(201, 169, 110, 0.25);
    box-shadow: 0 1px 2px rgba(27, 67, 50, 0.04);
    width: auto;
    display: inline-flex;
    align-items: center;
    gap: 2px;
  }

  body:has(#cart-page) .p-qty-btn {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: none;
    font-size: 13px;
    line-height: 1;
    background: transparent;
    color: #c9a96e;
    cursor: pointer;
  }

  body:has(#cart-page) .p-qty-btn[data-action="plus"] {
    background: #c9a96e;
    color: #1b4332;
    font-weight: 500;
    box-shadow: 0 1px 2px rgba(201, 169, 110, 0.3);
  }

  body:has(#cart-page) .p-qty-val {
    font-size: 11px;
    font-weight: 500;
    color: #1b4332;
    min-width: 20px;
    text-align: center;
  }

  body:has(#cart-page) .p-item-price {
    font-family: 'Libre Baskerville', Georgia, serif;
    font-size: 17px;
    font-weight: 400;
    color: #1b4332;
    letter-spacing: -0.3px;
    text-align: right;
    min-width: 68px;
  }

  body:has(#cart-page) .p-item-remove {
    font-size: 7.5px;
    letter-spacing: 1.3px;
    font-weight: 500;
    color: rgba(160, 120, 64, 0.75);
    background: transparent;
    border: none;
    padding: 0;
    text-transform: uppercase;
    cursor: pointer;
    opacity: 1;
    margin-top: 6px;
    align-self: flex-end;
  }

  body:has(#cart-page) .p-item-remove:hover {
    color: rgba(160, 120, 64, 1);
  }
}

/* Bouton "Continuer mes achats" sous les cards articles */
body:has(#cart-page) .cart-keep-shopping {
  display: none;
}
@media (min-width: 1025px) {
  body:has(#cart-page) .cart-keep-shopping {
    display: flex;
    align-items: center;
    gap: 12px;
    max-width: 320px;
    margin: 16px auto 0 auto;
    padding: 12px 16px;
    background: transparent;
    border: 1px dashed rgba(201, 169, 110, 0.35);
    border-radius: 50px;
    text-decoration: none;
    cursor: pointer;
    transition: border-color 0.2s ease, background 0.2s ease;
  }

  body:has(#cart-page) .cart-keep-shopping:hover {
    border-color: rgba(201, 169, 110, 0.6);
    background: rgba(201, 169, 110, 0.04);
  }

  body:has(#cart-page) .cart-keep-shopping__text {
    flex: 1;
    color: #c9a96e;
    font-size: 10.5px;
    font-weight: 500;
    letter-spacing: 1.3px;
    font-family: 'Manrope', sans-serif;
  }
}

/* État panier vide (cart-empty) sur dark */
body:has(#cart-page) .cart-empty h2 {
  color: #ffffff;
}
body:has(#cart-page) .cart-empty p {
  color: rgba(255, 255, 255, 0.5);
}

/* ========== Mobile header tunnel dark (≤ 1024px) ========== */
@media (max-width: 1024px) {
  /* Hamburger tunnel dark */
  body:has(#cart-page) .lux-hamburger,
  body:has(#livraison-page) .lux-hamburger,
  body:has(#confirmation-page) .lux-hamburger {
    background: rgba(15, 34, 24, 0.5);
    border: 1px solid rgba(201, 169, 110, 0.3);
  }
  body:has(#cart-page) .lux-hamburger span,
  body:has(#livraison-page) .lux-hamburger span,
  body:has(#confirmation-page) .lux-hamburger span {
    background: #c9a96e;
    width: 14px;
    height: 1.5px;
  }

  /* Pastille compte mobile */
  body:has(#cart-page) .lux-compte-icon,
  body:has(#livraison-page) .lux-compte-icon,
  body:has(#confirmation-page) .lux-compte-icon {
    background: rgba(15, 34, 24, 0.5);
    border: 1px solid rgba(201, 169, 110, 0.3);
    border-radius: 50%;
  }
  body:has(#cart-page) .lux-compte-icon svg path,
  body:has(#livraison-page) .lux-compte-icon svg path,
  body:has(#confirmation-page) .lux-compte-icon svg path {
    fill: #c9a96e;
  }

  /* Pastille panier mobile (.btn-cart-nav — class tunnel) */
  body:has(#cart-page) .btn-cart-nav,
  body:has(#livraison-page) .btn-cart-nav,
  body:has(#confirmation-page) .btn-cart-nav {
    background: rgba(15, 34, 24, 0.5);
    border: 1px solid rgba(201, 169, 110, 0.3);
  }
  body:has(#cart-page) .btn-cart-nav svg,
  body:has(#livraison-page) .btn-cart-nav svg,
  body:has(#confirmation-page) .btn-cart-nav svg {
    stroke: #c9a96e;
  }

  /* Menu mobile dropdown dark */
  body:has(#cart-page) .lux-header__nav,
  body:has(#livraison-page) .lux-header__nav,
  body:has(#confirmation-page) .lux-header__nav {
    background: #0f2218;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  }
  body:has(#cart-page) .lux-header__nav .lux-header__link,
  body:has(#livraison-page) .lux-header__nav .lux-header__link,
  body:has(#confirmation-page) .lux-header__nav .lux-header__link {
    color: rgba(255, 255, 255, 0.7);
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  }

  /* Reset overrides desktop (gap/font-size/letter-spacing) sur mobile */
  body:has(#cart-page) .lux-header__nav,
  body:has(#livraison-page) .lux-header__nav,
  body:has(#confirmation-page) .lux-header__nav {
    gap: 0;
  }
  body:has(#cart-page) .lux-header .lux-header__link,
  body:has(#livraison-page) .lux-header .lux-header__link,
  body:has(#confirmation-page) .lux-header .lux-header__link {
    font-size: 0.9rem;
    letter-spacing: 0.5px;
    font-weight: 600;
  }

  /* Alignement header mobile sur accueil */
  body:has(#cart-page) .lux-header,
  body:has(#livraison-page) .lux-header,
  body:has(#confirmation-page) .lux-header {
    flex-wrap: wrap;
    background: #0f2218;
    padding: 18px 5%;
  }
  body:has(#cart-page) .lux-header .logo,
  body:has(#livraison-page) .lux-header .logo,
  body:has(#confirmation-page) .lux-header .logo {
    order: 3;
  }
  body:has(#cart-page) .lux-header .lux-compte-icon,
  body:has(#livraison-page) .lux-header .lux-compte-icon,
  body:has(#confirmation-page) .lux-header .lux-compte-icon {
    order: 4;
  }
  body:has(#cart-page) .lux-header .btn-cart-nav,
  body:has(#livraison-page) .lux-header .btn-cart-nav,
  body:has(#confirmation-page) .lux-header .btn-cart-nav {
    order: 5;
  }
  body:has(#cart-page) .lux-header .header-logo-img,
  body:has(#livraison-page) .lux-header .header-logo-img,
  body:has(#confirmation-page) .lux-header .header-logo-img {
    border: 1px solid rgba(201, 169, 110, 0.3);
    background: rgba(201, 169, 110, 0.08);
  }
  body:has(#cart-page) .lux-header .header-logo-img .logo-img-light,
  body:has(#livraison-page) .lux-header .header-logo-img .logo-img-light,
  body:has(#confirmation-page) .lux-header .header-logo-img .logo-img-light {
    display: none;
  }
  body:has(#cart-page) .lux-header .header-logo-img .logo-img-dark,
  body:has(#livraison-page) .lux-header .header-logo-img .logo-img-dark,
  body:has(#confirmation-page) .lux-header .header-logo-img .logo-img-dark {
    display: block;
  }

  /* Override SVG circle pastille compte — fill vert au lieu de transparent */
  body:has(#cart-page) .lux-header .lux-compte-icon svg circle:first-child,
  body:has(#livraison-page) .lux-header .lux-compte-icon svg circle:first-child,
  body:has(#confirmation-page) .lux-header .lux-compte-icon svg circle:first-child {
    fill: rgba(15, 34, 24, 0.5);
    stroke: none;
  }
}

/* Lightbox photo panier — mobile uniquement */
body.page-cart .cart-lightbox {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(15, 34, 24, 0.92);
  align-items: center;
  justify-content: center;
  padding: 20px;
  cursor: zoom-out;
  -webkit-tap-highlight-color: transparent;
}
body.page-cart .cart-lightbox.is-open {
  display: flex;
}
body.page-cart .cart-lightbox img {
  max-width: 100%;
  max-height: 100%;
  border-radius: 12px;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.5);
  border: 1px solid rgba(201, 169, 110, 0.3);
  object-fit: contain;
}
@media (min-width: 769px) {
  body.page-cart .cart-lightbox {
    display: none !important;
  }
}

/* h3 cliquable nom produit panier — hérite couleur h3 existant */
body.page-cart .p-item-name-link {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}
body.page-cart .p-item-name-link:hover {
  text-decoration: underline;
  text-decoration-color: rgba(201, 169, 110, 0.5);
  text-underline-offset: 2px;
}

/* === Séparateurs losange amber — M4 === */

/* Cachés par défaut (PC ne les voit pas) */
body.page-cart .cart-separator {
  display: none;
}

/* Visibles en mobile uniquement */
@media (max-width: 768px) {
  body.page-cart .cart-separator {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 18px 0;
  }
  body.page-cart .cart-separator-line {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(201, 169, 110, 0.3), transparent);
  }
  body.page-cart .cart-separator-diamond {
    width: 6px;
    height: 6px;
    background: #c9a96e;
    transform: rotate(45deg);
    flex-shrink: 0;
  }

  /* Losange 3 : mini séparateur intégré au TOTAL TTC via ::before */
  body.page-cart .calc-row.total {
    position: relative;
  }
  body.page-cart .calc-row.total::before {
    content: "";
    position: absolute;
    top: -3px;
    left: 50%;
    transform: translateX(-50%) rotate(45deg);
    width: 5px;
    height: 5px;
    background: #c9a96e;
    z-index: 1;
  }
}

/* === POLISH FINAL panier mobile === */
@media (max-width: 768px) {
  /* 1. Card unifiée : livraison collée à tampons */
  body.page-cart .shipping-promo-box {
    margin-bottom: 0 !important;
    border-bottom: none !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    position: relative;
  }
  body.page-cart .shipping-promo-box::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 8px;
    right: 8px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(201, 169, 110, 0.2), transparent);
  }
  body.page-cart .cart-tampons-box {
    margin-top: 0 !important;
    border-top: none !important;
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
  }

  /* 2. Prix livraison estompé */
  body.page-cart .spb-amount {
    color: rgba(160, 120, 64, 0.7) !important;
    font-size: 9.5px !important;
    font-weight: 500 !important;
    font-family: 'Manrope', sans-serif !important;
  }
  body.page-cart .spb-label {
    font-size: 8px !important;
    color: rgba(138, 122, 90, 0.7) !important;
  }

  /* 3. TOTAL TTC renforcé */
  body.page-cart .calc-row.total .ct-label {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 8px !important;
    letter-spacing: 2.2px !important;
    font-weight: 600 !important;
  }
  body.page-cart .calc-row.total .ct-sublabel {
    color: rgba(255, 255, 255, 0.4) !important;
    font-size: 6.5px !important;
  }
  body.page-cart .calc-row.total > span:last-child {
    font-size: 22px !important;
    font-weight: 500 !important;
  }

  /* 4. Trait dégradé sous card unifiée */
  body.page-cart .cart-tampons-box {
    position: relative;
    margin-bottom: 14px !important;
  }
  body.page-cart .cart-tampons-box::after {
    content: "";
    position: absolute;
    bottom: -7px;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(201, 169, 110, 0.18), transparent);
  }
}

/* === L1 Hero livraison dark — PC + Mobile === */

/* Hero transparent dark (override card crème base + L7709) */
body.page-livraison .shipping-header {
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  border-left: none !important;
  border-radius: 0 !important;
  padding: 28px 32px 14px !important;
  margin-bottom: 0 !important;
  box-shadow: none !important;
  display: block !important;
  text-align: center !important;
}

/* Eyebrow ÉTAPE 2 amber centré */
body.page-livraison .shipping-header__eyebrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-bottom: 14px;
}
body.page-livraison .shipping-header__eyebrow-line {
  display: inline-block;
  width: 22px;
  height: 1px;
  background: linear-gradient(90deg, transparent, #c9a96e);
}
body.page-livraison .shipping-header__eyebrow-line:last-child {
  background: linear-gradient(90deg, #c9a96e, transparent);
}
body.page-livraison .shipping-header__eyebrow-text {
  color: #c9a96e;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 2.8px;
  text-transform: uppercase;
}

/* H1 blanc serif (override base 2.8rem green-deep) */
body.page-livraison .shipping-header h1 {
  color: white !important;
  font-family: 'Libre Baskerville', Georgia, serif !important;
  font-size: 26px !important;
  font-weight: 400 !important;
  letter-spacing: -0.3px !important;
  margin: 0 0 8px !important;
  text-align: center !important;
}

/* Sous-titre normal (override base uppercase amber 0.72rem) */
body.page-livraison .shipping-header p {
  color: rgba(255, 255, 255, 0.45) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  margin: 0 !important;
  text-align: center !important;
}

/* Séparateur losange — masqué par défaut (PC) */
body.page-livraison .liv-separator {
  display: none;
}

/* Mobile : eyebrow plus petit + losange visible */
@media (max-width: 768px) {
  body.page-livraison .liv-layout {
    overflow-x: hidden;
    margin-top: 20px;
  }
  body.page-livraison .liv-layout > main {
    overflow: hidden;
    min-width: 0;
  }
  body.page-livraison .shipping-header {
    padding: 24px 16px 20px !important;
  }
  body.page-livraison .shipping-header__eyebrow {
    gap: 10px;
    margin-bottom: 10px;
  }
  body.page-livraison .shipping-header__eyebrow-line {
    width: 22px;
  }
  body.page-livraison .shipping-header__eyebrow-text {
    font-size: 9px;
    letter-spacing: 2.5px;
  }
  body.page-livraison .shipping-header h1 {
    font-size: 28px !important;
    font-weight: 500 !important;
    letter-spacing: -0.5px !important;
    margin: 0 !important;
  }
  body.page-livraison .shipping-header p {
    font-size: 12px !important;
    color: rgba(255, 255, 255, 0.5) !important;
    margin-top: 8px !important;
  }

  /* Losange visible mobile */
  body.page-livraison .liv-separator {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 14px 16px 18px;
  }
  body.page-livraison .liv-separator-line {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(201, 169, 110, 0.3), transparent);
  }
  body.page-livraison .liv-separator-diamond {
    width: 5px;
    height: 5px;
    background: #c9a96e;
    transform: rotate(45deg);
    flex-shrink: 0;
  }
}

/* === L2 Form-card livraison crème dark-thémée === */

/* Conteneur form-card : crème, border amber, radius 16 */
body.page-livraison .form-card {
  background: #f5f0e6;
  border: 1px solid rgba(201, 169, 110, 0.18);
  border-left: 1px solid rgba(201, 169, 110, 0.18);
  border-radius: 16px;
  padding: 28px 32px;
  margin-bottom: 22px;
  box-shadow: none;
  background-image: none;
}

/* Eyebrow */
body.page-livraison .form-card-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
body.page-livraison .form-card-eyebrow-line {
  display: inline-block;
  width: 18px;
  height: 1px;
  background: linear-gradient(90deg, transparent, #a07840);
}
body.page-livraison .form-card-eyebrow-text {
  color: #a07840;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 2.8px;
  text-transform: uppercase;
}

/* H2 vert serif (override base 1.8rem + ::after trait gris) */
body.page-livraison .form-card h2 {
  color: #1b4332;
  font-family: 'Libre Baskerville', Georgia, serif;
  font-size: 22px;
  font-weight: 400;
  letter-spacing: -0.3px;
  margin: 0 0 18px;
  display: block;
  padding: 0;
}
body.page-livraison .form-card h2::after {
  display: none;
}
body.page-livraison .form-card-section h2 small.liv-parrainage-optional {
  font-size: 11px;
  color: #8a7a5a;
  font-style: italic;
  font-weight: 400;
  margin-left: 4px;
}

/* CTA Récupérer mes infos */
body.page-livraison .liv-account-cta {
  background: rgba(201, 169, 110, 0.06);
  border: 1px solid rgba(201, 169, 110, 0.18);
  border-radius: 12px;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}
body.page-livraison .liv-account-cta__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
body.page-livraison .liv-account-cta__title {
  font-family: 'Libre Baskerville', Georgia, serif;
  font-size: 15px;
  color: #1b4332;
  margin: 0;
  font-weight: 400;
}
body.page-livraison .liv-account-cta__subtitle {
  font-size: 11px;
  color: #8a7a5a;
  margin: 0;
}
body.page-livraison .liv-account-cta__btn {
  background: #1b4332;
  color: #c9a96e;
  border: none;
  border-radius: 50px;
  padding: 9px 16px;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  cursor: pointer;
  white-space: nowrap;
}
body.page-livraison .liv-account-cta__btn:hover {
  background: #2d6a4f;
}

/* Inputs blancs bordure amber */
body.page-livraison .input-group input {
  background: white;
  border: 1px solid rgba(201, 169, 110, 0.2);
  border-radius: 10px;
  padding: 9px 12px;
  font-size: 13px;
  color: #1b4332;
  width: 100%;
  box-shadow: none;
  transition: border-color 0.2s ease;
}
body.page-livraison .input-group input:focus {
  outline: none;
  border-color: #c9a96e;
}
body.page-livraison .input-group input::placeholder {
  color: #b4b2a9;
}

/* Labels uppercase amber */
body.page-livraison .input-group label {
  display: block;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.8px;
  color: #8a7a5a;
  margin-bottom: 6px;
  text-transform: uppercase;
}

/* Section parrainage : border dashed amber + hint stylé */
body.page-livraison .form-card-section {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px dashed rgba(201, 169, 110, 0.25);
}
body.page-livraison .form-card-section h2 {
  font-size: 17px;
  margin: 0 0 8px;
}
body.page-livraison .liv-parrainage-hint {
  display: block;
  font-size: 11px;
  color: #8a7a5a;
  margin-top: 8px;
  line-height: 1.4;
}

/* Séparateur losange entre les 2 form-cards : MASQUÉ par défaut PC */
body.page-livraison .liv-separator-cards {
  display: none;
}

/* MOBILE : tailles réduites + losange visible */
@media (max-width: 768px) {
  body.page-livraison .form-card {
    padding: 18px 16px;
    margin-bottom: 14px;
    border-radius: 12px;
    overflow: hidden;
    max-width: 100%;
  }
  body.page-livraison .form-card-eyebrow {
    gap: 8px;
    margin-bottom: 6px;
  }
  body.page-livraison .form-card-eyebrow-line {
    width: 14px;
  }
  body.page-livraison .form-card-eyebrow-text {
    font-size: 8px;
    letter-spacing: 2.3px;
  }
  body.page-livraison .form-card h2 {
    font-size: 16px;
    margin: 0 0 12px;
  }
  body.page-livraison .liv-account-cta {
    padding: 10px 12px;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 14px;
    flex-wrap: nowrap;
  }
  body.page-livraison .liv-account-cta__text {
    min-width: 0;
    flex: none;
    width: 100%;
  }
  body.page-livraison .liv-account-cta__title {
    font-size: 13px;
  }
  body.page-livraison .liv-account-cta__subtitle {
    font-size: 9.5px;
  }
  body.page-livraison .liv-account-cta__btn {
    width: 100%;
    padding: 10px 12px;
    font-size: 9px;
  }
  body.page-livraison .input-group {
    min-width: 0;
  }
  body.page-livraison .input-group input {
    font-size: 12px;
    padding: 8px 10px;
    min-width: 0;
    width: 100%;
  }
  body.page-livraison .input-group label {
    font-size: 8px;
    margin-bottom: 5px;
    word-break: break-word;
  }
  body.page-livraison .form-card-section h2 {
    font-size: 14px;
  }
  body.page-livraison .liv-parrainage-hint {
    font-size: 10px;
  }
  body.page-livraison .method-card {
    flex-wrap: wrap;
  }
  body.page-livraison .method-info {
    min-width: 0;
    flex: 1;
  }
  body.page-livraison .method-info span {
    word-break: break-word;
  }

  /* Losange visible mobile */
  body.page-livraison .liv-separator-cards {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 4px 16px 14px;
  }
  body.page-livraison .liv-separator-cards .liv-separator-line {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(201, 169, 110, 0.3), transparent);
  }
  body.page-livraison .liv-separator-cards .liv-separator-diamond {
    width: 5px;
    height: 5px;
    background: #c9a96e;
    transform: rotate(45deg);
    flex-shrink: 0;
  }
}

/* === L3 Method-cards livraison thème amber === */

/* Card non-sélectionnée : fond blanc, border amber subtil */
body.page-livraison .method-card {
  background: white;
  border: 1px solid rgba(201, 169, 110, 0.2);
  border-radius: 14px;
  padding: 16px 18px;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 16px;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

body.page-livraison .method-card:hover {
  border-color: rgba(201, 169, 110, 0.4);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
}

/* Icône cercle non-active : vert subtil + SVG vert */
body.page-livraison .method-icon {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(27, 67, 50, 0.06);
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: none;
  transition: all 0.3s ease;
}
body.page-livraison .method-icon svg {
  width: 22px;
  height: 22px;
  fill: #1b4332;
  transition: fill 0.3s ease;
}

/* Texte non-active */
body.page-livraison .method-info b {
  display: block;
  font-family: 'Libre Baskerville', Georgia, serif;
  color: #1b4332;
  font-size: 15px;
  font-weight: 400;
  margin-bottom: 2px;
  letter-spacing: -0.2px;
}
body.page-livraison .method-info span {
  font-size: 11px;
  color: #8a7a5a;
  font-weight: 400;
}

/* Prix non-active */
body.page-livraison .method-price {
  font-family: 'Libre Baskerville', Georgia, serif;
  font-size: 15px;
  font-weight: 400;
  color: #1b4332;
  margin-left: auto;
  white-space: nowrap;
  text-align: right;
}

/* Card sélectionnée (.active) : gradient amber + border amber */
body.page-livraison .method-card.active {
  background: linear-gradient(180deg, rgba(201, 169, 110, 0.12), rgba(27, 67, 50, 0.04));
  border: 1.5px solid #c9a96e;
}

/* Card active : icône cercle vert foncé + SVG amber */
body.page-livraison .method-card.active .method-icon {
  background: #1b4332;
}
body.page-livraison .method-card.active .method-icon svg {
  fill: #c9a96e;
}

/* Card active : prix amber pour "Offert" (Retrait), reste vert pour autres */
body.page-livraison .method-card.active[data-method="pickup"] .method-price {
  color: #c9a96e;
}

/* Ribbon "SÉLECTIONNÉ" : override couleurs (existait déjà via ::before) */
body.page-livraison .method-card.active::before {
  content: 'S\00c9LECTIONN\00c9';
  position: absolute;
  top: 15px;
  right: -36px;
  transform: rotate(45deg);
  background: #1b4332;
  color: #c9a96e;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 1.2px;
  padding: 3px 28px;
}

/* Méthode .method-selection : alignement (anciennement margin-top: 60px base) */
body.page-livraison .method-selection {
  margin-top: 0;
}

/* Pickup note (apparaît si Retrait sélectionné) */
body.page-livraison .pickup-note {
  background: rgba(201, 169, 110, 0.06);
  border: 1px solid rgba(201, 169, 110, 0.2);
  color: #1b4332;
  padding: 14px 16px;
  border-radius: 12px;
  margin-top: 12px;
  font-size: 11px;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
body.page-livraison .pickup-note svg {
  fill: #c9a96e;
  flex-shrink: 0;
}
body.page-livraison .pickup-payment-options {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  width: 100%;
  padding-left: 28px;
}
body.page-livraison .pickup-payment-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #1b4332;
  cursor: pointer;
  margin-bottom: 0;
}
body.page-livraison .pickup-payment-label input[type="radio"] {
  accent-color: #c9a96e;
}

/* Shipping zone note */
body.page-livraison .shipping-zone-note {
  text-align: center;
  font-size: 10px;
  color: #8a7a5a;
  font-style: italic;
  margin-top: 14px;
  opacity: 0.85;
  font-weight: 400;
}

/* L3 MOBILE : tailles réduites */
@media (max-width: 768px) {
  body.page-livraison .method-card {
    padding: 12px 14px;
    gap: 12px;
    border-radius: 12px;
    margin-bottom: 8px;
  }
  body.page-livraison .method-icon {
    width: 36px;
    height: 36px;
  }
  body.page-livraison .method-icon svg {
    width: 18px;
    height: 18px;
  }
  body.page-livraison .method-info b {
    font-size: 13px;
  }
  body.page-livraison .method-info span {
    font-size: 9.5px;
  }
  body.page-livraison .method-price {
    font-size: 13px;
  }
  body.page-livraison .method-card.active::before {
    font-size: 7px;
    padding: 2px 22px;
    top: 14px;
    right: -31px;
  }
  body.page-livraison .pickup-note {
    padding: 10px 12px;
    font-size: 10px;
  }
  body.page-livraison .pickup-payment-options {
    padding-left: 0;
    flex-direction: column;
    gap: 8px;
  }
  body.page-livraison .pickup-payment-label {
    font-size: 11px;
  }
  body.page-livraison .shipping-zone-note {
    font-size: 9px;
    margin-top: 10px;
  }
}

/* === L4 Récap aside livraison dark cohérent panier === */

/* Container : transparent, plus de card blanche border-left vert */
body.page-livraison .summary-pane {
  position: sticky;
  top: 20px;
}
body.page-livraison .summary-inner {
  background: transparent;
  border: none;
  border-left: none;
  border-radius: 0;
  padding: 24px 0;
  margin: 0;
  box-shadow: none;
  background-image: none;
}

/* Eyebrow 1 ligne gauche cohérent panier */
body.page-livraison .summary-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}
body.page-livraison .summary-eyebrow-line {
  display: inline-block;
  width: 16px;
  height: 1px;
  background: #c9a96e;
}
body.page-livraison .summary-eyebrow-text {
  color: #c9a96e;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
}

/* H2 Votre commande */
body.page-livraison .summary-inner h2 {
  color: white;
  font-family: 'Libre Baskerville', Georgia, serif;
  font-size: 22px;
  font-weight: 400;
  text-align: left;
  margin: 0 0 18px 0;
  letter-spacing: -0.3px;
  display: block;
  padding: 0;
}
body.page-livraison .summary-inner h2::after {
  display: none;
}

/* Calc-rows blancs/amber */
body.page-livraison .summary-inner .calc-row {
  display: flex;
  justify-content: space-between;
  padding: 5px 0;
  margin: 0;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.65);
  border: none;
}
body.page-livraison .summary-inner .calc-row > span:last-child {
  color: rgba(255, 255, 255, 0.9);
  font-weight: 500;
}

/* Total dark gradient + ct-label-wrap + valeur amber */
body.page-livraison .summary-inner .calc-row.total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 14px 0 16px;
  margin-top: 10px;
  border-top: none;
  background-image: linear-gradient(90deg, transparent, rgba(201, 169, 110, 0.3) 10%, rgba(201, 169, 110, 0.3) 90%, transparent);
  background-repeat: no-repeat;
  background-size: 100% 1px;
  background-position: top;
  font-size: inherit;
  color: inherit;
}
body.page-livraison .calc-row.total .ct-label-wrap {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
body.page-livraison .calc-row.total .ct-label {
  color: rgba(255, 255, 255, 0.55);
  font-size: 9.5px;
  letter-spacing: 2.5px;
  font-weight: 700;
  text-transform: uppercase;
}
body.page-livraison .calc-row.total .ct-sublabel {
  color: rgba(255, 255, 255, 0.3);
  font-size: 8.5px;
  letter-spacing: 0.3px;
  text-transform: none;
  font-weight: 400;
}
body.page-livraison .calc-row.total > span:last-child {
  color: #e8c98a;
  font-family: 'Libre Baskerville', Georgia, serif;
  font-size: 26px;
  font-weight: 400;
  letter-spacing: -0.4px;
}

/* Bouton Valider & Continuer (gradient vert + amber + flèche) */
body.page-livraison .liv-btn-validate.p-btn-checkout {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: linear-gradient(135deg, #1b4332 0%, #2d6a4f 100%);
  color: #e8c98a;
  border: 1px solid rgba(201, 169, 110, 0.35);
  border-radius: 50px;
  padding: 16px;
  font-size: 11px;
  letter-spacing: 2.5px;
  font-weight: 600;
  text-decoration: none;
  margin: 14px 0 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15), inset 0 1px 0 rgba(201, 169, 110, 0.15);
  text-transform: uppercase;
  cursor: pointer;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
body.page-livraison .liv-btn-validate.p-btn-checkout:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2), inset 0 1px 0 rgba(201, 169, 110, 0.2);
}
body.page-livraison .liv-btn-validate.p-btn-checkout svg {
  stroke: #e8c98a;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

/* Ligne PAIEMENT SÉCURISÉ · VIVA WALLET */
body.page-livraison .p-secure-line {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  color: rgba(255, 255, 255, 0.4);
  font-size: 9px;
  letter-spacing: 1.5px;
  margin-top: 4px;
  font-weight: 500;
}
body.page-livraison .p-secure-line svg {
  flex-shrink: 0;
}

/* Trust badges restylés DARK option A */
body.page-livraison .summary-inner .p-trust-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 12px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid rgba(201, 169, 110, 0.15);
}
body.page-livraison .summary-inner .p-trust-card {
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  background: transparent;
  border: none;
  padding: 0;
}
body.page-livraison .summary-inner .p-trust-circle {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(201, 169, 110, 0.15);
  border: 1px solid rgba(201, 169, 110, 0.4);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #c9a96e;
}
body.page-livraison .summary-inner .p-trust-card span {
  font-size: 9.5px;
  color: rgba(255, 255, 255, 0.5);
  font-weight: 500;
  letter-spacing: 0.5px;
}

/* L4 MOBILE : tailles réduites + trust grid plus compact */
@media (max-width: 768px) {
  body.page-livraison .summary-inner {
    padding: 16px 0;
  }
  body.page-livraison .summary-eyebrow-text {
    font-size: 8.5px;
    letter-spacing: 2.5px;
  }
  body.page-livraison .summary-eyebrow-line {
    width: 12px;
  }
  body.page-livraison .summary-inner h2 {
    font-size: 17px;
    margin: 0 0 14px 0;
  }
  body.page-livraison .summary-inner .calc-row {
    font-size: 10.5px;
    padding: 4px 0;
  }
  body.page-livraison .summary-inner .calc-row.total {
    padding: 12px 0 14px;
    margin-top: 8px;
  }
  body.page-livraison .calc-row.total .ct-label {
    font-size: 8.5px;
    letter-spacing: 2px;
  }
  body.page-livraison .calc-row.total .ct-sublabel {
    font-size: 7.5px;
  }
  body.page-livraison .calc-row.total > span:last-child {
    font-size: 22px;
  }
  body.page-livraison .liv-btn-validate.p-btn-checkout {
    padding: 13px;
    font-size: 10px;
    letter-spacing: 2px;
    gap: 8px;
    margin: 12px 0 8px;
  }
  body.page-livraison .liv-btn-validate.p-btn-checkout svg {
    width: 12px;
    height: 12px;
  }
  body.page-livraison .p-secure-line {
    font-size: 8px;
    letter-spacing: 1.3px;
  }
  body.page-livraison .summary-inner .p-trust-grid {
    gap: 8px;
    margin-top: 14px;
    padding-top: 12px;
  }
  body.page-livraison .summary-inner .p-trust-circle {
    width: 28px;
    height: 28px;
  }
  body.page-livraison .summary-inner .p-trust-circle svg {
    width: 14px;
    height: 14px;
  }
  body.page-livraison .summary-inner .p-trust-card span {
    font-size: 8px;
  }
}

/* === Losange séparateur final mobile (entre form-card et récap) === */

/* Masqué par défaut PC */
body.page-livraison .liv-separator-final {
  display: none;
}

/* Mobile : visible cohérent autres losanges */
@media (max-width: 768px) {
  body.page-livraison .liv-separator-final {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 18px 16px 14px;
  }
  body.page-livraison .liv-separator-final .liv-separator-line {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(201, 169, 110, 0.3), transparent);
  }
  body.page-livraison .liv-separator-final .liv-separator-diamond {
    width: 5px;
    height: 5px;
    background: #c9a96e;
    transform: rotate(45deg);
    flex-shrink: 0;
  }
}

/* === L1 Confirmation hero dark cohérent livraison === */

/* Container : transparent, centré, sans card */
body.page-confirmation .conf-payment-header {
  background: transparent !important;
  border: none !important;
  border-left: none !important;
  border-radius: 0 !important;
  padding: 28px 32px 14px !important;
  margin: 0 !important;
  margin-bottom: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
  display: block !important;
  text-align: center !important;
}

/* Eyebrow ÉTAPE 3 */
body.page-confirmation .conf-payment-header__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}

body.page-confirmation .conf-payment-header__eyebrow-line {
  display: inline-block;
  width: 22px;
  height: 1px;
  background: #c9a96e;
}

body.page-confirmation .conf-payment-header__eyebrow-line:first-child {
  background: linear-gradient(90deg, transparent, #c9a96e);
}

body.page-confirmation .conf-payment-header__eyebrow-line:last-child {
  background: linear-gradient(90deg, #c9a96e, transparent);
}

body.page-confirmation .conf-payment-header__eyebrow-text {
  color: #c9a96e;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 2.8px;
  text-transform: uppercase;
}

/* H1 blanc serif (override base + tunnel dark) */
body.page-confirmation .conf-payment-header h1 {
  color: white !important;
  font-family: 'Libre Baskerville', Georgia, serif !important;
  font-size: 36px !important;
  font-weight: 400 !important;
  letter-spacing: -0.3px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  text-align: center !important;
}

body.page-confirmation .conf-payment-header h1::after {
  display: none !important;
}

/* Sous-titre blanc translucide normal case */
body.page-confirmation .conf-payment-header p {
  color: rgba(255, 255, 255, 0.45) !important;
  font-size: 11px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  margin: 6px 0 0 0 !important;
  padding: 0 !important;
}

/* L1 MOBILE : tailles alignées livraison mobile */
@media (max-width: 768px) {
  body.page-confirmation .conf-layout {
    margin-top: 20px;
  }
  body.page-confirmation .conf-payment-header {
    padding: 24px 16px 20px !important;
  }
  body.page-confirmation .conf-payment-header__eyebrow {
    gap: 10px;
    margin-bottom: 10px;
  }
  body.page-confirmation .conf-payment-header__eyebrow-line {
    width: 22px;
  }
  body.page-confirmation .conf-payment-header__eyebrow-text {
    font-size: 9px;
    letter-spacing: 2.5px;
  }
  body.page-confirmation .conf-payment-header h1 {
    font-size: 32px !important;
    font-weight: 500 !important;
    letter-spacing: -0.5px !important;
  }
  body.page-confirmation .conf-payment-header p {
    font-size: 12px !important;
    color: rgba(255, 255, 255, 0.5) !important;
    margin-top: 8px !important;
  }
}

/* === L2 Confirmation card "Détails d'expédition/retrait" === */

/* Container : crème + border amber subtil, plus de border-left vert + box-shadow */
body.page-confirmation .conf-info-card {
  background: #f5f0e6 !important;
  border: 1px solid rgba(201, 169, 110, 0.18) !important;
  border-left: 1px solid rgba(201, 169, 110, 0.18) !important;
  border-radius: 16px !important;
  padding: 28px 32px !important;
  margin-bottom: 22px !important;
  box-shadow: none !important;
  background-image: none !important;
}

/* H2 vert serif + trait amber décoratif (variante 2 validée) */
body.page-confirmation .conf-info-card h2 {
  color: #1b4332 !important;
  font-family: 'Libre Baskerville', Georgia, serif !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  letter-spacing: -0.3px !important;
  margin: 0 0 18px 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 0 !important;
}
body.page-confirmation .conf-info-card h2::after {
  content: '' !important;
  flex: 1 !important;
  height: 1px !important;
  background: rgba(201, 169, 110, 0.3) !important;
  display: block !important;
}

/* H4 labels : amber muted (cohérent livraison labels) */
body.page-confirmation .conf-info-card .conf-review-item h4 {
  font-size: 9px !important;
  font-weight: 700 !important;
  letter-spacing: 1.8px !important;
  color: #8a7a5a !important;
  text-transform: uppercase !important;
  margin: 0 0 8px 0 !important;
}

/* P texte : vert foncé (cohérent livraison inputs) */
body.page-confirmation .conf-info-card .conf-review-item p {
  font-size: 13px !important;
  color: #1b4332 !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  margin: 0 0 4px 0 !important;
}

/* Liens cliquables (mailto, tel, Google Maps) : couleur amber + souligné subtil */
body.page-confirmation .conf-info-card .conf-review-item p a {
  color: #1b4332 !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(201, 169, 110, 0.5) !important;
  text-underline-offset: 2px !important;
  transition: color 0.2s ease, text-decoration-color 0.2s ease !important;
}
body.page-confirmation .conf-info-card .conf-review-item p a:hover {
  color: #c9a96e !important;
  text-decoration-color: #c9a96e !important;
}

/* Review grid : 2 colonnes PC, gap réduit pour proportion crème card */
body.page-confirmation .conf-info-card .conf-review-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 30px !important;
  margin: 0 !important;
}

/* Tablette intermédiaire (≥769px et ≤1100px) : padding réduit */
@media (min-width: 769px) and (max-width: 1100px) {
  body.page-confirmation .conf-info-card {
    padding: 22px 24px !important;
  }
  body.page-confirmation .conf-info-card .conf-review-grid {
    gap: 24px !important;
  }
}

/* === L5 Confirmation mobile recap dark + encart crème === */

@media (max-width: 900px) {

  /* #conf-recap-mobile : fond transparent (virer la card blanche) */
  body.page-confirmation #conf-recap-mobile {
    background: transparent !important;
    border: none !important;
    border-left: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 24px 0 0 0 !important;
    box-shadow: none !important;
  }

  /* H2 "Récapitulatif" : blanc serif */
  body.page-confirmation #conf-recap-mobile h2 {
    color: white !important;
    font-family: 'Libre Baskerville', Georgia, serif !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    margin: 24px 0 14px 0 !important;
    padding: 0 !important;
  }

  /* .calc-row : textes clair sur dark */
  body.page-confirmation #conf-recap-mobile .calc-row {
    color: rgba(255, 255, 255, 0.65) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    margin-bottom: 10px !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
  }
  body.page-confirmation #conf-recap-mobile .calc-row > span:last-child {
    color: rgba(255, 255, 255, 0.9) !important;
    font-weight: 600 !important;
  }

  /* .calc-row.cart-reduction-row : amber pour distinction */
  body.page-confirmation #conf-recap-mobile .calc-row.cart-reduction-row {
    color: #c9a96e !important;
  }
  body.page-confirmation #conf-recap-mobile .calc-row.cart-reduction-row > span:last-child {
    color: #c9a96e !important;
  }

  /* .calc-row.total : amber + plus grand pour mise en avant */
  body.page-confirmation #conf-recap-mobile .calc-row.total {
    color: #c9a96e !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    margin-top: 14px !important;
    padding-top: 14px !important;
    border-top: 1px solid rgba(201, 169, 110, 0.25) !important;
  }
  body.page-confirmation #conf-recap-mobile .calc-row.total > span {
    color: #c9a96e !important;
  }

  /* .conf-encart : devient card crème séparée (cohérent L2 PC) */
  body.page-confirmation .conf-encart {
    background: #f5f0e6 !important;
    border: 1px solid rgba(201, 169, 110, 0.18) !important;
    border-left: 1px solid rgba(201, 169, 110, 0.18) !important;
    border-radius: 14px !important;
    padding: 16px !important;
    margin: 0 !important;
  }

  /* H3/title de l'encart : vert serif sur crème */
  body.page-confirmation .conf-encart .conf-encart-title {
    color: #1b4332 !important;
    font-family: 'Libre Baskerville', Georgia, serif !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    margin: 0 0 12px 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
  }
  body.page-confirmation .conf-encart .conf-encart-title::after {
    content: '' !important;
    flex: 1 !important;
    height: 1px !important;
    background: rgba(201, 169, 110, 0.3) !important;
    display: block !important;
  }

  /* Grid 2 colonnes */
  body.page-confirmation .conf-encart .conf-encart-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 14px !important;
  }

  /* H4 labels : amber muted (cohérent L2 PC) */
  body.page-confirmation .conf-encart .conf-encart-col h4 {
    color: #8a7a5a !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    margin: 0 0 6px 0 !important;
  }

  /* P texte : vert foncé sur crème */
  body.page-confirmation .conf-encart .conf-encart-col p {
    color: #1b4332 !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    margin: 0 !important;
  }

  /* Lien Google Maps : override couleur inline (style="color:var(--green-deep)..." invisible) */
  body.page-confirmation .conf-encart .conf-encart-col p a {
    color: #1b4332 !important;
    text-decoration: underline !important;
    text-decoration-color: rgba(201, 169, 110, 0.5) !important;
    text-underline-offset: 2px !important;
    font-weight: 600 !important;
    transition: color 0.2s ease, text-decoration-color 0.2s ease !important;
  }
  body.page-confirmation .conf-encart .conf-encart-col p a:hover {
    color: #c9a96e !important;
    text-decoration-color: #c9a96e !important;
  }

}

/* === L3 Confirmation card "Ce qu'il va se passer" creme + border amber === */

/* Container : creme + border amber + radius 16 (cohérent L2) */
body.page-confirmation .conf-order-process-info {
  background: #f5f0e6 !important;
  border: 1px solid rgba(201, 169, 110, 0.18) !important;
  border-left: 1px solid rgba(201, 169, 110, 0.18) !important;
  border-radius: 16px !important;
  padding: 28px 32px !important;
  margin-top: 22px !important;
  margin-bottom: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
}

/* H3 "Ce qu'il va se passer" : vert serif sur creme */
body.page-confirmation .conf-order-process-info h3 {
  color: #1b4332 !important;
  font-family: 'Libre Baskerville', Georgia, serif !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  letter-spacing: -0.3px !important;
  margin: 0 0 18px 0 !important;
  padding: 0 !important;
}

/* Steps : texte vert foncé sur creme */
body.page-confirmation .conf-order-process-info .conf-step {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  margin-bottom: 12px !important;
}

body.page-confirmation .conf-order-process-info .conf-step p {
  color: #1b4332 !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.page-confirmation .conf-order-process-info .conf-step b {
  color: #1b4332 !important;
  font-weight: 700 !important;
}

/* Cercles numéros : vert foncé + blanc (conservés) */
body.page-confirmation .conf-order-process-info .conf-step-num {
  background: #1b4332 !important;
  color: white !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  margin-top: 1px !important;
}

/* Pay-intro (bandeau Viva Wallet ou espèces) : vert foncé conservé sur creme */
body.page-confirmation .conf-order-process-info .conf-pay-intro {
  background: #1b4332 !important;
  border-radius: 8px !important;
  padding: 12px 14px !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  margin-bottom: 16px !important;
  border: 1px solid rgba(201, 169, 110, 0.2) !important;
}

body.page-confirmation .conf-order-process-info .conf-pay-intro p {
  color: rgba(255, 255, 255, 0.92) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  margin: 0 !important;
}

body.page-confirmation .conf-order-process-info .conf-pay-intro b {
  color: #c9a96e !important;
  font-weight: 700 !important;
}

/* Note client : italique amber muted */
body.page-confirmation .conf-order-process-info .conf-client-note {
  margin-top: 18px !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(201, 169, 110, 0.25) !important;
  font-style: italic !important;
  color: #8a7a5a !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  font-weight: 400 !important;
}

/* Merci de votre confiance : VERT FONCE (validation user) */
body.page-confirmation .conf-order-process-info .conf-thanks {
  margin-top: 14px !important;
  color: #1b4332 !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  font-size: 12px !important;
  text-align: center !important;
  padding: 0 !important;
}

/* L3 MOBILE : tailles reduites */
@media (max-width: 768px) {
  body.page-confirmation .conf-order-process-info {
    padding: 16px 14px !important;
  }
  body.page-confirmation .conf-order-process-info h3 {
    font-size: 18px !important;
    margin-bottom: 14px !important;
  }
  body.page-confirmation .conf-order-process-info .conf-step p {
    font-size: 12px !important;
  }
  body.page-confirmation .conf-order-process-info .conf-step-num {
    width: 20px !important;
    height: 20px !important;
    font-size: 10px !important;
  }
  body.page-confirmation .conf-order-process-info .conf-pay-intro p {
    font-size: 11px !important;
  }
  body.page-confirmation .conf-order-process-info .conf-client-note {
    font-size: 11px !important;
  }
  body.page-confirmation .conf-order-process-info .conf-thanks {
    font-size: 11px !important;
  }
}

/* === L4 Confirmation récap aside PC + bouton final + Viva footer dark === */

/* Container .summary-inner : transparent (virer card blanche + border + shadow) */
body.page-confirmation .summary-inner {
  background: transparent !important;
  border: none !important;
  border-left: none !important;
  border-radius: 0 !important;
  padding: 24px 0 0 0 !important;
  box-shadow: none !important;
  background-image: none !important;
}

/* H2 "Récapitulatif" blanc serif */
body.page-confirmation .summary-inner h2 {
  color: white !important;
  font-family: 'Libre Baskerville', Georgia, serif !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  letter-spacing: -0.3px !important;
  margin: 0 0 22px 0 !important;
  padding: 0 !important;
}

/* H2 reset trait éventuel (cohérence) */
body.page-confirmation .summary-inner h2::after {
  display: none !important;
}

/* .calc-row articles + livraison : textes clair sur dark */
body.page-confirmation .summary-inner .calc-row {
  color: rgba(255, 255, 255, 0.65) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  margin-bottom: 12px !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}
body.page-confirmation .summary-inner .calc-row > span:last-child {
  color: rgba(255, 255, 255, 0.9) !important;
  font-weight: 600 !important;
}

/* Override inline style="border-top:1px solid var(--border-lux)" sur livraison */
body.page-confirmation .summary-inner .calc-row[style*="border-top"] {
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  padding-top: 12px !important;
}

/* .cart-reduction-row : amber pour distinction */
body.page-confirmation .summary-inner .calc-row.cart-reduction-row {
  color: #c9a96e !important;
}
body.page-confirmation .summary-inner .calc-row.cart-reduction-row > span:last-child {
  color: #c9a96e !important;
}

/* .calc-row.total : amber serif gradient top */
body.page-confirmation .summary-inner .calc-row.total {
  margin-top: 18px !important;
  padding-top: 18px !important;
  border-top: 1px solid rgba(201, 169, 110, 0.3) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
}
body.page-confirmation .summary-inner .calc-row.total > span {
  color: #c9a96e !important;
  font-family: 'Libre Baskerville', Georgia, serif !important;
  font-weight: 700 !important;
}
body.page-confirmation .summary-inner .calc-row.total > span:last-child {
  font-size: 22px !important;
}

/* Bouton .conf-btn-submit : gradient vert + amber + radius 50 (cohérent panier) */
body.page-confirmation .summary-inner .conf-btn-submit,
body.page-confirmation .conf-btn-submit {
  width: 100% !important;
  background: linear-gradient(135deg, #1b4332, #2d6a4f) !important;
  color: #e8c98a !important;
  border: 1px solid rgba(201, 169, 110, 0.35) !important;
  padding: 16px 24px !important;
  border-radius: 50px !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  margin-top: 24px !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25) !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
}
body.page-confirmation .summary-inner .conf-btn-submit:hover,
body.page-confirmation .conf-btn-submit:hover {
  background: linear-gradient(135deg, #2d6a4f, #3a7d5e) !important;
  color: #f0d59c !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35) !important;
}
body.page-confirmation .summary-inner .conf-btn-submit:active,
body.page-confirmation .conf-btn-submit:active {
  transform: translateY(0) !important;
}

/* Viva footer : blanc 40% lisible (joue rôle secure-badge) */
body.page-confirmation .summary-inner .conf-viva-footer,
body.page-confirmation .conf-viva-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  color: rgba(255, 255, 255, 0.4) !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  padding-top: 10px !important;
  margin-top: 10px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* === L4.5 Confirmation eyebrow récap PC (cohérent livraison) === */

body.page-confirmation .summary-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
}
body.page-confirmation .summary-eyebrow-line {
  display: inline-block;
  width: 16px;
  height: 1px;
  background: #c9a96e;
}
body.page-confirmation .summary-eyebrow-text {
  color: #c9a96e;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 3px;
  text-transform: uppercase;
}

/* === L4.6 Confirmation séparateurs losange mobile === */

body.page-confirmation .conf-separator {
  display: none;
}

@media (max-width: 768px) {
  body.page-confirmation .conf-separator {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 18px 16px;
  }
  body.page-confirmation .conf-separator-line {
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(201, 169, 110, 0.3), transparent);
  }
  body.page-confirmation .conf-separator-diamond {
    width: 5px;
    height: 5px;
    background: #c9a96e;
    transform: rotate(45deg);
    flex-shrink: 0;
  }
}

/* === Sub-fix UX bouton tampons : style désactivé si panier 100% promo === */
body:has(#cart-page) .cart-tampons-box.cart-tampons-box-blocked {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}
body:has(#cart-page) .cart-tampons-box.cart-tampons-box-blocked input[type="checkbox"] {
  cursor: not-allowed;
}
body:has(#cart-page) .cart-tampons-box.cart-tampons-box-blocked span {
  color: rgba(255, 255, 255, 0.5);
  font-style: italic;
}

/* ==========================================
   Chantier 1 Suivi commande — 16/05/2026
   Tout scopé via [data-tab-section="commandes"] pour zéro régression
   ========================================== */
.compte-section[data-tab-section="commandes"] { position: relative; }
/* Fond crème de l'onglet Commandes (comme le Profil v9.68) */
.compte-layout:has([data-tab-section="commandes"].active) > main { background: #efe9dc; }
.compte-mobile-body:has([data-tab-section="commandes"].active) { background: #efe9dc; }
.compte-section[data-tab-section="commandes"] .mc-wrap { position: relative; padding-top: 12px; }
.compte-section[data-tab-section="commandes"] .mc-header {
  position: relative; display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 22px; min-height: 36px;
}
/* Mobile : en-tête de page retiré, refresh seul conservé (aligné à droite) */
.compte-section[data-tab-section="commandes"] .mc-header--mobile {
  justify-content: flex-end; margin-bottom: 14px; min-height: 0;
}
/* En-tête de page + séparateur (finitions) */
.compte-section[data-tab-section="commandes"] .mc-page-tag {
  font-family: 'Manrope', system-ui, sans-serif; font-size: 9px; letter-spacing: 4px; text-transform: uppercase; color: #8a6f3f; margin-bottom: 8px;
}
.compte-section[data-tab-section="commandes"] .mc-page-title {
  font-family: 'Libre Baskerville', Georgia, serif; font-size: 2rem; color: #0f2218; font-weight: 400; margin: 0 0 4px 0; line-height: 1.1;
}
.compte-section[data-tab-section="commandes"] .mc-page-sub {
  font-family: 'Manrope', system-ui, sans-serif; font-size: 0.82rem; color: #7a7565; margin: 0;
}
.compte-section[data-tab-section="commandes"] .mc-sep {
  border-bottom: 1px solid #ece5d4; margin-bottom: 20px;
}
@media (max-width: 768px) {
  .compte-section[data-tab-section="commandes"] .mc-page-title { font-size: 1.6rem; }
}

/* Bouton refresh top-right */
.compte-section[data-tab-section="commandes"] .mc-refresh {
  background: transparent; border: 1px solid rgba(201,169,110,0.4); border-radius: 50%;
  width: 36px; height: 36px; display: flex; align-items: center; justify-content: center;
  color: #c9a96e; cursor: pointer; transition: transform .4s ease, background .2s;
}
.compte-section[data-tab-section="commandes"] .mc-refresh:hover { background: rgba(201,169,110,0.08); }
.compte-section[data-tab-section="commandes"] .mc-refresh--spinning { transform: rotate(360deg); }

/* Switcher onglets commandes (si plusieurs) */
.compte-section[data-tab-section="commandes"] .mc-switcher {
  display: flex; gap: 8px; overflow-x: auto; -webkit-overflow-scrolling: touch;
  padding-bottom: 10px; margin-bottom: 12px; scrollbar-width: thin;
}
.compte-section[data-tab-section="commandes"] .mc-tab {
  flex-shrink: 0; padding: 9px 15px; background: #fbf8f1; border: 1px solid #cfc7b2;
  border-radius: 20px; font-family: 'Manrope', system-ui, sans-serif; font-size: 11.5px; font-weight: 800;
  letter-spacing: 0.5px; color: #4a5247; cursor: pointer; transition: all .15s;
}
.compte-section[data-tab-section="commandes"] .mc-tab:hover { border-color: #c9a96e; }
.compte-section[data-tab-section="commandes"] .mc-tab.active {
  background: #0f2218; color: #f5f0e6; border-color: #0f2218;
}

/* ── 2 colonnes PC (Lot 2c) : liste maître (gauche) + détail (droite) ── */
/* Grille FLUIDE (pas de media-query viewport : largeur du conteneur non-monotone).
   minmax(0,...) des deux côtés = anti-débordement horizontal. */
.compte-section[data-tab-section="commandes"] .mc-cols {
  display: grid; grid-template-columns: minmax(0, 260px) minmax(0, 1fr); gap: 24px; align-items: start;
}
.compte-section[data-tab-section="commandes"] .mc-detail { min-width: 0; }
.compte-section[data-tab-section="commandes"] .mc-list {
  display: flex; flex-direction: column; gap: 10px; min-width: 0;
}
.compte-section[data-tab-section="commandes"] .mc-item {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  width: 100%; text-align: left; padding: 14px 16px;
  background: #fbf8f1; border: 1px solid #cfc7b2; border-radius: 14px;
  font-family: 'Manrope', system-ui, sans-serif; cursor: pointer;
  transition: border-color .15s, box-shadow .15s;
}
.compte-section[data-tab-section="commandes"] .mc-item:hover { border-color: #c9a96e; }
.compte-section[data-tab-section="commandes"] .mc-item.active {
  border-color: #0f2218; box-shadow: 0 6px 18px rgba(15,34,24,0.08);
}
.compte-section[data-tab-section="commandes"] .mc-item-l {
  display: flex; flex-direction: column; gap: 4px; min-width: 0;
}
.compte-section[data-tab-section="commandes"] .mc-item-id {
  font-family: 'Libre Baskerville', Georgia, serif; font-size: 0.95rem; color: #0f2218;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.compte-section[data-tab-section="commandes"] .mc-item-meta {
  font-family: 'Manrope', system-ui, sans-serif; font-size: 0.68rem; color: #7a7565;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.compte-section[data-tab-section="commandes"] .mc-item-r {
  display: flex; flex-direction: column; align-items: flex-end; gap: 6px; flex: none;
}
.compte-section[data-tab-section="commandes"] .mc-item-r .mc-badge { margin-top: 0; }
.compte-section[data-tab-section="commandes"] .mc-item-total {
  font-family: 'Libre Baskerville', Georgia, serif; font-size: 0.9rem; color: #8a6f3f;
}
/* Repli 1 colonne dans les zones étroites (container query sur le wrap PC seul, pas le viewport) */
.compte-section[data-tab-section="commandes"] #mc-pc-wrap.mc-wrap { container-type: inline-size; }
@container (max-width: 560px) {
  .compte-section[data-tab-section="commandes"] .mc-cols { grid-template-columns: 1fr; }
}

/* Carte commande */
.compte-section[data-tab-section="commandes"] .mc-card {
  background: #fbf8f1; border: 1px solid rgba(201,169,110,0.22); border-radius: 16px;
  padding: 26px 30px 28px; box-shadow: 0 12px 30px rgba(15,34,24,0.09);
  position: relative; overflow: hidden;
}
.compte-section[data-tab-section="commandes"] .mc-card::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, transparent, #c9a96e, transparent);
}
.compte-section[data-tab-section="commandes"] .mc-card-head {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 4px;
}
.compte-section[data-tab-section="commandes"] .mc-card-headmain {
  display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap;
}
.compte-section[data-tab-section="commandes"] .mc-badge {
  flex: none; font-family: 'Manrope', system-ui, sans-serif; font-size: 9px; font-weight: 800;
  letter-spacing: 0.14em; text-transform: uppercase; padding: 5px 11px; border-radius: 12px; margin-top: 4px; white-space: nowrap;
}
.compte-section[data-tab-section="commandes"] .mc-badge--ship { background: rgba(201,169,110,0.18); color: #8a6f3f; }
.compte-section[data-tab-section="commandes"] .mc-badge--done { background: rgba(27,67,50,0.10); color: #1b4332; }
.compte-section[data-tab-section="commandes"] .mc-badge--prep { background: rgba(201,169,110,0.12); color: #8a6f3f; }
.compte-section[data-tab-section="commandes"] .mc-badge--wait { background: rgba(122,117,101,0.14); color: #7a7565; }
.compte-section[data-tab-section="commandes"] .mc-badge--cancel { background: rgba(139,37,0,0.10); color: #8b2500; }
.compte-section[data-tab-section="commandes"] .mc-card-id {
  font-family: 'Libre Baskerville', Georgia, serif; font-size: 1.4rem; color: #0f2218; font-weight: 400;
}
.compte-section[data-tab-section="commandes"] .mc-card-total {
  font-family: 'Libre Baskerville', Georgia, serif; font-size: 1.2rem; color: #8a6f3f;
}
.compte-section[data-tab-section="commandes"] .mc-card-meta {
  font-family: 'Manrope', system-ui, sans-serif; font-size: 0.78rem; color: #7a7565; margin-bottom: 24px;
}

/* Vignettes produits (Lot 2b) — look maquette .co-thumb */
/* Repli des produits (details natif — replié par défaut, zéro JS) */
.compte-section[data-tab-section="commandes"] .mc-thumbs-details { margin-bottom: 4px; }
.compte-section[data-tab-section="commandes"] .mc-thumbs-toggle {
  display: flex; align-items: center; gap: 9px; cursor: pointer; padding: 2px 0 14px;
  font-family: 'Manrope', system-ui, sans-serif; font-size: 10px; font-weight: 800;
  letter-spacing: 0.18em; text-transform: uppercase; color: #8a6f3f; list-style: none;
}
.compte-section[data-tab-section="commandes"] .mc-thumbs-toggle::-webkit-details-marker { display: none; }
/* Vrai chevron vectoriel (SVG) centré dans le badge — crisp à tout DPI, pivote à l'ouverture */
.compte-section[data-tab-section="commandes"] .mc-thumbs-toggle::before {
  content: ""; flex: none; width: 20px; height: 20px; border-radius: 50%; border: 1px solid #cfc7b2;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none' stroke='%238a6f3f' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='2.5,4 5,6.5 7.5,4'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: center; background-size: 9px 9px;
  transition: transform .25s, border-color .2s;
}
.compte-section[data-tab-section="commandes"] .mc-thumbs-toggle:hover::before { border-color: #c9a96e; }
.compte-section[data-tab-section="commandes"] .mc-thumbs-details[open] > .mc-thumbs-toggle::before { transform: rotate(180deg); }
.compte-section[data-tab-section="commandes"] .mc-thumbs {
  display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 8px;
}
.compte-section[data-tab-section="commandes"] .mc-thumb { width: 84px; flex: none; }
.compte-section[data-tab-section="commandes"] .mc-thumb-im {
  width: 84px; height: 84px; border-radius: 12px; overflow: hidden; position: relative;
  background: linear-gradient(150deg, #1d4230, #0f2218);
}
.compte-section[data-tab-section="commandes"] .mc-thumb-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.compte-section[data-tab-section="commandes"] .mc-thumb-init {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-family: 'Libre Baskerville', Georgia, serif; font-style: italic; font-size: 24px; color: rgba(201,169,110,0.75);
}
.compte-section[data-tab-section="commandes"] .mc-thumb-nm {
  display: block; font-family: 'Manrope', system-ui, sans-serif; font-size: 10.5px; font-weight: 700;
  color: #4a5247; margin-top: 7px; line-height: 1.35; text-align: center;
}
.compte-section[data-tab-section="commandes"] .mc-thumb-qt {
  display: block; font-family: 'Manrope', system-ui, sans-serif; font-size: 9.5px; color: #9a927e; text-align: center;
}
@media (max-width: 768px) {
  .compte-section[data-tab-section="commandes"] .mc-thumb,
  .compte-section[data-tab-section="commandes"] .mc-thumb-im { width: 76px; }
  .compte-section[data-tab-section="commandes"] .mc-thumb-im { height: 76px; }
}

/* Timeline verticale */
.compte-section[data-tab-section="commandes"] .mc-tl { position: relative; padding-left: 36px; }
.compte-section[data-tab-section="commandes"] .mc-tl::before {
  content: ''; position: absolute; left: 11px; top: 12px; bottom: 12px;
  width: 2px; background: #e0d8c4;
}
.compte-section[data-tab-section="commandes"] .mc-step { position: relative; padding-bottom: 22px; min-height: 30px; }
.compte-section[data-tab-section="commandes"] .mc-step:last-child { padding-bottom: 0; }
.compte-section[data-tab-section="commandes"] .mc-step-dot {
  position: absolute; left: -36px; top: 0; width: 24px; height: 24px;
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  z-index: 1; transition: all .2s;
}
.compte-section[data-tab-section="commandes"] .mc-step--done .mc-step-dot { background: #0f2218; color: #f5f0e6; }
.compte-section[data-tab-section="commandes"] .mc-step--active .mc-step-dot {
  background: #c9a96e; box-shadow: 0 0 0 0 rgba(201,169,110,0.6);
  animation: mc-pulse 1.6s ease-in-out infinite;
}
.compte-section[data-tab-section="commandes"] .mc-step--pending .mc-step-dot {
  background: #efe9dc; border: 2px solid #d5cdb8;
}
.compte-section[data-tab-section="commandes"] .mc-step-pulse {
  width: 10px; height: 10px; border-radius: 50%; background: #fff;
}
@keyframes mc-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(201,169,110,0.6); }
  50% { box-shadow: 0 0 0 10px rgba(201,169,110,0); }
}

.compte-section[data-tab-section="commandes"] .mc-step-label {
  font-family: 'Libre Baskerville', Georgia, serif; font-size: 1rem; color: #0f2218; line-height: 1.2;
}
.compte-section[data-tab-section="commandes"] .mc-step--pending .mc-step-label { color: #9a927e; }
.compte-section[data-tab-section="commandes"] .mc-step-date {
  font-family: 'Manrope', system-ui, sans-serif; font-size: 0.75rem; color: #9a927e; margin-top: 2px;
}

/* Bouton suivre La Poste */
.compte-section[data-tab-section="commandes"] .mc-track-btn {
  display: inline-block; margin-top: 8px; padding: 9px 16px;
  background: #0f2218; color: #f5f0e6; border-radius: 20px;
  font-family: 'Manrope', system-ui, sans-serif; font-size: 0.72rem; font-weight: 800;
  letter-spacing: 0.6px; text-transform: uppercase; text-decoration: none;
  transition: background .15s;
}
.compte-section[data-tab-section="commandes"] .mc-track-btn:hover { background: #1b4332; }

/* Facture (feat/facture-acces) — affichée uniquement sur commande payée.
   Ouvre la modale iframe #hi-inv-frame via la délégation [data-facture-url]
   partagée avec l'historique. Même gabarit visuel que les boutons historique. */
.compte-section[data-tab-section="commandes"] .mc-facture {
  display: flex; gap: 10px; flex-wrap: wrap; margin-top: 20px; padding-top: 18px;
  border-top: 1px solid rgba(201,169,110,0.22);
}
.compte-section[data-tab-section="commandes"] .mc-facture-btn {
  display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px;
  background: #0f2218; color: #f5f0e6; border: 1.5px solid #0f2218; border-radius: 20px;
  font-family: 'Manrope', system-ui, sans-serif; font-size: 0.72rem; font-weight: 800;
  letter-spacing: 0.6px; text-transform: uppercase; cursor: pointer; transition: background .15s;
}
.compte-section[data-tab-section="commandes"] .mc-facture-btn:hover { background: #1b4332; border-color: #1b4332; }
.compte-section[data-tab-section="commandes"] .mc-facture-btn--ghost { background: transparent; color: #0f2218; }
.compte-section[data-tab-section="commandes"] .mc-facture-btn--ghost:hover { background: rgba(15,34,24,0.05); }
.compte-section[data-tab-section="commandes"] .mc-facture-btn svg { width: 13px; height: 13px; flex: none; }
.compte-section[data-tab-section="commandes"] .mc-facture-btn svg * { fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.compte-section[data-tab-section="commandes"] .mc-facture-btn:not(.mc-facture-btn--ghost) svg * { stroke: #c9a96e; }

/* Adresse + horaires retrait */
.compte-section[data-tab-section="commandes"] .mc-pickup-addr {
  margin-top: 10px; padding: 12px 16px; background: rgba(201,169,110,0.12);
  border-radius: 0 8px 8px 0; font-family: 'Manrope', system-ui, sans-serif; font-size: 0.82rem; color: #0f2218;
  border-left: 3px solid #c9a96e;
}
.compte-section[data-tab-section="commandes"] .mc-pickup-hours {
  display: block; margin-top: 4px; font-size: 0.72rem; color: #9a927e;
}

/* État vide */
.compte-section[data-tab-section="commandes"] .mc-empty {
  text-align: center; padding: 60px 20px;
  background: #fbf8f1; border: 1px dashed rgba(201,169,110,0.4); border-radius: 16px;
}
.compte-section[data-tab-section="commandes"] .mc-empty-ico { margin-bottom: 16px; opacity: 0.6; }
.compte-section[data-tab-section="commandes"] .mc-empty-title {
  font-family: 'Libre Baskerville', Georgia, serif; font-size: 1.15rem; color: #0f2218; margin-bottom: 16px;
}
.compte-section[data-tab-section="commandes"] .mc-empty-cta {
  display: inline-block; padding: 10px 24px; background: #0f2218; color: #f5f0e6;
  border-radius: 20px; font-family: 'Manrope', system-ui, sans-serif; font-size: 0.75rem; font-weight: 800;
  letter-spacing: 0.8px; text-transform: uppercase; text-decoration: none;
}
.compte-section[data-tab-section="commandes"] .mc-empty-cta:hover { background: #1b4332; }

/* Responsive mobile (≤ 768px) */
@media (max-width: 768px) {
  /* FIX 1 — débordement horizontal : .compte-mobile-body est un grid item (min-width:auto par
     défaut) que le switcher gonfle ; min-width:0 le laisse rétrécir au viewport, puis le
     switcher (overflow-x:auto) scrolle en interne. Scopé commandes via :has (cf. L10285). */
  .compte-mobile-body:has([data-tab-section="commandes"].active) { min-width: 0; }

  /* FIX 2 — vide en haut : contenu remonté, refresh flotté en haut-droite (plus de ligne vide ~62px).
     Le refresh occupe une "voie" de 44px à droite que le contenu réserve par une MARGE (pas un
     padding intérieur) : le switcher s'arrête avant le refresh → aucun onglet ne passe dessous
     (sinon le bouton, z-index:2, intercepterait le tap). */
  .compte-section[data-tab-section="commandes"] .mc-wrap { padding-top: 0; }
  .compte-section[data-tab-section="commandes"] .mc-header--mobile {
    position: absolute; top: 0; right: 0; margin: 0; min-height: 0; z-index: 2;
  }
  .compte-section[data-tab-section="commandes"] .mc-switcher { margin-right: 44px; }

  /* FIX 3 — fidélité maquette mobile (.pf.m : padding 20/24, id ~20px, thumbs gap 10) */
  .compte-section[data-tab-section="commandes"] .mc-card { padding: 20px 20px 24px; border-radius: 12px; }
  .compte-section[data-tab-section="commandes"] .mc-card-id { font-size: 1.25rem; }
  .compte-section[data-tab-section="commandes"] .mc-thumbs { gap: 10px; }

  /* Existant conservé + garde anti-chevauchement du refresh sur l'en-tête de carte (cas 1 commande) */
  .compte-section[data-tab-section="commandes"] .mc-card-head { flex-direction: column; gap: 4px; padding-right: 44px; }
  .compte-section[data-tab-section="commandes"] .mc-tl { padding-left: 32px; }
  .compte-section[data-tab-section="commandes"] .mc-step-dot { left: -32px; width: 22px; height: 22px; }
  .compte-section[data-tab-section="commandes"] .mc-step-label { font-size: 0.92rem; }
  .compte-section[data-tab-section="commandes"] .mc-pickup-addr { font-size: 0.78rem; }
  .compte-section[data-tab-section="commandes"] .mc-facture-btn { padding: 9px 14px; font-size: 0.68rem; }
}

/* ═══════════════════════════════════════════════════════════════
   Onglet HISTORIQUE — master-détail crème (Sous-lot 1, maquette Compte 3)
   TOUT scopé [data-tab-section="historique"] ; toutes classes préfixées .hi-*
   ═══════════════════════════════════════════════════════════════ */
/* Fond crème + grid item mobile rétrécissable (leçon v9.89) */
.compte-layout:has([data-tab-section="historique"].active) > main { background: #efe9dc; }
.compte-mobile-body:has([data-tab-section="historique"].active) { background: #efe9dc; min-width: 0; }

/* En-tête PC */
.compte-section[data-tab-section="historique"] .hi-wrap { position: relative; container-type: inline-size; }
.compte-section[data-tab-section="historique"] .hi-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 18px; }
.compte-section[data-tab-section="historique"] .hi-tag { font-family: 'Manrope', system-ui, sans-serif; font-size: 9px; letter-spacing: 4px; text-transform: uppercase; color: #8a6f3f; margin-bottom: 8px; }
.compte-section[data-tab-section="historique"] .hi-title { font-family: 'Libre Baskerville', Georgia, serif; font-size: 2rem; color: #0f2218; font-weight: 400; margin: 0 0 4px 0; line-height: 1.1; }
.compte-section[data-tab-section="historique"] .hi-sub { font-family: 'Manrope', system-ui, sans-serif; font-size: 0.82rem; color: #7a7565; margin: 0; }
.compte-section[data-tab-section="historique"] .hi-head-r { display: flex; align-items: baseline; gap: 8px; flex: none; }
.compte-section[data-tab-section="historique"] .hi-count { font-family: 'Libre Baskerville', Georgia, serif; font-size: 1.9rem; color: #8a6f3f; }
.compte-section[data-tab-section="historique"] .hi-count-lbl { font-family: 'Manrope', system-ui, sans-serif; font-size: 10px; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; color: #9a927e; }

/* Grille master-détail (fluide + repli 1 colonne via container query) */
.compte-section[data-tab-section="historique"] .hi-cols { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 22px; align-items: start; }
@container (max-width: 620px) {
  .compte-section[data-tab-section="historique"] .hi-cols { grid-template-columns: 1fr; }
}

/* Liste gauche */
.compte-section[data-tab-section="historique"] .hi-list { display: flex; flex-direction: column; gap: 9px; min-width: 0; }
.compte-section[data-tab-section="historique"] .hi-month { font-family: 'Manrope', system-ui, sans-serif; font-size: 9.5px; font-weight: 800; letter-spacing: 0.2em; text-transform: uppercase; color: #9a927e; padding: 8px 2px 2px; display: flex; align-items: center; gap: 10px; }
.compte-section[data-tab-section="historique"] .hi-month::after { content: ""; flex: 1; height: 1px; background: #ddd6c4; }
.compte-section[data-tab-section="historique"] .hi-item { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; background: #fbf8f1; border: 1.5px solid transparent; border-radius: 13px; padding: 13px 16px; cursor: pointer; box-shadow: 0 6px 16px rgba(15,34,24,0.05); font-family: 'Manrope', system-ui, sans-serif; transition: border-color .15s, transform .15s; }
.compte-section[data-tab-section="historique"] .hi-item:hover { transform: translateX(3px); }
.compte-section[data-tab-section="historique"] .hi-item.hi-on { border-color: #0f2218; }
.compte-section[data-tab-section="historique"] .hi-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.compte-section[data-tab-section="historique"] .hi-dot.hi-transit { background: #c9a96e; }
.compte-section[data-tab-section="historique"] .hi-dot.hi-prep { background: #8a6f3f; }
.compte-section[data-tab-section="historique"] .hi-dot.hi-done { background: #1b4332; }
.compte-section[data-tab-section="historique"] .hi-dot.hi-livree { background: #0f2218; } /* Lot 2 livrée — palette --delivered facture */
.compte-section[data-tab-section="historique"] .hi-dot.hi-cancel { background: #c25b43; }
.compte-section[data-tab-section="historique"] .hi-il { flex: 1; min-width: 0; }
.compte-section[data-tab-section="historique"] .hi-il b { display: block; font-family: 'Libre Baskerville', Georgia, serif; font-size: 14px; color: #0f2218; font-weight: 400; }
.compte-section[data-tab-section="historique"] .hi-il span { display: block; font-size: 10.5px; color: #9a927e; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.compte-section[data-tab-section="historique"] .hi-ir { text-align: right; flex: none; }
.compte-section[data-tab-section="historique"] .hi-ir b { display: block; font-family: 'Libre Baskerville', Georgia, serif; font-size: 13.5px; color: #8a6f3f; }
.compte-section[data-tab-section="historique"] .hi-ir span { font-size: 9.5px; color: #9a927e; }
.compte-section[data-tab-section="historique"] .hi-item.hi-cancel .hi-ir b { color: #c25b43; }

/* Détail droite */
.compte-section[data-tab-section="historique"] .hi-det { background: #fbf8f1; border-radius: 16px; box-shadow: 0 12px 30px rgba(15,34,24,0.09); overflow: hidden; min-width: 0; }
.compte-section[data-tab-section="historique"] .hi-rule { height: 3px; background: linear-gradient(90deg, transparent, #c9a96e, transparent); }
.compte-section[data-tab-section="historique"] .hi-in { padding: 24px 28px 26px; }
.compte-section[data-tab-section="historique"] .hi-hd { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.compte-section[data-tab-section="historique"] .hi-h3 { font-family: 'Libre Baskerville', Georgia, serif; font-size: 1.4rem; color: #0f2218; font-weight: 400; }
.compte-section[data-tab-section="historique"] .hi-dt { font-family: 'Manrope', system-ui, sans-serif; font-size: 11.5px; color: #9a927e; margin-top: 3px; }
.compte-section[data-tab-section="historique"] .hi-badge { flex: none; font-family: 'Manrope', system-ui, sans-serif; font-size: 9px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; padding: 5px 11px; border-radius: 12px; margin-top: 4px; white-space: nowrap; }
.compte-section[data-tab-section="historique"] .hi-badge.hi-transit { background: rgba(201,169,110,0.18); color: #8a6f3f; }
.compte-section[data-tab-section="historique"] .hi-badge.hi-prep { background: rgba(201,169,110,0.12); color: #8a6f3f; }
.compte-section[data-tab-section="historique"] .hi-badge.hi-done { background: rgba(27,67,50,0.10); color: #1b4332; }
.compte-section[data-tab-section="historique"] .hi-badge.hi-livree { background: rgba(27,67,50,0.14); color: #0f2218; } /* Lot 2 livrée — palette --delivered facture */
.compte-section[data-tab-section="historique"] .hi-badge.hi-cancel { background: rgba(194,91,67,0.13); color: #c25b43; }

/* Articles (vignette = initiale, PAS de photo dans ce sous-lot) */
.compte-section[data-tab-section="historique"] .hi-arts { margin-top: 18px; display: flex; flex-direction: column; }
.compte-section[data-tab-section="historique"] .hi-art { display: flex; align-items: center; gap: 16px; padding: 14px 0; border-top: 1px solid #ece5d4; }
.compte-section[data-tab-section="historique"] .hi-im { width: 64px; height: 64px; border-radius: 11px; overflow: hidden; flex: none; position: relative; background: linear-gradient(150deg, #1d4230, #0f2218); }
.compte-section[data-tab-section="historique"] .hi-init { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: 'Libre Baskerville', Georgia, serif; font-style: italic; font-size: 22px; color: rgba(201,169,110,0.75); }
.compte-section[data-tab-section="historique"] .hi-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.compte-section[data-tab-section="historique"] .hi-tx { flex: 1; min-width: 0; }
.compte-section[data-tab-section="historique"] .hi-tx b { display: block; font-family: 'Manrope', system-ui, sans-serif; font-size: 13px; font-weight: 800; color: #0f2218; }
.compte-section[data-tab-section="historique"] .hi-fmt { display: block; font-family: 'Manrope', system-ui, sans-serif; font-size: 10.5px; color: #9a927e; margin-top: 2px; }
.compte-section[data-tab-section="historique"] .hi-pu { flex: none; text-align: right; font-family: 'Manrope', system-ui, sans-serif; font-size: 11.5px; color: #7a7565; line-height: 1.55; }
.compte-section[data-tab-section="historique"] .hi-pu b { display: block; font-family: 'Libre Baskerville', Georgia, serif; font-size: 14px; color: #0f2218; }
/* Bouton « Recommander » (Sous-lot 4) — scopé historique (.hi-re, pas .re nue) */
.compte-section[data-tab-section="historique"] .hi-re { flex: none; display: inline-flex; align-items: center; gap: 7px; background: #0f2218; color: #f5f0e6; border: none; border-radius: 18px; padding: 8px 15px; font-family: 'Manrope', system-ui, sans-serif; font-size: 9.5px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; cursor: pointer; transition: background .15s; }
.compte-section[data-tab-section="historique"] .hi-re:hover { background: #1b4332; }
.compte-section[data-tab-section="historique"] .hi-re--ok { background: #1b4332; pointer-events: none; }
.compte-section[data-tab-section="historique"] .hi-re svg { width: 11px; height: 11px; flex: none; }
.compte-section[data-tab-section="historique"] .hi-re svg path { fill: none; stroke: #c9a96e; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }

/* Récap + notes */
.compte-section[data-tab-section="historique"] .hi-rec { border-top: 1px solid #ece5d4; padding-top: 14px; margin-top: 2px; display: flex; justify-content: flex-end; }
.compte-section[data-tab-section="historique"] .hi-rec table { font-family: 'Manrope', system-ui, sans-serif; font-size: 12px; color: #7a7565; border-collapse: collapse; }
.compte-section[data-tab-section="historique"] .hi-rec td { padding: 3px 0 3px 34px; text-align: right; }
.compte-section[data-tab-section="historique"] .hi-rec tr.hi-tot td { font-family: 'Libre Baskerville', Georgia, serif; font-size: 16px; color: #0f2218; padding-top: 8px; }
.compte-section[data-tab-section="historique"] .hi-tamp { margin-top: 14px; border: 1.5px dashed #c9a96e; background: rgba(201,169,110,0.07); border-radius: 10px; padding: 10px 16px; font-family: 'Manrope', system-ui, sans-serif; font-size: 12px; color: #5a5345; text-align: center; }
.compte-section[data-tab-section="historique"] .hi-tamp b { color: #8a6f3f; }
.compte-section[data-tab-section="historique"] .hi-cnote { margin-top: 14px; border-left: 3px solid #c25b43; background: rgba(194,91,67,0.08); border-radius: 0 8px 8px 0; padding: 10px 14px; font-family: 'Manrope', system-ui, sans-serif; font-size: 12px; font-style: italic; color: #8a4a3a; }

/* Actions bas */
.compte-section[data-tab-section="historique"] .hi-acts { display: flex; gap: 10px; margin-top: 18px; padding-top: 16px; border-top: 1px solid #ece5d4; flex-wrap: wrap; align-items: center; }
.compte-section[data-tab-section="historique"] .hi-btn { display: inline-flex; align-items: center; gap: 9px; border-radius: 20px; padding: 10px 18px; font-family: 'Manrope', system-ui, sans-serif; font-size: 10px; font-weight: 800; letter-spacing: 0.15em; text-transform: uppercase; border: 1.5px solid #0f2218; background: transparent; color: #0f2218; text-decoration: none; transition: background .15s; }
.compte-section[data-tab-section="historique"] .hi-btn:hover { background: rgba(15,34,24,0.05); }
.compte-section[data-tab-section="historique"] .hi-btn.hi-pri { background: #0f2218; color: #f5f0e6; }
.compte-section[data-tab-section="historique"] .hi-btn.hi-pri:hover { background: #1b4332; }
.compte-section[data-tab-section="historique"] .hi-track { margin-left: auto; font-family: 'Manrope', system-ui, sans-serif; font-size: 10px; font-weight: 800; letter-spacing: 0.15em; text-transform: uppercase; color: #0f2218; text-decoration: none; border-bottom: 1.5px solid #0f2218; padding-bottom: 2px; }

/* État vide */
.compte-section[data-tab-section="historique"] .hi-empty { text-align: center; padding: 40px 20px; }
.compte-section[data-tab-section="historique"] .hi-empty-t { font-family: 'Libre Baskerville', Georgia, serif; font-size: 1.1rem; color: #0f2218; margin-bottom: 8px; }
.compte-section[data-tab-section="historique"] .hi-empty-s { font-family: 'Manrope', system-ui, sans-serif; font-size: 0.82rem; color: #9a927e; }

/* ── Mobile : en-tête + accordéon <details> ── */
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-mhead { margin-bottom: 12px; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-count { font-size: 1rem; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-msub { font-family: 'Manrope', system-ui, sans-serif; font-size: 0.82rem; color: #7a7565; margin: 0; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-mlist { display: flex; flex-direction: column; gap: 11px; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-card { background: #fbf8f1; border-radius: 14px; box-shadow: 0 8px 20px rgba(15,34,24,0.07); overflow: hidden; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-crow { display: flex; align-items: center; gap: 11px; padding: 15px 16px; cursor: pointer; list-style: none; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-crow::-webkit-details-marker { display: none; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-cl { flex: 1; min-width: 0; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-cl b { display: block; font-family: 'Libre Baskerville', Georgia, serif; font-size: 14.5px; color: #0f2218; font-weight: 400; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-cl span { display: block; font-family: 'Manrope', system-ui, sans-serif; font-size: 10.5px; color: #9a927e; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-cpr { font-family: 'Libre Baskerville', Georgia, serif; font-size: 14px; color: #8a6f3f; flex: none; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-card.hi-cancel .hi-cpr { color: #c25b43; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-chev { width: 22px; height: 22px; border-radius: 50%; border: 1px solid #cfc7b2; flex: none; background: no-repeat center / 9px 9px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none' stroke='%238a6f3f' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='2.5,4 5,6.5 7.5,4'/%3E%3C/svg%3E"); transition: transform .25s; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-card[open] .hi-chev { transform: rotate(180deg); }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-cbody { padding: 2px 16px 18px; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-arts { margin-top: 0; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-art { gap: 12px; padding: 12px 0; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-im { width: 54px; height: 54px; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-pu { display: none; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-acts { margin-top: 12px; padding-top: 14px; gap: 8px; }
.compte-mobile-body .compte-section[data-tab-section="historique"] .hi-btn { padding: 9px 14px; font-size: 9.5px; }

/* ── Filtres Historique (Sous-lot 2) — scopés, wrap anti-débordement ── */
.compte-section[data-tab-section="historique"] .hi-filters { margin-bottom: 14px; }
.compte-section[data-tab-section="historique"] .hi-filters-in { display: flex; flex-wrap: wrap; gap: 8px; }
.compte-section[data-tab-section="historique"] .hi-fil {
  border: 1px solid #cfc7b2; background: #fbf8f1; color: #4a5247; border-radius: 18px;
  padding: 7px 14px; font-family: 'Manrope', system-ui, sans-serif; font-size: 10.5px; font-weight: 800;
  letter-spacing: 0.08em; text-transform: uppercase; cursor: pointer; transition: border-color .15s, background .15s;
}
.compte-section[data-tab-section="historique"] .hi-fil:hover { border-color: #c9a96e; }
.compte-section[data-tab-section="historique"] .hi-fil.hi-on { background: #0f2218; border-color: #0f2218; color: #f5f0e6; }
.compte-section[data-tab-section="historique"] .hi-ct { opacity: 0.55; margin-left: 4px; }
/* « Livrées » grisé/inactif — préparé pour le futur câblage du statut « livrée » */
.compte-section[data-tab-section="historique"] .hi-fil--disabled { opacity: 0.4; cursor: default; }
.compte-section[data-tab-section="historique"] .hi-fil--disabled:hover { border-color: #cfc7b2; }

/* Icônes des boutons facture (Facture-b) */
.compte-section[data-tab-section="historique"] .hi-btn svg { width: 13px; height: 13px; flex: none; }
.compte-section[data-tab-section="historique"] .hi-btn svg * { fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.compte-section[data-tab-section="historique"] .hi-btn.hi-pri svg * { stroke: #c9a96e; }

/* ── Modale facture (Facture-b) — niveau PAGE (position:fixed), préfixe .hi-inv-* ── */
.hi-inv-ov { position: fixed; inset: 0; z-index: 1000; display: none; align-items: flex-start; justify-content: center; padding: 30px; background: rgba(10,24,16,0.6); overflow: auto; }
.hi-inv-ov.hi-inv-ov--open { display: flex; }
.hi-inv-sheet { width: 100%; max-width: 720px; background: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 34px 80px rgba(0,0,0,0.45); display: flex; flex-direction: column; max-height: calc(100vh - 60px); }
.hi-inv-bar { display: flex; justify-content: flex-end; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid #ece5d4; background: #fbf8f1; flex: none; }
.hi-inv-x { width: 34px; height: 34px; border-radius: 50%; border: 1px solid #cfc7b2; background: #fff; color: #0f2218; font-size: 15px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; flex: none; transition: border-color .15s; }
.hi-inv-x:hover { border-color: #c9a96e; }
.hi-inv-frame { width: 100%; border: none; flex: 1 1 auto; min-height: 60vh; background: #fff; }
/* PC/tablette (≥601px) : modale généreuse — largeur pour une facture A4 (~800px) sans scroll
   horizontal + hauteur pleine (le sheet a une VRAIE hauteur → l'iframe flex:1 remplit ~88vh).
   Le mobile (≤600px, plein écran) n'est PAS concerné (media query mutuellement exclusive). */
@media (min-width: 601px) {
  .hi-inv-ov { padding: 24px; }
  .hi-inv-sheet { max-width: 900px; height: calc(100vh - 48px); max-height: calc(100vh - 48px); }
}
@media (max-width: 600px) {
  .hi-inv-ov { padding: 0; }
  .hi-inv-sheet { max-width: 100%; height: 100vh; max-height: 100vh; border-radius: 0; }
}

/* ═══════════════════════════════════════════════════════════════
   ONGLET ADRESSES — restyle crème 2 colonnes MONO (Lot A)
   Tout scopé [data-tab-section="adresses"] (collisions .top/.rule/.field/.k
   + neutralisation du .act-head/.act-body/.act-ico de base). Multi = lot suivant.
   ═══════════════════════════════════════════════════════════════ */
/* Fond crème (aligné profil/commandes/historique) */
.compte-layout:has([data-tab-section="adresses"].active) > main { background: #efe9dc; }
.compte-mobile-body:has([data-tab-section="adresses"].active) { background: #efe9dc; min-width: 0; }

/* En-tête de page PC (kicker + titre + sous-titre) — look aligné sur les autres onglets.
   PC-only : présent uniquement dans la section PC de compte.html (la section mobile n'a pas de .ad-pagehead). */
[data-tab-section="adresses"] .ad-pagetag { font-family: 'Manrope', system-ui, sans-serif; font-size: 9px; letter-spacing: 4px; text-transform: uppercase; color: #8a6f3f; margin-bottom: 8px; }
[data-tab-section="adresses"] .ad-pagetitle { font-family: 'Libre Baskerville', Georgia, serif; font-size: 2rem; color: #0f2218; font-weight: 400; margin: 0 0 4px 0; line-height: 1.1; }
[data-tab-section="adresses"] .ad-pagesub { font-family: 'Manrope', system-ui, sans-serif; font-size: 0.82rem; color: #7a7565; margin: 0; }

/* Grille 2 colonnes (adresse | Mes informations) */
[data-tab-section="adresses"] .ad-cols { display: grid; grid-template-columns: 1.05fr 1fr; gap: 22px; align-items: start; width: 100%; }
[data-tab-section="adresses"] .ad-info { min-width: 0; }

/* Carte section crème */
[data-tab-section="adresses"] .ad-sec { background: #fbf8f1; border-radius: 16px; box-shadow: 0 12px 30px rgba(15,34,24,.09); overflow: hidden; min-width: 0; }
[data-tab-section="adresses"] .ad-rule { height: 3px; background: linear-gradient(90deg, transparent, #c9a96e, transparent); }
[data-tab-section="adresses"] .ad-in { padding: 22px 26px 24px; }
[data-tab-section="adresses"] .ad-hd { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
[data-tab-section="adresses"] .ad-hd h3 { font-family: 'Libre Baskerville', Georgia, serif; font-size: 19px; color: #0f2218; margin: 0; font-weight: 700; }
[data-tab-section="adresses"] .ad-list { display: flex; flex-direction: column; gap: 12px; }

/* Carte adresse : coquille .ad-card enveloppant les hooks .act-* (fillAddressCard inchangé).
   On neutralise le .act-head vert foncé + paddings de base. */
[data-tab-section="adresses"] .ad-card { background: #fff; border: 1.5px solid #e3dcc9; border-radius: 13px; padding: 16px 18px; position: relative; }
[data-tab-section="adresses"] .ad-card .act-head { background: transparent; padding: 0; display: flex; align-items: center; gap: 9px; margin-bottom: 6px; }
[data-tab-section="adresses"] .ad-card .act-head::after { display: none; }
[data-tab-section="adresses"] .ad-card .act-ico,
[data-tab-section="adresses"] .ad-card .act-icon { width: auto; height: auto; background: transparent; border-radius: 0; display: flex; align-items: center; justify-content: center; }
[data-tab-section="adresses"] .ad-card .act-tag { font-family: 'Manrope', system-ui, sans-serif; font-size: 9px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #8a6f3f; }
[data-tab-section="adresses"] .ad-card .act-body { padding: 0; }
[data-tab-section="adresses"] .ad-card .act-title { font-family: 'Libre Baskerville', Georgia, serif; font-size: 15.5px; font-weight: 700; color: #0f2218; margin: 0 0 4px; }
[data-tab-section="adresses"] .ad-card .act-desc { font-family: 'Manrope', system-ui, sans-serif; font-size: 12px; color: #7a7565; line-height: 1.65; }
[data-tab-section="adresses"] .ad-card .act-link { display: inline-block; margin-top: 12px; padding-bottom: 2px; font-family: 'Manrope', system-ui, sans-serif; font-size: 9.5px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; color: #0f2218; border-bottom: 1.5px solid #0f2218; cursor: pointer; transition: color .15s, border-color .15s; }
[data-tab-section="adresses"] .ad-card .act-link:hover { color: #8a6f3f; border-color: #c9a96e; }

/* Colonne droite : "Mes informations" (profile-sect injecté — inline styles, on aligne bg + marge).
   position/overflow : pour le trait doré ::before ci-dessous (même filet que .ad-rule à gauche). */
[data-tab-section="adresses"] .ad-info .profile-sect { margin-top: 0 !important; background: #fbf8f1 !important; position: relative; overflow: hidden; }
[data-tab-section="adresses"] .ad-info .profile-sect::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, transparent, #c9a96e, transparent); }

/* Responsive : 1 colonne sous 1024px (PC étroit + tout le mobile ≤768) */
@media (max-width: 1024px) {
  [data-tab-section="adresses"] .ad-cols { grid-template-columns: 1fr; }
}

/* Fix toggle "Mes informations" (onglet Adresses) : le display:flex inline des 2 vues
   a été retiré de buildProfileSectionHTML → l'attribut [hidden] pilote enfin l'affichage.
   Ici on remet display:flex UNIQUEMENT sur la vue NON hidden (flex-direction/gap restent
   inline). hidden → display:none (UA) ; non-hidden → flex. Couvre -pc et -mobile. */
[data-tab-section="adresses"] [id^="profile-display"]:not([hidden]),
[data-tab-section="adresses"] [id^="profile-form"]:not([hidden]) { display: flex; }

/* ═══════════════════════════════════════════════════════════════
   ONGLET ADRESSES — carnet multi-adresses (Lot B3)
   Cartes rendues par renderAddresses() + bouton Ajouter + formulaire.
   Classes préfixées .ad-* (jamais .tag/.top/.nm/.lk nus — collisions).
   Valeurs = maquette Compte 4. Tout scopé [data-tab-section="adresses"].
   ═══════════════════════════════════════════════════════════════ */
/* Carte adresse (multi) */
[data-tab-section="adresses"] .ad-card { background: #fff; border: 1.5px solid #e3dcc9; border-radius: 13px; padding: 16px 18px; position: relative; transition: border-color .15s; }
[data-tab-section="adresses"] .ad-card.ad-def { border-color: #0f2218; }
[data-tab-section="adresses"] .ad-tag { position: absolute; top: -9px; left: 14px; font-family: 'Manrope', system-ui, sans-serif; font-size: 8.5px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; background: #0f2218; color: #f5f0e6; border-radius: 10px; padding: 4px 10px; }
[data-tab-section="adresses"] .ad-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
[data-tab-section="adresses"] .ad-nm { display: flex; align-items: center; gap: 9px; font-family: 'Libre Baskerville', Georgia, serif; font-size: 15.5px; font-weight: 700; color: #0f2218; }
[data-tab-section="adresses"] .ad-nm svg { width: 15px; height: 15px; flex: none; }
[data-tab-section="adresses"] .ad-lines { font-family: 'Manrope', system-ui, sans-serif; font-size: 12px; color: #7a7565; line-height: 1.65; margin: 6px 0 0; }
[data-tab-section="adresses"] .ad-acts { display: flex; gap: 14px; margin-top: 12px; padding-top: 11px; border-top: 1px solid #ece5d4; }
[data-tab-section="adresses"] .ad-lk { background: none; border: none; font-family: 'Manrope', system-ui, sans-serif; font-size: 9.5px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; color: #0f2218; padding: 0 0 2px; border-bottom: 1.5px solid #0f2218; cursor: pointer; transition: color .15s, border-color .15s; }
[data-tab-section="adresses"] .ad-lk:hover { color: #8a6f3f; border-color: #c9a96e; }
[data-tab-section="adresses"] .ad-lk.ad-sup { color: #c25b43; border-color: #c25b43; margin-left: auto; }
[data-tab-section="adresses"] .ad-lk.ad-sup:hover { color: #a3402c; }
[data-tab-section="adresses"] .ad-lk[disabled] { opacity: .35; pointer-events: none; cursor: default; }
[data-tab-section="adresses"] .ad-empty { font-family: 'Manrope', system-ui, sans-serif; font-size: 12.5px; color: #7a7565; line-height: 1.6; margin: 0; }

/* Bouton « + Ajouter une adresse » (pointillé, or) */
[data-tab-section="adresses"] .ad-add { border: 1.5px dashed #cfc7b2; border-radius: 13px; padding: 15px; margin-top: 12px; display: flex; align-items: center; justify-content: center; gap: 10px; background: none; font-family: 'Manrope', system-ui, sans-serif; font-size: 10.5px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; color: #8a6f3f; width: 100%; cursor: pointer; transition: border-color .15s, background .15s; }
[data-tab-section="adresses"] .ad-add:hover { border-color: #c9a96e; background: rgba(201,169,110,.05); }
[data-tab-section="adresses"] .ad-plus { width: 22px; height: 22px; border-radius: 50%; border: 1.5px solid #c9a96e; display: flex; align-items: center; justify-content: center; font-size: 13px; color: #8a6f3f; flex: none; }

/* Formulaire d'ajout (inline, caché par défaut) */
[data-tab-section="adresses"] .ad-form { display: none; margin-top: 14px; border-top: 1px solid #ece5d4; padding-top: 16px; }
[data-tab-section="adresses"] .ad-form.open { display: block; }
[data-tab-section="adresses"] .ad-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
[data-tab-section="adresses"] .ad-grid .ad-full { grid-column: 1 / -1; }
[data-tab-section="adresses"] .ad-field label { display: block; font-family: 'Manrope', system-ui, sans-serif; font-size: 9.5px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #8a6f3f; margin-bottom: 6px; }
[data-tab-section="adresses"] .ad-field input { width: 100%; box-sizing: border-box; border: 1.5px solid #e3dcc9; border-radius: 9px; background: #fff; padding: 11px 13px; font-family: 'Manrope', system-ui, sans-serif; font-size: 13px; color: #0f2218; outline: none; transition: border-color .15s; }
[data-tab-section="adresses"] .ad-field input:focus { border-color: #c9a96e; }
[data-tab-section="adresses"] .ad-errmsg { margin-top: 12px; padding: 10px 14px; background: #fef2f2; border: 1px solid #fecaca; color: #991b1b; border-radius: 8px; font-family: 'Manrope', system-ui, sans-serif; font-size: 12px; font-weight: 600; }
[data-tab-section="adresses"] .ad-btns { display: flex; justify-content: flex-end; gap: 10px; margin-top: 16px; }
[data-tab-section="adresses"] .ad-btn { border-radius: 20px; padding: 10px 20px; font-family: 'Manrope', system-ui, sans-serif; font-size: 10px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; border: 1.5px solid #cfc7b2; background: transparent; color: #4a5247; cursor: pointer; transition: border-color .15s, background .15s; }
[data-tab-section="adresses"] .ad-btn:hover { border-color: #8a6f3f; }
[data-tab-section="adresses"] .ad-btn.ad-pri { background: #0f2218; border-color: #0f2218; color: #f5f0e6; }
[data-tab-section="adresses"] .ad-btn.ad-pri:hover { background: #1b4332; }

/* Mobile : formulaire en 1 colonne */
@media (max-width: 768px) {
  [data-tab-section="adresses"] .ad-grid { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════════
   ONGLET RÉGLAGES — restyle crème (maquette Compte 5)
   Cartes .rg-sec repliables (.open) + Sécurité / Newsletter / Danger + modale.
   Tout scopé [data-tab-section="reglages"] + préfixé .rg-* (collisions
   .k/.rule/.top/.field + danger/ghost/del/on). Fonctionnel inchangé (IDs).
   ═══════════════════════════════════════════════════════════════ */
/* Fond crème (aligné sur les 4 autres onglets) */
.compte-layout:has([data-tab-section="reglages"].active) > main { background: #efe9dc; }
.compte-mobile-body:has([data-tab-section="reglages"].active) { background: #efe9dc; min-width: 0; }

[data-tab-section="reglages"] .rg-stack { display: flex; flex-direction: column; gap: 18px; max-width: 960px; width: 100%; align-self: center; }
/* Grille 2 colonnes (Sécurité | Newsletter) — fidèle maquette ; Danger reste hors grille (pleine largeur). */
[data-tab-section="reglages"] .rg-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: start; }

/* En-tête de page PC (kicker + titre + sous-titre) — look aligné sur les autres onglets.
   PC-only : masqué dans .compte-mobile-body (le titre est porté par la barre du shell). */
[data-tab-section="reglages"] .rg-pagehead { align-self: center; max-width: 960px; width: 100%; }
[data-tab-section="reglages"] .rg-pagetag { font-family: 'Manrope', system-ui, sans-serif; font-size: 9px; letter-spacing: 4px; text-transform: uppercase; color: #8a6f3f; margin-bottom: 8px; }
[data-tab-section="reglages"] .rg-pagetitle { font-family: 'Libre Baskerville', Georgia, serif; font-size: 2rem; color: #0f2218; font-weight: 400; margin: 0 0 4px 0; line-height: 1.1; }
[data-tab-section="reglages"] .rg-pagesub { font-family: 'Manrope', system-ui, sans-serif; font-size: 0.82rem; color: #7a7565; margin: 0; }
.compte-mobile-body [data-tab-section="reglages"] .rg-pagehead { display: none; }

[data-tab-section="reglages"] .rg-sec { background: #fbf8f1; border-radius: 16px; box-shadow: 0 12px 30px rgba(15,34,24,.09); overflow: hidden; min-width: 0; }
[data-tab-section="reglages"] .rg-rule { height: 3px; background: linear-gradient(90deg, transparent, #c9a96e, transparent); }

/* En-tête repliable (bouton pleine largeur) */
[data-tab-section="reglages"] .rg-hd { display: flex; align-items: center; gap: 11px; width: 100%; background: none; border: none; padding: 20px 28px 16px; text-align: left; cursor: pointer; }
[data-tab-section="reglages"] .rg-ic { width: 30px; height: 30px; border-radius: 50%; border: 1px solid rgba(201,169,110,.55); display: flex; align-items: center; justify-content: center; flex: none; }
[data-tab-section="reglages"] .rg-ic svg { width: 14px; height: 14px; fill: none; stroke: #8a6f3f; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
[data-tab-section="reglages"] .rg-tt { font-family: 'Libre Baskerville', Georgia, serif; font-size: 18px; font-weight: 700; color: #0f2218; flex: 1; }
[data-tab-section="reglages"] .rg-st { font-family: 'Manrope', system-ui, sans-serif; font-size: 9px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #9a927e; flex: none; margin-right: 2px; }
[data-tab-section="reglages"] .rg-chev { width: 24px; height: 24px; border-radius: 50%; border: 1px solid #cfc7b2; display: flex; align-items: center; justify-content: center; flex: none; transition: transform .25s, border-color .15s; }
[data-tab-section="reglages"] .rg-chev svg { width: 9px; height: 9px; fill: none; stroke: #8a6f3f; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
[data-tab-section="reglages"] .rg-hd:hover .rg-chev { border-color: #c9a96e; }
[data-tab-section="reglages"] .rg-sec.open .rg-chev { transform: rotate(180deg); }

/* Pliage : grid-rows 0fr → 1fr. Le CLIP (.rg-fclip = grid item) n'a PAS de
   padding → le track descend à 0 (sinon le padding de l'item borne le track).
   Le padding est sur .rg-in interne, clippé par .rg-fclip.
   minmax(0, …) : force le minimum de la piste à 0. Sans ça, WebKit/iOS Safari
   garde le min implicite (= min-content de l'enfant) et laisse un vide résiduel
   sous l'en-tête quand replié (Blink collapse déjà à 0 via overflow:hidden). */
[data-tab-section="reglages"] .rg-fold { display: grid; grid-template-rows: minmax(0, 0fr); transition: grid-template-rows .32s ease; }
[data-tab-section="reglages"] .rg-sec.open .rg-fold { grid-template-rows: minmax(0, 1fr); }
[data-tab-section="reglages"] .rg-fclip { overflow: hidden; min-height: 0; }
[data-tab-section="reglages"] .rg-in { padding: 4px 28px 26px; }

/* Champs (Sécurité) */
[data-tab-section="reglages"] .rg-field { margin-bottom: 14px; max-width: 420px; }
[data-tab-section="reglages"] .rg-field label { display: block; font-family: 'Manrope', system-ui, sans-serif; font-size: 9.5px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #8a6f3f; margin-bottom: 6px; }
[data-tab-section="reglages"] .rg-field input { width: 100%; box-sizing: border-box; border: 1.5px solid #e3dcc9; border-radius: 9px; background: #fff; padding: 11px 13px; font-family: 'Manrope', system-ui, sans-serif; font-size: 13px; color: #0f2218; outline: none; transition: border-color .15s; }
[data-tab-section="reglages"] .rg-field input:focus { border-color: #c9a96e; }
[data-tab-section="reglages"] .rg-hint { font-size: 10.5px; color: #9a927e; margin-top: 5px; }
[data-tab-section="reglages"] .rg-err { font-family: 'Manrope', system-ui, sans-serif; font-size: 11.5px; color: #c0392b; font-weight: 600; margin: 2px 0 12px; }

/* Boutons */
[data-tab-section="reglages"] .rg-btn { border-radius: 20px; padding: 11px 22px; font-family: 'Manrope', system-ui, sans-serif; font-size: 10px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; border: none; background: #0f2218; color: #f5f0e6; cursor: pointer; transition: background .15s, border-color .15s, color .15s; }
[data-tab-section="reglages"] .rg-btn:hover { background: #1b4332; }
[data-tab-section="reglages"] .rg-btn.ghost { background: transparent; border: 1.5px solid #cfc7b2; color: #4a5247; }
[data-tab-section="reglages"] .rg-btn.ghost:hover { border-color: #c25b43; color: #c25b43; }
[data-tab-section="reglages"] .rg-btn.del { background: transparent; border: 1.5px solid #c25b43; color: #c0392b; }
[data-tab-section="reglages"] .rg-btn.del:hover { background: rgba(194,91,67,.08); }

/* Newsletter */
[data-tab-section="reglages"] .rg-sub { font-family: 'Manrope', system-ui, sans-serif; font-size: 13px; color: #4a5247; margin-bottom: 14px; }
[data-tab-section="reglages"] .rg-checks { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 26px; margin-bottom: 20px; max-width: 520px; }
[data-tab-section="reglages"] .rg-check { display: flex; align-items: center; gap: 11px; font-family: 'Manrope', system-ui, sans-serif; font-size: 13px; font-weight: 600; color: #0f2218; cursor: pointer; user-select: none; }
[data-tab-section="reglages"] .rg-check input { position: absolute; opacity: 0; width: 0; height: 0; }
[data-tab-section="reglages"] .rg-check .rg-box { width: 20px; height: 20px; border-radius: 6px; border: 1.5px solid #cfc7b2; background: #fff; display: flex; align-items: center; justify-content: center; flex: none; transition: background .15s, border-color .15s; }
[data-tab-section="reglages"] .rg-check .rg-box svg { width: 11px; height: 11px; opacity: 0; fill: none; stroke: #f5f0e6; stroke-width: 2.8; stroke-linecap: round; stroke-linejoin: round; transition: opacity .15s; }
[data-tab-section="reglages"] .rg-check input:checked + .rg-box { background: #0f2218; border-color: #0f2218; }
[data-tab-section="reglages"] .rg-check input:checked + .rg-box svg { opacity: 1; }
[data-tab-section="reglages"] .rg-check input:focus-visible + .rg-box { border-color: #c9a96e; }
[data-tab-section="reglages"] .rg-nl-btns { display: flex; gap: 10px; flex-wrap: wrap; }

/* Danger */
[data-tab-section="reglages"] .rg-sec.danger { background: #fdf5f3; box-shadow: 0 12px 30px rgba(194,91,67,.1); }
[data-tab-section="reglages"] .rg-sec.danger .rg-rule { background: linear-gradient(90deg, transparent, #c25b43, transparent); }
[data-tab-section="reglages"] .rg-sec.danger .rg-tt { color: #c0392b; }
[data-tab-section="reglages"] .rg-sec.danger .rg-ic { border-color: rgba(194,91,67,.5); }
[data-tab-section="reglages"] .rg-sec.danger .rg-ic svg { stroke: #c25b43; }
[data-tab-section="reglages"] .rg-sec.danger .rg-chev { border-color: #e0b3a7; }
[data-tab-section="reglages"] .rg-sec.danger .rg-chev svg { stroke: #c25b43; }
[data-tab-section="reglages"] .rg-sec.danger p { font-family: 'Manrope', system-ui, sans-serif; font-size: 12.5px; color: #7a5a50; line-height: 1.7; margin: 0 0 16px; max-width: 560px; }
[data-tab-section="reglages"] .rg-sec.danger p b { color: #c0392b; }

/* Modale suppression (position fixed pleine page ; display piloté inline par le handler) */
[data-tab-section="reglages"] .rg-ov { position: fixed; inset: 0; background: rgba(30,30,30,.5); display: none; align-items: center; justify-content: center; z-index: 9999; padding: 24px; }
[data-tab-section="reglages"] .rg-pop { background: #fff; border-radius: 16px; max-width: 400px; width: 100%; padding: 30px 32px; text-align: center; box-shadow: 0 26px 60px rgba(0,0,0,.35); box-sizing: border-box; }
[data-tab-section="reglages"] .rg-pop h4 { font-family: 'Libre Baskerville', Georgia, serif; font-size: 19px; color: #c0392b; margin: 0 0 12px; }
[data-tab-section="reglages"] .rg-pop p { font-family: 'Manrope', system-ui, sans-serif; font-size: 13px; color: #555; line-height: 1.55; margin: 0 0 18px; }
[data-tab-section="reglages"] .rg-pop input { width: 100%; box-sizing: border-box; border: 1.5px solid #1c1c1c; border-radius: 10px; padding: 12px 14px; font-family: 'Manrope', system-ui, sans-serif; font-size: 13.5px; outline: none; margin-bottom: 8px; }
[data-tab-section="reglages"] .rg-pop-btns { display: flex; justify-content: center; gap: 10px; margin-top: 10px; }
[data-tab-section="reglages"] .rg-pb { border: none; border-radius: 20px; padding: 10px 22px; font-family: 'Manrope', system-ui, sans-serif; font-size: 13px; font-weight: 700; cursor: pointer; }
[data-tab-section="reglages"] .rg-pb.gris { background: #ececec; color: #333; }
[data-tab-section="reglages"] .rg-pb.gris:hover { background: #e0e0e0; }
[data-tab-section="reglages"] .rg-pb.rouge { background: #d24a33; color: #fff; }
[data-tab-section="reglages"] .rg-pb.rouge:hover { background: #c0392b; }

/* Mobile */
@media (max-width: 768px) {
  [data-tab-section="reglages"] .rg-grid { grid-template-columns: 1fr; }
  [data-tab-section="reglages"] .rg-hd { padding: 16px 18px 14px; }
  [data-tab-section="reglages"] .rg-in { padding: 2px 18px 20px; }
  [data-tab-section="reglages"] .rg-checks { grid-template-columns: 1fr; }
  [data-tab-section="reglages"] .rg-field { max-width: none; }
}