/* ==========================================================================
   APTN — styles de base, mise en page et sections
   Valeurs relevées sur la maquette desktop 1440 px.
   ========================================================================== */

:root {
  /* Couleurs de la maquette */
  --c-green: #006837;
  --c-green-dark: #04351f;
  --c-green-film: #17291c;
  --c-green-icon: #20b479;
  --c-lime: #8cc63e;
  --c-orange: #f88008;
  --c-orange-hover: #e57300;
  --c-text: #1c1c1a;
  --c-muted: #d9d9d8;
  --c-gray: #f4f4f2;
  --c-white: #fff;
  --c-news-placeholder: #99b894;

  /* Typographie */
  --f-heading: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Mise en page */
  --container: 1320px;
  --gutter: 60px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 14px;
  --radius-2xl: 16px;
  --header-h: 90px;
  --ease: cubic-bezier(.22, .61, .36, 1);
}

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

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 16px);
}

body {
  margin: 0;
  background: var(--c-white);
  color: var(--c-text);
  font-family: var(--f-body);
  font-size: 15px;
  line-height: 1.2;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

img,
svg,
video { display: block; max-width: 100%; }
img { height: auto; }

h1, h2, h3, h4, p, figure, blockquote, ol, ul { margin: 0; }
:where(ul, ol)[role="list"] { list-style: none; padding: 0; }

a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }

:focus-visible { outline: 2px solid var(--c-orange); outline-offset: 3px; }

.sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}

.skip-link {
  position: absolute; left: 16px; top: -60px; z-index: 1000;
  padding: 10px 16px; border-radius: var(--radius-sm);
  background: var(--c-orange); color: #fff; font-weight: 600;
  transition: top .2s;
}
.skip-link:focus { top: 12px; }

.hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }

.container {
  width: 100%;
  max-width: calc(var(--container) + 2 * var(--gutter));
  margin-inline: auto;
  padding-inline: var(--gutter);
}
.container--presentation { max-width: calc(1160px + 2 * var(--gutter)); }
.container--reasons { max-width: calc(1140px + 2 * var(--gutter)); }
.container--sites { max-width: calc(1340px + 2 * 50px); padding-inline: 50px; }
.container--narrow { max-width: calc(1280px + 2 * var(--gutter)); }
.container--footer { max-width: calc(1260px + 2 * var(--gutter)); }

/* ---------- Titres de section ---------- */

.eyebrow {
  color: var(--c-green);
  font-size: 13px;
  font-weight: 600;
  line-height: 16px;
  text-transform: uppercase;
}
.eyebrow--lime { color: var(--c-lime); }

.section-title {
  font-family: var(--f-heading);
  font-size: 32px;
  font-weight: 700;
  line-height: 1.25;
  color: var(--c-text);
  letter-spacing: 0;
}
.section-title--xl { font-size: 34px; }
.section-title--md { font-size: 30px; }
.section-title--sm { font-size: 24px; }

.section-head--center { text-align: center; }
.section-head .eyebrow { margin-bottom: 13px; }
.section-head--split {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}
.section-head--split > .link-arrow { margin-bottom: 24px; }

.section-intro {
  max-width: 680px;
  margin: 34px auto 0;
  font-size: 16px;
  line-height: 19px;
}

.section-link { margin-top: 33px; }
.section-link--center { text-align: center; }

.section { position: relative; }
.section--gray { background: var(--c-gray); }

/* ==========================================================================
   Topbar + header
   ========================================================================== */

.topbar {
  background: var(--c-green-dark);
  color: var(--c-white);
  font-size: 12px;
  line-height: 15px;
}
.topbar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 40px;
}
.topbar__contact,
.topbar__links { display: flex; align-items: center; gap: 10px; }
.topbar__contact a { display: inline-flex; align-items: center; gap: 5px; }
.topbar__contact a svg { flex: none; opacity: .8; }
.topbar a:hover { color: var(--c-lime); }

