/* ===================================
    Seccion Beneficios
====================================== */

/* posiciones tarjetas y background */
.block.a{ top: 0; left: 0;   background: rgba(26, 184, 182, .90); }
.block.b{ top: 0; left: 0; background: rgba(26, 126, 189, .90); }
.block.c{ top: 0; right:0; background: rgba(26, 136, 74, .90); }
.block.d{ top: 0; right: 0;  background: rgba(44, 69, 131, .90); }

/* Background tarjetas hover */
.block.a:hover{background: rgba(26, 184, 182, .70); }
.block.b:hover{background: rgba(26, 126, 189, .70); }
.block.c:hover{background: rgba(26, 136, 74, .70); }
.block.d:hover{background: rgba(44, 69, 131, .70); }

/* xxs */ @media (max-width: 430px) {}
/* xs  */ @media (min-width: 431px) {} /* @media (max-width: 575px) {} */
/* sm  */ @media (min-width: 576px) {}
/* md  */ @media (min-width: 768px) {



} /* ipad Portrait */
/* lg  */ @media (min-width: 992px) {

.block.a{ top: 10%; left: 0;}
.block.b{ top: 50%; left: 20%;}
.block.c{ top: 35%; right:20%;}
.block.d{ top: -5%; right: 0;}

} /* ipad Landscape */
/* xl  */ @media (min-width: 1200px) {}
/* xxl */ @media (min-width: 1400px) {}


/* ===================================
    Seccion Galeria Clientes
====================================== */

#galery-clients{
  margin-top: 30px;
}

#galery-clients .swiper-slide{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

#galery-clients .swiper-slide p{
  font-size: 14px;
  margin-bottom: 0px;
}

/* ===================================
    Seccion video
====================================== */


.tc-container{
  width: 100%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  align-items: center;
}

.tc-media{
  position: relative;
  height: auto;
}

.tc-laptop{
  width: 65%;
  display: block;
  object-fit: contain;
}

/* play */
.tc-play{
  position: absolute;
  left: 50%;
    top: 50%;
  transform: translate(-50%, -50%);
  width: 100px;
  height: 100px;
  display: grid;
  place-items: center;
  cursor: pointer;
  text-decoration: none;
  z-index: 3;
}

.tc-play-circle{
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background:transparent;
  border: 5px solid rgba(0,0,0,.25);
  
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
  box-shadow: 0 12px 24px rgba(0,0,0,.18);
}

.tc-play-triangle{
  width: 0;
  height: 0;
  border-left: 18px solid rgba(0,0,0,.65);
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  margin-left: 4px;
  position: relative;
  z-index: 2;
}

.tc-play:hover .tc-play-circle{
  transform: scale(1.06);
  background: rgba(255,255,255,.7);
  backdrop-filter: blur(4px);
  box-shadow: 0 16px 32px rgba(0,0,0,.22);
}


/* botones derecha */
.tc-actions{
  display: grid;
  gap: 14px;
  justify-items: end;
}

.tc-btn{
  width: 100%;
  padding: 14px 18px;
  border-radius: 12px;
  background: #0a77b8;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  line-height: 1.15;
  box-shadow: 0 14px 30px rgba(10,119,184,.18);
  transition: transform .2s ease, filter .2s ease, box-shadow .2s ease;
}
.tc-btn:hover{
  transform: translateY(-2px);
  filter: brightness(1.05);
  box-shadow: 0 18px 34px rgba(10,119,184,.25);
}

/* ===== Modal (inline) ===== */
.tc-modal{
  width: min(980px, 92vw);
  margin: 0 auto;
}

.tc-modal-inner{
  background: #000;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 30px 70px rgba(0,0,0,.35);
}

/* video responsive */
.tc-video{
  width: 100%;
  height: auto;
  display: block;
  background: #000;
}

/* animación fade (opcional) */
.mfp-fade.mfp-bg{
  opacity: 0;
  transition: opacity .18s ease-out;
}
.mfp-fade.mfp-bg.mfp-ready{ opacity: .75; }
.mfp-fade.mfp-bg.mfp-removing{ opacity: 0; }

.mfp-fade.mfp-wrap .mfp-content{
  opacity: 0;
  transition: opacity .18s ease-out, transform .18s ease-out;
  transform: translateY(8px);
}
.mfp-fade.mfp-wrap.mfp-ready .mfp-content{
  opacity: 1;
  transform: translateY(0);
}
.mfp-fade.mfp-wrap.mfp-removing .mfp-content{
  opacity: 0;
  transform: translateY(8px);
}

/* xxs */ @media (max-width: 430px) {}
/* xs  */ @media (min-width: 431px) {} /* @media (max-width: 575px) {} */
/* sm  */ @media (min-width: 576px) {

.tc-container{grid-template-columns: 50% auto;gap: 50px;}

}
/* md  */ @media (min-width: 768px) {
  .tc-container{grid-template-columns: 60% auto;gap: 50px;}
} /* ipad Portrait */
/* lg  */ @media (min-width: 992px) {
  .tc-container{grid-template-columns: 70% auto;gap: 50px;}
} /* ipad Landscape */
/* xl  */ @media (min-width: 1200px) {}
/* xxl */ @media (min-width: 1400px) {}

/* responsive */
@media (max-width: 991.98px){

  .tc-actions{
    justify-items: start;
  }
  .tc-play{
    left: 45%;
    top: 58%;
  }
  .tc-watermark{
    right: 4%;
    top: 52%;
  }
}

/* ===================================
    Responsive
====================================== */