
.promos-seccion-hero-video{
    padding:90px 0;
    overflow:hidden;
}

.promos-seccion-hero-video h2{
    text-align:center;
    margin-bottom:60px;
    color:#1F3D97;
    font-weight:700;
}

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

.hero-video-grid {
    display: grid;
    grid-template-columns: minmax(140px, 220px) minmax(0, 900px) minmax(140px, 220px);
    align-items: center;
    gap: 40px;
    justify-content: space-between;
}

/* ==========================
   VIDEO
========================== */

.video-wrapper{
    width:100%;
    z-index:2;
}

.video-wrapper iframe{
    display:block;
    width:100%;
    aspect-ratio:16/9;
    border:0;
    border-radius:30px;
    box-shadow: 0 15px 35px rgba(0,0,0,.08);
}

/* ==========================
   SHAPES
========================== */

.shape-circle{
    width:520px;
    height:520px;
    background:#23479D;
    border-radius:50%;
    justify-self:end;



}

.shape-square{
    width:230px;
    height:520px;
    background:#12A7DF;
    border-radius: 60px 0px 0px 60px;
    justify-self:start;
}

/* ==========================
   TABLET
========================== */

@media (max-width:991px){

.hero-video-grid{
    grid-template-columns:120px 1fr 120px;
    gap:20px;
}

.shape-circle{
    width:250px;
    height:250px;
    margin-right:-150px;

}

.shape-square{
    width:120px;
    height:280px;
    margin-left:-40px;

}

}

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

@media (max-width:767px){

.promos-seccion-hero-video{
    padding:60px 0;
}

.promos-seccion-hero-video h2{
    font-size:2rem;
    margin-bottom:30px;
}

.hero-video-grid{
    grid-template-columns:1fr;

}

.shape-circle,
.shape-square{
    display:none;

}

.video-wrapper iframe{
    border-radius:20px;

}

}
