/* ==========================================================================
   Tradition et Culture — feuille de style
   Mobile d'abord · palette patrimoniale · contrastes vérifiés WCAG AA
   Bleu nuit / ivoire 13,7:1 · anthracite / ivoire 12,8:1 · bordeaux / ivoire 8,4:1
   Doré vieilli / bleu nuit 5,7:1 · doré foncé (#7D6638) / ivoire 4,9:1
   Le doré clair (#B69B62) n'est jamais employé pour du texte sur fond clair.
   ========================================================================== */

/* ---------- Polices (auto-hébergées, voir tools/fetch-fonts.sh) ---------- */
@font-face {
  font-family: "Cormorant Garamond";
  src: url("../fonts/cormorant-garamond-500.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Cormorant Garamond";
  src: url("../fonts/cormorant-garamond-600.woff2") format("woff2");
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Cormorant Garamond";
  src: url("../fonts/cormorant-garamond-500-italic.woff2") format("woff2");
  font-weight: 500; font-style: italic; font-display: swap;
}
@font-face {
  font-family: "Source Sans 3";
  src: url("../fonts/source-sans-3-400.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Source Sans 3";
  src: url("../fonts/source-sans-3-600.woff2") format("woff2");
  font-weight: 600; font-style: normal; font-display: swap;
}

/* ---------- Jetons ---------- */
:root {
  --night: #152735;
  --night-2: #1d3445;
  --ivory: #F6F2E9;
  --ivory-2: #EFE8DA;
  --stone: #E7DFCF;
  --gold: #B69B62;
  --gold-ink: #7D6638;
  --gold-light: #CDB687;
  --ink: #262B2C;
  --ink-soft: #4E5455;
  --burgundy: #653A3D;
  --mist: #B9C1C6;
  --line: rgba(38, 43, 44, .16);
  --line-strong: rgba(38, 43, 44, .32);

  --serif: "Cormorant Garamond", "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
  --sans: "Source Sans 3", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;

  --wrap: 76rem;
  --gutter: clamp(1rem, 4vw, 2.5rem);
  --space: clamp(4rem, 9vw, 8rem);
  --radius: 2px;
  --ease: cubic-bezier(.2, .7, .2, 1);
  --t: 200ms;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 6rem; }
body {
  margin: 0;
  background: var(--ivory);
  color: var(--ink);
  font: 400 1.0625rem/1.65 var(--sans);
  font-kerning: normal;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
img, svg { display: block; max-width: 100%; height: auto; }
a { color: var(--burgundy); text-decoration-thickness: 1px; text-underline-offset: .2em; transition: color var(--t) var(--ease); }
a:hover { color: var(--night); }
:focus-visible { outline: 3px solid var(--burgundy); outline-offset: 3px; }
.section--night :focus-visible, .site-footer :focus-visible, .cta-band :focus-visible { outline-color: var(--gold-light); }
h1, h2, h3 { font-family: var(--serif); font-weight: 600; line-height: 1.1; color: var(--night); margin: 0 0 .5em; letter-spacing: -.005em; }
p { margin: 0 0 1em; }
ul, ol { padding-left: 1.2em; }
code { font-size: .9em; background: var(--ivory-2); padding: .1em .35em; border-radius: var(--radius); }
sup { font-size: .65em; }
main:focus { outline: none; }

.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gutter); }
.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
  position: absolute; left: 1rem; top: -4rem; z-index: 100;
  background: var(--night); color: var(--ivory); padding: .75rem 1.25rem; font-weight: 600;
  transition: top var(--t) var(--ease);
}
.skip-link:focus { top: 1rem; color: var(--ivory); }

/* ---------- Typographie éditoriale ---------- */
.eyebrow {
  font: 600 .78rem/1.3 var(--sans);
  letter-spacing: .16em; text-transform: uppercase;
  color: var(--burgundy);
  margin-bottom: 1.1rem;
  display: flex; align-items: center; gap: .8rem;
}
.eyebrow::before { content: ""; width: 2.25rem; height: 1px; background: var(--gold); flex: none; }
.display { font-size: clamp(2rem, 4.2vw, 3.1rem); }
.display--xl { font-size: clamp(2.5rem, 6.4vw, 4.6rem); line-height: 1.02; }
.display em, .hero__title span { font-style: italic; font-weight: 500; }
.lead { font-size: clamp(1.15rem, 1.9vw, 1.35rem); line-height: 1.55; color: var(--ink-soft); max-width: 40em; }
.meta { font-size: .9rem; color: var(--ink-soft); }

