/* ============================================================
   La Cave des Orangers — feuille de style
   ------------------------------------------------------------
   Écrite en mobile d'abord : la base décrit le rendu sur
   téléphone, les paliers `min-width` ajoutent tablette puis
   grand écran. Palier principal : 900 px.
   La palette et les composants restent cohérents à tous les paliers.
   ============================================================ */

/* Palette cuivre unique : surfaces sombres translucides, texte ivoire,
   motif fixé derrière le contenu. */
:root {
  --radius:  16px;
  --serif:   "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --sans:    "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mobile-bar-height: 3.6rem;
  --header-offset: 8rem;
  --catalogue-desktop-columns: 3;
  color-scheme: dark;
  --bg: transparent;
  --surface: rgba(74, 46, 28, .84);
  --surface-warm: rgba(92, 56, 32, .88);
  --card: rgba(66, 40, 25, .92);
  --text: #F8E8D4;
  --text-muted: #E7C5A5;
  --brand: #E58A4D;
  --brand-text: #FFD2A1;
  --navy: #F8E1C1;
  --lagoon: #D7A16E;
  --olive: #BE8C62;
  --gold: #EDB47A;
  --gold-strong: #FFD2A1;
  --header-banner: #2F1D11;
  --header-bg: rgba(45, 27, 16, .94);
  --header-bg-strong: rgba(61, 37, 22, .96);
  --header-text: #FFF1DF;
  --on-dark: #FFF8EF;
  --on-brand: #2B190E;
  --danger: #FF9A8D;
  --success: #9AD8B5;
  --selection-added: #A9552D;
  --selection-added-border: #E8A06A;
  --shadow: #170C05;
  --line: rgba(255, 225, 192, .24);
  --focus: #FFE0B5;
  --promo: #FFD2A1;
  --promo-old: #F8E1C1;
  --logo-copper-light: #FFE0B5;
  --logo-copper-overlay: rgba(255, 205, 150, .9);
  --paper: #F2DFC7;
  --paper-text: #2B190E;
  --paper-muted: #674832;
  --paper-accent: #8F4524;
  --paper-accent-strong: #A9552D;
  --paper-soft: #765039;
  --paper-copy: #4D3322;
  --home-shelf-start: #2A1810;
  --home-shelf-mid: #321D13;
  --home-shelf-end: #28160F;
  --home-shelf-muted: #E7CDB4;
  --home-shelf-year: #D9B99B;
  --home-shelf-prestige: #DBA269;
  --home-shelf-red: #8D382F;
  --home-framed-start: #28150D;
  --home-framed-mid: #371C10;
  --home-framed-end: #25120B;
  --home-editorial-bg: #F5E6D3;
  --home-editorial-card: #FFFAF3;
  --home-editorial-stage-start: #F9ECDC;
  --home-editorial-stage-end: #F1DCC3;
  --home-editorial-hover: #73391F;
  --home-editorial-success: #387653;
  --home-editorial-prestige: #E3B37E;
  --universe-brown: #684028;
  --universe-brown-deep: #4B2D1B;
  --universe-shadow: #2A190F;
  /* Pastilles de couleur : chaque fond porte son propre texte, sinon le
     contraste tombe sous AA sur les fonds clairs (olive, lagon). */
  --badge-rouge-bg: #9E392E;   --badge-rouge-text: #FFF8EF;
  --badge-blanc-bg: #9E7651;   --badge-blanc-text: #FFF8EF;
  --badge-rose-bg: #A94E35;    --badge-rose-text: #FFF8EF;
  --badge-bulles-bg: #B8794B;  --badge-bulles-text: #24140A;
  --chip-active-bg: #F8E1C1;   --chip-active-text: #2B190E;
  --wine: var(--navy);
  --wine-2: var(--navy);
  --accent: var(--brand);
  --cream: var(--surface);
  --ink: var(--text);
  --muted: var(--text-muted);
  --card-gradient-start: var(--surface);
  --card-gradient-end: var(--surface-warm);
}

* { box-sizing: border-box; }

html {
  width: 100%; max-width: 100%; overflow-x: clip;
  scroll-behavior: smooth; overscroll-behavior-x: none; background: #3A2619;
}

body {
  margin: 0;
  font-family: var(--sans);
  color: var(--text);
  position: relative;
  isolation: isolate;
  background: transparent;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  width: 100%; max-width: 100%; overflow-x: clip;
  padding-bottom: 0;
}

@supports not (overflow: clip) {
  html, body { overflow-x: hidden; }
}

/* Calque séparé du document : il ne défile jamais avec le contenu. */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(rgba(58, 38, 25, .18), rgba(58, 38, 25, .18)),
    url("images/motif-cuivre-local.jpg") center / cover no-repeat;
}

h1, h2, h3 {
  margin: 0;
  font-family: var(--serif);
  font-weight: 600;
  line-height: 1.1;
  hyphens: none;
  overflow-wrap: normal;
  text-wrap: balance;
}

p, li, blockquote { text-wrap: pretty; }

a { color: inherit; }

img { max-width: 100%; display: block; }
[hidden] { display: none !important; }

/* L'en-tête collant ne doit pas recouvrir la cible d'une ancre. */
section[id], [id].anchor-target { scroll-margin-top: var(--header-offset); }

.visually-hidden {
  position: absolute; width: 1px; height: 1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}

.skip-link {
  position: fixed; top: .7rem; left: .7rem; z-index: 120;
  padding: .7rem 1rem; border: 2px solid var(--focus); border-radius: 8px;
  background: var(--on-dark); color: var(--on-brand); font-weight: 700;
  transform: translateY(calc(-100% - 1rem)); transition: transform .16s ease;
}
.skip-link:focus { transform: translateY(0); }

.btn {
  display: inline-block; padding: .8rem 1.6rem; border-radius: 999px;
  font-family: var(--sans); font-weight: 600; font-size: .95rem;
  text-decoration: none; cursor: pointer; border: 1px solid transparent;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn:hover { transform: translateY(-2px); }
.btn-gold  { background: var(--brand); color: var(--on-brand); box-shadow: 0 10px 24px color-mix(in srgb, var(--brand) 35%, transparent); }
.btn-gold:hover { background: var(--brand); }
.btn-ghost { background: transparent; color: var(--on-dark); border-color: color-mix(in srgb, var(--gold) 70%, transparent); }
.btn-ghost:hover { background: color-mix(in srgb, var(--gold) 18%, transparent); }

/* ---------------- En-tête ---------------- */
.site-header {
  position: sticky; top: 0; z-index: 50;
  display: flex; align-items: center; justify-content: space-between;
  padding: .6rem 1rem;
  background: var(--header-banner);
  box-shadow: 0 1px 0 var(--line), 0 10px 28px color-mix(in srgb, var(--shadow) 8%, transparent);
  color: var(--header-text);
  transition: background-color .16s ease, box-shadow .16s ease;
}
.brand { display: flex; align-items: center; gap: clamp(.8rem, 1.8vw, 1.5rem); text-decoration: none; color: var(--header-text); }
/* Le logo est la seule marque visuelle de la cave dans l'en-tête : il tient
   la comparaison avec le nom écrit à côté. */
.brand-logo { display: grid; flex: 0 0 auto; width: 6rem; height: 6rem; }
/* Logo complet fourni par Xavier : aucun masque ni cadre autour du PNG. */
.brand-logo::before {
  content: "";
  grid-area: 1 / 1;
  background: url("images/logo/logo-xavier-500.png") center / contain no-repeat;
  filter: drop-shadow(0 3px 5px color-mix(in srgb, var(--shadow) 45%, transparent));
}
.brand-mark { display: none; }
.brand-name { --brand-name-size: 1.2rem; display: flex; flex-direction: column; align-items: center; gap: .04em; font-family: var(--serif); font-size: var(--brand-name-size); font-weight: 700; letter-spacing: .05em; line-height: .94; text-align: center; text-transform: uppercase; }
.brand-name-part { display: block; white-space: nowrap; }
.brand-name-part--primary { color: var(--on-dark); }
.brand-name-part--accent { color: var(--brand); }
/* Le HTML statique occupe exactement le même gabarit que le nom configuré :
   aucun grand libellé sur une ligne ne peut apparaître avant l'API. */
.brand-name:not(:has(.brand-name-part)) { font-size: 0; }
.brand-name:not(:has(.brand-name-part))::before,
.brand-name:not(:has(.brand-name-part))::after { display: block; white-space: nowrap; font-size: var(--brand-name-size); }
.brand-name:not(:has(.brand-name-part))::before { content: "LA CAVE DES"; color: var(--on-dark); }
.brand-name:not(:has(.brand-name-part))::after { content: "ORANGERS"; color: var(--brand); }
.site-nav { display: flex; flex: 1; align-items: center; justify-content: center; gap: clamp(.35rem, 1.15vw, .95rem); }
/* `nowrap` : sans cela « Vins du monde » et « Haut de gamme » se cassaient sur
   trois lignes dès 1440 px et l'en-tête montait à 102 px de haut. */
.site-nav a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; color: color-mix(in srgb, var(--header-text) 88%, transparent); font-size: .95rem; white-space: nowrap; }
.site-nav a:hover, .site-nav summary:hover { color: var(--brand-text); }
.site-nav a[aria-current="page"] { color: var(--brand); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .45rem; }
.nav-cta {
  padding: .45rem .35rem; border: 0; border-radius: 0;
}
.nav-cta:hover { background: transparent; }
.site-search-toggle { display: inline-grid; place-items: center; width: 44px; height: 44px; padding: .55rem; border: 0; border-radius: 0; background: transparent; color: var(--brand-text); cursor: pointer; }
.site-search-toggle:hover { background: transparent; color: var(--header-text); }
.site-search-toggle:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.site-search-toggle--drawer { display: flex; justify-content: flex-start; gap: .7rem; width: 100%; height: auto; margin-top: .55rem; padding: .75rem .3rem; border: 0; border-radius: 8px; color: var(--header-text); font: 600 1.05rem var(--sans); }
.search-icon { width: 1.35rem; height: 1.35rem; }
.site-menu-toggle {
  display: none; place-items: center; width: 44px; height: 44px; padding: 0;
  border: 1px solid color-mix(in srgb, var(--header-text) 28%, transparent); border-radius: 50%; background: transparent;
  color: var(--header-text); font: 1.25rem/1 var(--sans); cursor: pointer;
}
.site-menu-toggle:focus-visible, .site-menu-close:focus-visible, .site-menu-drawer a:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.site-menu-drawer { position: fixed; inset: 0; z-index: 90; padding: max(1rem, env(safe-area-inset-top)) 1rem 1rem; background: color-mix(in srgb, var(--shadow) 72%, transparent); backdrop-filter: blur(5px); }
.site-menu-panel { display: flex; flex-direction: column; min-height: 100%; padding: 1rem; border: 1px solid color-mix(in srgb, var(--brand) 45%, transparent); border-radius: 18px; background: var(--header-bg); color: var(--header-text); box-shadow: 0 24px 70px color-mix(in srgb, var(--shadow) 30%, transparent); }
.site-menu-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-bottom: 1rem; border-bottom: 1px solid var(--line); }
.site-menu-head strong { font: 1.65rem var(--serif); }
.site-menu-close { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid color-mix(in srgb, var(--header-text) 28%, transparent); border-radius: 50%; background: transparent; color: var(--header-text); font: 1.5rem/1 var(--sans); cursor: pointer; }
.site-menu-links { display: grid; gap: .15rem; padding: 1rem 0 calc(1rem + var(--mobile-bar-height)); overflow: auto; }
.site-menu-link { display: block; padding: .75rem .3rem; color: var(--header-text); font: 600 1.05rem var(--sans); text-decoration: none; }
.site-menu-link[aria-current="page"] { padding-inline: .75rem; border-radius: 9px; background: color-mix(in srgb, var(--brand) 16%, transparent); color: var(--brand-text); }
.site-menu-group { margin: 0 0 .7rem; padding: .75rem 0 1rem; border-bottom: 1px solid var(--line); }
.site-menu-group p { margin: 0 0 .45rem; color: var(--gold); font: 700 .76rem var(--sans); letter-spacing: .12em; text-transform: uppercase; }
.site-menu-group ul { display: grid; gap: .12rem; margin: 0; padding: 0; list-style: none; }
.site-menu-group a { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem .3rem; color: color-mix(in srgb, var(--header-text) 92%, transparent); text-decoration: none; }
.site-menu-group a span { color: var(--gold); font-size: .82rem; }
body.menu-open { overflow: hidden; }

.site-search-dialog { width: min(92vw, 620px); padding: 0; border: 0; border-radius: 18px; background: transparent; color: var(--text); }
.site-search-dialog::backdrop { background: color-mix(in srgb, var(--shadow) 58%, transparent); backdrop-filter: blur(5px); }
.site-search-panel { display: grid; gap: 1rem; padding: clamp(1.2rem, 4vw, 2rem); border: 1px solid var(--line); border-radius: 18px; background: var(--card); box-shadow: 0 28px 80px color-mix(in srgb, var(--shadow) 28%, transparent); }
.site-search-head { display: flex; align-items: start; justify-content: space-between; gap: 1rem; }
.site-search-head p { margin: 0 0 .2rem; color: var(--brand-text); font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.site-search-head h2 { color: var(--text); font-size: clamp(1.65rem, 5vw, 2.4rem); }
.site-search-head button { display: grid; place-items: center; flex: 0 0 auto; width: 44px; height: 44px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: var(--surface); color: var(--text); font: 1.5rem/1 var(--sans); cursor: pointer; }
.site-search-panel > label { color: var(--text); font-weight: 700; }
.site-search-field { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .6rem; }
.site-search-field input { min-width: 0; min-height: 50px; padding: .7rem .9rem; border: 1px solid var(--line); border-radius: 11px; background: var(--bg); color: var(--text); font: 1rem var(--sans); }
.site-search-field button { min-height: 50px; padding: .7rem 1.1rem; border: 1px solid var(--brand); border-radius: 11px; background: var(--brand); color: var(--on-brand); font: 700 .9rem var(--sans); cursor: pointer; }
.site-search-field input:focus-visible, .site-search-head button:focus-visible, .site-search-field button:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }

/* Avant l'initialisation, les commandes gardent leur place sans afficher un
   menu provisoire. Sans JavaScript, la navigation statique reste accessible. */
html.js-enabled:not(.has-js) .site-nav,
html.js-enabled:not(.has-js) .site-menu-toggle { visibility: hidden; pointer-events: none; }
@media (max-width: 899px) {
  html:not(.js-enabled) .site-header { flex-wrap: wrap; align-items: flex-start; gap: .4rem 1rem; }
  html:not(.js-enabled) .site-nav { flex: 1 0 100%; flex-wrap: wrap; padding: .35rem 0 .1rem; }
  html.js-enabled .site-nav { display: none; }
  html.js-enabled .site-menu-toggle { display: grid; }
}

@media (min-width: 900px) and (max-width: 1399px) {
  html.js-enabled .site-nav { display: none; }
  html.js-enabled .site-menu-toggle { display: grid; }
}

html.age-gate-pending { overflow: hidden; }
html.age-gate-pending::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 120;
  background: var(--header-bg);
}

/* ---------------- Barre d'actions fixe (téléphone) ---------------- */
.mobile-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
  display: none; align-items: stretch;
  min-height: var(--mobile-bar-height);
  padding-bottom: env(safe-area-inset-bottom);
  background: color-mix(in srgb, var(--header-bg) 96%, transparent);
  backdrop-filter: blur(10px);
  border-top: 1px solid color-mix(in srgb, var(--gold) 45%, transparent);
  box-shadow: 0 -6px 20px color-mix(in srgb, var(--shadow) 40%, transparent);
}
.mobile-bar-item {
  flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .1rem; min-height: var(--mobile-bar-height); padding: .35rem .3rem;
  color: var(--header-text); font-size: .72rem; font-weight: 600; text-decoration: none;
  letter-spacing: .02em;
}
.mobile-bar-item + .mobile-bar-item { border-left: 1px solid color-mix(in srgb, var(--gold) 30%, transparent); }
.mobile-bar-item:active { background: color-mix(in srgb, var(--gold) 18%, transparent); }
.mobile-bar-item[aria-current="page"] { background: color-mix(in srgb, var(--brand) 16%, transparent); color: var(--brand-text); }
.mobile-bar-item[aria-current="page"] .mobile-bar-icon { color: var(--brand-text); }
.mobile-bar-item:focus-visible { outline: 3px solid var(--focus); outline-offset: -3px; }
.mobile-bar-icon { display: inline-grid; place-items: center; font-size: 1.15rem; line-height: 1; color: var(--gold); }
.mobile-bar-icon svg { width: 1.2rem; height: 1.2rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.site-menu-toggle svg { width: 1.25rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }

/* ---------------- Héro ---------------- */
.hero {
  position: relative; isolation: isolate; overflow: hidden;
  display: grid; align-items: center;
  min-height: 610px;
  background: var(--text);
  color: var(--on-dark);
  padding: clamp(3rem, 9vw, 5rem) 1rem;
}
.hero::before { content: ""; position: absolute; inset: 0; z-index: 1; background: rgba(8, 11, 9, .1); pointer-events: none; }
.hero::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    linear-gradient(180deg, rgba(7, 10, 8, .22), rgba(7, 10, 8, .62)),
    linear-gradient(90deg, rgba(7, 10, 8, .48), rgba(7, 10, 8, .18));
}
.hero-grid {
  position: static;
  max-width: 1180px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr;
  align-items: center; gap: 1.75rem;
}
/* Sur téléphone l'ordre suit la décision : promesse, explication, action,
   puis informations pratiques. */
.hero-inner { position: relative; z-index: 2; display: flex; flex-direction: column; max-width: 840px; }
.hero-eyebrow { order: 1; text-transform: uppercase; letter-spacing: .28em; font-size: .72rem; color: var(--gold); margin: 0 0 .55rem; }
.hero-title { order: 2; max-width: 23ch; font-size: clamp(2rem, 5.2vw, 4.1rem); font-weight: 600; }
.hero-subtitle { order: 3; margin: .4rem 0 0; color: color-mix(in srgb, var(--on-dark) 90%, transparent); font-family: var(--serif); font-size: clamp(1.1rem, 2.2vw, 1.7rem); font-weight: 500; }
.hero-lede { order: 3; display: block; max-width: 48ch; margin: .8rem 0 1.1rem; overflow: visible; color: color-mix(in srgb, var(--on-dark) 85%, transparent); font-size: 1rem; }
.hero-actions { order: 4; display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin-bottom: .9rem; }
.hero-hours { order: 5; display: inline-flex; align-self: flex-start; gap: .34rem; max-width: 100%; margin: 0 0 .8rem; padding: .42rem .8rem; border: 1px solid color-mix(in srgb, var(--gold) 55%, transparent); border-radius: 999px; background: color-mix(in srgb, var(--on-dark) 8%, transparent); color: color-mix(in srgb, var(--on-dark) 90%, transparent); font-size: .84rem; }
.hero-hours-item + .hero-hours-item::before { content: "·"; margin-right: .34rem; }
.hero-photo {
  position: absolute; inset: 0; z-index: 0;
  display: block; width: 100%; height: 100%; margin: 0; padding: 0;
}
.hero-photo img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
@media (max-width: 639px) { .hero-photo img { object-position: 78% center; } }
.hero-actions .btn { flex: 0 0 auto; padding: .72rem 1.15rem; text-align: center; }
.hero-call, .hero-directions { display: flex; align-items: center; justify-content: center; min-height: 44px; }
.hero-prestige-link { width: 100%; text-align: center; color: color-mix(in srgb, var(--on-dark) 82%, transparent); font-size: .88rem; font-weight: 600; text-decoration-color: color-mix(in srgb, var(--gold) 75%, transparent); text-underline-offset: .28rem; }
.hero-prestige-link:hover { color: var(--on-dark); }
.hero-prestige-link:focus-visible { outline: 2px solid var(--focus); outline-offset: 4px; border-radius: 2px; }

/* ---------------- Sections génériques ---------------- */
.section { padding: clamp(3rem, 7vw, 5.5rem) clamp(1rem, 4vw, 3rem); max-width: 1180px; margin: 0 auto; }
.section-head { max-width: 640px; margin: 0 auto clamp(1.8rem, 4vw, 2.8rem); text-align: center; }
.section-head h1, .section-head h2 { font-size: clamp(1.8rem, 4.5vw, 3rem); color: var(--wine); }
.section-head p { color: var(--muted); margin: .6rem 0 0; }
.section-head--light h1, .section-head--light h2 { color: var(--on-dark); }
.section-head--light p, .section-head--light .prestige-eyebrow { color: color-mix(in srgb, var(--on-dark) 84%, transparent); }

