/* SB Aviation : composants. Valeurs uniquement via les jetons de tokens/*.css. */

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: var(--header-h); }
body {
  margin: 0;
  font: 400 var(--t-body)/var(--lh-body) var(--f-body);
  color: var(--c-ink);
  background: var(--c-white);
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }
svg { display: block; }
a { color: var(--c-blue); text-underline-offset: .2em; }
a:hover { color: var(--c-blue-deep); }
:focus-visible { outline: 3px solid var(--c-sunset); outline-offset: 3px; border-radius: 2px; }
h1, h2, h3 {
  font-family: var(--f-display);
  font-variation-settings: "wdth" var(--display-width);
  font-weight: 750;
  letter-spacing: var(--tracking-display);
  line-height: var(--lh-title);
  margin: 0 0 .45em;
  text-wrap: balance;
}
h1 { font-size: var(--t-h1); line-height: var(--lh-tight); }
h2 { font-size: var(--t-h2); }
h3 { font-size: var(--t-h3); }
p { margin: 0 0 1em; text-wrap: pretty; }
ul, ol { margin: 0; padding: 0; }

.container { width: min(var(--max), 100% - 2 * var(--gutter)); margin-inline: auto; }
.skip-link {
  position: absolute; left: -999px; top: var(--s-2); z-index: 200;
  background: var(--c-sunset); color: var(--c-night); padding: var(--s-2) var(--s-4); font-weight: 700;
}
.skip-link:focus { left: var(--s-2); }
.visually-hidden {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}

/* ---------- Typo utilitaire ---------- */
.kicker {
  display: block;
  font: 500 var(--t-mono)/1.4 var(--f-mono);
  letter-spacing: var(--tracking-mono);
  text-transform: uppercase;
  color: var(--c-blue);
  margin-bottom: var(--s-4);
}
.on-dark .kicker, .kicker--light { color: var(--c-sunset); }
.lead { font-size: var(--t-lead); line-height: 1.55; color: var(--c-muted); max-width: 60ch; }
.on-dark .lead { color: var(--c-muted-dark); }
.mono { font-family: var(--f-mono); }

/* ---------- Boutons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .6em;
  font: 700 1rem/1 var(--f-body);
  padding: 1.05em 1.6em; border-radius: var(--r-pill);
  background: var(--c-sunset); color: var(--c-night);
  border: 2px solid var(--c-sunset); text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: background var(--d-fast) ease, border-color var(--d-fast) ease, color var(--d-fast) ease, transform var(--d-fast) ease;
}
.btn:hover { background: var(--c-sunset-deep); border-color: var(--c-sunset-deep); color: var(--c-night); }
.btn:active { transform: scale(.97); }
.btn:disabled { opacity: .6; cursor: progress; }
.btn svg { width: 1.1em; height: 1.1em; transition: transform var(--d-fast) var(--ease-out); }
.btn:hover svg { transform: translateX(3px); }
.btn--ghost { background: transparent; color: var(--c-white); border-color: rgb(255 255 255 / .55); }
.btn--ghost:hover { background: var(--c-white); border-color: var(--c-white); color: var(--c-night); }
.btn--dark { background: var(--c-night); border-color: var(--c-night); color: var(--c-white); }
.btn--dark:hover { background: var(--c-blue); border-color: var(--c-blue); color: var(--c-white); }
.btn--small { padding: .75em 1.2em; font-size: .92rem; }
.actions { display: flex; flex-wrap: wrap; gap: var(--s-3); }

.link-arrow {
  display: inline-flex; align-items: center; gap: .5em; font-weight: 700; text-decoration: none; color: inherit;
}
.link-arrow svg { width: 1.1em; height: 1.1em; transition: transform var(--d-fast) var(--ease-out); }
.link-arrow:hover { color: inherit; }
.link-arrow:hover svg { transform: translateX(4px); }

/* ---------- Header ---------- */
.site-header {
  position: fixed; inset: 0 0 auto; z-index: 100; height: var(--header-h);
  color: var(--c-white);
  transition: background var(--d-fast) ease, box-shadow var(--d-fast) ease;
}
.site-header::before { /* voile pour garder le menu lisible sur la photo */
  content: ""; position: absolute; inset: 0 0 -40px; z-index: -1; pointer-events: none;
  background: linear-gradient(rgb(6 20 35 / .55), transparent);
  transition: opacity var(--d-fast) ease;
}
.site-header.is-scrolled { background: var(--c-night); box-shadow: 0 1px 0 var(--c-line-dark); }
.site-header.is-scrolled::before { opacity: 0; }
.site-header .container { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: var(--s-5); }
.logo { display: inline-flex; flex: none; }
.logo img { height: 54px; width: auto; }
.nav { display: flex; align-items: center; gap: var(--s-6); }
.nav ul { display: flex; gap: var(--s-6); list-style: none; }
.nav a:not(.btn) {
  color: var(--c-white); text-decoration: none; font-weight: 600; font-size: .95rem;
  padding: var(--s-2) 0; position: relative;
}
.nav a:not(.btn)::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 2px; height: 2px; background: var(--c-sunset);
  transform: scaleX(0); transform-origin: left; transition: transform var(--d-fast) var(--ease-out);
}
.nav a:not(.btn):hover::after, .nav a[aria-current="page"]::after { transform: scaleX(1); }
 
