/* ==============================================================
   La Table d'Olivier — CSS principal
   v0.1.0 — Phase 2a : skeleton (nav + footer + base typo)
   ============================================================== */

/* === VARIABLES (palette sauge — source de vérité : design-specs.md) === */
:root {
  --ivory:      #F1EDE4;
  --ivory-soft: #E8E2D3;
  --paper:      #F6F1E6;
  --paper-warm: #EAE1CC;
  --ink:        #1A1D1A;
  --ink-soft:   #353A35;
  --ink-light:  #6A7068;
  --sage:       #7A8A6E;
  --sage-bright:#95A487;
  --moss:       #4D5C45;

  --line:        rgba(26, 29, 26, 0.12);
  --line-strong: rgba(26, 29, 26, 0.25);

  --space-1:  0.5rem;
  --space-2:  1rem;
  --space-3:  1.5rem;
  --space-4:  2rem;
  --space-6:  3rem;
  --space-8:  4rem;
  --space-12: 6rem;
  --space-16: 8rem;
  --space-24: 12rem;

  --nav-height: 5.5rem;
}

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

html { scroll-behavior: smooth; }

body {
  background: var(--ivory);
  color: var(--ink);
  font-family: 'Inter', 'Inter Fallback', system-ui, sans-serif;
  font-weight: 300;
  line-height: 1.6;
  font-size: 15px;
  letter-spacing: 0.01em;
  overflow-x: hidden;
}

::selection { background: var(--ink); color: var(--ivory); }

img, svg, video { max-width: 100%; display: block; height: auto; }

a { color: inherit; text-decoration: none; }

button {
  background: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
  color: inherit;
  padding: 0;
}

/* === TYPO BASE === */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-weight: 300;
  line-height: 1.1;
  letter-spacing: -0.005em;
}

p { line-height: 1.7; }

em, .italic { font-style: italic; }

.sage  { color: var(--sage); }
.ink   { color: var(--ink); }
.muted { color: var(--ink-light); }

/* Le fleuron — auréole sauge (reprise du signe du logo) */
.fleuron {
  display: block;
  width: 38px;
  height: 38px;
  margin: 3rem auto;
  border: 1px solid var(--sage);
  border-radius: 50%;
  background: transparent;
}

/* Variante inline pour usage dans une ligne de texte / séparateur compact. */
.fleuron--inline {
  display: inline-block;
  width: 22px;
  height: 22px;
  margin: 0 0.6em;
  vertical-align: middle;
}

/* Variante grande pour les hero / sections marquantes. */
.fleuron--large {
  width: 56px;
  height: 56px;
  margin: 4rem auto;
}

/* === WORDMARK — version texte du nom de la maison =================
   Mime le wordmark du logo horizontal (Inter capitales espacées).
   Utilisable dans le footer, le copyright, les en-têtes éditoriaux, etc.
   La couleur sauge sur "d'Olivier" rappelle l'apostrophe du signe. */
.wordmark {
  display: inline;
  font-family: 'Inter', 'Inter Fallback', system-ui, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.28em;
  line-height: 1.4;
}

.wordmark-1,
.wordmark-2 {
  display: inline;
  font-family: 'Inter', 'Inter Fallback', system-ui, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.28em;
}

.wordmark-1 { font-weight: 300; color: var(--ink); }
.wordmark-2 { font-weight: 400; color: var(--sage); }

/* Variante empilée (deux lignes) — à utiliser dans le footer-top par exemple. */
.wordmark--stacked {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  line-height: 1.05;
  gap: 0.35em;
}
.wordmark--stacked .wordmark-1,
.wordmark--stacked .wordmark-2 {
  display: block;
}

/* === SIGNATURE MANUSCRITE D'OLIVIER ============================
   PNG transparent à teinte encre. Utilisée en remplacement du nom
   "Olivier Dufrenne" dans les contextes éditoriaux où une touche
   personnelle est souhaitée (footer, page Le Chef, citations signées).
   La signature est sa propre apostrophe — pas besoin de l'encadrer. */
.signature-handwritten {
  display: inline-block;
  height: 1.8em;
  width: auto;
  vertical-align: -0.45em;
  margin: 0 0.2em;
  user-select: none;
}

/* Variante grande pour les pages où la signature est un point d'accent fort
   (fin de la page "Le Chef", citation signée du chef). */
.signature-handwritten--large {
  display: block;
  height: auto;
  width: clamp(180px, 30vw, 320px);
  margin: 1.5rem auto 0;
  vertical-align: baseline;
}

/* Inclinaison signature (code éditorial Pic/Alléno : -3°) */
.signature-handwritten--tilted {
  transform: rotate(-3deg);
  transform-origin: center left;
}

/* Eyebrow (mention de section avec traits) */
.eyebrow {
  font-family: 'Inter', 'Inter Fallback', system-ui, sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--ink-light);
  font-weight: 400;
  display: inline-flex;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 2rem;
}

.eyebrow::before,
.eyebrow::after {
  content: '';
  width: 30px;
  height: 1px;
  background: var(--ink-light);
}

/* Utilitaire de mise en page */
.container {
  max-width: 1300px;
  margin: 0 auto;
  padding: 0 var(--space-6);
}

/* === NAVIGATION (commune à toutes les pages) === */
.site-nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  padding: 1.5rem 3rem;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  background: rgba(241, 237, 228, 0.92);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid transparent;
  transition: border-color 0.3s ease;
}

.site-nav.scrolled {
  border-bottom-color: var(--line);
}

/* Compensation barre d'admin WordPress (visible uniquement aux utilisateurs connectés). */
.admin-bar .site-nav { top: 32px; }
@media screen and (max-width: 782px) {
  .admin-bar .site-nav { top: 46px; }
}

.nav-left,
.nav-right {
  display: flex;
  align-items: center;
  gap: 2rem;
}

.nav-right { justify-content: flex-end; }

.nav-link {
  font-size: 0.72rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  font-weight: 400;
  color: var(--ink);
  transition: color 0.3s ease;
  display: inline-block;
}

.nav-link:hover,
.nav-link.current,
.nav-link.current-menu-item > a,
.current-menu-item .nav-link { color: var(--sage); }

.logo-center {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  line-height: 1;
  color: var(--ink);
  text-align: center;
}

.logo-img {
  display: block;
  height: auto;
  width: auto;
}

.logo-img-mark { height: 52px; width: 52px; }

/* Wordmark sous le signe : reprend les couleurs bi-encre/sauge du logo horizontal. */
.logo-center .wordmark { font-size: 0.62rem; white-space: nowrap; }

@media (max-width: 968px) {
  .logo-img-mark { height: 40px; width: 40px; }
  .logo-center .wordmark { font-size: 0.55rem; }
  .logo-center .wordmark-1,
  .logo-center .wordmark-2 { letter-spacing: 0.22em; }
}

.lang {
  font-size: 0.7rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ink-light);
  user-select: none;
}

.lang .active {
  color: var(--ink);
  font-weight: 500;
}

/* === MINI-PANIER NAV — icône cabas + compteur sage === */
.nav-cart {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  color: var(--ink);
  transition: color 0.3s ease;
  margin-right: 0.4rem;
}

.nav-cart:hover { color: var(--sage); }

.nav-cart-icon {
  width: 22px;
  height: 22px;
  display: block;
}

.nav-cart-count {
  position: absolute;
  top: -3px;
  right: -3px;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  border-radius: 9px;
  background: var(--sage);
  color: var(--ivory);
  font-family: 'Inter', 'Inter Fallback', system-ui, sans-serif;
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  box-shadow: 0 0 0 2px var(--ivory);
  transition: transform 0.3s ease;
}

.nav-cart-count.is-empty { display: none; }
.nav-cart:hover .nav-cart-count { transform: scale(1.08); }

@media (max-width: 968px) {
  .nav-cart { width: 30px; height: 30px; }
  .nav-cart-icon { width: 19px; height: 19px; }
  .nav-cart-count { min-width: 15px; height: 15px; font-size: 0.56rem; top: -2px; right: -2px; }
}

/* Burger menu mobile — caché en desktop */
.nav-burger {
  display: none;
  width: 28px;
  height: 18px;
  position: relative;
}

