@import url('https://fonts.googleapis.com/css2?family=Libre+Franklin:ital,wght@0,100..900;1,100..900&display=swap');
.libre-franklin{
  font-family: "Libre Franklin", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}
:root {
  --color_primary: #4CCABF;
  --color_secondary: #2E3E46;
  --color_orange:#FE7F2D;
  --color_red: #D92B04;
  --color_blue: #4557DB;
  --color_cyan:#33A1FD;
  --color_blue_light: #5386E4; 
  --color_info: #00AFF0; 
  --color_purple: #5B51D8;
  
  --color_green: #4CCABF;
  --color_yellow: #FCCA46;  
  --color_gray: #7e7e7e;
  --color_graydark: #4B4B4B;
  --color_light: #F6F6F6;

  --font_primary: "Libre Franklin", sans-serif;
  
}
::-moz-selection {
  background: #ffcf21b9;
}

::selection {  
  background: #ffcf21b9;
}


html, body {
  font-family: var(--font_primary);
  font-weight: 300;
  font-style: normal;
  /* font-size: 1.1rem; */  
  /* line-height: 1.3rem; */  
  scroll-behavior: smooth;
  /* overflow-y: scroll; */
  
}
.wrapper {
  height: 100vh;
  overflow-y: scroll;
  scroll-snap-type: y mandatory;
}
.container {
  z-index: 10;
}

.fw-bold{
  font-weight: 800;
}
.semi-bold{  
  font-weight: 600;
}

.bg_blue {
  background: var(--color_blue);
}
.bg_morado {
  background: #868FF5;
}
.bg_guinda {
  background: #882188;
}
.bg_green {
  background: #3FC494;
}
.bg_orange {
  background: var(--color_orange);
}
.bg_blue_20 {
  background: #EBF8FF;
}
.bg_blue_40 {
  background: #D1EFFF;
}
.bg_blue_gradient {
  background: rgb(118,146,224);
  background: linear-gradient(180deg, rgba(118,146,224,1) 0%, rgba(4,32,104,1) 100%);
}

.bg_white {
  background-color: rgba(255, 255, 255, 0.7);
}

.bg-white-transparent {
  background-color: rgba(255, 255, 255, 0.384);
}

.block_panel {
  height: 100vh; /* Ocupa el 100% del alto del viewport */
  min-height: 650px; 
  width: 100%; 
  display: flex;
  align-items: center;
  scroll-margin-top: 0; 
  /* === LA REGLA CLAVE PARA CENTRAR === */
  scroll-snap-align: top;
}