.nav-toggle {
  display: none; width: 44px; height: 44px; place-items: center;
  background: none; border: 0; color: var(--c-white); cursor: pointer; padding: 0;
}
.nav-toggle svg { width: 28px; height: 28px; }
.nav-toggle .icon-close { display: none; }
.nav-toggle[aria-expanded="true"] .icon-open { display: none; }
.nav-toggle[aria-expanded="true"] .icon-close { display: block; }

/* ---------- Hero accueil ---------- */
.hero {
  position: relative; min-height: clamp(640px, 100svh, 1000px); color: var(--c-white);
  display: grid; grid-template-rows: 1fr auto; overflow: hidden; background: var(--c-night);
}
.hero-media, .page-hero-media { position: absolute; inset: 0; }
.hero-media img, .page-hero-media img { width: 100%; height: 100%; object-fit: cover; }
.hero-media::after, .page-hero-media::after { /* voile de lisibilité, voir charte §7 */
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgb(6 20 35 / .96) 0%, rgb(6 20 35 / .78) 48%, rgb(6 20 35 / .12) 100%),
    linear-gradient(0deg, rgb(6 20 35 / .8), transparent 52%);
}
.hero-body { position: relative; align-self: end; padding: calc(var(--header-h) + var(--s-8)) 0 var(--s-8); }
.hero h1 { font-size: var(--t-hero); max-width: 13ch; margin-bottom: var(--s-5); }
.hero h1 em { font-style: normal; color: var(--c-sunset); }
.hero .lead { color: rgb(255 255 255 / .82); margin-bottom: var(--s-6); }

.flight-strip { position: relative; border-top: 1px solid var(--c-line-dark); background: rgb(6 20 35 / .6); }
.flight-strip dl {
  display: grid; grid-template-columns: repeat(4, 1fr); margin: 0;
}
.flight-strip div { padding: var(--s-5) var(--s-5) var(--s-5) 0; }
.flight-strip div + div { padding-left: var(--s-5); border-left: 1px solid var(--c-line-dark); }
.flight-strip dt {
  font: 500 .7rem/1 var(--f-mono); letter-spacing: var(--tracking-mono); text-transform: uppercase;
  color: var(--c-sky); margin-bottom: var(--s-2);
}
.flight-strip dd { margin: 0; font: 500 1rem/1.3 var(--f-mono); color: var(--c-white); }

/* ---------- Hero des pages ---------- */
.page-hero {
  position: relative; min-height: clamp(440px, 72svh, 680px); color: var(--c-white);
  display: flex; align-items: flex-end; background: var(--c-night); overflow: hidden;
}
.page-hero .container { position: relative; padding: calc(var(--header-h) + var(--s-8)) 0 var(--s-8); }
.page-hero h1 { max-width: 16ch; margin-bottom: var(--s-4); }
.page-hero .lead { color: rgb(255 255 255 / .82); margin: 0; }
.page-hero--plain { min-height: 0; }
.page-hero--plain .container { padding-bottom: var(--s-9); }