.nav-burger span {
  display: block;
  position: absolute;
  left: 0; right: 0;
  height: 1px;
  background: var(--ink);
  transition: transform 0.3s ease, opacity 0.3s ease, top 0.3s ease;
}

.nav-burger span:nth-child(1) { top: 0; }
.nav-burger span:nth-child(2) { top: 50%; }
.nav-burger span:nth-child(3) { top: 100%; }

.nav-burger.open span:nth-child(1) { top: 50%; transform: rotate(45deg); }
.nav-burger.open span:nth-child(2) { opacity: 0; }
.nav-burger.open span:nth-child(3) { top: 50%; transform: rotate(-45deg); }

/* Panneau mobile (caché par défaut, JS gère l'ouverture) */
.nav-mobile-panel {
  display: none;
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: var(--ivory);
  z-index: 99;
  padding: 6rem 2rem 2rem;
  flex-direction: column;
  gap: 2rem;
  text-align: center;
}

.nav-mobile-panel.open {
  display: flex;
}

.nav-mobile-panel .nav-link {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: 1.8rem;
  letter-spacing: 0.05em;
  text-transform: none;
  font-weight: 300;
  font-style: italic;
}

/* === MAIN — espace réservé au contenu de chaque page === */
.site-main {
  min-height: 50vh;
  padding-top: var(--nav-height);
}

/* === FOOTER === */
.site-footer {
  background: var(--ivory);
  color: var(--ink);
  padding: 4rem 3rem 2rem;
  border-top: 1px solid var(--line);
}

.footer-top {
  text-align: center;
  margin-bottom: 3.5rem;
  padding-bottom: 5rem;
  border-bottom: 1px solid var(--line);
}

.footer-logo {
  font-size: 1.4rem;
  margin-bottom: 2.5rem;
}

.footer-bottom .wordmark {
  font-size: inherit; /* le copyright est petit (0.72rem), le wordmark suit */
}

.footer-tagline {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 1.2rem;
  color: var(--ink-soft);
  max-width: 500px;
  margin: 0 auto;
}

.footer-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 4rem;
  max-width: 1300px;
  margin: 0 auto;
}

.footer-col h5 {
  font-family: 'Inter', 'Inter Fallback', system-ui, sans-serif;
  font-size: 0.7rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--ink);
  margin-bottom: 1.5rem;
}

.footer-col a,
.footer-col p,
.footer-col button {
  display: block;
  color: var(--ink-soft);
  font-size: 0.92rem;
  line-height: 1.9;
  margin-bottom: 0.3rem;
  transition: color 0.3s ease;
  text-align: left;
}

.footer-col a:hover,
.footer-col button:hover { color: var(--sage); }

.footer-distinctions {
  display: flex;
  justify-content: center;
  gap: 4rem;
  margin: 4rem auto 0;
  padding-top: 4rem;
  border-top: 1px solid var(--line);
  flex-wrap: wrap;
}

.footer-distinction {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 0.85rem;
  color: var(--ink-light);
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.footer-bottom {
  text-align: center;
  padding-top: 3rem;
  margin-top: 3rem;
  font-family: 'Inter', 'Inter Fallback', system-ui, sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--ink-light);
}

/* === 404 === */
.error-404 {
  min-height: 55vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 4rem 1.5rem;
  text-align: center;
}

.error-404 h1 {
  font-size: clamp(4rem, 12vw, 9rem);
  font-weight: 300;
  color: var(--sage);
  font-style: italic;
  margin-bottom: 1rem;
}

.error-404 p {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 1.4rem;
  color: var(--ink-soft);
  max-width: 600px;
  margin-bottom: 3rem;
}

.error-404 a {
  font-size: 0.72rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  border: 1px solid var(--ink);
  padding: 1.1rem 3rem;
  transition: all 0.4s ease;
}

.error-404 a:hover { background: var(--ink); color: var(--ivory); }

/* === RESPONSIVE === */
@media (max-width: 968px) {
  .site-nav { padding: 1rem 1.5rem; grid-template-columns: auto 1fr auto; }
  .nav-left .nav-link,
  .nav-right .nav-link { display: none; }
  .nav-left { gap: 0; }
  .nav-right { gap: 1rem; }
  .nav-burger { display: block; }
  .logo-center { font-size: 1rem; letter-spacing: 0.2em; }

  .site-footer { padding: 4rem 1.5rem 1.5rem; }
  .footer-grid { grid-template-columns: repeat(2, 1fr); gap: 2rem; }
  .footer-distinctions { gap: 2rem; }
}

@media (max-width: 540px) {
  .footer-grid { grid-template-columns: 1fr; }
}

/* === Animation utility (étoffée en Phase 2d) === */
.fade-up {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 1.2s cubic-bezier(0.16, 1, 0.3, 1),
              transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.fade-up.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ==============================================================
   SECTIONS DE PAGE — composants partagés et home
   ============================================================== */

/* Padding par défaut des <section> */
section { padding: 3.5rem 3rem; }

.section-title {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: clamp(2.8rem, 5.5vw, 4.5rem);
  line-height: 1.1;
  font-weight: 300;
  color: var(--ink);
  margin-bottom: 2.5rem;
}
.section-title em { font-style: italic; color: var(--sage); }

/* === HERO ACCUEIL === */
.hero {
  min-height: 78vh;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: var(--ivory);
}

.hero-bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 30% 40%, rgba(122, 138, 110, 0.15), transparent 50%),
    radial-gradient(ellipse at 70% 60%, rgba(77, 92, 69, 0.12), transparent 50%);
}

.hero-floral {
  position: absolute;
  inset: 0;
  opacity: 0.4;
  background-image:
    radial-gradient(circle at 15% 30%, rgba(77, 92, 69, 0.3) 1px, transparent 2px),
    radial-gradient(circle at 80% 20%, rgba(122, 138, 110, 0.25) 1.5px, transparent 3px),
    radial-gradient(circle at 25% 75%, rgba(77, 92, 69, 0.2) 1px, transparent 2px),
    radial-gradient(circle at 90% 80%, rgba(122, 138, 110, 0.3) 1px, transparent 2px),
    radial-gradient(circle at 50% 50%, rgba(26, 29, 26, 0.05) 0.5px, transparent 1px);
  background-size: 200px 200px, 250px 250px, 180px 180px, 220px 220px, 80px 80px;
  animation: floralDrift 60s linear infinite;
}

@keyframes floralDrift {
  0% { background-position: 0 0, 0 0, 0 0, 0 0, 0 0; }
  100% { background-position: 200px 100px, -250px 200px, 180px -180px, -220px 100px, 80px 80px; }
}

/* === HERO AVEC PHOTO (variante cinématographique) === */
.hero.hero--photo { background: var(--ink); }

.hero.hero--photo .hero-bg,
.hero.hero--photo .hero-floral { display: none; }

.hero.hero--photo .hero-photo {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.hero.hero--photo .hero-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.hero.hero--photo .hero-photo::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
    rgba(26, 29, 26, 0.50) 0%,
    rgba(26, 29, 26, 0.25) 50%,
    rgba(26, 29, 26, 0.60) 100%
  );
  z-index: 1;
}

.hero.hero--photo .hero-content,
.hero.hero--photo .hero-distinctions { z-index: 2; }

.hero.hero--photo .hero-content { color: var(--ivory); }
.hero.hero--photo .hero-eyebrow {
  color: #FFFFFF;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.6);
  opacity: 0.92;
}

/* Le H1 entier en blanc pur sur fond photo — italique conservé sur "d'émotions". */
.hero.hero--photo h1 {
  color: #FFFFFF;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.45);
}
.hero.hero--photo h1 em { color: var(--sage-bright); }

.hero.hero--photo .hero-tagline {
  color: rgba(241, 237, 228, 0.95);
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.5);
}

/* Fleuron en sauge-bright pour rester lisible sur fond sombre */
.hero.hero--photo .fleuron { border-color: var(--sage-bright); }

/* Distinctions inversées : texte ivoire sur fond sombre */
.hero.hero--photo .hero-distinctions .distinction { color: rgba(241, 237, 228, 0.55); }
.hero.hero--photo .hero-distinctions .distinction strong {
  color: #FFFFFF;
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.55);
}

