/* Château Saint Louis : accueil 2026. Généré depuis maquette-accueil/style.css
   par un préfixage body.nsa-accueil. Modifier la maquette, puis regénérer. */
/* ==========================================================================
   Château Saint Louis : accueil, version modernisée de l'existant.
   On garde l'identité du site : fond clair, Bodoni du thème, rouge profond
   #830000, cuivre #c96838, surtitres en capitales espacées, mots manuscrits.
   On change la mise en forme : lisibilité, rythme, alignements, états.
   ========================================================================== */

@font-face { font-family: "Bodoni Body"; src: url("polices/Bodoni-custom-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Bodoni Body"; src: url("polices/Bodoni-custom-Italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Bodoni Body"; src: url("polices/Bodoni-custom-SemiBold.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Bodoni Slide"; src: url("polices/Bodoni-slide.woff2") format("woff2"); font-weight: 400; font-display: swap; }

@font-face { font-family: "Poppins"; src: url("polices/poppins-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("polices/poppins-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("polices/poppins-600.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }

:root {
  /* Couleurs de la charte existante */
  --rouge: #830000;
  --rouge-fonce: #5e0000;
  --cuivre: #c96838;
  --cuivre-texte: #a8511f;      /* cuivre assombri pour le petit texte : 4,9:1 sur blanc */
  --brun: #3a1d12;

  /* Neutres tirés vers le chaud */
  --fond: #fdfbf8;
  --fond-2: #f6f1ea;
  --blanc: #fffefc;
  --encre: #1d1714;
  --texte: #4b423d;             /* 9:1 sur fond, là où l'ancien gris #666 à 14 px peinait */
  --texte-doux: #6f655e;
  --filet: #e8dfd4;

  --titre: "Bodoni Body", "Bodoni Moda", Didot, serif;
  --script: "Bodoni Slide", cursive;
  --sans: "Poppins", system-ui, sans-serif;

  --ease: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-doux: cubic-bezier(0.19, 1, 0.22, 1);

  --gouttiere: clamp(1rem, 4vw, 2.5rem);
  --rayon: 2px;
  --z-header: 30;
}

body.nsa-accueil *, body.nsa-accueil *::before, body.nsa-accueil *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 6rem; -webkit-text-size-adjust: 100%; }
body.nsa-accueil {
  margin: 0;
  background: var(--fond);
  color: var(--texte);
  font-family: var(--titre);
  font-size: 1.0625rem;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
body.nsa-accueil img { display: block; max-width: 100%; height: auto; }
body.nsa-accueil a { color: inherit; }
body.nsa-accueil h1, body.nsa-accueil h2, body.nsa-accueil h3 { margin: 0; font-weight: 400; color: var(--encre); text-wrap: balance; }
body.nsa-accueil p { margin: 0; text-wrap: pretty; }
body.nsa-accueil ul, body.nsa-accueil ol { margin: 0; padding: 0; list-style: none; }
body.nsa-accueil figure { margin: 0; }
body.nsa-accueil strong { color: var(--encre); font-weight: 600; }

body.nsa-accueil .wrap { width: min(100% - 2 * var(--gouttiere), 1240px); margin-inline: auto; }
body.nsa-accueil .centre { text-align: center; }
body.nsa-accueil .visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
body.nsa-accueil .skip { position: absolute; left: 1rem; top: -4rem; z-index: 100; padding: .75rem 1rem; background: var(--encre); color: var(--blanc); font-family: var(--sans); font-size: .875rem; }
body.nsa-accueil .skip:focus { top: 1rem; }
body.nsa-accueil :focus-visible { outline: 2px solid var(--cuivre); outline-offset: 3px; }

/* ---------- Typographie ---------- */

body.nsa-accueil .surtitre {
  font-family: var(--sans);
  font-size: .6875rem;
  font-weight: 500;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--cuivre-texte);
  margin-bottom: 1rem;
}
body.nsa-accueil .surtitre--clair { color: #f1c7a6; }

body.nsa-accueil .titre {
  font-size: clamp(2rem, 3.4vw, 2.875rem);
  line-height: 1.15;
  letter-spacing: -.005em;
}
body.nsa-accueil .titre--clair { color: var(--blanc); }
body.nsa-accueil .titre a, body.nsa-accueil .souligne {
  color: var(--cuivre);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .18em;
}

body.nsa-accueil .chapeau {
  margin: 1.1rem 0 1.4rem;
  font-family: var(--sans);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .22em;
  line-height: 2;
  text-transform: uppercase;
  color: var(--encre);
}
body.nsa-accueil .chapeau a { text-decoration: underline; text-decoration-color: var(--cuivre); text-underline-offset: 5px; }
body.nsa-accueil .chapeau--simple { color: var(--encre); }

body.nsa-accueil .script {
  font-family: var(--script);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0;
}
body.nsa-accueil .script--rouge { color: var(--rouge); }

/* Le mot manuscrit s'écrit de gauche à droite à son apparition */
html.js body.nsa-accueil [data-ecrire] { clip-path: inset(-20% 100% -20% 0); transition: clip-path 1600ms cubic-bezier(.65, 0, .35, 1); }
html.js body.nsa-accueil [data-ecrire].is-visible { clip-path: inset(-20% -5% -20% 0); }

body.nsa-accueil .entete { text-align: center; margin-bottom: clamp(2.5rem, 5vw, 3.5rem); }

/* ---------- Boutons : le filet cuivré et la flèche de l'existant ---------- */

body.nsa-accueil .bouton {
  display: inline-flex;
  align-items: center;
  gap: .9rem;
  min-height: 48px;
  padding: .85rem 1.6rem;
  border: 1px solid var(--cuivre);
  border-radius: var(--rayon);
  background: transparent;
  color: var(--encre);
  font-family: var(--sans);
  font-size: .6875rem;
  font-weight: 600;
  letter-spacing: .24em;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  transition: color 300ms var(--ease), border-color 300ms var(--ease), transform 150ms var(--ease);
}
body.nsa-accueil .bouton::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--cuivre);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 450ms var(--ease);
}
body.nsa-accueil .bouton:active { transform: scale(.98); }
body.nsa-accueil .fleche {
  position: relative;
  width: 18px; height: 1px;
  background: currentColor;
  transition: width 300ms var(--ease);
}
body.nsa-accueil .fleche::after {
  content: "";
  position: absolute;
  right: 0; top: -3px;
  width: 7px; height: 7px;
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  transform: rotate(45deg);
}
@media (hover: hover) {
  body.nsa-accueil .bouton:hover { color: var(--blanc); }
  body.nsa-accueil .bouton:hover::before { transform: scaleX(1); transform-origin: left; }
  body.nsa-accueil .bouton:hover .fleche { width: 26px; }
}
body.nsa-accueil .bouton--plein { background: var(--cuivre); color: var(--blanc); }
body.nsa-accueil .bouton--plein::before { background: var(--rouge); }
body.nsa-accueil .bouton--clair { border-color: rgba(255, 255, 255, .7); color: var(--blanc); }
body.nsa-accueil .bouton--clair::before { background: var(--blanc); }
@media (hover: hover) { body.nsa-accueil .bouton--clair:hover { color: var(--brun); } }

/* ---------- Barre supérieure (fixe, ne défile pas) ---------- */

body.nsa-accueil .topbar { background: var(--rouge); color: #f7e6df; font-family: var(--sans); font-size: .75rem; letter-spacing: .04em; }
body.nsa-accueil .topbar__inner { display: flex; justify-content: space-between; align-items: center; gap: 1rem; min-height: 38px; }
body.nsa-accueil .topbar strong { color: var(--blanc); font-weight: 600; }
body.nsa-accueil .topbar a { text-decoration: none; }
body.nsa-accueil .topbar a:hover { text-decoration: underline; }
body.nsa-accueil .topbar a { white-space: nowrap; }
@media (min-width: 961px) and (max-width: 1240px) {
  body.nsa-accueil .topbar__inner > p:first-child { display: none; }
}

/* ---------- En-tête ---------- */

body.nsa-accueil .header {
  position: sticky;
  top: 0;
  z-index: var(--z-header);
  background: rgba(253, 251, 248, .92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid transparent;
  transition: border-color 300ms var(--ease), box-shadow 300ms var(--ease);
}
body.nsa-accueil .header.is-scrolled { border-bottom-color: var(--filet); box-shadow: 0 6px 24px -18px rgba(58, 29, 18, .5); }
body.nsa-accueil .header__inner { display: flex; align-items: center; gap: 2rem; height: 88px; transition: height 300ms var(--ease); }
body.nsa-accueil .header.is-scrolled .header__inner { height: 68px; }
body.nsa-accueil .header__logo img { width: auto; height: 58px; transition: height 300ms var(--ease); }
body.nsa-accueil .header.is-scrolled .header__logo img { height: 46px; }

body.nsa-accueil .nav { margin-inline: auto; }
body.nsa-accueil .nav ul { display: flex; gap: clamp(1rem, 2vw, 2rem); }
body.nsa-accueil .nav a {
  position: relative;
  display: block;
  padding: .75rem 0;
  font-family: var(--sans);
  font-size: .6875rem;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--encre);
  white-space: nowrap;
}
body.nsa-accueil .nav a::after {
  content: "";
  position: absolute;
  left: 0; right: .2em; bottom: .45rem;
  height: 1px;
  background: var(--cuivre);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 350ms var(--ease);
}
body.nsa-accueil .nav a:hover::after, body.nsa-accueil .nav a[aria-current="page"]::after { transform: scaleX(1); transform-origin: left; }
body.nsa-accueil .nav a[aria-current="page"] { color: var(--rouge); }
/* Huit onglets (L'Atelier du vin, 1er octobre 2026) : entre 1181 et 1279 px, en
   allemand et en portugais, le menu débordait de 13 à 31 px. On resserre. */
@media (min-width: 1181px) and (max-width: 1279px) {
  body.nsa-accueil .nav ul { gap: .75rem; }
  body.nsa-accueil .nav a { letter-spacing: .12em; }
}
/* Sous-menu de l'Atelier du vin (1er octobre 2026) : les outils rangés en
   quatre colonnes, au survol ou au clavier (focus), centrés sous le menu. */
body.nsa-accueil .nav { position: relative; }
body.nsa-accueil .nav .nav__sous {
  position: absolute;
  top: calc(100% + .75rem);
  left: 50%;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(4, max-content);
  gap: 2.5rem;
  padding: 1.75rem 2.25rem 1.5rem;
  background: var(--fond);
  border: 1px solid var(--filet);
  border-top: 2px solid var(--cuivre);
  box-shadow: 0 26px 40px -30px rgba(58, 29, 18, .5);
  opacity: 0;
  visibility: hidden;
  translate: -50% 6px;
  transition: opacity 220ms var(--ease), translate 220ms var(--ease), visibility 0s 220ms;
}
body.nsa-accueil .nav .nav__sous::before { content: ""; position: absolute; left: 0; right: 0; bottom: 100%; height: calc(.75rem + 2px); }
body.nsa-accueil .nav .nav__atelier:hover > .nav__sous, body.nsa-accueil .nav .nav__atelier:focus-within > .nav__sous { opacity: 1; visibility: visible; translate: -50% 0; transition-delay: 0s; }
body.nsa-accueil .nav .nav__sous ul { display: block; }
body.nsa-accueil .nav .nav__titre { margin: 0 0 .5rem; font-family: var(--sans); font-size: .625rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--cuivre-texte); }
body.nsa-accueil .nav .nav__sous a { display: inline-block; padding: .4rem 0; font-family: var(--titre); font-size: 1.0625rem; font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--encre); }
body.nsa-accueil .nav .nav__sous a::after { bottom: .3rem; right: 0; }
body.nsa-accueil .nav .nav__sous a:hover, body.nsa-accueil .nav .nav__sous a[aria-current="page"] { color: var(--rouge); }
body.nsa-accueil .nav a[aria-current="true"] { color: var(--rouge); }
body.nsa-accueil .nav a[aria-current="true"]::after { transform: scaleX(1); transform-origin: left; }

body.nsa-accueil .header__outils { display: flex; align-items: center; gap: .25rem; }
body.nsa-accueil .icone {
  position: relative;
  display: grid;
  place-items: center;
  width: 44px; height: 44px;
  color: var(--encre);
  border-radius: 50%;
  transition: background-color 200ms var(--ease), color 200ms var(--ease);
}
body.nsa-accueil .icone:hover { background: var(--fond-2); color: var(--rouge); }
body.nsa-accueil .icone svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
body.nsa-accueil .icone__badge {
  position: absolute;
  top: 6px; right: 5px;
  min-width: 16px; height: 16px;
  padding: 0 4px;
  border-radius: 8px;
  background: var(--cuivre);
  color: var(--blanc);
  font: 600 .625rem/16px var(--sans);
  text-align: center;
}
body.nsa-accueil .burger { display: none; width: 44px; height: 44px; border: 0; background: none; cursor: pointer; color: var(--encre); }
body.nsa-accueil .burger__barres, body.nsa-accueil .burger__barres::before, body.nsa-accueil .burger__barres::after { display: block; width: 22px; height: 1.5px; background: currentColor; position: relative; margin: auto; }
body.nsa-accueil .burger__barres::before, body.nsa-accueil .burger__barres::after { content: ""; position: absolute; left: 0; }
body.nsa-accueil .burger__barres::before { top: -7px; }
body.nsa-accueil .burger__barres::after { top: 7px; width: 14px; }

body.nsa-accueil .menu {
  width: 100%; max-width: none; height: 100dvh; max-height: none;
  margin: 0; padding: 1rem var(--gouttiere) 2rem;
  border: 0; background: var(--fond); color: var(--encre);
}
body.nsa-accueil .menu[open] { display: flex; flex-direction: column; animation: menu-in 350ms var(--ease); }
body.nsa-accueil .menu__haut { display: flex; justify-content: space-between; align-items: center; }
body.nsa-accueil .menu__haut img { height: 52px; width: auto; }
body.nsa-accueil .menu__fermer { min-height: 44px; padding: 0 .5rem; border: 0; background: none; font: 500 .75rem var(--sans); letter-spacing: .2em; text-transform: uppercase; cursor: pointer; color: var(--encre); }
body.nsa-accueil .menu ul { margin-top: 2rem; }
body.nsa-accueil .menu li + li { border-top: 1px solid var(--filet); }
body.nsa-accueil .menu ul a { display: block; padding: 1rem 0; font-size: 1.625rem; text-decoration: none; }
body.nsa-accueil .menu[open] { overflow-y: auto; }
body.nsa-accueil .menu .menu__atelier { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
body.nsa-accueil .menu__deplier { display: grid; place-items: center; width: 44px; height: 44px; border: 0; background: none; cursor: pointer; color: var(--encre); }
body.nsa-accueil .menu__deplier::before { content: ""; width: 9px; height: 9px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; rotate: 45deg; translate: 0 -3px; transition: rotate 250ms var(--ease), translate 250ms var(--ease); }
body.nsa-accueil .menu__deplier[aria-expanded="true"]::before { rotate: 225deg; translate: 0 2px; }
body.nsa-accueil .menu .menu__outils { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1.25rem; margin: 0 0 1rem; }
body.nsa-accueil .menu .menu__outils[hidden] { display: none; }
body.nsa-accueil .menu .menu__outils li + li { border-top: 0; }
body.nsa-accueil .menu .menu__outils a { padding: .5rem 0; font-size: 1.0625rem; line-height: 1.3; }
body.nsa-accueil .menu__tel { display: grid; grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr)); gap: .75rem; margin-top: auto; padding-top: 2rem; }
body.nsa-accueil .menu__tel a { display: grid; gap: .3rem; padding: .9rem 1rem; border: 1px solid var(--filet); background: var(--blanc); font: 500 1.0625rem var(--sans); letter-spacing: .02em; color: var(--encre); text-decoration: none; white-space: nowrap; }
body.nsa-accueil .menu__tel a:active { background: var(--fond); }
body.nsa-accueil .menu__tel small { font-size: .625rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--cuivre-texte); }
@keyframes menu-in { from { opacity: 0; transform: translateY(10px); } }

/* ---------- Bandeau ---------- */

body.nsa-accueil .hero {
  position: relative;
  height: min(calc(100svh - 126px), 760px);
  min-height: 520px;
  overflow: hidden;
  color: var(--blanc);
  isolation: isolate;
}
body.nsa-accueil .hero__fonds { position: absolute; inset: 0; z-index: -1; background: var(--brun); }
body.nsa-accueil .hero__fond {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  opacity: 0;
  transform: scale(1.06);
  transition: opacity 1200ms var(--ease), transform 7000ms linear;
}
body.nsa-accueil .hero__fond.is-actif { opacity: 1; transform: scale(1); }
body.nsa-accueil .hero__fonds::after {
  content: "";
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 70% 60% at 50% 48%, rgba(20, 10, 6, .45), transparent 75%),
    linear-gradient(to top, rgba(20, 10, 6, .65), rgba(20, 10, 6, .1) 45%, rgba(20, 10, 6, .35));
}

