/*
Theme Name: LossUp Adjust Child
Theme URI: https://elementor.com/
Description: Child theme based on Hello Elementor
Author: Yeison Ruiz
Author URI: https://tusitio.com
Template: hello-elementor
Version: 1.0.0
*/

 a strong {
   
 
    color: #384355;
}

p a  {
   
 
    color: #384355;
}

.subtitle-lines {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
 top: 15px;
    position: relative;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 1px;
  color: #ea5224; /* dorado */
}

.subtitle-lines::before,
.subtitle-lines::after {
  content: "";
  width: 50px;
  height: 2px;
  background-color: #ea5224;
}


.elementor strong a  {
   
 
    color: #384355;
}



.form-home {
    display: flex;
    gap: 40px;
    background: #fff;
    border-radius: 80px;
    padding-left: 40px;
    padding-right: 40px;
}

.form-home .row-home {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
}

.form-home .row-home .icon {
  width: 48px;
  height: 44px;
  background-color: #eeeeee;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px 0 0 999px;
}

.form-home .row-home .icon i {
  font-size: 16px;
  color: #ea5224;
}

.form-home .row-home input {
  flex: 1;
  height: 44px;
  border: none;
  background-color: #eeeeee;
  padding: 0 16px;
  border-radius: 0 999px 999px 0;
  font-size: 15px;
  color: #333;
  outline: none;
}

.form-home .row-home input::placeholder {
  color: #9a9a9a;
}

.row-home i {
    color: #ee5b02;
    position: relative;
    top: 35px;
    left: -26px;
    /* width: 400px; */
    font-size: 22px;
}

input.wpcf7-form-control.wpcf7-submit.has-spinner {
    background: #ea5224;
    color: #fff;
    margin: 0 auto;
    position: relative;
    border-radius: 30px;
    margin-top: 15px;
    display: block;
    font-size: 20px;
    font-family: 'Raleway';
    font-weight: 700;
}

.border-home {
    border-right: dashed;
    border-color: #ff9d7f;
    position: relative;
    left: -15px;
    height: 73px;
    justify-content: center;
    display: flex;
    align-items: center;
    align-self: center;
}

input.wpcf7-form-control.wpcf7-submit.has-spinner {
    padding-left: 50px;
    padding-right: 50px;
}



*,::before,::after{
  margin: 0;
}

@property --angle {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: true;
}
/* general styling */
html {
	color-scheme: dark light;
}
img{
  max-width: 100%;
}
/* Hide radio buttons */
input[type="radio"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}


.cards{
  --img-w: 400px;
  --duration: 300ms;
  --img-easing: cubic-bezier(0.34, 1.56, 0.64, 1);
  width: min(100% - 4rem, 800px);
  margin-inline: auto;
  display: grid;
  
  counter-reset: my-counter;
}

.card{
  --cards-grid-cols: auto;
  --cards-grid-rows: var(--img-w) auto;
  --cards-grid-gap: 2rem;
  --cards-footer-justify: center;
  
  grid-area: 1/1;
  display: grid;
 place-items: center; 
  grid-template-columns: var(--cards-grid-cols);
  grid-template-rows: var(--cards-grid-rows);
  gap: var(--cards-grid-gap);
  
}

@media (600px < width){
  .card{
      --cards-grid-cols: var(--img-w) auto;
      --cards-grid-rows: auto;
      --cards-grid-gap: 4rem;
      --cards-footer-justify: start;
  }
}


.card-img {
    width: 400px;
    height: 200px;
    aspect-ratio: 1 / 1;
    rotate: var(--angle, 0deg);
    border-radius: 10px !important;
    border: 3px solid #FFF !important;
    overflow: hidden;
    transform-origin: center;
    object-fit: cover;
    box-shadow: 0 0 5px 3px rgba(0 0 0 / .05) !important;
}



