/* =========================
   CONTENEDOR GENERAL
========================= */

.landing-grid{

  width:100%;

  display:grid !important;

  grid-template-columns:repeat(12, 1fr);

  gap:16px;

  padding:16px;
}

/* =========================
   ITEMS GENERALES
========================= */

.landing-grid .grid-item{

  display:block;

  width:100%;

  overflow:hidden;

  border-radius:20px;
}

/* =========================
   IMÁGENES
========================= */

.landing-grid .grid-item img{

  width:100%;

  height:100%;

  object-fit:cover;

  display:block;
}

/* =========================
   DESKTOP
========================= */

/* item 1 */
.landing-grid .item-1{

  grid-column:span 4;
}

/* item 2 central */
.landing-grid .item-2{

  grid-column:span 4;

  grid-row:span 2;
}

/* item 3 */
.landing-grid .item-3{

  grid-column:span 4;
}

/* item 4 */
.landing-grid .item-4{

  grid-column:span 4;
}

/* item 5 */
.landing-grid .item-5{

  grid-column:span 4;
}

/* =========================
   MOBILE
========================= */

@media(max-width:768px){

  .landing-grid{

    grid-template-columns:repeat(2, 1fr);

    gap:12px;

    padding:12px;
  }

  /* reset */
  .landing-grid .grid-item{

    grid-column:auto !important;

    grid-row:auto !important;
  }

  /* central full width */
  .landing-grid .item-2{

    grid-column:1 / 3 !important;

    order:5;
  }

  .landing-grid .grid-item img{

    width:100%;

    height:auto;

    display:block;
  }
}