:root{
    --primary:#248DB0;
    --secondary:#001B44;
}

body{
    font-family:'Segoe UI',sans-serif;
}

/* TOP BAR */

.top-bar{
    background:#001B44;
    color:#fff;
    padding:10px 0;
    font-size:14px;
}

.top-contact{
    display:flex;
    gap:25px;
}

.social-links a{
    color:#fff;
    text-decoration:none;
    margin-left:15px;
}

/* NAVBAR */

.navbar-nav {
    flex-wrap: nowrap;
}

.nav-link {
    white-space: nowrap;
}

.navbar{
    padding:18px 0;
}

.navbar-brand img{
    height:80px;
}

.nav-link{
    color:#001B44;
    font-size:14px;
    font-weight:600;
    margin:0 14px;
    text-transform:uppercase;
}

.header-buttons{
    display:flex;
    gap:10px;
}

.btn-portal{
    background:#001B44;
    color:#fff;
    padding:12px 18px;
    border-radius:10px;
}

.btn-quote{
    background:#248DB0;
    color:#fff;
    padding:12px 18px;
    border-radius:10px;
}

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

.hero-section {

    background:
        linear-gradient(
            rgba(0, 27, 68, 0.75),
            rgba(0, 27, 68, 0.75)
        ),
        url('../images/hero-banner.jpg');

    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;

    min-height: 700px;

    display: flex;
    align-items: center;

    color: #ffffff;

}

.hero-content {

    max-width: 700px;

}

.hero-content h1 {

    font-size: 70px;
    font-weight: 800;
    line-height: 1.1;

    margin-bottom: 30px;

}

.hero-content p {

    font-size: 22px;
    line-height: 1.8;

    margin-bottom: 35px;

}

.hero-buttons {

    display: flex;
    gap: 15px;
    flex-wrap: wrap;

}

.btn-primary-custom {

    background: #248DB0;
    color: #fff;

    padding: 16px 32px;

    border-radius: 10px;

    font-weight: 600;

    border: none;

}

.btn-primary-custom:hover {

    background: #1d7692;
    color: #fff;

}

.btn-outline-custom {

    border: 2px solid #ffffff;

    color: #ffffff;

    padding: 16px 32px;

    border-radius: 10px;

    font-weight: 600;

}

.btn-outline-custom:hover {

    background: #ffffff;
    color: #001B44;

}
/* SERVICES */

.services-section{
    background:#f8f9fc;
    padding:70px 0;
}

.service-card{
    background:#fff;
    padding:30px 20px;
    border-radius:18px;
    text-align:center;
    height:100%;
    box-shadow:0 8px 30px rgba(0,0,0,.08);
}

.service-card h5{
    color:#001B44;
    font-weight:700;
}

.service-card p{
    font-size:14px;
}

/* WHATSAPP */

.whatsapp-btn{
    position:fixed;
    right:25px;
    bottom:25px;
    background:#25D366;
    color:#fff;
    text-decoration:none;
    padding:12px 20px;
    border-radius:50px;
    font-weight:700;
}