:root {
    --navy-dark: #0f2b38;
    --navy-main: #173f52;
    --teal-main: #2a8b98;
    --teal-light: #72c3cc;
    --bg-light: #f4f8f9;
}

body {
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    color: #333;
    background-color: #fff;
}

/* Colors */
.text-navy { color: var(--navy-main); }
.text-teal { color: var(--teal-main); }
.text-teal-light { color: var(--teal-light); }
.text-light-muted { color: #b0c4de; }

.bg-navy { background-color: var(--navy-main); }
.bg-teal-light { background-color: var(--teal-light); }

/* Buttons */
.btn-teal {
    background-color: var(--teal-main);
    color: white;
    border: none;
}
.btn-teal:hover {
    background-color: #21727d;
    color: white;
}

.btn-navy {
    background-color: var(--navy-main);
    color: white;
    border: none;
}
.btn-navy:hover {
    background-color: var(--navy-dark);
    color: white;
}

/* Navbar */
.navbar-custom {
    background-color: white;
    border-bottom: 2px solid var(--bg-light);
}
.navbar-custom .nav-link {
    color: var(--navy-main);
    font-weight: 500;
}
.navbar-custom .nav-link:hover {
    color: var(--teal-main);
}

/* Hero Section */
.hero-section {
    background: linear-gradient(135deg, var(--navy-dark) 0%, var(--navy-main) 60%, var(--teal-main) 100%);
}

/* Footer Section */
.footer-section {
    background: linear-gradient(135deg, var(--navy-dark) 0%, var(--navy-main) 60%, var(--teal-main) 100%);
}

/* Icons */
.icon-box {
    width: 70px;
    height: 70px;
    background-color: rgba(42, 139, 152, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.w-fit {
    width: fit-content;
    margin: 0 auto;
}