/* ============================================================
   DÉLINÈS TRAITEUR — style.css v2
   Palette : Isabelline · Tan · Van Dyke · Battleship Gray · Khaki
   F9F5EF · D6BA98 · 3B2F2F · 8A8A8A · A3A190
   Typographie : Playfair Display (serif) + DM Sans (sans)
   ============================================================ */

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


/* ===== FONTS LOCALES ===== */
@font-face {
  font-family: 'Playfair Display';
  src: url('../fonts/playfair-display-latin-400-normal.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: optional;
}
@font-face {
  font-family: 'Playfair Display';
  src: url('../fonts/playfair-display-latin-400-italic.woff2') format('woff2');
  font-weight: 400; font-style: italic; font-display: optional;
}
@font-face {
  font-family: 'Playfair Display';
  src: url('../fonts/playfair-display-latin-600-normal.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: optional;
}
@font-face {
  font-family: 'Playfair Display';
  src: url('../fonts/playfair-display-latin-700-normal.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: optional;
}

@font-face {
  font-family: 'Raleway';
  src: url('../fonts/raleway-latin-300-normal.woff2') format('woff2');
  font-weight: 300; font-style: normal; font-display: optional;
}
@font-face {
  font-family: 'Raleway';
  src: url('../fonts/raleway-latin-400-normal.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: optional;
}
@font-face {
  font-family: 'Raleway';
  src: url('../fonts/raleway-latin-500-normal.woff2') format('woff2');
  font-weight: 500; font-style: normal; font-display: optional;
}
@font-face {
  font-family: 'Raleway';
  src: url('../fonts/raleway-latin-600-normal.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: optional;
}

@font-face {
  font-family: 'Lora';
  src: url('../fonts/lora-latin-400-normal.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: optional;
}
@font-face {
  font-family: 'Lora';
  src: url('../fonts/lora-latin-400-italic.woff2') format('woff2');
  font-weight: 400; font-style: italic; font-display: optional;
}
@font-face {
  font-family: 'Lora';
  src: url('../fonts/lora-latin-600-normal.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: optional;
}

/* ---------- TOKENS ---------- */
:root {
  --blanc:        #ffffff;
  --isabelline:   #F9F5EF;
  --isabelline2:  #F0EAE0;
  --tan:          #D6BA98;
  --tan-dark:     #B89878;
  --vandyke:      #3B2F2F;
  --vandyke-soft: #5a4848;
  --gray:         #8A8A8A;
  --gray-light:   #C8C4BE;
  --khaki:        #A3A190;

  --bg:           var(--isabelline);
  --bg-card:      var(--blanc);
  --accent:       var(--tan);
  --accent-dark:  var(--tan-dark);
  --texte:        var(--vandyke);
  --texte-soft:   var(--gray);
  --border:       rgba(59,47,47,.1);
  --border-accent:rgba(214,186,152,.4);

  --ff-serif:  'Playfair Display', Georgia, serif;  /* titres principaux */
  --ff-sans:   'Raleway', 'Segoe UI', sans-serif;   /* corps de texte, nav, boutons */
  --ff-accent: 'Lora', Georgia, serif;              /* citations, sous-titres italiques */

  --r:          .5rem;
  --r-lg:       1rem;
  --shadow-sm:  0 2px 12px rgba(59,47,47,.06);
  --shadow-md:  0 8px 32px rgba(59,47,47,.1);
  --shadow-lg:  0 24px 64px rgba(59,47,47,.14);
  --transition: .32s cubic-bezier(.4,0,.2,1);
}

html { scroll-behavior: smooth; font-size: 16px; }
body { font-family: var(--ff-sans); background: var(--bg); color: var(--texte); line-height: 1.75; overflow-x: hidden; }
img  { display: block; max-width: 100%; }
a    { color: inherit; text-decoration: none; }

::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: var(--isabelline2); }
::-webkit-scrollbar-thumb { background: var(--tan); border-radius: 3px; }

.container   { max-width: 1180px; margin: 0 auto; padding: 0 2rem; }
.text-center { text-align: center; }

/* Grain subtil */
body::after {
  content: ''; position: fixed; inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
  opacity: .022; pointer-events: none; z-index: 9999;
}

/* ============================================================ NAVBAR */
#navbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  padding: 1.5rem 0;
  transition: background var(--transition), padding var(--transition), box-shadow var(--transition);
}
#navbar.scrolled {
  background: rgba(249,245,239,.95); backdrop-filter: blur(16px);
  padding: .9rem 0;
  box-shadow: 0 1px 0 var(--border), var(--shadow-sm);
}
.nav-inner { display: flex; align-items: center; justify-content: space-between; }
.nav-logo {
  font-family: var(--ff-serif); font-size: 1.45rem; font-style: italic;
  color: var(--vandyke); letter-spacing: .01em;
  display: flex; align-items: center; gap: .4rem;
}
.nav-logo span { font-style: normal; font-weight: 700; }
.nav-links { display: flex; gap: 2.2rem; list-style: none; }
.nav-links a {
  font-size: .82rem; letter-spacing: .1em; text-transform: uppercase;
  color: var(--vandyke-soft); position: relative; transition: color var(--transition);
}
.nav-links a::after {
  content: ''; position: absolute; bottom: -3px; left: 0;
  width: 0; height: 1px; background: var(--tan); transition: width var(--transition);
}
.nav-links a:hover { color: var(--vandyke); }
.nav-links a:hover::after { width: 100%; }
.nav-cta {
  background: var(--vandyke) !important; color: var(--isabelline) !important;
  padding: .55rem 1.5rem !important; border-radius: var(--r) !important;
  font-weight: 500 !important; transition: background var(--transition), transform var(--transition) !important;
}
.nav-cta::after { display: none !important; }
.nav-cta:hover { background: var(--vandyke-soft) !important; transform: translateY(-1px); }
.burger { display: none; flex-direction: column; gap: 5px; cursor: pointer; padding: 4px; background: none; border: none; }
.burger span { display: block; width: 24px; height: 2px; background: var(--vandyke); border-radius: 2px; transition: var(--transition); }

/* ============================================================ HERO */
#hero {
  min-height: 100vh;
  display: grid; grid-template-columns: 1fr 1fr;
  align-items: center; position: relative; overflow: hidden;
  background: var(--isabelline2);
}

/* --- Média Hero ---
   PHOTO  → <img  class="hero-media-img"   src="data/images/hero.jpg"   alt="…">
   VIDÉO  → <video class="hero-media-video" src="data/videos/hero.mp4"
                   autoplay muted loop playsinline
                   poster="data/images/hero-poster.jpg"></video>
   Les deux sont mis dans .hero-media-wrap — décommenter ce qui s'applique dans index.html
*/
.hero-media-wrap { position: relative; height: 100vh; overflow: hidden; }
.hero-media-img   { width: 100%; height: 100%; object-fit: cover; }
.hero-media-video { width: 100%; height: 100%; object-fit: cover; display: block; }
.hero-media-wrap::after {
  content: ''; position: absolute; inset: 0;
  background:
  linear-gradient(270deg, transparent 55%, var(--isabelline2) 100%),
  linear-gradient(0deg,   var(--isabelline2) 0%, transparent 20%);
  pointer-events: none;
}

.hero-content { padding: 5rem 3rem 5rem 5rem; position: relative; z-index: 1; animation: fadeUp .9s .1s both; }
.hero-eyebrow {
  display: inline-flex; align-items: center; gap: .7rem;
  font-size: .72rem; letter-spacing: .22em; text-transform: uppercase;
  color: var(--vandyke-soft); margin-bottom: 1.4rem;
}
.hero-eyebrow::before { content: ''; display: block; width: 28px; height: 1px; background: var(--tan-dark); }
.hero-title {
  font-family: var(--ff-serif); font-size: clamp(3rem,5vw,5rem);
  font-weight: 700; line-height: 1.05; color: var(--vandyke); margin-bottom: .6rem;
}
.hero-title em { display: block; font-style: italic; color: var(--vandyke); }
.hero-chef {
  display: inline-flex; align-items: center; gap: .7rem;
  font-size: .78rem; color: var(--vandyke-soft); margin-bottom: 1.5rem;
  padding: .6rem 1.1rem; border: 1px solid var(--border-accent); border-radius: 50px;
  background: rgba(214,186,152,.1);
}
.hero-chef .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--tan); }
.hero-subtitle { font-size: .97rem; color: var(--vandyke-soft); max-width: 40ch; line-height: 1.8; margin-bottom: 2.2rem; font-family: var(--ff-accent); }
.hero-buttons { display: flex; gap: 1rem; flex-wrap: wrap; }
.hero-badge {
  position: absolute; bottom: 2.5rem; right: 2.5rem; z-index: 2;
  background: var(--blanc); border: 1px solid var(--border-accent);
  border-radius: var(--r-lg); padding: 1rem 1.4rem; text-align: center;
  box-shadow: var(--shadow-md);
}
.hero-badge .note { font-family: var(--ff-serif); font-size: 2rem; color: var(--vandyke); font-weight: 700; }
.hero-badge .note-label { font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--vandyke-soft); }
.hero-scroll {
  position: absolute; bottom: 2rem; left: 50%; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: .4rem;
  font-size: .66rem; letter-spacing: .15em; text-transform: uppercase; color: var(--vandyke-soft);
  animation: bounce 2.2s infinite;
}
.hero-scroll::after { content: ''; display: block; width: 1px; height: 36px; background: linear-gradient(var(--tan), transparent); }