.hero-content {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 1100px;
  padding: 5rem 3rem 7rem;  /* +4rem bottom pour ne pas chevaucher les distinctions */
  /* Anti-CLS : réserve la hauteur même avant chargement des fonts custom */
  min-height: 50vh;
  contain-intrinsic-size: 50vh;
}

/* Anti-CLS : ajuste la taille du fallback Georgia pour matcher Cormorant Garamond.
   Évite le "saut" de mise en page quand la font custom charge.
   Calcul empirique pour Cormorant 300/400. */
@font-face {
  font-family: 'Cormorant Garamond Fallback';
  src: local('Georgia');
  size-adjust: 92%;
  ascent-override: 90%;
  descent-override: 22%;
}
@font-face {
  font-family: 'Inter Fallback';
  src: local('Arial');
  size-adjust: 107%;
  ascent-override: 90%;
  descent-override: 22%;
}

.hero-eyebrow {
  font-size: 0.72rem;
  letter-spacing: 0.5em;
  text-transform: uppercase;
  color: var(--ink-light);
  margin-bottom: 3rem;
  font-weight: 400;
}

.hero h1 {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: clamp(3.5rem, 9vw, 8.5rem);
  line-height: 0.95;
  font-weight: 300;
  letter-spacing: -0.015em;
  margin-bottom: 3rem;
  color: var(--ink);
}

.hero h1 em {
  font-style: italic;
  font-weight: 300;
  color: var(--sage);
}

.hero-tagline {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 1.4rem;
  line-height: 1.5;
  color: var(--ink-soft);
  max-width: 580px;
  margin: 0 auto 4rem;
  font-weight: 300;
}

/* Boutons jumelés (style éditorial Pic) */
.btn-pair {
  display: inline-flex;
  border: 1px solid var(--ink);
}

.btn-pair > a,
.btn-pair > button {
  padding: 1.1rem 3rem;
  font-size: 0.72rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--ink);
  text-decoration: none;
  font-weight: 400;
  background: transparent;
  border-right: 1px solid var(--ink);
  transition: all 0.4s ease;
  cursor: pointer;
  font-family: inherit;
}

.btn-pair > a:last-child,
.btn-pair > button:last-child { border-right: none; }
.btn-pair > a:hover,
.btn-pair > button:hover { background: var(--ink); color: var(--ivory); }

/* Variante sur fond sombre */
.btn-pair--light { border-color: var(--sage); }
.btn-pair--light > a,
.btn-pair--light > button { color: var(--sage); border-right-color: var(--sage); }
.btn-pair--light > a:hover,
.btn-pair--light > button:hover { background: var(--sage); color: var(--ink); }

/* Override spécifique pour les boutons du hero photo (overlay plus clair = besoin de plus de contraste). */
.hero.hero--photo .btn-pair--light {
  border-color: rgba(255, 255, 255, 0.92);
  background: rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.hero.hero--photo .btn-pair--light > a,
.hero.hero--photo .btn-pair--light > button {
  color: #FFFFFF;
  border-right-color: rgba(255, 255, 255, 0.92);
  font-weight: 500;
}
.hero.hero--photo .btn-pair--light > a:hover,
.hero.hero--photo .btn-pair--light > button:hover {
  background: rgba(255, 255, 255, 0.95);
  color: var(--ink);
}

.hero-distinctions {
  position: absolute;
  bottom: 1.4rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: flex-start;
  gap: 3.5rem;
  z-index: 2;
}

.distinction {
  font-family: 'Inter', 'Inter Fallback', system-ui, sans-serif;
  font-size: 0.62rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--ink-light);
  text-align: center;
  font-weight: 400;
  line-height: 1;
}

.distinction strong {
  display: block;
  font-family: 'Cormorant Garamond', 'EB Garamond', Georgia, serif;
  font-style: normal;
  font-weight: 400;
  color: var(--ink);
  font-size: clamp(1.35rem, 2vw, 1.65rem);
  letter-spacing: 0.015em;
  margin-top: 0.55rem;
  line-height: 1.15;
}

/* === INTRO CITATION === */
.intro-quote {
  padding: 2rem 3rem 4rem;
  background: var(--paper);
  text-align: center;
}

/* Variante split 50/50 : texte à gauche + photo à droite. */
.intro-quote.intro-quote--split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5rem;
  align-items: center;
  max-width: 1400px;
  margin: 0 auto;
  padding: 4rem 3rem;
  text-align: left;
}

.intro-quote--split .intro-quote-text { text-align: left; }
.intro-quote--split .intro-text { text-align: left; max-width: none; margin: 0 0 1.5rem; }
.intro-quote--split .fleuron { margin: 0 0 2rem; }

.intro-quote--split .intro-quote-image {
  width: 100%;
}

.intro-quote--split .intro-quote-image picture,
.intro-quote--split .intro-quote-image img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 3 / 4;
  object-fit: cover;
}

@media (max-width: 968px) {
  .intro-quote.intro-quote--split {
    grid-template-columns: 1fr;
    gap: 2.5rem;
    padding: 3rem 1.5rem;
  }
  .intro-quote--split .intro-quote-image picture,
  .intro-quote--split .intro-quote-image img {
    aspect-ratio: 4 / 3;
  }
}

.intro-text {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: clamp(1.3rem, 2.4vw, 2.1rem);
  line-height: 1.4;
  font-weight: 300;
  max-width: 880px;
  margin: 0 auto 2rem;
  color: var(--ink);
}

.intro-text em { font-style: italic; color: var(--sage); }

/* Conteneur de la signature manuscrite sous la citation introductive.
   La rotation -3deg et le bloc centré sont assurés par la classe
   .signature-handwritten--large.tilted appliquée à l'image directement. */
.intro-signature {
  margin-top: 4rem;
  text-align: center;
}

/* === DESTINATIONS (L'Univers) === */
.universe-header {
  text-align: center;
  padding: 4rem 3rem 3rem;
  background: var(--paper-warm);
  position: relative;
}

/* Fleuron auréole en haut de l'Univers — marque la transition citation → univers */
.universe-header::before {
  content: '';
  display: block;
  width: 38px;
  height: 38px;
  margin: 0 auto 2.5rem;
  border: 1px solid var(--sage);
  border-radius: 50%;
}

/* Variante "flush" : pas de marge en bas du H2 + pas de padding-bottom,
   pour coller la grille de cards directement (sans cassure de fond intermédiaire). */
.universe-header.universe-header--flush {
  padding-bottom: 0;
}
.universe-header.universe-header--flush .section-title {
  margin-bottom: 0;
  padding-bottom: 3rem;
}

/* Layout : Chef à domicile en pleine largeur (destination phare),
   Événements + Boutique côte à côte sur une 2e ligne (cards verticales). */
.destinations {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.destination {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 50vh;
  align-items: stretch;
  border-top: 1px solid var(--line);
}

/* Chef à domicile : pleine largeur, layout horizontal image-texte */
.destination:nth-child(1) { grid-column: 1 / -1; }

.destination:nth-child(1) .destination-image,
.destination:nth-child(1) .destination-content {
  /* Pas de changement de layout interne pour la 1ère */
}

/* Pattern alterné : Chef à dom inverse sur 2e enfant n'existe plus
   (pleine largeur), donc on retire le RTL pour les autres. */

/* Événements + Boutique : carte verticale compacte côte à côte, alignées */
.destination:nth-child(2),
.destination:nth-child(3) {
  grid-template-columns: 1fr;
  grid-template-rows: auto 1fr;
  min-height: 0;
  border-right: 1px solid var(--line);
  align-self: stretch;
}

.destination:nth-child(3) { border-right: none; }

.destination:nth-child(2) .destination-image,
.destination:nth-child(3) .destination-image {
  aspect-ratio: 4 / 3;
  height: auto;
}

.destination:nth-child(2) .destination-content,
.destination:nth-child(3) .destination-content {
  padding: 3rem 2.5rem;
}

.destination:nth-child(2) .destination-content h3,
.destination:nth-child(3) .destination-content h3 {
  font-size: clamp(1.6rem, 2.4vw, 2.2rem);
  margin-bottom: 1rem;
}

.destination:nth-child(2) .destination-content > p,
.destination:nth-child(3) .destination-content > p {
  font-size: 0.92rem;
  margin-bottom: 1rem;
}

@media (max-width: 768px) {
  .destinations { grid-template-columns: 1fr; }
  .destination:nth-child(2),
  .destination:nth-child(3) { border-right: none; }
}

.destination-image {
  position: relative;
  overflow: hidden;
  background: var(--ivory-soft);
}

.destination-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.destination:hover .destination-image img { transform: scale(1.04); }

.destination-content {
  padding: 4rem 5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: var(--ivory);
}

.destination-number {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 0.95rem;
  color: var(--sage);
  margin-bottom: 1.5rem;
  letter-spacing: 0.15em;
}

.destination-content h3 {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: clamp(2.2rem, 3.5vw, 3.2rem);
  line-height: 1.05;
  font-weight: 300;
  margin-bottom: 2rem;
  color: var(--ink);
}

.destination-content h3 em { font-style: italic; color: var(--sage); }

.destination-content > p {
  color: var(--ink-soft);
  font-size: 1rem;
  line-height: 1.85;
  margin-bottom: 1.5rem;
  max-width: 480px;
}

.destination-link {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  margin-top: 2rem;
  font-size: 0.72rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--ink);
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--ink);
  width: fit-content;
  transition: all 0.4s ease;
}

