/* ===========================================
   CARIAS ASOCIADOS
   Estilos Generales
=========================================== */

:root{
    --primary:#233B57;
    --secondary:#6B6B6B;
    --accent:#B89A5A;
    --light:#F7F3EB;
    --white:#FFFFFF;
    --text:#2E2E2E;
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    background:var(--light);
    color:var(--text);
}

/*===========================================
                NAVBAR
===========================================*/

.navbar{
    background:#F7F3EB;
    box-shadow:0 2px 15px rgba(0,0,0,.05);
}

.logo-text{
    font-family: 'Cormorant Garamond', serif !important;
    font-size: 2.2rem !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: #233B57 !important;
    text-decoration: none !important;
    display: inline-block;
}

.logo-text span{
    color:#B89A5A !important;
}

.logo-text:hover{
    text-decoration:none;
}

.navbar-nav .nav-link{
    color:var(--primary);
    font-weight:500;
    margin-left:25px;
    transition:.3s;
}

.navbar-nav .nav-link:hover{
    color:var(--accent);
}

/*===========================================
                HERO
===========================================*/

#inicio{

    min-height:90vh;

    display:flex;

    align-items:center;

    background:linear-gradient(
        135deg,
        #F7F3EB 0%,
        #EEE6D9 100%
    );

    padding:80px 0;
}

.verse-reference{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:.9rem;
    color:#233B57;
    letter-spacing:2px;
    text-transform:uppercase;
    font-weight:600;
    margin-bottom:18px;
}

.verse-reference::before{
    content:"";
    width:40px;
    height:2px;
    background:#B89A5A;
}

#inicio h1{

    font-family:'Cormorant Garamond',serif;

    font-size:3.5rem;

    font-weight:700;

    margin-bottom:25px;

    line-height:1.15;
}

#inicio p{

    font-size:1.1rem;

    color:var(--secondary);

    margin-bottom:35px;
}

.hero-logo{

    max-width:420px;

    width:100%;
}

.btn-dark{

    background:var(--primary);

    color:#fff;

    border:none;

    padding:14px 35px;

    border-radius:50px;

    box-shadow:0 8px 20px rgba(35,59,87,.20);

    transition:.3s;
}

.btn-dark:hover{

    background:var(--accent);

    color:#fff;

    transform:translateY(-3px);

    box-shadow:0 12px 30px rgba(184,154,90,.30);
}

/*===========================================
            SECCIONES
===========================================*/

section{

    padding:90px 0;
}

h2{

    font-family:'Cormorant Garamond',serif;

    font-size:3rem;

    margin-bottom:15px;
}

/*===========================================
            SERVICIOS
===========================================*/

.service-card{

    background:#FCFAF6;

    border-radius:18px;

    padding:35px 25px;

    text-align:center;

    margin-top:30px;

    transition:.35s;

    box-shadow:0 5px 20px rgba(0,0,0,.06);
}

.service-card i{

    font-size:3rem;

    color:var(--accent);

    margin-bottom:20px;

    display:block;
}

.service-card:hover{

    transform:translateY(-10px);

    box-shadow:0 15px 35px rgba(0,0,0,.12);
}

/*===========================================
            CONTACTO
===========================================*/

#contacto i{
    color: var(--accent);
    margin-right: 10px;
    font-size: 1.1rem;
}

.bi-whatsapp{
    color:#25D366 !important;
    font-size:1.2rem;
}

/*===========================================
                FOOTER
===========================================*/

footer{
    background:#233B57;
    color:#ffffff;
    text-align:center;
    padding:40px 0;
    border-top:3px solid #B89A5A;
}

footer p{
    margin:0;
    font-size:.95rem;
    letter-spacing:.5px;
}

footer a{
    color:#B89A5A;
    text-decoration:none;
    transition:.3s;
}

footer a:hover{
    color:#ffffff;
}

.verse-reference-footer{
    margin-top:20px;
    padding-top:12px;
    border-top:1px solid rgba(184,154,90,.4);
    font-size:.75rem;
    color:#233B57;
    line-height:1.6;
    font-style:italic;
    opacity:.9;
    max-width:420px;
}

.verse-reference-footer span{
    display:block;
    margin-top:8px;
    font-style:normal;
    font-weight:600;
    color:#B89A5A;
}
/*===========================================
            RESPONSIVE
===========================================*/

@media(max-width:992px){

    .navbar-brand img{

        height:60px;
    }

    #inicio{

        text-align:center;
    }

    #inicio h1{

        font-size:2.7rem;
    }

    #inicio img{

        margin-top:50px;

        max-width:320px;
    }

}

@media(max-width:768px){

    section{

        padding:70px 0;
    }

    h2{

        font-size:2.3rem;
    }

    #inicio h1{

        font-size:2.2rem;
    }

    #inicio p{

        font-size:1rem;
    }

    .navbar-nav{

        text-align:center;

        margin-top:20px;
    }

    .navbar-nav .nav-link{

        margin:10px 0;
    }

}

@media(max-width:576px){

    .navbar-brand img{

        height:50px;
    }

    #inicio{

        min-height:auto;

        padding:60px 0;
    }

    #inicio h1{

        font-size:1.9rem;
    }

    .btn-dark{

        width:100%;
    }

}