/* ==========================================================================
   Institut Gershom Scholem : feuille de style du site
   Bleu pétrole + blanc, sans référence graphique à la Revue K.
   Motif signature : le filet vertical du logo IGS ("IGS | Institut"),
   repris comme marqueur de section.
   ========================================================================== */

/* Polices hébergées sur le site (licence OFL, aucune requête vers Google : conforme RGPD) */
@font-face { font-family: "Source Serif 4"; src: url("../fonts/source-serif-4.woff2") format("woff2"); font-weight: 200 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Source Serif 4"; src: url("../fonts/source-serif-4-italic.woff2") format("woff2"); font-weight: 200 900; font-style: italic; font-display: swap; }
@font-face { font-family: "Source Sans 3"; src: url("../fonts/source-sans-3.woff2") format("woff2"); font-weight: 200 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Source Sans 3"; src: url("../fonts/source-sans-3-italic.woff2") format("woff2"); font-weight: 200 900; font-style: italic; font-display: swap; }

:root {
  /* Couleur principale : bleu pétrole (nuance 1 par défaut).
     Les noms "nuit" sont conservés pour ne pas toucher au reste du fichier. */
  --nuit: #14485a;          /* bleu pétrole : en-tête, bandeaux, titres */
  --nuit-profond: #0d3240;  /* pied de page, barre utilitaire */
  --nuit-clair: #1f5f74;    /* survols */
  --ciel: #a9d3d6;          /* accent unique, sur fond pétrole */
  --encre: #1a1d23;         /* texte courant */
  --gris: #5b6270;          /* texte secondaire */
  --pierre: #f3f2ef;        /* fonds de panneaux clairs */
  --filet: #d8d6d0;         /* filets */
  --blanc: #ffffff;

  --font-titre: "Source Serif 4", Georgia, serif;
  --font-texte: "Source Sans 3", ui-sans-serif, system-ui, sans-serif;

  --max-w: 80rem;
  --gutter: 1.25rem;
}
@media (min-width: 768px) { :root { --gutter: 2.5rem; } }


*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--font-texte); font-size: 1.0625rem; line-height: 1.6; color: var(--encre); background: var(--blanc); overflow-x: hidden; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
p { margin: 0 0 1em; }
h1, h2, h3 { margin: 0; font-family: var(--font-titre); font-weight: 600; line-height: 1.15; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
.skip-link { position: absolute; left: 1rem; top: -4rem; z-index: 100; background: var(--blanc); color: var(--nuit); padding: .5rem 1rem; }
.skip-link:focus { top: 1rem; }
:focus-visible { outline: 2px solid var(--ciel); outline-offset: 2px; }
.container { max-width: var(--max-w); margin-inline: auto; padding-inline: var(--gutter); }

/* Marqueur de section : le filet du logo */
.rubrique { display: flex; align-items: center; gap: .75rem; font-size: .8125rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--gris); margin-bottom: 1.25rem; }
.rubrique::before { content: ""; width: 2px; height: 1.4em; background: currentColor; }
.sur-nuit .rubrique { color: var(--ciel); }

/* Boutons : rectangles nets, pas d'ombre */
.btn { display: inline-flex; align-items: center; gap: .6rem; min-height: 48px; padding: .7rem 1.4rem; border: 1px solid transparent; font: 600 .9375rem/1.3 var(--font-texte); letter-spacing: .01em; text-decoration: none; cursor: pointer; }
.btn svg { width: 1.05em; height: 1.05em; flex: none; }
.btn-brique, .btn-plein { background: var(--nuit); color: var(--blanc); }
.btn-brique:hover, .btn-plein:hover { background: var(--nuit-clair); }
.btn-outline { background: transparent; color: var(--nuit); border-color: var(--nuit); }
.btn-outline:hover { background: var(--nuit); color: var(--blanc); }
.btn-blanc { background: var(--blanc); color: var(--nuit); }
.btn-blanc:hover { background: var(--ciel); }
.btn-contour-blanc { background: transparent; color: var(--blanc); border-color: rgba(255,255,255,.6); }
.btn-contour-blanc:hover { border-color: var(--blanc); background: rgba(255,255,255,.08); }
.btn-row { display: flex; flex-wrap: wrap; gap: .75rem; }
.lien-fleche { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 1px; }
.lien-fleche svg { width: 1rem; height: 1rem; transition: transform .15s; }
.lien-fleche:hover svg { transform: translateX(3px); }

/* ---------- Barre utilitaire ---------- */
.utilitaire { background: var(--nuit-profond); color: rgba(255,255,255,.8); font-size: .8125rem; }
.utilitaire .container { display: flex; justify-content: flex-end; align-items: center; gap: 1.5rem; min-height: 2.25rem; }
.utilitaire a { text-decoration: none; }
.utilitaire a:hover { color: var(--blanc); text-decoration: underline; }
.utilitaire .langues { display: flex; gap: .5rem; }
.utilitaire .actif { color: var(--blanc); font-weight: 600; }
.utilitaire .inactif { opacity: .45; }
.utilitaire svg { width: .8rem; height: .8rem; display: inline; vertical-align: -1px; }
@media (max-width: 767px) { .utilitaire { display: none; } }

/* ---------- En-tête ---------- */
.entete { background: var(--nuit); color: var(--blanc); position: sticky; top: 0; z-index: 50; }
.entete .container { display: flex; align-items: center; gap: 2rem; min-height: 5.5rem; }
.entete .logo img { height: 2.6rem; width: auto; }
@media (min-width: 1024px) { .entete .logo img { height: 3.1rem; } }
.nav { display: none; margin-left: auto; gap: 2rem; align-items: center; }
.nav > a, .nav-toggle { font: 600 1rem/1.3 var(--font-texte); color: var(--blanc); text-decoration: none; padding: .5rem 0; border: 0; border-bottom: 2px solid transparent; background: none; cursor: pointer; display: inline-flex; align-items: center; gap: .3rem; }
.nav > a:hover, .nav > a.actif, .nav-toggle:hover, .nav-toggle.actif { border-bottom-color: var(--ciel); }
.nav-toggle svg { width: 1rem; height: 1rem; transition: transform .2s; }
.nav-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.nav-item { position: relative; }
.dropdown { display: none; position: absolute; top: calc(100% + .9rem); left: -1.25rem; min-width: 16rem; background: var(--blanc); color: var(--encre); box-shadow: 0 12px 30px rgba(13, 50, 64, .18); border-top: 3px solid var(--ciel); padding: .4rem 0; }
.dropdown.is-open { display: block; }
.dropdown a { display: block; padding: .65rem 1.25rem; font-size: .9375rem; text-decoration: none; }
.dropdown a:hover, .dropdown a:focus { background: var(--pierre); color: var(--nuit); }
.menu-btn { margin-left: auto; background: none; border: 0; color: var(--blanc); width: 3rem; height: 3rem; cursor: pointer; }
.menu-btn svg { width: 1.6rem; height: 1.6rem; }
.entete .container > .btn { display: none; }
@media (min-width: 1100px) { .nav { display: flex; } .entete .container > .btn { display: inline-flex; } .menu-btn { display: none; } }

/* Menu mobile plein écran */
.mobile-menu { position: fixed; inset: 0; z-index: 60; background: var(--nuit); color: var(--blanc); display: none; flex-direction: column; }
.mobile-menu.is-open { display: flex; }
.mobile-menu-head { display: flex; align-items: center; justify-content: space-between; padding: 1rem var(--gutter); border-bottom: 1px solid rgba(255,255,255,.15); }
.mobile-menu-head img { height: 2.4rem; width: auto; }
.mobile-menu-head .menu-btn { display: inline-flex; align-items: center; justify-content: center; margin: 0; }
.mobile-menu-body { flex: 1; overflow-y: auto; padding: 1rem var(--gutter) 2rem; }
.mobile-menu-body > .btn { width: 100%; justify-content: center; margin-top: .75rem; display: flex; }
.mobile-group { margin: 1.25rem 0 0; }
.mobile-group h2 { font-family: var(--font-texte); font-size: .8125rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ciel); margin-bottom: .25rem; font-weight: 600; }
.mobile-group a { display: flex; justify-content: space-between; padding: .65rem 0; border-bottom: 1px solid rgba(255,255,255,.12); text-decoration: none; font-weight: 600; }
.mobile-group a::after { content: "›"; }
.mobile-langs { margin-top: 1.5rem; font-size: .875rem; color: rgba(255,255,255,.7); }

