/* ==================================================
   CONTACTO
   Estilos específicos
================================================== */


/* ==================================================
   CONTACTO
   FORMAS DE CONTACTO
================================================== */

.contact-methods{
    padding:110px 40px 120px;
    background:#FFFFFF;
}

.contact-methods-container{
    width:100%;
    max-width:1280px;
    margin:0 auto;
}

.contact-methods-header{
    max-width:820px;
    margin:0 0 58px;
}

.contact-methods-header .section-label{
    margin-bottom:18px;
}

.contact-methods-header h2{
    max-width:780px;
    margin:0 0 22px;

    color:#17263F;

    font-size:52px;
    line-height:1.08;
    letter-spacing:-2px;
    font-weight:700;
}

.contact-methods-header p{
    max-width:700px;
    margin:0;

    color:#667085;

    font-size:18px;
    line-height:1.8;
}

.contact-methods-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:22px;
}

.contact-method-card{
    min-height:300px;

    padding:38px 34px;

    display:flex;
    flex-direction:column;

    background:#FAF7F1;

    border:1px solid #E5DDCE;
    border-radius:26px;

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease;
}

.contact-method-card:hover{
    transform:translateY(-5px);

    border-color:rgba(202,157,33,.50);

    box-shadow:0 20px 50px rgba(23,38,63,.07);
}

.contact-method-card > i{
    width:58px;
    height:58px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:26px;

    border:1px solid #E9D8A6;
    border-radius:18px;

    background:#F8F2E4;

    color:var(--color-primary);

    font-size:23px;
}

.contact-method-card h3{
    margin:0 0 14px;

    color:#17263F;

    font-family:"Cormorant Garamond",serif;
    font-size:32px;
    line-height:1.12;
    font-weight:650;
}

.contact-method-card p{
    margin:0 0 26px;

    color:#667085;

    font-size:15px;
    line-height:1.75;
}

.contact-method-card a{
    margin-top:auto;

    color:#17263F;

    font-size:14px;
    font-weight:800;
    line-height:1.5;

    text-decoration:none;

    overflow-wrap:anywhere;

    transition:color .25s ease;
}

.contact-method-card a:hover{
    color:var(--color-primary);
}

.contact-method-phones{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:7px;
    margin-top:auto;
}

.contact-method-phones a{
    margin-top:0;
}
/* ==================================================
   RESPONSIVE
================================================== */

@media(max-width:950px){

    .contact-methods-grid{
        grid-template-columns:1fr;
        max-width:760px;
    }

}

@media(max-width:768px){

    .contact-methods{
        padding:85px 24px 95px;
    }

    .contact-methods-header{
        margin-bottom:44px;
    }

    .contact-methods-header h2{
        font-size:39px;
        line-height:1.1;
        letter-spacing:-1.4px;
    }

    .contact-methods-header p{
        font-size:17px;
    }

    .contact-method-card{
        min-height:auto;
        padding:32px 28px;
    }

    .contact-method-card h3{
        font-size:29px;
    }

}

@media(max-width:480px){

    .contact-methods{
        padding-left:18px;
        padding-right:18px;
    }

    .contact-method-card{
        padding:30px 24px;
    }

}
/* ==================================================
   FORMULARIO
================================================== */

.contact-form-section{

    padding:120px 40px;

    background:#FFFFFF;

    scroll-margin-top:120px;

}

.contact-form-container{

    max-width:1360px;

    margin:0 auto;

    display:grid;

    grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);

    gap:90px;

    align-items:start;

}

.contact-form-content{

    position:sticky;

    top:140px;

}

.contact-form-content .section-label{

    margin-bottom:22px;

}

.contact-form-content h2{

    max-width:590px;

    margin:0 0 28px;

    color:#17263F;

    font-size:58px;

    line-height:1.07;

    letter-spacing:-2.5px;

}

.contact-form-content > p{

    max-width:560px;

    margin:0 0 36px;

    color:#667085;

    font-size:18px;

    line-height:1.85;

}

.contact-form-benefits{

    display:flex;

    flex-direction:column;

    gap:17px;

    padding-top:30px;

    border-top:1px solid var(--color-border);

}