input:nth-of-type(1):checked + .card ~ .card > .card-img{
  animation: straighten-img-1 calc(var(--duration) * 2) forwards;
  animation-timing-function: var(--img-easing);
}
.card:has(~input:nth-of-type(2):checked) > .card-img,
input:nth-of-type(2):checked + .card ~ .card > .card-img{
  animation: straighten-img-2 calc(var(--duration) * 2) forwards;
  animation-timing-function: var(--img-easing);
}
.card:has(~input:nth-of-type(3):checked) > .card-img,
input:nth-of-type(3):checked + .card ~ .card > .card-img{
  animation: straighten-img-3 calc(var(--duration) * 2) forwards;
  animation-timing-function: var(--img-easing);
}
.card:has(~input:nth-of-type(4):checked) > .card-img,
input:nth-of-type(4):checked + .card ~ .card > .card-img{
  animation: straighten-img-4 calc(var(--duration) * 2) forwards;
  animation-timing-function: var(--img-easing);
}
.card:has(~input:nth-of-type(5):checked) > .card-img,
input:nth-of-type(5):checked + .card ~ .card > .card-img{
  animation: straighten-img-5 calc(var(--duration) * 2) forwards;
  animation-timing-function: var(--img-easing);
}
.card:has(~input:nth-of-type(6):checked) > .card-img,
input:nth-of-type(6):checked + .card ~ .card > .card-img{
  animation: straighten-img-6 calc(var(--duration) * 2) forwards;
  animation-timing-function: var(--img-easing);
}
.card:has(~input:nth-of-type(7):checked) > .card-img,
input:nth-of-type(7):checked + .card ~ .card > .card-img{
  animation: straighten-img-7 calc(var(--duration) * 2) forwards;
  animation-timing-function: var(--img-easing);
}
/* as CSS can't remove animations, we change the animation according to which checkbox is checked  - all animations are the same (would be simpler with SCSS) */
@keyframes straighten-img-1 { 50%{ --angle: 0deg;} }
@keyframes straighten-img-2 { 50%{ --angle: 0deg;} }
@keyframes straighten-img-3 { 50%{ --angle: 0deg;} }
@keyframes straighten-img-4 { 50%{ --angle: 0deg;} }
@keyframes straighten-img-5 { 50%{ --angle: 0deg;} }
@keyframes straighten-img-6 { 50%{ --angle: 0deg;} }
@keyframes straighten-img-7 { 50%{ --angle: 0deg;} }


/* stacking order - these are updated according to which card is selected */
.card{
  z-index: -1;
}
input:checked + .card{
  z-index:10 !important;
}
/* next card checked - place behind */
.card:has(+input:checked){
  z-index:9;
}
/* next card +1 checked - place behind */
.card:has(+input + .card + input:checked){
  z-index:8;
}
/* next card +2 checked - place behind */
.card:has(+input + .card +input + .card + input:checked){
  z-index:7;
}
/* next card +3 checked - place behind */
.card:has(+input + .card +input + .card +input + .card + input:checked){
  z-index:6;
}
/* next card +4 checked - place behind */
.card:has(+input + .card +input + .card +input + .card +input + .card + input:checked){
  z-index:5;
}
/* next card +5 checked - place behind */
.card:has(+input + .card +input + .card +input +input + .card +input + .card +input + .card + input:checked){
  z-index:4;
}
/* next card +6 checked - place behind */
.card:has(+input + .card +input + .card +input  + .card +input +input + .card +input + .card +input + .card + input:checked){
  z-index:3;
}

.card-data{
  display: grid;
  gap: 1rem;
	width: 500px;
}
.card-data > .card-num{
  opacity: var(--data-opacity, 0);
  font-size: .8rem;
  color: #666;
}
.card-data > p{
  font-size: 0.9rem;

}

.card-data > h2 {
    font-size: 33px !important;
    font-family: 'Raleway' !important;
    text-align: center !important;
    text-transform: uppercase;
    font-weight: bold;
}



.card-data > h2, .card-data > p {
    transition: var(--duration) ease-in-out;
    transition-delay: var(--data-delay, 0ms);
    opacity: var(--data-opacity, 0);
    translate: 0 var(--data-y, 20px);
    color: #fff;
    text-align: justify;
    font-size: 18px;
    font-family: 'Raleway';
}
.card-data > footer{
  display: flex;
  justify-content: var(--cards-footer-justify);
  gap: 2rem;
}
.card-data > footer label{
  margin-block-start: auto;
  cursor: pointer;
  pointer-events: var(--card-events, none);
  opacity: var(--data-opacity, 0);
  transition: color var(--duration) ease-in-out;
  color: var(--label-clr-txt,#000);
  background-color:var(--label-clr-bg,#EEE);
  border-radius: 50%;
  width: 32px;
  height: 32px;
  aspect-ratio: 1/1;
  display: grid;
  place-content: center;
  transition: background-color 300ms ease-in-out,color  300ms ease-in-out;
}


input:checked:focus-visible + .card > .card-data > footer label,
.card-data > footer label:hover{
  --label-clr-txt: #FFF;
  --label-clr-bg: steelblue;
}

input:checked + .card{
  --data-opacity: 1;
  --data-y: 0;
  --data-delay: var(--duration);
  --card-events: auto;
  transition: z-index;
  transition-delay: 300ms;
  /*z-index: 1;*/
}

input:checked +.card > .card-img{
  animation: reveal-img calc(var(--duration) * 2) forwards;
}

@keyframes reveal-img{
  50%{
    translate: -150% 0;
    --angle: 0deg;
  }
}




#container {
  color:#999;
  text-transform: uppercase;
  font-size:46px;
  font-weight:bold;
    
     text-align: center;
  width:100%;
  bottom:45%;
  display:block;
}

#flip {
  height:70px;
  overflow:hidden;
}

