/* ══════════════════════════════════════════════════════════════
   LA VIENNOISE — style.css
   Paris, 1928. L'élégance du temps.
   Créa'Zitto — Agence Web Suisse Romande
   ══════════════════════════════════════════════════════════════ */

/* ── CUSTOM PROPERTIES ── */
:root {
  --bg:  #faf6f0;
  --bg2: #f2ece3;
  --bg3: #e8ddd0;
  --c1:  #1a1510;
  --c2:  #8b2635;
  --c3:  #c9a84c;
  --c3l: #e0c57a;
  --c1m: rgba(26,21,16,.55);
  --c2m: rgba(139,38,53,.12);
  --white: #fff;
  --f-display: 'Playfair Display', Georgia, serif;
  --f-body:    'Raleway', sans-serif;
  --nav-h: 76px;
  --ease-out: cubic-bezier(.22,.61,.36,1);
  --ease-in:  cubic-bezier(.55,0,1,.45);
}

/* ── RESET ── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
body { background:var(--bg); color:var(--c1); font-family:var(--f-body); font-weight:300; overflow-x:hidden; line-height:1.7; }
img, video { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
ul { list-style:none; }
address { font-style:normal; }
button { background:none; border:none; cursor:pointer; font:inherit; }

/* ── ACCESSIBILITÉ ── */
:focus-visible { outline:2px solid var(--c3); outline-offset:3px; border-radius:2px; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* ── TEXTURE GRAIN ── */
@keyframes grain { 0%,100% { transform:translate(0,0) } 10% { transform:translate(-2%,-3%) } 20% { transform:translate(-5%,2%) } 30% { transform:translate(3%,-4%) } 40% { transform:translate(-3%,4%) } 50% { transform:translate(-4%,3%) } 60% { transform:translate(4%,0%) } 70% { transform:translate(0,4%) } 80% { transform:translate(-4%,0) } 90% { transform:translate(4%,2%) } }
.hero-grain, .ambiance-grain, .intro-grain, .mobile-grain, .footer-grain {
  position:absolute; inset:-80px;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  background-repeat:repeat;
  background-size:200px 200px;
  animation:grain 8s steps(10) infinite;
  pointer-events:none;
  opacity:.035;
  z-index:2;
}

/* ══════════════════════════════════════════════════════════════
   CURSEUR PERSONNALISÉ (desktop)
   ══════════════════════════════════════════════════════════════ */
@media (pointer:fine) {
  body { cursor:none; }
  .cur {
    position:fixed; width:8px; height:8px;
    background:var(--c2); border-radius:50%;
    pointer-events:none; z-index:9999;
    transform:translate(-50%,-50%);
    transition:width .2s var(--ease-out), height .2s var(--ease-out), background .2s, opacity .3s;
    mix-blend-mode:multiply;
  }
  .cur-r {
    position:fixed; width:36px; height:36px;
    border:1px solid rgba(139,38,53,.4);
    border-radius:50%; pointer-events:none; z-index:9998;
    transform:translate(-50%,-50%);
    transition:width .35s var(--ease-out), height .35s var(--ease-out), border-color .2s;
  }
  .cur.h { width:5px; height:5px; background:var(--c3); }
  .cur-r.h { width:54px; height:54px; border-color:rgba(201,168,76,.5); }
}

/* ══════════════════════════════════════════════════════════════
   INTRO CINÉMATIQUE
   ══════════════════════════════════════════════════════════════ */
#intro {
  position:fixed; inset:0; z-index:8000;
  background:var(--c1);
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  overflow:hidden;
}
#intro-vid {
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover;
  opacity:0; transition:opacity .1s linear;
}
.intro-vignette {
  position:absolute; inset:0;
  background:radial-gradient(ellipse 60% 70% at 50% 50%, transparent 20%, rgba(26,21,16,.8) 100%);
  z-index:1; pointer-events:none;
}
.intro-text {
  position:relative; z-index:3;
  text-align:center;
  opacity:0; transform:translateY(20px);
  transition:opacity .8s var(--ease-out), transform .8s var(--ease-out);
}
.intro-text.visible { opacity:1; transform:translateY(0); }
.intro-ligne {
  width:1px; height:0; background:var(--c3);
  margin:0 auto 1.5rem;
  transition:height .8s var(--ease-out) .3s;
}
.intro-text.visible .intro-ligne { height:60px; }
.intro-sub {
  font-family:var(--f-body); font-weight:500; font-size:.8rem;
  letter-spacing:.35em; text-transform:uppercase; color:var(--c3l);
  opacity:0; transform:translateY(8px);
  transition:opacity .7s .5s, transform .7s .5s;
  margin-bottom:1.2rem;
  text-shadow:0 0 20px rgba(201,168,76,.4);
}
.intro-text.visible .intro-sub { opacity:1; transform:translateY(0); }
.intro-title {
  font-family:var(--f-display); font-style:italic; font-weight:400;
  font-size:clamp(2.8rem, 8vw, 6rem);
  color:var(--bg); letter-spacing:-.01em;
  line-height:1.05;
  opacity:0; transform:translateY(12px);
  transition:opacity .9s .7s, transform .9s .7s;
  margin-bottom:.7rem;
}
.intro-text.visible .intro-title { opacity:1; transform:translateY(0); }
.intro-date {
  font-family:var(--f-body); font-weight:400;
  font-size:clamp(.9rem, 2vw, 1.1rem);
  letter-spacing:.5em; color:var(--c3l);
  opacity:0; transform:translateY(8px);
  transition:opacity .8s 1.1s, transform .8s 1.1s;
  margin-bottom:1.5rem;
  text-shadow:0 0 20px rgba(201,168,76,.4);
}
.intro-text.visible .intro-date { opacity:1; transform:translateY(0); }
.intro-ligne:last-child { transition:height .8s var(--ease-out) 1.3s; }
.intro-text.visible .intro-ligne:last-child { height:60px; }
#intro.fade-out { opacity:0; transition:opacity .9s var(--ease-in); pointer-events:none; }
.intro-skip {
  position:absolute; bottom:2rem; right:2rem; z-index:5;
  color:rgba(255,255,255,.4); font-size:.72rem; letter-spacing:.2em;
  text-transform:uppercase; padding:.5rem 1rem;
  border:1px solid rgba(255,255,255,.15);
  transition:color .3s, border-color .3s;
}
.intro-skip:hover { color:var(--c3); border-color:rgba(201,168,76,.4); }

