/* ==============================
   CHARTE GRAPHIQUE MAMÉ'HO
   #085E54  Bleu canard (principale)
   #91CF5C  Vert pomme
   #EDBF91  Beige
   #FCCF00  Jaune
   #AD1C69  Violet/rose
   Font titre  : Amatic SC Bold
   Font corps  : Avenir Regular
============================== */

@font-face {
  font-family: 'Amatic SC';
  src: url('AmaticSC-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --teal:       #085E54;
  --teal-dark:  #054840;
  --teal-light: #0A7A6C;
  --green:      #91CF5C;
  --beige:      #EDBF91;
  --yellow:     #FCCF00;
  --violet:     #AD1C69;
  --cream:      #FAF7E8;
  --cream-mid:  #F2EDD5;
  --dark:       #18201A;
  --gray:       #586058;
  --gray-light: #8A9280;
  --white:      #FFFFFF;

  --ft: 'Amatic SC', cursive;
  --fb: 'Avenir', 'Avenir Next', 'Nunito', sans-serif;

  --r: 16px;
  --sh: 0 6px 32px rgba(8,94,84,.10);
  --sh-h: 0 18px 56px rgba(8,94,84,.18);
  --tr: .32s cubic-bezier(.4,0,.2,1);

  --topbar-h: 66px;
  --gap: clamp(16px, 4vw, 40px);
  --wrap: min(1160px, 100% - 2 * var(--gap));
}

/* ── Reset ── */
*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; -webkit-text-size-adjust:100%; }
body { background:var(--cream); color:var(--dark); font-family:var(--fb); font-weight:400; line-height:1.65; overflow-x:hidden; }
img { max-width:100%; height:auto; display:block; }
a { color:inherit; text-decoration:none; }
ul,ol { list-style:none; }
button { cursor:pointer; font:inherit; }
section[id] { scroll-margin-top: var(--topbar-h); }

.skip-link {
  position:absolute; top:-100px; left:20px;
  background:var(--teal); color:var(--white);
  padding:8px 18px; border-radius:0 0 10px 10px;
  font-size:13px; font-weight:700; z-index:9999;
  transition:top .2s;
}
.skip-link:focus { top:0; }

/* ══════════════════════════════
   TOPBAR
══════════════════════════════ */
.topbar {
  position:fixed; top:0; width:100%; height:var(--topbar-h);
  padding:0 var(--gap);
  display:flex; align-items:center; justify-content:space-between;
  background:#FAF7E8;
  border-bottom:1.5px solid rgba(8,94,84,.09);
  z-index:900;
  transition:box-shadow var(--tr);
}
.topbar.scrolled { box-shadow:0 4px 26px rgba(8,94,84,.12); }

.menu-btn { display:flex; flex-direction:column; gap:5px; background:none; border:none; padding:7px; flex-shrink:0; }
.burger-line { display:block; width:23px; height:2px; background:var(--teal); border-radius:2px; transition:var(--tr); }
.menu-btn:hover .burger-line { background:var(--violet); }
.menu-btn[aria-expanded="true"] .burger-line:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.menu-btn[aria-expanded="true"] .burger-line:nth-child(2) { opacity:0; }
.menu-btn[aria-expanded="true"] .burger-line:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

.logo-link { text-decoration:none; flex-shrink:0; }
.logo { display:flex; flex-direction:column; align-items:center; line-height:1; }
.logo-main { font-family:var(--ft); font-weight:700; font-size:28px; color:var(--teal); letter-spacing:.5px; }
.logo-main .ho { color:var(--green); }
.logo-sub { font-size:8px; letter-spacing:3px; text-transform:uppercase; color:var(--gray-light); font-weight:700; font-family:var(--fb); }
.logo-img { height:58px; width:auto; display:block; object-fit:contain; mix-blend-mode:multiply; }

.topbar-nav { display:flex; gap:24px; align-items:center; }
.topbar-nav a { font-size:13px; font-family:var(--fb); letter-spacing:1.5px; text-transform:uppercase; font-weight:600; color:var(--dark); transition:color var(--tr); position:relative; }
.topbar-nav a::after { content:''; position:absolute; bottom:-3px; left:0; width:0; height:2px; background:var(--teal); border-radius:2px; transition:width var(--tr); }
.topbar-nav a:hover { color:var(--teal); }
.topbar-nav a:hover::after { width:100%; }
.topbar-nav .btn-cta { background:var(--teal); color:var(--white); padding:8px 20px; border-radius:50px; font-size:13px; font-family:var(--fb); font-weight:700; letter-spacing:1.5px; transition:all var(--tr); border:2px solid var(--teal); }
.topbar-nav .btn-cta:hover { background:var(--teal-dark); }
.topbar-nav .btn-cta::after { display:none; }

