/* ==========================================================
   SOLUTIONS
========================================================== */

.solutions{

    padding:120px 0;

    background:var(--surface);

    position:relative;

    overflow:hidden;

}

.solutions::before{

    content:"";

    position:absolute;

    top:-250px;

    right:-250px;

    width:500px;

    height:500px;

    border-radius:50%;

    background:rgba(37,99,235,.05);

    filter:blur(90px);

}

.solutions::after{

    content:"";

    position:absolute;

    bottom:-250px;

    left:-250px;

    width:500px;

    height:500px;

    border-radius:50%;

    background:rgba(14,165,233,.05);

    filter:blur(90px);

}

/* ========================================= */

.section-title{

    max-width:760px;

    margin:0 auto 70px;

    text-align:center;

}

.section-title__badge{

    display:inline-flex;

    align-items:center;

    padding:10px 18px;

    border-radius:999px;

    background:rgba(37,99,235,.08);

    color:var(--primary);

    font-weight:600;

    margin-bottom:20px;

}

.section-title h2{

    font-size:clamp(2.4rem,5vw,3.4rem);

    margin-bottom:20px;

    line-height:1.2;

}

.section-title p{

    font-size:1.1rem;

    color:var(--text-light);

    line-height:1.8;

}

/* ========================================= */

.solutions__grid{

    display:grid;

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

    gap:35px;

}

/* ========================================= */

.solution-card{

    background:var(--background);

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

    border-radius:24px;

    overflow:hidden;

    transition:.35s ease;

    display:flex;

    flex-direction:column;

    position:relative;

    box-shadow:0 18px 40px rgba(15,23,42,.08);

}

.solution-card:hover{

    transform:translateY(-10px);

    box-shadow:0 30px 72px rgba(15,23,42,.16);

    border-color:rgba(37,99,235,.30);

}

/* ========================================= */

.solution-card__image{

    overflow:hidden;

    height:250px;

    background:#eef3f9;

}

html[data-theme="dark"] .solution-card__image{

    background:#0f172a;

}

.solution-card__image img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:.6s;

}

.solution-card__preview-image{

    display:block;

    width:100%;

    height:100%;

    object-fit:cover;

    object-position:top center;

    background:#eff4fb;

}

