/* Corrections de contraste RGAA / WCAG 2.1 AA.
   Texte courant : 4,5:1 minimum ; composants et grands textes : 3:1. */
:root {
  /* 5,93:1 avec le blanc et 5,15:1 avec le fond creme. */
  --orange: #a94424;
  /* 5,05:1 sur le fond creme, contre 4,42:1 auparavant. */
  --muted: #5d6863;
}

/* Petits libelles places sur les fonds clairs. */
.kicker,
.eyebrow {
  color: #557366;
}

/* Les textes secondaires des aplats orange restaient sous 4,5:1. */
.support-grid > div > p:not(.kicker),
.supportlist span,
.supportlist p,
.cta p {
  color: #fff;
}

/* Le focus doit rester nettement visible sur tous les champs et boutons. */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 3px solid #a94424;
  outline-offset: 3px;
}

.field input:focus,
.field textarea:focus {
  outline-color: #a94424;
}

.field input,
.field textarea,
.captcha-row span {
  border-color: #66716c;
}

/* Boite d'accessibilite : bordures de commandes >= 3:1 et texte blanc lisible. */
.a11y-group,
html.a11y-contrast .a11y-group {
  border-color: #a94424 !important;
}

.a11y-close,
html.a11y-contrast .a11y-close {
  border-color: #557366 !important;
}

.a11y-panel button:not(.a11y-close),
.a11y-size-value,
html.a11y-contrast .a11y-panel button:not(.a11y-close):not([aria-pressed="true"]),
html.a11y-contrast .a11y-size-value {
  border-color: #557366 !important;
}

.a11y-reset,
html.a11y-contrast .a11y-panel .a11y-reset {
  background: #a94424 !important;
  color: #fff !important;
  border-color: #a94424 !important;
}

.a11y-launcher:hover,
.a11y-launcher:focus-visible {
  background: #a94424;
  outline-color: #fff;
}

/* En contraste eleve, le jaune conserve plus de 15:1 sur le noir. */
html.a11y-contrast a,
html.a11y-contrast main a,
html.a11y-contrast header a,
html.a11y-contrast footer a {
  color: #ffe05c !important;
}

/* Titre de la maquette décorative de la page d'accueil. */
.mockbody h2 {
  font: 18px var(--serif);
  margin: 0 0 12px;
  letter-spacing: normal;
}

/* En-tete centre de la section Fonctionnalites de l'accueil. */
.section-heading { text-align: center; }
.section-heading .kicker { display: flex; justify-content: center; align-items: center; }
.section-heading h2 { font-size: clamp(44px, 4.3vw, 64px); }
.section-heading > p:last-child { color: #b8c8c0; }

/* Petits numeros des etapes : 5,05:1 au lieu de 2,73:1. */
.steps span { color: #5d6863; }

/* Textes auparavant affiches entre 10 et 11 px. */
.eyebrow,
.kicker {
  font-size: 13px;
  line-height: 1.5;
}

.crumb,
.hero-tag,
.legal-meta span,
.steps span,
.supportlist span,
.poster small,
.poster p,
.copyright,
.site-footer .copyright {
  font-size: 12px;
  line-height: 1.5;
}

/* Navigation principale : couleurs opaques pour éviter les alertes
   "very low contrast" provoquées par opacity:.8/.82. */
body > header,
.site-head,
body > header .nav,
.site-head .nav {
  background-color: #173f3a;
}

body > header .brand,
.site-head .brand,
header nav a,
.site-head nav a {
  color: #fff;
  opacity: 1;
}

body > header .headcta,
.site-head .headcta {
  background-color: #173f3a;
  color: #fff;
  border-color: #fff;
  opacity: 1;
}

header nav a:hover,
header nav a:focus-visible,
.site-head nav a:hover,
.site-head nav a:focus-visible,
.site-head nav a.active {
  color: #e9bd46;
  opacity: 1;
}

/* Navigation secondaire : 6,59:1 sur fond blanc. */
.subnav a {
  color: #53605a;
  opacity: 1;
}

.subnav a:hover,
.subnav a:focus-visible {
  color: #a94424;
}

.site-footer a[aria-current="page"] {
  color: #e9bd46;
  font-weight: 700;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

/* Bouton d'accessibilite assorti au theme, sans emoji bleu du navigateur. */
.a11y-launcher {
  background: #173f3a;
  color: #e9bd46;
  border-color: #f4efe3;
}

.a11y-launcher svg {
  width: 30px;
  height: 30px;
  display: block;
}

.a11y-launcher:hover,
.a11y-launcher:focus-visible {
  background: #e9bd46;
  color: #173f3a;
  border-color: #173f3a;
}

/* Rendu plus net des grandes fontes serif : evite les franges colorees
   du lissage sous-pixel et regularise l'espacement des caracteres. */
.hero h1,
.page-hero h1,
.section h2,
.section h3 {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-kerning: normal;
  font-synthesis: none;
}

.hero h1,
.page-hero h1 {
  letter-spacing: -0.02em;
}

/* Maquette du catalogue sur l'accueil : WAVE controle aussi les contenus
   decoratifs masques aux lecteurs d'ecran. Tous les textes passent 4,5:1. */
.scene .browserbar {
  color: #53605a;
  background: #edf0ed;
  font-size: 12px;
  line-height: 1.2;
}

.scene .browserbar span {
  color: #53605a;
  font-size: 12px;
}

.scene .mockhead > small,
.scene .search,
.scene .search span,
.scene .books b,
.scene .books small,
.scene .float b,
.scene .float small {
  font-size: 12px;
  line-height: 1.25;
}

.scene .search,
.scene .search span,
.scene .books small,
.scene .float small {
  color: #53605a;
}

.scene .books article > div {
  background: #6b4438;
  color: #fff;
  font-size: 12px;
}

.scene .books article:nth-child(2) > div {
  background: #70461f;
}

.scene .books article:nth-child(3) > div {
  background: #3f5d56;
}

/* Libelles des deux derniers blocs de l'accueil. */
.support .kicker {
  color: #fff;
}

.support .kicker::before {
  background: #173f3a;
}

.cta .kicker {
  color: #4f6d60;
}

.cta .kicker::before {
  background: #a94424;
}

/* Les panneaux inactifs restent masques malgre la grille de mise en page. */
.panels .panel[hidden] {
  display: none;
}
