/* ==========================================================================
   CATLOGISTICS — Design system
   Moderne / Minimaliste · Glassmorphism · Aurora animé · Grain premium
   ========================================================================== */

:root{
  --ink:#F5F8FC;
  --ink-2:#EDF3FA;
  --navy:#E3ECF7;
  --surface:rgba(255,255,255,.80);
  --surface-2:rgba(255,255,255,.96);
  --line:rgba(13,42,74,.10);
  --line-strong:rgba(13,42,74,.20);
  --accent:#366FB3;
  --accent-text:#2C5F9E;
  --accent-2:#A87054;
  --accent-2-text:#8E5A40;
  --text:#0E2136;
  --muted:#5A6E85;
  --shadow-sm:0 2px 10px rgba(13,42,74,.06);
  --shadow-md:0 18px 40px -26px rgba(13,42,74,.45);
  --radius:16px;
  --max:1220px;
  --header-h:78px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{box-sizing:border-box}

html{
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
}

body{
  margin:0;
  background:#EEF4FB;
  color:var(--text);
  font-family:'Jost','Futura','Century Gothic','Helvetica Neue',Arial,sans-serif;
  font-size:16px;
  line-height:1.7;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

body.menu-open{overflow:hidden}

img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit}

h1,h2,h3,h4{
  font-family:'Jost','Futura','Century Gothic',sans-serif;
  font-weight:600;
  line-height:1.1;
  letter-spacing:-.02em;
  margin:0 0 .6em;
}

h1{font-size:clamp(2.3rem,5.6vw,4.35rem)}
h2{font-size:clamp(1.8rem,3.6vw,2.95rem)}
h3{font-size:clamp(1.12rem,1.7vw,1.4rem);letter-spacing:-.01em}

p{margin:0 0 1.1em}
p:last-child{margin-bottom:0}

::selection{background:rgba(54,111,179,.18);color:var(--text)}

/* ---------- Aurora + grain ---------- */
.aurora{
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
}
.aurora span{
  position:absolute;
  display:block;
  border-radius:50%;
  filter:blur(90px);
  opacity:.55;
  will-change:transform;
}
.aurora .a1{
  width:52vw;height:52vw;
  background:radial-gradient(circle at 30% 30%, #BBD6F2, transparent 68%);
  top:-16vw;left:-10vw;
  animation:drift1 24s ease-in-out infinite alternate;
}
.aurora .a2{
  width:46vw;height:46vw;
  background:radial-gradient(circle at 60% 40%, #CFE3F8, transparent 66%);
  top:26vh;right:-14vw;
  opacity:.5;
  animation:drift2 30s ease-in-out infinite alternate;
}
.aurora .a3{
  width:40vw;height:40vw;
  background:radial-gradient(circle at 50% 50%, #F0DACB, transparent 70%);
  bottom:-14vw;left:22vw;
  opacity:.45;
  animation:drift3 34s ease-in-out infinite alternate;
}
@keyframes drift1{
  from{transform:translate3d(0,0,0) scale(1)}
  to{transform:translate3d(9vw,7vh,0) scale(1.18)}
}
@keyframes drift2{
  from{transform:translate3d(0,0,0) scale(1.06)}
  to{transform:translate3d(-11vw,-6vh,0) scale(.92)}
}
@keyframes drift3{
  from{transform:translate3d(0,0,0) scale(.95)}
  to{transform:translate3d(7vw,-9vh,0) scale(1.15)}
}

.grain{
  position:fixed;
  inset:0;
  z-index:3;
  pointer-events:none;
  opacity:.035;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}

/* Fond épuré : halos et grain désactivés */
.aurora,.grain{display:none !important}

/* Fond coloré charte : dégradé fixe bleu -> bronze, net et immobile */
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(120% 70% at 0% 0%, rgba(54,111,179,.22), transparent 60%),
    radial-gradient(90% 60% at 100% 100%, rgba(168,112,84,.20), transparent 62%),
    linear-gradient(180deg,#E6EFF9 0%,#F1F5FA 50%,#F5EEE9 100%);
}

/* ---------- Layout ---------- */
.container{
  width:100%;
  max-width:var(--max);
  margin:0 auto;
  padding:0 24px;
  position:relative;
  z-index:2;
}
.section{
  position:relative;
  z-index:2;
  padding:clamp(64px,8vw,120px) 0;
}
.section--tight{padding:clamp(48px,5vw,72px) 0}
.section--line{border-top:1px solid var(--line)}

/* filet pointille (route de la charte) */
.rule-route{
  height:1px;
  border:0;
  margin:0;
  background-image:linear-gradient(90deg,rgba(54,111,179,.38) 0 3px,transparent 3px 11px);
  background-size:11px 1px;
  opacity:.7;
}

.section-head{max-width:720px;margin-bottom:clamp(34px,4vw,60px)}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center}
.section-head p{color:var(--muted);font-size:1.03rem}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--accent-text);
  margin-bottom:18px;
}
.eyebrow::before{
  content:"";
  width:22px;height:11px;
  flex:0 0 auto;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='11'%3E%3Cg stroke='%232C5F9E' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='M1 1.5h20M1 5.5h20M1 9.5h14'/%3E%3C/g%3E%3C/svg%3E") no-repeat center/contain;
  opacity:.9;
}
.section-head.center .eyebrow::after{
  content:"";
  width:22px;height:11px;
  flex:0 0 auto;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='11'%3E%3Cg stroke='%232C5F9E' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='M1 1.5h20M1 5.5h20M1 9.5h14'/%3E%3C/g%3E%3C/svg%3E") no-repeat center/contain;
  opacity:.55;
  transform:scaleX(-1);
}

.grad-text{
  background:linear-gradient(100deg,#1B4C86 0%,var(--accent) 40%,var(--accent-2) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:13px 26px;
  border-radius:8px;
  font-size:.85rem;
  font-weight:600;
  letter-spacing:.03em;
  border:1px solid transparent;
  cursor:pointer;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), background .35s var(--ease), border-color .35s var(--ease), color .35s var(--ease);
  white-space:nowrap;
}
.btn svg{width:16px;height:16px;flex:0 0 auto}
.btn-primary{
  background:linear-gradient(100deg,var(--accent),#4A85C4 55%,var(--accent-2));
  color:#FFFFFF;
  box-shadow:0 10px 30px -12px rgba(54,111,179,.65);
}
.btn-primary:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 40px -14px rgba(54,111,179,.8);
}
.btn-ghost{
  border-radius:8px;
  background:rgba(255,255,255,.78);
  border-color:rgba(13,42,74,.16);
  color:var(--text);
  backdrop-filter:blur(10px);
  box-shadow:0 1px 2px rgba(13,42,74,.04);
}
.btn-ghost:hover{
  background:#FFFFFF;
  transform:translateY(-2px);
  border-color:rgba(54,111,179,.42);
  box-shadow:0 8px 20px -12px rgba(13,42,74,.4);
}
.btn-block{width:100%}

.link-arrow{
  display:inline-flex;
  align-items:center;
  gap:9px;
  font-size:.86rem;
  font-weight:600;
  color:var(--accent-text);
  letter-spacing:.02em;
}
.link-arrow svg{width:15px;height:15px;transition:transform .3s var(--ease)}
.link-arrow:hover svg{transform:translateX(5px)}

/* ---------- Header ---------- */
.site-header{
  position:fixed;
  top:0;left:0;right:0;
  z-index:100;
  height:var(--header-h);
  display:flex;
  align-items:center;
  background:linear-gradient(180deg,rgba(248,251,254,.94),rgba(248,251,254,0));
  transition:background .4s var(--ease), border-color .4s var(--ease), backdrop-filter .4s var(--ease), height .4s var(--ease);
  border-bottom:1px solid transparent;
}
.site-header.scrolled{
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(18px) saturate(150%);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
  border-bottom-color:var(--line);
  box-shadow:0 10px 30px -24px rgba(13,42,74,.6);
  height:68px;
}
.header-inner{
  width:100%;
  max-width:var(--max);
  margin:0 auto;
  padding:0 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.logo{
  display:inline-flex;
  align-items:center;
  gap:11px;
  color:var(--text);
  white-space:nowrap;
}
.logo-img{
  height:40px;
  width:auto;
  display:block;
  filter:none;
}
.site-header.scrolled .logo-img{height:35px}
.logo-mark{
  width:34px;height:34px;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(140deg,rgba(54,111,179,.16),rgba(168,112,84,.16));
  border:1px solid var(--line);
  flex:0 0 auto;
}
.logo-mark svg{width:19px;height:19px}
.logo b{font-weight:600;color:var(--accent-text)}

.nav{
  display:flex;
  align-items:center;
  gap:30px;
}
.nav a{
  position:relative;
  font-size:.82rem;
  font-weight:500;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:rgba(14,33,54,.72);
  padding:6px 0;
  transition:color .3s var(--ease);
}
.nav a::after{
  content:"";
  position:absolute;
  left:0;bottom:0;
  width:0;height:1px;
  background:var(--accent);
  transition:width .35s var(--ease);
}
.nav a:hover,.nav a.active{color:var(--accent)}
.nav a:hover::after,.nav a.active::after{width:100%}

.header-actions{display:flex;align-items:center;gap:14px}

.burger{
  display:none;
  width:46px;height:46px;
  border:1px solid var(--line-strong);
  border-radius:10px;
  background:rgba(255,255,255,.7);
  backdrop-filter:blur(10px);
  cursor:pointer;
  padding:0;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px;
}
.burger span{
  display:block;
  width:19px;height:1.6px;
  background:var(--text);
  border-radius:2px;
  transition:transform .35s var(--ease), opacity .25s var(--ease);
}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6.6px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.6px) rotate(-45deg)}

