@font-face {
     font-family: 'Century Gothic BI';
     src: url('../fonts/webfonts/CenturyGothic-BoldItalic.woff2') format('woff2'),
         url('../fonts/webfonts/CenturyGothic-BoldItalic.woff') format('woff'),
         url('../fonts/webfonts/CenturyGothic-BoldItalic.svg#CenturyGothic-BoldItalic') format('svg');
     font-weight: bold;
     font-style: italic;
     font-display: swap;
 }
 
 @font-face {
     font-family: 'Century Gothic Bold';
     src: url('../fonts/webfonts/CenturyGothic-Bold.woff2') format('woff2'),
         url('../fonts/webfonts/CenturyGothic-Bold.woff') format('woff'),
         url('../fonts/webfonts/CenturyGothic-Bold.svg#CenturyGothic-Bold') format('svg');
     font-weight: bold;
     font-style: normal;
     font-display: swap;
 }
 
 @font-face {
     font-family: 'Century Gothic';
     src: url('../fonts/webfonts/CenturyGothic.woff2') format('woff2'),
         url('../fonts/webfonts/CenturyGothic.woff') format('woff'),
         url('../fonts/webfonts/CenturyGothic.svg#CenturyGothic') format('svg');
     font-weight: normal;
     font-style: normal;
     font-display: swap;
 }
 
 @font-face {
     font-family: 'Century Gothic Italic';
     src: url('../fonts/webfonts/CenturyGothic-Italic.woff2') format('woff2'),
         url('../fonts/webfonts/CenturyGothic-Italic.woff') format('woff'),
         url('../fonts/webfonts/CenturyGothic-Italic.svg#CenturyGothic-Italic') format('svg');
     font-weight: normal;
     font-style: italic;
     font-display: swap;
 }
 
 /* Configuración básica */
:root {
     --primary-color: #1b384e;
     --secondary-color: #23d6e8;
     --secondary-color-hover: #23d8e8c0;
     --white: #fff;
     --light-grey: #f7f7f7;
     --grey: #d8d8d8;
     --grey-low: #d8d8d814;
     --green: #3ab14e;
	 --fucsia: #ff006f;
     --green-pulse: #2f9240;
     --regular-font: 'Century Gothic', Arial, sans-serif !important;
     --medium-font: 'Century Gothic Bold', Arial, sans-serif !important;
     font-size: 16px !important;
}

html {
     font-size: 1rem;
}

* {
     font-family: var(--regular-font);
     letter-spacing: 0.5px;
}

/* Colores de fondo */

#principal {
     background-color: var(--white);
}

.section-1 {
     background-color: var(--primary-color);
     position: relative;
}

.section-1::before {
     content: "";
     position:absolute;
     top:-150px;
     left:0;
     height:150px;
     width: 150px;
     border-bottom-left-radius: 50%;
     background:transparent;
     box-shadow: 0 75px 0 0 var(--primary-color);
     -webkit-box-shadow: 0 75px 0 0 var(--primary-color);
     -moz-box-shadow: 0 75px 0 0 var(--primary-color);
}

.section-1::after {
     content: "";
     position:absolute;
     top:-150px;
     left:100%;
     transform: translateX(-100%);
     height:150px;
     width: 150px;
     border-bottom-right-radius: 75px;
     background:transparent;
     box-shadow: 0 75px 0 0 var(--primary-color);
     -webkit-box-shadow: 0 75px 0 0 var(--primary-color);
     -moz-box-shadow: 0 75px 0 0 var(--primary-color);
}

.section-4 {
     position: relative;
}

.contactanos {
     background-color: var(--fucsia);
}

#fundo h2, #caracteristicas h2, #ubicacion h2, #hablemos h2, .contactanos p, #precio h2, #tour h2, 
#como-comprar h2, #como-comprar h3, #precios-cards h2 {
     color: var(--white);
     font-family: var(--medium-font);
}

#header-hero .hero-image, #header-preguntas .hero-image{
     border-radius: 0 0 75px 75px;
}

#header-preguntas h1 {
     font-family: var(--medium-font);
}

#header-hero h1 {
     font-family: var(--medium-font);
}

#header-hero h1, #header-hero p {
     color: var(--primary-color);
}

#fundo, #caracteristicas, #ubicacion, #como-comprar {
     color: var(--white)
}

#fundo img {
     z-index: 200;
}

#masterplan {
     background-color: var(--white);
}
#masterplan h2, #galeria h2, #videopromocion h2 {
     color: var(--primary-color);
     font-family: var(--medium-font);
}

