/* ═══════════════════════════════════════════════════════════════════
   PDA Île-de-France — Pharmacie Santé Bornes
   style-main.css v2.0
   ═══════════════════════════════════════════════════════════════════ */

/* ── TOKENS ── */
:root {
  --navy:        #0D1F3C;
  --navy-light:  #1E4080;
  --teal:        #0F6E76;
  --teal-light:  #2AABB5;
  --teal-pale:   #E8F7F8;
  --gold:        #C8A96E;
  --white:       #FFFFFF;
  --off-white:   #F5F7FA;
  --gray-100:    #EDF0F5;
  --gray-200:    #D0D7E5;
  --gray-400:    #8090A8;
  --gray-500:    #5E6E84;  /* contrast ≥4.5:1 sur blanc */
  --text:        #0D1F3C;
  --text-light:  #3A4A5E;  /* contrast ≥7:1 sur blanc */
  --border:      rgba(13,31,60,.1);
  --border-med:  rgba(13,31,60,.18);
  --radius:      12px;
  --radius-lg:   20px;
  --radius-xl:   28px;
  --shadow-sm:   0 2px 8px rgba(13,31,60,.07);
  --shadow-md:   0 6px 24px rgba(13,31,60,.10);
  --shadow-lg:   0 16px 48px rgba(13,31,60,.14);
  --shadow-teal: 0 8px 28px rgba(15,110,118,.28);
  --trans:       .22s ease;
}

/* ── RESET ── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html { scroll-behavior:smooth; font-size:18px; -webkit-text-size-adjust:100% }
body { font-family:'DM Sans',sans-serif; font-weight:400; color:var(--text); background:var(--white); line-height:1.85; overflow-x:hidden }
img { max-width:100%; display:block }
a { color:inherit }

/* Reduced motion */
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important }
}


/* ════════════════════════════════════════════
   NAVIGATION
   ════════════════════════════════════════════ */
nav {
  position:relative; top:auto; left:auto; right:auto; z-index:200;
  background:rgba(13,31,60,.97); backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.07);
  padding:0 2.5rem; height:68px;
  display:flex; align-items:center; justify-content:space-between;
  transition:box-shadow var(--trans);
}
nav.scrolled { box-shadow:0 4px 32px rgba(0,0,0,.25) }

.nav-logo { display:flex; align-items:center; gap:11px; text-decoration:none }
.nav-logo-icon { width:36px; height:36px; background:var(--teal-light); border-radius:8px; display:flex; align-items:center; justify-content:center; flex-shrink:0 }
.nav-logo-icon svg { width:20px; height:20px; fill:white }
.nav-logo-text { font-weight:600; font-size:.875rem; color:var(--white); letter-spacing:.01em; line-height:1.3 }
.nav-logo-text span { color:var(--teal-light); display:block; font-size:.7rem; font-weight:400; letter-spacing:.04em }

.nav-links { display:flex; align-items:center; gap:1.75rem; list-style:none }
.nav-links a {
  font-size:.875rem; font-weight:500; color:rgba(255,255,255,.72); text-decoration:none;
  position:relative; padding-bottom:3px; transition:color var(--trans);
}
.nav-links a::after {
  content:''; position:absolute; bottom:0; left:0; width:0; height:2px;
  background:var(--teal-light); border-radius:2px; transition:width var(--trans);
}
.nav-links a:hover { color:var(--white) }
.nav-links a:hover::after { width:100% }

.nav-cta {
  background:var(--teal-light) !important; color:white !important;
  padding:8px 20px !important; border-radius:7px !important;
  font-weight:600 !important; transition:background var(--trans), transform var(--trans) !important;
}
.nav-cta::after { display:none !important }
.nav-cta:hover { background:var(--teal) !important; transform:translateY(-1px) }

/* Hamburger */
.nav-hamburger {
  display:none; flex-direction:column; gap:5px; cursor:pointer;
  background:none; border:none; padding:4px; z-index:210;
}
.nav-hamburger span {
  display:block; width:24px; height:2px; background:white; border-radius:2px;
  transition:transform var(--trans), opacity var(--trans);
}
.nav-hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg) }
.nav-hamburger.open span:nth-child(2) { opacity:0 }
.nav-hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg) }

/* Mobile drawer */
.nav-drawer {
  position:fixed; top:0; right:0; bottom:0; width:min(320px,85vw);
  background:var(--navy); z-index:205; padding:90px 2rem 2rem;
  transform:translateX(100%); transition:transform .32s ease;
  box-shadow:-8px 0 40px rgba(0,0,0,.3); overflow-y:auto;
}
.nav-drawer.open { transform:translateX(0) }
.nav-drawer ul { list-style:none; display:flex; flex-direction:column; gap:.25rem }
.nav-drawer a {
  display:block; padding:.85rem 1rem; color:rgba(255,255,255,.78);
  font-size:1rem; font-weight:500; text-decoration:none;
  border-radius:8px; transition:background var(--trans), color var(--trans);
}
.nav-drawer a:hover { background:rgba(255,255,255,.07); color:white }
.nav-drawer .drawer-cta {
  display:block; margin-top:1.5rem; background:var(--teal-light); color:white;
  text-align:center; padding:13px; border-radius:10px; font-weight:600;
  text-decoration:none; transition:background var(--trans);
}
.nav-drawer .drawer-cta:hover { background:var(--teal) }
.nav-overlay {
  position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:204;
  opacity:0; pointer-events:none; transition:opacity var(--trans);
}
.nav-overlay.open { opacity:1; pointer-events:auto }


/* ════════════════════════════════════════════
   HÉRO
   ════════════════════════════════════════════ */
.hero {
  min-height:100vh; background:var(--navy);
  display:flex; align-items:center; position:relative;
  overflow:hidden; overflow:clip; /* clip ne crée pas de stacking context → badge visible */
}
.hero-bg {
  position:absolute; inset:0;
  background:radial-gradient(ellipse 60% 55% at 80% 30%,rgba(42,171,181,.14) 0%,transparent 65%),
             radial-gradient(ellipse 40% 45% at 15% 70%,rgba(30,64,128,.35) 0%,transparent 65%);
}
.hero-grid {
  position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);
  background-size:64px 64px;
}
.hero-wrap {
  max-width:1200px; margin:0 auto; padding:6rem 2.5rem 5rem;
  position:relative; z-index:2;
  display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center;
}
.hero-badge {
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(42,171,181,.13); border:1px solid rgba(42,171,181,.32);
  border-radius:100px; padding:6px 16px; margin-bottom:2rem;
  font-size:.775rem; font-weight:500; color:var(--teal-light);
  letter-spacing:.05em; text-transform:uppercase;
}
.hero-badge-dot { width:6px; height:6px; background:var(--teal-light); border-radius:50%; animation:pulse 2.2s infinite }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.3} }

.hero h1 {
  font-family:'Playfair Display',serif;
  font-size:clamp(2rem,3.6vw,3.2rem); font-weight:700;
  line-height:1.14; color:var(--white); margin-bottom:1.75rem; letter-spacing:-.015em;
}
.hero h1 em { font-style:normal; color:var(--teal-light) }
.hero-desc { font-size:1.0625rem; color:rgba(255,255,255,.65); line-height:1.88; margin-bottom:2.75rem; max-width:500px }
.hero-actions { display:flex; gap:1rem; flex-wrap:wrap }

.btn-primary {
  display:inline-flex; align-items:center; gap:8px;
  background:var(--teal-light); color:white;
  padding:14px 28px; border-radius:9px; font-weight:600; font-size:.9375rem;
  text-decoration:none; border:none; cursor:pointer;
  transition:background var(--trans), transform var(--trans), box-shadow var(--trans);
}
.btn-primary:hover { background:var(--teal); transform:translateY(-2px); box-shadow:var(--shadow-teal) }