.destination-link::after {
  content: '→';
  margin-left: 1rem;
  transition: transform 0.4s ease;
}

.destination-link:hover { color: var(--sage); border-color: var(--sage); }
.destination-link:hover::after { transform: translateX(6px); }

/* === SECTION CHEF (fond sombre) === */
.chef-section {
  padding: 4rem 3rem;
  background: var(--ink);
  color: var(--ivory);
}

.chef-grid {
  max-width: 1300px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 5rem;
  align-items: center;
}

.chef-portrait { position: relative; }

.chef-portrait img {
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
  filter: contrast(1.05) saturate(0.9);
}

.chef-portrait-stamp {
  position: absolute;
  bottom: -3rem;
  right: -2rem;
  width: 140px;
  height: 140px;
  border: 1px solid var(--sage);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background: var(--ink);
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 0.85rem;
  line-height: 1.4;
  color: var(--sage);
  letter-spacing: 0.1em;
  transform: rotate(-8deg);
}

.chef-portrait-stamp em {
  display: block;
  font-size: 1.4rem;
  color: var(--ivory);
  font-style: italic;
  margin: 0.3rem 0;
}

.chef-content .eyebrow { color: rgba(241, 237, 228, 0.6); }
.chef-content .eyebrow::before,
.chef-content .eyebrow::after { background: rgba(241, 237, 228, 0.6); }

.chef-content h2 {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: clamp(2.8rem, 5vw, 4.5rem);
  line-height: 1.05;
  font-weight: 300;
  margin-bottom: 2.5rem;
}

.chef-content h2 em { font-style: italic; color: var(--sage); }

.chef-content p {
  color: rgba(241, 237, 228, 0.78);
  font-size: 1.02rem;
  line-height: 1.85;
  margin-bottom: 1.5rem;
}

.chef-quote {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 1.5rem;
  line-height: 1.4;
  color: var(--ivory);
  margin: 3rem 0;
  padding-left: 2rem;
  border-left: 1px solid var(--sage);
}

.chef-signature {
  margin-top: 3rem;
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 2rem;
  color: var(--sage);
  transform: rotate(-2deg);
  display: inline-block;
}

.chef-positions {
  display: flex;
  flex-wrap: wrap;
  margin-top: 3rem;
  border-top: 1px solid rgba(241, 237, 228, 0.15);
}

.chef-position {
  flex: 1;
  min-width: 180px;
  padding: 1.5rem 2rem 1.5rem 0;
  border-right: 1px solid rgba(241, 237, 228, 0.15);
}

.chef-position:last-child { border-right: none; }

.chef-position-place {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 1.05rem;
  color: var(--ivory);
  margin-bottom: 0.3rem;
}

.chef-position-year {
  font-size: 0.7rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--sage);
}

/* === VARIANTE chef-section--landscape : photo paysage pleine largeur + texte dessous === */
.chef-section.chef-section--landscape { padding: 0; }

.chef-section.chef-section--landscape .chef-grid {
  display: block;
  grid-template-columns: none;
  gap: 0;
  max-width: none;
  margin: 0;
}

.chef-section.chef-section--landscape .chef-portrait {
  width: 100%;
  position: relative;
  margin: 0;
}

.chef-section.chef-section--landscape .chef-portrait picture,
.chef-section.chef-section--landscape .chef-portrait img {
  width: 100%;
  height: auto;
  aspect-ratio: 1.9 / 1;
  display: block;
}

.chef-section.chef-section--landscape .chef-portrait img {
  object-fit: cover;
}

.chef-section.chef-section--landscape .chef-portrait-stamp {
  bottom: 2rem;
  right: 3rem;
  top: auto;
  left: auto;
}

.chef-section.chef-section--landscape .chef-content {
  padding: 5rem 3rem;
  max-width: 1100px;
  margin: 0 auto;
}

@media (max-width: 968px) {
  .chef-section.chef-section--landscape .chef-portrait img { aspect-ratio: 4 / 3; }
  .chef-section.chef-section--landscape .chef-portrait-stamp { bottom: 1rem; right: 1rem; width: 110px; height: 110px; font-size: 0.75rem; }
  .chef-section.chef-section--landscape .chef-content { padding: 4rem 1.5rem; }
}

/* === PROCESS — L'Art de recevoir === */
.process { padding: 4rem 3rem; background: var(--paper-warm); }
.process-header {
  text-align: center;
  margin-bottom: 2.5rem;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}
.process-header h2 {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: clamp(2.2rem, 4vw, 3.4rem);
  line-height: 1.1;
  font-weight: 300;
  margin-bottom: 1.2rem;
}
.process-header h2 em { font-style: italic; color: var(--sage); }
.process-header > p {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 1.3rem;
  line-height: 1.5;
  color: var(--ink-soft);
  max-width: 650px;
  margin: 0 auto;
}

/* Process en grille 4 colonnes compacte (au lieu de 4 étapes empilées). */
.process-steps {
  max-width: 1300px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
}

.process-step {
  display: flex;
  flex-direction: column;
  padding: 2.5rem 1.8rem 2rem;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  gap: 0.5rem;
}

/* Badge auréole (reprend le signe du logo) + chiffre Inter centré. */
.process-step-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 62px;
  height: 62px;
  border: 1px solid var(--sage);
  border-radius: 50%;
  margin-bottom: 0.5rem;
}

.process-step-number em {
  font-family: 'Inter', 'Inter Fallback', system-ui, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  color: var(--sage);
  line-height: 1;
}

.process-step-content h4 {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: 1.5rem;
  font-weight: 400;
  margin: 0.6rem 0 0.6rem;
  color: var(--ink);
  line-height: 1.2;
}

.process-step-content h4 em { font-style: italic; color: var(--sage); }

.process-step-content p {
  color: var(--ink-soft);
  font-size: 0.92rem;
  line-height: 1.6;
  margin: 0;
}

.process-step-meta {
  margin-top: auto;
  padding-top: 1.2rem;
  text-align: left;
  font-family: 'Inter', 'Inter Fallback', system-ui, sans-serif;
  font-style: normal;
  font-size: 0.68rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--ink-light);
}

