/* ============================================================
   MUSLIM VOYAGE — Feuille de style principale
   Palette : crème #F8F4EE · sable #EFE8DA · encre #18130E
             terracotta #A87C3E · teal #2E6B5E · nuit #12100E
   Typo   : Georgia (titres) · Helvetica Neue / Arial (corps)
   Mobile-first
============================================================ */

/* ── Variables ──────────────────────────────────────────── */
:root {
  --creme:      #F8F4EE;
  --sable:      #EFE8DA;
  --encre:      #18130E;
  --terracotta: #A87C3E;
  --teal:       #2E6B5E;
  --nuit:       #12100E;
  --blanc:      #FFFFFF;
  --gris:       #A89E96;
  --gris-clair: #F0EDE8;

  --ff-serif: Georgia, 'Times New Roman', serif;
  --ff-sans:  'Helvetica Neue', Arial, Helvetica, sans-serif;

  --r-sm:  0.375rem;
  --r-md:  0.75rem;
  --r-lg:  1.25rem;
  --r-xl:  2rem;
  --r-pill: 9999px;

  --shadow-sm: 0 1px 4px rgba(24,19,14,.07);
  --shadow-md: 0 4px 18px rgba(24,19,14,.11);
  --shadow-lg: 0 8px 36px rgba(24,19,14,.16);

  --t: 200ms ease;
  --w: 1200px;
}

/* ── Reset ───────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--ff-sans);
  background: var(--creme);
  color: var(--encre);
  line-height: 1.72;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img, picture, video, svg { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; border: none; background: none; font: inherit; }
ul, ol { list-style: none; }
input, textarea, select { font: inherit; }
table { border-collapse: collapse; width: 100%; }

/* ── Accessibilité ───────────────────────────────────────── */
.sr-only {
  position: absolute; 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; top: -120%; left: 1rem; z-index: 9999;
  background: var(--encre); color: var(--creme);
  padding: .5rem 1.25rem; border-radius: var(--r-sm);
  font-size: .875rem; font-weight: 600;
  transition: top .2s ease;
}
.skip-link:focus { top: .75rem; }

/* ── Conteneur ───────────────────────────────────────────── */
.container {
  max-width: var(--w);
  margin: 0 auto;
  padding: 0 1.25rem;
}
@media (min-width:768px)  { .container { padding: 0 2rem; } }
@media (min-width:1280px) { .container { padding: 0 1.5rem; } }

/* ── Typographie ─────────────────────────────────────────── */
h1,h2,h3,h4,h5,h6 { font-family: var(--ff-serif); line-height: 1.22; color: var(--encre); }
h1 { font-size: clamp(1.875rem, 5vw, 3.25rem); }
h2 { font-size: clamp(1.5rem,   4vw, 2.5rem);  }
h3 { font-size: clamp(1.25rem,  3vw, 1.875rem);}
h4 { font-size: clamp(1.0625rem,2vw, 1.375rem);}
p  { margin-bottom: 1em; }
p:last-child { margin-bottom: 0; }
strong { font-weight: 700; }
em { font-style: italic; }
blockquote {
  border-left: 4px solid var(--terracotta);
  margin: 1.75rem 0;
  padding: 1rem 1.5rem;
  background: var(--sable);
  border-radius: 0 var(--r-sm) var(--r-sm) 0;
  font-family: var(--ff-serif);
  font-style: italic;
  font-size: 1.1rem;
}
blockquote p { margin: 0; }
code { font-family: 'Courier New', monospace; font-size: .875rem; background: var(--sable); padding: .125rem .4rem; border-radius: var(--r-sm); }
pre  { background: var(--nuit); color: var(--creme); padding: 1.5rem; border-radius: var(--r-md); overflow-x: auto; margin: 1.5rem 0; }
pre code { background: none; padding: 0; }
hr { border: none; border-top: 2px solid var(--sable); margin: 2.5rem 0; }