.solution-card__preview{height:250px;display:flex;flex-direction:column;justify-content:flex-end;padding:25px;color:#fff;position:relative;overflow:hidden;background:#102753}
.solution-card__preview:before{content:"";position:absolute;left:24px;right:24px;top:24px;height:148px;border-radius:14px 14px 0 0;background:linear-gradient(180deg,#fbfdff,#eaf2ff);box-shadow:0 0 0 6px #ffffff20,0 16px 28px #06163340}
.solution-card__preview:after{content:"";position:absolute;left:44px;right:44px;top:50px;height:8px;border-radius:4px;background:#2a7aeb;box-shadow:0 22px #d9e6fb,0 44px #d9e6fb,0 66px #b8d0f1,140px 92px 0 -2px #d9e6fb,210px 92px 0 -2px #d9e6fb}
.solution-card__preview span,.solution-card__preview i{position:relative;z-index:1}.solution-card__preview span{font-size:20px;font-weight:700}.solution-card__preview i{font-size:11px;font-style:normal;opacity:.8}.solution-card__preview--cont{background:linear-gradient(135deg,#0d57d8,#3c9aff)}.solution-card__preview--frota{background:linear-gradient(135deg,#e56600,#ffac26)}.solution-card__preview--market{background:linear-gradient(135deg,#4820bd,#8a4fea)}

.solution-card:hover .solution-card__image img{

    transform:scale(1.06);

}

/* ========================================= */

.solution-card__content{

    padding:28px 28px 30px;

    display:flex;

    flex-direction:column;

    flex:1;

}

.solution-card__content > p{

    color:var(--text-light);

    font-size:.97rem;

    line-height:1.72;

    margin:2px 0 22px;

}

.solution-card--featured{

    grid-column:1 / -1;

    display:grid;

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

    align-items:center;

    gap:26px;

    padding:26px;

}

.solution-card__featured-copy{

    display:flex;

    flex-direction:column;

    min-width:0;

}

.solution-card__brand--featured{

    margin-bottom:18px;

}

.solution-card--featured .solution-card__brand h3{

    font-size:1.2rem;

    margin-bottom:4px;

}

.solution-card--featured .solution-card__brand span{

    font-size:.84rem;

    letter-spacing:.02em;

}

.solution-card__featured-copy > p{

    color:var(--text-light);

    font-size:.93rem;

    line-height:1.68;

    margin:0 0 20px;

    max-width:460px;

}

.solution-card__featured-copy ul{

    margin-bottom:8px;

}

.solution-card__featured-visual{

    min-width:0;

}

.solution-card__featured-frame{

    border-radius:22px;

    overflow:hidden;

    border:1px solid rgba(18,32,71,.08);

    background:#fff;

    box-shadow:0 20px 50px rgba(15,23,42,.12);

}

.solution-card__featured-caption{

    display:block;

    margin-top:12px;

    color:var(--text-light);

    font-size:.82rem;

    text-align:right;

}

.solution-card__preview-image--featured{

    min-height:420px;

    object-position:top left;

}

.solution-card__preview--featured{

    height:420px;

}

/* ========================================= */

.solution-card__brand{

    display:flex;

    align-items:center;

    gap:16px;

    margin-bottom:24px;

}

.solution-card__logo{

    height:46px;

    width:auto;

    object-fit:contain;

}

.solution-card__brand h3{

    font-size:1.75rem;

    line-height:1;

    margin:0 0 6px;

}

.solution-card__brand span{

    display:block;

    color:var(--text-light);

    font-size:1rem;

    font-weight:500;

}

/* ========================================= */

.solution-card ul{

    list-style:none;

    margin:0;

    padding:0;

    flex:1;

}

.solution-card ul li{

    display:flex;

    align-items:flex-start;

    gap:12px;

    margin-bottom:16px;

    font-weight:600;

    color:var(--text);

    line-height:1.45;

}

.solution-card ul li::before{

    content:"✓";

    width:24px;

    height:24px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:rgba(37,99,235,.10);

    color:var(--primary);

    font-size:.75rem;

    font-weight:bold;

}

/* ========================================= */

.solution-card .btn{

    margin-top:30px;

    justify-content:center;

    min-height:54px;

    border-radius:16px;

    font-weight:700;

}

.solution-card .btn:hover{

    transform:translateY(-2px);

}

/* ========================================= */

.solution-card::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:100%;

    height:4px;

    background:linear-gradient(
        90deg,
        var(--primary),
        #38bdf8
    );

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s;

}

.solution-card:hover::after{

    transform:scaleX(1);

}

/* ========================================= */

@media(max-width:1200px){

    .solutions__grid{

        gap:28px;

    }

    .solution-card__brand h3{

        font-size:1.55rem;

    }

}

/* ========================================= */

@media(max-width:992px){

    .solutions{

        padding:90px 0;

    }

    .solutions__grid{

        grid-template-columns:1fr;

    }

    .solution-card{

        max-width:760px;

        margin:0 auto;

    }

    .solution-card--featured{

        grid-template-columns:1fr;

        padding:22px;

    }

    .solution-card__featured-caption{

        text-align:left;

    }

}

/* ========================================= */

@media(max-width:576px){

    .solution-card__content{

        padding:22px;

    }

    .solution-card--featured{

        padding:18px;

        gap:18px;

    }

    .solution-card__image{

        height:200px;

    }

    .solution-card__brand{

        align-items:flex-start;

        flex-direction:column;

        gap:12px;

    }

    .solution-card__brand h3{

        font-size:1.4rem;

    }

    .solution-card__brand span,
    .solution-card__content > p{

        font-size:.92rem;

    }

    .section-title{

        margin-bottom:50px;

    }

    .solution-card__preview-image--featured,
    .solution-card__preview--featured{

        min-height:240px;

        height:240px;

    }

}
/* ==========================================
   SCROLL ANIMATION
========================================== */

.solution-card{

    opacity:0;

    transform:translateY(40px);
    
    transition:
        opacity .6s ease,
        transform .6s ease,
        box-shadow .35s ease,
        border-color .35s ease;

}

.solution-card.visible{

    opacity:1;

    transform:translateY(0);

}