.btn-secondary {
  display:inline-flex; align-items:center; gap:8px;
  background:transparent; color:rgba(255,255,255,.78);
  padding:14px 28px; border-radius:9px; font-weight:500; font-size:.9375rem;
  text-decoration:none; border:1px solid rgba(255,255,255,.2);
  transition:background var(--trans), border-color var(--trans), color var(--trans);
}
.btn-secondary:hover { background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.4); color:white }

.hero-stats { display:flex; gap:2.25rem; margin-top:3.25rem; padding-top:2.25rem; border-top:1px solid rgba(255,255,255,.1) }
.hero-stat-val { font-family:'Playfair Display',serif; font-size:2rem; font-weight:700; color:var(--white); line-height:1 }
.hero-stat-lbl { font-size:.72rem; color:rgba(255,255,255,.42); text-transform:uppercase; letter-spacing:.07em; margin-top:5px }

/* Hero card */
.hero-visual { position:relative; overflow:visible }
.hero-card {
  background:rgba(255,255,255,.055); border:1px solid rgba(255,255,255,.1);
  border-radius:var(--radius-lg); padding:1.85rem; backdrop-filter:blur(12px);
}
.hero-card-hd { display:flex; align-items:center; gap:12px; margin-bottom:1.25rem; padding-bottom:1.25rem; border-bottom:1px solid rgba(255,255,255,.08) }
.hero-card-ico { width:44px; height:44px; background:var(--teal); border-radius:10px; display:flex; align-items:center; justify-content:center }
.hero-card-ico svg { width:24px; height:24px; fill:white }
.hero-card-title { font-weight:600; color:white; font-size:.9375rem }
.hero-card-sub { font-size:.78rem; color:rgba(255,255,255,.42); margin-top:2px }
.rt-badge { display:inline-flex; align-items:center; gap:6px; background:rgba(42,171,181,.16); border:1px solid rgba(42,171,181,.28); border-radius:6px; padding:4px 10px; font-size:.68rem; font-weight:600; color:var(--teal-light); text-transform:uppercase; letter-spacing:.05em; margin-bottom:1rem }
.sachet-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin-bottom:1.25rem }
.sachet { background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.09); border-radius:6px; padding:8px 6px; text-align:center }
.sachet-time { font-size:.6rem; font-weight:600; color:var(--teal-light); text-transform:uppercase; letter-spacing:.05em; margin-bottom:5px }
.sachet-dots { display:flex; justify-content:center; gap:3px; flex-wrap:wrap }
.dot { width:7px; height:7px; border-radius:50% }
.db{background:#6FA3E8} .dw{background:rgba(255,255,255,.7)} .dg{background:var(--gold)} .dn{background:#5DC27A} .dt{background:var(--teal-light)}
.info-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px }
.info-chip { background:rgba(15,110,118,.15); border:1px solid rgba(42,171,181,.18); border-radius:6px; padding:8px 12px }
.info-chip-lbl { font-size:.6rem; color:rgba(255,255,255,.38); text-transform:uppercase; letter-spacing:.05em; margin-bottom:2px }
.info-chip-val { font-size:.8125rem; font-weight:600; color:var(--white) }
.float-badge { margin-left:auto; background:var(--teal); color:white; border-radius:10px; padding:8px 12px; font-size:.72rem; font-weight:700; text-align:center; line-height:1.4; box-shadow:var(--shadow-teal); white-space:nowrap; flex-shrink:0 }


/* ════════════════════════════════════════════
   SECTIONS — BASE
   ════════════════════════════════════════════ */
section { padding:7rem 2.5rem }
.container { max-width:1200px; margin:0 auto }
.sec-lbl { font-size:.72rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--teal); margin-bottom:1.1rem }
.sec-title { font-family:'Playfair Display',serif; font-size:clamp(1.875rem,2.8vw,2.75rem); font-weight:700; line-height:1.18; color:var(--navy); margin-bottom:1.5rem }
.sec-desc { font-size:1.125rem; color:var(--text-light); line-height:1.88; max-width:620px }

/* Entrée au scroll */
.reveal {
  opacity:0; transform:translateY(28px);
  transition:opacity .6s ease, transform .6s ease;
}
.reveal.visible { opacity:1; transform:translateY(0) }
.reveal-delay-1 { transition-delay:.1s }
.reveal-delay-2 { transition-delay:.2s }
.reveal-delay-3 { transition-delay:.3s }
.reveal-delay-4 { transition-delay:.4s }


/* ════════════════════════════════════════════
   PHOTO STRIP
   ════════════════════════════════════════════ */
.photo-strip-wrap { background:var(--navy) }
.photo-strip { display:grid; grid-template-columns:2fr 1fr 1fr; gap:.875rem; max-width:1200px; margin:0 auto; padding:0 2.5rem 5rem }
.photo-strip-item { position:relative; overflow:hidden; border-radius:var(--radius) }
.photo-strip-item img { width:100%; height:260px; object-fit:cover; filter:brightness(.82); transition:filter .35s ease, transform .45s ease }
.photo-strip-item:hover img { filter:brightness(1); transform:scale(1.04) }
.photo-strip-caption { position:absolute; bottom:0; left:0; right:0; padding:.75rem 1rem; background:linear-gradient(transparent,rgba(13,31,60,.72)); color:white; font-size:.75rem; font-weight:500; letter-spacing:.02em }


/* ════════════════════════════════════════════
   NOTRE PHARMACIE
   ════════════════════════════════════════════ */
.about { background:var(--off-white) }
.about-layout { display:grid; grid-template-columns:1.1fr 1fr; gap:5.5rem; align-items:start }
.about-stats { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:2.5rem }
.about-stat {
  background:var(--white); border:1px solid var(--border); border-radius:var(--radius);
  padding:1.5rem; text-align:center;
  transition:transform var(--trans), box-shadow var(--trans);
}
.about-stat:hover { transform:translateY(-3px); box-shadow:var(--shadow-md) }
.about-stat-val { font-family:'Playfair Display',serif; font-size:2.25rem; font-weight:700; color:var(--teal); line-height:1 }
.about-stat-lbl { font-size:.8125rem; color:var(--text-light); margin-top:5px; line-height:1.45 }

.team-card { background:var(--white); border:1px solid var(--border); border-radius:var(--radius-lg); padding:2.25rem }
.team-card-title { font-weight:600; font-size:1rem; color:var(--navy); margin-bottom:1.5rem; padding-bottom:1rem; border-bottom:1px solid var(--border) }
.team-member { display:flex; align-items:flex-start; gap:14px; padding:1.1rem 0; border-bottom:1px solid var(--border) }
.team-member:last-child { border-bottom:none; padding-bottom:0 }
.team-avatar { width:44px; height:44px; border-radius:50%; background:rgba(15,110,118,.1); display:flex; align-items:center; justify-content:center; font-family:'Playfair Display',serif; font-size:.95rem; font-weight:700; color:var(--teal); flex-shrink:0 }
.team-name { font-weight:600; font-size:.9375rem; color:var(--navy) }
.team-role { font-size:.8125rem; color:var(--text-light); margin-top:2px }
.team-tag { display:inline-block; background:rgba(15,110,118,.1); color:var(--teal); border-radius:4px; padding:2px 8px; font-size:.6875rem; font-weight:600; margin-top:4px }


/* ════════════════════════════════════════════
   AUTOMATE
   ════════════════════════════════════════════ */