/* ══════════════════════════════════════════════════════════════
   NAVIGATION
   ══════════════════════════════════════════════════════════════ */
#nav {
  position:fixed; top:0; left:0; right:0; z-index:100;
  height:var(--nav-h);
  transition:background .4s, backdrop-filter .4s, box-shadow .4s;
}
#nav.scrolled {
  background:rgba(250,246,240,.88);
  backdrop-filter:blur(16px) saturate(1.4);
  -webkit-backdrop-filter:blur(16px) saturate(1.4);
  box-shadow:0 1px 0 rgba(26,21,16,.06);
}
.nav-inner {
  max-width:1280px; margin:0 auto; padding:0 2rem;
  height:100%; display:flex; align-items:center; gap:2rem;
}
.nav-logo { padding:.4rem 0; cursor:pointer; }
.nav-logo-img {
  display:block; height:48px; width:auto;
  object-fit:contain;
  transition:opacity .3s;
}
.nav-logo-img--dark { display:none; }
#nav.scrolled .nav-logo-img--blanc { display:none; }
#nav.scrolled .nav-logo-img--dark  { display:block; }
.nav-links {
  display:flex; gap:2.5rem; margin-left:auto;
}
.nav-link {
  font-size:.78rem; letter-spacing:.12em; text-transform:uppercase;
  color:rgba(255,255,255,.82); font-weight:400;
  position:relative; padding:.3rem 0;
  transition:color .3s;
}
.nav-link::after {
  content:''; position:absolute; bottom:0; left:0; right:100%;
  height:1px; background:var(--c3);
  transition:right .35s var(--ease-out);
}
.nav-link:hover { color:var(--c3); }
.nav-link:hover::after { right:0; }
#nav.scrolled .nav-link { color:var(--c1m); }
#nav.scrolled .nav-link:hover { color:var(--c2); }
.nav-cta {
  margin-left:auto; padding:.55rem 1.4rem;
  border:1px solid rgba(255,255,255,.4); color:var(--white);
  font-size:.75rem; letter-spacing:.15em; text-transform:uppercase;
  transition:background .3s, color .3s, border-color .3s;
}
.nav-cta:hover { background:var(--c3); border-color:var(--c3); color:var(--c1); }
#nav.scrolled .nav-cta { border-color:rgba(26,21,16,.25); color:var(--c1); }
#nav.scrolled .nav-cta:hover { background:var(--c2); border-color:var(--c2); color:var(--white); }
.burger {
  display:none; flex-direction:column; gap:6px;
  padding:.4rem; width:36px;
}
.burger span {
  display:block; height:1px; background:var(--white);
  transition:background .3s, transform .35s, width .35s, opacity .3s;
  transform-origin:center;
}
.burger span:first-child { width:24px; }
.burger span:last-child  { width:16px; }
.burger.open span:first-child { width:24px; transform:translateY(3.5px) rotate(45deg); }
.burger.open span:last-child  { width:24px; transform:translateY(-3.5px) rotate(-45deg); }
#nav.scrolled .burger span { background:var(--c1); }