/* ── Utilitaires ─────────────────────────────────────────── */
.text-teal       { color: var(--teal); }
.text-terracotta { color: var(--terracotta); }
.text-muted      { color: var(--gris); }
.section-title {
  font-family: var(--ff-serif);
  font-size: clamp(1.5rem, 3.5vw, 2.25rem);
  margin-bottom: 2rem;
}
.section-title::after {
  content: '';
  display: block;
  width: 3rem; height: 3px;
  background: var(--terracotta);
  margin-top: .5rem;
}
.badge {
  display: inline-flex; align-items: center;
  padding: .25rem .875rem;
  border-radius: var(--r-pill);
  font-size: .75rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em;
}
.badge-teal       { background: rgba(46,107,94,.12); color: var(--teal); }
.badge-terracotta { background: rgba(168,124,62,.12); color: var(--terracotta); }
.badge-solid      { background: var(--terracotta); color: var(--blanc); }

/* ── HEADER ──────────────────────────────────────────────── */
.site-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(248,244,238,.97);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--sable);
  transition: box-shadow var(--t);
}
.site-header.scrolled { box-shadow: var(--shadow-md); }
.header-inner {
  display: flex; align-items: center;
  justify-content: space-between;
  height: 3.75rem; gap: 1rem;
}
.site-logo {
  display: flex; align-items: center; gap: .625rem;
  flex-shrink: 0;
}
.logo-icon  { font-size: 1.5rem; color: var(--terracotta); }
.logo-text  { font-family: var(--ff-serif); font-size: 1.25rem; line-height: 1; color: var(--encre); }
.logo-text strong { color: var(--teal); }

/* Nav desktop */
.site-nav { display: none; }
.nav-list { display: flex; gap: .125rem; align-items: center; }
.nav-link {
  display: block; padding: .5rem .8125rem;
  font-size: .875rem; font-weight: 500;
  border-radius: var(--r-sm);
  white-space: nowrap;
  transition: background var(--t), color var(--t);
}
.nav-link:hover, .nav-link.active { background: var(--sable); color: var(--teal); }

.header-actions { display: flex; align-items: center; gap: .375rem; }
.header-btn {
  display: flex; align-items: center; justify-content: center;
  width: 2.625rem; height: 2.625rem;
  border-radius: var(--r-sm);
  color: var(--encre);
  transition: background var(--t);
  min-width: 44px; min-height: 44px;
}
.header-btn:hover { background: var(--sable); }

/* Hamburger */
.hamburger {
  display: flex; flex-direction: column;
  justify-content: center; gap: 5px;
  width: 2.625rem; height: 2.625rem;
  padding: .75rem; border-radius: var(--r-sm);
  transition: background var(--t);
  min-width: 44px; min-height: 44px;
}
.hamburger:hover { background: var(--sable); }
.hamburger-line {
  display: block; width: 100%; height: 2px;
  background: var(--encre); border-radius: var(--r-pill);
  transition: transform .3s ease, opacity .25s ease;
  transform-origin: center;
}
.hamburger.open .hamburger-line:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.open .hamburger-line:nth-child(2) { opacity: 0; transform: scaleX(0); }
.hamburger.open .hamburger-line:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Overlay menu mobile */
.menu-overlay {
  position: fixed; inset: 0; z-index: 98;
  background: rgba(18,16,14,.48);
  opacity: 0; pointer-events: none;
  transition: opacity .3s ease;
}
.menu-overlay.open { opacity: 1; pointer-events: auto; }

@media (max-width:767px) {
  .site-nav {
    display: block; position: fixed;
    top: 0; right: -100%;
    width: min(82vw, 20rem); height: 100%;
    z-index: 99;
    background: var(--creme);
    padding: 5rem 1.5rem 2rem;
    overflow-y: auto;
    transition: right .32s cubic-bezier(.4,0,.2,1);
    box-shadow: var(--shadow-lg);
  }
  .site-nav.open { right: 0; }
  .nav-list { flex-direction: column; gap: 0; }
  .nav-link {
    padding: .9375rem 1rem; font-size: 1.0625rem;
    border-bottom: 1px solid var(--sable);
    border-radius: 0;
  }
}
@media (min-width:768px) {
  .site-nav { display: block; }
  .hamburger { display: none; }
}