.automate { background:var(--white) }
.automate-layout { display:grid; grid-template-columns:1fr 1fr; gap:5.5rem; align-items:start }
.machine-card { background:var(--navy); border-radius:var(--radius-lg); padding:2.75rem; position:relative; overflow:hidden }
.machine-card::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 70% 50% at 50% 0%,rgba(42,171,181,.18) 0%,transparent 70%) }
.machine-lbl { font-size:.6875rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--teal-light); margin-bottom:.6rem; position:relative }
.machine-name { font-family:'Playfair Display',serif; font-size:2rem; font-weight:700; color:white; margin-bottom:1.1rem; position:relative }
.machine-desc { font-size:.9375rem; color:rgba(255,255,255,.58); line-height:1.82; margin-bottom:1.85rem; position:relative }
.machine-specs { display:grid; grid-template-columns:1fr 1fr; gap:8px; position:relative }
.machine-spec { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08); border-radius:8px; padding:10px 14px }
.machine-spec-lbl { font-size:.6875rem; color:rgba(255,255,255,.38); text-transform:uppercase; letter-spacing:.05em; margin-bottom:2px }
.machine-spec-val { font-size:.875rem; font-weight:600; color:white }
.machine-note { margin-top:1.5rem; padding-top:1.25rem; border-top:1px solid rgba(255,255,255,.08); font-size:.8125rem; color:rgba(255,255,255,.38); position:relative }

.features { display:flex; flex-direction:column; gap:1.25rem }
.feat-row {
  display:flex; align-items:flex-start; gap:1rem; padding:1.375rem;
  background:var(--off-white); border:1px solid var(--border); border-radius:var(--radius);
  transition:transform var(--trans), box-shadow var(--trans), border-color var(--trans);
}
.feat-row:hover { transform:translateY(-2px); box-shadow:var(--shadow-md); border-color:rgba(15,110,118,.2) }
.feat-ico { width:40px; height:40px; background:rgba(15,110,118,.11); border-radius:10px; display:flex; align-items:center; justify-content:center; flex-shrink:0 }
.feat-ico svg { width:20px; height:20px; fill:var(--teal) }
.feat-title { font-weight:600; font-size:1rem; color:var(--navy); margin-bottom:3px }
.feat-desc { font-size:.9375rem; color:var(--text-light); line-height:1.75 }


/* ════════════════════════════════════════════
   POUCH INSPECTOR
   ════════════════════════════════════════════ */
.pouch { background:var(--off-white) }
.pouch-layout { display:grid; grid-template-columns:1fr 1fr; gap:5.5rem; align-items:center }
.pouch-card { background:var(--white); border:1px solid var(--border); border-radius:var(--radius-lg); padding:2.25rem }
.pouch-hd { display:flex; align-items:center; gap:12px; padding-bottom:1.25rem; border-bottom:1px solid var(--border); margin-bottom:1.5rem }
.pouch-ico { width:52px; height:52px; background:rgba(15,110,118,.1); border-radius:12px; display:flex; align-items:center; justify-content:center }
.pouch-ico svg { width:28px; height:28px; fill:var(--teal) }
.pouch-device-name { font-family:'Playfair Display',serif; font-size:1.25rem; font-weight:700; color:var(--navy) }
.pouch-device-sub { font-size:.8125rem; color:var(--text-light); margin-top:2px }
.pouch-checks { display:flex; flex-direction:column; gap:1rem }
.pouch-check { display:flex; align-items:flex-start; gap:10px; font-size:.9375rem; color:var(--text-light); line-height:1.75 }
.check-dot { width:18px; height:18px; background:var(--teal); border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:3px }
.check-dot svg { width:10px; height:10px; fill:white }
.pouch-check strong { color:var(--navy); font-weight:600 }


/* ════════════════════════════════════════════
   PROCESSUS
   ════════════════════════════════════════════ */
.process { background:var(--navy); position:relative; overflow:hidden }
.process::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 50% 60% at 90% 50%,rgba(42,171,181,.09) 0%,transparent 65%) }
.process-hd { max-width:600px; margin-bottom:4.5rem }
.process-hd .sec-lbl { color:var(--teal-light) }
.process-hd .sec-title { color:var(--white) }
.process-hd .sec-desc { color:rgba(255,255,255,.58) }
.process-steps { display:grid; grid-template-columns:repeat(5,1fr); gap:0; position:relative; z-index:1 }
.process-step { padding:1.75rem 1.25rem; position:relative }
.process-step:not(:last-child)::after { content:'→'; position:absolute; top:2.4rem; right:-10px; font-size:1rem; color:rgba(42,171,181,.35) }
.step-num { width:38px; height:38px; border:2px solid var(--teal-light); border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:'Playfair Display',serif; font-size:.875rem; font-weight:700; color:var(--teal-light); margin-bottom:1.1rem }
.step-title { font-weight:600; font-size:.9375rem; color:var(--white); margin-bottom:.6rem; line-height:1.3 }
.step-desc { font-size:.875rem; color:rgba(255,255,255,.46); line-height:1.78 }
.step-machine { font-size:.68rem; font-weight:600; color:var(--teal-light); text-transform:uppercase; letter-spacing:.05em; margin-top:7px }


/* ════════════════════════════════════════════
   AVANTAGES
   ════════════════════════════════════════════ */
.avantages { background:var(--white) }
.avan-hd { max-width:640px; margin-bottom:4.5rem }
.avan-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.75rem }
.avan-card {
  background:var(--off-white); border:1px solid var(--border); border-radius:var(--radius-lg);
  padding:2.25rem; position:relative; overflow:hidden;
  transition:transform var(--trans), box-shadow var(--trans);
}
.avan-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg) }
.avan-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--teal) }
.avan-ico { width:48px; height:48px; background:rgba(15,110,118,.1); border-radius:12px; display:flex; align-items:center; justify-content:center; margin-bottom:1.5rem }
.avan-ico svg { width:24px; height:24px; fill:var(--teal) }
.avan-title { font-weight:700; font-size:1rem; color:var(--navy); margin-bottom:.875rem; line-height:1.3 }
.avan-desc { font-size:.9375rem; color:var(--text-light); line-height:1.82 }
.avan-num { position:absolute; top:1.25rem; right:1.5rem; font-family:'Playfair Display',serif; font-size:2.75rem; font-weight:700; color:rgba(15,110,118,.06); line-height:1 }


/* ════════════════════════════════════════════
   CERTIFICATIONS
   ════════════════════════════════════════════ */
.certif { background:var(--navy); position:relative; overflow:hidden }
.certif::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 50% 60% at 10% 50%,rgba(42,171,181,.09) 0%,transparent 65%) }
.certif-layout { display:grid; grid-template-columns:1fr 1fr; gap:5.5rem; align-items:center; position:relative; z-index:1 }
.certif .sec-lbl { color:var(--teal-light) }
.certif .sec-title { color:white }
.certif .sec-desc { color:rgba(255,255,255,.58) }
.certif-badges { display:flex; flex-direction:column; gap:1rem; margin-top:2.5rem }
.certif-badge {
  display:flex; align-items:center; gap:14px;
  background:rgba(255,255,255,.055); border:1px solid rgba(255,255,255,.09); border-radius:var(--radius);
  padding:1.1rem 1.375rem;
  transition:background var(--trans), border-color var(--trans);
}
.certif-badge:hover { background:rgba(255,255,255,.09); border-color:rgba(42,171,181,.3) }
.certif-badge-ico { width:40px; height:40px; border-radius:8px; background:rgba(42,171,181,.18); display:flex; align-items:center; justify-content:center; flex-shrink:0 }
.certif-badge-ico svg { width:20px; height:20px; fill:var(--teal-light) }
.certif-badge-name { font-weight:600; font-size:.9375rem; color:white }
.certif-badge-desc { font-size:.8rem; color:rgba(255,255,255,.42); margin-top:2px }
.certif-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem }
.certif-item { background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.07); border-radius:var(--radius); padding:1.375rem }
.certif-item-num { font-family:'Playfair Display',serif; font-size:2rem; font-weight:700; color:var(--teal-light); line-height:1 }
.certif-item-lbl { font-size:.8125rem; color:rgba(255,255,255,.48); margin-top:5px; line-height:1.45 }


/* ════════════════════════════════════════════
   ZONES
   ════════════════════════════════════════════ */
