/* ================================================= */
/* 1. BASE & TYPOGRAPHY                              */
/* ================================================= */
body {
    font-family: 'Inter', sans-serif;
    -webkit-font-smoothing: antialiased;
    color: #1F2937;
    background-color: #F8FAF9;
    
    /* NOUVELLES VALEURS POUR LE HEADER PREMIUM */
    padding-top: 155px; /* Mobile : Header + aéré */
    padding-bottom: 90px; /* Espace pour la Sticky Bar */
}

@media (min-width: 768px) {
    body {
        padding-top: 125px; /* PC : Header compact */
        padding-bottom: 0;  /* Pas de sticky bar sur PC */
    }
}

/* ================================================= */
/* 2. CLASSES RESPONSIVE (HEADER & AFFICHAGE)        */
/* ================================================= */
/* Ces classes gèrent l'affichage conditionnel Mobile/PC */

/* --- VERSION MOBILE (< 768px) --- */
@media (max-width: 767px) {
    .vue-pc { display: none !important; }
    .vue-mobile { display: block !important; }
    
    .vue-pc-force { display: none !important; }
    .vue-mobile-force { display: block !important; }
    
    .desktop-only-tab { display: none !important; }
    
    .titre-container { flex-direction: column; align-items: flex-start; }
    .nav-item { padding: 0 0.5rem; }
    
    /* Force l'affichage grid sur mobile pour le formulaire contact */
    .vue-mobile-force.grid { display: grid !important; }
}

/* --- VERSION PC (>= 768px) --- */
@media (min-width: 768px) {
    .vue-mobile { display: none !important; }
    .vue-pc { display: inline !important; }
    
    .vue-mobile-force { display: none !important; }
    .vue-pc-force { display: block !important; }
    
    .desktop-only-tab { display: flex !important; }
    
    .titre-container { flex-direction: row; align-items: baseline; }
    .nav-item { padding: 0 1rem; }
    
    /* Empilement vertical dans le menu PC (Fiches, Examens) */
    .pc-stack { 
        display: flex !important; 
        flex-direction: column; 
        align-items: center; 
        line-height: 1; 
    }

    /* CACHER LA STICKY BAR SUR PC IMPÉRATIVEMENT */
    .sticky-bar-mobile, 
    .fixed.bottom-0.md\:hidden {
        display: none !important;
    }
}

/* ================================================= */
/* 3. NAVIGATION & SCROLLBAR                         */
/* ================================================= */
.scrollbar-hide::-webkit-scrollbar { display: none; }
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }

/* Custom Scrollbar pour le menu horizontal */
.nav-scroll {
    scrollbar-width: thin;
    scrollbar-color: #CBD5E1 #F1F5F9;
}
.nav-scroll::-webkit-scrollbar { height: 4px; }
.nav-scroll::-webkit-scrollbar-track { background: #F1F5F9; }
.nav-scroll::-webkit-scrollbar-thumb { background-color: #CBD5E1; border-radius: 3px; }
.nav-scroll::-webkit-scrollbar-thumb:hover { background-color: #94A3B8; }

/* Indicateur visuel de scroll (Dégradé blanc à droite) */
.nav-scroll-container { position: relative; max-width: 100%; }
.nav-scroll-container::after {
    content: '';
    position: absolute; top: 0; right: 0; height: 100%; width: 40px;
    background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255,255,255,0.9));
    pointer-events: none; z-index: 10;
}

/* Style des items du menu */
.nav-item {
    display: flex; align-items: center; justify-content: center;
    height: 100%; cursor: pointer; white-space: nowrap;
    border-right: 1px solid rgba(229, 231, 235, 0.5);
    border-bottom: 2px solid transparent;
    transition: all 0.2s ease-in-out;
    color: #6B7280;
}
.nav-item:hover { border-bottom-color: #2563EB; color: #2563EB; }
.nav-item.active { 
    border-bottom-color: #2563EB; 
    background-color: transparent; 
    color: #2563EB; 
    font-weight: 600; 
}

/* ================================================= */
/* 4. COMPONENTS (BUTTONS, CARDS)                    */
/* ================================================= */
.btn-premium {
    background: linear-gradient(135deg, #2563EB 0%, #1D4ED8 100%);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.btn-premium:hover {
    filter: brightness(110%);
    transform: translateY(-1px);
}

.content-section { padding-bottom: 4rem; }

.section-title {
    font-size: 2.25rem; font-weight: 800; color: #111827;
    margin-bottom: 1rem; line-height: 1.2;
}
.section-subtitle {
    font-size: 1.125rem; color: #4B5563;
    max-width: 42rem; margin-left: auto; margin-right: auto;
}

.stat-card {
    background: white; padding: 1.5rem 2rem;
    border-radius: 1rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
    text-align: center; min-width: 140px;
    border: 1px solid #F3F4F6;
}

/* ================================================= */
/* 5. REVIEWS CARD                                   */
/* ================================================= */
.review-card {
    background: white; padding: 1.5rem;
    border-radius: 1rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
    border: 1px solid #F3F4F6;
    display: flex; flex-direction: column; justify-content: space-between;
    transition: transform 0.2s ease;
}
.review-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}
.review-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.75rem; }
.review-text { font-size: 0.95rem; color: #374151; line-height: 1.6; font-style: italic; margin-bottom: 1rem; }
.btn-view-more { display: none; }
@media (min-width: 768px) {
    .btn-view-more { display: inline-block !important; margin-bottom: 1rem; }
}

/* ================================================= */
/* 6. FICHES & FILTRES                               */
/* ================================================= */
.resume-filter-btn {
    padding: 0.5rem 1.25rem; border-radius: 9999px;
    font-weight: 600; font-size: 0.875rem;
    border: 1px solid #E5E7EB; color: #6B7280; background: white;
    transition: all 0.2s; cursor: pointer;
}
.resume-filter-btn:hover { border-color: #BFDBFE; background-color: #F9FAFB; }
.resume-filter-btn.active { background-color: #EFF6FF; color: #1D4ED8; border-color: #BFDBFE; }

/* Patch pour forcer l'affichage horizontal des fiches */
.sheet-card {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    text-align: left !important;
    padding: 0.75rem 1rem !important;
    min-height: auto !important;
    background: white; border-radius: 0.75rem;
    border: 1px solid #F3F4F6; transition: all 0.2s;
    text-decoration: none;
}
.sheet-card:hover { border-color: #3B82F6; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1); }
.sheet-icon {
    font-size: 1.5rem !important;
    margin-bottom: 0 !important; margin-right: 1rem !important;
    background-color: #F3F4F6;
    width: 45px; height: 45px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 10px; flex-shrink: 0;
}

/* ================================================= */
/* 7. ACCORDION (FAQ) & INTERVIEWS                   */
/* ================================================= */
.accordion-item {
    background: white; border-radius: 0.75rem;
    border: 1px solid #F3F4F6; overflow: hidden;
}
.accordion-header {
    width: 100%; padding: 1.25rem;
    display: flex; justify-content: space-between; align-items: center;
    font-weight: 600; color: #1F2937; text-align: left;
    transition: background-color 0.2s; cursor: pointer;
}
.accordion-header:hover { background-color: #F9FAFB; }
.accordion-arrow { transition: transform 0.3s; color: #3B82F6; }

/* ================================================= */
/* 8. FORM SUCCESS                                   */
/* ================================================= */
#form-success, #success-final {
    position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 100;
}
.hidden { display: none !important; }