/* --- Dropdown langue --- */
.lang-dropdown { position: relative; }
.lang-dropdown__trigger {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: none;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 6px;
  color: var(--c-white);
  font-size: 12px;
  font-weight: 600;
  padding: 3px 8px;
  cursor: pointer;
  transition: border-color .2s, background .2s;
}
.lang-dropdown__trigger:hover { border-color: rgba(255,255,255,.6); background: rgba(255,255,255,.08); }
.lang-dropdown__trigger[aria-expanded="true"] { border-color: var(--c-lime); }
.lang-dropdown__flag { border-radius: 2px; object-fit: cover; flex-shrink: 0; }
.lang-dropdown__chevron { transition: transform .25s; flex-shrink: 0; }
.lang-dropdown__trigger[aria-expanded="true"] .lang-dropdown__chevron { transform: rotate(180deg); }
.lang-dropdown__menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 200;
  min-width: 140px;
  margin: 0; padding: 6px 0;
  background: var(--c-green-dark);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,.35);
  list-style: none;
  opacity: 0;
  transform: translateY(-6px);
  pointer-events: none;
  transition: opacity .2s, transform .2s;
}
.lang-dropdown.is-open .lang-dropdown__menu {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}
.lang-dropdown__menu a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  font-size: 12px;
  font-weight: 500;
  color: var(--c-muted);
  transition: background .15s, color .15s;
}
.lang-dropdown__menu a:hover,
.lang-dropdown__menu a[aria-current] { background: rgba(255,255,255,.07); color: var(--c-white); }
.lang-dropdown__menu a[aria-current] { font-weight: 700; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--c-white);
  transition: box-shadow .3s var(--ease);
}
.site-header.is-scrolled { box-shadow: 0 6px 24px rgba(4, 53, 31, .08); }
.site-header__inner {
  display: flex;
  align-items: center;
  height: var(--header-h);
}
.site-logo { flex: none; display: block; margin-top: 1px; }
.site-logo img { width: 137px; height: auto; }

.main-nav { flex: 1; display: flex; justify-content: center; }
.main-nav__list {
  display: flex;
  gap: 28px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.main-nav__list a {
  position: relative;
  display: block;
  padding: 6px 0;
  font-size: 13px;
  font-weight: 500;
  line-height: 16px;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--c-text);
  transition: color .2s;
}
.main-nav__list a::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 2px;
  background: var(--c-orange);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .3s var(--ease);
}
.main-nav__list a:hover { color: var(--c-green); }
.main-nav__list a:hover::after,
.main-nav__list a.is-active::after { transform: scaleX(1); }
.main-nav__list a.is-active { color: var(--c-green); }
.main-nav .main-nav__cta { display: none; }

.site-header__cta { flex: none; width: 178px; height: 44px; }

.nav-toggle { display: none; }

/* ==========================================================================
   Hero
   ========================================================================== */