@media (max-width: 968px) {
  .process-steps { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 540px) {
  .process-steps { grid-template-columns: 1fr; }
  .process-step { padding: 2rem 1.5rem; }
}

/* === EXPERIENCE / VIDEO === */
.experience {
  background: var(--moss);
  color: var(--ivory);
  padding: 4rem 3rem;
  text-align: center;
}

.experience .eyebrow { color: rgba(241, 237, 228, 0.6); justify-content: center; }
.experience .eyebrow::before,
.experience .eyebrow::after { background: rgba(241, 237, 228, 0.6); }

.experience h2 {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: clamp(2.2rem, 4.5vw, 3.8rem);
  line-height: 1.05;
  font-weight: 300;
  margin: 0 auto 1.5rem;
  max-width: 900px;
}

.experience h2 em { font-style: italic; color: var(--sage); }

.experience-tagline {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 1.15rem;
  line-height: 1.5;
  color: rgba(241, 237, 228, 0.8);
  max-width: 600px;
  margin: 0 auto 2.5rem;
}

.video-frame {
  max-width: 880px;
  margin: 0 auto;
  aspect-ratio: 16/9;
  background: #0e0d0b;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(122, 138, 110, 0.3);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.video-frame::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at center, rgba(122, 138, 110, 0.15), transparent 60%),
    linear-gradient(135deg, rgba(122, 138, 110, 0.05), rgba(26, 29, 26, 0.4));
  pointer-events: none;
}

/* Logo animé (placeholder vidéo à venir) */
.video-logo-anim {
  width: clamp(140px, 22vw, 220px);
  height: auto;
  position: relative;
  z-index: 1;
}

.video-logo-anim .logo-ring {
  transform-origin: 320px 285px;
  animation: logo-breathe-ring 5s ease-in-out infinite;
}

.video-logo-anim .logo-o {
  opacity: 0.92;
  transform-origin: 320px 320px;
  animation: logo-breathe-o 5s ease-in-out infinite;
}

.video-logo-anim .logo-apos {
  opacity: 0.88;
  transform-origin: 173px 240px;
  animation: logo-breathe-apos 5s ease-in-out infinite;
}

@keyframes logo-breathe-ring {
  0%, 100% { transform: scale(1);    opacity: 0.5; }
  50%      { transform: scale(1.06); opacity: 1;   }
}

@keyframes logo-breathe-o {
  0%, 100% { opacity: 0.7; }
  50%      { opacity: 1;   }
}

@keyframes logo-breathe-apos {
  0%, 100% { opacity: 0.55; }
  50%      { opacity: 1;    }
}

.video-caption {
  position: relative;
  z-index: 1;
  margin-top: 1.8rem;
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: 0.95rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(241, 237, 228, 0.55);
  font-weight: 300;
}

.video-caption em {
  font-style: italic;
  text-transform: none;
  letter-spacing: 0.02em;
  font-size: 1.1rem;
  color: rgba(241, 237, 228, 0.85);
}

/* === GALLERY === */
.gallery { padding: 4rem 0; background: var(--ivory); }
.gallery-header { text-align: center; padding: 0 3rem; margin-bottom: 3.5rem; }
.gallery-header h2 {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: clamp(2.8rem, 5vw, 4rem);
  line-height: 1.1;
  font-weight: 300;
}
.gallery-header h2 em { font-style: italic; color: var(--sage); }

/* Galerie magazine compacte : 5 paysages en 2 lignes (2 + 3). */
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1.2rem;
  padding: 0 2rem;
  max-width: 1600px;
  margin: 0 auto;
}

.gallery-item {
  position: relative;
  overflow: hidden;
  background: var(--ivory-soft);
  aspect-ratio: 16/9;
}

.gallery-item img,
.gallery-item picture {
  width: 100%;
  height: 100%;
  display: block;
}

.gallery-item img {
  object-fit: cover;
  transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.gallery-item:hover img { transform: scale(1.04); }

/* Ligne 1 : 2 photos plus larges (3+3 colonnes) */
.gallery-item:nth-child(1),
.gallery-item:nth-child(2) { grid-column: span 3; }

/* Ligne 2 : 3 photos (2+2+2 colonnes) */
.gallery-item:nth-child(3),
.gallery-item:nth-child(4),
.gallery-item:nth-child(5) { grid-column: span 2; }

/* Placeholder pour les photos manquantes (en attendant le shooting pro). */
.img-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    repeating-linear-gradient(
      135deg,
      var(--ivory-soft) 0,
      var(--ivory-soft) 14px,
      rgba(122, 138, 110, 0.08) 14px,
      rgba(122, 138, 110, 0.08) 28px
    );
  color: var(--ink-light);
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 0.95rem;
  text-align: center;
  padding: 1rem;
}

/* === PARTNERS === */
.partners { padding: 3.5rem 3rem; text-align: center; background: var(--paper); }
.partners-header { margin-bottom: 1.5rem; max-width: 720px; margin-left: auto; margin-right: auto; }
.partners-header h2 {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: clamp(2rem, 3.5vw, 2.8rem);
  line-height: 1.15;
  font-weight: 300;
  margin: 0 auto;
}
.partners-header h2 em { font-style: italic; color: var(--sage); }

.partners-header .partners-mention {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--ink-light);
  max-width: 640px;
  margin: 1.1rem auto 0;
}

/* Tableau d'honneur : chaque nom dans sa case, bordures fines sage,
   typographie signature italique en Mixed Case (respect des wordmarks).
   L'œil s'arrête sur chaque maison, pas de glissement liste. */
.partners-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid rgba(122, 138, 110, 0.22);
  border-left: 1px solid rgba(122, 138, 110, 0.22);
  margin: 2.6rem auto 0;
  max-width: 1240px;
}

.partner {
  padding: 2.4rem 1rem;
  border-right: 1px solid rgba(122, 138, 110, 0.22);
  border-bottom: 1px solid rgba(122, 138, 110, 0.22);
  min-height: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Cormorant Garamond', 'EB Garamond', Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(1.15rem, 1.55vw, 1.4rem);
  letter-spacing: 0.005em;
  text-transform: none;
  color: var(--ink);
  text-align: center;
  line-height: 1.25;
  transition: background 0.5s ease, color 0.4s ease;
  position: relative;
}

.partner:hover {
  background: rgba(122, 138, 110, 0.05);
  color: var(--moss);
}

@media (max-width: 968px) {
  .partners-list { grid-template-columns: repeat(2, 1fr); }
  .partner { padding: 1.6rem 0.8rem; min-height: 100px; font-size: 1.1rem; }
}

@media (max-width: 480px) {
  .partners-list { grid-template-columns: 1fr; }
  .partner { min-height: 80px; padding: 1.4rem 0.8rem; }
}

/* === TESTIMONIAL === */
.testimonials { padding: 4rem 3rem; background: var(--paper-warm); text-align: center; }
.testimonials-inner { max-width: 900px; margin: 0 auto; }

.testimonial-mark {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 6rem;
  color: var(--sage);
  line-height: 0.5;
  margin-bottom: 3rem;
  height: 3rem;
}

.testimonial-text {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  line-height: 1.4;
  font-weight: 300;
  font-style: italic;
  color: var(--ink);
  margin-bottom: 4rem;
}

.testimonial-author {
  font-size: 0.72rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--ink-light);
}

.testimonial-author strong {
  display: block;
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 1.1rem;
  color: var(--ink);
  text-transform: none;
  letter-spacing: 0.02em;
  margin-bottom: 0.3rem;
  font-weight: 400;
}

/* === RESERVE (CTA final) === */
.reserve {
  padding: 3rem 3rem 3.2rem;
  text-align: center;
  background: var(--ink);
  color: var(--ivory);
  position: relative;
  overflow: hidden;
}

.reserve::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center, rgba(122, 138, 110, 0.12), transparent 60%);
}

.reserve-inner { position: relative; z-index: 2; }

/* Fleuron plus discret dans cette section */
.reserve .fleuron--large { width: 38px; height: 38px; margin: 0 auto 1.4rem; }

.reserve h2 {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: clamp(2.3rem, 4.8vw, 4rem);
  line-height: 1.05;
  font-weight: 300;
  margin: 0 auto 1.4rem;
  max-width: 1100px;
}

.reserve h2 em { font-style: italic; color: var(--sage); }

.reserve > .reserve-inner > p {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 1.15rem;
  line-height: 1.5;
  color: rgba(241, 237, 228, 0.8);
  max-width: 580px;
  margin: 0 auto 2rem;
}