/* ---------- Mobile menu ---------- */
.mobile-menu{
  position:fixed;
  inset:0;
  z-index:99;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:calc(var(--header-h) + 24px) 26px 40px;
  background:rgba(248,251,254,.90);
  backdrop-filter:blur(26px) saturate(150%);
  -webkit-backdrop-filter:blur(26px) saturate(150%);
  visibility:hidden;
  opacity:0;
  transform:translateY(-12px);
  overflow-y:auto;
  transition:opacity .38s var(--ease), transform .38s var(--ease), visibility .38s;
}
.mobile-menu.open{visibility:visible;opacity:1;transform:none}
.mobile-menu a{
  font-family:'Jost','Futura','Century Gothic',sans-serif;
  font-size:1.42rem;
  font-weight:500;
  padding:16px 0;
  border-bottom:1px solid var(--line);
  color:var(--text);
  opacity:0;
  transform:translateY(14px);
  transition:opacity .45s var(--ease), transform .45s var(--ease), color .3s;
}
.mobile-menu.open a{opacity:1;transform:none}
.mobile-menu.open a:nth-child(1){transition-delay:.06s}
.mobile-menu.open a:nth-child(2){transition-delay:.11s}
.mobile-menu.open a:nth-child(3){transition-delay:.16s}
.mobile-menu.open a:nth-child(4){transition-delay:.21s}
.mobile-menu.open a:nth-child(5){transition-delay:.26s}
.mobile-menu.open a:nth-child(6){transition-delay:.31s}
.mobile-menu.open a:nth-child(7){transition-delay:.36s}
.mobile-menu a.active{color:var(--accent-text)}
.mobile-menu .btn{margin-top:26px;font-size:.9rem;padding:16px 26px}

/* ---------- Hero ---------- */
.hero{
  position:relative;
  min-height:100svh;
  display:flex;
  align-items:center;
  padding:calc(var(--header-h) + 56px) 0 60px;
  overflow:hidden;
}
.hero-bg{
  position:absolute;
  inset:0;
  z-index:0;
}
.hero-bg img{
  width:100%;height:100%;
  object-fit:cover;
  object-position:center 45%;
  transform:scale(1.04);
  animation:heroZoom 22s ease-in-out infinite alternate;
}
@keyframes heroZoom{
  from{transform:scale(1.04)}
  to{transform:scale(1.14)}
}
.hero-bg::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(232,240,250,.96) 0%, rgba(232,240,250,.86) 48%, rgba(54,111,179,.28) 100%),
    linear-gradient(180deg, rgba(232,240,250,.30) 0%, rgba(232,240,250,0) 55%, rgba(230,239,249,.95) 100%);
}
.hero .container{z-index:3}
.hero-content{max-width:760px}
.hero h1{margin-bottom:22px}
.hero .lead{
  font-size:clamp(1rem,1.35vw,1.14rem);
  color:rgba(14,33,54,.74);
  max-width:590px;
  margin-bottom:34px;
}
.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-bottom:clamp(38px,5vw,58px);
}

.hero-stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  max-width:800px;
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden;
  background:var(--line);
  box-shadow:var(--shadow-sm);
  backdrop-filter:blur(8px);
}
.hero-stat{
  background:rgba(255,255,255,.86);
  padding:20px 18px;
  backdrop-filter:blur(14px);
}
.hero-stat b{
  display:block;
  font-family:'Jost','Futura','Century Gothic',sans-serif;
  font-size:clamp(1.25rem,2vw,1.7rem);
  font-weight:600;
  letter-spacing:-.02em;
  color:var(--text);
}
.hero-stat span{
  display:block;
  margin-top:4px;
  font-size:.72rem;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--muted);
}

.scroll-hint{
  position:absolute;
  bottom:26px;
  left:50%;
  transform:translateX(-50%);
  z-index:3;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:9px;
  font-size:.65rem;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:rgba(14,33,54,.45);
}
.scroll-hint i{
  display:block;
  width:1px;height:38px;
  background:linear-gradient(180deg,var(--accent),transparent);
  animation:hintPulse 2.4s ease-in-out infinite;
}
@keyframes hintPulse{
  0%,100%{opacity:.35;transform:scaleY(.7)}
  50%{opacity:1;transform:scaleY(1)}
}

/* ---------- Page hero (inner pages) ---------- */
.page-hero{
  position:relative;
  padding:calc(var(--header-h) + 74px) 0 62px;
  overflow:hidden;
  border-bottom:1px solid var(--line);
}
.page-hero-bg{
  position:absolute;
  inset:0;
  z-index:0;
}
.page-hero-bg img{
  width:100%;height:100%;
  object-fit:cover;
  opacity:.26;
}
.page-hero-bg::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(120deg, rgba(220,233,248,.93) 0%, rgba(236,242,250,.90) 60%, rgba(240,226,217,.88) 100%);
}
.page-hero .container{z-index:3}
.page-hero h1{max-width:860px;margin-bottom:18px}
.page-hero p{max-width:620px;color:var(--muted);font-size:1.03rem}
.breadcrumb{
  display:flex;
  align-items:center;
  gap:9px;
  font-size:.74rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--muted);
  margin-bottom:20px;
}
.breadcrumb a:hover{color:var(--accent-text)}
.breadcrumb span{color:var(--accent-text)}

/* ---------- Cards / grids ---------- */
.grid{display:grid;gap:22px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}

.card{
  position:relative;
  background:#FFFFFF;
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow-sm);
  backdrop-filter:blur(16px) saturate(130%);
  -webkit-backdrop-filter:blur(16px) saturate(130%);
  overflow:hidden;
  transition:transform .45s var(--ease), border-color .45s var(--ease), box-shadow .45s var(--ease);
  display:flex;
  flex-direction:column;
}
.card:hover{
  transform:translateY(-6px);
  border-color:rgba(54,111,179,.38);
  box-shadow:0 26px 48px -32px rgba(13,42,74,.55), 0 0 0 1px rgba(54,111,179,.07);
}
.card-media{
  position:relative;
  aspect-ratio:16/10;
  overflow:hidden;
  background:var(--navy);
}
.card-media img{
  width:100%;height:100%;
  object-fit:cover;
  transition:transform .8s var(--ease);
}
.card:hover .card-media img{transform:scale(1.07)}
.card-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(9,20,34,0),rgba(9,20,34,.3));
}
.card-body{
  padding:26px 24px 28px;
  display:flex;
  flex-direction:column;
  flex:1;
}
.card-body h3{margin-bottom:10px}
.card-body p{color:var(--muted);font-size:.92rem;margin-bottom:18px}
.card-body .link-arrow{margin-top:auto}
.card-tag{
  position:absolute;
  top:16px;left:16px;
  z-index:2;
  padding:6px 11px;
  border-radius:6px;
  font-size:.65rem;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#FFFFFF;
  background:linear-gradient(100deg,var(--accent),#8FB8E0);
}
.card-num{
  font-family:'Jost','Futura','Century Gothic',sans-serif;
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.18em;
  color:var(--accent-text);
  margin-bottom:14px;
}

/* glass list (no media) */
.card--plain .card-body{padding:30px 26px}

/* ---------- Split image/text ---------- */
.split{
  display:grid;
  grid-template-columns:1.05fr 1fr;
  gap:clamp(30px,5vw,68px);
  align-items:center;
}
.split.reverse .split-media{order:2}
.split-media{
  position:relative;
  border-radius:22px;
  overflow:hidden;
  border:1px solid var(--line);
  aspect-ratio:4/3;
}
.split-media img{width:100%;height:100%;object-fit:cover}
.split-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(9,20,34,0),rgba(9,20,34,.32));
}
.split-badge{
  position:absolute;
  bottom:18px;left:18px;
  z-index:2;
  display:flex;
  align-items:center;
  gap:11px;
  padding:12px 18px;
  border-radius:14px;
  background:rgba(255,255,255,.90);
  border:1px solid var(--line);
  box-shadow:var(--shadow-sm);
  backdrop-filter:blur(14px);
  font-size:.78rem;
  letter-spacing:.04em;
}
.split-badge b{color:var(--accent-text);font-family:'Jost','Futura','Century Gothic',sans-serif}
.split-text p{color:var(--muted)}

/* ---------- Checklist ---------- */
.checklist{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:14px}
.checklist li{
  display:flex;
  gap:13px;
  align-items:flex-start;
  font-size:.93rem;
  color:rgba(14,33,54,.84);
}
.checklist svg{
  width:19px;height:19px;
  flex:0 0 auto;
  margin-top:2px;
  color:var(--accent-text);
}