.panel_portada {
  min-height: 600px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.panel_bg_center {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.panel_bg {
  background-repeat: no-repeat;
  background-size: inherit;
  background-position: 30px 75px;
}


.bg_page {
  background-position: center;
  background-size: cover;
}

.bg_top {
    background-position: center top;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: var(--color_blue);
  }
  
 
.block_desktop{
  height: 5rem;
}
.block_mobile{
  display: none;
}

.border_white {
  border: 7px solid #fff;
}

.carousel-control-prev {
  left: -70px;
}
.carousel-control-next {
  right: -70px;
}

.margin_top_160{
  /* transform: translateY(-200px); */
  margin-top: -120px;
}
.margin_top_n50{
    transform: translateY(-200px);
    margin-bottom: -200px;
}

.form-floating {
  background-color: rgba(255, 255, 255, 1);
}

 /*=======  Preloader  =======*/
 .preloader {
  background-color: #ffffff;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
}

.preloader .cssload-container {
  display: block;
  width: 97px;
}

.preloader .cssload-loading i {
  width: 19px;
  height: 19px;
  display: inline-block;
  border-radius: 50%;
  background: var(--color_green);
}

.preloader .cssload-loading i:first-child {
  opacity: 0;
  -webkit-animation: cssload-loading-ani2 0.58s linear infinite;
  animation: cssload-loading-ani2 0.58s linear infinite;
  -webkit-transform: translate(-19px);
  transform: translate(-19px);
}

.preloader .cssload-loading i:nth-child(2),
.preloader .cssload-loading i:nth-child(3) {
  -webkit-animation: cssload-loading-ani3 0.58s linear infinite;
  animation: cssload-loading-ani3 0.58s linear infinite;
}

.preloader .cssload-loading i:last-child {
  -webkit-animation: cssload-loading-ani1 0.58s linear infinite;
  animation: cssload-loading-ani1 0.58s linear infinite;
}

@-webkit-keyframes cssload-loading-ani1 {
  100% {
      -webkit-transform: translate(39px);
      transform: translate(39px);
      opacity: 0;
  }
}

@keyframes cssload-loading-ani1 {
  100% {
      -webkit-transform: translate(39px);
      transform: translate(39px);
      opacity: 0;
  }
}

@-webkit-keyframes cssload-loading-ani2 {
  100% {
      -webkit-transform: translate(19px);
      transform: translate(19px);
      opacity: 1;
  }
}

@keyframes cssload-loading-ani2 {
  100% {
      -webkit-transform: translate(19px);
      transform: translate(19px);
      opacity: 1;
  }
}

@-webkit-keyframes cssload-loading-ani3 {
  100% {
      -webkit-transform: translate(19px);
      transform: translate(19px);
  }
}

@keyframes cssload-loading-ani3 {
  100% {
      -webkit-transform: translate(19px);
      transform: translate(19px);
  }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

#content {
  display: none; /* Hide content initially */
}

/* =========== END =============== */

.text-primary {
  color: #0070F2 !important;
}
.text-cyan {
  color: var(--color_cyan);
}
.text-orange{
color: var(--color_orange);
}
.text-green {
color: var(--color_green)
}
.text-gray{
  color: var(--color_gray);
}

label.is-invalid {
	color: var(--color_yellow); 
	font-size: 0.8rem;
	padding-left: 5px;
}


.btn-port{
  z-index: 5;
  left: 0;
  bottom: 20px;
}
.btn-port img{
  width: 150px;
}

.btn-orange{
  background-color: var(--color_orange);
  border-radius: 7px;
  /* display: flex; */
  align-items: center;
  color: white;
}

.btn-orange:hover{
  background-color: #cf5a01;
  color: white;
  
}

.btn-send{
  background-color: #01a982;
  border-radius: 20px;
  display: flex;
  align-items: center;
}


.btn-send img, .btn-confirm img {
	--display: none;
}
.btn-send[disabled], .btn-confirm[disabled] {
	opacity:0.8;	
}
.btn-send[disabled] img, .btn-confirm[disabled] img{
	display: inline;
}
.btn-red {
  background-color: rgb(245, 16, 0);
}
.btn-red:hover {
  background-color: rgb(224, 28, 14);
}

.btn-block-radio-group{
  min-height: 200px;
}
.btn-block-radio {
 background: var(--color_yellow);
 border: 2px solid var(--color_yellow);
 color: #000;
 min-height: 200px;
}

.btn-block-radio img {
  width: 85px;
 }

.btn-block-radio:hover,
.btn-block-radio.radio-checked {
  background: #050505b0;
  border: 2px solid var(--color_yellow);
  /* box-shadow: 0 0 10px rgba(255, 193, 7, 0.5); */
  color: #fff;
}

.btn-block-radio-blue{
  background: var(--color_blue);
  border: 2px solid var(--color_blue);
  color: #fff;
  min-height: 200px;
}
.btn-block-radio-blue:hover,
.btn-block-radio-blue.radio-checked {
  background: #050505b0;
  border: 2px solid var(--color_blue);
  /* box-shadow: 0 0 10px rgba(255, 193, 7, 0.5); */
  color: #fff;
}

.btn-primary{
  background-color: #000FAD;
}
.btn-primary:hover{
  background-color: #0515ce;
}

.icon-box {
	width: 50px;
	height: 20px;
	/* transform: scale(1.5); */
}
.icon-loading {
	width: 30px;
	height: 20px;
	transform: scale(1.5);
}

.swal2-popup {
	border-radius: 0 !important;
}
.font_bold {
    font-weight: 700;
}
.form-floating > .form-control {
    padding: .5rem .0rem;
    border:0px;
    border-bottom: 2px solid rgb(219, 219, 219);
  }
  .form-floating > .form-select{
    border:0px;
    border-bottom: 2px solid rgb(219, 219, 219);
    padding-left: 0;
    box-shadow: none;
  }
  .form-floating > label {    
    padding: 1rem .5rem;
    color: #000 !important;
    font-weight: 400;
}
.form-floating > .form-control, .form-floating > .form-select {
    /* height: calc(3.2rem + 2px); */
    border-radius: 0;
    color:#0070f3;
    font-weight: 700;
    background-color: transparent;
  }
.form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label {
    opacity: 1.0; 
    /* 0.55 */
    transform: scale(.8) translateY(-.8rem) translateX(.0rem);
  }
  .form-control:focus {
   
    box-shadow: none;
    border-bottom: 2px solid #E76500!important;
  }
  

  .form-control.is-invalid:focus, .was-validated .form-control:invalid:focus {
    /* border-color: #dc3545;*/
     border-bottom-color: rgb(220, 53, 69); 
     box-shadow:none; /* 0 0 0 0 rgba(220,53,69,.25);*/
  }

  .form-select.is-invalid:focus, .was-validated .form-select:invalid:focus {
    border-color: #dc354600;
    /* box-shadow: 0 0 0 .25rem rgba(220,53,69,.25); */
    box-shadow: none;
}

.form-control-radio {
  font-family: system-ui, sans-serif;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1;
  display: grid;
  grid-template-columns: 1em auto;
  gap: 0.5em;
}



  .fs-7{
    font-size: .8rem;
  }

  .gj-textbox-md {
    border: none;
    border-bottom: 2px solid rgb(219 219 219);
    display: block;
    /* font-family: Helvetica,Arial,sans-serif; */
    font-size: 16px;
    /* line-height: 16px; */
    padding: 21px 0;
    /* margin: 0; */
    width: 100%;
    background: 0 0;
    text-align: left;
    /* color: rgba(0,0,0,.87); */
    border-radius: 0;
}

.gj-datepicker-md [role=right-icon] {
  
  top: 16px;
  
}




.ui-datepicker{
  border-radius: 0 !important;
}
.ui-datepicker .ui-datepicker-title select {
  font-size: 0.8em !important;
  padding: 3px;
}

.ui-datepicker table {  
  font-size: .8em !important;  
}

.scrolling-link{
  animation: scrollRightLeft 0.5s linear infinite alternate;
  display: none;
}
@keyframes scrollRightLeft {
  0% {
    right: 40px; /* Empieza en la posición original */
  }
  100% {
    right: 60px; 
     /* calc(100% - 100px); Termina en la posición derecha (menos el ancho del enlace) */
  }
}

.table-features{

}

.table-features tr {
  border-bottom: 1px solid rgb(211, 211, 211);
}
.table-features tr td:first-child {
 text-align: left;
}

.table-features td {
  padding: 10px;
  text-align: center;
  line-height: 1;
  font-size: 0.95rem;
}

.size-company {
  position: relative;
  margin-top: -30px;
  margin-bottom: -15px;
}

@media (min-width: 1600px) { 
  /* .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 1520px;
  } */
  .block_desktop{
    height: 8rem;
  }
}




@media (max-width: 1199.98px) { 
  .block_panel {
    height: auto ;
    /* min-height: auto; */
  } 

    .display-1 { font-size: calc(3.0rem + 2vw); } /* Ejemplo: Resultado ~5rem en 768px, ~5.9rem en 1199px */
    .display-2 { font-size: calc(1.8rem + 1.8vw); }
    .display-3 { font-size: calc(2.0rem + 1.6vw); }
    .display-4 { font-size: calc(1.8rem + 1.4vw); }
    .display-5 { font-size: calc(1.4rem + 1.2vw); }

    .fs-1 { font-size: calc(2rem + 1vw); }
    .fs-2 { font-size: calc(1.8rem + 0.9vw); }
    .fs-3 { font-size: calc(1.6rem + 0.8vw); }
    .fs-4 { font-size: calc(1.4rem + 0.7vw); }
    .fs-5 { font-size: calc(1.2rem + 0.6vw); }

    p, ul, ol {
        font-size: calc(1rem + 0.25vw); /* Ejemplo: Resultado ~1.19rem en 768px, ~1.45rem en 1199px */
    }


}


@media (max-width: 991.98px) { 
  
  .home-title {
    width: 260px;
  }

  .block_desktop{
    display: none;
  }

  .block_mobile{
    display: block;
    height: 5rem;
  }

  .logo {
    width: 200px;
  }
  .logo-grow{
    max-width: 270px;
  }

  .bg_blur::before {
    content: ""; /* Necesario para los pseudo-elementos */
    position: absolute; /* Permite posicionarlo con top, left, etc. */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0; /* Esto hace que el pseudo-elemento cubra todo el contenedor padre */
    backdrop-filter: blur(10px);
    z-index: 1;
    pointer-events: none;
}
  
  .display-1 { font-size: calc(2.4rem + 2vw) !important; } /* Ejemplo: Resultado ~5rem en 768px, ~5.9rem en 1199px */
  .display-2 { font-size: calc(2.0rem + 1.8vw) !important; }
  .display-3 { font-size: calc(1.7rem + 1.6vw) !important; }
  .display-4 { font-size: calc(1.4rem + 1.4vw) !important; }
  .display-5 { font-size: calc(1.2rem + 1.2vw) !important; }

  .fs-1 { font-size: calc(1.8rem + 0.8vw) !important; }
  .fs-2 { font-size: calc(1.6rem + 0.6vw) !important; }
  .fs-3 { font-size: calc(1.4rem + 0.4vw) !important; }
  .fs-4 { font-size: calc(1.2rem + 0.2vw) !important; }
  .fs-5 { font-size: calc(1.0rem + 0.1vw) !important; }

  p, ul, ol {
      font-size: calc(0.95rem + 0.25vw) !important; /* Ejemplo: Resultado ~1.19rem en 768px, ~1.45rem en 1199px */
  }


 }

  @media (max-width: 768px) { 
    
    .home-title {
      width: 180px;
    }

    .panel_portada  {
      background-size: 170% !important;
    }

    .panel_portada h2 {
      font-size: 1.5rem;
    }
    .scrolling-link{
      display: block;
    }
   }