/* === RESPONSIVE SECTIONS HOME === */
@media (max-width: 968px) {
  section { padding: 5rem 1.5rem; }

  .hero-content { padding: 4rem 1.5rem 8rem; }
  .hero-distinctions { flex-direction: column; gap: 1.2rem; bottom: 1.5rem; position: static; transform: none; margin-top: 3rem; }
  .distinction { font-size: 0.7rem; }

  .destination { grid-template-columns: 1fr; min-height: auto; }
  .destination:nth-child(even) { direction: ltr; }
  .destination-image { aspect-ratio: 4/5; }
  .destination-content { padding: 4rem 2rem; }

  .chef-grid { grid-template-columns: 1fr; gap: 4rem; }
  .chef-portrait-stamp { right: 1rem; bottom: 1rem; }
  .chef-positions { flex-direction: column; }
  .chef-position { border-right: none; border-bottom: 1px solid rgba(241, 237, 228, 0.15); padding: 1.5rem 0; }

  .process-step { grid-template-columns: 1fr; gap: 1rem; padding: 3rem 0; }
  .process-step-meta { text-align: left; }

  .gallery-grid { grid-template-columns: repeat(2, 1fr); padding: 0 1rem; }
  .gallery-item:nth-child(n) { grid-column: span 1; margin-top: 0; aspect-ratio: 4/5; }

  .partner { min-width: 50%; border-bottom: 1px solid var(--line); padding: 2rem 1rem; }

  .btn-pair { flex-direction: column; }
  .btn-pair > a,
  .btn-pair > button { border-right: none; border-bottom: 1px solid currentColor; }
  .btn-pair > a:last-child,
  .btn-pair > button:last-child { border-bottom: none; }
}

/* ==============================================================
   PAGES SECONDAIRES — hero, breadcrumb, sections spécifiques
   ============================================================== */

/* === HERO PAGE SECONDAIRE === */
.page-hero {
  padding: 8rem 3rem 4rem;
  background: var(--ivory);
  position: relative;
  overflow: hidden;
}

.page-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 30% 50%, rgba(122, 138, 110, 0.1), transparent 60%);
}

.page-hero-inner {
  position: relative;
  z-index: 2;
  max-width: 1300px;
  margin: 0 auto;
  text-align: center;
}

.page-hero h1 {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: clamp(3rem, 7vw, 6rem);
  line-height: 1;
  font-weight: 300;
  margin-bottom: 2rem;
  color: var(--ink);
}

.page-hero h1 em { font-style: italic; color: var(--sage); }

.page-hero-tagline {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 1.4rem;
  line-height: 1.5;
  color: var(--ink-soft);
  max-width: 700px;
  margin: 0 auto 3rem;
}

.breadcrumb {
  font-size: 0.7rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--ink-light);
  margin-bottom: 3rem;
}

.breadcrumb a { color: var(--ink-light); }
.breadcrumb a:hover { color: var(--sage); }
.breadcrumb .sep { margin: 0 0.8rem; color: var(--sage); }

/* === PAGE CHEF À DOMICILE — Trois formules === */
.menu-types {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  background: var(--paper);
}

.menu-type {
  padding: 2.5rem 3rem 4rem;
  border-right: 1px solid var(--line);
  text-align: center;
}

.menu-type:last-child { border-right: none; }

.menu-type-number {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  color: var(--sage);
  font-size: 1rem;
  letter-spacing: 0.15em;
  margin-bottom: 1.5rem;
}

.menu-type h3 {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: 2rem;
  font-weight: 400;
  margin-bottom: 1rem;
}

.menu-type h3 em { font-style: italic; color: var(--sage); }

.menu-type-price {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 1.3rem;
  color: var(--ink-soft);
  margin-bottom: 0.4rem;
}

.menu-type-note {
  font-family: 'Inter', 'Inter Fallback', system-ui, sans-serif;
  font-size: 0.7rem;
  font-weight: 300;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--sage);
  margin-bottom: 1.6rem;
}

.menu-type-list {
  list-style: none;
  text-align: left;
  margin: 0 auto;
  max-width: 280px;
  padding: 0;
}

.menu-type-list li {
  padding: 0.7rem 0;
  border-bottom: 1px dotted var(--line);
  font-size: 0.92rem;
  color: var(--ink-soft);
}

/* === PAGE LE CHEF — Timeline === */
.timeline {
  max-width: 900px;
  margin: 0 auto;
  padding: 4rem 0;
}

.timeline-item {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 3rem;
  padding: 3rem 0;
  border-top: 1px solid var(--line);
  align-items: baseline;
}

.timeline-item:last-child { border-bottom: 1px solid var(--line); }

.timeline-year {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 2.5rem;
  color: var(--sage);
  line-height: 1;
}

.timeline-content h4 {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: 1.5rem;
  font-weight: 400;
  margin-bottom: 0.5rem;
}

.timeline-content .place {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  color: var(--sage);
  margin-bottom: 1rem;
  font-size: 1rem;
}

.timeline-content p {
  color: var(--ink-soft);
  font-size: 0.98rem;
  line-height: 1.75;
}

/* Encart presse (page Le Chef) */
.press-list {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  gap: 3rem;
}

.press-item {
  padding: 3rem;
  background: var(--paper);
  border-left: 2px solid var(--sage);
}

.press-item-source {
  font-family: 'Inter', 'Inter Fallback', system-ui, sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--sage);
  margin-bottom: 1rem;
}

.press-item p {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 1.2rem;
  line-height: 1.6;
  color: var(--ink-soft);
}

/* === PAGE ÉVÉNEMENTS — Photo héro panoramique au-dessus des 4 univers === */
.events-hero {
  width: 100%;
  margin-bottom: 3.5rem;
}

.events-hero-placeholder {
  aspect-ratio: 21 / 9;
  width: 100%;
  height: auto;
}

.events-hero img,
.events-hero picture {
  width: 100%;
  height: auto;
  aspect-ratio: 21 / 9;
  display: block;
  object-fit: cover;
}

/* === Composant générique : bandeau photo panoramique réutilisable === */
.page-photo-banner {
  width: 100%;
  margin: 0;
}

.page-photo-banner img,
.page-photo-banner picture,
.page-photo-banner .img-placeholder {
  width: 100%;
  height: auto;
  aspect-ratio: 21 / 9;
  display: block;
  object-fit: cover;
}

@media (max-width: 968px) {
  .page-photo-banner img,
  .page-photo-banner picture,
  .page-photo-banner .img-placeholder { aspect-ratio: 16 / 10; }
}

/* Photo carrée pour habiller une card (ex. menu-type d'une formule) */
.menu-type-image {
  width: 100%;
  margin: -2rem -2.5rem 1.2rem;
  width: calc(100% + 5rem);
  aspect-ratio: 16 / 9;  /* paysage plus court, -25% de hauteur vs 4/3 */
  overflow: hidden;
  background: var(--ivory-soft);
}

.menu-type-image img,
.menu-type-image picture,
.menu-type-image .img-placeholder {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

/* === PAGE ÉVÉNEMENTS — 4 cartes éditoriales (mode auréole/icône) === */
.event-types {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--line);
  border-left: 1px solid var(--line);
  max-width: 1400px;
  margin: 0 auto;
}

.event-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 3rem 1.8rem 2.5rem;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: var(--paper);
  transition: background 0.3s ease;
}

.event-card:hover { background: var(--ivory); }

.event-card-icon {
  width: 56px;
  height: 56px;
  margin-bottom: 1rem;
}

.event-card-number {
  font-family: 'Inter', 'Inter Fallback', system-ui, sans-serif;
  font-size: 0.68rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--sage);
  margin-bottom: 0.6rem;
  font-weight: 400;
}

.event-card-number em { font-style: normal; }

.event-card h3 {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: 1.6rem;
  font-weight: 300;
  margin: 0 0 0.8rem;
  line-height: 1.15;
  color: var(--ink);
}

.event-card h3 em { font-style: italic; color: var(--sage); }

.event-card p {
  color: var(--ink-soft);
  font-size: 0.9rem;
  line-height: 1.65;
  max-width: 280px;
  margin: 0;
}

/* Liste des références événements */
.references {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  gap: 2rem;
}

.reference {
  padding: 2.5rem 3rem;
  background: var(--paper);
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 3rem;
  align-items: baseline;
}

.reference-client {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  font-size: 1.4rem;
  color: var(--sage);
}

.reference p {
  font-size: 0.98rem;
  line-height: 1.75;
  color: var(--ink-soft);
}

/* === PAGE CONTACT — Grille 2 colonnes === */
.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  min-height: 50vh;
}