/* ---------- Stats band ---------- */
.stat-band{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  background:var(--line);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.stat-band .stat{
  background:rgba(255,255,255,.9);
  padding:38px 22px;
  text-align:center;
}
.stat-band b{
  display:block;
  font-family:'Jost','Futura','Century Gothic',sans-serif;
  font-size:clamp(1.6rem,3vw,2.4rem);
  font-weight:600;
  letter-spacing:-.03em;
  background:linear-gradient(100deg,#123A63,rgba(54,111,179,.95));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.stat-band span{
  display:block;
  margin-top:8px;
  font-size:.73rem;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--muted);
}

/* ---------- Process / steps ---------- */
.steps{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:20px;
  counter-reset:step;
}
.step{
  position:relative;
  padding:30px 24px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
  backdrop-filter:blur(12px);
  transition:border-color .4s var(--ease), background .4s var(--ease), transform .4s var(--ease);
}
.step:hover{
  border-color:rgba(54,111,179,.35);
  background:var(--surface-2);
  transform:translateY(-4px);
}
.step-num{
  width:38px;height:38px;
  border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  font-family:'Jost','Futura','Century Gothic',sans-serif;
  font-size:.86rem;
  font-weight:600;
  color:var(--accent-text);
  background:rgba(54,111,179,.18);
  border:1px solid rgba(54,111,179,.28);
  margin-bottom:18px;
}
.step h3{font-size:1.02rem;margin-bottom:8px}
.step p{color:var(--muted);font-size:.87rem;margin:0}

/* ---------- Feature rows ---------- */
.feature-list{display:grid;gap:18px}
.feature{
  display:flex;
  gap:18px;
  align-items:flex-start;
  padding:24px;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--surface);
  backdrop-filter:blur(12px);
  transition:border-color .4s var(--ease), transform .4s var(--ease);
}
.feature:hover{border-color:rgba(54,111,179,.32);transform:translateX(4px)}
.feature-icon{
  width:46px;height:46px;
  flex:0 0 auto;
  border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(140deg,rgba(54,111,179,.14),rgba(168,112,84,.12));
  border:1px solid var(--line);
  color:var(--accent-text);
}
.feature-icon svg{width:22px;height:22px}
.feature h3{font-size:1rem;margin-bottom:6px}
.feature p{color:var(--muted);font-size:.89rem;margin:0}

/* ---------- Fleet cards ---------- */
.fleet-card .card-media{aspect-ratio:16/11}
.spec-list{
  list-style:none;
  padding:0;
  margin:0 0 20px;
  display:grid;
  gap:8px;
}
.spec-list li{
  display:flex;
  justify-content:space-between;
  gap:14px;
  font-size:.82rem;
  padding-bottom:8px;
  border-bottom:1px solid var(--line);
  color:var(--muted);
}
.spec-list li b{color:var(--text);font-weight:600}

