/* ============================================================
   BASE : reset, variables, polices, typographie de base
   Chargé sur toutes les pages publiques et sur le sélecteur de pays.

   Repris du site 2023 (assets/css/styles.css + styles_site.css) : les
   blocs TinyMCE repris du legacy ont été écrits pour CES réglages, et
   notamment pour une racine à 62,5 % (1rem = 10px). Un bloc qui porte
   style="font-size: 2.7rem" (bandeau ban__txt2, par exemple) vaut donc
   27px, comme en 2023. Les feuilles de page peuvent reprendre les valeurs
   en rem du legacy telles quelles.
   ============================================================ */

/* ----- Reset ------------------------------------------------------------- */
html, body, p, ol, ul, li, dl, dt, dd, blockquote, figure, fieldset, legend,
textarea, pre, iframe, hr, h1, h2, h3, h4, h5, h6 {
    margin: 0;
    padding: 0;
}

/* Le legacy remettait TOUT à plat (styles.css, sélecteur universel) : ni gras
   ni italique ni soulignement implicites. Le gras des blocs passe par la police
   AvenirLTStd-Black (voir b, strong plus bas), jamais par une graisse
   synthétique ; les styles posés dans un bloc (style="…") restent prioritaires. */
* {
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
}

ul, ol {
    list-style: none;
}

button, input, select {
    margin: 0;
    font-family: inherit;
}

button {
    background: none;
    border: 0;
    cursor: pointer;
    color: inherit;
    font: inherit;
}

html {
    box-sizing: border-box;
}

*, *::before, *::after {
    box-sizing: inherit;
}

img, video, svg {
    max-width: 100%;
    height: auto;
}

a {
    color: inherit;
}