.zones { background:var(--off-white) }
.zones-layout { display:grid; grid-template-columns:1fr 1.3fr; gap:5.5rem; align-items:start }
.dept-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:2.5rem }
.dept-chip {
  background:var(--white); border:1px solid var(--border); border-radius:9px;
  padding:10px 12px; text-align:center; text-decoration:none;
  transition:border-color var(--trans), box-shadow var(--trans), transform var(--trans);
  display:block;
}
.dept-chip:hover { border-color:var(--teal); box-shadow:var(--shadow-sm); transform:translateY(-2px) }
.dept-num { font-family:'Playfair Display',serif; font-size:1.125rem; font-weight:700; color:var(--teal); display:block }
.dept-name { font-size:.6875rem; color:var(--text-light); margin-top:2px; line-height:1.3 }
.zones-map { background:var(--white); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden }
.map-hd { background:var(--navy); padding:1.25rem 1.5rem; display:flex; align-items:center; gap:10px }
.map-hd-dot { width:8px; height:8px; background:#5DC27A; border-radius:50%; animation:pulse 2s infinite }
.map-hd-txt { font-size:.875rem; font-weight:600; color:white }
.map-body { padding:1.5rem }
.city-list { display:grid; grid-template-columns:1fr 1fr; gap:0 }
.city-item { display:flex; align-items:center; gap:10px; padding:9px 10px; border-bottom:1px solid var(--border); font-size:.875rem; color:var(--text) }
.city-item:nth-last-child(-n+2) { border-bottom:none }
.city-dot { width:6px; height:6px; background:var(--teal); border-radius:50%; flex-shrink:0 }


/* ════════════════════════════════════════════
   CONTACT
   ════════════════════════════════════════════ */
.contact { background:var(--white) }
.contact-layout { display:grid; grid-template-columns:1fr 1.1fr; gap:5.5rem; align-items:start }
.contact-feats { list-style:none; display:flex; flex-direction:column; gap:1.1rem; margin-bottom:2.25rem }
.contact-feats li { display:flex; align-items:flex-start; gap:12px; font-size:.9375rem; color:var(--text-light); line-height:1.7 }
.chk-ico { width:20px; height:20px; background:var(--teal); border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:2px }
.chk-ico svg { width:11px; height:11px; fill:white }
.info-box { background:var(--off-white); border:1px solid var(--border); border-radius:var(--radius); padding:1.375rem 1.5rem; display:flex; flex-direction:column; gap:.875rem }
.info-row { display:flex; align-items:flex-start; gap:10px; font-size:.875rem; color:var(--text-light) }
.info-row svg { width:16px; height:16px; fill:var(--teal); flex-shrink:0; margin-top:2px }
.info-row a { color:var(--teal); text-decoration:none; transition:color var(--trans) }
.info-row a:hover { color:var(--navy); text-decoration:underline }

/* Formulaire */
.form-wrap { background:var(--off-white); border:1px solid var(--border); border-radius:var(--radius-lg); padding:2.75rem }
.form-title { font-family:'Playfair Display',serif; font-size:1.4rem; font-weight:700; color:var(--navy); margin-bottom:.5rem }
.form-sub { font-size:.875rem; color:var(--text-light); margin-bottom:2rem }
.fg { margin-bottom:1.375rem }
.fr { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-bottom:1.375rem }
label { display:block; font-size:.8125rem; font-weight:600; color:var(--navy); margin-bottom:6px; letter-spacing:.01em }
input:not([type=checkbox]),select,textarea {
  width:100%; padding:11px 14px;
  border:1.5px solid var(--gray-200); border-radius:8px;
  font-family:'DM Sans',sans-serif; font-size:.9375rem; color:var(--text);
  background:var(--white); outline:none;
  transition:border-color var(--trans), box-shadow var(--trans);
  -webkit-appearance:none; appearance:none;
}
input:not([type=checkbox]):focus,select:focus,textarea:focus {
  border-color:var(--teal); box-shadow:0 0 0 3px rgba(15,110,118,.1);
}
input:not([type=checkbox])::placeholder,textarea::placeholder { color:var(--gray-400) }
select {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237A889E' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; padding-right:36px;
}
textarea { resize:vertical; min-height:100px; line-height:1.7 }

/* Checkbox RGPD */
.rgpd { font-size:.8rem; color:var(--gray-500); line-height:1.7; margin-bottom:1.375rem; display:flex; gap:10px; align-items:flex-start }
.rgpd input[type=checkbox] {
  -webkit-appearance:auto; appearance:auto;
  width:18px; height:18px; min-width:18px; min-height:18px;
  margin-top:2px; flex-shrink:0; cursor:pointer;
  accent-color:var(--teal); padding:0;
}
.rgpd label { font-size:.8rem; font-weight:400; color:var(--gray-500); margin-bottom:0; cursor:pointer; display:inline }
.rgpd a { color:var(--teal) }

.form-btn {
  width:100%; background:var(--teal); color:white; border:none;
  padding:15px; border-radius:9px; font-family:'DM Sans',sans-serif;
  font-size:1rem; font-weight:600; cursor:pointer; letter-spacing:.01em;
  transition:background var(--trans), transform var(--trans), box-shadow var(--trans);
}
.form-btn:hover { background:#0a5860; transform:translateY(-1px); box-shadow:var(--shadow-teal) }
.mention { background:var(--gray-100); border:1px solid var(--border); border-radius:9px; padding:1.1rem 1.375rem; margin-top:1.75rem; font-size:.8125rem; color:var(--gray-500); line-height:1.78 }


/* ════════════════════════════════════════════
   IMAGES UTILITAIRES
   ════════════════════════════════════════════ */
.img-banner { width:100%; height:420px; object-fit:cover; object-position:center; display:block }
.img-banner-wrap { position:relative; overflow:hidden; border-radius:var(--radius-lg) }
.img-banner-wrap::after { content:''; position:absolute; inset:0; background:linear-gradient(135deg,rgba(13,31,60,.52) 0%,rgba(15,110,118,.22) 100%); border-radius:var(--radius-lg) }
.img-overlay-txt { position:absolute; bottom:1.5rem; left:1.5rem; z-index:2; color:white }
.img-overlay-txt strong { display:block; font-size:1rem; font-weight:600; line-height:1.3 }
.img-overlay-txt span { font-size:.8rem; color:rgba(255,255,255,.7) }

.photo-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.1rem; margin-top:2.25rem }
.photo-cell { position:relative; border-radius:var(--radius); overflow:hidden }
.photo-cell img { width:100%; height:180px; object-fit:cover; display:block; transition:transform .45s ease }
.photo-cell:hover img { transform:scale(1.05) }
.photo-cell-label { position:absolute; bottom:0; left:0; right:0; background:linear-gradient(transparent,rgba(13,31,60,.72)); padding:.75rem 1rem .65rem; font-size:.75rem; font-weight:600; color:white; letter-spacing:.02em }

.img-side { width:100%; height:360px; object-fit:cover; border-radius:var(--radius-lg); display:block }
.img-side-wrap { position:relative }
.img-side-badge { position:absolute; bottom:-16px; left:24px; background:var(--white); border:1px solid var(--border); border-radius:var(--radius); padding:.875rem 1.375rem; box-shadow:var(--shadow-md); display:flex; align-items:center; gap:10px; z-index:2 }
.img-side-badge-ico { width:32px; height:32px; background:rgba(15,110,118,.1); border-radius:8px; display:flex; align-items:center; justify-content:center; flex-shrink:0 }
.img-side-badge-ico svg { width:16px; height:16px; fill:var(--teal) }
.img-side-badge-txt { font-size:.8125rem; font-weight:600; color:var(--navy) }
.img-side-badge-sub { font-size:.7rem; color:var(--text-light) }


/* ════════════════════════════════════════════
   MAILLAGE INTERNE
   ════════════════════════════════════════════ */
.internal-links { background:var(--off-white); border-top:1px solid var(--border) }
.internal-links-inner { max-width:1200px; margin:0 auto; padding:4rem 2.5rem }
.internal-links h2 { font-family:'Playfair Display',serif; font-size:1.375rem; font-weight:700; color:var(--navy); margin-bottom:1.75rem }
.ilinks-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:.875rem }
.ilink {
  display:flex; align-items:center; gap:.75rem;
  background:var(--white); border:1px solid var(--border); border-radius:var(--radius);
  padding:.875rem 1.125rem; text-decoration:none; font-size:.875rem; font-weight:600; color:var(--navy);
  transition:border-color var(--trans), box-shadow var(--trans), transform var(--trans);
}
.ilink:hover { border-color:var(--teal); box-shadow:var(--shadow-sm); transform:translateY(-2px); color:var(--teal) }
.ilink-arrow { color:var(--teal); font-size:.875rem; margin-left:auto; flex-shrink:0 }
.ilink-dept { font-family:'Playfair Display',serif; font-weight:700; color:var(--teal); font-size:.875rem; min-width:28px }