.link-arrow, .link-back { font-weight: 600; text-decoration: none; display: inline-flex; align-items: center; gap: .55rem; color: var(--burgundy); }
.link-arrow::after { content: "→"; transition: transform var(--t) var(--ease); }
.link-arrow:hover::after { transform: translateX(4px); }
.link-back::before { content: "←"; transition: transform var(--t) var(--ease); }
.link-back:hover::before { transform: translateX(-4px); }
.link-arrow:hover, .link-back:hover { text-decoration: underline; }

/* ---------- Boutons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .75rem;
  min-height: 3rem; padding: .8rem 1.5rem;
  font: 600 1rem/1.2 var(--sans); letter-spacing: .01em;
  text-decoration: none; border: 1px solid transparent; border-radius: var(--radius); cursor: pointer;
  transition: background-color var(--t) var(--ease), color var(--t) var(--ease), border-color var(--t) var(--ease);
}
.btn__arrow { width: 1.1rem; height: auto; fill: none; stroke: currentColor; stroke-width: 1.6; transition: transform var(--t) var(--ease); }
.btn:hover .btn__arrow { transform: translateX(3px); }
.btn--primary { background: var(--night); color: var(--ivory); }
.btn--primary:hover { background: var(--burgundy); color: var(--ivory); }
.btn--ghost { border-color: var(--night); color: var(--night); background: transparent; }
.btn--ghost:hover { background: var(--night); color: var(--ivory); }
.btn--light { background: var(--ivory); color: var(--night); }
.btn--light:hover { background: var(--gold-light); color: var(--night); }
.btn--small { min-height: 2.6rem; padding: .55rem 1.1rem; font-size: .95rem; }
.actions { display: flex; flex-wrap: wrap; gap: .9rem; margin-top: 2rem; }
.actions--center { justify-content: center; }

/* ---------- En-tête ---------- */
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(246, 242, 233, .96);
  border-bottom: 1px solid var(--line);
}
@supports (backdrop-filter: blur(6px)) {
  .site-header { background: rgba(246, 242, 233, .9); backdrop-filter: blur(6px); }
}
.site-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 4.5rem; }

.wordmark { display: inline-flex; flex-direction: column; text-decoration: none; color: var(--night); line-height: 1; padding-block: .5rem; }
.wordmark:hover { color: var(--night); }
.wordmark__main { font: 600 1.45rem/1 var(--serif); letter-spacing: .005em; }
.wordmark__main em { font-style: italic; font-weight: 500; color: var(--burgundy); }
.wordmark__sub { font: 600 .6rem/1 var(--sans); letter-spacing: .24em; text-transform: uppercase; color: var(--ink-soft); margin-top: .4rem; }
.wordmark--light { color: var(--ivory); margin: 0 0 1.25rem; }
.wordmark--light .wordmark__main em { color: var(--gold-light); }
.wordmark--light .wordmark__sub { color: var(--mist); }

/* Navigation — mobile */
.nav__toggle {
  display: none; align-items: center; gap: .6rem;
  min-height: 2.75rem; padding: .5rem .9rem;
  background: transparent; border: 1px solid var(--line-strong); border-radius: var(--radius);
  font: 600 .95rem/1 var(--sans); color: var(--night); cursor: pointer;
}
.nav__toggle-bars, .nav__toggle-bars::before, .nav__toggle-bars::after {
  display: block; width: 1.1rem; height: 1.5px; background: currentColor; position: relative;
  transition: transform var(--t) var(--ease), background-color var(--t) var(--ease);
}
.nav__toggle-bars::before, .nav__toggle-bars::after { content: ""; position: absolute; left: 0; }
.nav__toggle-bars::before { top: -5px; }
.nav__toggle-bars::after { top: 5px; }
.nav__toggle[aria-expanded="true"] .nav__toggle-bars { background: transparent; }
.nav__toggle[aria-expanded="true"] .nav__toggle-bars::before { transform: translateY(5px) rotate(45deg); }
.nav__toggle[aria-expanded="true"] .nav__toggle-bars::after { transform: translateY(-5px) rotate(-45deg); }

.nav__list { list-style: none; margin: 0; padding: 0; }
.nav__list a, .nav__details summary {
  color: var(--ink); text-decoration: none; font-weight: 600; font-size: .98rem;
}
.nav__list a[aria-current="page"]:not(.btn), .nav__details summary.is-current { color: var(--burgundy); }
.nav__list .btn, .nav__list .btn:hover { color: var(--ivory); }
.nav__details summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: .4rem; }
.nav__details summary::-webkit-details-marker { display: none; }
.nav__chev { width: .7rem; fill: none; stroke: currentColor; stroke-width: 1.6; transition: transform var(--t) var(--ease); }
.nav__details[open] .nav__chev { transform: rotate(180deg); }
.nav__sub { list-style: none; margin: 0; padding: 0; }