iframe {
    border: 0;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

td, th {
    padding: 0;
}

details > summary {
    list-style: none;
    cursor: pointer;
}

details > summary::-webkit-details-marker {
    display: none;
}

/* ----- Polices ----------------------------------------------------------- */
@font-face {font-family: 'AvenirLTStd-Heavy';src: url('webfonts/3328A9_0_0.eot');src: url('webfonts/3328A9_0_0.eot?#iefix') format('embedded-opentype'),url('webfonts/3328A9_0_0.woff2') format('woff2'),url('webfonts/3328A9_0_0.woff') format('woff'),url('webfonts/3328A9_0_0.ttf') format('truetype');}

@font-face {font-family: 'AvenirLTStd-Roman';src: url('webfonts/3328A9_1_0.eot');src: url('webfonts/3328A9_1_0.eot?#iefix') format('embedded-opentype'),url('webfonts/3328A9_1_0.woff2') format('woff2'),url('webfonts/3328A9_1_0.woff') format('woff'),url('webfonts/3328A9_1_0.ttf') format('truetype');}

@font-face {font-family: 'AvenirLTStd-Light';src: url('webfonts/3328A9_2_0.eot');src: url('webfonts/3328A9_2_0.eot?#iefix') format('embedded-opentype'),url('webfonts/3328A9_2_0.woff2') format('woff2'),url('webfonts/3328A9_2_0.woff') format('woff'),url('webfonts/3328A9_2_0.ttf') format('truetype');}

@font-face {font-family: 'AvenirLTStd-Black';src: url('webfonts/3328A9_3_0.eot');src: url('webfonts/3328A9_3_0.eot?#iefix') format('embedded-opentype'),url('webfonts/3328A9_3_0.woff2') format('woff2'),url('webfonts/3328A9_3_0.woff') format('woff'),url('webfonts/3328A9_3_0.ttf') format('truetype');}

@font-face {font-family: 'AvenirLTStd-Medium';src: url('webfonts/2FB6B6_0_0.eot');src: url('webfonts/2FB6B6_0_0.eot?#iefix') format('embedded-opentype'),url('webfonts/2FB6B6_0_0.woff2') format('woff2'),url('webfonts/2FB6B6_0_0.woff') format('woff'),url('webfonts/2FB6B6_0_0.ttf') format('truetype'),url('webfonts/2FB6B6_0_0.svg#wf') format('svg');}

@font-face {font-family: 'Aveline';src: url('webfonts/aveline.ttf') format('truetype'),url('webfonts/aveline.otf') format('opentype');}

/* ----- Variables (design tokens) ----------------------------------------- */
:root {
    /* Couleurs primaires */
    --color-primary-white: #ffffff;
    --color-primary-black: #000000;
    --color-primary-blue: #122948;
    --color-primary-yellow: #F9AF00;
    --color-primary-midnightblue: #122948;

    /* Gris (le texte courant des pages du legacy est #575756) */
    --color-grey-1: #4d4d4f;
    --color-grey-2: #d6d7d9;
    --color-grey-3: #9e9fa2;
    --color-grey-4: #c7c8ca;
    --color-grey-5: #e5e5e6;
    --color-grey-6: #f5f5f5;
    --color-text-page: #575756;

    /* Sémantique. Le legacy ne donnait aucune couleur au corps : le texte non
       stylé y était noir (seuls l'en-tête, le bandeau et le pied de page, qui
       posent leur blanc, se lisent sur le fond bleu). */
    --color-bg: var(--color-primary-blue);
    --color-text: var(--color-primary-black);
    --color-border: var(--color-grey-4);

    /* Typographie */
    --font-family-base: "AvenirLTStd-Roman", Arial, sans-serif;
    --font-size-base: 1.6rem;
    --font-size-md: 1.6rem;
    --font-size-lg: 2rem;
    --font-size-xl: 3.2rem;
    --line-height-base: normal;

    /* Espacements */
    --space-0: 0px;
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-10: 40px;
    --space-12: 48px;
    --space-16: 64px;

    /* Mise en page : largeur utile du site 2023 */
    --largeur-site: 1400px;
    --container-padding-x: 9rem;
}

/* ----- Typographie de base (legacy : html 62,5 %, body 1.6rem, p 1rem) ----- */
html {
    font-size: 62.5%;
    font-family: var(--font-family-base);
    background-color: var(--color-bg);
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
}

body {
    font-family: var(--font-family-base);
    font-size: var(--font-size-base);
    line-height: var(--line-height-base);
    color: var(--color-text);
    background: var(--color-bg);
}

p {
    font-size: 1rem;
}

b, strong, th {
    font-family: "AvenirLTStd-Black", Arial, sans-serif;
}

sup {
    font-size: 0.8rem;
}

main,
footer {
    width: min(var(--largeur-site), 100%);
    margin: 0 auto;
}

/* ----- Accessibilité ----------------------------------------------------- */
/* Focus toujours visible, dans la couleur d'accent du site (le legacy posait
   ce même contour jaune sur les liens du menu et du logo). */
:focus-visible {
    outline: 2px solid var(--color-primary-yellow);
    outline-offset: 2px;
}

.evitement {
    position: absolute;
    left: -9999px;
    top: 0;
}

.evitement:focus {
    left: 0;
    z-index: 9999;
    background: var(--color-primary-midnightblue);
    color: var(--color-primary-yellow);
    padding: var(--space-3) var(--space-5);
    font-size: 1.6rem;
}

.hors-ecran {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

/* ----- Retour en haut de page (legacy : a.lien-top, 37px, fixe) ---------- */
/* L'image du legacy (btn_haut.png) n'a jamais existé sur le S3 : la flèche est
   dessinée en CSS, sans fichier. */
.scrollTop {
    position: fixed;
    right: 12%;
    bottom: 1%;
    z-index: 2000;
    width: 37px;
    height: 37px;
    display: none;
    align-items: center;
    justify-content: center;
    background: var(--color-primary-yellow);
    border-radius: 50%;
}

.scrollTop::before {
    content: "";
    width: 11px;
    height: 11px;
    margin-top: 5px;
    border-top: 3px solid var(--color-primary-blue);
    border-left: 3px solid var(--color-primary-blue);
    transform: rotate(45deg);
}

.scrollTop.is-visible {
    display: flex;
}

/* Respect des préférences de réduction de mouvement */
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}