/* ---------- Sections ---------- */
.section { padding: var(--section) 0; position: relative; }
.section--paper { background: var(--c-paper); }
.section--night { background: var(--c-night); color: var(--c-white); }
.section--night a:not(.btn) { color: var(--c-blue-light); }
.section-head { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-6) var(--s-8); align-items: end; margin-bottom: var(--s-8); }
.section-head h2 { margin: 0; }
.section-head .lead { margin: 0; }
.section-head--stack { grid-template-columns: 1fr; max-width: 760px; }

.statement {
  font-family: var(--f-display); font-variation-settings: "wdth" var(--display-width);
  font-weight: 650; letter-spacing: var(--tracking-display);
  font-size: clamp(1.7rem, 1.1rem + 2.6vw, 3.4rem); line-height: 1.12; max-width: 22ch; margin: 0;
}
.statement em { font-style: normal; color: var(--c-blue); }
.on-dark .statement em { color: var(--c-sunset); }

.split { display: grid; grid-template-columns: repeat(12, 1fr); gap: var(--s-7) var(--s-6); align-items: center; }
.split > *, .section-head > * { min-width: 0; } /* une cellule de grille ne déborde jamais */
.split > :first-child { grid-column: 1 / span 6; }
.split > :last-child { grid-column: 8 / span 5; }
.split--wide-media > :first-child { grid-column: 1 / span 5; }
.split--wide-media > :last-child { grid-column: 7 / span 6; }
.split--reverse > :first-child { order: 2; grid-column: 7 / span 6; }
.split--reverse > :last-child { order: 1; grid-column: 1 / span 5; }

.figure { margin: 0; position: relative; }
.figure img { width: 100%; border-radius: var(--r-md); aspect-ratio: 4 / 5; object-fit: cover; }
.figure--landscape img { aspect-ratio: 4 / 3; }
.figure figcaption {
  margin-top: var(--s-3); font: 400 var(--t-mono)/1.4 var(--f-mono); letter-spacing: .06em; color: var(--c-muted);
}
.on-dark .figure figcaption { color: var(--c-muted-dark); }

.prose { max-width: 68ch; }
.prose p { color: inherit; }
.prose h2 { font-size: var(--t-h3); margin-top: var(--s-7); }
.prose h2:first-child { margin-top: 0; }

/* ---------- Chiffres clés ---------- */
.figures { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--c-line); }
.on-dark .figures { border-color: var(--c-line-dark); }
.figures div { padding: var(--s-6) var(--s-5) 0 0; }
.figures b {
  display: block; font: 500 clamp(2.4rem, 1.6rem + 2.6vw, 4rem)/1 var(--f-mono); letter-spacing: -.04em;
  color: var(--c-blue); margin-bottom: var(--s-3);
}
.on-dark .figures b { color: var(--c-sunset); }
.figures span { color: var(--c-muted); font-size: var(--t-small); display: block; max-width: 22ch; }
.on-dark .figures span { color: var(--c-muted-dark); }