/* ---------------- Accueil et pages régionales ---------------- */
.catalogue-page { max-width: 1280px; }
.catalogue-page .section-head h1 { color: var(--wine); font-size: clamp(2.15rem, 6vw, 3.8rem); }
.catalogue-page-eyebrow { margin: 0 0 .3rem; color: var(--brand-text) !important; font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.catalogue-page-links { display: flex; flex-wrap: wrap; justify-content: center; gap: .45rem .85rem; max-width: 900px; margin: clamp(2.25rem, 6vw, 4rem) auto 0; padding-top: 1.4rem; border-top: 1px solid var(--line); }
.catalogue-page-links a { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding-inline: .3rem; color: var(--wine); font-size: .86rem; font-weight: 600; text-decoration-color: color-mix(in srgb, var(--accent) 60%, transparent); text-underline-offset: .22rem; }
.catalogue-page-links a:hover { color: var(--brand-text); }
.region-explorer-section { padding-bottom: clamp(2rem, 5vw, 4rem); }
.region-explorer { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.region-explorer-card { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; min-height: 154px; padding: 1rem; border: 1px solid var(--line); border-radius: 14px; background: var(--card); color: var(--wine); text-decoration: none; box-shadow: 0 10px 22px color-mix(in srgb, var(--shadow) 7%, transparent); transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease; }
.region-explorer-card:hover, .region-explorer-card:focus-visible { transform: translateY(-3px); border-color: color-mix(in srgb, var(--brand) 70%, transparent); box-shadow: 0 14px 28px color-mix(in srgb, var(--shadow) 16%, transparent); }
.region-explorer-card:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.region-explorer-card-kicker { color: var(--brand-text); font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.region-explorer-card strong { margin: .35rem 0 .12rem; overflow-wrap: anywhere; font: 1.45rem/1.05 var(--serif); }
.region-explorer-card > span:not(.region-explorer-card-kicker):not(.region-explorer-card-action) { color: var(--muted); font-size: .78rem; }
.region-explorer-card-action { margin-top: auto; padding-top: .75rem; color: var(--brand-text); font-size: .76rem; font-weight: 700; }
.home-selection { padding-top: clamp(2rem, 5vw, 4rem); }
.home-selection-action { margin: clamp(1.5rem, 4vw, 2.25rem) 0 0; text-align: center; }
.cat-grid--selection { max-width: 1180px; margin: 0 auto; }
.budget-section { padding-top: clamp(2rem, 5vw, 4rem); }
.budget-grid { display: grid; grid-template-columns: 1fr; gap: clamp(.75rem, 2vw, 1.25rem); }
.budget-card { min-height: 190px; padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid var(--line); border-radius: 18px; background: linear-gradient(145deg, color-mix(in srgb, var(--card) 94%, var(--accent)), var(--card)); color: var(--ink); display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; text-decoration: none; box-shadow: 0 12px 28px color-mix(in srgb, var(--shadow) 12%, transparent); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.budget-card:hover, .budget-card:focus-visible { transform: translateY(-4px); border-color: var(--brand); box-shadow: 0 18px 34px color-mix(in srgb, var(--shadow) 20%, transparent); }
.budget-card:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.budget-card > span { color: var(--muted); font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.budget-card strong { margin: .35rem 0 .7rem; color: var(--wine); font: 700 clamp(2rem, 5vw, 3.35rem)/1 var(--serif); }
.budget-card small { color: var(--brand-text); font-size: .78rem; font-weight: 700; }
.home-collection-teaser { display: grid; gap: clamp(1.5rem, 5vw, 4rem); align-items: center; }
.home-collection-teaser figure { margin: 0; min-height: 280px; overflow: hidden; border: 1px solid var(--line); border-radius: 22px; box-shadow: 0 22px 48px color-mix(in srgb, var(--shadow) 25%, transparent); }
.home-collection-teaser img { width: 100%; height: 100%; min-height: 280px; object-fit: cover; }
.home-collection-teaser h2 { margin-bottom: .85rem; color: var(--wine); font-size: clamp(2rem, 6vw, 3.4rem); }
.home-collection-teaser p:not(.catalogue-page-eyebrow) { margin: 0 0 1.25rem; color: var(--muted); }

/* Accueil éditorial : sept séquences avec une palette commune et des
   rythmes différents, sans empiler de grandes cartes identiques. */
.home-universes { max-width: 1280px; }
.home-universe-grid { display: grid; gap: 1rem; }
.home-universe {
  position: relative; display: grid; grid-template-rows: 250px minmax(0, 1fr); min-width: 0; overflow: hidden;
  border: 1px solid rgba(255, 210, 161, .32); border-radius: 22px; background: var(--paper); color: var(--paper-text);
  text-decoration: none; box-shadow: 0 18px 42px color-mix(in srgb, var(--shadow) 22%, transparent);
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.home-universe:hover, .home-universe:focus-visible { transform: translateY(-5px); border-color: color-mix(in srgb, var(--brand) 72%, transparent); box-shadow: 0 28px 58px color-mix(in srgb, var(--shadow) 30%, transparent); }
.home-universe:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.home-universe figure { position: relative; min-height: 250px; margin: 0; overflow: hidden; background: radial-gradient(circle at 50% 78%, rgba(229, 138, 77, .34), transparent 46%), linear-gradient(145deg, var(--header-banner), var(--universe-brown)); }
.home-universe figure::before { content: ""; position: absolute; left: 50%; bottom: -36%; width: 72%; aspect-ratio: 1; border: 1px solid rgba(255, 226, 194, .22); border-radius: 50%; transform: translateX(-50%); }
.home-universe figure img { transition: transform .5s cubic-bezier(.22,.8,.2,1); }
.home-universe > div { display: flex; flex-direction: column; align-items: flex-start; min-height: 190px; padding: 1.35rem; }
.home-universe > div > span { color: var(--paper-accent-strong); font: 800 .7rem var(--sans); letter-spacing: .16em; }
.home-universe h3 { margin: .32rem 0 .48rem; color: var(--paper-text); font-size: clamp(2rem, 7vw, 2.8rem); line-height: .92; }
.home-universe p { margin: 0 0 1.1rem; color: var(--paper-muted); font-size: .9rem; }
.home-universe > div > strong { display: inline-flex; align-items: center; min-height: 44px; margin-top: auto; color: var(--paper-accent); font-size: .78rem; }
.home-universe-bottle, .home-universe--world figure img { position: absolute; bottom: 1rem; left: 50%; width: auto; height: 84%; object-fit: contain; filter: drop-shadow(0 18px 18px rgba(23, 12, 5, .42)); }
.home-universe-bottle--front { transform: translateX(-66%) rotate(-2deg); }
.home-universe-bottle--back { height: 73%; opacity: .78; transform: translateX(-10%) rotate(5deg); }
.home-universe--france:hover .home-universe-bottle--front { transform: translateX(-66%) translateY(-6px) rotate(-2deg); }
.home-universe--france:hover .home-universe-bottle--back { transform: translateX(-10%) translateY(-3px) rotate(5deg); }
.home-universe--world figure { background: radial-gradient(circle at 50% 74%, rgba(229, 138, 77, .42), transparent 48%), linear-gradient(150deg, var(--universe-brown-deep), var(--universe-shadow)); }
.home-universe--world figure img { transform: translateX(-50%); }
.home-universe--world:hover figure img { transform: translateX(-50%) translateY(-6px) scale(1.02); }
.home-universe--crus figure::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(47, 29, 17, .08), rgba(47, 29, 17, .48)); }
.home-universe--crus figure img { width: 100%; height: 100%; object-fit: cover; filter: sepia(.12) saturate(.82); }
.home-universe--crus:hover figure img { transform: scale(1.035); }

.home-selection { max-width: 1280px; overflow: hidden; }
.home-selection .wine-card { box-shadow: 0 14px 32px color-mix(in srgb, var(--shadow) 14%, transparent); }
.home-featured-controls { flex-wrap: wrap; align-items: center; justify-content: center; gap: .65rem .75rem; margin-top: 1.25rem; }
.home-featured-controls:not([hidden]) { display: flex; }
.home-featured-controls > button { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid color-mix(in srgb, var(--gold) 62%, transparent); border-radius: 50%; background: color-mix(in srgb, var(--card) 88%, transparent); color: var(--on-dark); font: 600 1.15rem var(--sans); cursor: pointer; }
.home-featured-controls > button:focus-visible, [data-home-featured-dots] button:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
[data-home-featured-dots] { display: flex; align-items: center; gap: 0; }
[data-home-featured-dots] button {
  position: relative; display: grid; place-items: center; width: 44px; height: 44px; padding: 0;
  border: 0; border-radius: 50%; background: transparent; cursor: pointer;
}
[data-home-featured-dots] button::before {
  content: ""; width: 10px; height: 10px; border: 1px solid var(--brand); border-radius: 50%;
  background: transparent; transition: width .2s ease, border-radius .2s ease, background-color .2s ease;
}
[data-home-featured-dots] button.is-active::before { width: 28px; border-radius: 999px; background: var(--brand); }
.home-carousel-hint {
  display: flex; flex: 0 0 100%; align-items: center; justify-content: center; gap: .45rem;
  margin: 0 0 .1rem; color: var(--gold); font-size: .75rem; font-weight: 700; letter-spacing: .03em;
}
.home-carousel-hint svg { width: 2rem; height: 1.25rem; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

.home-budget-band { background: var(--paper); color: var(--paper-text); border-block: 1px solid rgba(143, 69, 36, .2); }
.home-budget-band .section { display: grid; gap: clamp(2rem, 5vw, 4rem); max-width: 1280px; }
.home-budget-intro { max-width: 590px; text-align: center; }
.home-budget-intro .catalogue-page-eyebrow { color: var(--paper-accent) !important; }
.home-budget-intro h2 { color: var(--paper-text); font-size: clamp(2.2rem, 7vw, 4rem); line-height: .94; }
.home-budget-intro > p:last-child { margin: .8rem 0 0; color: var(--paper-muted); }
.home-budget-band .budget-grid { grid-template-columns: 1fr; align-self: center; gap: 0; border-block: 1px solid rgba(143, 69, 36, .28); }
.home-budget-band .budget-card { display: flex; flex-direction: row; justify-content: space-between; align-items: center; gap: 1rem; min-height: 104px; padding: 1.1rem .25rem; border: 0; border-bottom: 1px solid rgba(143, 69, 36, .22); border-radius: 0; background: transparent; color: var(--paper-text); text-align: left; box-shadow: none; }
.home-budget-band .budget-card:last-child { border-bottom: 0; }
.home-budget-band .budget-card:hover, .home-budget-band .budget-card:focus-visible { transform: none; border-color: rgba(143, 69, 36, .22); background: rgba(255, 248, 239, .42); box-shadow: none; }
.home-budget-band .budget-card:focus-visible { outline-color: var(--paper-accent); outline-offset: 4px; }
.home-budget-band .budget-card > span { display: grid; gap: .15rem; color: inherit; font-size: inherit; font-weight: inherit; letter-spacing: normal; text-transform: none; }
.home-budget-band .budget-card strong { margin: 0; color: var(--paper-text); font-size: clamp(1.8rem, 6vw, 2.45rem); line-height: .95; }
.home-budget-band .budget-card em { color: var(--paper-soft); font-size: .72rem; font-style: normal; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.home-budget-band .budget-card small { display: inline-flex; align-items: center; gap: .35rem; flex: none; color: var(--paper-accent); font-size: .75rem; font-weight: 800; }

.home-cavist { display: grid; gap: clamp(1.5rem, 6vw, 5rem); align-items: center; max-width: 1180px; }
.home-cavist figure { position: relative; width: min(100%, 430px); min-height: 430px; margin: 0 auto; overflow: hidden; border-radius: 48% 48% 22px 22px; background: var(--surface-warm); box-shadow: 0 24px 55px color-mix(in srgb, var(--shadow) 24%, transparent); }
.home-cavist figure::after { content: ""; position: absolute; inset: 0; border: 1px solid color-mix(in srgb, var(--brand) 45%, transparent); border-radius: inherit; pointer-events: none; }
.home-cavist img { width: 100%; height: 100%; min-height: 430px; object-fit: cover; object-position: 50% 28%; }
.home-cavist h2 { max-width: 15ch; margin-bottom: 1rem; color: var(--wine); font-size: clamp(2.3rem, 7vw, 4.4rem); line-height: .95; }
.home-cavist p:not(.catalogue-page-eyebrow) { max-width: 52ch; color: var(--muted); }
.home-cavist ul { display: flex; flex-wrap: wrap; gap: .45rem; margin: 1.2rem 0 1.5rem; padding: 0; list-style: none; }
.home-cavist li { padding: .5rem .75rem; border: 1px solid var(--line); border-radius: 999px; color: var(--wine); font-size: .75rem; font-weight: 700; }

.home-since { position: relative; overflow: hidden; padding: clamp(2.7rem, 6vw, 4.8rem) clamp(1rem, 4vw, 3rem); border-block: 1px solid rgba(143, 69, 36, .22); background: var(--paper); color: var(--paper-text); }
.home-since::before, .home-since::after { content: ""; position: absolute; border: 1px solid rgba(143, 69, 36, .16); border-radius: 50%; pointer-events: none; }
.home-since::before { right: -7rem; top: -10rem; width: 22rem; height: 22rem; }
.home-since::after { right: -2rem; top: -5rem; width: 12rem; height: 12rem; }
.home-since-inner { position: relative; z-index: 1; display: grid; gap: 1.5rem; width: min(1180px, 100%); margin: 0 auto; }
.home-since-date { display: flex; align-items: baseline; gap: .55rem; color: var(--paper-accent); }
.home-since-date span { font-size: .7rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.home-since-date h2 { color: var(--paper-accent-strong); font-size: clamp(3.6rem, 13vw, 6rem); line-height: .72; letter-spacing: -.04em; }
.home-since-copy { max-width: 650px; }
.home-since-copy p { margin: 0 0 .55rem; color: var(--paper-accent); font-size: .7rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.home-since-copy span { display: block; color: var(--paper-copy); font: 600 clamp(1.35rem, 4vw, 2rem)/1.25 var(--serif); }

.home-contact-strip { display: grid; gap: 1.4rem; width: min(1180px, calc(100% - 2rem)); margin: clamp(2rem, 5vw, 4rem) auto; padding: clamp(1.4rem, 5vw, 3rem); border-radius: 24px; background: var(--header-banner); color: var(--on-dark); }
.home-contact-strip h2 { max-width: 18ch; color: var(--on-dark); font-size: clamp(2rem, 6vw, 3.5rem); line-height: .95; }
.home-contact-strip p:not(.catalogue-page-eyebrow), .home-contact-strip > div > span { display: block; margin: .7rem 0 0; color: color-mix(in srgb, var(--on-dark) 74%, transparent); }
.home-contact-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; }
.home-contact-actions .btn { min-width: 10rem; text-align: center; }
.home-contact-link { min-height: 44px; display: inline-flex; align-items: center; color: var(--brand); font-size: .8rem; font-weight: 700; text-underline-offset: .25rem; }

.reveal-ready [data-reveal] { opacity: 0; transform: translateY(22px); transition: opacity .6s ease, transform .6s cubic-bezier(.22,.8,.2,1); }
.reveal-ready [data-reveal].is-revealed { opacity: 1; transform: translateY(0); }

@media (max-width: 819px) {
  .cat-grid.cat-grid--selection.home-featured-carousel {
    display: flex; align-items: stretch; gap: .65rem; max-width: none; margin-inline: -1rem;
    padding: 1rem 13% 1.65rem; overflow-x: auto; overflow-y: clip;
    scroll-padding-inline: 13%; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-inline: contain;
  }
  .cat-grid--selection.home-featured-carousel::-webkit-scrollbar { display: none; }
  .home-featured-carousel .wine-card {
    flex: 0 0 74%; scroll-snap-align: center; scroll-snap-stop: always;
    opacity: .58; transform: translateY(22px) scale(.88); transform-origin: 50% 100%;
    transition: opacity .24s ease, transform .32s cubic-bezier(.22,.8,.2,1), box-shadow .24s ease;
  }
  .home-featured-carousel .wine-card.is-active { z-index: 3; opacity: 1; transform: translateY(0) scale(1); box-shadow: 0 22px 46px color-mix(in srgb, var(--shadow) 26%, transparent); }
  .home-featured-carousel .wine-card:hover, .home-featured-carousel .wine-card:focus-within { transform: translateY(22px) scale(.88); }
  .home-featured-carousel .wine-card.is-active:hover, .home-featured-carousel .wine-card.is-active:focus-within { transform: translateY(-2px) scale(1); }
  .home-budget-band .budget-card { min-height: 96px; }
  .home-budget-band .budget-card small { width: 62px; justify-content: flex-end; text-align: right; line-height: 1.25; }
}

/* ---------------- Filtres ---------------- */
/* Sur téléphone la barre ne porte que la recherche et le bouton Filtrer :
   les trois groupes de puces sont déplacés dans le panneau par app.js. */
.filters {
  display: flex; flex-wrap: nowrap; gap: .5rem; align-items: center;
  justify-content: stretch; margin-bottom: 1.1rem;
}
.filters > .filter-group { display: none; }
.filters > .filter-select { display: none; }
.filter-group {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr));
  gap: .4rem; width: 100%;
}
.filter-group .chip { width: 100%; min-height: 44px; padding: .55rem .95rem; }
.filter-select { position: relative; display: grid; gap: .25rem; color: var(--wine); font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-align: left; }
.filter-select::after {
  content: ""; position: absolute; right: .9rem; bottom: 1rem; width: .42rem; height: .42rem;
  border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
  color: var(--text-muted); pointer-events: none; transform: rotate(45deg);
}
.filter-select select {
  appearance: none; width: 100%; min-height: 44px; padding: .55rem 2.15rem .55rem 1rem; border: 1px solid var(--line); border-radius: 9px;
  background: var(--card); color: var(--ink); font: 400 .9rem/1.2 var(--sans); text-align: left; text-align-last: left;
}
.filter-select select:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.chip {
  border: 1px solid var(--line); background: var(--card); color: var(--ink);
  padding: .55rem .95rem; border-radius: 999px; font: 600 .85rem/1 var(--sans);
  min-height: 44px; cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.chip:hover { border-color: var(--brand); }
.chip.is-active { background: var(--chip-active-bg); color: var(--chip-active-text); border-color: var(--chip-active-bg); font-weight: 700; }
.search { flex: 1 1 auto; min-width: 0; }
.search input {
  border: 1px solid var(--line); border-radius: 999px; padding: .55rem 1.1rem;
  min-height: 44px; font-size: 16px; min-width: 0; width: 100%; font-family: var(--sans);
  background: var(--card); color: var(--text);
}
.search input::placeholder { color: var(--text-muted); opacity: 1; }
.search input:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
.filters--offers {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: .65rem;
  max-width: 1180px; margin: 0 auto 1.5rem; padding: clamp(.9rem, 2.5vw, 1.25rem);
  border: 1px solid var(--line); border-radius: 18px;
  background: color-mix(in srgb, var(--card) 82%, transparent);
  box-shadow: 0 14px 34px color-mix(in srgb, var(--shadow) 10%, transparent);
}
.offers-page .filters--offers > .filter-select { display: grid; min-width: 0; padding: 0; border: 0; background: transparent; }
.offers-page .filters--offers .filter-select span { color: var(--text); font-size: .7rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.offers-page .filters--offers .filter-select::after { bottom: 1.12rem; }
.offers-page .filters--offers .filter-select select { min-height: 48px; padding: .65rem 2.15rem .65rem 1rem; border-radius: 12px; background-color: var(--card); color: var(--ink); font-size: .82rem; }
.offers-page .filters--offers .search { grid-column: 1 / -1; }
.offers-page .filters--offers .search input { min-height: 48px; border-radius: 12px; }
.filters-toggle {
  flex: 0 0 auto; display: inline-flex; align-items: center; gap: .35rem;
  min-height: 44px; padding: .45rem 1rem; border: 1px solid var(--brand); border-radius: 999px;
  background: var(--brand); color: var(--on-brand); font: 600 .85rem var(--sans); cursor: pointer;
}
.filters-toggle:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.filters-toggle-count {
  display: inline-grid; place-items: center; min-width: 1.35rem; height: 1.35rem; padding: 0 .3rem;
  border-radius: 999px; background: var(--surface); color: var(--text); font-size: .72rem; font-weight: 700;
}
.result-count { text-align: center; color: var(--muted); font-size: .85rem; margin: 0 0 2rem; }
.catalogue-note { max-width: 660px; margin: -1rem auto 2rem; text-align: center; color: var(--muted); font-size: .8rem; }

/* Panneau de filtres : feuille basse sur téléphone, dans la couche supérieure
   du navigateur, donc jamais en conflit de z-index avec la barre d'actions. */
.filters-dialog {
  width: 100%; max-width: 100%; max-height: 82dvh;
  margin: 0 auto; margin-top: auto; margin-bottom: 0;
  padding: 0; border: 0; border-radius: 18px 18px 0 0;
  color: var(--ink); background: var(--card);
  box-shadow: 0 -18px 60px color-mix(in srgb, var(--shadow) 50%, transparent);
}
.filters-dialog::backdrop { background: color-mix(in srgb, var(--shadow) 60%, transparent); backdrop-filter: blur(3px); }
.filters-dialog-panel {
  display: flex; flex-direction: column; max-height: inherit;
  padding: 1rem 1rem calc(1rem + env(safe-area-inset-bottom));
}
.filters-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.filters-dialog-head h2 { color: var(--wine); font-size: 1.5rem; }
.filters-dialog-close {
  display: grid; place-items: center; width: 44px; height: 44px;
  border: 1px solid var(--line); border-radius: 50%; background: var(--card); color: var(--wine);
  font: 1.7rem/1 var(--sans); cursor: pointer;
}
.filters-dialog-close:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.filters-dialog-body { flex: 1; overflow: auto; padding: .5rem 0 1rem; }
.filters-dialog-body .filter-group {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 9rem), 1fr)); gap: .4rem;
  padding: .9rem 0; border-bottom: 1px solid var(--line);
}
.filters-dialog-body .filter-group:last-child { border-bottom: 0; }
.filters-dialog-body .filter-group::before {
  content: attr(aria-label); grid-column: 1 / -1;
  color: var(--wine); font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
}
.filters-dialog-body .filter-select { padding: .9rem 0; border-bottom: 1px solid var(--line); }
.filters-dialog-foot { display: flex; align-items: center; gap: .7rem; padding-top: .8rem; border-top: 1px solid var(--line); }
.filters-reset {
  flex: 0 0 auto; min-height: 44px; padding: .5rem .9rem;
  border: 1px solid var(--line); border-radius: 999px; background: var(--card); color: var(--wine);
  font: 600 .82rem var(--sans); cursor: pointer;
}
.filters-reset:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.filters-apply { flex: 1; min-height: 44px; text-align: center; }

/* ---------------- Grille catalogue ---------------- */
/* Nombre de colonnes imposé par palier : 2 sur mobile, 5 au maximum sur grand écran. */
.cat-grid {
  display: grid; gap: clamp(.7rem, 1.5vw, 1.15rem);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch; /* cartes d'une même ligne alignées, pied de carte poussé en bas */
}
.offers-page .cat-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 360px));
  justify-content: center; max-width: 1180px; margin-inline: auto;
  gap: clamp(1.1rem, 3vw, 2rem);
}
.offers-page .wine-visual { aspect-ratio: 5 / 4; }
.offers-page .wine-body { padding: 1rem 1.05rem 1.15rem; }
.offers-page .wine-card { --wine-card-bg: var(--surface-warm) !important; --wine-card-text: var(--wine) !important; --wine-card-accent: var(--brand-text) !important; --wine-card-border: var(--gold-soft) !important; }
.cat-grid .wine-card { align-self: stretch; }
.cat-grid .wine-body { flex: 1; }
/* Carte allégée sur téléphone : bouteille, nom sur deux lignes, prix et les deux
   actions validées. Le gabarit HTML reste partagé avec l'aperçu admin. */
.cat-grid .wine-appellation,
.cat-grid .wine-year { display: none; }
.cat-grid .wine-card-more { display: inline-flex; }
.catalogue-more { text-align: center; }
.btn-more {
  margin-top: 1.6rem; background: var(--card); border-color: var(--wine); color: var(--wine);
}
.btn-more:hover { background: var(--surface-warm); color: var(--wine); }
.btn-more:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.wine-card {
  background: var(--wine-card-bg, var(--card)); border: 1px solid var(--wine-card-border, var(--line)); border-radius: var(--radius);
  color: var(--wine-card-text, var(--ink));
  /* `stretch` plutôt que `start` : les cartes d'une même ligne s'alignent en bas
     même quand un nom tient sur deux lignes et le voisin sur une seule. */
  overflow: visible; align-self: stretch; display: flex; flex-direction: column;
  transition: transform .18s ease, box-shadow .18s ease;
}
.wine-card:hover, .wine-card:focus-within {
  position: relative; z-index: 2; transform: translateY(-3px); box-shadow: 0 14px 30px color-mix(in srgb, var(--shadow) 18%, transparent);
  border-color: color-mix(in srgb, var(--gold) 55%, transparent);
}
.wine-card-visual { position: relative; }
.wine-card-visual-link { position: relative; z-index: 1; display: block; color: inherit; text-decoration: none; }
.wine-card-visual-link:focus-visible { outline: 3px solid var(--focus); outline-offset: -3px; }
.wine-visual {
  position: relative; aspect-ratio: 4/3; display: grid; place-items: center; min-height: 0;
  background: radial-gradient(120% 120% at 50% 12%, var(--card-gradient-start) 0%, var(--card-gradient-end) 100%);
  border-bottom: 1px solid color-mix(in srgb, var(--gold) 32%, transparent); border-radius: var(--radius) var(--radius) 0 0;
}
.wine-card--doux { border-radius: 26px; }
.wine-card--doux .wine-visual { border-radius: 26px 26px 0 0; background: radial-gradient(120% 120% at 50% 15%, var(--card) 0%, var(--surface-warm) 100%); }
.wine-card--contour { border-width: 3px; box-shadow: inset 0 0 0 3px color-mix(in srgb, var(--wine-card-border, var(--line)) 18%, transparent); }
/* Les packshots sont calés dans le cadre plutôt que dimensionnés par leur taille
   intrinsèque : cela protège aussi les très grandes images PDF et les BIB larges. */
.wine-visual > svg, .wine-visual > img {
  position: absolute; left: 50%; bottom: .4rem; z-index: 1;
  height: calc(100% - 1.55rem); width: auto; max-width: 88%; object-fit: contain;
  transform: translateX(-50%); display: block;
  filter: drop-shadow(0 8px 12px color-mix(in srgb, var(--shadow) 20%, transparent));
  transition: transform .24s cubic-bezier(.2,.8,.2,1), filter .24s ease;
}
.wine-card:hover .wine-visual > svg, .wine-card:hover .wine-visual > img,
.wine-card:focus-within .wine-visual > svg, .wine-card:focus-within .wine-visual > img { z-index: 5; transform: translate(-50%, -30%) scale(1.03); filter: drop-shadow(0 14px 16px color-mix(in srgb, var(--shadow) 26%, transparent)); }
.wine-visual-meta { position: absolute; top: .5rem; left: .5rem; right: .5rem; z-index: 3; display: flex; flex-direction: column; align-items: flex-start; gap: .42rem; }
.wine-badges { display: flex; gap: .3rem; flex-wrap: wrap; }
.wine-card-certification { display: grid; place-items: center; width: 3rem; height: 3rem; padding: .2rem; border: 1px solid color-mix(in srgb, var(--gold) 45%, transparent); border-radius: .65rem; background: color-mix(in srgb, var(--card) 92%, transparent); box-shadow: 0 5px 12px color-mix(in srgb, var(--shadow) 12%, transparent); }
.wine-card-certification img { display: block; width: 100%; height: 100%; object-fit: contain; }
.wine-card-rewards {
  --wine-reward-size: 1.85rem; --wine-reward-expanded-size: 3rem;
  position: absolute; top: 58%; right: .35rem; z-index: 6;
  display: flex; align-items: center; justify-content: flex-end; width: var(--wine-reward-size); min-height: var(--wine-reward-size);
  margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; color: inherit; font: inherit; cursor: pointer;
  overflow: visible; transform: translateY(-50%); transition: left .22s ease, right .22s ease, width .22s ease, padding .22s ease, background .22s ease;
}
.wine-card-rewards img { position: static; flex: 0 0 var(--wine-reward-size); width: var(--wine-reward-size); height: var(--wine-reward-size); padding: 0; border: 0; border-radius: 0; background: transparent; object-fit: contain; transform-origin: center; filter: none; box-shadow: none; transition: width .22s ease, height .22s ease, margin .22s ease; }
.wine-card-rewards img + img { margin-left: calc(var(--wine-reward-size) * -.45); }
.wine-card-rewards[data-reward-count="1"] { cursor: default; }
.wine-card-rewards:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.wine-card-rewards[aria-expanded="true"]:not([data-reward-count="1"]) {
  right: .35rem; width: max-content; justify-content: flex-end; gap: .35rem; flex-wrap: nowrap; overflow: visible;
  padding: .25rem; border-radius: .7rem; background: color-mix(in srgb, var(--card) 92%, transparent); box-shadow: 0 8px 18px color-mix(in srgb, var(--shadow) 18%, transparent);
  transform: translateY(-50%);
}
.wine-card-rewards[aria-expanded="true"]:not([data-reward-count="1"]) img { flex-basis: var(--wine-reward-expanded-size); width: var(--wine-reward-expanded-size); height: var(--wine-reward-expanded-size); }
.wine-card-rewards[aria-expanded="true"]:not([data-reward-count="1"]) img + img { margin-left: 0; }
/* La translation au survol créerait un repère fixe local : on l'arrête quand
   le panneau mobile est ouvert, pour que ses bords restent ceux de l'écran. */
.wine-card:has(.wine-card-rewards[aria-expanded="true"]) { transform: none; }
@media (hover: hover) and (pointer: fine) {
  button.wine-card-rewards:not([data-reward-count="1"]):hover {
    right: .35rem; width: max-content; justify-content: flex-end; gap: .35rem; flex-wrap: nowrap; overflow: visible;
    padding: .25rem; border-radius: .7rem; background: color-mix(in srgb, var(--card) 92%, transparent); box-shadow: 0 8px 18px color-mix(in srgb, var(--shadow) 18%, transparent);
    transform: translateY(-50%);
  }
  button.wine-card-rewards:not([data-reward-count="1"]):hover img { flex-basis: var(--wine-reward-expanded-size); width: var(--wine-reward-expanded-size); height: var(--wine-reward-expanded-size); }
  button.wine-card-rewards:not([data-reward-count="1"]):hover img + img { margin-left: 0; }
}
.wine-card-visual:has(.wine-card-rewards) .wine-visual > svg, .wine-card-visual:has(.wine-card-rewards) .wine-visual > img { left: 45%; }
@media (min-width: 640px) and (max-width: 899px) {
  .wine-card-rewards { --wine-reward-size: 2rem; --wine-reward-expanded-size: 3.25rem; }
}
.wine-card--unavailable { filter: saturate(.22); }
.wine-card--unavailable .wine-visual { opacity: .58; }
.wine-unavailable-status { display: inline-flex; width: fit-content; margin-top: .65rem; padding: .35rem .65rem; border: 1px solid currentColor; border-radius: 999px; color: var(--wine-card-accent); font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; }
.wine-card--unavailable .wine-card-add:disabled { cursor: not-allowed; opacity: .72; background: color-mix(in srgb, var(--wine-card-bg) 76%, var(--muted)); color: var(--wine-card-text); }
.wine-badge {
  font-size: .72rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase;
  padding: .2rem .5rem; border: 1px solid var(--line); border-radius: 999px; color: var(--text); background: var(--surface);
}
.wine-badge--rouge { background: var(--badge-rouge-bg); color: var(--badge-rouge-text); }
.wine-badge--blanc { background: var(--badge-blanc-bg); color: var(--badge-blanc-text); }
.wine-badge--rosé { background: var(--badge-rose-bg); color: var(--badge-rose-text); }
.wine-badge--effervescent { background: var(--badge-bulles-bg); color: var(--badge-bulles-text); }
.wine-badge--prestige { background: var(--gold); color: var(--on-brand); }
.wine-badge--promo { background: var(--promo); color: var(--on-dark); }
/* Corps volontairement dense : cépages et dégustation sont réservés à la fiche complète. */
.wine-body { padding: .62rem .72rem .7rem; display: flex; flex-direction: column; gap: .1rem; flex: 1; color: inherit; font-size: var(--wine-card-body-size, .95rem); }
.wine-domain { color: inherit; font-size: .7rem; font-weight: 700; letter-spacing: .08em; opacity: .78; text-transform: uppercase; }
.wine-appellation {
  font-size: .75rem; text-transform: uppercase; letter-spacing: .1em; font-weight: 700;
  /* `--brand-text` et non `--brand` : l'orange de marque tombe à 3,76:1 sur le
     fond clair des cartes. Il reste réservé aux boutons et aux aplats. */
  color: var(--wine-card-accent, var(--brand-text));
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
}
.wine-name {
  font-family: var(--serif); font-size: var(--wine-card-name-size, 1.08rem); line-height: 1.14;
  color: var(--wine-card-text, var(--wine)); margin: .12rem 0 0; letter-spacing: .035em; text-transform: uppercase;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
}
.wine-name a { display: flex; align-items: center; min-height: 44px; color: inherit; text-decoration: none; }
.wine-name a:hover { text-decoration: underline; text-underline-offset: .16em; }
.wine-name a:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.wine-foot { margin-top: auto; padding-top: .6rem; display: flex; align-items: baseline; justify-content: space-between; gap: .4rem; border-top: 1px solid color-mix(in srgb, var(--gold) 38%, transparent); }
.wine-prices { display: inline-flex; align-items: baseline; gap: .38rem; flex-wrap: wrap; }
.wine-price-group { display: inline-flex; align-items: baseline; gap: .25rem; }
.wine-price { font-family: var(--serif); font-size: 1.2rem; font-weight: 700; color: var(--wine-card-text, var(--wine)); }
/* Promotion : le tarif remisé passe en orange, l'ancien prix reste lisible
   en bleu, barré en orange pour montrer d'où part la remise. */
.wine-price--promo { color: var(--promo); }
.wine-price-old {
  font-family: var(--serif); font-size: .92rem; font-weight: 600; color: var(--promo-old);
  text-decoration: line-through; text-decoration-color: var(--promo); text-decoration-thickness: 2px;
}
.offers-page .wine-prices { align-items: flex-end; gap: .7rem; }
.offers-page .wine-price-group { display: grid; align-items: end; gap: .08rem; }
.offers-page .wine-price-label.visually-hidden { position: static; width: auto; height: auto; overflow: visible; clip: auto; white-space: nowrap; color: inherit; opacity: .72; font: 700 .58rem/1.2 var(--sans); letter-spacing: .06em; text-transform: uppercase; }
.wine-year { font-size: .75rem; color: inherit; opacity: .78; text-align: right; }
.wine-card-more { display: inline-flex; align-items: center; min-height: 44px; align-self: flex-start; margin-top: .3rem; color: var(--wine-card-accent, var(--brand-text)); font-size: .78rem; font-weight: 700; text-decoration: none; }
.wine-card-more:hover { text-decoration: underline; text-underline-offset: .16em; }
.wine-card-more:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
@media (max-width: 639px) {
  /* Deux colonnes rendent certaines cartes trop étroites pour quatre emblèmes.
     Le panneau tactile se centre donc dans la fenêtre, sans scroll interne. */
  .wine-card-rewards[aria-expanded="true"]:not([data-reward-count="1"]) {
    position: fixed; top: 50%; left: 1rem; right: 1rem; z-index: 70; width: auto; justify-content: center; transform: translateY(-50%);
  }

  /* Sur les cartes étroites, le nom reste une information complète : il peut
     gagner une ligne plutôt que d'être coupé au milieu d'une référence. */
  .wine-name {
    display: block; overflow: visible; letter-spacing: .015em;
    -webkit-line-clamp: unset;
  }
  .wine-name a { min-height: 0; padding-block: .32rem; align-items: flex-start; }
}
.wine-call { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; margin-top: 1rem; padding: .65rem 1rem; border-radius: 999px; background: var(--brand); color: var(--on-brand); font-weight: 600; font-size: .85rem; text-decoration: none; }
.wine-call:hover { background: var(--brand); }
.wine-call:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.wine-sheet-technical-link,
.wine-product-technical-link { margin-top: 1.2rem; }
.wine-technical-link { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .68rem 1rem; border: 1px solid var(--gold); border-radius: 999px; color: var(--gold-strong); font-weight: 700; text-decoration: none; }
.wine-technical-link:hover { background: var(--gold); color: var(--on-brand); }
.wine-technical-link:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.empty { text-align: center; color: var(--muted); padding: 2rem; }

/* Fiche catalogue : une fenêtre stable au-dessus de la page, sans déformer la grille. */
.wine-sheet {
  width: min(680px, calc(100% - 2rem)); max-height: min(760px, calc(100dvh - 2rem));
  padding: 0; border: 0; border-radius: 18px; color: var(--ink); background: transparent;
  box-shadow: 0 30px 80px color-mix(in srgb, var(--shadow) 45%, transparent);
}
.wine-sheet::backdrop { background: color-mix(in srgb, var(--shadow) 66%, transparent); backdrop-filter: blur(4px); }
.wine-sheet-panel { position: relative; max-height: inherit; overflow: auto; padding: clamp(1.5rem, 4vw, 2.4rem); background: var(--card); }
.wine-sheet-close {
  position: absolute; top: .8rem; right: .8rem; display: grid; place-items: center; width: 2.35rem; height: 2.35rem;
  border: 1px solid var(--line); border-radius: 50%; background: var(--card); color: var(--wine); font: 1.7rem/1 var(--sans); cursor: pointer;
}
.wine-sheet-close:hover { background: var(--surface-warm); }
.wine-sheet-close:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.wine-sheet-region { margin: 0 3rem .25rem 0; color: var(--brand-text); font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.wine-sheet h2 { color: var(--wine); font-size: clamp(2rem, 6vw, 2.8rem); }
.wine-sheet-appellation { margin: .2rem 0 1.5rem; color: var(--muted); font-style: italic; }
.wine-sheet-visual {
  display: grid; place-items: center; min-height: min(58vw, 330px); margin: 0 0 1.5rem; padding: 1rem;
  border: 1px solid color-mix(in srgb, var(--gold) 45%, transparent); border-radius: 14px;
  background: radial-gradient(circle at 50% 18%, var(--card) 0%, var(--surface-warm) 100%);
}
.wine-sheet-visual img, .wine-sheet-visual svg { display: block; width: auto; max-width: 100%; height: min(58vw, 330px); max-height: 48dvh; object-fit: contain; filter: drop-shadow(0 14px 13px color-mix(in srgb, var(--shadow) 22%, transparent)); }
.wine-sheet-details { display: grid; gap: .85rem; margin: 0; }
.wine-sheet-details div { display: grid; grid-template-columns: 1fr; gap: .2rem; padding-top: .75rem; border-top: 1px solid var(--line); }
.wine-sheet-details [hidden], .wine-sheet-pairings[hidden] { display: none !important; }
.wine-sheet-section { margin-top: 1.35rem; padding-top: .9rem; border-top: 1px solid color-mix(in srgb, var(--gold) 38%, transparent); }
.wine-sheet-section h3 { margin: 0 0 .55rem; color: var(--gold-strong); font: 700 .75rem var(--sans); letter-spacing: .14em; text-transform: uppercase; }
.wine-sheet-details dt, .wine-sheet-pairings p { color: var(--wine); font-size: .74rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.wine-sheet-details dd { margin: 0; color: var(--text-muted); font-size: .92rem; line-height: 1.5; }
.wine-sheet-pairings { margin-top: 1.2rem; padding-top: .8rem; border-top: 1px solid var(--line); }
.wine-sheet-pairings p { margin: 0 0 .55rem; }
.wine-sheet-pairings ul { display: flex; flex-wrap: wrap; gap: .45rem; list-style: none; padding: 0; margin: 0; }
.wine-sheet-pairings li { padding: .25rem .58rem; border: 1px solid color-mix(in srgb, var(--gold) 45%, transparent); border-radius: 999px; background: var(--surface-warm); color: var(--text); font-size: .78rem; }
.wine-share { margin-top: 1.4rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.wine-share > p:first-child { margin: 0 0 .55rem; color: var(--wine); font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.wine-share-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.wine-share-actions > * { flex: 1 1 calc(50% - .5rem); }
.wine-share-actions button, .wine-share-actions a { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: .5rem .75rem; border: 1px solid var(--line); border-radius: 999px; background: var(--card); color: var(--wine); font: 700 .78rem var(--sans); text-decoration: none; cursor: pointer; }
.wine-share-actions button:hover, .wine-share-actions a:hover { border-color: var(--accent); background: var(--surface-warm); }
.wine-share-actions button:focus-visible, .wine-share-actions a:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.wine-share-feedback { min-height: 1.25rem; margin: .55rem 0 0; color: var(--muted); font-size: .78rem; }

/* ---------------- Collections ---------------- */
.collection {
  /* Couleurs pilotées par l'administration : elles ne redéfinissent que cette section.
     Sans variable transmise, la déclaration est invalide et le jeton global reste hérité. */
  --header-banner: var(--collection-background);
  --on-dark: var(--collection-text);
  --brand: var(--collection-accent);
  --brand-text: var(--collection-accent);
  --text-muted: color-mix(in srgb, var(--collection-text) 78%, transparent);
  background: linear-gradient(145deg, color-mix(in srgb, var(--header-banner) 94%, var(--brand)), var(--header-banner));
  border-top: 1px solid color-mix(in srgb, var(--brand) 34%, transparent);
  color: var(--on-dark);
  padding: clamp(3rem, 7vw, 6rem) 0 clamp(2.5rem, 6vw, 5rem);
}
.collection .section-head { padding: 0 clamp(1rem, 4vw, 3rem); }
.collection .section-head--light h1, .collection .section-head--light h2 { color: var(--on-dark); }
.collection .section-head--light p { color: color-mix(in srgb, var(--on-dark) 76%, transparent); }
.collection .section-head--light .prestige-eyebrow { color: var(--brand); }
.prestige-eyebrow { text-transform: uppercase; letter-spacing: .28em; font-size: .78rem; color: var(--brand); }

.prestige-stage {
  position: relative; display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1rem, 3vw, 2rem);
  align-items: stretch;
  max-width: 1380px; margin: 0 auto; padding: 0 clamp(1rem, 3vw, 2.5rem);
}

/* La photo et la bouteille appartiennent à la même scène : elles défilent ensemble. */
.prestige-carousel { order: 1; min-width: 0; outline: none; }
.prestige-carousel:focus-visible { outline: 2px solid var(--brand); outline-offset: 5px; border-radius: 18px; }
.prestige-table {
  position: relative; isolation: isolate; min-height: min(78vw, 340px); overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--brand) 52%, transparent); border-radius: 18px;
  background-image:
    linear-gradient(180deg, color-mix(in srgb, var(--collection-overlay, var(--header-banner)) 18%, transparent) 0%, color-mix(in srgb, var(--collection-overlay, var(--header-banner)) 8%, transparent) 45%, color-mix(in srgb, var(--collection-overlay, var(--header-banner)) 72%, transparent) 100%),
    var(--collection-image, url("images/table-prestige.jpg"));
  background-position: center center; background-size: cover; background-attachment: scroll;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--on-dark) 10%, transparent), 0 22px 48px color-mix(in srgb, var(--shadow) 35%, transparent);
  /* Le balayage horizontal change de vin ; le défilement vertical reste au navigateur. */
  touch-action: pan-y;
}
.prestige-bottle-scene { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.bottle-contact-shadow {
  position: absolute; left: 50%; bottom: 11%; width: clamp(120px, 18vw, 175px); height: 26px;
  border-radius: 50%; background: color-mix(in srgb, var(--shadow) 64%, transparent); filter: blur(9px); transform: translateX(-50%);
}
.prestige-bottle {
  position: absolute; left: 50%; bottom: 11%; z-index: 1; display: flex; align-items: end; justify-content: center;
  height: min(56vw, 250px); width: min(20vw, 90px);
  filter: drop-shadow(0 13px 8px color-mix(in srgb, var(--shadow) 48%, transparent)); transform: translateX(-50%); opacity: 1;
  transition: transform .36s cubic-bezier(.2,.8,.2,1), opacity .22s ease;
}
.prestige-bottle svg, .prestige-bottle img { width: 100%; height: 100%; object-fit: contain; display: block; }
.prestige-bottle--previous, .prestige-bottle--next {
  z-index: 0; bottom: 9%; height: min(44vw, 200px); width: min(16vw, 68px); opacity: .45;
  filter: drop-shadow(0 8px 7px color-mix(in srgb, var(--shadow) 36%, transparent));
  transition: transform .36s cubic-bezier(.2,.8,.2,1), opacity .22s ease;
}
.prestige-bottle--previous { left: 17%; transform: translateX(-50%) scale(.78); }
.prestige-bottle--next { left: 83%; transform: translateX(-50%) scale(.78); }
.prestige-arrow {
  position: absolute; top: 50%; z-index: 2; width: 3rem; height: 3rem; padding: 0;
  border: 1px solid color-mix(in srgb, var(--on-dark) 58%, transparent); border-radius: 50%; background: color-mix(in srgb, var(--header-banner) 78%, transparent); color: var(--on-dark);
  font-family: var(--serif); font-size: 2rem; line-height: 1; cursor: pointer; transform: translateY(-50%);
  transition: background .18s ease, transform .18s ease;
}
.prestige-arrow:hover { background: var(--brand); color: var(--on-brand); transform: translateY(-50%) scale(1.07); }
.prestige-arrow:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.prestige-arrow--previous { left: .9rem; }
.prestige-arrow--next { right: .9rem; }
.prestige-picker { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .4rem .65rem; align-items: center; margin-top: .8rem; }
.prestige-picker label { grid-column: 1 / -1; color: color-mix(in srgb, var(--on-dark) 78%, transparent); font-size: .76rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.prestige-picker select { width: 100%; max-width: 100%; min-width: 0; min-height: 44px; padding: .55rem .75rem; border: 1px solid color-mix(in srgb, var(--brand) 52%, transparent); border-radius: 9px; background: var(--card); color: var(--text); font: 600 .86rem var(--sans); }
.prestige-picker select:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.prestige-counter { margin: 0; color: color-mix(in srgb, var(--on-dark) 72%, transparent); font-size: .8rem; font-weight: 600; letter-spacing: .08em; white-space: nowrap; }

/* Carte du sommelier */
.menu-card {
  /* La carte a ses propres couleurs, indépendantes du fond de la collection. */
  --header-banner: var(--collection-card-background);
  --on-dark: var(--collection-card-text);
  --brand: var(--collection-card-accent);
  --brand-text: var(--collection-card-accent);
  --text-muted: color-mix(in srgb, var(--collection-card-text) 74%, transparent);
  order: 2; align-self: stretch;
  background: color-mix(in srgb, var(--header-banner) 88%, transparent);
  color: var(--on-dark);
  border-radius: 18px;
  padding: 1.2rem 1.1rem;
  box-shadow: 0 24px 50px color-mix(in srgb, var(--shadow) 45%, transparent);
  border: 1px solid color-mix(in srgb, var(--brand) 48%, transparent);
  position: relative;
  min-height: auto;
  /* Colonne : le corps absorbe les textes longs, les actions restent en bas. */
  display: flex; flex-direction: column;
  transition: opacity .25s ease;
}
.menu-card-body { min-height: 0; }
.menu-card::before {
  content: ""; position: absolute; inset: 8px; border: 1px solid color-mix(in srgb, var(--brand) 22%, transparent);
  border-radius: 12px; pointer-events: none;
}
.menu-card-region { text-transform: uppercase; letter-spacing: .2em; font-size: .7rem; color: var(--brand); margin: 0 0 .3rem; }
.menu-card-name { font-family: var(--serif); font-size: 1.6rem; color: var(--on-dark); line-height: 1.05; }
.menu-card-appellation { font-style: italic; color: var(--text-muted); margin: .2rem 0 1rem; }
.menu-card-specs { display: grid; grid-template-columns: 1fr; gap: .5rem; margin: 0 0 1rem; padding: .8rem 0; border-top: 1px solid color-mix(in srgb, var(--brand) 25%, transparent); border-bottom: 1px solid color-mix(in srgb, var(--brand) 25%, transparent); }
.menu-card-specs div { display: flex; justify-content: space-between; gap: 1rem; }
.menu-card-specs [hidden], .menu-card-note[hidden] { display: none !important; }
.menu-card-specs dt { font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: var(--brand); }
.menu-card-specs dd { margin: 0; font-size: .85rem; text-align: right; font-weight: 500; }
.menu-card-note { font-size: .85rem; margin: .45rem 0; color: var(--text-muted); }
.menu-card-note strong { color: var(--brand-text); }
.menu-card-price { font-family: var(--serif); font-size: 1.7rem; font-weight: 600; color: var(--on-dark); margin: 1rem 0 0; text-align: right; }
.menu-card.is-swapping { opacity: .35; }

/* ---------------- À propos ---------------- */
.about { display: grid; grid-template-columns: 1fr; gap: clamp(1.5rem, 3vw, 2.5rem); align-items: center; }
.about-text h2 { color: var(--wine); font-size: clamp(1.9rem, 4vw, 2.6rem); margin-bottom: .8rem; }
.about-text p { color: var(--text-muted); margin: 0 0 1rem; }
.about-points { list-style: none; padding: 0; margin: 0; display: grid; gap: .8rem; }
.about-points li { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 1rem 1.2rem; }
.about-points strong { display: block; color: var(--wine); font-family: var(--serif); font-size: 1.2rem; }
.about-points span { font-size: .9rem; color: var(--muted); }

/* ---------------- Page La Cave ---------------- */
.cave-intro { display: grid; gap: clamp(2rem, 6vw, 5rem); align-items: center; max-width: 1120px; }
.cave-intro-copy { max-width: 640px; }
.cave-intro-copy h1 { margin: 0 0 1rem; color: var(--wine); font-size: clamp(2.3rem, 10.5vw, 4rem); line-height: .98; }
.cave-title-line { display: block; }
.cave-intro-copy > p:not(.catalogue-page-eyebrow):not(.cave-owner) { color: var(--text-muted); font-size: clamp(1rem, 2vw, 1.14rem); }
.cave-intro-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.cave-owner { display: grid; gap: .1rem; margin: 1.5rem 0; }
.cave-owner span { color: var(--brand-text); font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.cave-owner strong { color: var(--wine); font: 700 1.55rem/1.15 var(--serif); }
.cave-portrait { margin: 0; display: grid; place-items: center; }
.cave-portrait-bubble { display: block; width: min(78vw, 430px); aspect-ratio: 1023 / 1537; overflow: hidden; border: clamp(6px, 1vw, 11px) solid color-mix(in srgb, var(--accent) 78%, var(--card)); border-radius: 30px; background: var(--card); box-shadow: 0 26px 55px color-mix(in srgb, var(--shadow) 30%, transparent); }
.cave-portrait img { width: 100%; height: 100%; object-fit: contain; object-position: center; }
.cave-pillars-section { padding-top: clamp(2rem, 5vw, 4rem); }
.cave-pillars { display: grid; grid-template-columns: 1fr; gap: .8rem; }
.cave-pillar { min-width: 0; padding: clamp(1.15rem, 3vw, 1.7rem); border: 1px solid var(--line); border-radius: 16px; background: var(--card); box-shadow: 0 12px 28px color-mix(in srgb, var(--shadow) 10%, transparent); }
.cave-pillar > strong { display: block; color: var(--accent); font: 700 clamp(2.2rem, 8vw, 3.5rem)/1 var(--serif); }
.cave-pillar h3 { margin: .7rem 0 .3rem; color: var(--wine); font-size: clamp(1.15rem, 3vw, 1.4rem); }
.cave-pillar p { margin: 0; color: var(--muted); font-size: .88rem; }

/* ---------------- Demande de dégustation ---------------- */
.degustation-page { width: min(100% - 2rem, 1120px); margin: 0 auto; }
.degustation-layout { display: grid; gap: clamp(1.25rem, 4vw, 3rem); align-items: start; max-width: 1080px; margin: 0 auto; }
.degustation-note, .degustation-form { padding: clamp(1.2rem, 3vw, 1.8rem); border: 1px solid var(--line); border-radius: 16px; background: var(--card); }
.degustation-request-panel { display: grid; gap: 1rem; }
.degustation-events-head { margin-bottom: 1rem; }
.degustation-events-head h2 { font-size: clamp(2rem, 5vw, 3rem); }
.degustation-events-grid { display: grid; gap: 1rem; }
.degustation-event-card { overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: var(--card); }
.degustation-event-card img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.degustation-event-card > div { display: grid; gap: .5rem; padding: 1rem; }
.degustation-event-card p { margin: 0; color: var(--brand-text); font-size: .74rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.degustation-event-card h3 { margin: 0; color: var(--wine); font: 700 1.65rem/1 var(--serif); }
.degustation-event-card span { color: var(--muted); line-height: 1.55; }
.degustation-event-card button { justify-self: start; min-height: 44px; padding: .6rem .9rem; border: 1px solid var(--gold); border-radius: 999px; background: transparent; color: var(--gold-strong); font: inherit; font-weight: 800; cursor: pointer; }
.degustation-note h2 { color: var(--wine); font-size: clamp(1.7rem, 4vw, 2.3rem); }
.degustation-note p { margin: .8rem 0 0; color: var(--muted); }
.degustation-note strong { color: var(--brand-text); }
.degustation-form { border-top: 1px solid var(--line); }
.degustation-submit { width: 100%; min-height: 50px; }

/* ---------------- Contact ---------------- */
.contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.4rem; max-width: 820px; margin: 0 auto; }
.contact-block { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.6rem 1.8rem; }
.contact-block h3 { color: var(--wine); font-size: 1.4rem; margin-bottom: .8rem; }
.contact-block a { color: var(--brand-text); text-decoration: none; }
.contact-block p a { display: inline-flex; align-items: center; min-height: 44px; max-width: 100%; overflow-wrap: anywhere; }
.contact-block a:hover { text-decoration: underline; }
.horaires { list-style: none; padding: 0; margin: 0; }
.horaires li { display: flex; justify-content: space-between; gap: 1rem; padding: .35rem 0; border-bottom: 1px dashed var(--line); font-size: .9rem; }
.horaires li:last-child { border-bottom: none; }
.contact-directions { display: inline-flex; align-items: center; min-height: 44px; margin-top: .7rem; padding: .45rem .8rem; border: 1px solid currentColor; border-radius: 999px; font-weight: 600; }
.contact-directions:hover { background: var(--accent); border-color: var(--accent); color: var(--on-brand) !important; text-decoration: none !important; }
.contact-hours-note { margin: .8rem 0 0; color: var(--muted); font-size: .78rem; line-height: 1.4; }
.contact-socials { margin-top: 1rem; display: flex; gap: .8rem; }
.contact-socials a { font-size: .85rem; }
.contact-head-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: .7rem; margin-top: 1.1rem; }

.legal-page { width: min(760px, calc(100% - 2rem)); margin: 0 auto; padding: clamp(2.5rem, 7vw, 5.5rem) 0; }
.legal-page > a:first-child { display: inline-flex; align-items: center; min-height: 44px; margin-bottom: 1.3rem; color: var(--brand-text); text-decoration: none; }
.legal-page h1 { max-width: 15ch; color: var(--wine); font-size: clamp(2.4rem, 8vw, 4.4rem); }
.legal-page h2 { margin: 2rem 0 .55rem; color: var(--wine); font-size: clamp(1.45rem, 4vw, 1.9rem); }
.legal-page p, .legal-page li { color: var(--text-muted); }
.legal-page ul { display: grid; gap: .55rem; padding-left: 1.25rem; }
.legal-page a { color: var(--brand-text); text-underline-offset: .2rem; }

.not-found-page { min-height: min(720px, calc(100svh - var(--header-offset))); display: grid; place-items: center; width: min(760px, calc(100% - 2rem)); margin: 0 auto; padding: clamp(3rem, 10vw, 7rem) 0; text-align: center; }
.not-found-page > div { display: grid; justify-items: center; }
.not-found-page .catalogue-page-eyebrow { margin-bottom: .7rem; }
.not-found-page h1 { max-width: 13ch; color: var(--wine); font-size: clamp(2.7rem, 10vw, 5.2rem); }
.not-found-page p:not(.catalogue-page-eyebrow) { max-width: 52ch; margin: 1rem 0 1.5rem; color: var(--text-muted); }
.not-found-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .65rem; }
.about--single { grid-template-columns: minmax(0, 760px); justify-content: center; }
.catalogue-empty { max-width: 680px; margin: 2rem auto; padding: clamp(1.5rem, 4vw, 2.5rem); border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); }
.catalogue-empty h2 { margin: 0 0 .65rem; color: var(--wine); font-size: clamp(1.5rem, 4vw, 2.1rem); }
.catalogue-empty p { margin: 0; color: var(--muted); }
.catalogue-empty .btn { margin-top: 1.15rem; }