@media (max-width:900px) {
  .nav-links, .nav-cta { display:none; }
  .burger { display:flex; margin-left:auto; }
}

/* ══════════════════════════════════════════════════════════════
   MENU MOBILE PLEIN ÉCRAN
   ══════════════════════════════════════════════════════════════ */
.mobile-menu {
  position:fixed; inset:0; z-index:200;
  background:var(--c1);
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  opacity:0; pointer-events:none;
  transform:translateY(-8px);
  transition:opacity .4s var(--ease-out), transform .4s var(--ease-out);
  overflow:hidden;
}
.mobile-menu.open { opacity:1; pointer-events:all; transform:translateY(0); }
.mobile-close {
  position:absolute; top:1.6rem; right:1.8rem;
  color:rgba(255,255,255,.5); font-size:1.8rem; line-height:1;
  transition:color .3s;
}
.mobile-close:hover { color:var(--c3); }
.mobile-links { text-align:center; }
.mobile-links li { overflow:hidden; }
.mobile-link {
  display:block; padding:.6rem 2rem;
  font-family:var(--f-display); font-style:italic;
  font-size:clamp(1.8rem, 5vw, 2.8rem); font-weight:400;
  color:rgba(255,255,255,.75);
  letter-spacing:-.01em;
  transition:color .3s;
  transform:translateY(100%);
  opacity:0;
  transition:color .3s, transform .5s var(--ease-out), opacity .5s var(--ease-out);
}
.mobile-menu.open .mobile-link {
  transform:translateY(0); opacity:1;
}
.mobile-menu.open .mobile-links li:nth-child(1) .mobile-link { transition-delay:.05s; }
.mobile-menu.open .mobile-links li:nth-child(2) .mobile-link { transition-delay:.1s; }
.mobile-menu.open .mobile-links li:nth-child(3) .mobile-link { transition-delay:.15s; }
.mobile-menu.open .mobile-links li:nth-child(4) .mobile-link { transition-delay:.2s; }
.mobile-menu.open .mobile-links li:nth-child(5) .mobile-link { transition-delay:.25s; }
.mobile-link:hover { color:var(--c3); }
.mobile-tagline {
  position:absolute; bottom:2.5rem;
  font-size:.7rem; letter-spacing:.3em; text-transform:uppercase;
  color:rgba(255,255,255,.25);
}

/* ══════════════════════════════════════════════════════════════
   HERO
   ══════════════════════════════════════════════════════════════ */
#hero {
  position:relative; height:100vh; min-height:600px;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
}
.hero-media {
  position:absolute; inset:0; z-index:0;
}
.hero-vid {
  width:100%; height:100%; object-fit:cover;
}
.hero-fallback {
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover;
  z-index:-1;
}
.hero-vignette {
  position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(to bottom, rgba(26,21,16,.45) 0%, transparent 40%, transparent 55%, rgba(26,21,16,.65) 100%),
    linear-gradient(to right, rgba(26,21,16,.3) 0%, transparent 60%);
}
.hero-content {
  position:relative; z-index:3;
  max-width:820px; padding:0 2rem;
  text-align:center; color:var(--white);
}
.hero-pre {
  font-size:.78rem; letter-spacing:.4em; text-transform:uppercase;
  color:var(--white); font-weight:500; margin-bottom:1.5rem;
  text-shadow:0 1px 8px rgba(26,21,16,.6);
  opacity:0; transform:translateY(16px);
  transition:opacity .8s var(--ease-out), transform .8s var(--ease-out);
}
.hero-titre {
  font-family:var(--f-display); font-weight:400;
  font-size:clamp(2.6rem, 6.5vw, 5.2rem);
  line-height:1.08; letter-spacing:-.02em;
  color:var(--white); margin-bottom:1.5rem;
  opacity:0; transform:translateY(20px);
  transition:opacity .9s .12s var(--ease-out), transform .9s .12s var(--ease-out);
}
.hero-titre em { font-style:italic; color:var(--c3l); }
.hero-sous {
  font-size:1.1rem; font-weight:400; color:rgba(255,255,255,.95);
  max-width:480px; margin:0 auto 2.5rem;
  text-shadow:0 1px 12px rgba(26,21,16,.7);
  opacity:0; transform:translateY(16px);
  transition:opacity .8s .24s var(--ease-out), transform .8s .24s var(--ease-out);
}
.hero-cta {
  display:inline-block;
  padding:.9rem 2.4rem;
  border:1px solid rgba(201,168,76,.6);
  color:var(--c3l); font-size:.75rem; letter-spacing:.2em; text-transform:uppercase;
  font-weight:400;
  transition:background .35s, color .35s, border-color .35s;
  opacity:0; transform:translateY(14px);
  transition:opacity .8s .36s var(--ease-out), transform .8s .36s var(--ease-out), background .35s, color .35s, border-color .35s;
}
.hero-cta:hover { background:var(--c3); border-color:var(--c3); color:var(--c1); }
.reveal.in .hero-pre,
.reveal.in .hero-titre,
.reveal.in .hero-sous,
.reveal.in .hero-cta,
#hero .reveal.in { opacity:1; transform:translateY(0); }

