/* Prépa Périclès — feuille de styles principale */

:root {
  --navy: #1a2a4a;
  --navy-hover: #243860;
  --ink: #101216;
  --text: #2c313b;
  --text-soft: #40454f;
  --text-muted: #5c626e;
  --text-faint: #8a909c;
  --border: #e3e5ea;
  --border-soft: #e6e8ee;
  --bg-soft: #f5f6f8;
  --error: #9b2226;
  --ocre: #a8741a;
  /* Simulateur « Trouver son concours » : fond légèrement jauni pour le détacher des pages de contenu */
  --sim-fond: #fdfbf3;
  --sim-fond-fort: #f8f2df;
  --sim-trait: #ece5cf;
  --hand: 'Patrick Hand', cursive;
  --serif: 'Libre Baskerville', Georgia, serif;
  --sans: 'Public Sans', system-ui, -apple-system, sans-serif;
}

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  background: #ffffff;
  color: var(--ink);
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

a { color: var(--navy); text-decoration: none; }
a:hover { color: #3a5289; }
input, textarea, select, button { font-family: inherit; }
::selection { background: var(--navy); color: #fff; }
img { max-width: 100%; }

.wrap { max-width: 1320px; margin: 0 auto; padding-left: clamp(18px, 4vw, 56px); padding-right: clamp(18px, 4vw, 56px); }
.wrap-narrow { max-width: 820px; margin: 0 auto; padding-left: clamp(18px, 4vw, 56px); padding-right: clamp(18px, 4vw, 56px); }
.wrap-article { max-width: 760px; margin: 0 auto; padding-left: clamp(18px, 4vw, 56px); padding-right: clamp(18px, 4vw, 56px); }

/* ---------- Header ---------- */

.site-header {
  position: sticky;
  top: 0;
  background: #fff;
  z-index: 40;
  border-bottom: 1px solid var(--navy);
}

.header-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 16px clamp(18px, 4vw, 56px);
  max-width: 1320px;
  margin: 0 auto;
}

.logo-link { display: flex; align-items: center; flex-shrink: 0; }
.logo-link img { height: 42px; width: auto; display: block; }

.desktop-nav {
  display: none;
  align-items: center;
  gap: 30px;
}

.nav-links {
  display: flex;
  gap: 28px;
  font-size: 13.5px;
  font-weight: 500;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.nav-links a {
  color: var(--ink);
  border-bottom: 1px solid transparent;
  padding-top: 3px;
  padding-bottom: 2px;
}
.nav-links a[aria-current="page"],
.nav-links a[aria-current="true"] {
  color: var(--navy);
  border-bottom-color: var(--navy);
}

/* « Prépa Concours » dropdown — opens on hover and keyboard focus, no JavaScript.
   The wrapper's vertical padding keeps the pointer inside it on the way down to the panel. */
.nav-dropdown { position: relative; padding: 22px 0; margin: -22px 0; }
/* Inside the wrapper the link is no longer a flex item: make it a block again so it sits like its siblings. */
.nav-dropdown > a { display: block; }
.nav-dropdown-panel {
  display: none;
  position: absolute;
  top: 100%;
  left: -20px;
  z-index: 50;
  background: #fff;
  border: 1px solid var(--navy);
  padding: 16px 20px 14px;
  box-shadow: 0 10px 30px rgba(16, 18, 22, 0.08);
  font-size: 15px;
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
}
.nav-dropdown:hover .nav-dropdown-panel,
.nav-dropdown:focus-within .nav-dropdown-panel { display: block; }
.nav-dropdown-title { font-size: 12px; font-weight: 600; letter-spacing: 0.22em; text-transform: uppercase; color: var(--navy); margin: 0 0 6px; }
.nav-dropdown-panel ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.nav-dropdown-panel li > a,
.nav-dropdown-panel li > span { display: flex; align-items: center; padding: 5px 0; font-family: var(--serif); font-size: 15px; line-height: 1.35; color: var(--ink); white-space: nowrap; border-bottom: 0; }
.nav-dropdown-panel li > a:hover { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }
.nav-dropdown-panel li > a[aria-current="page"] { color: var(--ink); border-bottom: 0; }
.nav-dropdown-panel li > a[aria-current="page"]::before { content: ""; width: 18px; height: 1px; margin-right: 10px; background: var(--navy); }

.btn-contact-header {
  border: 1px solid var(--navy);
  color: var(--navy);
  padding: 11px 22px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}
.btn-contact-header:hover { background: var(--navy); color: #fff; }

/* Mobile menu — <details>/<summary>, works with zero JavaScript */
.mobile-menu { display: block; }
.mobile-menu > summary {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: none;
  padding: 10px 4px;
  cursor: pointer;
  width: 24px;
}
.mobile-menu > summary::-webkit-details-marker { display: none; }
.mobile-menu > summary span {
  display: block;
  width: 20px;
  height: 1.5px;
  background: var(--navy);
}
.mobile-menu[open] > summary span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.mobile-menu[open] > summary span:nth-child(2) { opacity: 0; }
.mobile-menu[open] > summary span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* The open panel drops below the header bar (not beside the logo) and fills the screen,
   so the Contact button pinned at its bottom is always in view. */
.mobile-panel {
  display: flex;
  flex-direction: column;
  padding: 4px 18px 0;
  border-top: 1px solid var(--border-soft);
}
.mobile-menu[open] .mobile-panel {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  height: calc(100vh - var(--header-h, 75px));
  height: calc(100dvh - var(--header-h, 75px));
  overflow-y: auto;
  background: #fff;
  border-bottom: 1px solid var(--navy);
}
.mobile-panel a {
  padding: 16px 0;
  border-bottom: 1px solid var(--border-soft);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink);
}
/* « Concours préparés » : a native <details> styled like the other menu lines; « + » opens the grid of concours */
.m-concours { border-bottom: 1px solid var(--border-soft); }
.m-concours > summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 0; cursor: pointer; font-size: 15px; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink); }
.m-concours > summary::-webkit-details-marker { display: none; }
.m-concours > summary::after { content: "+"; flex: none; color: var(--navy); font-size: 22px; font-weight: 400; line-height: 1; letter-spacing: 0; }
.m-concours[open] > summary::after { content: "−"; }
.m-concours[open] > summary { padding-bottom: 10px; }
.m-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 14px; }
.mobile-panel .m-grid a { padding: 12px 10px; border: 1px solid var(--border); font-family: var(--serif); font-size: 15px; font-weight: 400; letter-spacing: normal; text-transform: none; line-height: 1.3; color: var(--ink); }
.mobile-panel .m-grid a[aria-current="page"] { border-color: var(--navy); box-shadow: inset 0 0 0 1px var(--navy); }
.m-grid small { display: block; margin-top: 2px; font-family: var(--sans); font-size: 11px; line-height: 1.35; color: var(--text-muted); }
.m-spacer { flex: 1; }
.m-bottom { position: sticky; bottom: 0; margin-top: 10px; padding: 12px 0 18px; background: #fff; border-top: 1px solid var(--border-soft); }
.mobile-panel a.btn-contact-mobile {
  display: block;
  margin-top: 0;
  background: var(--navy);
  color: #fff;
  text-align: center;
  padding: 15px;
  font-size: 14px;
  border-bottom: none;
}

/* Four menu entries since « Trouver son concours »: the desktop menu needs about 1000px, so it starts at 1024px
   and is tightened up to 1199px. Links never wrap onto two lines. */
.nav-links a { white-space: nowrap; }
@media (min-width: 1024px) {
  .desktop-nav { display: flex; }
  .mobile-menu { display: none; }
}
@media (min-width: 1024px) and (max-width: 1199px) {
  .desktop-nav { gap: 22px; }
  .nav-links { gap: 20px; font-size: 12.5px; letter-spacing: 0.05em; }
  .btn-contact-header { padding: 11px 16px; }
}

/* ---------- Buttons ---------- */

.btn {
  display: inline-block;
  background: var(--navy);
  color: #fff;
  padding: 17px 32px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  border: none;
  cursor: pointer;
}
.btn:hover { background: var(--navy-hover); color: #fff; }

.btn-outline {
  display: inline-block;
  border: 1px solid var(--navy);
  color: var(--navy);
  padding: 12px 22px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.btn-outline:hover { background: var(--navy); color: #fff; }

/* ---------- Eyebrow / kicker ---------- */

.eyebrow {
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--navy);
  margin: 0 0 24px;
  display: flex;
  align-items: center;
  gap: 14px;
}
.eyebrow::before {
  content: "";
  width: 28px;
  height: 1px;
  background: var(--navy);
  display: inline-block;
}

/* ---------- Hero (accueil) ---------- */

.hero {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
  gap: clamp(32px, 5vw, 80px);
  align-items: start;
  padding: clamp(48px, 7vw, 104px) clamp(18px, 4vw, 56px) clamp(44px, 6vw, 84px);
  max-width: 1320px;
  margin: 0 auto;
}
.hero h1 {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(29px, 3.3vw, 43px);
  line-height: 1.28;
  margin: 0 0 28px;
  text-wrap: pretty;
}
.hero-lead {
  font-size: 17.5px;
  line-height: 1.8;
  color: var(--text);
  font-weight: 400;
  margin: 0 0 16px;
  max-width: 56ch;
}
.hero-cta { margin-top: 0; }

/* Target of the mobile menu's « Concours » link: clear the sticky header */
#concours, #a-qui-s-adresse { scroll-margin-top: 90px; }

.hero-side {
  border-left: 1px solid var(--navy);
  padding-left: clamp(22px, 3vw, 44px);
}
.hero-side h2 {
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--navy);
  margin: 0 0 22px;
}
.hero-list {
  list-style: none;
  padding: 0;
  margin: 0 0 34px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.hero-list li { font-family: var(--serif); font-size: 17px; line-height: 1.5; }
/* Concours with their own page: underlined so they read as links */
.hero-list a { color: var(--navy); text-decoration: underline; text-decoration-color: #c9ccd4; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.hero-list a:hover { color: var(--navy-hover); text-decoration-color: currentColor; }
.hero-ref { font-size: 15px; line-height: 1.7; color: var(--text-muted); font-weight: 300; margin: 0; font-style: italic; }
/* Mobile-only pieces of the hero (column watermark, scroll button): hidden on wider screens. */
.hero-column, .hero-more { display: none; }

/* Bottoms of both hero columns line up: CTA button, side border and closing line end together. */
@media (min-width: 601px) {
  .hero { align-items: stretch; }
  .hero > div:first-child { display: flex; flex-direction: column; align-items: flex-start; }
  .hero-cta { margin-top: auto; }
  .hero-side { display: flex; flex-direction: column; }
  .hero-ref { margin-top: auto; }
}
/* Two hero columns sit side by side from 759px: drop the closing line so its baseline meets the CTA's bottom edge. */
@media (min-width: 759px) {
  .hero-ref { position: relative; top: 0.5em; }
}

/* ---------- Generic sections ---------- */

.section { padding: clamp(48px, 7vw, 96px) clamp(18px, 4vw, 56px); max-width: 1320px; margin: 0 auto; }
.section-border { border-top: 1px solid var(--border); }
.section h2.h2-serif {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(24px, 3vw, 36px);
  margin: 0 0 30px;
}
.section h2.h2-eyebrow {
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--navy);
  margin: 0 0 28px;
}

.prose { display: flex; flex-direction: column; gap: 20px; max-width: 760px; }
.prose p { margin: 0; }
.prose .lead { font-size: 18px; line-height: 1.75; color: var(--text); font-weight: 300; }

/* Méthode Périclès (navy band) */
.band-navy { background: var(--navy); color: #fff; padding: clamp(52px, 8vw, 104px) clamp(18px, 4vw, 56px); }
.band-navy .inner { max-width: 1320px; margin: 0 auto; }
.band-navy h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(25px, 3.2vw, 38px); margin: 0 0 20px; }
.band-navy > .inner > p { font-size: 17px; font-weight: 300; color: #ccd5e7; margin: 0 0 clamp(36px, 5vw, 60px); max-width: 66ch; line-height: 1.8; }

.grid-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: clamp(26px, 3vw, 48px); }
.card-navy { border-top: 1px solid rgba(255, 255, 255, 0.4); padding-top: 22px; }
.card-navy .num { font-family: var(--serif); font-size: 14px; color: #ccd5e7; margin: 0 0 12px; }
.card-navy h3 { font-family: var(--serif); font-weight: 400; font-size: 20px; margin: 0 0 14px; line-height: 1.4; }
.card-navy p { font-size: 15.5px; line-height: 1.8; color: #dde3ee; font-weight: 300; margin: 0; }

/* With the three method cards on one row, they share row tracks (number / title / text) so every text starts under the tallest title.
   925px rather than the 907px layout switch leaves room for classic 17px scrollbars, where cards are still on two rows. */
@media (min-width: 925px) {
  .home .grid-cards { grid-template-rows: auto auto auto; row-gap: 0; }
  .home .card-navy { display: grid; grid-template-rows: subgrid; grid-row: span 3; }
}

.card-navy-alt { border-top: 1px solid rgba(255, 255, 255, 0.4); padding-top: 20px; }
.card-navy-alt h3 { font-family: var(--serif); font-weight: 400; font-size: 19px; margin: 0 0 12px; }
.card-navy-alt p { font-size: 15.5px; line-height: 1.8; color: #dde3ee; font-weight: 300; margin: 0; }

/* Épreuves */
.grid-2col { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: clamp(28px, 4vw, 64px); align-items: start; }
.epreuve-col { border-top: 2px solid var(--navy); padding-top: 20px; }
.epreuve-col p.label { font-size: 12px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-muted); margin: 0 0 18px; }
.epreuve-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.epreuve-col li { font-family: var(--serif); font-size: 17.5px; line-height: 1.55; }

/* Comment nous travaillons */
.grid-3col { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: clamp(24px, 2.6vw, 44px); }
.grid-3col > div { display: flex; flex-direction: column; gap: 12px; }
.grid-3col h3 { font-family: var(--serif); font-weight: 400; font-size: 19px; margin: 0; }
.grid-3col p { font-size: 16px; line-height: 1.8; color: var(--text-soft); font-weight: 300; margin: 0; }

/* Équipe / tarif */
.grid-team { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: clamp(28px, 4vw, 64px); }
.grid-team h2 { font-size: 12.5px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--navy); margin: 0; }
.grid-team p { font-size: 17px; line-height: 1.8; color: var(--text); font-weight: 300; margin: 0; }
.team-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  column-gap: 24px;
  margin-bottom: 28px;
}
.team-price { border-left: 1px solid var(--navy); padding-left: clamp(22px, 3vw, 40px); }
.team-price .price { font-family: var(--serif); font-size: clamp(26px, 3vw, 34px); line-height: 1.4; margin: 0; }
.team-price .price span { font-family: var(--sans); font-size: 16px; font-weight: 300; color: var(--text-muted); }
.grid-team p.body { font-size: 16px; line-height: 1.8; color: var(--text-soft); font-weight: 300; margin: 0 0 14px; }
.team-price p.muted { font-size: 16px; line-height: 1.8; color: var(--text-muted); font-weight: 300; margin: 0; }

/* Side by side, the left heading gets an invisible strut in the price's font so both heading rows share the price's height and baseline. */
@media (min-width: 683px) {
  .grid-team > div:first-child .team-head::after {
    content: "\200b";
    font-family: var(--serif);
    font-size: clamp(26px, 3vw, 34px);
    line-height: 1.4;
  }
}

/* ---------- Pages simples (oral, méthode) ---------- */

.page-intro { padding: clamp(48px, 7vw, 100px) clamp(18px, 4vw, 56px) clamp(36px, 5vw, 64px); max-width: 820px; margin: 0 auto; }
.page-intro h1 { font-family: var(--serif); font-weight: 400; font-size: clamp(28px, 3.6vw, 44px); line-height: 1.3; margin: 0 0 30px; }
.page-intro p { font-size: 17.5px; line-height: 1.85; color: var(--text); font-weight: 300; margin: 0 0 20px; }
.page-intro p:last-child { margin-bottom: 0; }

.cta-split {
  padding: clamp(44px, 6vw, 88px) clamp(18px, 4vw, 56px);
  max-width: 1320px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 28px;
  align-items: center;
  justify-content: space-between;
}
.cta-split h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(23px, 2.8vw, 34px); margin: 0; max-width: 24ch; }

/* ---------- Fiches méthode (liste) ---------- */

.fiches-intro { padding: clamp(48px, 7vw, 100px) clamp(18px, 4vw, 56px) clamp(32px, 4vw, 56px); max-width: 1320px; margin: 0 auto; }
.fiches-intro h1 { font-family: var(--serif); font-weight: 400; font-size: clamp(28px, 3.6vw, 44px); line-height: 1.3; margin: 0 0 22px; }
.fiches-intro p { font-size: 17.5px; line-height: 1.85; color: var(--text-soft); font-weight: 300; margin: 0; max-width: 64ch; }

.fiches-list { padding: 0 clamp(18px, 4vw, 56px) clamp(48px, 7vw, 96px); max-width: 1320px; margin: 0 auto; display: flex; flex-direction: column; border-top: 1px solid var(--border); }
.fiche-row {
  background: #fff;
  border-bottom: 1px solid var(--border);
  padding: clamp(26px, 3.5vw, 40px) 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 24px;
  align-items: start;
}
.fiche-row .num { font-size: 12px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--text-faint); margin: 0 0 12px; }
.fiche-row h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(20px, 2.2vw, 26px); line-height: 1.4; margin: 0; max-width: 24ch; }
.fiche-row .resume { font-size: 16px; line-height: 1.8; color: var(--text-soft); font-weight: 300; margin: 0 0 20px; max-width: 52ch; }
.fiche-row .actions { display: flex; gap: 14px; flex-wrap: wrap; }