/* ---------------- Pied ---------------- */
.site-footer { background: var(--surface-warm); color: var(--text-muted); padding: clamp(2.5rem, 6vw, 4.5rem) clamp(1rem, 4vw, 3rem) calc(1.25rem + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); font-size: .86rem; }
.site-footer-grid { width: min(1180px, 100%); margin: 0 auto; display: grid; gap: 2rem; }
.site-footer-column h2 { margin: 0 0 .85rem; color: var(--wine); font: 700 1.15rem/1.2 var(--serif); }
.site-footer-column ul { display: grid; gap: .48rem; margin: 0; padding: 0; list-style: none; }
.site-footer-column li { line-height: 1.5; }
.site-footer a { display: inline-flex; align-items: center; min-height: 44px; color: var(--brand-text); text-decoration: none; text-underline-offset: .18rem; }
.site-footer a:hover { text-decoration: underline; }
.site-footer-brand { display: inline-flex; margin-bottom: .9rem; }
.site-footer-brand .brand-name { max-width: 19rem; color: var(--wine); font-size: clamp(1.25rem, 4vw, 1.65rem); white-space: normal; }
.site-footer-identity p { max-width: 27rem; margin: 0 0 .45rem; color: var(--wine); font: 600 1.15rem/1.25 var(--serif); }
.site-footer-identity > span { display: block; }
.site-footer-hours-note { color: var(--muted); font-size: .78rem; }
.site-footer-bottom { width: min(1180px, 100%); margin: 2.25rem auto 0; padding-top: 1.2rem; border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .55rem 1rem; text-align: center; font-size: .78rem; }
.site-footer-bottom > * { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; line-height: 1.4; }
.site-footer-admin { color: var(--muted) !important; }

