:root {
  color-scheme: dark;

  --fond-news: #0b0b0b;
  --rouge-news: #ed1639;
  --intensite-ambiance: 0.32;
}

* {
  box-sizing: border-box;
}

html {
  background: var(--fond-news);
}

body {
  margin: 0;
  min-height: 100svh;

  background: var(--fond-news);
  color: #f5f5f5;

  font-family: Arial, sans-serif;

  isolation: isolate;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

button {
  font: inherit;
}

a {
  color: inherit;
}

:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 5px;
}


/* FOND LUMINEUX */

#ambiance-news {
  position: fixed;
  inset: 0;
  z-index: 0;

  overflow: hidden;
  pointer-events: none;

  background: var(--fond-news);
}

.calque-news {
  position: absolute;
  inset: -90px;

  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;

  filter: blur(85px) saturate(1.3);
  transform: scale(1.15);

  opacity: 0;
  transition: opacity 900ms ease;
}

.calque-news.est-actif {
  opacity: var(--intensite-ambiance);
}

#ambiance-news::after {
  content: "";

  position: absolute;
  inset: 0;

  background: linear-gradient(
    180deg,
    rgba(11, 11, 11, 0.3),
    rgba(11, 11, 11, 0.55)
  );
}


/* HEADER */

.entete-news {
  position: relative;
  z-index: 10;

  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 24px;

  width: 96%;
  margin: 24px auto 30px;
}

.bouton-news {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;

  min-height: 56px;
  padding: 16px 26px;

  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;

  background: rgba(40, 40, 40, 0.65);
  color: #fff;

  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.07),
    0 10px 30px rgba(0, 0, 0, 0.18);

  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;

  cursor: pointer;

  transition:
    background-color 250ms ease,
    border-color 250ms ease,
    transform 250ms ease;
}

.bouton-news:not(:disabled):hover {
  background: rgba(60, 60, 60, 0.8);
  border-color: rgba(255, 255, 255, 0.45);
}

.bouton-news:disabled {
  cursor: default;
}

.retour-news {
  justify-self: start;

  min-width: 160px;
  min-height: 64px;

  font-size: 18px;
}

.retour-news span {
  font-size: 27px;
  font-weight: 400;
}


/* MENU CENTRAL */

.menu-news {
  display: flex;
  align-items: center;
  gap: 38px;

  padding: 14px 18px 14px 28px;

  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;

  background: rgba(20, 20, 20, 0.65);

  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 16px 45px rgba(0, 0, 0, 0.25);
}

.marque-news {
  display: inline-flex;
  flex-shrink: 0;

  font-size: 25px;
  font-weight: 900;
  letter-spacing: -1.2px;
  text-decoration: none;
}

.marque-news span {
  color: var(--rouge-news);
}

.rubriques-news {
  display: flex;
  align-items: center;
  gap: 8px;
}

.rubrique-news {
  min-height: 46px;
  padding: 12px 20px;

  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 999px;

  background: rgba(255, 255, 255, 0.04);
  color: #dedee2;

  font-size: 14px;
  font-weight: 700;
}


/* GRANDE UNE */

#contenu-news {
  position: relative;
  z-index: 1;

  width: 96%;
  max-width: 1800px;

  margin: 0 auto;
  padding-bottom: 80px;
}

.une-news {
  position: relative;
  isolation: isolate;

  display: flex;
  align-items: flex-end;

  min-height: clamp(540px, 75svh, 820px);

  overflow: hidden;

  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 32px;

  background: #151515;

  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.4);
}

.image-une {
  position: absolute;
  inset: 0;

  width: 100%;
  height: 100%;

  object-fit: cover;

  transition: transform 900ms ease;
}

.une-news::after {
  content: "";

  position: absolute;
  inset: 0;
  z-index: 1;

  pointer-events: none;

  background:
    linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.9),
      rgba(0, 0, 0, 0.12) 85%
    ),
    linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.4),
      transparent 85%
    );
}

.contenu-une {
  position: relative;
  z-index: 2;

  width: 100%;
  max-width: 1100px;

  padding: clamp(30px, 5vw, 80px);
}

.badge-une {
  display: inline-flex;
  align-items: center;
  gap: 9px;

  padding: 10px 16px;
  margin-bottom: 24px;

  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 999px;

  background: var(--rouge-news);
  color: #fff;

  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.badge-une > span {
  width: 6px;
  height: 6px;

  border-radius: 50%;
  background: #fff;

  box-shadow: 0 0 12px rgba(255, 255, 255, 0.6);
}

.contenu-une h1 {
  margin: 0 0 24px;

  font-size: clamp(38px, 4.5vw, 78px);
  font-weight: 800;
  line-height: 1.06;
  letter-spacing: -1.5px;

  overflow-wrap: anywhere;
  text-wrap: balance;
}

.description-une {
  max-width: 680px;

  margin: 0 0 24px;

  color: #dedee3;

  font-size: 18px;
  line-height: 1.8;
}

.informations-une {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;

  margin-bottom: 30px;

  color: #c0c0c8;
  font-size: 13px;
}

.lire-news {
  background: rgba(255, 255, 255, 0.94);
  color: #171717;

  border-color: rgba(255, 255, 255, 0.8);
}


/* ÉCRANS PLUS PETITS */

@media (max-width: 1000px) {
  .entete-news {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .menu-news {
    justify-self: center;
    justify-content: space-between;

    width: min(100%, 600px);
  }
}

@media (max-width: 600px) {
  .entete-news {
    margin-top: 18px;
  }

  .retour-news {
    min-width: 0;
    min-height: 52px;

    padding: 12px 22px;
    font-size: 15px;
  }

  .menu-news {
    gap: 12px;
    padding: 12px 14px;

    border-radius: 24px;
  }

  .marque-news {
    font-size: 21px;
  }

  .rubriques-news {
    gap: 6px;
  }

  .rubrique-news {
    min-height: 42px;
    padding: 10px 12px;

    font-size: 12px;
  }

  .une-news {
    min-height: 620px;
    border-radius: 24px;
  }

  .description-une {
    font-size: 16px;
    line-height: 1.7;
  }
}

@media (hover: hover) {
  .une-news:hover .image-une {
    transform: scale(1.025);
  }
}

@media (prefers-reduced-motion: reduce) {
  .calque-news,
  .image-une,
  .bouton-news {
    transition: none;
  }

  .une-news:hover .image-une {
    transform: none;
  }
}







/* SECTION DES ARTICLES */

.articles-news {
  margin-top: 64px;
}

.entete-articles {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 18px;

  margin-bottom: 30px;
}

.entete-articles h2 {
  display: flex;
  align-items: center;
  gap: 16px;

  margin: 0;

  font-size: clamp(28px, 2.5vw, 42px);
  font-weight: 800;
  letter-spacing: -1px;
}

.entete-articles h2::before {
  content: "";

  width: 4px;
  height: 30px;

  flex-shrink: 0;

  border-radius: 999px;
  background: var(--rouge-news);

  box-shadow: 0 0 20px rgba(237, 22, 57, 0.25);
}

.entete-articles p {
  margin: 0;

  color: #aaaab3;
  font-size: 14px;
  line-height: 1.6;
}


/* GRILLE */

.grille-articles {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 26px;
}


/* CARTE */

.carte-news {
  display: flex;
  flex-direction: column;

  min-width: 0;

  overflow: hidden;

  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 26px;

  background: rgba(24, 24, 24, 0.7);

  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);

  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 16px 40px rgba(0, 0, 0, 0.2);

  transition:
    transform 300ms ease,
    border-color 300ms ease,
    background-color 300ms ease,
    box-shadow 300ms ease;
}


/* IMAGE ET CATÉGORIE */

.visuel-carte {
  position: relative;

  flex-shrink: 0;

  aspect-ratio: 16 / 10;
  overflow: hidden;

  background: #202020;
}

.image-carte {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;

  transition: transform 700ms ease;
}

.visuel-carte::after {
  content: "";

  position: absolute;
  inset: 0;

  pointer-events: none;

  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.12),
    transparent 50%,
    rgba(0, 0, 0, 0.2)
  );
}

