/* eVous | Orientation villes de l'accueil national | 1.0.0 | 2026-10-16
 * Nouvelle feuille. A charger apres les autres CSS du sommaire.
 * Ne remplace aucune feuille existante.
 * Tous les selecteurs sont limites a #evous-accueil-villes.
 * Echelle locale medium, police heritee ; pas de dependance a la racine du theme.
 */
#evous-accueil-villes {
  --evous-villes-accent: #c60303;
  --evous-villes-texte: #252525;
  --evous-villes-secondaire: #60646b;
  --evous-villes-bordure: #dfe2e6;
  --evous-villes-survol: #fff5f5;
  display: block;
  box-sizing: border-box;
  clear: both;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 1em 0 2em;
  padding: 0;
  border: 0;
  background: #fff;
  color: var(--evous-villes-texte);
  font-family: inherit;
  font-size: medium;
  font-style: normal;
  font-weight: 400;
  line-height: 1.45;
  letter-spacing: normal;
  text-align: left;
  text-transform: none;
}
#evous-accueil-villes *,
#evous-accueil-villes *::before,
#evous-accueil-villes *::after { box-sizing: border-box; }

#evous-accueil-villes .evous-villes__intro { margin: 0 0 1.25em; padding: 0; }
#evous-accueil-villes .evous-villes__titre {
  display: block;
  clear: none;
  width: auto;
  margin: 0 0 .25em;
  padding: 0;
  border: 0;
  color: var(--evous-villes-texte);
  background: transparent;
  font-family: inherit;
  font-size: 1.75em;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: normal;
  text-transform: none;
  text-align: left;
  overflow-wrap: break-word;
}
#evous-accueil-villes .evous-villes__titre span { color: var(--evous-villes-accent); }
#evous-accueil-villes .evous-villes__description {
  margin: 0;
  padding: 0;
  color: var(--evous-villes-secondaire);
  font-size: 1em;
  font-weight: 400;
  line-height: 1.45;
}
#evous-accueil-villes .evous-villes__choix {
  display: flex;
  align-items: center;
  gap: .75em;
  margin: 0 0 .35em;
  padding: 0;
  color: var(--evous-villes-accent);
  font-size: 1.125em;
  font-weight: 600;
  line-height: 1.35;
}
#evous-accueil-villes .evous-villes__choix::after {
  content: "";
  flex: 1 1 auto;
  min-width: 1em;
  height: 1px;
  background: var(--evous-villes-bordure);
}
#evous-accueil-villes .evous-villes__navigation { display: block; margin: 0 0 1em; padding: 0; }
#evous-accueil-villes ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
#evous-accueil-villes li {
  display: block;
  float: none;
  clear: none;
  width: auto;
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  background: none;
}
#evous-accueil-villes li::before,
#evous-accueil-villes li::after { content: none; }
#evous-accueil-villes a,
#evous-accueil-villes a:visited {
  color: var(--evous-villes-texte);
  background-color: transparent;
  font-family: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: normal;
  text-decoration: none;
  text-transform: none;
  text-shadow: none;
  box-shadow: none;
  border: 0;
}
#evous-accueil-villes a::before,
#evous-accueil-villes a::after { content: none; }
#evous-accueil-villes a:hover {
  color: var(--evous-villes-accent);
  background-color: var(--evous-villes-survol);
  text-decoration: none;
}
/* Les themes SPIP peuvent imposer un fond sombre en focus avec !important.
 * Ces exceptions restent strictement limitees au nouveau bloc. */
