/* ============================================================
   RI Design System — Source canonique des tokens
   ============================================================
   ATTENTION SYNCHRONISATION
   Les 4 couleurs principales et les 3 typos ci-dessous
   sont AUSSI configurées dans Elementor → Site Settings.
   À chaque modif d'une couleur principale OU d'une typo,
   penser à synchroniser les deux endroits :

   Site Settings → Global Colors :
     - Primary   → --terra        (#C8704D)
     - Secondary → --forest-deep  (#1F4530)
     - Text      → --ink          (#1A1815)
     - Accent    → --terra-light  (#E89F7E)

   Site Settings → Global Fonts :
     - Primary (Headlines) → Fraunces
     - Secondary (Body)    → Manrope
     - Accent              → Instrument Serif

   Toute autre couleur (cream, line, forest secondaires,
   red, terra-deep, terra-pale) vit UNIQUEMENT ici.
   ============================================================ */

:root {
    /* === Surfaces ============================== */
    --paper:        #F8F5EE; /* fond principal crème chaud */
    --paper-2:      #FFFFFF; /* cards et surfaces élevées */
    --paper-3:      #FBF9F2; /* surfaces secondaires (inputs, etc.) */
    --cream-light:  #F4EFE3; /* texte sur fond vert profond */
    --cream-deep:   #EFE8D6; /* surfaces tertiaires */

    /* === Encres =============================== */
    --ink:          #1A1815;
    --ink-soft:     #5A5650;
    --ink-softer:   #8A8278;

    /* === Lignes =============================== */
    --line:         #E8E2D4;
    --line-soft:    #F0EBDB;

    /* === Accents terracotta =================== */
    --terra:        #C8704D;
    --terra-deep:   #A85A3C;
    --terra-light:  #E89F7E;
    --terra-pale:   rgba(200, 112, 77, 0.08);

    /* === Vert profond (signature) ============= */
    --forest-deep:    #1F4530;
    --forest-deeper:  #163224;
    --forest-mid:     #2D5F3F;
    --forest-light:   #4A8364;

    /* === Signal rouge éditorial =============== */
    --red:          #A8332B;
    --red-soft:     rgba(168, 51, 43, 0.08);
    --red-soft-bg:  #F5E8E6;

    /* === Typographies ========================= */
    --font-display: 'Fraunces', Georgia, serif;          /* titres, big numbers */
    --font-body:    'Manrope', system-ui, sans-serif;    /* body, CTA */
    --font-italic:  'Instrument Serif', Georgia, serif;  /* italiques sélectives */

    /* === Réglages Fraunces variable font ====== */
    --fraunces-opsz: 144;
    --fraunces-soft: 30;

    /* === Espacements rythme vertical ========== */
    --section-py-desktop: clamp(80px, 10vw, 160px);
    --section-py-mobile:  56px;
    --section-px-desktop: 56px;
    --section-px-mobile:  24px;

    /* === Conteneurs =========================== */
    --container-max:   1280px;
    --container-read:  920px;  /* sources, FAQ, disclaimers */

    /* === Border-radius ======================== */
    --radius-sm:  8px;
    --radius-md:  16px;
    --radius-lg:  24px;
    --radius-xl:  32px;
    --radius-pill: 999px;

    /* === Shadows douces ======================= */
    --shadow-sm:    0 1px 2px rgba(26, 24, 21, 0.04);
    --shadow-md:    0 8px 24px rgba(26, 24, 21, 0.06);
    --shadow-lg:    0 24px 56px rgba(26, 24, 21, 0.08);
    --shadow-card:  0 1px 0 rgba(26, 24, 21, 0.04), 0 8px 32px rgba(26, 24, 21, 0.06);

    /* === Transitions ========================== */
    --t-fast: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
    --t-base: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    --t-slow: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    --t-solennel: 4.5s cubic-bezier(0.25, 0.1, 0.25, 1); /* chart Section Problème */

    /* === Z-index ============================== */
    --z-nav:   50;
    --z-modal: 100;
}

/* ============================================================
   Reset minimal — préserve les défauts WordPress accessibles
   ============================================================ */
*, *::before, *::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}

body.single-dispositif {
    font-family: var(--font-body);
    background: var(--paper);
    color: var(--ink);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.5;
}

/* ============================================================
   Animations partagées
   ============================================================ */
@keyframes floatHalo {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50%      { transform: translate3d(0, -16px, 0); }
}

@keyframes rotateSlow {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

@keyframes pulseDot {
    0%, 100% { opacity: 1; transform: scale(1); }
    50%      { opacity: 0.6; transform: scale(0.92); }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.001s !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001s !important;
    }
}