/* ============================================================ BOUTONS */
.btn {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .85rem 2rem; font-family: var(--ff-sans); font-size: .85rem;
  font-weight: 500; letter-spacing: .06em; border-radius: var(--r);
  cursor: pointer; border: none; transition: all var(--transition);
}
.btn-dark    { background: var(--vandyke); color: var(--isabelline); }
.btn-dark:hover  { background: var(--vandyke-soft); transform: translateY(-2px); box-shadow: var(--shadow-md); }
.btn-outline { background: transparent; color: var(--vandyke); border: 1.5px solid var(--border-accent); }
.btn-outline:hover { background: rgba(214,186,152,.12); border-color: var(--tan); transform: translateY(-2px); }
.btn-tan     { background: var(--tan); color: var(--vandyke); }
.btn-tan:hover   { background: var(--tan-dark); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(214,186,152,.4); }

/* ============================================================ SECTIONS */
section { padding: 7rem 0; }
.section-label {
  display: inline-flex; align-items: center; gap: .6rem;
  font-size: .7rem; letter-spacing: .22em; text-transform: uppercase;
  color: var(--tan-dark); margin-bottom: 1.1rem;
}
.section-label::before { content: ''; display: block; width: 22px; height: 1px; background: var(--tan-dark); }
.section-title { font-family: var(--ff-serif); font-size: clamp(2rem,3.5vw,2.8rem); font-weight: 700; color: var(--vandyke); line-height: 1.15; margin-bottom: 1rem; }
.section-title em { font-style: italic; color: var(--tan-dark); }
.section-desc { color: var(--vandyke-soft); font-size: .94rem; line-height: 1.85; max-width: 54ch; font-family: var(--ff-accent); }
.divider { width: 40px; height: 2px; background: linear-gradient(90deg, var(--tan), transparent); margin: 1rem 0 1.8rem; }