/* ── SEARCH OVERLAY ──────────────────────────────────────── */
.search-overlay {
  position: fixed; inset: 0; z-index: 200;
  background: rgba(248,244,238,.96);
  backdrop-filter: blur(8px);
  display: flex; align-items: flex-start;
  justify-content: center; padding-top: 18vh;
  opacity: 0; pointer-events: none;
  transition: opacity .22s ease;
}
.search-overlay.open { opacity: 1; pointer-events: auto; }
.search-overlay-inner { width: min(92vw, 44rem); position: relative; }
.search-form {
  display: flex;
  border: 2px solid var(--encre);
  border-radius: var(--r-md);
  overflow: hidden; background: var(--blanc);
  box-shadow: var(--shadow-lg);
}
.search-form input[type=search] {
  flex: 1; padding: 1.0625rem 1.25rem;
  font-size: 1.125rem; border: none;
  background: transparent; outline: none;
  color: var(--encre);
}
.search-form button {
  padding: 0 1.375rem; background: var(--encre); color: var(--creme);
  display: flex; align-items: center;
  transition: background var(--t);
}
.search-form button:hover { background: var(--teal); }
.search-close {
  position: absolute; top: -3.25rem; right: 0;
  width: 2.5rem; height: 2.5rem;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.25rem; color: var(--encre);
  border-radius: var(--r-sm);
  transition: background var(--t);
}
.search-close:hover { background: var(--sable); }