/* ---------- Héro accueil ---------- */
.hero { position: relative; background: var(--nuit); color: var(--blanc); }
.hero-grid { display: grid; }
.hero-texte { padding: 3.5rem var(--gutter) 3.5rem; }
.hero-surtitre { font-size: .8125rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ciel); font-weight: 600; margin-bottom: 1.5rem; }
.hero h1 { font-size: clamp(2.6rem, 5.2vw, 4.75rem); line-height: 1.02; letter-spacing: -.01em; margin-bottom: 1.5rem; font-weight: 600; }
.hero-accroche { font-family: var(--font-titre); font-size: clamp(1.25rem, 1.8vw, 1.5rem); line-height: 1.4; color: rgba(255,255,255,.88); max-width: 32rem; margin-bottom: 2.25rem; font-weight: 400; }
.hero-image { position: relative; min-height: 18rem; margin: 0; }
.hero-image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero-image figcaption { position: absolute; right: .75rem; bottom: .5rem; font-size: .6875rem; color: rgba(255,255,255,.75); }
@media (min-width: 1024px) {
  .hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); min-height: 34rem; }
  .hero-texte { padding: 5rem 4rem 5rem max(var(--gutter), calc((100vw - var(--max-w)) / 2 + var(--gutter))); align-self: center; }
}