/* hero scroll indicator */
.hero-scroll {
  position:absolute; bottom:2.5rem; left:50%;
  transform:translateX(-50%);
  z-index:3; display:flex; flex-direction:column; align-items:center; gap:.8rem;
}
.hero-scroll-line {
  display:block; width:1px; height:48px; background:rgba(255,255,255,.3);
  position:relative; overflow:hidden;
}
.hero-scroll-line::after {
  content:''; position:absolute; top:-100%; left:0; right:0; height:100%;
  background:var(--c3);
  animation:scroll-line 2s ease-in-out infinite;
}
@keyframes scroll-line { 0% { top:-100% } 100% { top:200% } }
.hero-scroll-text {
  font-size:.65rem; letter-spacing:.3em; text-transform:uppercase;
  color:rgba(255,255,255,.4); writing-mode:vertical-rl;
}

/* ══════════════════════════════════════════════════════════════
   BANDEAU DE CONFIANCE
   ══════════════════════════════════════════════════════════════ */
.trust-band {
  background:var(--c1); overflow:hidden; padding:.95rem 0;
}
.trust-inner {
  display:flex; align-items:center; gap:2.5rem;
  white-space:nowrap;
  animation:trust-scroll 28s linear infinite;
  width:max-content;
}
@keyframes trust-scroll { 0% { transform:translateX(0) } 100% { transform:translateX(-50%) } }
.trust-item {
  font-size:.7rem; letter-spacing:.3em; text-transform:uppercase;
  color:rgba(250,246,240,.55); font-weight:400;
}
.trust-sep { color:var(--c3); opacity:.6; }

/* ══════════════════════════════════════════════════════════════
   TYPOGRAPHIE SECTIONS
   ══════════════════════════════════════════════════════════════ */
.section-label {
  font-size:.68rem; letter-spacing:.35em; text-transform:uppercase;
  color:var(--c2); font-weight:500; margin-bottom:1rem;
  display:block;
}
.section-titre {
  font-family:var(--f-display); font-weight:400;
  font-size:clamp(1.9rem, 4vw, 3rem);
  line-height:1.12; letter-spacing:-.02em;
  color:var(--c1); margin-bottom:1.2rem;
}
.section-titre em { font-style:italic; color:var(--c2); }
.section-sous {
  font-size:1rem; color:rgba(26,21,16,.6); max-width:500px;
}

/* ══════════════════════════════════════════════════════════════
   SECTION STORYTELLING — HISTOIRE
   ══════════════════════════════════════════════════════════════ */
.section-histoire {
  padding:clamp(5rem,10vw,9rem) 2rem;
  max-width:1280px; margin:0 auto;
}
.histoire-wrapper {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(3rem,6vw,7rem);
  align-items:center;
  margin-bottom:clamp(3rem,5vw,5rem);
}
.histoire-image {
  position:relative;
  opacity:0; transform:translateX(-30px);
  transition:opacity .9s var(--ease-out), transform .9s var(--ease-out);
}
.histoire-image.in { opacity:1; transform:translateX(0); }
.histoire-image img {
  width:100%; aspect-ratio:3/4; object-fit:cover;
  display:block;
  filter:sepia(.08) contrast(1.02);
}
.histoire-image-cadre {
  position:absolute; inset:-16px 16px 16px -16px;
  border:1px solid var(--c3); z-index:-1;
  opacity:.4;
}
.histoire-annee {
  position:absolute; bottom:-1.5rem; right:-1rem;
  font-family:var(--f-display); font-style:italic;
  font-size:5rem; font-weight:700; color:var(--c2);
  opacity:.07; line-height:1; pointer-events:none;
  user-select:none;
}
.histoire-texte {
  opacity:0; transform:translateX(30px);
  transition:opacity .9s .15s var(--ease-out), transform .9s .15s var(--ease-out);
}
.histoire-texte.in { opacity:1; transform:translateX(0); }
.histoire-corps { display:flex; flex-direction:column; gap:1.2rem; margin-bottom:2rem; }
.histoire-corps p { font-size:1.02rem; color:rgba(26,21,16,.75); }
.histoire-corps strong { font-weight:500; color:var(--c1); }
.histoire-citation {
  border-left:2px solid var(--c3);
  padding:1.2rem 1.6rem;
  background:var(--bg2);
  margin-top:1rem;
}
.histoire-citation p {
  font-family:var(--f-display); font-style:italic;
  font-size:1.15rem; color:var(--c2); margin-bottom:.5rem; line-height:1.5;
}
.histoire-citation cite {
  font-size:.78rem; letter-spacing:.1em;
  color:rgba(26,21,16,.5); font-style:normal;
}
.histoire-bas {
  max-width:680px; font-size:1rem;
  color:rgba(26,21,16,.6); padding-top:2rem;
  border-top:1px solid rgba(26,21,16,.08);
  opacity:0; transform:translateY(20px);
  transition:opacity .8s var(--ease-out), transform .8s var(--ease-out);
}
.histoire-bas.in { opacity:1; transform:translateY(0); }