/* ============================================================ ABOUT */
#about { background: var(--blanc); }
.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
.about-img-stack { position: relative; }
.about-img-main { width: 100%; aspect-ratio: 4/5; object-fit: cover; border-radius: var(--r-lg); box-shadow: var(--shadow-lg); }
.about-img-accent { position: absolute; bottom: -2rem; right: -2rem; width: 52%; aspect-ratio: 1; object-fit: cover; border-radius: var(--r-lg); border: 4px solid var(--blanc); box-shadow: var(--shadow-md); }
.about-or-line { position: absolute; top: 10%; left: -2rem; width: 1px; height: 80%; background: linear-gradient(var(--tan), transparent); opacity: .6; }
.about-values { margin-top: 2rem; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.about-value { padding: 1.1rem 1.2rem; border: 1px solid var(--border); border-radius: var(--r); background: var(--isabelline); transition: border-color var(--transition); }
.about-value:hover { border-color: var(--border-accent); }
.about-value .v-title { font-family: var(--ff-serif); color: var(--vandyke); font-size: .95rem; margin-bottom: .25rem; }
.about-value p { font-size: .8rem; color: var(--vandyke-soft); }

/* ============================================================ SERVICES */
#services { background: var(--isabelline); }
.services-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.4rem; margin-top: 3rem; }
.service-card { position: relative; border-radius: var(--r-lg); overflow: hidden; cursor: pointer; aspect-ratio: 3/4; box-shadow: var(--shadow-sm); }
.service-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .65s cubic-bezier(.4,0,.2,1); }
.service-card:hover img { transform: scale(1.06); }
.service-card-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(59,47,47,.88) 0%, rgba(59,47,47,.2) 55%, transparent 100%); }
.service-card-content { position: absolute; bottom: 0; left: 0; right: 0; padding: 1.6rem; }
.service-num { font-family: var(--ff-serif); font-size: .7rem; color: var(--tan); letter-spacing: .18em; margin-bottom: .4rem; }
.service-name { font-family: var(--ff-serif); font-size: 1.35rem; font-weight: 700; color: var(--isabelline); margin-bottom: .4rem; }
.service-desc { font-size: .78rem; color: rgba(249,245,239,.7); line-height: 1.6; }
.service-arrow { display: inline-flex; align-items: center; gap: .4rem; margin-top: .7rem; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--tan); transition: gap var(--transition); }
.service-card:hover .service-arrow { gap: .8rem; }