.categorie-carte {
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 1;

  max-width: calc(100% - 32px);
  padding: 9px 13px;

  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 999px;

  background: rgba(18, 18, 18, 0.65);
  color: #fff;

  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);

  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.8px;
  text-transform: uppercase;
}


/* TEXTE */

.contenu-carte {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 18px;

  padding: 24px;
}

.contenu-carte h3 {
  margin: 0;

  color: #f5f5f7;

  font-size: 22px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -0.4px;

  overflow-wrap: anywhere;
}

.description-carte {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;

  overflow: hidden;

  margin: 0;

  color: #b5b5bf;

  font-size: 15px;
  line-height: 1.8;

  overflow-wrap: anywhere;
}


/* DATE ET BOUTON */

.pied-carte {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;

  margin-top: auto;
  padding-top: 20px;

  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.pied-carte time {
  color: #a8a8b2;
  font-size: 12px;
}

.lire-carte {
  min-height: 42px;
  padding: 10px 16px;

  border-color: rgba(255, 255, 255, 0.14);

  background: rgba(255, 255, 255, 0.05);

  font-size: 13px;

  box-shadow: none;
}


/* SURVOL */

@media (hover: hover) {
  .carte-news:hover {
    transform: translateY(-6px);

    border-color: rgba(255, 255, 255, 0.26);
    background: rgba(32, 32, 32, 0.78);

    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.06),
      0 24px 50px rgba(0, 0, 0, 0.35);
  }

  .carte-news:hover .image-carte {
    transform: scale(1.055);
  }
}


/* TABLETTE ET MOBILE */

@media (max-width: 1200px) {
  .grille-articles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .articles-news {
    margin-top: 44px;
  }

  .grille-articles {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
  }

  .contenu-carte {
    padding: 22px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .carte-news,
  .image-carte {
    transition: none;
  }

  .carte-news:hover,
  .carte-news:hover .image-carte {
    transform: none;
  }
}


/* MASQUAGE DES ÉLÉMENTS FILTRÉS */

[hidden] {
  display: none !important;
}


/* OUTILS DE RECHERCHE */

.outils-articles {
  display: flex;
  flex-direction: column;
  gap: 20px;

  margin-bottom: 30px;
}

.recherche-news {
  min-width: 0;
}

.label-recherche-news {
  display: block;

  margin: 0 0 12px 6px;

  color: #b6b6c0;

  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.8px;
}

.champ-recherche-news {
  display: flex;
  align-items: center;
  gap: 16px;

  min-height: 70px;
  padding: 0 22px;

  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 22px;

  background: rgba(255, 255, 255, 0.055);

  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);

  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);

  transition:
    border-color 250ms ease,
    box-shadow 250ms ease;
}

.champ-recherche-news:focus-within {
  border-color: rgba(255, 255, 255, 0.45);

  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.06);
}

.champ-recherche-news svg {
  flex-shrink: 0;

  width: 24px;
  height: 24px;

  fill: none;
  stroke: #a4a4af;
  stroke-width: 1.8;
  stroke-linecap: round;
}

#recherche-news {
  flex: 1;
  min-width: 0;
  width: 100%;

  padding: 0;

  border: 0;
  outline: none;

  background: transparent;
  color: #f5f5f7;

  font: inherit;
  font-size: 17px;
}

#recherche-news::placeholder {
  color: #9797a3;
}

#recherche-news::-webkit-search-cancel-button {
  display: none;
}

.effacer-news {
  display: grid;
  place-items: center;

  flex-shrink: 0;

  width: 34px;
  height: 34px;
  padding: 0;

  border: 0;
  border-radius: 50%;

  background: rgba(255, 255, 255, 0.08);
  color: #eee;

  font-size: 24px;
  cursor: pointer;
}

.effacer-news:hover {
  background: rgba(255, 255, 255, 0.16);
}


/* CATÉGORIES */

.filtres-news {
  display: flex;
  align-items: center;
  gap: 12px;

  min-width: 0;
  padding: 6px 2px 14px;

  overflow-x: auto;

  overscroll-behavior-x: contain;

  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.2) transparent;
}

.filtre-news {
  flex: 0 0 auto;

  min-height: 50px;
  padding: 13px 22px;

  font-size: 14px;
}

.filtres-news > :first-child {
  margin-left: auto;
}

.filtres-news > :last-child {
  margin-right: auto;
}

.filtre-news[aria-pressed="true"],
.filtre-news[aria-pressed="true"]:hover {
  border-color: rgba(255, 255, 255, 0.9);

  background: #f4f4f5;
  color: #161616;
}