/* ---------- Carte d'embarquement ---------- */
.passes { display: grid; gap: var(--s-6); }
.pass {
  --notch: 22px;
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr) minmax(200px, 3fr);
  background: var(--c-white); border-radius: var(--r-lg); overflow: hidden; color: var(--c-ink);
  position: relative; border: 1px solid var(--c-line);
}
.pass-media { position: relative; min-height: 280px; }
.pass-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pass-body { padding: var(--s-7) var(--s-6); }
.pass-body h3 { font-size: var(--t-h2); margin-bottom: var(--s-3); }
.pass-body p { color: var(--c-muted); max-width: 46ch; }
.pass-fields {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-4) var(--s-5);
  margin: var(--s-5) 0 0; padding-top: var(--s-5); border-top: 1px solid var(--c-line);
}
.pass-fields dt { font: 500 .68rem/1 var(--f-mono); letter-spacing: var(--tracking-mono); text-transform: uppercase; color: var(--c-muted); margin-bottom: 6px; }
.pass-fields dd { margin: 0; font: 500 1rem/1.3 var(--f-mono); }
.pass-stub {
  position: relative; padding: var(--s-7) var(--s-5); display: flex; flex-direction: column; justify-content: space-between; gap: var(--s-5);
  background: var(--c-white); border-left: 2px dashed var(--c-line);
}
.pass-stub::before, .pass-stub::after { /* encoches du talon */
  content: ""; position: absolute; left: calc(var(--notch) / -2 - 1px); width: var(--notch); height: var(--notch);
  border-radius: 50%; background: var(--c-paper-behind, var(--c-paper)); border: 1px solid var(--c-line);
}
.pass-stub::before { top: calc(var(--notch) / -2); }
.pass-stub::after { bottom: calc(var(--notch) / -2); }
.section--night .pass-stub::before, .section--night .pass-stub::after { background: var(--c-night); border-color: var(--c-night); }
.section--paper .pass-stub::before, .section--paper .pass-stub::after { background: var(--c-paper); border-color: var(--c-paper); }
.pass-code { font: 500 clamp(2.4rem, 1.8rem + 2vw, 3.4rem)/1 var(--f-mono); letter-spacing: -.03em; color: var(--c-blue); }
.pass-code small { display: block; font-size: .7rem; letter-spacing: var(--tracking-mono); color: var(--c-muted); margin-top: var(--s-2); text-transform: uppercase; }
.barcode {
  height: 44px; border-radius: 2px;
  background: repeating-linear-gradient(90deg, var(--c-ink) 0 2px, transparent 2px 4px, var(--c-ink) 4px 5px, transparent 5px 8px, var(--c-ink) 8px 11px, transparent 11px 12px);
  opacity: .85;
}

/* ---------- Route (parcours de formation) ---------- */
.route { position: relative; margin-top: var(--s-7); }
.route-line { position: absolute; left: 0; top: 11px; width: 100%; height: 2px; color: var(--c-sunset); overflow: visible; }
.route-line path { stroke-dasharray: 6 8; }
.route ol { position: relative; display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--s-5); list-style: none; }
.route li { padding-top: var(--s-7); position: relative; }
.route li::before { /* point de report : triangle aéro */
  content: ""; position: absolute; top: 0; left: 0; width: 24px; height: 24px;
  background: var(--c-night); border: 2px solid var(--c-sunset); transform: rotate(45deg) scale(.8);
}
.route li:last-child::before { background: var(--c-sunset); }
.route .wp { display: block; font: 500 var(--t-mono)/1 var(--f-mono); letter-spacing: var(--tracking-mono); color: var(--c-sky); margin-bottom: var(--s-3); }
.route h3 { font-size: 1.2rem; margin-bottom: var(--s-2); }
.route p { color: var(--c-muted-dark); font-size: var(--t-small); margin: 0; }

/* ---------- Tableau des départs (programme du cours) ---------- */
.board { border-top: 2px solid var(--c-ink); font-family: var(--f-mono); }
.on-dark .board { border-color: var(--c-white); }
.board-head, .board-row {
  display: grid; grid-template-columns: 5.5rem minmax(0, 1fr) 9rem; gap: var(--s-4); align-items: center;
  padding: var(--s-3) 0; border-bottom: 1px solid var(--c-line);
}
.on-dark .board-head, .on-dark .board-row { border-color: var(--c-line-dark); }
.board-head { font-size: .7rem; letter-spacing: var(--tracking-mono); text-transform: uppercase; color: var(--c-muted); }
.on-dark .board-head { color: var(--c-muted-dark); }
.board-row { font-size: .98rem; }
.board-row .code { color: var(--c-blue); font-weight: 500; }
.on-dark .board-row .code { color: var(--c-sky); }
.board-row .subject { font-family: var(--f-body); font-weight: 600; }
.board-row .status { font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: var(--c-ok); justify-self: end; }
.on-dark .board-row .status { color: var(--c-sunset); }
.board--two { display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--s-7); border-top: 0; }
.board--two > div { border-top: 2px solid currentColor; }