@media (max-width: 71.99rem) {
  .js .nav__toggle { display: inline-flex; }
  .nav__list { padding: 0 0 1rem; }
  .js .nav__list {
    display: none;
    position: absolute; left: 0; right: 0; top: 100%;
    background: var(--ivory); border-bottom: 1px solid var(--line);
    padding: .5rem var(--gutter) 1.5rem;
    max-height: calc(100vh - 4.5rem); overflow-y: auto;
    box-shadow: 0 18px 30px -20px rgba(21, 39, 53, .35);
  }
  .js .nav__list.is-open { display: block; }
  .no-js .site-header__inner { flex-wrap: wrap; }
  .no-js .nav { width: 100%; }
  .nav__list > li { border-bottom: 1px solid var(--line); }
  .nav__list > li > a, .nav__details summary { display: flex; padding: .95rem 0; min-height: 2.75rem; width: 100%; justify-content: space-between; }
  .nav__sub { padding: 0 0 .75rem 1rem; border-left: 1px solid var(--gold); margin-bottom: .5rem; }
  .nav__sub a { display: block; padding: .55rem 0; font-weight: 400; }
  .nav__cta { border-bottom: 0 !important; padding-top: 1.25rem; }
  .nav__cta .btn { width: 100%; justify-content: center; padding: .8rem 1.25rem; }
  .site-header { position: sticky; }
}

/* Navigation — bureau (à partir de 1152 px) */
@media (min-width: 72rem) {
  .nav__list { display: flex; align-items: center; gap: clamp(1rem, 2vw, 2rem); white-space: nowrap; }
  .nav__list > li > a:not(.btn), .nav__details summary { padding: .5rem 0; position: relative; }
  .nav__list > li > a:not(.btn)::after, .nav__details summary::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: .2rem; height: 1px;
    background: var(--gold); transform: scaleX(0); transform-origin: left; transition: transform var(--t) var(--ease);
  }
  .nav__list > li > a:not(.btn):hover::after, .nav__list > li > a[aria-current="page"]::after,
  .nav__details summary:hover::after, .nav__details summary.is-current::after { transform: scaleX(1); }
  .nav__details summary:hover, .nav__list > li > a:not(.btn):hover { color: var(--night); }
  .nav__group { position: relative; }
  .nav__sub {
    position: absolute; top: calc(100% + .9rem); left: -1.25rem; min-width: 17rem;
    background: var(--ivory); border: 1px solid var(--line); border-top: 2px solid var(--gold);
    padding: .6rem 0; box-shadow: 0 20px 40px -24px rgba(21, 39, 53, .45);
  }
  .nav__sub a { display: block; padding: .6rem 1.25rem; font-weight: 400; }
  .nav__sub a:hover, .nav__sub a[aria-current="page"] { background: var(--ivory-2); color: var(--burgundy); }
  .nav__cta .btn { color: var(--ivory); }
  .nav__cta .btn[aria-current="page"] { background: var(--burgundy); }
}

/* ---------- Fil d'Ariane ---------- */
.breadcrumb { padding-top: 1.5rem; font-size: .9rem; }
.breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .35rem; color: var(--ink-soft); }
.breadcrumb li + li::before { content: "/"; margin-right: .35rem; color: var(--gold-ink); }
.breadcrumb a { color: var(--ink-soft); }
.breadcrumb a:hover { color: var(--burgundy); }
.breadcrumb [aria-current] { color: var(--ink); }