/* ---------- Fiche détail ---------- */

.fiche-article { padding: clamp(40px, 6vw, 88px) clamp(18px, 4vw, 56px) clamp(48px, 7vw, 96px); max-width: 760px; margin: 0 auto; }
.fiche-back { font-size: 13px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); }
.fiche-article h1 { font-family: var(--serif); font-weight: 400; font-size: clamp(25px, 3.1vw, 38px); line-height: 1.35; margin: 28px 0 20px; }
.fiche-body { display: flex; flex-direction: column; gap: 26px; margin-top: 28px; }
.fiche-body h2 { font-family: var(--serif); font-weight: 400; font-size: 23px; line-height: 1.4; margin: 10px 0 0; border-top: 1px solid var(--navy); padding-top: 26px; }

/* Fiche with a sommaire: same pattern as the pages concours (desktop column, mobile bar). */
.fiche { --header-h: 75px; }
.fiche-layout { max-width: 1100px; margin: 0 auto; padding: 0 clamp(18px, 4vw, 56px); display: grid; grid-template-columns: minmax(0, 1fr); gap: 64px; }
.fiche-layout .fiche-article { padding-left: 0; padding-right: 0; margin: 0; max-width: none; }
.fiche-body h2[id] { scroll-margin-top: calc(var(--header-h) + 76px); }
@media (min-width: 900px) {
  .fiche-layout { grid-template-columns: 230px minmax(0, 760px); justify-content: center; }
  .fiche-body h2[id] { scroll-margin-top: calc(var(--header-h) + 16px); }
}
.fiche-body h3 { font-size: 12.5px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--navy); margin: 0; }
.fiche-body p { font-size: 17px; line-height: 1.85; color: var(--text); font-weight: 300; margin: 0; }
.fiche-body p.exemple { font-size: 16px; line-height: 1.85; color: var(--text-soft); font-weight: 300; margin: 0; border-left: 2px solid #d8dbe3; padding-left: 20px; font-style: italic; }
.fiche-body ul, .fiche-body ol { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 10px; font-size: 16.5px; line-height: 1.8; color: var(--text); font-weight: 300; }
.fiche-body .callout { background: var(--bg-soft); border-left: 3px solid var(--navy); padding: 26px 26px 26px 24px; }
.fiche-body .callout > p { font-size: 16px; font-weight: 500; color: var(--ink); margin: 0 0 16px; line-height: 1.7; }
.fiche-body .callout ul { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 12px; font-size: 16px; line-height: 1.8; color: var(--text-soft); font-weight: 300; }
.fiche-table-wrap { overflow-x: auto; }
.fiche-body table { border-collapse: collapse; width: 100%; min-width: 520px; }
.fiche-body th, .fiche-body td { padding: 14px 16px; font-size: 15px; line-height: 1.65; text-align: left; vertical-align: top; border-bottom: 1px solid var(--border); font-weight: 300; color: var(--text); }
.fiche-body th { font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--navy); border-bottom: 1px solid var(--navy); }
.fiche-body td:first-child { font-weight: 500; color: var(--ink); }