.hero {
  position: relative;
  /* Plein écran, sous l'en-tête collant */
  height: calc(100vh - var(--header-h));
  height: calc(100svh - var(--header-h));
  min-height: 520px;
  display: flex;
  color: var(--c-white);
  background: var(--c-white);
  overflow: hidden;
  isolation: isolate;
}
.hero__media,
.hero__overlay { position: absolute; inset: 0; z-index: -1; }
.hero__media img,
.hero__media video { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero__video { position: absolute; inset: 0; }
/* Flou gaussien progressif commun à tous les héros : fort à gauche derrière le texte, net vers la droite. */
.hero-blur {
  position: absolute; inset: 0 30% 0 0;
  z-index: -1;
  pointer-events: none;
  -webkit-backdrop-filter: blur(16px);
          backdrop-filter: blur(16px);
  -webkit-mask-image: linear-gradient(to right, #000 45%, transparent);
          mask-image: linear-gradient(to right, #000 45%, transparent);
}
/* Accueil : le flou monte du bas de l'écran jusqu'au niveau du titre. */
.hero .hero-blur {
  inset: 40% 0 0;
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 40%);
          mask-image: linear-gradient(to bottom, transparent, #000 40%);
}
.hero__overlay {
  background: linear-gradient(180deg,
    rgba(4, 53, 31, .05) 0%,
    rgba(4, 53, 31, .35) 45%,
    rgba(4, 53, 31, .88) 100%);
}
.hero__inner {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding-top: 40px;
  padding-bottom: 70px;
}
.hero__media-label {
  position: absolute;
  top: 40px;
  left: var(--gutter);
  display: inline-flex;
  align-items: center;
  height: 31px;
  padding: 0 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, .22);
  font-size: 12px;
  line-height: 15px;
}
.hero__content { max-width: 830px; }
.hero__content .eyebrow { margin-bottom: 15px; }
.hero__title {
  font-family: var(--f-heading);
  font-size: 50px;
  font-weight: 700;
  line-height: 75px;
  letter-spacing: 0;
}
.hero__text {
  max-width: 620px;
  margin-top: 25px;
  font-size: 18px;
  line-height: 22px;
}
.hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 20px;
}

/* ==========================================================================
   Présentation (thématiques + recherche)
   ========================================================================== */

.section--presentation {
  padding: 88px 0 90px;
  overflow: hidden;
}
.presentation__decor {
  position: absolute;
  inset: 0;
  background: url("../images/decor/monuments.webp") center / auto 100% no-repeat;
  opacity: .12;
  pointer-events: none;
}
.section--presentation .container { position: relative; }
.section--presentation .section-title { margin-top: 0; }

.tabs .pills { margin: 29px 0 28px; }

.pills { display: flex; flex-wrap: wrap; gap: 8px; }
.pills--center { justify-content: center; }
.pills--sm { gap: 10px; }

.circuit-search { margin-top: 28px; }

/* ==========================================================================
   10 raisons
   ========================================================================== */

.section--reasons { padding: 91px 0 91px; }
.reasons-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
  align-items: start;
  margin: 35px 0 0;
  padding: 0 10px;
  list-style: none;
}
.section--reasons .section-link { margin-top: 31px; }

/* Défilement continu des 10 raisons (page d'accueil). */
.reasons-marquee {
  margin-top: 35px;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.reasons-marquee__track {
  display: flex;
  width: max-content;
  padding: 6px 0 10px;
  animation: reasons-scroll 45s linear infinite;
}
.reasons-marquee:hover .reasons-marquee__track,
.reasons-marquee:focus-within .reasons-marquee__track { animation-play-state: paused; }
.reasons-marquee__list {
  display: flex;
  gap: 20px;
  margin: 0;
  padding: 0 20px 0 0;
  list-style: none;
}
.reasons-marquee__list > li { display: flex; width: 214px; }
.reasons-marquee .reason-card { width: 100%; }
@keyframes reasons-scroll {
  to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .reasons-marquee { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
  .reasons-marquee__track { animation: none; }
  .reasons-marquee__list[aria-hidden] { display: none; }
}

/* ==========================================================================
   Carte
   ========================================================================== */

.section--map { padding: 62px 0 62px; }
.map-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 744px;
  align-items: start;
  padding-right: calc(var(--gutter) + 38px);
}
.map-layout__text { padding-top: 114px; max-width: 420px; }
.map-layout__text .eyebrow { margin-bottom: 21px; }
.map-layout__intro {
  margin-top: 22px;
  font-size: 15px;
  line-height: 18px;
}
.map-layout__text .pills { margin-top: 19px; }

/* ==========================================================================
   Sites incontournables
   ========================================================================== */

.section--sites { padding: 89px 0 91px; }
.sites-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-top: 44px;
}
.section--sites .section-link { margin-top: 41px; }

/* ==========================================================================
   Gastronomie : deux rangées qui défilent en sens inverse
   ========================================================================== */

