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

.hero{
    background:#081B33;
    padding:145px 0 140px;
}

.hero-container{
    display:grid;
    grid-template-columns:1.1fr 0.9fr;
    gap:60px;
    align-items:center;
}

/* =========================================
   LEFT
========================================= */

.hero-content{
    max-width:620px;
}

.hero-badge{
    display:inline-block;
    background:#EAF3FF;
    color:#0F6FFF;
    padding:10px 18px;
    border-radius:40px;
    font-size:13px;
    font-weight:700;
    margin-bottom:25px;
    letter-spacing:1px;
}

.hero-content h1{
    color:#fff;
    font-size:46px;
    line-height:1.1;
    font-weight:800;
    margin-bottom:24px;
}

.hero-content h1 span{
    display:block;
}

.hero-content p{
    color:#D6DDE8;
    font-size:18px;
    line-height:1.8;
    margin-bottom:35px;
    max-width:540px;
}

.hero-buttons{
    display:flex;
    gap:18px;
    margin-top:45px;
}

.hero-trust{
    display:flex;
    align-items:center;
    gap:28px;
    margin-top:28px;
    flex-wrap:wrap;
}

.trust-item{
    display:flex;
    align-items:center;
    gap:8px;

    font-size:0.88rem;
    font-weight:500;
    color:#d7dbe3;
}

.trust-item i{
    color:#3b82f6;
    font-size:16px;
}

/* =========================================
   RIGHT
========================================= */

.hero-right{
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
    transform: translateY(-45px);
}

.hero-truck{
    width:118%;
    max-width:none;
}

/* =========================================
   DISPATCH CARD
========================================= */

.dispatch-card{
    position:absolute;
    bottom:-100px;
    right:60px;

    width:340px;

    background:#0F6FFF;
    color:#fff;

    padding:24px;

    border-radius:20px;

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

.dispatch-card h3{
    display: flex;
    align-items: center;
    gap: 12px;
    font-size:20px;
    margin-bottom:12px;

}

.dispatcher-card h3 i{
    font-size:20px;
}

.dispatch-card p{

    line-height:1.7;

    font-size:15px;

}

/* =========================================
   STATS
========================================= */

.stats{

    margin-top:-40px;

    position:relative;

    z-index:10;

}

.stats-card{

    display:grid;

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

    background:#fff;

    border-radius:22px;

    overflow:hidden;

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

}

.stat{

    text-align:center;

    padding:30px;

}

.stat:not(:last-child){

    border-right:1px solid #ECECEC;

}

.stat h2{

    color:#0F6FFF;

    font-size:34px;

    margin-bottom:10px;

}

.stat p{

    color:#6B7280;

    font-size:15px;

}