.fiche-footer-cta {
  margin-top: clamp(44px, 6vw, 72px);
  border-top: 1px solid var(--navy);
  padding-top: 32px;
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: center;
  justify-content: space-between;
}
.fiche-footer-cta p { font-family: var(--serif); font-size: 20px; margin: 0; max-width: 28ch; line-height: 1.5; }

/* ---------- Contact ---------- */

.contact-grid {
  padding: clamp(44px, 6vw, 96px) clamp(18px, 4vw, 56px);
  max-width: 1320px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
  gap: clamp(34px, 5vw, 80px);
  align-items: start;
}
.contact-grid h1 { font-family: var(--serif); font-weight: 400; font-size: clamp(27px, 3.3vw, 40px); line-height: 1.3; margin: 0 0 24px; }
.contact-intro { font-size: 17px; line-height: 1.85; color: var(--text); font-weight: 300; margin: 0; max-width: 52ch; }

.contact-blocks { display: flex; flex-direction: column; gap: 1px; background: var(--border); border: 1px solid var(--border); margin-top: clamp(20px, 6vw, 56px); }
.contact-blocks a { background: #fff; padding: 20px 22px; display: flex; justify-content: space-between; align-items: center; gap: 16px; color: var(--ink); }
.contact-blocks a:hover { background: #f6f7f9; }
.contact-blocks .label { font-size: 12px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-faint); }
.contact-blocks .value { font-family: var(--serif); font-size: 16px; color: var(--ink); }

.contact-form-col { border-left: 1px solid var(--navy); padding-left: clamp(22px, 3vw, 44px); }
.contact-confirm h2 { font-family: var(--serif); font-weight: 400; font-size: 24px; margin: 0 0 14px; }
.contact-confirm p { font-size: 16px; line-height: 1.8; color: var(--text-soft); font-weight: 300; margin: 0; }

form.contact-form { display: flex; flex-direction: column; gap: 20px; }
.field { display: flex; flex-direction: column; gap: 8px; }
.field label { font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-muted); }
.field input, .field textarea {
  border: none;
  border-bottom: 1px solid #c9ccd4;
  padding: 11px 0;
  font-size: 16px;
  color: var(--ink);
  background: transparent;
  outline: none;
}
.field textarea { border: 1px solid #c9ccd4; padding: 12px; resize: vertical; }
.field input:focus, .field textarea:focus { border-color: var(--navy); }
.field input:focus { border-bottom-color: var(--navy); }
.honeypot-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-error { font-size: 14px; color: var(--error); margin: 0; }
.btn-submit { align-self: flex-start; }

/* ---------- Mentions légales ---------- */

.legal-page { padding: clamp(44px, 6vw, 96px) clamp(18px, 4vw, 56px); max-width: 760px; margin: 0 auto; }
.legal-page h1 { font-family: var(--serif); font-weight: 400; font-size: clamp(25px, 3vw, 36px); line-height: 1.35; margin: 0 0 36px; }
.legal-blocs { display: flex; flex-direction: column; gap: 28px; }
.legal-bloc h2 { font-family: var(--serif); font-weight: 400; font-size: 20px; margin: 0 0 14px; line-height: 1.4; }
.legal-bloc .content { display: flex; flex-direction: column; gap: 14px; }
.legal-bloc p { font-size: 16px; line-height: 1.85; color: var(--text-soft); font-weight: 300; margin: 0; }
.legal-bloc ul { margin: 0; padding: 0 0 0 20px; display: flex; flex-direction: column; gap: 8px; }
.legal-bloc li { font-size: 16px; line-height: 1.85; color: var(--text-soft); font-weight: 300; }

/* ---------- Merci (contact) ---------- */

.merci-page { padding: clamp(64px, 10vw, 140px) clamp(18px, 4vw, 56px); max-width: 640px; margin: 0 auto; text-align: left; }
.merci-page h1 { font-family: var(--serif); font-weight: 400; font-size: clamp(27px, 3.3vw, 40px); line-height: 1.3; margin: 0 0 20px; }
.merci-page p { font-size: 17px; line-height: 1.85; color: var(--text); font-weight: 300; margin: 0 0 28px; }

/* ---------- Pages concours (gabarit : /concours/<concours>/) ---------- */

/* --header-h: height of the sticky .site-header (16px padding x2 + 42px logo + 1px border). */
.concours { --header-h: 75px; }

.visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.concours-layout {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 clamp(18px, 4vw, 56px) 40px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 64px;
}

/* Sommaire — desktop column */
.toc-aside { display: none; }
.toc-aside nav { position: sticky; top: calc(var(--header-h) - 40px); padding-top: 72px; }
.toc-title { font-size: 12px; font-weight: 600; letter-spacing: 0.22em; text-transform: uppercase; color: var(--navy); margin: 0 0 18px; }
.toc-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.toc-list a { display: flex; align-items: baseline; padding: 7px 0; font-size: 15px; line-height: 1.35; color: var(--text-soft); }
.toc-list a::before { content: ""; flex: none; align-self: center; width: 0; height: 1px; margin-right: 0; background: var(--navy); transition: width .25s, margin-right .25s; }
.toc-list a:hover { color: var(--navy); }
.toc-list a[aria-current="location"] { color: var(--navy); font-weight: 600; }
.toc-list a[aria-current="location"]::before { width: 22px; margin-right: 12px; }
.toc-maj { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--border); font-size: 13px; color: var(--text-muted); }