@media (max-width:800px) {
  .histoire-wrapper { grid-template-columns:1fr; gap:3rem; }
  .histoire-image { max-width:480px; }
}

/* ══════════════════════════════════════════════════════════════
   SECTION SAVOIR-FAIRE
   ══════════════════════════════════════════════════════════════ */
.section-savoirfaire {
  background:var(--c1);
  padding:clamp(5rem,10vw,9rem) 2rem;
}
.sf-header {
  max-width:1280px; margin:0 auto 4rem;
  text-align:center;
  opacity:0; transform:translateY(24px);
  transition:opacity .8s var(--ease-out), transform .8s var(--ease-out);
}
.sf-header.in { opacity:1; transform:translateY(0); }
.sf-header .section-label { color:var(--c3); }
.sf-header .section-titre { color:var(--bg); }
.sf-header .section-sous { color:rgba(250,246,240,.5); margin:0 auto; }
.sf-grille {
  max-width:1280px; margin:0 auto;
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:rgba(201,168,76,.12);
}
.sf-carte {
  background:var(--c1); padding:3rem 2.5rem;
  position:relative; overflow:hidden;
  opacity:0; transform:translateY(30px);
  transition:opacity .8s var(--ease-out) var(--d,0s), transform .8s var(--ease-out) var(--d,0s);
}
.sf-carte.in { opacity:1; transform:translateY(0); }
.sf-carte::before {
  content:''; position:absolute; top:0; left:0; right:100%;
  height:1px; background:var(--c3);
  transition:right .5s var(--ease-out);
}
.sf-carte:hover::before { right:0; }
.sf-carte-num {
  font-family:var(--f-display); font-style:italic;
  font-size:4rem; font-weight:700; color:var(--c2);
  opacity:.15; line-height:1; margin-bottom:1.5rem;
  user-select:none;
}
.sf-carte-titre {
  font-family:var(--f-display); font-weight:400;
  font-size:1.6rem; color:var(--bg);
  margin-bottom:1rem; letter-spacing:-.01em;
}
.sf-carte-texte { font-size:.95rem; color:rgba(250,246,240,.55); line-height:1.7; margin-bottom:1.5rem; }
.sf-carte-detail {
  display:block; font-size:.68rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--c3); font-weight:500; opacity:.7;
}

@media (max-width:820px) {
  .sf-grille { grid-template-columns:1fr; }
}

/* ══════════════════════════════════════════════════════════════
   BANDEAU AMBIANCE
   ══════════════════════════════════════════════════════════════ */
.ambiance {
  position:relative; height:clamp(380px, 55vw, 650px);
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
}
.ambiance-vid {
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover;
}
.ambiance-overlay {
  position:absolute; inset:0;
  background:rgba(26,21,16,.68);
  z-index:1;
}
.ambiance-content {
  position:relative; z-index:3; text-align:center;
  padding:0 2rem;
  opacity:0; transform:translateY(20px);
  transition:opacity .9s var(--ease-out), transform .9s var(--ease-out);
}
.ambiance-content.in { opacity:1; transform:translateY(0); }
.ambiance-ligne {
  width:1px; height:50px; background:rgba(201,168,76,.5);
  margin:0 auto 2rem;
}
.ambiance-citation {
  font-family:var(--f-display); font-style:italic; font-weight:400;
  font-size:clamp(1.5rem, 3.5vw, 2.5rem);
  color:var(--white); line-height:1.3; letter-spacing:-.01em;
  max-width:680px; margin:0 auto 1.2rem;
}
.ambiance-auteur {
  font-size:.78rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--c3); display:block; margin-top:1.2rem;
}