/* COMPTEUR ET RECHERCHE VIDE */

.compteur-news {
  margin: 0;

  color: #aaaab5;
  font-size: 13px;
  line-height: 1.6;
}

.aucun-article-news {
  margin: 0;
  padding: 32px 24px;

  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 22px;

  background: rgba(255, 255, 255, 0.035);
  color: #bdbdc7;

  text-align: center;
  line-height: 1.7;
}

@media (max-width: 600px) {
  .champ-recherche-news {
    min-height: 62px;
    padding: 0 16px;
  }

  #recherche-news {
    font-size: 16px;
  }

  .filtre-news {
    min-height: 46px;
    padding: 12px 18px;

    font-size: 13px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .champ-recherche-news {
    transition: none;
  }
}



/* COMMANDES DE L’ÉDITEUR */

.commandes-news {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 14px;

  margin-bottom: 28px;
}

.etat-stockage-news {
  flex: 1;
  min-width: 200px;

  margin: 0;

  color: #aaaab5;
  font-size: 13px;
  line-height: 1.6;
}

#mode-news[aria-pressed="true"],
#mode-news[aria-pressed="true"]:hover,
#enregistrer-article-news,
#enregistrer-article-news:not(:disabled):hover {
  background: #f4f4f5;
  color: #161616;

  border-color: rgba(255, 255, 255, 0.85);
}


/* BOUTONS DES CARTES EN MODE MODIFICATION */

.modifier-carte-news {
  display: none;

  min-height: 42px;
  padding: 10px 16px;

  font-size: 13px;
}

.news-edition .modifier-carte-news {
  display: inline-flex;
}

.news-edition .lire-carte {
  display: none;
}


/* FENÊTRE DU FORMULAIRE */

.fenetre-news {
  width: min(720px, calc(100% - 32px));
  max-height: calc(100svh - 40px);

  margin: auto;
  padding: 32px;

  overflow-y: auto;

  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 28px;

  background: linear-gradient(
    145deg,
    #1b1b1b,
    #101010 70%
  );

  color: #f5f5f7;

  box-shadow: 0 30px 100px rgba(0, 0, 0, 0.6);
}

.fenetre-news::backdrop {
  background: rgba(0, 0, 0, 0.65);

  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

#formulaire-article-news {
  display: grid;
  gap: 24px;
}

.entete-formulaire-news {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;

  margin-bottom: 4px;
}

.entete-formulaire-news h2 {
  margin: 0;

  font-size: 30px;
  letter-spacing: -0.8px;
}

.fermer-fenetre-news {
  display: grid;
  place-items: center;

  flex-shrink: 0;

  width: 44px;
  height: 44px;
  padding: 0;

  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 50%;

  background: rgba(255, 255, 255, 0.05);
  color: #eee;

  font-size: 26px;
  cursor: pointer;
}

.ligne-formulaire-news {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

.champ-formulaire-news {
  display: flex;
  flex-direction: column;
  gap: 10px;

  min-width: 0;
}

.champ-formulaire-news label {
  color: #d9d9df;

  font-size: 14px;
  font-weight: 600;
}

.champ-formulaire-news input,
.champ-formulaire-news select,
.champ-formulaire-news textarea {
  width: 100%;
  min-width: 0;

  padding: 15px 16px;

  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 14px;

  background: rgba(255, 255, 255, 0.045);
  color: #f5f5f7;

  font: inherit;
  font-size: 15px;
}

.champ-formulaire-news select option {
  background: #181818;
  color: #fff;
}

.champ-formulaire-news textarea {
  min-height: 130px;
  resize: vertical;

  line-height: 1.7;
}

.champ-formulaire-news input::placeholder,
.champ-formulaire-news textarea::placeholder {
  color: #858591;
}

.aide-formulaire-news {
  margin: 0;

  color: #a5a5b0;
  font-size: 12px;
  line-height: 1.6;
}

.erreur-formulaire-news {
  margin: 0;
  padding: 14px 16px;

  border: 1px solid rgba(255, 95, 120, 0.25);
  border-radius: 14px;

  background: rgba(237, 22, 57, 0.08);
  color: #ffabb9;

  font-size: 14px;
  line-height: 1.6;
}

.actions-formulaire-news {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 12px;

  padding-top: 8px;
}

#formulaire-article-news :disabled {
  opacity: 0.6;
  cursor: wait;
}

@media (max-width: 600px) {
  .fenetre-news {
    padding: 24px;
    border-radius: 22px;
  }

  .entete-formulaire-news h2 {
    font-size: 25px;
  }

  .ligne-formulaire-news {
    grid-template-columns: minmax(0, 1fr);
  }

  .etat-stockage-news {
    flex-basis: 100%;
  }
}


/* CHOISIR UN ARTICLE POUR LA UNE */

.choisir-une-news {
  display: none;

  min-height: 42px;
  padding: 10px 14px;

  font-size: 13px;
}

.news-edition .choisir-une-news {
  display: inline-flex;
}

.news-edition .pied-carte {
  justify-content: flex-start;
}

.news-edition .pied-carte time {
  flex-basis: 100%;
}

.choisir-une-news[aria-pressed="true"],
.choisir-une-news[aria-pressed="true"]:hover {
  border-color: rgba(255, 255, 255, 0.85);

  background: #f4f4f5;
  color: #161616;
}


/* REPÈRE SUR L’IMAGE DE L’ARTICLE À LA UNE */

.badge-carte-une {
  position: absolute;
  right: 16px;
  bottom: 16px;
  z-index: 1;

  padding: 9px 13px;

  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 999px;

  background: rgba(237, 22, 57, 0.88);
  color: #fff;

  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);

  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);

  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.4px;
}


/* RÉDACTION DE L’ARTICLE */

#texte-article-news {
  min-height: 260px;
}


/* FENÊTRE DE LECTURE */

html:has(#lecture-article-news[open]) {
  overflow: hidden;
}

.lecture-news {
  width: min(1080px, calc(100% - 32px));

  padding: 0;

  overscroll-behavior: contain;
}

