/* ============================================
   PALETTE DE COULEURS — Portfolio
   Fichier centralisé : modifier ici = modifier partout
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root {
    /* --- Fond de la page --- */
    --bg-primary: #050505;

    /* --- Glassmorphism (Effet Verre) --- */
    --bg-glass: rgba(255, 255, 255, 0.04);
    --bg-glass-hover: rgba(255, 255, 255, 0.1);
    --border-glass: rgba(255, 255, 255, 0.1);
    --glass-blur: blur(20px);
    --glass-shadow: 0 30px 60px rgba(0, 0, 0, 0.5);

    /* --- Fenêtres Safari / Apple --- */
    --glass-bg: rgba(5, 5, 8, 0.65); /* Plus sombre, se fond avec l'arrière-plan */
    --radius-apple: 18px;

    /* --- Textes --- */
    --text-headline: #f1f5f9;
    --text-paragraph: #94a3b8;

    /* --- Accent (Boutons et Liens) --- */
    --color-highlight: #256af4;
    --color-button: #256af4;
    --color-button-hover: #1d4ed8;

    /* --- Typographies Globales --- */
    --font-body: 'Inter', sans-serif;
    --font-heading: 'Space Grotesk', sans-serif;
}

body {
    background-color: var(--bg-primary);
    background-image:
            radial-gradient(at 0% 0%, rgba(37, 106, 244, 0.12) 0px, transparent 40%),
            radial-gradient(at 100% 0%, rgba(59, 130, 246, 0.08) 0px, transparent 40%),
            radial-gradient(at 50% 100%, rgba(37, 106, 244, 0.05) 0px, transparent 40%);
    background-attachment: fixed;
    color: var(--text-paragraph);
    font-family: var(--font-body);
}

/* Typographie globale pour tous les titres du site (Viewer + Admin) */
h1, h2, h3, h4, h5, h6,
.section-title, .card-title, .stat-number, .footer-logo, .safari-title-badge,
.admin-header h1, .dashboard-card h3, .login-header h2 {
    font-family: var(--font-heading);
}