.contact-form-benefit{

    display:flex;

    align-items:flex-start;

    gap:13px;

    color:#17263F;

    font-size:15px;

    font-weight:650;

    line-height:1.6;

}

.contact-form-benefit i{

    margin-top:4px;

    color:var(--color-primary);

    font-size:13px;

}

.contact-form-wrapper{

    padding:46px;

    background:#FAF7F1;

    border:1px solid #E6DCCB;

    border-radius:30px;

    box-shadow:0 24px 65px rgba(23,38,63,.07);

}

.contact-form-grid{

    display:grid;

    grid-template-columns:repeat(2,minmax(0,1fr));

    gap:24px;

}

.contact-field{

    display:flex;

    flex-direction:column;

    gap:10px;

}

.contact-field-full{

    grid-column:1 / -1;

}

.contact-field label{

    color:#17263F;

    font-size:14px;

    font-weight:750;

}

.contact-field input,
.contact-field select,
.contact-field textarea{

    width:100%;

    padding:16px 17px;

    background:#FFFFFF;

    color:#17263F;

    border:1px solid #D9D1C5;

    border-radius:14px;

    font-family:"Manrope",sans-serif;

    font-size:16px;

    line-height:1.5;

    outline:none;

    transition:
        border-color .25s ease,
        box-shadow .25s ease,
        background .25s ease;

}

.contact-field textarea{

    min-height:165px;

    resize:vertical;

}

.contact-field select{

    cursor:pointer;

}

.contact-field input:focus,
.contact-field select:focus,
.contact-field textarea:focus{

    background:#FFFFFF;

    border-color:var(--color-primary);

    box-shadow:0 0 0 4px rgba(202,157,33,.10);

}

.contact-consent{

    display:grid;

    grid-template-columns:20px 1fr;

    gap:12px;

    margin-top:26px;

    align-items:start;

}

.contact-consent input{

    width:18px;

    height:18px;

    margin-top:2px;

    accent-color:var(--color-primary);

}

.contact-consent label{

    color:#667085;

    font-size:13px;

    line-height:1.7;

}

.contact-consent a{

    color:#17263F;

    font-weight:750;

    text-decoration:underline;

    text-decoration-color:rgba(202,157,33,.55);

    text-underline-offset:3px;

}

.contact-consent a:hover{

    color:var(--color-primary);

}

.contact-submit{

    margin-top:30px;

    border:0;

    cursor:pointer;

}

.contact-form-note{

    margin:18px 0 0;

    color:#858C98;

    font-size:12px;

    line-height:1.5;

}


/* ==================================================
   UBICACIÓN
================================================== */

.contact-location{

    padding:110px 40px;

    background:#FAF7F1;

}

.contact-location-container{

    max-width:1360px;

    margin:0 auto;

    display:grid;

    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);

    gap:80px;

    align-items:center;

}

.contact-location-content .section-label{

    margin-bottom:22px;

}

.contact-location-content h2{

    max-width:650px;

    margin:0 0 28px;

    color:#17263F;

    font-size:56px;

    line-height:1.08;

    letter-spacing:-2px;

}

.contact-location-content > p{

    max-width:620px;

    margin:0 0 20px;

    color:#667085;

    font-size:18px;

    line-height:1.85;

}

.contact-location-details{

    display:grid;

    gap:18px;

    margin:38px 0;

    padding:30px 0;

    border-top:1px solid #DDD3C1;

    border-bottom:1px solid #DDD3C1;

}

.contact-location-detail{

    display:grid;

    grid-template-columns:42px 1fr;

    gap:15px;

    align-items:center;

}

.contact-location-detail > i{

    width:42px;

    height:42px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:13px;

    background:#FFFFFF;

    color:var(--color-primary);

    font-size:16px;

    box-shadow:0 8px 24px rgba(23,38,63,.05);

}

.contact-location-detail div{

    display:flex;

    flex-direction:column;

    gap:3px;

}

.contact-location-detail span{

    color:#858C98;

    font-size:12px;

    font-weight:750;

    letter-spacing:.7px;

    text-transform:uppercase;

}