.barre-lecture-news {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;

  padding: 18px 22px;

  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.etat-lecture-news {
  margin: 0;
  padding: 40px 28px;

  color: #bcbcc7;

  font-size: 16px;
  line-height: 1.7;
}


/* PHOTO DE COUVERTURE */

.image-lecture-news {
  display: block;

  width: 100%;
  height: clamp(220px, 32vw, 420px);

  object-fit: cover;

  background: #1a1a1a;
}


/* CONTENU */

.contenu-lecture-news {
  max-width: 840px;

  margin: 0 auto;
  padding: 40px clamp(22px, 5vw, 60px);
}

.informations-lecture-news {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;

  margin-bottom: 24px;

  color: #aaaab5;
  font-size: 13px;
}

#categorie-lecture-news {
  display: inline-flex;

  padding: 8px 12px;

  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;

  background: rgba(255, 255, 255, 0.06);
  color: #eeeef3;

  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.7px;
  text-transform: uppercase;
}

#titre-lecture-news {
  margin: 0 0 28px;

  font-size: clamp(30px, 4vw, 56px);
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: -1px;

  text-wrap: balance;
  overflow-wrap: anywhere;
}

.chapeau-lecture-news {
  margin: 0 0 34px;

  color: #dedee5;

  font-size: 19px;
  line-height: 1.8;

  overflow-wrap: anywhere;
}

.corps-lecture-news p {
  margin: 0 0 24px;

  color: #c0c0cb;

  font-size: 17px;
  line-height: 1.9;

  white-space: pre-line;
  overflow-wrap: anywhere;
}

.corps-lecture-news p:last-child {
  margin-bottom: 0;
}

.fin-lecture-news {
  display: flex;
  justify-content: flex-end;

  margin-top: 36px;
  padding-top: 26px;

  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

@media (max-width: 600px) {
  .barre-lecture-news {
    padding: 14px 18px;
  }

  .contenu-lecture-news {
    padding: 28px 22px;
  }

  .chapeau-lecture-news {
    font-size: 17px;
  }

  .corps-lecture-news p {
    font-size: 16px;
  }
}






/* HEADER DU LECTEUR */

.barre-lecture-news {
  position: sticky;
  top: 0;
  z-index: 5;

  background: rgba(16, 16, 16, 0.88);

  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.commandes-redaction-news {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;

  margin-left: auto;
}

.commandes-redaction-news .bouton-news {
  min-height: 44px;
  padding: 11px 16px;

  font-size: 13px;
}

[data-sauver-redaction],
[data-sauver-redaction]:not(:disabled):hover {
  background: #f4f4f5;
  color: #161616;

  border-color: rgba(255, 255, 255, 0.85);
}

[data-sauver-redaction]:disabled {
  opacity: 0.5;
}


/* OUTILS DE RÉDACTION */

.outils-redaction-news {
  display: grid;
  gap: 14px;

  margin: 28px 0 18px;
  padding: 18px;

  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 20px;

  background: rgba(255, 255, 255, 0.04);
}

.groupe-redaction-news {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.groupe-redaction-news button,
.actions-bloc-news button {
  min-height: 40px;
  padding: 10px 14px;

  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 12px;

  background: rgba(255, 255, 255, 0.05);
  color: #eeeef3;

  font: inherit;
  font-size: 13px;

  cursor: pointer;
}

.groupe-redaction-news button:hover,
.actions-bloc-news button:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.3);
}

.groupe-redaction-news button:disabled,
.actions-bloc-news button:disabled {
  opacity: 0.5;
  cursor: wait;
}

.message-redaction-news {
  margin: 16px 0 24px;

  color: #c4c4ce;

  font-size: 13px;
  line-height: 1.7;
}


/* BLOCS DE CONTENU */

.bloc-contenu-news {
  margin: 0 0 30px;
}

.texte-bloc-news {
  color: #c8c8d2;

  font-size: 17px;
  line-height: 1.9;

  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.texte-bloc-news p,
.texte-bloc-news div {
  font: inherit;
  color: inherit;
}

.actions-bloc-news {
  display: none;
}

.edition-article-news .bloc-contenu-news {
  padding: 18px;

  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 20px;

  background: rgba(255, 255, 255, 0.025);
}

.edition-article-news .bloc-contenu-news:focus-within {
  border-color: rgba(255, 255, 255, 0.38);
}

.edition-article-news .actions-bloc-news {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;

  margin-bottom: 18px;
}

.actions-bloc-news > span {
  flex: 1;

  color: #aaaab5;
  font-size: 12px;
}

.actions-bloc-news button {
  min-height: 34px;
  padding: 7px 11px;

  font-size: 12px;
}

.edition-article-news .texte-bloc-news {
  min-height: 70px;
  outline: none;
}

.edition-article-news .texte-bloc-news:empty::before {
  content: "Écris ton paragraphe…";

  color: #797986;
  pointer-events: none;
}


/* CITATIONS */

.bloc-citation-news .texte-bloc-news {
  padding-left: 20px;

  border-left: 3px solid var(--rouge-news);

  color: #dedee6;
  font-style: italic;
}


/* IMAGES ET LÉGENDES */

.bloc-contenu-news figure {
  margin: 0;
}

.image-bloc-news {
  display: block;

  width: 100%;
  max-height: 650px;

  object-fit: contain;

  border-radius: 18px;
  background: #111;

  box-shadow: 0 16px 45px rgba(0, 0, 0, 0.25);
}

.bloc-contenu-news figcaption {
  margin-top: 12px;

  color: #a8a8b5;

  font-size: 13px;
  line-height: 1.7;
  text-align: center;

  overflow-wrap: anywhere;
}

.legende-image-news {
  display: none;

  width: 100%;
  margin-top: 14px;
  padding: 13px 15px;

  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 12px;

  background: rgba(255, 255, 255, 0.04);
  color: #eee;

  font: inherit;
  font-size: 14px;
}

.edition-article-news .legende-image-news {
  display: block;
}

.edition-article-news .bloc-contenu-news figcaption {
  display: none;
}

@media (max-width: 600px) {
  .barre-lecture-news {
    flex-wrap: wrap;
  }

  .barre-lecture-news .fermer-fenetre-news {
    order: 1;
  }

  .commandes-redaction-news {
    order: 2;
    flex-basis: 100%;

    margin-left: 0;
  }

  .edition-article-news .bloc-contenu-news {
    padding: 14px;
  }

  .texte-bloc-news {
    font-size: 16px;
  }
}



/* FENÊTRE PLUS LARGE */

.lecture-news {
  width: min(1440px, calc(100vw - 48px));
  max-width: none;
  padding: 0;

  scroll-padding-top:
    calc(var(--hauteur-barre-news, 80px) + 18px);
}

.lecture-news .contenu-lecture-news {
  max-width: 1120px;
}


/* EN-TÊTE QUI RESTE VISIBLE */

.lecture-news .barre-lecture-news {
  position: sticky;
  top: 0;
  z-index: 10;

  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 44px;
  align-items: center;
  gap: 16px 18px;

  padding: 20px 26px;

  background: rgba(18, 18, 18, 0.94);

  border-bottom:
    1px solid rgba(255, 255, 255, 0.12);

  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);

  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);
}

