:root {
  --mto-accueil-vert: #276f60;
  --mto-accueil-vert-fonce: #174d46;
  --mto-accueil-bleu: #27669d;
  --mto-accueil-encre: #172a35;
  --mto-accueil-texte-secondaire: #5e707a;
  --mto-accueil-bordure: #d6e1e4;
  --mto-accueil-fond: #f4f8f7;
  --mto-accueil-fond-accent: #eaf4f1;
  --mto-accueil-rayon: 1rem;
  --mto-accueil-ombre: 0 0.45rem 1.4rem rgb(23 42 53 / 6%);
}

.mto-accueil-page {
  width: 100%;
  max-width: 1500px;
  box-sizing: border-box;
  padding: 1.35rem clamp(1rem, 3vw, 3rem) 3rem;
  margin: 0 auto;
  color: var(--mto-accueil-encre);
}

.mto-accueil-entete-page {
  display: flex;
  gap: 2rem;
  align-items: flex-end;
  justify-content: space-between;
  padding: 1.35rem clamp(1.3rem, 3vw, 2.1rem);
  margin-bottom: 0.675rem;
  border-radius: 1.25rem;
  background: linear-gradient(125deg, var(--mto-accueil-vert-fonce), var(--mto-accueil-vert) 67%, #2f7d70);
  color: #fff;
  box-shadow: 0 1rem 2.5rem rgb(23 77 70 / 16%);
}

.mto-accueil-entete-page > div {
  max-width: 52rem;
}

.mto-accueil-sur-titre {
  display: flex;
  gap: 0.45rem;
  align-items: center;
  margin: 0;
  opacity: 1;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.mto-accueil-entete-page h1 {
  margin: 0.18rem 0 0.35rem;
  color: #fff;
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1.05;
}

.mto-accueil-entete-page p:last-child {
  margin: 0;
  line-height: 1.5;
}

.mto-accueil-entete-page > wa-badge::part(base),
.mto-accueil-entete-page > wa-badge::part(badge) {
  border-color: rgb(255 255 255 / 34%);
  background: rgb(255 255 255 / 12%);
  color: #fff;
  font-weight: 800;
}

.mto-accueil-colonnes {
  display: grid;
  width: 100%;
  grid-template-columns: 600px minmax(0, 1fr) 350px;
  gap: clamp(0.55rem, 1vw, 1rem);
  align-items: start;
}

.mto-accueil-colonne {
  min-width: 0;
}

.mto-accueil-colonne--actualites {
  width: 600px;
}

.mto-accueil-colonne--services,
.mto-accueil-colonne--environnement {
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: 0.5rem;
}

.mto-accueil-colonne--environnement {
  width: 350px;
}

.mto-accueil-section,
.mto-accueil-a-la-une,
.mto-accueil-prochain-train,
.mto-accueil-carburants,
.mto-accueil-bornes,
.mto-accueil-environnement {
  min-width: 0;
}

.mto-accueil-carte {
  display: block;
  overflow: hidden;
  border-radius: var(--mto-accueil-rayon);
  background: #fff;
  box-shadow: var(--mto-accueil-ombre);
}

.mto-accueil-carte::part(base) {
  overflow: hidden;
  border-color: var(--mto-accueil-bordure);
  border-radius: var(--mto-accueil-rayon);
  background: #fff;
}

.mto-accueil-carte::part(body) {
  padding: 0;
}

.mto-accueil-carte::part(footer) {
  padding: 0;
  border-color: var(--wa-color-neutral-border-quiet, var(--mto-accueil-bordure));
  background: transparent;
}

.mto-accueil-carte-action {
  display: flex;
  width: 100%;
  min-height: 2.875rem;
  box-sizing: border-box;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.7rem 1rem;
  border: 1px solid transparent;
  border-radius: 0 0 var(--mto-accueil-rayon) var(--mto-accueil-rayon);
  background: var(--mto-accueil-fond);
  background: color-mix(in srgb, var(--mto-accueil-vert) 5%, transparent);
  color: var(--mto-accueil-vert-fonce);
  font-size: 0.84rem;
  font-weight: 600;
  line-height: 1.35;
  text-decoration: none;
  text-transform: none;
  transition: background-color 180ms ease, color 180ms ease;
}

.mto-accueil-carte-action > span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.mto-accueil-carte-action__icone {
  flex: 0 0 auto;
  transition: transform 180ms ease;
}

.mto-accueil-carte-action:hover {
  background: var(--mto-accueil-fond-accent);
  background: color-mix(in srgb, var(--mto-accueil-vert) 10%, transparent);
  color: var(--mto-accueil-encre);
}

.mto-accueil-carte-action:hover .mto-accueil-carte-action__icone {
  transform: translateX(0.2rem);
}

.mto-accueil-carte-action:focus-visible {
  outline: 3px solid var(--mto-color-focus-externe);
  outline-offset: -3px;
  box-shadow: inset 0 0 0 5px var(--mto-color-focus-interne);
}

.mto-accueil-section-entete {
  display: flex;
  gap: 1rem;
  align-items: end;
  justify-content: space-between;
  margin-bottom: 0.75rem;
}

.mto-accueil-section-entete > div > span {
  color: var(--mto-accueil-vert);
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.mto-accueil-section-entete h2 {
  margin: 0.08rem 0 0;
  color: var(--mto-accueil-encre);
  font-size: clamp(1.15rem, 2vw, 1.45rem);
  line-height: 1.2;
  text-wrap: balance;
}

.mto-accueil-section-entete > a {
  display: inline-flex;
  min-height: 2rem;
  box-sizing: border-box;
  gap: 0.4rem;
  align-items: center;
  color: var(--mto-accueil-vert-fonce);
  font-size: 0.76rem;
  font-weight: 800;
  text-decoration: none;
}

.mto-accueil-section-entete > a:hover,
.mto-accueil-section-entete > a:focus-visible {
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.mto-accueil-section-entete--interne {
  align-items: center;
  padding: 0.9rem 1rem;
  margin: 0;
  border-bottom: 1px solid var(--mto-accueil-bordure);
  background: #fbfdfc;
}

.mto-accueil-section-entete--interne > wa-icon {
  color: var(--mto-accueil-vert);
  font-size: 1.15rem;
}

.mto-accueil-a-la-une-carte {
  border-top: 0.25rem solid var(--mto-accueil-a-la-une-couleur, var(--mto-color-principal));
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.mto-accueil-a-la-une-carte:hover,
.mto-accueil-a-la-une-carte:focus-within {
  transform: translateY(-0.15rem);
  box-shadow: 0 0.8rem 1.8rem rgb(23 42 53 / 12%);
}

.mto-accueil-a-la-une-lien {
  display: block;
  min-width: 0;
  color: inherit;
  text-decoration: none;
}

.mto-accueil-a-la-une-lien:focus-visible {
  outline: 0.18rem solid var(--mto-accueil-a-la-une-couleur, var(--mto-color-principal));
  outline-offset: -0.18rem;
}

.mto-accueil-a-la-une-visuel {
  display: block;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: var(--mto-accueil-fond-accent);
}

.mto-accueil-a-la-une-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 220ms ease;
}

.mto-accueil-a-la-une-carte:hover .mto-accueil-a-la-une-image,
.mto-accueil-a-la-une-carte:focus-within .mto-accueil-a-la-une-image {
  transform: scale(1.025);
}

.mto-accueil-a-la-une-corps {
  display: block;
  padding: clamp(1rem, 2.2vw, 1.35rem);
}

.mto-accueil-a-la-une-etiquettes {
  display: flex;
  gap: 0.4rem;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 0.75rem;
}

.mto-accueil-a-la-une-etiquettes wa-badge:last-child::part(base),
.mto-accueil-a-la-une-etiquettes wa-badge:last-child::part(badge) {
  border-color: color-mix(in srgb, var(--mto-accueil-a-la-une-couleur) 45%, var(--mto-accueil-bordure));
  background: color-mix(in srgb, var(--mto-accueil-a-la-une-couleur) 9%, #fff);
  color: var(--mto-accueil-encre);
}

.mto-accueil-a-la-une-titre {
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--mto-accueil-encre);
  font-size: clamp(1.45rem, 3vw, 2rem);
  line-height: 1.16;
  text-wrap: balance;
}

.mto-accueil-a-la-une-description {
  display: -webkit-box;
  overflow: hidden;
  margin: 0.8rem 0 1rem;
  color: var(--mto-accueil-texte-secondaire);
  font-size: 0.96rem;
  line-height: 1.58;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

.mto-accueil-a-la-une-action {
  display: inline-flex;
  min-height: 2.7rem;
  box-sizing: border-box;
  gap: 0.5rem;
  align-items: center;
  padding: 0.65rem 0.9rem;
  border-radius: 0.7rem;
  background: var(--mto-accueil-vert-fonce);
  color: #fff;
  font-size: 0.82rem;
  font-weight: 800;
}

.mto-accueil-a-la-une-lien:hover .mto-accueil-a-la-une-action {
  background: var(--mto-accueil-vert);
}

.mto-accueil-derniers-articles {
  margin-top: 0.625rem;
}

.mto-articles-grille {
  --min-column-size: max(30%, 11rem);
}

.mto-article-carte {
  min-width: 0;
}

.mto-article-carte-lien {
  position: relative;
  display: block;
  width: 100%;
  height: 12rem;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 0.8rem;
  background: var(--mto-article-couleur, var(--mto-color-principal));
  color: #fff;
  box-shadow: 0 0.25rem 0.8rem rgb(0 0 0 / 14%);
  isolation: isolate;
  text-decoration: none;
}

.mto-article-carte-lien::before {
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(to top, rgb(0 0 0 / 82%) 0%, rgb(0 0 0 / 18%) 62%, transparent 100%);
  content: "";
}

.mto-article-carte-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 220ms ease;
}

.mto-article-carte-titre {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 0;
  left: 0;
  margin: 0;
  padding: 1rem 0.85rem 0.8rem;
  color: #fff;
  font-size: clamp(0.82rem, 1.25vw, 1.02rem);
  font-weight: 800;
  line-height: 1.3;
  text-shadow: 0 1px 3px rgb(0 0 0 / 70%);
}

.mto-article-carte-lien:hover .mto-article-carte-image,
.mto-article-carte-lien:focus-visible .mto-article-carte-image {
  transform: scale(1.04);
}

.mto-article-carte-lien:focus-visible {
  outline: 0.18rem solid var(--mto-article-couleur, var(--mto-color-principal));
  outline-offset: 0.15rem;
}

.mto-accueil-liste-compacte {
  display: grid;
}

.mto-accueil-ligne-compacte {
  display: block;
  color: inherit;
  text-decoration: none;
}

.mto-accueil-ligne-compacte + .mto-accueil-ligne-compacte {
  border-top: 1px solid var(--mto-accueil-bordure);
}

.mto-accueil-ligne-compacte article {
  display: grid;
  min-width: 0;
  grid-template-columns: 3.4rem minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: center;
  padding: 0.72rem 0.85rem;
  transition: background-color 140ms ease;
}

.mto-accueil-ligne-compacte:hover article,
.mto-accueil-ligne-compacte:focus-visible article {
  background: var(--mto-accueil-fond-accent);
}

.mto-accueil-ligne-compacte:focus-visible {
  outline: 0.16rem solid var(--mto-accueil-vert);
  outline-offset: -0.16rem;
}

.mto-accueil-ligne-compacte article > div {
  min-width: 0;
}

.mto-accueil-ligne-compacte article > wa-icon {
  color: #8aa09b;
  font-size: 0.75rem;
}

.mto-accueil-miniature {
  display: block;
  width: 3.4rem;
  height: 3.4rem;
  border-radius: 0.7rem;
  object-fit: cover;
}

.mto-accueil-miniature--icone {
  display: grid;
  place-items: center;
  background: var(--mto-accueil-fond-accent);
  color: var(--mto-accueil-vert);
  font-size: 1.05rem;
}

.mto-accueil-miniature--information {
  background: #edf5fb;
  color: var(--mto-color-information);
}

.mto-accueil-ligne-compacte time,
.mto-accueil-ligne-categorie,
.mto-accueil-information-meta {
  color: var(--mto-accueil-vert);
  font-size: 0.67rem;
  font-weight: 850;
  letter-spacing: 0.025em;
  text-transform: uppercase;
}

.mto-accueil-information-meta {
  display: flex;
  gap: 0.45rem;
  align-items: baseline;
  flex-wrap: wrap;
}

.mto-accueil-information-meta time {
  color: var(--mto-accueil-texte-secondaire);
  font-size: 0.9em;
  font-weight: 650;
  letter-spacing: 0;
  text-transform: none;
}

.mto-accueil-ligne-compacte h3 {
  display: -webkit-box;
  overflow: hidden;
  margin: 0.18rem 0 0;
  color: var(--mto-accueil-encre);
  font-size: 0.88rem;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

.mto-accueil-etat-vide {
  margin: 0.85rem;
  color: var(--mto-accueil-texte-secondaire);
}

.mto-accueil-etat-vide--compact {
  font-size: 0.76rem;
}

.mto-accueil-environnement .mto-accueil-carte::part(base) {
  background: radial-gradient(circle at 100% 0, rgb(255 205 126 / 26%), transparent 38%), linear-gradient(145deg, #f2fbf9, #fff 62%);
}

.mto-accueil-environnement header {
  display: flex;
  gap: 0.8rem;
  align-items: center;
  padding: 1rem;
  border-bottom: 1px solid var(--mto-accueil-bordure);
}

.mto-accueil-environnement-icone {
  display: grid;
  width: 2.8rem;
  height: 2.8rem;
  flex: 0 0 2.8rem;
  place-items: center;
  border-radius: 0.75rem;
  background: var(--mto-accueil-vert-fonce);
  color: #fff;
  font-size: 1.2rem;
}

.mto-accueil-environnement-entete {
  min-width: 0;
}

.mto-accueil-environnement h2,
.mto-accueil-environnement p {
  margin: 0;
}

.mto-accueil-environnement h2 {
  color: var(--mto-accueil-encre);
  font-size: 1.08rem;
  line-height: 1.2;
}

.mto-accueil-environnement-date {
  display: block;
  margin-top: 0.15rem;
  color: #3f5f5b;
  font-size: 0.75rem;
  font-weight: 750;
}

.mto-accueil-environnement .mto-accueil-environnement-prenoms {
  display: flex;
  gap: 0.35rem;
  align-items: flex-start;
  margin-top: 0.28rem;
  color: var(--mto-accueil-texte-secondaire);
  font-size: 0.7rem;
  line-height: 1.3;
}

.mto-accueil-environnement-prenoms wa-icon {
  flex: none;
  margin-top: 0.08rem;
  color: #b97200;
}

.mto-accueil-environnement-grille {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  padding: 0.3rem 0.9rem;
}

.mto-accueil-indicateur {
  --mto-accueil-couleur: var(--mto-color-principal);
  display: grid;
  min-width: 0;
  grid-template-columns: 2.2rem minmax(0, 1fr);
  gap: 0.65rem;
  align-items: center;
  padding: 0.65rem 0;
}

.mto-accueil-indicateur + .mto-accueil-indicateur {
  border-top: 1px solid rgb(18 61 56 / 10%);
}

.mto-accueil-indicateur > div:last-child {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.15rem 0.55rem;
  align-items: baseline;
}

.mto-accueil-indicateur--meteo { --mto-accueil-couleur: #d89210; }
.mto-accueil-indicateur--vent { --mto-accueil-couleur: #3f8fcb; }
.mto-accueil-indicateur--soleil { --mto-accueil-couleur: #d89210; }

.mto-accueil-indicateur-pictogramme {
  display: grid;
  width: 2.2rem;
  height: 2.2rem;
  place-items: center;
  border-radius: 50%;
  background: color-mix(in srgb, var(--mto-accueil-couleur) 17%, white);
  color: color-mix(in srgb, var(--mto-accueil-couleur) 78%, #102a43);
  font-size: 1rem;
}

.mto-accueil-indicateur-pictogramme img {
  width: 2.3rem;
  height: 2.3rem;
  object-fit: contain;
}

.mto-accueil-indicateur-libelle {
  color: var(--mto-accueil-texte-secondaire);
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.025em;
  text-transform: uppercase;
}

.mto-accueil-indicateur strong {
  overflow-wrap: anywhere;
  color: var(--mto-accueil-encre);
  font-size: 0.86rem;
  line-height: 1.2;
  text-align: right;
}

.mto-accueil-indicateur small {
  grid-column: 1 / -1;
  color: #6e817e;
  font-size: 0.68rem;
  text-align: right;
}

.mto-accueil-horaires-soleil,
.mto-accueil-horaires-soleil span {
  display: inline-flex;
  gap: 0.25rem;
  align-items: center;
  white-space: nowrap;
}

.mto-accueil-horaires-soleil wa-icon {
  color: #b97200;
  font-size: 0.78rem;
}

.mto-accueil-prochain-train-entete,
.mto-accueil-carburants-entete,
.mto-accueil-bornes-entete {
  display: flex;
  gap: 0.55rem;
  align-items: center;
  padding: 0.75rem 0.85rem;
  border-bottom: 1px solid var(--mto-accueil-bordure);
  background: #fbfdfc;
}

.mto-accueil-prochain-train-entete {
  color: var(--mto-accueil-bleu);
}

.mto-accueil-carburants-entete {
  color: #8f4d00;
}

.mto-accueil-bornes-entete {
  color: #187356;
}

.mto-accueil-prochain-train-entete h2,
.mto-accueil-carburants-entete h2,
.mto-accueil-bornes-entete h2 {
  margin: 0;
  color: currentcolor;
  font-size: 0.92rem;
  line-height: 1.25;
}

.mto-accueil-prochain-train-entete h2 i,
.mto-accueil-carburants-entete h2 i,
.mto-accueil-bornes-entete h2 i {
  display: block;
  margin-top: 0.1rem;
  color: var(--mto-accueil-texte-secondaire);
  font-style: normal;
  font-weight: 600;
}

.mto-accueil-prochain-train-ligne {
  display: grid;
  min-width: 0;
  grid-template-columns: 3rem minmax(0, 1fr) auto;
  gap: 0.6rem;
  align-items: center;
  padding: 0.65rem 0.75rem;
  color: var(--mto-accueil-encre);
  text-decoration: none;
}

.mto-accueil-prochain-train-ligne + .mto-accueil-prochain-train-ligne,
.mto-accueil-carburant + .mto-accueil-carburant,
.mto-accueil-carburant-indisponible + .mto-accueil-carburant,
.mto-accueil-carburant + .mto-accueil-carburant-indisponible,
.mto-accueil-carburant-indisponible + .mto-accueil-carburant-indisponible,
.mto-accueil-borne-ligne + .mto-accueil-borne-ligne {
  border-top: 1px solid var(--mto-accueil-bordure);
}

.mto-accueil-prochain-train-ligne:hover,
.mto-accueil-prochain-train-ligne:focus-visible {
  background: #eef6fc;
  color: inherit;
}

.mto-accueil-prochain-train-heures {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}

.mto-accueil-prochain-train-heures time {
  color: var(--mto-accueil-bleu);
  font-size: 1rem;
  font-weight: 800;
}

.mto-accueil-prochain-train-heures del {
  color: #8a5a2b;
  font-size: 0.65rem;
}

.mto-accueil-prochain-train-direction {
  min-width: 0;
}

.mto-accueil-prochain-train-direction strong,
.mto-accueil-prochain-train-direction small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mto-accueil-prochain-train-direction strong {
  font-size: 0.8rem;
}

.mto-accueil-prochain-train-direction small {
  margin-top: 0.1rem;
  color: var(--mto-accueil-texte-secondaire);
  font-size: 0.67rem;
}

.mto-accueil-prochain-train-meta {
  display: flex;
  align-items: flex-end;
  flex-direction: column;
}

.mto-accueil-prochain-train-numero {
  color: var(--mto-accueil-texte-secondaire);
  font-size: 0.65rem;
  white-space: nowrap;
}

.mto-accueil-prochain-train-statut {
  margin-top: 0.15rem;
  padding: 0.12rem 0.32rem;
  border-radius: 999px;
  font-size: 0.62rem;
  line-height: 1.2;
  white-space: nowrap;
}

.mto-accueil-prochain-train-statut--retard,
.mto-accueil-prochain-train-statut--modifie {
  background: #fff0cc;
  color: #8a4d00;
}

.mto-accueil-prochain-train-statut--supprime {
  background: #fde3e3;
  color: #a32222;
}

.mto-accueil-prochain-bus .mto-accueil-prochain-train-entete,
.mto-accueil-prochain-bus .mto-accueil-prochain-train-heures time {
  color: #174d78;
}

.mto-accueil-prochain-bus-numero {
  display: inline-flex;
  min-width: 2rem;
  justify-content: center;
  padding: 0.16rem 0.38rem;
  border-radius: 0.35rem;
  background: var(--couleur-ligne-bus, #174d78);
  color: var(--couleur-texte-ligne-bus, #fff);
  font-size: 0.68rem;
  font-weight: 800;
}

.mto-accueil-prochain-bus-reservation {
  margin-top: 0.15rem;
  color: #8a4d00;
  font-size: 0.58rem;
  white-space: nowrap;
}

.mto-accueil-carburant {
  display: grid;
  min-width: 0;
  grid-template-columns: 2.5rem minmax(0, 1fr) auto;
  gap: 0.6rem;
  align-items: center;
  padding: 0.6rem 0.75rem;
  color: var(--mto-accueil-encre);
  text-decoration: none;
}

.mto-accueil-carburant:hover,
.mto-accueil-carburant:focus-visible {
  background: #fff5e7;
  color: inherit;
}

.mto-accueil-carburant img,
.mto-accueil-carburant-image-defaut {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.55rem;
  object-fit: cover;
}

.mto-accueil-carburant-image-defaut {
  display: grid;
  place-items: center;
  background: #ffe7bf;
  color: #a95c00;
}

.mto-accueil-carburant-identite {
  min-width: 0;
}

.mto-accueil-carburant-identite strong,
.mto-accueil-carburant-identite small {
  display: block;
}

.mto-accueil-carburant-identite strong {
  font-size: 0.75rem;
  text-transform: uppercase;
}

.mto-accueil-carburant-identite small {
  overflow: hidden;
  color: var(--mto-accueil-texte-secondaire);
  font-size: 0.67rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mto-accueil-carburant-prix {
  color: #8f4d00;
  font-size: 0.84rem;
  white-space: nowrap;
}

.mto-accueil-carburant-indisponible {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  margin: 0;
  padding: 0.65rem 0.75rem;
  color: var(--mto-accueil-texte-secondaire);
  font-size: 0.75rem;
}

.mto-accueil-borne-ligne {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 2rem auto;
  gap: 0.45rem;
  align-items: center;
  padding: 0.5rem 0.75rem;
  color: var(--mto-accueil-encre);
  text-decoration: none;
}

.mto-accueil-borne-ligne:hover,
.mto-accueil-borne-ligne:focus-visible {
  background: #edf8f4;
  color: inherit;
}

.mto-accueil-borne-puissance {
  display: inline-flex;
  min-width: 0;
  gap: 0.4rem;
  align-items: center;
  font-size: 0.74rem;
  font-weight: 750;
}

.mto-accueil-borne-puissance wa-icon,
.mto-accueil-borne-nombre {
  color: #187356;
}

.mto-accueil-borne-nombre {
  text-align: right;
}

.mto-accueil-borne-libelle {
  color: var(--mto-accueil-texte-secondaire);
  font-size: 0.67rem;
  white-space: nowrap;
}

@media (max-width: 1200px) and (min-width: 1081px) {
  .mto-accueil-colonnes {
    grid-template-columns: 600px minmax(0, 1fr);
  }

  .mto-accueil-colonne--environnement {
    grid-column: 2;
  }
}

@media (max-width: 1080px) {
  .mto-accueil-colonnes {
    grid-template-columns: minmax(0, 1fr);
  }

  .mto-accueil-colonne--actualites,
  .mto-accueil-colonne--services,
  .mto-accueil-colonne--environnement {
    width: 100%;
  }
}

@media (max-width: 920px) {
  body.page-accueil wa-page::part(main-content) {
    padding: 0;
    gap: 0;
  }

  body.page-accueil #main-content {
    width: 100%;
    min-width: 0;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
  }

  .mto-accueil-page {
    padding: 0;
    margin: 0;
  }

  .mto-accueil-entete-page {
    display: none;
  }

  .mto-accueil-colonnes {
    gap: 10px;
    reading-flow: grid-order;
  }

  /* Les contenus participent à la grille mobile sans être dupliqués. */
  .mto-accueil-colonne--actualites,
  .mto-accueil-colonne--services,
  .mto-accueil-colonne--environnement {
    display: contents;
  }

  .mto-accueil-colonne > :is(article, section, aside) {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .mto-accueil-environnement { order: 1; }
  .mto-accueil-a-la-une { order: 2; }
  .mto-accueil-agenda { order: 3; }
  .mto-accueil-derniers-articles { order: 4; margin-top: 0; }
  .mto-accueil-services { order: 5; }
  .mto-accueil-informations { order: 6; }
  .mto-accueil-prochain-train:not(.mto-accueil-prochain-bus) { order: 7; }
  .mto-accueil-prochain-bus { order: 8; }
  .mto-accueil-carburants { order: 9; }
  .mto-accueil-bornes { order: 10; }

  .mto-accueil-derniers-articles .mto-article-carte:nth-child(n + 3) {
    display: none;
  }

  .mto-article-carte-lien {
    height: 11rem;
  }
}

@media (max-width: 700px) {
  .mto-articles-grille {
    --min-column-size: 15rem;
  }

  .mto-accueil-entete-page {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.9rem;
    padding: 1.2rem;
    margin-bottom: 0.5rem;
  }

  .mto-accueil-entete-page h1 {
    font-size: clamp(1.85rem, 9vw, 2.45rem);
  }

  .mto-accueil-section-entete {
    align-items: flex-start;
  }

  .mto-accueil-section-entete--interne {
    align-items: center;
  }

  .mto-accueil-a-la-une-corps {
    padding: 1rem;
  }

  .mto-accueil-a-la-une-titre {
    font-size: clamp(1.3rem, 7vw, 1.75rem);
  }

  .mto-accueil-a-la-une-action,
  .mto-accueil-carte-action {
    width: 100%;
  }

  .mto-accueil-ligne-compacte article {
    grid-template-columns: 3.15rem minmax(0, 1fr) auto;
    padding-inline: 0.75rem;
  }

  .mto-accueil-miniature {
    width: 3.15rem;
    height: 3.15rem;
  }

  .mto-accueil-prochain-train-ligne {
    grid-template-columns: 3rem minmax(0, 1fr);
  }

  .mto-accueil-prochain-train-meta {
    grid-column: 2;
    align-items: flex-start;
    flex-flow: row wrap;
    gap: 0.35rem;
  }
}

@media (max-width: 390px) {
  .mto-accueil-environnement header {
    align-items: flex-start;
  }

  .mto-accueil-indicateur > div:last-child {
    grid-template-columns: minmax(0, 1fr);
  }

  .mto-accueil-indicateur strong,
  .mto-accueil-indicateur small {
    text-align: left;
  }

  .mto-accueil-carburant {
    grid-template-columns: 2.5rem minmax(0, 1fr);
  }

  .mto-accueil-carburant-prix {
    grid-column: 2;
  }

  .mto-accueil-borne-ligne {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .mto-accueil-borne-libelle {
    grid-column: 1 / -1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mto-accueil-a-la-une-carte,
  .mto-accueil-a-la-une-image,
  .mto-article-carte-image,
  .mto-accueil-ligne-compacte article,
  .mto-accueil-carte-action,
  .mto-accueil-carte-action__icone {
    transition: none;
  }
}