/* ---------- Médias et espaces réservés ---------- */
.media { margin: 0; position: relative; }
.media img { width: 100%; height: 100%; object-fit: cover; }
.media__frame {
  position: relative; aspect-ratio: 4 / 5; overflow: hidden;
  background:
    radial-gradient(120% 90% at 20% 10%, rgba(255, 255, 255, .55), transparent 60%),
    linear-gradient(160deg, #EDE5D4 0%, #E2D8C4 55%, #D9CDB6 100%);
}
.media__frame::after { /* grain de pierre */
  content: ""; position: absolute; inset: 0; opacity: .35; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .4 0 0 0 0 .32 0 0 0 .35 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.motif { position: absolute; inset: 8% 10%; width: 80%; height: 84%; }
.motif__courses path { fill: none; stroke: rgba(21, 39, 53, .07); stroke-width: 1; vector-effect: non-scaling-stroke; }
.motif__ink path, .motif__ink circle { fill: none; stroke: var(--night); stroke-width: 1.25; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; opacity: .78; }
.motif__ink .motif__fine { stroke-width: .8; opacity: .5; }
.motif__ink .motif__accent { stroke: var(--burgundy); opacity: .85; }
.media__devnote {
  margin-top: .6rem; font-size: .78rem; line-height: 1.4; color: var(--ink-soft);
  border: 1px dashed var(--line-strong); padding: .5rem .7rem;
}
.media__credit { margin-top: .5rem; font-size: .8rem; color: var(--ink-soft); }
.media--hero .media__frame, .media--hero picture { aspect-ratio: 4 / 5; }
.media--hero::before { /* cadre doré décalé */
  content: ""; position: absolute; inset: 1.1rem -1.1rem -1.1rem 1.1rem; border: 1px solid var(--gold); z-index: -1;
}
.media--tall .media__frame { aspect-ratio: 4 / 5; }

/* ---------- Héros ---------- */
.hero { padding: clamp(2.5rem, 6vw, 5.5rem) 0 var(--space); position: relative; overflow: hidden; }
.hero__grid { display: grid; gap: 3rem; align-items: center; }
.hero__title { font-size: clamp(2.7rem, 7.6vw, 5.6rem); line-height: .98; margin-bottom: 1.75rem; letter-spacing: -.015em; }
.hero__title span { display: block; color: var(--burgundy); }
.hero__media { position: relative; z-index: 0; max-width: 34rem; width: calc(100% - 1.1rem); }
@media (min-width: 56rem) {
  .hero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(3rem, 6vw, 6rem); }
  .hero__media { justify-self: end; margin-top: 2rem; }
}

/* ---------- Sections ---------- */
.section { padding-block: var(--space); }
.section--tight { padding-block: clamp(2rem, 4vw, 3rem); }
.section--stone { background: var(--ivory-2); }
.section--night { background: var(--night); color: var(--ivory); }
.section--night h2, .section--night h3 { color: var(--ivory); }
.section--night .lead { color: var(--mist); }
.section__head { max-width: 46rem; margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.section__head--row { max-width: none; display: grid; gap: 1.25rem; }
.section__intro { color: var(--ink-soft); max-width: 34rem; margin: 0; }
.section__more { margin-top: 2.5rem; }
@media (min-width: 56rem) {
  .section__head--row { grid-template-columns: 1fr 1fr; align-items: end; }
}

/* Bloc asymétrique */
.split__grid { display: grid; gap: 1rem; }
@media (min-width: 56rem) {
  .split__grid { grid-template-columns: 3fr 9fr; gap: 3rem; }
  .split__label { padding-top: 1rem; }
  .split__body { max-width: 50rem; }
}
.split__body .lead { font-size: clamp(1.25rem, 2.3vw, 1.6rem); color: var(--ink); font-family: var(--serif); line-height: 1.45; }

/* Piliers */
.pillars { list-style: none; padding: 0; margin: 0; display: grid; gap: 1.25rem; }
.pillar { position: relative; background: var(--ivory-2); border: 1px solid var(--line-strong); border-top: 2px solid var(--gold); padding: 2rem 1.75rem 2.25rem; display: flex; flex-direction: column; transition: background-color var(--t) var(--ease); }
.pillar:hover, .pillar:focus-within { background: var(--ivory); }
.pillar__num { font: 500 italic 1.5rem/1 var(--serif); color: var(--gold-ink); margin-bottom: 1.5rem; }
.pillar__title { font-size: 1.6rem; margin-bottom: .75rem; }
.pillar__title a { color: var(--night); text-decoration: none; }
.pillar__title a::after { content: ""; position: absolute; inset: 0; } /* carte entièrement cliquable */
.pillar p { color: var(--ink-soft); margin-bottom: 1.5rem; }
.pillar__more { margin-top: auto; font-weight: 600; font-size: .9rem; color: var(--burgundy); }
.pillar__more::after { content: " →"; }
.pillar:hover .pillar__title a { text-decoration: underline; text-decoration-color: var(--gold); }
@media (min-width: 40rem) { .pillars { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 64rem) {
  .pillars { grid-template-columns: repeat(6, 1fr); }
  .pillar { grid-column: span 2; }
  .pillar:nth-child(4) { grid-column: 2 / span 2; }
  .pillar:nth-child(5) { grid-column: 4 / span 2; }
}

/* Vision */
.vision { position: relative; overflow: hidden; }
.vision::before { /* arc décoratif */
  content: ""; position: absolute; right: -12rem; top: -10rem; width: 34rem; height: 34rem;
  border: 1px solid rgba(182, 155, 98, .35); border-radius: 50%;
}
.vision__grid { position: relative; display: grid; gap: 1.5rem; }
.vision__rule { width: 4rem; height: 1px; background: var(--gold); }
.vision h2 { max-width: 18ch; margin: 0; }
.vision h2 em { color: var(--gold-light); }
@media (min-width: 56rem) {
  .vision__grid { grid-template-columns: 7fr 4fr; align-items: end; column-gap: 4rem; }
  .vision__rule { grid-column: 1 / -1; }
}

/* Cartes projets */
.cards { list-style: none; padding: 0; margin: 0; display: grid; gap: 1.5rem; }
.card {
  position: relative; display: flex; flex-direction: column;
  background: var(--ivory); border: 1px solid var(--line); border-top: 2px solid var(--night);
  padding: 1.75rem 1.5rem 2rem;
  transition: border-color var(--t) var(--ease), transform var(--t) var(--ease), box-shadow var(--t) var(--ease);
}
.section--stone .card { background: var(--ivory); }
.card:hover, .card:focus-within { border-top-color: var(--burgundy); transform: translateY(-2px); box-shadow: 0 18px 30px -24px rgba(21, 39, 53, .5); }
.card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; font-size: .85rem; color: var(--ink-soft); margin-bottom: 1.25rem; }
.card__title { font-size: 1.55rem; }
.card__title a { color: var(--night); text-decoration: none; }
.card__title a::after { content: ""; position: absolute; inset: 0; }
.card:hover .card__title a { text-decoration: underline; text-decoration-color: var(--gold); }
.card p:last-child { margin-bottom: 0; }
.card p { color: var(--ink-soft); }
.card__more { margin-top: auto; padding-top: .5rem; font-weight: 600; font-size: .9rem; color: var(--burgundy); }
.card__more::after { content: " →"; }
@media (min-width: 48rem) { .cards { grid-template-columns: repeat(3, 1fr); } }

/* Statuts */
.status {
  display: inline-flex; align-items: center; gap: .45rem;
  font: 600 .74rem/1 var(--sans); letter-spacing: .1em; text-transform: uppercase;
  padding: .45rem .7rem; border: 1px solid currentColor; border-radius: 99px; white-space: nowrap;
}
.status::before { content: ""; width: .45rem; height: .45rem; border-radius: 50%; background: currentColor; }
.status--etude { color: var(--gold-ink); }
.status--etude::before { background: transparent; border: 1px solid currentColor; }
.status--preparation { color: var(--burgundy); }
.status--preparation::before { background: linear-gradient(90deg, currentColor 50%, transparent 50%); border: 1px solid currentColor; }
.status--en_cours { color: var(--ivory); background: var(--night); border-color: var(--night); }
.status--lg { font-size: .8rem; padding: .55rem .85rem; }

.status-legend { display: grid; gap: 1rem; margin: 0; }
.status-legend > div { border-left: 1px solid var(--gold); padding: .25rem 0 .25rem 1rem; }
.status-legend dt { margin-bottom: .5rem; }
.status-legend dd { margin: 0; color: var(--ink-soft); font-size: .95rem; }
@media (min-width: 48rem) { .status-legend { grid-template-columns: repeat(3, 1fr); gap: 2rem; } }

/* Filtres */
.filters ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.filters a {
  display: inline-flex; align-items: center; min-height: 2.75rem; padding: .5rem 1rem;
  border: 1px solid var(--line-strong); border-radius: 99px; text-decoration: none; color: var(--ink); font-weight: 600; font-size: .95rem;
  transition: background-color var(--t) var(--ease), color var(--t) var(--ease), border-color var(--t) var(--ease);
}
.filters a:hover { border-color: var(--night); color: var(--night); }
.filters a[aria-current="true"] { background: var(--night); border-color: var(--night); color: var(--ivory); }
.filters__count { margin: 1.5rem 0; color: var(--ink-soft); font-size: .95rem; }
.empty { border: 1px dashed var(--line-strong); padding: 2rem; text-align: center; }

/* Bandeau d'appel */
.cta-band { background: var(--burgundy); color: var(--ivory); padding-block: clamp(3.5rem, 7vw, 6rem); position: relative; overflow: hidden; }
.cta-band::after { content: ""; position: absolute; left: var(--gutter); right: var(--gutter); top: 1.25rem; height: 1px; background: rgba(205, 182, 135, .45); }
.cta-band__grid { display: grid; gap: 1.5rem; }
.cta-band h2 { color: var(--ivory); margin: 0; }
.cta-band .lead { color: #EADCD5; margin-bottom: 1.75rem; }
@media (min-width: 56rem) { .cta-band__grid { grid-template-columns: 5fr 6fr; gap: 4rem; align-items: end; } }

/* En-tête de page intérieure */
.page-head { padding: clamp(2rem, 5vw, 4rem) 0 clamp(3rem, 6vw, 5rem); border-bottom: 1px solid var(--line); }
.page-head__grid { display: grid; gap: 2.5rem; }
.page-head h1 { max-width: 16ch; }
.page-head__media { max-width: 24rem; }
@media (min-width: 56rem) {
  .page-head--media .page-head__grid { grid-template-columns: 7fr 4fr; align-items: end; gap: 5rem; }
  .page-head__media { justify-self: end; width: 100%; margin-bottom: -7rem; position: relative; z-index: 2; }
  .page-head--media + * { padding-top: calc(var(--space) + 1rem); }
}

/* Sous-sections numérotées */
.topics { display: grid; gap: 0; border-top: 1px solid var(--line); }
.topic { display: grid; grid-template-columns: 3rem 1fr; column-gap: 1rem; padding: 2rem 0; border-bottom: 1px solid var(--line); }
.topic__num { font: 500 italic 1.25rem/1.6 var(--serif); color: var(--gold-ink); grid-row: span 3; }
.topic__title { font-size: clamp(1.5rem, 2.6vw, 2rem); margin-bottom: .6rem; }
.topic p { color: var(--ink-soft); max-width: 42rem; margin-bottom: .75rem; }
@media (min-width: 56rem) {
  .topic { grid-template-columns: 4rem 5fr 7fr; column-gap: 2rem; padding: 2.5rem 0; }
  .topic__num { grid-row: auto; }
  .topic__title { margin: 0; }
  .topic p { grid-column: 3; }
  .topic p:first-of-type { grid-row: 1; }
}

/* Encadré de précision */
.note { border: 1px solid var(--line); border-left: 3px solid var(--gold); background: var(--ivory-2); padding: 1.5rem 1.5rem 1.25rem; margin: 2.5rem 0; max-width: 52rem; }
.note p { margin-bottom: .5rem; }
.note__title { font: 600 .78rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--burgundy); }
.note--strong { border-left-color: var(--burgundy); background: var(--ivory); }
.page-patrimoine .note, .page-jeunesse .note { margin-top: 0; margin-bottom: var(--space); }
.devnote { border: 1px dashed var(--burgundy); padding: .8rem 1rem; font-size: .9rem; color: var(--burgundy); }

/* Mise en page éditoriale (mission, confidentialité) */
.prose-layout { display: grid; gap: 2.5rem; padding-block: clamp(2.5rem, 6vw, 5rem) var(--space); }
.prose { max-width: 44rem; }
.prose section { padding-bottom: 1.5rem; }
.prose section + section { border-top: 1px solid var(--line); padding-top: 2.25rem; }
.prose h2 { font-size: clamp(1.7rem, 3vw, 2.3rem); }
.prose ul { margin: 0 0 1em; }
.prose li { margin-bottom: .4rem; }
.toc { font-size: .95rem; }
.toc__title { font: 600 .78rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--burgundy); }
.toc ol { list-style: none; padding: 0; margin: 0; border-left: 1px solid var(--line); }
.toc a { display: block; padding: .45rem 0 .45rem 1rem; color: var(--ink-soft); text-decoration: none; margin-left: -1px; border-left: 1px solid transparent; }
.toc a:hover { color: var(--burgundy); border-left-color: var(--gold); }
@media (min-width: 64rem) {
  .prose-layout { grid-template-columns: 15rem minmax(0, 1fr); gap: 5rem; }
  .prose-layout--single { grid-template-columns: minmax(0, 1fr); }
  .toc { position: sticky; top: 7rem; align-self: start; }
}

.domain-list { list-style: none; padding: 0 !important; }
.domain-list li { padding: .9rem 0; border-bottom: 1px solid var(--line); margin: 0 !important; }
.principles { margin: 0; }
.principles > div { display: grid; gap: .25rem; padding: 1rem 0; border-bottom: 1px solid var(--line); }
.principles dt { font: 600 1.25rem/1.3 var(--serif); color: var(--night); }
.principles dd { margin: 0; color: var(--ink-soft); }
@media (min-width: 40rem) { .principles > div { grid-template-columns: 9rem 1fr; gap: 1.5rem; } }

.facts { margin: 0 0 1.5rem; }
.facts > div { display: grid; gap: .15rem; padding: .9rem 0; border-bottom: 1px solid var(--line); }
.facts dt { font-size: .82rem; letter-spacing: .1em; text-transform: uppercase; font-weight: 600; color: var(--ink-soft); }
.facts dd { margin: 0; font-size: 1.1rem; color: var(--ink); }
@media (min-width: 40rem) { .facts > div { grid-template-columns: 14rem 1fr; gap: 1.5rem; align-items: baseline; } }
.address-block { border-left: 2px solid var(--gold); padding-left: 1rem; }

.ticks { list-style: none; padding: 0; margin: 0; }
.ticks li { position: relative; padding-left: 1.5rem; margin-bottom: .55rem; }
.ticks li::before { content: ""; position: absolute; left: 0; top: .72em; width: .75rem; height: 1px; background: var(--gold-ink); }

/* Organisation */
.org { padding-block: clamp(2.5rem, 6vw, 5rem) var(--space); display: grid; gap: 3.5rem; }
.org__block { display: grid; gap: 1rem; }
.org__title { font-size: clamp(1.7rem, 3vw, 2.3rem); }
.org__aside { color: var(--ink-soft); font-size: .95rem; max-width: 44rem; }
.org .note { margin: 0; }
.officers { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; gap: 1rem; }
.officer { display: flex; flex-direction: column; gap: .2rem; padding: 1.25rem 1.5rem; background: var(--ivory-2); border-top: 2px solid var(--gold); max-width: 26rem; }
.officer__name { font: 600 1.5rem/1.2 var(--serif); color: var(--night); }
.officer__role { color: var(--ink-soft); font-size: .95rem; }
@media (min-width: 56rem) {
  .org__block { grid-template-columns: 4fr 8fr; column-gap: 4rem; }
  .org__block > *:not(.org__title) { grid-column: 2; }
  .org__title { grid-row: 1 / span 4; }
}

/* Parcours (participer) */
.paths { list-style: none; padding: 0; margin: 0; display: grid; gap: 2.5rem; counter-reset: p; }
.path { border-top: 1px solid var(--night); padding-top: 1.5rem; }
.path__num { font: 500 italic 1.5rem/1 var(--serif); color: var(--gold-ink); display: block; margin-bottom: 1rem; }
.path__title { font-size: 1.8rem; }
.path p { color: var(--ink-soft); }
@media (min-width: 56rem) { .paths { grid-template-columns: repeat(3, 1fr); gap: 3rem; } }

/* Fiche projet */
.project { padding-block: clamp(2.5rem, 6vw, 4rem) var(--space); }
.project__facts { margin: 0; border-top: 1px solid var(--line); }
.project__facts > div { display: grid; gap: .4rem; padding: 1.5rem 0; border-bottom: 1px solid var(--line); }
.project__facts dt { font: 600 1.35rem/1.3 var(--serif); color: var(--night); }
.project__facts dd { margin: 0; color: var(--ink-soft); max-width: 46rem; }
@media (min-width: 48rem) { .project__facts > div { grid-template-columns: 14rem 1fr; gap: 2rem; } }
.project__back { margin-top: 3rem; }
.gallery { margin-top: 3rem; }
.gallery__grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); }