/* ============================================================ GALERIE */
#galerie { background: var(--isabelline2); }
.galerie-header { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 2.2rem; flex-wrap: wrap; gap: 1.5rem; }
.galerie-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: .7rem; }
.galerie-item { overflow: hidden; border-radius: var(--r); position: relative; cursor: pointer; }
.galerie-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.galerie-item:hover img { transform: scale(1.05); }
.galerie-item::after { content: ''; position: absolute; inset: 0; background: rgba(59,47,47,0); transition: background var(--transition); }
.galerie-item:hover::after { background: rgba(59,47,47,.06); }
.gi-tall { grid-row: span 2; }
.gi-wide { grid-column: span 2; }
.galerie-item-1 { aspect-ratio: 3/4; }
.galerie-item-2, .galerie-item-3 { aspect-ratio: 4/3; }
.galerie-item-4 { aspect-ratio: 3/4; }
.galerie-item-5 { aspect-ratio: 16/9; }

/* ============================================================ TÉMOIGNAGES VIDÉO */
#temoignages { background: var(--vandyke); }
#temoignages .section-label { color: var(--tan); }
#temoignages .section-label::before { background: var(--tan); }
#temoignages .section-title { color: var(--isabelline); }
#temoignages .section-title em { color: var(--tan); }
#temoignages .section-desc { color: rgba(249,245,239,.6); max-width: 48ch; }

.temoignages-top { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 3rem; flex-wrap: wrap; gap: 2rem; }
.note-globale-wrap { display: flex; align-items: center; gap: 1.5rem; padding: 1.2rem 1.8rem; background: rgba(249,245,239,.06); border: 1px solid rgba(214,186,152,.2); border-radius: var(--r-lg); }
.note-globale { font-family: var(--ff-serif); font-size: 3.5rem; color: var(--tan); font-weight: 700; line-height: 1; }
.note-stars { color: var(--tan); font-size: 1rem; letter-spacing: .08em; }
.note-label { font-size: .75rem; color: rgba(249,245,239,.45); margin-top: .2rem; }

/* Vidéos format vertical 9:16 */
.temoignages-videos {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  gap: 1.2rem;
  margin-bottom: 3rem;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  padding-bottom: .5rem;
}
.temoignages-videos::-webkit-scrollbar { display: none; }
.video-card {
  flex: 0 0 280px;
  scroll-snap-align: center;
}
@media (max-width:768px) {
  .video-card { flex: 0 0 85vw; max-width: 340px; }
}
.video-card {
  position: relative; aspect-ratio: 9/16; border-radius: var(--r-lg); overflow: hidden;
  cursor: pointer; background: rgba(249,245,239,.05);
  border: 1px solid rgba(214,186,152,.15);
  transition: transform var(--transition), box-shadow var(--transition);
}
.video-card:hover { transform: translateY(-4px); box-shadow: 0 20px 50px rgba(0,0,0,.3); }
.video-card video, .video-card .video-poster { width: 100%; height: 100%; object-fit: cover; display: block; }
.video-card-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(0deg, rgba(59,47,47,.82) 0%, transparent 55%);
  transition: background var(--transition);
}
.video-card:hover .video-card-overlay { background: linear-gradient(0deg, rgba(59,47,47,.6) 0%, transparent 65%); }
.video-play {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 52px; height: 52px; background: rgba(249,245,239,.92); border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  transition: transform var(--transition), background var(--transition);
  box-shadow: 0 4px 20px rgba(0,0,0,.3);
}
.video-play::after { content: ''; border-style: solid; border-width: 9px 0 9px 16px; border-color: transparent transparent transparent var(--vandyke); margin-left: 3px; }
.video-card:hover .video-play { transform: translate(-50%,-50%) scale(1.1); background: var(--tan); }
.video-info { position: absolute; bottom: 0; left: 0; right: 0; padding: 1rem 1.1rem; }
.video-client-type { font-size: .62rem; letter-spacing: .15em; text-transform: uppercase; color: var(--tan); margin-bottom: .25rem; }
.video-client-name { font-family: var(--ff-serif); font-size: .95rem; font-weight: 600; color: var(--isabelline); margin-bottom: .15rem; }
.video-client-context { font-size: .72rem; color: rgba(249,245,239,.55); }
.video-stars { color: var(--tan); font-size: .72rem; margin-top: .3rem; }

