/* ============================================================
   Palette — 35 couleurs pastels (HSL 95%/50%)
   ============================================================ */
:root {

    /* ---- Niveau 1 : palette nommée ---- */

    /* Rouge · Rose */
    --rose-givre: #f8ebeb;
    --rose-poudre: #f8ebec;
    --rose-lilas: #f8ebef;
    /* Corail */
    --corail-pale: #f8efeb;
    --corail-givre: #f8edeb;
    --terre-cuite-pale: #f8eceb;
    /* Orange · Pêche */
    --abricot-givre: #f8f2eb;
    --peche-claire: #f8f1eb;
    --saumon-pale: #f8f0eb;
    /* Jaune · Crème */
    --citron-givre: #f8f8eb;
    --vanille: #f8f6eb;
    --paille-douce: #f8f5eb;
    /* Olive · Kaki */
    --olive-pale: #f6f8eb;
    --kaki-doux: #f5f8eb;
    --sauge-givre: #f3f8eb;
    /* Vert tendre · Lime */
    --vert-tendre: #f2f8eb;
    --vert-blanc: #eff8eb;
    /* Vert · Menthe */
    --vert-menthe: #ebf8ec;
    --vert-pale: #ebf8ed;
    --vert-doux: #edf8eb;
    /* Teal · Turquoise */
    --turquoise-givre: #ebf8f7;
    --menthe-glacee: #ebf8f5;
    /* Bleu */
    --ciel-pale: #ebf2f8;
    --bleu-givre: #ebf3f8;
    --bleu-doux: #ebf4f8;
    --bleu-blanc: #ebf0f8;
    /* Indigo · Lavande */
    --indigo-pale: #ebedf8;
    --lilas-givre: #f1ebf8;
    --lavande: #f6ebf8;
    --violet-givre: #f4ebf8;
    /* Beige · Lin */
    --creme-chaude: #f8f3eb;
    --lin: #f8f3eb;
    /* Kraft · Brun */
    --kraft-doux: #f8f2eb;
    --kraft-soutenu: #f8f1eb;
    --biscuit: #f8f0eb;

    /* ---- Niveau 2 : affectation par portail ---- */

    --couleur-1083: var(--rose-givre);
    --couleur-academieduclimat: var(--ciel-pale);
    --couleur-agrocite: var(--turquoise-givre);
    --couleur-altermundi: var(--rose-lilas);
    --couleur-alterna: var(--bleu-doux);
    --couleur-appartager: var(--bleu-doux);
    --couleur-arteck: var(--kaki-doux);
    --couleur-ateliertuffery: var(--ciel-pale);
    --couleur-baskinthesun: var(--bleu-doux);
    --couleur-bekowood: var(--kraft-soutenu);
    --couleur-bercybeaucoup: var(--bleu-doux);
    --couleur-biocbon: var(--vert-pale);
    --couleur-biocoop: var(--bleu-blanc);
    --couleur-biomonde: var(--kraft-doux);
    --couleur-blablacarbus: var(--ciel-pale);
    --couleur-bloom: var(--citron-givre);
    --couleur-booa: var(--paille-douce);
    --couleur-bookoff: var(--ciel-pale);
    --couleur-cashconverters: var(--turquoise-givre);
    --couleur-cashexpress: var(--vert-menthe);
    --couleur-cocolis: var(--lilas-givre);
    --couleur-cog: var(--kaki-doux);
    --couleur-colivys: var(--ciel-pale);
    --couleur-colonies: var(--lin);
    --couleur-comptoirsbio: var(--kaki-doux);
    --couleur-cooloc: var(--rose-givre);
    --couleur-crosscall: var(--ciel-pale);
    --couleur-dao: var(--kraft-doux);
    --couleur-debonnefacture: var(--lin);
    --couleur-deutschebahn: var(--rose-givre);
    --couleur-dreamact: var(--ciel-pale);
    --couleur-easycash: var(--corail-givre);
    --couleur-eauvive: var(--turquoise-givre);
    --couleur-ebay: var(--ciel-pale);
    --couleur-ecclo: var(--ciel-pale);
    --couleur-egpn: var(--kraft-doux);
    --couleur-elmy: var(--vert-tendre);
    --couleur-enercoop: var(--vert-menthe);
    --couleur-enerfip: var(--vert-menthe);
    --couleur-eurostar: var(--ciel-pale);
    --couleur-faguo: var(--vert-doux);
    --couleur-fairphone: var(--vert-menthe);
    --couleur-flixbus: var(--kaki-doux);
    --couleur-gibert: var(--bleu-doux);
    --couleur-goodplanet: var(--vert-menthe);
    --couleur-greenkub: var(--turquoise-givre);
    --couleur-greenmanagementschool: var(--lin);
    --couleur-geg: var(--ciel-pale);
    --couleur-hopaal: var(--rose-givre);
    --couleur-idmaisonbois: var(--kaki-doux);
    --couleur-ilek: var(--menthe-glacee);
    --couleur-ise: var(--ciel-pale);
    --couleur-joivy: var(--bleu-doux);
    --couleur-labelemmaus: var(--rose-lilas);
    --couleur-labellenergie: var(--vanille);
    --couleur-lacartedescolocs: var(--vert-doux);
    --couleur-lacasa: var(--citron-givre);
    --couleur-lacitefertile: var(--rose-lilas);
    --couleur-lafermenatureetdecouvertes: var(--vanille);
    --couleur-lafourche: var(--terre-cuite-pale);
    --couleur-lamaisonduzerodechet: var(--kaki-doux);
    --couleur-lanef: var(--ciel-pale);
    --couleur-larecyclerie: var(--kraft-doux);
    --couleur-laserrewangari: var(--vert-pale);
    --couleur-lavieclaire: var(--bleu-doux);
    --couleur-leboncoin: var(--kraft-soutenu);
    --couleur-lendosphere: var(--citron-givre);
    --couleur-lita: var(--abricot-givre);
    --couleur-livrevert: var(--bleu-doux);
    --couleur-mamaisonbois: var(--kraft-doux);
    --couleur-mintenergie: var(--turquoise-givre);
    --couleur-minuitsurterre: var(--lin);
    --couleur-moea: var(--vanille);
    --couleur-monsieurfalzar: var(--bleu-doux);
    --couleur-moodwalk: var(--rose-givre);
    --couleur-naeveganshoes: var(--kraft-soutenu);
    --couleur-natilia: var(--ciel-pale);
    --couleur-naturalia: var(--rose-givre);
    --couleur-natureo: var(--vert-blanc);
    --couleur-noyoco: var(--olive-pale);
    --couleur-octopusenergy: var(--lilas-givre);
    --couleur-ohmenergie: var(--kraft-doux);
    --couleur-parcsaintejeanne: var(--kaki-doux);
    --couleur-quadrapol: var(--olive-pale);
    --couleur-rakuten: var(--rose-givre);
    --couleur-recyclivre: var(--kraft-doux);
    --couleur-renfe: var(--lilas-givre);
    --couleur-etre: var(--vert-blanc);
    --couleur-schoolofimpact: var(--vert-menthe);
    --couleur-sevellia: var(--kaki-doux);
    --couleur-sharies: var(--paille-douce);
    --couleur-shopopop: var(--ciel-pale);
    --couleur-sncfconnect: var(--turquoise-givre);
    --couleur-sobio: var(--vanille);
    --couleur-telecoop: var(--kaki-doux);
    --couleur-source: var(--turquoise-givre);
    --couleur-mintmobile: var(--vert-blanc);
    --couleur-tendoors: var(--peche-claire);
    --couleur-tgvlyria: var(--corail-givre);
    --couleur-thebabelcommunity: var(--kraft-soutenu);
    --couleur-trecobois: var(--vert-menthe);
    --couleur-trenitalia: var(--vert-menthe);
    --couleur-tuttut: var(--violet-givre);
    --couleur-urbansolarenergy: var(--paille-douce);
    --couleur-veja: var(--vert-menthe);
    --couleur-villasbois: var(--vert-tendre);
    --couleur-vinted: var(--turquoise-givre);
    --couleur-wedressfair: var(--lin);
    --couleur-centrecommercial: var(--citron-givre);
    --couleur-yper: var(--vanille);
    --couleur-zeta: var(--bleu-doux);
}