/* ══════════════════════════════════════════════════════════════
   GALERIE ASYMÉTRIQUE
   ══════════════════════════════════════════════════════════════ */
.section-galerie {
  padding:clamp(5rem,10vw,9rem) 2rem;
  max-width:1280px; margin:0 auto;
}
.galerie-header {
  margin-bottom:3rem;
  opacity:0; transform:translateY(20px);
  transition:opacity .8s var(--ease-out), transform .8s var(--ease-out);
}
.galerie-header.in { opacity:1; transform:translateY(0); }
.galerie-grille {
  display:grid;
  grid-template-columns:1.45fr 1fr;
  grid-template-rows:auto;
  gap:1.2rem;
  align-items:start;
}
.gal-item { position:relative; overflow:hidden; }
.gal-item img {
  width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .8s var(--ease-out), filter .6s;
  filter:sepia(.06);
}
.gal-item:hover img { transform:scale(1.04); filter:sepia(.02); }
.gal-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(26,21,16,.7) 0%, transparent 50%);
  opacity:0; transition:opacity .4s;
  display:flex; align-items:flex-end; padding:1.5rem;
}
.gal-item:hover .gal-overlay { opacity:1; }
.gal-overlay span {
  font-size:.7rem; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(250,246,240,.8);
}
.gal-item--grand {
  opacity:0; transform:translateX(-25px);
  transition:opacity .9s var(--ease-out), transform .9s var(--ease-out);
}
.gal-item--grand.in { opacity:1; transform:translateX(0); }
.gal-item--grand img { height:100%; min-height:480px; }
.gal-col-droite { display:flex; flex-direction:column; gap:1.2rem; }
.gal-item--haut {
  opacity:0; transform:translateX(25px);
  transition:opacity .9s .1s var(--ease-out), transform .9s .1s var(--ease-out);
}
.gal-item--haut.in { opacity:1; transform:translateX(0); }
.gal-item--bas {
  opacity:0; transform:translateX(25px);
  transition:opacity .9s var(--d,.2s) var(--ease-out), transform .9s var(--d,.2s) var(--ease-out);
}
.gal-item--bas.in { opacity:1; transform:translateX(0); }
.gal-item--haut img,
.gal-item--bas img { aspect-ratio:4/3; }

@media (max-width:700px) {
  .galerie-grille { grid-template-columns:1fr; }
  .gal-item--grand img { min-height:300px; }
}

/* ══════════════════════════════════════════════════════════════
   TÉMOIGNAGES CAROUSEL
   ══════════════════════════════════════════════════════════════ */
.section-temoignages {
  background:var(--bg2); padding:clamp(5rem,10vw,9rem) 0;
}
.temoignages-header {
  text-align:center; padding:0 2rem; margin-bottom:4rem;
  opacity:0; transform:translateY(20px);
  transition:opacity .8s var(--ease-out), transform .8s var(--ease-out);
}
.temoignages-header.in { opacity:1; transform:translateY(0); }
.temoignages-carousel { overflow:hidden; position:relative; }
.carousel-track {
  display:flex; gap:2rem; padding:0 calc(50vw - 300px);
  transition:transform .6s var(--ease-out);
}
.temoignage-card {
  background:var(--white); padding:2.5rem;
  min-width:560px; max-width:560px; flex-shrink:0;
  border-top:2px solid var(--c3);
  position:relative;
}
.temoignage-etoiles { color:var(--c3); font-size:.85rem; letter-spacing:.1rem; margin-bottom:1.2rem; }
.temoignage-texte {
  font-family:var(--f-display); font-style:italic;
  font-size:1.1rem; color:var(--c1);
  line-height:1.65; margin-bottom:1.5rem;
}
.temoignage-auteur {
  font-size:.73rem; letter-spacing:.15em; text-transform:uppercase;
  color:rgba(26,21,16,.4); font-weight:500;
}
.carousel-controls {
  display:flex; align-items:center; justify-content:center;
  gap:1.5rem; margin-top:3rem; padding:0 2rem;
}
.carousel-btn {
  width:44px; height:44px; border:1px solid rgba(26,21,16,.15);
  display:flex; align-items:center; justify-content:center;
  font-size:.9rem; color:var(--c1);
  transition:background .3s, color .3s, border-color .3s;
}
.carousel-btn:hover { background:var(--c2); color:var(--white); border-color:var(--c2); }
.carousel-dots { display:flex; gap:.6rem; align-items:center; }
.carousel-dot {
  width:6px; height:6px; border-radius:50%;
  background:rgba(26,21,16,.18);
  transition:background .3s, transform .3s;
  border:none; cursor:pointer; padding:0;
}
.carousel-dot.active { background:var(--c2); transform:scale(1.4); }