/* ════════════════════════════════════════════
   FOOTER
   ════════════════════════════════════════════ */
body > footer { background:var(--navy); color:rgba(255,255,255,.52); padding:5rem 2.5rem 2.5rem }
.footer-inner { max-width:1200px; margin:0 auto; display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:3.5rem }
.footer-brand-name { font-weight:700; font-size:1rem; color:var(--white); margin-bottom:.3rem }
.footer-brand-sub { font-size:.8125rem; color:var(--teal-light); margin-bottom:.875rem }
.footer-brand-desc { font-size:.875rem; line-height:1.78; max-width:280px }
.footer-col-title { font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:rgba(255,255,255,.3); margin-bottom:1.25rem }
.footer-links { list-style:none; display:flex; flex-direction:column; gap:.7rem }
.footer-links a {
  font-size:.875rem; color:rgba(255,255,255,.52); text-decoration:none;
  position:relative; display:inline-block; padding-bottom:1px;
  transition:color var(--trans);
}
.footer-links a::after { content:''; position:absolute; bottom:0; left:0; width:0; height:1px; background:var(--teal-light); transition:width var(--trans) }
.footer-links a:hover { color:white }
.footer-links a:hover::after { width:100% }
.footer-bottom { max-width:1200px; margin:3rem auto 0; padding-top:2rem; border-top:1px solid rgba(255,255,255,.07); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; font-size:.8125rem; color:rgba(255,255,255,.28) }
.footer-legal { display:flex; gap:1.5rem; list-style:none }
.footer-legal a { color:rgba(255,255,255,.28); text-decoration:none; font-size:.8125rem; transition:color var(--trans) }
.footer-legal a:hover { color:rgba(255,255,255,.65) }


/* ════════════════════════════════════════════
   TOAST
   ════════════════════════════════════════════ */
.toast { position:fixed; bottom:2rem; right:2rem; background:var(--teal); color:white; padding:1rem 1.5rem; border-radius:var(--radius); font-size:.9375rem; font-weight:500; box-shadow:var(--shadow-lg); transform:translateY(120px); opacity:0; transition:all .35s ease; z-index:999; display:flex; align-items:center; gap:10px }
.toast.show { transform:translateY(0); opacity:1 }


/* ════════════════════════════════════════════
   BLOG — PAGE ACTUALITÉS
   ════════════════════════════════════════════ */
.blog-hero { background:var(--navy); padding:7rem 2.5rem 4.5rem; position:relative; overflow:hidden }
.blog-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 50% 60% at 80% 50%,rgba(42,171,181,.12) 0%,transparent 65%) }
.blog-hero-inner { max-width:1100px; margin:0 auto; position:relative; z-index:1 }

.blog-body { max-width:1200px; margin:0 auto; padding:4.5rem 2.5rem 6rem }
.blog-layout { display:grid; grid-template-columns:1fr 320px; gap:3.5rem; align-items:start }

.posts-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.75rem }
.post-card {
  background:var(--white); border:1px solid var(--border); border-radius:var(--radius-lg);
  overflow:hidden; text-decoration:none; color:inherit; display:flex; flex-direction:column;
  transition:transform var(--trans), box-shadow var(--trans);
}
.post-card:hover { transform:translateY(-5px); box-shadow:var(--shadow-lg) }
.post-card-img { height:200px; overflow:hidden }
.post-card-img img { width:100%; height:100%; object-fit:cover; transition:transform .45s ease }
.post-card:hover .post-card-img img { transform:scale(1.06) }
.post-card-body { padding:1.5rem; flex:1; display:flex; flex-direction:column }
.post-card-cat { font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--teal); margin-bottom:.6rem }
.post-card-title { font-family:'Playfair Display',serif; font-size:1.1rem; font-weight:700; color:var(--navy); line-height:1.3; margin-bottom:.75rem }
.post-card-excerpt { font-size:.875rem; color:var(--text-light); line-height:1.75; flex:1 }
.post-card-footer { display:flex; align-items:center; justify-content:space-between; margin-top:1.25rem; padding-top:1rem; border-top:1px solid var(--border) }
.post-card-date { font-size:.78rem; color:var(--gray-400) }
.post-card-link { font-size:.825rem; font-weight:600; color:var(--teal); text-decoration:none; display:flex; align-items:center; gap:4px }
.post-card-link:hover { text-decoration:underline }

/* Sidebar blog */
.blog-sidebar-widget { background:var(--off-white); border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.75rem; margin-bottom:1.5rem }
.blog-sidebar-title { font-weight:700; font-size:.875rem; text-transform:uppercase; letter-spacing:.08em; color:var(--navy); margin-bottom:1.25rem }
.sidebar-post-list { list-style:none; display:flex; flex-direction:column; gap:.75rem }
.sidebar-post-item a { font-size:.875rem; color:var(--text-light); text-decoration:none; line-height:1.5; display:block; transition:color var(--trans) }
.sidebar-post-item a:hover { color:var(--teal) }
.sidebar-cat-list { list-style:none; display:flex; flex-direction:column; gap:.5rem }
.sidebar-cat-item a { display:flex; justify-content:space-between; align-items:center; font-size:.875rem; color:var(--text-light); text-decoration:none; padding:.4rem 0; border-bottom:1px solid var(--border); transition:color var(--trans) }
.sidebar-cat-item:last-child a { border-bottom:none }
.sidebar-cat-item a:hover { color:var(--teal) }
.sidebar-cat-count { background:var(--teal-pale); color:var(--teal); font-size:.72rem; font-weight:700; padding:2px 7px; border-radius:100px }

/* Article single */
/* ── Hero article — image en fond ── */
.single-hero-bg {
  background-size:cover; background-position:center center; background-repeat:no-repeat;
  position:relative; min-height:480px;
  display:flex; align-items:flex-end;
}
.single-hero-overlay {
  position:absolute; inset:0;
  background:linear-gradient(
    160deg,
    rgba(13,31,60,.55) 0%,
    rgba(13,31,60,.78) 55%,
    rgba(13,31,60,.96) 100%
  );
}
.single-hero-inner {
  position:relative; z-index:2;
  max-width:860px; width:100%; margin:0 auto;
  padding:3.5rem 2.5rem 3rem;
}

/* ── Blockquote compact ── */
.single-content blockquote {
  border-left:3px solid var(--teal);
  padding:.875rem 1.25rem;
  background:var(--teal-pale);
  border-radius:0 var(--radius) var(--radius) 0;
  margin:1.75rem 0;
}
.single-content blockquote p {
  color:var(--navy); font-size:.9375rem;
  line-height:1.7; margin-bottom:.375rem; font-style:italic;
}
.single-content blockquote footer {
  font-size:.8rem; color:var(--text-light);
  font-style:normal; margin-top:.25rem;
}