#evous-accueil-villes a:focus {
  color: var(--evous-villes-accent) !important;
  background-color: #fff !important;
  border-color: transparent !important;
  outline: 2px solid #252525;
  outline-offset: 2px;
  text-shadow: none;
}
@supports selector(:focus-visible) {
  #evous-accueil-villes a:focus:not(:focus-visible) { outline: none; }
  #evous-accueil-villes a:focus-visible { outline: 2px solid #252525; outline-offset: 2px; }
}
#evous-accueil-villes .evous-villes__villes { display: flex; flex-wrap: wrap; gap: 0 .5em; }
#evous-accueil-villes .evous-villes__villes a {
  display: flex;
  align-items: center;
  min-width: 44px;
  min-height: 44px;
  padding: .35em .5em;
  border-radius: .2em;
  font-size: .9375em;
  white-space: normal;
  overflow-wrap: anywhere;
}
#evous-accueil-villes .evous-villes__grille {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1em;
  margin: 0;
  padding: 0;
}
#evous-accueil-villes .evous-villes__carte {
  display: block;
  float: none;
  min-width: 0;
  margin: 0;
  padding: .75em 1em;
  border: 1px solid var(--evous-villes-bordure);
  border-radius: .4em;
  background: #fff;
  box-shadow: none;
}
#evous-accueil-villes .evous-villes__ville {
  display: block;
  margin: 0;
  padding: 0 0 .3em;
  border: 0;
  background: transparent;
  color: var(--evous-villes-texte);
  font-family: inherit;
  font-size: 1.25em;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: normal;
  text-transform: none;
}
#evous-accueil-villes .evous-villes__ville a {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .2em .5em;
  min-width: 0;
  min-height: 44px;
  padding: .15em 0;
  border-radius: .1em;
  overflow-wrap: anywhere;
}
#evous-accueil-villes .evous-villes__voir {
  display: inline-flex;
  align-items: center;
  gap: .35em;
  color: var(--evous-villes-accent);
  font-size: .7em;
  font-weight: 400;
  white-space: nowrap;
}
#evous-accueil-villes .evous-villes__guides > li { border-top: 1px solid #eceef0; }
#evous-accueil-villes .evous-villes__guide {
  display: flex;
  align-items: center;
  gap: .65em;
  width: 100%;
  min-width: 0;
  min-height: 44px;
  margin: 0;
  padding: .65em .1em;
  border-radius: .1em;
  font-size: .9375em;
  font-weight: 400;
  line-height: 1.4;
}
#evous-accueil-villes .evous-villes__libelle { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
#evous-accueil-villes .evous-villes__icone {
  display: block;
  position: static;
  float: none;
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  fill: none;
  stroke: currentColor;
}
#evous-accueil-villes .evous-villes__icone--chevron,
#evous-accueil-villes .evous-villes__icone--fleche { flex-basis: 16px; width: 16px; height: 16px; }
#evous-accueil-villes .evous-villes__icone--chevron { color: #687078; }
/* La largeur du bloc determine la grille, pas le seul ecran.
 * Par defaut : 1 colonne ; 2 a partir de 576px ; 3 a partir de 912px,
 * avec un navigateur a 16px. Le texte agrandi retarde ces seuils. */
@supports (container-type: inline-size) {
  #evous-accueil-villes { container-type: inline-size; container-name: evous-villes; }
  @container evous-villes (min-width: 36em) {
    #evous-accueil-villes .evous-villes__grille { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    #evous-accueil-villes .evous-villes__titre { font-size: 2em; }
  }
  @container evous-villes (min-width: 57em) {
    #evous-accueil-villes .evous-villes__grille { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    #evous-accueil-villes .evous-villes__titre { font-size: 2.5em; }
    #evous-accueil-villes .evous-villes__description { font-size: 1.125em; }
    #evous-accueil-villes .evous-villes__choix { font-size: 1.25em; }
  }
}
/* Repli sans requetes de conteneur : repartition souple, au maximum 3 cartes. */
@supports not (container-type: inline-size) {
  #evous-accueil-villes .evous-villes__grille { display: flex; flex-wrap: wrap; }
  #evous-accueil-villes .evous-villes__carte { flex: 1 1 calc((100% - 2em) / 3); min-width: min(100%, 17em); max-width: 100%; }
}
@media (forced-colors: active) {
  #evous-accueil-villes .evous-villes__carte,
  #evous-accueil-villes .evous-villes__guides > li { border-color: CanvasText; }
  #evous-accueil-villes a,
  #evous-accueil-villes a:visited,
  #evous-accueil-villes .evous-villes__voir { color: LinkText; }
  #evous-accueil-villes a:focus { color: LinkText !important; background-color: Canvas !important; outline-color: Highlight; }
}
@media print {
  #evous-accueil-villes { break-inside: auto; }
  #evous-accueil-villes .evous-villes__carte { break-inside: avoid; }
}