/* ============================================================
   Effets irisés
   ============================================================ */

@keyframes irise1 {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}
@keyframes irise1-v {
    0% { background-position: 50% 0%; }
    50% { background-position: 50% 100%; }
    100% { background-position: 50% 0%; }
}
@keyframes irise2 {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}
@keyframes irise2-v {
    0% { background-position: 50% 0%; }
    50% { background-position: 50% 100%; }
    100% { background-position: 50% 0%; }
}

@keyframes irise3 {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}
@keyframes irise3-v {
    0% { background-position: 50% 0%; }
    50% { background-position: 50% 100%; }
    100% { background-position: 50% 0%; }
}

/* ============================================================
   Big Green Platform — Styles communs
   ============================================================ */

/* ---- Reset de base ---- */
*, *::before, *::after {
    box-sizing: border-box;
}

:root {
    --font-family: 'Open Sans', Arial, sans-serif;
    --nav-width: 260px;
    --font-size-6: clamp(2.8rem, 4vw, 4.8rem);
    --font-size-5: clamp(1.8rem, 2.5vw, 2.8rem);
    --font-size-4: clamp(1.4rem, 1.8vw, 2rem);
    --font-size-3: clamp(1.2rem, 1.4vw, 1.4rem);
    --font-size-2: clamp(0.9rem, 1vw, 1rem);
    --font-size-1: clamp(0.80rem, 0.90vw, 0.90rem);
    --gris-1: hsl(0, 0%, 97%);
    --gris-2: hsl(0, 0%, 90%);
    --gris-3: hsl(0, 0%, 75%);
    --gris-4: hsl(0, 0%, 55%);
    --gris-5: hsl(0, 0%, 35%);
    --gris-6: hsl(0, 0%, 17%);
}