/* Avis texte */
.temoignages-texte { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.2rem; }
.temoignage-card { padding: 1.6rem; background: rgba(249,245,239,.05); border: 1px solid rgba(214,186,152,.12); border-radius: var(--r-lg); transition: border-color var(--transition), transform var(--transition); }
.temoignage-card:hover { border-color: rgba(214,186,152,.3); transform: translateY(-3px); }
.temoignage-badge { display: inline-block; margin-bottom: .8rem; font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; padding: .2rem .7rem; border-radius: 50px; border: 1px solid rgba(214,186,152,.25); color: var(--tan); }
.temoignage-stars { color: var(--tan); font-size: .88rem; margin-bottom: .7rem; }
.temoignage-text { font-style: italic; color: rgba(249,245,239,.72); font-size: .86rem; line-height: 1.75; margin-bottom: .9rem; font-family: var(--ff-accent); }
.temoignage-author { font-size: .78rem; color: var(--isabelline); font-weight: 500; }
.temoignage-source { font-size: .7rem; color: var(--tan); opacity: .65; }

/* ============================================================ CONTACT */
#contact { background: var(--blanc); }
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: start; margin-top: 3rem; position: relative; }
.contact-grid::before { content: ''; position: absolute; left: 50%; top: 5%; bottom: 5%; width: 1px; background: linear-gradient(180deg, transparent, var(--tan) 25%, var(--tan-dark) 50%, var(--tan) 75%, transparent); opacity: .35; transform: translateX(-50%); display: none; pointer-events: none; }
.contact-info { display: flex; flex-direction: column; gap: 1.4rem; }
.contact-item { display: flex; gap: 1rem; align-items: flex-start; }
.contact-icon { width: 42px; height: 42px; flex-shrink: 0; background: var(--isabelline); border: 1px solid var(--border-accent); border-radius: var(--r); display: flex; align-items: center; justify-content: center; font-size: 1rem; }
.contact-item-label { font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: var(--tan-dark); margin-bottom: .2rem; }
.contact-item-value { color: var(--vandyke); font-size: .9rem; }
.contact-socials { display: flex; gap: .7rem; margin-top: .3rem; }
.social-btn { display: flex; align-items: center; gap: .45rem; padding: .55rem 1.1rem; border: 1px solid var(--border-accent); border-radius: var(--r); font-size: .78rem; color: var(--vandyke-soft); transition: all var(--transition); background: var(--isabelline); }
.social-btn:hover { border-color: var(--tan); color: var(--vandyke); background: rgba(214,186,152,.12); }
.contact-form { display: flex; flex-direction: column; gap: .9rem; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; }
.form-group { display: flex; flex-direction: column; gap: .35rem; }
.form-group label { font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: var(--vandyke-soft); }
.form-group input, .form-group select, .form-group textarea { background: var(--isabelline); border: 1px solid var(--border); border-radius: var(--r); padding: .8rem 1rem; color: var(--vandyke); font-family: var(--ff-sans); font-size: .9rem; transition: border-color var(--transition), box-shadow var(--transition); outline: none; appearance: none; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color: var(--tan); box-shadow: 0 0 0 3px rgba(214,186,152,.15); }
.form-group textarea { resize: vertical; min-height: 110px; }
.form-group select option { background: var(--blanc); }
.form-group input::placeholder, .form-group textarea::placeholder { color: var(--gray-light); }
.map-section { margin-top: 5rem; }
.map-wrap { border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--border); height: 360px; }
.map-wrap iframe { width: 100%; height: 100%; border: 0; }