.contact-location-detail strong{

    color:#17263F;

    font-size:16px;

    font-weight:750;

}

.contact-location-map{

    min-height:590px;

    overflow:hidden;

    border:1px solid #DDD3C1;

    border-radius:30px;

    background:#FFFFFF;

    box-shadow:0 24px 65px rgba(23,38,63,.08);

}

.contact-location-map iframe{

    display:block;

    width:100%;

    height:590px;

    border:0;

}


/* ==================================================
   FAQ
================================================== */

.service-faq{

    padding:105px 40px 115px;

    background:#FFFFFF;

}

.service-faq-header{

    max-width:920px;

    margin:0 auto 60px;

    text-align:center;

}

.service-faq-header .section-label{

    margin-bottom:20px;

}

.service-faq-header h2{

    max-width:900px;

    margin:0 auto 24px;

    color:#17263F;

    font-size:54px;

    line-height:1.1;

    letter-spacing:-2px;

}

.service-faq-header p{

    max-width:750px;

    margin:0 auto;

    color:#667085;

    font-size:18px;

    line-height:1.8;

}

.faq-list{

    max-width:1180px;

    margin:0 auto;

    border-top:1px solid var(--color-border);

}

.faq-item{

    display:grid;

    grid-template-columns:minmax(330px,.95fr) minmax(0,1.05fr);

    gap:72px;

    padding:38px 0;

    border-bottom:1px solid var(--color-border);

}

.faq-item h3{

    margin:0;

    color:#17263F;

    font-family:"Cormorant Garamond",serif;

    font-size:36px;

    line-height:1.17;

    font-weight:650;

}

.faq-item p{

    margin:0;

    color:#667085;

    font-size:17px;

    line-height:1.8;

}


/* ==================================================
   TABLET
================================================== */

@media(max-width:1150px){

    .contact-methods-grid{

        grid-template-columns:repeat(2,minmax(0,1fr));

    }

}

@media(max-width:1100px){

    .contact-form-container,
    .contact-location-container{

        grid-template-columns:1fr;

        gap:58px;

    }

    .contact-form-content{

        position:relative;

        top:auto;

    }

    .contact-location-map{

        max-width:900px;

    }

    .faq-item{

        grid-template-columns:1fr;

        gap:18px;

    }

}


/* ==================================================
   MÓVIL
================================================== */

@media(max-width:768px){

    .contact-methods,
    .contact-form-section,
    .contact-location,
    .service-faq{

        padding-left:24px;

        padding-right:24px;

    }


    /* MÉTODOS */

    .contact-methods{

        padding-top:85px;

        padding-bottom:85px;

    }

    .contact-methods-header{

        margin-bottom:46px;

    }

    .contact-methods-header h2{

        font-size:39px;

        letter-spacing:-1.5px;

    }

    .contact-methods-header p{

        font-size:17px;

    }

    .contact-methods-grid{

        grid-template-columns:1fr;

        gap:18px;

    }

    .contact-method-card{

        min-height:auto;

        padding:34px 27px;

        border-radius:22px;

    }

    .contact-method-card h3{

        font-size:31px;

    }


    /* FORMULARIO */

    .contact-form-section{

        padding-top:85px;

        padding-bottom:85px;

    }

    .contact-form-container{

        gap:45px;

    }

    .contact-form-content h2{

        font-size:40px;

        letter-spacing:-1.5px;

    }

    .contact-form-content > p{

        font-size:17px;

    }

    .contact-form-wrapper{

        padding:32px 24px;

        border-radius:22px;

    }

    .contact-form-grid{

        grid-template-columns:1fr;

        gap:20px;

    }

    .contact-field-full{

        grid-column:auto;

    }

    .contact-field input,
    .contact-field select,
    .contact-field textarea{

        font-size:16px;

    }

    .contact-submit{

        width:100%;

    }


    /* UBICACIÓN */

    .contact-location{

        padding-top:85px;

        padding-bottom:85px;

    }

    .contact-location-container{

        gap:45px;

    }

    .contact-location-content h2{

        font-size:40px;

        letter-spacing:-1.5px;

    }

    .contact-location-content > p{

        font-size:17px;

    }

    .contact-location-map{

        min-height:420px;

        border-radius:22px;

    }

    .contact-location-map iframe{

        height:420px;

    }


    /* FAQ */

    .service-faq{

        padding-top:85px;

        padding-bottom:95px;

    }

    .service-faq-header{

        margin-bottom:45px;

    }

    .service-faq-header h2{

        font-size:39px;

        letter-spacing:-1.5px;

    }

    .service-faq-header p{

        font-size:17px;

    }

    .faq-item{

        padding:31px 0;

    }

    .faq-item h3{

        font-size:30px;

    }

    .faq-item p{

        font-size:16px;

    }

}
/* ==================================================
   ANTISPAM
================================================== */