div#container span {
    color: #384355 !important;
    font-family: 'Raleway';
    font-weight: 700;
}

#flip > div > div {
     color: #fff;
    height: 70px;
    margin-bottom: 22px;
    display: inline-block;
    padding: 2px 10px;
}

#flip div:first-child {
  animation: show 10s linear infinite;
}

#flip div div {
  background:#384355;
	border-radius:80px;
	padding-left: 30px;
    padding-right: 30px;
}


#flip div:first-child div {
  background:#ea5224;
}
#flip div:last-child div {
  background:#384355;
}

@keyframes show {
  0% {margin-top:-270px;}
  5% {margin-top:-180px;}
  33% {margin-top:-180px;}
  38% {margin-top:-90px;}
  66% {margin-top:-90px;}
  71% {margin-top:0px;}
  99.99% {margin-top:0px;}
  100% {margin-top:-270px;}
}

.text p {
  position:fixed;
  width:100%;
  bottom:30px;
  font-size:12px;
  color:#999;
  margin-top:200px;
}



















@media (max-width: 768px) {
	
	.card-data {
    margin-top: -80px;
}
	.card-img

 {
  
	 width: 300px;}
	
	.card-data {
    display: grid;
    gap: 1rem;
    width: 300px;
}
	
  .form-home {
             border-radius: 0px;
        gap: 20px;
        flex-direction: column;
        padding-bottom: 30px;
        padding-left: 60px;
        padding-top: 20px;
        margin-left: 10px;
        margin-right: 10px;
	}
	
	.row-home {
    height: 6vh;
}
	
.border-home {
        border-bottom: dashed;
        top: 8px;
        opacity: 0.5;
        width: 330px;
        border-color: #ff9d7f;
        position: relative;
        left: -15px;
        height: 0px;
        justify-content: center;
        display: flex;
        align-items: center;
        border: 1.8px dashed #ff9d7f;
        align-self: center;
    }
	
.form-home .row-home {
   
    margin-bottom: 0px;
}	
	
	input.wpcf7-form-control.wpcf7-submit.has-spinner {
    padding-left: 30px;
    padding-right: 30px;
}

	
}


.infoHeader {
	display: flex !important;
}


.elementor-63 .elementor-element.elementor-element-e531f31 .elementor-icon-box-wrapper {
    display: flex;
 
}

.elementor-63 .elementor-element.elementor-element-21f7458 .elementor-icon-box-wrapper

 {
    display: flex;
}

.imagenfx {
	
	filter: drop-shadow(0 8px 20px rgba(0, 0, 0, 0.4));
}

.subtitle-line {
  display: flex;
  align-items: center;
  gap: 12px;
	  
}

.subtitle-line span {
  width: 50px;
  height: 2px;
  background-color: #ea5224; /* color dorado */
}

.subtitle-line p {
  font-family:raleway;
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  color: #ea5224;
  letter-spacing: 1px;

}



/*accordeon**/
div#uc_image_accodion_elementor_2afe614 {
    transform: skew(357deg);
}

#uc_image_accodion_elementor_2afe614 .uc_content .uc_overlay .uc_overlay_inner h2 {
    transform: translate3d(0,213px,0);
    opacity: 1 !Important;
    visibility: visible !Important;
}

#uc_image_accodion_elementor_2afe614 .uc_content .uc_overlay .uc_overlay_inner h2.ue_title {
    transform: translate3d(0,203px,0);
   
}


/* fin accordeon */

@media only screen and (min-width: 1024px) and (max-width: 1320px) {
	.elementor-644 .elementor-element.elementor-element-8728147 > .elementor-container {
    min-height: 48vh;
}
}


.field-type-radio-field .jet-form-builder__field.radio-field {
    position: absolute;
    z-index: -1;
    opacity: 1 !important;
    margin-left: -10px;
}

/* Estilo base del label */
.jet-form-builder__field-wrap.radio-wrap.checkradio-wrap label {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #41516b;
	color:#fff;
	margin-top: 10px;
    padding: 18px 20px;
    border-radius: 14px;
    border: 2px solid transparent;
    cursor: pointer;
    transition: all .25s ease;
    font-size: 16px;
}