.contact-info {
  background: var(--ink);
  color: var(--ivory);
  padding: 4rem 5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.contact-info h2 {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: 3rem;
  font-weight: 300;
  line-height: 1.05;
  margin-bottom: 2rem;
}

.contact-info h2 em { font-style: italic; color: var(--sage); }

.contact-info > p {
  color: rgba(241, 237, 228, 0.78);
  margin-bottom: 2rem;
  line-height: 1.85;
}

.contact-detail {
  margin-top: 3rem;
}

.contact-detail h5 {
  font-size: 0.7rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--sage);
  margin-bottom: 0.7rem;
}

.contact-detail p {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  color: var(--ivory);
  font-size: 1.1rem;
  margin-bottom: 0;
  line-height: 1.6;
}

.contact-detail a {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-style: italic;
  color: var(--ivory);
  font-size: 1.1rem;
  transition: color 0.3s ease;
}

.contact-detail a:hover { color: var(--sage); }

.contact-form {
  background: var(--paper);
  padding: 4rem 5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.contact-form .eyebrow { color: var(--ink-light); }

.contact-form h2 {
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: 2.4rem;
  font-weight: 300;
  line-height: 1.1;
  margin-bottom: 3rem;
  color: var(--ink);
}

.form-group {
  margin-bottom: 2rem;
}

.form-group label {
  display: block;
  font-family: 'Inter', 'Inter Fallback', system-ui, sans-serif;
  font-size: 0.7rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--ink-light);
  margin-bottom: 0.7rem;
  font-weight: 400;
}

.form-group input,
.form-group textarea,
.form-group select {
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--line);
  padding: 0.5rem 0;
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: 1.1rem;
  color: var(--ink);
  outline: none;
  transition: border-color 0.3s ease;
  border-radius: 0;
}

.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus { border-bottom-color: var(--sage); }

.form-group textarea { min-height: 100px; resize: vertical; }

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}

.form-submit {
  margin-top: 2rem;
  padding: 1.1rem 3rem;
  background: var(--ink);
  color: var(--ivory);
  border: none;
  font-family: 'Inter', 'Inter Fallback', system-ui, sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  cursor: pointer;
  transition: all 0.4s ease;
  align-self: flex-start;
  font-weight: 400;
}

.form-submit:hover { background: var(--sage); }

