/* ============================================================
   RLG Design System — Tokens
   Site Rébecca Lévy-Guillain · Sociothérapie
   Source unique pour la palette, la typo, l'espacement, les easings.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Manrope:wght@400;500;600;700;800&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500;1,600&display=swap');

:root {
  /* ----- Bleu encre (palette principale, sections sombres) ----- */
  --rlg-encre:        #0E2540;
  --rlg-nuit:         #16314F;
  --rlg-marine:       #1F3F5C;
  --rlg-ardoise:      #2C4A6B;
  --rlg-brume:        #C8D2DF;
  --rlg-pale:         #E8EBF0;

  /* ----- Bleu marine doux (accent secondaire — ex-sapin, refondu 2026-05-12 retour Rebecca clip 181)
       Les noms `--rlg-sapin*` sont conservés pour minimiser la cascade ; renommer en `--rlg-azur*`
       lors d'une passe de cleanup ultérieure. Référence chromatique : contour bleu marine clair du logo chat. */
  --rlg-sapin:        #26466B;  /* ex #2D4F47 — bleu marine accent (sections inclusion / Cabinet) */
  --rlg-sapin-mid:    #5A7A9E;  /* ex #4F8079 — bleu moyen façon "contour chat" */
  --rlg-sapin-pale:   #B8CADC;  /* ex #B8CCC7 — bleu pâle */
  --rlg-sapin-light:  #DDE6F1;  /* ex #D9E5E1 — bleu très pâle (Cadres & tarifs, Cabinet light) */
  --rlg-sapin-deep:   #15304F;  /* ex #1F3833 — bleu marine très profond (bandeau inclusion, bridges sombres) */

  /* ----- Or (filets, accents, CTA) ----- */
  --rlg-or:           #C9A86C;
  --rlg-or-deep:      #A8884B;
  --rlg-or-pale:      #E8D7AA;

  /* ----- Ivoire (fonds chauds) ----- */
  --rlg-casse:        #FBF8F1;
  --rlg-ivoire:       #F4ECDC;
  --rlg-ivoire-soft:  #FAF4E6;
  --rlg-ivoire-deep:  #EBDFC4;

  /* ----- Neutres ----- */
  --rlg-gris-1:       #E8E5DD;
  --rlg-gris-2:       #6B6B6B;
  --rlg-noir:         #0A0A0A;
  --rlg-blanc:        #FFFFFF;

  /* ----- Familles typo ----- */
  --rlg-f-display:    'DM Serif Display', Georgia, serif;
  --rlg-f-sans:       'Manrope', system-ui, sans-serif;
  --rlg-f-serif:      'Cormorant Garamond', Georgia, serif;

  /* ----- Échelle display italique (titres) ----- */
  --rlg-fs-display-xl: clamp(96px, 13vw, 200px);  /* hero principal */
  --rlg-fs-display-lg: clamp(56px, 7vw, 96px);    /* hero secondaire */
  --rlg-fs-display-md: clamp(40px, 5vw, 72px);    /* H2 sections */
  --rlg-fs-display-sm: clamp(28px, 3vw, 44px);    /* H3 cards */

  /* ----- Easings ----- */
  --rlg-ease-soft:      cubic-bezier(.2,.7,.2,1);   /* défaut */
  --rlg-ease-narrative: cubic-bezier(.16,.84,.3,1); /* reveals, scrub */
  --rlg-ease-snap:      cubic-bezier(.5,0,.1,1);    /* boutons */

  /* ----- Spacing rythmique ----- */
  --rlg-sp-section:    144px;     /* padding vertical de section */
  --rlg-sp-section-sm: 96px;
  --rlg-sp-bridge:     112px;     /* bridge entre sections */

  /* ----- Hairlines ----- */
  --rlg-hairline:        rgba(14,37,64,.10);
  --rlg-hairline-or:     rgba(168,136,75,.30);
  --rlg-hairline-on-dark: rgba(244,236,220,.16);

  /* ----- Ombres ----- */
  --rlg-shadow-sm:    0 6px 18px rgba(14,37,64,.08);
  --rlg-shadow-md:    0 10px 24px rgba(14,37,64,.12);
  --rlg-shadow-lg:    0 18px 40px rgba(14,37,64,.18);
  --rlg-shadow-or:    0 10px 24px rgba(201,168,108,.28);
  --rlg-shadow-logo:  0 12px 36px rgba(14,37,64,.28), 0 0 0 1px rgba(217,168,95,.35) inset;
  --rlg-shadow-logo-sm: 0 6px 18px rgba(14,37,64,.12), 0 0 0 1px rgba(217,168,95,.25) inset;

  /* ----- Durées ----- */
  --rlg-dur-fast:    .25s;
  --rlg-dur-base:    .35s;
  --rlg-dur-slow:    .5s;
  --rlg-dur-reveal:  .9s;

  /* ----- Layout ----- */
  --rlg-container:    1240px;
  --rlg-container-sm: 980px;
  --rlg-bp-tablet:    1100px;

  /* ----- Focus ----- */
  --rlg-focus-ring:   0 0 0 3px rgba(201,168,108,.4);

  /* ----- Z-index ----- */
  --rlg-z-rail: 30;
  --rlg-z-nav:  50;
}

/* ----- Reset minimal ----- */
*, *::before, *::after { box-sizing: border-box; }
img { max-width: 100%; display: block; }