/* Estilo cuando está seleccionado */
.jet-form-builder__field-wrap.radio-wrap.checkradio-wrap label:has(input[type="radio"]:checked) {
background: #dfe7ee;
    border-color: #42506c;
    box-shadow: 0 0 0 3px #1a64ff22;
	color: #41516b;
}

/* Ocultar el radio original para dejar solo el estilo */
.jet-form-builder__field-wrap.radio-wrap.checkradio-wrap input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

/* Crear un círculo custom */
.jet-form-builder__field-wrap.radio-wrap.checkradio-wrap label span::before {
    content: "";
    width: 18px;
    height: 18px;
    border-radius: 50%;
        border: 2px solid #a9bbcb;
    display: inline-block;
    margin-right: 10px;
    background: #fff;
    transition: all .25s ease;
}

/* Círculo relleno cuando está seleccionado */
.jet-form-builder__field-wrap.radio-wrap.checkradio-wrap label:has(input[type="radio"]:checked) span::before {
background: #41516b;
    box-shadow: inset 0 0 0 4px #fff;
    border-color: #41516b;
}

 .jet-form-builder__next-page {
    border-style: solid;
    border-color: #415169;
    color: #FFFFFF;
    background-color: #415169;
    float: right;
}

 .jet-form-builder__action-button {
    background-color: #415169;
    color: #FFFFFF;
    transition: all 0.3s;
    margin: 0 auto;
}

.jet-apb-calendar-wrapper .jet-apb-calendar-appointments-list-wrapper {
    flex-direction: column;
    align-items: center;
}

.jet-apb-item-service-provider {
    font-size: 0 !important; /* Ocultamos el texto original */
    position: relative;
}

.jet-apb-item-service-provider::after {
    content: "Fecha de la Asesoría";
    font-size: 16px !important; /* Mostrar tamaño normal */
    color: #000; /* Cambia color si deseas */
}

span.jet-form-builder__label-text {
    display: none;
}

.jet-apb-appointments-item {
    position: relative;
    left: 30px;
    margin-bottom: 20px;
    display: flex;
}

.title-asesoria {
    margin: 0 auto;
    font-family: 'Raleway';
    text-align: center;
    margin-bottom: 40px;
    font-size: 25px;
    color: #415169;
    font-weight: 600;
}

.jet-sm-gb-wrapper.jet-sm-gb-dfb4cdf5-5c57-46b3-a10b-f9db5029120e {
    margin-bottom: 60px;
}


.iti.iti--allow-dropdown.iti--show-flags.iti--inline-dropdown {
    width: 100%;
}


.iti__selected-dial-code {
    display: none;
}


[type=button], [type=submit], button {
    
	border: 1px solid #415169;}

div#responsive-form\ trust span {
    color: #384355;
    font-weight: 600;
}


button.jet-form-builder__next-page {
    background-color: #384355;
    border: 1px solid #384355;
    color: #fff;
}

.jet-form-builder-progress-pages__item--label {
    color: #384355;
    font-family: 'Raleway';
    font-size: 18px;
}

.jfb-progress-type--default .jet-form-builder-progress-pages__item--wrapper.active-page .jet-form-builder-progress-pages__item--circle {
    border: 2px solid #384355;
}


.jfb-progress-type--default .jet-form-builder-progress-pages__item--wrapper.active-page {
    color: #384355;
    font-weight: bold;
}

.jfb-progress-type--default .jet-form-builder-progress-pages__item--wrapper.active-page .jet-form-builder-progress-pages__item+.jet-form-builder-progress-pages__separator {
    background-color: #384355;
    height: 3px;
}

.jet-form-builder__label-text {
    font-family: 'Raleway';
    font-weight: 500;
}

.jfb-progress-type--default .jet-form-builder-progress-pages__item--wrapper.passed-page {
    color: #ee5b02;
    font-weight: bold;
}

.jfb-progress-type--default .jet-form-builder-progress-pages__item--wrapper.passed-page .jet-form-builder-progress-pages__item+.jet-form-builder-progress-pages__separator {
    background-color: #ee5b02;
    height: 3px;
}

.jfb-progress-type--default .jet-form-builder-progress-pages__item--wrapper.passed-page .jet-form-builder-progress-pages__item--circle {
    border: 2px solid #ee5b02;
}

.jet-apb-calendar {
    position: relative;
    margin: 0 auto;
    display: flex;
    justify-content: center;
}

button.jet-form-builder__action-button.jet-form-builder__submit.submit-type-ajax {
    background: #384355;
    color: #ddd;
    border: 1px solid #ddd;
    margin-left: 37%;
    display: flex;
    justify-content: center;
    text-align: center;
    align-items: center;
    margin-top: -30px;
}