:root {
    --certwinx-navy: #0b2748;
    --certwinx-navy-dark: #06182f;
    --certwinx-blue: #123b68;
    --certwinx-gold: #b99a58;
    --certwinx-silver: #c8c8c8;
    --certwinx-ink: #172033;
    --certwinx-surface: #f5f7fa;
}

body {
    color: var(--certwinx-ink);
    background-color: var(--certwinx-surface);
}

.topbar,
.navbar,
.header-band,
.section-head.primary,
.thead-dark,
.brand-mark {
    background-color: var(--certwinx-navy) !important;
}

.topbar,
.header-band,
.section-head.primary {
    background-image: linear-gradient(135deg, var(--certwinx-navy), var(--certwinx-navy-dark)) !important;
}

.brand-title,
.section-title,
h1,
h2 {
    text-wrap: balance;
}

.section-card,
.info-card,
.summary-card,
.login-card,
.card {
    border-color: rgba(11, 39, 72, .14) !important;
}

button,
.btn,
.submit-button button {
    transition: transform .16s ease, box-shadow .16s ease, background-color .16s ease;
}

button:hover,
.btn:hover,
.submit-button button:hover {
    transform: translateY(-1px);
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--certwinx-gold) !important;
    box-shadow: 0 0 0 3px rgba(185, 154, 88, .16) !important;
}

@media print {
    body { background: #fff !important; }
}