/* Sommaire — mobile bar under the header */
.toc-mobile { position: sticky; top: var(--header-h); z-index: 30; background: #fff; border-bottom: 1px solid var(--border); }
.toc-mobile summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 52px;
  padding: 10px clamp(18px, 4vw, 56px);
  cursor: pointer;
}
.toc-mobile summary::-webkit-details-marker { display: none; }
.toc-mobile-head { display: flex; flex-direction: column; line-height: 1.3; }
.toc-mobile-kicker { font-size: 11px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--navy); }
.toc-mobile-current { font-size: 15px; color: var(--ink); }
.toc-mobile-chevron { font-size: 14px; color: var(--navy); transition: transform .2s; }
.toc-mobile[open] .toc-mobile-chevron { transform: rotate(180deg); }
.toc-mobile-list { list-style: none; margin: 0; padding: 4px clamp(18px, 4vw, 56px) 14px; border-top: 1px solid var(--border-soft); display: flex; flex-direction: column; }
.toc-mobile-list a { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 10px 0; font-size: 15px; color: var(--text-soft); }
.toc-mobile-list a span { width: 18px; font-size: 12px; color: var(--text-muted); }
.toc-mobile-list a[aria-current="location"] { color: var(--navy); font-weight: 600; }

@media (min-width: 900px) {
  .concours-layout { grid-template-columns: 230px minmax(0, 1fr); }
  .toc-aside { display: block; }
  .toc-mobile { display: none; }
}

/* Sections */
.concours-section { padding: 64px 0; border-bottom: 1px solid var(--border); scroll-margin-top: calc(var(--header-h) + 76px); }
@media (min-width: 900px) { .concours-section { scroll-margin-top: calc(var(--header-h) + 16px); } }
.concours-section h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(26px, 3.2vw, 38px); line-height: 1.25; margin: 0 0 32px; }
.concours-section .eyebrow { margin-bottom: 14px; }

/* 01 En-tête */
.concours-head { padding: 72px 0 56px; }
.concours-head .eyebrow { margin-bottom: 22px; }
.concours-head h1 { font-family: var(--serif); font-weight: 400; font-size: clamp(30px, 4.4vw, 52px); line-height: 1.18; letter-spacing: -0.01em; margin: 0 0 20px; text-wrap: balance; }
.concours-organisme { font-family: var(--serif); font-size: clamp(18px, 1.9vw, 22px); line-height: 1.5; margin: 0 0 28px; }
.concours-meta { display: flex; flex-wrap: wrap; gap: 12px 40px; margin: 0; font-size: 14px; }
.concours-meta div { display: flex; gap: 8px; }
.concours-meta dt { color: var(--text-muted); }
.concours-meta dd { margin: 0; font-weight: 500; }
.concours-alert { margin-top: 36px; background: var(--bg-soft); border-left: 3px solid var(--navy); padding: 20px 24px 22px; }
.concours-alert-label { margin: 0 0 8px; font-size: 12px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--navy); }
.concours-alert p:last-child { margin: 0; font-size: 15px; line-height: 1.7; }