@media (max-width:640px) {
  .temoignage-card { min-width:calc(100vw - 4rem); }
  .carousel-track { padding:0 2rem; }
}

/* ══════════════════════════════════════════════════════════════
   CONTACT
   ══════════════════════════════════════════════════════════════ */
.section-contact {
  padding:clamp(5rem,10vw,9rem) 2rem;
  max-width:1280px; margin:0 auto;
}
.contact-wrapper {
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(3rem,6vw,8rem);
  align-items:start;
}
.contact-info {
  opacity:0; transform:translateX(-25px);
  transition:opacity .9s var(--ease-out), transform .9s var(--ease-out);
}
.contact-info.in { opacity:1; transform:translateX(0); }
.contact-adresse { margin:1.5rem 0 2rem; display:flex; flex-direction:column; gap:.5rem; }
.contact-rue { font-size:1.15rem; font-weight:300; }
.contact-ville { color:rgba(26,21,16,.6); }
.contact-tel, .contact-email {
  display:inline-block; color:var(--c2); font-weight:400;
  font-size:.95rem;
  transition:color .3s;
}
.contact-tel:hover, .contact-email:hover { color:var(--c3); }
.horaires-titre {
  font-size:.7rem; letter-spacing:.25em; text-transform:uppercase;
  font-weight:500; color:rgba(26,21,16,.4); margin-bottom:1rem;
}
.horaires-liste { display:flex; flex-direction:column; gap:.6rem; }
.horaire-row {
  display:flex; justify-content:space-between; align-items:center;
  padding-bottom:.6rem; border-bottom:1px solid rgba(26,21,16,.06);
  font-size:.9rem;
}
.horaire-row dt { color:rgba(26,21,16,.7); }
.horaire-row dd { font-weight:400; color:var(--c1); }
.horaire-ferme dt, .horaire-ferme dd { color:rgba(26,21,16,.35); }
.contact-map { margin-top:2rem; overflow:hidden; }
.contact-map iframe { display:block; filter:sepia(.15) contrast(1.05) brightness(.95); }

.contact-form-side {
  opacity:0; transform:translateX(25px);
  transition:opacity .9s .15s var(--ease-out), transform .9s .15s var(--ease-out);
}
.contact-form-side.in { opacity:1; transform:translateX(0); }
.contact-form-titre {
  font-family:var(--f-display); font-weight:400;
  font-size:1.6rem; line-height:1.2; color:var(--c1);
  margin:1rem 0 2rem;
}
.contact-form-titre em { font-style:italic; color:var(--c2); }
.form-honeypot { display:none; }
.form-group { display:flex; flex-direction:column; gap:.5rem; margin-bottom:1.4rem; }
.form-label {
  font-size:.7rem; letter-spacing:.2em; text-transform:uppercase;
  font-weight:500; color:rgba(26,21,16,.5);
}
.form-input {
  padding:.9rem 1.1rem;
  border:1px solid rgba(26,21,16,.12);
  background:var(--bg2);
  font-family:var(--f-body); font-size:.95rem; font-weight:300; color:var(--c1);
  transition:border-color .3s, background .3s;
  resize:none; appearance:none;
}
.form-input:focus { outline:none; border-color:var(--c3); background:var(--white); }
.form-input::placeholder { color:rgba(26,21,16,.3); }
.form-submit {
  width:100%; padding:1rem; background:var(--c2); color:var(--white);
  font-family:var(--f-body); font-size:.78rem; letter-spacing:.2em;
  text-transform:uppercase; font-weight:400; cursor:pointer;
  transition:background .3s, transform .2s;
  border:none;
}
.form-submit:hover { background:var(--c1); }
.form-submit:active { transform:scale(.98); }
.form-success {
  margin-top:1.2rem; padding:1.2rem;
  background:rgba(201,168,76,.1); border-left:2px solid var(--c3);
  font-size:.9rem; color:rgba(26,21,16,.7);
}

@media (max-width:860px) {
  .contact-wrapper { grid-template-columns:1fr; }
}

/* ══════════════════════════════════════════════════════════════
   FOOTER
   ══════════════════════════════════════════════════════════════ */