/* ===================== */
/* Couleurs officielles  */
/* ===================== */

:root {
    --vert-1:                #d4edd9;
    --vert-2:                #7dc49a;
    --vert-3:                #2e8a50;
    --vert-4:                #1a5230;
    --bleu-officiel:         #2c5f9e;
    --bleu-officiel-survol:  #1a4a80;
    --violet-officiel:       #a96dd9;
    --violet-officiel-survol:#7d35c0;
    --brun-officiel:         #7a4f00;
}

body {
    font-family: var(--font-family);
    background: white;
    margin: 0;
    padding: 0;
}

.content {
    margin-left: var(--nav-width);
    cursor: default;
}

.content a,
.content button {
    cursor: pointer;
}

.content input {
    cursor: text;
}

@media (max-width: 1024px) {
    .content {
        margin-left: 0;
    }
}

.texte-contenu {
    color: var(--gris-6);
    line-height: 1.8;
    text-align: justify;
}

.texte-contenu p {
    margin-bottom: 1em;
}

.texte-contenu p:last-child {
    margin-bottom: 0;
}

.texte-contenu ul {
    margin-top: 0;
    margin-left: 1.5em;
    margin-bottom: 1.8em;
}

.texte-contenu ul:last-child {
    margin-bottom: 0;
}

.texte-contenu li {
    margin-bottom: 0.5em;
}

.texte-contenu li:last-child {
    margin-bottom: 0;
}

.onglets-contenu ul {
    margin-top: 0;
    margin-left: 1.5em;
    margin-bottom: 1em;
    padding-left: 0;
}

.onglets-contenu ul:last-child {
    margin-bottom: 0;
}

.onglets-contenu li {
    color: var(--gris-6);
    line-height: 1.8;
    margin-bottom: 0.5em;
    text-align: justify;
}

.onglets-contenu li:last-child {
    margin-bottom: 0;
}

/* ===================== */
/* Entête des pages      */
/* ===================== */

.title-section {
    width: 100%;
    padding: 50px 60px 40px 60px;
    background: white;
    border-bottom: 1px solid var(--gris-2);
}

.title-section .entete-sup {
    font-size: var(--font-size-2);
    color: var(--gris-4);
    font-weight: 400;
    margin-bottom: 8px;
    min-height: 1.5em;
    cursor: default;
}

.title-section .entete-titre {
    font-size: var(--font-size-5);
    font-weight: 700;
    color: var(--gris-6);
    line-height: 1.2;
    cursor: default;
    min-height: 1.2em;
}

@media (max-width: 600px) {
    .title-section .entete-titre {
        font-size: 1.8rem;
    }
}