.section--food { padding: 89px 0 91px; overflow: hidden; }
.food-rows { display: flex; flex-direction: column; gap: 24px; margin-top: 44px; }
.food-row__track {
  display: flex;
  width: max-content;
  animation: food-scroll 60s linear infinite;
}
.food-row--reverse .food-row__track { animation-direction: reverse; }
/* Décalage de la 2e rangée, comme une mosaïque. */
.food-row--reverse { margin-left: -180px; }
.food-row:hover .food-row__track,
.food-row:focus-within .food-row__track { animation-play-state: paused; }
.food-row__list {
  display: flex;
  gap: 24px;
  margin: 0;
  padding: 0 24px 0 0;
  list-style: none;
}
.food-row__list > li { width: 340px; }
.section--food .section-link { margin-top: 41px; }
@keyframes food-scroll {
  to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .food-row { overflow-x: auto; }
  .food-row__track { animation: none; }
  .food-row__list[aria-hidden] { display: none; }
  .food-row--reverse { margin-left: 0; }
}

/* ==========================================================================
   Événements
   ========================================================================== */

.section--events { padding: 89px 0 90px; }
.section--events .section-head--split,
.section--news .section-head--split { padding-bottom: 3px; }
.section--events .section-head .eyebrow { margin-bottom: 13px; }
.events-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  align-items: start;
  margin-top: 33px;
  padding-inline: 10px;
}

/* ==========================================================================
   Avant de partir
   ========================================================================== */

.section--practical { padding: 89px 0 103px; }
.info-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px 20px;
  align-items: start;
  margin-top: 34px;
}

/* ==========================================================================
   Chiffres clés
   ========================================================================== */

.stats {
  position: relative;
  padding: 96px 0 90px;
  background: var(--c-white);
  overflow: hidden;
  isolation: isolate;
}
/* Silhouette du Niger en filigrane derrière le chiffre principal. */
.stats__map {
  position: absolute;
  top: 50%; left: 50%;
  z-index: -2;
  width: min(1100px, 92%);
  transform: translate(-50%, -52%);
  fill: var(--c-gray);
  stroke: var(--c-white);
  stroke-width: 2;
}
/* Mosaïques de photos : coins arrondis, tailles variées, collées aux bords de l'écran (miroir à droite). */
.stats__collage {
  position: absolute;
  top: 56px;
  z-index: 1;
  pointer-events: none;
  width: 440px;
  height: 320px;
}
.stats__collage--left { left: 0; }
.stats__collage--right { right: 0; }
.stats__collage img {
  position: absolute;
  top: var(--y);
  width: var(--s);
  height: var(--s);
  border-radius: 10px;
  object-fit: cover;
  box-shadow: 0 8px 20px rgba(4, 53, 31, .1);
  animation: stats-float 6s ease-in-out var(--d) infinite alternate;
  pointer-events: auto;
}
/* Tour complet sur elle-même au survol ; le retour à 0° est instantané (360° = 0°, donc invisible). */
.stats__collage img:hover {
  rotate: 360deg;
  transition: rotate .8s var(--ease);
}
.stats__collage--left img { left: var(--x); }
.stats__collage--right img { right: var(--x); }
@keyframes stats-float {
  to { transform: translateY(-8px); }
}
@media (prefers-reduced-motion: reduce) {
  .stats__collage img { animation: none; }
  .stats__collage img:hover { rotate: none; }
}
/* Le titre se place entre les deux mosaïques, le grand chiffre juste en dessous. */
.stats__inner { position: relative; z-index: 2; }
.stats .section-head { padding-top: 80px; }
.stats__highlight { margin-top: 120px; text-align: center; }
.stats__big {
  display: block;
  color: var(--c-orange);
  font-family: var(--f-heading);
  font-size: clamp(56px, 10vw, 140px);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
}
.stats__big small { font-size: .45em; letter-spacing: 0; }
.stats__big-label {
  margin-top: 20px;
  font-size: 18px;
  font-weight: 600;
}
.stats__list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin: 72px 0 0;
  padding: 0;
  list-style: none;
}

