/* ========================================
FINANCIAMIENTO PAGE
======================================== */

#financiamiento-page{

    width:100%;

    overflow:hidden;

    background:#f7f7f7;
}

/* ========================================
HERO FINANCIAMIENTO
======================================== */

.hero-financiamiento{

    position:relative;

    width:100%;
    min-height:100vh;

    display:flex;

    align-items:center;

    padding:
    120px
    7%
    90px;

    background:
    url('../img/financiamientoportada.jpg')
    center/cover;

    overflow:hidden;
}

/* OVERLAY */

.finance-hero-overlay{

    position:absolute;

    inset:0;

    background:
    linear-gradient(
    to right,
    rgba(0,0,0,.78),
    rgba(0,0,0,.25));
}

/* CONTENT */

.finance-hero-content{

    position:relative;

    z-index:2;

    max-width:760px;
}

/* TAG */

.finance-tag{

    display:inline-block;

    font-size:15px;

    font-weight:800;

    letter-spacing:4px;

    color:#fff;

    margin-bottom:28px;
}

/* TITLE */

.finance-hero-content h1{

    font-size:62px;

    line-height:.95;

    color:#fff;

    font-weight:900;

    margin-bottom:35px;
}

/* TEXT */

.finance-hero-content p{

    font-size:19px;

    line-height:1.8;

    color:rgba(255,255,255,.82);

    margin-bottom:45px;

    max-width:650px;
}

/* BUTTONS */

.finance-buttons{

    display:flex;

    gap:18px;

    flex-wrap:wrap;
}

/* BTN */

.finance-main-btn,
.finance-second-btn{

    height:64px;

    padding:
    0
    34px;

    border-radius:999px;

    display:flex;

    align-items:center;

    justify-content:center;

    text-decoration:none;

    font-size:16px;

    font-weight:700;

    transition:.3s;
}

/* MAIN */

.finance-main-btn{

    background:#f15a24;

    color:#fff;
}

.finance-main-btn:hover{

    background:#d94a17;

    transform:translateY(-3px);
}

/* SECOND */

.finance-second-btn{

    border:
    1px solid rgba(255,255,255,.25);

    color:#fff;
}

.finance-second-btn:hover{

    background:#fff;

    color:#111;
}

/* ========================================
PLANES
======================================== */

.financiamiento-planes{

    position:relative;

    padding:
    140px
    7%;

    overflow:hidden;
}

/* BG */

.finance-bg-shape{

    position:absolute;

    top:-200px;
    right:-200px;

    width:500px;
    height:500px;

    border-radius:50%;

    background:
    rgba(24,122,67,.05);

    filter:blur(50px);
}

/* TITLE */

.finance-title{

    text-align:center;

    max-width:850px;

    margin:
    auto
    auto
    70px;
}

/* TAG */

.finance-title span{

    display:inline-block;

    font-size:14px;

    font-weight:800;

    letter-spacing:4px;

    color:#187a43;

    margin-bottom:22px;
}

/* TITLE */

.finance-title h2{

    font-size:68px;

    line-height:1;

    font-weight:900;

    color:#101010;

    margin-bottom:25px;
}

/* TEXT */

.finance-title p{

    font-size:21px;

    line-height:1.8;

    color:#666;
}

/* ========================================
GRID
======================================== */

.finance-grid{

    display:grid;

    grid-template-columns:
    repeat(3,1fr);

    gap:30px;

    margin-bottom:120px;
}

/* ========================================
CARD
======================================== */

.finance-card{

    background:#fff;

    border-radius:32px;

    padding:
    46px
    34px;

    text-align:center;

    border:
    1px solid rgba(0,0,0,.05);

    transition:.4s ease;

    box-shadow:
    0 15px 45px rgba(0,0,0,.05);
}

/* HOVER */

.finance-card:hover{

    transform:
    translateY(-6px);
}

/* ACTIVE */

.finance-card.active{

    background:#187a43;
}

/* ICON */

.finance-icon{

    width:95px;
    height:95px;

    border-radius:50%;

    background:#f5f5f5;

    display:flex;

    align-items:center;

    justify-content:center;

    margin:
    auto
    auto
    30px;

    font-size:34px;

    color:#187a43;
}