/* ============================================================ FOOTER */
footer { background: var(--vandyke); color: rgba(249,245,239,.7); padding: 3.5rem 0 2rem; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 3rem; padding-bottom: 2.5rem; border-bottom: 1px solid rgba(249,245,239,.08); }
.footer-brand .logo-text { font-family: var(--ff-serif); font-size: 1.4rem; font-style: italic; color: var(--isabelline); margin-bottom: .8rem; }
.footer-brand p { font-size: .83rem; line-height: 1.7; max-width: 30ch; }
.footer-col h4 { font-size: .7rem; letter-spacing: .15em; text-transform: uppercase; color: var(--tan); margin-bottom: 1.1rem; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: .55rem; }
.footer-col ul li a { font-size: .83rem; color: rgba(249,245,239,.55); transition: color var(--transition); }
.footer-col ul li a:hover { color: var(--tan); }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; padding-top: 1.4rem; flex-wrap: wrap; gap: 1rem; font-size: .75rem; color: rgba(249,245,239,.65); }
.footer-bottom a { color: rgba(249,245,239,.65); transition: color var(--transition); }
.footer-bottom a:hover { color: var(--tan); }

/* ============================================================ MODAL VIDÉO */
.video-modal { position: fixed; inset: 0; background: rgba(59,47,47,.95); backdrop-filter: blur(8px); z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 1.5rem; opacity: 0; pointer-events: none; transition: opacity var(--transition); }
.video-modal.open { opacity: 1; pointer-events: auto; }
.video-modal-inner { position: relative; width: min(400px,90vw); aspect-ratio: 9/16; border-radius: var(--r-lg); overflow: hidden; transform: scale(.94); transition: transform var(--transition); }
.video-modal.open .video-modal-inner { transform: scale(1); }
.video-modal video { width: 100%; height: 100%; object-fit: cover; }
.video-modal-close { position: absolute; top: 1rem; right: 1rem; width: 36px; height: 36px; background: rgba(249,245,239,.15); backdrop-filter: blur(4px); border: none; border-radius: 50%; color: var(--isabelline); font-size: 1rem; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background var(--transition); }
.video-modal-close:hover { background: rgba(249,245,239,.3); }

/* ============================================================ ANIMATIONS */
@keyframes fadeUp { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:none; } }
@keyframes bounce { 0%,100%{transform:translateX(-50%) translateY(0)} 50%{transform:translateX(-50%) translateY(7px)} }
.reveal { opacity:0; transform:translateY(26px); transition:opacity .65s ease, transform .65s ease; }
.reveal.visible { opacity:1; transform:none; }