/* Formulaires */
.form-section { display: grid; gap: 2.5rem; margin-top: clamp(3rem, 6vw, 5rem); }
.section .form-section, .form-section--contact { margin-top: 0; }
@media (min-width: 56rem) { .form-section { grid-template-columns: 4fr 7fr; gap: 5rem; } }
.form { background: var(--ivory); border: 1px solid var(--line); padding: clamp(1.25rem, 4vw, 2.5rem); }
.form__hint { font-size: .9rem; color: var(--ink-soft); }
.form__row { display: grid; gap: 0 1.25rem; }
@media (min-width: 40rem) { .form__row { grid-template-columns: 1fr 1fr; } }
.field { margin-bottom: 1.4rem; }
.field label { display: block; font-weight: 600; margin-bottom: .45rem; color: var(--night); }
.field input[type="text"], .field input[type="email"], .field select, .field textarea {
  width: 100%; font: inherit; color: var(--ink);
  background: #FFFDF8; border: 1px solid #8A8F90; border-radius: var(--radius);
  padding: .75rem .9rem; min-height: 3rem;
  transition: border-color var(--t) var(--ease), box-shadow var(--t) var(--ease);
}
.field textarea { resize: vertical; min-height: 10rem; }
.field select {
  appearance: none; -webkit-appearance: none; padding-right: 2.5rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23152735' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right .9rem center; background-size: .8rem;
}
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible {
  outline: 3px solid var(--burgundy); outline-offset: 1px; border-color: var(--night);
}
.field--error input, .field--error select, .field--error textarea { border-color: #8E2A2F; border-width: 2px; }
.field__error { color: #8E2A2F; font-weight: 600; font-size: .92rem; margin: .45rem 0 0; display: flex; gap: .4rem; }
.field__error::before { content: "!"; display: inline-grid; place-items: center; width: 1.2rem; height: 1.2rem; border-radius: 50%; background: #8E2A2F; color: #fff; font-size: .75rem; flex: none; margin-top: .1rem; }
.field--check { display: grid; grid-template-columns: auto 1fr; gap: .75rem; align-items: start; }
.field--check input { width: 1.35rem; height: 1.35rem; margin: .15rem 0 0; accent-color: var(--night); }
.field--check label { font-weight: 400; color: var(--ink); margin: 0; }
.field--check .field__error { grid-column: 1 / -1; }
.form__alert { border: 2px solid #8E2A2F; background: #FBF0EE; padding: 1rem 1.25rem; margin-bottom: 1.5rem; }
.form__alert:focus { outline: 3px solid var(--burgundy); outline-offset: 2px; }
.form__alert p { margin: 0 0 .5rem; color: #6E1F24; }
.form__alert ul { margin: 0; }
.form__alert a { color: #6E1F24; }
.form__actions { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; align-items: center; margin-top: .5rem; }
.form__note { font-size: .88rem; color: var(--ink-soft); margin: 0; max-width: 24rem; }
.hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

.contact-facts { margin: 0; }
.contact-facts > div { padding: 1rem 0; border-bottom: 1px solid var(--line); }
.contact-facts dt { font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 600; color: var(--burgundy); margin-bottom: .25rem; }
.contact-facts dd { margin: 0; font-family: var(--serif); font-size: 1.3rem; line-height: 1.35; color: var(--night); }

/* Confirmation / 404 */
.confirm__inner { text-align: center; max-width: 44rem; }
.confirm__inner .lead { margin-inline: auto; }
.confirm__seal svg { width: 4rem; margin: 0 auto 1.5rem; fill: none; stroke: var(--gold-ink); stroke-width: 1.4; }
.confirm__code { font: 500 italic clamp(5rem, 16vw, 9rem)/1 var(--serif); color: var(--gold-ink); margin: 0 0 .5rem; }
.sitemap-list { list-style: none; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem 1.5rem; margin-top: 2rem; }

/* ---------- Pied de page ---------- */
.site-footer { background: var(--night); color: var(--mist); padding-top: clamp(3.5rem, 7vw, 5.5rem); font-size: .95rem; }
.site-footer a { color: var(--ivory); text-decoration: none; }
.site-footer a:hover { color: var(--gold-light); text-decoration: underline; }
.site-footer__grid { display: grid; gap: 2.5rem; padding-bottom: 3rem; }
.site-footer__tagline { font: 500 italic 1.35rem/1.3 var(--serif); color: var(--gold-light); max-width: 18rem; }
.site-footer__legal { line-height: 1.7; }
.site-footer__title { font: 600 .75rem/1.3 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--gold-light); margin-bottom: 1rem; }
.site-footer__nav ul { list-style: none; margin: 0; padding: 0; }
.site-footer__nav li { margin-bottom: .55rem; }
.site-footer__base { border-top: 1px solid rgba(182, 155, 98, .3); padding-block: 1.5rem 2rem; font-size: .85rem; display: grid; gap: .5rem; }
.site-footer__base p { margin: 0; }
@media (min-width: 48rem) {
  .site-footer__grid { grid-template-columns: 2fr 1fr 1fr 1fr; gap: 3rem; }
  .site-footer__base { grid-template-columns: 1fr auto; gap: 2rem; }
}

/* ---------- Animations discrètes ---------- */
.js .reveal { opacity: 0; transform: translateY(12px); transition: opacity 250ms var(--ease), transform 250ms var(--ease); }
.js .reveal.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; }
  .js .reveal { opacity: 1; transform: none; }
}

@media print {
  .site-header, .site-footer, .cta-band, .form, .toc, .breadcrumb { display: none; }
  body { background: #fff; }
}
