:root {
    --bs-primary: #1a237e;
    --bs-danger: #f44336;
    --font-heading: 'Poppins', sans-serif;
    --font-body: 'Roboto', sans-serif;
}

body {
    font-family: var(--font-body);
}
h1, h2, h3, h4, h5, h6, .logo {
    font-family: var(--font-heading);
}

.bg-primary-custom { background-color: var(--bs-primary) !important; }
.text-primary-custom { color: var(--bs-primary) !important; }

.hero {
    background-color: #e8eaf6;
    padding: 5rem 0;
}

.cta-button {
    background-color: var(--bs-danger);
    color: white;
    padding: 0.75rem 2rem;
    font-weight: 600;
    border-radius: 4px;
    transition: background-color 0.3s;
}
.cta-button:hover { background-color: #d32f2f; color: white; }

.table-custom thead {
    background-color: var(--bs-primary);
    color: white;
}

.mission-box {
    border-left: 5px solid var(--bs-danger);
}

.area-item {
    border-top: 3px solid var(--bs-primary);
}

.win-win-card {
    border-left: 5px solid #ff9800;
    background-color: #fffde7;
}

footer {
    background-color: #37474f;
    padding: 3rem 0;
}