.contact-honeypot{

    position:absolute !important;

    left:-9999px !important;

    width:1px !important;

    height:1px !important;

    overflow:hidden !important;

}
/* ==================================================
   MENSAJES DEL FORMULARIO
================================================== */

.contact-form-alert{

    display:grid;

    grid-template-columns:42px 1fr;

    gap:16px;

    align-items:start;

    margin-bottom:30px;

    padding:22px 24px;

    border-radius:18px;

}

.contact-form-alert > i{

    width:42px;

    height:42px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    font-size:18px;

}

.contact-form-alert strong{

    display:block;

    margin-bottom:6px;

    color:#17263F;

    font-size:16px;

    line-height:1.4;

}

.contact-form-alert p{

    margin:0;

    font-size:14px;

    line-height:1.7;

}


/* ÉXITO */

.contact-form-alert-success{

    background:#F3F8F3;

    border:1px solid #CFE2D1;

}

.contact-form-alert-success > i{

    background:#E1F0E3;

    color:#397547;

}

.contact-form-alert-success p{

    color:#58705E;

}


/* ERROR */

.contact-form-alert-error{

    background:#FFF5F3;

    border:1px solid #E9CEC8;

}

.contact-form-alert-error > i{

    background:#F6E2DE;

    color:#A34D40;

}

.contact-form-alert-error p{

    color:#795D58;

}


/* MÓVIL */

@media(max-width:768px){

    .contact-form-alert{

        grid-template-columns:36px 1fr;

        gap:13px;

        padding:19px;

    }

    .contact-form-alert > i{

        width:36px;

        height:36px;

        font-size:16px;

    }

}
/* ==================================================
   CONTACTO
   CTA DIRECTO FINAL
================================================== */

.contact-direct-cta {
    padding: 110px 40px 120px;
    background: #fff;
}

.contact-direct-cta-inner {
    max-width: 1180px;
    margin: 0 auto;
    padding: 80px 90px;
    text-align: center;

    background: #f8f5ee;
    border: 1px solid #e7dcc5;
    border-radius: 28px;

    box-shadow:
        0 25px 60px rgba(23, 23, 23, 0.06);
}


/* Label */

.contact-direct-cta .section-label {
    display: block;
    margin-bottom: 22px;

    font-family: "Manrope", sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.22em;
    text-transform: uppercase;

    color: #CA9D21;
}


/* Título */

.contact-direct-cta h2 {
    max-width: 850px;
    margin: 0 auto 24px;

    font-family: "Manrope", sans-serif;
    font-size: clamp(38px, 4vw, 56px);
    font-weight: 700;
    line-height: 1.08;
    letter-spacing: -0.04em;

    color: #17243d;
}


/* Texto */

.contact-direct-cta-inner > p {
    max-width: 760px;
    margin: 0 auto;

    font-family: "Manrope", sans-serif;
    font-size: 17px;
    line-height: 1.8;

    color: #748096;
}


/* Botones */

.contact-direct-cta-actions {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;

    margin-top: 36px;
}

.contact-direct-cta-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    min-height: 54px;
    padding: 0 26px;

    border-radius: 14px;

    font-family: "Manrope", sans-serif;
    font-size: 14px;
    font-weight: 700;

    text-decoration: none;

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        background 0.25s ease;
}


/* Teléfono */

.contact-direct-cta-actions .btn-primary {
    color: #fff;
    background: #CA9D21;

    box-shadow:
        0 12px 28px rgba(202, 157, 33, 0.20);
}