/* ---------- Sections ---------- */
.bloc-section { padding: 5rem 0; }
.bloc-section + .bloc-section { border-top: 1px solid var(--filet); }
.bloc-pierre { background: var(--pierre); border-top: 0 !important; }
.titre-section { font-size: clamp(2rem, 3.2vw, 2.75rem); margin-bottom: 1.25rem; }
.entete-section { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 1rem 2rem; margin-bottom: 2.5rem; }
.chapo-section { font-size: 1.1875rem; color: var(--gris); max-width: 44rem; margin: 0; }

/* Introduction : grande phrase */
.manifeste { display: grid; gap: 2.5rem; }
@media (min-width: 1024px) { .manifeste { grid-template-columns: 1fr 1.6fr; gap: 5rem; } }
.manifeste-phrase { font-family: var(--font-titre); font-size: clamp(1.25rem, 1.7vw, 1.5rem); line-height: 1.45; font-weight: 400; color: var(--nuit); margin: 0; }

/* Missions */
.missions { display: grid; gap: 0; border-top: 1px solid var(--nuit); }
@media (min-width: 640px) { .missions { grid-template-columns: repeat(2, 1fr); column-gap: 2.5rem; } }
.mission { padding: 1.5rem 0 1.75rem; border-bottom: 1px solid var(--filet); }
.mission-verbe { font-size: .8125rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--nuit); margin-bottom: .4rem; }
.mission h3 { font-size: 1.375rem; margin-bottom: .5rem; }
.mission p { margin: 0; color: var(--gris); font-size: 1rem; }

/* Pôles : liste numérotée (les pôles sont numérotés) */
.poles { display: grid; column-gap: 3rem; border-top: 1px solid var(--nuit); }
@media (min-width: 900px) { .poles { grid-template-columns: repeat(2, 1fr); } }
.pole { position: relative; display: grid; grid-template-columns: 3rem 1fr; gap: 0 1rem; padding: 1.75rem 0; border-bottom: 1px solid var(--filet); text-decoration: none; }
.pole-n { font-family: var(--font-titre); font-size: 2rem; line-height: 1; color: var(--nuit); opacity: .35; }
.pole h3 { font-size: 1.375rem; margin-bottom: .5rem; }
.pole p { margin: 0; color: var(--gris); font-size: 1rem; }
.pole:hover h3 { text-decoration: underline; text-underline-offset: 3px; }
.pole:hover .pole-n { opacity: 1; }

/* Revue K. (variante C) */
.revue { display: grid; gap: 2rem; align-items: center; }
@media (min-width: 900px) { .revue { grid-template-columns: 1.6fr 1fr; gap: 4rem; } }
.revue-logo { background: var(--blanc); border: 1px solid var(--filet); padding: 1.5rem; }
.revue-langues { font-size: .9375rem; color: var(--gris); }
.revue-langues a { color: var(--nuit); }

/* Ligne de diffusion (variantes A et B) */
.diffusion { display: flex; flex-wrap: wrap; gap: 1rem 2rem; align-items: center; justify-content: space-between; padding: 1.75rem 0; border-top: 1px solid var(--filet); border-bottom: 1px solid var(--filet); }
.diffusion p { margin: 0; font-family: var(--font-titre); font-size: 1.25rem; color: var(--nuit); max-width: 50rem; }