/* ACTIVE */

.finance-card.active .finance-icon{

    background:#fff;
}

/* TITLE */

.finance-card h3{

    font-size:28px;

    line-height:1.4;

    color:#111;

    font-weight:800;
}

/* ACTIVE */

.finance-card.active h3{

    color:#fff;
}

/* ========================================
SECOND TITLE
======================================== */

.second-title{

    margin-top:40px;
}

/* ========================================
ASESORIA
======================================== */

.asesoria-section{

    position:relative;

    padding:
    140px
    7%;

    overflow:hidden;

    background:#07110C;
}

/* BG */

.asesoria-bg{

    position:absolute;

    inset:0;

    background:
    radial-gradient(
    circle at center,
    rgba(24,122,67,.22),
    transparent 70%);
}

/* CONTAINER */

.asesoria-container{

    position:relative;

    z-index:2;

    display:grid;

    grid-template-columns:
    1fr
    1fr;

    align-items:center;

    gap:80px;
}

/* CONTENT */

.asesoria-content span{

    display:inline-block;

    font-size:14px;

    font-weight:800;

    letter-spacing:4px;

    color:#43c06b;

    margin-bottom:24px;
}

.asesoria-content h2{

    font-size:62px;

    line-height:1;

    color:#fff;

    font-weight:900;

    margin-bottom:30px;
}

.asesoria-content p{

    font-size:21px;

    line-height:1.9;

    color:rgba(255,255,255,.75);

    margin-bottom:45px;
}

/* BUTTONS */

.asesoria-buttons{

    display:flex;

    gap:18px;

    flex-wrap:wrap;
}

/* BTN */

.asesoria-btn,
.asesoria-btn-outline{

    height:64px;

    padding:
    0
    34px;

    border-radius:999px;

    display:flex;

    align-items:center;

    justify-content:center;

    text-decoration:none;

    font-weight:700;

    transition:.3s;
}

/* MAIN */

.asesoria-btn{

    background:#f15a24;

    color:#fff;
}

/* OUTLINE */

.asesoria-btn-outline{

    border:
    1px solid rgba(255,255,255,.18);

    color:#fff;
}

/* IMAGE */

.asesoria-image{

    position:relative;

    display:flex;

    justify-content:center;
}

/* IMG */

.asesoria-image img{

    width:100%;

    max-width:620px;

    position:relative;

    z-index:2;
}

/* GLOW */

.asesoria-glow{

    position:absolute;

    width:350px;
    height:350px;

    border-radius:50%;

    background:
    rgba(24,122,67,.35);

    filter:blur(80px);

    bottom:0;

    z-index:1;
}

/* ========================================
RESPONSIVE
======================================== */

@media(max-width:1100px){

    .finance-grid{

        grid-template-columns:1fr;
    }

    .asesoria-container{

        grid-template-columns:1fr;

        gap:60px;
    }

    .finance-hero-content h1{

        font-size:68px;
    }

    .finance-title h2{

        font-size:52px;
    }

    .asesoria-content h2{

        font-size:52px;
    }
}

/* MOBILE */

@media(max-width:768px){

    .hero-financiamiento{

        min-height:auto;

        padding:
        140px
        20px
        90px;
    }

    .finance-hero-content h1{

        font-size:46px;

        line-height:1;
    }

    .finance-hero-content p{

        font-size:17px;
    }

    .finance-buttons{

        flex-direction:column;
    }

    .finance-main-btn,
    .finance-second-btn{

        width:100%;
    }

    .financiamiento-planes{

        padding:
        90px
        20px;
    }

    .finance-title h2{

        font-size:40px;
    }

    .finance-title p{

        font-size:17px;
    }

    .finance-card{

        padding:
        40px
        25px;
    }

    .finance-card h3{

        font-size:19px;
    }

    .asesoria-section{

        padding:
        90px
        20px;
    }

    .asesoria-content h2{

        font-size:42px;
    }

    .asesoria-content p{

        font-size:17px;
    }

    .asesoria-buttons{

        flex-direction:column;
    }

    .asesoria-btn,
    .asesoria-btn-outline{

        width:100%;
    }

}

