/* -------------------------------------------------------------------------- */
/* 1. ROOT VARIABLES & CORE RESET
/* -------------------------------------------------------------------------- */
:root {
    --gold: #D4AF37;
    --gold-hover: #f1c40f;
    --black: #000000;
    --dark-gray: #1a1a1a;
    --light-gray: #f8f9fa;
    --transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

body {
    font-family: 'Inter', sans-serif;
    color: #333;
    line-height: 1.6;
    overflow-x: hidden;
    background-color: #fff;
}

/* -------------------------------------------------------------------------- */
/* 2. TYPOGRAPHY - FORCED PREMIUM SIZES
/* -------------------------------------------------------------------------- */
.fw-900 { font-weight: 900 !important; }
.tracking-widest { letter-spacing: 0.3em !important; }
.tracking-tighter { letter-spacing: -0.05em !important; }

.display-1 { font-size: 5.5rem !important; line-height: 1 !important; font-weight: 900 !important; }
.display-3 { font-size: 4.5rem !important; line-height: 1.1 !important; font-weight: 900 !important; }
.display-4 { font-size: 3.5rem !important; line-height: 1.1 !important; font-weight: 900 !important; }
.display-5 { font-size: 2.8rem !important; line-height: 1.2 !important; font-weight: 900 !important; }

/* -------------------------------------------------------------------------- */
/* 3. COLOR SYSTEM - FORCED
/* -------------------------------------------------------------------------- */
.text-gold { color: #D4AF37 !important; }
.bg-gold { background-color: #D4AF37 !important; }
.border-gold { border-color: #D4AF37 !important; }

/* -------------------------------------------------------------------------- */
/* 4. NAVIGATION & BUTTONS
/* -------------------------------------------------------------------------- */
.navbar {
    transition: var(--transition);
    border-bottom: 1px solid rgba(212, 175, 55, 0.2);
}

.nav-link:hover { color: #D4AF37 !important; }

.btn-gold {
    background-color: #D4AF37 !important;
    color: #000 !important;
    border: 1px solid #D4AF37 !important;
    border-radius: 0 !important;
    font-weight: 700;
    text-transform: uppercase;
    transition: var(--transition);
}

.btn-gold:hover {
    background-color: transparent !important;
    color: #D4AF37 !important;
}

.btn-black {
    background-color: #000 !important;
    color: #fff !important;
    border: 2px solid #000 !important;
    border-radius: 0 !important;
    transition: var(--transition);
}

.btn-black:hover {
    background-color: transparent !important;
    color: #000 !important;
}

/* -------------------------------------------------------------------------- */
/* 5. INTERACTIONS & ICONS (THE FIX)
/* -------------------------------------------------------------------------- */
.transition-up { transition: var(--transition); }

.transition-up:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.1) !important;
}

/* Icônes changeant de couleur au survol de leur parent */
.transition-up:hover i, 
.transition-up:hover .fa-solid {
    color: #D4AF37 !important;
}

i.fa-solid, i.fa-brands, i.fas {
    transition: color 0.3s ease-in-out !important;
}

/* -------------------------------------------------------------------------- */
/* 6. RESPONSIVE
/* -------------------------------------------------------------------------- */
@media (max-width: 991px) {
    .display-1 { font-size: 3.8rem !important; }
    .display-3 { font-size: 3rem !important; }
}

@media (max-width: 768px) {
    .display-1 { font-size: 2.8rem !important; }
    .display-3 { font-size: 2.4rem !important; }
    /* Stack images on mobile */
    .row.flex-row-reverse { flex-direction: column-reverse !important; }
}

html { scroll-behavior: smooth; }

/* -------------------------------------------------------------------------- */
/* FILIGRANE DE FOND (FAVICON RÉPÉTITIF)
/* -------------------------------------------------------------------------- */
.background-watermark {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    pointer-events: none;
    
    /* Motif répétitif */
    background-image: url('assets/favicon/favicon-32x32.png');
    background-repeat: repeat;
    background-size: 60px; /* Réduit un peu la taille pour plus de répétitions */
    
    /* Opacité très faible */
    opacity: 0.4; 
    
    /* Masquage progressif avec compatibilité maximale */
    -webkit-mask-image: -webkit-linear-gradient(top, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 80%);
    mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 80%);
}