/* ---------- Sector tiles ---------- */
.sector-tile{
  position:relative;
  border-radius:var(--radius);
  overflow:hidden;
  border:1px solid var(--line);
  aspect-ratio:4/3;
  display:flex;
  align-items:flex-end;
  padding:24px;
  transition:transform .5s var(--ease), border-color .5s var(--ease);
}
.sector-tile:hover{transform:translateY(-5px);border-color:rgba(54,111,179,.4)}
.sector-tile img{
  position:absolute;
  inset:0;
  width:100%;height:100%;
  object-fit:cover;
  transition:transform .9s var(--ease);
}
.sector-tile:hover img{transform:scale(1.08)}
.sector-tile::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(5,8,15,.1) 20%,rgba(5,8,15,.92));
}
.sector-tile > div{position:relative;z-index:2}
.sector-tile h3{font-size:1.05rem;margin-bottom:4px;color:#fff}
.sector-tile p{font-size:.82rem;color:rgba(255,255,255,.82);margin:0}

/* ---------- Quote / highlight ---------- */
.quote-block{
  padding:clamp(30px,4vw,52px);
  border-radius:22px;
  border:1px solid var(--line);
  border-left:3px solid var(--accent);
  background:#FFFFFF;
  box-shadow:var(--shadow-sm);
}
.quote-block p{
  font-family:'Jost','Futura','Century Gothic',sans-serif;
  font-size:clamp(1.1rem,2vw,1.55rem);
  line-height:1.5;
  letter-spacing:-.015em;
  color:var(--text);
  margin:0;
}

/* ---------- CTA band ---------- */
.cta-band{
  position:relative;
  z-index:2;
  padding:clamp(46px,6vw,74px) 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:
    url("images/motif-charte.svg") no-repeat right -40px center/340px auto,
    linear-gradient(100deg,#D6E4F5 0%,#E7EEF8 60%,#EFE0D4 100%);
  overflow:hidden;
}
@media (max-width:1024px){
  .cta-band{background:linear-gradient(100deg,#D6E4F5 0%,#E7EEF8 60%,#EFE0D4 100%);}
}
.cta-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:34px;
  flex-wrap:wrap;
}
.cta-inner h2{margin-bottom:8px}
.cta-inner p{color:var(--muted);margin:0;font-size:.98rem}
.cta-actions{display:flex;gap:12px;flex-wrap:wrap}

/* ---------- Contact ---------- */
.contact-wrap{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:clamp(26px,4vw,48px);
  align-items:start;
}
.form-card{
  padding:clamp(24px,3.4vw,40px);
  border:1px solid var(--line);
  border-radius:22px;
  background:linear-gradient(160deg,rgba(255,255,255,.97),rgba(255,255,255,.84));
  box-shadow:var(--shadow-md);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.field{margin-bottom:16px}
.field label{
  display:block;
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
  margin-bottom:8px;
}
.field input,
.field select,
.field textarea{
  width:100%;
  padding:14px 16px;
  border-radius:12px;
  border:1px solid var(--line);
  background:#FFFFFF;
  color:var(--text);
  font-family:inherit;
  font-size:.92rem;
  transition:border-color .3s var(--ease), background .3s var(--ease), box-shadow .3s var(--ease);
  -webkit-appearance:none;
  appearance:none;
}
.field textarea{min-height:132px;resize:vertical}
.field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%235A6E85' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 16px center;
  padding-right:40px;
}
.field input::placeholder,
.field textarea::placeholder{color:rgba(90,110,133,.65)}
.field input:focus,
.field select:focus,
.field textarea:focus{
  outline:none;
  border-color:rgba(54,111,179,.6);
  background:#FFFFFF;
  box-shadow:0 0 0 4px rgba(54,111,179,.10);
}
.field select option{background:#FFFFFF;color:var(--text)}
.form-note{
  font-size:.76rem;
  color:var(--muted);
  margin-top:14px;
  line-height:1.6;
}
.form-alert{
  display:none;
  padding:14px 18px;
  border-radius:12px;
  font-size:.87rem;
  margin-bottom:18px;
  border:1px solid transparent;
}
.form-alert.show{display:block}
.form-alert.ok{
  background:rgba(54,111,179,.1);
  border-color:rgba(54,111,179,.45);
  color:#25558A;
}
.form-alert.err{
  background:rgba(255,92,92,.07);
  border-color:rgba(196,54,54,.35);
  color:#A8271F;
}

.contact-info{display:grid;gap:14px}
.info-item{
  display:flex;
  gap:15px;
  align-items:flex-start;
  padding:22px;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--surface);
  backdrop-filter:blur(12px);
}
.info-item .feature-icon{width:42px;height:42px}
.info-item span{
  display:block;
  font-size:.68rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--muted);
  margin-bottom:4px;
}
.info-item strong{font-weight:500;font-size:.95rem;word-break:break-word}
.info-item a:hover{color:var(--accent-text)}

.map-wrap{
  border:1px solid var(--line);
  border-radius:18px;
  overflow:hidden;
  margin-top:16px;
  line-height:0;
  filter:grayscale(.35) contrast(1.05);
}
.map-wrap iframe{width:100%;height:280px;border:0;display:block}

/* ---------- Footer (image conteneurs du site CAT + voile charte) ---------- */
.site-footer{
  position:relative;
  z-index:2;
  overflow:hidden;
  color:#FFFFFF;
  background:#0F2A4A url("images/footer-conteneurs.jpg") center 60%/cover no-repeat;
  padding:clamp(56px,7vw,92px) 0 0;
}
.site-footer::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    linear-gradient(100deg,rgba(14,36,64,.94) 0%,rgba(30,70,120,.86) 55%,rgba(110,72,52,.82) 100%);
}
.site-footer::after{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:4px;
  z-index:1;
  background:linear-gradient(90deg,#366FB3 0%,#366FB3 60%,#A87054 100%);
}
.site-footer .container{z-index:2}
.site-footer .logo-img{height:46px}
.footer-grid{
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1.2fr;
  gap:clamp(24px,4vw,48px);
  padding-bottom:44px;
}
.footer-brand p{
  color:rgba(255,255,255,.80);
  font-size:.9rem;
  max-width:330px;
  margin-top:18px;
}
.footer-col h4{
  font-size:.74rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#FFFFFF;
  margin-bottom:18px;
  font-weight:600;
  padding-bottom:10px;
  border-bottom:2px solid rgba(168,112,84,.85);
  display:inline-block;
}
.footer-col ul{list-style:none;padding:0;margin:0;display:grid;gap:11px}
.footer-col a,.footer-col li{
  font-size:.88rem;
  color:rgba(255,255,255,.80);
  transition:color .3s var(--ease);
  word-break:break-word;
}
.footer-col a:hover{color:#E7C3AC}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.18);
  padding:22px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  font-size:.78rem;
  color:rgba(255,255,255,.70);
}
.footer-bottom .mini-links{display:flex;gap:20px;flex-wrap:wrap}
.footer-bottom .mini-links a{color:rgba(255,255,255,.75) !important;transition:color .3s var(--ease)}
.footer-bottom .mini-links a:hover{color:#FFFFFF !important}

/* ---------- Carte des implantations ---------- */
.map-panel{
  display:grid;
  grid-template-columns:1.22fr .78fr;
  gap:clamp(20px,3vw,40px);
  align-items:center;
  margin-bottom:clamp(34px,4.5vw,58px);
}
.map-canvas{
  position:relative;
  width:100%;
  max-width:540px;
  margin:0 auto;
  padding:clamp(10px,1.6vw,18px);
  border:1px solid var(--line);
  border-radius:22px;
  background:linear-gradient(160deg,#FFFFFF 0%,#EAF2FB 100%);
  box-shadow:0 22px 50px -30px rgba(13,42,74,.55);
  overflow:hidden;
}
.map-canvas::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 32% 62%,rgba(54,111,179,.16),transparent 62%);
  pointer-events:none;
}
.map-africa{
  position:relative;
  width:100%;
  height:auto;
  max-height:min(74vh,610px);
  display:block;
  margin:0 auto;
}
.map-countries path{
  fill:#D3DEEA;
  stroke:#FFFFFF;
  stroke-width:.9;
  transition:fill .55s var(--ease), stroke .55s var(--ease);
}
.map-countries .c-zone{
  fill:#366FB3;
  stroke:#FFFFFF;
  stroke-width:1.1;
}
.map-countries .c-siege{
  fill:#A87054;
  stroke:#FFFFFF;
  stroke-width:1.3;
}
.map-countries path.is-hot{
  fill:#1F4F8A;
  stroke:#FFFFFF;
  stroke-width:1.6;
}
.map-countries .c-siege.is-hot{fill:#8A5539}
.map-dots .core{
  fill:#FFFFFF;
  stroke:#0E2136;
  stroke-width:1.4;
}
.map-dots .core--siege{fill:#FFE3CC}
.map-dots .ping{
  fill:none;
  stroke:rgba(54,111,179,.85);
  stroke-width:1.6;
  transform-box:fill-box;
  transform-origin:center;
  animation:mapPing 3.4s ease-out infinite;
}
.map-dots .ping:nth-child(1){animation-delay:0s}
.map-dots .ping:nth-child(3){animation-delay:.45s}
.map-dots .ping:nth-child(5){animation-delay:.9s}
.map-dots .ping:nth-child(7){animation-delay:1.35s}
.map-dots .ping:nth-child(9){animation-delay:1.8s}
.map-dots .ping:nth-child(11){animation-delay:2.25s}
.map-dots .ping--siege{stroke:rgba(168,112,84,.9)}
@keyframes mapPing{
  0%{transform:scale(.55);opacity:.95}
  65%{transform:scale(2.6);opacity:0}
  100%{transform:scale(2.6);opacity:0}
}

.map-legend{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:9px;
}
.map-legend li{
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 15px;
  border:1px solid var(--line);
  border-radius:13px;
  background:var(--surface);
  backdrop-filter:blur(12px);
  transition:border-color .4s var(--ease), background .4s var(--ease), transform .4s var(--ease);
}
.map-legend li:hover{
  border-color:rgba(54,111,179,.5);
  background:rgba(54,111,179,.11);
  transform:translateX(3px);
}
.map-legend li.is-siege{
  border-color:rgba(168,112,84,.42);
  background:rgba(168,112,84,.09);
}
.map-legend li.is-siege:hover{
  border-color:rgba(216,164,128,.6);
  background:rgba(168,112,84,.16);
}
.map-dot{
  width:9px;height:9px;
  flex:0 0 auto;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 0 3px rgba(54,111,179,.2);
}
.is-siege .map-dot{
  background:#E0A87E;
  box-shadow:0 0 0 3px rgba(168,112,84,.25);
}
.lg-txt{display:block;min-width:0}
.lg-txt b{
  display:block;
  font-family:'Jost','Futura','Century Gothic',sans-serif;
  font-size:.9rem;
  font-weight:600;
  color:var(--text);
  line-height:1.3;
  letter-spacing:-.005em;
}
.lg-txt small{display:block;font-size:.76rem;color:var(--muted);line-height:1.4}

/* ---------- Reveal ---------- */
.reveal{
  opacity:0;
  transform:translateY(30px) scale(.985);
  filter:blur(6px);
  transition:
    opacity .95s var(--ease) var(--rd,0s),
    transform .95s var(--ease) var(--rd,0s),
    filter .95s var(--ease) var(--rd,0s),
    border-color .45s var(--ease),
    box-shadow .45s var(--ease),
    background .45s var(--ease);
  animation:revealFallback .6s ease 1.1s forwards;
}
.reveal.in{opacity:1;transform:none;filter:none;animation:none}
@keyframes revealFallback{to{opacity:1;transform:none;filter:none}}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  .reveal{opacity:1;transform:none}
  html{scroll-behavior:auto}
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width:1200px) and (min-width:1025px){
  .nav{gap:18px}
  .nav a{font-size:.73rem;letter-spacing:.03em}
  .logo{font-size:.95rem;letter-spacing:.1em}
  .btn{padding:13px 22px;font-size:.8rem}
}

@media (max-width:1024px){
  .header-actions .header-cta{display:none}
  .burger{display:flex}
  .nav{display:none}
  .grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-grid{grid-template-columns:1fr 1fr}
  .split{grid-template-columns:1fr;gap:32px}
  .split.reverse .split-media{order:0}
  .map-panel{grid-template-columns:1fr;gap:24px}
  .map-africa{max-height:none}
  .map-legend{grid-template-columns:1fr 1fr;gap:8px}
}

@media (max-width:768px){
  :root{--header-h:66px}
  .container{padding:0 18px}
  .header-inner{padding:0 18px}
  .logo{font-size:.94rem;letter-spacing:.1em}
  .logo-mark{width:31px;height:31px}

  .hero{min-height:auto;padding:calc(var(--header-h) + 46px) 0 54px}
  .hero-actions{gap:10px}
  .hero-actions .btn{flex:1 1 auto;padding:14px 20px;font-size:.8rem}
  .hero-stats{grid-template-columns:1fr 1fr}
  .hero-stat{padding:16px 14px}
  .scroll-hint{display:none}

  .page-hero{padding:calc(var(--header-h) + 44px) 0 44px}

  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
  .stat-band{grid-template-columns:1fr 1fr}
  .stat-band .stat{padding:26px 14px}
  .contact-wrap{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
  .cta-inner{flex-direction:column;align-items:flex-start;gap:22px}
  .cta-actions{width:100%}
  .cta-actions .btn{flex:1 1 auto}
  .footer-grid{grid-template-columns:1fr;gap:28px}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:10px}
  .quote-block{padding:26px}
  .sector-tile{aspect-ratio:16/10}
  .card-media{aspect-ratio:16/9}
  .split-media{aspect-ratio:16/11}
  .feature:hover,.step:hover,.card:hover{transform:none}

  .map-panel{grid-template-columns:1fr;gap:22px}
  .map-canvas{padding:10px;border-radius:18px}
  .map-africa{max-height:none}
  .map-legend{grid-template-columns:1fr 1fr;gap:8px}
  .map-legend li{padding:10px 12px;gap:9px;border-radius:11px}
  .map-legend li:hover{transform:none}
  .lg-txt b{font-size:.82rem}
  .lg-txt small{font-size:.7rem}
}

@media (max-width:420px){
  .map-legend{grid-template-columns:1fr}
}

@media (max-width:420px){
  .hero h1{font-size:2.05rem}
  .hero-stats{grid-template-columns:1fr}
  .mobile-menu a{font-size:1.25rem;padding:14px 0}
}

/* ==========================================================================
   BANDEAU PARTENAIRES — défilement continu
   ========================================================================== */
.partners{
  position:relative;
  z-index:2;
  padding:clamp(38px,4.6vw,60px) 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:linear-gradient(100deg,#DCE8F6 0%,#E9F0F9 55%,#F1E4DA 100%);
  overflow:hidden;
}
.partners--tight{padding:clamp(30px,3.6vw,44px) 0}
.partners-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:22px;
  flex-wrap:wrap;
  margin-bottom:clamp(20px,2.6vw,32px);
}
.partners-head .eyebrow{margin-bottom:10px}
.partners-head h2{
  margin:0;
  font-size:clamp(1.35rem,2.4vw,2rem);
}
.partners-head p{
  margin:0;
  color:var(--muted);
  font-size:.9rem;
  max-width:420px;
}

/* piste : 2 groupes identiques -> boucle sans raccord */
.marquee{
  position:relative;
  width:100%;
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);
}
.marquee-track{
  display:flex;
  width:max-content;
  will-change:transform;
  animation:marqueeScroll 52s linear infinite;
}
.marquee:hover .marquee-track,
.marquee:focus-within .marquee-track{animation-play-state:paused}
.marquee-group{display:flex;align-items:center}
@keyframes marqueeScroll{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-50%,0,0)}
}

