:root {
    --bg-primary: #0F172A; /* deep slate */
    --bg-card: rgba(26, 26, 46, 0.85); /* glass background */
    --bg-card-hover: rgba(26, 26, 46, 0.95);
    --glass-border: rgba(255, 255, 255, 0.08);
    --accent-primary: #3B82F6; /* corporate blue */
    --accent-glow: rgba(59,130,246,0.15);
    --text-primary: #F1F5F9;
    --text-muted: #94A3B8;
    --transition: all 0.2s ease-in-out;
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --shadow-glass: 0 8px 32px rgba(0,0,0,0.4);
    --gradient-primary: linear-gradient(135deg, #0F172A 0%, #3B82F6 100%);
}

/* Glass‑morphism base class */
.glass-card {
    background: var(--bg-card);
    backdrop-filter: blur(20px);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-glass);
    padding: 16px;
    transition: var(--transition);
}

.glass-modal {
    background: var(--bg-card);
    backdrop-filter: blur(25px);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-glass);
    padding: 24px;
    max-width: 90vw;
    max-height: 90vh;
    overflow: auto;
}

/* Primary button */
.btn-primary {
    background: var(--accent-primary);
    color: #fff;
    border: none;
    border-radius: var(--radius-sm);
    padding: 8px 12px;
    cursor: pointer;
    transition: var(--transition);
}
.btn-primary:hover {
    background: var(--accent-glow);
}

/* Micro‑animations */
.fade-in {
    animation: fadeIn 0.3s ease-out forwards;
}
.scale-up {
    animation: scaleUp 0.25s ease-out forwards;
}
@keyframes fadeIn {
    from { opacity:0; transform:translateY(10px); }
    to { opacity:1; transform:translateY(0); }
}
@keyframes scaleUp {
    from { transform:scale(0.95); opacity:0.8; }
    to { transform:scale(1); opacity:1; }
}