.footer {
  background:var(--c1); color:rgba(250,246,240,.55);
  padding:clamp(4rem,8vw,7rem) 2rem 0;
  position:relative; overflow:hidden;
}
.footer-inner {
  max-width:1280px; margin:0 auto;
  display:grid; grid-template-columns:1.6fr 1fr 1fr;
  gap:clamp(2.5rem,5vw,5rem); padding-bottom:3rem;
  border-bottom:1px solid rgba(250,246,240,.07);
}
.footer-logo-img {
  display:block; height:64px; width:auto;
  object-fit:contain; margin-bottom:1.2rem;
  filter:brightness(0) invert(1);
  opacity:.7;
}
.footer-histoire { font-size:.88rem; line-height:1.75; max-width:340px; margin-bottom:1.5rem; }
.footer-tagline {
  font-size:.68rem; letter-spacing:.25em; text-transform:uppercase;
  color:var(--c3); opacity:.65;
}
.footer-col-titre {
  font-size:.65rem; letter-spacing:.3em; text-transform:uppercase;
  color:var(--c3); opacity:.7; margin-bottom:1.5rem; font-weight:500;
}
.footer-nav { display:flex; flex-direction:column; gap:.7rem; }
.footer-link {
  font-size:.85rem; color:rgba(250,246,240,.45);
  transition:color .3s;
}
.footer-link:hover { color:var(--c3); }
.footer-adresse { display:flex; flex-direction:column; gap:.55rem; font-size:.88rem; margin-bottom:1.5rem; }
.footer-social { display:flex; align-items:center; gap:.8rem; font-size:.8rem; }
.footer-social-link { color:rgba(250,246,240,.45); transition:color .3s; }
.footer-social-link:hover { color:var(--c3); }
.footer-bas {
  max-width:1280px; margin:0 auto;
  display:flex; justify-content:space-between; align-items:center;
  padding:1.5rem 0; flex-wrap:wrap; gap:1rem;
}
.footer-copy { font-size:.75rem; letter-spacing:.05em; }
.footer-credit { font-size:.72rem; opacity:.45; }
.footer-credit-link { color:var(--c3); transition:opacity .3s; }
.footer-credit-link:hover { opacity:.8; }

@media (max-width:820px) {
  .footer-inner { grid-template-columns:1fr 1fr; }
  .footer-col--brand { grid-column:1/-1; }
}
@media (max-width:520px) {
  .footer-inner { grid-template-columns:1fr; }
  .footer-bas { flex-direction:column; align-items:flex-start; }
}

/* ══════════════════════════════════════════════════════════════
   WHATSAPP + BACK TO TOP
   ══════════════════════════════════════════════════════════════ */
.whatsapp-btn {
  position:fixed; bottom:2rem; right:2rem; z-index:50;
  width:54px; height:54px;
  background:var(--c2); color:var(--white);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 20px rgba(139,38,53,.35);
  transition:background .3s, transform .3s, box-shadow .3s;
}
.whatsapp-btn:hover {
  background:var(--c1); transform:scale(1.08);
  box-shadow:0 6px 28px rgba(26,21,16,.4);
}
.back-top {
  position:fixed; bottom:2rem; left:2rem; z-index:50;
  width:44px; height:44px;
  border:1px solid rgba(26,21,16,.14);
  background:rgba(250,246,240,.9);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  display:flex; align-items:center; justify-content:center;
  color:var(--c1); opacity:0; pointer-events:none;
  transition:opacity .4s, background .3s, transform .3s;
}
.back-top.visible { opacity:1; pointer-events:all; }
.back-top:hover { background:var(--c2); color:var(--white); border-color:var(--c2); transform:translateY(-3px); }

/* ══════════════════════════════════════════════════════════════
   SCROLL REVEAL
   ══════════════════════════════════════════════════════════════ */
.reveal {
  opacity:0; transform:translateY(28px);
  transition:opacity .85s var(--ease-out), transform .85s var(--ease-out);
}
.reveal-left {
  opacity:0; transform:translateX(-28px);
  transition:opacity .9s var(--ease-out), transform .9s var(--ease-out);
}
.reveal-right {
  opacity:0; transform:translateX(28px);
  transition:opacity .9s var(--ease-out), transform .9s var(--ease-out);
}
.reveal.in, .reveal-left.in, .reveal-right.in {
  opacity:1; transform:translate(0);
}

/* ══════════════════════════════════════════════════════════════
   RESPONSIVE GLOBAL
   ══════════════════════════════════════════════════════════════ */
@media (max-width:640px) {
  :root { --nav-h: 64px; }
  .hero-titre { font-size:2.4rem; }
  .section-titre { font-size:1.75rem; }
}

/* ══════════════════════════════════════════════════════════════
   PRINT
   ══════════════════════════════════════════════════════════════ */
@media print {
  #intro, #nav, .whatsapp-btn, .back-top, .cur, .cur-r { display:none !important; }
  body { background:white; color:black; }
}