/* Soutien */
.soutien { background: var(--nuit); color: var(--blanc); padding: 5rem 0; }
.soutien-grid { display: grid; gap: 2rem; }
@media (min-width: 1024px) { .soutien-grid { grid-template-columns: 1.3fr 1fr; gap: 5rem; align-items: end; } }
.soutien h2 { font-size: clamp(2rem, 3.4vw, 3rem); margin-bottom: 1.25rem; }
.soutien p { color: rgba(255,255,255,.82); font-size: 1.125rem; margin: 0; }
.soutien p.rubrique { font-size: .8125rem; color: var(--ciel); margin-bottom: 1.25rem; }
.soutien .chiffre { font-family: var(--font-titre); font-size: 4.5rem; line-height: 1; color: var(--ciel); }
.soutien .chiffre-legende { font-size: .9375rem; color: rgba(255,255,255,.75); margin: .5rem 0 1.75rem; }

/* ---------- Pages intérieures ---------- */
.bandeau-page { background: var(--pierre); border-bottom: 1px solid var(--filet); padding: 2rem 0 3rem; }
.ariane { font-size: .875rem; color: var(--gris); margin-bottom: 2.5rem; }
.ariane a { color: var(--gris); }
.ariane span[aria-hidden] { margin: 0 .5rem; }
.titre-page { font-size: clamp(2.5rem, 4.5vw, 3.75rem); color: var(--nuit); margin-bottom: 1.25rem; }
.chapeau { font-family: var(--font-titre); font-size: clamp(1.2rem, 1.6vw, 1.4rem); line-height: 1.45; color: var(--encre); max-width: 48rem; margin: 0; }
.bandeau-page .download { margin-top: 1.75rem; background: var(--blanc); }
.bandeau-page .btn-row { margin-top: 1.75rem; }

.corps-page { display: grid; gap: 3rem; padding-top: 3.5rem; padding-bottom: 5rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1024px) { .corps-page { grid-template-columns: 15rem minmax(0, 1fr); gap: 4.5rem; } }
.sous-nav { font-size: .9375rem; }
.sous-nav-inner { position: sticky; top: 8rem; }
.sous-nav h2 { font-family: var(--font-texte); font-size: .8125rem; letter-spacing: .12em; text-transform: uppercase; color: var(--gris); margin-bottom: .75rem; font-weight: 600; }
.sous-nav ul { list-style: none; margin: 0 0 2rem; padding: 0; border-left: 1px solid var(--filet); }
.sous-nav li a { display: block; padding: .4rem 0 .4rem 1rem; margin-left: -1px; border-left: 2px solid transparent; text-decoration: none; color: var(--gris); }
.sous-nav li a:hover { color: var(--nuit); }
.sous-nav li a[aria-current] { border-left-color: var(--nuit); color: var(--nuit); font-weight: 600; }
@media (max-width: 1023px) { .sous-nav { display: none; } }

