/* ============================================
   INDEX (Accueil) — Alignement SaaS
   Chargé APRÈS style.css : surcharge cosmétique uniquement
   (polices, ombres, arrondis, fonds). Aucun changement de layout.
   Ne cible QUE les sections de l'accueil — header/footer intacts.
   ============================================ */

:root {
    --svc-font-display: 'Space Grotesk', 'Poppins', system-ui, sans-serif;
    --svc-font-sans: 'Inter', system-ui, -apple-system, sans-serif;
    --svc-ink: #0f172a;
    --svc-muted: #64748b;
    --svc-line: #eceef3;
    --svc-bg: #f8f8fc;
    --svc-grad: linear-gradient(135deg, #6d28d9 0%, #db2777 100%);
    --svc-shadow-sm: 0 1px 3px rgba(17, 12, 46, 0.06), 0 8px 24px -16px rgba(76, 29, 149, 0.25);
    --svc-shadow-md: 0 1px 3px rgba(17, 12, 46, 0.06), 0 22px 48px -22px rgba(76, 29, 149, 0.32);
}

/* ── Polices : Inter sur le corps des sections, Space Grotesk sur les titres ── */
.banner-section,
.about-section,
.experts-section,
.testimonials-section,
.portfolio-section,
.formation-section,
.sectors-section,
.cta-section {
    font-family: var(--svc-font-sans);
}

.banner-title,
.about-section .section-title,
.experts-section .section-title,
.testimonials-section .section-title,
.portfolio-section .section-title,
.formation-section .section-title,
.sectors-section .section-title,
.cta-title,
.about-stats .stat-number,
.expert-info h3,
.sector-content h3,
.formation-content h3,
.author-info h4 {
    font-family: var(--svc-font-display);
    letter-spacing: -0.02em;
}

/* ── Pastille de section (eyebrow) façon SaaS ── */
.section-tag {
    color: #6d28d9;
    font-weight: 700;
    letter-spacing: 0.04em;
}

.section-divider {
    background: var(--svc-grad);
    border-radius: 999px;
}

/* ── Fonds de sections alternés, tons doux ── */
.about-section,
.testimonials-section,
.sectors-section {
    background: var(--svc-bg);
}

.experts-section,
.formation-section {
    background: #ffffff;
}

/* ============================================
   CARTES — ombres douces étagées + arrondis cohérents
   (surcharge cosmétique, pas de changement de structure)
   ============================================ */

/* À propos : cadre image */
.about-img-frame {
    border-radius: 22px;
    box-shadow: var(--svc-shadow-md);
}

.about-img-badge {
    border-radius: 16px;
    box-shadow: var(--svc-shadow-sm);
}

/* Statistiques */
.about-stats .stat-item {
    border-radius: 20px;
    border: 1px solid var(--svc-line);
    box-shadow: var(--svc-shadow-sm);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.35s ease;
}

.about-stats .stat-item:hover {
    transform: translateY(-6px);
    box-shadow: var(--svc-shadow-md);
}

.about-stats .stat-icon {
    background: var(--svc-grad);
    border-radius: 16px;
    box-shadow: 0 14px 28px -12px rgba(124, 58, 237, 0.55);
}

/* Experts */
.expert-card {
    border-radius: 20px;
    box-shadow: var(--svc-shadow-sm);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.35s ease;
}

.expert-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--svc-shadow-md);
}

/* Témoignages */
.testimonial-card {
    border-radius: 20px;
    border: 1px solid var(--svc-line);
    box-shadow: var(--svc-shadow-sm);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.35s ease;
}

.testimonial-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--svc-shadow-md);
}

.testimonial-quote-icon {
    color: #c4b5fd;
}

.testimonial-stars i {
    color: #f59e0b;
}

/* Formations */
.formation-card {
    border-radius: 20px;
    box-shadow: var(--svc-shadow-sm);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.35s ease;
}

.formation-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--svc-shadow-md);
}

.formation-badge {
    background: var(--svc-grad);
    border-radius: 999px;
}

/* Secteurs */
.sector-card {
    border-radius: 20px;
    box-shadow: var(--svc-shadow-sm);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.35s ease;
}

.sector-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--svc-shadow-md);
}

.sector-overlay {
    background: linear-gradient(135deg, rgba(109, 40, 217, 0.82) 0%, rgba(219, 39, 119, 0.8) 100%);
}

/* Portfolio : item plus doux */
.portfolio-item {
    border-radius: 14px;
    box-shadow: var(--svc-shadow-sm);
}

/* ── CTA final ── */
.cta-badge {
    background: rgba(255, 255, 255, 0.14);
    border-radius: 999px;
}

.cta-btn {
    border-radius: 999px;
}

.cta-btn-primary {
    background: #ffffff;
    color: #5b21b6;
}

.cta-btn-primary:hover {
    box-shadow: 0 16px 36px -12px rgba(0, 0, 0, 0.35);
}