/* ==========================================================================
   Actualités
   ========================================================================== */

.section--news { padding: 89px 0 90px; }
.news-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 32px;
  padding-inline: 10px;
}

/* ==========================================================================
   Témoignages
   ========================================================================== */

.section--testimonials { padding: 89px 0 90px; }
.testimonials-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 36px;
}

/* ==========================================================================
   Film de destination
   ========================================================================== */

/* Moitié haute grise (raccord avec la section précédente), moitié basse orange. */
.film {
  padding-bottom: 56px;
  background: linear-gradient(to bottom, var(--c-gray) 0 45%, var(--c-orange) 45% 100%);
  color: var(--c-white);
}
.film__media {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 16 / 7.2;
  border-radius: var(--radius-2xl);
  background: var(--c-green-film);
  overflow: hidden;
  isolation: isolate;
  box-shadow: 0 24px 50px rgba(4, 53, 31, .18);
}
.film__poster {
  position: absolute; inset: 0; z-index: -1;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .8s var(--ease);
}
.film__media:hover .film__poster { transform: scale(1.03); }
.film__play {
  display: grid;
  place-items: center;
  width: 84px;
  height: 84px;
  border-radius: 50%;
  background: var(--c-white);
  color: var(--c-text);
  box-shadow: 0 0 0 12px rgba(255, 255, 255, .35);
  transition: transform .3s var(--ease), box-shadow .3s;
}
.film__play svg { width: 30px; height: 30px; margin-left: 4px; }
.film__play:hover { transform: scale(1.08); box-shadow: 0 0 0 16px rgba(255, 255, 255, .3); }
/* Toute la vignette déclenche la lecture. */
.film__play::after { content: ""; position: absolute; inset: 0; }
.film__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 40px;
  padding-bottom: 40px;
  border-bottom: 1px solid rgba(255, 255, 255, .35);
}
.film__title {
  max-width: 820px;
  font-family: var(--f-heading);
  font-size: 40px;
  font-weight: 600;
  line-height: 1.2;
}
.film__more {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 46px;
  padding: 0 24px;
  border-radius: 999px;
  background: var(--c-white);
  color: var(--c-text);
  font-weight: 600;
  transition: transform .3s var(--ease), box-shadow .3s;
}
.film__more:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(0, 0, 0, .15); }

/* ==========================================================================
   Partenaires — bulles circulaires
   ========================================================================== */

.partners-bubbles {
  background: var(--c-white);
  padding: 72px 0 80px;
}
.partners__title {
  color: var(--c-green);
  font-size: 13px;
  font-weight: 600;
  line-height: 16px;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: .06em;
}
.partners-bubbles__track {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 40px;
  margin-top: 56px;
}

.partner-bubble {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border-radius: 50%;
  background: #ffffff;
  box-shadow:
    0 20px 56px rgba(65, 172, 56, .15),
    0  6px 18px rgba(65, 172, 56, .10);
  /* GSAP gère les transforms — les bulles sont visibles dès le départ */
}

/* Tailles variées par index */
.partner-bubble:nth-child(1) { width: 210px; height: 210px; padding: 32px; }
.partner-bubble:nth-child(2) { width: 170px; height: 170px; padding: 24px; }
.partner-bubble:nth-child(3) { width: 195px; height: 195px; padding: 30px; }
.partner-bubble:nth-child(4) { width: 165px; height: 165px; padding: 24px; }
.partner-bubble:nth-child(5) { width: 180px; height: 180px; padding: 28px; }

.partner-bubble img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.partner-bubble__link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  transition: transform .3s var(--ease);
}
.partner-bubble__link:hover { transform: scale(1.07); }

/* ==========================================================================
   Newsletter + footer
   ========================================================================== */

