/* ============================================
   PROGRAMME DE FIDELITE — Design System
   Personnalisable via config.php
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Montserrat:wght@200;300;400;500;600;700&display=swap');

:root {
    --primary: #F2C4CE;
    --primary-light: #FBE8ED;
    --primary-dark: #D4919F;
    --gold: #C8A96E;
    --gold-light: #D4BA85;
    --gold-dark: #A68B4B;
    --dark: #3C2415;
    --dark-light: #5C3D2E;
    --cream: #FDF9F6;
    --cream-warm: #F7F0E8;
    --white: #FFFFFF;
    --gray: #6B6B6B;
    --gray-light: #B0B0B0;
    --gray-muted: #E8E4E0;
    --success: #4CAF50;
    --error: #E53935;

    --font-title: 'Playfair Display', serif;
    --font-body: 'Montserrat', sans-serif;

    --radius-sm: 8px;
    --radius-md: 16px;
    --radius-lg: 24px;
    --radius-xl: 32px;
    --radius-full: 50%;

    --shadow-sm: 0 2px 8px rgba(60,36,21,0.06);
    --shadow-md: 0 4px 20px rgba(60,36,21,0.08);
    --shadow-lg: 0 8px 40px rgba(60,36,21,0.12);
    --shadow-gold: 0 4px 20px rgba(200,169,110,0.3);
    --shadow-card: 0 8px 32px rgba(60,36,21,0.08);

    --transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --transition-slow: all 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* ---- RESET ---- */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { font-size: 16px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body { font-family: var(--font-body); color: var(--dark); background: var(--cream); min-height: 100vh; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; border: none; background: none; font-family: var(--font-body); }
input, select, textarea { font-family: var(--font-body); outline: none; }
img { max-width: 100%; display: block; }

/* ---- ANIMATIONS ---- */
@keyframes fadeUp { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn { from { opacity: 0; transform: scale(0.9); } to { opacity: 1; transform: scale(1); } }
@keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
@keyframes shimmer { 0% { background-position: -200% center; } 100% { background-position: 200% center; } }
@keyframes pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } }
@keyframes progressFill { from { stroke-dashoffset: 283; } }
@keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes sparkle { 0%, 100% { opacity: 0.4; } 50% { opacity: 1; } }
@keyframes confetti { 0% { transform: translateY(0) rotate(0); opacity: 1; } 100% { transform: translateY(-100px) rotate(720deg); opacity: 0; } }

/* ---- UTILITY CLASSES ---- */
.animate-in { animation: fadeUp 0.6s ease forwards; }
.delay-1 { animation-delay: 0.1s; }
.delay-2 { animation-delay: 0.2s; }
.delay-3 { animation-delay: 0.3s; }
.delay-4 { animation-delay: 0.4s; }
.text-center { text-align: center; }
.text-gold { color: var(--gold); }
.text-gray { color: var(--gray); }
.mt-8 { margin-top: 8px; }
.mt-16 { margin-top: 16px; }
.mt-24 { margin-top: 24px; }
.mb-8 { margin-bottom: 8px; }
.mb-16 { margin-bottom: 16px; }
.mb-24 { margin-bottom: 24px; }