/* ============================================================
   Thème « manuscrit enluminé » — site public
   Chargé après style.css. Émeraude nuit, or, parchemin ;
   motif girih, rosace et étoile à huit branches.
   ============================================================ */

:root {
  --ink: #13241E;
  --emerald: #0B5641;
  --emerald-deep: #093E30;
  --nuit: #0B1A15;
  --sand: #F1E9D8;
  --sand-light: #FBF8F1;
  --gold: #B8923F;
  --gold-soft: #D9BE7C;
  --line: rgba(19, 36, 30, 0.13);
  --line-gold: rgba(184, 146, 63, 0.38);

  --e-girih: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%23E3C98A' stroke-width='.9'%3E%3Crect x='19' y='19' width='26' height='26'/%3E%3Crect x='19' y='19' width='26' height='26' transform='rotate%2845 32 32%29'/%3E%3Ccircle cx='32' cy='32' r='6'/%3E%3Cpath d='M0 32h13.6M50.4 32H64M32 0v13.6M32 50.4V64M0 0l9 9M64 0l-9 9M0 64l9-9M64 64l-9-9'/%3E%3C/g%3E%3C/svg%3E");
  --e-girih-sombre: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%23B8923F' stroke-width='.8'%3E%3Crect x='19' y='19' width='26' height='26'/%3E%3Crect x='19' y='19' width='26' height='26' transform='rotate%2845 32 32%29'/%3E%3Ccircle cx='32' cy='32' r='6'/%3E%3Cpath d='M0 32h13.6M50.4 32H64M32 0v13.6M32 50.4V64M0 0l9 9M64 0l-9 9M0 64l9-9M64 64l-9-9'/%3E%3C/g%3E%3C/svg%3E");
  --e-girih-doux: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%23E3C98A' stroke-opacity='.16' stroke-width='.9'%3E%3Crect x='19' y='19' width='26' height='26'/%3E%3Crect x='19' y='19' width='26' height='26' transform='rotate%2845 32 32%29'/%3E%3Ccircle cx='32' cy='32' r='6'/%3E%3Cpath d='M0 32h13.6M50.4 32H64M32 0v13.6M32 50.4V64M0 0l9 9M64 0l-9 9M0 64l9-9M64 64l-9-9'/%3E%3C/g%3E%3C/svg%3E");
  --e-rosace: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cg fill='none' stroke='%23E3C98A' stroke-width='1.2'%3E%3Ccircle cx='100' cy='100' r='96'/%3E%3Ccircle cx='100' cy='100' r='70'/%3E%3Ccircle cx='100' cy='100' r='24'/%3E%3Crect x='44' y='44' width='112' height='112'/%3E%3Crect x='44' y='44' width='112' height='112' transform='rotate%2845 100 100%29'/%3E%3Crect x='68' y='68' width='64' height='64'/%3E%3Crect x='68' y='68' width='64' height='64' transform='rotate%2845 100 100%29'/%3E%3Cpath d='M100 4v42M100 154v42M4 100h42M154 100h42M32 32l30 30M168 32l-30 30M32 168l30-30M168 168l-30-30'/%3E%3C/g%3E%3C/svg%3E");
  --e-etoile: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cg fill='%23B8923F'%3E%3Crect x='5' y='5' width='10' height='10'/%3E%3Crect x='5' y='5' width='10' height='10' transform='rotate%2845 10 10%29'/%3E%3C/g%3E%3Ccircle cx='10' cy='10' r='2.2' fill='%23FBF8F1'/%3E%3C/svg%3E");
  --e-medaillon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='20' r='19' fill='%230B5641'/%3E%3Ccircle cx='20' cy='20' r='17' fill='none' stroke='%23D9BE7C' stroke-width='.9'/%3E%3Cg fill='none' stroke='%23D9BE7C' stroke-width='1.3' stroke-linejoin='round'%3E%3Crect x='12' y='12' width='16' height='16'/%3E%3Crect x='12' y='12' width='16' height='16' transform='rotate%2845 20 20%29'/%3E%3C/g%3E%3Ccircle cx='20' cy='20' r='3' fill='%23D9BE7C'/%3E%3C/svg%3E");
  --e-ornement: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 24'%3E%3Cg fill='none' stroke='%23B8923F' stroke-width='1'%3E%3Cpath d='M0 12h92M148 12h92'/%3E%3Cpath d='M96 12l6-4 6 4-6 4zM132 12l6-4 6 4-6 4z' fill='%23B8923F'/%3E%3Crect x='112' y='4' width='16' height='16'/%3E%3Crect x='112' y='4' width='16' height='16' transform='rotate%2845 120 12%29'/%3E%3C/g%3E%3Ccircle cx='120' cy='12' r='2.6' fill='%23B8923F'/%3E%3C/svg%3E");
}