/* ── Dropdown Contact ── */
.nav-dropdown { position:relative; }
.nav-dropdown-btn { background:var(--teal); color:var(--white); padding:8px 20px; border-radius:50px; font-size:13px; font-family:var(--fb); font-weight:700; letter-spacing:1.5px; text-transform:uppercase; transition:all var(--tr); border:2px solid var(--teal); cursor:pointer; display:inline-flex; align-items:center; gap:6px; }
.nav-dropdown-btn:hover, .nav-dropdown-btn[aria-expanded="true"] { background:var(--teal-dark); }
.dropdown-arrow { font-size:10px; transition:transform .2s ease; display:inline-block; }
.nav-dropdown-btn[aria-expanded="true"] .dropdown-arrow { transform:rotate(180deg); }
.nav-dropdown-menu {
  position:absolute; top:calc(100% + 8px); right:0;
  background:var(--white); border-radius:14px;
  box-shadow:0 12px 40px rgba(8,94,84,.18); border:1.5px solid rgba(8,94,84,.1);
  padding:8px; min-width:210px;
  opacity:0; pointer-events:none; visibility:hidden; transform:translateY(8px);
  transition:all .22s ease; z-index:200; list-style:none;
}
.nav-dropdown-menu.open { opacity:1; pointer-events:auto; visibility:visible; transform:translateY(0); }
.nav-dropdown-menu li { list-style:none; }
.dropdown-link { display:block; padding:10px 14px; font-size:13px; font-weight:600; color:var(--dark); font-family:var(--fb); border-radius:9px; transition:background var(--tr),color var(--tr); letter-spacing:.3px; }
.dropdown-link:hover { background:var(--cream); color:var(--teal); }