@media(max-width:768px) {
  .single-hero-bg { min-height:320px }
  .single-hero-inner { padding:2.5rem 1.25rem 2rem }
}
.single-featured { max-width:860px; margin:0 auto }
.single-featured img { width:100%; height:420px; object-fit:cover; border-radius:var(--radius-lg) var(--radius-lg) 0 0 }
.single-body { max-width:860px; margin:0 auto; padding:3.5rem 2.5rem 6rem }

/* ── Intro accroche ── */
.single-content .article-intro,
.single-content > p:first-child {
  font-size:1.1875rem; color:var(--navy); line-height:1.95;
  font-weight:400; border-left:4px solid var(--teal);
  padding:1.25rem 1.5rem; background:var(--teal-pale);
  border-radius:0 var(--radius) var(--radius) 0;
  margin-bottom:2.5rem;
}

/* ── Titres ── */
.single-content h2 {
  font-family:'Playfair Display',serif; font-size:1.875rem; font-weight:700;
  color:var(--navy); margin:3.5rem 0 1.25rem; line-height:1.2;
  padding-bottom:.875rem; border-bottom:2px solid var(--teal);
}
.single-content h3 {
  font-size:1.125rem; font-weight:700; color:var(--navy);
  margin:2.25rem 0 .75rem; line-height:1.35;
  display:flex; align-items:center; gap:.625rem;
}
.single-content h3::before {
  content:''; width:4px; height:1.125em; background:var(--teal-light);
  border-radius:2px; flex-shrink:0;
}

/* ── Texte ── */
.single-content { font-size:1.0625rem; color:var(--text-light); line-height:1.92 }
.single-content p { margin-bottom:1.625rem }
.single-content a { color:var(--teal); text-decoration:underline; text-underline-offset:2px }
.single-content a:hover { color:var(--navy) }
.single-content strong { color:var(--navy); font-weight:600 }
.single-content em { font-style:italic; color:var(--navy) }

/* ── Listes ── */
.single-content ul { padding-left:0; list-style:none; margin-bottom:1.75rem; display:flex; flex-direction:column; gap:.625rem }
.single-content ul li { padding-left:1.75rem; position:relative; line-height:1.78 }
.single-content ul li::before { content:'→'; position:absolute; left:0; color:var(--teal); font-weight:700 }
.single-content ol { padding-left:0; list-style:none; counter-reset:ol-counter; margin-bottom:1.75rem; display:flex; flex-direction:column; gap:.75rem }
.single-content ol li { padding-left:2.25rem; position:relative; counter-increment:ol-counter; line-height:1.78 }
.single-content ol li::before { content:counter(ol-counter); position:absolute; left:0; top:0; width:1.625rem; height:1.625rem; background:var(--navy); color:white; border-radius:50%; font-size:.75rem; font-weight:700; display:flex; align-items:center; justify-content:center; font-family:'Playfair Display',serif }

/* ── Blockquote ── */
.single-content blockquote {
  border-left:4px solid var(--teal); padding:1.375rem 1.75rem;
  background:var(--teal-pale); border-radius:0 var(--radius-lg) var(--radius-lg) 0;
  margin:2.5rem 0; font-style:italic;
}
.single-content blockquote p { color:var(--navy); font-size:1.0625rem; margin-bottom:.5rem }
.single-content blockquote footer { font-size:.875rem; color:var(--text-light); font-style:normal; margin-top:.5rem }

/* ── Tableaux ── */
.single-content table { width:100%; border-collapse:collapse; font-size:.9375rem; margin:2rem 0; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-sm) }
.single-content table thead tr { background:var(--navy) }
.single-content table thead th { color:white; padding:12px 16px; text-align:left; font-weight:600; font-size:.875rem }
.single-content table tbody td { padding:11px 16px; color:var(--text-light); vertical-align:top; border-bottom:1px solid var(--border) }
.single-content table tbody tr:nth-child(even) td { background:var(--off-white) }
.single-content table tbody tr:last-child td { border-bottom:none }

/* ── Séparateur visuel entre sections ── */
.single-content hr { border:none; border-top:1px solid var(--border); margin:3rem 0 }

/* ── CTA box inline (dans le contenu) ── */
.single-content div[style*="background:var(--off-white)"],
.single-content div[style*="background:var(--navy)"] { margin:2.5rem 0 }

/* ── Articles similaires ── */
.related-posts { border-top:2px solid var(--border); padding-top:3.5rem; margin-top:3.5rem }
.related-posts h2 { font-family:'Playfair Display',serif; font-size:1.5rem; font-weight:700; color:var(--navy); margin-bottom:1.5rem }
.related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; margin-top:1.5rem }

/* ── Responsive ── */
@media(max-width:768px) {
  .single-body { padding:2.5rem 1.25rem 5rem }
  .single-content h2 { font-size:1.5rem; margin:2.5rem 0 1rem }
  .single-content h3 { font-size:1rem }
  .single-content > p:first-child { font-size:1.0625rem }
  .related-grid { grid-template-columns:1fr }
}
.related-posts { border-top:1px solid var(--border); padding-top:3.5rem; margin-top:3.5rem }
.related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; margin-top:1.5rem }


/* ════════════════════════════════════════════
   FAQ
   ════════════════════════════════════════════ */
.faq-hero { background:var(--navy); padding:7rem 2.5rem 4.5rem; position:relative; overflow:hidden }
.faq-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 50% 60% at 80% 50%,rgba(42,171,181,.12) 0%,transparent 65%) }
.faq-hero-inner { max-width:860px; margin:0 auto; position:relative; z-index:1 }

.faq-body { max-width:860px; margin:0 auto; padding:4.5rem 2.5rem 6rem }
.faq-category { margin-bottom:3.5rem }
.faq-category-title { font-family:'Playfair Display',serif; font-size:1.375rem; font-weight:700; color:var(--navy); margin-bottom:1.25rem; padding-bottom:.875rem; border-bottom:2px solid var(--teal) }

.faq-accordion { display:flex; flex-direction:column; gap:.75rem }
.faq-item { border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; transition:border-color var(--trans) }
.faq-item.open { border-color:var(--teal) }
.faq-question {
  padding:1.25rem 1.5rem; font-size:.9375rem; font-weight:600; color:var(--navy);
  cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:1rem;
  user-select:none; background:var(--white); transition:background var(--trans);
}
.faq-question:hover { background:var(--teal-pale) }
.faq-item.open .faq-question { background:var(--teal-pale) }
.faq-icon { width:24px; height:24px; border-radius:50%; background:var(--teal); color:white; display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:1rem; font-weight:700; transition:transform var(--trans) }
.faq-item.open .faq-icon { transform:rotate(45deg) }
.faq-answer { max-height:0; overflow:hidden; transition:max-height .35s ease, padding .35s ease }
.faq-answer-inner { padding:0 1.5rem; font-size:.9375rem; color:var(--text-light); line-height:1.85 }
.faq-item.open .faq-answer { max-height:500px }
.faq-item.open .faq-answer-inner { padding:1rem 1.5rem 1.375rem }
.faq-cta-link { display:inline-flex; align-items:center; gap:6px; color:var(--teal); font-weight:600; font-size:.875rem; text-decoration:none; margin-top:.875rem }
.faq-cta-link:hover { text-decoration:underline }

