/* ===== Polices auto-hébergées (Playfair Display + Nunito, latin + cyrillique) — RGPD : plus de Google Fonts ===== */
@font-face{font-family:'Nunito';font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/nunito-400-cyrillic-ext.woff2") format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
@font-face{font-family:'Nunito';font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/nunito-400-cyrillic.woff2") format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'Nunito';font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/nunito-400-latin-ext.woff2") format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Nunito';font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/nunito-400-latin.woff2") format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Nunito';font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/nunito-600-cyrillic-ext.woff2") format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
@font-face{font-family:'Nunito';font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/nunito-600-cyrillic.woff2") format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'Nunito';font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/nunito-600-latin-ext.woff2") format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Nunito';font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/nunito-600-latin.woff2") format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Nunito';font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/nunito-700-cyrillic-ext.woff2") format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
@font-face{font-family:'Nunito';font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/nunito-700-cyrillic.woff2") format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'Nunito';font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/nunito-700-latin-ext.woff2") format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Nunito';font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/nunito-700-latin.woff2") format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Nunito';font-style:normal;font-weight:800;font-display:swap;src:url("../fonts/nunito-800-cyrillic-ext.woff2") format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
@font-face{font-family:'Nunito';font-style:normal;font-weight:800;font-display:swap;src:url("../fonts/nunito-800-cyrillic.woff2") format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'Nunito';font-style:normal;font-weight:800;font-display:swap;src:url("../fonts/nunito-800-latin-ext.woff2") format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Nunito';font-style:normal;font-weight:800;font-display:swap;src:url("../fonts/nunito-800-latin.woff2") format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/playfair-display-700-cyrillic.woff2") format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/playfair-display-700-latin-ext.woff2") format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/playfair-display-700-latin.woff2") format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:800;font-display:swap;src:url("../fonts/playfair-display-800-cyrillic.woff2") format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:800;font-display:swap;src:url("../fonts/playfair-display-800-latin-ext.woff2") format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:800;font-display:swap;src:url("../fonts/playfair-display-800-latin.woff2") format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:900;font-display:swap;src:url("../fonts/playfair-display-900-cyrillic.woff2") format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:900;font-display:swap;src:url("../fonts/playfair-display-900-latin-ext.woff2") format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:900;font-display:swap;src:url("../fonts/playfair-display-900-latin.woff2") format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

/* =========================================================================
   APC France — Option G « Style Meta »
   Design inspiré du langage visuel de Meta.com (grands titres gras, beaucoup
   de blanc, bleu, boutons pilule, hero immersif). Contenu = Option F.
   Marque APC conservée (logo, nom, contenu). Aucune ressource propriétaire Meta.
   ========================================================================= */

:root {
  --radius: 18px;
  --radius-sm: 12px;

  --background: #ffffff;
  --foreground: #1c2b33;         /* slate sombre */
  --ink-strong: #0a1620;
  --card: #ffffff;
  --primary: #0064e0;            /* bleu type Meta */
  --primary-dark: #0a4bb3;
  --primary-foreground: #ffffff;
  --primary-soft: #e7f0ff;
  --secondary: #f5f6f7;          /* sections gris clair */
  --muted: #f0f2f4;
  --muted-foreground: #5a6b78;
  --accent-red: #e11d2f;         /* rouge APC pour le CTA Adhérer */
  --accent-red-dark: #b81625;
  --border: #dfe3e6;
  --input: #cfd6db;
  --ring: #0064e0;

  --shadow-card: 0 1px 2px rgba(16,24,32,.05), 0 16px 40px -22px rgba(16,24,32,.22);
  --shadow-lg: 0 24px 60px -18px rgba(16,24,32,.30);

  --font-sans: "Nunito", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-head: "Playfair Display", Georgia, "Times New Roman", serif;
}

/* ----------------------------------------------------------------- Reset */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { font-family: var(--font-sans); scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  min-height: 100vh; background: var(--background); color: var(--foreground);
  font-family: var(--font-sans); font-size: 1.0625rem; line-height: 1.55;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
h1, h2, h3, h4 { font-family: var(--font-head); letter-spacing: -0.01em; line-height: 1.14; font-weight: 800; color: var(--ink-strong); }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button { font-family: inherit; cursor: pointer; }
ul { list-style: none; padding: 0; }

/* Bilingue */
[data-lang="fr"] .lang-ru, [data-lang="ru"] .lang-fr { display: none !important; }

/* --------------------------------------------------------------- Layout */
.container { width: 100%; max-width: 78rem; margin-inline: auto; padding-inline: 1.5rem; }
.site-wrap { display: flex; min-height: 100vh; flex-direction: column; overflow-wrap: break-word; }
main { flex: 1 1 auto; }

/* ---------------------------------------------------------------- Header */
.header {
  position: sticky; top: 0; z-index: 50; width: 100%;
  background: rgba(255,255,255,0.85); backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--border);
}
.header__inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-block: 0.85rem; }
.brand { display: flex; align-items: center; gap: 0.6rem; flex-shrink: 0; }
.brand__mark { display: grid; place-items: center; height: 2.5rem; width: 2.5rem; }
.brand__mark--img { background: transparent; }
.brand__mark--img img { height: 2.5rem; width: auto; display: block; }
.footer__brand .brand__mark--img img { height: 2.75rem; }
.brand__text { display: flex; flex-direction: column; line-height: 1.1; }
.brand__name { font-size: 1.05rem; font-weight: 800; letter-spacing: -0.02em; color: var(--ink-strong); }
.brand__sub { font-size: 0.7rem; color: var(--muted-foreground); display: none; }

.nav { display: none; align-items: center; gap: 1.3rem; }
.nav a { font-size: 0.98rem; font-weight: 600; color: var(--foreground); transition: color .15s ease; }
.nav a:hover, .nav a.is-active { color: var(--primary); }

.header__actions { display: flex; align-items: center; gap: 0.75rem; }

/* Sélecteur de langue */
.langswitch { display: inline-flex; align-items: center; border: 1px solid var(--border); background: #fff; border-radius: 9999px; padding: 0.15rem; font-size: 0.78rem; font-weight: 700; }
.langswitch button { border: 0; background: transparent; padding: 0.3rem 0.7rem; border-radius: 9999px; color: var(--muted-foreground); transition: background .15s, color .15s; }
.langswitch button.is-active { background: var(--primary); color: #fff; }

.menu-toggle { display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--border); border-radius: 9999px; padding: 0.55rem; background: #fff; color: var(--foreground); }
.menu-toggle svg { height: 1.25rem; width: 1.25rem; }
.menu-toggle .icon-close { display: none; }
.menu-toggle.is-open .icon-open { display: none; }
.menu-toggle.is-open .icon-close { display: block; }

.mobile-nav { display: none; border-top: 1px solid var(--border); background: #fff; }
.mobile-nav.is-open { display: block; }
.mobile-nav nav { display: flex; flex-direction: column; padding-block: 0.75rem; }
.mobile-nav nav a { padding-block: 0.7rem; font-size: 1.05rem; font-weight: 600; }
.mobile-nav nav a.is-active { color: var(--primary); }

/* --------------------------------------------------------------- Boutons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  border-radius: 9999px; font-size: 1rem; font-weight: 700; padding: 0.7rem 1.4rem;
  transition: background .18s ease, transform .18s ease, box-shadow .18s ease, border-color .18s ease, color .18s ease;
  white-space: nowrap; border: 1.5px solid transparent;
}
.btn svg { height: 1.1rem; width: 1.1rem; }
.btn--red { background: var(--accent-red); color: #fff; }
.btn--red:hover { background: var(--accent-red-dark); transform: translateY(-1px); }
.btn--red-lg { padding: 0.9rem 1.8rem; font-size: 1.05rem; }
.btn--outline { border-color: var(--ink-strong); background: transparent; color: var(--ink-strong); }
.btn--outline:hover { background: var(--ink-strong); color: #fff; }
.btn--primary { background: var(--primary); color: #fff; padding: 0.75rem 1.4rem; }
.btn--primary:hover { background: var(--primary-dark); }
.header__actions .btn--red { display: none; padding: 0.55rem 1.2rem; font-size: 0.95rem; }

/* ------------------------------------------------------- Hero immersif */
.hero--video { position: relative; overflow: hidden; background: #0a1620; }
.hero__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.hero__scrim { position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    linear-gradient(to top, rgba(6,12,20,.88) 0%, rgba(6,12,20,.5) 34%, rgba(6,12,20,.15) 62%, rgba(6,12,20,.30) 100%),
    linear-gradient(105deg, rgba(6,12,20,.55), transparent 55%);
}
.hero__inner { position: relative; z-index: 2; display: flex; align-items: flex-end; min-height: 84vh; padding-block: 5rem 4rem; }
.hero__content { max-width: 50rem; color: #fff; }
.badge { display: inline-flex; align-items: center; gap: 0.55rem; border: 1px solid rgba(255,255,255,.35); background: rgba(255,255,255,.1); backdrop-filter: blur(6px); border-radius: 9999px; padding: 0.4rem 0.95rem; font-size: 0.8rem; font-weight: 600; color: #fff; }
.badge__dot { height: 0.45rem; width: 0.45rem; border-radius: 9999px; background: #4d97ff; }
.hero h1 { margin-top: 1.5rem; color: #fff; font-size: clamp(1.6rem, 7vw, 5.25rem); font-weight: 900; letter-spacing: -0.015em; line-height: 1.06; overflow-wrap: break-word; hyphens: none; }
[data-lang="ru"] .hero h1 { font-size: clamp(1.6rem, 7vw, 4.8rem); } /* mot russe le plus long tient sur une ligne (seuil 81px) */
.hero__lead { margin-top: 1.5rem; max-width: 40rem; font-size: clamp(1.1rem, 1.6vw, 1.4rem); line-height: 1.5; color: rgba(255,255,255,.92); font-weight: 400; }
.hero__cta { margin-top: 2.25rem; display: flex; flex-wrap: wrap; gap: 0.85rem; }
.hero__cta .btn--outline { border-color: rgba(255,255,255,.6); color: #fff; }
.hero__cta .btn--outline:hover { background: #fff; color: var(--ink-strong); border-color: #fff; }

/* Média de secours (non utilisé sur l'accueil vidéo, gardé par sécurité) */
.hero__img { width: 100%; border-radius: var(--radius); }
.placeholder { aspect-ratio: 4/3; border-radius: var(--radius); background: var(--muted); display: grid; place-items: center; }

/* --------------------------------------------------------------- Sections */
.section { padding-block: 5.5rem; }
.section__title { font-size: clamp(2rem, 3.5vw, 3rem); font-weight: 800; letter-spacing: -0.012em; }
.eyebrow { margin-top: 0.75rem; display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.9rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--primary); }

/* Cartes mission */
.grid-3 { margin-top: 3rem; display: grid; gap: 1.5rem; }
.card { border: 1px solid var(--border); background: var(--card); border-radius: var(--radius); padding: 2rem; transition: transform .2s ease, box-shadow .2s ease; }
.card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.card__num { display: grid; place-items: center; height: 3rem; width: 3rem; border-radius: 9999px; background: var(--primary-soft); color: var(--primary); font-weight: 800; font-size: 1.15rem; }
.card__text { margin-top: 1.25rem; font-size: 1.05rem; line-height: 1.55; color: var(--foreground); }

/* 4 blocs de navigation */
.grid-4 { display: grid; gap: 1.5rem; }
.grid-5 { display: grid; gap: 1.5rem; }
.navblock { position: relative; overflow: hidden; height: 100%; min-height: 16rem; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid var(--border); background: var(--card); border-radius: var(--radius); padding: 1.85rem; transition: transform .2s ease, box-shadow .2s ease; }
.navblock:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.navblock__icon { height: 2rem; width: 2rem; color: var(--primary); }
.navblock__row { margin-top: 2.5rem; display: flex; align-items: center; justify-content: space-between; }
.navblock__label { font-size: 1.25rem; font-weight: 800; letter-spacing: -0.02em; color: var(--ink-strong); }
.navblock__arrow { height: 1.35rem; width: 1.35rem; color: var(--primary); transition: transform .2s ease; }
.navblock:hover .navblock__arrow { transform: translateX(4px); }

/* Cadres en image plein cadre (style Meta Quest). La photo est définie par carte via --card-photo. */
.navblock--image {
  border: 0; color: #fff; justify-content: flex-end;
  background-size: cover; background-position: center;
  background-image:
    linear-gradient(180deg, rgba(8,16,26,0) 28%, rgba(8,16,26,.35) 56%, rgba(8,16,26,.84) 100%),
    var(--card-photo);
}
.navblock--projets { --card-photo: url("../img/proj-fusee.jpg"); background-position: center top; }
.navblock--ressources { --card-photo: url("../img/res-bg.jpg"); }
.navblock--scolarite { --card-photo: url("../img/res-scolarite.jpg"); }
.navblock--apropos { --card-photo: url("../img/about-bg.jpg"); }
.navblock--actualites { --card-photo: url("../img/actu-bg.jpg"); }
/* À propos = bandeau pleine largeur sous les 4 dalles */
.navblock-wide { grid-column: 1 / -1; }
/* dalles de nav : toujours visibles/alignées (pas de reveal capricieux) */
.grid-4 > .navblock-link.reveal { opacity: 1; transform: none; }
.navblock--image .navblock__icon { display: none; }
.navblock--image .navblock__row { margin-top: 0; }
.navblock--image .navblock__label { color: #fff; font-size: 1.7rem; }
.navblock--image .navblock__arrow { color: #fff; }
.navblock--image:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }

/* Chiffres clés */
.stats { background: var(--secondary); }
.stats__inner { padding-block: 5rem; }
.stats__title { text-align: center; font-size: 0.9rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted-foreground); }
.stats__grid { margin-top: 2.5rem; display: grid; gap: 2rem; }
.stat { text-align: center; }
.stat__value { font-size: clamp(2.75rem, 5vw, 4rem); font-weight: 900; letter-spacing: -0.04em; color: var(--primary); line-height: 1; }
.stat__label { margin-top: 0.6rem; font-size: 1rem; color: var(--muted-foreground); font-weight: 500; }

/* --------------------------------------------------------------- Footer */
.footer { margin-top: 0; border-top: 1px solid var(--border); background: var(--secondary); }
.footer__grid { display: grid; gap: 2.5rem; padding-block: 4rem; }
.footer__brand { display: flex; align-items: center; gap: 0.6rem; }
.footer__brand-name { font-size: 1.05rem; font-weight: 800; letter-spacing: -0.02em; }
.footer__desc { margin-top: 1rem; font-size: 0.9rem; color: var(--muted-foreground); }
.footer__col-title { margin-bottom: 0.85rem; font-weight: 700; color: var(--ink-strong); font-size: 0.95rem; }
.footer__col { font-size: 0.95rem; }
.footer__col ul { display: flex; flex-direction: column; gap: 0.5rem; color: var(--muted-foreground); }
.footer__col a { color: var(--muted-foreground); transition: color .15s ease; }
.footer__col a:hover { color: var(--primary); }
.footer__bar { border-top: 1px solid var(--border); padding-block: 1.5rem; }
.footer__bar p { font-size: 0.85rem; color: var(--muted-foreground); }

/* ========================================================= Responsive */
@media (min-width: 640px) {
  .brand__sub { display: block; }
  .stats__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 768px) {
  .header__actions .btn--red { display: inline-flex; }
  .grid-3 { grid-template-columns: repeat(3, 1fr); }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .navblock-wide .navblock { min-height: 9rem; }
  .footer__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1200px) {
  .nav { display: flex; }
  .menu-toggle { display: none; }
}
@media (min-width: 1024px) {
  .grid-4 { grid-template-columns: repeat(4, 1fr); }
  .stats__grid { grid-template-columns: repeat(4, 1fr); }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }

/* ==================================================================
   PAGES INTERNES
   ================================================================== */
.page-head { border-bottom: 1px solid var(--border); background: var(--secondary); }
.page-head__inner { padding-block: 5rem; }
.page-head__eyebrow { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.9rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--primary); }
.page-head h1 { margin-top: 1rem; font-size: clamp(2.1rem, 5vw, 3.75rem); font-weight: 900; letter-spacing: -0.015em; overflow-wrap: break-word; }
.page-head__lead { margin-top: 1.25rem; max-width: 46rem; font-size: 1.2rem; line-height: 1.55; color: var(--muted-foreground); }

.grid-2 { display: grid; gap: 2rem; }
.grid-news { display: grid; gap: 2rem; }

.card-media { position: relative; width: 100%; aspect-ratio: 16/9; background: var(--muted); overflow: hidden; }
.card-media img { width: 100%; height: 100%; object-fit: contain; padding: 1rem; transition: transform .4s ease; }
.card-media--cover img { object-fit: cover; padding: 0; }
.ph-brand { display: grid; place-items: center; background: linear-gradient(135deg, var(--primary-soft), #fff); }
.ph-brand img { width: 34%; height: auto; opacity: 0.5; padding: 0; object-fit: contain; }

/* Cartes projet / actualité / ressource */
.pcard, .ncard, .rcard { display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--border); background: var(--card); border-radius: var(--radius); transition: transform .2s ease, box-shadow .2s ease; }
.pcard:hover, .ncard:hover, .rcard:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.pcard:hover .card-media img, .ncard:hover .card-media img { transform: scale(1.05); }
.pcard__body { display: flex; flex: 1 1 auto; flex-direction: column; padding: 1.75rem; }
.pcard__title { font-size: 1.5rem; font-weight: 800; letter-spacing: -0.02em; }
.pcard__subtitle { margin-top: 0.4rem; font-size: 0.95rem; font-weight: 600; color: var(--primary); }
.pcard__text { margin-top: 1.1rem; display: flex; flex-direction: column; gap: 0.6rem; font-size: 1rem; line-height: 1.55; color: var(--muted-foreground); }
.pcard__reviews { margin-top: 1.5rem; display: flex; flex-direction: column; gap: 0.85rem; border-top: 1px solid var(--border); padding-top: 1.25rem; }
.pcard__reviews-label { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted-foreground); }
.review { border-radius: var(--radius-sm); background: var(--secondary); padding: 1rem 1.15rem; font-size: 0.98rem; }
.review p { font-style: italic; color: var(--foreground); }
.review footer { margin-top: 0.4rem; font-size: 0.85rem; color: var(--muted-foreground); }

.rcard { padding: 2rem; }
.rcard__head { display: flex; align-items: center; gap: 1rem; }
.rcard__icon { display: grid; place-items: center; height: 3.25rem; width: 3.25rem; border-radius: 9999px; background: var(--primary-soft); color: var(--primary); flex-shrink: 0; }
.rcard__icon svg { height: 1.5rem; width: 1.5rem; }
.rcard__title { font-size: 1.35rem; font-weight: 800; letter-spacing: -0.02em; }
.rcard__subtitle { font-size: 0.85rem; font-weight: 600; color: var(--muted-foreground); }
.rcard__list { margin-top: 1.5rem; display: flex; flex-direction: column; gap: 0.7rem; font-size: 1rem; color: var(--foreground); }
.rcard__list li { display: flex; gap: 0.65rem; align-items: baseline; }
.rcard__list li::before { content: ""; margin-top: 0.55rem; height: 0.4rem; width: 0.4rem; flex-shrink: 0; border-radius: 9999px; background: var(--primary); }
.rcard__list a.rlink { color: inherit; text-decoration: none; transition: color .15s ease; }
.rcard__list a.rlink:hover { color: var(--primary); text-decoration: underline; text-underline-offset: 3px; }
.rcard__list a.rlink::after { content: "\2197"; margin-left: 0.3rem; font-size: 0.85em; opacity: 0; transition: opacity .15s ease; color: var(--primary); }
.rcard__list a.rlink:hover::after { opacity: 1; }

.ncard__body { display: flex; flex: 1 1 auto; flex-direction: column; padding: 1.5rem; }
.ncard__eyebrow { font-size: 0.8rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted-foreground); }
.ncard__title { margin-top: 0.6rem; font-size: 1.3rem; font-weight: 800; letter-spacing: -0.02em; line-height: 1.2; color: var(--ink-strong); }
.ncard:hover .ncard__title { color: var(--primary); }
a.ncard { text-decoration: none; color: inherit; cursor: pointer; }
.ncard__date { margin-top: 0.55rem; display: flex; align-items: center; gap: 0.4rem; font-size: 0.9rem; font-weight: 700; color: var(--primary); }
.ncard__date-icon { flex: none; }
.article-hero { margin: 0 0 1.5rem; }
.article-hero img { width: 100%; height: auto; border-radius: var(--radius); display: block; }
.article-hero figcaption { margin-top: 0.5rem; font-size: 0.85rem; color: var(--muted-foreground); font-style: italic; }

/* Bandeau "À la une" intégré au header — style éditorial, fond blanc */
.ticker { background: #fff; border-top: 1px solid var(--border); }
.ticker__inner { display: flex; align-items: center; gap: 0.8rem; min-height: 44px; padding-block: 0.3rem; }
.ticker__badge { flex: none; display: inline-flex; align-items: center; gap: 0.4rem; background: var(--accent-red); color: #fff; font-size: 0.76rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.05em; padding: 0.32rem 0.7rem; border-radius: 9999px; text-decoration: none; white-space: nowrap; transition: background .15s ease; }
.ticker__badge:hover { background: var(--accent-red-dark); }
.ticker__badge-icon { width: 15px; height: 15px; flex: none; }
.ticker__track { position: relative; flex: 1 1 auto; min-width: 0; height: 1.75em; }
.ticker__item { position: absolute; inset: 0; display: flex; align-items: center; gap: 0.7rem; opacity: 0; visibility: hidden; transform: translateY(4px); transition: opacity .5s ease, transform .5s ease, visibility 0s linear .5s; text-decoration: none; }
.ticker__item.is-active { opacity: 1; visibility: visible; transform: none; transition: opacity .5s ease, transform .5s ease, visibility 0s; }
.ticker__text { min-width: 0; flex: 0 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--primary); font-weight: 700; font-size: 1.05rem; line-height: 1.3; }
.ticker__item:hover .ticker__text { text-decoration: underline; text-underline-offset: 3px; }
.ticker__cta { flex: none; display: inline-flex; align-items: center; gap: 0.25rem; background: transparent; color: var(--primary); font-size: 0.85rem; font-weight: 800; padding: 0; white-space: nowrap; transition: color .15s ease; }
.ticker__item:hover .ticker__cta { color: var(--primary-dark); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 768px) {
  .ticker__inner { gap: 0.5rem; min-height: 42px; }
  .ticker__badge { padding: 0.32rem; }
  .ticker__badge .lang-fr, .ticker__badge .lang-ru { display: none; }
  .ticker__text { font-size: 0.95rem; }
  .ticker__cta { display: inline-flex; background: transparent; padding: 0; }
  .ticker__cta-txt { display: none; }
  .ticker__cta-arrow { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--primary-soft); color: var(--primary); font-size: 0.82rem; line-height: 1; flex: none; }
}
@media (prefers-reduced-motion: reduce) {
  .ticker__item { transition: none; transform: none; }
}

/* Contact */
.contact-grid { display: grid; gap: 2.5rem; }
.contact-card { border: 1px solid var(--border); background: var(--card); border-radius: var(--radius); padding: 2rem; }
.contact-card h2 { font-size: 1.6rem; font-weight: 800; letter-spacing: -0.02em; }
.form { margin-top: 1.75rem; display: flex; flex-direction: column; gap: 1.1rem; }
.field { display: flex; flex-direction: column; gap: 0.5rem; }
.field label { font-size: 0.95rem; font-weight: 600; }
.field input, .field textarea { width: 100%; border: 1.5px solid var(--input); background: #fff; border-radius: var(--radius-sm); padding: 0.8rem 1rem; font-size: 1rem; font-family: inherit; color: var(--foreground); outline: none; transition: border-color .15s, box-shadow .15s; }
.field input:focus, .field textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 4px rgba(0,100,224,.15); }
.field textarea { resize: vertical; min-height: 9rem; }
.form__note { font-size: 0.95rem; color: var(--primary); font-weight: 600; }
.channels { display: flex; flex-direction: column; gap: 1.1rem; }
.channel { display: flex; align-items: flex-start; gap: 1rem; border: 1px solid var(--border); background: var(--card); border-radius: var(--radius); padding: 1.5rem; transition: transform .2s ease, box-shadow .2s ease; }
.channel:hover { transform: translateY(-2px); box-shadow: var(--shadow-card); }
.channel__icon { display: grid; place-items: center; height: 3rem; width: 3rem; border-radius: 9999px; background: var(--primary-soft); color: var(--primary); flex-shrink: 0; }
.channel__icon svg { height: 1.4rem; width: 1.4rem; }
.channel__title { font-size: 1.05rem; font-weight: 800; }
.channel__sub { font-size: 0.95rem; color: var(--muted-foreground); }

/* Article (pages ressources reproduites) */
.res-back { display: inline-block; margin-bottom: 1.5rem; font-size: 1rem; font-weight: 700; color: var(--primary); }
.res-back:hover { text-decoration: underline; }
.article { max-width: 48rem; font-size: 1.1rem; line-height: 1.7; color: var(--foreground); }
.article h2 { margin: 2.5rem 0 1rem; font-size: 1.75rem; font-weight: 800; letter-spacing: -0.02em; }
.article h3 { margin: 1.75rem 0 0.65rem; font-size: 1.3rem; font-weight: 700; }
.article p { margin: 0 0 1.15rem; }
.article ul, .article ol { margin: 0 0 1.15rem; padding-left: 1.5rem; list-style: disc; }
.article ol { list-style: decimal; }
.article li { margin: 0.4rem 0; }
.article a { color: var(--primary); text-decoration: underline; text-underline-offset: 2px; font-weight: 600; }
.article a:hover { color: var(--primary-dark); }
.article img { max-width: 100%; height: auto; border-radius: var(--radius); margin: 1.5rem 0; }
.article blockquote { margin: 1.5rem 0; padding: 1rem 1.35rem; border-left: 4px solid var(--primary); background: var(--secondary); border-radius: var(--radius-sm); }
.article strong { font-weight: 700; color: var(--ink-strong); }
.article table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; font-size: 1rem; }
.article th, .article td { border: 1px solid var(--border); padding: 0.65rem 0.85rem; text-align: left; }
.article th { background: var(--secondary); font-weight: 700; }

/* --------------------------------------------------------- Dynamisme */
@keyframes fFadeUp { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
.hero .badge, .hero h1, .hero__lead, .hero__cta { animation: fFadeUp .7s cubic-bezier(.2,.7,.2,1) both; }
.hero h1 { animation-delay: .06s; }
.hero__lead { animation-delay: .14s; }
.hero__cta { animation-delay: .22s; }
.reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .hero .badge, .hero h1, .hero__lead, .hero__cta { animation: none; }
  .reveal { opacity: 1 !important; transform: none !important; }
}

/* ===================================================== Cookies (RGPD) */
.cc-banner { position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 100; margin-inline: auto; max-width: 64rem;
  display: flex; flex-wrap: wrap; align-items: center; gap: 0.9rem 1.5rem;
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-lg); padding: 1.25rem 1.5rem; }
.cc-banner__text { flex: 1 1 22rem; font-size: 0.95rem; line-height: 1.55; color: var(--foreground); }
.cc-banner__text strong { display: block; font-size: 1.05rem; margin-bottom: 0.3rem; }
.cc-link { color: var(--primary); text-decoration: underline; text-underline-offset: 2px; font-weight: 600; }
.cc-link:hover { color: var(--primary-dark); }
.cc-banner__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem; }
.cc-textbtn { background: none; border: 0; font: inherit; font-weight: 700; color: var(--primary); cursor: pointer; padding: 0.6rem 0.7rem; }
.cc-textbtn:hover { text-decoration: underline; }

.cc-modal { position: fixed; inset: 0; z-index: 110; display: grid; place-items: center; padding: 1rem; background: rgba(10,22,32,.55); backdrop-filter: blur(4px); }
.cc-modal[hidden] { display: none; }
.cc-modal__box { width: 100%; max-width: 36rem; max-height: 90vh; overflow-y: auto; background: #fff; border-radius: var(--radius); box-shadow: var(--shadow-lg); padding: 2rem; }
.cc-modal__box h2 { font-size: 1.6rem; font-weight: 800; }
.cc-modal__intro { margin: 0.6rem 0 1.5rem; font-size: 0.98rem; color: var(--muted-foreground); line-height: 1.6; }
.cc-cat { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 1.15rem; margin-bottom: 1rem; }
.cc-cat__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.cc-cat__head strong { font-size: 1.05rem; }
.cc-cat p { margin-top: 0.45rem; font-size: 0.9rem; color: var(--muted-foreground); line-height: 1.5; }
.cc-badge { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--primary); background: var(--primary-soft); padding: 0.3rem 0.6rem; border-radius: 9999px; white-space: nowrap; }
.cc-modal__actions { display: flex; flex-wrap: wrap; gap: 0.6rem; margin-top: 1.5rem; }
.cc-modal__actions .btn { flex: 1 1 8rem; }

.cc-switch { position: relative; display: inline-block; width: 2.8rem; height: 1.6rem; flex-shrink: 0; }
.cc-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.cc-switch span { position: absolute; inset: 0; background: var(--input); border-radius: 9999px; transition: background .2s ease; cursor: pointer; }
.cc-switch span::before { content: ""; position: absolute; height: 1.2rem; width: 1.2rem; left: 0.2rem; top: 0.2rem; background: #fff; border-radius: 50%; transition: transform .2s ease; box-shadow: 0 1px 3px rgba(0,0,0,.25); }
.cc-switch input:checked + span { background: var(--primary); }
.cc-switch input:checked + span::before { transform: translateX(1.2rem); }
.cc-switch input:disabled + span { opacity: 0.55; cursor: not-allowed; }

.cc-manage { background: none; border: 0; font: inherit; color: var(--muted-foreground); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; padding: 0; }
.cc-manage:hover { color: var(--primary); }

@media (max-width: 640px) {
  .cc-banner { left: 0.5rem; right: 0.5rem; bottom: 0.5rem; padding: 1.15rem; }
  .cc-banner__actions { width: 100%; }
  .cc-banner__actions .btn, .cc-banner__actions .cc-textbtn { flex: 1 1 auto; justify-content: center; }
}

/* Média internes : cadrage cover par défaut plus adapté au style Meta */
@media (min-width: 768px) {
  .contact-grid { grid-template-columns: 3fr 2fr; align-items: start; }
  .grid-2 { grid-template-columns: repeat(2, 1fr); }
  .grid-news { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
  .grid-news { grid-template-columns: repeat(3, 1fr); }
}

/* ============================================================
   Recherche sur le site (loupe header + overlay)
   ============================================================ */
.search-toggle { display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--border); border-radius: 9999px; padding: 0.55rem; background: #fff; color: var(--foreground); cursor: pointer; transition: color .15s ease, border-color .15s ease; }
.search-toggle:hover { color: var(--primary); border-color: var(--primary); }
.search-toggle svg { height: 1.25rem; width: 1.25rem; }
.search-ov { position: fixed; inset: 0; z-index: 100; background: rgba(8,16,26,.55); backdrop-filter: blur(3px); display: flex; align-items: flex-start; justify-content: center; padding: 11vh 1rem 2rem; }
.search-ov[hidden] { display: none; }
body.search-open { overflow: hidden; }
.search-box { width: 100%; max-width: 42rem; background: #fff; border-radius: var(--radius); box-shadow: var(--shadow-lg); overflow: hidden; display: flex; flex-direction: column; max-height: 78vh; animation: search-in .18s ease; }
@keyframes search-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
.search-field { display: flex; align-items: center; gap: 0.6rem; padding: 0.85rem 1rem; border-bottom: 1px solid var(--border); }
.search-field__icon { height: 1.25rem; width: 1.25rem; color: var(--muted-foreground); flex-shrink: 0; }
.search-input { flex: 1 1 auto; min-width: 0; border: 0; outline: none; background: transparent; font-family: var(--font-sans); font-size: 1.1rem; color: var(--ink-strong); padding: 0.2rem 0; }
.search-close { flex-shrink: 0; border: 0; background: var(--muted); color: var(--muted-foreground); height: 1.9rem; width: 1.9rem; border-radius: 9999px; cursor: pointer; font-size: 0.85rem; display: inline-flex; align-items: center; justify-content: center; }
.search-close:hover { background: var(--border); color: var(--ink-strong); }
.search-results { overflow-y: auto; }
.search-hint, .search-empty { padding: 1.1rem 1.15rem; font-size: 0.95rem; color: var(--muted-foreground); }
.search-result { display: block; padding: 0.85rem 1.15rem; border-bottom: 1px solid var(--border); text-decoration: none; }
.search-result:last-child { border-bottom: 0; }
.search-result.is-sel, .search-result:hover { background: var(--primary-soft); }
.search-result__sec { display: block; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--primary); }
.search-result__title { display: block; margin-top: 0.12rem; font-family: var(--font-head); font-weight: 800; font-size: 1.1rem; color: var(--ink-strong); }
.search-result__snip { display: block; margin-top: 0.2rem; font-size: 0.9rem; line-height: 1.5; color: var(--muted-foreground); }
.search-result__snip mark { background: #fff3b0; color: inherit; padding: 0 .12em; border-radius: 3px; }

/* Ligne « Dernière mise à jour » (entre le contenu et le footer) */
.last-update { text-align: center; padding: 1.75rem 1rem 0.35rem; font-size: 0.83rem; color: var(--muted-foreground); }

/* Carte Fonds audio — clin d'œil lion 🦁 (icône emoji) */
.rcard--audio .rcard__icon { font-size: 1.75rem; line-height: 1; }

/* Carte « Le russe en famille » — bandeau immersif (matriochkas) */
.rcard--famille { padding: 0; }
.rcard--famille .rcard__head { min-height: 172px; padding: 1.5rem; align-items: flex-end; background-image: linear-gradient(180deg, rgba(8,16,26,0) 26%, rgba(8,16,26,.4) 60%, rgba(8,16,26,.85) 100%), url("../img/res-famille-bg.jpg"); background-size: cover; background-position: center; }
.rcard--famille .rcard__icon { display: none; }
.rcard--famille .rcard__title { color: #fff; }
.rcard--famille .rcard__subtitle { color: rgba(255,255,255,.9); }
.rcard--famille .rcard__list { padding: 1.25rem 2rem 2rem; margin-top: 0; }
.rcard--famille.rcard--francais .rcard__head { background-image: linear-gradient(180deg, rgba(8,16,26,0) 26%, rgba(8,16,26,.4) 60%, rgba(8,16,26,.85) 100%), url("../img/res-francais-bg.webp"); }
/* Carte "Le russe en France" — bannière photo (comme les cartes famille) */
.rcard--famille.rcard--russie .rcard__head { background-image: linear-gradient(180deg, rgba(8,16,26,0) 26%, rgba(8,16,26,.4) 60%, rgba(8,16,26,.85) 100%), url("../img/res-russie.jpg?v=4"); background-position: center 40%; }
/* Page Adhésion */
.adh { max-width: 44rem; margin: 0 auto; }
.adh-benefits { list-style: none; margin: 0 0 2rem; padding: 0; display: flex; flex-direction: column; gap: 0.85rem; }
.adh-benefits li { position: relative; padding-left: 2.4rem; font-size: 1.05rem; line-height: 1.55; color: var(--ink-strong); }
.adh-benefits li::before { content: "\2713"; position: absolute; left: 0; top: 0.05rem; display: grid; place-items: center; width: 1.65rem; height: 1.65rem; border-radius: 9999px; background: var(--primary-soft); color: var(--primary); font-weight: 800; font-size: 0.9rem; }
.adh-charte { font-size: 1rem; color: var(--muted-foreground); }
.adh-charte a { color: var(--primary); font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
.adh-cta { margin-top: 2rem; padding: 1.75rem 2rem; background: var(--primary-soft); border: 1px solid #cfe0ff; border-radius: var(--radius); text-align: center; }
.adh-cta p { margin: 0 0 1rem; font-size: 1.05rem; font-weight: 700; color: var(--ink-strong); }
.adh-cta .btn { margin: 0; }
@media (min-width: 768px) {
  .page-adhesion .page-head__inner { padding-block: 2rem; }
  .page-adhesion .page-head h1 { font-size: 2.5rem; margin-top: 0.4rem; }
  .page-adhesion .page-head__lead { margin-top: 0.7rem; font-size: 1.08rem; }
  .page-adhesion .section { padding-block: 2rem 2.5rem; }
  .page-adhesion .adh { max-width: 50rem; }
  .page-adhesion .adh-benefits { display: grid; grid-template-columns: 1fr 1fr; gap: 0.55rem 2.5rem; margin-bottom: 1.1rem; }
  .page-adhesion .adh-charte { margin: 0.4rem 0 0; }
  .page-adhesion .adh-cta { margin-top: 1.25rem; padding: 1.4rem 2rem; }
}
.page-ressources .section { padding-block: 3rem; }

/* Bouton d'inscription (stages) */
a.res-cta{display:inline-flex;align-items:center;gap:.4rem;margin-top:.2rem;background:var(--primary);color:#fff;font-weight:700;text-decoration:none;padding:.55rem 1.15rem;border-radius:9999px;transition:background .15s ease,transform .15s ease;}
a.res-cta:hover{background:var(--primary-dark);color:#fff;transform:translateY(-1px);}


/* ---- Timeline des évènements (au-dessus des actualités) ---- */
.timeline { margin: 0 0 2rem; }
.timeline__scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.timeline__track { display: flex; align-items: flex-start; list-style: none; margin: 0; padding: 0.35rem 0 0.6rem; }
.timeline__item { flex: 1 0 auto; min-width: 96px; position: relative; text-align: center; }
.timeline__item::before { content: ""; position: absolute; top: 6px; left: 0; right: 0; height: 2px; background: var(--border); z-index: 0; }
.timeline__item:first-child::before { left: 50%; }
.timeline__item:last-child::before { right: 50%; }
.timeline__node { position: relative; z-index: 1; display: block; padding: 26px 6px 0; color: var(--ink-strong); text-decoration: none; }
.timeline__dot { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 3px solid var(--primary); box-sizing: border-box; z-index: 2; }
.timeline__item--past .timeline__dot { background: var(--primary); }
.timeline__item--today .timeline__dot { border-color: var(--accent-red); background: var(--accent-red); box-shadow: 0 0 0 4px rgba(225, 29, 47, 0.18); }
.timeline__label { display: block; font-weight: 700; font-size: 0.82rem; line-height: 1.2; }
.timeline__date { display: block; font-size: 0.72rem; color: var(--muted-foreground); margin-top: 0.15rem; }
.timeline__item--today .timeline__label { color: var(--accent-red); }
a.timeline__node:hover .timeline__label, a.timeline__node:focus-visible .timeline__label { text-decoration: underline; }

/* ---- Carte (plan) dans un article ---- */
.article-map { margin: 1.25rem 0; max-width: 620px; }
.article-map img { width: 100%; height: auto; display: block; border-radius: var(--radius); border: 1px solid var(--border); }

/* ---- Hero : correctif mobile (le contenu ne doit plus être collé en bas) — hero__inner mobile fix ---- */
@media (max-width: 767px) {
  .hero__inner { min-height: auto; align-items: flex-start; padding-block: 2rem 2.25rem; }
  .hero__lead { margin-top: 0.9rem; font-size: 1.05rem; }
  .hero__cta { margin-top: 1.35rem; }
  .hero__cta .btn { flex: 1 1 auto; justify-content: center; }
}

/* ---- Bandeau communauté (Telegram / WhatsApp) ---- */
.community { margin: 2.25rem 0 0.5rem; }
.community__inner { display: flex; flex-direction: column; gap: 1.25rem; align-items: center; text-align: center;
  background: var(--primary-soft); border: 1px solid #cfe0ff; border-radius: var(--radius); padding: 1.75rem 1.5rem; }
.community__text h2 { font-size: clamp(1.3rem, 3.5vw, 1.75rem); margin: 0 0 0.45rem; color: var(--ink-strong); }
.community__text p { margin: 0; color: var(--muted-foreground); max-width: 48rem; line-height: 1.55; }
.community__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; justify-content: center; }
.join { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.58rem 1.1rem; border-radius: 9999px;
  font-weight: 700; font-size: 0.94rem; color: #fff; text-decoration: none; border: 1.5px solid transparent; transition: transform .15s ease, box-shadow .15s ease; }
.join svg { width: 20px; height: 20px; fill: currentColor; flex: none; }
.join:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.16); }
.join:focus-visible { outline: 3px solid rgba(0,100,224,.5); outline-offset: 2px; }
.join--tg { background: #229ED9; }
.join--wa { background: #25D366; }
@media (min-width: 768px) {
  .community__inner { flex-direction: row; justify-content: space-between; text-align: left; padding: 1.9rem 2.4rem; }
  .community__text { max-width: 48%; }
  .community__actions { justify-content: flex-end; }
}

/* ---- Lien d'évitement (accessibilité) ---- */
.skip-link { position: absolute; left: 8px; top: -60px; z-index: 9999; background: var(--primary); color: #fff;
  padding: 0.6rem 1rem; border-radius: 8px; font-weight: 700; text-decoration: none; transition: top .15s ease; }
.skip-link:focus { top: 8px; }
main:focus { outline: none; }

/* ---- Groupes thématiques (page Ressources) ---- */
.res-group { margin: 0 0 1.25rem; }
.res-group__title { font-size: clamp(1.4rem, 3vw, 1.9rem); margin: 0 0 0.35rem; color: var(--ink-strong); }
.res-group__sub { margin: 0; color: var(--muted-foreground); max-width: 46rem; line-height: 1.55; }

/* ---- Carte Listes de lecture : image de fond ---- */
.rcard--famille.rcard--lecture .rcard__head { background-image: linear-gradient(180deg, rgba(8,16,26,0) 26%, rgba(8,16,26,.4) 60%, rgba(8,16,26,.85) 100%), url("../img/res-lecture-bg.jpg?v=3"); }

/* ---- Galerie photos (justifiée, hauteur égale) ---- */
.gallery { display: flex; flex-wrap: wrap; gap: 0.6rem; justify-content: center; align-items: flex-start; margin: 1.5rem 0; }
.gallery img { height: 195px; width: auto; max-width: 100%; border-radius: var(--radius-sm); box-shadow: 0 8px 22px rgba(0,0,0,.14); display: block; }
.gallery figcaption { flex-basis: 100%; margin-top: 0.5rem; font-size: 0.85rem; color: var(--muted-foreground); text-align: center; }
@media (max-width: 640px) { .gallery img { height: auto; width: 100%; } }

/* ---- Bouton "Ajouter à mon agenda" (.ics) ---- */
.ics-cta { margin-top: 1.4rem; }
.ics-link { display: inline-flex; align-items: center; gap: 0.5rem; background: var(--primary-soft); color: var(--primary); font-weight: 700; padding: 0.6rem 1.15rem; border-radius: 9999px; text-decoration: none; transition: background .15s ease, color .15s ease; }
.ics-link:hover { background: var(--primary); color: #fff; }
.ics-link svg { width: 18px; height: 18px; flex: none; }

/* ---- HelloAsso : icône de marque + lien inline ---- */
.channel__icon--brand { background: #fff; border: 1px solid var(--border); }
.channel__icon--brand img { width: 30px; height: 30px; display: block; }
.ha-inline { width: 18px; height: 18px; vertical-align: text-bottom; margin-right: 0.2rem; }
.page-head__lead a { color: var(--primary); font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }

.ticker__text.is-scrolling { text-overflow: clip; }

/* ---- Bouton HelloAsso ---- */
.ha-btn { display: inline-flex; align-items: center; gap: 0.55rem; background: #fff; border: 1.5px solid var(--border); color: var(--ink-strong); font-weight: 700; padding: 0.6rem 1.2rem; border-radius: 9999px; text-decoration: none; margin-top: 1rem; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.ha-btn:hover { border-color: var(--primary); box-shadow: 0 6px 16px rgba(0,0,0,.08); transform: translateY(-1px); }
.ha-btn img { width: 22px; height: 22px; flex: none; }
.ha-btn__arrow { color: var(--primary); font-weight: 800; }

/* ---- Bouton HelloAsso (famille .join) + rangée sur Contact ---- */
.join--ha { background: #fff; color: var(--ink-strong); border: 1.5px solid #cfe0ff; }
.join--ha img { width: 20px; height: 20px; flex: none; }
.join--ha:hover { border-color: var(--primary); }
.join-row { display: flex; flex-wrap: wrap; gap: 0.75rem; }

@media (min-width: 768px) { .grid-5 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .grid-5 { grid-template-columns: repeat(5, 1fr); } }


/* ===== Programmes d'événements — Lectorium & Panorama théâtral ===== */
.prog-intro { color: var(--muted-foreground); margin: 0 0 1.6rem; }
.prog-section-title { font-family: var(--font-head); font-size: 1.5rem; font-weight: 800; color: var(--ink-strong); margin: 0 0 1.1rem; display: flex; align-items: center; gap: .6rem; }
.prog-section-title::before { content: ""; width: .45rem; height: 1.35rem; border-radius: 3px; background: var(--accent-red); display: inline-block; }
.prog-block + .prog-block { margin-top: 2.4rem; }

/* Vidéo « clic-pour-lire » — façade YouTube (l'iframe n'est chargée qu'au clic) */
.video-figure { margin: 0; }
.video-embed { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; margin: 0; padding: 0; border: 0; border-radius: var(--radius); overflow: hidden; cursor: pointer; background: #000; }
.video-embed img { width: 100%; height: 100%; object-fit: cover; display: block; }
.video-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.video-embed__play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0.12); transition: background 0.2s ease; }
.video-embed:hover .video-embed__play, .video-embed:focus-visible .video-embed__play { background: rgba(0, 0, 0, 0.28); }
.video-embed:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.video-embed__play svg { width: 68px; height: 48px; filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.45)); transition: transform 0.2s ease; }
.video-embed:hover .video-embed__play svg { transform: scale(1.08); }
.video-figure__cap { margin: 0.6rem 0 0; font-size: 0.9rem; color: var(--muted-foreground); text-align: center; }

/* Tableaux « label | contenu » : empilés en cartes sous 640px (plus de texte coupé/hors écran) */
@media (max-width: 640px) {
  .rtable, .rtable tbody, .rtable tr, .rtable td { display: block; width: auto; }
  .rtable thead { display: none; }
  .rtable tr { margin: 0 0 1rem; border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
  .rtable td { border-bottom: 0 !important; }
  .rtable td:first-child { background: var(--primary-soft); font-weight: 600; }
}


.prog-note { font-size: .95rem; color: var(--muted-foreground); background: var(--muted); border-radius: var(--radius-sm); padding: .9rem 1.1rem; margin: 0 0 1.6rem; }

.evt-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .8rem; }
.evt { border: 1px solid var(--border); border-left: 3px solid var(--primary); border-radius: var(--radius-sm); padding: .9rem 1.1rem; background: var(--card); }
.evt--next { border-left-color: var(--accent-red); }
.evt__date { font-size: .76rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--primary); }
.evt--next .evt__date { color: var(--accent-red); }
.evt__title { font-family: var(--font-head); font-size: 1.1rem; font-weight: 800; color: var(--ink-strong); margin: .18rem 0 .3rem; line-height: 1.22; }
.evt__meta { font-size: .88rem; color: var(--muted-foreground); margin: 0; }
.evt__meta b { color: var(--foreground); font-weight: 700; }
.evt__venue { display: inline-block; font-size: .78rem; font-weight: 700; color: var(--primary-dark); background: var(--primary-soft); border-radius: 999px; padding: .12rem .6rem; margin-top: .4rem; }

/* Accordéon Archives — <details>/<summary> natif, sans JS */
.arch { border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--card); margin-top: .7rem; overflow: hidden; }
.arch > summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: .7rem; padding: .95rem 1.15rem; font-family: var(--font-head); font-weight: 800; font-size: 1.12rem; color: var(--ink-strong); transition: background .15s ease; }
.arch > summary::-webkit-details-marker { display: none; }
.arch > summary::after { content: "\25BE"; font-family: var(--font-sans); font-size: .85rem; color: var(--primary); transition: transform .25s ease; }
.arch[open] > summary::after { transform: rotate(-180deg); }
.arch > summary:hover { background: var(--secondary); }
.arch__count { margin-left: auto; font-family: var(--font-sans); font-weight: 600; font-size: .8rem; color: var(--muted-foreground); }
.arch__body { padding: .2rem 1.15rem 1.15rem; }
.arch__body .evt-list { gap: .6rem; }


/* ===== Page adhésion — arguments enrichis ===== */
.adh-intro { font-size: 1.06rem; line-height: 1.6; color: var(--foreground); margin: 0 0 1.8rem; }
.adh-h { font-family: var(--font-head); font-size: 1.4rem; color: var(--ink-strong); margin: 0 0 1.1rem; }
.adh-benefits-grid { display: grid; gap: 1rem; margin: 0 0 1.8rem; }
.adh-benefit { border: 1px solid var(--border); border-left: 3px solid var(--primary); border-radius: var(--radius-sm); padding: 1.15rem 1.3rem; background: var(--card); }
.adh-benefit__n { display: inline-flex; align-items: center; justify-content: center; width: 1.85rem; height: 1.85rem; border-radius: 999px; background: var(--primary-soft); color: var(--primary-dark); font-weight: 800; font-size: .95rem; margin-bottom: .55rem; }
.adh-benefit h3 { font-family: var(--font-head); font-size: 1.12rem; margin: 0 0 .3rem; color: var(--ink-strong); }
.adh-benefit p { margin: 0; font-size: .94rem; line-height: 1.5; color: var(--muted-foreground); }
.adh-closing { font-size: 1.02rem; line-height: 1.55; font-weight: 600; color: var(--ink-strong); background: var(--primary-soft); border: 1px solid #cfe0ff; border-radius: var(--radius-sm); padding: 1.1rem 1.3rem; margin: 0 0 1.8rem; }
@media (min-width: 720px) { .adh-benefits-grid { grid-template-columns: 1fr 1fr; } }


/* ===== Boutons : conservent leur apparence dans un contexte à liens colorés/soulignés (.article, .prog-*, …) ===== */
a.btn { text-decoration: none; }
a.btn--red:link, a.btn--red:visited, a.btn--red:hover { color: #fff; }
a.btn--primary:link, a.btn--primary:visited, a.btn--primary:hover { color: #fff; }


/* ===== Dalles d'accueil — grille 3×2 (image + titre + sous-titre) ===== */
.navgrid { display: grid; gap: 1.4rem; grid-template-columns: 1fr; }
@media (min-width: 640px) { .navgrid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .navgrid { grid-template-columns: repeat(3, 1fr); } }
.navgrid .navblock--image { min-height: 17rem; }
.navblock__caption { display: flex; flex-direction: column; gap: .3rem; }
.navblock__sub { color: rgba(255,255,255,.86); font-size: .92rem; font-weight: 600; line-height: 1.3; }
.navblock--image .navblock__label { text-transform: uppercase; letter-spacing: .015em; line-height: 1.15; font-size: 1.5rem; }
.navblock--russe { --card-photo: url("../img/res-russie.jpg?v=4"); background-color: #121430; background-size: cover, contain; background-repeat: no-repeat; background-position: center; }


/* ===== Menu déroulant « Rubriques » (header desktop ≥1200px) ===== */
.nav__group { position: relative; display: inline-flex; align-items: center; }
.nav__toggle { display: inline-flex; align-items: center; gap: 0.3rem; font-family: inherit; font-size: 0.98rem; font-weight: 600; color: var(--foreground); background: none; border: 0; padding: 0; cursor: pointer; transition: color .15s ease; }
.nav__toggle:hover, .nav__group.is-open .nav__toggle, .nav__toggle.is-active { color: var(--primary); }
.nav__chev { transition: transform .2s ease; }
.nav__group.is-open .nav__chev { transform: rotate(180deg); }
.nav__panel { position: absolute; top: calc(100% + 0.65rem); left: 50%; transform: translateX(-50%); min-width: 250px; display: none; flex-direction: column; gap: 0.1rem; padding: 0.5rem; background: var(--card); border: 1px solid var(--border); border-radius: 0.9rem; box-shadow: 0 18px 40px -12px rgba(16,32,45,.28); z-index: 60; }
.nav__panel::before { content: ""; position: absolute; top: -0.65rem; left: 0; right: 0; height: 0.65rem; }
.nav__group.is-open .nav__panel { display: flex; }
.nav__panel a { display: block; padding: 0.55rem 0.85rem; border-radius: 0.6rem; font-size: 0.94rem; font-weight: 600; color: var(--foreground); white-space: nowrap; transition: background .12s ease, color .12s ease; }
.nav__panel a:hover { background: var(--muted); color: var(--primary); }
.nav__panel a.is-active { color: var(--primary); background: var(--muted); }
@media (min-width: 1000px) { .footer__grid { grid-template-columns: 1.5fr 1fr 1fr 1.2fr; } }

/* -------------------------------------------------- Correctifs mobile */
/* En-tête : empêcher la barre d'actions (langue + Adhérer + menu) de déborder à droite sur petit écran */
@media (max-width: 767px) {
  .header__inner { gap: 0.5rem; }
  .header__actions { gap: 0.4rem; }
  .header__actions .btn { padding: 0.5rem 0.85rem; font-size: 0.9rem; }
  .langswitch { font-size: 0.72rem; }
  .langswitch button { padding: 0.28rem 0.55rem; }
}
/* Accordéons : sur mobile, empiler le titre (pleine largeur) au-dessus de la date, flèche en haut à droite */
@media (max-width: 639px) {
  .arch > summary { flex-direction: column; align-items: stretch; gap: 0.25rem; position: relative; padding-right: 2.6rem; }
  .arch__count { margin-left: 0; }
  .arch > summary::after { position: absolute; top: 1rem; right: 1.15rem; }
}
/* Bannières « en vedette » (fond bleu clair) : compacter marges/espacement sur petit écran pour élargir la colonne de texte et éviter la coupure des titres (ex. « представители ») */
@media (max-width: 480px) {
  .container.section > a[style*="--primary-soft"] { padding: 1.1rem 1rem !important; gap: 0.85rem !important; }
}