:root {
    --kp-blue: #114f9f;
    --kp-blue-dark: #082f67;
    --kp-gold: #f4c431;
    --kp-ink: #17212b;
    --kp-muted: #667085;
    --kp-soft: #f3f7fd;
}

html,
body {
    min-height: 100%;
}

body {
    background: var(--kp-soft);
    color: var(--kp-ink);
}

.brand-mark {
    align-items: center;
    background: var(--kp-blue);
    border-radius: .55rem;
    color: #fff;
    display: inline-flex;
    font-size: .85rem;
    height: 2rem;
    justify-content: center;
    width: 2rem;
}

.brand-logo {
    display: block;
    flex: 0 0 auto;
    height: 2.35rem;
    object-fit: contain;
    width: auto;
}

.navbar-brand {
    min-width: 0;
    max-width: calc(100% - 4rem);
}

.navbar-brand span {
    line-height: 1.15;
    min-width: 0;
    white-space: normal;
}

@media (max-width: 575.98px) {
    .brand-logo {
        height: 1.65rem;
        max-width: 2.65rem;
    }

    .navbar-brand {
        font-size: clamp(.72rem, 3.15vw, .86rem);
        gap: .45rem !important;
        max-width: calc(100% - 3.25rem);
    }

    .navbar-brand span {
        max-width: 13.75rem;
        overflow-wrap: anywhere;
    }

    .navbar-toggler {
        padding: .25rem .45rem;
    }
}

.navbar .nav-link.active {
    color: var(--kp-blue);
    font-weight: 700;
}

.hero-section {
    background:
        linear-gradient(135deg, rgba(17, 79, 159, .95), rgba(8, 47, 103, .92)),
        url("https://images.unsplash.com/photo-1523050854058-8df90110c9f1?auto=format&fit=crop&w=1600&q=80") center/cover;
    color: #fff;
}

.hero-card {
    background: rgba(255, 255, 255, .96);
    border: 0;
    color: var(--kp-ink);
}

.section-pad {
    padding-block: 3.5rem;
}

.feature-icon {
    align-items: center;
    background: rgba(17, 79, 159, .12);
    border-radius: .75rem;
    color: var(--kp-blue);
    display: inline-flex;
    font-size: 1.35rem;
    height: 2.75rem;
    justify-content: center;
    width: 2.75rem;
}

.app-shell,
.message-panel {
    max-width: 760px;
}

.admin-shell {
    max-width: 1100px;
}

.card,
.btn,
.form-control,
.form-select,
.alert {
    border-radius: .5rem;
}

.btn-primary {
    --bs-btn-bg: var(--kp-blue);
    --bs-btn-border-color: var(--kp-blue);
    --bs-btn-hover-bg: var(--kp-blue-dark);
    --bs-btn-hover-border-color: var(--kp-blue-dark);
}

.text-bg-success {
    background-color: var(--kp-blue) !important;
}

.text-bg-warning {
    background-color: var(--kp-gold) !important;
}

.form-label {
    color: #344054;
    font-weight: 600;
}

.table {
    vertical-align: middle;
}

.status-step {
    border-left: 3px solid rgba(244, 196, 49, .8);
    padding-left: 1rem;
}

.document-preview__media {
    aspect-ratio: 4 / 3;
    display: grid;
    place-items: center;
}

.document-preview__media img,
.document-preview__media iframe {
    border: 0;
    height: 100%;
    object-fit: contain;
    width: 100%;
}

.admission-panel {
    top: 5rem;
}

@media (min-width: 576px) {
    .w-sm-auto {
        width: auto !important;
    }
}