#videopromocion > div {
     position: relative;
     padding-bottom: 56.25%;
     height: 0;
     width: 100%;
}

#videopromocion > div iframe {
     position: absolute;
     top: 0;
     left: 0;
     height: 100%;
     width: 100%;
     border-radius: 25px;
}
.section-2 {
     border-top-right-radius: 100%;
}

#masterplan p b {
     color: var(--primary-color) !important;
}

#tour {
     /* background-color: var(--white); */
}

#separador1 {
     /* border-radius: 0 70% 0 0; */
     height: 200px;
     background-color: var(--primary-color);
     position: relative;
     overflow: hidden;
}


#separador1 .contenedor {
     content: "";
     position:absolute;
     top:0;
     left:0;
     height:200px;
     width: 100%;
     border-top-right-radius: 100%;
     background:var(--white);
     box-shadow: 0px 10px 10px -7px rgba(0,0,0,0.4) inset;
     -webkit-box-shadow: 0px 10px 10px -7px rgba(0,0,0,0.4) inset;
     -moz-box-shadow: 0px 10px 10px -7px rgba(0,0,0,0.4) inset;
     overflow: hidden;
}
#separador2 {
     background-color: var(--primary-color);
     position: relative;
     height: 200px;
     /* border-radius: 0 0 0 50%; */
}

#separador2::before {
     content: "";
     position:absolute;
     top:0;
     left:0;
     height:200px;
     width: 100%;
     border-bottom-left-radius: 100%;
     background:var(--white);
     overflow: hidden;
}

#boton-formulario {
     background-color: var(--secondary-color);
     color: var(--primary-color);
     font-family: var(--medium-font);
     font-size: 1.25rem;
}

#boton-preguntas {
     background-color: var(--light-grey);
     border-radius: 25px;
     line-height: 1.1;
}

#boton-preguntas p {
     font-family: var(--medium-font);
}
.pregunta-boton {
     padding: 0 0 0 0;
     background-color: var(--primary-color);
     border: none;
     color: var(--white);
     cursor: pointer;
     min-width: 30px;
     min-height: 30px;
}

.pregunta-boton p {
     font-size: 1.5rem;
     margin: 0;
     padding: 0;
     line-height: 0;
     vertical-align: middle;
     position: relative;
}

.pregunta-boton p:last-child {
     position: relative;
     top: -2px;
}

#principal .hero-image img, #preguntas-frecuentes .hero-image img {
     /* filter: brightness(120%) contrast(110%); */
}

#principal .logo-header, #preguntas-frecuentes .logo-header {
     opacity: 0.9;
}

#principal .logo-header .cls-5, #principal .logo-header .cls-2, #principal .logo-header .cls-3 {
     fill: var(--white)
} 

#footer .linea-contenedor {
     width: 60px;
}

#footer .linea {
     width: 60px;
     border-bottom: 3px solid var(--primary-color);
}

#ubicacion .google-maps p {
     font-family: var(--medium-font);
     font-size: 0.875rem;
}

.pregunta-card {
     background-color: var(--grey);
     border-radius: 25px;
     color: var(--primary-color);
     /* new */
     min-width: 200px;
     box-sizing: border-box;
     /* position: relative; */
}
.elemento-tabla-precio .pregunta-card {
     position: relative;
}
/*versiÃ³n nueva */
@media screen and (min-width: 960px){
     .elemento-tabla-precio .pregunta-card {
          right: -10px;
     }
     .elemento-tabla-precio .respuesta-new {
          left: -10px;
     }
     .elemento-tabla-precio .respuesta-new p {
          padding-left: 35px;
     }
}

.respuesta {
     border: 3px solid var(--grey);
     border-top: none;
     border-radius: 0 0 25px 25px;
     color: var(--primary-color);
     top: -25px;
}

.respuesta-new {
     border: 3px solid var(--grey);
     border-left: none;
     border-radius: 0 25px 25px 0;
     color: var(--primary-color);
}

@media screen and (max-width: 960px){
     .respuesta-new {
          border-left: 3px solid var(--grey);
          border-top: none;
          border-radius: 0 0 25px 25px;
          top: -25px;
          flex-direction: column;
          left: 0;
     }
     .respuesta-new p {
          padding-top: 55px;
     }
     .elemento-tabla-precio {
          flex-direction: column;
     }
     .pregunta-card {
          right: 0;
     }
} 

.respuesta p {
     padding-top: 55px;
}

#pregunta-principal .pregunta-card {
     top: -50px;
     padding-top: 80px;
}