/* ---------- Liste de conditions ---------- */
.checklist { list-style: none; display: grid; gap: 0; counter-reset: item; border-top: 1px solid var(--c-line); }
.checklist li {
  counter-increment: item; display: grid; grid-template-columns: 3.5rem 1fr; gap: var(--s-4);
  padding: var(--s-5) 0; border-bottom: 1px solid var(--c-line);
}
.checklist li::before {
  content: counter(item, decimal-leading-zero); font: 500 1.4rem/1.2 var(--f-mono); color: var(--c-blue);
}
.checklist strong { display: block; font-family: var(--f-display); font-variation-settings: "wdth" var(--display-width); font-size: 1.2rem; margin-bottom: 4px; }
.checklist p { margin: 0; color: var(--c-muted); }

details.disclosure { margin-top: var(--s-6); border: 1px solid var(--c-line); border-radius: var(--r-md); background: var(--c-white); }
details.disclosure summary {
  cursor: pointer; list-style: none; padding: var(--s-4) var(--s-5); font-weight: 700;
  display: flex; justify-content: space-between; align-items: center; gap: var(--s-4);
}
details.disclosure summary::-webkit-details-marker { display: none; }
details.disclosure summary::after { content: "+"; font: 500 1.4rem/1 var(--f-mono); color: var(--c-blue); }
details.disclosure[open] summary::after { content: "−"; }
details.disclosure .disclosure-body { padding: 0 var(--s-5) var(--s-5); color: var(--c-muted); }
details.disclosure ul { padding-left: 1.2em; margin-bottom: 1em; }

/* ---------- Formats (initial / récurrent) ---------- */
.formats { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-5); }
.format { border: 1px solid var(--c-line-dark); border-radius: var(--r-lg); padding: var(--s-7) var(--s-6); }
.format b { display: block; font: 500 clamp(3.4rem, 2.4rem + 4vw, 6rem)/.9 var(--f-mono); letter-spacing: -.05em; color: var(--c-sunset); margin-bottom: var(--s-5); }
.format p { color: var(--c-muted-dark); margin: 0; }

/* ---------- Mosaïque photo ---------- */
.mosaic { display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: clamp(120px, 14vw, 200px); gap: var(--s-3); }
.mosaic figure { margin: 0; overflow: hidden; border-radius: var(--r-md); }
.mosaic img { width: 100%; height: 100%; object-fit: cover; transition: transform 900ms var(--ease-out); }
.mosaic figure:hover img { transform: scale(1.03); }
.mosaic .m1 { grid-column: 1 / span 7; grid-row: span 3; }
.mosaic .m2 { grid-column: 8 / span 5; grid-row: span 2; }
.mosaic .m3 { grid-column: 8 / span 5; grid-row: span 1; }

/* ---------- Bandeau d'appel ---------- */
.cta-band { position: relative; color: var(--c-white); background: var(--c-night); overflow: hidden; padding: var(--s-10) 0; }
.cta-band .page-hero-media::after { background: linear-gradient(to right, rgb(6 20 35 / .9), rgb(6 20 35 / .55) 60%, rgb(6 20 35 / .3)); }
.cta-band .container { position: relative; }
.cta-band h2 { max-width: 16ch; }
.cta-band .lead { color: rgb(255 255 255 / .82); margin-bottom: var(--s-6); }

/* ---------- Liste d'arguments ---------- */
.points { list-style: none; border-top: 1px solid var(--c-line); }
.points li { display: grid; grid-template-columns: 2.5rem 1fr; gap: var(--s-3); padding: var(--s-4) 0; border-bottom: 1px solid var(--c-line); }
.points li::before { content: "→"; font-family: var(--f-mono); color: var(--c-blue); }
.points strong { font-weight: 700; }
.points p { margin: 2px 0 0; color: var(--c-muted); }