body { background: var(--sand-light); }

h1, h2, h3, h4 { color: var(--emerald-deep); }

::selection { background: rgba(217, 190, 124, .45); }

/* ---------- Icônes au trait ---------- */
.ic { width: 1em; height: 1em; vertical-align: -0.14em; flex-shrink: 0; }
.ic-wrap { display: inline-flex; align-items: center; justify-content: center; line-height: 1; }

/* ---------- Étoile à huit branches ---------- */
.star-bullet {
  width: 14px; height: 14px;
  clip-path: none;
  background: var(--e-etoile) center / contain no-repeat;
}

/* ---------- En-tête parchemin ---------- */
.site-header {
  background:
    linear-gradient(180deg, rgba(251,248,241,.97), rgba(247,241,229,.97));
  border-bottom: 1px solid var(--line-gold);
  box-shadow: 0 1px 0 rgba(255,255,255,.7) inset, 0 6px 22px -18px rgba(11,26,21,.5);
  backdrop-filter: saturate(1.2) blur(6px);
}
.site-header::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: -4px; height: 3px;
  background: linear-gradient(90deg, transparent, var(--gold) 20%, var(--gold-soft) 50%, var(--gold) 80%, transparent);
  opacity: .55;
  pointer-events: none;
}
.brand-mark {
  width: 42px; height: 42px;
  background: var(--e-medaillon) center / contain no-repeat;
  filter: drop-shadow(0 2px 4px rgba(11,26,21,.18));
}
.brand-mark path { display: none; }
.brand-text .eyebrow { color: var(--gold); }
.brand-text .name { color: var(--emerald-deep); font-size: 1.1rem; }

.main-nav { align-items: center; }
.main-nav a:not(.btn) { position: relative; padding: 6px 0; }
.main-nav a:not(.btn)::after {
  content: ""; position: absolute; left: 50%; bottom: -2px;
  width: 0; height: 1.5px; background: var(--gold);
  transition: width .25s ease, left .25s ease;
}
.main-nav a:not(.btn):hover::after,
.main-nav a.active::after { width: 100%; left: 0; }
.main-nav a.active { color: var(--emerald); }

.nav-toggle { color: var(--emerald); }
@media (max-width: 760px) {
  .main-nav { background: var(--sand-light); border-bottom: 1px solid var(--line-gold); }
}