#pregunta-principal .respuesta {
     top: -75px;
}

#preguntas-cards {
     top: -50px;
     margin-top: 30px;
}

#boton-preguntas a {
     color: var(--primary-color);
     font-family: var(--medium-font);
}

#boton-formulario:hover {
     background-color: var(--secondary-color-hover);
}


#precio .precio-panel span {
     color: var(--primary-color);
     font-family: var(--medium-font);
}

#precio .precio-panel {
     background-color: var(--secondary-color);
     color: var(--primary-color);
     border-radius: 30px;
     font-family: var(--regular-font);
     box-shadow: 0px 10px 15px -5px rgba(0,0,0,0.4);
}


#precio .linea {
     height: 35px;
     border-left: 15px solid var(--white);
}

#precio .cuadro {
     height: 20px;
     width: 60px;
     background-color: var(--white);
     border-radius: 15px 15px 0 0;
}

#precio .cuadro-contenedor, #precio .linea-contenedor {
     top: -20px;
}

#precio .precio-panel {
     padding-bottom: 25px;
}

#precio .precio-panel span {
     font-size: 2rem;
}

.section-3 {
     background-color: var(--white);
     position: relative;
     border-radius: 0 0 50px 50px;
     overflow: hidden;
     box-shadow: 0px 10px 15px 0px rgba(0,0,0,0.4); 
     -webkit-box-shadow: 0px 10px 15px 0px rgba(0,0,0,0.4); 
     -moz-box-shadow: 0px 10px 15px 0px rgba(0,0,0,0.4); 
}



#hablemos {
     /* background-color: var(--primary-color); */
     overflow: hidden;
}

#footer {
     background-color: var(--white);
     font-family: var(--regular-font);
     color: var(--primary-color)
}

#footer a {
     color: var(--primary-color)!important
}

#footer .icono-fb {
     width: 25px;
}

#footer .icono-ig {
     width: 45px;
}

#footer .logo-rq {
     width: 200px;
}

#barra-navegacion {
     background-color: var(--white);
}

#barra-navegacion a span{
     font-family: var(--medium-font);
     color: var(--primary-color);
     transition: all 0.2s ease-in;
}

#barra-navegacion li:hover a span, #sidemenu li:hover a span {
     color: var(--secondary-color);
     transition: all 0.2s ease-out;
}
#principal .header-hero {
     background-color: var(--white);
}

#sticky-nav {
     background-color: var(--white);
}


#sticky-nav .contactanos {
     padding-top: 5px;
}

#sticky-nav nav {
     padding-top: 5px;
     box-shadow: 0px 10px 15px -5px rgba(0,0,0,0.4);
     -webkit-box-shadow: 0px 15px 15px -15px rgba(0,0,0,0.4);
     -moz-box-shadow: 0px 10px 15px -5px rgba(0,0,0,0.4);
}

.tour-imagen iframe, #galeria ul {
     border-radius: 25px;
}

#tour .tour-imagen iframe {
     box-shadow: 5px 10px 15px 0px rgba(0,0,0,0.4);
}

.mapa iframe {
     border-radius: 15px;
}
textarea {
     resize: none;
}

.hero-image img {
     /* max-height: 55vh; */
     max-height: 40vh;
}

#principal .header-text p {
     max-width: 180px;
}

#ubicacion .lineas {
     /* top: -50px; */
     top: -40px;
     right: 25px;
     width: 100%;
}

#sidemenu > div {
     background-color: var(--white);
}

#sidemenu li a span, #sidemenu li {
     color: var(--primary-color);
     font-family: var(--medium-font);
     transition: all 0.2s ease-in;
}

#header .contactanos-desktop {
     position: absolute;
          top: 85px; 
          left: 50%;
          transform: translateX(-50%);
          width: 940px; 
          height: 65px; 
/*           height: 120px; */
          padding-inline: 5px;
          background-color: var(--fucsia);
          font-size: 1.5rem;
          border-radius: 0 0 25px 35px;
          box-shadow: 0px 10px 15px -5px rgba(0,0,0,0.4) inset;
          -webkit-box-shadow: 0px 10px 15px -5px rgba(0,0,0,0.4) inset;
          -moz-box-shadow: 0px 10px 15px -5px rgba(0,0,0,0.4) inset;
          text-align: center;
          display: flex;
          justify-content: center;
          align-items: center;
          cursor: pointer;
}

.pulse {
     animation: color 2s infinite;
}

.pulse:hover{
     animation: none;
}

#barra-navegacion .toggle {
     color: var(--primary-color);
}