/* 02 Chiffres clefs — one block per voie (1 to 3), side by side when each gets 330px, stacked otherwise */
.kf { container-type: inline-size; }
.kf-voies { display: grid; grid-template-columns: minmax(0, 1fr); }
.kf-voie { padding: 28px 0 26px; display: flex; flex-direction: column; gap: 26px; min-width: 0; container-type: inline-size; }
.kf-voie + .kf-voie { border-top: 1px solid var(--navy); }
.kf-voie h3 { font-family: var(--serif); font-weight: 400; font-size: 22px; line-height: 1.25; margin: 0; }
@container (min-width: 660px) {
  .kf-voies[data-voies="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kf-voies[data-voies="2"] .kf-voie + .kf-voie { border-top: 0; border-left: 1px solid var(--navy); padding-left: 40px; }
  .kf-voies[data-voies="2"] .kf-voie:not(:last-child) { padding-right: 40px; }
}
@container (min-width: 990px) {
  .kf-voies[data-voies="3"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .kf-voies[data-voies="3"] .kf-voie + .kf-voie { border-top: 0; border-left: 1px solid var(--navy); padding-left: 40px; }
  .kf-voies[data-voies="3"] .kf-voie:not(:last-child) { padding-right: 40px; }
}
/* Items share row tracks (figure / label) so labels line up even next to a « non publié ». */
.kf-ind { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr) minmax(0, 1.3fr); grid-template-rows: auto auto; }
.kf-item { display: grid; grid-row: span 2; grid-template-rows: subgrid; row-gap: 10px; align-content: start; min-width: 0; }
.kf-item:not(:last-child) { margin-right: 12px; }
.kf-item + .kf-item { border-left: 1px solid var(--border); padding-left: 12px; }
/* Handwritten figures stay real text; all sit upright on one shared baseline. */
.kf-num { font-family: var(--hand); font-size: min(62px, 10.45cqi); font-weight: 400; line-height: 1; color: var(--ocre); white-space: nowrap; margin: 0; }
.kf-unit { font-size: 0.6em; margin-left: 0.12em; }
.kf-label { font-size: 13px; line-height: 1.4; color: var(--text-soft); margin: 0; }
.kf-na { align-self: end; font-size: 15px; font-style: italic; line-height: 1.3; color: var(--text-muted); margin: 0; }

/* Voies beyond externe / interne: folded under a button */
.kf-more { margin-top: 4px; }
.kf-more > summary,
.voie-toggle > summary { list-style: none; cursor: pointer; }
.kf-more > summary::-webkit-details-marker,
.voie-toggle > summary::-webkit-details-marker { display: none; }
.kf-more > summary { display: inline-flex; align-items: center; gap: 7px; min-height: 30px; padding: 6px 12px; border: 1px solid var(--navy); color: var(--navy); font-size: 11px; font-weight: 600; letter-spacing: 0.07em; text-transform: uppercase; }
.kf-more > summary:hover { background: var(--navy); color: #fff; }
.kf-more > summary::before,
.voie-toggle > summary::after { content: "+"; font-size: 18px; line-height: 1; font-weight: 400; }
.kf-more > summary::before { font-size: 13px; }
.kf-more[open] > summary::before,
.voie-toggle[open] > summary::after { content: "−"; }
.kf-more .when-open,
.kf-more[open] .when-closed { display: none; }
.kf-more[open] .when-open { display: inline; }
.kf-more > .kf { margin-top: 8px; border-top: 1px solid var(--navy); }
.kf-notes { margin-top: 20px; display: flex; flex-direction: column; gap: 4px; font-size: 13px; line-height: 1.55; color: var(--text-muted); }
.kf-notes p { margin: 0; }

/* 03 Le Brief */
.concours-prose { max-width: 720px; display: flex; flex-direction: column; gap: 18px; }
.concours-prose p { margin: 0; font-size: 18px; line-height: 1.75; color: var(--text); font-weight: 300; text-wrap: pretty; }

/* 04 Les épreuves — récapitulatif */
.epreuves-wrap { border-top: 1px solid var(--navy); margin-bottom: 48px; }
.epreuves-table { width: calc(100% + 24px); margin: 0 -12px; border-collapse: collapse; line-height: 1.3; }
.epreuves-table th, .epreuves-table td { text-align: left; vertical-align: baseline; padding: 5px 16px 5px 0; }
.epreuves-table th:first-child, .epreuves-table td:first-child { padding-left: 12px; }
.epreuves-table th:last-child, .epreuves-table td:last-child { padding-right: 12px; text-align: right; width: 100px; }
.epreuves-table th:nth-child(2), .epreuves-table td:nth-child(2) { width: 30%; }
@media (min-width: 1100px) { .epreuves-table th:nth-child(2), .epreuves-table td:nth-child(2) { width: 260px; } }
/* Column headers: the rule stops at the text edges, rows' grey band bleeds 12px on each side. */
.epreuves-table thead th {
  padding-top: 6px;
  padding-bottom: 6px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--navy);
  background: linear-gradient(var(--navy), var(--navy)) no-repeat bottom / 100% 1px;
}
.epreuves-table thead th:first-child { background-position: right bottom; background-size: calc(100% - 12px) 1px; }
.epreuves-table thead th:last-child { background-position: left bottom; background-size: calc(100% - 12px) 1px; }
.epreuves-table tbody th[scope="rowgroup"] { padding: 10px 12px 4px; font-size: 11px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--navy); text-align: left; }
.epreuves-table tbody:first-of-type th[scope="rowgroup"] { padding-top: 8px; }
/* Space between the written and the oral groups */
.epreuves-table tbody + tbody th[scope="rowgroup"] { padding-top: 32px; }
/* Table of differences with the concours externe: three text columns */
.epreuves-table.is-diff th:nth-child(2), .epreuves-table.is-diff td:nth-child(2) { width: 24%; }
.epreuves-table.is-diff th:last-child, .epreuves-table.is-diff td:last-child { width: 40%; text-align: left; }
.epreuves-table.is-diff td:last-child { font-size: 13px; }
.epreuves-table td { background: var(--bg-soft); border-bottom: 1px solid var(--border); font-size: 13px; color: var(--text-soft); }
.epreuves-table td:first-child { font-family: var(--serif); font-size: 15px; color: var(--ink); }
.epreuves-table td:last-child { font-size: 14px; }
.cell-na { font-style: italic; color: var(--text-muted); }
/* Narrowest phones: slimmer coefficient column so the table fits */
@media (max-width: 400px) {
  .epreuves-table { table-layout: fixed; }
  .epreuves-table th:last-child, .epreuves-table td:last-child { width: 48px; }
  .epreuves-table th, .epreuves-table td { padding-right: 10px; overflow-wrap: break-word; }
  /* « Coefficient » does not fit: shown as « Coef. » (the full word stays in the markup) */
  .epreuves-table thead th:last-child { font-size: 0; letter-spacing: 0; }
  .epreuves-table thead th:last-child::after { content: "Coef."; font-size: 11px; letter-spacing: 0.1em; }
  .epreuves-table.is-diff th:last-child, .epreuves-table.is-diff td:last-child { width: 40%; }
  .epreuves-table.is-diff thead th:last-child { font-size: 11px; letter-spacing: 0.1em; }
  .epreuves-table.is-diff thead th:last-child::after { content: none; }
}

/* 04 Les épreuves — présentation */
.concours-subhead { margin: 0 0 20px; font-size: 13px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink); display: flex; align-items: center; gap: 14px; }
.concours-subhead::before { content: ""; width: 24px; height: 1px; background: currentColor; }
.concours-subhead.is-oral { color: var(--navy); }

/* Épreuves propres à chaque voie: one clickable heading per voie, content shown on click */
.epreuves-intro { max-width: 720px; margin: 0 0 28px; font-size: 16px; line-height: 1.7; color: var(--text); font-weight: 300; }
.voies-epreuves { margin-bottom: 40px; border-bottom: 1px solid var(--navy); }
.voie-toggle { border-top: 1px solid var(--navy); }
.voie-toggle > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 56px; padding: 14px 0; font-family: var(--serif); font-size: 21px; line-height: 1.3; color: var(--ink); }
.voie-toggle > summary:hover { color: var(--navy); }
.voie-toggle > summary::after { flex: none; color: var(--navy); font-size: 24px; }
.voie-toggle-body { padding: 8px 0 12px; }
.voie-toggle-body .epreuves-wrap,
.voie-toggle-body .blocs-ecrits { margin-bottom: 36px; }
.voie-toggle-body > p { max-width: 720px; margin: 0 0 24px; font-size: 16px; line-height: 1.7; color: var(--text); font-weight: 300; }

