/* ============================================================
   IN MY ELEMENT — Design tokens (Maison de cuir, Londres)
   Direction: fashion-creative-director
   ============================================================ */
:root{
  /* — Couleur signature —
     DOCTRINE (symétrique de celle de l'or, bible §8) :
       --ime-green         = CHAMP. Aplat, pastille, filet. Encre uniquement sur cuir/aubergine.
       --ime-green-leather = MATIÈRE. Le pigment mesuré du cuir réel (médiane de 5 relevés sur
                             les photos produit 2026-07 : #AE9D9D ± 6). À employer pour tout grand
                             champ vert ADJACENT à une photographie : sur écran, #C2CC83 seul lit
                             « menthe » là où le cuir photographié lit « olive ».
                             Porte l'aubergine (5,86:1) et le noir (6,95:1). JAMAIS d'ivoire (2,32).
       --ime-green-deep    = OMBRE. Survol, profondeur, filet. Jamais un glyphe sur fond clair (2,84).
       --ime-green-ink     = GLYPHE. Le seul vert autorisé en TEXTE sur ivoire (5,42:1) / bone (4,83). */
  /* LA PALETTE EST CELLE DU PORTE-PASSEPORT. Deux couleurs, pas une de plus.
     Relevées sur les photos produit : le cuir et son gaufrage.
       vert  #C2CC83 — le cuir
       prune #4A2530 — le gaufrage
     Le prune sur noir donne 1,38:1 : il est INUTILISABLE sur du noir.
     C'est donc lui, le sombre de la maison — le noir est banni. */
  --ime-green:        #C2CC83;   /* LE cuir — la couleur maison */
  --ime-green-leather:#C2CC83;
  --ime-green-deep:   #A8B268;   /* même teinte, assombrie — survol / filet */
  --ime-green-ink:    #5E6636;   /* vert en TEXTE sur ivoire (5,42:1) */
  --ime-green-soft:   #DCE3B8;
  --ime-green-wash:   #EEF1DE;

  /* — Le prune du gaufrage — le seul sombre de la maison — */
  --prune:            #4A2530;   /* 7,67:1 sur le vert · 11,64:1 sur ivoire */
  --prune-deep:       #331A22;   /* profondeur */
  --prune-soft:       #6B3A47;   /* survol */
  --burgundy:         #4A2530;   /* alias */

  /* — Encre — */
  --ink:      #4A2530;         /* le prune — texte principal */
  --ink-2:    #694A51;         /* prune éclairci 18 % — 6,89:1 sur ivoire */
  --ink-3:    #7A5E64;         /* prune éclairci 28 % — 5,15:1 sur ivoire (le plus clair qui passe AA) */
  --noir:     #4A2530;         /* le prune EST le sombre de la maison (plus de noir) */
  --noir-abyss:#331A22;        /* prune profond — chapitre, sommet */

  /* — Papier — */
  --paper:    #F4F1E9;         /* ivoire — fond dominant */
  --bone:     #EAE4D6;         /* cartes / séparations */
  --paper-2:  #FBF9F4;         /* blanc chaud */
  --line:     #E0D8C8;         /* filets */

  /* — L'OR EST SUPPRIMÉ — c'était une troisième couleur, absente du produit.
     Les filets et bordures passent au prune. Les alias restent pour ne rien casser. */
  --gold:     #4A2530;
  --gold-soft:#6B3A47;
  --gold-ink: #4A2530;

  /* — Sémantique — */
  --bg:        var(--paper);
  --fg:        var(--ink);
  --accent:    var(--ime-green);

  /* — Typo — REBRAND: Anton + Archivo */
  --sans: 'Anton', 'Archivo', system-ui, sans-serif;
  --serif: 'Archivo', system-ui, sans-serif;
  --mono: 'Archivo', system-ui, sans-serif;

  /* Échelle du crescendo — l'accueil monte, elle ne plafonne pas.
     Un seul --fs-apex par site : c'est le sommet, rien n'a le droit de le dépasser.
     --fs-hero est volontairement SOUS --fs-apex (5,6 vs 13 rem) : le hero pose la
     question, il ne la résout pas. */
  --fs-apex: clamp(2.8rem, 12vw, 13rem);    /* LE sommet — une occurrence, une seule */
  --fs-mega: clamp(3.4rem, 9vw, 8.5rem);
  --fs-hero: clamp(2.4rem, 6.4vw, 5.6rem);  /* .hero-q — était 7,2vw/6,4rem en dur */
  --fs-h1:   clamp(2.4rem, 5.5vw, 5rem);
  --fs-h2:   clamp(1.9rem, 3.6vw, 3.2rem);
  --fs-h3:   clamp(1.3rem, 2vw, 1.7rem);
  --fs-lead: clamp(1.05rem, 1.5vw, 1.35rem);
  --fs-body: 1rem;
  --fs-sm:   0.82rem;
  --fs-xs:   0.72rem;

  --track-wide:  0.24em;   /* capitales signature */
  --track-mid:   0.14em;
  --track-tight: 0.02em;
  --track-apex:  0.02em;   /* au-delà de 8rem, .24em déchire la ligne : le sommet est serré */

  /* — Espacement (système large, luxe) — */
  --s-1: 0.5rem;  --s-2: 1rem;   --s-3: 1.5rem;  --s-4: 2rem;
  --s-5: 3rem;    --s-6: 4.5rem;  --s-7: 6.5rem;  --s-8: 9rem;  --s-9: 12rem;
  --s-10: 16rem;  /* le pas de SILENCE — réservé aux chapitres vides (02, avant-sommet) */

  --gutter: clamp(1.25rem, 5vw, 5rem);
  --maxw: 1560px;
  --maxw-read: 62ch;
  /* Garde-fou photo : les visuels produit livrés font 350–850 px de large en natif.
     Aucune photographie ne dépasse cette largeur d'affichage tant que les fichiers
     haute définition (2400 px) ne sont pas livrés. Au-delà, les artefacts de génération
     (marques d'appareil inventées, tableau d'aéroport, écriture manuscrite) deviennent lisibles. */
  --maxw-photo: 900px;

  /* — Rayon (le luxe est net) — */
  --r-0: 0; --r-1: 2px; --r-2: 4px; --r-pill: 999px;

  /* — Ombres douces multi-couches — */
  --sh-1: 0 1px 2px rgba(74,37,48,.04), 0 6px 18px rgba(74,37,48,.05);
  --sh-2: 0 2px 6px rgba(74,37,48,.06), 0 18px 44px rgba(74,37,48,.10);
  --sh-3: 0 30px 80px rgba(74,37,48,.16);
  /* Objet POSÉ : une seule source de lumière, chaude, en haut à gauche. Une ombre
     symétrique dit « carte d'interface » ; une ombre décalée dit « objet sur une table ». */
  --sh-object: 14px 22px 38px rgba(74,37,48,.26), 4px 6px 12px rgba(74,37,48,.20);
  /* TRANCHE de cuir : liseré haut clair + creux bas. Sur tout champ plein (vert, noir). */
  --sh-edge-in: inset 0 2px 0 rgba(255,255,255,.14), inset 0 -3px 7px rgba(74,37,48,.30);

  /* — Matière — */
  --grain-op: .18;   /* surchargé par chapitre : le grain s'épaissit à mesure qu'on descend */

  /* — Mouvement éditorial — */
  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-soft: cubic-bezier(.4,0,.2,1);
  /* LA PRESSE — le geste signature. Départ instantané, arrêt SEC. Une matrice qui
     descend sur du cuir ne rebondit pas : aucune courbe élastique n'est admise ici. */
  --ease-press: cubic-bezier(.86,0,.07,1);
  --dur-1: .35s; --dur-2: .55s; --dur-3: .8s; --dur-4: 1.15s;
  --dur-press: .62s;      /* contact de la presse */
  --dur-emboss: .40s;     /* l'empreinte qui se referme, après contact */

  --nav-h: 74px;
  --announce-h: 38px; /* mesuré en JS (peut passer à 2 lignes en mobile) */
}

/* Mode nuit (footer, sections cuir) via [data-theme="noir"] */
[data-theme="noir"]{
  --bg: var(--noir);
  --fg: var(--paper);
  --ink: #F4F1E9;
  --ink-2: #D9CFC9;
  --ink-3: #BCA9AE;
  --line: #6B3A47;
  --bone: #331A22;
  --paper-2:#331A22;
  /* Sur cuir, le vert redevient l'encre : #5E6636 y serait illisible (2,97:1). */
  --ime-green-ink: var(--ime-green);
}