.lecture-news .barre-lecture-news > .marque-news {
  grid-column: 1;
  grid-row: 1;
}

.lecture-news .commandes-redaction-news {
  grid-column: 2;
  grid-row: 1;

  order: 0;
  margin: 0;
  flex-wrap: nowrap;
}

.lecture-news .barre-lecture-news > .fermer-fenetre-news {
  grid-column: 3;
  grid-row: 1;

  order: 0;
}


/* DEUX GROUPES D’OUTILS */

.lecture-news .outils-redaction-news {
  grid-column: 1 / -1;

  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;

  margin: 0;
  padding: 0;

  border: 0;
  border-radius: 0;
  background: transparent;
}

.lecture-news .groupe-redaction-news {
  display: block;
  min-width: 0;

  padding: 14px 16px;

  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 16px;

  background: rgba(255, 255, 255, 0.035);
}

.lecture-news .titre-outils-news {
  display: block;
  margin-bottom: 11px;

  color: #aaaab5;

  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}

.lecture-news .boutons-redaction-news {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.lecture-news .boutons-redaction-news button {
  min-height: 44px;
  padding: 11px 15px;

  border-radius: 12px;
}

.lecture-news .message-redaction-news {
  grid-column: 1 / -1;

  min-width: 0;
  margin: 0;

  font-size: 12px;
}


/* PETITS ÉCRANS */

@media (max-width: 700px) {
  .lecture-news {
    width: calc(100vw - 24px);
  }

  .lecture-news .barre-lecture-news {
    grid-template-columns: minmax(0, 1fr) 44px;

    gap: 12px;
    padding: 14px;
  }

  .lecture-news .barre-lecture-news > .fermer-fenetre-news {
    grid-column: 2;
  }

  .lecture-news .commandes-redaction-news {
    grid-column: 1 / -1;
    grid-row: 2;

    justify-content: flex-end;
  }

  .lecture-news .outils-redaction-news {
    display: flex;

    overflow-x: auto;
    padding: 2px 2px 8px;

    scrollbar-width: thin;
  }

  .lecture-news .groupe-redaction-news {
    flex: 0 0 auto;
  }

  .lecture-news .boutons-redaction-news {
    flex-wrap: nowrap;
  }
}



/* NAVIGATION ENTRE LES RUBRIQUES */

a.rubrique-news {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  text-decoration: none;
  cursor: pointer;

  transition:
    background-color 200ms ease,
    border-color 200ms ease,
    color 200ms ease;
}

a.rubrique-news:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.25);
}

a.rubrique-news[aria-current="page"] {
  background: #f4f4f5;
  color: #151515;

  border-color: rgba(255, 255, 255, 0.85);

  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.15);
}


/* ESPACE VIDÉOS */

#vue-videos-news {
  position: relative;
  z-index: 1;

  width: 96%;
  max-width: 1800px;

  min-height: 65svh;
  margin: 0 auto;
  padding-bottom: 80px;
}

.presentation-videos-news {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 24px;

  padding: 38px 0 34px;
}

.surtitre-videos-news {
  display: block;
  margin-bottom: 16px;

  color: var(--rouge-news);

  font-size: 11px;
  font-weight: 800;
  letter-spacing: 2px;
}

#titre-videos-news {
  margin: 0 0 16px;

  font-size: clamp(30px, 4vw, 52px);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -1px;
}

.description-videos-news {
  max-width: 680px;
  margin: 0;

  color: #aaaab5;

  font-size: 16px;
  line-height: 1.8;
}

.compteur-videos-news {
  flex-shrink: 0;

  margin: 0;
  padding: 11px 16px;

  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 999px;

  background: rgba(255, 255, 255, 0.04);
  color: #c5c5ce;

  font-size: 13px;
}


/* GRILLE DES FUTURES MINIATURES */

.grille-videos-news {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px 26px;
}

.aucune-video-news {
  margin: 0;
  padding: 80px 24px;

  border: 1px dashed rgba(255, 255, 255, 0.16);
  border-radius: 24px;

  background: rgba(255, 255, 255, 0.025);
  color: #aaaab5;

  font-size: 16px;
  line-height: 1.8;
  text-align: center;
}

@media (max-width: 1100px) {
  .grille-videos-news {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 600px) {
  .presentation-videos-news {
    padding-top: 24px;
  }

  .grille-videos-news {
    grid-template-columns: minmax(0, 1fr);
  }
}





/* COMMANDES DE LA GALERIE VIDÉO */

.commandes-videos-news {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  margin-bottom: 30px;
}

#etat-videos-news {
  flex: 1 1 260px;
  margin: 0;
  color: #aaaab5;
  font-size: 13px;
  line-height: 1.7;
}


/* CARTES VIDÉO */

.carte-video-news {
  min-width: 0;
  overflow: hidden;

  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 22px;

  background: rgba(255, 255, 255, 0.035);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.2);

  transition:
    transform 250ms ease,
    border-color 250ms ease;
}

.carte-video-news:hover {
  transform: translateY(-5px);
  border-color: rgba(255, 255, 255, 0.25);
}

.visuel-video-news {
  position: relative;
  display: block;

  width: 100%;
  aspect-ratio: 16 / 9;
  padding: 0;

  overflow: hidden;
  border: 0;

  background: #1b1b1b;
  color: #fff;
}

.visuel-video-news:not(:disabled) {
  cursor: pointer;
}

.visuel-video-news img {
  position: absolute;
  inset: 0;
  z-index: 1;

  width: 100%;
  height: 100%;
  object-fit: cover;

  transition: transform 400ms ease;
}

.carte-video-news:hover .visuel-video-news img {
  transform: scale(1.035);
}

