body {
    font-family: Inter,Arial,sans-serif;
    color: #1f2937;
    background: #f8fafc
}

.navbar {
    box-shadow: 0 2px 18px rgba(0,0,0,.06)
}

.brand {
    font-weight: 800;
    letter-spacing: .4px
}

.hero {
    background: linear-gradient(135deg,#0b1f3a,#123d6a);
    color: #fff;
    padding: 110px 0 90px
}

    .hero .lead {
        color: #dbeafe
    }

.section {
    padding: 85px 0
}

.eyebrow {
    color: #0d6efd;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px
}

.card-pro {
    border: 0;
    border-radius: 18px;
    box-shadow: 0 10px 30px rgba(15,23,42,.08);
    height: 100%;
    transition: .25s
}

    .card-pro:hover {
        transform: translateY(-6px)
    }

.icon-box {
    width: 54px;
    height: 54px;
    border-radius: 14px;
    background: #e8f1ff;
    display: grid;
    place-items: center;
    font-size: 24px
}

.stat {
    background: #fff;
    border-radius: 18px;
    padding: 25px;
    box-shadow: 0 10px 30px rgba(15,23,42,.07)
}

.cta {
    background: linear-gradient(135deg,#0d6efd,#084298);
    color: white;
    border-radius: 24px;
    padding: 55px
}

.page-head {
    background: linear-gradient(135deg,#edf4ff,#fff);
    padding: 75px 0
}

.footer {
    background: #07172b;
    color: #cbd5e1
}

    .footer a {
        color: #cbd5e1;
        text-decoration: none
    }

        .footer a:hover {
            color: #fff
        }

.btn {
    border-radius: 10px;
    padding: .7rem 1.15rem
}

.form-control {
    padding: .8rem;
    border-radius: 10px
}

.badge-soft {
    background: #e8f1ff;
    color: #0d6efd
}

.product-img {
    height: 180px;
    background: linear-gradient(135deg,#dbeafe,#f8fafc);
    border-radius: 16px 16px 0 0;
    display: grid;
    place-items: center;
    font-size: 55px
}

.contact-card {
    border-radius: 18px;
    border: 0;
    box-shadow: 0 10px 30px rgba(15,23,42,.08)
}
/* =========================
   BRAND LOGO
========================= */

.brand-logo {
    height: 42px;
    width: auto;
    object-fit: contain;
    margin-right: 10px;
}

.footer-logo {
    height: 40px;
    width: auto;
    object-fit: contain;
    margin-right: 10px;
}

/* Mobile */
@media (max-width: 576px) {

    .brand-logo {
        height: 34px;
        margin-right: 7px;
    }

    .footer-logo {
        height: 34px;
        margin-right: 7px;
    }

    .navbar-brand {
        font-size: 15px;
    }

    .footer .brand {
        font-size: 16px;
    }
}