/* Système de design GamyGroup — refonte v3.0.
   Jetons de couleur, typographie et polices auto-hébergées. Tout le reste
   du CSS en dérive : aucune couleur ni taille codée en dur ailleurs.

   Direction reprise de la maquette Claude Design « GamyGroup Refonte ».
   Le PRD §6.1 demandait de définir ce qui relie GamyGroup à SINAI-INVEST
   et ce qui les sépare : les deux partagent la géométrie (angles à 2 px,
   filets 1 px, grilles à gouttière) et le bleu #1360EF ; GamyGroup s'en
   détache par sa couleur signal orange et son papier chaud, là où
   SINAI-INVEST reste sur un bleu seul et un papier froid. */

/* ---------- Polices auto-hébergées (latin + latin-ext) ----------
   Space Grotesk est variable (400→700) : un fichier par sous-ensemble.
   IBM Plex Sans et Mono sont statiques : un fichier par graisse.
   Noms de fichiers volontairement simples — un suffixe de hachage dans
   le nom déclenche le blocage de certaines passerelles d'entreprise. */

@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../fonts/space-grotesk-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../fonts/space-grotesk-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/ibm-plex-sans-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/ibm-plex-sans-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/ibm-plex-sans-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/ibm-plex-sans-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/ibm-plex-sans-600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/ibm-plex-sans-600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/ibm-plex-mono-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/ibm-plex-mono-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/ibm-plex-mono-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/ibm-plex-mono-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/ibm-plex-mono-600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/ibm-plex-mono-600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* ---------- Encre et papier ---------- */
  --gg-ink: #0B1120;          /* encre : texte, sections sombres, en-tête */
  --gg-ink-2: #131A2A;        /* panneau sur encre (menu déroulant) */
  --gg-ink-3: #0F1626;        /* encart en creux dans un panneau encre */
  --gg-ink-line: #26314A;     /* filet sur encre opaque */
  --gg-ink-strong: #1A2233;   /* texte appuyé sur papier */

  --gg-paper: #F6F5F2;        /* papier chaud — fond par défaut */
  --gg-paper-2: #ECEAE4;      /* papier alterné, une section sur deux */
  --gg-white: #FFFFFF;

  /* ---------- Bleu de marque (lien de parenté avec SINAI-INVEST) ---------- */
  --gg-blue: #1360EF;
  --gg-blue-deep: #1240A8;
  --gg-blue-pale: #E9F0FF;    /* aplat d'appui, jamais un dégradé */

  /* ---------- Signal orange (ce qui sépare GamyGroup de SINAI-INVEST) ----
     Réservé au point du logotype, aux CTA et au marquage de l'étape 04
     (transfert de connaissances). Sa rareté fait sa force : dès qu'il
     souligne tout, il ne souligne plus rien. */
  --gg-signal: #FF5B26;
  --gg-signal-soft: #FFC3AB;  /* même famille, sur fond encre */
  --gg-signal-pale: #FFE9E1;  /* aplat d'étiquette métrique */

  /* ---------- Neutres travaillés (PRD §6.2) ----------
     Tirés vers le beige, jamais un gris pur : ils accompagnent le papier
     chaud au lieu de le refroidir. */
  --gg-line: #DAD7CF;         /* filet 1 px sur papier */
  --gg-line-strong: #C9C6BE;  /* bordure de champ, contour de carte */
  --gg-line-dashed: #9C988E;  /* contour tireté (étiquette capacité) */
  --gg-muted: #4A5060;        /* texte de soutien */
  --gg-muted-2: #6E7280;      /* étiquettes monospace */
  --gg-muted-3: #3A4152;      /* texte d'étiquette encadrée */
  --gg-placeholder: #8B8880;  /* texte indicatif de formulaire */
  --gg-hatch-a: #E6E3DC;      /* hachures d'emplacement d'image */
  --gg-hatch-b: #EFEDE7;

  /* ---------- Sur fond encre ---------- */
  --gg-on-ink: #F6F5F2;
  --gg-on-ink-body: #A8B0C0;
  --gg-on-ink-mute: #8E97A8;
  --gg-on-ink-soft: #B9C1D2;
  --gg-on-ink-faint: #6E7A92;
  --gg-on-ink-dim: #3A4560;
  --gg-on-ink-line: rgba(246, 245, 242, 0.16);
  --gg-on-ink-line-2: rgba(246, 245, 242, 0.28);
  --gg-on-ink-body-2: rgba(246, 245, 242, 0.72);

  /* ---------- Erreur ---------- */
  --gg-error: #B4462A;
  --gg-error-bg: #FFF3EF;

  /* ---------- Typographie ----------
     Trois rôles, comme l'exige le PRD §6.2 : un display caractériel, un
     texte courant, et une monospace pour les noms de technologies, les
     étapes numérotées et les libellés de données. */
  --gg-display: 'Space Grotesk', 'Segoe UI', system-ui, sans-serif;
  --gg-body: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --gg-mono: 'IBM Plex Mono', ui-monospace, 'Cascadia Mono', Consolas, monospace;

  /* ---------- Géométrie ---------- */
  --gg-radius: 2px;           /* angle légèrement adouci, jamais arrondi */
  --gg-hairline: 1px;
  --gg-rule: 2px;             /* soulignement d'onglet actif, filet d'étape */

  /* ---------- Rythme ---------- */
  --gg-max: 1240px;
  --gg-margin: 56px;          /* marge horizontale bureau (maquette) */
  --gg-margin-mobile: 20px;
  --gg-section: 88px;
  --gg-section-tight: 72px;
  --gg-header-h: 76px;
  --gg-hit: 44px;             /* cible tactile minimale (WCAG 2.1 AA) */
}