
:root{
  --bg:#e8e0d4;
  --surface:#f2ece3;
  --surface-hi:#f8f4ee;
  --hover:#ddd5c8;
  --border:#ccc3b5;
  --ink:#1e1712;
  --muted:#6e6459;
  --accent:#8b2027;
  --gold:#956018;
  --accent-2:#956018;
  --accent-3:#496b5a;
  --paper:var(--surface-hi);
  --paper-2:var(--surface);
  --line:var(--border);
  --line-2:#d8d0c4;
  --shadow:0 1px 4px rgba(20,14,8,.10),0 4px 18px rgba(20,14,8,.06);
  --shadow-soft:0 1px 3px rgba(20,14,8,.07),0 3px 12px rgba(20,14,8,.05);
  --radius:0;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--ink);
  background:#e8e0d4;
  min-height:100vh;
}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.leaflet-container{font:inherit}
.site-header{position:sticky;top:0;z-index:200;backdrop-filter:blur(14px);background:rgba(248,244,238,.92);border-bottom:1px solid var(--border);}
.header-inner{
  max-width:1280px;margin:0 auto;padding:14px 20px;
  display:flex;align-items:center;justify-content:space-between;gap:20px;
}
.brand{display:flex;align-items:center;gap:14px;min-width:0}

.brand-mark{
  width:64px;height:64px;border-radius:0;
  background:linear-gradient(145deg,#8f2a30,#c38b34);
  color:white;display:flex;align-items:center;justify-content:center;
  font-weight:900;font-size:22px;box-shadow:var(--shadow);position:relative;overflow:hidden;
}
.brand-mark::before{
  content:"";position:absolute;inset:1px;border-radius:0;border:1px solid rgba(255,255,255,.22)
}
.brand-mark .mv{
  font-family:Inter,system-ui,sans-serif;letter-spacing:.02em;font-size:20px;font-weight:900
}

.brand-title{font-size:18px;font-weight:800;line-height:1.05}
.brand-sub{font-size:12px;color:var(--muted);margin-top:3px;letter-spacing:.12em;text-transform:uppercase}
.nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.nav a{padding:8px 12px;color:var(--muted);font-weight:600;position:relative;border-bottom:2px solid transparent;transition:color .15s,border-color .15s;}
.nav a:hover{color:var(--ink);border-bottom-color:var(--border);}.nav a.active{color:var(--ink);border-bottom-color:var(--accent);}
.header-tools{display:flex;align-items:center;gap:10px}
.header-search{
  display:inline-flex;align-items:center;gap:8px;background:var(--paper);border:1px solid var(--line);
  padding:10px 14px;border-radius:0;color:#5d514b;font-weight:700;box-shadow:var(--shadow-soft)
}
/* .hamburger défini plus bas dans les améliorations v16 */
.mobile-menu{
  position:fixed;inset:0;z-index:320;
  background:rgba(250,244,232,.98);backdrop-filter:blur(12px);
  transform:translateX(-100%);transition:transform .35s ease;
  padding:28px 22px;
}
.mobile-menu.open{transform:translateX(0)}
body.menu-open{overflow:hidden}
.mobile-menu .close{position:absolute;right:18px;top:18px;border:none;background:var(--paper);width:54px;height:54px;border-radius:0;font-size:30px}
.mobile-menu nav{display:grid;gap:10px;margin-top:92px}
.mobile-menu a{padding:16px 18px;background:var(--paper);border-radius:0;font-weight:700;box-shadow:var(--shadow)}
.wrap{max-width:1280px;margin:0 auto;padding:28px 20px 80px}
.hero{background:var(--surface-hi);border:1px solid var(--border);padding:52px 44px 0;box-shadow:var(--shadow);position:relative;overflow:hidden;}
.hero::after{display:none}
.eyebrow{
  font-size:12px;letter-spacing:.32em;font-weight:800;text-transform:uppercase;color:var(--accent);text-align:center;
}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center}
.hero-grid > div:first-child{display:flex;flex-direction:column;align-items:center;text-align:center}
.hero h1{
  margin:22px 0 12px;
  font-size:clamp(38px,4.4vw,62px);line-height:1.0;letter-spacing:-.035em;
  font-weight:900;text-align:center;
}
.hero h1 .line1{display:block;color:var(--ink)}
.hero h1 .line2{display:block;color:var(--accent)}
.hero h1 span{color:var(--accent)}
.hero p{font-size:17px;line-height:1.7;color:#665b53;max-width:480px;text-align:center}
.search-box{
  display:grid;grid-template-columns:1fr;gap:12px;margin-top:24px;max-width:560px;width:100%
}
.search-box-inline{grid-template-columns:1fr auto;max-width:760px;align-items:center}
.input{height:54px;border:1px solid var(--border);padding:0 18px;background:var(--surface-hi);font-size:16px;color:var(--ink);}
.select{height:54px;border:1px solid var(--border);padding:0 16px;background:var(--surface-hi);font-size:16px;}
textarea.input{height:auto;padding:16px 18px}
.btn{height:54px;border:none;padding:0 22px;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:10px;transition:background .16s,transform .16s,box-shadow .16s;}
.btn-primary{background:var(--accent);color:#fff;}
.btn-secondary{background:var(--surface-hi);color:var(--ink);border:1px solid var(--border);}
.hero-kpis{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.kpi{padding:20px 18px;border:none;background:transparent;}
.kpi .label{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-weight:700}
.kpi .value{font-size:42px;font-weight:900;color:var(--accent);margin-top:8px}
.kpi .sub{font-size:14px;color:var(--muted)}
.section{margin-top:48px}
.section-head{display:flex;align-items:center;gap:16px;margin-bottom:22px;padding-bottom:0;}
.section-head h2{margin:0;font-size:10px;letter-spacing:.34em;text-transform:uppercase;color:var(--gold);font-weight:800;white-space:nowrap;}
.section-head::after{content:"";flex:1;height:1px;background:var(--border);}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.cards.two{grid-template-columns:repeat(2,1fr)}
.card{background:var(--surface-hi);border:1px solid var(--border);padding:22px;box-shadow:var(--shadow-soft);transition:background .18s ease,box-shadow .22s ease,transform .22s ease,outline-color .18s ease;position:relative;overflow:hidden;cursor:pointer;outline:2px solid transparent;outline-offset:-1px;}
.card:hover{background:var(--hover);box-shadow:var(--shadow);transform:translateY(-3px);outline-color:var(--accent);}
.card .type{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent-2);font-weight:800}
.card h3{margin:10px 0 8px;font-size:28px;line-height:1.02;letter-spacing:-.03em}
.card p{margin:0;color:#6f625b;line-height:1.65}
.card .cta{margin-top:14px;color:var(--accent);font-weight:800}
.badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.badge{padding:5px 10px;background:var(--surface);border:1px solid var(--border);font-size:12px;font-weight:700;color:var(--muted);}
.avatar,.icon-box{
  width:92px;height:92px;border-radius:0;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#ead7b3,#d7ba87);
  border:1px solid #d7c2a0;margin-bottom:12px;overflow:hidden;
}
.avatar.f{background:linear-gradient(135deg,#edd8d3,#dfbcb0)}
.avatar.m{background:linear-gradient(135deg,#ead7b3,#d7ba87)}
.map-shell{background:var(--surface-hi);border:1px solid var(--border);padding:0;box-shadow:var(--shadow-soft);}
.map-header{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;padding:10px 12px 16px}
.map-header p{margin:0;color:#6f625b}
.map-box{height:460px;border-radius:0;overflow:hidden;border:1px solid var(--line-2)}
.map-filters{display:flex;gap:10px;flex-wrap:wrap}
.filter-chip{padding:8px 14px;background:var(--surface-hi);border:1px solid var(--border);font-size:13px;font-weight:700;color:var(--muted);cursor:pointer;transition:background .16s,color .16s;}
.filter-chip.active{background:var(--accent);color:#fff;border-color:var(--accent);}
.split-map{display:grid;grid-template-columns:1.1fr .9fr;gap:20px}
.map-list{display:grid;gap:10px;max-height:460px;overflow-y:auto;padding-right:0;scrollbar-width:none;-ms-overflow-style:none}
.map-list::-webkit-scrollbar{display:none}
.map-list .small-card{padding:13px 16px;background:var(--surface-hi);border-bottom:1px solid var(--line-2);cursor:pointer;transition:background .16s ease;}
.timeline-list{display:grid;gap:20px}
.timeline-item{
  display:grid;grid-template-columns:1fr 80px 1fr;align-items:center;gap:18px
}
.timeline-item .rail{position:relative;height:100%}
.timeline-item .rail::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;transform:translateX(-50%);background:linear-gradient(180deg, rgba(157,47,52,.25), rgba(157,47,52,.6), rgba(157,47,52,.25))}
.timeline-dot{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:56px;height:56px;border-radius:0;background:var(--paper);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow)
}
.timeline-item .card{min-height:220px}
.timeline-item.right .card:first-child{visibility:hidden}
.timeline-item.left .card:last-child{visibility:hidden}
.drawer-backdrop{
  position:fixed;inset:0;background:rgba(17,12,10,.18);backdrop-filter:blur(6px);
  opacity:0;pointer-events:none;transition:opacity .28s ease;z-index:390
}
.drawer-backdrop.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;height:100vh;width:min(980px,100vw);background:var(--surface);box-shadow:-8px 0 40px rgba(20,14,8,.14);transform:translateX(102%);transition:transform .34s cubic-bezier(.2,.8,.2,1);z-index:400;overflow:auto;}
.drawer.open{transform:translateX(0)}
.drawer-header{position:sticky;top:0;padding:18px 22px;background:rgba(253,248,239,.95);border-bottom:1px solid var(--line);backdrop-filter:blur(12px);display:flex;justify-content:space-between;align-items:center;z-index:3}
.icon-btn{border:none;background:var(--paper);width:52px;height:52px;border-radius:0;box-shadow:var(--shadow);font-size:26px;cursor:pointer}
.drawer-body{padding:26px}
.breadcrumb{font-size:14px;color:var(--muted)}
.detail-head{display:grid;grid-template-columns:110px 1fr;gap:22px;align-items:center;margin-top:12px}
.detail-head h1{font-size:clamp(34px,4vw,64px);line-height:.92;letter-spacing:-.05em;margin:0 0 10px}
.grid-2{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}
.panel{background:var(--surface-hi);border:1px solid var(--border);padding:0;overflow:hidden;}
.panel h3{margin:0 0 12px;font-size:14px;letter-spacing:.25em;text-transform:uppercase;color:var(--accent-2)}
.related-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.small-card{padding:14px 18px;background:linear-gradient(160deg,#fdf8ef,#f2e9d8);border:1px solid var(--line);border-left:3px solid var(--line);cursor:pointer;transition:box-shadow .24s ease,border-left-color .24s ease,background .2s ease}
.small-card:hover{background:var(--hover);}
.muted{color:var(--muted)}
.footer{
  margin-top:44px;padding:34px 0 22px;border-top:1px solid rgba(157,47,52,.08);color:var(--muted)
}
.footer-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:18px}
.footer h4{margin:0 0 10px;font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-2)}
.footer-links{display:grid;gap:10px}
.footer-links a:hover{color:var(--ink)}
.footer-bottom{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-top:20px;margin-top:18px;border-top:1px solid var(--line)}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.pill-links{display:flex;gap:10px;flex-wrap:wrap}
.pill-links a{padding:10px 14px;background:var(--paper);border:1px solid var(--line);border-radius:0;font-weight:700}
.search-layout{display:grid;grid-template-columns:380px 1fr;gap:20px}
.sticky{position:sticky;top:100px}
.listing{display:grid;gap:16px}
.empty{padding:28px;border-radius:0;border:1px dashed var(--line);background:var(--paper-2);color:var(--muted)}
.progress{position:fixed;top:0;left:0;height:4px;background:linear-gradient(90deg,#a6353b,#c28a2d);width:0;z-index:500}
.panel p:last-child,.card p:last-child{margin-bottom:0}
.fade-up{opacity:0;transform:translateY(18px)}
.fade-up.visible{opacity:1;transform:none;transition:opacity .5s ease, transform .5s ease}
.notice-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.cookie-banner{
  position:fixed;left:20px;right:20px;bottom:20px;z-index:800;background:rgba(248,244,237,.97);
  border:1px solid var(--line);border-radius:0;box-shadow:var(--shadow);padding:18px 18px 16px;display:none
}
.cookie-banner.show{display:block}

.site-update-box{margin-top:18px;padding:16px 18px;border:1px solid var(--line);border-radius:0;background:linear-gradient(180deg,#fdf8ef,#f0e5d2);box-shadow:var(--shadow-soft);max-width:760px}
.site-update-box strong{display:block;margin-bottom:6px;font-size:18px}
.site-update-date{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-2);font-weight:800;margin-bottom:8px}
.micro-note{font-size:14px;line-height:1.6;color:var(--muted)}

.hero-tagline{
  display:inline-flex;align-items:center;gap:10px;margin-top:4px;
  font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#6e625b;font-weight:800;white-space:nowrap
}
.hero-tagline::before,.hero-tagline::after{
  content:"";width:28px;height:1px;background:linear-gradient(90deg,var(--line),transparent)
}
.hero-tagline::after{background:linear-gradient(90deg,transparent,var(--line))}
.search-hint{font-size:13px;color:var(--muted);margin-top:8px;text-align:center}
.hero-side{display:flex;flex-direction:column;gap:16px;align-items:stretch}
.book-scene{
  position:relative;min-height:300px;border-radius:0;
  background:
    radial-gradient(circle at 65% 25%, rgba(178,122,42,.18), transparent 22%),
    radial-gradient(circle at 35% 35%, rgba(157,47,52,.10), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.68), rgba(248,244,237,.94));
  border:1px solid var(--line);overflow:hidden;box-shadow:var(--shadow);
}
.book-scene::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg, rgba(157,47,52,.03) 1px, transparent 1px) 0 0/42px 42px,
             linear-gradient(rgba(157,47,52,.03) 1px, transparent 1px) 0 0/42px 42px;
  opacity:.4;pointer-events:none;
}
.book-wrap{
  position:absolute;right:5%;top:50%;transform:translateY(-50%) perspective(1400px) rotateY(-8deg);
  width:min(430px,92%);height:250px;
}
.book{
  position:relative;width:100%;height:100%;transform-style:preserve-3d;animation:bookFloat 6s ease-in-out infinite;
}
.book-cover-left,.book-cover-right,.book-spine,.book-pages{
  position:absolute;top:0;height:100%;border-radius:0;
}
.book-spine{
  left:50%;transform:translateX(-50%);width:18px;height:94%;
  top:3%;border-radius:0;
  background:linear-gradient(180deg,#7f2227,#b77c2b);box-shadow:0 0 0 1px rgba(0,0,0,.05);
  z-index:4;
}
.book-pages{
  left:50%;top:6%;transform:translateX(-50%);width:54%;height:88%;border-radius:0;
  background:linear-gradient(180deg,#f3e7cf,#f7f0de 35%,#ead7b3);filter:drop-shadow(0 8px 12px rgba(0,0,0,.08));
}
.book-pages::before{
  content:"";position:absolute;inset:0;border-radius:0;
  background:repeating-linear-gradient(90deg, rgba(120,88,56,.055), rgba(120,88,56,.055) 1px, transparent 1px, transparent 8px);
  opacity:.55;
}
.book-cover-left,.book-cover-right{
  width:42%;top:2%;height:94%;background:linear-gradient(160deg,#944047,#b77c2b 120%);
  box-shadow:0 18px 28px rgba(18,10,8,.16), inset 0 0 0 1px rgba(255,255,255,.12);
}
.book-cover-left{
  left:10%;transform-origin:right center;animation:coverLeft 4.8s ease-in-out infinite;
}
.book-cover-right{
  right:10%;transform-origin:left center;animation:coverRight 4.8s ease-in-out infinite;
}
.book-cover-left::before,.book-cover-right::before{
  content:"";position:absolute;inset:12px;border-radius:0;border:1px solid rgba(255,255,255,.18);
}
.book-cover-left::after,.book-cover-right::after{
  content:"";position:absolute;inset:20px;border-radius:0;
  background:radial-gradient(circle at 30% 25%, rgba(255,255,255,.16), transparent 20%);
  opacity:.8;
}
.book-emblem{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:78px;height:78px;border-radius:50%;
  background:rgba(255,248,236,.18);border:1px solid rgba(255,255,255,.22);
  display:flex;align-items:center;justify-content:center;color:#fff2dd;font-weight:900;letter-spacing:.08em
}
.book-shadow{
  position:absolute;left:12%;right:12%;bottom:18px;height:30px;
  background:radial-gradient(circle, rgba(31,19,12,.14), transparent 68%);
  filter:blur(10px);
}
.book-caption{
  position:absolute;left:24px;bottom:22px;max-width:220px;z-index:5
}
.book-caption .ey{
  font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);font-weight:800
}
.book-caption strong{display:block;margin-top:8px;font-size:22px;line-height:1.05}
.book-caption p{margin:10px 0 0;font-size:14px;line-height:1.6;color:#6f625b}
@keyframes bookFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-8px)}
}
@keyframes coverLeft{
  0%,100%{transform:rotateY(0deg)}
  20%{transform:rotateY(-14deg)}
  45%{transform:rotateY(-48deg)}
  62%{transform:rotateY(-18deg)}
}
@keyframes coverRight{
  0%,100%{transform:rotateY(0deg)}
  20%{transform:rotateY(14deg)}
  45%{transform:rotateY(48deg)}
  62%{transform:rotateY(18deg)}
}

/* ═══════════════════════════════════════════════════
   AMÉLIORATIONS UX v16 — animations, micro-interactions
   ═══════════════════════════════════════════════════ */


/* ── Titres de pages — deux couleurs, centrés ── */
.page-title{
  font-size:clamp(30px,4vw,52px);font-weight:900;line-height:1.05;letter-spacing:-.03em;
  text-align:center;margin:0 0 8px;
}
.page-title .line1{display:block;color:var(--ink)}
.page-title .line2{display:block;color:var(--accent)}

.page-intro{
  font-size:17px;line-height:1.7;color:#665b53;max-width:560px;
  text-align:center;margin:0 auto 24px;
}

.page-header{
  display:flex;flex-direction:column;align-items:center;
  padding:28px 0 20px;margin-bottom:8px;
}

/* ── Hero title wrapper alignment ── */
.hero-title-wrap{text-align:center;width:100%}

/* ── Section h2 bicolore ── */
.section-bicolor .word1{color:var(--ink)}
.section-bicolor .word2{color:var(--accent-2)}

/* ── KPI card — plus d'harmonie ── */
.kpi{padding:20px 18px;border:1px solid var(--line);background:linear-gradient(145deg,#fdf8ef,#eee4d2);border-radius:0;transition:transform .25s ease, box-shadow .25s ease}
.kpi .label{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);font-weight:800}
.kpi .value{font-size:44px;font-weight:900;color:var(--accent);line-height:1;margin-top:10px;margin-bottom:4px}
.kpi .sub{font-size:13px;color:var(--muted)}

/* ── Search-box-wrap pleine largeur dans le hero ── */
.search-box-wrap{width:100%;max-width:520px}
.search-box-inline{max-width:100%}

/* ── Hero stagger reveal ── */
.hero-stagger{opacity:0;transform:translateY(22px);transition:opacity .55s ease, transform .55s ease}
.hero-stagger.visible{opacity:1;transform:none}

/* ── Count-up KPI ── */
.kpi .value{transition:color .3s ease}
.kpi:hover .value{color:var(--accent-2)}

/* ── Cards hover enrichi ── */
.card{border-left:none;transition:transform .28s ease, box-shadow .28s ease, opacity .5s ease}
.card:hover{transform:translateY(-5px);box-shadow:0 28px 58px rgba(31,19,12,.14)}
.card .cta{display:inline-flex;align-items:center;gap:5px;transition:gap .22s ease}
.card:hover .cta{gap:10px}

/* ── Bouton hover enrichi ── */
.btn{transition:transform .2s ease, box-shadow .2s ease, background .2s ease}
.btn-primary:hover{background:#7a1c22;transform:translateY(-1px);}
.btn-secondary:hover{background:var(--hover);transform:translateY(-1px);}

/* ── Nav active indicator ── */
.nav a.active{background:#fff;box-shadow:0 8px 24px rgba(47,32,22,.06);color:var(--ink);position:relative}
.nav a.active::after{content:"";position:absolute;bottom:6px;left:50%;transform:translateX(-50%);width:18px;height:3px;border-radius:0;background:var(--accent)}

/* ── Hamburger → X animé ── */
.hamburger{display:none;border:none;background:var(--paper);width:52px;height:52px;border-radius:0;box-shadow:var(--shadow);cursor:pointer;position:relative;overflow:hidden;transition:background .2s}
.hamburger-bar{display:block;position:absolute;left:14px;height:2.5px;background:var(--ink);border-radius:0;transition:transform .3s ease, opacity .3s ease, top .3s ease, width .3s ease}
.hamburger-bar:nth-child(1){top:17px;width:24px}
.hamburger-bar:nth-child(2){top:24.5px;width:20px}
.hamburger-bar:nth-child(3){top:32px;width:24px}
.menu-open .hamburger-bar:nth-child(1){top:24.5px;transform:rotate(45deg);width:24px}
.menu-open .hamburger-bar:nth-child(2){opacity:0;transform:scaleX(0)}
.menu-open .hamburger-bar:nth-child(3){top:24.5px;transform:rotate(-45deg);width:24px}

/* ── Autocomplete suggestions ── */
.search-autocomplete{
  position:absolute;top:calc(100% + 6px);left:0;right:0;
  background:#fdf6e8;border:1px solid var(--line);border-radius:0;
  box-shadow:0 20px 48px rgba(31,19,12,.12);z-index:300;overflow:hidden;
  max-height:320px;overflow-y:auto;
  animation:acDrop .18s ease
}
@keyframes acDrop{from{opacity:0;transform:translateY(-6px)} to{opacity:1;transform:translateY(0)}}
.search-ac-item{
  padding:12px 18px;cursor:pointer;display:flex;align-items:center;gap:12px;
  border-bottom:1px solid var(--line-2);transition:background .15s ease
}
.search-ac-item:last-child{border-bottom:none}
.search-ac-item:hover, .search-ac-item.focused{background:#f7f0e6}
.search-ac-kind{font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:800;color:var(--muted);min-width:72px}
.search-ac-name{font-weight:700;font-size:15px;color:var(--ink)}
.search-ac-desc{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:340px}
.search-ac-mark{color:var(--accent);font-weight:900}
.search-box-wrap{position:relative}
.search-ac-footer{padding:10px 18px;font-size:13px;color:var(--muted);background:var(--paper-2);text-align:center}

/* ── Map tooltip ── */
.leaflet-tooltip-own{
  background:#fffdf9;border:1px solid var(--line);border-radius:0;
  padding:6px 12px;font-size:14px;font-weight:700;color:var(--ink);
  box-shadow:0 8px 20px rgba(31,19,12,.1);white-space:nowrap
}

/* ── Timeline dot pulse ── */
.timeline-dot{animation:dotPulse 3s ease-in-out infinite}
@keyframes dotPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(157,47,52,.0), var(--shadow)}
  50%{box-shadow:0 0 0 6px rgba(157,47,52,.08), var(--shadow)}
}

/* ── Section appear avec stagger ── */
.section-head{opacity:0;transform:translateX(-10px);transition:opacity .45s ease, transform .45s ease}
.section-head.visible{opacity:1;transform:none}

/* ── Small cards hover ── */
.small-card{transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease}
.small-card:hover{box-shadow:0 6px 22px rgba(31,19,12,.09);border-left-color:var(--accent)}

/* ── Drawer transition (déjà OK dans CSS, on renforce) ── */
.drawer{transition:transform .36s cubic-bezier(.2,.85,.2,1)}

/* ── Badge hover ── */
.badge{transition:background .18s ease, color .18s ease}
.card:hover .badge{background:#f7ede4;color:var(--ink)}

/* ── Barre progression dégradé animé ── */
.progress{background:linear-gradient(90deg,#a6353b,#c28a2d,#a6353b);background-size:200%;animation:progressShimmer 3s linear infinite}
@keyframes progressShimmer{0%{background-position:0%} 100%{background-position:200%}}

/* ── Footer links hover ── */
.footer-links a{display:inline-flex;align-items:center;gap:6px;transition:color .18s ease, gap .18s ease}
.footer-links a::before{content:"→";font-size:11px;opacity:0;transform:translateX(-4px);transition:opacity .18s ease, transform .18s ease}
.footer-links a:hover{color:var(--ink);gap:8px}
.footer-links a:hover::before{opacity:1;transform:translateX(0)}

/* ── Input focus enrichi ── */
.input:focus{outline:none;border-color:rgba(157,47,52,.4);box-shadow:0 0 0 4px rgba(157,47,52,.08);transition:border-color .2s ease, box-shadow .2s ease}

/* ── KPI card hover ── */
.kpi{transition:transform .25s ease, box-shadow .25s ease}
.kpi:hover{transform:translateY(-3px);box-shadow:var(--shadow)}

/* ── Chip/filter hover ── */
.filter-chip{transition:background .2s ease, color .2s ease, border-color .2s ease}
.filter-chip:hover{background:var(--hover);color:var(--ink);}

/* ── Book scene: renforcer animation ── */
@keyframes bookFloat{0%,100%{transform:translateY(0) rotateZ(0deg)} 50%{transform:translateY(-10px) rotateZ(.3deg)}}

/* ── Scroll-to-top (nouveau) ── */
.scroll-top{
  position:fixed;bottom:28px;right:28px;width:52px;height:52px;border-radius:0;
  background:linear-gradient(135deg,#a6353b,#8e262c);color:#fff;
  border:none;cursor:pointer;z-index:600;
  display:flex;align-items:center;justify-content:center;font-size:20px;
  box-shadow:0 12px 28px rgba(157,47,52,.3);
  opacity:0;pointer-events:none;
  transition:opacity .3s ease, transform .3s ease
}
.scroll-top.visible{opacity:1;pointer-events:auto}
.scroll-top:hover{transform:translateY(-3px)}

/* ══════════════ FIN AMÉLIORATIONS v16 ══════════════ */

.cookie-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.micro-note{font-size:13px;color:var(--muted);line-height:1.6}
@media (max-width: 1060px){
  .hero-grid,.search-layout,.grid-2,.split-map,.footer-grid,.notice-grid{grid-template-columns:1fr}
  .cards{grid-template-columns:repeat(2,1fr)}
  .timeline-item{grid-template-columns:1fr 56px}
  .timeline-item .card:last-child{display:none}
  .timeline-item .card:first-child{visibility:visible !important}
}
@media (max-width: 760px){
  .nav,.header-search{display:none}
  .hamburger{display:flex;align-items:center;justify-content:center}
  .wrap{padding:18px 14px 60px}
  .hero{padding:22px;border-radius:0}
  .hero h1{font-size:clamp(32px,9vw,52px);max-width:none;text-align:center}
  .cards,.cards.two,.related-grid{grid-template-columns:1fr}
  .search-box{grid-template-columns:1fr}
  .hero-kpis{grid-template-columns:1fr 1fr}
  .hero-side{gap:12px}
  .book-scene{min-height:220px}
  .book-wrap{width:94%;height:190px;right:3%}
  .book-caption{left:16px;bottom:16px;max-width:160px}
  .book-caption strong{font-size:18px}
  .hero-tagline{font-size:12px;letter-spacing:.18em}
  .timeline-item{grid-template-columns:36px 1fr}
  .timeline-item .rail{order:1}
  .timeline-item .card{order:2;min-height:0}
  .timeline-item .rail::before{left:18px}
  .timeline-dot{left:18px;width:40px;height:40px;border-radius:0}
  .detail-head{grid-template-columns:1fr}
  .detail-head .avatar,.detail-head .icon-box{margin-bottom:0}
  .drawer{width:100vw}
  .drawer-header{padding:14px 16px}
  .drawer-body{padding:18px 14px 28px}
  .brand-title{font-size:16px}
  .brand-sub{font-size:11px}
  .map-box{height:360px}
  .cookie-banner{left:12px;right:12px;bottom:12px}
}


/* ── Listing / subpage hero — centré, harmonieux ── */
[data-page="personnages"] .hero,
[data-page="lieux"] .hero,
[data-page="evenements"] .hero,
[data-page="recits"] .hero,
[data-page="timeline"] .hero,
[data-page="search"] .hero {
  display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:32px 34px 28px;
}
[data-page] .hero .eyebrow{text-align:center}
[data-page] .hero p{max-width:500px;text-align:center;margin-left:auto;margin-right:auto}
[data-page] .hero .search-box{margin-left:auto;margin-right:auto;width:100%;max-width:480px}

/* ── page-title polish final ── */
.page-title{
  font-size:clamp(32px,4.2vw,56px);font-weight:900;line-height:1.05;letter-spacing:-.032em;
  text-align:center;margin:22px 0 8px;
}
.page-title .line1{display:block;color:var(--ink)}
.page-title .line2{display:block;color:var(--accent)}

/* ── Hero home — colonnes équilibrées, left column centré ── */
.hero-grid > div:first-child{
  display:flex;flex-direction:column;align-items:center;text-align:center;
}
.hero p{text-align:center;margin-left:auto;margin-right:auto}
.search-box-wrap{width:100%;max-width:520px;margin:0 auto}

/* ══ Hero v16.2 — nouvelle structure ══════════════════ */

/* ① Bloc titre + recherche : centré pleine largeur */
.hero-top{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  width:100%;padding-bottom:36px;border-bottom:1px solid var(--line-2);margin-bottom:28px;
}
.hero-top h1{
  font-size:clamp(36px,4.8vw,64px);font-weight:900;line-height:1.05;letter-spacing:-.038em;
  margin:20px 0 6px;text-align:center;
}
.hero-top h1 .line1{display:block;color:var(--ink)}
.hero-top h1 .line2{display:block;color:var(--accent)}
.hero-top .hero-tagline{margin-top:18px;margin-bottom:6px}
.hero-top p{font-size:17px;line-height:1.7;color:#665b53;max-width:480px;text-align:center;margin:18px auto 0}
.hero-top .search-box-wrap{width:100%;max-width:580px;margin-top:20px}
.hero-top .search-hint{text-align:center;margin-top:8px}
.hero-top .cta-row{justify-content:center}

/* ② Bloc bas : KPIs gauche + encart droite */
.hero-bottom{
  display:grid;grid-template-columns:1fr 1.4fr;gap:20px;align-items:stretch;width:100%;
}
.hero-bottom .hero-kpis{
  display:grid;grid-template-columns:repeat(2,1fr);gap:12px;align-content:start;
}
.hero-bottom .site-update-box{
  margin:0;align-self:stretch;display:flex;flex-direction:column;justify-content:center;
}

/* Supprimer l'ancienne hero-grid */
.hero-grid{display:block}
.hero-side{display:none}

/* ── Responsive hero-bottom ── */
@media(max-width:860px){
  .hero-bottom{grid-template-columns:1fr}
  .hero-bottom .hero-kpis{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:600px){
  .hero-bottom .hero-kpis{grid-template-columns:repeat(2,1fr)}
  .hero-top h1{font-size:clamp(30px,9vw,48px)}
}

/* ══ Listing pages — CTA après le filtre ══════════════ */
.listing-search-wrap{
  display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;
  width:100%;max-width:520px;margin:18px auto 0;
}
.listing-search-wrap .input{width:100%}

/* ══ FIN Hero v16.2 ═══════════════════════════════════ */


/* ════════════════════════════════════════════════════
   WOW EFFECTS v16.3
   ════════════════════════════════════════════════════ */

/* ── 1. PARALLAX TEXTURE — fond qui respire ── */
body::before {
  content:"";
  position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(ellipse 80% 60% at 15% 20%, rgba(157,47,52,.045) 0%, transparent 60%),
    radial-gradient(ellipse 60% 50% at 85% 75%, rgba(178,122,42,.04) 0%, transparent 55%);
  animation:bgBreath 14s ease-in-out infinite;
}
@keyframes bgBreath{
  0%,100%{opacity:.7;transform:scale(1)}
  50%{opacity:1;transform:scale(1.04)}
}

/* ── 2. BRAND MARK — shimmer hover ── */
.brand-mark{
  transition:transform .3s ease,box-shadow .3s ease;
  overflow:hidden;
}
.brand-mark::after{
  content:"";position:absolute;top:-60%;left:-75%;
  width:50%;height:220%;
  background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.28) 50%,transparent 60%);
  transform:skewX(-15deg);
  transition:left .55s ease;
  pointer-events:none;
}
.brand:hover .brand-mark{transform:translateY(-2px);box-shadow:0 14px 32px rgba(157,47,52,.28)}
.brand:hover .brand-mark::after{left:130%}

/* ── 3. HERO H1 — underline animé sous line2 ── */
.hero-top h1 .line2,.page-title .line2{
  position:relative;display:inline-block;
}
.hero-top h1 .line2::after,.page-title .line2::after{
  content:"";position:absolute;bottom:-4px;left:0;right:0;height:4px;
  border-radius:0;
  background:linear-gradient(90deg,var(--accent),var(--accent-2),var(--accent));
  background-size:200%;
  transform:scaleX(0);transform-origin:left;
  transition:transform .7s cubic-bezier(.2,.8,.2,1) .3s;
  animation:none;
}
.hero-stagger.visible .line2::after,.page-title .line2::after{
  transform:scaleX(1);
  animation:lineShimmer 3s linear infinite 1s;
}
@keyframes lineShimmer{
  0%{background-position:0%}100%{background-position:200%}
}

/* ── 4. CARDS — reflet brillant au hover ── */
.card::before{
  content:"";position:absolute;top:-80%;left:-60%;
  width:40%;height:260%;
  background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.18) 50%,transparent 65%);
  transform:skewX(-15deg);
  transition:left .5s ease;
  pointer-events:none;z-index:2;
}
.card:hover::before{left:130%}

/* ── 5. TIMELINE DOT — halo pulsant renforcé ── */
.timeline-dot{
  transition:transform .3s ease;
}
.timeline-dot:hover{transform:translate(-50%,-50%) scale(1.15)}
@keyframes dotPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(157,47,52,.0),var(--shadow)}
  40%{box-shadow:0 0 0 8px rgba(157,47,52,.10),var(--shadow)}
  70%{box-shadow:0 0 0 14px rgba(157,47,52,.04),var(--shadow)}
}

/* ── 6. SECTION HEAD — ligne déco animée ── */
.section-head::before{
  content:"";width:0;height:3px;border-radius:0;
  background:linear-gradient(90deg,var(--accent),var(--accent-2));
  transition:width .6s cubic-bezier(.2,.8,.2,1);
  flex-shrink:0;
}
.section-head.visible::before{width:28px}

/* ── 7. BADGE KPI — glow sur la valeur ── */
.kpi .value{
  background:linear-gradient(135deg,var(--accent),#c0423a,var(--accent-2));
  background-clip:text;-webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-size:200%;
  animation:kpiGradient 4s ease infinite;
}
@keyframes kpiGradient{
  0%,100%{background-position:0%}
  50%{background-position:100%}
}

/* ── 8. BTN PRIMARY — effet ripple au clic ── */
.btn-primary{position:relative;overflow:hidden}
.btn-ripple{
  position:absolute;border-radius:50%;
  background:rgba(255,255,255,.35);
  transform:scale(0);animation:ripple .55s linear;
  pointer-events:none;
}
@keyframes ripple{to{transform:scale(4);opacity:0}}

/* ── 9. SCROLL-TO-TOP — rotation au hover ── */
.scroll-top:hover{transform:translateY(-3px) rotate(-5deg)}

/* ── 10. FOOTER — vague décorative ── */
.footer{position:relative;overflow:hidden}
.footer::before{
  content:"";position:absolute;top:-2px;left:-5%;right:-5%;height:3px;
  background:linear-gradient(90deg,transparent,var(--accent),var(--accent-2),var(--accent),transparent);
  animation:footerLine 4s ease infinite;
  background-size:200%;
}
@keyframes footerLine{0%{background-position:0%}100%{background-position:200%}}

/* ── 11. HEADER — underline actif animé ── */
.nav a.active::after{
  animation:navDot .4s cubic-bezier(.2,.8,.2,1) forwards;
}
@keyframes navDot{from{width:0;opacity:0}to{width:18px;opacity:1}}

/* ── 12. MAP MARKERS — pulse Leaflet ── */
.leaflet-interactive{
  transition:r .2s ease,opacity .2s ease;
}

/* ── FORMULAIRE CONTACT ── */
.contact-layout{
  display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:start;
}
.contact-form-card{
  background:linear-gradient(160deg,#fdf8ef,#f2e9d8);
  border:1px solid var(--line);border-radius:0;
  padding:32px;box-shadow:var(--shadow);
  transition:box-shadow .3s ease;
}
.contact-form-card:focus-within{box-shadow:0 24px 60px rgba(31,19,12,.13)}

.contact-form-header{display:flex;align-items:center;gap:16px;margin-bottom:28px;padding-bottom:22px;border-bottom:1px solid var(--line-2)}
.contact-form-icon{
  width:52px;height:52px;border-radius:0;
  background:linear-gradient(135deg,#a6353b,#8e262c);
  color:#fff;display:flex;align-items:center;justify-content:center;
  font-size:22px;flex-shrink:0;
}
.contact-form-title{margin:0 0 4px;font-size:20px;font-weight:800;color:var(--ink)}
.contact-form-sub{margin:0;font-size:14px;color:var(--muted)}
.contact-mailto{color:var(--accent);font-weight:700}

.contact-field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.contact-fields{display:grid;gap:18px}
.contact-field-group{display:flex;flex-direction:column;gap:7px}
.contact-label{font-size:13px;font-weight:700;color:var(--ink);letter-spacing:.04em}
.contact-required{color:var(--accent)}
.contact-input{width:100%;transition:border-color .2s ease,box-shadow .2s ease,transform .15s ease}
.contact-input:focus{transform:translateY(-1px)}
.contact-textarea{min-height:140px;resize:vertical;line-height:1.6}

.contact-field-check{flex-direction:row;align-items:flex-start;gap:10px}
.contact-check-label{display:flex;align-items:flex-start;gap:10px;font-size:13px;color:var(--muted);line-height:1.5;cursor:pointer}
.contact-check-label input[type=checkbox]{margin-top:2px;accent-color:var(--accent);width:16px;height:16px;flex-shrink:0}
.contact-check-label a{color:var(--accent);font-weight:700}

.contact-submit{width:100%;height:56px;font-size:16px;justify-content:space-between;padding:0 22px;
  background:linear-gradient(135deg,#a6353b,#8e262c);
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
.contact-submit:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(157,47,52,.3)}
.contact-submit-arrow{font-size:20px;transition:transform .2s ease}
.contact-submit:hover .contact-submit-arrow{transform:translateX(4px)}

.contact-error{padding:12px 16px;background:#fdf0f0;border:1px solid #f7c1c1;border-radius:0;font-size:14px;color:#a32d2d;font-weight:600}

.contact-success{text-align:center;padding:24px 16px;animation:successIn .5s cubic-bezier(.2,.8,.2,1)}
@keyframes successIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.contact-success-icon{
  width:72px;height:72px;border-radius:50%;margin:0 auto 16px;
  background:linear-gradient(135deg,#3B6D11,#639922);
  color:#fff;font-size:32px;display:flex;align-items:center;justify-content:center;
}
.contact-success h3{font-size:22px;font-weight:800;margin:0 0 10px}
.contact-success p{color:#665b53;line-height:1.65}

.contact-aside{display:grid;gap:16px}
.contact-info-card{
  background:linear-gradient(160deg,#fffdf9,#f9f4eb);
  border:1px solid var(--line);border-radius:0;padding:22px;
  box-shadow:var(--shadow-soft);
  transition:transform .25s ease,box-shadow .25s ease;
}
.contact-info-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.contact-info-card--accent{
  background:linear-gradient(160deg,#fdf5f5,#f9eded);
  border-color:rgba(157,47,52,.15);
}
.contact-info-icon{font-size:24px;margin-bottom:10px}
.contact-info-title{margin:0 0 8px;font-size:16px;font-weight:800;color:var(--ink)}
.contact-email-link{
  display:inline-block;color:var(--accent);font-weight:800;font-size:15px;
  border-bottom:2px solid rgba(157,47,52,.2);
  transition:border-color .2s ease,color .2s ease;
}
.contact-email-link:hover{border-color:var(--accent);color:#7a2328}
.contact-tips{margin:8px 0 0;padding-left:18px;display:grid;gap:6px;color:#6f625b;font-size:14px;line-height:1.55}
.contact-tips li::marker{color:var(--accent)}

@media(max-width:900px){
  .contact-layout{grid-template-columns:1fr}
  .contact-field-row{grid-template-columns:1fr}
}

/* ════════════════════════════════════════════════════
   FIN WOW EFFECTS v16.3
   ════════════════════════════════════════════════════ */


/* ════════════════════════════════════════════════════
   CORRECTIONS v16.4 — carrés + aération + glow cards
   ════════════════════════════════════════════════════ */

/* ── Coins carrés partout — override agressif ── */
*, *::before, *::after {
  border-radius: 0 !important;
}
/* Exception : cercles explicites (brand-mark, avatar, icônes rondes) */
.brand-mark,
.contact-success-icon,
.contact-form-icon,
.book-emblem {
  border-radius: 50% !important;
}
/* Scrollbar thumb */
::-webkit-scrollbar-thumb { border-radius: 0 !important; }

/* ── NAV pills — carrés aussi, style différent ── */
.nav a {
  padding: 8px 14px;
  border-radius: 0 !important;
}
.nav a.active {
  border-bottom: 2px solid var(--accent);
  background: transparent;
  box-shadow: none;
}
.nav a.active::after { display: none; }
.nav a:hover { background: transparent; box-shadow: none; border-bottom: 2px solid var(--line); }

/* ── Aération hero — espacements ── */
.hero-top .eyebrow { margin-bottom: 4px; }
.hero-top h1 { margin: 16px 0 8px; line-height: 1.04; }
.hero-top p { margin-top: 20px; }
.hero-top .search-box-wrap { margin-top: 28px; }
.hero-top .search-hint { margin-top: 10px; }
.hero-top .cta-row { margin-top: 20px !important; }
.hero-top .hero-tagline { margin: 16px 0 4px; }

/* Aération hero listing pages */
[data-page="personnages"] .hero,
[data-page="lieux"] .hero,
[data-page="evenements"] .hero,
[data-page="recits"] .hero,
[data-page="timeline"] .hero,
[data-page="search"] .hero {
  padding: 40px 34px 36px;
}
[data-page] .hero h1,
[data-page] .hero .page-title { margin: 18px 0 14px; }
[data-page] .hero p { margin-top: 14px; }

/* ── GLOW animé sur les cards ── */
.card {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--line);
}
.card::after {
  content: "";
  position: absolute;
  inset: -2px;
  border: 2px solid transparent;
  pointer-events: none;
  transition: border-color .3s ease, box-shadow .3s ease;
  z-index: 2;
}
.card:hover::after {
  border-color: rgba(157,47,52,.0);
  box-shadow:
    inset 0 0 0 2px rgba(157,47,52,.0);
  animation: cardGlow .8s ease forwards;
}
@keyframes cardGlow {
  0%   { box-shadow: 0 0 0 0 rgba(157,47,52,.0), inset 0 0 0 0 rgba(157,47,52,.0); border-color: rgba(157,47,52,.0); }
  15%  { box-shadow: 4px 0 14px -2px rgba(157,47,52,.18), inset 2px 0 0 0 rgba(157,47,52,.0); border-color: rgba(157,47,52,.0); }
  35%  { box-shadow: 4px 4px 14px -2px rgba(157,47,52,.18), inset 0 0 0 0 rgba(157,47,52,.0); }
  55%  { box-shadow: -4px 4px 14px -2px rgba(157,47,52,.18), inset 0 0 0 0 rgba(157,47,52,.0); }
  75%  { box-shadow: -4px 0 14px -2px rgba(157,47,52,.18), inset 0 0 0 0 rgba(157,47,52,.0); }
  100% {
    box-shadow: 0 0 0 0 rgba(157,47,52,.0);
    border-color: rgba(157,47,52,.25);
    outline: 2px solid rgba(157,47,52,.22);
    outline-offset: -1px;
  }
}

/* Glow final — bordure lumineuse permanente au hover */
.card:hover {
  border-color: rgba(157,47,52,.3);
  box-shadow:
    0 0 0 2px rgba(157,47,52,.12),
    0 0 22px rgba(157,47,52,.10),
    0 20px 45px rgba(31,19,12,.10);
  transform: translateY(-4px);
}

/* ── SMALL-CARDS — style sympa plat ── */
.small-card strong {
  font-size: 15px;
  color: var(--ink);
  display: block;
  margin-bottom: 5px;
}
.small-card .muted {
  font-size: 13px;
  line-height: 1.55;
}
.map-list .small-card {
  background: linear-gradient(160deg,var(--paper),var(--paper-2));
  border-top: none;
  border-right: none;
  border-bottom: 1px solid var(--line-2);
  border-left: 3px solid var(--line);
  padding: 14px 16px;
  box-shadow: none;
  transition: border-left-color .2s ease, background .2s ease;
}
.map-list .small-card:hover {
  border-left-color: var(--accent);
  background: var(--paper-2);
}
.map-list .small-card:first-child { border-top: 1px solid var(--line-2); }

/* Panel lieux repères — container plat sans scroll visible */
.panel {
  border: 1px solid var(--line);
  background: linear-gradient(160deg,var(--paper),var(--paper-2));
  padding: 0;
  overflow: hidden;
}
.panel h3 {
  margin: 0;
  padding: 16px 20px 14px;
  font-size: 13px;
  letter-spacing: .25em;
  text-transform: uppercase;
  color: var(--accent-2);
  border-bottom: 1px solid var(--line-2);
  background: var(--paper-2);
}
.panel > p, .panel > div { padding: 0 20px; }

/* Panel classique (drawer, a-propos) — restaurer le padding intérieur */
.drawer-body .panel,
.grid-2 .panel,
.contact-form-wrap .panel {
  padding: 22px;
}
.drawer-body .panel h3,
.grid-2 .panel h3 {
  padding: 0 0 10px;
  border-bottom: none;
  background: transparent;
  margin: 0 0 12px;
}

/* ── Scrollbar masquée sur map-list ── */
.map-list { scrollbar-width: none; -ms-overflow-style: none; }
.map-list::-webkit-scrollbar { display: none; }

/* ── Section head aéré ── */
.section-head { margin-top: 8px; }
.section-head h2 {
  font-size: 12px;
  letter-spacing: .32em;
  text-transform: uppercase;
  color: var(--accent-2);
  font-weight: 800;
  margin: 0;
}

/* ── KPI — fond blanc plat ── */
.kpi {
  background: linear-gradient(145deg,var(--paper),var(--paper-2));
  border: 1px solid var(--line);
  padding: 20px;
}
.kpi .value {
  font-size: 46px;
}

/* ── Inputs — style carré avec focus propre ── */
.input, .select {
  border-radius: 0 !important;
  border: 1px solid var(--line);
  background: #fdf6e8;
}
.input:focus, .select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(157,47,52,.10);
  outline: none;
}

/* ── Boutons carrés ── */
.btn { border-radius: 0 !important; }
.btn-secondary { border: 1px solid var(--line); background: #faf3e6; }
.btn-secondary:hover { background: #f0ebe1; border-color: #c4b49e; }

/* ── Hero section — fond dégradé crème ── */
.hero {
  background:linear-gradient(160deg,var(--paper),var(--paper-2));
  border: 1px solid var(--line);
}

/* ── Autocomplete ── */
.search-autocomplete { border: 1px solid var(--line); }
.search-ac-item:hover, .search-ac-item.focused { background: #fdf4ea; }

/* ── Site-update-box — fond plat ── */
.site-update-box {
  background: linear-gradient(180deg,#fdf8ef,#f0e5d2);
  border: 1px solid var(--line);
  border-left: 3px solid var(--accent-2);
}

/* ── Map box ── */
.map-shell { background: linear-gradient(160deg,#fdf6e8,#f0e5d0); border: 1px solid var(--line); padding: 0; }
.map-box { border: none; border-top: 1px solid var(--line); }
.map-header { padding: 16px 18px; }

/* ── Timeline dot carré ── */
.timeline-dot {
  width: 50px; height: 50px;
  background: var(--paper);
  border: 1px solid var(--line);
}

/* ── Footer plat ── */
.footer { background: transparent; }

/* ── Cookie banner ── */
.cookie-banner { border: 1px solid var(--line); background: #fdf6e8; }

/* ── Drawer ── */
.drawer { background: linear-gradient(180deg, #fdf8ef, #f2e9d8); }
.drawer-header { background: #fdf8ef; }

/* ════════ FIN v16.4 ════════ */


/* ════════════════════════════════════════════════════
   CORRECTIONS v16.5 — palette crème, filtres, flèches
   ════════════════════════════════════════════════════ */

/* ── Override global blanc → crème (filet de sécurité) ── */
.card, .kpi, .panel, .small-card, .badge,
.btn-secondary, .filter-chip, .input, .select,
.timeline-dot, .cookie-banner, .site-update-box,
.search-autocomplete, .drawer, .drawer-header,
.icon-btn, .hamburger, .mobile-menu .close,
.mobile-menu a, .pill-links a, .empty,
.contact-form-card, .contact-info-card,
.map-shell, .hero {
  --local-bg: linear-gradient(160deg, var(--paper), var(--paper-2));
}
/* Cards — fond crème dégradé */
.card {
  background: linear-gradient(180deg, #fdf8ef, #f5eedd) !important;
}
/* Badges */
.badge { background: var(--paper-2) !important; }
/* KPI */
.kpi { background: linear-gradient(145deg, var(--paper), var(--paper-2)) !important; }
/* Panel */
.panel { background: linear-gradient(160deg, var(--paper), var(--paper-2)) !important; }
/* Small cards */
.small-card { background: linear-gradient(160deg, var(--paper), var(--paper-2)) !important; }
/* Inputs */
.input, .select, textarea.input { background: var(--paper) !important; }
/* Boutons secondary */
.btn-secondary { background: var(--paper) !important; }
/* Filter chips */
.filter-chip { background: #faf3e6 !important; }
.filter-chip.active { background: #e8d8bf !important; color: var(--ink); border-color: #c8b89a; }
/* Contact cards */
.contact-form-card, .contact-info-card {
  background: linear-gradient(160deg, #fdf8ef, #f2e9d8) !important;
}
/* hero */
.hero { background: linear-gradient(160deg, var(--paper), var(--paper-2)) !important; }
/* map-shell */
.map-shell { background: linear-gradient(160deg, var(--paper), var(--paper-2)) !important; }
/* panel h3 title bar */
.panel > h3 { background: #ede4d0 !important; }
/* map-list small-card fond crème */
.map-list .small-card { background: linear-gradient(160deg, var(--paper), var(--paper-2)) !important; }
.map-list .small-card:hover { background: #e8dbc8 !important; border-left-color: var(--accent); }

/* ── Map header — filtres alignés avec la capture ── */
.map-header {
  padding: 16px 18px 12px;
  border-bottom: 1px solid var(--line-2);
}
.map-header strong { font-size: 16px; font-weight: 800; color: var(--ink); display: block; margin-bottom: 3px; }
.map-header p { font-size: 14px; color: var(--muted); margin: 0 0 0; }

.map-filters {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  padding: 12px 18px;
  border-bottom: 1px solid var(--line-2);
  background: #ede0cc;
}
.filter-chip {
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 700;
  border: 1px solid var(--line);
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}

/* ── Panneau lieux repères — container avec flèches ── */
.map-list-wrap {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 400px;
  overflow: hidden;
}
.map-list {
  flex: 1;
  overflow-y: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  gap: 0;
}
.map-list::-webkit-scrollbar { display: none; }

/* Flèches scroll */
.map-scroll-btn {
  width: 100%;
  height: 36px;
  background: #ede0cc;
  border: none;
  border-top: 1px solid var(--line-2);
  color: var(--muted);
  font-size: 11px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .18s ease, color .18s ease, opacity .2s ease;
  flex-shrink: 0;
  letter-spacing: .05em;
}
.map-scroll-btn:hover { background: #d9c9af; color: var(--ink); }
.map-scroll-up { border-top: none; border-bottom: 1px solid var(--line-2); order: -1; }
.map-scroll-down { order: 10; }

/* Small-cards dans map-list — style lignes */
.map-list .small-card {
  border-top: none !important;
  border-right: none !important;
  border-left: 3px solid var(--line) !important;
  border-bottom: 1px solid var(--line-2) !important;
  padding: 13px 16px !important;
  box-shadow: none !important;
}
.map-list .small-card:first-child { border-top: none !important; }
.map-list .small-card strong { font-size: 14px; font-weight: 800; color: var(--ink); }
.map-list .small-card .muted { font-size: 12px; margin-top: 3px !important; }

/* Panel lieux — h3 title en haut */
.panel > h3 {
  padding: 14px 18px !important;
  margin: 0 !important;
  font-size: 12px !important;
  letter-spacing: .28em !important;
  text-transform: uppercase !important;
  color: var(--accent-2) !important;
  border-bottom: 1px solid var(--line-2) !important;
}

/* ── Split map — hauteur carte = panel ── */
.split-map { align-items: stretch; }
.map-shell { display: flex; flex-direction: column; }
.map-box { flex: 1; height: auto; min-height: 380px; }

/* ── Hero — plus de fond blanc dans v16.4 override ── */
/* (géré par !important ci-dessus) */

/* ════ FIN v16.5 ════ */


/* ════════════════════════════════════════════════════
   DRAWER v16.6 — plus large, icônes, related-cards
   ════════════════════════════════════════════════════ */

/* ── Barre de type en tête ── */
.drawer-kind-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 28px;
  background: var(--paper-2);
  border-bottom: 1px solid var(--line);
  font-size: 12px;
  letter-spacing: .22em;
  text-transform: uppercase;
  font-weight: 800;
}
.drawer-kind-label { color: var(--accent); }
.drawer-kind-sep { color: var(--line); }
.breadcrumb-inline { color: var(--muted); }

/* ── Hero fiche ── */
.drawer-hero {
  display: flex;
  align-items: flex-start;
  gap: 22px;
  padding: 28px 28px 22px;
  border-bottom: 1px solid var(--line-2);
  background: linear-gradient(160deg, #fdf6e8, #f4ead6);
}
.drawer-hero-visual { flex-shrink: 0; }
.drawer-hero-visual .avatar,
.drawer-hero-visual .icon-box {
  width: 80px; height: 80px;
  margin-bottom: 0;
}
.drawer-hero-body { flex: 1; min-width: 0; }
.drawer-title {
  font-size: clamp(26px, 3.2vw, 40px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -.03em;
  margin: 0 0 10px;
  color: var(--ink);
}
.drawer-desc {
  font-size: 16px;
  line-height: 1.65;
  color: #665b53;
  margin: 0 0 12px;
}

/* ── Layout deux colonnes dans le drawer ── */
.drawer-cols {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 0;
  align-items: start;
  padding: 0;
}
.drawer-col-main {
  padding: 24px 22px 40px;
  display: grid;
  gap: 20px;
  border-right: 1px solid var(--line-2);
}
.drawer-col-side {
  padding: 24px 22px 40px;
  display: grid;
  gap: 16px;
}

/* ── Drawer panels ── */
.drawer-panel {
  background: linear-gradient(160deg, #fdf8ef, #f2e9d8);
  border: 1px solid var(--line);
  padding: 0;
  overflow: hidden;
}
.drawer-panel-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--accent-2);
  background: #ede4d0;
  border-bottom: 1px solid var(--line);
}
.dp-icon {
  width: 16px; height: 16px;
  color: var(--accent-2);
  flex-shrink: 0;
}
.drawer-text {
  font-size: 16px;
  line-height: 1.8;
  color: var(--ink);
  padding: 16px;
  margin: 0;
}
.drawer-text-sm {
  font-size: 14px;
  line-height: 1.65;
  color: #665b53;
  padding: 14px 16px 10px;
  margin: 0;
}
.drawer-panel--cta { border-top: 3px solid var(--accent); }
.drawer-cta-btn {
  display: block;
  margin: 0 16px 16px;
  text-align: center;
  font-size: 14px;
  height: 46px;
}

/* Panneau Repères (side panel) */
.drawer-col-side .panel {
  padding: 0;
  overflow: hidden;
}
.drawer-col-side .panel h3 {
  padding: 12px 16px;
  margin: 0;
  font-size: 11px;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--accent-2);
  background: #ede4d0;
  border-bottom: 1px solid var(--line);
}
.drawer-col-side .panel p {
  padding: 10px 16px 0;
  font-size: 14px;
  line-height: 1.6;
  margin: 0;
}
.drawer-col-side .panel p:last-child { padding-bottom: 14px; }
.drawer-col-side .panel strong { color: var(--ink); font-weight: 700; display: block; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin-bottom: 2px; }

/* ── Related sections avec icônes ── */
.related-section {
  background: linear-gradient(160deg, #fdf8ef, #f2e9d8);
  border: 1px solid var(--line);
  overflow: hidden;
}
.related-section-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  background: #ede4d0;
  border-bottom: 1px solid var(--line);
}
.related-section-head svg.rc-icon {
  width: 18px; height: 18px; flex-shrink: 0; opacity: .7;
}
.related-section-head h3 {
  margin: 0;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--accent-2);
}

/* ── Grille related-cards ── */
.related-grid-v2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0;
}
.related-card {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line-2);
  border-right: 1px solid var(--line-2);
  cursor: pointer;
  transition: background .18s ease;
  background: linear-gradient(160deg, #fdf8ef, #f2e9d8);
}
.related-card:nth-child(even) { border-right: none; }
.related-card:nth-last-child(-n+2) { border-bottom: none; }
.related-card:hover { background: #e8dbc8; }

.rc-visual {
  flex-shrink: 0;
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #ede4d0, #d9cbb5);
  border: 1px solid var(--line);
}
svg.rc-icon { width: 22px; height: 22px; display: block; }

.rc-body { flex: 1; min-width: 0; }
.rc-kind {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 3px;
}
.rc-title {
  display: block;
  font-size: 13px;
  font-weight: 800;
  color: var(--ink);
  line-height: 1.3;
  margin-bottom: 4px;
}
.rc-desc {
  font-size: 12px;
  color: #7a6c64;
  line-height: 1.5;
}

/* ── Responsive drawer ── */
@media (max-width: 860px) {
  .drawer-cols { grid-template-columns: 1fr; }
  .drawer-col-main { border-right: none; border-bottom: 1px solid var(--line-2); }
}
@media (max-width: 600px) {
  .drawer-hero { flex-direction: column; }
  .related-grid-v2 { grid-template-columns: 1fr; }
  .related-card { border-right: none; }
}

/* ════ FIN DRAWER v16.6 ════ */


/* ════════════════════════════════════════════════════
   COMPOSANTS v16.7 — palette propre, sans dégradés
   ════════════════════════════════════════════════════ */

/* ── Override global — zéro dégradé sur les surfaces ── */
.card,.kpi,.panel,.small-card,.badge,.btn-secondary,
.filter-chip,.input,.select,.site-update-box,
.map-shell,.hero,.drawer,.drawer-header,
.contact-form-card,.contact-info-card,
.related-section,.related-card,.drawer-panel,
.drawer-hero,.rc-visual,.livre-card,
.mobile-menu a,.cookie-banner {
  background-image: none !important;
}
.card { background: var(--surface-hi) !important; }
.kpi { background: transparent !important; border: none !important; }
.panel { background: var(--surface-hi) !important; }
.small-card { background: var(--surface-hi) !important; }
.badge { background: var(--surface) !important; }
.btn-secondary { background: var(--surface-hi) !important; }
.filter-chip { background: var(--surface-hi) !important; }
.filter-chip.active { background: var(--accent) !important; color: #fff !important; border-color: var(--accent) !important; }
.input, .select, textarea.input { background: var(--surface-hi) !important; }
.site-update-box { background: var(--surface-hi) !important; }
.map-shell { background: var(--surface-hi) !important; }
.hero { background: var(--surface-hi) !important; }
.drawer { background: var(--surface) !important; }
.drawer-header { background: var(--surface-hi) !important; }
.drawer-hero { background: var(--surface) !important; }
.drawer-panel { background: var(--surface-hi) !important; }
.related-section { background: var(--surface-hi) !important; }
.related-card { background: var(--surface-hi) !important; }
.related-card:hover { background: var(--hover) !important; }
.rc-visual { background: var(--surface) !important; }
.mobile-menu a { background: var(--surface-hi) !important; }
.cookie-banner { background: var(--surface-hi) !important; }
.avatar,.icon-box { background: var(--surface) !important; }
.map-list .small-card { background: var(--surface-hi) !important; }
.map-list .small-card:hover { background: var(--hover) !important; border-left-color: var(--accent); }

/* ── Hover card — outline complet bordeaux ── */
.card { outline: 2px solid transparent; outline-offset: -1px; transition: background .18s, outline-color .18s, transform .2s, box-shadow .2s; }
.card:hover { background: var(--surface) !important; outline-color: var(--accent); transform: translateY(-3px); box-shadow: var(--shadow); }
/* Supprimer les anciens effets ::before ::after parasites */
.card::before { display: none; }
.card::after { display: none; }

/* ── Section head — ligne fine ── */
.section-head::before { display: none; }
.section-head::after { display: block !important; content: "" !important; flex: 1; height: 1px; background: var(--border) !important; }
.section-head.visible { opacity: 1; transform: none; }

/* ── KPIs bar — séparateurs fins dans le hero ── */
.hero-kpis-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin-top: 36px;
  border-top: 1px solid var(--border);
  width: calc(100% + 88px);
  margin-left: -44px;
  margin-bottom: 0;
}
.hero-kpis-bar .kpi {
  padding: 22px 20px;
  border-right: 1px solid var(--border);
  background: var(--surface) !important;
}
.hero-kpis-bar .kpi:last-child { border-right: none; }
.kpi .label { font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); font-weight: 700; }
.kpi .value { font-size: 40px; font-weight: 900; color: var(--accent); line-height: 1; margin: 8px 0 4px; background: none !important; -webkit-text-fill-color: var(--accent); animation: none !important; }
.kpi .sub { font-size: 12px; color: var(--muted); }
.kpi:hover { transform: none; box-shadow: none; }

/* ── Hero top — centrage propre ── */
.hero { text-align: center; display: flex; flex-direction: column; align-items: center; }
.hero .eyebrow { text-align: center; }
.hero h1 { margin: 16px 0 8px; font-size: clamp(38px, 4.8vw, 62px); letter-spacing: -.04em; }
.hero h1 .line1 { color: var(--ink); }
.hero h1 .line2 { color: var(--accent); }
.hero-tagline { margin: 14px 0 4px; color: var(--muted); }
.hero p { max-width: 460px; color: var(--muted); font-size: 16px; margin: 14px auto 0; }
.search-box-wrap { margin-top: 26px; width: 100%; max-width: 520px; }
.search-hint { text-align: center; }
.cta-row { justify-content: center; }

/* ── STRATE MISE À JOUR ── */
.update-strate {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0;
  background: var(--surface-hi);
  border: 1px solid var(--border);
  margin-top: 16px;
  box-shadow: var(--shadow-soft);
  overflow: hidden;
}
.update-book {
  padding: 36px 32px;
  background: var(--surface);
  border-right: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
}
.book-visual { filter: drop-shadow(0 8px 20px rgba(20,14,8,.18)); }
.update-content {
  padding: 36px 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 14px;
}
.update-date-pill {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--gold);
}
.update-title {
  font-size: clamp(22px, 2.8vw, 34px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -.03em;
  margin: 0;
}
.update-title span { display: block; color: var(--ink); }
.update-title .update-title-accent { color: var(--accent); }
.update-desc { font-size: 15px; color: var(--muted); line-height: 1.65; margin: 0; max-width: 440px; }
.update-book-name {
  padding: 14px 16px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
}
.update-book-label { font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); font-weight: 700; margin-bottom: 5px; }
.update-book-title { font-size: 16px; font-weight: 800; color: var(--ink); line-height: 1.2; }
.update-book-meta { font-size: 13px; color: var(--muted); margin-top: 3px; }
.update-cta { align-self: flex-start; margin-top: 4px; }

@media (max-width: 860px) {
  .update-strate { grid-template-columns: 1fr; }
  .update-book { border-right: none; border-bottom: 1px solid var(--border); padding: 28px; }
}

/* ── PAGE LIVRES ── */
.livres-grid { display: grid; grid-template-columns: 1fr; gap: 1px; background: var(--border); border: 1px solid var(--border); }
.livre-card {
  display: grid; grid-template-columns: 140px 1fr; gap: 0;
  background: var(--surface-hi);
  transition: background .16s;
}
.livre-card:hover { background: var(--surface); }
.livre-card--active { border-left: 4px solid var(--accent); }
.livre-cover {
  padding: 28px 24px;
  background: var(--surface);
  border-right: 1px solid var(--border);
  display: flex; align-items: center; justify-content: center;
  position: relative;
}
.livre-status-badge {
  position: absolute; top: 12px; left: 12px;
  background: var(--accent); color: #fff;
  font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
  padding: 4px 8px;
}
.livre-info { padding: 28px 32px; display: flex; flex-direction: column; gap: 10px; }
.livre-eyebrow { font-size: 10px; letter-spacing: .24em; text-transform: uppercase; color: var(--gold); font-weight: 800; }
.livre-title { font-size: 22px; font-weight: 900; letter-spacing: -.02em; color: var(--ink); line-height: 1.15; margin: 0; }
.livre-meta { font-size: 13px; color: var(--muted); font-style: italic; }
.livre-desc { font-size: 14px; color: var(--muted); line-height: 1.65; max-width: 560px; }
.livre-stats { display: flex; gap: 20px; }
.livre-stat { font-size: 13px; color: var(--muted); }
.livre-stat strong { color: var(--ink); font-weight: 800; }
.livre-progress-wrap { margin-top: 4px; }
.livre-progress-label { font-size: 11px; color: var(--muted); margin-bottom: 6px; letter-spacing: .06em; }
.livre-progress-bar { height: 4px; background: var(--border); width: 100%; max-width: 280px; }
.livre-progress-fill { height: 4px; background: var(--accent); }
.livre-integrated { font-size: 12px; font-weight: 800; color: var(--accent-3); letter-spacing: .08em; }
.livre-check { margin-right: 5px; }

.livres-contribute {
  background: var(--surface-hi);
  border: 1px solid var(--border);
  padding: 36px 40px;
}
.livres-contribute h3 { font-size: 20px; font-weight: 900; margin: 0 0 10px; }
.livres-contribute p { font-size: 15px; color: var(--muted); line-height: 1.65; max-width: 500px; margin: 0; }

@media (max-width: 640px) {
  .livre-card { grid-template-columns: 1fr; }
  .livre-cover { border-right: none; border-bottom: 1px solid var(--border); }
  .hero-kpis-bar { grid-template-columns: repeat(2, 1fr); width: 100%; margin-left: 0; }
}

/* ── Map list — style épuré ── */
.map-list .small-card { border-left: 3px solid var(--border) !important; border-right: none !important; border-top: none !important; }
.map-list .small-card:hover { border-left-color: var(--accent) !important; }
.map-list .small-card strong { font-size: 14px; font-weight: 800; }
.map-scroll-btn { background: var(--surface) !important; border-color: var(--border) !important; }
.map-scroll-btn:hover { background: var(--hover) !important; }

/* ── Panel head ── */
.panel > h3, .related-section-head h3, .drawer-panel-head {
  background: var(--surface) !important;
  border-bottom: 1px solid var(--border) !important;
}

/* ── Footer ── */
.footer { background: transparent; border-top-color: var(--border); }

/* ── Scroll-top ── */
.scroll-top { background: var(--accent) !important; }

/* ── Progress bar ── */
.progress { background: var(--accent) !important; animation: none; }

/* ── Cookie banner ── */
.cookie-banner { border-color: var(--border) !important; }

/* ── Drawer hero accent ── */
.drawer-kind-bar { background: var(--surface) !important; }

/* ── Map filters ── */
.map-filters { background: var(--surface) !important; border-color: var(--border) !important; }

/* ── Autocomplete ── */
.search-autocomplete { background: var(--surface-hi) !important; }
.search-ac-item:hover, .search-ac-item.focused { background: var(--hover) !important; }

/* ── Related cards drawer ── */
.related-section-head { background: var(--surface) !important; }
.drawer-panel-head { background: var(--surface) !important; }
.drawer-col-side .panel h3 { background: var(--surface) !important; }

/* ── Responsive ── */
@media (max-width: 760px) {
  .hero { padding: 32px 20px 0; }
  .hero h1 { font-size: clamp(32px, 9vw, 50px); }
}

/* ════ FIN v16.7 ════ */


/* ════════════════════════════════════════════════════
   AMÉLIORATIONS v17.1
   ════════════════════════════════════════════════════ */

/* ── Compteur de session ── */
.session-counter {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  font-size: 12px;
  animation: counterPop .35s cubic-bezier(.2,.8,.2,1);
}
@keyframes counterPop { from{opacity:0;transform:scale(.85)} to{opacity:1;transform:scale(1)} }
.sc-label { color: var(--muted); font-weight: 600; letter-spacing: .04em; }
.sc-num { font-size: 18px; font-weight: 900; color: var(--accent); min-width: 24px; text-align: center; }

/* ── Historique breadcrumb dans le drawer ── */
.drawer-hist-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 28px;
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  flex-wrap: wrap;
}
.dhb-btn {
  background: none;
  border: none;
  font-size: 12px;
  color: var(--accent);
  cursor: pointer;
  font-weight: 700;
  padding: 2px 4px;
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-color: rgba(139,32,39,.3);
  transition: text-decoration-color .15s;
}
.dhb-btn:hover { text-decoration-color: var(--accent); }
.dhb-sep { color: var(--muted); font-size: 12px; }
.dhb-current { font-size: 12px; color: var(--muted); font-weight: 600; }

/* ── Barre d'utilitaires du drawer ── */
.drawer-utils {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 28px;
  background: var(--surface-hi);
  border-bottom: 1px solid var(--border);
}
.du-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  background: var(--surface);
  border: 1px solid var(--border);
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
  cursor: pointer;
  transition: background .15s, color .15s, border-color .15s;
}
.du-btn:hover { background: var(--hover); color: var(--ink); border-color: var(--ink); }
.du-copied {
  font-size: 12px;
  font-weight: 700;
  color: var(--accent-3);
  opacity: 0;
  transition: opacity .2s;
  pointer-events: none;
}
.du-copied.show { opacity: 1; }

/* ── Chronologie verticale v2 ── */
.chrono-v2 {
  position: relative;
  display: grid;
  gap: 0;
  padding: 0;
}
/* Ligne centrale */
.chrono-v2::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 0; bottom: 0;
  width: 1px;
  background: var(--border);
  transform: translateX(-50%);
  z-index: 0;
}

.cv2-item {
  display: grid;
  grid-template-columns: 1fr 100px 1fr;
  align-items: center;
  gap: 0;
  position: relative;
  z-index: 1;
  min-height: 120px;
}

/* Card côté gauche */
.cv2-left .cv2-card { grid-column: 1; grid-row: 1; margin-right: 20px; }
.cv2-left .cv2-axis { grid-column: 2; grid-row: 1; }
.cv2-left .cv2-spacer { grid-column: 3; grid-row: 1; }

/* Card côté droit */
.cv2-right .cv2-card { grid-column: 3; grid-row: 1; margin-left: 20px; }
.cv2-right .cv2-axis { grid-column: 2; grid-row: 1; }
.cv2-right .cv2-spacer { grid-column: 1; grid-row: 1; }

.cv2-card {
  background: var(--surface-hi);
  border: 1px solid var(--border);
  padding: 18px 20px;
  cursor: pointer;
  transition: background .16s, outline-color .16s, transform .18s;
  outline: 2px solid transparent;
  outline-offset: -1px;
  margin: 12px 0;
}
.cv2-card:hover {
  background: var(--hover);
  outline-color: var(--accent);
  transform: translateY(-2px);
}
.cv2-type {
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--gold);
  font-weight: 800;
  margin-bottom: 8px;
}
.cv2-title {
  font-size: 17px;
  font-weight: 900;
  letter-spacing: -.02em;
  color: var(--ink);
  line-height: 1.2;
  margin-bottom: 7px;
}
.cv2-desc {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.6;
  margin-bottom: 10px;
}
.cv2-cta { font-size: 12px; font-weight: 800; color: var(--accent); }

/* Axe central avec dot et année */
.cv2-axis {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  height: 100%;
}
.cv2-dot {
  width: 14px; height: 14px;
  background: var(--accent);
  border: 2px solid var(--surface-hi);
  box-shadow: 0 0 0 1px var(--accent);
  position: relative;
  z-index: 2;
  flex-shrink: 0;
}
.cv2-year {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  color: var(--accent);
  margin-top: 6px;
  white-space: nowrap;
}

@media (max-width: 700px) {
  .chrono-v2::before { left: 20px; }
  .cv2-item { grid-template-columns: 44px 1fr; }
  .cv2-left .cv2-card,
  .cv2-right .cv2-card { grid-column: 2; margin: 0 0 0 16px; }
  .cv2-left .cv2-axis,
  .cv2-right .cv2-axis { grid-column: 1; }
  .cv2-left .cv2-spacer,
  .cv2-right .cv2-spacer { display: none; }
  .cv2-item { min-height: 100px; }
}

/* ── Carte sépia — CSS pour cohérence ── */
.leaflet-tile-pane {
  filter: sepia(35%) saturate(70%) brightness(1.04) contrast(0.96);
}

/* ── Tooltip Leaflet harmonisé ── */
.leaflet-tooltip-own {
  background: var(--surface-hi) !important;
  border: 1px solid var(--border) !important;
  color: var(--ink) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  box-shadow: var(--shadow-soft) !important;
  padding: 5px 10px !important;
}

/* ════ FIN v17.1 ════ */
