/* =========================================
   SPECIALIZED VERTICALS SECTION
========================================= */

.verticals-section{
    width:100%;
    background:#ffffff;
    padding: 0;
    margin: 25px 0px 40px 0px ;
    box-sizing:border-box;
}

.verticals-container{
    width:100%;
    max-width:1400px;
    margin:0 auto;
    padding:0 25px;
    box-sizing:border-box;
}

/* =========================================
   TITLES
========================================= */

.verticals-title{
    text-align:center;
    font-size:2em;
    font-weight:500;
    color:#333;
    margin:0 0 12px 0;
    padding:0;
}

.verticals-subtitle{
    text-align:center;
    font-size:1.05em;
    color:#444;
    line-height:1.45em;
    max-width:850px;
    margin:0 auto 35px auto;
}

/* =========================================
   GRID
========================================= */

.verticals-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:24px;
}

/* =========================================
   CARD
========================================= */

.vertical-card{
    background:#f2f2f2;
    border-radius:12px;
    overflow:hidden;
    display:flex;
    align-items:stretch;
    min-height:170px;
    box-shadow:none;
}

/* =========================================
   ICON SIDE
========================================= */

.vertical-card-icon{
    width:95px;
    min-width:95px;
    background:#135f84;
    display:flex;
    align-items:center;
    justify-content:center;
    box-sizing:border-box;
}

.vertical-card-icon i{
    font-size:35px;
    color:#ffffff;
    line-height:1;
    display:block;
}

/* =========================================
   CONTENT SIDE
========================================= */

.vertical-card-content{
    padding:22px 22px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:10px;
}

.vertical-card-content span{
    font-size:1em;
    color:#222;
    line-height:1.35em;
}

/* =========================================
   1200px
========================================= */

@media (max-width:1200px){

    .verticals-container{
        max-width:1200px;
    }

    .verticals-grid{
        gap:20px;
    }

    .vertical-card{
        min-height:160px;
    }

    .vertical-card-icon{
        width:90px;
        min-width:90px;
    }

    .vertical-card-icon i{
        font-size:46px;
    }

    .vertical-card-content{
        padding:20px;
    }

    .vertical-card-content span{
        font-size:0.95em;
    }
}

/* =========================================
   1100px
========================================= */

@media (max-width:1100px){

    .verticals-grid{
        grid-template-columns:repeat(2, 1fr);
        gap:20px;
    }

    .verticals-title{
        font-size:1.8em;
    }

    .verticals-subtitle{
        font-size:1em;
        margin-bottom:30px;
    }

    .vertical-card{
        min-height:150px;
    }

    .vertical-card-icon{
        width:85px;
        min-width:85px;
    }

    .vertical-card-icon i{
        font-size:42px;
    }
}

/* =========================================
   900px
========================================= */

@media (max-width:900px){

    .verticals-section{
        padding:20px 0 30px 0;
    }

    .verticals-container{
        padding:0 18px;
    }

    .verticals-grid{
        grid-template-columns:1fr;
        gap:18px;
    }

    .verticals-title{
        font-size:1.6em;
    }

    .verticals-subtitle{
        font-size:0.95em;
        margin-bottom:25px;
    }

    .vertical-card{
        min-height:140px;
    }

    .vertical-card-icon{
        width:80px;
        min-width:80px;
    }

    .vertical-card-icon i{
        font-size:38px;
    }

    .vertical-card-content{
        padding:18px;
    }

    .vertical-card-content span{
        font-size:0.95em;
    }
}

/* =========================================
   600px MOBILE
========================================= */

@media (max-width:600px){

    .verticals-section{
        padding:18px 0 25px 0;
    }

    .verticals-container{
        padding:0 15px;
    }

    .verticals-title{
        font-size:1.4em;
    }

    .verticals-subtitle{
        font-size:0.9em;
        line-height:1.5em;
        margin-bottom:20px;
    }

    .vertical-card{
        min-height:auto;
        border-radius:10px;
    }

    .vertical-card-icon{
        width:72px;
        min-width:72px;
    }

    .vertical-card-icon i{
        font-size:34px;
    }

    .vertical-card-content{
        padding:16px;
        gap:8px;
    }

    .vertical-card-content span{
        font-size:0.9em;
        line-height:1.3em;
    }
}