.elementor-476 .elementor-element.elementor-element-781e15a{--display:flex;--overlay-opacity:0.5;--border-radius:0px 0px 0px 0px;overflow:visible;}.elementor-476 .elementor-element.elementor-element-781e15a::before, .elementor-476 .elementor-element.elementor-element-781e15a > .elementor-background-video-container::before, .elementor-476 .elementor-element.elementor-element-781e15a > .e-con-inner > .elementor-background-video-container::before, .elementor-476 .elementor-element.elementor-element-781e15a > .elementor-background-slideshow::before, .elementor-476 .elementor-element.elementor-element-781e15a > .e-con-inner > .elementor-background-slideshow::before, .elementor-476 .elementor-element.elementor-element-781e15a > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#959595;background-image:url("https://crocashleybeato.lat/wp-content/uploads/2025/11/Fondo-de-puntos.png");--background-overlay:'';}.elementor-476 .elementor-element.elementor-element-bee3343{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;border-radius:30px 30px 30px 30px;box-shadow:0px 0px 10px 0px rgba(0,0,0,0.5);}.elementor-476 .elementor-element.elementor-element-bee3343.elementor-element{--align-self:center;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-bee3343 */@import url('https://fonts.googleapis.com/css2?family=Fredoka+One&family=Quicksand:wght@300;400;500;600&display=swap');


/* -----------------------------------------
   APLICAR TIPOGRAFÍAS SOLO A .contact-page
------------------------------------------ */

/* Títulos y subtítulos → Fredoka One */
.contact-page h1,
.contact-page h2,
.contact-page h3,
.contact-page h4,
.contact-page h5,
.contact-page h6,
.contact-page .contact-title {
    font-family: "Fredoka One", cursive !important;
}

/* Cuerpo de texto → Quicksand */
.contact-page,
.contact-page p,
.contact-page span,
.contact-page li,
.contact-page label,
.contact-page input,
.contact-page textarea,
.contact-page button,
.contact-page .contact-text,
.contact-page .contact-form,
.contact-page .legal-info {
    font-family: "Quicksand", sans-serif !important;
}


/* -----------------------------------------
   ESTILOS ORIGINALES QUE YA TENÍAS
------------------------------------------ */

.contact-page {
    width: 100%;
    padding: 40px 0;
    background: #fff5fa;
    border-radius: 30px;
}

.contact-wrapper {
    max-width: 1400px;
    margin: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: start;
}

/* -------- IMAGEN -------- */
.contact-image img {
    position: relative;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 30px;
}

/* -------- ANIMACIÓN FADE IN UP -------- */
@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(25px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-in-up {
    animation: fadeInUp 0.9s ease forwards;
    opacity: 0;
}

/* -------- CONTENIDO -------- */
.contact-content {
    padding-right: 20px;
}

.contact-title {
    font-size: 48px;
    font-weight: 800;
    color: #b47c7c;
    text-transform: uppercase;
    margin-bottom: 20px;
    letter-spacing: 2px;
}

.contact-text p {
    font-size: 16px;
    line-height: 1.7;
    color: #593f3f;
    margin-bottom: 16px;
}

/* -------- FORMULARIO -------- */
.contact-form {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.contact-form input,
.contact-form textarea {
    width: 100%;
    padding: 16px;
    background: #fff2f7;
    border: 1px solid #f2cbd6;
    border-radius: 4px;
    font-size: 15px;
    color: #533c3c;
    outline: none;
    transition: 0.2s ease;
}

.contact-form input:focus,
.contact-form textarea:focus {
    border-color: #c27f9b;
    background: #fff;
}

.contact-form textarea {
    height: 160px;
    resize: none;
}

/* -------- CHECKBOX -------- */
.checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #6b4c4c;
}

/* -------- BOTÓN -------- */
.send-btn {
    width: 180px;
    padding: 14px 0;
    background: #b47c7c;
    color: white;
    font-weight: bold;
    border: none;
    cursor: pointer;
    letter-spacing: 1px;
    border-radius: 4px;
    transition: 0.2s ease;
}

.send-btn:hover {
    background: #965a5a;
}

/* -------- LEGAL -------- */
.legal-info {
    margin-top: 25px;
    font-size: 12px;
    color: #7b5d5d;
    line-height: 1.5;
}

/* -------- RESPONSIVE -------- */
@media (max-width: 900px) {
    .contact-wrapper {
        grid-template-columns: 1fr;
    }

    .contact-image {
        order: 2;
    }

    .contact-content {
        order: 1;
    }
}

.contact-page {
    width: 100%;
    padding: 40px 0;
    background: #fff5fa;
    border-radius: 30px;

    /* fade in up aplicado al contenedor completo */
    opacity: 0;
    animation: fadeInUp 1s ease forwards;
}/* End custom CSS */