/* ============================================================ RESPONSIVE */
@media (max-width:1024px) {
  #hero { grid-template-columns:1fr; min-height:auto; }
  .hero-media-wrap { height:55vh; order:-1; }
  .hero-media-wrap::after { background: linear-gradient(0deg,var(--isabelline2) 0%,transparent 30%), linear-gradient(180deg,var(--isabelline2) 0%,transparent 30%); }
  .hero-content { padding:4rem 2rem 3rem; }
  .about-grid { grid-template-columns:1fr; gap:3rem; }
  .about-img-accent { display:none; }
  .services-grid { grid-template-columns:1fr 1fr; }
  .temoignages-texte { grid-template-columns:1fr 1fr; }
  .contact-grid { grid-template-columns:1fr; gap:3rem; }
  .contact-grid::before { display:none !important; }
  .footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:768px) {
  .nav-links { display:none; flex-direction:column; }
  .nav-links.open { display:flex; position:fixed; inset:0; top:58px; background:rgba(249,245,239,.98); backdrop-filter:blur(12px); z-index:199; padding:2rem; gap:2rem; align-items:center; justify-content:center; font-size:1.1rem; }
  .burger { display:flex; }
  .services-grid { grid-template-columns:1fr; }
  .galerie-grid { grid-template-columns:1fr 1fr; }
  .gi-tall,.gi-wide { grid-row:auto; grid-column:auto; }
  .temoignages-videos { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:1rem; padding-bottom:1rem; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  .temoignages-videos::-webkit-scrollbar { display:none; }
  .video-card { flex:0 0 85vw; max-width:340px; scroll-snap-align:center; aspect-ratio:9/16; }
  .temoignages-texte { grid-template-columns:1fr; }
  .form-row { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr; }
  .hero-buttons { flex-direction:column; align-items:flex-start; }
  .about-values { grid-template-columns:1fr; }
  .temoignages-top { flex-direction:column; }
}
@media (max-width:520px) {
  .galerie-grid { grid-template-columns:1fr; }
  .temoignages-videos { grid-template-columns:unset; }
  section { padding:5rem 0; }
}

/* ===== CAROUSEL WRAPPER (vidéos + avis mêlés) ===== */
.carousel-wrap {
  position: relative;
}
.carousel-arrow {
  display: flex;
  position: absolute;
  top: 50%; transform: translateY(-50%);
  width: 40px; height: 40px;
  background: var(--blanc);
  border: 1px solid var(--border-accent);
  border-radius: 50%;
  box-shadow: var(--shadow-md);
  cursor: pointer;
  align-items: center; justify-content: center;
  font-size: 1rem; color: var(--vandyke);
  transition: all var(--transition);
  z-index: 10;
}
.carousel-arrow:hover { background: var(--tan); color: var(--blanc); border-color: var(--tan); }
.carousel-arrow.left  { left: -18px; }
.carousel-arrow.right { right: -18px; }
.carousel-arrow.hidden { opacity: 0; pointer-events: none; }

/* ============================================================ GALERIE */
#galerie { background: var(--isabelline2); }
.galerie-header { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 2.2rem; flex-wrap: wrap; gap: 1.5rem; }

.galerie-mosaic {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  gap: .7rem;
  padding-bottom: .5rem;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  align-items: center;
}
.galerie-mosaic::-webkit-scrollbar { display: none; }

/* Groupe de 2 vidéos empilées verticalement */
.galerie-col {
  display: flex;
  flex-direction: column;
  gap: .7rem;
  flex-shrink: 0;
  scroll-snap-align: start;
}
.galerie-col-wide  { width: 320px; }
.galerie-col-med   { width: 220px; }
.galerie-col-narrow{ width: 160px; }

.galerie-video-item {
  flex-shrink: 0;
  overflow: hidden;
  border-radius: var(--r-lg);
  cursor: pointer;
  background: var(--vandyke);
  position: relative;
}
/* Hauteurs variées pour l'effet mosaïque */
.galerie-video-item.tall   { height: 380px; }
.galerie-video-item.medium { height: 280px; }
.galerie-video-item.short  { height: 200px; }

.galerie-video-item video {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .6s ease;
}
.galerie-video-item:hover video { transform: scale(1.04); }

@media (max-width:768px) {
  .galerie-col-wide   { width: 200px; }
  .galerie-col-med    { width: 160px; }
  .galerie-col-narrow { width: 130px; }
  .galerie-video-item.tall   { height: 280px; }
  .galerie-video-item.medium { height: 200px; }
  .galerie-video-item.short  { height: 150px; }
}

/* Card avis texte format vertical dans le carousel */
.temoignage-card-vertical {
  flex: 0 0 85vw;
  max-width: 340px;
  scroll-snap-align: center;
  aspect-ratio: 9/16;
  border-radius: var(--r-lg);
  background: rgba(249,245,239,.07);
  border: 1px solid rgba(214,186,152,.2);
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 1.6rem;
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
}
.temoignage-card-vertical::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(0deg, rgba(59,47,47,.85) 0%, rgba(59,47,47,.2) 60%, transparent 100%);
}
.temoignage-card-vertical > * { position: relative; z-index: 1; }
.temoignage-card-vertical .temoignage-badge { margin-bottom: .6rem; }
.temoignage-card-vertical .temoignage-stars { font-size: .9rem; margin-bottom: .6rem; }
.temoignage-card-vertical .temoignage-text { font-size: .82rem; margin-bottom: .8rem; color: rgba(249,245,239,.85); }
.temoignage-card-vertical .temoignage-author { color: var(--isabelline); font-size: .8rem; font-weight: 600; }
.temoignage-card-vertical .temoignage-source { font-size: .68rem; }