/* Single FAQ */
.faq-single-body { max-width:860px; margin:0 auto; padding:4.5rem 2.5rem 6rem }
.faq-answer-full { font-size:1.0625rem; color:var(--text-light); line-height:1.9 }
.faq-answer-full h2 { font-family:'Playfair Display',serif; font-size:1.5rem; color:var(--navy); margin:2rem 0 .75rem }
.faq-answer-full p { margin-bottom:1.5rem }
.faq-answer-full ul { padding-left:1.75rem; margin-bottom:1.5rem }
.faq-answer-full li { margin-bottom:.5rem; line-height:1.75 }
.faq-related { border-top:1px solid var(--border); padding-top:3rem; margin-top:3rem }
.faq-related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:1.25rem }
.faq-related-item {
  background:var(--off-white); border:1px solid var(--border); border-radius:var(--radius);
  padding:1.1rem 1.25rem; text-decoration:none; font-size:.875rem; font-weight:600; color:var(--navy);
  transition:border-color var(--trans), transform var(--trans);
  display:flex; align-items:flex-start; gap:.5rem;
}
.faq-related-item:hover { border-color:var(--teal); transform:translateY(-2px) }
.faq-back { display:inline-flex; align-items:center; gap:6px; color:var(--teal); font-size:.875rem; font-weight:600; text-decoration:none; margin-bottom:2rem }
.faq-back:hover { text-decoration:underline }


/* ════════════════════════════════════════════
   BREADCRUMB
   ════════════════════════════════════════════ */
.breadcrumb { background:var(--off-white); border-bottom:1px solid var(--border); padding:.75rem 2.5rem; font-size:.8rem; color:var(--gray-500) }
.breadcrumb-inner { max-width:1200px; margin:0 auto; display:flex; align-items:center; gap:.5rem; flex-wrap:wrap }
.breadcrumb a { color:var(--teal); text-decoration:none }
.breadcrumb a:hover { text-decoration:underline }
.breadcrumb-sep { color:var(--gray-400) }


/* ════════════════════════════════════════════
   PAGES LÉGALES (styles partagés)
   ════════════════════════════════════════════ */
