/* ── Brand tokens ─────────────────────────────────────────── */
:root {
    --brand-primary: #3a4f63;
    --brand-dark:    #2d3e4f;
    --brand-accent:  #2a9fd6;
    --brand-light:   #e8edf2;
}

/* ── Base ─────────────────────────────────────────────────── */
html {
    font-size: 14px;
    position: relative;
    min-height: 100%;
}

@media (min-width: 768px) {
    html { font-size: 16px; }
}

body {
    margin-bottom: 60px;
    color: #1a2634;
}

a {
    color: var(--brand-accent);
}

a:hover {
    color: var(--brand-primary);
}

/* ── Navbar ───────────────────────────────────────────────── */
.prolenea-navbar {
    background-color: var(--brand-primary);
    border-bottom: 3px solid var(--brand-accent) !important;
}

.prolenea-navbar .nav-link {
    opacity: 0.85;
    transition: opacity 0.15s;
}

.prolenea-navbar .nav-link:hover,
.prolenea-navbar .nav-link.active {
    opacity: 1;
}

/* ── Footer ───────────────────────────────────────────────── */
.prolenea-footer {
    background-color: var(--brand-dark);
    color: #9aafc4;
    border-top: 3px solid var(--brand-accent);
}

.prolenea-footer a {
    color: #9aafc4;
    text-decoration: none;
}

.prolenea-footer a:hover {
    color: #fff;
}

/* ── Buttons ──────────────────────────────────────────────── */
.btn-primary {
    background-color: var(--brand-primary);
    border-color: var(--brand-primary);
    color: #fff;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background-color: var(--brand-dark);
    border-color: var(--brand-dark);
    color: #fff;
}

/* ── Focus rings ──────────────────────────────────────────── */
.btn:focus,
.btn:active:focus,
.form-control:focus,
.form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem var(--brand-accent);
}

/* ── Forms ────────────────────────────────────────────────── */
.form-floating > .form-control-plaintext::placeholder,
.form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder,
.form-floating > .form-control:focus::placeholder {
    text-align: start;
}

/* ── Utilities ────────────────────────────────────────────── */
.border-top    { border-top:    1px solid #e5e5e5; }
.border-bottom { border-bottom: 1px solid #e5e5e5; }
.box-shadow    { box-shadow: 0 .25rem .75rem rgba(0,0,0,.08); }