/* ---------- Boutons ---------- */
.btn { border-radius: 999px; letter-spacing: .02em; transition: background .2s, color .2s, box-shadow .2s, transform .2s; }
.btn:hover { transform: translateY(-1px); }
.btn-primary {
  background: linear-gradient(180deg, #C9A457, var(--gold));
  color: var(--nuit);
  border-color: rgba(120, 90, 30, .35);
  box-shadow: 0 1px 0 rgba(255,255,255,.35) inset, 0 6px 16px -10px rgba(120,90,30,.8);
}
.btn-primary:hover { background: linear-gradient(180deg, var(--gold-soft), #C9A457); }
.main-nav .btn-primary { background: var(--emerald); color: var(--sand-light); border-color: var(--emerald); box-shadow: 0 0 0 3px rgba(184,146,63,.25); }
.main-nav .btn-primary:hover { background: var(--emerald-deep); }
.btn-outline { border-color: rgba(217, 190, 124, .6); color: var(--sand-light); }
.btn-outline:hover { border-color: var(--gold-soft); background: rgba(217,190,124,.1); }

/* ---------- Bandeaux (accueil et pages internes) ---------- */
.hero,
.page-hero {
  position: relative;
  isolation: isolate;
  color: var(--sand-light);
  overflow: hidden;
}
.hero {
  background-image:
    radial-gradient(ellipse at 78% 40%, rgba(184,146,63,.22), transparent 55%),
    linear-gradient(100deg, rgba(11,26,21,.96) 0%, rgba(9,62,48,.9) 50%, rgba(11,86,65,.72) 100%),
    url("images/quote-band.jpg");
  background-size: auto, auto, cover;
  background-position: center, center, center 65%;
  padding: 110px 0 104px;
}
.page-hero {
  background:
    radial-gradient(ellipse at 85% 30%, rgba(184,146,63,.2), transparent 55%),
    linear-gradient(120deg, var(--nuit) 0%, var(--emerald-deep) 55%, var(--emerald) 100%);
  padding: 78px 0 70px;
}
/* motif girih */
.hero .hero-pattern,
.page-hero .hero-pattern {
  display: block;
  opacity: .12;
  background: var(--e-girih) 0 0 / 64px 64px;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 60%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 60%);
  z-index: -1;
}
.hero .hero-pattern > svg,
.page-hero .hero-pattern > svg { display: none; }
/* rosace */
.hero::before,
.page-hero::before {
  content: "";
  position: absolute; z-index: -1;
  right: 6%; top: 50%;
  width: 300px; height: 300px;
  transform: translateY(-50%);
  background: var(--e-rosace) center / contain no-repeat;
  opacity: .2;
  pointer-events: none;
}
.page-hero::before { width: 220px; height: 220px; }
/* cadre doré intérieur */
.hero::after,
.page-hero::after {
  content: "";
  position: absolute; inset: 14px; z-index: -1;
  border: 1px solid rgba(217,190,124,.32);
  outline: 1px solid rgba(217,190,124,.14);
  outline-offset: 5px;
  pointer-events: none;
}
.hero .eyebrow,
.page-hero .eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  color: var(--gold-soft);
}
.page-hero .eyebrow::before,
.hero .eyebrow::after {
  content: ""; width: 34px; height: 1px;
  background: linear-gradient(90deg, var(--gold-soft), transparent);
}
.page-hero .eyebrow::before { width: 14px; height: 14px; background: var(--e-etoile) center / contain no-repeat; }
.hero h1, .page-hero h1 {
  color: var(--sand-light);
  text-shadow: 0 2px 18px rgba(0,0,0,.25);
}
.page-hero h1::after {
  content: "";
  display: block;
  width: 180px; height: 18px; margin-top: 14px;
  background: var(--e-ornement) left center / contain no-repeat;
  opacity: .9;
}
.page-hero p { color: rgba(251,248,241,.85); }
.page-hero .container { max-width: 1120px; }
.page-hero .container > * { max-width: 760px; }

@media (max-width: 760px) {
  .hero::before, .page-hero::before { right: -80px; opacity: .12; }
  .hero::after, .page-hero::after { inset: 8px; }
  .hero { padding: 80px 0 76px; }
  .page-hero { padding: 58px 0 52px; }
}

/* ---------- Têtes de section ---------- */
.section-head .eyebrow { color: var(--gold); gap: 0; }
.section-head h2 { position: relative; padding-bottom: 16px; }
.section-head h2::after {
  content: "";
  position: absolute; left: 0; bottom: 0;
  width: 150px; height: 14px;
  background: var(--e-ornement) left center / contain no-repeat;
}
.section-head[style*="center"] h2::after,
.text-center .section-head h2::after { left: 50%; transform: translateX(-50%); }

/* ---------- Cartes de mission ---------- */
.mission-card {
  position: relative;
  background: linear-gradient(180deg, #FFFDF8, var(--sand-light));
  border: 1px solid var(--line-gold);
  border-radius: 10px;
  padding: 34px 28px 30px;
  box-shadow: 0 10px 30px -24px rgba(11,26,21,.45);
  overflow: hidden;
  transition: transform .25s, box-shadow .25s;
}
.mission-card::before {
  content: "";
  position: absolute; left: 0; right: 0; top: 0; height: 3px;
  background: linear-gradient(90deg, var(--emerald), var(--gold) 50%, var(--emerald));
}
.mission-card::after {
  content: "";
  position: absolute; right: -40px; bottom: -40px;
  width: 140px; height: 140px;
  background: var(--e-girih-sombre) 0 0 / 46px 46px;
  opacity: .12;
  border-radius: 50%;
  pointer-events: none;
}
.mission-card .star-bullet {
  width: 40px; height: 40px; margin: 0 0 16px;
  border-radius: 50%;
  background: var(--e-medaillon) center / contain no-repeat;
  display: block;
}
.mission-card:hover { transform: translateY(-3px); box-shadow: 0 18px 36px -24px rgba(11,26,21,.55); }

/* ---------- Séparateur ornemental (remplace la vague) ---------- */
.wave-divider {
  height: 34px;
  background: var(--e-ornement) center / 260px 24px no-repeat;
  color: transparent;
}
.wave-divider svg { display: none; }

/* ---------- Bandeau citation ---------- */
.quote-band {
  position: relative;
  isolation: isolate;
  background:
    radial-gradient(ellipse at 50% 0%, rgba(184,146,63,.22), transparent 60%),
    linear-gradient(135deg, var(--nuit), var(--emerald-deep));
  border: 0;
  padding: 90px 0;
  overflow: hidden;
}
.quote-band::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: var(--e-girih) 0 0 / 64px 64px;
  opacity: .08;
}
.quote-band::after {
  content: ""; position: absolute; left: 50%; top: 50%; z-index: -1;
  width: 420px; height: 420px; transform: translate(-50%, -50%);
  background: var(--e-rosace) center / contain no-repeat;
  opacity: .08;
}
.quote-band blockquote { color: var(--sand-light); position: relative; }
.quote-band blockquote::before {
  content: "";
  display: block; margin: 0 auto 26px;
  width: 240px; height: 24px;
  background: var(--e-ornement) center / contain no-repeat;
}
.quote-band cite { color: var(--gold-soft); }

/* ---------- Actualités ---------- */
.news-item { border-bottom: 1px solid var(--line-gold); transition: background .2s; }
.news-item:hover { background: linear-gradient(90deg, rgba(217,190,124,.12), transparent 70%); }
.news-date {
  display: inline-flex; align-items: flex-start; gap: 8px;
  color: var(--gold);
}
.news-date::before {
  content: ""; width: 10px; height: 10px; margin-top: 4px; flex-shrink: 0;
  background: var(--e-etoile) center / contain no-repeat;
}

/* ---------- Cartes génériques des pages publiques ---------- */
.carte-cellule, .carte-recherche, .lieu-card, .galerie-item, .temoin-card,
.biblio-card, .colloque-card, .glossaire-item, .reunion-card, .journal-card, .edition-card {
  border-color: var(--line-gold) !important;
  border-radius: 10px !important;
}
.carte-cellule, .carte-recherche { position: relative; overflow: hidden; background: linear-gradient(180deg, #FFFDF8, var(--sand-light)) !important; }
.carte-cellule::before, .carte-recherche::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px;
  background: linear-gradient(90deg, var(--emerald), var(--gold) 50%, var(--emerald));
}
.carte-cellule .icone {
  width: 56px; height: 56px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 1.6rem !important; color: var(--gold-soft);
  background: radial-gradient(circle at 35% 30%, var(--emerald), var(--emerald-deep));
  box-shadow: 0 0 0 1px rgba(184,146,63,.5), 0 0 0 5px rgba(184,146,63,.12);
}
.galerie-img, .lieu-image {
  color: var(--gold-soft) !important;
  background:
    radial-gradient(circle at 50% 45%, rgba(217,190,124,.18), transparent 55%),
    var(--e-girih-doux) 0 0 / 56px 56px,
    linear-gradient(135deg, var(--nuit), var(--emerald)) !important;
}
.galerie-img .ic, .lieu-image .ic { width: 3rem; height: 3rem; stroke-width: 1.3; }
.lightbox-img { color: var(--gold-soft); }
.lightbox-img .ic { width: 5rem; height: 5rem; stroke-width: 1.2; }
.lieu-coords .ic { color: var(--gold); }
.temoin-type-badge { display: inline-flex; align-items: center; gap: 6px; }
.paiement-option .p-icon { color: var(--emerald); }
.paiement-option .p-icon .ic { width: 1.6rem; height: 1.6rem; }

/* grands pictogrammes d'état */
.success-msg .icon, .empty-state .icon, .acces-refuse .icon, .lecteur-body .icon, .etat-icone {
  width: 96px; height: 96px; margin: 0 auto 18px !important;
  display: flex !important; align-items: center; justify-content: center;
  border-radius: 50%;
  font-size: 2.6rem !important;
  color: var(--gold-soft);
  background: radial-gradient(circle at 35% 30%, var(--emerald), var(--emerald-deep));
  box-shadow: 0 0 0 1px rgba(184,146,63,.55), 0 0 0 8px rgba(184,146,63,.12);
}
.etat-icone { width: 80px; height: 80px; font-size: 2.1rem !important; }

/* filtres en pilule */
.filtres-recherches button:hover, .filtres-recherches button.active,
.filters-bar button.active, .filter-btn.active {
  background: var(--emerald) !important; color: var(--sand-light) !important; border-color: var(--gold) !important;
}

/* champs */
input:focus, select:focus, textarea:focus { border-color: var(--gold) !important; box-shadow: 0 0 0 3px rgba(184,146,63,.18); outline: none; }

/* ---------- Pied de page nuit émeraude ---------- */
.site-footer {
  position: relative;
  isolation: isolate;
  background: linear-gradient(180deg, var(--emerald-deep), var(--nuit) 70%);
  color: rgba(251,248,241,.75);
  padding-top: 64px;
  overflow: hidden;
}
.site-footer::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: var(--e-girih) 0 0 / 64px 64px;
  opacity: .06;
}
.site-footer::after {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px;
  background: linear-gradient(90deg, transparent, var(--gold) 20%, var(--gold-soft) 50%, var(--gold) 80%, transparent);
}
.site-footer .footer-grid::before {
  content: "";
  grid-column: 1 / -1;
  height: 24px; margin: -30px 0 6px;
  background: var(--e-ornement) center / 240px 24px no-repeat;
  opacity: .9;
}
.site-footer h4 { color: var(--gold-soft); }
@media (min-width: 901px) { .site-footer .footer-grid { grid-template-columns: 1.7fr repeat(4, 1fr); gap: 36px; } }
@media (min-width: 701px) and (max-width: 900px) { .site-footer .footer-grid { grid-template-columns: 1fr 1fr; } }
.site-footer a:hover { color: var(--gold-soft); text-decoration: none; }
.footer-bottom { border-top-color: rgba(217,190,124,.2); }

/* En-tête : liens sur une ligne (menu avec « Poésies ») */
@media (min-width: 761px) {
  .main-nav a { white-space: nowrap; }
  .brand-text .name { white-space: nowrap; }
  .site-header .container { gap: 28px; }
}
@media (min-width: 761px) and (max-width: 1180px) {
  .main-nav { gap: 18px; }
  .main-nav a { font-size: .88rem; }
}
