@media (max-width: 1023px) {
  .layout {
    grid-template-columns: 1fr 300px;
    gap: var(--space-lg);
  }
  .sidebar-left {
      grid-column: 1 / -1;
      order: 2;
  }
  .sidebar-right {
    img {
      width: 100%;
    }
  }
  .container-header {
      nav {
        display: none;
      }
  }
  .multimedia {
    .container-multimedia {
        width: 95%;
        padding: var(--space-sm) 0;
        margin: var(--space-sm) auto;
        a {
          img {
            width: 100%;
          }
        }
    }
  }
}

/* Tablet: 768px */
@media (max-width: 768px) {
  .layout {
    grid-template-columns: 1fr;
    width: 95%;
    .cards {
      .card-foto {
        img {
          width: 100%;
          height: auto;
          left: 0;
        }
      }
    }
  }
  .sidebar-left {
      grid-column: 1 / -1;
      order: 2;
  }

  .sidebar-right {
    width: 95%;
    max-width: 250px;
    margin: auto;
  }

  .card {
    grid-template-columns: 150px 1fr;
    .foto {
        width: 150px;
        height: auto;
        img {
          width: 100%;
          height: 100%;
        }
    }

  .card-foto {
    background: red;
    padding: 20px;
  }

    .resumen {
      display: none;
    }
  }

  .title {
    font-size: 18px;
  }

  .container, .registro, .cartelera {
    width: 95%;
  }

  .layout-2col {
    grid-template-columns: 1fr;
    width: 95%;
  }

  .nota-ampliada {
    width: 100%;
  }

  .table-wrapper {
    width: 768px;
  }

  .multimedia {
    .container-multimedia {
        width: 95%;
        padding: var(--space-sm) 0;
        margin: var(--space-sm) auto;
        a {
          img {
            width: 100%;
          }
        }
    }
  }

  .container-video,
  .container-multimedia,
  .container-footer {
    grid-template-columns: 1fr !important;
  }

}

/* Movil pequeño: 390px */
@media (max-width: 390px) {
  .layout, .layout-2col {
    grid-template-columns: 1fr;
    width: 95%;
  }

  .nota-ampliada {
    padding: var(--space-sm);
    width: 95%;
  }

  .container {
    width: 95%;
  }

  .sidebar-left,
  .sidebar-right {
    display: none;
  }

  .container-header {
    & .logo {
        img {
            display: block;
            width: 150px;
        }
    }
     nav {
      display: none;
    }
  }

  .video {
    .container-video {
      width: min(var(--max-width), 100%);
      padding: var(--space-md);
      .nota {
          grid-column: 1 / -1;
          order: 2;
      }
    }
  }

  /* cards*/
  .card {
    grid-template-columns: 130px 1fr;
    gap: var(--space-md);
    padding: var(--space-sm);
    .foto {
      width: 100%;
      height: auto;
      img {
        width: 100%;
        height: 100%;
      }
    }
    .resumen {
      display: none;
    }
  }

  .card-foto {
    .foto {
        width: 95vw;
        height: 368px;
        image-rendering: auto;
        overflow: hidden;
        border-radius: var(--radius-sm);
        text-align: center;
        position: relative;
        img {
            width: auto;
            display: block;
            border-radius: var(--radius-sm);
            height: 400px;
            text-align: center;
            left: -50%;
            position: absolute;
        }
    }
  }

  .title {
    font: 800 18px / 1.2 "Work Sans", sans-serif;
  }

  .nota-ampliada {
    .title {
        font-size: 24px;
    }
  }

  .label{
    padding-top: var(--space-sm);
  }


  /* Seccion Multimedia */
  .multimedia {
    .container-multimedia {
      padding: var(--space-lg);
      img {
        width: 100%;
      }
    }
  }

  .table-wrapper {
    width: 350px;
  }

  /* Footer */
  .container-footer {
    div {
        border-left: 0;
      }
  }
}