.miniature-absente-news {
  position: absolute;
  inset: 0;

  display: grid;
  place-items: center;

  color: #9999a5;
  font-size: 13px;
}

.pastille-video-news {
  position: absolute;
  right: 14px;
  bottom: 14px;
  z-index: 2;

  display: grid;
  place-items: center;

  width: 44px;
  height: 44px;

  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 50%;

  background: rgba(0, 0, 0, 0.5);

  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.infos-video-news {
  padding: 20px;
}

.infos-video-news h2 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;

  min-height: 2.8em;
  overflow: hidden;
  overflow-wrap: anywhere;

  margin: 0 0 18px;

  font-size: 19px;
  line-height: 1.4;
}

.pied-video-news {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}

.pied-video-news time {
  color: #aaaab5;
  font-size: 13px;
}

.modifier-video-news {
  display: none;

  min-height: 40px;
  padding: 10px 14px;

  font-size: 12px;
}

.videos-edition .modifier-video-news {
  display: inline-flex;
}


/* FORMULAIRE VIDÉO */

html:has(#fenetre-video-news[open]) {
  overflow: hidden;
}

#fenetre-video-news {
  overscroll-behavior: contain;
}

#formulaire-video-news {
  display: grid;
  gap: 24px;
}

#formulaire-video-news :disabled {
  opacity: 0.55;
  cursor: wait;
}

#formulaire-video-news [type="submit"] {
  background: #f4f4f5;
  color: #161616;
}

.option-miniature-auto-news {
  display: flex;
  align-items: center;
  gap: 10px;
}

.champ-formulaire-news .option-miniature-auto-news input {
  flex-shrink: 0;

  width: 18px;
  height: 18px;

  margin: 0;
  padding: 0;

  accent-color: #f4f4f5;
}


/* MOUVEMENTS RÉDUITS */

@media (prefers-reduced-motion: reduce) {
  .carte-video-news,
  .visuel-video-news img {
    transition: none;
  }

  .carte-video-news:hover,
  .carte-video-news:hover .visuel-video-news img {
    transform: none;
  }
}




/* FENÊTRE DU LECTEUR VIDÉO */

html:has(#lecture-video-news[open]) {
  overflow: hidden;
}

.lecteur-video-news {
  width: min(
    1320px,
    calc(100vw - 40px),
    calc((100svh - 120px) * 16 / 9)
  );

  max-width: none;
  max-height: calc(100svh - 32px);

  padding: 0;
  overscroll-behavior: contain;
}


/* EN-TÊTE TOUJOURS VISIBLE */

.entete-lecteur-video-news {
  position: sticky;
  top: 0;
  z-index: 3;

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;

  padding: 16px 22px;

  border-bottom: 1px solid rgba(255, 255, 255, 0.1);

  background: rgba(18, 18, 18, 0.94);

  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.etat-lecture-video-news {
  margin: 0;
  padding: 38px 28px;

  color: #bcbcc7;

  font-size: 16px;
  line-height: 1.8;
}


/* ZONE DU LECTEUR YOUTUBE */

.cadre-player-news {
  position: relative;

  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 200px;

  background: #000;
}

.cadre-player-news iframe {
  position: absolute;
  inset: 0;

  display: block;
  width: 100%;
  height: 100%;

  border: 0;
}


/* TITRE ET INFORMATIONS */

.infos-lecture-video-news {
  padding: 28px 32px 36px;
}

.meta-lecture-video-news {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;

  margin-bottom: 16px;

  color: #aaaab5;
  font-size: 12px;
}

.meta-lecture-video-news > span {
  color: var(--rouge-news);

  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1.5px;
}

#titre-lecture-video-news {
  margin: 0 0 24px;

  font-size: clamp(24px, 3vw, 38px);
  font-weight: 800;
  line-height: 1.25;

  overflow-wrap: anywhere;
  text-wrap: balance;
}

#source-youtube-news {
  min-height: 44px;
  padding: 12px 18px;

  font-size: 13px;
}


/* PETITS ÉCRANS */

@media (max-width: 600px) {
  .lecteur-video-news {
    width: min(
      calc(100vw - 20px),
      calc((100svh - 110px) * 16 / 9)
    );

    max-height: calc(100svh - 20px);
  }

  .entete-lecteur-video-news {
    gap: 12px;
    padding: 14px;
  }

  .entete-lecteur-video-news .marque-news {
    font-size: 20px;
  }

  .infos-lecture-video-news {
    padding: 24px 20px 28px;
  }
}







/* LIKES ET COMMENTAIRES */

.reactions-video-news {
  margin-top: 28px;
  padding-top: 24px;

  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.actions-reactions-video-news {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px;
}

.aimer-video-news {
  min-height: 44px;
  padding: 12px 18px;
  font-size: 13px;
}

.aimer-video-news [data-icone-aime] {
  font-size: 23px;
  line-height: 1;
}

.aimer-video-news [data-compteur-aime] {
  min-width: 24px;
  padding: 3px 7px;

  border-radius: 999px;

  background: rgba(255, 255, 255, 0.08);
  text-align: center;
}

.aimer-video-news[aria-pressed="true"],
.aimer-video-news[aria-pressed="true"]:not(:disabled):hover {
  border-color: rgba(237, 22, 57, 0.5);
  background: rgba(237, 22, 57, 0.14);
  color: #ffb1bf;
}

.etat-reactions-video-news {
  margin: 16px 0 0;

  color: #b7b7c3;

  font-size: 13px;
  line-height: 1.7;
}

.erreur-reactions-video-news {
  color: #ffabb9;
}


/* FORMULAIRE */

.titre-commentaires-video-news {
  display: flex;
  align-items: center;
  gap: 12px;

  margin: 32px 0 24px;

  font-size: 22px;
}

.titre-commentaires-video-news > span {
  padding: 5px 10px;

  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 999px;

  color: #aaaab5;
  font-size: 12px;
}

.formulaire-commentaire-video-news {
  display: grid;
  gap: 18px;

  margin-bottom: 28px;
}

.pseudo-commentaire-video-news {
  max-width: 320px;
}

.formulaire-commentaire-video-news [type="submit"] {
  background: #f4f4f5;
  color: #161616;
}

.formulaire-commentaire-video-news :disabled,
.aimer-video-news:disabled,
.lecteur-video-news .fermer-fenetre-news:disabled {
  opacity: 0.5;
  cursor: wait;
}


/* COMMENTAIRES ENREGISTRÉS */

.liste-commentaires-video-news {
  display: grid;
  gap: 16px;
}

.commentaire-video-news {
  min-width: 0;
  padding: 20px;

  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 18px;

  background: rgba(255, 255, 255, 0.035);
}

.commentaire-video-news header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px;
}

