/* =========================
   GRID PRINCIPAL
========================= */

.rg-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:16px;
    margin-top:15px;
}


/* =========================
   CARD
========================= */

.rg-card{
    position:relative;
    overflow:hidden;
    border-radius:4px;
    cursor:pointer;
}

.rg-card-image img{
    width:100%;
    height:320px;
    object-fit:cover;
    display:block;
}

.rg-card-content{
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    padding:20px;
    color:#fff;

    background:linear-gradient(
        to top,
        rgba(0,0,0,.6),
        transparent
    );
}

.rg-card-title{
    font-size:28px;
    line-height:1;
    margin:0 0 10px 0;
    font-weight:700;
}

.rg-open{
    background:none;
    border:none;
    color:#fff;
    font-size:12px;
    letter-spacing:2px;
    text-transform:uppercase;
    cursor:pointer;
    padding:0;
}


/* =========================
   DESPLEGABLE
========================= */

#rg-expanded-row{
    margin-top:40px;
    background:#f4f1e8;
    padding:40px;
    display:none;
}

.rg-expanded-row{

    grid-column: 1 / -1;

    width:100%;

    background:#f4f1e8;

    padding:40px;

    margin-top:30px;

    border-radius:8px;

}
.rg-expanded-top{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:60px;

    margin-bottom:40px;

    align-items:start;

}
.rg-expanded-inner{

    display:grid;

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

    gap:10px;

}


/* =========================
   TOP
========================= */

.rg-expanded-top{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
    margin-bottom:40px;
}

.rg-label{
    font-size:11px;
    letter-spacing:4px;
    text-transform:uppercase;
    margin-bottom:20px;
}

.rg-expanded-title{
    font-size:58px;
    line-height:1;
    margin:0 0 20px 0;
    font-weight:500;
}

.rg-expanded-description{
    font-size:18px;
    line-height:1.7;
}


/* =========================
   BOTÓN CERRAR
========================= */

.rg-close{
    border:1px solid #000;
    background:none;
    border-radius:40px;
    padding:12px 20px;
    cursor:pointer;
    font-size:14px;
}


/* =========================
   GALERÍA INTERIOR
========================= */

.rg-gallery-grid{
    display:grid;
    grid-template-columns:repeat(6, 1fr);
    gap:8px;
}

.rg-gallery-item img{
    width:100%;
    height:240px;
    object-fit:cover;
    display:block;
}


/* =========================
   RESPONSIVE
========================= */

@media(max-width:1200px){

    .rg-grid{
        grid-template-columns:repeat(2, 1fr);
    }

    .rg-gallery-grid{
        grid-template-columns:repeat(3, 1fr);
    }

	.rg-expanded-inner{

		display:grid;

		grid-template-columns:repeat(3, 1fr) !important;

		gap:10px;

	}
}

@media(max-width:768px){

    .rg-grid{
        grid-template-columns:1fr;
    }

    .rg-expanded-top{
        grid-template-columns:1fr;
    }

    .rg-gallery-grid{
        grid-template-columns:repeat(2, 1fr);
    }

    .rg-expanded-title{
        font-size:42px;
    }
	
}