/* ---------- Ressources ---------- */
.resources { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-5); }
.resource { display: flex; flex-direction: column; background: var(--c-white); border: 1px solid var(--c-line); border-radius: var(--r-lg); overflow: hidden; }
.resource img { aspect-ratio: 16 / 10; width: 100%; object-fit: cover; }
.resource-body { padding: var(--s-6) var(--s-5); display: flex; flex-direction: column; gap: var(--s-4); flex: 1; }
.resource-body h3 { margin: 0; }
.resource-body ul { list-style: none; font-size: var(--t-small); color: var(--c-muted); }
.resource-body li { padding: 6px 0; border-bottom: 1px solid var(--c-line); }
.resource-body li:last-child { border-bottom: 0; }
.resource-body .mono { color: var(--c-ink); font-size: .82rem; }
.resource-body .link-arrow { margin-top: auto; color: var(--c-blue); }
.tags { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; }
.tags li { font: 500 .75rem/1 var(--f-mono); padding: 7px 10px; border: 1px solid var(--c-line); border-radius: var(--r-sm); color: var(--c-ink); }


.contact-list { list-style: none; border-top: 1px solid var(--c-line-dark); margin-top: var(--s-6); }
.contact-list li { padding: var(--s-5) 0; border-bottom: 1px solid var(--c-line-dark); }
.contact-list dt, .contact-list .label { font: 500 .7rem/1 var(--f-mono); letter-spacing: var(--tracking-mono); text-transform: uppercase; color: var(--c-sky); margin-bottom: var(--s-2); display: block; }
.contact-list a, .contact-list address { overflow-wrap: anywhere; color: var(--c-white); font-style: normal; font-size: 1.15rem; font-weight: 600; text-decoration: none; }
.contact-list a:hover { color: var(--c-sunset); }

/* ---------- Pied de page ---------- */
.site-footer { background: var(--c-night); color: var(--c-muted-dark); padding: var(--s-9) 0 var(--s-6); }
.footer-top { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: var(--s-7); padding-bottom: var(--s-8); border-bottom: 1px solid var(--c-line-dark); }
.footer-brand img { height: 52px; width: auto; margin-bottom: var(--s-5); }
.footer-brand p { max-width: 32ch; margin: 0; }
.footer-col h2 { font: 500 .7rem/1 var(--f-mono); letter-spacing: var(--tracking-mono); text-transform: uppercase; color: var(--c-sky); margin-bottom: var(--s-5); }
.footer-col ul { list-style: none; display: grid; gap: var(--s-3); }
.footer-col a, .footer-col address { color: var(--c-white); text-decoration: none; font-style: normal; }
.footer-col a:hover { color: var(--c-sunset); }
.social { display: inline-flex; align-items: center; gap: var(--s-2); }
.social svg { width: 20px; height: 20px; }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s-4); padding-top: var(--s-6); font: 400 .78rem/1.4 var(--f-mono); letter-spacing: .04em; }