/* ========================================
LARGE DESKTOP
======================================== */

@media(max-width:1600px){

.finance-hero-content h1{

    font-size:78px;
}

.finance-title h2{

    font-size:62px;
}

.asesoria-content h2{

    font-size:64px;
}

}

/* ========================================
LAPTOP
======================================== */

@media(max-width:1400px){

.hero-financiamiento{

    padding:
    120px
    6%
    90px;
}

.finance-hero-content{

    max-width:680px;
}

.finance-hero-content h1{

    font-size:66px;

    line-height:.95;
}

.finance-hero-content p{

    font-size:19px;

    max-width:580px;
}

.finance-title{

    margin-bottom:60px;
}

.finance-title h2{

    font-size:56px;
}

.finance-title p{

    font-size:19px;
}

.finance-grid{

    gap:24px;
}

.finance-card{

    padding:
    46px
    34px;
}

.finance-card h3{

    font-size:24px;
}

.asesoria-content h2{

    font-size:58px;
}

.asesoria-content p{

    font-size:19px;
}

}

/* ========================================
TABLET
======================================== */

@media(max-width:992px){

.hero-financiamiento{

    min-height:auto;

    padding:
    140px
    40px
    90px;
}

.finance-hero-content{

    max-width:100%;
}

.finance-hero-content h1{

    font-size:54px;

    line-height:1;
}

.finance-hero-content p{

    font-size:18px;

    max-width:520px;
}

.finance-buttons{

    gap:14px;
}

.finance-main-btn,
.finance-second-btn{

    height:58px;

    padding:
    0
    28px;
}

.financiamiento-planes{

    padding:
    100px
    40px;
}

.finance-title h2{

    font-size:48px;
}

.finance-grid{

    grid-template-columns:1fr;

    gap:22px;
}

.finance-card{

    padding:
    42px
    30px;
}

.asesoria-section{

    padding:
    100px
    40px;
}

.asesoria-container{

    grid-template-columns:1fr;

    gap:60px;
}

.asesoria-content h2{

    font-size:48px;
}

}

/* ========================================
MOBILE
======================================== */

@media(max-width:768px){

.hero-financiamiento{

    padding:
    130px
    24px
    80px;
}

.finance-tag{

    font-size:12px;

    letter-spacing:2px;

    margin-bottom:18px;
}

.finance-hero-content h1{

    font-size:40px;

    line-height:1.02;

    letter-spacing:-1px;

    margin-bottom:24px;
}

.finance-hero-content p{

    font-size:16px;

    line-height:1.7;

    margin-bottom:30px;
}

.finance-buttons{

    flex-direction:column;

    gap:12px;
}

.finance-main-btn,
.finance-second-btn{

    width:100%;

    height:54px;

    font-size:14px;
}

.financiamiento-planes{

    padding:
    80px
    24px;
}

.finance-title{

    margin-bottom:40px;
}

.finance-title h2{

    font-size:38px;

    line-height:1.05;
}

.finance-title p{

    font-size:16px;
}

.finance-card{

    border-radius:24px;

    padding:
    34px
    24px;
}

.finance-icon{

    width:78px;
    height:78px;

    font-size:28px;

    margin-bottom:24px;
}

.finance-card h3{

    font-size:22px;
}

.asesoria-section{

    padding:
    80px
    24px;
}

.asesoria-content h2{

    font-size:38px;

    line-height:1.05;
}

.asesoria-content p{

    font-size:16px;

    line-height:1.7;
}

.asesoria-buttons{

    flex-direction:column;

    gap:12px;
}

.asesoria-btn,
.asesoria-btn-outline{

    width:100%;

    height:54px;
}

}

/* ========================================
SMALL MOBILE
======================================== */

@media(max-width:480px){

.finance-hero-content h1{

    font-size:34px;
}

.finance-title h2{

    font-size:32px;
}

.asesoria-content h2{

    font-size:32px;
}

}