.commentaire-video-news header > div {
  min-width: 0;
  overflow-wrap: anywhere;
}

.commentaire-video-news strong {
  font-size: 14px;
}

.commentaire-video-news time {
  display: block;
  margin-top: 6px;

  color: #9999a7;
  font-size: 11px;
}

.commentaire-video-news > p {
  margin: 18px 0 0;

  color: #d0d0da;

  font-size: 15px;
  line-height: 1.8;

  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.supprimer-commentaire-video-news {
  min-height: 34px;
  padding: 7px 11px;

  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 999px;

  background: rgba(255, 255, 255, 0.04);
  color: #c5c5d0;

  font-size: 11px;
  cursor: pointer;
}

.supprimer-commentaire-video-news:not(:disabled):hover {
  border-color: rgba(237, 22, 57, 0.5);
  color: #ffabb9;
}

.supprimer-commentaire-video-news:disabled {
  opacity: 0.5;
  cursor: wait;
}

.aucun-commentaire-video-news {
  margin: 0;
  padding: 24px;

  border: 1px dashed rgba(255, 255, 255, 0.15);
  border-radius: 16px;

  color: #9999a7;

  font-size: 14px;
  line-height: 1.7;
  text-align: center;
}

@media (max-width: 600px) {
  .commentaire-video-news {
    padding: 16px;
  }

  .titre-commentaires-video-news {
    font-size: 20px;
  }
}




/* ÉLECTIONS */

#vue-elections-news {
  position: relative;
  z-index: 1;

  width: 96%;
  max-width: 1800px;
  min-height: 65svh;

  margin: 0 auto;
  padding-bottom: 80px;
}

.presentation-elections-news {
  padding: 38px 0;
}

.surtitre-elections-news {
  display: block;
  margin-bottom: 16px;

  color: var(--rouge-news);

  font-size: 11px;
  font-weight: 800;
  letter-spacing: 2px;
}

#titre-elections-news {
  margin: 0 0 16px;

  font-size: clamp(32px, 4.5vw, 58px);
  line-height: 1.12;
  letter-spacing: -1.5px;
}

.presentation-elections-news p,
.informations-president-news p,
.entete-programmes-news p {
  margin: 0;
  max-width: 680px;

  color: #aaaab5;

  font-size: 16px;
  line-height: 1.8;
}


/* CARTE DU PRÉSIDENT */

.presidence-news {
  display: grid;
  grid-template-columns:
    minmax(0, 0.85fr)
    minmax(0, 1.15fr);

  overflow: hidden;

  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 30px;

  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.065),
    rgba(255, 255, 255, 0.02)
  );

  box-shadow: 0 24px 65px rgba(0, 0, 0, 0.28);

  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.portrait-president-news {
  position: relative;
  min-height: 380px;

  background: linear-gradient(
    145deg,
    #25252b,
    #141416
  );
}

#image-president-news {
  position: absolute;
  inset: 0;

  width: 100%;
  height: 100%;

  object-fit: cover;
  object-position: center;
}

.attente-portrait-news {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 20px;

  min-height: 380px;
  height: 100%;

  color: #858590;
  font-size: 13px;
}

.attente-portrait-news svg {
  width: 96px;

  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
}

.informations-president-news {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 24px;

  min-width: 0;
  padding: clamp(28px, 5vw, 76px);
}

.fonction-president-news {
  color: #c5c5ce;

  font-size: 11px;
  font-weight: 800;
  letter-spacing: 2px;
}

#nom-president-news {
  margin: 0;

  font-size: clamp(30px, 4vw, 64px);
  line-height: 1.12;
  letter-spacing: -1px;

  overflow-wrap: anywhere;
}


/* BANDEAU DE STATUT */

.statut-election-news {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;

  width: fit-content;
  max-width: 100%;

  margin: 28px auto 0;
  padding: 18px 24px;

  border: 1px solid rgba(237, 22, 57, 0.3);
  border-radius: 18px;

  background: rgba(237, 22, 57, 0.09);
  color: #ff8b9d;

  font-size: 14px;
  font-weight: 700;
  line-height: 1.6;

  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

/* Vert lorsque les élections sont ouvertes */

.statut-election-news[data-statut="ouvertes"] {
  border-color: rgba(65, 210, 147, 0.3);

  background: rgba(65, 210, 147, 0.09);
  color: #83e4b6;
}

.point-statut-election-news {
  flex: 0 0 9px;
  height: 9px;

  border-radius: 50%;

  background: currentColor;
  box-shadow: 0 0 16px currentColor;
}


/* PROGRAMMES POLITIQUES */

.programmes-election-news {
  margin-top: 64px;
}

.entete-programmes-news {
  margin-bottom: 28px;
}

.entete-programmes-news h2 {
  margin: 0 0 12px;

  font-size: clamp(24px, 3vw, 34px);
  letter-spacing: -0.6px;
}

.grille-candidats-news {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
}

.aucun-candidat-news {
  margin: 0;
  padding: 64px 24px;

  border: 1px dashed rgba(255, 255, 255, 0.16);
  border-radius: 24px;

  background: rgba(255, 255, 255, 0.025);
  color: #aaaab5;

  line-height: 1.8;
  text-align: center;
}


/* ADAPTATION AUX PETITS ÉCRANS */

@media (max-width: 1000px) {
  .grille-candidats-news {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .presidence-news {
    grid-template-columns: minmax(0, 1fr);
  }

  .portrait-president-news,
  .attente-portrait-news {
    min-height: 300px;
  }

  .presentation-elections-news {
    padding-top: 24px;
  }

  .statut-election-news {
    width: 100%;
    justify-content: flex-start;
  }

  .programmes-election-news {
    margin-top: 44px;
  }

  .grille-candidats-news {
    grid-template-columns: minmax(0, 1fr);
  }
}





/* COMMANDES DE LA RUBRIQUE ÉLECTIONS */

.commandes-elections-news {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 14px;

  margin-bottom: 28px;
}

#etat-elections-news {
  flex: 1 1 260px;
  margin: 0;

  color: #aaaab5;

  font-size: 13px;
  line-height: 1.7;
}


/* BOUTONS ACTIFS ET ENREGISTREMENT */

#mode-elections-news[aria-pressed="true"],
#mode-elections-news[aria-pressed="true"]:hover,
#formulaire-presidence-news [type="submit"],
#formulaire-presidence-news [type="submit"]:hover {
  background: #f4f4f5;
  color: #161616;

  border-color: rgba(255, 255, 255, 0.85);
}