.newsletter {
  background: var(--c-green);
  color: var(--c-white);
}
.newsletter__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  min-height: 183px;
}
.newsletter__title {
  font-family: var(--f-heading);
  font-size: 26px;
  font-weight: 700;
  line-height: 32px;
}
.newsletter__text p {
  margin-top: 7px;
  color: var(--c-lime);
  font-size: 15px;
  line-height: 18px;
}
.newsletter__form {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  width: 412px;
  margin-top: -3px;
}
.newsletter__input {
  flex: 1;
  min-width: 0;
  height: 44px;
  padding: 0 20px;
  border: 1px solid transparent;
  border-radius: var(--radius-md);
  background: var(--c-white);
  color: var(--c-text);
  font-size: 14px;
}
.newsletter__input::placeholder { color: var(--c-text); opacity: 1; }
.newsletter__input[aria-invalid="true"] { border-color: #d93025; }
.newsletter__submit { width: 117px; height: 45px; }
.newsletter__message {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  font-size: 13px;
  line-height: 16px;
}
.newsletter__message.is-error { color: #ffd2cc; }
.newsletter__message.is-success { color: var(--c-lime); }

.site-footer {
  background: var(--c-green-dark);
  color: var(--c-muted);
}
/* Bordure tricolore drapeau du Niger : orange | blanc | vert */
.site-footer::before {
  content: "";
  display: block;
  height: 4px;
  background: linear-gradient(to right,
    #E05206 33.33%,
    #FFFFFF 33.33%, #FFFFFF 66.66%,
    #189B48 66.66%
  );
}
.site-footer__top {
  display: grid;
  grid-template-columns: 1fr 300px 321px 113px;
  padding-top: 70px;
  padding-bottom: 51px;
}
.site-footer__brand img { width: 136px; height: auto; }
.site-footer__brand p {
  max-width: 290px;
  margin-top: 13px;
  font-size: 13px;
  line-height: 15px;
}
.site-footer__heading {
  margin: 4px 0 0;
  color: var(--c-white);
  font-family: var(--f-heading);
  font-size: 15px;
  font-weight: 600;
  line-height: 22px;
}
.site-footer__col ul { margin-top: 10px; }
.site-footer__col li { display: flex; line-height: 16px; }
.site-footer__col li + li { margin-top: 12px; }
.site-footer__col a {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  font-size: 13px;
  line-height: 16px;
  color: var(--c-muted);
  transition: color .2s, transform .2s;
}
.site-footer__col a::before {
  content: "";
  flex: none;
  width: 14px;
  height: 14px;
  background-color: #e63329;
  -webkit-mask: url('../icons/croix-agadez.png') no-repeat center / contain;
          mask: url('../icons/croix-agadez.png') no-repeat center / contain;
  transform: rotate(0deg);
}
.site-footer__col a:hover { color: var(--c-white); transform: translateX(2px); }

.site-footer__bottom { border-top: 1px solid rgba(255, 255, 255, .08); }
.site-footer__bottom-inner {
  display: flex;
  align-items: center;
  gap: 24px;
  min-height: 72px;
}
.site-footer__copy { flex: 1; font-size: 12px; line-height: 15px; }
.site-footer__legal { display: flex; gap: 24px; font-size: 12px; line-height: 15px; }
.site-footer__legal a:hover { color: var(--c-white); }
.social { display: flex; gap: 10px; margin-left: 8px; }
.social a { display: block; border-radius: 50%; transition: transform .2s var(--ease), filter .2s; }
.social a:hover { transform: translateY(-2px); filter: brightness(1.08); }
.social svg { width: 28px; height: 28px; }

/* ---------- États vides ---------- */
.empty-state {
  margin-top: 32px;
  padding: 32px;
  border-radius: var(--radius-lg);
  background: var(--c-gray);
  text-align: center;
}

/* Ajustements fins relevés sur la maquette */
.section--presentation .section-head .eyebrow { margin-bottom: 32px; }
.section--presentation .section-intro { margin-top: 32px; }
.section--presentation .tabs .pills { margin-top: 28px; }