/* ============================================================
   Palier 640 px — la grille passe à trois colonnes
   ============================================================ */
@media (min-width: 640px) {
  .filters--offers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .region-explorer { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .budget-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cave-pillars { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .site-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-since-inner { grid-template-columns: minmax(180px, .55fr) minmax(0, 1.45fr); align-items: center; }
  .home-universe-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-universe--crus { grid-column: 1 / -1; }
  .cat-grid.cat-grid--selection { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .home-contact-strip { grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr); align-items: center; }
  .home-contact-actions { justify-content: flex-end; }
}

@media (min-width: 360px) and (max-width: 639px) {
  .filters--offers { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: .8rem; }
}

/* ============================================================
   Palier 900 px — mise en page grand écran
   Au-delà de ce palier le rendu reprend celui d'avant la refonte.
   ============================================================ */
@media (min-width: 900px) {
  body { padding-bottom: 0; }

  .mobile-bar { display: none; }
  .filters-toggle { display: none; }
  .hero-directions { display: none; }

  .site-header { padding: .9rem clamp(1rem, 4vw, 3rem); }
  .brand-logo { width: 7.05rem; height: 7.05rem; }
  .site-nav { display: flex; }
  .brand-name { --brand-name-size: 1.35rem; }

  .hero {
    min-height: min(700px, calc(100svh - 5.5rem));
    padding: clamp(2.75rem, 6vw, 5.25rem) clamp(1rem, 4vw, 3rem) clamp(2.5rem, 5vw, 3.75rem);
  }
  .hero::after { background: linear-gradient(90deg, rgba(7, 10, 8, .82) 0%, rgba(7, 10, 8, .7) 28%, rgba(7, 10, 8, .5) 48%, rgba(7, 10, 8, .22) 70%, rgba(7, 10, 8, .06) 88%, transparent 100%); }
  .hero-grid { width: 100%; grid-template-columns: minmax(0, 1fr); }
  .hero-inner { display: block; max-width: 660px; }
  .hero-eyebrow { font-size: .78rem; margin: 0 0 1rem; }
  .hero-subtitle { margin: .5rem 0 0; }
  .hero-lede { max-width: 54ch; margin: 1rem 0 1.5rem; font-size: clamp(1.05rem, 2vw, 1.2rem); }
  .hero-hours { margin: .2rem 0 1.45rem; }
  .hero-actions { gap: .75rem; }
  .hero-actions .btn { flex: 0 0 auto; text-align: left; }
  .hero-call { display: inline-flex; }
  .hero-prestige-link { width: auto; text-align: left; }

  .section-head h1, .section-head h2 { font-size: clamp(2rem, 4.5vw, 3rem); }

  .filters { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; max-width: 1180px; margin: 0 auto 1.4rem; align-items: end; }
  .filters--offers { grid-template-columns: repeat(5, minmax(0, 1fr)); max-width: 1180px; }
  .filters > .filter-group { display: grid; min-width: 0; padding: .8rem; border: 1px solid var(--line); border-radius: 12px; background: color-mix(in srgb, var(--card) 72%, transparent); }
  .filters > .filter-select { display: grid; min-width: 0; padding: 0; border: 0; border-radius: 0; background: transparent; }
  .filter-group::before { content: attr(aria-label); grid-column: 1 / -1; color: var(--wine); font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
  .filters:not(.filters--offers) { grid-template-columns: 185px 180px 200px 175px; justify-content: start; }
  .filters:not(.filters--offers) .search { grid-column: 1 / -1; }
  .search input { min-width: 0; }
  .catalogue-page[data-catalogue-root] .filters:not(.filters--offers):has(> .filter-select:nth-child(3) + .search) {
    grid-template-columns: 185px 180px 200px;
  }

  .wine-card-rewards { --wine-reward-size: 2rem; --wine-reward-expanded-size: 3.25rem; }

  .cat-grid { grid-template-columns: repeat(var(--catalogue-tablet-columns, 4), minmax(0, 1fr)); }
  .region-explorer-card { min-height: 172px; padding: 1.2rem; }
  .cat-grid .wine-appellation,
  .cat-grid .wine-card-more { display: inline-flex; }
  .cat-grid .wine-year { display: block; }

  .wine-share-actions > * { flex: 0 1 auto; }
  .wine-sheet-details div { grid-template-columns: minmax(5.2rem, .38fr) 1fr; gap: 1rem; }

  .prestige-stage { display: block; }
  .prestige-carousel { order: 0; width: 100%; }
  .prestige-table { min-height: clamp(520px, 54vw, 680px); touch-action: auto; }
  .prestige-bottle { height: clamp(265px, 34vw, 405px); width: clamp(94px, 12vw, 145px); }
  .prestige-bottle--previous, .prestige-bottle--next { height: clamp(190px, 24vw, 285px); width: clamp(66px, 8vw, 100px); }
  .prestige-picker { grid-template-columns: minmax(0, 1fr) auto; width: calc(100% - 390px); }
  .prestige-arrow--next { right: calc(min(360px, 32%) + clamp(2.7rem, 6vw, 6.4rem)); z-index: 4; }
  /* Hauteur fixe : la carte garde la même taille quel que soit le vin affiché,
     les fiches très bavardes défilent à l'intérieur au lieu de déborder de la photo. */
  .menu-card { position: absolute; top: 50%; right: clamp(1.8rem, 5vw, 5.5rem); z-index: 3; width: min(360px, 32%); height: clamp(430px, 42vw, 560px); max-height: calc(100% - 2.5rem); padding: 1.6rem 1.5rem; overflow: hidden; transform: translateY(-49%); backdrop-filter: blur(16px); }
  .menu-card-body { flex: 1; display: flex; flex-direction: column; overflow-y: auto; padding-right: .45rem; scrollbar-width: thin; overscroll-behavior: contain; }
  /* Fiche courte : le prix se cale en bas plutôt que de laisser un grand vide. */
  .menu-card-body .menu-card-price { margin-top: auto; }
  .menu-card-name { font-size: 1.9rem; }

  .about { grid-template-columns: minmax(0, 1.2fr) minmax(0, .9fr); }
  .about.about--single { grid-template-columns: minmax(0, 760px); }
  .home-collection-teaser { grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr); }
  .home-universe-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .home-universe, .home-universe--france, .home-universe--world, .home-universe--crus { grid-column: auto; grid-template-columns: none; grid-template-rows: 310px minmax(0, 1fr); min-height: 535px; }
  .home-universe figure, .home-universe--france figure, .home-universe--world figure, .home-universe--crus figure { min-height: 310px; }
  .home-budget-band .section { grid-template-columns: minmax(0, .82fr) minmax(420px, 1.18fr); align-items: center; }
  .home-budget-intro { text-align: left; }
  .home-cavist { grid-template-columns: minmax(320px, .82fr) minmax(0, 1.18fr); }
  .cave-intro { grid-template-columns: minmax(0, 1.05fr) minmax(320px, .95fr); }
  .degustation-layout { grid-template-columns: minmax(0, 1.8fr) minmax(290px, 1fr); }
  .site-footer-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .site-footer--compact .site-footer-grid { grid-template-columns: 1.2fr 1fr 1fr; }
  .site-footer-bottom { justify-content: space-between; text-align: left; }
}

@media (min-width: 1180px) {
  .filters:not(.filters--offers) {
    grid-template-columns: 185px 180px 200px 175px minmax(280px, 1fr);
  }
  .filters:not(.filters--offers) .search { grid-column: auto; }
  .catalogue-page[data-catalogue-root] .filters:not(.filters--offers):has(> .filter-select:nth-child(3) + .search) {
    grid-template-columns: 185px 180px 200px minmax(300px, 1fr);
  }
}

/* ============================================================
   Palier 1120 px — nombre de colonnes choisi dans l'administration
   ============================================================ */
@media (min-width: 1120px) {
  .cat-grid { grid-template-columns: repeat(var(--catalogue-desktop-columns), minmax(0, 1fr)); }
  .wine-card-rewards { --wine-reward-size: 2.25rem; --wine-reward-expanded-size: 3.5rem; }
  .site-footer-bottom { flex-wrap: nowrap; }
}

/* Le bandeau garde sa présence en haut de page puis libère de la place dès
   que la visite commence. Navigation et cibles tactiles restent intactes. */
.site-header.is-compact { padding-block: .24rem; background: var(--header-bg-strong); box-shadow: 0 1px 0 var(--line), 0 8px 22px color-mix(in srgb, var(--shadow) 18%, transparent); }
.site-header.is-compact .brand-logo { width: 3.5rem; height: 3.5rem; }
.site-header.is-compact .brand-name { --brand-name-size: .98rem; }

@media (min-width: 900px) {
  .site-header.is-compact { padding-block: .32rem; }
  .site-header.is-compact .brand-logo { width: 4.25rem; height: 4.25rem; }
  .site-header.is-compact .brand-name { --brand-name-size: 1.05rem; }
}

/* Tant que la navigation complète reste repliée, l'en-tête garde le gabarit
   intermédiaire plutôt que d'occuper près d'un cinquième d'un écran tablette. */
@media (min-width: 900px) and (max-width: 1399px) {
  .site-header { padding: .6rem clamp(1rem, 4vw, 2rem); }
  .brand-logo { width: 6rem; height: 6rem; }
  .brand-name { --brand-name-size: 1.2rem; }
}

.site-footer[data-site-footer]:empty { min-height: 18rem; background: var(--footer-bg, var(--header-bg)); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition: none !important; }
  .reveal-ready [data-reveal] { opacity: 1; transform: none; }
  .wine-card:hover .wine-visual > svg, .wine-card:hover .wine-visual > img,
  .wine-card:focus-within .wine-visual > svg, .wine-card:focus-within .wine-visual > img { transform: translateX(-50%); }
}
/* ============================================================
   Ma sélection
   ============================================================ */
.selection-nav { position: relative; display: inline-flex !important; align-items: center; gap: .42rem; }
.selection-icon { width: 1.35rem; height: 1.35rem; flex: none; }
/* Onglet d'en-tête : panier seul, la pastille se pose sur son coin. */
.site-nav-link.selection-nav { justify-content: center; width: 44px; height: 44px; padding: 0; }
.site-nav-link.selection-nav .selection-icon { width: 2rem; height: 2rem; }
.site-nav-link.selection-nav .selection-count { position: absolute; top: -.3rem; right: -.25rem; min-width: 1.15rem; height: 1.15rem; font-size: .64rem; }
.site-menu-link.selection-nav .selection-icon { width: 1.2rem; height: 1.2rem; }
.selection-count {
  display: inline-grid; place-items: center; min-width: 1.45rem; height: 1.45rem; padding: 0 .32rem;
  border-radius: 999px; background: var(--brand); color: var(--on-brand); font-size: .72rem; font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.site-menu-link.selection-nav { justify-content: flex-start; gap: .5rem; }
.site-menu-link.selection-nav .selection-count { margin-left: auto; }
/* Le libellé court évite une cellule panier incompréhensible. */
.mobile-bar-selection { position: relative; }
/* La pastille se pose sur le coin du panier, jamais à côté de la cellule. */
.mobile-bar-selection .mobile-bar-icon { position: relative; display: inline-grid; }
.mobile-bar-selection .selection-count { position: absolute; top: -.4rem; left: 62%; min-width: 1.15rem; height: 1.15rem; font-size: .64rem; }
.mobile-bar-icon .selection-icon { width: 1.35rem; height: 1.35rem; }

.wine-card-actions { padding: 0 .72rem .72rem; border-radius: 0 0 var(--radius) var(--radius); background: var(--wine-card-bg, var(--card)); }
.wine-card--doux .wine-card-actions { border-radius: 0 0 26px 26px; }
.wine-card-add {
  width: 100%; min-height: 44px; padding: .56rem .68rem; border: 1px solid var(--brand); border-radius: 999px;
  background: var(--brand); color: var(--on-brand); font: 700 .76rem var(--sans); cursor: pointer;
  transition: transform .18s ease, background .18s ease, color .18s ease;
}
.wine-card-add:hover { transform: translateY(-1px); }
.wine-card-add:active { transform: scale(.98); }
.wine-card-add:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.wine-card-add.is-added { background: var(--selection-added); border-color: var(--selection-added-border); color: var(--on-dark); }
.wine-card-add:disabled { cursor: default; opacity: .55; transform: none; }
[data-add-to-selection].is-added { display: inline-flex; align-items: center; justify-content: center; gap: .42rem; background: var(--selection-added); border-color: var(--selection-added-border); color: var(--on-dark); }
[data-add-to-selection].is-added .selection-add-cart { display: inline-grid; width: 1.1rem; height: 1.1rem; animation: selection-add-cart .42s cubic-bezier(.22,.8,.2,1) both; }
[data-add-to-selection].is-added .selection-add-cart svg { width: 100%; height: 100%; }
[data-add-to-selection].is-added .selection-add-label { animation: selection-add-label .32s ease-out both; }
[data-add-to-selection].is-added .selection-add-check { width: 1.1rem; height: 1.1rem; fill: none; stroke: currentColor; stroke-width: 2.7; stroke-linecap: round; stroke-linejoin: round; animation: selection-add-check .45s .12s cubic-bezier(.22,.8,.2,1) both; }
@keyframes selection-add-cart { from { opacity: 0; transform: translateX(-.65rem) scale(.55) rotate(-12deg); } to { opacity: 1; transform: translateX(0) scale(1) rotate(0); } }
@keyframes selection-add-label { from { opacity: 0; transform: translateY(.45rem); } to { opacity: 1; transform: translateY(0); } }
@keyframes selection-add-check { from { opacity: 0; transform: scale(.35) rotate(-26deg); } to { opacity: 1; transform: scale(1) rotate(0); } }
.menu-card-add { width: 100%; margin-top: 1rem; text-align: center; }
.menu-card-view { position: relative; z-index: 1; display: inline-flex; align-items: center; min-height: 44px; margin-top: .75rem; color: var(--brand); font-size: .8rem; font-weight: 800; text-underline-offset: .18rem; }
.menu-card-view:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }

.selection-feedback {
  position: fixed; left: 50%; bottom: calc(var(--mobile-bar-height) + env(safe-area-inset-bottom) + .8rem); z-index: 110;
  width: min(calc(100% - 2rem), 520px); padding: .8rem 1rem; border: 1px solid color-mix(in srgb, var(--gold) 60%, transparent);
  border-radius: 12px; background: var(--card); color: var(--text); box-shadow: 0 18px 45px color-mix(in srgb, var(--shadow) 24%, transparent);
  font-size: .86rem; text-align: center; opacity: 0; pointer-events: none; transform: translate(-50%, .65rem);
  transition: opacity .2s ease, transform .2s ease;
}
.selection-feedback p { margin: 0; }
.selection-feedback.is-visible { opacity: 1; pointer-events: auto; transform: translate(-50%, 0); }
.selection-feedback-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: .45rem; margin-top: .65rem; }
/* Le lien ne centre pas son texte comme le bouton : sans `inline-flex`, les
   deux pastilles se décalaient de quelques pixels l'une par rapport à l'autre. */