/* ══════════════════════════════
   MENU OVERLAY
══════════════════════════════ */
.menu-overlay {
  position:fixed; inset:0;
  background:linear-gradient(160deg, #043D36 0%, #064e45 40%, #085E54 70%, #0A7A6C 100%);
  opacity:0; pointer-events:none; visibility:hidden;
  transition:opacity .38s ease, visibility .38s ease;
  z-index:1000; overflow:hidden;
}
.menu-overlay.active { opacity:1; pointer-events:auto; visibility:visible; }
.falling-apples { position:absolute; inset:0; pointer-events:none !important; overflow:hidden; z-index:2; }
.apple-fall { position:absolute; top:-80px; animation:applefall linear forwards; opacity:.55; pointer-events:none !important; user-select:none; }
.menu-content { position:absolute; inset:0; z-index:3; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:70px var(--gap) 40px; pointer-events:none; }
.menu-content > * { pointer-events:auto; }
.close-btn {
  position:fixed; top:12px; right:20px; width:46px; height:46px; border-radius:50%;
  background:rgba(255,255,255,.2); border:2px solid rgba(255,255,255,.4);
  color:var(--white); font-size:20px; line-height:1;
  display:flex; align-items:center; justify-content:center;
  z-index:1001; cursor:pointer; pointer-events:auto !important;
  transition:background .2s ease, transform .25s ease;
  -webkit-tap-highlight-color:transparent; isolation:isolate;
}
.close-btn:hover, .close-btn:focus-visible { background:rgba(255,255,255,.35); transform:rotate(90deg) scale(1.05); outline:none; }
.menu-links { display:flex; flex-direction:column; align-items:center; gap:clamp(2px, 1.2vh, 10px); text-align:center; margin-bottom:20px; }
.menu-links li { overflow:hidden; }
.menu-links a { display:inline-block; color:var(--white); font-family:var(--ft); font-size:clamp(32px, 6.5vw, 66px); font-weight:700; line-height:1.1; letter-spacing:.5px; transition:color .25s, transform .25s; }
.menu-links a:hover { color:var(--yellow); transform:translateX(10px); }
.menu-tagline { color:rgba(255,255,255,.38); font-size:10px; letter-spacing:3.5px; text-transform:uppercase; font-weight:600; font-family:var(--fb); pointer-events:none; }

/* ══════════════════════════════
   BOUTONS
══════════════════════════════ */
.btn-primary {
  display:inline-flex; align-items:center; gap:8px;
  background:var(--teal); color:var(--white); padding:14px 36px; border-radius:50px;
  font-family:var(--fb); font-size:14px; font-weight:700; letter-spacing:2px; text-transform:uppercase;
  border:2px solid var(--teal); transition:all var(--tr); box-shadow:0 4px 18px rgba(8,94,84,.28);
}
.btn-primary:hover { background:var(--teal-dark); transform:translateY(-2px); box-shadow:0 8px 28px rgba(8,94,84,.38); }
.btn-secondary {
  display:inline-flex; align-items:center; gap:8px;
  background:transparent; color:var(--teal); padding:14px 36px; border-radius:50px;
  border:2px solid var(--teal); font-family:var(--fb); font-size:14px; font-weight:700;
  letter-spacing:2px; text-transform:uppercase; transition:all var(--tr);
}
.btn-secondary:hover { background:var(--teal); color:var(--white); transform:translateY(-2px); }

/* ══════════════════════════════
   HERO — FLYER
══════════════════════════════ */
.hero { position:relative; overflow:hidden; background:var(--cream); }
.hero--flyer {
  display:flex;
  min-height:clamp(600px, 96vh, 940px);
  padding-top:var(--topbar-h);
}

/* Le "flyer" occupe toute la largeur de la page d'accueil */
.flyer-frame {
  position:relative;
  width:100%;
  display:flex; flex-direction:column;
}

/* Bloc photo : une tranche de verger (peu de ciel), qui bascule sur un aplat vert où le texte est centré */
.flyer-photos {
  position:relative;
  flex:1;
  min-height:0;
  overflow:hidden;
  background:var(--teal-dark);
}
.flyer-photo {
  position:absolute; top:0; left:0; right:0;
  width:100%; height:78%;
  object-fit:cover; object-position:center 100%;
  display:block;
}

.flyer-scrim {
  position:absolute; inset:0;
  background:linear-gradient(to bottom, transparent 0%, transparent 55%, var(--teal-dark) 74%, var(--teal-dark) 100%);
  pointer-events:none;
}

.flyer-banner {
  position:absolute; left:0; right:0; top:68%; bottom:0; z-index:2;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center;
  padding:0 var(--gap);
}
.flyer-title { font-family:var(--ft); font-weight:700; font-size:clamp(30px,6.5vw,46px); line-height:1.12; color:var(--cream); margin-bottom:12px; }
.flyer-title .amp { color:var(--beige); font-family:var(--fb); font-style:italic; font-weight:700; font-size:.55em; }
.flyer-title .accent { color:var(--yellow); }
.flyer-vente { font-family:var(--ft); font-size:20px; letter-spacing:3px; color:var(--white); margin-bottom:12px; }
.flyer-phone { display:inline-flex; align-items:center; gap:8px; font-weight:700; color:var(--beige); font-size:15px; transition:color var(--tr); }
.flyer-phone:hover { color:var(--yellow); }

/* ══════════════════════════════
   VALUES BAND
══════════════════════════════ */
.values-band { background:var(--teal); padding:15px var(--gap); }
.values-inner { display:flex; align-items:center; justify-content:center; gap:clamp(14px,3vw,32px); flex-wrap:wrap; max-width:var(--wrap); margin:0 auto; }
.value-item { display:flex; align-items:center; gap:8px; color:var(--white); font-size:11px; letter-spacing:2px; text-transform:uppercase; font-weight:600; font-family:var(--fb); }
.value-icon { font-size:17px; }
.value-sep { color:rgba(255,255,255,.25); font-size:16px; }

/* ══════════════════════════════
   SECTION BASE
══════════════════════════════ */
.section { padding:clamp(60px,10vw,100px) var(--gap); position:relative; }
.section-wrap { max-width:var(--wrap); margin:0 auto; }
.section-label { font-size:10px; letter-spacing:4px; text-transform:uppercase; color:var(--gray-light); margin-bottom:8px; font-weight:600; display:block; font-family:var(--fb); }
.section-hd { text-align:center; margin-bottom:clamp(36px,6vw,60px); }
.section-hd h2 { font-family:var(--ft); font-weight:700; font-size:clamp(42px,6vw,70px); color:var(--teal); margin-bottom:12px; line-height:1.05; }
.section-hd p { font-size:16px; color:var(--gray); max-width:480px; margin:0 auto; font-family:var(--fb); font-weight:400; }
.brand-diamond { color:var(--yellow); font-size:.7em; vertical-align:middle; display:inline-block; margin-left:4px; }
.brand-heart { color:var(--violet); }

/* ══════════════════════════════
   NOS JUS
══════════════════════════════ */
.jus-section { background:var(--cream); }
.jus-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(min(260px,100%), 1fr)); gap:clamp(16px,3vw,28px); }
.juice-card { background:var(--white); border-radius:var(--r); overflow:hidden; border:2px solid transparent; box-shadow:0 4px 18px rgba(8,94,84,.07); transition:transform var(--tr), box-shadow var(--tr), border-color var(--tr); }
.juice-card:hover { transform:translateY(-7px); box-shadow:var(--sh-h); border-color:var(--green); }
.juice-card-img { width:100%; aspect-ratio:3/4; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
.juice-card[data-f="pomme"]    .juice-card-img { background:linear-gradient(150deg,#FFFDE8,#FFF3A0); }
.juice-card[data-f="hibiscus"] .juice-card-img { background:linear-gradient(150deg,#FDE8F3,#EDAFD0); }
.juice-card[data-f="miel"]     .juice-card-img { background:linear-gradient(150deg,#FFF8DC,#FCCF00 120%); }
.juice-card[data-f="bissap"]   .juice-card-img { background:linear-gradient(150deg,#F5E8EF,#D06890); }
.juice-card-overlay { position:absolute; inset:0; background:rgba(8,94,84,.93); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:16px 14px; opacity:0; transition:opacity .35s ease; overflow-y:auto; }
.juice-card:hover .juice-card-overlay { opacity:1; }
.juice-card-overlay .tag { display:inline-block; background:var(--yellow); color:var(--dark); font-size:9px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; padding:3px 12px; border-radius:50px; margin-bottom:8px; font-family:var(--fb); flex-shrink:0; }
.juice-card-overlay p { color:var(--white); font-size:clamp(11px,1.2vw,14px); line-height:1.5; text-align:center; font-family:var(--fb); font-weight:400; }
.juice-card-body { padding:16px 20px 20px; }
.juice-card-body h3 { font-family:var(--ft); font-weight:700; font-size:24px; color:var(--teal); margin-bottom:4px; line-height:1.1; }
.juice-card-body h3 strong { font-weight:700; }
.juice-vol { font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--gray-light); font-weight:600; font-family:var(--fb); }

.juice-card-img--photo { position:relative; overflow:hidden; }
.juice-card-img--photo .juice-bottle-img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; padding:12px; display:block; }
.juice-card[data-f="pomme"]    .juice-card-img--photo { background-color:#FFF8DC; }
.juice-card[data-f="hibiscus"] .juice-card-img--photo { background-color:#FDE8F3; }
.juice-card[data-f="miel"]     .juice-card-img--photo { background-color:#FFF3C0; }
.juice-card[data-f="bissap"]   .juice-card-img--photo { background-color:#F5E8EF; }
.juice-card[data-f="trio"]     .juice-card-img--photo { background-color:#FFF3E8; }

.juice-ingredients-inline { margin:10px 0 8px; padding:10px 12px; background:var(--cream); border-radius:10px; border:1px solid rgba(8,94,84,.1); }
.ji-label { display:block; font-size:9px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--gray-light); margin-bottom:7px; font-family:var(--fb); }
.ji-list { display:flex; flex-wrap:wrap; gap:8px; }
.ji-item { display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:600; color:var(--teal); font-family:var(--fb); }
.ji { display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:50%; background:var(--cream); border:1.5px solid rgba(8,94,84,.13); box-shadow:0 2px 8px rgba(8,94,84,.07); transition:transform var(--tr); cursor:default; font-size:14px; }
.ji:hover { transform:scale(1.2); }

.juice-tags-row { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.juice-badge { display:inline-block; font-size:9px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; padding:3px 10px; border-radius:50px; background:rgba(8,94,84,.09); color:var(--teal); font-family:var(--fb); }
.juice-badge--spicy { background:rgba(173,28,105,.1); color:var(--violet); }
.juice-badge--sweet { background:rgba(252,207,0,.18); color:#7a6000; }
.juice-badge--floral { background:rgba(173,28,105,.1); color:var(--violet); }

/* ── Carte "Devenir revendeur" dans la grille de jus ── */
.juice-card--revendeur {
  background:linear-gradient(160deg,var(--violet) 0%,#7d1552 100%);
  color:var(--white); cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  padding:32px 22px; min-height:100%;
}
.rv-card-inner { text-align:center; }
.rv-card-icon { font-size:44px; margin-bottom:10px; }
.rv-card-title { font-family:var(--ft); font-size:28px; font-weight:700; line-height:1.15; margin-bottom:10px; }
.rv-card-text { font-size:13px; line-height:1.55; opacity:.85; margin-bottom:20px; font-family:var(--fb); font-weight:400; }
.rv-card-btn { display:inline-flex; align-items:center; gap:6px; background:rgba(255,255,255,.15); border:1.5px solid rgba(255,255,255,.4); padding:9px 20px; border-radius:50px; font-size:12px; font-weight:700; letter-spacing:1px; text-transform:uppercase; transition:background var(--tr); }
.juice-card--revendeur:hover .rv-card-btn { background:rgba(255,255,255,.32); }

/* ══════════════════════════════
   AUGUSTIN
══════════════════════════════ */
.augustin-section { background:var(--teal); color:var(--white); }
.augustin-section .section-label { color:rgba(255,255,255,.6); }
.augustin-section h2 { color:var(--yellow); }
.augustin-section p { color:rgba(255,255,255,.75); }
.augustin-inner { display:grid; grid-template-columns:1fr 1fr; gap:clamp(36px,8vw,80px); align-items:center; }
.augustin-photo { position:relative; }
.photo-blob { width:100%; aspect-ratio:4/5; border-radius:60% 40% 52% 48% / 48% 60% 40% 52%; overflow:hidden; background:linear-gradient(145deg,#91CF5C,#5A9A30); display:flex; align-items:center; justify-content:center; font-size:100px; }
.photo-blob img { width:100%; height:100%; object-fit:cover; }
.aug-badge { position:absolute; bottom:-10px; right:-10px; width:86px; height:86px; border-radius:50%; background:var(--yellow); display:flex; align-items:center; justify-content:center; font-size:32px; box-shadow:0 6px 24px rgba(0,0,0,.12); }
.aug-badge--brand { background:var(--yellow); display:flex; align-items:center; justify-content:center; padding:0; width:86px; height:86px; overflow:hidden; }
.aug-badge--brand svg { width:44px; height:44px; flex-shrink:0; }
.augustin-text .section-label { text-align:left; }
.augustin-text h2 { font-family:var(--ft); font-weight:700; font-size:clamp(36px,5vw,58px); margin-bottom:6px; line-height:1.05; }
.aug-wavy { font-family:var(--ft); font-size:20px; color:rgba(255,255,255,.3); letter-spacing:3px; margin-bottom:16px; }
.aug-lead { font-weight:700; font-size:16px; color:rgba(255,255,255,.9); margin-bottom:14px; line-height:1.5; font-family:var(--fb); }
.aug-sig { font-family:var(--ft); font-size:38px; font-weight:700; color:var(--yellow); margin-top:10px; line-height:1; }

/* ══════════════════════════════
   GALERIE + LIGHTBOX
══════════════════════════════ */
.galerie-section { background:var(--cream); }
.gallery-grid { display:grid; grid-template-columns:repeat(3,1fr); grid-auto-rows:220px; gap:clamp(8px,1.5vw,14px); }
.gallery-item { border-radius:14px; overflow:hidden; position:relative; cursor:pointer; background:var(--cream); box-shadow:0 4px 20px rgba(8,94,84,.08); transition:transform var(--tr), box-shadow var(--tr); }
.gallery-item:hover { transform:scale(1.025); box-shadow:var(--sh-h); z-index:2; }
.gallery-item.tall { grid-row:span 2; }
.gallery-item.wide { grid-column:span 2; }
.gallery-item img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.gallery-item:hover img { transform:scale(1.05); }
.gallery-placeholder { width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; color:var(--gray-light); background:var(--cream-mid); }
.gallery-placeholder .ph-icon { font-size:40px; opacity:.5; }
.gallery-placeholder span { font-size:11px; letter-spacing:2px; text-transform:uppercase; font-weight:600; opacity:.5; font-family:var(--fb); }
.gallery-label { position:absolute; bottom:0; left:0; right:0; background:linear-gradient(to top,rgba(8,94,84,.75) 0%,transparent 100%); padding:28px 16px 14px; color:var(--white); font-size:11px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase; opacity:0; transition:opacity .3s ease; font-family:var(--fb); }
.gallery-item:hover .gallery-label { opacity:1; }

.lightbox { position:fixed; inset:0; z-index:990; background:rgba(8,30,18,.92); display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .3s ease; }
.lightbox.active { opacity:1; pointer-events:auto; }
.lightbox-img { max-width:90vw; max-height:88vh; border-radius:12px; object-fit:contain; }
.lightbox-close { position:absolute; top:20px; right:24px; font-size:28px; color:var(--white); background:none; border:none; width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; transition:background var(--tr); }
.lightbox-close:hover { background:rgba(255,255,255,.15); }
.lightbox-prev, .lightbox-next { position:absolute; top:50%; transform:translateY(-50%); font-size:22px; color:var(--white); background:rgba(255,255,255,.12); border:none; width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; transition:background var(--tr); }
.lightbox-prev { left:20px; }
.lightbox-next { right:20px; }
.lightbox-prev:hover, .lightbox-next:hover { background:rgba(255,255,255,.25); }
.lightbox-caption { position:absolute; bottom:20px; left:50%; transform:translateX(-50%); color:rgba(255,255,255,.7); font-size:12px; letter-spacing:2px; text-transform:uppercase; white-space:nowrap; font-family:var(--fb); }

/* ══════════════════════════════
   FABRICATION (parcours en serpentin)
══════════════════════════════ */
.fabrication-section { background:var(--teal); padding:80px 0 60px; overflow:hidden; }
.fabrication-section .section-label { color:rgba(255,255,255,.55); }
.fabrication-section .section-hd h2 { color:var(--yellow); }
.fabrication-section .section-hd p { color:rgba(255,255,255,.70); }

.snake-wrap { max-width:1160px; margin:60px auto 0; display:flex; flex-direction:column; gap:40px; padding:0 var(--gap); }
.snake-row { display:flex; align-items:stretch; position:relative; gap:0; }
.snake-ltr { flex-direction:row; }
.snake-rtl { flex-direction:row-reverse; }
.snake-arrow { display:flex; align-items:center; justify-content:center; font-size:22px; color:rgba(255,255,255,.6); flex-shrink:0; width:32px; align-self:center; }
.snake-turn { display:flex; align-items:flex-end; justify-content:center; font-size:26px; color:var(--yellow); flex-shrink:0; width:32px; padding-bottom:0; margin-bottom:-24px; }
.snake-turn--br { align-self:flex-end; }
.snake-card { flex:1; border-radius:16px; overflow:hidden; display:flex; flex-direction:column; position:relative; box-shadow:0 4px 20px rgba(0,0,0,.15); min-width:0; }
.snake-card--1 { background:#E8A838; color:#18201A; }
.snake-card--2 { background:#AD1C69; color:#fff; }
.snake-card--3 { background:#FAF7E8; color:#18201A; }
.snake-card--4 { background:#E8A838; color:#18201A; }
.snake-card--5 { background:#FAF7E8; color:#18201A; }
.snake-card--6 { background:#AD1C69; color:#fff; }
.snake-card--7 { background:#E8A838; color:#18201A; }
.snake-num { position:absolute; top:8px; left:10px; font-family:var(--ft); font-size:48px; font-weight:700; opacity:.15; line-height:1; z-index:1; }
.snake-img { width:100%; height:130px; object-fit:cover; display:block; flex-shrink:0; }
.snake-img--contain { object-fit:contain; background:rgba(255,255,255,.2); padding:10px; }
.snake-body { padding:12px 14px 16px; flex:1; }
.snake-icon { font-size:22px; margin-bottom:5px; }
.snake-body strong { display:block; font-family:var(--ft); font-size:clamp(13px, 1.6vw, 17px); font-weight:700; margin-bottom:4px; text-transform:uppercase; letter-spacing:.5px; }
.snake-body p { font-size:12px; line-height:1.5; margin:0; opacity:.82; }

.fab-badges { display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin-top:56px; }
.fab-badge { background:rgba(255,255,255,.15); border:1.5px solid rgba(255,255,255,.4); border-radius:100px; padding:10px 20px; font-size:12px; font-weight:600; font-family:var(--fb); letter-spacing:1px; text-transform:uppercase; color:#fff; }

/* ══════════════════════════════
   OÙ NOUS GOÛTER / PRESTATIONS
══════════════════════════════ */
.trouver-section { background:var(--cream); }
.social-pills { display:flex; gap:10px; flex-wrap:wrap; margin-top:4px; }
.social-pill { display:flex; align-items:center; gap:7px; background:var(--cream); border-radius:50px; padding:7px 16px; font-size:13px; font-weight:600; color:var(--teal); border:1.5px solid rgba(8,94,84,.14); transition:all var(--tr); font-family:var(--fb); }
.social-pill:hover { background:var(--teal); color:var(--white); }

.trouver-bloc { display:grid; grid-template-columns:1fr 1.4fr; border-radius:20px; overflow:hidden; box-shadow:0 8px 40px rgba(8,94,84,.13); border:1.5px solid rgba(8,94,84,.1); margin-bottom:clamp(24px,4vw,36px); min-height:440px; }
.trouver-panel { background:var(--white); display:flex; flex-direction:column; gap:0; }
.trouver-panel-top { background:var(--teal); padding:28px 28px 24px; }
.trouver-panel-title { font-family:var(--ft); font-size:28px; font-weight:700; color:var(--white); margin-bottom:8px; }
.trouver-panel-address { font-size:14px; color:rgba(255,255,255,.8); line-height:1.6; font-style:normal; font-family:var(--fb); font-weight:400; }
.trouver-panel-section { padding:20px 28px; border-bottom:1px solid rgba(8,94,84,.07); }
.trouver-panel-section:last-child { border-bottom:none; }
.trouver-panel-label { font-size:10px; letter-spacing:2.5px; text-transform:uppercase; color:var(--gray-light); font-weight:600; margin-bottom:10px; font-family:var(--fb); }
.trouver-horaire-grid { display:flex; flex-direction:column; gap:8px; }
.trouver-horaire-item { display:flex; align-items:center; justify-content:space-between; background:var(--cream); border-radius:10px; padding:10px 16px; }
.thi-days { font-size:14px; font-weight:600; color:var(--dark); font-family:var(--fb); }
.thi-time { font-size:14px; font-weight:700; color:var(--teal); background:rgba(8,94,84,.08); border-radius:50px; padding:3px 12px; font-family:var(--fb); }

.revendeurs-list { list-style:none; display:flex; flex-direction:column; gap:10px; margin-top:8px; }
.revendeur-item { display:flex; align-items:flex-start; gap:12px; padding:12px 14px; background:var(--cream); border-radius:12px; border:1.5px solid rgba(8,94,84,.09); transition:border-color var(--tr), transform var(--tr); }
.revendeur-item:hover { border-color:var(--green); transform:translateX(3px); }
.revendeur-item--cta { background:rgba(8,94,84,.04); border-color:rgba(8,94,84,.18); }
.revendeur-icon { font-size:20px; flex-shrink:0; }
.revendeur-item strong { display:block; font-size:13px; font-weight:700; color:var(--teal); font-family:var(--fb); line-height:1.3; margin-bottom:2px; }
.revendeur-lieu { display:block; font-size:11px; color:var(--gray-light); font-family:var(--fb); font-weight:600; letter-spacing:.5px; }
.revendeur-link { display:inline-block; margin-top:4px; font-size:12px; font-weight:700; color:var(--violet); font-family:var(--fb); text-decoration:underline; transition:color var(--tr); }
.revendeur-link:hover { color:var(--teal); }

.trouver-panel-contacts { display:flex; flex-direction:column; gap:8px; margin-top:auto; }
.trouver-contact-btn { display:flex; align-items:center; gap:10px; font-size:14px; font-weight:600; color:var(--teal); transition:color var(--tr); font-family:var(--fb); }
.trouver-contact-btn:hover { color:var(--violet); }
.trouver-map-full { position:relative; min-height:440px; }
.trouver-map-full iframe { position:absolute; inset:0; width:100%; height:100%; border:none; display:block; }

.prestations-full { background:var(--white); border-radius:20px; border:1.5px solid rgba(8,94,84,.12); box-shadow:0 4px 24px rgba(8,94,84,.07); overflow:hidden; }
.prestations-full-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px 28px; background:linear-gradient(135deg,var(--teal) 0%,var(--teal-light) 100%); flex-wrap:wrap; }
.prestations-full-header h3 { font-family:var(--ft); font-size:clamp(24px,3.5vw,34px); font-weight:700; color:var(--white); margin-bottom:4px; }
.prestations-full-header p { font-size:14px; color:rgba(255,255,255,.8); margin:0; font-family:var(--fb); font-weight:400; }
.presta-volumes { display:grid; grid-template-columns:repeat(5,1fr); gap:0; padding:0; margin:0; }
.presta-vol-card { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; padding:20px 16px; border-right:1px solid rgba(8,94,84,.08); background:var(--white); transition:background var(--tr); text-align:center; }
.presta-vol-card:last-child { border-right:none; }
.presta-vol-card:hover { background:var(--cream); }
.presta-vol-label { font-family:var(--ft); font-size:clamp(20px,2.2vw,28px); font-weight:700; color:var(--teal); }
.presta-vol-badges { display:flex; flex-direction:column; gap:6px; align-items:center; }
.presta-badge { display:inline-flex; align-items:center; gap:5px; background:rgba(145,207,92,.15); border-radius:50px; padding:4px 12px; font-size:12px; font-weight:600; color:var(--teal); white-space:nowrap; border:1px solid rgba(145,207,92,.4); font-family:var(--fb); }
.presta-badge::before { content:'✓'; color:var(--green); font-weight:900; }
.presta-footer { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:16px 28px; background:var(--cream); border-top:1px solid rgba(8,94,84,.08); flex-wrap:wrap; }
.presta-notes { display:flex; flex-direction:column; gap:3px; margin:0; padding:0; }
.presta-notes li { font-size:13px; color:var(--gray); list-style:none; font-family:var(--fb); font-weight:400; }
.presta-contact-note { font-size:13px; color:var(--gray); white-space:nowrap; font-family:var(--fb); }
.presta-contact-note a { color:var(--teal); font-weight:700; text-decoration:underline; }
.btn-revendeur { display:inline-flex; align-items:center; gap:10px; background:var(--violet); color:var(--white); padding:13px 26px; border-radius:50px; border:none; font-family:var(--fb); font-size:14px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; transition:all var(--tr); box-shadow:0 4px 18px rgba(173,28,105,.28); cursor:pointer; }
.btn-revendeur:hover { background:#8e1456; transform:translateY(-2px); box-shadow:0 8px 28px rgba(173,28,105,.38); }

/* ══════════════════════════════
   DEVENIR REVENDEUR
══════════════════════════════ */
.revendeur-section { background:linear-gradient(160deg, var(--teal) 0%, var(--teal-dark) 100%); color:var(--white); overflow:hidden; position:relative; z-index:0; }
.revendeur-inner { display:grid; grid-template-columns:1fr; gap:clamp(30px, 5vw, 50px); align-items:start; position:relative; z-index:1; }
.revendeur-text .section-label { color:rgba(255,255,255,.5); }
.revendeur-text h2 { font-family:var(--ft); font-size:clamp(38px, 5.5vw, 62px); font-weight:700; color:var(--white); margin-bottom:16px; line-height:1.05; }
.revendeur-lead { font-size:16px; color:rgba(255,255,255,.8); line-height:1.7; margin-bottom:28px; font-family:var(--fb); font-weight:400; }
.revendeur-avantages { list-style:none; display:flex; flex-direction:column; gap:16px; }
.revendeur-avantages li { display:flex; gap:14px; align-items:flex-start; }
.rv-icon { font-size:18px; flex-shrink:0; min-width:44px; width:44px; height:44px; background:rgba(255,255,255,.15); border-radius:50%; display:flex; align-items:center; justify-content:center; border:1.5px solid rgba(255,255,255,.25); line-height:1; }
.revendeur-avantages strong { display:block; font-size:14px; font-weight:700; color:var(--white); font-family:var(--fb); margin-bottom:2px; }
.revendeur-avantages p { font-size:13px; color:rgba(255,255,255,.65); line-height:1.55; font-family:var(--fb); font-weight:400; }

/* ══════════════════════════════
   CONTACT
══════════════════════════════ */
.contact-section { background:var(--cream); }
.contact-type-selector { display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-bottom:36px; }
.contact-type-btn { padding:10px 20px; border-radius:50px; border:2px solid rgba(8,94,84,.2); background:transparent; color:var(--gray); font-family:var(--fb); font-size:13px; font-weight:600; letter-spacing:.5px; cursor:pointer; transition:all var(--tr); }
.contact-type-btn:hover { border-color:var(--teal); color:var(--teal); }
.contact-type-btn.active { background:var(--teal); border-color:var(--teal); color:var(--white); box-shadow:0 4px 16px rgba(8,94,84,.22); }
.contact-form-type-label { font-size:10px; font-weight:700; letter-spacing:2.5px; text-transform:uppercase; color:var(--teal); margin-bottom:18px; font-family:var(--fb); padding:7px 14px; background:rgba(8,94,84,.07); border-radius:8px; display:inline-block; }

.contact-wrap { display:grid; grid-template-columns:1fr 1fr; gap:clamp(36px,7vw,70px); align-items:start; }
.contact-wrap--2col { grid-template-columns:1fr 1.5fr; gap:clamp(28px, 4vw, 52px); align-items:start; }
.contact-info h3 { font-family:var(--ft); font-size:34px; font-weight:700; color:var(--teal); margin-bottom:14px; }
.contact-info-row { display:flex; align-items:flex-start; gap:0; margin-top:4px; margin-bottom:4px; }
.contact-address { flex:1; font-style:normal; font-size:14px; line-height:1.7; color:var(--dark); font-family:var(--fb); font-weight:400; padding-right:16px; }
.contact-info-divider { width:1.5px; background:rgba(8,94,84,.15); align-self:stretch; border-radius:2px; flex-shrink:0; margin:4px 0; }
.contact-links { flex:1; display:flex; flex-direction:column; gap:8px; padding-left:16px; }
.contact-links a { color:var(--teal); font-weight:600; font-size:15px; font-family:var(--fb); transition:color var(--tr); }
.contact-links a:hover { color:var(--violet); }
.contact-map-col { margin-top:20px; border-radius:14px; overflow:hidden; border:1.5px solid rgba(8,94,84,.12); box-shadow:0 4px 16px rgba(8,94,84,.07); background:var(--white); }
.contact-map-label { display:flex; align-items:center; gap:6px; font-size:10px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--teal); font-family:var(--fb); padding:9px 14px 7px; border-bottom:1px solid rgba(8,94,84,.07); }
.contact-map-img { display:block; width:100%; height:auto; object-fit:contain; max-height:220px; padding:6px; }

.contact-form-bubble { background:var(--white); border-radius:28px; padding:36px 32px; box-shadow:0 8px 40px rgba(8,94,84,.13); border:1.5px solid rgba(8,94,84,.08); }
.field { position:relative; margin-bottom:18px; }
.field--conditional { transition:opacity .2s ease; }
.field input, .field textarea { width:100%; padding:14px 16px; border:1.5px solid rgba(8,94,84,.18); border-radius:12px; font-family:var(--fb); font-size:14px; color:var(--dark); background:var(--white); outline:none; resize:vertical; transition:border-color var(--tr),box-shadow var(--tr); -webkit-appearance:none; }
.field input:focus, .field textarea:focus { border-color:var(--teal); box-shadow:0 0 0 3px rgba(8,94,84,.09); }
.field label { position:absolute; top:14px; left:16px; font-size:14px; font-family:var(--fb); color:var(--gray-light); pointer-events:none; transition:all .22s ease; background:var(--white); padding:0 4px; font-weight:400; }
.field input:focus~label, .field input:not(:placeholder-shown)~label,
.field textarea:focus~label, .field textarea:not(:placeholder-shown)~label { top:-10px; font-size:10px; color:var(--teal); letter-spacing:1.5px; text-transform:uppercase; font-weight:700; }
.field-error { display:block; font-size:11px; color:var(--violet); margin-top:4px; font-weight:700; font-family:var(--fb); }
.btn-submit { width:100%; padding:14px; background:var(--teal); color:var(--white); border:none; border-radius:12px; font-family:var(--fb); font-size:13px; font-weight:700; letter-spacing:2px; text-transform:uppercase; transition:all var(--tr); display:flex; align-items:center; justify-content:center; gap:8px; }
.btn-submit:hover { background:var(--teal-dark); transform:translateY(-2px); }
.btn-submit:disabled { opacity:.7; cursor:not-allowed; transform:none; }
.form-success { text-align:center; color:var(--teal); font-weight:700; font-size:14px; margin-top:12px; min-height:20px; font-family:var(--fb); }

/* ══════════════════════════════
   MODAL
══════════════════════════════ */
.modal-overlay { position:fixed; inset:0; z-index:980; background:rgba(8,30,18,.6); backdrop-filter:blur(6px); display:flex; align-items:center; justify-content:center; padding:var(--gap); opacity:0; pointer-events:none; transition:opacity .3s ease; }
.modal-overlay.active { opacity:1; pointer-events:auto; }
.modal-box { background:var(--white); border-radius:22px; padding:clamp(20px,5vw,40px); max-width:520px; width:100%; max-height:90vh; overflow-y:auto; position:relative; box-shadow:0 20px 70px rgba(8,30,18,.2); transform:translateY(22px); transition:transform .3s ease; }
.modal-overlay.active .modal-box { transform:translateY(0); }
.modal-close { position:absolute; top:14px; right:14px; width:36px; height:36px; border-radius:50%; background:var(--cream); border:none; font-size:16px; color:var(--gray); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background var(--tr),color var(--tr); z-index:10; }
.modal-close:hover { background:var(--teal); color:var(--white); }
.modal-hd { margin-bottom:20px; padding-right:28px; }
.modal-hd h2 { font-family:var(--ft); font-size:clamp(24px,4vw,38px); font-weight:700; color:var(--teal); margin-bottom:5px; }
.modal-hd p { font-size:14px; color:var(--gray); line-height:1.6; font-family:var(--fb); font-weight:400; }

/* ══════════════════════════════
   FOOTER
══════════════════════════════ */
.footer { background:var(--dark); color:var(--white); padding:clamp(40px,7vw,60px) var(--gap) 28px; }
.footer-inner { max-width:var(--wrap); margin:0 auto; display:grid; grid-template-columns:auto 1fr auto; gap:clamp(24px,4vw,44px); align-items:center; margin-bottom:28px; }
.footer-logo { font-family:var(--ft); font-size:38px; font-weight:700; color:var(--yellow); display:block; line-height:1; }
.footer-sub { font-size:9px; letter-spacing:2.5px; text-transform:uppercase; color:rgba(255,255,255,.3); font-weight:600; display:block; font-family:var(--fb); }
.footer-logo-img { height:60px; width:auto; display:block; object-fit:contain; mix-blend-mode:screen; opacity:.85; }
.footer-nav { display:flex; gap:clamp(14px,2.5vw,26px); justify-content:center; flex-wrap:wrap; }
.footer-nav a { font-size:11px; letter-spacing:1.5px; text-transform:uppercase; font-weight:600; color:rgba(255,255,255,.45); transition:color var(--tr); font-family:var(--fb); }
.footer-nav a:hover { color:var(--yellow); }
.footer-social { display:flex; gap:10px; }
.footer-social a { width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center; color:var(--white); transition:background var(--tr); }
.footer-social a:hover { background:var(--teal); }
.footer-social a svg { width:18px; height:18px; }
.footer-bottom { max-width:var(--wrap); margin:0 auto; border-top:1px solid rgba(255,255,255,.08); padding-top:18px; font-size:11px; color:rgba(255,255,255,.28); display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; font-family:var(--fb); }

/* ══════════════════════════════
   KEYFRAMES
══════════════════════════════ */
@keyframes applefall { to { transform:translateY(110vh) rotate(360deg); opacity:0; } }
@keyframes bounce { 0%,100%{transform:translateY(0);opacity:.35;} 50%{transform:translateY(8px);opacity:1;} }

/* ══════════════════════════════
   ACCESSIBILITÉ
══════════════════════════════ */
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
}