.prose { max-width: 46rem; font-size: 1.125rem; }
.prose > section + section { margin-top: 3.5rem; }
.prose h2 .pole-num { display: block; font-family: var(--font-texte); font-size: .8125rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gris); margin-bottom: .35rem; }
.prose h2 { font-size: clamp(1.6rem, 2.4vw, 2rem); color: var(--nuit); margin-bottom: 1rem; padding-top: 1.25rem; border-top: 1px solid var(--nuit); scroll-margin-top: 8rem; }
.prose a { color: var(--nuit); text-underline-offset: 2px; overflow-wrap: anywhere; }
.prose a:hover { color: var(--nuit-clair); }
.prose .btn { color: var(--blanc); }
.prose .btn-outline { color: var(--nuit); }
.prose .btn-outline:hover { color: var(--blanc); }
.prose .btn-row { margin: 1.5rem 0; }
.intertitre { font-family: var(--font-titre); font-weight: 600; font-size: 1.3rem; color: var(--nuit); margin: 2rem 0 .5rem; }
.encadre { background: var(--pierre); border-left: 3px solid var(--nuit); padding: 1.25rem 1.5rem; margin: 1.5rem 0; }
.encadre p:last-child { margin: 0; }
.a-completer { background: #fff3c4; border: 1px dashed #c9a400; color: #5a4800; padding: 0 .3rem; font-size: .95em; }

/* Personnes : portraits carrés, registre institutionnel */
.personnes { display: grid; gap: 2rem 1.5rem; margin: 1.75rem 0 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 768px) { .personnes { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.personnes[style] { grid-template-columns: minmax(0, 10rem) !important; }
.personne { display: flex; flex-direction: column; gap: .75rem; }
.personne img { width: 100%; max-width: 9rem; aspect-ratio: 1; object-fit: cover; border-radius: 50%; filter: grayscale(1); }
.personne strong { display: block; font-family: var(--font-titre); font-size: 1.125rem; color: var(--nuit); line-height: 1.25; }
.personne span { display: block; font-size: .9375rem; color: var(--gris); line-height: 1.4; margin-top: .2rem; }
.personne .role { display: inline-block; margin-top: .5rem; font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--nuit); background: none; padding: 0; }

.download { display: flex; align-items: center; gap: .9rem; padding: 1rem 1.25rem; border: 1px solid var(--nuit); text-decoration: none; color: var(--nuit) !important; margin: 1rem 0; max-width: 30rem; }
.download:hover { background: var(--nuit); color: var(--blanc) !important; }
.download:hover small { color: rgba(255,255,255,.75); }
.download svg { width: 1.5rem; height: 1.5rem; flex: none; }
.download small { display: block; color: var(--gris); }

.frise { list-style: none; padding: 0; margin: 1.5rem 0 0; border-left: 1px solid var(--nuit); }
.frise li { position: relative; padding: 0 0 1.5rem 1.5rem; }
.frise li::before { content: ""; position: absolute; left: -5px; top: .55rem; width: 9px; height: 9px; background: var(--nuit); }
.frise time { display: block; font-weight: 700; font-size: .875rem; letter-spacing: .06em; text-transform: uppercase; color: var(--nuit); }

.table-wrap { overflow-x: auto; margin: 1rem 0 1.5rem; }
table { border-collapse: collapse; width: 100%; font-size: 1rem; }
th, td { text-align: left; padding: .65rem .75rem; border-bottom: 1px solid var(--filet); }
th { font-weight: 600; border-bottom: 1px solid var(--nuit); }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }
.liste-pays { columns: 2; font-size: 1rem; }
@media (min-width: 640px) { .liste-pays { columns: 3; } }

.form { display: grid; gap: 1rem; max-width: 40rem; }
.form label { display: block; font-weight: 600; font-size: .9375rem; margin-bottom: .35rem; }
.form input, .form textarea, .form select { width: 100%; font: inherit; padding: .7rem .85rem; border: 1px solid #8a8f99; background: var(--blanc); }
.form textarea { min-height: 9rem; }
.form-note { font-size: .875rem; color: var(--gris); }

/* ---------- Pied de page ---------- */
.pied { background: var(--nuit-profond); color: rgba(255,255,255,.8); padding: 4rem 0 0; font-size: .9375rem; }
.pied-grid { display: grid; gap: 2.5rem; padding-bottom: 3rem; }
@media (min-width: 900px) { .pied-grid { grid-template-columns: 1.4fr 1fr 1fr 1.4fr; gap: 3rem; } }
.pied .logo img { height: 2.8rem; width: auto; margin-bottom: 1.25rem; }
.pied address { font-style: normal; line-height: 1.6; }
.pied h2 { font-family: var(--font-texte); font-size: .8125rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ciel); margin-bottom: 1rem; font-weight: 600; }
.pied ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.pied a { text-decoration: none; }
.pied a:hover { color: var(--blanc); text-decoration: underline; }
.pied form { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .75rem; }
.pied input { flex: 1; min-width: 12rem; font: inherit; padding: .65rem .8rem; background: transparent; border: 1px solid rgba(255,255,255,.35); color: var(--blanc); }
.pied button { font: 600 .9375rem var(--font-texte); padding: .65rem 1rem; background: var(--blanc); color: var(--nuit); border: 0; opacity: .5; cursor: not-allowed; }
.pied .note { font-size: .8125rem; color: rgba(255,255,255,.5); margin-top: .5rem; }
.pied-bas { border-top: 1px solid rgba(255,255,255,.12); padding: 1.25rem 0; display: flex; flex-wrap: wrap; gap: .5rem 2rem; justify-content: space-between; font-size: .8125rem; color: rgba(255,255,255,.55); }

/* Bandeau des pages masquées (prévisualisation interne) */
.bandeau-masque { background: #fff3c4; color: #5a4800; text-align: center; font-size: .875rem; padding: .5rem 1rem; border-bottom: 1px dashed #c9a400; }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }
