/**
 * TYPOGRAPHIE GLOBALE - RAUCIMS & PARTNERS
 * Harmonisation complète des polices sur tout le site
 *
 * Polices utilisées :
 * 1. Playfair Display - Titres (H1-H6, titres de sections, sliders)
 * 2. Poppins - Sous-titres et éléments intermédiaires
 * 3. Roboto - Paragraphes, textes longs, blog, base juridique
 */

/* ========================================================================
   IMPORT GOOGLE FONTS
   ======================================================================== */

/* ========================================================================
   VARIABLES TYPOGRAPHIQUES
   ======================================================================== */

:root {
    /* Familles de polices */
    --font-title: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
    --font-subtitle: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
    --font-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
}

/* ========================================================================
   RESET & BASE TYPOGRAPHIQUE
   ======================================================================== */

body {
    font-family: var(--font-body);
    font-weight: 400;
    line-height: 1.6;
}

/* ========================================================================
   TITRES (H1 à H6) - Playfair Display
   ======================================================================== */

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--font-title) !important;
    font-weight: 700;
    line-height: 1.2;
    margin: 0 0 15px;
}

h1, .h1 { font-size: 48px; font-weight: 800; }
h2, .h2 { font-size: 38px; font-weight: 700; }
h3, .h3 { font-size: 30px; font-weight: 700; }
h4, .h4 { font-size: 24px; font-weight: 600; }
h5, .h5 { font-size: 20px; font-weight: 600; }
h6, .h6 { font-size: 16px; font-weight: 600; }

/* ========================================================================
   SECTIONS & COMPOSANTS - Titres de sections
   ======================================================================== */

/* Titres de sections principales */
.raucims-section-title,
.section-title,
.widget-title,
.box-title,
.page-title {
    font-family: var(--font-title) !important;
    font-weight: 700;
}

/* Sous-titres de sections */
.raucims-hero-subtitle,
.raucims-section-subtitle,
.section-subtitle,
.raucims-subsection-title {
    font-family: var(--font-subtitle);
    font-weight: 500;
}

/* ========================================================================
   REVOLUTION SLIDER - Typographie slider
   ======================================================================== */

.tp-caption.title-slide {
    font-family: var(--font-title) !important;
    font-weight: 800;
}

.tp-caption.sub-title {
    font-family: var(--font-subtitle) !important;
    font-weight: 400;
}

/* ========================================================================
   PARAGRAPHES & TEXTES LONGS - Roboto
   ======================================================================== */

p,
.home-text-intro,
.section-description,
.raucims-section-description,
article p,
.blog-item-excerpt,
.blog-content p,
.legal-text-content,
.service-description,
.reference-description {
    font-family: var(--font-body);
    font-weight: 400;
    line-height: 1.7;
}

/* ========================================================================
   NAVIGATION & MENU - Poppins
   ======================================================================== */

.mainnav ul li a,
.menu-item a,
.nav-link {
    font-family: var(--font-subtitle);
    font-weight: 500;
}

/* ========================================================================
   BOUTONS - Poppins
   ======================================================================== */

.btn,
.raucims-btn,
.flat-button,
button,
input[type="submit"],
input[type="button"] {
    font-family: var(--font-subtitle);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.8px;
}

/* ========================================================================
   CARDS & WIDGETS - Mixte
   ======================================================================== */

/* Titres de cards */
.iconbox h3,
.iconbox h4,
.card-title,
.widget h3,
.widget h4,
.widget h5 {
    font-family: var(--font-title) !important;
    font-weight: 600;
}

/* Contenu de cards */
.iconbox p,
.card-text,
.widget p {
    font-family: var(--font-body);
    font-weight: 400;
}

/* ========================================================================
   BLOG - Typographie articles
   ======================================================================== */

.blog-item-title,
.post-title,
.entry-title {
    font-family: var(--font-title) !important;
    font-weight: 700;
}

.blog-item-meta,
.post-meta,
.entry-meta {
    font-family: var(--font-subtitle);
    font-weight: 400;
    font-size: 14px;
}

/* ========================================================================
   BASE JURIDIQUE - Typographie textes juridiques
   ======================================================================== */

.legal-text-title,
.legal-item-title {
    font-family: var(--font-title) !important;
    font-weight: 700;
}

.legal-text-reference,
.legal-item-meta {
    font-family: var(--font-subtitle);
    font-weight: 500;
    font-size: 14px;
}

/* ========================================================================
   FOOTER - Typographie pied de page
   ======================================================================== */

.footer .widget-title {
    font-family: var(--font-title) !important;
    font-weight: 700;
}

.footer p,
.footer li,
.footer a {
    font-family: var(--font-body);
    font-weight: 400;
}

/* ========================================================================
   FORMULAIRES - Typographie inputs & labels
   ======================================================================== */

label,
.form-label {
    font-family: var(--font-subtitle);
    font-weight: 500;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
textarea,
select {
    font-family: var(--font-body);
    font-weight: 400;
}

/* ========================================================================
   ADMIN DASHBOARD - Typographie back office
   ======================================================================== */

.admin-title,
.dashboard-title {
    font-family: var(--font-title) !important;
    font-weight: 700;
}

.admin-subtitle,
.dashboard-subtitle {
    font-family: var(--font-subtitle);
    font-weight: 500;
}

.admin-content,
.dashboard-content {
    font-family: var(--font-body);
    font-weight: 400;
}

/* ========================================================================
   RESPONSIVE - Ajustements tailles
   ======================================================================== */

@media (max-width: 991px) {
    h1, .h1 { font-size: 38px; }
    h2, .h2 { font-size: 32px; }
    h3, .h3 { font-size: 26px; }
}

@media (max-width: 767px) {
    h1, .h1 { font-size: 32px; }
    h2, .h2 { font-size: 28px; }
    h3, .h3 { font-size: 22px; }
    h4, .h4 { font-size: 20px; }
}