.selection-feedback-actions a,
.selection-feedback-actions button { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; padding: .45rem .9rem; border: 1px solid color-mix(in srgb, var(--gold) 58%, transparent); border-radius: 999px; background: transparent; color: var(--brand-text); font: 700 .72rem var(--sans); line-height: 1; text-decoration: none; cursor: pointer; }
.selection-feedback-actions a:focus-visible,
.selection-feedback-actions button:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }

.site-promo-popup { position: fixed; inset: 0; width: min(calc(100% - 2rem), 460px); height: fit-content; margin: auto; padding: 0; overflow: hidden; border: 1px solid color-mix(in srgb, var(--popup-accent) 45%, transparent); border-radius: 22px; background: var(--popup-background); color: var(--popup-text); box-shadow: 0 28px 80px color-mix(in srgb, var(--shadow) 35%, transparent); opacity: 0; transform: translateY(1.1rem) scale(.97); transition: opacity .18s ease, transform .28s cubic-bezier(.22,.8,.2,1); }
.site-promo-popup[open].is-visible { opacity: 1; transform: translateY(0) scale(1); }
.site-promo-popup::backdrop { background: color-mix(in srgb, var(--shadow) 42%, transparent); backdrop-filter: blur(3px); }
.site-promo-popup--overlay-dark::backdrop { background: color-mix(in srgb, var(--shadow) 72%, transparent); }
.site-promo-popup--overlay-none::backdrop { background: transparent; backdrop-filter: none; }
.site-promo-popup--bottom-left { inset: auto auto calc(var(--mobile-bar-height) + env(safe-area-inset-bottom) + 1rem) 1rem; margin: 0; }
.site-promo-popup--bottom-right { inset: auto 1rem calc(var(--mobile-bar-height) + env(safe-area-inset-bottom) + 1rem) auto; margin: 0; }
.site-promo-popup-card { position: relative; display: grid; }
.site-promo-popup--large { width: min(calc(100% - 2rem), 720px); }
.site-promo-popup--large .site-promo-popup-card { grid-template-columns: minmax(180px, .9fr) minmax(0, 1.1fr); }
.site-promo-popup-image { min-height: 170px; margin: 0; background: var(--surface-warm); }
.site-promo-popup-image img { display: block; width: 100%; height: 100%; min-height: 170px; object-fit: cover; }
.site-promo-popup-content { display: grid; align-content: center; justify-items: start; gap: .72rem; padding: clamp(1.45rem, 5vw, 2.2rem); }
.site-promo-popup-content > p { margin: 0; color: var(--popup-accent); font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.site-promo-popup-content h2 { margin: 0; color: var(--popup-text); font-size: clamp(2rem, 6vw, 3rem); line-height: .92; }
.site-promo-popup-content > span { color: color-mix(in srgb, var(--popup-text) 74%, transparent); font-size: .92rem; line-height: 1.5; }
.site-promo-popup-action { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; margin-top: .25rem; padding: .58rem 1rem; border-radius: 999px; background: var(--popup-accent); color: var(--on-brand); font: 700 .78rem var(--sans); text-decoration: none; }
.site-promo-popup-close { position: absolute; top: .55rem; right: .55rem; z-index: 2; display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border: 1px solid color-mix(in srgb, var(--popup-text) 18%, transparent); border-radius: 50%; background: color-mix(in srgb, var(--popup-background) 85%, transparent); color: var(--popup-text); font: 400 1.5rem/1 var(--sans); cursor: pointer; }
.site-promo-popup-action:focus-visible, .site-promo-popup-close:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }

body.age-gate-open { overflow: hidden; }
.site-age-gate { width: calc(100vw - 2rem); max-width: 760px; max-height: calc(100dvh - 2rem); margin: auto; padding: 0; overflow: auto; box-sizing: border-box; border: 1px solid color-mix(in srgb, var(--age-accent) 62%, transparent); border-radius: 26px; background: var(--age-background); color: var(--age-text); box-shadow: 0 32px 100px color-mix(in srgb, var(--shadow) 70%, transparent); }
.site-age-gate--left { margin-left: max(1rem, 4vw); margin-right: auto; }
.site-age-gate--right { margin-left: auto; margin-right: max(1rem, 4vw); }
.site-age-gate::backdrop { background: color-mix(in srgb, var(--age-overlay) 84%, transparent); backdrop-filter: blur(8px); }
.site-age-gate-card { display: grid; text-align: center; }
.site-age-gate-content { padding: clamp(1.5rem, 6vw, 3rem); }
.site-age-gate-content > div { display: grid; justify-items: center; gap: 1rem; }
.site-age-gate-content > div[hidden] { display: none; }
.site-age-gate-image { min-height: 180px; max-height: 250px; margin: 0; overflow: hidden; background: color-mix(in srgb, var(--age-accent) 10%, var(--age-background)); }
.site-age-gate-image img { display: block; width: 100%; height: 100%; min-height: 180px; max-height: 250px; object-fit: cover; }
.site-age-gate-kicker { margin: 0; color: var(--age-accent); font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.site-age-gate h2 { max-width: 12em; color: var(--age-text); font-size: clamp(2.15rem, 8vw, 4rem); }
.site-age-gate p { margin: 0; color: color-mix(in srgb, var(--age-text) 78%, transparent); }
.site-age-gate small { max-width: 42em; color: color-mix(in srgb, var(--age-text) 72%, transparent); line-height: 1.5; }
.site-age-gate-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .7rem; margin-top: .4rem; }
.site-age-gate button { min-height: 48px; padding: .75rem 1.15rem; border: 1px solid var(--age-accent); border-radius: 999px; font: 700 .86rem var(--sans); cursor: pointer; }
.site-age-gate-confirm { background: var(--age-accent); color: var(--age-background); }
.site-age-gate-refuse { background: transparent; color: var(--age-text); }
.site-age-gate button:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }

@media (min-width: 621px) {
  .site-age-gate.has-image.site-age-gate--image-left .site-age-gate-card,
  .site-age-gate.has-image.site-age-gate--image-right .site-age-gate-card { grid-template-columns: minmax(220px, .78fr) minmax(0, 1.22fr); }
  .site-age-gate.has-image.site-age-gate--image-right .site-age-gate-image { order: 2; }
  .site-age-gate.has-image.site-age-gate--image-left .site-age-gate-image,
  .site-age-gate.has-image.site-age-gate--image-right .site-age-gate-image,
  .site-age-gate.has-image.site-age-gate--image-left .site-age-gate-image img,
  .site-age-gate.has-image.site-age-gate--image-right .site-age-gate-image img { min-height: 100%; max-height: none; }
}

@media (max-width: 620px) {
  .site-promo-popup--large .site-promo-popup-card { grid-template-columns: 1fr; }
  .site-promo-popup--bottom-left, .site-promo-popup--bottom-right { inset: auto 1rem calc(var(--mobile-bar-height) + env(safe-area-inset-bottom) + 1rem); width: auto; }
  .site-promo-popup-image, .site-promo-popup-image img { min-height: 130px; max-height: 170px; }
  .site-age-gate, .site-age-gate--left, .site-age-gate--right { width: calc(100vw - 1.2rem); margin: auto; }
  .site-age-gate-content { padding: 1.35rem 1rem; }
  .site-age-gate-image, .site-age-gate-image img { min-height: 120px; max-height: 160px; }
  .site-age-gate h2 { font-size: clamp(2rem, 10vw, 2.8rem); }
  .site-age-gate-actions { width: 100%; }
  .site-age-gate-actions button { width: 100%; }
}

.selection-page { width: min(100% - 2rem, 1320px); margin: 0 auto; padding: clamp(2.2rem, 6vw, 5rem) 0 clamp(4rem, 8vw, 7rem); }
.selection-page-head { max-width: 760px; margin-bottom: clamp(2rem, 5vw, 3.5rem); }
.selection-page-head > p, .selection-success > p {
  margin: 0 0 .45rem; color: var(--brand-text); font-size: .74rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
}
.selection-page-head h1 { color: var(--wine); font-size: clamp(2.7rem, 8vw, 5.4rem); letter-spacing: -.025em; }
.selection-page-head > span { display: block; max-width: 62ch; margin-top: .7rem; color: var(--text-muted); font-size: 1rem; }
.selection-notice { margin: 0 0 1rem; padding: .8rem 1rem; border-radius: 10px; background: var(--surface-warm); color: var(--text); font-size: .85rem; }
.selection-notice--warning { border-left: 4px solid var(--gold-strong); }
.selection-empty, .selection-success {
  /* Bloc isolé sur la page : il se centre, et son bouton d'appel aussi. */
  max-width: 720px; margin-inline: auto; padding: clamp(1.5rem, 5vw, 3rem);
  border: 1px solid var(--line); border-radius: 18px; text-align: center;
  background: var(--card); box-shadow: 0 22px 48px color-mix(in srgb, var(--shadow) 9%, transparent);
}
.selection-empty .btn, .selection-success .btn { display: inline-flex; align-items: center; justify-content: center; }
.selection-empty h2, .selection-success h2 { color: var(--wine); font-size: clamp(2rem, 6vw, 3rem); }
.selection-empty p, .selection-success > span { display: block; margin: .7rem 0 1.4rem; color: var(--text-muted); }
.selection-success:focus { outline: none; }
.selection-layout { display: grid; gap: clamp(1.5rem, 4vw, 3rem); }
.selection-products-head { display: flex; justify-content: space-between; gap: 1rem; align-items: baseline; margin-bottom: 1rem; }
.selection-products-head h2, .selection-summary > h2 { color: var(--wine); font-size: clamp(1.65rem, 4vw, 2.15rem); }
.selection-products-head a { color: var(--brand-text); font-size: .82rem; font-weight: 700; text-underline-offset: .2rem; }
.selection-list { display: grid; gap: .8rem; }
.selection-item {
  display: grid; grid-template-columns: 82px minmax(0, 1fr); gap: .85rem; padding: .9rem;
  border: 1px solid var(--line); border-radius: 14px; background: var(--card);
}
.selection-item-visual { position: relative; display: grid; place-items: center; width: 82px; height: 118px; margin: 0; border-radius: 10px; background: var(--surface); overflow: hidden; }
.selection-item-visual img, .selection-item-visual svg { position: absolute; left: 50%; bottom: .4rem; width: auto; max-width: 88%; height: calc(100% - .8rem); object-fit: contain; transform: translateX(-50%); filter: drop-shadow(0 7px 8px color-mix(in srgb, var(--shadow) 20%, transparent)); }
.selection-item-copy { min-width: 0; }
.selection-item-region { margin: 0 0 .18rem; color: var(--brand-text); font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; }
.selection-item h2 { color: var(--wine); font-size: 1.2rem; overflow-wrap: anywhere; }
.selection-item-price { margin: .25rem 0 .65rem; color: var(--muted); font-size: .78rem; }
.selection-item-price .wine-price--promo { font-weight: 700; }
.selection-item-price .wine-price-old { font-size: .78rem; }
.selection-quantity { display: inline-grid; grid-template-columns: 44px 58px 44px; align-items: stretch; border: 1px solid var(--line); border-radius: 999px; overflow: hidden; }
.selection-quantity button { border: 0; background: var(--surface); color: var(--wine); font: 700 1.2rem var(--sans); cursor: pointer; }
.selection-quantity input { width: 100%; height: 44px; padding: .2rem; border: 0; border-inline: 1px solid var(--line); background: var(--card); color: var(--text); font: 700 .9rem var(--sans); text-align: center; }
.selection-quantity button:focus-visible, .selection-quantity input:focus-visible { position: relative; z-index: 1; outline: 3px solid var(--focus); outline-offset: -3px; }
.selection-remove { display: block; min-height: 38px; margin-top: .4rem; padding: .25rem 0; border: 0; background: transparent; color: var(--danger); font: 600 .75rem var(--sans); text-decoration: underline; text-underline-offset: .18rem; cursor: pointer; }
.selection-remove:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.selection-item-subtotal { grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 1rem; margin: 0; padding-top: .7rem; border-top: 1px solid var(--line); }
.selection-item-subtotal span { color: var(--muted); font-size: .78rem; }
.selection-item-subtotal strong { color: var(--wine); font-family: var(--serif); font-size: 1.2rem; font-variant-numeric: tabular-nums; }

.selection-summary { padding: clamp(1rem, 3vw, 1.6rem); border: 1px solid var(--line); border-radius: 16px; background: var(--card); }
.selection-total { margin: 1rem 0; }
.selection-total div { display: flex; justify-content: space-between; gap: 1rem; padding: .65rem 0; border-bottom: 1px solid var(--line); }
.selection-total dt { color: var(--muted); }
.selection-total dd { margin: 0; color: var(--wine); font-weight: 700; font-variant-numeric: tabular-nums; }
.selection-total div:last-child dd { font: 700 1.65rem var(--serif); }
.selection-payment-note { margin: 0 0 1.5rem; padding: .85rem; border-left: 4px solid var(--brand); background: var(--surface); color: var(--text-muted); font-size: .82rem; }
.selection-payment-note strong { color: var(--wine); }
.selection-form { display: grid; gap: 1rem; padding-top: 1.25rem; border-top: 1px solid var(--line); }
.selection-form h3 { color: var(--wine); font-size: 1.45rem; }
.selection-field { display: grid; gap: .35rem; color: var(--wine); font-size: .82rem; font-weight: 700; }
.selection-field > span:not(.selection-field-error) { color: var(--muted); font-weight: 400; }
.selection-field input, .selection-field select, .selection-field textarea {
  width: 100%; min-height: 46px; padding: .65rem .75rem; border: 1px solid var(--line); border-radius: 9px;
  background: var(--card); color: var(--text); font: 400 16px var(--sans);
}
.selection-field textarea { min-height: 110px; resize: vertical; }
.selection-field input:focus-visible, .selection-field select:focus-visible, .selection-field textarea:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.selection-field [aria-invalid="true"], .selection-options [aria-invalid="true"] { border-color: var(--danger); }
.selection-field small { color: var(--muted); font-size: .72rem; font-weight: 400; }
.selection-field-error { min-height: 1.05rem; color: var(--danger); font-size: .73rem; font-weight: 600; }
.selection-options { display: grid; gap: .25rem; margin: 0; padding: .85rem; border: 1px solid var(--line); border-radius: 10px; }
.selection-options legend { padding: 0 .25rem; color: var(--wine); font-size: .82rem; font-weight: 700; }
.selection-options label { display: flex; align-items: center; gap: .5rem; min-height: 42px; color: var(--text); font-size: .84rem; }
.selection-options input { width: 1.1rem; height: 1.1rem; accent-color: var(--brand); }
.selection-submit { width: 100%; min-height: 50px; }
.selection-submit:disabled { cursor: wait; opacity: .68; transform: none; }
.selection-submit-status { min-height: 1.3rem; margin: 0; color: var(--danger); font-size: .8rem; }
.selection-submit-status:focus { outline: none; }
.selection-item--unavailable { filter: saturate(.45); }
.selection-item-availability { margin: .4rem 0; color: var(--danger); font-weight: 700; }
.selection-form-note { margin: 0; color: var(--muted); font-size: .72rem; }
.selection-form-note a { color: var(--brand-text); text-underline-offset: .18rem; }
.selection-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

@media (min-width: 700px) {
  .selection-item { grid-template-columns: 104px minmax(0, 1fr) auto; align-items: center; padding: 1rem; }
  .selection-item-visual { width: 104px; height: 142px; }
  .selection-item h2 { font-size: 1.45rem; }
  .selection-item-subtotal { grid-column: auto; display: grid; align-self: stretch; align-content: center; min-width: 110px; padding: 0 0 0 1rem; border-top: 0; border-left: 1px solid var(--line); text-align: right; }
}

@media (min-width: 980px) {
  .selection-feedback { bottom: 1rem; }
  .selection-layout { grid-template-columns: minmax(0, 1.45fr) minmax(330px, .75fr); align-items: start; }
  .selection-summary { position: sticky; top: 6.4rem; }
}

@media (prefers-reduced-motion: reduce) {
  .selection-feedback { transition: none; }
}

/* ============================================================
   Fiche vin dédiée
   ============================================================ */