/* Notices de retour formulaire (succès / erreur) */
.form-notice {
  margin: 0 0 2rem;
  padding: 1.25rem 1.5rem;
  font-family: 'Inter', 'Inter Fallback', system-ui, sans-serif;
  font-size: 0.95rem;
  line-height: 1.6;
  color: var(--ink);
  border-left: 3px solid var(--sage);
  background: var(--paper);
}
.form-notice strong {
  display: block;
  margin-bottom: 0.3rem;
  font-weight: 500;
  color: var(--moss);
  font-family: 'Cormorant Garamond', 'Cormorant Garamond Fallback', Georgia, serif;
  font-size: 1.15rem;
  letter-spacing: -0.005em;
}
.form-notice--err {
  border-left-color: #b07a00;
  background: #fff8e6;
}
.form-notice--err strong { color: #8a5d00; }
.form-notice a {
  color: var(--moss);
  text-decoration: underline;
  text-decoration-color: var(--sage);
  text-underline-offset: 3px;
}

/* === RESPONSIVE SUB-PAGES === */
@media (max-width: 968px) {
  .menu-types { grid-template-columns: 1fr; }
  .menu-type { border-right: none; border-bottom: 1px solid var(--line); }
  .menu-type:last-child { border-bottom: none; }

  .event-types { grid-template-columns: repeat(2, 1fr); }
  .event-card { padding: 2.5rem 1.5rem 2rem; }
  .events-hero img,
  .events-hero picture,
  .events-hero-placeholder { aspect-ratio: 16 / 10; }

  .timeline-item { grid-template-columns: 1fr; gap: 1rem; }

  .reference { grid-template-columns: 1fr; gap: 1rem; padding: 2rem; }

  .contact-grid { grid-template-columns: 1fr; }
  .contact-info, .contact-form { padding: 4rem 2rem; }
  .form-row { grid-template-columns: 1fr; gap: 0; }

  .page-hero { padding: 8rem 1.5rem 4rem; }
}

/* ==============================================================
   COMPACTAGE PAGE "CHEF À DOMICILE" — scopé via modificateurs --compact
   et classes spécifiques (intro-quote--split, menu-type) pour ne pas
   affecter les autres pages.
   ============================================================== */

.page-hero.page-hero--compact {
  padding: 3.5rem 3rem 1.8rem;
}
.page-hero.page-hero--compact h1 {
  font-size: clamp(2rem, 4.5vw, 3.4rem);
  margin-bottom: 0.7rem;
  margin-top: 0.3rem;
}
.page-hero.page-hero--compact .page-hero-tagline {
  margin-top: 0.4rem;
  font-size: 1rem;
  line-height: 1.4;
}

/* Bandeau photo panoramique compact : ratio plus fin (3/1 au lieu de 21/9 ≈ 2.33/1) */
.page-photo-banner.page-photo-banner--compact img,
.page-photo-banner.page-photo-banner--compact picture {
  aspect-ratio: 3 / 1;
}

/* Intro split (chef à dom uniquement) — compactage padding/gap/photo */
.intro-quote.intro-quote--split {
  padding: 2.5rem 3rem 3rem;
  gap: 3rem;
}
.intro-quote--split .fleuron { margin: 0 0 1rem; }
.intro-quote--split .intro-text { margin: 0 0 0.8rem; }
.intro-quote--split .intro-quote-image picture,
.intro-quote--split .intro-quote-image img {
  aspect-ratio: 4 / 3;  /* paysage au lieu de 3/4 portrait → -40% de hauteur */
  object-position: center 72%;  /* recadre vers le bas : main + assiette */
}

/* Universe header juste avant les formules : padding-bottom réduit */
.universe-header.universe-header--flush .section-title {
  padding-bottom: 1.6rem;
}

/* Cards des 3 formules : padding interne réduit */
.menu-type {
  padding: 2rem 2.5rem 2.5rem;
}
.menu-type h3 { margin-top: 0.4rem; }

/* Témoignage compact (chef à dom uniquement) */
.testimonials.testimonials--compact {
  padding: 2.8rem 3rem;
}
.testimonials.testimonials--compact .testimonial-mark {
  font-size: 4rem;
  margin-bottom: 1.2rem;
}

@media (max-width: 968px) {
  .page-hero.page-hero--compact { padding: 6.5rem 1.5rem 2rem; }
  .intro-quote.intro-quote--split { padding: 2rem 1.5rem 2.5rem; gap: 2rem; }
}

/* ==============================================================
   FIX MOBILE — overflow horizontal sur petits écrans
   ============================================================== */
@media (max-width: 540px) {

  /* Empêcher tout débordement horizontal global */
  html, body { overflow-x: hidden; max-width: 100%; }

  /* Hero : passer en colonne pour empiler contenu + distinctions */
  .hero {
    flex-direction: column;
    justify-content: flex-end;
    padding: 0;
  }
  .hero .hero-content {
    width: 100%;
    flex: none;
    padding: 5.5rem 1.5rem 1rem;
  }
  .hero-distinctions {
    width: 100%;
    padding: 0 1rem 1.5rem;
    background: linear-gradient(to top, rgba(26, 29, 26, 0.5), transparent);
  }

  /* Nav : compacter pour ne plus couper le panier ni la langue */
  .site-nav { padding: 1rem 1rem; gap: 0.5rem; }
  .nav-left .nav-link,
  .nav-right .nav-link { display: none; } /* Menu burger prend le relais */
  .nav-right { gap: 0.6rem; }
  .lang { font-size: 0.62rem; letter-spacing: 0.15em; }

  /* Breadcrumb : wrap au lieu de couper */
  .breadcrumb {
    white-space: normal;
    word-break: normal;
    overflow-wrap: anywhere;
    line-height: 1.7;
    font-size: 0.55rem;
    letter-spacing: 0.12em;
    margin-bottom: 1.5rem;
    text-align: left;
    max-width: 100%;
  }
  .breadcrumb .sep { margin: 0 0.3rem; }
  .breadcrumb a { display: inline; }
  /* Page hero inner : padding latéral + max-width pour contenir */
  .page-hero-inner { padding: 0 1rem; max-width: 100%; }
  .page-hero-inner h1 { word-break: keep-all; overflow-wrap: break-word; }
  .page-hero-tagline { padding: 0 0.5rem; }

  /* Intro quote (chef-à-dom, événements) : padding sécurité */
  .intro-quote, .intro-quote.intro-quote--split { padding-left: 1rem; padding-right: 1rem; }
  .intro-text { padding: 0 0.5rem; }

  /* Hero distinctions : déjà passées en column à 968px,
     mais on rétrécit + réduit le gap pour mobile étroit */
  .hero-distinctions {
    gap: 0.9rem !important;
    margin-top: 2rem !important;
    padding: 0 1.5rem;
    width: 100%;
    box-sizing: border-box;
  }
  .distinction { font-size: 0.6rem; }
  .distinction strong { font-size: 1.15rem; }

  /* Hero content : padding-bottom réduit (les distinctions sont en static
     en mobile donc plus besoin de réserver autant) */
  .hero.hero--photo .hero-content,
  .hero .hero-content {
    padding: 4rem 1.5rem 2rem;
    min-height: auto;
  }

  /* H1 / titres : forcer une taille max raisonnable sur mobile */
  .hero h1 { font-size: 2.6rem; line-height: 1.05; word-break: keep-all; }
  .page-hero h1 { font-size: 2.2rem; line-height: 1.1; word-break: keep-all; }
  .lto-shop-title { font-size: 2rem; line-height: 1.1; }

  /* H2 partout : limiter aussi */
  h2 { font-size: clamp(1.6rem, 7vw, 2.2rem) !important; word-break: keep-all; }
  .section-title, .reserve h2, .chef-content h2, .partners-header h2 {
    font-size: 1.9rem !important;
    line-height: 1.1 !important;
  }

  /* H3 (titres cards/sections internes) */
  h3 { font-size: clamp(1.3rem, 5.5vw, 1.7rem); }

  /* Tagline / paragraphes : padding latéral pour respiration */
  .hero-tagline, .page-hero-tagline {
    padding: 0 0.5rem;
    font-size: 0.95rem;
    line-height: 1.5;
  }

  /* Eviter overflow des paragraphes longs (text-align: center + max-width) */
  p, .intro-text { max-width: 100%; overflow-wrap: break-word; }

  /* Page-hero (toutes pages internes) : padding inner reduit */
  .page-hero { padding: 7rem 1rem 2rem; }

  /* Sections : padding latéral léger pour éviter le bord à bord */
  section { padding-left: 1rem; padding-right: 1rem; }

  /* Images / picture : forcent leur conteneur (anti-overflow) */
  picture, picture img { max-width: 100%; height: auto; }

  /* Conteneurs grille avec largeur min : passer à 100% sur mobile */
  .lto-cat-grid { padding: 0 1rem; }
  .lto-cat-card { max-width: 100%; }

  /* Cards produits WC : pleine largeur */
  ul.products li.product,
  ul.products li.product-category { width: 100% !important; margin: 0 0 2rem !important; }

  /* Témoignages, partners, reserve : padding léger */
  .testimonials, .partners, .reserve { padding: 2.5rem 1rem; }

  /* Process step : empêche les images de pousser */
  .process-steps, .menu-types { padding: 0 0.5rem; }
}

/* Sélecteur de langue (Polylang) */
.lang a { color: var(--ink-light); transition: color 0.2s; }
.lang a:hover { color: var(--sage); }
.lang a.active { color: var(--ink); font-weight: 500; }

/* ==============================================================
   BARRE D'ACTIONS STICKY MOBILE — Appeler + Demander un devis
   Visible uniquement sur mobile. +30 % d'appels attendu.
   ============================================================== */
.lto-mobile-cta {
  display: none;
}

@media (max-width: 768px) {
  .lto-mobile-cta {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    z-index: 95;
    background: var(--ink);
    padding-bottom: env(safe-area-inset-bottom, 0);
    box-shadow: 0 -8px 24px -8px rgba(0, 0, 0, 0.25);
  }

  .lto-mobile-cta-btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.9rem 0.8rem;
    color: var(--ivory);
    font-family: 'Inter', sans-serif;
    font-size: 0.7rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 500;
    transition: background 0.2s ease;
    min-height: 48px; /* touch target */
  }

  .lto-mobile-cta-btn svg {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
  }

  .lto-mobile-cta-btn--call {
    background: var(--ink);
  }
  .lto-mobile-cta-btn--call:active { background: #2a2d2a; }

  .lto-mobile-cta-btn--quote {
    background: var(--sage);
    color: var(--ivory);
  }
  .lto-mobile-cta-btn--quote:active { background: var(--moss); }

  /* Réserver l'espace pour ne pas que la barre cache le contenu */
  body { padding-bottom: 56px; }
  body.admin-bar { padding-bottom: 56px; }

  /* Le mini-panier nav reste accessible, on baisse juste son z-index si conflit */
  .site-nav { z-index: 100; }
}

/* Si la barre nav a un focus / pointer, légère transition */
.lto-mobile-cta-btn:focus { outline: 2px solid var(--ivory); outline-offset: -4px; }

/* Footer : liens légaux + copyright sur 2 lignes */
.footer-legal-links {
  margin-bottom: 0.6rem;
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.footer-legal-links a {
  color: var(--ink-light);
  transition: color 0.2s ease;
}
.footer-legal-links a:hover { color: var(--sage); }
.footer-legal-links .sep {
  margin: 0 0.6rem;
  color: var(--sage);
  opacity: 0.6;
}

@media (max-width: 540px) {
  .footer-legal-links {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
  }
  .footer-legal-links .sep { display: none; }
}

/* ==============================================================
   NEWSLETTER — bloc capture email avant le footer principal
   Style éditorial cohérent avec la marque (sage/ivoire/encre).
   ============================================================== */
.lto-newsletter {
  background: var(--paper);
  padding: 4rem 2rem 4.5rem;
  text-align: center;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.lto-newsletter-inner {
  max-width: 620px;
  margin: 0 auto;
}

.lto-newsletter .eyebrow {
  justify-content: center;
  margin-bottom: 1.5rem;
}

.lto-newsletter-h3 {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(1.8rem, 3.5vw, 2.4rem);
  line-height: 1.15;
  font-weight: 300;
  margin: 0 auto 1rem;
  color: var(--ink);
}

.lto-newsletter-h3 em { font-style: italic; color: var(--sage); }

.lto-newsletter-desc {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 1.05rem;
  color: var(--ink-light);
  max-width: 480px;
  margin: 0 auto 2rem;
  line-height: 1.5;
}

.lto-newsletter-form {
  display: flex;
  gap: 0.75rem;
  max-width: 480px;
  margin: 0 auto;
  position: relative;
}

.lto-newsletter-form input[type="email"] {
  flex: 1;
  background: var(--ivory);
  border: 1px solid var(--line);
  color: var(--ink);
  font-family: 'Inter', sans-serif;
  font-size: 0.92rem;
  padding: 0.95rem 1.2rem;
  transition: border-color 0.3s;
}

.lto-newsletter-form input[type="email"]:focus {
  outline: none;
  border-color: var(--sage);
}

.lto-newsletter-form button {
  background: var(--ink);
  color: var(--ivory);
  font-family: 'Inter', sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-weight: 500;
  padding: 0 1.8rem;
  border: none;
  cursor: pointer;
  transition: background 0.3s;
}

.lto-newsletter-form button:hover { background: var(--sage); }

.lto-newsletter-msg {
  padding: 1.2rem 1.5rem;
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 1.05rem;
  max-width: 480px;
  margin: 0 auto;
}

.lto-newsletter-msg--ok {
  background: rgba(122, 138, 110, 0.1);
  color: var(--moss);
  border-left: 3px solid var(--sage);
}

.lto-newsletter-msg--err {
  background: rgba(176, 122, 0, 0.08);
  color: #8a5a00;
  border-left: 3px solid #b07a00;
}

@media (max-width: 540px) {
  .lto-newsletter { padding: 2.5rem 1rem 3rem; }
  .lto-newsletter-form { flex-direction: column; gap: 0.6rem; }
  .lto-newsletter-form button { padding: 0.9rem 1.5rem; }
}