#header .contactanos-desktop p {
     font-family: var(--medium-font) !important;
     color: var(--white);
/*      font-size: 1.5rem !important; */
     font-size: 1.125rem !important;
	
}

.pipedriveWebForms{
     background-color: var(--white);
     border-radius: 25px;
     width: auto !important;
     margin: 40px 0;
}

.section-3 {
     padding: 20px;
}

#tour .contenedor .icono {
     width: 10px;
}

#tour .contenedor .icono .cls-1, #tour .contenedor .icono .cls-2  {
     fill: var(--white)
}
#tour {
     width: 100%;
}
@keyframes color {
     0% {
          background-color: var(--green);
     }
     50% {
       background-color:  var(--green-pulse);
     }    
     100% {
       background-color: var(--green);
     }
}

@media screen and (max-width: 350px) {
     #caracteristicas .icono-caracteristica {
          width: 100%;
     }
}

@media screen and (min-width: 350px) {
     .section-2, .section-3, #header-hero, .section-4, #header-preguntas, #tour {
          padding: 0
     }
}


@media screen and (max-width: 640px){
     #principal .header-contenedor, #tour, #videopromocion, #galeria, #tour .contenedor, #preguntas-frecuentes .header-contenedor{
          padding-left: 0;
          padding-right: 0;
     }

     .hero-image img {
          /* min-height: 45vh; */
          min-height: 30vh;
     }

     #header-hero h1 {
          font-size: 1.7rem;
     }

     #separador1 .contenedor {
          border-top-right-radius: 50%;
     }

     #separador2::before {
          border-bottom-left-radius: 50%;
     }

}

@media screen and (min-width: 640px) {
     .mapa iframe {
          height: 350px;
     }
     .icono-caracteristica img {
          width: 45px;
     }
     
}

@media screen and (min-width: 300px) and (max-width: 640px) {

}

@media screen and (max-width: 960px){
     #fundo, #caracteristicas, #precio, #tour, #hablemos, #como-comprar {
          padding-bottom: 0;
     }
}

@media screen and (min-width: 960px){
     #principal .header-text p {
          max-width: 450px;
     }

     #fundo img {
          width: 250px;
          height: auto;
     }

     #fundo, #caracteristicas, #precio, #ubicacion, #masterplan > div, #tour .contenedor, #formulario, #videopromocion > div , #galeria > div, #preguntas-cards, #pregunta-principal, #como-comprar, #precios-cards, #calugas-header {
          max-width: 940px;
     }

     .pipedriveWebForms {
          width: 540px !important;
     }

     #tour .contenedor .icono, .header-text img {
          width: 20px;
     }

     #hablemos {
          /* border-radius: 0; */
          /* box-shadow: 0px 10px 15px 0px rgba(0,0,0,0.4); */
     }

     #footer .contenedor, #footer .contenedor div:last-child {
          flex-direction: row;
     }

     #footer .contenedor div:last-child div:last-child {
          padding-left: 25px;
     }

     #footer {
          background-color: var(--primary-color);
          font-family: var(--regular-font);
          color: var(--white);
          height: 300px;
     }

     #footer a {
          color: var(--white) !important;
     }

     #header-hero {
          padding: 0;
     }

     #header-hero .logo-header {
          transform: scale(2);
     }

     .section-4::after, .section-4::before {
          display: none;
     }

     .section-3 {
          border-radius: 0;
     }

     
     #footer .icono-fb svg .cls-1,  #footer .icono-ig svg .cls-1, #footer .logo-rq .cls-5, #footer .logo-rq .cls-2, #footer .logo-rq .cls-3{
          fill: var(--white)
     }

     #preguntas-cards .pregunta-card, #pregunta-principal .pregunta-card {
          flex-direction: row;
     }

     .pregunta-card button {
          margin-left: 20px;
     }

     #pregunta-principal .pregunta-card {
          top: 0px;
          padding-top: 20px;
     }
     
     #pregunta-principal .respuesta {
          top: -25px;
     }

     #boton-preguntas {
          margin-bottom: 30px;
          padding: 20px 30px;
          border-radius: 10px;
     }

     #preguntas-cards {
          top: 0;
          margin-top: 30px;
          padding-bottom: 200px;
     }

     #pregunta-principal {
          padding-top: 100px;
     }

     .pregunta-card {
          /* padding: 20px 30px; */
          /* new */
          padding: 20px 15px;
          border-radius: 10px;
     }

     .pregunta-card p {
          margin: 0;
     }

     #ubicacion .google-maps p {
          font-size: 1rem;
     }

     #sticky-nav nav {
          box-shadow: unset;
          -webkit-box-shadow: unset;
          -moz-box-shadow: unset;
     }

     #sticky-nav {
          box-shadow: 0px 10px 15px -5px rgba(0,0,0,0.4);
          -webkit-box-shadow: 0px 15px 15px -15px rgba(0,0,0,0.4);
          -moz-box-shadow: 0px 10px 15px -5px rgba(0,0,0,0.4);
     }
}

