main {
   section {
      gap: 2em;
   }

   .seccion-introduccion {
      .contenedor-introduccion {
         display: flex;
         flex-direction: column;
         gap: 2em;
         padding: 1em;
         background-color: var(--color-blanco-menos-intenso);
         border-radius: 1em;
         max-width: 1000px;
      }
   }

   .seccion-ruta {
      .contenedor-ruta {
         display: flex;
         flex-direction: column;
         gap: 2em;
         padding: 1em;
         background-color: var(--color-cuaternario-transparente-9);
         border-radius: 1em;
         max-width: 1000px;

         p {
            color: var(--color-blanco);
         }

         ul {
            display: flex;
            flex-direction: column;
            gap: 0.8em;
            margin-left: 1.5em;

            li {
               list-style-type: disc;
               color: var(--color-blanco);

               strong {
                  color: var(--color-terciario);
               }
            }
         }
      }
   }

   .seccion-accidentes {
      .contenedor-accidentes {
         display: flex;
         flex-direction: column;
         gap: 2em;
         padding: 1em;
         background-color: var(--color-blanco-menos-intenso);
         border-radius: 1em;
         max-width: 1000px;

         ul {
            display: flex;
            flex-direction: column;
            gap: 0.8em;
            margin-left: 1.5em;

            li {
               list-style-type: disc;

               strong {
                  color: var(--color-secundario);
               }
            }
         }
      }
   }

   .seccion-horario {
      .contenedor-horario {
         display: flex;
         flex-direction: column;
         gap: 2em;
         padding: 1em;
         border-radius: 1em;
         max-width: 1000px;

         .tarjeta {
            display: flex;
            flex-direction: column;
            gap: 0.5em;
            padding: 1em;
            background-color: var(--color-cuaternario-transparente-9);
            border-radius: 1em;


            h3 {
               color: var(--color-terciario);
               font-size: 1.4rem;
               text-align: left;
            }

            p {
               color: var(--color-blanco);
            }
         }


      }
   }

}

@media (min-width: 768px) {
   main {
      .seccion-horario {
         .contenedor-horario {
            flex-direction: row;
         }
      }
   }
}