/* Écrits: cards share row tracks (meta / title / text) so every text starts on the same line. */
.blocs-ecrits { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 8px 20px; margin-bottom: 48px; }
.bloc-ecrit { border-top: 2px solid var(--ink); padding-top: 16px; margin-bottom: 12px; display: grid; grid-row: span 3; grid-template-rows: subgrid; row-gap: 8px; align-content: start; }
.bloc-meta { font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-muted); margin: 0; }
.bloc-ecrit h4, .bloc-oral h4 { font-family: var(--serif); font-weight: 400; font-size: 19px; line-height: 1.35; margin: 0; }
.bloc-ecrit p:last-child, .bloc-oral p:last-child { font-size: 15px; line-height: 1.65; color: var(--text-soft); font-weight: 300; margin: 0; }

.blocs-oraux { display: flex; flex-wrap: wrap; gap: 20px; margin-bottom: 40px; align-items: stretch; }
.bloc-oral { flex: 1 1 260px; background: var(--bg-soft); padding: 22px 22px 24px; display: flex; flex-direction: column; gap: 8px; }
.bloc-oral .bloc-meta { letter-spacing: 0.1em; color: var(--navy); }
@media (min-width: 760px) { .bloc-oral .bloc-meta { white-space: nowrap; } }

.poids-oral { background: var(--navy); color: #fff; padding: 32px 36px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 20px 40px; align-items: start; }
.poids-oral > div { display: flex; flex-direction: column; gap: 10px; }
.poids-oral-kicker { font-size: 12px; font-weight: 600; letter-spacing: 0.22em; text-transform: uppercase; color: #ccd5e7; }
.poids-oral h3 { font-family: var(--serif); font-weight: 400; font-size: 24px; line-height: 1.3; margin: 0; }
.poids-oral p { margin: 0; font-size: 16px; line-height: 1.7; color: #dde3ee; font-weight: 300; }

/* 05 Le regard du jury — cards share row tracks (épreuve / phrase-clé / observations) */
.jury-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 20px; }
.jury-card { border: 1px solid var(--border); padding: 26px 26px 24px; display: grid; grid-row: span 3; grid-template-rows: subgrid; row-gap: 16px; align-content: start; }
.jury-epreuve { font-size: 12px; font-weight: 600; line-height: 1.5; letter-spacing: 0.16em; text-transform: uppercase; color: var(--navy); margin: 0; }
.jury-cle { font-family: var(--serif); font-size: 19px; line-height: 1.45; color: var(--ink); margin: 0; padding-bottom: 16px; border-bottom: 1px solid var(--border); }
.jury-obs { display: flex; flex-direction: column; gap: 10px; }
.jury-obs p { margin: 0; font-size: 15px; line-height: 1.65; color: var(--text-soft); font-weight: 300; }

.dash-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.dash-list li { display: flex; gap: 10px; font-size: 15px; line-height: 1.55; color: var(--text-soft); font-weight: 300; }
.dash-list li::before { content: "—"; color: var(--navy); }

/* 06 Règles éliminatoires et voies d'accès */
.regles-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 40px; }
.regles-grid h3 { margin: 0 0 16px; font-size: 13px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--navy); }
.rule-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--navy); }
.rule-list li { padding: 14px 0; border-bottom: 1px solid var(--border); display: flex; gap: 14px; font-size: 16px; line-height: 1.65; color: var(--text); font-weight: 300; }
.rule-list li::before { content: "—"; color: var(--navy); }

/* 07 Calendrier — vertical list by default, one-line timeline when each step gets 110px */
.cal-wrap { container-type: inline-size; }
/* One timeline per voie when their dates differ */
.concours-subhead.cal-voie { margin: 36px 0 0; }
.cal-voie + .cal-wrap .cal { margin-top: 24px; }
.cal { list-style: none; margin: 36px 0 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); }
.cal li { position: relative; border-left: 1px solid var(--navy); padding: 0 0 26px 26px; display: flex; flex-direction: column; gap: 6px; }
.cal li::before { content: ""; position: absolute; left: -7px; top: 2px; width: 13px; height: 13px; box-sizing: border-box; border-radius: 50%; background: #fff; border: 2px solid var(--navy); }
.cal-step { font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--navy); }
.cal-date { font-family: var(--serif); font-size: 16px; line-height: 1.4; color: var(--ink); }
.cal-date.is-na { font-family: var(--sans); font-size: 14px; font-style: italic; color: var(--text-muted); }
@container (min-width: 660px) {
  .cal:not(.is-long) { grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); grid-template-rows: auto auto; }
  /* Steps share row tracks so every date starts on the same line, even under a two-line step name. */
  .cal:not(.is-long) li { border-left: 0; border-top: 1px solid var(--navy); padding: 26px 14px 0 0; display: grid; grid-row: span 2; grid-template-rows: subgrid; row-gap: 6px; align-content: start; }
  .cal:not(.is-long) li::before { left: 0; top: -7px; }
}
/* Seven steps or more (.is-long) need 110px each before going horizontal. */
@container (min-width: 800px) {
  .cal.is-long { grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); grid-template-rows: auto auto; }
  .cal.is-long li { border-left: 0; border-top: 1px solid var(--navy); padding: 26px 14px 0 0; display: grid; grid-row: span 2; grid-template-rows: subgrid; row-gap: 6px; align-content: start; }
  .cal.is-long li::before { left: 0; top: -7px; }
}
.next-session { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; background: var(--navy); color: #fff; padding: 10px 18px; margin-top: 44px; font-size: 14px; }
.next-session-label { font-size: 12px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; }
.next-session-sep { width: 1px; height: 16px; background: #6c7aa0; }
.next-session-text { font-style: italic; }
.concours-section h2 + .next-session { margin-top: 0; }

/* 08 Liens officiels */
.concours-section.is-last { border-bottom: 0; padding-bottom: 72px; }
.official-links { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--navy); max-width: 720px; }
.official-links li { border-bottom: 1px solid var(--border); }
.official-links a { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; align-items: center; gap: 18px; min-height: 44px; padding: 18px 4px; color: var(--ink); }
.official-links a:hover { background: var(--bg-soft); color: var(--navy); }
.official-check { width: 22px; height: 22px; border: 1.5px solid var(--navy); display: flex; align-items: center; justify-content: center; font-size: 14px; line-height: 1; color: var(--navy); }
.official-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.official-label { font-family: var(--serif); font-size: 17px; line-height: 1.4; }
.official-url { font-size: 13px; color: var(--text-muted); overflow-wrap: anywhere; }
.official-arrow { font-size: 16px; color: var(--navy); }

/* Prise de contact */
.concours-contact { border-top: 1px solid var(--navy); padding: 64px 0 24px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 32px 64px; align-items: center; }
.concours-contact .eyebrow { margin-bottom: 20px; }
.concours-contact h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(20px, 1.8vw, 23px); line-height: 1.4; margin: 0; max-width: 26ch; text-wrap: balance; }
.concours-contact-action { display: flex; flex-direction: column; gap: 24px; align-items: flex-start; }
.concours-contact-action p { margin: 0; font-size: 17px; line-height: 1.7; color: var(--text); font-weight: 300; }
/* One line where the two columns leave room for it; wraps on tablets and phones. */
/* The button sits centred between the edges of the text above and below it: the column is exactly as wide as
   its longest line (fixed line break in the paragraph), and the button is centred in that column.
   When the column is too narrow, it falls back to the full width and the text wraps normally. */