@media screen and (max-width: 1200px){
     #separador1 .contenedor {
          border-top-right-radius: 75%;
     }
     
     #separador2::before {
          border-bottom-left-radius: 75%;
     }
}


@media screen and (min-width: 1220px){
     #barra-navegacion {
          padding: 0;
     }
     .section-1 {
          padding: 0;
     }
     #videopromocion > div iframe {
          width: 940px;
          height: 630px;
          position: relative;
     }

     #videopromocion > div {
          padding-bottom: 0;
          height: auto;
     }
}

/* Cómo comprar parcela */
/* #como-comprar .icono {
     background-color: var(--secondary-color);
     padding: 20px;
     border-radius: 50%;
} */

#como-comprar h3 {
     font-weight: 600;
}
#como-comprar .titulo-comprar {
     border: 2px solid var(--secondary-color);
     padding: 15px 15px 15px 75px;
     border-radius: 200px;
     position: relative;
}
#como-comprar .pasos-comprar > div:first-child .titulo-comprar::before {
     content: "1";
}
#como-comprar .pasos-comprar > div:nth-child(2) .titulo-comprar::before {
     content: "2";
}
#como-comprar .pasos-comprar > div:last-child .titulo-comprar::before {
     content: "3";
}
#como-comprar .titulo-comprar::before {
     background-color: var(--secondary-color);
     height: 65px;
     width: 65px;
     position: absolute;
     text-align: center;
     vertical-align: middle;
     left: -2px;
     top: 0;
     border-radius: 50%;
     color: var(--primary-color);
     display: flex;
     justify-content: center;
     align-items: center;
}

/* Precios*/

#precios-cards .respuesta,
#precios-cards .respuesta-new {
     color: var(--white);
}

#precios-cards .precio-venta {
     display: inline-block;
     padding: 10px 15px;
     font-size: 1.5rem;
     font-weight: 800;
     border-radius: 50px;
     background-color: var(--secondary-color);
     color: var(--primary-color);
     box-shadow: 0px 10px 15px -5px rgba(0,0,0,0.4);

}

#precios-cards .pregunta-boton {
     background-color: var(--secondary-color);
     color: var(--primary-color);
}

#precios-cards .pregunta-boton p {
     font-weight: 800;
}

#precios-cards .pregunta-card {
     background-color: var(--grey-low);
     border-radius: 25px;
}

#precios-cards .respuesta,
#precios-cards .respuesta-new {
     border-color: var(--grey-low);
}

#precios-cards .precio-titulo {
     font-weight: 600;
     color: var(--white);
}

#precios-cards .precio-titulo {
     margin-top: 5px;
     margin-bottom: 10px;
}

@media screen and (max-width: 960px) {
     #como-comprar .titulo-comprar {
          font-size: 1.1rem;
     }
     #como-comprar .titulo-comprar::before {
          height: 55px;
          width: 55px;
     }
}

@media screen and (min-width: 960px){
     #precios-cards .pregunta-card button {
          margin-left: 0;
     }
     #precios-cards .pregunta-card {
          border-radius: 25px;
     }
     #precios-cards .respuesta {
          min-height: 310px;
     }
     #precios-cards .precio-titulo {
          margin-top: 5px;
          margin-bottom: 10px;
     }
     #como-comprar .pasos-comprar p {
          margin-top: 2rem;
     }
}

#header .contactanos-desktop p {
     font-family: var(--regular-font) !important;
}

.contactanos p {
	font-family: var(--regular-font) !important;
}

.whatsapp-button-fixed {
     z-index: 4;
     position: fixed;
     bottom: 30px;
     right: 30px;
     background-color: #fff;
     /* height: 45px; */
     width: 60px;
     height: 60px;
     overflow: hidden;
     border-radius: 25%;
     padding: 0;
     box-shadow: 5px 5px 10px -5px rgb(0 0 0 / 50%);
 }

 .caluga-header-contenedor img {
     border-radius: 25px;
     aspect-ratio: 3 /2;
     max-height: 250px;
 }

 #hablemos form > div.eVYYUZ {
     text-align: center;
 }