/* FORMULAIRE */

#formulaire-presidence-news {
  display: grid;
  gap: 24px;
}

#formulaire-presidence-news :disabled,
.commandes-elections-news :disabled {
  opacity: 0.6;
  cursor: wait;
}


/* BLOQUE LE DÉFILEMENT DERRIÈRE LE FORMULAIRE */

html:has(#fenetre-presidence-news[open]) {
  overflow: hidden;
}


@media (max-width: 600px) {
  #etat-elections-news {
    flex-basis: 100%;
  }
}



/* COMMANDES DES CANDIDATS */

.commandes-candidats-news {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;

  margin-bottom: 26px;
}

#etat-candidats-news {
  flex: 1 1 240px;
  margin: 0;

  color: #aaaab5;

  font-size: 13px;
  line-height: 1.7;
}


/* CARTES DES CANDIDATS */

.carte-candidat-news {
  min-width: 0;
  overflow: hidden;

  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 24px;

  background: rgba(255, 255, 255, 0.04);

  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.22);

  transition:
    transform 250ms ease,
    border-color 250ms ease;
}

.ouvrir-candidat-news {
  display: block;
  width: 100%;
  padding: 0;

  border: 0;
  background: transparent;
  color: inherit;

  font: inherit;
  text-align: left;

  cursor: pointer;
}

.visuel-candidat-news {
  display: block;

  aspect-ratio: 4 / 3;
  overflow: hidden;

  background: #1b1b1e;
}

.visuel-candidat-news img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;

  transition: transform 450ms ease;
}

.texte-candidat-news {
  display: grid;
  gap: 16px;

  padding: 26px;
}

.nom-carte-candidat-news {
  font-size: 24px;
  line-height: 1.25;

  overflow-wrap: anywhere;
}

.extrait-candidat-news {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;

  overflow: hidden;

  color: #aaaab5;

  font-size: 14px;
  line-height: 1.8;

  overflow-wrap: anywhere;
}

.lien-programme-news {
  display: flex;
  align-items: center;
  justify-content: space-between;

  padding-top: 8px;

  color: #f5f5f7;

  font-size: 13px;
  font-weight: 700;
}


/* COMMANDES VISIBLES EN MODE MODIFICATION */

.actions-candidat-news {
  display: none;
  flex-wrap: wrap;
  gap: 10px;

  padding: 0 26px 26px;
}

.elections-edition .actions-candidat-news {
  display: flex;
}

.actions-candidat-news .bouton-news {
  min-height: 42px;
  padding: 10px 16px;

  font-size: 13px;
}

.actions-candidat-news [data-action-candidat="supprimer"]:hover {
  border-color: rgba(237, 22, 57, 0.5);
  color: #ffabb9;
}

.ouvrir-candidat-news:focus-visible {
  outline-offset: -5px;
}


/* FORMULAIRE DU CANDIDAT */

#formulaire-candidat-news {
  display: grid;
  gap: 24px;
}

#programme-candidat-news {
  min-height: 260px;
}

#formulaire-candidat-news [type="submit"],
#formulaire-candidat-news [type="submit"]:hover {
  background: #f4f4f5;
  color: #161616;

  border-color: rgba(255, 255, 255, 0.85);
}

#formulaire-candidat-news :disabled,
.commandes-candidats-news :disabled,
.carte-candidat-news :disabled {
  opacity: 0.6;
  cursor: wait;
}


/* FENÊTRE DE LECTURE DU PROGRAMME */

.fenetre-news.lecture-programme-news {
  width: min(1160px, calc(100vw - 32px));
  max-width: none;

  padding: 0;

  overscroll-behavior: contain;
}

.entete-lecture-programme-news {
  position: sticky;
  top: 0;
  z-index: 2;

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;

  padding: 16px 24px;

  border-bottom: 1px solid rgba(255, 255, 255, 0.1);

  background: rgba(18, 18, 18, 0.94);

  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.etat-programme-news {
  margin: 0;
  padding: 40px 28px;

  color: #aaaab5;
  line-height: 1.8;
}

#portrait-programme-news {
  display: block;

  width: 100%;
  max-height: 440px;

  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.corps-programme-news {
  max-width: 900px;
  margin: 0 auto;

  padding: 48px 32px 64px;
}

#nom-programme-news {
  margin: 0 0 36px;

  font-size: clamp(30px, 4vw, 52px);
  line-height: 1.15;
  letter-spacing: -1px;

  overflow-wrap: anywhere;
}

#texte-programme-news p {
  margin: 0 0 24px;

  color: #d5d5dc;

  font-size: 17px;
  line-height: 1.9;

  white-space: pre-line;
  overflow-wrap: anywhere;
}


/* BLOQUE LA PAGE DERRIÈRE LES FENÊTRES */

html:has(
  #fenetre-candidat-news[open],
  #lecture-programme-news[open]
) {
  overflow: hidden;
}


/* SURVOL */

@media (hover: hover) {
  .carte-candidat-news:hover {
    transform: translateY(-5px);

    border-color: rgba(255, 255, 255, 0.28);
  }

  .ouvrir-candidat-news:hover img {
    transform: scale(1.035);
  }
}


/* PETITS ÉCRANS */

@media (max-width: 600px) {
  .corps-programme-news {
    padding: 32px 22px 42px;
  }

  .entete-lecture-programme-news {
    padding: 14px 18px;
  }

  .entete-lecture-programme-news .marque-news {
    font-size: 20px;
  }
}


/* RÉDUCTION DES ANIMATIONS */

@media (prefers-reduced-motion: reduce) {
  .carte-candidat-news,
  .visuel-candidat-news img {
    transition: none;
  }

  .carte-candidat-news:hover,
  .ouvrir-candidat-news:hover img {
    transform: none;
  }
}