/* Cacher la grille texte séparée sur mobile */
.temoignages-texte { display: none; }
}

/* Dots */
.carousel-dots { display: none; justify-content: center; gap: .5rem; margin-top: 1.2rem; }
.carousel-dot { width: 7px; height: 7px; border-radius: 50%; background: rgba(214,186,152,.3); cursor: pointer; transition: all var(--transition); }
.carousel-dot.active { background: var(--tan); width: 20px; border-radius: 4px; }
@media (max-width: 768px) {
  .carousel-dots { display: flex; }
}

.contact-sep-mobile {
  display: none;
  border: none;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--tan) 25%, var(--tan-dark) 50%, var(--tan) 75%, transparent);
  opacity: .35;
  margin: .5rem 0;
}
@media (max-width:1024px) {
  .contact-sep-mobile { display: block; }
}

@media (min-width:1025px) {
  .contact-grid::before { display:block; }
}

/* ============================================================ PARTENAIRES */
.partners-bar {
  background: var(--blanc);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 1.4rem 0;
  overflow: hidden;
}
.partners-track {
  display: flex;
  align-items: center;
  gap: 3.5rem;
}
.partners-track:hover { animation-play-state: paused; }
.partner-item {
  display: flex; align-items: center; flex-shrink: 0;
}
.partner-item img {
  height: 36px; width: auto;
  filter: grayscale(1) opacity(.5);
  transition: filter var(--transition);
  object-fit: contain;
  aspect-ratio: auto;
}
.partner-item:hover img { filter: grayscale(0) opacity(1); }

@keyframes scrollPartners {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ============================================================ BLOG CARROUSEL */
#blog { background: var(--blanc); }
.blog-grid {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  gap: 1.4rem;
  padding-bottom: .8rem;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.blog-grid::-webkit-scrollbar { display: none; }

.blog-card {
  flex: 0 0 320px;
  scroll-snap-align: start;
  background: var(--isabelline);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  overflow: hidden;
  text-decoration: none;
  transition: border-color var(--transition), transform var(--transition), box-shadow var(--transition);
  display: flex; flex-direction: column;
}
.blog-card:hover { border-color: var(--border-accent); transform: translateY(-4px); box-shadow: var(--shadow-md); }
.blog-card-img { aspect-ratio: 16/10; overflow: hidden; }
.blog-card-img img { width:100%; height:100%; object-fit:cover; transition: transform .6s ease; }
.blog-card:hover .blog-card-img img { transform: scale(1.05); }
.blog-card-body { padding: 1.3rem; flex: 1; display: flex; flex-direction: column; gap: .5rem; }
.blog-cat {
  display: inline-block; font-size: .65rem; letter-spacing: .14em;
  text-transform: uppercase; color: var(--tan-dark);
  background: rgba(214,186,152,.15); border: 1px solid var(--border-accent);
  padding: .2rem .7rem; border-radius: 50px;
  align-self: flex-start;
}
.blog-card-body h3 { font-family: var(--ff-serif); font-size: 1rem; color: var(--vandyke); line-height: 1.35; }
.blog-card-body p { font-size: .82rem; color: var(--vandyke-soft); line-height: 1.65; font-family: var(--ff-accent); flex: 1; }
.blog-read { font-size: .78rem; color: var(--tan-dark); font-weight: 500; transition: gap var(--transition); }
.blog-card:hover .blog-read { letter-spacing: .04em; }

@media (max-width:768px) {
  .blog-card { flex: 0 0 80vw; max-width: 300px; }
}

/* ===== GALERIE VIDÉOS ===== */
.galerie-video-item {
  aspect-ratio: 4/3;
  position: relative;
  cursor: pointer;
  background: var(--vandyke);
  border-radius: var(--r);
  overflow: hidden;
}
.galerie-video-item video {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .6s ease;
  display: block;
}
.galerie-video-item:hover video { transform: scale(1.04); }

/* ============================================================ SHOP CONTRAST FIX */
.tab-btn { color: var(--vandyke-soft); }
.cart-clear { color: var(--vandyke-soft); }
.cart-empty { color: var(--vandyke-soft); }
.cart-secure { color: var(--vandyke-soft); }
.section-cat-title { color: var(--vandyke-soft); }
.form-group label { color: var(--vandyke-soft); }