/*==================================================
    LEGALDESK.CSS
    Proyecto: QPERTINO
==================================================*/

/*==================================
BANNER
==================================*/

/* Corregido: fondo oscuro en lugar de #F8F8F8 */
.contact-page{

    background: var(--primary, #0A0A0C);

}

.contact-banner{

    position:relative;

    padding:180px 0 120px;

    background:var(--bg-section);

    overflow:hidden;

}

.contact-banner::before{

    content:"";

    position:absolute;

    inset:0;

    background:

    radial-gradient(circle at top right,
    rgba(200,167,78,.10),
    transparent 35%),

    radial-gradient(circle at bottom left,
    rgba(255,255,255,.04),
    transparent 40%);

}

.contact-banner .container{

    position:relative;

    z-index:2;

}

.contact-banner h1{

    color:var(--heading);

    font-size:64px;

    font-family:"Cormorant Garamond", serif;

    margin-bottom:20px;

}

.contact-banner p{

    max-width:700px;

    color:var(--text);

    font-size:18px;

    line-height:1.9;

}

/*==================================
SECCIÓN PRINCIPAL — Corregido: fondo oscuro
==================================*/

.contact-section{

    padding:110px 0;

    /* Corregido: fondo oscuro en lugar de #FFFFFF */
    background: var(--primary, #0A0A0C);

}

/*==================================
INFORMACIÓN
==================================*/

.contact-info{

    background:var(--bg-soft);

    color:var(--heading);

    border-radius:20px;

    padding:60px;

    height:100%;

    box-shadow:0 20px 50px rgba(0,0,0,.25);

}

.contact-info h2{

    font-size:38px;

    font-family:"Cormorant Garamond", serif;

    color:#C8A74E;

    margin-bottom:20px;

}

.contact-info p{

    color:var(--text);

    line-height:1.9;

    margin-bottom:35px;

}

.contact-item{

    display:flex;

    gap:18px;

    align-items:flex-start;

    margin-bottom:30px;

}

.contact-icon{

    width:60px;

    height:60px;

    border-radius:50%;

    background:#C8A74E;

    color:#111111;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:20px;

    flex-shrink:0;

}

.contact-content h3{

    color:var(--heading);

    margin-bottom:8px;

    font-size:18px;

}

.contact-content span,

.contact-content a{

    color:var(--text-light);

    text-decoration:none;

    line-height:1.8;

    transition:.35s;

}

.contact-content a:hover{

    color:#C8A74E;

}

/*==================================
REDES
==================================*/

.contact-social{

    display:flex;

    gap:15px;

    margin-top:35px;

}

.contact-social a{

    width:48px;

    height:48px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:50%;

    background:#1E1E1E;

    color:var(--heading);

    text-decoration:none;

    transition:.35s;

}

.contact-social a:hover{

    background:#C8A74E;

    color:#111111;

    transform:translateY(-5px);

}

/*==================================
FORMULARIO — Corregido: fondo oscuro
==================================*/

.contact-form{

    /* Corregido: fondo oscuro en lugar de #FFFFFF */
    background: var(--surface, #121318);

    border-radius:20px;

    padding:50px;

    /* Corregido: borde sutil oscuro */
    border:1px solid rgba(255,255,255,0.08);

    box-shadow:0 20px 50px rgba(0,0,0,.25);

}

/* Corregido: título del formulario en color claro */
.contact-form h2{

    font-size:38px;

    color: var(--heading, #FFFFFF);

    font-family:"Cormorant Garamond", serif;

    margin-bottom:15px;

}

/* Corregido: párrafo del formulario en color claro */
.contact-form p{

    color: var(--text-light, #A0AEC0);

    margin-bottom:35px;

    line-height:1.8;

}

/*==================================
MAPA
==================================*/

.contact-map{

    margin-top:100px;

    border-radius:20px;

    overflow:hidden;

    box-shadow:0 15px 45px rgba(0,0,0,.25);

}

.contact-map iframe{

    width:100%;

    height:500px;

    border:0;

}

/*==================================
HORARIOS — Corregido: fondo oscuro
==================================*/

.business-hours{

    margin-top:40px;

    /* Corregido: fondo oscuro en lugar de #F6F6F6 */
    background: var(--surface-light, #1A1C23);

    padding:30px;

    border-radius:15px;

    border:1px solid rgba(255,255,255,0.07);

}

/* Corregido: título en color claro */
.business-hours h3{

    color: var(--heading, #FFFFFF);

    margin-bottom:20px;

}

.business-hours ul{

    list-style:none;

}

/* Corregido: items de horario en color claro */
.business-hours li{

    display:flex;

    justify-content:space-between;

    padding:12px 0;

    /* Corregido: borde sutil oscuro */
    border-bottom:1px solid rgba(255,255,255,0.08);

    color: var(--text-light, #A0AEC0);

}

.business-hours li:last-child{

    border:none;

}

/*==================================
FAQ — Corregido: fondo oscuro
==================================*/

.contact-faq{

    margin-top:90px;

}

/* Corregido: título FAQ en color claro */
.contact-faq h2{

    text-align:center;

    margin-bottom:50px;

    font-size:42px;

    color: var(--heading, #FFFFFF);

    font-family:"Cormorant Garamond", serif;

}

/* Corregido: fondo oscuro para items FAQ */
.faq-item{

    background: var(--surface, #121318);

    border:1px solid rgba(255,255,255,0.08);

    border-radius:12px;

    margin-bottom:20px;

    overflow:hidden;

}

/* Corregido: pregunta FAQ en color claro */
.faq-question{

    padding:22px 30px;

    cursor:pointer;

    font-weight:600;

    color: var(--heading, #FFFFFF);

}

/* Corregido: respuesta FAQ en color claro */
.faq-answer{

    padding:0 30px 25px;

    color: var(--text-light, #A0AEC0);

    line-height:1.8;

}

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

@media(max-width:992px){

.contact-banner{

    padding:150px 0 90px;

}

.contact-banner h1{

    font-size:50px;

}

.contact-form{

    margin-top:40px;

}

.contact-map{

    margin-top:70px;

}

}

@media(max-width:768px){

.contact-banner{

    padding:130px 0 70px;

}

.contact-banner h1{

    font-size:38px;

}

.contact-banner p{

    font-size:16px;

}

.contact-info{

    padding:30px;

}

.contact-form{

    padding:30px;

}

.contact-info h2,

.contact-form h2{

    font-size:30px;

}

.contact-map iframe{

    height:350px;

}

.business-hours li{

    flex-direction:column;

    gap:5px;

}

.contact-social{

    flex-wrap:wrap;

}

}

/*==================================
LEGALDESK LOGO / IMAGEN
==================================*/

.legaldesk-image{
    display:flex;
    justify-content:center;
    align-items:center;
    width:100%;
    min-height:400px;
}

.legaldesk-logo{
    text-align:center;
}

.legaldesk-logo .dot{
    display:block;
    width:14px;
    height:14px;
    margin:0 auto 20px;
    border-radius:50%;
    background:#C9A227;
}

.legaldesk-logo h2{
    display:flex;
    flex-direction:column;
    margin:0;
    font-size:4.5rem;
    font-weight:800;
    line-height:.9;
    letter-spacing:-2px;
    text-transform:uppercase;
}

/* Corregido: primera línea del logo en color claro en lugar de #0D1B2A */
.legaldesk-logo h2 span:first-child{
    color: var(--heading, #FFFFFF);
}

.legaldesk-logo h2 span:last-child{
    color:#C9A227;
}

/* Corregido: párrafo del logo en color claro en lugar de #6b7280 */
.legaldesk-logo p{
    margin-top:20px;
    font-size:1rem;
    letter-spacing:2px;
    text-transform:uppercase;
    color: var(--text-muted, #718096);
}