/* ---------- Mouvement : « entrer » et « révéler » (charte §6) ---------- */
.js-motion [data-enter] {
  opacity: 0; transform: translateY(40px); clip-path: inset(0 0 100% 0);
  transition: opacity var(--d-enter) var(--ease-out), transform var(--d-enter) var(--ease-out), clip-path var(--d-enter) var(--ease-out);
  transition-delay: calc(var(--i, 0) * var(--d-stagger));
}
.js-motion [data-enter].is-in { opacity: 1; transform: none; clip-path: inset(0 0 0 0); }
.js-motion .route-line { clip-path: inset(0 100% 0 0); transition: clip-path 1600ms var(--ease-inout); }
.js-motion .route.is-in .route-line { clip-path: inset(0 0 0 0); }

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

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
  .nav-toggle { display: grid; }
  .nav {
    position: fixed; inset: var(--header-h) 0 0; background: var(--c-night);
    flex-direction: column; align-items: stretch; justify-content: flex-start; gap: var(--s-6);
    padding: var(--s-6) var(--gutter) var(--s-8);
    visibility: hidden; opacity: 0; transform: translateY(-8px);
    transition: opacity var(--d-fast) ease, transform var(--d-fast) ease, visibility 0s linear var(--d-fast);
    box-shadow: 0 24px 40px rgb(0 0 0 / .3);
  }
  .nav[data-open] { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
  .nav ul { flex-direction: column; gap: 0; }
  .nav ul a:not(.btn) {
    display: block; padding: var(--s-4) 0; font-family: var(--f-display); font-variation-settings: "wdth" var(--display-width);
    font-size: 1.6rem; font-weight: 700; border-bottom: 1px solid var(--c-line-dark);
  }
  .nav ul a:not(.btn)::after { display: none; }
  .nav .nav-dropdown > button {
    display: flex; align-items: center; width: 100%; padding: var(--s-4) 0;
    font-family: var(--f-display); font-variation-settings: "wdth" var(--display-width);
    font-size: 1.6rem; font-weight: 700; text-align: left; border-bottom: 1px solid var(--c-line-dark);
  }
  .nav .nav-dropdown > button::after { display: none; }
  .nav .nav-dropdown > button[aria-expanded="true"] { color: var(--c-sunset); }
  .nav .nav-submenu {
    position: static; min-width: 0; padding: 0 0 0 var(--s-4); border: 0; border-radius: 0;
    background: transparent; box-shadow: none;
  }
  .nav .nav-submenu a:not(.btn) { padding: var(--s-3) 0; font-size: 1.15rem; white-space: normal; }
  .nav ul a[aria-current="page"] { color: var(--c-sunset); }
  .nav .btn { align-self: flex-start; }
  .site-header:has(.nav[data-open]) { background: var(--c-night); }
  .pass { grid-template-columns: 1fr; }
  .pass-media { min-height: 240px; }
  .pass-stub { border-left: 0; border-top: 2px dashed var(--c-line); flex-direction: row; align-items: center; }
  .pass-stub::before, .pass-stub::after { top: calc(var(--notch) / -2 - 1px); bottom: auto; }
  .pass-stub::before { left: calc(var(--notch) / -2); }
  .pass-stub::after { left: auto; right: calc(var(--notch) / -2); }
  .pass-stub .barcode { flex: 1; max-width: 220px; }
  .footer-top { grid-template-columns: 1fr 1fr; }
  .resources { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 860px) {
  .section-head, .split, .formats, .board--two { grid-template-columns: 1fr; }
  .split > *, .split--wide-media > *, .split--reverse > * { grid-column: 1 / -1 !important; order: 0 !important; }
  .figure img { aspect-ratio: 4 / 3; }
  .flight-strip dl { grid-template-columns: 1fr 1fr; }
  .flight-strip div:nth-child(3) { padding-left: 0; border-left: 0; }
  .flight-strip div:nth-child(n + 3) { border-top: 1px solid var(--c-line-dark); }
  .figures { grid-template-columns: 1fr 1fr; }
  .route ol { grid-template-columns: 1fr; gap: 0; padding-left: var(--s-7); }
  .route li { padding: 0 0 var(--s-6); }
  .route li::before { left: calc(-1 * var(--s-7)); }
  .route-line { left: 11px; top: 0; width: 2px; height: 100%; background: repeating-linear-gradient(to bottom, currentColor 0 6px, transparent 6px 14px); }
  .route-line path { display: none; }
  .js-motion .route-line { clip-path: inset(0 0 100% 0); }
  .mosaic { grid-template-columns: 1fr 1fr; grid-auto-rows: 160px; }
  .mosaic .m1 { grid-column: 1 / -1; grid-row: span 2; }
  .mosaic .m2, .mosaic .m3 { grid-column: span 1; grid-row: span 1; }
  .resources { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  :root { --header-h: 64px; }
  .logo img { height: 44px; }
  .pass-fields { grid-template-columns: 1fr 1fr; }
  .board-head, .board-row { grid-template-columns: 4rem minmax(0, 1fr); }
  .board .status { display: none; }
  .footer-top { grid-template-columns: 1fr; }
  .hero h1 { font-size: clamp(2.5rem, 11vw, 3.4rem); }
}

/* ---------- Panneau contact ---------- */
.contact-panel { background: var(--c-night); color: var(--c-white); border-radius: var(--r-lg); padding: clamp(24px, 4vw, 48px); }
.contact-panel h2 { font-size: var(--t-h3); }
.contact-panel .mono { color: var(--c-white); }
.figure--focus-right img { object-position: 82% 50%; }