.marquee-item{
  flex:0 0 auto;
  margin-right:clamp(14px,1.8vw,24px);
  display:flex;
  align-items:center;
  justify-content:center;
  height:84px;
  min-width:158px;
  padding:0 26px;
  border-radius:14px;
  background:linear-gradient(160deg,rgba(255,255,255,.96),rgba(255,255,255,.84));
  border:1px solid rgba(255,255,255,.45);
  box-shadow:0 14px 28px -20px rgba(13,42,74,.5);
  transition:transform .5s var(--ease), box-shadow .5s var(--ease), background .5s var(--ease);
}
.marquee-item img{
  display:block;
  max-height:46px;
  max-width:158px;
  width:auto;
  height:auto;
  object-fit:contain;
  filter:none;
  opacity:1;
  transition:transform .5s var(--ease);
}
.marquee-item:hover{
  transform:translateY(-4px);
  box-shadow:0 24px 46px -22px rgba(54,111,179,.75);
}
.marquee-item:hover img{transform:scale(1.05)}

.partners--tight .marquee-item{height:66px;min-width:126px;padding:0 20px;border-radius:12px}
.partners--tight .marquee-item img{max-height:34px;max-width:124px}
.partners--tight .marquee-track{animation-duration:44s}

@media (max-width:768px){
  .partners-head{flex-direction:column;align-items:flex-start;gap:12px}
  .marquee-item{height:68px;min-width:128px;padding:0 18px;border-radius:12px}
  .marquee-item img{max-height:36px;max-width:124px}
  .marquee-track{animation-duration:38s}
  .partners--tight .marquee-item{height:58px;min-width:110px;padding:0 16px}
  .partners--tight .marquee-item img{max-height:29px;max-width:108px}
}

@media (prefers-reduced-motion:reduce){
  .marquee{
    overflow-x:auto;
    -webkit-mask-image:none;
    mask-image:none;
    padding-bottom:6px;
  }
  .marquee-track{animation:none;transform:none}
  .marquee-group[aria-hidden="true"]{display:none}
  .marquee-item:hover{transform:none}
}

/* ==========================================================================
   MODERNISATION — nuances & animations (charte bleu #366FB3 / bronze #A87054)
   ========================================================================== */

/* Barre de progression de lecture */
.scroll-progress{
  position:fixed;
  top:0;left:0;
  height:3px;
  width:100%;
  z-index:200;
  transform-origin:0 50%;
  transform:scaleX(0);
  background:linear-gradient(90deg,#366FB3 0%,#5B8FCB 55%,#A87054 100%);
  box-shadow:0 0 12px rgba(54,111,179,.45);
  pointer-events:none;
}

/* Titre dégradé : nuance qui glisse lentement */
.grad-text{
  background-size:220% 100%;
  animation:gradShift 9s ease-in-out infinite alternate;
}
@keyframes gradShift{
  from{background-position:0% 50%}
  to{background-position:100% 50%}
}

/* Titre principal : apparition mot à mot */
.hero h1.reveal{filter:none}
.hero h1 .w{
  display:inline-block;
  opacity:0;
  transform:translateY(.55em) rotate(2deg);
  transition:opacity .8s var(--ease), transform .9s var(--ease);
  transition-delay:calc(var(--i,0) * 70ms + .1s);
}
.hero h1.in .w{opacity:1;transform:none}

/* Boutons : reflet lumineux au survol + dégradé vivant */
.btn{position:relative;overflow:hidden;isolation:isolate}
.btn::after{
  content:"";
  position:absolute;
  top:0;bottom:0;
  left:-60%;
  width:45%;
  z-index:-1;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.55),transparent);
  transform:skewX(-20deg);
  transition:left .75s var(--ease);
  pointer-events:none;
}
.btn:hover::after{left:120%}
.btn-primary{
  background-size:180% 100%;
  background-position:0% 50%;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), background-position .6s var(--ease);
}
.btn-primary:hover{background-position:100% 50%}
.btn-ghost::after{background:linear-gradient(105deg,transparent,rgba(54,111,179,.14),transparent)}

/* Navigation : soulignement dégradé charte */
.nav a::after{
  height:2px;
  border-radius:2px;
  background:linear-gradient(90deg,#366FB3,#A87054);
}

/* Cartes : liseré dégradé + halo qui suit le curseur */
.card,.step,.feature,.info-item,.map-legend li{
  --mx:50%;--my:50%;
}
.card::before,.step::before,.feature::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(135deg,rgba(54,111,179,.55),rgba(168,112,84,.55));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  opacity:0;
  transition:opacity .45s var(--ease);
  pointer-events:none;
  z-index:3;
}
.card:hover::before,.step:hover::before,.feature:hover::before{opacity:1}
.step,.feature{position:relative;overflow:hidden}
.step::after,.feature::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(260px circle at var(--mx) var(--my),rgba(54,111,179,.12),transparent 65%);
  opacity:0;
  transition:opacity .4s var(--ease);
  pointer-events:none;
}
.step:hover::after,.feature:hover::after{opacity:1}
.step > *,.feature > *{position:relative;z-index:1}

/* Numéros d'étapes et icônes : nuance qui s'anime au survol */
.step-num,.feature-icon{transition:transform .5s var(--ease), background .5s var(--ease), color .5s var(--ease)}
.step:hover .step-num{
  background:linear-gradient(135deg,#366FB3,#A87054);
  color:#FFFFFF;
  border-color:transparent;
  transform:rotate(-6deg) scale(1.06);
}
.feature:hover .feature-icon{
  transform:translateY(-3px) rotate(-4deg);
  background:linear-gradient(140deg,rgba(54,111,179,.26),rgba(168,112,84,.22));
}

/* Images : dévoilement en rideau à l'apparition */
.split-media.reveal{
  filter:none;
  clip-path:inset(0 0 100% 0 round 22px);
  transform:none;
  transition:clip-path 1.2s cubic-bezier(.7,0,.2,1) var(--rd,0s), opacity .6s var(--ease) var(--rd,0s);
}
.split-media.reveal.in{clip-path:inset(0 0 0 0 round 22px)}
.split-media.reveal{animation:revealClip .6s ease 1.1s forwards}
@keyframes revealClip{to{opacity:1;clip-path:inset(0 0 0 0 round 22px)}}
.split-media img{transition:transform 1.6s var(--ease)}
.split-media.reveal img{transform:scale(1.12)}
.split-media.reveal.in img{transform:scale(1)}

/* Badge flottant */
.split-badge{animation:floatY 5s ease-in-out infinite}
@keyframes floatY{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-6px)}
}

