@import url("https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css");
@import url("https://fonts.googleapis.com/css2?family=Lobster&family=Roboto:wght@400;700;900&display=swap");
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
    -webkit-text-size-adjust: 100%;
    line-height: 1.15;
}
body {
    margin: 0;
}
main {
    display: block;
}
h1 {
    font-size: 2em;
    margin: 0.67em 0;
}
hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible;
}
pre {
    font-family: monospace, monospace;
    font-size: 1em;
}
a {
    background-color: transparent;
}
abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
}
b,
strong {
    font-weight: bolder;
}
code,
kbd,
samp {
    font-family: monospace, monospace;
    font-size: 1em;
}
small {
    font-size: 80%;
}
sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sub {
    bottom: -0.25em;
}
sup {
    top: -0.5em;
}
img {
    border-style: none;
}
button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0;
}
button,
input {
    overflow: visible;
}
button,
select {
    text-transform: none;
}
[type="button"],
[type="reset"],
[type="submit"],
button {
    -webkit-appearance: button;
}
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner,
button::-moz-focus-inner {
    border-style: none;
    padding: 0;
}
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring,
button:-moz-focusring {
    outline: 1px dotted ButtonText;
}
fieldset {
    padding: 0.35em 0.75em 0.625em;
}
legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal;
}
progress {
    vertical-align: baseline;
}
textarea {
    overflow: auto;
}
[type="checkbox"],
[type="radio"] {
    box-sizing: border-box;
    padding: 0;
}
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
    height: auto;
}
[type="search"] {
    -webkit-appearance: textfield;
    outline-offset: -2px;
}
[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}
::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit;
}
details {
    display: block;
}
summary {
    display: list-item;
}
[hidden],
template {
    display: none;
}
html {
    box-sizing: border-box;
    font-size: 62.5%;
}
*,
:after,
:before {
    box-sizing: inherit;
}
body {
    font-family: Roboto, sans-serif;
    font-size: 1.6rem;
    margin: 0 auto;
    width: 95%;
}
p {
    line-height: 1.5;
}
a {
    text-decoration: none;
}
h1,
h2,
h3 {
    font-weight: 700;
    margin: 2rem 0;
}
img {
    display: block;
    height: auto;
    max-width: 100%;
    width: 100%;
}
.swal2-popup {
    font-size: 1.8rem !important;
}
.bg-secundario {
    background-color: #f8c210;
}
.volver-arriba {
    background-color: #e91075;
    border-radius: 100%;
    bottom: 2rem;
    color: #fff;
    cursor: pointer;
    font-size: 2rem;
    padding: 2rem;
    position: fixed;
    right: 2rem;
}
@media (min-width: 768px) {
    .volver-arriba {
        bottom: 6rem;
        right: 6rem;
    }
}
.header {
    background-color: #e91075;
    padding: 2rem;
}
.navegacion {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 3rem;
    height: 0;
    margin: 0 auto;
    opacity: 0;
    transition-duration: 0.4s;
    transition-property: opacity;
    width: 90%;
}
@media (min-width: 768px) {
    .navegacion {
        flex-direction: row;
        height: 100%;
        justify-content: right;
        opacity: 1;
    }
}
.navegacion a {
    color: #fff;
    font-size: 2.2rem;
}
.navegacion .demo-btn {
    border: 3px solid #fff;
    border-radius: 2rem;
    padding: 1rem;
}
.navegacion.mostrar {
    height: 100%;
    opacity: 1;
}
.toggle-nav {
    background-color: transparent;
    border: none;
    margin: 0 auto;
    width: 100%;
}
@media (min-width: 768px) {
    .toggle-nav {
        display: none;
    }
}
.hero {
    align-items: center;
    background-image: linear-gradient(
            90deg,
            rgba(0, 0, 0, 0.4),
            rgba(0, 0, 0, 0.4)
        ),
        url(../img/hero.webp);
    background-position: 50%;
    background-size: cover;
    display: grid;
    height: 75vh;
    margin: 0;
    padding: 0 5%;
    position: relative;
}
@media (min-width: 768px) {
    .hero {
        grid-template-columns: 1fr 2fr;
    }
}
.hero .contenido {
    grid-column: 2/3;
    text-align: right;
}
.hero .contenido .titulo {
    color: #f8c210;
    /* font-family: Lobster, cursive; */
    font-weight: bolder;
    font-size: 6rem;
    letter-spacing: 0.2rem;
}
.hero .contenido p {
    color: #fff;
    font-size: 1.6rem;
}
.hero .contenido .subtitulo {
    font-size: 2.6rem;
    font-weight: 700;
}
@media (min-width: 768px) {
    .hero .contenido .titulo {
        font-size: 7rem;
    }
    .hero .contenido p {
        font-size: 2.4rem;
    }
    .hero .contenido .subtitulo {
        font-size: 3rem;
    }
}
.hero img {
    display: none;
}
@media (min-width: 768px) {
    .hero img {
        -webkit-animation-delay: 0;
        animation-delay: 0;
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-iteration-count: 1;
        animation-iteration-count: 1;
        -webkit-animation-name: mostrarImagen;
        animation-name: mostrarImagen;
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out;
        bottom: 5rem;
        display: block;
        left: -0.4rem;
        position: absolute;
        width: 45rem;
    }
}
.hero svg {
    display: none;
}
@media (min-width: 768px) {
    .hero svg {
        bottom: 0;
        display: block;
        position: absolute;
    }
}
@-webkit-keyframes mostrarImagen {
    0% {
        opacity: 0;
        transform: translateX(-10rem);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}
@keyframes mostrarImagen {
    0% {
        opacity: 0;
        transform: translateX(-10rem);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}
.nosotros {
    background-color: #f7f4ea;
    padding: 5rem 5%;
}
.nosotros .texto {
    margin: 0 auto;
    max-width: 110rem;
}
.nosotros .texto p {
    text-align: center;
    color: #646464;
    font-size: 4rem;
}
.nosotros .texto span {
    color: #e91075;
    font-weight: 700;
}
.nosotros .box {
    align-items: center;
    background-color: #fff;
    box-shadow: 0 5px 13px 2px rgba(0, 0, 0, 0.75);
    display: grid;
    gap: 3rem;
    padding: 2rem;
}
@media (min-width: 768px) {
    .nosotros .box {
        grid-template-columns: 1fr 1fr;
        margin: 0 auto;
        padding: 5rem;
        width: 80%;
    }
}
.nosotros .contenido h2 {
    font-size: 3rem;
}
.nosotros .contenido .subtitulo {
    color: #e91075;
    font-weight: 700;
}
.nosotros .contenido p {
    color: #646464;
    font-size: 1.8rem;
}
.destacados {
    background-color: #f7f4ea;
    padding: 2% 5%;
}
@media (min-width: 768px) {
    .destacados {
        margin: 10rem 10% 0;
    }
}
.destacado {
    border-bottom: 2px solid #b6b6b6;
    display: flex;
    flex-direction: column;
    gap: 5rem;
    margin-bottom: 3rem;
    padding-bottom: 5rem;
}
@media (min-width: 768px) {
    .destacado {
        align-items: center;
        border: none;
        flex-direction: row;
        padding: 0;
    }
}
.destacado .contenido {
    flex: 50%;
}
.destacado .contenido h2 {
    font-size: 3rem;
    font-weight: 700;
}
.destacado .contenido .subtitulo {
    color: #e91075;
    font-weight: 700;
}
.destacado .contenido p {
    color: #646464;
    font-size: 2rem;
}
.destacado .imagen {
    background: linear-gradient(0deg, #f8c210 70%, #ffffff00 0);
    border-radius: 2rem;
    flex: 50%;
    padding: 1rem;
}
.destacado .imagen img {
    display: block;
    margin: 0 auto;
    width: 50%;
}
@media (min-width: 768px) {
    .destacado .imagen {
        padding: 3rem;
    }
}
.destacado:last-of-type {
    border: none;
    margin-bottom: 0;
    padding: 0;
}
.caracteristicas {
    -moz-column-gap: 4rem;
    column-gap: 4rem;
    display: grid;
    padding: 10%;
    padding-bottom: 3%;
    margin-bottom: 4%;
    border-bottom:  1px solid 1px solid rgba(0,0,0,.1);
    row-gap: 4rem;
}
@media (min-width: 768px) {
    .caracteristicas {
        grid-template-columns: 1fr 1fr;
    }
}
.caracteristica {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
@media (min-width: 768px) {
    .caracteristica {
        flex-direction: row;
    }
}
.caracteristica img {
    height: 148px;
    width: 148px;
}
.caracteristica .contenido h3 {
    font-size: 4rem;
    text-align: center;
}
.precios {
    align-items: center;
    background-color: #e91075;
    color: #fff;
    display: flex;
    flex-direction: column;
    padding: 0 5% 5%;
}
.precios h2 {
    font-size: 7.5rem;
}
.precios p {
    font-size: 2.5rem;
}
@media (min-width: 768px) {
    .precios {
        background: linear-gradient(180deg, #e91075 50%, #ffffff00 0);
    }
}
.tabla-planes {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
@media (min-width: 768px) {
    .tabla-planes {
        flex-direction: row;
    }
}
.plan {
    background-color: #fff;
    border: 0.5rem solid #f8c210;
    border-radius: 3rem;
    box-shadow: 0 7px 13px -1px rgba(0, 0, 0, 0.75);
    color: #000;
    flex-basis: 33.3%;
    padding: 2rem;
}
.plan:nth-child(2) {
    background-color: #f7f4ea;
}
.plan .contenido {
    align-items: center;
    border-bottom: 2px solid #b6b6b6;
    display: flex;
    flex-direction: column;
    margin-bottom: 2rem;
}
.plan .contenido h3 {
    color: #000;
    font-size: 4rem;
    margin: 0 0 2rem;
}
.plan .contenido .precio {
    margin: 0 0 2rem;
}
.plan .contenido .precio span {
    color: #e91075;
    font-size: 5rem;
    font-weight: 700;
}
.plan .contenido .subtitulo {
    font-size: 2.2rem;
    margin: 0 0 1rem;
    text-align: center;
}
.plan ul li {
    font-size: 1.8rem;
    margin-bottom: 1rem;
}
.plan ul span {
    color: #e91075;
    font-weight: 700;
}
.plan .mejoras {
    text-align: center;
}
.plan .mejoras p {
    font-size: 1.8rem;
    margin: 0;
}
.plan .mejoras .mejora {
    margin: 3rem 0;
}
.plan .mejoras .mejora .precio {
    color: #e91075;
    font-weight: 700;
}
.plan .mejoras .altres {
    border-bottom: 2px solid #b6b6b6;
    padding-bottom: 3rem;
    text-transform: uppercase;
}
.plan .mejoras .iva {
    margin-top: 1rem;
}

/* Slogan Demo */
.slogan-demo {
    text-align: center;
}

.slogan-demo .texto-1 {
    font-size: 4rem;
    color: #e91075;
}

.slogan-demo .texto-2 {
    font-size: 3.6rem;

}

/* Demo */
.demo {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 6rem;
    margin: 5rem auto;
}
.demo a {
    background-color: #e91075;
    border-radius: 2rem;
    box-shadow: 13px 13px 21px -8px rgba(0, 0, 0, 0.75);
    color: #fff;
    display: block;
    font-size: 2.4rem;
    padding: 3rem;
    width: 100%;
}
.demo img {
    display: block;
    width: 20rem;
}
@media (min-width: 768px) {
    .demo {
        flex-direction: row;
        width: 50%;
    }
}
.contacto {
    margin-top: 15rem;
    padding-bottom: 5rem;
    position: relative;
}
.contacto .box {
    background-color: #fff;
    border: 3px solid #e91075;
    border-radius: 2rem;
    font-weight: 700;
    margin: 0 auto;
    padding: 2rem 0;
    position: relative;
    text-align: center;
    top: -10rem;
    width: 90%;
}
.contacto .box h2 {
    color: #e91075;
    font-size: 3rem;
    margin: 0;
}
.contacto .box p {
    color: #000;
    font-size: 2rem;
    margin: 1rem 0 0;
}
@media (min-width: 768px) {
    .contacto .box {
        top: -6rem;
        width: 70%;
    }
}
.contacto form {
    margin: 0 auto;
    width: 60%;
}
.contacto form h2 {
    font-size: 4rem;
    margin: 0 0 4rem;
    text-align: center;
}
.contacto form .campo {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 3rem;
}
.contacto form .campo input,
.contacto form .campo textarea {
    border: 1px solid gray;
    border-radius: 1rem;
    max-width: 50rem;
    padding: 1rem 2rem;
    width: 100%;
}
.contacto form input[type="submit"] {
    background-color: #e91075;
    border: none;
    border-radius: 1rem;
    color: #fff;
    display: block;
    font-size: 2rem;
    font-weight: 700;
    margin: 0 auto;
    max-width: 30rem;
    padding: 1rem;
    width: 100%;
}
.contacto form input[type="submit"]:hover {
    cursor: pointer;
}
.footer {
    background-color: #e91075;
}
.footer .contenido {
    align-items: flex-end;
    display: flex;
    justify-content: space-between;
    padding: 0 5% 2rem;
}
.footer .contenido .empresa {
    color: #fff;
    flex-basis: 80%;
    font-size: 1.6rem;
}
.footer .contenido .empresa p {
    margin: 0;
}
.footer .contenido .empresa .telefono {
    align-items: center;
    color: #fff;
    display: flex;
    font-size: 2.6rem;
    gap: 1rem;
    margin-bottom: 2rem;
    text-decoration: none;
}
.footer .contenido .empresa .telefono img {
    width: 5rem;
}
.footer .contenido .enlaces {
    display: flex;
    flex-basis: 20%;
    justify-content: space-between;
    width: 100%;
}
.footer .contenido .enlaces a {
    color: #fff;
    display: block;
    font-size: 1.8rem;
}
.cookie-alert {
    bottom: 15px;
    margin: 0 !important;
    opacity: 0;
    position: fixed;
    right: 15px;
    transform: translateY(100%);
    transition: all 0.5s ease-out;
    width: 320px;
    z-index: 999;
}
.cookie-alert.show {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 1s;
}
.accept-cookies,
.more-info-cookies {
    font-size: 1.8rem !important;
}
.more-info-cookies {
    color: #e91075;
}
.accept-cookies {
    background-color: #e91075;
    border: none;
}
.phone {
    border: 4rem solid #2e2e2e;
    border-radius: 4rem;
    border-width: 4rem 7px;
    height: 780px;
    margin: 5rem auto;
    overflow: hidden;
    transition: all 0.5s ease;
    width: 375px;
}
.phone iframe {
    border: 0;
    height: 100%;
    width: 100%;
}
.volver {
    background-color: #e91075;
    border: 3px solid #fff;
    border-radius: 2rem;
    color: #fff;
    display: block;
    font-size: 2rem;
    margin-top: 2rem;
    padding: 1rem;
    text-align: center;
    transition-duration: 0.4s;
    transition-property: background-color;
}
@media (min-width: 768px) {
    .volver {
        left: 2rem;
        position: absolute;
        top: 2rem;
    }
}
.volver:hover {
    background-color: #fff;
    color: #e91075;
}
/*# sourceMappingURL=app.css.map */