.concours-contact-action { width: max-content; max-width: 100%; }
/* Two columns side by side: the action column takes exactly its text width, the heading takes the rest. */
@media (min-width: 1280px) { .concours-contact { grid-template-columns: minmax(0, 1fr) max-content; } }
.concours-contact-action .btn { align-self: center; }
@media (min-width: 900px) { .concours-contact .btn { white-space: nowrap; } }

@media (max-width: 600px) {
  .concours-head { padding: 40px 0 40px; }
  .concours-section { padding: 48px 0; }
  .poids-oral { padding: 26px 22px; }
  .jury-card { padding: 22px 20px 20px; }
  .concours-contact .btn { text-align: center; align-self: stretch; }
}

/* ---------- Footer ---------- */

.site-footer { background: var(--bg-soft); border-top: 1px solid var(--border); padding: clamp(32px, 4vw, 48px) clamp(18px, 4vw, 56px); }
.footer-inner {
  max-width: 1320px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 20px 32px;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
  color: #6b7280;
}
.footer-links { display: flex; flex-wrap: wrap; gap: 24px; }
.footer-links a { color: #6b7280; }

main { flex: 1; }

/* ---------- Accueil : ajustements mobile uniquement ---------- */

@media (max-width: 600px) {
  .home .hero,
  .home .grid-cards,
  .home .grid-2col,
  .home .grid-3col,
  .home .grid-team { grid-template-columns: minmax(0, 1fr); }

  .home .eyebrow { margin-bottom: 16px; font-size: 11.5px; }

  /* First screen: header + hero fill the viewport; text and buttons centred in the space below the header. */
  .home .site-header { background: #f2f4f8; border-bottom-color: #f2f4f8; }
  .home #concours, .home #a-qui-s-adresse { scroll-margin-top: 75px; }
  .home .hero { display: block; padding: 0; }
  .home .hero-main {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - var(--header-h, 75px));
    min-height: calc(100svh - var(--header-h, 75px));
    box-sizing: border-box;
    padding: 0 24px 24px;
    background: #f2f4f8;
  }
  .home .hero-main > * { position: relative; }
  .home .hero-main > .hero-column { display: block; position: absolute; right: -196px; top: 88px; height: 440px; width: auto; max-width: none; opacity: 0.05; pointer-events: none; }
  .home .hero .eyebrow { margin: auto 0 22px; font-size: 12px; letter-spacing: 0.22em; }
  .home .hero .eyebrow::before { display: none; }
  .home .hero h1 { font-size: min(30px, 7.5vw); line-height: 1.12; letter-spacing: -0.01em; color: var(--navy); margin: 0 0 34px; text-wrap: wrap; }
  .home .hero-lead { font-size: 16px; line-height: 1.6; color: var(--text-soft); margin: 0; }
  .home .hero-more,
  .home .hero-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 56px;
    box-sizing: border-box;
    padding: 0 16px;
    border-radius: 28px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    white-space: nowrap;
  }
  .home .hero-more { margin-top: 75px; background: #fff; border: 1px solid var(--navy); color: var(--navy); }
  .home .hero-more:hover { background: var(--navy); color: #fff; }
  .home .hero-cta { margin: 10px 0 auto; }
}
/* Narrowest phones: tighter tracking keeps both button labels on one line. */
@media (max-width: 350px) {
  .home .hero-more, .home .hero-cta { letter-spacing: 0.04em; }
}
@media (max-width: 600px) {

  /* Concours: one bordered row per concours, arrow on the right. */
  .home .hero-side { border-left: 0; padding: 32px 24px 40px; }
  .home .hero-side h2 { font-size: 12px; letter-spacing: 0.22em; margin-bottom: 14px; }
  .home .hero-list { gap: 0; margin-bottom: 22px; }
  .home .hero-list li { font-size: 16px; line-height: 1.35; border-top: 1px solid var(--border); }
  .home .hero-list a { display: flex; justify-content: space-between; align-items: center; gap: 14px; min-height: 44px; box-sizing: border-box; padding: 12px 0; color: var(--ink); text-decoration: none; }
  .home .hero-list a::after { content: "→"; content: "→" / ""; font-family: var(--sans); color: var(--navy); }
  .home .hero-ref { font-size: 14.5px; }

  .home .section { padding-top: 40px; padding-bottom: 40px; }
  .home .section h2.h2-serif { font-size: 23px; margin-bottom: 20px; }
  .home .section h2.h2-eyebrow { margin-bottom: 20px; }
  .home .prose { gap: 14px; }
  .home .prose .lead { font-size: 17px; line-height: 1.65; }

  .home .band-navy { padding-top: 44px; padding-bottom: 44px; }
  .home .band-navy h2 { font-size: 24px; margin-bottom: 14px; }
  .home .band-navy > .inner > p { font-size: 16px; line-height: 1.7; margin-bottom: 30px; }
  .home .grid-cards { gap: 26px; }
  .home .card-navy { padding-top: 18px; }
  .home .card-navy .num { margin-bottom: 8px; }
  .home .card-navy h3 { font-size: 19px; margin-bottom: 10px; }
  .home .card-navy p { font-size: 15px; line-height: 1.7; }

  .home .grid-2col { gap: 28px; }
  .home .epreuve-col { padding-top: 16px; }
  .home .epreuve-col p.label { margin-bottom: 14px; }
  .home .epreuve-col ul { gap: 9px; }
  .home .epreuve-col li { font-size: 16.5px; }

  .home .grid-3col { gap: 24px; }
  .home .grid-3col > div { gap: 8px; }
  .home .grid-3col h3 { font-size: 18px; }
  .home .grid-3col p { font-size: 15.5px; line-height: 1.7; }

  .home .grid-team { gap: 30px; }
  .home .team-head { margin-bottom: 14px; }
  .home .grid-team p { font-size: 16px; line-height: 1.7; }
  .home .team-price .price { font-size: 26px; }
  .home .grid-team p.body, .home .team-price p.muted { font-size: 15.5px; line-height: 1.7; }
}

/* ---------- Trouver son concours (simulateur d'orientation) ---------- */
/* Every class is prefixed « sim- » so nothing collides with the rest of the site.
   The questions and results are rendered by /js/simulateur.js; the questions fréquentes are plain HTML in the page. */

.sim-intro { padding-bottom: clamp(28px, 4vw, 44px); }
.sim-bande { background: var(--sim-fond); border-top: 1px solid var(--sim-trait); padding-top: clamp(32px, 5vw, 56px); }
.sim-intro p b { font-weight: 500; color: var(--ink); }
.sim { max-width: 820px; margin: 0 auto; padding: 0 clamp(18px, 4vw, 56px) clamp(48px, 7vw, 96px); scroll-margin-top: 96px; box-sizing: border-box; }
.sim *, .sim *::before, .sim *::after { box-sizing: border-box; }
.sim h2 { font-family: var(--serif); font-weight: 400; font-size: 21px; line-height: 1.4; color: var(--ink); margin: 0 0 8px; text-wrap: pretty; }
.sim ul { margin: 8px 0 0; padding-left: 20px; }
.sim li { font-size: 16px; line-height: 1.65; color: var(--text); font-weight: 300; margin: 4px 0; }
.sim-cache { display: none; }

/* Progression */
.sim-barre { height: 2px; background: var(--sim-trait); overflow: hidden; margin-bottom: 12px; }
.sim-barre i { display: block; height: 100%; width: 0; background: var(--navy); transition: width .3s ease; }
.sim-compteur { font-size: 12px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 24px; }

/* Question card */
.sim-carte { background: #fff; border: 1px solid var(--sim-trait); padding: clamp(22px, 3.4vw, 34px); }
.sim-duree { font-size: 12px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--navy); margin: 0 0 14px; }
.sim-aide { font-size: 16px; line-height: 1.7; color: var(--text-soft); font-weight: 300; margin: 0 0 22px; }
.sim-choix { display: flex; flex-direction: column; gap: 10px; margin: 0 0 28px; }
.sim-opt { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; border: 1px solid var(--sim-trait); background: #fff; cursor: pointer; font-size: 16px; line-height: 1.55; color: var(--text); transition: border-color .15s, background-color .15s; }
.sim-opt:hover { border-color: var(--navy); }
.sim-opt.actif { border-color: var(--navy); box-shadow: inset 0 0 0 1px var(--navy); background: var(--sim-fond-fort); color: var(--ink); }
.sim-opt input { flex: none; margin: 4px 0 0; accent-color: var(--navy); }
.sim-opt span { flex: 1; min-width: 0; }
.sim-rang { display: none; flex: none; width: 24px; height: 24px; align-items: center; justify-content: center; background: var(--navy); color: #fff; font-size: 12px; font-style: normal; font-weight: 600; }
.sim-opt.actif .sim-rang:not(:empty) { display: flex; }

/* Buttons: the site's .btn and .btn-outline, made to work on <button> and set to one height */
.sim-nav { display: flex; flex-wrap: wrap; gap: 12px; align-items: stretch; }
.sim-nav .btn, .sim-nav .btn-outline { padding: 15px 28px; font-size: 13px; line-height: 1.2; }
.sim-nav .btn-outline { background: #fff; cursor: pointer; }
.sim-nav .btn[disabled] { opacity: .4; cursor: not-allowed; }
.sim-nav .btn[disabled]:hover { background: var(--navy); }
.sim-nav-fin { margin-top: 24px; }
.sim-lien { background: none; border: 0; padding: 6px 0; cursor: pointer; font-size: 13px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); text-decoration: underline; text-underline-offset: 4px; }
.sim-lien:hover { color: var(--navy); }

/* Results */
.sim h2.sim-titre-resultat { font-size: clamp(23px, 2.6vw, 30px); margin-bottom: 10px; }
.sim-resultat { border: 1px solid var(--sim-trait); border-left: 3px solid var(--navy); background: #fff; margin-bottom: 16px; }
.sim-resultat > summary { list-style: none; cursor: pointer; display: flex; align-items: flex-start; gap: 16px; padding: 22px 24px; }
.sim-resultat > summary::-webkit-details-marker { display: none; }
.sim-resultat > summary::after { content: "+"; flex: none; margin-left: auto; color: var(--navy); font-size: 24px; line-height: 1.1; font-weight: 400; }
.sim-resultat[open] > summary::after { content: "−"; }
.sim-resultat > summary:hover h2 { color: var(--navy); }
.sim-resultat > summary:focus-visible { outline: 2px solid var(--navy); outline-offset: -2px; }
.sim-tete { flex: 1; min-width: 0; }
.sim-rangement { font-size: 12px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--navy); margin-bottom: 8px; }
.sim-sous { font-size: 15px; line-height: 1.6; color: var(--text-muted); margin: 0 0 14px; }
.sim-faits { display: flex; flex-wrap: wrap; gap: 8px; }
.sim-fait { border: 1px solid var(--sim-trait); background: var(--sim-fond); padding: 5px 10px; font-size: 13px; line-height: 1.4; color: var(--text-soft); }
.sim-corps { border-top: 1px solid var(--sim-trait); padding: 20px 24px 24px; }
.sim-bloc { margin: 0 0 16px; font-size: 16px; line-height: 1.7; color: var(--text); font-weight: 300; }
.sim-bloc b, .sim-bloc-titre { display: block; margin-bottom: 4px; font-size: 12px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--navy); }
.sim-vigilance { border-left: 2px solid var(--ocre); padding-left: 14px; }
.sim-vigilance b { color: var(--ink); }
.sim-fiche, .sim-sobre { color: var(--navy); text-decoration: underline; text-decoration-color: #c9ccd4; text-underline-offset: 4px; }
.sim-fiche { font-size: 15px; font-weight: 600; }
.sim-fiche:hover, .sim-sobre:hover { color: var(--navy-hover); text-decoration-color: currentColor; }
.sim-ecartes { margin-top: 8px; }
.sim-vide { background: #fff; border: 1px solid var(--sim-trait); border-left: 3px solid var(--ocre); padding: clamp(22px, 3.4vw, 34px); margin-bottom: 18px; }
.sim-vide ul { margin-top: 4px; }
.sim-vide .sim-nav { margin-top: 8px; }

/* Call to action, drawn like the « Accompagnement individuel » block of the pages concours */
.sim-appel { border-top: 1px solid var(--navy); margin-top: 40px; padding-top: 32px; }
.sim .sim-appel h2 { font-size: clamp(22px, 2.2vw, 26px); line-height: 1.35; margin-bottom: 14px; }
.sim-appel p { font-size: 17px; line-height: 1.7; color: var(--text); font-weight: 300; margin: 0 0 24px; max-width: 60ch; }

/* Questions fréquentes: native <details>, written in the page */
.sim-faq { margin-top: 64px; padding-top: 40px; border-top: 1px solid var(--navy); }
.sim .sim-faq h2 { font-size: clamp(22px, 2.4vw, 28px); margin-bottom: 24px; }
.sim-faq details { border-top: 1px solid var(--sim-trait); }
.sim-faq details:last-of-type { border-bottom: 1px solid var(--sim-trait); }
.sim-faq summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 56px; padding: 14px 0; font-family: var(--serif); font-size: 18px; line-height: 1.4; color: var(--ink); }
.sim-faq summary::-webkit-details-marker { display: none; }
.sim-faq summary::after { content: "+"; flex: none; color: var(--navy); font-family: var(--sans); font-size: 24px; line-height: 1; }
.sim-faq details[open] summary::after { content: "−"; }
.sim-faq summary:hover { color: var(--navy); }
.sim-faq details p { font-size: 16px; line-height: 1.75; color: var(--text); font-weight: 300; margin: 0 0 14px; }
.sim-faq details p:last-of-type { margin-bottom: 22px; }
.sim-note { margin: 48px 0 0; padding-top: 18px; border-top: 1px solid var(--sim-trait); font-size: 14px; line-height: 1.7; color: var(--text-muted); font-weight: 300; }

@media (max-width: 520px) {
  .sim-resultat > summary { padding: 18px 16px; }
  .sim-corps { padding: 18px 16px 20px; }
  .sim-opt { padding: 13px 14px; }
  .sim-nav .btn, .sim-nav .btn-outline { flex: 1 1 auto; text-align: center; }
}

/* Link to the simulator at the foot of each page concours */
.concours-contact-action p.concours-contact-sim { font-size: 15px; color: var(--text-muted); }
.concours-contact-sim a { white-space: nowrap; color: var(--navy); font-weight: 500; text-decoration: underline; text-decoration-color: #c9ccd4; text-underline-offset: 4px; }
.concours-contact-sim a:hover { text-decoration-color: currentColor; }