/* ============================================
   Dorevo Institute — Global (tokens + base are separate)
   ============================================ */

/* --- Navbar (Welcome Page) --- */
.navbar-custom {
    background: #FFFFFF;
    border-bottom: 1px solid var(--color-border);
    padding: 0.75rem 0;
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 1000;
    transition: box-shadow var(--transition-fast);
}
.navbar-custom.scrolled { box-shadow: var(--shadow-sm); }
.navbar-brand-custom {
    font-family: var(--font-display);
    font-weight: 700;
    font-size: var(--text-xl);
    color: var(--color-teal-dark);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.navbar-brand-custom span { color: var(--color-coral); }

.section-custom { padding: var(--space-4xl) 0; }

/* --- Feature Card (Welcome) --- */
.feature-card {
    padding: var(--space-xl);
    border-radius: var(--radius-lg);
    background: var(--color-white);
    border: 1px solid var(--color-border);
    transition: box-shadow var(--transition-fast), border-color var(--transition-fast);
}
.feature-card:hover { box-shadow: var(--shadow-md); border-color: var(--color-coral-light); }
.feature-icon {
    width: 48px; height: 48px;
    border-radius: var(--radius-md);
    display: flex; align-items: center; justify-content: center;
    margin-bottom: var(--space-lg);
}
.feature-icon-primary { background: rgba(58, 107, 122, 0.1); color: var(--color-teal); }
.feature-icon-accent { background: rgba(196, 122, 107, 0.12); color: var(--color-coral-dark); }
.feature-icon-success { background: rgba(45, 156, 111, 0.1); color: var(--color-success); }

/* --- Stat Card (Welcome) --- */
.stat-card {
    padding: var(--space-lg);
    border-radius: var(--radius-lg);
    background: var(--color-white);
    border: 1px solid var(--color-border);
    transition: box-shadow var(--transition-fast);
}
.stat-card:hover { box-shadow: var(--shadow-sm); }
.stat-value { font-family: var(--font-display); font-size: var(--text-3xl); font-weight: 700; color: var(--color-teal-dark); line-height: 1; }
.stat-label { font-size: var(--text-sm); color: var(--color-text-muted); margin-top: 0.25rem; }

/* --- Welcome Responsive --- */
@media (max-width: 768px) {
    .section-custom { padding: var(--space-3xl) 0; }
    .stat-value { font-size: var(--text-2xl); }
    .detail-grid { grid-template-columns: 1fr; }
    .page-header { flex-direction: row; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 0.3rem; }
    .profile-grid { grid-template-columns: 1fr !important; }
}