.legal-hero { background:var(--navy); padding:7rem 2.5rem 4.5rem; position:relative; overflow:hidden }
.legal-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 50% 60% at 80% 50%,rgba(42,171,181,.12) 0%,transparent 70%) }
.legal-hero-inner { max-width:800px; margin:0 auto; position:relative; z-index:1 }
.legal-type { display:inline-flex; align-items:center; gap:8px; background:rgba(42,171,181,.15); border:1px solid rgba(42,171,181,.3); border-radius:100px; padding:5px 14px; font-size:.75rem; font-weight:600; color:#2AABB5; letter-spacing:.08em; text-transform:uppercase; margin-bottom:1.25rem }
.legal-hero h1 { font-family:'Playfair Display',serif; font-size:clamp(2rem,4vw,3rem); font-weight:700; color:#fff; line-height:1.15; margin-bottom:1rem }
.legal-hero-desc { font-size:1rem; color:rgba(255,255,255,.62); line-height:1.85; max-width:600px }
.legal-date { margin-top:1.5rem; font-size:.8125rem; color:rgba(255,255,255,.32); font-style:italic }
.legal-body { max-width:800px; margin:0 auto; padding:4.5rem 2.5rem 6rem }
.legal-toc { background:var(--off-white); border:1px solid var(--border); border-radius:var(--radius-lg); padding:1.75rem 2rem; margin-bottom:3.5rem }
.legal-toc-title { font-weight:700; font-size:.8125rem; color:var(--navy); text-transform:uppercase; letter-spacing:.1em; margin-bottom:1rem }
.legal-toc ol { list-style:none; display:flex; flex-direction:column; gap:.5rem; counter-reset:toc; padding:0 }
.legal-toc li { counter-increment:toc; display:flex; align-items:baseline; gap:.625rem }
.legal-toc li::before { content:counter(toc,decimal-leading-zero); font-family:'Playfair Display',serif; font-size:.875rem; font-weight:700; color:var(--teal); min-width:1.5rem }
.legal-toc a { font-size:.9rem; color:var(--text-light); text-decoration:none; transition:color var(--trans) }
.legal-toc a:hover { color:var(--teal) }
.legal-section { margin-bottom:3.25rem; padding-bottom:3.25rem; border-bottom:1px solid var(--border) }
.legal-section:last-child { border-bottom:none; margin-bottom:0 }
.legal-section-num { font-family:'Playfair Display',serif; font-size:.8125rem; font-weight:700; color:var(--teal); text-transform:uppercase; letter-spacing:.08em; margin-bottom:.5rem; display:block }
.legal-section h2 { font-family:'Playfair Display',serif; font-size:1.5rem; font-weight:700; color:var(--navy); margin:0 0 1.375rem }
.legal-section h3 { font-size:1rem; font-weight:700; color:var(--navy); margin:1.5rem 0 .5rem }
.legal-section p, .legal-section li { font-size:.9375rem; color:var(--text-light); line-height:1.85; margin-bottom:.875rem }
.legal-section ul, .legal-section ol { padding-left:1.5rem; margin-bottom:.875rem }
.legal-dl { display:grid; grid-template-columns:220px 1fr; gap:.4rem 1rem; font-size:.9375rem; line-height:1.75 }
.legal-dl dt { color:var(--navy); font-weight:600 }
.legal-dl dd { color:var(--text-light); margin:0 }
.legal-back { display:inline-flex; align-items:center; gap:6px; color:var(--teal); font-size:.875rem; font-weight:600; text-decoration:none; margin-top:2.5rem }
.legal-back:hover { text-decoration:underline }


/* ════════════════════════════════════════════
   GEO PAGES (surcharge minime — styles dans template-geo.php)
   ════════════════════════════════════════════ */
.geo-hero { padding-top:4rem }


/* ════════════════════════════════════════════
   RESPONSIVE — 1100px
   ════════════════════════════════════════════ */
@media(max-width:1100px) {
  section { padding:5.5rem 2rem }
  nav { padding:0 2rem }
  .hero-wrap { padding:5.5rem 2rem 4.5rem; gap:3.5rem }
  .photo-strip { padding:0 2rem 4rem }
  .process-steps { grid-template-columns:repeat(3,1fr) }
  .process-step:nth-child(3)::after { display:none }
  .about-layout,.automate-layout,.pouch-layout,.certif-layout,.zones-layout { grid-template-columns:1fr; gap:3rem }
  .avan-grid { grid-template-columns:repeat(2,1fr) }
  .footer-inner { grid-template-columns:1fr 1fr; gap:2.5rem }
  .photo-strip { grid-template-columns:1fr 1fr }
  .photo-strip-item:nth-child(3) { display:none }
  .blog-layout { grid-template-columns:1fr }
  .posts-grid { grid-template-columns:1fr }
  .blog-sidebar-widget { display:none }
  .ilinks-grid { grid-template-columns:repeat(2,1fr) }
}

/* ════════════════════════════════════════════
   RESPONSIVE — 768px
   ════════════════════════════════════════════ */
@media(max-width:768px) {
  html { font-size:16px }
  section { padding:4.5rem 1.25rem }
  nav { padding:0 1.25rem }
  .nav-links { display:none }
  .nav-hamburger { display:flex }

  /* Hero */
  .hero-wrap { grid-template-columns:1fr; gap:2rem; padding:4rem 1.25rem 3.5rem }
  .hero-visual { display:none }
  .hero h1 { font-size:clamp(1.75rem,7.5vw,2.5rem) }
  .hero-desc { font-size:.975rem; max-width:100% }
  .hero-badge { font-size:.7rem; padding:5px 12px; margin-bottom:1.5rem }
  .hero-actions { flex-direction:column; gap:.75rem }
  .btn-primary,.btn-secondary { width:100%; justify-content:center; padding:13px 20px }
  .hero-stats { flex-wrap:wrap; gap:1.25rem; margin-top:2.5rem; padding-top:1.75rem }
  .hero-stats>div { min-width:calc(50% - .75rem) }
  .hero-stat-val { font-size:1.75rem }
  /* float-badge est maintenant inline dans hero-card-hd */

  /* Photo strip */
  .photo-strip { grid-template-columns:1fr; padding:0 1.25rem 3rem; gap:.5rem }
  .photo-strip-item img { height:200px }
  .photo-strip-item:nth-child(2),.photo-strip-item:nth-child(3) { display:none }

  /* About */
  .about-layout { grid-template-columns:1fr; gap:2.5rem }
  .about-stats { grid-template-columns:1fr 1fr }
  .img-side { height:240px }
  .img-side-badge { position:static; margin-top:1rem; box-shadow:none }

  /* Automate */
  .automate-layout { grid-template-columns:1fr; gap:2.5rem }
  .photo-grid { grid-template-columns:1fr; gap:.75rem }
  .photo-cell img { height:220px }
  .machine-card { padding:2rem }
  .machine-name { font-size:1.6rem }

  /* Pouch */
  .pouch-layout { grid-template-columns:1fr; gap:2.5rem }

  /* Processus */
  .process-steps { grid-template-columns:1fr }
  .process-step::after { display:none !important }
  .process-step { padding:1.375rem 1rem; border-bottom:1px solid rgba(255,255,255,.07) }
  .process-step:last-child { border-bottom:none }

  /* Avantages */
  .avan-grid { grid-template-columns:1fr }

  /* Certif */
  .certif-layout { grid-template-columns:1fr; gap:2.5rem }
  .certif-grid { grid-template-columns:1fr 1fr }

  /* Zones */
  .zones-layout { grid-template-columns:1fr; gap:2.5rem }
  .dept-grid { grid-template-columns:repeat(3,1fr) }
  .city-list { grid-template-columns:1fr }

  /* Contact */
  .contact-layout { grid-template-columns:1fr; gap:2.5rem }
  .fr { grid-template-columns:1fr }
  .form-wrap { padding:2rem 1.5rem }

  /* Footer */
  body > footer { padding:4rem 1.25rem 2rem }
  .footer-inner { grid-template-columns:1fr; gap:2rem }
  .footer-bottom { flex-direction:column; text-align:center; gap:.75rem }
  .footer-legal { flex-wrap:wrap; justify-content:center; gap:.75rem }

  /* Blog */
  .blog-body { padding:3rem 1.25rem 5rem }
  .posts-grid { grid-template-columns:1fr }
  .related-grid,.faq-related-grid { grid-template-columns:1fr }
  .single-featured img { height:240px }

  /* FAQ */
  .faq-body,.faq-single-body { padding:3rem 1.25rem 5rem }
  .faq-related-grid { grid-template-columns:1fr }

  /* Légal */
  .legal-body { padding:3rem 1.25rem 5rem }
  .legal-dl { grid-template-columns:1fr }

  /* Maillage */
  .ilinks-grid { grid-template-columns:1fr }
  .internal-links-inner { padding:3rem 1.25rem }

  /* Breadcrumb */
  .breadcrumb { padding:.75rem 1.25rem }

  /* Misc */
  .sec-desc { max-width:100% }
  nav.scrolled { box-shadow:none }
}

/* ════════════════════════════════════════════
   RESPONSIVE — 480px
   ════════════════════════════════════════════ */
@media(max-width:480px) {
  .dept-grid { grid-template-columns:repeat(2,1fr) }
  .about-stats { grid-template-columns:1fr 1fr }
  .certif-grid { grid-template-columns:1fr }
  .hero-stats>div { min-width:100% }
  .avan-card { padding:1.75rem }
  .posts-grid { grid-template-columns:1fr }
  .faq-related-grid { grid-template-columns:1fr }
  .related-grid { grid-template-columns:1fr }
}

/* ════════════════════════════════════════════
   ABOUT — blocs texte
   ════════════════════════════════════════════ */
.about-bloc {
  display:flex; gap:1.25rem; align-items:flex-start;
  margin-bottom:2rem; padding-bottom:2rem;
  border-bottom:1px solid var(--border);
}
.about-bloc:last-of-type { border-bottom:none }
.about-bloc-bar {
  width:4px; min-height:100%; background:var(--teal);
  border-radius:2px; flex-shrink:0; margin-top:4px;
  align-self:stretch;
}
.about-bloc-title {
  font-size:1.0625rem; font-weight:700; color:var(--navy);
  margin-bottom:.6rem; line-height:1.35;
}
.about-bloc p {
  font-size:.9375rem; color:var(--text-light); line-height:1.85; margin:0;
}

/* ════════════════════════════════════════════
   BANNER STRIP — 4 photos
   ════════════════════════════════════════════ */
.banner-strip {
  display:grid; grid-template-columns:repeat(4,1fr);
  height:260px; overflow:hidden;
}
.banner-strip-item {
  position:relative; overflow:hidden;
}
.banner-strip-item img {
  width:100%; height:100%; object-fit:cover; display:block;
  filter:brightness(.72);
  transition:filter .4s ease, transform .5s ease;
}
.banner-strip-item:hover img {
  filter:brightness(.92); transform:scale(1.05);
}
.banner-strip-caption {
  position:absolute; bottom:0; left:0; right:0;
  padding:.875rem 1.25rem .75rem;
  background:linear-gradient(transparent, rgba(13,31,60,.72));
  color:white; font-size:.75rem; font-weight:600;
  letter-spacing:.03em;
}

/* ════════════════════════════════════════════
   PHOTO CTA BAND
   ════════════════════════════════════════════ */
.photo-cta-wrap {
  position:relative; min-height:300px; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
}
.photo-cta-bg {
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:center 30%;
  filter:brightness(.38); display:block;
}
.photo-cta-inner {
  position:relative; z-index:2;
  display:flex; flex-direction:column; gap:1.25rem;
  align-items:center; text-align:center;
  padding:4rem 2.5rem; max-width:780px; margin:0 auto;
}
.photo-cta-lbl {
  font-size:.72rem; font-weight:700; letter-spacing:.14em;
  text-transform:uppercase; color:var(--teal-light);
}
.photo-cta-title {
  font-family:'Playfair Display',serif;
  font-size:clamp(1.375rem,3.5vw,2.25rem);
  font-weight:700; color:white; line-height:1.25;
}

/* ════════════════════════════════════════════
   RESPONSIVE — nouvelles classes
   ════════════════════════════════════════════ */
@media(max-width:768px) {
  .banner-strip { grid-template-columns:1fr 1fr; height:auto }
  .banner-strip-item img { height:160px }
  .banner-strip-item:nth-child(3),
  .banner-strip-item:nth-child(4) { display:none }
  .photo-cta-inner { padding:3rem 1.25rem }
  .about-bloc { flex-direction:column; gap:.75rem }
  .about-bloc-bar { width:100%; height:3px; min-height:0; align-self:auto }
}
@media(max-width:480px) {
  .banner-strip { grid-template-columns:1fr }
  .banner-strip-item:nth-child(2) { display:none }
}

/* ── Geo sections pleine largeur ── */
.geo-section-full { max-width:none }
.etab-grid-wide { grid-template-columns:repeat(6,1fr) }
.geo-process-wide { display:grid; grid-template-columns:repeat(5,1fr); gap:1.5rem }
.geo-process-wide .geo-step { flex-direction:column }
.geo-faq-wide { columns:2; column-gap:1.5rem }
.geo-faq-wide .geo-faq-item { break-inside:avoid; margin-bottom:.75rem }
.geo-links-grid-wide { grid-template-columns:repeat(4,1fr) }

@media(max-width:1100px){
  .etab-grid-wide { grid-template-columns:repeat(3,1fr) }
  .geo-process-wide { grid-template-columns:repeat(3,1fr) }
  .geo-links-grid-wide { grid-template-columns:repeat(3,1fr) }
}
@media(max-width:768px){
  .etab-grid-wide { grid-template-columns:repeat(2,1fr) }
  .geo-process-wide { grid-template-columns:1fr }
  .geo-faq-wide { columns:1 }
  .geo-links-grid-wide { grid-template-columns:1fr 1fr }
}
@media(max-width:480px){
  .etab-grid-wide { grid-template-columns:repeat(2,1fr) }
  .geo-links-grid-wide { grid-template-columns:1fr }
}