/* ── HERO (article vedette) ──────────────────────────────── */
.hero { padding: 2.5rem 0 3rem; }
.hero-grid {
  display: grid; grid-template-columns: 1fr; gap: 2rem;
}
.hero-img {
  border-radius: var(--r-lg); overflow: hidden;
  aspect-ratio: 16/9; background: var(--sable);
}
.hero-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.hero-img:hover img { transform: scale(1.03); }
.hero-body { display: flex; flex-direction: column; justify-content: center; }
.hero-cat {
  display: inline-block; padding: .3rem .9375rem;
  background: var(--terracotta); color: var(--blanc);
  border-radius: var(--r-pill);
  font-size: .78125rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .07em;
  margin-bottom: 1.125rem;
}
.hero-title {
  font-family: var(--ff-serif);
  font-size: clamp(1.75rem, 4.5vw, 2.875rem);
  line-height: 1.18; margin-bottom: 1rem;
}
.hero-title a { color: var(--encre); transition: color var(--t); }
.hero-title a:hover { color: var(--teal); }
.hero-excerpt { color: #5c5249; font-size: 1.0625rem; line-height: 1.72; margin-bottom: 1.375rem; }
.hero-meta { display: flex; flex-wrap: wrap; align-items: center; gap: .875rem 1.5rem; font-size: .875rem; color: var(--gris); }
.hero-meta .dot { width: 3px; height: 3px; background: var(--gris); border-radius: 50%; flex-shrink: 0; }
.hero-read {
  display: inline-flex; align-items: center; gap: .375rem;
  padding: .6875rem 1.375rem;
  background: var(--encre); color: var(--creme);
  border-radius: var(--r-sm); font-size: .9375rem; font-weight: 600;
  margin-top: 1.5rem; align-self: flex-start;
  transition: background var(--t), transform var(--t);
}
.hero-read:hover { background: var(--teal); transform: translateX(3px); }

@media (min-width:768px) {
  .hero { padding: 3.5rem 0 4rem; }
  .hero-grid { grid-template-columns: 1.25fr 1fr; gap: 3rem; align-items: center; }
}
@media (min-width:1024px) {
  .hero-grid { grid-template-columns: 1.4fr 1fr; gap: 4.5rem; }
}

/* ── GRILLE D'ARTICLES ───────────────────────────────────── */
.articles-section { padding: 1rem 0 4.5rem; }
.articles-grid {
  display: grid; grid-template-columns: 1fr; gap: 2rem;
}
@media (min-width:600px)  { .articles-grid { grid-template-columns: repeat(2,1fr); } }
@media (min-width:1024px) { .articles-grid { grid-template-columns: repeat(3,1fr); } }

/* ── ARTICLE CARD ────────────────────────────────────────── */
.article-card {
  background: var(--blanc);
  border-radius: var(--r-lg); overflow: hidden;
  box-shadow: var(--shadow-sm);
  display: flex; flex-direction: column;
  transition: box-shadow var(--t), transform var(--t);
}
.article-card:hover { box-shadow: var(--shadow-md); transform: translateY(-4px); }
.card-img { aspect-ratio: 16/9; overflow: hidden; background: var(--sable); flex-shrink: 0; }
.card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .42s ease; }
.article-card:hover .card-img img { transform: scale(1.06); }
.card-body { padding: 1.25rem 1.5rem 1.5rem; display: flex; flex-direction: column; flex: 1; }
.card-cat {
  display: inline-block; font-size: .75rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .08em;
  color: var(--terracotta); margin-bottom: .625rem;
}
.card-title { font-family: var(--ff-serif); font-size: 1.09375rem; line-height: 1.35; margin-bottom: .75rem; flex: 1; }
.card-title a { color: var(--encre); transition: color var(--t); }
.card-title a:hover { color: var(--teal); }
.card-excerpt { font-size: .875rem; color: #6b6058; line-height: 1.65; margin-bottom: 1rem; }
.card-meta {
  display: flex; align-items: center; justify-content: space-between;
  font-size: .8125rem; color: var(--gris);
  padding-top: .875rem; border-top: 1px solid var(--sable);
  margin-top: auto; flex-wrap: wrap; gap: .375rem;
}
.card-author { display: flex; align-items: center; gap: .375rem; }
.card-avatar {
  width: 1.625rem; height: 1.625rem; border-radius: 50%;
  background: var(--sable); color: var(--terracotta);
  display: flex; align-items: center; justify-content: center;
  font-size: .6875rem; font-weight: 700; flex-shrink: 0;
}

/* ── ARTICLE UNIQUE ──────────────────────────────────────── */
.article-page { padding: 1.5rem 0 5rem; }
.article-layout {
  display: grid; grid-template-columns: 1fr; gap: 3.5rem;
}
@media (min-width:1024px) {
  .article-layout { grid-template-columns: 1fr 18.75rem; }
}

.article-cat-link {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .4375rem 1.125rem;
  background: var(--sable); border-radius: var(--r-pill);
  font-size: .875rem; font-weight: 700; color: var(--teal);
  margin-bottom: 1.125rem;
  transition: background var(--t), color var(--t);
}
.article-cat-link:hover { background: var(--terracotta); color: var(--blanc); }
.article-title {
  font-family: var(--ff-serif);
  font-size: clamp(1.875rem, 5vw, 3rem);
  line-height: 1.18; margin-bottom: 1.125rem;
}
.article-meta-bar {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: .75rem 1.75rem; font-size: .875rem; color: var(--gris);
  padding: 1rem 0; border-top: 1px solid var(--sable);
  border-bottom: 1px solid var(--sable); margin-bottom: 2.25rem;
}
.article-featured { border-radius: var(--r-lg); overflow: hidden; margin-bottom: 2.75rem; aspect-ratio: 16/9; }
.article-featured img { width: 100%; height: 100%; object-fit: cover; }

.article-content { font-size: 1.0625rem; line-height: 1.82; }
.article-content h2 {
  font-family: var(--ff-serif);
  font-size: clamp(1.375rem, 3vw, 1.875rem);
  margin: 2.75rem 0 1.125rem;
}
.article-content h3 {
  font-family: var(--ff-serif);
  font-size: clamp(1.125rem, 2.5vw, 1.5rem);
  margin: 2.25rem 0 .875rem;
}
.article-content p    { margin-bottom: 1.375em; }
.article-content ul, .article-content ol { margin: 1.25rem 0 1.25rem 1.5rem; }
.article-content ul   { list-style: disc; }
.article-content ol   { list-style: decimal; }
.article-content li   { margin-bottom: .5rem; }
.article-content a    { color: var(--teal); text-decoration: underline; text-underline-offset: .25em; }
.article-content a:hover { color: var(--terracotta); }
.article-content img  { border-radius: var(--r-md); margin: 2rem 0; }
.article-content table { margin: 1.5rem 0; border: 1px solid var(--sable); border-radius: var(--r-sm); overflow: hidden; }
.article-content th   { background: var(--sable); padding: .75rem 1rem; font-weight: 700; text-align: left; }
.article-content td   { padding: .625rem 1rem; border-top: 1px solid var(--sable); }

/* Tags */
.article-tags { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 2.5rem; }
.tag {
  display: inline-block; padding: .375rem .9375rem;
  background: var(--sable); border-radius: var(--r-pill);
  font-size: .8125rem; font-weight: 500;
  transition: background var(--t), color var(--t);
}
.tag:hover { background: var(--terracotta); color: var(--blanc); }

/* NexSafar CTA */
.nexsafar-cta {
  background: linear-gradient(135deg, var(--teal) 0%, #1c4a40 100%);
  color: var(--blanc); border-radius: var(--r-lg);
  padding: 2rem 2rem 2rem;
  margin: 3.5rem 0; display: flex;
  flex-direction: column; gap: 1.25rem;
}
.nexsafar-label {
  font-size: .78125rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .1em; opacity: .75;
}
.nexsafar-cta h3 { font-family: var(--ff-serif); font-size: clamp(1.25rem,3vw,1.625rem); color: var(--blanc); margin: 0; }
.nexsafar-cta p  { opacity: .88; font-size: .9375rem; margin: 0; }
.nexsafar-btn {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .8125rem 1.625rem;
  background: var(--terracotta); color: var(--blanc);
  border-radius: var(--r-sm); font-weight: 700; font-size: .9375rem;
  align-self: flex-start;
  transition: background var(--t), transform var(--t);
}
.nexsafar-btn:hover { background: #c09040; transform: translateX(4px); }
@media (min-width:768px) {
  .nexsafar-cta { flex-direction: row; align-items: center; }
  .nexsafar-cta > div:first-child { flex: 1; }
}

/* Sidebar */
.sidebar-widget { background: var(--blanc); border-radius: var(--r-lg); padding: 1.5rem; margin-bottom: 1.5rem; box-shadow: var(--shadow-sm); }
.widget-title { font-family: var(--ff-serif); font-size: 1.125rem; margin-bottom: 1.25rem; padding-bottom: .75rem; border-bottom: 2px solid var(--sable); }
.widget-list li { padding: .625rem 0; border-bottom: 1px solid var(--sable); font-size: .9375rem; }
.widget-list li:last-child { border: none; }
.widget-list a { color: var(--encre); transition: color var(--t); }
.widget-list a:hover { color: var(--teal); }

/* ── CATÉGORIE ────────────────────────────────────────────── */
.cat-header { background: var(--sable); padding: 3rem 0 2.5rem; margin-bottom: 3rem; }
.cat-header h1 { font-family: var(--ff-serif); }
.cat-desc { font-size: 1.0625rem; color: #5c5249; max-width: 60ch; margin-top: .75rem; }

/* ── DESTINATIONS ─────────────────────────────────────────── */
.destinations-page { padding: 2.5rem 0 5rem; }
.destinations-grid {
  display: grid; grid-template-columns: repeat(2,1fr); gap: 1.25rem;
}
@media (min-width:640px)  { .destinations-grid { grid-template-columns: repeat(3,1fr); } }
@media (min-width:1024px) { .destinations-grid { grid-template-columns: repeat(6,1fr); } }

.dest-card {
  background: var(--blanc); border-radius: var(--r-lg);
  padding: 2rem 1rem; text-align: center;
  box-shadow: var(--shadow-sm); display: block; color: var(--encre);
  transition: box-shadow var(--t), transform var(--t);
}
.dest-card:hover { box-shadow: var(--shadow-md); transform: translateY(-4px); }
.dest-flag { font-size: 3rem; margin-bottom: .875rem; }
.dest-name { font-family: var(--ff-serif); font-size: .9375rem; font-weight: 700; }
.dest-count { font-size: .8125rem; color: var(--gris); margin-top: .25rem; }

/* ── RECHERCHE ────────────────────────────────────────────── */
.search-page { padding: 2.5rem 0 5rem; }
.search-hero { margin-bottom: 2.75rem; }
.search-hero h1 { font-family: var(--ff-serif); margin-bottom: 1.25rem; }
.search-bar {
  display: flex; max-width: 48rem;
  border: 2px solid var(--encre); border-radius: var(--r-md);
  overflow: hidden;
}
.search-bar input {
  flex: 1; padding: .9375rem 1.25rem;
  font-size: 1.0625rem; border: none;
  background: var(--blanc); color: var(--encre); outline: none;
}
.search-bar button {
  padding: 0 1.5rem; background: var(--encre); color: var(--creme);
  font-size: .9375rem; font-weight: 700;
  transition: background var(--t);
}
.search-bar button:hover { background: var(--teal); }
.search-count { font-size: .9375rem; color: var(--gris); margin-bottom: 2rem; }
.search-count strong { color: var(--encre); }
.no-results { text-align: center; padding: 4rem 0; color: var(--gris); font-size: 1.0625rem; }

/* ── PAGINATION ───────────────────────────────────────────── */
.pagination { display: flex; justify-content: center; flex-wrap: wrap; gap: .375rem; padding: 3.5rem 0 1rem; }
.page-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 2.625rem; height: 2.625rem; padding: 0 .75rem;
  border-radius: var(--r-sm); font-size: .9375rem; font-weight: 500;
  background: var(--blanc); border: 1px solid var(--sable);
  color: var(--encre); transition: background var(--t), color var(--t), border-color var(--t);
}
.page-btn:hover { background: var(--sable); border-color: var(--sable); }
.page-btn.active { background: var(--teal); color: var(--blanc); border-color: var(--teal); }
.page-btn.disabled { opacity: .4; pointer-events: none; }

/* ── BREADCRUMBS ──────────────────────────────────────────── */
.breadcrumbs { padding: .875rem 0 .5rem; font-size: .875rem; }
.breadcrumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem; }
.breadcrumbs a { color: var(--teal); transition: color var(--t); }
.breadcrumbs a:hover { color: var(--terracotta); }
.breadcrumbs .sep { color: var(--gris); font-size: .75rem; }

/* ── NEWSLETTER SECTION ───────────────────────────────────── */
.newsletter-section { background: var(--encre); color: var(--creme); padding: 5rem 0; text-align: center; }
.newsletter-section h2 { font-family: var(--ff-serif); color: var(--creme); margin-bottom: .875rem; }
.newsletter-section .sub { opacity: .78; font-size: 1.0625rem; margin-bottom: 2.25rem; }
.newsletter-form-wrap { max-width: 30rem; margin: 0 auto; }
.newsletter-form {
  display: flex; border-radius: var(--r-md);
  overflow: hidden; box-shadow: var(--shadow-lg);
}
.newsletter-form input[type=email] {
  flex: 1; padding: 1rem 1.25rem; font-size: 1rem;
  border: none; background: var(--blanc); color: var(--encre); outline: none;
}
.newsletter-form button {
  padding: 0 1.625rem; background: var(--terracotta); color: var(--blanc);
  font-weight: 700; font-size: .9375rem; white-space: nowrap;
  transition: background var(--t);
}
.newsletter-form button:hover { background: #c09040; }
.nl-mention { font-size: .8125rem; opacity: .55; margin-top: 1rem; }

/* ── FOOTER ───────────────────────────────────────────────── */
.site-footer { background: var(--nuit); color: var(--creme); padding: 4.5rem 0 0; }
.footer-grid {
  display: grid; grid-template-columns: 1fr; gap: 2.75rem;
  padding-bottom: 3rem; border-bottom: 1px solid rgba(248,244,238,.1);
}
@media (min-width:640px)  { .footer-grid { grid-template-columns: repeat(2,1fr); } }
@media (min-width:1024px) { .footer-grid { grid-template-columns: 2fr 1fr 1fr 2fr; } }

.footer-logo { display: inline-flex; align-items: center; gap: .625rem; font-family: var(--ff-serif); font-size: 1.25rem; color: var(--creme); margin-bottom: 1.125rem; }
.footer-logo .logo-icon { color: var(--terracotta); }
.footer-tagline { font-size: .9375rem; opacity: .7; line-height: 1.65; margin-bottom: .875rem; }
.footer-partner { font-size: .875rem; opacity: .55; }
.footer-partner a { color: var(--terracotta); }
.footer-partner a:hover { text-decoration: underline; }
.footer-heading { font-family: var(--ff-serif); font-size: .9375rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 1.25rem; }
.footer-nav ul { display: flex; flex-direction: column; gap: .625rem; }
.footer-nav a { font-size: .9375rem; color: rgba(248,244,238,.6); transition: color var(--t); }
.footer-nav a:hover { color: var(--creme); }

.nl-footer { }
.nl-footer p { font-size: .9375rem; opacity: .68; line-height: 1.65; margin-bottom: 1rem; }
.nl-footer-form {
  display: flex; border-radius: var(--r-sm); overflow: hidden; margin-bottom: .75rem;
}
.nl-footer-form input[type=email] {
  flex: 1; padding: .75rem 1rem;
  background: rgba(248,244,238,.07);
  border: 1px solid rgba(248,244,238,.14); border-right: none;
  color: var(--creme); font-size: .9375rem; outline: none;
  border-radius: var(--r-sm) 0 0 var(--r-sm);
}
.nl-footer-form input::placeholder { color: rgba(248,244,238,.38); }
.nl-footer-form button {
  padding: 0 1.125rem; background: var(--terracotta); color: var(--blanc);
  font-weight: 600; font-size: .875rem; white-space: nowrap;
  transition: background var(--t);
  border-radius: 0 var(--r-sm) var(--r-sm) 0;
}
.nl-footer-form button:hover { background: #c09040; }

.footer-bottom { padding: 1.625rem 0; text-align: center; }
.footer-legal { font-size: .875rem; opacity: .45; }

/* ── ALERTES ──────────────────────────────────────────────── */
.alert { padding: 1rem 1.25rem; border-radius: var(--r-md); margin-bottom: 1.25rem; font-size: .9375rem; border-left: 4px solid; }
.alert-success { background: #e8f5e9; border-color: #4caf50; color: #1b5e20; }
.alert-error   { background: #ffebee; border-color: #e53935; color: #b71c1c; }
.alert-info    { background: #e3f2fd; border-color: #1e88e5; color: #0d47a1; }
.alert-warning { background: #fff8e1; border-color: #f9a825; color: #5d4037; }

/* ── READING PROGRESS ─────────────────────────────────────── */
.reading-progress { position: fixed; top: 0; left: 0; width: 0; height: 3px; background: var(--terracotta); z-index: 999; transition: width .12s linear; }

/* ── BACK TO TOP ──────────────────────────────────────────── */
.back-to-top {
  position: fixed; bottom: 1.75rem; right: 1.25rem; z-index: 50;
  width: 3rem; height: 3rem; border-radius: 50%;
  background: var(--encre); color: var(--creme);
  display: flex; align-items: center; justify-content: center;
  box-shadow: var(--shadow-md); font-size: 1.125rem;
  opacity: 0; pointer-events: none;
  transition: opacity var(--t), transform var(--t), background var(--t);
}
.back-to-top.visible { opacity: 1; pointer-events: auto; }
.back-to-top:hover { background: var(--teal); transform: translateY(-3px); }

/* ── PRINT ────────────────────────────────────────────────── */
@media print {
  .site-header, .site-footer, .newsletter-section, .nexsafar-cta,
  .back-to-top, .reading-progress, .search-overlay, .menu-overlay { display: none; }
  body { background: #fff; color: #000; font-size: 12pt; }
  .article-content a::after { content: ' (' attr(href) ')'; font-size: .8em; color: #555; }
}