.wine-product-page { min-height: 70vh; padding-bottom: 5.5rem; background: var(--bg); }
.wine-product-loading,
.wine-product-not-found { width: min(760px, calc(100% - 2rem)); margin: 0 auto; padding: clamp(4rem, 13vw, 8rem) 0; text-align: center; }
.wine-product-not-found { display: grid; justify-items: center; gap: 1rem; }
.wine-product-not-found p { color: var(--brand-text); font-size: .75rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.wine-product-not-found h2 { color: var(--wine); font-size: clamp(2.8rem, 12vw, 5rem); }
.wine-product-not-found span { color: var(--muted); }
.wine-product { width: min(1180px, calc(100% - 2rem)); margin: 0 auto; padding: 1.2rem 0 4rem; }
.wine-product-breadcrumb { display: flex; align-items: center; gap: .45rem; margin-bottom: 1.1rem; color: var(--muted); font-size: .78rem; }
.wine-product-breadcrumb a { color: var(--brand-text); }
.wine-product-hero { display: grid; gap: 1.5rem; }
.wine-product-media { position: relative; }
.wine-product-image-button {
  position: relative; display: block; width: 100%; padding: 0; overflow: hidden;
  border: 1px solid var(--line); border-radius: clamp(18px, 5vw, 30px); background: var(--card); color: var(--wine); cursor: zoom-in;
}
.wine-product-image-button:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.wine-product-image {
  position: relative; width: 100%; margin: 0; aspect-ratio: 1;
  background: radial-gradient(circle at 50% 30%, color-mix(in srgb, var(--gold) 14%, var(--card)) 0%, var(--surface-warm) 78%, var(--surface) 100%);
}
.wine-product-image img,
.wine-product-image svg { position: absolute; left: 50%; bottom: 4%; z-index: 2; width: auto; max-width: 82%; height: 88%; object-fit: contain; transform: translateX(-50%); filter: drop-shadow(0 20px 24px color-mix(in srgb, var(--shadow) 20%, transparent)); transition: transform .42s cubic-bezier(.22,.8,.2,1), filter .42s ease; }
.wine-product-tasting-glass { position: absolute; right: 22%; bottom: 12%; z-index: 4; display: grid; place-items: end center; width: 34%; height: 65%; opacity: 0; pointer-events: none; transform: translateX(1.8rem) scale(.78); transition: opacity .28s ease, transform .42s cubic-bezier(.22,.8,.2,1); }
.wine-product-tasting-glass-photo { width: auto; height: 100%; object-fit: contain; filter: drop-shadow(0 20px 18px color-mix(in srgb, var(--shadow) 20%, transparent)); }
.wine-product-tasting-glass-photo--rouge-grenat { filter: saturate(.82) brightness(.82) hue-rotate(-8deg) drop-shadow(0 20px 18px color-mix(in srgb, var(--shadow) 20%, transparent)); }
.wine-product-tasting-glass-photo--rouge-pourpre { filter: saturate(1.12) brightness(.86) hue-rotate(14deg) drop-shadow(0 20px 18px color-mix(in srgb, var(--shadow) 20%, transparent)); }
.wine-product-tasting-glass-photo--blanc-dore { filter: saturate(1.3) sepia(.18) brightness(.94) drop-shadow(0 20px 18px color-mix(in srgb, var(--shadow) 20%, transparent)); }
.wine-product-tasting-glass-photo--rose-soutenu { filter: saturate(1.32) brightness(.92) drop-shadow(0 20px 18px color-mix(in srgb, var(--shadow) 20%, transparent)); }
.wine-product-image-button:hover .wine-product-image img,
.wine-product-image-button:hover .wine-product-image svg,
.wine-product-image-button:focus-visible .wine-product-image img,
.wine-product-image-button:focus-visible .wine-product-image svg { transform: translateX(-58%) scale(.96); filter: drop-shadow(0 24px 26px color-mix(in srgb, var(--shadow) 28%, transparent)); }
.wine-product-image-button:hover .wine-product-tasting-glass,
.wine-product-image-button:focus-visible .wine-product-tasting-glass { opacity: 1; transform: translateX(0) scale(1); }
.wine-product-zoom-label { position: absolute; right: .8rem; bottom: .8rem; padding: .48rem .75rem; border: 1px solid var(--line); border-radius: 999px; background: var(--card); color: var(--text); font-size: .72rem; font-weight: 700; }
.wine-product-media-rewards { position: absolute; top: 50%; right: .5rem; z-index: 6; display: grid; grid-template-columns: 5rem; gap: .3rem; pointer-events: none; transform: translateY(-50%); }
.wine-product-media-rewards img { width: 5rem; height: 5rem; padding: 0; border: 0; border-radius: 0; background: transparent; object-fit: contain; box-shadow: none; filter: none; }
.wine-product-media-rewards:has(img:nth-child(3)) { grid-template-columns: repeat(2, 5rem); }
.wine-product-media:has(.wine-product-media-rewards:not([hidden]) img) .wine-product-image img,
.wine-product-media:has(.wine-product-media-rewards:not([hidden]) img) .wine-product-image svg { left: 41%; }
.wine-product-media:has(.wine-product-media-rewards:not([hidden]) img:nth-child(3)) .wine-product-image img,
.wine-product-media:has(.wine-product-media-rewards:not([hidden]) img:nth-child(3)) .wine-product-image svg { left: 30%; }
.wine-product-media:has(.wine-product-media-rewards:not([hidden]) img) .wine-product-tasting-glass {
  right: 31%; bottom: 18%; width: 30%; height: 58%;
}
.wine-product-media:has(.wine-product-media-rewards:not([hidden]) img:nth-child(3)) .wine-product-tasting-glass {
  right: 39%; bottom: 20%; width: 27%; height: 55%;
}
.wine-product-summary { align-self: start; }
.wine-product-domain { margin: 0 0 .45rem; color: var(--brand-text); font-size: .76rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.wine-product-summary h1 { max-width: 13ch; color: var(--wine); font-size: clamp(2.8rem, 12vw, 5.3rem); line-height: .9; letter-spacing: -.025em; }
.wine-product-identity { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem 1rem; margin: 1.25rem 0; padding: 0; list-style: none; }
.wine-product-identity li { display: grid; gap: .12rem; min-width: 0; padding-bottom: .5rem; border-bottom: 1px solid var(--line); }
.wine-product-identity span { color: var(--muted); font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.wine-product-identity strong { overflow-wrap: anywhere; color: var(--text); font-size: .88rem; }
.wine-product-certification { display: inline-flex; align-items: center; gap: .65rem; margin: 0 0 .8rem; padding: .55rem .75rem; border: 1px solid var(--line); border-radius: 14px; color: var(--wine); font-weight: 800; }
.wine-product-certification[hidden] { display: none; }
.wine-product-certification img { width: 2.8rem; height: 2.8rem; object-fit: contain; }
.wine-product-price { display: grid; gap: .05rem; margin: 1.2rem 0; }
.wine-product-price > span { color: var(--muted); font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.wine-product-price strong { display: flex; align-items: baseline; flex-wrap: wrap; gap: .5rem; color: var(--wine); font: 700 clamp(2.3rem, 10vw, 3.6rem)/1 var(--serif); }
.wine-product-price strong .wine-price-old { font-size: clamp(1.1rem, 4vw, 1.5rem); }
.wine-product-buy { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .9rem; padding: 1rem; border: 1px solid var(--line); border-radius: 18px; background: var(--card); }
.wine-product-quantity { display: grid; gap: .35rem; }
.wine-product-quantity > span,
.wine-product-subtotal span { color: var(--muted); font-size: .7rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.wine-product-quantity > div { display: grid; grid-template-columns: 2.75rem minmax(2.7rem, 1fr) 2.75rem; overflow: hidden; border: 1px solid var(--line); border-radius: 999px; }
.wine-product-quantity button { min-height: 44px; border: 0; background: var(--surface); color: var(--wine); font: 700 1.15rem var(--sans); cursor: pointer; }
.wine-product-quantity input { width: 100%; min-height: 44px; padding: .2rem; border: 0; border-inline: 1px solid var(--line); background: var(--card); color: var(--text); font: 700 1rem var(--sans); text-align: center; }
.wine-product-quantity button:focus-visible,
.wine-product-quantity input:focus-visible { outline: 3px solid var(--focus); outline-offset: -3px; }
.wine-product-subtotal { display: grid; align-content: center; gap: .2rem; margin: 0; text-align: right; }
.wine-product-subtotal strong { color: var(--wine); font: 700 1.45rem var(--serif); }
.wine-product-add { grid-column: 1 / -1; width: 100%; min-height: 50px; }
.wine-product-human-note { grid-column: 1 / -1; margin: 0; padding-left: .75rem; border-left: 3px solid var(--brand); color: var(--muted); font-size: .78rem; line-height: 1.5; }
.wine-product-reassurance { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.wine-product-reassurance li { display: flex; align-items: center; gap: .55rem; min-width: 0; padding: .65rem; border-radius: 12px; background: var(--surface); color: var(--text); font-size: .72rem; line-height: 1.25; }
.wine-product-icon { flex: 0 0 auto; display: grid; place-items: center; width: 1.65rem; height: 1.65rem; color: var(--brand-text); }
.wine-product-icon svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.wine-product-advice { margin-top: clamp(2rem, 8vw, 5rem); padding: clamp(1.4rem, 6vw, 3rem); border-radius: 24px; background: var(--surface-warm); }
.wine-product-advice > p,
.wine-product-section-head p,
.wine-product-lower-cta p { margin: 0 0 .35rem; color: var(--brand-text); font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.wine-product-advice h2,
.wine-product-section-head h2,
.wine-product-lower-cta h2 { color: var(--wine); font-size: clamp(2rem, 7vw, 3.5rem); }
.wine-product-advice blockquote { max-width: 42em; margin: 1rem 0; color: var(--text); font: 500 clamp(1.2rem, 4vw, 1.6rem)/1.45 var(--serif); }
.wine-product-advice > span { color: var(--muted); font-size: .8rem; font-weight: 700; }
.wine-product-section { margin-top: clamp(2.5rem, 9vw, 5rem); }
.wine-product-section-head { margin-bottom: 1.15rem; }
.wine-product-technical { display: grid; gap: .75rem; margin: 0; }
.wine-product-technical > div { display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: .15rem .7rem; padding: 1rem; border: 1px solid var(--line); border-radius: 16px; background: var(--card); }
.wine-product-technical .wine-product-icon { grid-row: 1 / span 2; }
.wine-product-technical dt { color: var(--wine); font: 700 1.15rem var(--serif); }
.wine-product-technical dd { margin: 0; color: var(--muted); font-size: .82rem; line-height: 1.5; }
.wine-product-rewards { display: grid; gap: .75rem; }
.wine-product-rewards article { display: grid; grid-template-columns: minmax(5.5rem, 8rem) minmax(0, 1fr); gap: 1rem; align-items: center; padding: 1rem; border: 1px solid var(--line); border-radius: 16px; background: var(--card); }
.wine-product-reward-visual { display: flex; flex-wrap: wrap; align-content: center; justify-content: center; gap: .35rem; min-width: 0; }
.wine-product-reward-visual img { width: 4.5rem; height: 4.5rem; flex: 0 0 auto; object-fit: contain; }
.wine-product-rewards .wine-product-reward--visual-only { grid-template-columns: minmax(0, 1fr); }
.wine-product-rewards .wine-product-reward--visual-only .wine-product-reward-visual img { width: 5.5rem; height: 5.5rem; }
.wine-product-rewards h3 { color: var(--wine); font-size: 1.2rem; }
.wine-product-rewards p,
.wine-product-rewards span { margin: .12rem 0 0; color: var(--muted); font-size: .78rem; }
.wine-product-lower-cta { display: grid; gap: 1.2rem; align-items: center; margin-top: clamp(2.5rem, 9vw, 5rem); padding: clamp(1.25rem, 5vw, 2.4rem); border-radius: 22px; background: var(--surface-warm); color: var(--text); }
.wine-product-lower-cta h2 { color: var(--wine); }
.wine-product-lower-cta span { color: var(--text-muted); }
.wine-product-lower-cta .btn { width: 100%; }
.wine-product-secondary { display: grid; gap: 1.4rem; margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.wine-product-return,
.wine-product-share > div { display: flex; flex-wrap: wrap; gap: .55rem; }
.wine-product-return a,
.wine-product-return button,
.wine-product-share a,
.wine-product-share button { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: .58rem .78rem; border: 1px solid var(--line); border-radius: 999px; background: var(--card); color: var(--wine); font: 700 .75rem var(--sans); text-align: center; text-decoration: none; cursor: pointer; }
.wine-product-return a:focus-visible,
.wine-product-return button:focus-visible,
.wine-product-share a:focus-visible,
.wine-product-share button:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.wine-product-share > span { display: block; margin-bottom: .55rem; color: var(--muted); font-size: .72rem; font-weight: 700; text-transform: uppercase; }
.wine-product-share p { min-height: 1.2rem; margin: .4rem 0 0; color: var(--success); font-size: .78rem; }
.wine-product-zoom { width: min(920px, calc(100% - 1rem)); height: min(920px, calc(100dvh - 1rem)); padding: 0; overflow: hidden; border: 0; border-radius: 22px; background: var(--card); color: var(--text); box-shadow: 0 28px 90px color-mix(in srgb, var(--shadow) 45%, transparent); }
.wine-product-zoom::backdrop { background: color-mix(in srgb, var(--shadow) 72%, transparent); backdrop-filter: blur(5px); }
.wine-product-zoom > div { position: relative; width: 100%; height: 100%; }
.wine-product-zoom button { position: absolute; top: .7rem; right: .7rem; z-index: 2; display: grid; place-items: center; width: 2.8rem; height: 2.8rem; border: 1px solid var(--line); border-radius: 50%; background: var(--card); color: var(--wine); font: 400 1.8rem/1 var(--sans); cursor: pointer; }
.wine-product-zoom button:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.wine-product-zoom figure { position: relative; width: 100%; height: 100%; margin: 0; background: radial-gradient(circle at 50% 35%, color-mix(in srgb, var(--gold) 14%, var(--card)) 0%, var(--surface-warm) 100%); }
.wine-product-zoom img,
.wine-product-zoom svg { position: absolute; left: 50%; top: 50%; width: auto; max-width: 92%; height: 90%; object-fit: contain; transform: translate(-50%, -50%); }
.wine-product-mobile-action { position: fixed; left: 0; right: 0; bottom: env(safe-area-inset-bottom); z-index: 100; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .8rem; align-items: center; min-height: 4.6rem; padding: .55rem max(1rem, env(safe-area-inset-left)); border-top: 1px solid color-mix(in srgb, var(--gold) 45%, transparent); background: var(--card); color: var(--text); box-shadow: 0 -10px 25px color-mix(in srgb, var(--shadow) 18%, transparent); }
.wine-product-mobile-action div { display: grid; }
.wine-product-mobile-action > div > span { color: var(--text-muted); font-size: .62rem; text-transform: uppercase; }
.wine-product-mobile-action strong { display: flex; align-items: baseline; gap: .35rem; color: var(--brand-text); font: 700 1.35rem var(--serif); white-space: nowrap; }
.wine-product-mobile-action strong .wine-price-old { font-size: .82rem; }
.wine-product-mobile-action .btn { min-width: 0; min-height: 46px; padding-inline: .8rem; }

@media (max-width: 899px) {
  body[data-page="wine"] { padding-bottom: calc(4.6rem + env(safe-area-inset-bottom)); }
  body[data-page="wine"] .mobile-bar { display: none; }
  body[data-page="wine"] .selection-feedback { bottom: calc(4.6rem + env(safe-area-inset-bottom) + .8rem); }
}

@media (min-width: 640px) {
  .wine-product-technical { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wine-product-rewards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wine-product-lower-cta { grid-template-columns: minmax(0, 1fr) auto; }
  .wine-product-lower-cta .btn { width: auto; min-width: 13rem; }
  .wine-product-secondary { grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
}

@media (min-width: 900px) {
  .wine-product-page { padding-bottom: 0; }
  .wine-product { padding-top: 1.8rem; }
  .wine-product-hero { grid-template-columns: minmax(0, .95fr) minmax(380px, .8fr); gap: clamp(2.5rem, 7vw, 6rem); align-items: start; }
  .wine-product-media { position: sticky; top: 6.2rem; }
  .wine-product-summary { padding-top: clamp(.25rem, 1.4vw, 1rem); }
  .wine-product-summary h1 { font-size: clamp(3.6rem, 5.6vw, 5.2rem); }
  .wine-product-media-rewards { grid-template-columns: 6rem; gap: .4rem; right: .8rem; }
  .wine-product-media-rewards img { width: 6rem; height: 6rem; }
  .wine-product-media-rewards:has(img:nth-child(3)) { grid-template-columns: repeat(2, 6rem); }
  .wine-product-identity { margin-block: .85rem; }
  .wine-product-price { margin-block: .8rem; }
  .wine-product-reassurance { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .wine-product-technical { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .wine-product-mobile-action { display: none !important; }
}

/* ============================================================
   Deux directions d'accueil pour la validation de Xavier
   ============================================================ */

body[data-home-variant] .hero-hours {
  margin-bottom: 0;
  line-height: 1.35;
  text-wrap: balance;
}

/* Version 1 : les univers restent illustrés, mais les surfaces sont plus
   calmes et la sélection ressemble à une étagère continue plutôt qu'à une
   seconde rangée de cartes. */
.home-universes--visual .home-universe {
  border-color: color-mix(in srgb, var(--gold) 28%, transparent);
  border-radius: 18px;
  box-shadow: 0 14px 34px color-mix(in srgb, var(--shadow) 17%, transparent);
}
.home-universes--visual .home-universe:hover,
.home-universes--visual .home-universe:focus-visible {
  transform: translateY(-3px);
  box-shadow: 0 20px 42px color-mix(in srgb, var(--shadow) 23%, transparent);
}
.home-universes--visual .home-universe > div { min-height: 172px; }
.home-universes--visual .home-universe h3 { font-size: clamp(1.9rem, 6vw, 2.55rem); }

.home-selection--shelf {
  max-width: none;
  margin: 0;
  overflow: hidden;
  padding-block: clamp(2.8rem, 4.5vw, 4rem);
  background:
    radial-gradient(ellipse at 50% 36%, rgba(155, 78, 40, .25), transparent 34rem),
    linear-gradient(180deg, var(--home-shelf-start) 0%, var(--home-shelf-mid) 54%, var(--home-shelf-end) 100%);
  color: var(--on-dark);
}
.home-selection--shelf > .section-head,
.home-selection--shelf > .cat-grid,
.home-selection--shelf > .home-featured-controls,
.home-selection--shelf > .home-selection-action {
  width: min(1180px, 100%);
  margin-inline: auto;
}
.home-selection--shelf > .section-head { margin-bottom: clamp(1.6rem, 4vw, 2.8rem); }
.home-selection--shelf .section-head h2 { color: var(--on-dark); }
.home-selection--shelf .section-head > p:last-child { color: var(--home-shelf-muted); }
.home-selection--shelf .catalogue-page-eyebrow { color: var(--brand) !important; }
.home-selection--shelf .cat-grid--shelf {
  position: relative;
  gap: 0;
}
.home-selection--shelf .wine-card {
  --wine-card-bg: transparent !important;
  --wine-card-text: var(--on-dark) !important;
  --wine-card-accent: var(--gold) !important;
  --wine-card-border: transparent !important;
  border: 0 !important;
  border-radius: 0;
  background: transparent !important;
  color: var(--on-dark);
  box-shadow: none;
  padding-inline: clamp(.65rem, 2.1vw, 1.55rem);
}
.home-selection--shelf .wine-card:hover,
.home-selection--shelf .wine-card:focus-within {
  transform: none;
  border-color: transparent;
  box-shadow: none;
}
.home-selection--shelf .wine-visual {
  height: clamp(17.5rem, 23vw, 19rem);
  aspect-ratio: auto;
  border: 0;
  border-radius: 0;
  background: radial-gradient(ellipse at 50% 76%, rgba(229, 138, 77, .2), transparent 52%);
}
.home-selection--shelf .wine-visual::before {
  content: "";
  position: absolute;
  right: 7%;
  bottom: .35rem;
  left: 7%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(237, 180, 122, .72) 18%, rgba(237, 180, 122, .72) 82%, transparent);
  box-shadow: 0 .55rem 1.25rem rgba(237, 180, 122, .18);
}
.home-selection--shelf .wine-visual > svg,
.home-selection--shelf .wine-visual > img {
  bottom: .7rem;
  height: calc(100% - 2rem);
  filter: drop-shadow(0 1rem 1.15rem rgba(11, 5, 2, .55));
}
.home-selection--shelf .wine-card:hover .wine-visual > svg,
.home-selection--shelf .wine-card:hover .wine-visual > img,
.home-selection--shelf .wine-card:focus-within .wine-visual > svg,
.home-selection--shelf .wine-card:focus-within .wine-visual > img {
  transform: translate(-50%, -.35rem) scale(1.018);
  filter: drop-shadow(0 1.25rem 1.35rem rgba(11, 5, 2, .62));
}
.home-selection--shelf .wine-body,
.home-selection--shelf .wine-card-actions { background: transparent !important; }
.home-selection--shelf .wine-body { gap: .22rem; padding: 1rem .15rem .2rem; }
.home-selection--shelf .wine-domain { display: none; }
.home-selection--shelf .wine-appellation {
  display: block;
  color: var(--gold);
  font-size: .7rem;
  letter-spacing: .12em;
}
.home-selection--shelf .wine-year { color: var(--home-shelf-year); }
.home-selection--shelf .wine-name,
.home-selection--shelf .wine-name a,
.home-selection--shelf .wine-price { color: var(--on-dark); }
.home-selection--shelf .wine-name { font-size: clamp(1.05rem, 1.7vw, 1.28rem); }
.home-selection--shelf .wine-foot { padding-top: .7rem; border-color: rgba(237, 180, 122, .3); }
.home-selection--shelf .wine-card-more { color: var(--gold); }
.home-selection--shelf .wine-card-actions { display: flex; padding: .25rem .15rem 0; }
.home-selection--shelf .wine-card-add {
  width: auto;
  padding-inline: 1rem;
  border-color: rgba(237, 180, 122, .62);
  background: transparent;
  color: var(--header-text);
}
.home-selection--shelf .wine-card-add:hover { background: rgba(237, 180, 122, .12); }
.home-selection--shelf .wine-card-add.is-added {
  border-color: var(--selection-added-border);
  background: var(--selection-added);
  color: var(--on-dark);
}
.home-selection--shelf .wine-badge {
  border-color: rgba(255, 225, 192, .34);
  border-radius: 6px;
  background: rgba(47, 29, 17, .86);
  color: var(--header-text);
}
.home-selection--shelf .wine-badge--prestige { border-color: transparent; background: var(--home-shelf-prestige); color: var(--on-brand); }
.home-selection--shelf .wine-badge--rouge { background: var(--home-shelf-red); color: var(--on-dark); }
.home-selection--shelf .home-selection-action { margin-top: clamp(1.75rem, 4vw, 2.5rem); }

/* Variante A : une sélection sombre et encadrée, fidèle à la maquette validée.
   Les thèmes individuels du catalogue sont neutralisés uniquement ici afin que
   les trois fiches forment une composition homogène sans toucher à la variante B. */
.home-selection--framed {
  max-width: none;
  margin: 0;
  overflow: hidden;
  padding-block: clamp(3rem, 5vw, 4.6rem);
  border-block: 1px solid rgba(237, 180, 122, .2);
  background:
    linear-gradient(rgba(58, 38, 25, .18), rgba(58, 38, 25, .3)),
    url("images/motif-cuivre-local.jpg") center / cover no-repeat;
  color: var(--on-dark);
}
.home-selection--framed > .section-head,
.home-selection--framed > .cat-grid,
.home-selection--framed > .home-featured-controls,
.home-selection--framed > .home-selection-action {
  width: min(1180px, 100%);
  margin-inline: auto;
}
.home-selection--framed > .section-head {
  max-width: 760px;
  margin-bottom: clamp(2rem, 4vw, 3.1rem);
  text-align: center;
}
.home-selection--framed .section-head h2 { color: var(--on-dark); }
.home-selection--framed .section-head > p:last-child { color: var(--home-shelf-muted); }
.home-selection--framed .catalogue-page-eyebrow { color: var(--brand) !important; }
.home-selection--framed .cat-grid--selection { gap: clamp(1rem, 2vw, 1.35rem); }
.home-selection--framed .wine-card {
  --wine-card-bg: rgba(78, 42, 24, .96) !important;
  --wine-card-text: var(--on-dark) !important;
  --wine-card-accent: var(--gold) !important;
  --wine-card-border: rgba(237, 180, 122, .4) !important;
  overflow: visible;
  border: 1px solid rgba(237, 180, 122, .4) !important;
  border-radius: 20px;
  background: rgba(78, 42, 24, .96) !important;
  color: var(--on-dark);
  box-shadow: 0 18px 38px rgba(15, 7, 3, .24);
}
.home-selection--framed .wine-card:hover,
.home-selection--framed .wine-card:focus-within {
  transform: translateY(-4px);
  border-color: rgba(237, 180, 122, .68) !important;
  box-shadow: 0 24px 52px rgba(15, 7, 3, .38);
}
.home-selection--framed .wine-visual {
  height: clamp(19rem, 25vw, 22.5rem);
  aspect-ratio: auto;
  overflow: visible;
  border-bottom: 1px solid rgba(237, 180, 122, .32);
  border-radius: 20px 20px 0 0;
  background:
    radial-gradient(ellipse at 50% 76%, rgba(229, 138, 77, .3), transparent 48%),
    linear-gradient(180deg, rgba(91, 49, 28, .92), rgba(69, 35, 21, .98));
}
.home-selection--framed .wine-visual::after {
  content: "";
  position: absolute;
  right: 18%;
  bottom: .7rem;
  left: 18%;
  height: .72rem;
  border-radius: 50%;
  background: rgba(15, 7, 3, .34);
  filter: blur(.45rem);
}
.home-selection--framed .wine-visual > svg,
.home-selection--framed .wine-visual > img {
  bottom: .8rem;
  height: calc(100% - 2.1rem);
  filter: drop-shadow(0 .9rem 1rem rgba(11, 5, 2, .48));
}
.home-selection--framed .wine-card:hover .wine-visual > svg,
.home-selection--framed .wine-card:hover .wine-visual > img,
.home-selection--framed .wine-card:focus-within .wine-visual > svg,
.home-selection--framed .wine-card:focus-within .wine-visual > img {
  transform: translate(-50%, -30%) scale(1.03);
  filter: drop-shadow(0 1.2rem 1.2rem rgba(11, 5, 2, .58));
}
.home-selection--framed .wine-body,
.home-selection--framed .wine-card-actions { background: rgba(78, 42, 24, .96) !important; }
.home-selection--framed .wine-body { gap: .22rem; padding: 1rem 1.05rem .25rem; }
.home-selection--framed .wine-domain {
  display: block;
  color: var(--home-shelf-muted);
  font-size: .69rem;
  letter-spacing: .1em;
}
.home-selection--framed .wine-appellation {
  display: block;
  color: var(--gold);
  font-size: .7rem;
  letter-spacing: .12em;
}
.home-selection--framed .wine-name,
.home-selection--framed .wine-name a,
.home-selection--framed .wine-price { color: var(--on-dark); }
.home-selection--framed .wine-name { font-size: clamp(1.05rem, 1.7vw, 1.28rem); }
.home-selection--framed .wine-year { color: var(--home-shelf-year); }
.home-selection--framed .wine-foot { padding-top: .7rem; border-color: rgba(237, 180, 122, .34); }
.home-selection--framed .wine-card-more { color: var(--gold); }
.home-selection--framed .wine-card-actions {
  display: flex;
  padding: .25rem 1.05rem 1.05rem;
  border-radius: 0 0 20px 20px;
}
.home-selection--framed .wine-card-add {
  width: 100%;
  padding-inline: 1rem;
  border-color: var(--brand);
  background: var(--brand);
  color: var(--on-brand);
}
.home-selection--framed .wine-card-add:hover { background: var(--gold-strong); }
.home-selection--framed .wine-card-add.is-added {
  border-color: var(--selection-added-border);
  background: var(--selection-added);
  color: var(--on-dark);
}
.home-selection--framed .wine-badge {
  border-color: rgba(255, 225, 192, .32);
  border-radius: 999px;
  background: rgba(47, 29, 17, .88);
  color: var(--header-text);
}
.home-selection--framed .wine-badge--prestige { display: none; }
.home-selection--framed .wine-badge--rouge { background: var(--badge-rouge-bg); color: var(--badge-rouge-text); }
.home-selection--framed .wine-badge--blanc { background: var(--badge-blanc-bg); color: var(--badge-blanc-text); }
.home-selection--framed .wine-badge--rosé { background: var(--badge-rose-bg); color: var(--badge-rose-text); }
.home-selection--framed .wine-badge--effervescent { background: var(--badge-bulles-bg); color: var(--badge-bulles-text); }
.home-selection--framed .wine-badge--promo { background: var(--promo); color: var(--on-brand); }
.home-selection--framed .home-featured-controls > button {
  border-color: rgba(237, 180, 122, .56);
  background: rgba(78, 42, 24, .96);
  color: var(--on-dark);
}
.home-selection--framed .home-selection-action { margin-top: clamp(1.75rem, 4vw, 2.5rem); }
.home-selection--framed .home-selection-action .btn-ghost {
  border-color: rgba(237, 180, 122, .64);
  color: var(--on-dark);
}
.home-selection--framed .home-selection-action .btn-ghost:hover { background: rgba(237, 180, 122, .12); }

/* Accueil cartes sombres : trois portes d'entrée éditoriales de même poids.
   Chaque bouteille du catalogue est ancrée dans un décor viticole cohérent. */
.home-universes--editorial {
  max-width: none;
  margin: 0;
  background:
    radial-gradient(circle at 8% 14%, rgba(255, 249, 239, .58), transparent 27rem),
    var(--paper);
  color: var(--paper-text);
}
.home-universes--editorial > .section-head,
.home-universes--editorial > .home-universe-grid {
  width: min(1180px, 100%);
  margin-inline: auto;
}
.home-universes--editorial .section-head .catalogue-page-eyebrow {
  color: var(--paper-accent) !important;
}
.home-universes--editorial .section-head h2 { color: var(--paper-text); }
.home-universes--editorial .section-head h2 em,
.home-selection--framed .section-head h2 em { font-style: normal; }
.home-universe-symbol { display: none; }
.home-universes--editorial .section-head > p:last-child {
  max-width: 48ch;
  color: var(--paper-muted);
  text-wrap: pretty;
}
.home-universes--editorial .home-universe-grid {
  grid-template-columns: 1fr;
  gap: 1.15rem;
}
.home-universes--editorial .home-universe,
.home-universes--editorial .home-universe--france,
.home-universes--editorial .home-universe--world,
.home-universes--editorial .home-universe--crus {
  display: grid;
  grid-column: auto;
  grid-template-rows: clamp(336px, 103vw, 390px) minmax(0, 1fr);
  min-height: 0;
  overflow: hidden;
  border: 1px solid rgba(143, 69, 36, .28);
  border-radius: 22px;
  background: rgba(255, 249, 240, .88);
  box-shadow: 0 20px 42px rgba(74, 34, 15, .12);
  color: var(--paper-text);
  transform: translateZ(0);
  transition: transform .28s cubic-bezier(.22, .8, .2, 1), border-color .28s ease, box-shadow .28s ease;
}
.home-universes--editorial .home-universe:hover,
.home-universes--editorial .home-universe:focus-visible {
  border-color: rgba(143, 69, 36, .56);
  background: rgba(255, 249, 240, .96);
  box-shadow: 0 22px 42px rgba(68, 31, 15, .14);
  transform: translateY(-5px);
}
.home-universes--editorial .home-universe:focus-visible {
  outline: 3px solid var(--paper-accent);
  outline-offset: 3px;
}
.home-universes--editorial .home-universe figure {
  position: relative;
  min-height: 0;
  margin: 0;
  overflow: hidden;
  border-bottom: 1px solid rgba(143, 69, 36, .22);
  background-color: var(--universe-brown);
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: cover;
}
.home-universes--editorial .home-universe figure::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  width: auto;
  height: auto;
  aspect-ratio: auto;
  border: 0;
  border-radius: 0;
  background: linear-gradient(180deg, rgba(24, 8, 2, .02), rgba(24, 8, 2, .2));
  transform: none;
  pointer-events: none;
}
.home-universes--editorial .home-universe figure::after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 44%;
  bottom: 42px;
  width: 29%;
  height: 8px;
  border-radius: 50%;
  background: rgba(12, 3, 0, .48);
  filter: blur(8px);
  transform: translateX(-50%);
  pointer-events: none;
}
.home-universes--editorial .home-universe--france figure {
  background-image: url("images/univers/univers-france-chateau.jpg");
  filter: brightness(.99) saturate(1.04) contrast(.98);
}
.home-universes--editorial .home-universe--world figure {
  background-image: url("images/univers/univers-monde-mendoza.jpg");
  filter: brightness(.99) saturate(1.04) contrast(.98);
}
.home-universes--editorial .home-universe--crus figure {
  background-image: url("images/univers/univers-grands-crus-provence.jpg");
  filter: brightness(.98) saturate(1.04) contrast(.98);
}
.home-universes--editorial .home-universe-bottle {
  position: absolute;
  z-index: 2;
  left: 43%;
  bottom: 46px;
  width: auto;
  height: 53%;
  max-width: 27%;
  object-fit: contain;
  filter: drop-shadow(0 8px 5px rgba(12, 3, 0, .58)) drop-shadow(0 1px 1px rgba(12, 3, 0, .65));
  transform: translateX(-50%);
  transition: transform .45s cubic-bezier(.22, .8, .2, 1);
}
.home-universes--editorial .home-universe-glass {
  position: absolute;
  z-index: 2;
  left: 55%;
  bottom: 46px;
  width: auto;
  height: 25%;
  object-fit: contain;
  filter: drop-shadow(0 6px 4px rgba(12, 3, 0, .5)) drop-shadow(0 1px 1px rgba(12, 3, 0, .58));
  transition: transform .45s cubic-bezier(.22, .8, .2, 1);
}
.home-universes--editorial .home-universe--france .home-universe-bottle,
.home-universes--editorial .home-universe--france .home-universe-glass { bottom: 52px; }
.home-universes--editorial .home-universe--france figure::after { bottom: 48px; }
.home-universes--editorial .home-universe--world .home-universe-bottle,
.home-universes--editorial .home-universe--world .home-universe-glass { bottom: 58px; }
.home-universes--editorial .home-universe--world figure::after { bottom: 54px; }
.home-universes--editorial .home-universe--crus .home-universe-bottle,
.home-universes--editorial .home-universe--crus .home-universe-glass { bottom: 60px; }
.home-universes--editorial .home-universe--crus figure::after { bottom: 56px; }
.home-universes--editorial .home-universe-origin {
  position: absolute;
  z-index: 3;
  top: 20px;
  left: 22px;
  max-width: calc(100% - 44px);
  color: var(--on-dark);
  font: 800 .7rem/1.35 var(--sans);
  letter-spacing: .14em;
  text-shadow: 0 2px 8px rgba(24, 8, 2, .85);
  text-transform: uppercase;
}
.home-universes--editorial .home-universe-tag {
  position: absolute;
  z-index: 3;
  top: 18px;
  left: 18px;
  padding: 9px 13px;
  border: 1px solid rgba(255, 255, 255, .36);
  border-radius: 999px;
  background: rgba(31, 12, 5, .6);
  color: var(--on-dark);
  font-size: .69rem;
  font-weight: 800;
  letter-spacing: .12em;
  line-height: 1;
  text-transform: uppercase;
  backdrop-filter: blur(9px);
}
.home-universes--editorial .home-universe:hover .home-universe-bottle,
.home-universes--editorial .home-universe:focus-visible .home-universe-bottle {
  transform: translateX(-50%) translateY(-4px) scale(1.025);
}
.home-universes--editorial .home-universe:hover .home-universe-glass,
.home-universes--editorial .home-universe:focus-visible .home-universe-glass {
  transform: translateY(-3px) scale(1.02);
}
.home-universes--editorial .home-universe > div {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-height: 230px;
  padding: 1.25rem 1.35rem 1.2rem;
}
.home-universes--editorial .home-universe > div > span {
  position: static;
  color: var(--paper-accent-strong);
  font-variant-numeric: tabular-nums;
}
.home-universes--editorial .home-universe h3 {
  margin: .35rem 0 .55rem;
  color: var(--paper-text);
  font-size: clamp(1.9rem, 7.2vw, 2.45rem);
  line-height: 1;
  letter-spacing: -.02em;
  text-wrap: balance;
}
.home-universes--editorial .home-universe p {
  max-width: 35ch;
  margin: 0 0 1rem;
  color: var(--paper-muted);
  font-size: .9rem;
  line-height: 1.55;
  text-wrap: pretty;
}
.home-universes--editorial .home-universe > div > strong {
  position: static;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 47px;
  margin: auto 0 0;
  padding-top: .8rem;
  border-top: 1px solid rgba(143, 69, 36, .2);
  color: var(--paper-accent);
  font-size: .78rem;
  letter-spacing: .02em;
}
.home-universes--editorial .home-universe > div > strong span {
  display: inline-grid;
  place-items: center;
  width: 32px;
  height: 32px;
  margin-left: .75rem;
  border: 1px solid rgba(143, 69, 36, .32);
  border-radius: 50%;
  font-size: 1rem;
  transition: color .22s ease, background-color .22s ease, transform .22s ease;
}
.home-universes--editorial .home-universe:hover > div > strong span,
.home-universes--editorial .home-universe:focus-visible > div > strong span {
  background: var(--paper-accent);
  color: var(--on-dark);
  transform: translateX(3px);
}

@media (max-width: 819px) {
  .home-selection--shelf,
  .home-selection--framed { padding-block: 2.8rem 3.35rem; }
  .home-selection--shelf > .cat-grid.home-featured-carousel,
  .home-selection--framed > .cat-grid.home-featured-carousel {
    width: auto;
    margin-inline: -1rem;
    align-items: flex-start;
  }
  .home-selection--shelf .home-featured-carousel .wine-card,
  .home-selection--framed .home-featured-carousel .wine-card { align-self: flex-start; }
  .home-selection--framed .home-featured-carousel .wine-card {
    flex-basis: clamp(15.5rem, 78vw, 29rem);
  }
  .home-selection--shelf .home-featured-carousel .wine-card.is-active { box-shadow: none; }
  .home-selection--framed .home-featured-carousel .wine-card.is-active {
    box-shadow: 0 22px 46px rgba(11, 5, 2, .38);
  }
  .home-selection--shelf .wine-visual { height: 18.5rem; }
  .home-selection--framed .wine-visual { height: 18.5rem; }
  .home-selection--shelf .wine-card-add,
  .home-selection--framed .wine-card-add { width: 100%; }
  .home-selection--shelf .wine-card:not(.is-active) .wine-visual-meta,
  .home-selection--shelf .wine-card:not(.is-active) .wine-body,
  .home-selection--shelf .wine-card:not(.is-active) .wine-card-actions,
  .home-selection--framed .wine-card:not(.is-active) .wine-visual-meta,
  .home-selection--framed .wine-card:not(.is-active) .wine-body,
  .home-selection--framed .wine-card:not(.is-active) .wine-card-actions {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
  }
  .home-selection--framed .wine-card:not(.is-active),
  .home-selection--framed .wine-card:not(.is-active) .wine-visual {
    border-color: transparent !important;
    background: transparent !important;
    box-shadow: none;
  }
  .home-selection--shelf .wine-card:not(.is-active) .wine-visual > svg,
  .home-selection--shelf .wine-card:not(.is-active) .wine-visual > img,
  .home-selection--framed .wine-card:not(.is-active) .wine-visual > svg,
  .home-selection--framed .wine-card:not(.is-active) .wine-visual > img {
    height: 72%;
    opacity: .54;
    filter: drop-shadow(0 .75rem .8rem rgba(24, 12, 6, .2));
  }
  .home-selection--shelf .wine-card.is-previous .wine-visual > svg,
  .home-selection--shelf .wine-card.is-previous .wine-visual > img,
  .home-selection--framed .wine-card.is-previous .wine-visual > svg,
  .home-selection--framed .wine-card.is-previous .wine-visual > img { left: 91%; }
  .home-selection--shelf .wine-card.is-next .wine-visual > svg,
  .home-selection--shelf .wine-card.is-next .wine-visual > img,
  .home-selection--framed .wine-card.is-next .wine-visual > svg,
  .home-selection--framed .wine-card.is-next .wine-visual > img { left: 9%; }
}

@media (min-width: 900px) {
  .home-selection--shelf .cat-grid--selection,
  .home-selection--framed .cat-grid--selection { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .home-selection--shelf .wine-name,
  .home-selection--framed .wine-name { min-height: 2.65rem; }

  .home-universes--visual .home-universe,
  .home-universes--visual .home-universe--france,
  .home-universes--visual .home-universe--world,
  .home-universes--visual .home-universe--crus {
    min-height: 482px;
    grid-template-rows: 276px minmax(0, 1fr);
  }
  .home-universes--visual .home-universe figure,
  .home-universes--visual .home-universe--france figure,
  .home-universes--visual .home-universe--world figure,
  .home-universes--visual .home-universe--crus figure { min-height: 276px; }

  .home-selection--shelf .cat-grid--shelf .wine-card + .wine-card::before {
    content: "";
    position: absolute;
    top: 6%;
    bottom: .4rem;
    left: 0;
    width: 1px;
    background: linear-gradient(180deg, transparent, rgba(237, 180, 122, .24) 18%, rgba(237, 180, 122, .24) 82%, transparent);
  }

  .home-universes--editorial .section-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, .62fr);
    column-gap: clamp(3rem, 9vw, 7rem);
    align-items: end;
    max-width: 1180px;
    text-align: left;
  }
  .home-universes--editorial .section-head .catalogue-page-eyebrow,
  .home-universes--editorial .section-head h2 { grid-column: 1; }
  .home-universes--editorial .section-head > p:last-child {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: end;
    margin-bottom: .25rem;
  }
  .home-universes--editorial .home-universe-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(1rem, 2vw, 1.35rem);
  }
  .home-universes--editorial .home-universe,
  .home-universes--editorial .home-universe--france,
  .home-universes--editorial .home-universe--world,
  .home-universes--editorial .home-universe--crus {
    grid-template-columns: none;
    grid-template-rows: 365px minmax(0, 1fr);
    min-height: 575px;
  }
  .home-universes--editorial .home-universe figure {
    height: 365px;
    min-height: 365px;
    border-right: 0;
    border-bottom: 1px solid rgba(143, 69, 36, .22);
  }
  .home-universes--editorial .home-universe > div {
    min-height: 210px;
    padding: 1.3rem 1.4rem 1.2rem;
  }
  .home-universes--editorial .home-universe h3 { font-size: clamp(2rem, 2.55vw, 2.55rem); }
}

/* Accueil officiel : une seule logique tactile pour les univers et la
   sélection. Le bureau conserve strictement ses trois colonnes validées. */
@media (max-width: 899px) {
  body[data-home-variant] .hero-hours {
    display: grid;
    width: fit-content;
    max-width: calc(100vw - 3rem);
    flex: 0 0 auto;
    align-self: flex-start;
    justify-self: start;
    gap: .32rem;
    margin-top: .1rem;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    line-height: 1.3;
    text-align: left;
  }
  body[data-home-variant] .hero-hours > span {
    display: grid;
    grid-template-columns: .38rem minmax(0, auto);
    align-items: center;
    gap: .5rem;
    max-width: 100%;
  }
  body[data-home-variant] .hero-hours > span::before {
    content: "";
    width: .3rem;
    height: .3rem;
    margin: 0;
    border-radius: 50%;
    background: var(--gold);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--gold) 16%, transparent);
  }

  html.has-js .home-card-carousel {
    --home-carousel-height: 40rem;
    position: relative;
    isolation: isolate;
    contain: layout paint;
    display: block !important;
    width: 100%;
    height: var(--home-carousel-height);
    min-height: 0;
    margin-inline: auto !important;
    padding: 0 !important;
    overflow: clip !important;
    overscroll-behavior-inline: contain;
    touch-action: pan-y;
    user-select: none;
    -webkit-user-select: none;
    outline: none;
  }
  html.has-js .home-card-carousel:focus-visible {
    outline: 3px solid var(--focus);
    outline-offset: 8px;
    border-radius: 22px;
  }
  html.has-js .home-card-carousel > .home-carousel-card {
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 0;
    width: clamp(11.25rem, 52vw, 14rem);
    margin: 0 !important;
    opacity: 0;
    pointer-events: none;
    transform: translateX(-50%) translateY(1.25rem) scale(.76);
    transform-origin: 50% 12%;
    transition:
      left .36s cubic-bezier(.22, .8, .2, 1),
      opacity .28s ease,
      transform .36s cubic-bezier(.22, .8, .2, 1),
      box-shadow .28s ease;
    will-change: left, opacity, transform;
  }
  html.has-js .home-card-carousel > .home-carousel-card.is-previous,
  html.has-js .home-card-carousel > .home-carousel-card.is-next {
    z-index: 1;
    opacity: .47;
    pointer-events: auto;
    filter: saturate(.82) brightness(.82);
  }
  html.has-js .home-card-carousel > .home-carousel-card.is-previous { left: 11%; }
  html.has-js .home-card-carousel > .home-carousel-card.is-next { left: 89%; }
  html.has-js .home-card-carousel > .home-carousel-card.is-active {
    left: 50%;
    z-index: 3;
    opacity: 1;
    pointer-events: auto;
    filter: none;
    transform: translateX(-50%) translateY(0) scale(1);
  }
  html.has-js .home-card-carousel > .home-carousel-card.is-previous *,
  html.has-js .home-card-carousel > .home-carousel-card.is-next * { pointer-events: none; }

  html.has-js .home-universes--editorial .home-universe-grid.home-card-carousel {
    max-width: min(100%, 46rem);
    gap: 0;
  }
  html.has-js .home-universes--editorial .home-card-carousel > .home-universe,
  html.has-js .home-universes--editorial .home-card-carousel > .home-universe:hover,
  html.has-js .home-universes--editorial .home-card-carousel > .home-universe:focus-visible {
    grid-template-columns: none;
    grid-template-rows: clamp(12rem, 58vw, 15.5rem) minmax(0, 1fr);
    min-height: 0;
  }
  html.has-js .home-universes--editorial .home-card-carousel > .home-universe.is-previous,
  html.has-js .home-universes--editorial .home-card-carousel > .home-universe.is-next {
    border-color: rgba(143, 69, 36, .32);
    background: rgba(255, 249, 240, .92);
    box-shadow: 0 14px 30px rgba(74, 34, 15, .1);
  }
  html.has-js .home-universes--editorial .home-card-carousel > .home-universe.is-active,
  html.has-js .home-universes--editorial .home-card-carousel > .home-universe.is-active:hover,
  html.has-js .home-universes--editorial .home-card-carousel > .home-universe.is-active:focus-visible {
    border-color: rgba(143, 69, 36, .44);
    box-shadow: 0 24px 48px rgba(74, 34, 15, .18);
    transform: translateX(-50%) translateY(0) scale(1);
  }
  html.has-js .home-universes--editorial .home-card-carousel .home-universe figure {
    height: auto;
    min-height: 0;
  }
  html.has-js .home-universes--editorial .home-card-carousel .home-universe > div {
    min-height: 10.8rem;
    padding: 1rem 1.05rem .9rem;
  }
  html.has-js .home-universes--editorial .home-card-carousel .home-universe h3 {
    margin-block: .28rem .4rem;
    font-size: clamp(1.48rem, 6.6vw, 1.85rem);
  }
  html.has-js .home-universes--editorial .home-card-carousel .home-universe p {
    margin-bottom: .72rem;
    font-size: .8rem;
    line-height: 1.42;
  }
  html.has-js .home-universes--editorial .home-card-carousel .home-universe > div > strong {
    min-height: 40px;
    padding-top: .58rem;
    font-size: .72rem;
  }
  html.has-js .home-universes--editorial .home-card-carousel .home-universe:not(.is-active) > div {
    visibility: visible;
    opacity: 1;
    pointer-events: none;
  }
  .home-universe-controls {
    width: min(100%, 22rem);
    margin: 1.1rem auto 0;
  }
  .home-universe-controls > button {
    border-color: rgba(143, 69, 36, .42);
    background: rgba(255, 249, 240, .96);
    color: var(--paper-accent);
  }
  .home-universe-controls .home-carousel-hint { color: var(--paper-accent); }

  html.has-js .home-selection--shelf > .cat-grid.home-card-carousel,
  html.has-js .home-selection--framed > .cat-grid.home-card-carousel {
    width: min(100%, 46rem);
    max-width: 46rem;
    align-items: initial;
    gap: 0;
  }
  html.has-js .home-selection--shelf .home-card-carousel > .wine-card,
  html.has-js .home-selection--framed .home-card-carousel > .wine-card {
    align-self: auto;
    flex: 0 0 auto;
    width: clamp(11.25rem, 52vw, 14rem);
  }
  html.has-js .home-selection--shelf .home-card-carousel .wine-visual,
  html.has-js .home-selection--framed .home-card-carousel .wine-visual {
    aspect-ratio: auto;
    height: clamp(13rem, 58vw, 15.5rem);
  }
  html.has-js .home-selection--shelf .home-card-carousel > .wine-card.is-previous,
  html.has-js .home-selection--shelf .home-card-carousel > .wine-card.is-next,
  html.has-js .home-selection--framed .home-card-carousel > .wine-card.is-previous,
  html.has-js .home-selection--framed .home-card-carousel > .wine-card.is-next {
    border-color: rgba(237, 180, 122, .4) !important;
    background: rgba(78, 42, 24, .96) !important;
    box-shadow: 0 14px 30px rgba(11, 5, 2, .22);
  }
  html.has-js .home-selection--shelf .home-card-carousel > .wine-card.is-active,
  html.has-js .home-selection--framed .home-card-carousel > .wine-card.is-active,
  html.has-js .home-selection--shelf .home-card-carousel > .wine-card.is-active:hover,
  html.has-js .home-selection--framed .home-card-carousel > .wine-card.is-active:hover,
  html.has-js .home-selection--shelf .home-card-carousel > .wine-card.is-active:focus-within,
  html.has-js .home-selection--framed .home-card-carousel > .wine-card.is-active:focus-within {
    transform: translateX(-50%) translateY(0) scale(1);
  }
  html.has-js .home-selection--shelf .home-card-carousel .wine-card:not(.is-active) .wine-visual-meta,
  html.has-js .home-selection--shelf .home-card-carousel .wine-card:not(.is-active) .wine-body,
  html.has-js .home-selection--shelf .home-card-carousel .wine-card:not(.is-active) .wine-card-actions,
  html.has-js .home-selection--framed .home-card-carousel .wine-card:not(.is-active) .wine-visual-meta,
  html.has-js .home-selection--framed .home-card-carousel .wine-card:not(.is-active) .wine-body,
  html.has-js .home-selection--framed .home-card-carousel .wine-card:not(.is-active) .wine-card-actions {
    visibility: visible;
    opacity: 1;
  }
  html.has-js .home-selection--framed .home-card-carousel .wine-card:not(.is-active) .wine-visual {
    border-color: rgba(237, 180, 122, .32) !important;
    background:
      radial-gradient(ellipse at 50% 76%, rgba(229, 138, 77, .3), transparent 48%),
      linear-gradient(180deg, rgba(91, 49, 28, .92), rgba(69, 35, 21, .98)) !important;
  }
  html.has-js .home-selection--shelf .home-card-carousel .wine-card:not(.is-active) .wine-visual > svg,
  html.has-js .home-selection--shelf .home-card-carousel .wine-card:not(.is-active) .wine-visual > img,
  html.has-js .home-selection--framed .home-card-carousel .wine-card:not(.is-active) .wine-visual > svg,
  html.has-js .home-selection--framed .home-card-carousel .wine-card:not(.is-active) .wine-visual > img {
    left: 50%;
    height: 72%;
    opacity: .78;
    filter: drop-shadow(0 .9rem 1rem rgba(11, 5, 2, .48));
  }
  html.has-js .home-selection--shelf .home-card-carousel .wine-card:hover .wine-visual > svg,
  html.has-js .home-selection--shelf .home-card-carousel .wine-card:hover .wine-visual > img,
  html.has-js .home-selection--shelf .home-card-carousel .wine-card:focus-within .wine-visual > svg,
  html.has-js .home-selection--shelf .home-card-carousel .wine-card:focus-within .wine-visual > img,
  html.has-js .home-selection--framed .home-card-carousel .wine-card:hover .wine-visual > svg,
  html.has-js .home-selection--framed .home-card-carousel .wine-card:hover .wine-visual > img,
  html.has-js .home-selection--framed .home-card-carousel .wine-card:focus-within .wine-visual > svg,
  html.has-js .home-selection--framed .home-card-carousel .wine-card:focus-within .wine-visual > img {
    transform: translateX(-50%) !important;
  }
  html.has-js .home-universes--editorial .home-card-carousel .home-universe:hover .home-universe-bottle,
  html.has-js .home-universes--editorial .home-card-carousel .home-universe:focus-visible .home-universe-bottle {
    transform: translateX(-50%) !important;
  }
  html.has-js .home-universes--editorial .home-card-carousel .home-universe:hover .home-universe-glass,
  html.has-js .home-universes--editorial .home-card-carousel .home-universe:focus-visible .home-universe-glass {
    transform: none !important;
  }
  .home-carousel-dots { display: flex; align-items: center; gap: 0; }
  .home-carousel-dots button {
    position: relative;
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    cursor: pointer;
  }
  .home-carousel-dots button:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
  .home-carousel-dots button::before {
    content: "";
    width: 10px;
    height: 10px;
    border: 1px solid var(--brand);
    border-radius: 50%;
    background: transparent;
    transition: width .2s ease, border-radius .2s ease, background-color .2s ease;
  }
  .home-carousel-dots button.is-active::before { width: 24px; border-radius: 999px; background: var(--brand); }

  /* Traduction mobile validée : une surface papier continue, sans halo ni
     ombre portée, laisse la profondeur venir uniquement des trois cartes. */
  body[data-home-variant="editorial"] .home-universes--editorial {
    padding-block: 3.8rem 3.4rem;
    background: var(--paper);
    color: var(--paper-text);
  }
  body[data-home-variant="editorial"] .home-universes--editorial .section-head {
    max-width: 24rem;
    margin-bottom: 2.35rem;
    text-align: center;
  }
  body[data-home-variant="editorial"] .home-universes--editorial .section-head .catalogue-page-eyebrow {
    margin-bottom: .85rem;
    color: var(--brand) !important;
    letter-spacing: .22em;
  }
  body[data-home-variant="editorial"] .home-universes--editorial .section-head h2 {
    margin: 0;
    color: var(--paper-text);
    font-size: clamp(2rem, 10vw, 2.7rem);
    line-height: 1.04;
    letter-spacing: .025em;
    text-transform: uppercase;
  }
  body[data-home-variant="editorial"] .home-universes--editorial .section-head h2 span,
  body[data-home-variant="editorial"] .home-universes--editorial .section-head h2 em {
    display: block;
  }
  body[data-home-variant="editorial"] .home-universes--editorial .section-head h2 em {
    margin-top: .2rem;
    color: var(--brand);
  }
  body[data-home-variant="editorial"] .home-universes--editorial .section-head > p:last-child {
    max-width: 29ch;
    margin: 1.15rem auto 0;
    color: var(--paper-muted);
    font-size: .98rem;
    line-height: 1.48;
  }
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel > .home-universe,
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel > .home-universe:hover,
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel > .home-universe:focus-visible {
    display: block;
    height: clamp(29.5rem, 118vw, 32.5rem);
    overflow: hidden;
    border: 1.5px solid rgba(232, 139, 80, .76);
    border-radius: 1.55rem;
    background: var(--home-framed-mid);
    box-shadow: none;
  }
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel > .home-universe.is-active,
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel > .home-universe.is-active:hover,
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel > .home-universe.is-active:focus-visible {
    border-color: var(--brand);
    box-shadow: none;
  }
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel > .home-universe::after {
    content: "";
    position: absolute;
    z-index: 6;
    inset: 0;
    border: 1.5px solid rgba(232, 139, 80, .76);
    border-radius: inherit;
    pointer-events: none;
  }
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel > .home-universe.is-active::after {
    border-color: var(--brand);
  }
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel > .home-universe.is-previous {
    transform: translateX(-50%) translateY(1.35rem) scale(.42);
    transform-origin: 50% 55%;
  }
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel > .home-universe.is-next {
    transform: translateX(-50%) translateY(1.35rem) scale(.42);
    transform-origin: 50% 55%;
  }
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel .home-universe figure {
    position: absolute;
    inset: 0;
    height: 100%;
    border: 0;
  }
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel .home-universe figure::before {
    background: linear-gradient(180deg, rgba(18, 6, 2, .03) 22%, rgba(19, 7, 3, .2) 52%, rgba(24, 8, 3, .98) 88%);
  }
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel .home-universe figure::after {
    display: none;
  }
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel .home-universe-tag {
    display: none;
  }
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel .home-universe-bottle {
    left: 46%;
    bottom: 11.9rem;
    height: 43%;
    max-width: 34%;
  }
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel .home-universe-glass {
    left: 64%;
    bottom: 11.9rem;
    height: 20%;
  }
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel .home-universe > div {
    position: absolute;
    z-index: 4;
    right: 0;
    bottom: 0;
    left: 0;
    min-height: 13.7rem;
    padding: 4.2rem 1.05rem 1.2rem;
    align-items: center;
    justify-content: flex-start;
    background: linear-gradient(180deg, rgba(31, 12, 5, 0), rgba(31, 12, 5, .88) 28%, rgba(31, 12, 5, .98));
    text-align: center;
  }
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel .home-universe > div > span,
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel .home-universe > div > strong {
    display: none;
  }
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel .home-universe h3 {
    max-width: 8.5ch;
    margin: 0 auto .75rem;
    color: var(--on-dark);
    font-size: clamp(1.42rem, 7vw, 1.82rem);
    line-height: 1.08;
    letter-spacing: .035em;
    text-align: center;
    text-transform: uppercase;
  }
  html.has-js body[data-home-variant="editorial"] .home-universes--editorial .home-card-carousel .home-universe p {
    max-width: 21ch;
    margin: 0 auto;
    color: rgba(255, 225, 198, .7);
    font-size: .76rem;
    line-height: 1.5;
    text-align: center;
  }
  body[data-home-variant="editorial"] .home-universe-controls > button {
    width: 3.35rem;
    height: 3.35rem;
    border-color: rgba(143, 69, 36, .38);
    background: rgba(255, 249, 240, .92);
    color: var(--paper-accent);
    box-shadow: none;
  }

  body[data-home-variant="editorial"] .home-selection--framed {
    padding-block: 3.7rem 3.8rem;
    background:
      linear-gradient(rgba(58, 38, 25, .18), rgba(58, 38, 25, .3)),
      url("images/motif-cuivre-local.jpg") center / cover no-repeat;
    border-color: rgba(237, 180, 122, .2);
    color: var(--on-dark);
  }
  body[data-home-variant="editorial"] .home-selection--framed .section-head {
    max-width: 25rem;
    margin-bottom: 2.35rem;
  }
  body[data-home-variant="editorial"] .home-selection--framed .section-head .catalogue-page-eyebrow {
    display: none;
  }
  body[data-home-variant="editorial"] .home-selection--framed .section-head h2 {
    color: var(--on-dark);
    font-size: clamp(2.45rem, 11.5vw, 3.15rem);
    line-height: .98;
    text-wrap: balance;
  }
  body[data-home-variant="editorial"] .home-selection--framed .section-head h2 span,
  body[data-home-variant="editorial"] .home-selection--framed .section-head h2 em {
    display: block;
  }
  body[data-home-variant="editorial"] .home-selection--framed .section-head h2 em {
    margin-top: .18rem;
    color: var(--brand);
  }
  body[data-home-variant="editorial"] .home-selection--framed .section-head > p:last-child {
    max-width: 29ch;
    margin: 1.25rem auto 0;
    color: var(--home-shelf-muted);
    font-size: .98rem;
    line-height: 1.5;
  }
  html.has-js body[data-home-variant="editorial"] .home-selection--framed .home-card-carousel > .wine-card {
    overflow: hidden;
    border: 1.5px solid rgba(232, 139, 80, .58) !important;
    border-radius: 1.55rem;
    background: rgba(76, 38, 23, .98) !important;
    box-shadow: none;
  }
  html.has-js body[data-home-variant="editorial"] .home-selection--framed .home-card-carousel > .wine-card.is-active {
    border-color: var(--brand) !important;
    box-shadow: none;
  }
  html.has-js body[data-home-variant="editorial"] .home-selection--framed .home-card-carousel > .wine-card.is-previous,
  html.has-js body[data-home-variant="editorial"] .home-selection--framed .home-card-carousel > .wine-card.is-next {
    opacity: .56;
    filter: saturate(.72) brightness(.76);
    transform: translateX(-50%) translateY(1.55rem) scale(.42);
  }
  html.has-js body[data-home-variant="editorial"] .home-selection--framed .home-card-carousel > .wine-card.is-active .wine-visual > svg,
  html.has-js body[data-home-variant="editorial"] .home-selection--framed .home-card-carousel > .wine-card.is-active .wine-visual > img {
    height: 80%;
  }
  html.has-js body[data-home-variant="editorial"] .home-selection--framed .home-card-carousel > .wine-card:not(.is-active) .wine-visual > svg,
  html.has-js body[data-home-variant="editorial"] .home-selection--framed .home-card-carousel > .wine-card:not(.is-active) .wine-visual > img {
    height: 70%;
  }
  html.has-js body[data-home-variant="editorial"] .home-selection--framed .home-card-carousel .wine-card:not(.is-active) .wine-visual-meta,
  html.has-js body[data-home-variant="editorial"] .home-selection--framed .home-card-carousel .wine-card:not(.is-active) .wine-body,
  html.has-js body[data-home-variant="editorial"] .home-selection--framed .home-card-carousel .wine-card:not(.is-active) .wine-card-actions {
    visibility: visible;
    opacity: 1;
  }
  body[data-home-variant="editorial"] .home-selection--framed .home-featured-controls {
    margin-top: 1.55rem;
  }
  body[data-home-variant="editorial"] .home-selection--framed .home-featured-controls > button {
    width: 3.35rem;
    height: 3.35rem;
    border-color: rgba(237, 180, 122, .56);
    background: rgba(78, 42, 24, .96);
    color: var(--on-dark);
    box-shadow: none;
  }
  body[data-home-variant="editorial"] .home-carousel-dots button::before {
    border-color: var(--brand);
  }
  body[data-home-variant="editorial"] .home-carousel-dots button.is-active::before {
    background: var(--brand);
  }
  body[data-home-variant="editorial"] .home-selection--framed .home-selection-action .btn-ghost {
    border-color: rgba(237, 180, 122, .64);
    color: var(--on-dark);
  }
  body[data-home-variant="editorial"] .home-selection--framed .home-selection-action .btn-ghost:hover {
    background: rgba(237, 180, 122, .12);
  }
}

@media (min-width: 640px) and (max-width: 899px) {
  html.has-js .home-card-carousel > .home-carousel-card {
    width: min(56vw, 27rem);
    transform: translateX(-50%) translateY(1.25rem) scale(.88);
  }
  html.has-js .home-card-carousel > .home-carousel-card.is-previous,
  html.has-js .home-card-carousel > .home-carousel-card.is-next { opacity: .43; }
  html.has-js .home-card-carousel > .home-carousel-card.is-previous { left: 12%; }
  html.has-js .home-card-carousel > .home-carousel-card.is-next { left: 88%; }
  html.has-js .home-universes--editorial .home-card-carousel > .home-universe,
  html.has-js .home-universes--editorial .home-card-carousel > .home-universe:hover,
  html.has-js .home-universes--editorial .home-card-carousel > .home-universe:focus-visible {
    grid-template-rows: 21rem minmax(0, 1fr);
  }
  html.has-js .home-selection--shelf .home-card-carousel > .wine-card,
  html.has-js .home-selection--framed .home-card-carousel > .wine-card { width: min(56vw, 27rem); }
  .home-universe-controls { width: min(56vw, 27rem); }
}

@media (prefers-reduced-motion: reduce) {
  html.has-js .home-card-carousel > .home-carousel-card,
  .home-carousel-dots button { transition: none; }
  .home-universes--editorial .home-universe:hover,
  .home-universes--editorial .home-universe:focus-visible,
  .home-universes--editorial .home-universe:hover > div > strong span,
  .home-universes--editorial .home-universe:focus-visible > div > strong span { transform: none; }
  .home-universes--editorial .home-universe:hover .home-universe-bottle,
  .home-universes--editorial .home-universe:focus-visible .home-universe-bottle { transform: translateX(-50%); }
  .home-universes--editorial .home-universe:hover .home-universe-glass,
  .home-universes--editorial .home-universe:focus-visible .home-universe-glass { transform: none; }
}

/* ============================================================
   Confirmation de la sélection
   ============================================================ */
.selection-confirmation-page { width: min(100% - 2rem, 980px); min-height: 62vh; margin: 0 auto; padding: clamp(2rem, 6vw, 5rem) 0 clamp(4rem, 8vw, 7rem); }
.selection-confirmation-card { padding: clamp(1.35rem, 4vw, 3rem); border: 1px solid var(--line); border-radius: 22px; background: var(--card); box-shadow: 0 24px 60px color-mix(in srgb, var(--shadow) 10%, transparent); }
.selection-confirmation-card[hidden] { display: none; }
.selection-confirmation-kicker { margin: 0 0 .55rem; color: var(--brand-text); font-size: .75rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.selection-confirmation-card h1 { max-width: 12em; color: var(--wine); font-size: clamp(2.5rem, 8vw, 5rem); line-height: .98; }
.selection-confirmation-card h1:focus { outline: none; }
.selection-confirmation-lede, .selection-confirmation-card--unavailable > p:not(.selection-confirmation-kicker) { max-width: 64ch; margin: 1rem 0 1.6rem; color: var(--text-muted); font-size: clamp(.95rem, 2.5vw, 1.1rem); line-height: 1.7; }
.selection-confirmation-facts, .selection-confirmation-total { display: grid; grid-template-columns: 1fr; margin: 0 0 1.5rem; border-block: 1px solid var(--line); }
.selection-confirmation-facts div, .selection-confirmation-total div { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding: .8rem 0; }
.selection-confirmation-facts div + div, .selection-confirmation-total div + div { border-top: 1px solid var(--line); }
.selection-confirmation-facts dt, .selection-confirmation-total dt { color: var(--muted); font-size: .8rem; }
.selection-confirmation-facts dd, .selection-confirmation-total dd { margin: 0; color: var(--wine); font-weight: 700; text-align: right; }
.selection-confirmation-list { display: grid; gap: .65rem; margin: 0 0 1.5rem; }
.selection-confirmation-item { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.selection-confirmation-item > div { min-width: 0; }
.selection-confirmation-item p { margin: 0; color: var(--muted); font-size: .75rem; }
.selection-confirmation-item h2 { margin: .18rem 0; color: var(--wine); font-size: clamp(1.2rem, 4vw, 1.55rem); overflow-wrap: anywhere; }
.selection-confirmation-item > strong { flex: 0 0 auto; color: var(--wine); font: 600 1.2rem var(--serif); }
.selection-confirmation-next { display: grid; gap: .25rem; margin: 1.5rem 0; padding: 1rem 1.1rem; border-left: 4px solid var(--brand); background: var(--surface-warm); color: var(--text); }
.selection-confirmation-next span { color: var(--text-muted); line-height: 1.6; }
.selection-confirmation-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
.selection-confirmation-actions .btn { display: inline-flex; align-items: center; justify-content: center; }
.selection-confirmation-card--unavailable { max-width: 720px; margin-inline: auto; text-align: center; }
.selection-confirmation-card--unavailable h1 { margin-inline: auto; }
.selection-confirmation-card--unavailable > p { margin-inline: auto !important; }
.selection-confirmation-card--unavailable .selection-confirmation-actions { justify-content: center; }

@media (min-width: 700px) {
  .selection-confirmation-facts, .selection-confirmation-total { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .selection-confirmation-facts div, .selection-confirmation-total div { display: grid; gap: .25rem; }
  .selection-confirmation-facts div + div, .selection-confirmation-total div + div { border-top: 0; border-left: 1px solid var(--line); padding-left: 1.25rem; }
  .selection-confirmation-facts dd, .selection-confirmation-total dd { text-align: left; }
  .selection-confirmation-item { padding: 1rem 1.2rem; }
}

@media (max-width: 520px) {
  .selection-confirmation-actions { display: grid; }
  .selection-confirmation-actions .btn { width: 100%; }
  .selection-confirmation-item { align-items: flex-end; }
}