/* Chiffres clés : léger halo et soulignement animé */
.hero-stat,.stat-band .stat{position:relative;transition:background .45s var(--ease)}
.hero-stat::after,.stat-band .stat::after{
  content:"";
  position:absolute;
  left:18px;right:18px;bottom:0;
  height:2px;
  background:linear-gradient(90deg,#366FB3,#A87054);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .6s var(--ease);
}
.hero-stat:hover::after,.stat-band .stat:hover::after{transform:scaleX(1)}
.hero-stat:hover,.stat-band .stat:hover{background:#FFFFFF}

/* Tuiles secteurs : voile coloré charte au survol */
.sector-tile::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(160deg,rgba(54,111,179,.45),rgba(168,112,84,.35));
  opacity:0;
  transition:opacity .6s var(--ease);
}
.sector-tile:hover::before{opacity:1}

/* Eyebrow : trait qui se dessine */
.eyebrow.reveal::before{
  clip-path:inset(0 100% 0 0);
  transition:clip-path .9s var(--ease) .25s;
}
.eyebrow.reveal.in::before,
.reveal.in .eyebrow::before{clip-path:inset(0 0 0 0)}
.reveal .eyebrow::before{
  clip-path:inset(0 100% 0 0);
  transition:clip-path .9s var(--ease) .25s;
}

/* Bandeau d'appel : motif qui respire */
.cta-band::after{
  content:"";
  position:absolute;
  inset:-40%;
  background:conic-gradient(from 0deg at 50% 50%,rgba(54,111,179,.10),rgba(168,112,84,.10),rgba(54,111,179,.10));
  animation:spinSlow 40s linear infinite;
  pointer-events:none;
  z-index:0;
}
.cta-band .container{z-index:2}
@keyframes spinSlow{to{transform:rotate(360deg)}}

/* Lien flèche : soulignement progressif */
.link-arrow{position:relative}
.link-arrow::after{
  content:"";
  position:absolute;
  left:0;bottom:-3px;
  height:1px;width:calc(100% - 24px);
  background:currentColor;
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .45s var(--ease);
}
.link-arrow:hover::after{transform:scaleX(1)}

/* Champs du formulaire : libellé qui prend la couleur au focus */
.field:focus-within label{color:var(--accent-text)}
.field label{transition:color .3s var(--ease)}

/* Bouton retour en haut */
.to-top{
  position:fixed;
  right:18px;bottom:18px;
  z-index:90;
  width:42px;height:42px;
  border-radius:8px;
  border:1px solid rgba(54,111,179,.25);
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  color:var(--accent-text);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 26px -14px rgba(13,42,74,.55);
  cursor:pointer;
  opacity:0;
  transform:translateY(14px);
  pointer-events:none;
  transition:opacity .4s var(--ease), transform .4s var(--ease), background .3s var(--ease), color .3s var(--ease);
}
.to-top.show{opacity:1;transform:none;pointer-events:auto}
.to-top:hover{background:linear-gradient(135deg,#366FB3,#A87054);color:#FFFFFF}
.to-top svg{width:18px;height:18px}

/* Pas d'effets de survol lourds sur écrans tactiles */
@media (hover:none){
  .card::before,.step::before,.feature::before,.step::after,.feature::after{display:none}
  .btn::after{display:none}
}

@media (max-width:768px){
  .split-badge{animation:none}
  .cta-band::after{display:none}
  .to-top{right:14px;bottom:14px;width:40px;height:40px}
}

@media (prefers-reduced-motion:reduce){
  .reveal,.split-media.reveal{filter:none;clip-path:none}
  .hero h1 .w{opacity:1;transform:none}
  .grad-text,.split-badge,.cta-band::after{animation:none}
  .scroll-progress{display:none}
}

/* ==========================================================================
   REFONTE UI — ambiance claire & lumineuse, accueil vidéo, finitions modernes
   ========================================================================== */

/* Fond plus lumineux, toujours teinté charte */
body::before{
  background:
    radial-gradient(90% 55% at 0% 0%, rgba(54,111,179,.13), transparent 60%),
    radial-gradient(70% 50% at 100% 100%, rgba(168,112,84,.12), transparent 62%),
    linear-gradient(180deg,#F4F8FD 0%,#FAFCFE 50%,#FBF7F3 100%);
}
.section--line{border-top:0;background:linear-gradient(180deg,rgba(255,255,255,.65),rgba(255,255,255,.35))}

/* Boutons affinés (rectangulaires, fins) */
.btn{padding:9px 20px;font-size:.86rem;border-radius:8px;letter-spacing:.02em}
.mobile-menu .btn{padding:10px 20px}

/* ---------- Menu du haut ---------- */
.site-header{background:transparent}
.site-header.scrolled{
  background:rgba(255,255,255,.78);
  backdrop-filter:blur(20px) saturate(160%);
  -webkit-backdrop-filter:blur(20px) saturate(160%);
}
.nav{
  gap:4px;
  padding:5px;
  border-radius:12px;
  background:rgba(255,255,255,.55);
  border:1px solid rgba(13,42,74,.08);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.nav a{
  padding:7px 14px;
  border-radius:8px;
  font-size:.76rem;
  letter-spacing:.07em;
  transition:color .3s var(--ease), background .3s var(--ease);
}
.nav a::after{left:14px;bottom:3px;max-width:calc(100% - 28px)}
.nav a:hover::after,.nav a.active::after{width:calc(100% - 28px)}
.nav a:hover{background:rgba(54,111,179,.08)}
.nav a.active{background:#FFFFFF;box-shadow:0 2px 8px rgba(13,42,74,.08);color:var(--accent-text)}
.logo-light{display:none}

/* En-tête transparent au-dessus de la vidéo d'accueil */
body.home:not(.menu-open) .site-header:not(.scrolled) .logo-dark{display:none}
body.home:not(.menu-open) .site-header:not(.scrolled) .logo-light{display:block}
body.home:not(.menu-open) .site-header:not(.scrolled) .nav{
  background:rgba(255,255,255,.10);
  border-color:rgba(255,255,255,.20);
}
body.home:not(.menu-open) .site-header:not(.scrolled) .nav a{color:rgba(255,255,255,.86)}
body.home:not(.menu-open) .site-header:not(.scrolled) .nav a:hover{background:rgba(255,255,255,.12);color:#FFFFFF}
body.home:not(.menu-open) .site-header:not(.scrolled) .nav a.active{background:rgba(255,255,255,.95);color:var(--accent-text)}
body.home:not(.menu-open) .site-header:not(.scrolled) .burger{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.35)}
body.home:not(.menu-open) .site-header:not(.scrolled) .burger span{background:#FFFFFF}

/* ---------- Accueil : vidéo de conteneurs ---------- */
.hero--video{min-height:100svh;color:#FFFFFF;background:#0F2A4A}
.hero--video .hero-bg{background:#0F2A4A url("images/hero-poster.jpg") center/cover no-repeat}
.hero-video{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
  object-position:center 55%;
}
.hero--video .hero-bg::after{
  background:
    linear-gradient(95deg,rgba(10,28,52,.90) 0%,rgba(18,52,94,.74) 45%,rgba(54,111,179,.32) 75%,rgba(168,112,84,.28) 100%),
    linear-gradient(180deg,rgba(10,28,52,.35) 0%,rgba(10,28,52,0) 40%,rgba(10,28,52,.55) 100%);
}
.hero--video h1{color:#FFFFFF}
.hero--video .grad-text{
  background:linear-gradient(100deg,#A9CBF0 0%,#FFFFFF 45%,#E6BCA2 100%);
  background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero--video .eyebrow{color:#CFE0F4}
.hero--video .eyebrow::before{filter:brightness(0) invert(1);opacity:.8}
.hero--video .lead{color:rgba(255,255,255,.84)}
.hero--video .btn-ghost{
  background:rgba(255,255,255,.10);
  border-color:rgba(255,255,255,.38);
  color:#FFFFFF;
}
.hero--video .btn-ghost:hover{background:rgba(255,255,255,.20);border-color:#FFFFFF;color:#FFFFFF}
.hero--video .hero-stats{
  background:rgba(255,255,255,.16);
  border-color:rgba(255,255,255,.20);
  box-shadow:0 20px 50px -30px rgba(0,0,0,.6);
}
.hero--video .hero-stat{background:rgba(12,32,58,.42);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.hero--video .hero-stat:hover{background:rgba(12,32,58,.62)}
.hero--video .hero-stat b{color:#FFFFFF}
.hero--video .hero-stat span{color:rgba(255,255,255,.72)}
.hero--video .scroll-hint{color:rgba(255,255,255,.7)}
.hero--video .scroll-hint i{background:linear-gradient(180deg,#FFFFFF,transparent)}
/* fin courbe vers la page claire */
.hero--video::after{
  content:"";
  position:absolute;left:0;right:0;bottom:-1px;
  height:46px;z-index:2;
  background:linear-gradient(180deg,rgba(244,248,253,0),#F4F8FD);
  pointer-events:none;
}

/* ---------- Chiffres clés ---------- */
.stat-band{
  max-width:var(--max);
  margin:-30px auto 0;
  position:relative;z-index:4;
  border:1px solid rgba(13,42,74,.08);
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 24px 60px -36px rgba(13,42,74,.55);
  width:calc(100% - 48px);
}
.stat-band .stat{background:rgba(255,255,255,.94);padding:32px 20px}
.stat-band b{
  font-size:clamp(1.7rem,3vw,2.5rem);
  background:linear-gradient(100deg,#1E4F8C,#366FB3 55%,#A87054);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

/* ---------- Cartes des activités ---------- */
.card--plain,.grid-4 > .card{
  background:linear-gradient(170deg,#FFFFFF 0%,#F7FAFE 100%);
  border-color:rgba(13,42,74,.08);
  box-shadow:0 1px 2px rgba(13,42,74,.04),0 12px 30px -24px rgba(13,42,74,.45);
}
.grid-4 > .card .card-body,.card--plain .card-body{padding:30px 26px 32px}
.card .card-num{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;
  border-radius:10px;
  font-size:.86rem;letter-spacing:.06em;
  color:#FFFFFF;
  background:linear-gradient(135deg,#366FB3,#2A5A94);
  box-shadow:0 8px 18px -10px rgba(54,111,179,.9);
  margin-bottom:20px;
  transition:transform .5s var(--ease), background .5s var(--ease);
}
.card:hover .card-num{transform:rotate(-6deg) scale(1.06);background:linear-gradient(135deg,#366FB3,#A87054)}
.grid-4 > .card::after,.card--plain::after{
  content:"";
  position:absolute;left:26px;right:26px;top:0;
  height:3px;border-radius:0 0 3px 3px;
  background:linear-gradient(90deg,#366FB3,#A87054);
  transform:scaleX(.18);transform-origin:left;
  transition:transform .6s var(--ease);
}
.grid-4 > .card:hover::after,.card--plain:hover::after{transform:scaleX(1)}
.card-body h3{font-weight:600;color:#0E2136}

/* ---------- Pied de page ---------- */
.site-footer{margin-top:0}
.footer-col a{position:relative;display:inline-block}
.footer-col a::after{
  content:"";position:absolute;left:0;bottom:-2px;
  width:100%;height:1px;background:#E7C3AC;
  transform:scaleX(0);transform-origin:left;
  transition:transform .4s var(--ease);
}
.footer-col a:hover::after{transform:scaleX(1)}
.footer-brand .logo-img{height:50px}

/* ---------- Téléphone ---------- */
@media (max-width:1024px){
  .nav{display:none}
}
@media (max-width:768px){
  .hero--video{min-height:92svh;padding:calc(var(--header-h) + 40px) 0 70px}
  .hero--video .hero-bg::after{
    background:linear-gradient(180deg,rgba(10,28,52,.70) 0%,rgba(14,40,74,.80) 55%,rgba(10,28,52,.90) 100%);
  }
  .hero-actions .btn{padding:9px 18px;font-size:.84rem}
  .stat-band{width:calc(100% - 36px);margin-top:-24px;grid-template-columns:1fr 1fr;border-radius:14px}
  .stat-band .stat{padding:22px 12px}
  .grid-4 > .card .card-body,.card--plain .card-body{padding:24px 20px 26px}
}
@media (prefers-reduced-motion:reduce){
  .hero-video{display:none}
}

/* le bandeau des chiffres chevauche le bas de la vidéo : on retire l indice de défilement */
.hero--video .scroll-hint{display:none}
.hero--video{padding-bottom:90px}

/* ==========================================================================
   UI/UX PRO — formes fluides, icônes alignées, formulaire moderne
   ========================================================================== */

/* ---------- 1. Badges de carte : taille au contenu, jamais de débordement ---------- */
.card .card-num{
  align-self:flex-start;
  width:auto;
  min-width:44px;
  height:auto;
  min-height:44px;
  max-width:100%;
  padding:0 14px;
  border-radius:13px;
  text-align:center;
  line-height:1.15;
  white-space:normal;
  letter-spacing:.04em;
}


/* ---------- 2. Formes fluides (rayons généreux, courbes douces) ---------- */
:root{
  --r-lg:26px;
  --r-xl:34px;
}
.card{border-radius:var(--r-lg)}
.card--plain .card-body,
.grid-4 > .card .card-body{padding:30px 26px 32px}
.grid-4 > .card::after,.card--plain::after{left:24px;right:24px;border-radius:0 0 4px 4px}
.split-media{
  border-radius:var(--r-xl) 10px var(--r-xl) 10px;
  overflow:hidden;
}
.split.reverse .split-media{border-radius:10px var(--r-xl) 10px var(--r-xl)}
.page-hero{border-bottom:0}
.page-hero::after{
  content:"";
  position:absolute;left:0;right:0;bottom:-1px;
  height:70px;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(238,244,251,0),rgba(238,244,251,.75));
}
.sector-tile,.quote-block,.map-wrap,.step,.feature,.info-item,
.partners-band,.stat-band{border-radius:var(--r-lg)}
.card-media{border-radius:var(--r-lg) var(--r-lg) 0 0}

/* Titres : soulignement fluide sous les mots clés des sections */
.section-head h2{position:relative}

/* Blason décoratif fluide derrière les sections (très discret, charte) */
.section--line{position:relative;overflow:hidden}
.section--line::before{
  content:"";
  position:absolute;
  top:-160px;right:-180px;
  width:460px;height:460px;
  border-radius:47% 53% 42% 58% / 55% 44% 56% 45%;
  background:radial-gradient(circle at 35% 35%,rgba(54,111,179,.10),rgba(54,111,179,0) 70%);
  pointer-events:none;z-index:0;
}
.section--line::after{
  content:"";
  position:absolute;
  bottom:-200px;left:-160px;
  width:420px;height:420px;
  border-radius:56% 44% 61% 39% / 47% 58% 42% 53%;
  background:radial-gradient(circle at 60% 40%,rgba(168,112,84,.10),rgba(168,112,84,0) 70%);
  pointer-events:none;z-index:0;
}

/* ---------- 3. Icônes alignées avec les textes ---------- */
.info-item{align-items:flex-start;gap:16px;padding:22px 22px}
.info-item > div:not(.feature-icon){display:block;min-width:0;flex:1 1 auto}
.info-item .feature-icon{
  display:flex;align-items:center;justify-content:center;
  flex:0 0 auto;width:42px;height:42px;min-width:42px;
}
.info-item strong{display:block;line-height:1.55}
.info-item span{line-height:1.2}

.checklist svg{margin-top:3px}
.feature{align-items:flex-start}
.split-badge span{line-height:1.45}
.split-badge{align-items:center}
.eyebrow{align-items:center;line-height:1.2}
.spec-list li{align-items:baseline}
.form-note{display:flex;gap:9px;align-items:flex-start}
.form-note svg{
  width:14px;height:14px;flex:0 0 auto;margin-top:2px;
  color:var(--accent-text);opacity:.75;
}
.form-note span{display:block}

/* ---------- 4. Formulaire de contact moderne ---------- */
.form-card{
  border-radius:var(--r-xl);
  padding:clamp(24px,3.2vw,38px);
  border:1px solid rgba(54,111,179,.14);
  background:
    radial-gradient(120% 90% at 100% 0%,rgba(54,111,179,.07),transparent 58%),
    radial-gradient(90% 80% at 0% 100%,rgba(168,112,84,.07),transparent 60%),
    #FFFFFF;
  box-shadow:0 30px 70px -46px rgba(13,42,74,.55);
}
.form-card-head{margin-bottom:22px}
.form-pill{
  display:inline-flex;align-items:center;gap:7px;
  padding:5px 12px 5px 10px;
  border-radius:8px;
  font-size:.7rem;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--accent-2-text);
  background:rgba(168,112,84,.10);
  border:1px solid rgba(168,112,84,.22);
  margin-bottom:14px;
}
.form-pill svg{width:13px;height:13px}
.form-card h2{font-size:clamp(1.32rem,2.4vw,1.62rem);margin-bottom:8px}
.form-card-head p{color:var(--muted);font-size:.9rem;margin:0;line-height:1.65}

.cf .form-row{gap:16px}
.cf .field{margin-bottom:15px}
.cf .field label{
  display:flex;align-items:center;gap:4px;
  font-size:.7rem;letter-spacing:.13em;margin-bottom:7px;
}
.cf .field label .req{color:var(--accent-2);font-size:.85rem;line-height:1}

.cf .inp{position:relative;display:block}
.cf .inp-ico{
  position:absolute;
  left:15px;top:16px;
  width:17px;height:17px;
  color:rgba(90,110,133,.75);
  pointer-events:none;
  transition:color .3s var(--ease), transform .3s var(--ease);
}
.cf .inp--area .inp-ico{top:16px}
.cf .field:focus-within .inp-ico{color:var(--accent);transform:scale(1.06)}

.cf input,
.cf select,
.cf textarea{
  width:100%;
  padding:14px 15px 14px 44px;
  border-radius:14px;
  border:1px solid rgba(13,42,74,.13);
  background:rgba(247,250,254,.85);
  color:var(--text);
  font-family:inherit;
  font-size:.93rem;
  line-height:1.5;
  transition:border-color .3s var(--ease), background .3s var(--ease), box-shadow .3s var(--ease);
}
.cf select{padding-right:38px}
.cf textarea{min-height:140px;resize:vertical;padding-top:14px}
.cf input:hover,
.cf select:hover,
.cf textarea:hover{border-color:rgba(13,42,74,.22)}
.cf input:focus,
.cf select:focus,
.cf textarea:focus{
  outline:none;
  background:#FFFFFF;
  border-color:rgba(54,111,179,.55);
  box-shadow:0 0 0 4px rgba(54,111,179,.10);
}
.cf input::placeholder,
.cf textarea::placeholder{color:rgba(90,110,133,.62)}
.cf select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%235A6E85' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 15px center;
  -webkit-appearance:none;appearance:none;
}
.cf select option{background:#FFFFFF;color:var(--text)}

.cf-submit{
  margin-top:8px;
  padding:14px 24px;
  font-size:.9rem;
  border-radius:12px;
  letter-spacing:.02em;
}
.form-alert{border-radius:14px}

/* Blocs d'infos à droite : formes fluides + icônes */
.contact-info{gap:13px}
.info-item{
  border-radius:20px;
  background:linear-gradient(160deg,rgba(255,255,255,.95),rgba(247,250,254,.82));
  transition:transform .4s var(--ease), border-color .4s var(--ease), box-shadow .4s var(--ease);
}
.info-item:hover{
  transform:translateY(-3px);
  border-color:rgba(54,111,179,.30);
  box-shadow:0 16px 34px -26px rgba(13,42,74,.55);
}
.info-item .feature-icon{
  border-radius:13px;
  background:linear-gradient(140deg,rgba(54,111,179,.13),rgba(168,112,84,.11));
}
.map-wrap{border-radius:22px;margin-top:13px}
.map-wrap iframe{height:250px}

/* ---------- 5. Téléphone ---------- */
@media (max-width:960px){
  .section--line::before,.section--line::after{display:none}
}
@media (max-width:768px){
  :root{--r-lg:20px;--r-xl:24px}
  .split-media,
  .split.reverse .split-media{border-radius:22px}
  .card .card-num{min-width:42px;min-height:42px;padding:0 13px;font-size:.82rem}
  .cf .form-row{grid-template-columns:1fr}
  .cf input,.cf select,.cf textarea{font-size:16px}
  .form-card{padding:22px 18px 24px;border-radius:22px}
  .cf-submit{font-size:.88rem;padding:13px 20px}
  .info-item{padding:18px}
  .map-wrap iframe{height:220px}
}

/* Lien carte */
.map-wrap{position:relative}
.map-link{
  position:absolute;
  right:10px;bottom:10px;
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 12px;
  border-radius:9px;
  font-size:.72rem;font-weight:500;
  color:var(--text);
  background:rgba(255,255,255,.94);
  border:1px solid rgba(13,42,74,.12);
  box-shadow:0 6px 16px -10px rgba(13,42,74,.6);
  backdrop-filter:blur(10px);
  transition:background .3s var(--ease), color .3s var(--ease), transform .3s var(--ease);
}
.map-link:hover{background:var(--accent);color:#FFFFFF;transform:translateY(-1px)}
.map-link svg{width:12px;height:12px}

/* Emails / valeurs longues dans les fiches : jamais de débordement */
.spec-list li{flex-wrap:wrap;align-items:baseline}
.spec-list li b{
  min-width:0;
  text-align:right;
  overflow-wrap:anywhere;
  word-break:break-word;
}
@media (max-width:520px){
  .spec-list li{justify-content:flex-start;gap:2px}
  .spec-list li b{text-align:left;width:100%}
}

/* Carte du siège : image réelle (aucun blocage de chargement) */
.map-wrap{
  display:block;
  position:relative;
  padding:0;
  overflow:hidden;
  line-height:0;
  border-radius:22px;
  border:1px solid rgba(13,42,74,.12);
  background:#E8F0F9;
  filter:none;
  box-shadow:0 18px 40px -30px rgba(13,42,74,.6);
}
.map-wrap img{
  width:100%;
  height:250px;
  object-fit:cover;
  object-position:center;
  display:block;
  transition:transform .9s var(--ease), filter .5s var(--ease);
}
.map-wrap:hover img{transform:scale(1.04)}
.map-caption{
  position:absolute;
  left:12px;bottom:12px;
  display:block;
  padding:9px 13px;
  border-radius:11px;
  background:rgba(255,255,255,.95);
  border:1px solid rgba(13,42,74,.10);
  box-shadow:0 8px 20px -14px rgba(13,42,74,.7);
  backdrop-filter:blur(10px);
  line-height:1.35;
  max-width:calc(100% - 130px);
}
.map-caption b{
  display:block;
  font-size:.82rem;
  font-weight:600;
  color:var(--text);
}
.map-caption small{
  display:block;
  font-size:.7rem;
  color:var(--muted);
}
.map-wrap .map-link{line-height:1;z-index:2}
@media (max-width:768px){
  .map-wrap img{height:220px}
  .map-caption{max-width:calc(100% - 118px);padding:8px 11px}
  .map-caption b{font-size:.78rem}
  .map-caption small{font-size:.66rem}
}

/* ---------- Sélecteur de langue FR / EN ---------- */
.lang-switch{
  display:inline-flex;align-items:center;gap:2px;
  padding:3px;border-radius:8px;
  background:rgba(255,255,255,.55);
  border:1px solid rgba(13,42,74,.10);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
}
.lang-btn{
  font:inherit;font-size:.72rem;font-weight:600;letter-spacing:.06em;
  min-width:34px;padding:6px 8px;border:0;border-radius:6px;
  background:transparent;color:var(--muted);cursor:pointer;
  transition:background .25s var(--ease),color .25s var(--ease);
}
.lang-btn:hover{color:var(--accent-text);background:rgba(54,111,179,.08)}
.lang-btn.is-active{background:var(--accent);color:#FFFFFF;box-shadow:0 2px 8px rgba(54,111,179,.25)}
.lang-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
body.home:not(.menu-open) .site-header:not(.scrolled) .lang-switch{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.25)}
body.home:not(.menu-open) .site-header:not(.scrolled) .lang-btn{color:rgba(255,255,255,.85)}
body.home:not(.menu-open) .site-header:not(.scrolled) .lang-btn.is-active{background:#FFFFFF;color:var(--accent-text)}
@media (max-width:768px){
  .header-actions{gap:8px}
  .lang-btn{min-width:30px;padding:5px 6px}
}

/* ---------- Carte : sélection d'un pays ---------- */
.map-countries path{cursor:pointer}
.map-countries path:focus-visible{outline:none;stroke:#0E2136;stroke-width:2.2}
.map-legend li{cursor:pointer}

/* Un pays est sélectionné : les autres s'effacent */
.map-panel.is-selecting .map-countries path{opacity:.26}
.map-panel.is-selecting .map-dots circle{opacity:.18}

/* Pays sélectionné : surbrillance franche */
.map-countries path.is-sel{
  fill:#1F4F8A;
  stroke:#FFFFFF;
  stroke-width:2.4;
  opacity:1;
  filter:drop-shadow(0 0 9px rgba(31,79,138,.55));
}
.map-countries .c-siege.is-sel{
  fill:#8A5539;
  filter:drop-shadow(0 0 9px rgba(168,112,84,.6));
}
.map-dots circle.is-sel{opacity:1}
.map-dots .core.is-sel{fill:#0E2136;stroke:#FFFFFF;stroke-width:2}
.map-dots .core--siege.is-sel{fill:#FFFFFF;stroke:#8A5539;stroke-width:2}

/* Légende : la ligne du pays actif reste marquée */
.map-legend li.is-active{
  border-color:rgba(54,111,179,.8);
  background:rgba(54,111,179,.14);
  transform:translateX(3px);
  box-shadow:0 12px 26px -18px rgba(13,42,74,.6);
}
.map-legend li.is-siege.is-active{
  border-color:rgba(168,112,84,.85);
  background:rgba(168,112,84,.18);
}
@media (max-width:768px){
  .map-legend li.is-active{transform:none}
}

/* Correctif : le voile ne doit pas éteindre le pays sélectionné */
.map-panel.is-selecting .map-dots circle:not(.is-sel){opacity:.3}
.map-panel.is-selecting .map-countries path.is-sel{opacity:1}

/* Le survol du clavier ne doit pas dessiner de cadre noir autour du pays */
.map-countries path:focus,
.map-countries path:focus-visible,
.map-legend li:focus,
.map-legend li:focus-visible{outline:none;box-shadow:none}
.map-countries path:focus-visible{stroke:#FFFFFF;stroke-width:2.4}

/* ---------- Carte : surbrillance NETTE du pays choisi dans la liste ---------- */
/* Les autres pays restent lisibles mais nettement en retrait */
.map-panel.is-selecting .map-countries path:not(.is-sel){opacity:.32;filter:none}
.map-panel.is-selecting .map-dots circle:not(.is-sel){opacity:.16}
.map-panel.is-selecting .map-countries path.is-sel{opacity:1}

/* Le pays choisi ressort : aplat soutenu, contour épais, halo qui respire */
.map-countries path.is-sel{
  fill:#1B4C8C;
  stroke:#FFFFFF;
  stroke-width:2.6;
  opacity:1;
  filter:drop-shadow(0 0 16px rgba(27,76,140,.9)) drop-shadow(0 2px 3px rgba(14,33,54,.45));
  animation:mapSelPulse 2.4s ease-in-out infinite;
}
.map-countries .c-siege.is-sel{
  fill:#8A5539;
  filter:drop-shadow(0 0 16px rgba(168,112,84,.95)) drop-shadow(0 2px 3px rgba(14,33,54,.45));
}
@keyframes mapSelPulse{
  0%,100%{stroke-width:2.2;filter:drop-shadow(0 0 10px rgba(27,76,140,.7)) drop-shadow(0 2px 3px rgba(14,33,54,.45))}
  50%{stroke-width:3.8;filter:drop-shadow(0 0 22px rgba(27,76,140,1)) drop-shadow(0 2px 3px rgba(14,33,54,.45))}
}
.map-countries .c-siege.is-sel{animation-name:mapSelPulseSiege}
@keyframes mapSelPulseSiege{
  0%,100%{stroke-width:2.2;filter:drop-shadow(0 0 10px rgba(168,112,84,.75)) drop-shadow(0 2px 3px rgba(14,33,54,.45))}
  50%{stroke-width:3.8;filter:drop-shadow(0 0 22px rgba(168,112,84,1)) drop-shadow(0 2px 3px rgba(14,33,54,.45))}
}

/* Le point de la ville choisie reste bien visible au-dessus du halo */
.map-dots circle.is-sel{opacity:1}
.map-dots .core.is-sel{fill:#0E2136;stroke:#FFFFFF;stroke-width:2.2}
.map-dots .core--siege.is-sel{fill:#FFFFFF;stroke:#8A5539;stroke-width:2.2}

/* Étiquette qui nomme le pays choisi, en haut de la carte */
.map-badge{
  position:absolute;
  top:12px;
  left:12px;
  z-index:4;
  display:inline-flex;
  align-items:baseline;
  gap:7px;
  max-width:calc(100% - 24px);
  padding:7px 13px;
  border-radius:9px;
  background:rgba(14,33,54,.93);
  color:#FFFFFF;
  font-size:13px;
  font-weight:600;
  letter-spacing:.01em;
  line-height:1.2;
  opacity:0;
  transform:translateY(-6px);
  transition:opacity .32s ease, transform .32s ease;
  pointer-events:none;
  box-shadow:0 10px 24px -14px rgba(14,33,54,.9);
}
.map-badge.show{opacity:1;transform:none}
.map-badge small{
  font-size:11.5px;
  font-weight:500;
  opacity:.78;
}

/* La fiche du bureau correspondant se marque aussi */
.card[data-bureau].is-linked{
  border-color:rgba(54,111,179,.6);
  box-shadow:0 20px 44px -28px rgba(13,42,74,.75);
}
.card[data-bureau="CIV"].is-linked{
  border-color:rgba(168,112,84,.65);
}

@media (max-width:768px){
  .map-badge{top:10px;left:10px;padding:6px 11px;font-size:12px}
  .map-badge small{font-size:11px}
}

/* Respect du réglage « moins de mouvement » */
@media (prefers-reduced-motion:reduce){
  .map-countries path.is-sel{animation:none;filter:drop-shadow(0 0 14px rgba(27,76,140,.85))}
  .map-countries .c-siege.is-sel{filter:drop-shadow(0 0 14px rgba(168,112,84,.9))}
}