.contact-direct-cta-actions .btn-primary:hover {
    transform: translateY(-2px);

    box-shadow:
        0 16px 34px rgba(202, 157, 33, 0.28);
}


/* WhatsApp */

.contact-direct-cta-actions .btn-secondary {
    color: #17243d;
    background: #fff;
    border: 1px solid #e8e1d5;

    box-shadow:
        0 10px 24px rgba(23, 23, 23, 0.05);
}

.contact-direct-cta-actions .btn-secondary:hover {
    transform: translateY(-2px);

    box-shadow:
        0 14px 30px rgba(23, 23, 23, 0.08);
}


/* Confianza */

.contact-direct-cta-trust {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px 28px;

    margin-top: 34px;
    padding-top: 28px;

    border-top: 1px solid rgba(202, 157, 33, 0.18);
}

.contact-direct-cta-trust span {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    font-family: "Manrope", sans-serif;
    font-size: 13px;
    font-weight: 600;

    color: #748096;
}

.contact-direct-cta-trust i {
    font-size: 11px;
    color: #CA9D21;
}


/* ==================================================
   RESPONSIVE
================================================== */

@media (max-width: 900px) {

    .contact-direct-cta {
        padding: 80px 24px 90px;
    }

    .contact-direct-cta-inner {
        padding: 60px 40px;
    }

    .contact-direct-cta h2 {
        font-size: clamp(34px, 7vw, 46px);
    }
}


@media (max-width: 600px) {

    .contact-direct-cta {
        padding: 60px 18px 70px;
    }

    .contact-direct-cta-inner {
        padding: 48px 24px;
        border-radius: 22px;
    }

    .contact-direct-cta h2 {
        font-size: 32px;
        line-height: 1.12;
    }

    .contact-direct-cta-inner > p {
        font-size: 15px;
        line-height: 1.7;
    }

    .contact-direct-cta-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .contact-direct-cta-actions a {
        width: 100%;
    }

    .contact-direct-cta-trust {
        flex-direction: column;
        gap: 12px;
    }
}
/* ==================================================
   CONTACTO · TARJETA UBICACIÓN SIN GOOGLE MAPS
================================================== */

.contact-map-private {
    min-height: 520px;
    padding: 60px;

    display: flex;
    align-items: center;
    justify-content: center;

    background:
        radial-gradient(
            circle at 85% 15%,
            rgba(202,157,33,.10),
            transparent 32%
        ),
        #ffffff;

    border: 1px solid #E5DDCF;
    border-radius: 30px;
    overflow: hidden;
}

.contact-map-content {
    width: 100%;
    max-width: 470px;
}

.contact-map-icon {
    width: 64px;
    height: 64px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 32px;

    background: #F7F3E8;
    border: 1px solid rgba(202,157,33,.22);
    border-radius: 18px;

    color: #CA9D21;
    font-size: 24px;
}

.contact-map-content .section-label {
    display: block;
    margin-bottom: 18px;

    color: #CA9D21;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2.6px;
    text-transform: uppercase;
}

.contact-map-content h3 {
    margin: 0 0 22px;

    color: #17263F;
    font-family: "Manrope", sans-serif;
    font-size: 36px;
    line-height: 1.15;
    letter-spacing: -1.3px;
    font-weight: 700;
}

.contact-map-content p {
    margin: 0 0 34px;

    color: #667085;
    font-size: 17px;
    line-height: 1.8;
}

.contact-map-content .btn-principal {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 17px 28px;
}


/* ==================================================
   RESPONSIVE
================================================== */

@media (max-width: 768px) {

    .contact-map-private {
        min-height: auto;
        padding: 42px 28px;
        border-radius: 24px;
    }

    .contact-map-content h3 {
        font-size: 30px;
    }

}

@media (max-width: 480px) {

    .contact-map-private {
        padding: 34px 22px;
    }

    .contact-map-icon {
        width: 56px;
        height: 56px;
        margin-bottom: 26px;
    }

    .contact-map-content h3 {
        font-size: 27px;
    }

    .contact-map-content .btn-principal {
        width: 100%;
        text-align: center;
    }

}