body.nsa-accueil .hero__textes { position: relative; height: 100%; display: grid; place-items: center; text-align: center; padding: 2rem var(--gouttiere) 6rem; }
body.nsa-accueil .hero__texte { grid-area: 1 / 1; display: flex; flex-direction: column; align-items: center; visibility: hidden; }
body.nsa-accueil .hero__texte.is-actif { visibility: visible; }
body.nsa-accueil .hero__texte > * { opacity: 0; transform: translateY(18px); transition: opacity 700ms var(--ease), transform 900ms var(--ease-doux); }
body.nsa-accueil .hero__texte.is-actif > * { opacity: 1; transform: none; }
body.nsa-accueil .hero__texte.is-actif > :nth-child(2) { transition-delay: 120ms; }
body.nsa-accueil .hero__texte.is-actif > :nth-child(3) { transition-delay: 240ms; }
body.nsa-accueil .hero__texte.is-actif > :nth-child(4) { transition-delay: 340ms; }
body.nsa-accueil .hero__titre { color: var(--blanc); }
body.nsa-accueil .hero__titre .script { display: block; font-size: clamp(3.75rem, 9vw, 7.5rem); line-height: 1.1; text-shadow: 0 4px 30px rgba(0, 0, 0, .35); }
body.nsa-accueil .hero__sous { margin: 1rem 0 2rem; max-width: 34ch; font-size: clamp(1.0625rem, 1.5vw, 1.3125rem); color: #f5ece4; }

body.nsa-accueil .hero__onglets {
  position: absolute;
  left: 50%; bottom: 0;
  translate: -50% 0;
  width: min(100% - 2 * var(--gouttiere), 1240px);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid rgba(255, 255, 255, .25);
}
body.nsa-accueil .hero__onglets button {
  position: relative;
  display: flex; align-items: baseline; gap: .8rem;
  min-height: 64px;
  padding: 1.1rem 0;
  border: 0; background: none;
  color: rgba(255, 255, 255, .72);
  font-family: var(--sans);
  font-size: .75rem;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-align: left;
  cursor: pointer;
  transition: color 250ms var(--ease);
}
body.nsa-accueil .hero__onglets button::before {
  content: "";
  position: absolute; left: 0; right: 1.5rem; top: -1px;
  height: 2px;
  background: var(--cuivre);
  transform: scaleX(0);
  transform-origin: left;
}
body.nsa-accueil .hero__onglets button[aria-selected="true"] { color: var(--blanc); }
body.nsa-accueil .hero__onglets button[aria-selected="true"]::before { transform: scaleX(1); transition: transform 600ms var(--ease); }
body.nsa-accueil .hero__onglets button:hover { color: var(--blanc); }
body.nsa-accueil .hero__num { font-family: var(--titre); font-size: .9375rem; letter-spacing: 0; color: #f1c7a6; }

/* ---------- Garanties ---------- */

body.nsa-accueil .garanties { background: var(--blanc); border-bottom: 1px solid var(--filet); }
body.nsa-accueil .garanties__liste { display: grid; grid-template-columns: repeat(4, 1fr); }
body.nsa-accueil .garanties li { display: flex; align-items: center; gap: 1rem; padding: 1.6rem 1.25rem; }
body.nsa-accueil .garanties li + li { border-left: 1px solid var(--filet); }
body.nsa-accueil .garanties svg, body.nsa-accueil .qr__icone, body.nsa-accueil .atouts svg { width: 34px; height: 34px; flex: none; fill: none; stroke: var(--cuivre); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
body.nsa-accueil .garanties span { font-family: var(--sans); font-size: .8125rem; line-height: 1.45; color: var(--texte-doux); }
body.nsa-accueil .garanties strong { display: block; font-family: var(--titre); font-size: 1.0625rem; font-weight: 400; color: var(--encre); }

/* ---------- Sections ---------- */

body.nsa-accueil .section { padding: clamp(4.5rem, 9vw, 7.5rem) 0; }
body.nsa-accueil .section p + p { margin-top: 1rem; }
body.nsa-accueil .section .bouton { margin-top: 2rem; }

/* Livraison */
body.nsa-accueil .livraison {
  display: grid;
  justify-items: center;
  text-align: center;
  padding: clamp(3rem, 6vw, 4.5rem) 1.5rem;
  border-radius: 0;
  padding-block: clamp(3.5rem, 7vw, 5.5rem);
  background:
    radial-gradient(ellipse at 80% 120%, rgba(201, 104, 56, .9), transparent 60%),
    linear-gradient(170deg, var(--brun) 10%, #7a3a1f 60%, var(--cuivre));
  color: var(--blanc);
}
body.nsa-accueil .livraison__titre { max-width: 22ch; font-size: clamp(1.75rem, 3vw, 2.5rem); line-height: 1.2; }
body.nsa-accueil .livraison .bouton { margin-top: 2rem; }

/* Produits */
body.nsa-accueil .produits { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1rem, 2vw, 1.75rem); }
body.nsa-accueil .produit {
  position: relative;
  display: flex; flex-direction: column;
  background: var(--blanc);
  border: 1px solid var(--filet);
  border-radius: var(--rayon);
  text-align: center;
  transition: box-shadow 400ms var(--ease), border-color 400ms var(--ease);
}
body.nsa-accueil .produit__lien { display: flex; flex-direction: column; flex: 1; padding: 0 1.5rem 1.25rem; text-decoration: none; }
body.nsa-accueil .produit__visuel {
  position: relative;
  display: grid; place-items: end center;
  height: 340px;
  margin: 0 -1.5rem 1.4rem;
  padding: 2.5rem 0 0;
  background: linear-gradient(to bottom, var(--blanc), var(--fond-2));
  overflow: hidden;
}
/* Le liseré rouge sous la bouteille, repris de l'existant */
body.nsa-accueil .produit__visuel::after {
  content: "";
  position: absolute; left: 18%; right: 18%; bottom: 0;
  height: 3px;
  background: var(--rouge);
  transform-origin: center;
  transition: transform 500ms var(--ease);
}
body.nsa-accueil .produit__visuel img { height: 290px; width: auto; transition: transform 700ms var(--ease-doux); filter: drop-shadow(0 14px 14px rgba(58, 29, 18, .18)); }
body.nsa-accueil .pastille {
  position: absolute;
  top: 1rem; left: 50%;
  translate: -50% 0;
  z-index: 1;
  padding: .3rem .8rem;
  border-radius: 999px;
  background: #f4e9dd;
  color: var(--brun);
  font-family: var(--sans);
  font-size: .625rem;
  font-weight: 600;
  letter-spacing: .08em;
  white-space: nowrap;
}
body.nsa-accueil .pastille--or { background: linear-gradient(135deg, #f3dd9b, #d9b25a); color: #3d2a05; }
body.nsa-accueil .pastille--argent { background: linear-gradient(135deg, #eeeeee, #c9c9c9); color: #2c2c2c; }
body.nsa-accueil .produit__cepages { font-family: var(--sans); font-size: .625rem; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--cuivre-texte); }
body.nsa-accueil .produit__nom { margin-top: .6rem; font-size: 1.3125rem; line-height: 1.25; }
body.nsa-accueil .produit__type { margin-top: .2rem; font-size: .9375rem; color: var(--texte-doux); }
body.nsa-accueil .produit__prix { margin-top: auto; padding-top: .9rem; font-family: var(--sans); font-size: .9375rem; font-weight: 600; letter-spacing: .1em; color: var(--encre); }
body.nsa-accueil .produit__ajout {
  min-height: 48px;
  border: 0;
  border-top: 1px solid var(--filet);
  background: transparent;
  color: var(--encre);
  font-family: var(--sans);
  font-size: .6875rem;
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background-color 300ms var(--ease), color 300ms var(--ease);
}
body.nsa-accueil .produit__ajout:hover { background: var(--rouge); color: var(--blanc); }
body.nsa-accueil .produit__ajout.is-ok { background: var(--brun); color: var(--blanc); }
@media (hover: hover) {
  body.nsa-accueil .produit:hover { border-color: #dccbbb; box-shadow: 0 24px 40px -28px rgba(58, 29, 18, .45); }
  body.nsa-accueil .produit:hover .produit__visuel img { transform: translateY(-8px) scale(1.02); }
  body.nsa-accueil .produit:hover .produit__visuel::after { transform: scaleX(1.25); }
}
body.nsa-accueil .vins .centre { margin-top: 1rem; }

/* Boutique en ligne */
body.nsa-accueil .boutique { position: relative; padding: clamp(5.5rem, 12vw, 9rem) 0; color: #f3e8df; overflow: hidden; isolation: isolate; text-align: center; }
body.nsa-accueil .boutique__fond { position: absolute; inset: 0; z-index: -1; background: var(--brun); }
body.nsa-accueil .boutique__fond { overflow: hidden; }
body.nsa-accueil .boutique__fond img { position: absolute; left: 0; top: -15%; width: 100%; height: 130%; max-width: none; object-fit: cover; }
body.nsa-accueil .boutique__fond::after { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse 60% 70% at 50% 50%, rgba(22, 11, 7, .72), rgba(22, 11, 7, .45)); }
body.nsa-accueil .boutique__contenu { max-width: 44rem; }
body.nsa-accueil .boutique .titre { font-size: clamp(2rem, 3.6vw, 3rem); }
body.nsa-accueil .boutique__contenu > p:not(.surtitre) { margin-top: 1.25rem; }
body.nsa-accueil .boutique__offre strong { color: #f7c56d; }
body.nsa-accueil .script--ancre { margin-top: -.55em; margin-bottom: -.4em; text-align: right; font-size: clamp(3.5rem, 7vw, 6.25rem); position: relative; z-index: 1; }

/* Rencontre */
body.nsa-accueil .rencontre { background: var(--blanc); border-block: 1px solid var(--filet); }
body.nsa-accueil .rencontre__grille { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.25rem, 3vw, 2rem); }
body.nsa-accueil .carte { padding: clamp(1.75rem, 4vw, 2.75rem); border: 1px solid var(--filet); border-radius: var(--rayon); background: var(--fond); }
body.nsa-accueil .carte__titre { font-size: 1.625rem; margin-bottom: 1rem; }
body.nsa-accueil .infos { margin: 1.75rem 0 0; }
body.nsa-accueil .infos div { display: grid; grid-template-columns: 11rem 1fr; gap: 1rem; padding: .8rem 0; border-top: 1px solid var(--filet); }
body.nsa-accueil .infos div:last-child { border-bottom: 1px solid var(--filet); }
body.nsa-accueil .infos dt { font-family: var(--sans); font-size: .6875rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--cuivre-texte); padding-top: .2rem; }
body.nsa-accueil .infos dd { margin: 0; color: var(--encre); }
body.nsa-accueil .infos a { text-decoration-color: var(--cuivre); text-underline-offset: 3px; }
body.nsa-accueil .carte .bouton { margin-top: 1.75rem; }

/* FAQ */
body.nsa-accueil .faq { background: var(--fond-2); }
body.nsa-accueil .faq__grille { display: grid; grid-template-columns: 1fr 2fr; gap: clamp(2rem, 6vw, 5rem); align-items: start; }
body.nsa-accueil .faq__liste { border-top: 1px solid #dfd2c4; }
body.nsa-accueil .faq details { border-bottom: 1px solid #dfd2c4; }
body.nsa-accueil .faq summary {
  display: flex; justify-content: space-between; align-items: center; gap: 1.5rem;
  min-height: 64px;
  padding: 1.1rem 0;
  font-size: 1.1875rem;
  color: var(--encre);
  cursor: pointer;
  list-style: none;
}
body.nsa-accueil .faq summary::-webkit-details-marker { display: none; }
body.nsa-accueil .faq summary::after {
  content: "";
  flex: none;
  width: 11px; height: 11px;
  border-right: 1.5px solid var(--cuivre);
  border-bottom: 1.5px solid var(--cuivre);
  transform: translateY(-3px) rotate(45deg);
  transition: transform 300ms var(--ease);
}
body.nsa-accueil .faq details[open] summary::after { transform: translateY(2px) rotate(-135deg); }
body.nsa-accueil .faq summary:hover { color: var(--rouge); }
body.nsa-accueil .faq details p { padding: 0 2.5rem 1.5rem 0; font-size: 1rem; }
body.nsa-accueil .faq details[open] p { animation: ouvrir 400ms var(--ease); }
@keyframes ouvrir { from { opacity: 0; transform: translateY(-6px); } }

/* Pied de page : celui du site, anthracite, trois colonnes, photos et barre légale */
body.nsa-accueil .pied { background: #2f3336; color: #bdae9b; padding: clamp(4rem, 8vw, 6rem) 0 0; font-size: .9375rem; line-height: 1.6; }
body.nsa-accueil .pied__grille { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.5rem clamp(2rem, 4vw, 3.5rem); }
body.nsa-accueil .pied__titre { margin-bottom: 1.5rem; font-family: var(--titre); font-size: 1.125rem; font-weight: 400; letter-spacing: .06em; text-transform: uppercase; color: #fffefc; }
body.nsa-accueil .pied__titre--filet { padding-bottom: 1.25rem; margin-bottom: 1.5rem; border-bottom: 1px solid var(--cuivre); display: inline-block; min-width: 12.5rem; }
body.nsa-accueil .pied__groupe { margin: 1.5rem 0 .6rem; color: #bdae9b; }
body.nsa-accueil .pied__titre + .pied__groupe { margin-top: 0; }
body.nsa-accueil .pied__liste li + li { margin-top: .15rem; }
body.nsa-accueil .pied__liste a, body.nsa-accueil .pied__adresse a, body.nsa-accueil .pied__groupe a {
  color: #fffee0;
  text-decoration: none;
  background: linear-gradient(var(--cuivre), var(--cuivre)) no-repeat 0 100% / 0 1px;
  transition: background-size 350ms var(--ease), color 250ms var(--ease);
}
body.nsa-accueil .pied__groupe a { color: #bdae9b; }
body.nsa-accueil .pied__liste a:hover, body.nsa-accueil .pied__adresse a:hover, body.nsa-accueil .pied__groupe a:hover { background-size: 100% 1px; color: #fffefc; }
body.nsa-accueil .pied__col > section + section { margin-top: 2.5rem; }
body.nsa-accueil .pied__adresse { display: grid; gap: .1rem; font-style: normal; color: #fffee0; }
body.nsa-accueil .pied__tel { display: grid; margin-top: .4rem; }
body.nsa-accueil .pied__tel small { font-size: .78rem; color: #bdae9b; }
body.nsa-accueil .pied__tel a { justify-self: start; }
body.nsa-accueil .pied__mails { display: grid; justify-items: start; margin-top: 1rem; }

body.nsa-accueil .reseaux { display: flex; flex-wrap: wrap; gap: .75rem; }
body.nsa-accueil .reseau {
  display: grid; place-items: center;
  width: 44px; height: 44px;
  border-radius: 50%;
  color: #fff;
  transition: transform 300ms var(--ease), box-shadow 300ms var(--ease);
}
body.nsa-accueil .reseau svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
body.nsa-accueil .reseau .plein { fill: currentColor; stroke: none; }
body.nsa-accueil .reseau--instagram { background: radial-gradient(circle at 30% 110%, #fdcb52 0%, #f56040 30%, #e1306c 55%, #833ab4 100%); }
body.nsa-accueil .reseau--facebook { background: #1877f2; }
body.nsa-accueil .reseau--youtube { background: #ff0000; }
body.nsa-accueil .reseau--tripadvisor { background: #34e0a1; color: #0b0b0b; }
body.nsa-accueil .reseau--x { background: #0f0f0f; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .15); }
@media (hover: hover) { body.nsa-accueil .reseau:hover { transform: translateY(-3px); box-shadow: 0 10px 20px -8px rgba(0, 0, 0, .6); } }

body.nsa-accueil .pied__photos { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1rem, 3vw, 2.5rem); margin-top: clamp(3rem, 6vw, 4rem); }
body.nsa-accueil .pied__photos figure { overflow: hidden; border-radius: var(--rayon); aspect-ratio: 16 / 9; background: #3a3f42; }
body.nsa-accueil .pied__photos img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.9); }

body.nsa-accueil .pied__bas { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1.5rem 3rem; margin-top: 2rem; padding: 1.75rem 0 2.5rem; border-top: 1px solid rgba(255, 255, 255, .1); color: #a9a9a9; font-size: .875rem; }
body.nsa-accueil .pied__legal { display: flex; flex-wrap: wrap; gap: .25rem 2rem; align-content: start; }
body.nsa-accueil .pied__legal a, body.nsa-accueil .pied__mentions a { color: #a9a9a9; text-decoration: none; transition: color 200ms var(--ease); }
body.nsa-accueil .pied__legal a:hover, body.nsa-accueil .pied__mentions a:hover { color: #fffee0; }
body.nsa-accueil .pied__droits { max-width: 40rem; text-align: right; }
body.nsa-accueil .pied__droits p + p { margin-top: .4rem; }
body.nsa-accueil .pied__mentions { display: flex; flex-wrap: wrap; justify-content: flex-end; }
body.nsa-accueil .pied__mentions a { text-decoration: underline; text-underline-offset: 3px; }
body.nsa-accueil .pied__mentions a + a::before { content: "|"; display: inline-block; margin: 0 .5rem; color: #6d6d6d; text-decoration: none; }

/* ---------- En-tête posé sur le bandeau, comme sur le site ---------- */
body.nsa-accueil .header { margin-bottom: -88px; }
body.nsa-accueil .logo--clair { display: none; }
body.nsa-accueil .header.is-sur-hero:not(.is-scrolled) { background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; }
body.nsa-accueil .header.is-sur-hero:not(.is-scrolled) .logo--sombre { display: none; }
body.nsa-accueil .header.is-sur-hero:not(.is-scrolled) .logo--clair { display: block; }
body.nsa-accueil .header.is-sur-hero:not(.is-scrolled) .nav a, body.nsa-accueil .header.is-sur-hero:not(.is-scrolled) .icone, body.nsa-accueil .header.is-sur-hero:not(.is-scrolled) .burger { color: #fffefc; }
body.nsa-accueil .header.is-sur-hero:not(.is-scrolled) .nav a[aria-current="page"] { color: #f1c7a6; }
body.nsa-accueil .header.is-sur-hero:not(.is-scrolled) .nav .nav__sous a { color: var(--encre); }
body.nsa-accueil .header.is-sur-hero:not(.is-scrolled) .nav .nav__sous a:hover { color: var(--rouge); }
body.nsa-accueil .header.is-sur-hero:not(.is-scrolled) .icone:hover { background: rgba(255, 255, 255, .12); color: #fffefc; }
body.nsa-accueil .hero { height: min(calc(100svh - 38px), 860px); }
body.nsa-accueil .hero__textes { padding-top: 6rem; }

/* ---------- Bandeau : le mot manuscrit s'écrit à chaque univers ---------- */
body.nsa-accueil .hero__titre .script { clip-path: inset(-25% 100% -25% 0); transition: clip-path 1500ms cubic-bezier(.65, 0, .35, 1) 150ms; }
body.nsa-accueil .hero__texte.is-actif .hero__titre .script { clip-path: inset(-25% -5% -25% -5%); }
body.nsa-accueil .hero__fonds { will-change: transform; }
body.nsa-accueil .hero__descendre { position: absolute; right: var(--gouttiere); bottom: 1.25rem; display: grid; place-items: center; width: 44px; height: 64px; }
body.nsa-accueil .hero__descendre span { position: relative; width: 1px; height: 48px; overflow: hidden; background: rgba(255, 255, 255, .3); }
body.nsa-accueil .hero__descendre span::after { content: ""; position: absolute; left: 0; top: 0; width: 1px; height: 16px; background: var(--cuivre); animation: goutte 2.2s cubic-bezier(.77, 0, .175, 1) infinite; }
@keyframes goutte { from { transform: translateY(-16px); } to { transform: translateY(48px); } }

/* ---------- Photos : lever de rideau à l'apparition ---------- */
html.js body.nsa-accueil [data-rideau] { clip-path: inset(100% 0 0 0); transition: clip-path 1300ms cubic-bezier(.77, 0, .175, 1); }
html.js body.nsa-accueil [data-rideau] img { transform: scale(1.18); transition: transform 1800ms cubic-bezier(.19, 1, .22, 1); }
html.js body.nsa-accueil [data-rideau].is-visible { clip-path: inset(0 0 0 0); }
html.js body.nsa-accueil [data-rideau].is-visible img { transform: scale(1); }
@media (hover: hover) { html.js body.nsa-accueil [data-rideau].is-visible:hover img { transform: scale(1.05); } }

/* ---------- Titres : les mots montent un à un ---------- */
body.nsa-accueil .mot { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .12em; margin-bottom: -.12em; }
body.nsa-accueil .mot > span { display: inline-block; }
html.js body.nsa-accueil .titre.a-animer .mot > span { transform: translateY(110%); transition: transform 1000ms var(--ease-doux); transition-delay: calc(var(--i) * 55ms); }
html.js body.nsa-accueil .titre.a-animer.is-visible .mot > span { transform: none; }

/* ---------- Fiches vins : reflet de lumière sur la bouteille ---------- */
body.nsa-accueil .produit__visuel::before {
  content: "";
  position: absolute; inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, .55) 50%, transparent 65%);
  transform: translateX(-110%);
}
@media (hover: hover) { body.nsa-accueil .produit:hover .produit__visuel::before { transform: translateX(110%); transition: transform 1100ms var(--ease); } }

/* ==========================================================================
   Composition pleine largeur : les photos touchent les bords de l'écran,
   le texte reste aligné sur la grille de 1240 px.
   ========================================================================== */

:root {
  /* Distance entre le bord de l'écran et la colonne de texte */
  --bord: max(var(--gouttiere), calc((100vw - 1240px) / 2));
  --joint: 6px;                 /* l'espace entre deux photos jointives */
  --papier: rgb(242, 238, 236); /* le fond exact des bandeaux sous-titres */
  --gris-bandeau: rgb(238, 240, 236);
}

/* ---------- Fleur de lys : l'ornement des bandeaux de la famille ---------- */
body.nsa-accueil .fleur { display: block; width: 27px; height: 28px; margin-bottom: 1.1rem; }
body.nsa-accueil .entete .fleur { margin-inline: auto; }
body.nsa-accueil .fleur--petite { display: inline-block; width: 15px; height: auto; margin: 0 .65rem 0 0; vertical-align: -1px; }

/* ---------- Le bandeau de la famille ---------- */
body.nsa-accueil .heritage {
  position: relative;
  padding: clamp(1.75rem, 4vw, 2.75rem) var(--gouttiere);
  background: var(--gris-bandeau);
  border-bottom: 1px solid #dfe2dc;
}
body.nsa-accueil .heritage::before {
  content: "";
  position: absolute; left: 0; right: 0; top: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent, var(--rouge) 30%, var(--rouge) 70%, transparent);
}
body.nsa-accueil .heritage__bandeau { max-width: 865px; margin: 0 auto; }
body.nsa-accueil .heritage__bandeau img { width: 100%; height: auto; }

/* ---------- Composant partagé : moitié texte, moitié image ---------- */
body.nsa-accueil .split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: min(92vh, 880px);
  background: var(--fond);
}
body.nsa-accueil .split__texte {
  display: flex;
  align-items: center;
  padding: clamp(4.5rem, 8vw, 7rem) clamp(2.5rem, 5vw, 5.5rem) clamp(4.5rem, 8vw, 7rem) var(--bord);
}
body.nsa-accueil .split--inverse .split__texte { padding-left: clamp(2.5rem, 5vw, 5.5rem); padding-right: var(--bord); }
body.nsa-accueil .split__contenu { max-width: 34rem; }
body.nsa-accueil .split__contenu > p + p { margin-top: 1rem; }
body.nsa-accueil .split__contenu .bouton { margin-top: 2rem; }
body.nsa-accueil .split__media { position: relative; margin: 0; overflow: hidden; background: var(--fond-2); }
body.nsa-accueil .split__media > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Un lieu magique : mosaïque jointive sur toute la hauteur */
body.nsa-accueil .lieu__mosaique {
  display: grid;
  grid-template-columns: 1.45fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: var(--joint);
  overflow: visible;
  background: none;
}
body.nsa-accueil .lieu__mosaique .m { position: relative; overflow: hidden; border-radius: 0; }
body.nsa-accueil .lieu__mosaique .m--grand { grid-row: 1 / 3; }
body.nsa-accueil .lieu__mosaique .m img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
body.nsa-accueil .lieu__script {
  position: absolute;
  z-index: 2;
  left: -6%;
  bottom: 1.25rem;
  font-size: clamp(3.5rem, 6.5vw, 6.5rem);
  color: var(--rouge);
  text-shadow: 0 0 18px rgba(253, 251, 248, .95), 0 0 4px rgba(253, 251, 248, .9);
  pointer-events: none;
  white-space: nowrap;
}

/* ---------- De la Terre à la Vigne, de la Vigne au Raisin ---------- */
body.nsa-accueil .vigne { background: var(--papier); }
body.nsa-accueil .vigne__grille { display: grid; grid-template-columns: 5fr 7fr; }
body.nsa-accueil .vigne__photo { position: relative; margin: 0; }
body.nsa-accueil .vigne__photo-colle { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; }
body.nsa-accueil .vigne__photo-colle img { width: 100%; height: 100%; object-fit: cover; }
body.nsa-accueil .vigne__textes { padding: clamp(4.5rem, 8vw, 7rem) var(--bord) clamp(4rem, 7vw, 6rem) clamp(2.5rem, 5vw, 5.5rem); }
body.nsa-accueil .vigne__chapitre + .vigne__chapitre { margin-top: clamp(4rem, 7vw, 6rem); }
body.nsa-accueil .bandeau-titre { margin: 0 auto clamp(2.5rem, 4vw, 3.5rem); max-width: 560px; }
body.nsa-accueil .bandeau-titre img { width: 100%; height: auto; }
body.nsa-accueil .vigne__qr { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem clamp(2rem, 4vw, 3.5rem); }
body.nsa-accueil .qr { font-size: 1rem; line-height: 1.75; }
body.nsa-accueil .qr__num {
  font-family: var(--titre);
  font-style: italic;
  font-size: 1.75rem;
  line-height: 1;
  color: var(--cuivre);
  margin-bottom: .9rem;
}
body.nsa-accueil .qr__titre { margin-bottom: .9rem; font-size: 1.4375rem; line-height: 1.3; }
body.nsa-accueil .vigne__pied { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; margin-top: clamp(3rem, 5vw, 4rem); padding-top: 2rem; border-top: 1px solid #ddd3cb; }

/* ---------- Mariages ---------- */
body.nsa-accueil .mariage .split__media { min-height: 70vh; }
body.nsa-accueil .atouts { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem 2rem; margin-top: 2rem; }
body.nsa-accueil .atouts li { padding-top: 1rem; border-top: 1px solid var(--cuivre); }
body.nsa-accueil .atouts h3 { font-size: 1.1875rem; line-height: 1.3; margin-bottom: .35rem; }
body.nsa-accueil .atouts p { font-size: .9375rem; line-height: 1.6; }

body.nsa-accueil .galerie {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: repeat(2, clamp(200px, 21vw, 360px));
  gap: var(--joint);
  margin-top: var(--joint);
}
body.nsa-accueil .galerie figure { position: relative; margin: 0; overflow: hidden; background: var(--fond-2); }
body.nsa-accueil .galerie img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
body.nsa-accueil .galerie figure:nth-child(2) { grid-area: 1 / 1 / 3 / 3; }

/* ---------- Chardonnay : la photo nette, posée sur son propre flou ---------- */
body.nsa-accueil .chardonnay { background: var(--fond-2); }
body.nsa-accueil .chardonnay__media { display: grid; place-items: center; padding: clamp(2.5rem, 5vw, 4.5rem); }
body.nsa-accueil .chardonnay__fond {
  position: absolute; inset: -40px;
  width: calc(100% + 80px); height: calc(100% + 80px);
  object-fit: cover;
  filter: blur(26px) saturate(1.05) brightness(1.03);
  opacity: .9;
}
body.nsa-accueil .chardonnay__media::after { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at center, transparent 30%, rgba(246, 241, 234, .55)); }
body.nsa-accueil .chardonnay__photo {
  position: relative;
  z-index: 1;
  width: min(100%, 520px);
  aspect-ratio: 520 / 660;
  margin: 0;
  overflow: hidden;
  box-shadow: 0 40px 70px -30px rgba(58, 29, 18, .55), 0 0 0 10px rgba(255, 255, 255, .35);
}
body.nsa-accueil .chardonnay__photo img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- Tuiles Vins, Bulles, Négrette : la tuile survolée s'élargit ---------- */
body.nsa-accueil .tuiles { padding: 0 0 clamp(2.5rem, 5vw, 4rem); background: var(--fond); }
body.nsa-accueil .tuiles__liste { display: flex; gap: var(--joint); height: clamp(380px, 62vh, 640px); }
body.nsa-accueil .tuiles__liste li { flex: 1 1 0; min-width: 0; transition: flex-grow 800ms var(--ease-doux); }
body.nsa-accueil .tuiles__liste a {
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  height: 100%;
  padding: 2rem 1.5rem;
  overflow: hidden;
  color: var(--blanc);
  text-align: center;
  text-decoration: none;
  isolation: isolate;
}
body.nsa-accueil .tuiles__liste img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform 1400ms var(--ease-doux); }
body.nsa-accueil .tuiles__liste a::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, rgba(22, 11, 7, .82), rgba(22, 11, 7, .08) 65%); transition: opacity 500ms var(--ease); }
body.nsa-accueil .tuile__texte { display: grid; justify-items: center; }
body.nsa-accueil .tuile__nom { font-size: clamp(2rem, 3vw, 2.75rem); line-height: 1.1; }
body.nsa-accueil .tuile__nom::after { content: ""; display: block; width: 36px; height: 1px; margin: .9rem auto .8rem; background: var(--cuivre); transition: width 500ms var(--ease); }
body.nsa-accueil .tuile__sous { font-family: var(--sans); font-size: .625rem; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: #f1dccd; }
@media (hover: hover) and (min-width: 961px) {
  body.nsa-accueil .tuiles__liste li:hover { flex-grow: 1.7; }
  body.nsa-accueil .tuiles__liste a:hover img { transform: scale(1.05); }
  body.nsa-accueil .tuiles__liste a:hover .tuile__nom::after { width: 72px; }
}
body.nsa-accueil .tuiles__script { text-align: center; font-size: clamp(3.5rem, 7vw, 6.5rem); margin-top: .12em; position: relative; z-index: 1; text-shadow: 0 0 18px rgba(253, 251, 248, .9); }

/* ---------- Pied de page : signature, photos jointives, retour en haut ---------- */
body.nsa-accueil .pied { background: radial-gradient(ellipse 80% 50% at 50% 0%, #3b4043, #2f3336 70%); }
body.nsa-accueil .pied__signature {
  display: flex; align-items: center; justify-content: center; gap: clamp(1rem, 4vw, 2.5rem);
  width: min(100% - 2 * var(--gouttiere), 1240px);
  margin: 0 auto;
}
body.nsa-accueil .pied__signature img { width: auto; height: clamp(70px, 8vw, 96px); }
body.nsa-accueil .pied__trait { flex: 1; height: 1px; background: linear-gradient(90deg, transparent, var(--cuivre)); }
body.nsa-accueil .pied__trait:last-child { background: linear-gradient(90deg, var(--cuivre), transparent); }
body.nsa-accueil .pied__devise {
  margin: 1.1rem var(--gouttiere) clamp(3rem, 6vw, 4.5rem);
  text-align: center;
  font-family: var(--sans);
  font-size: .6875rem;
  font-weight: 500;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: #bdae9b;
}
body.nsa-accueil .pied__photos {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1.2fr 1fr;
  gap: var(--joint);
  height: clamp(200px, 24vw, 360px);
  margin-top: clamp(3.5rem, 7vw, 5rem);
}
body.nsa-accueil .pied__photos figure { position: relative; aspect-ratio: auto; border-radius: 0; }
body.nsa-accueil .pied__photos figure::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(20, 22, 24, .55), transparent 55%); pointer-events: none; }
body.nsa-accueil .pied__photos img { position: absolute; inset: 0; }
body.nsa-accueil .pied__script {
  position: absolute;
  left: 50%; bottom: -.18em;
  translate: -50% 0;
  z-index: 2;
  font-size: clamp(min(4rem, 18vw), 9vw, 8.5rem); /* 18vw : tient sur un écran de 320 px */
  color: #fffefc;
  text-shadow: 0 6px 30px rgba(0, 0, 0, .45);
  white-space: nowrap;
  pointer-events: none;
}
body.nsa-accueil .pied__bas { margin-top: 0; padding-top: 3rem; border-top: 0; align-items: flex-start; }
body.nsa-accueil .pied__haut {
  order: 3;
  display: inline-flex; align-items: center; gap: .75rem;
  min-height: 44px;
  color: #fffee0;
  font-family: var(--sans);
  font-size: .6875rem;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: uppercase;
  text-decoration: none;
}
body.nsa-accueil .pied__haut span {
  display: grid; place-items: center;
  width: 40px; height: 40px;
  border: 1px solid var(--cuivre);
  border-radius: 50%;
  transition: background-color 300ms var(--ease), transform 300ms var(--ease);
}
body.nsa-accueil .pied__haut span::before { content: ""; width: 8px; height: 8px; margin-top: 4px; border-top: 1px solid currentColor; border-left: 1px solid currentColor; transform: rotate(45deg); }
@media (hover: hover) { body.nsa-accueil .pied__haut:hover span { background: var(--cuivre); transform: translateY(-3px); } }
body.nsa-accueil .pied__droits { order: 2; }

body.nsa-accueil .insecable { white-space: nowrap; }

/* ---------- Apparitions ---------- */

html.js body.nsa-accueil [data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity 900ms var(--ease), transform 1100ms var(--ease-doux); transition-delay: var(--d, 0ms); }
html.js body.nsa-accueil [data-reveal].is-visible { opacity: 1; transform: none; }
body.nsa-accueil [data-parallax] { will-change: transform; }

/* ---------- Adaptations ---------- */

@media (max-width: 1180px) {
  body.nsa-accueil .nav { display: none; }
  body.nsa-accueil .burger { display: grid; place-items: center; }
  body.nsa-accueil .header__outils { margin-left: auto; }
}

@media (max-width: 960px) {
  body.nsa-accueil .topbar__inner > p:not(.topbar__centre) { display: none; }
  body.nsa-accueil .topbar__inner { justify-content: center; }
  body.nsa-accueil .garanties__liste { grid-template-columns: 1fr 1fr; }
  body.nsa-accueil .garanties li:nth-child(3) { border-left: 0; }
  body.nsa-accueil .garanties li:nth-child(n+3) { border-top: 1px solid var(--filet); }
  body.nsa-accueil .faq__grille { grid-template-columns: 1fr; }
  body.nsa-accueil .produits { grid-template-columns: 1fr 1fr; }
  body.nsa-accueil .rencontre__grille { grid-template-columns: 1fr; }

  body.nsa-accueil .split { grid-template-columns: 1fr; min-height: 0; }
  body.nsa-accueil .split__media { order: -1; min-height: 72vw; }
  body.nsa-accueil .split__texte, body.nsa-accueil .split--inverse .split__texte { padding: 3.5rem var(--gouttiere) 4rem; }
  body.nsa-accueil .split__contenu { max-width: 40rem; }
  body.nsa-accueil .lieu__mosaique { min-height: 88vw; }
  body.nsa-accueil .lieu__script { left: auto; right: var(--gouttiere); bottom: -.35em; }
  body.nsa-accueil .script--ancre { margin-bottom: .15em; text-align: center; }
  body.nsa-accueil .mariage .split__media { min-height: 72vw; }
  body.nsa-accueil .chardonnay__media { min-height: 0; padding: 2.5rem var(--gouttiere); }

  body.nsa-accueil .vigne__grille { grid-template-columns: 1fr; }
  body.nsa-accueil .vigne__photo-colle { position: relative; height: 62vw; }
  body.nsa-accueil .vigne__textes { padding: 3.5rem var(--gouttiere) 4rem; }

  body.nsa-accueil .galerie { grid-template-columns: 1fr 1fr; grid-template-rows: 56vw 30vw 30vw; }
  body.nsa-accueil .galerie figure:nth-child(2) { grid-area: 1 / 1 / 2 / 3; }

  body.nsa-accueil .tuiles__liste { flex-direction: column; height: auto; }
  body.nsa-accueil .tuiles__liste a { height: 46vw; min-height: 220px; }

  body.nsa-accueil .pied__grille { grid-template-columns: 1fr 1fr; }
  body.nsa-accueil .pied__col:last-child { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
  body.nsa-accueil .pied__col:last-child > section + section { margin-top: 0; }
  body.nsa-accueil .pied__droits { text-align: left; }
  body.nsa-accueil .pied__mentions { justify-content: flex-start; }
}

@media (max-width: 640px) {
  body.nsa-accueil .header__inner { height: 72px; gap: 1rem; }
  body.nsa-accueil .header__logo img { height: 46px; }
  body.nsa-accueil .header { margin-bottom: -72px; }
  body.nsa-accueil .hero__descendre { display: none; }
  body.nsa-accueil .header__outils .icone:not(.icone--panier) { display: none; }
  body.nsa-accueil .hero { height: calc(100svh - 38px); min-height: 520px; }
  body.nsa-accueil .hero__onglets button { flex-direction: column; gap: .2rem; font-size: .625rem; letter-spacing: .12em; padding-right: .5rem; }
  body.nsa-accueil .heritage { padding-block: 1.25rem; }
  body.nsa-accueil .garanties li { padding: 1.1rem .5rem; gap: .6rem; }
  body.nsa-accueil .garanties svg { width: 26px; height: 26px; }
  body.nsa-accueil .garanties strong { font-size: .9375rem; }
  body.nsa-accueil .garanties span { font-size: .75rem; }
  body.nsa-accueil .produits { grid-template-columns: 1fr; }
  body.nsa-accueil .produit__visuel { height: 300px; }
  body.nsa-accueil .produit__visuel img { height: 250px; }
  body.nsa-accueil .vigne__qr, body.nsa-accueil .atouts { grid-template-columns: 1fr; gap: 2.25rem; }
  body.nsa-accueil .atouts { gap: 1.25rem; }
  body.nsa-accueil .infos div { grid-template-columns: 1fr; gap: .15rem; }
  body.nsa-accueil .pied__grille, body.nsa-accueil .pied__col:last-child { grid-template-columns: 1fr; }
  body.nsa-accueil .pied__photos { grid-template-columns: 1fr 1fr; height: 44vw; }
  body.nsa-accueil .pied__photos figure:nth-child(2) { display: none; }
  body.nsa-accueil .pied__mentions { gap: .25rem 1.1rem; }
  body.nsa-accueil .pied__mentions a + a::before { display: none; }
  body.nsa-accueil .pied__haut { order: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  body.nsa-accueil *, body.nsa-accueil *::before, body.nsa-accueil *::after { animation-duration: 1ms !important; transition-duration: 1ms !important; transition-delay: 0ms !important; }
  body.nsa-accueil [data-parallax] { transform: none !important; }
  html.js body.nsa-accueil [data-ecrire], html.js body.nsa-accueil [data-rideau], body.nsa-accueil .hero__titre .script { clip-path: none !important; }
  html.js body.nsa-accueil [data-rideau] img, html.js body.nsa-accueil .titre.a-animer .mot > span { transform: none !important; }
  body.nsa-accueil .tuiles__liste li { transition: none; }
}

/* ---------- Propre à WordPress : panier WooCommerce, barre d'administration ---------- */
body.nsa-accueil .icone__badge[data-nombre="0"] { display: none; }
body.nsa-accueil .produit__ajout { display: grid; place-items: center; text-decoration: none; }
body.nsa-accueil .produit__ajout.loading { opacity: .6; pointer-events: none; }
body.nsa-accueil .produit__ajout.loading::after { content: "…"; margin-left: .3em; }
body.nsa-accueil .produit__ajout.added { background: var(--brun); color: var(--blanc); }
body.nsa-accueil .produit__ajout[aria-disabled="true"] { color: var(--texte-doux); cursor: not-allowed; background: transparent; }
body.nsa-accueil .produit .added_to_cart {
  display: block;
  padding: .7rem 1rem;
  border-top: 1px solid var(--filet);
  font-family: var(--sans);
  font-size: .6875rem;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  color: var(--rouge);
}
body.nsa-accueil .produit__prix del { opacity: .55; margin-right: .4em; font-weight: 500; }
body.nsa-accueil .produit__prix ins { text-decoration: none; }
body.admin-bar.nsa-accueil .header { top: 32px; }
@media (max-width: 782px) { body.admin-bar.nsa-accueil .header { top: 46px; } }

/* Éléments que le thème imprime en fin de page (connexion, menu mobile, voile) :
   le thème les masquait avec sa feuille, retirée sur ce gabarit. */
body.nsa-accueil > .account-wrap,
body.nsa-accueil > .bodoni-mobile-nav,
body.nsa-accueil > .bodoni-overlay { display: none !important; }
body.nsa-accueil .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Le sélecteur de langue flottant (TranslatePress, en bas à droite) ne doit pas couvrir les onglets. */
@media (max-width: 640px) { body.nsa-accueil .hero__onglets { width: calc(100% - 2 * var(--gouttiere) - 64px); left: var(--gouttiere); translate: 0 0; } }

/* Le libellé « Voir le panier » est vide sur tout le site (réglage existant) : pas de bande vide. */
body.nsa-accueil .produit .added_to_cart:empty { display: none; }

/* ---------- Pied de page centré (1er octobre 2026) ----------
   Demande du domaine : un pied plus beau, éléments centrés. Trois colonnes
   centrées, séparées par un filet cuivre vertical ; chaque titre porte sa
   fleur de lys au-dessus et un trait dessous ; la barre du bas s'empile au
   centre, le retour en haut de page en dernier. */
body.nsa-accueil .pied__grille { text-align: center; }
/* minmax(0, 1fr) en bureau seulement : en base, la règle passerait après les
   colonnes mobiles de la maquette et les écraserait. */
@media (min-width: 961px) { body.nsa-accueil .pied__grille { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
body.nsa-accueil .pied__col { position: relative; padding-inline: clamp(.25rem, 1.5vw, 1.25rem); }
body.nsa-accueil .pied__col + .pied__col::before { content: ""; position: absolute; top: .25rem; bottom: .25rem; left: calc(clamp(2rem, 4vw, 3.5rem) / -2); width: 1px; background: linear-gradient(to bottom, transparent, rgba(201, 104, 56, .55) 20%, rgba(201, 104, 56, .55) 80%, transparent); }
body.nsa-accueil .pied__titre, body.nsa-accueil .pied__titre--filet { display: flex; flex-direction: column; align-items: center; gap: .75rem; min-width: 0; margin-bottom: 1.5rem; padding-bottom: 0; border-bottom: 0; }
body.nsa-accueil .pied__titre .fleur--petite { width: 20px; margin: 0; }
body.nsa-accueil .pied__titre::after { content: ""; width: 40px; height: 1px; background: var(--cuivre); }
body.nsa-accueil .pied__groupe { font-style: italic; }
body.nsa-accueil .reseaux { justify-content: center; }
body.nsa-accueil .pied__adresse, body.nsa-accueil .pied__tel, body.nsa-accueil .pied__mails { justify-items: center; }
body.nsa-accueil .pied__tel a { justify-self: center; }
body.nsa-accueil .pied__bas { flex-direction: column; align-items: center; gap: 1.1rem; text-align: center; }
body.nsa-accueil .pied__legal { order: 1; justify-content: center; }
body.nsa-accueil .pied__droits { order: 2; max-width: 48rem; text-align: center; }
body.nsa-accueil .pied__mentions { justify-content: center; }
body.nsa-accueil .pied__haut { order: 3; margin-top: .75rem; }
@media (max-width: 960px) {
  body.nsa-accueil .pied__col:last-child::before { display: none; }
  body.nsa-accueil .pied__droits { text-align: center; }
  body.nsa-accueil .pied__mentions { justify-content: center; }
}
@media (max-width: 640px) {
  body.nsa-accueil .pied__col + .pied__col { padding-top: 2.5rem; }
  body.nsa-accueil .pied__col + .pied__col::before { display: block; top: 0; bottom: auto; left: 50%; width: 120px; height: 1px; translate: -50% 0; background: linear-gradient(90deg, transparent, rgba(201, 104, 56, .6), transparent); }
  body.nsa-accueil .pied__col:last-child > section + section { margin-top: 2.5rem; }
  body.nsa-accueil .pied__haut { order: 3; }
}
