/**
 * ═══════════════════════════════════════════════════════════════════
 * MERP NOVA - الهوية البصرية الجديدة
 * ═══════════════════════════════════════════════════════════════════
 * تصميم مختلف تماماً - ألوان وتيبوغرافيا وعرض جديد
 * ═══════════════════════════════════════════════════════════════════
 */

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800;900&display=swap');

:root {
    /* هوية الشعار: #0B72E4 أزرق | #343A40 رمادي */
    --nova-primary: #0B72E4;
    --nova-primary-light: #3d8ef0;
    --nova-primary-dark: #0956b8;
    --nova-secondary: #343A40;
    --nova-accent: #f59e0b;
    --nova-dark: #343A40;
    --nova-slate: #495057;
    --nova-muted: #64748b;
    --nova-bg: #f8fafc;
    --nova-surface: #ffffff;
    --nova-border: #e2e8f0;
    
    /* Gradients - من الشعار */
    --nova-gradient: linear-gradient(135deg, #0B72E4 0%, #3d8ef0 100%);
    --nova-gradient-soft: linear-gradient(135deg, rgba(11, 114, 228, 0.08) 0%, rgba(61, 142, 240, 0.08) 100%);
    --nova-hero: linear-gradient(135deg, #343A40 0%, #212529 50%, #0B72E4 100%);
    
    /* Typography */
    --nova-font-en: 'Cairo', sans-serif;
    --nova-font-ar: 'Cairo', sans-serif;
    
    /* Spacing & Radius */
    --nova-radius: 16px;
    --nova-radius-sm: 12px;
    --nova-radius-lg: 24px;
    --nova-shadow: 0 4px 24px rgba(11, 114, 228, 0.08);
    --nova-shadow-lg: 0 20px 50px rgba(15, 23, 42, 0.12);
}

[dir="rtl"] {
    --nova-font: var(--nova-font-ar);
}

[dir="ltr"] {
    --nova-font: var(--nova-font-en);
}

/* Base */
.nova-theme,
.nova-theme * {
    font-family: var(--nova-font) !important;
}

/* Buttons */
.btn-nova {
    background: var(--nova-gradient);
    color: white !important;
    border: none;
    padding: 14px 32px;
    border-radius: var(--nova-radius-sm);
    font-weight: 700;
    font-size: 0.95rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 20px rgba(11, 114, 228, 0.35);
}

.btn-nova:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 30px rgba(11, 114, 228, 0.45);
    color: white !important;
}

.btn-nova-outline {
    background: transparent;
    color: var(--nova-primary);
    border: 2px solid var(--nova-primary);
    padding: 12px 28px;
    border-radius: var(--nova-radius-sm);
    font-weight: 700;
    transition: all 0.3s ease;
}

.btn-nova-outline:hover {
    background: var(--nova-gradient-soft);
    border-color: var(--nova-primary-light);
    color: var(--nova-primary-dark);
}

/* Cards */
.nova-card {
    background: var(--nova-surface);
    border-radius: var(--nova-radius);
    box-shadow: var(--nova-shadow);
    border: 1px solid var(--nova-border);
    transition: all 0.35s ease;
}

.nova-card:hover {
    box-shadow: var(--nova-shadow-lg);
    transform: translateY(-4px);
}

/* Section Headers */
.nova-section-tag {
    display: inline-block;
    padding: 8px 18px;
    background: var(--nova-gradient-soft);
    color: var(--nova-primary);
    border-radius: 50px;
    font-weight: 700;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: 16px;
}

.nova-section-title {
    font-size: 2.5rem;
    font-weight: 800;
    color: var(--nova-dark);
    line-height: 1.2;
    margin-bottom: 16px;
}

.nova-section-desc {
    font-size: 1.1rem;
    color: var(--nova-muted);
    max-width: 600px;
    line-height: 1.7;
}
