/* Primitives: unchanged Yam design values. */
:root {
  --ink-900: #111;
  --ink-500: #5a5a5a;
  --ink-300: #a8a8a8;
  --paper-50: #f2f1ed;
  --paper-white: #fff;
  --yellow-500: #ffe600;
  --yellow-600: #ffc700;
  --size-0: 0px;
  --size-4: 4px;
  --size-8: 8px;
  --size-12: 12px;
  --size-14: 14px;
  --size-16: 16px;
  --size-18: 18px;
  --size-20: 20px;
  --size-24: 24px;
  --size-36: 36px;
  --size-48: 48px;
  --size-64: 64px;
  --size-96: 96px;

  /* Semantic roles. The dark theme overrides roles, never brand primitives. */
  --color-text: var(--ink-900);
  --color-text-strong: var(--color-text);
  --color-surface: var(--paper-white);
  --color-background: var(--paper-50);
  --color-muted: var(--ink-500);
  --color-subtle: var(--ink-300);
  --color-yellow: var(--yellow-500);
  --color-accent: var(--yellow-600);
  --font-heading: Epilogue, sans-serif;
  --font-body: Inter, sans-serif;
  /* Editorial roles (guides, long text). Fluid sizes from 375 to 1440px, rem + vw. */
  --type-display: clamp(2.25rem, 1.545rem + 3.005vw, 3.5rem);
  --type-title: clamp(1.625rem, 1.405rem + 0.939vw, 2.25rem);
  --type-subtitle: clamp(1.375rem, 1.331rem + 0.188vw, 1.5rem);
  --type-lead: clamp(1.125rem, 1.081rem + 0.188vw, 1.25rem);
  --type-body: clamp(1rem, 0.978rem + 0.094vw, 1.0625rem);
  --type-small: var(--size-14);
  --type-label: 0.6875rem;
  --leading-display: 1.08;
  --leading-title: 1.2;
  --leading-lead: 1.45;
  --leading-body: 1.6;
  --leading-ui: 1.2;
  --tracking-display: -0.035em;
  --tracking-title: -0.02em;
  --tracking-caps: 0.12em;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-strong: 600;
  --measure-lead: 60ch;
  --measure-title: 18ch;
  --measure-card: 45ch;
  --rule-width: 1px;
  --rule-strong: var(--rule-width) solid var(--color-text);
  --rule-subtle: var(--rule-width) solid color-mix(in srgb, var(--color-text) 16%, transparent);
  --accent-bar: 3px solid var(--color-text);
  --focus-ring: 2px solid var(--color-text);
  --space-stack: var(--size-12);
  --space-block: var(--size-24);
  --space-part: calc(var(--size-48) + var(--size-8));
  --space-section: var(--size-64);
  --space-page-top: calc(var(--size-96) + var(--size-24));
  --space-page-bottom: var(--size-96);
  --motion-quick: 200ms ease;
  --motion-swap: 320ms ease;
  --space-heading: calc(var(--size-96) + var(--size-24));
  --ratio-media: 3 / 2;
  --avatar-size: var(--size-36);
  --avatar-size-lg: var(--size-64);
  --avatar-scale-small: 0.85;
  --ratio-portrait: 4 / 5;
  /* Grille officielle des nouvelles pages : 12 / 8 / 4 colonnes dans le conteneur du site
     (1440 px, marges 64 / 24 / 8 px). Home, À propos, Contact et fiches projets gardent leur mise en page. */
  --layout-max: 90rem;
  --layout-margin: var(--size-64);
  --grid-columns: 12;
  --grid-gap: var(--size-24);
  /* Guides : colonnes occupées sur cette grille. */
  --guide-start: 1;
  --guide-toc-span: 3;
  --guide-text-span: 8;
  --guide-cards: 3;
  --carousel-span: 5;
  --carousel-of: 8;
  /* Outil ?grid. */
  --debug-grid: rgb(255 0 128 / 0.1);
  --debug-grid-line: rgb(255 0 128 / 0.6);
  /* Pages métiers existantes : valeurs de la mise en page Webflow en production (blocs .ed-*). */
  --ed-max: 90rem;
  --ed-wrap-max: 82.5rem;
  --ed-hero-margin: 9.25rem;
  --ed-gap-hero: 2.5rem 1.25rem;
  --ed-section-y: var(--size-96);
  --ed-section-x: var(--size-64);
  --ed-sticky-top: 7.5rem;
  --ed-space-m: 2rem;
  --ed-h2-space: 3.5rem;
  --ed-type-h1: 4rem;
  --ed-type-h2: 3.5rem;
  --ed-type-lead: 1.5rem;
  --ed-type-title: 1.3125rem;
  --ed-type-note: 0.75rem;
  --ed-type-list: 0.8125rem;
  --ed-type-button: 1.125rem;
  --ed-type-cas: 6rem;
  --ed-type-cartel: 0.75rem;
  --ed-type-rl: 1.625rem;
  --ed-type-rl-t: 1.0625rem;
  --ed-type-rl-d: 0.625rem;
  --leading-ed-h1: 0.9;
  --leading-ed-h2: 1.02;
  --leading-ed-lead: 1.35;
  --leading-ed-title: 1.25;
  --leading-ed-copy: 1.7;
  --leading-ed-list: 1.9;
  --leading-ed-cas: 0.9;
  --leading-ed-resume: 1.6;
  --leading-ed-cartel: 1.4;
  --tracking-ed-h2: -0.03em;
  --tracking-ed-small: -0.01em;
  --tracking-ed-cas: -0.04em;
  --tracking-ed-cartel: 0.08em;
  --measure-ed-lead: 29rem;
  --measure-ed-copy: 34.25rem;
  --measure-ed-note: 24.625rem;
  --measure-ed-cas: 25.4rem;
  --ed-list-indent: 2.4375rem;
  --ed-rl-columns: 4.5rem 9rem minmax(0, 1.2fr) minmax(0, 1.5fr) minmax(0, 1fr);
  --ed-rl-gap: var(--ed-space-m);
  --ed-rl-pad: 0.875rem var(--size-24);
  --ed-rl-thumb: 8rem;
  --leading-ed-rl: 1.1;
  --ed-header: 6.25rem;
  --ed-line-space: 0.625rem;
  --ed-cas-min: 40.5rem;
  --ed-arrow: 1.0625rem;
  --measure-ed-tagline: 15.35rem;
  --ed-cas-tab-shift: 8.25rem;
  --ed-cas-tab-pad: var(--size-20) var(--size-36);
  /* Component roles. */
  --nav-ink: var(--color-text);
  --projector-ink: var(--color-text);
  --footer-ink: var(--color-text);
}
@media screen and (min-width: 75em) {
  :root {
    --guide-start: 4;
    --guide-text-span: 6;
    --carousel-span: 4;
    --carousel-of: 6;
  }
}
@media screen and (max-width: 61.9375em) {
  :root {
    --layout-margin: var(--size-24);
    --grid-columns: 8;
    --grid-gap: var(--size-16);
    --guide-text-span: 7;
    --guide-cards: 2;
    --carousel-span: 5;
    --carousel-of: 7;
  }
}
@media screen and (max-width: 29.9375em) {
  :root {
    --layout-margin: var(--size-8);
    --grid-columns: 4;
    --grid-gap: var(--size-8);
    --guide-text-span: 4;
    --guide-cards: 1;
    --carousel-span: 3;
    --carousel-of: 4;
  }
}
@media screen and (max-width: 61.9375em) {
  :root {
    --ed-hero-margin: var(--size-24);
    --ed-section-y: var(--size-64);
    --ed-section-x: var(--size-24);
    --ed-type-h2: 2.5rem;
    --ed-h2-space: 2.5rem;
    --ed-type-cas: 4rem;
    --ed-rl-columns: 3rem 6.5rem minmax(0, 1fr);
    --ed-rl-gap: var(--size-16);
    --ed-rl-pad: var(--size-12) 0;
    --ed-rl-thumb: 5.5rem;
    --ed-cas-tab-shift: 0rem;
    --ed-cas-min: 0rem;
  }
}
@media screen and (max-width: 47.9375em) {
  :root {
    --ed-hero-margin: var(--size-20);
    --ed-section-y: var(--size-48);
    --ed-section-x: var(--size-20);
    --ed-type-h2: 2rem;
    --ed-h2-space: var(--ed-space-m);
    --ed-type-lead: 1.25rem;
    --ed-type-cas: 3rem;
    --ed-type-rl: 1.1875rem;
    --ed-cas-tab-pad: var(--size-16) var(--size-20);
  }
}

/* Méga-menu Services v2 (test ?mm=v2) : hauteur, rythme des lignes, typo, temps d'ouverture. */
:root {
  --mm2-height: clamp(30rem, 62svh, 46rem);
  --mm2-pad-y: var(--size-24);
  --mm2-pad-x: var(--size-48);
  --mm2-row-min: 7.75rem;
  --mm2-row-pad: var(--size-16);
  --mm2-num: 2.9rem;
  --mm2-type-name: 2.125rem;
  --mm2-type-sub: 0.8125rem;
  --mm2-type-pv: var(--type-title);
  --mm2-gap: var(--size-12);
  --mm2-shift: var(--size-8);
  --mm2-rise: var(--size-16);
  --mm2-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --mm2-open: 560ms;
  --mm2-close: 320ms;
  --mm2-fade: 420ms;
  --mm2-stagger: 70ms;
  --mm2-chevron: 6px;
  --mm2-chevron-line: 1.2px;
  --mm2-shadow: 0 var(--size-24) var(--size-48) calc(var(--size-24) * -1) color-mix(in srgb, var(--ink-900) 28%, transparent);
}
/* Écrans bas : lignes plus compactes pour que tout le panneau reste visible. */
@media (max-height: 52em) {
  :root {
    --mm2-row-min: 5.5rem;
    --mm2-row-pad: var(--size-8);
    --mm2-pad-y: var(--size-16);
  }
}

/* Bandeau de consentement (cookies). */
:root {
  --consent-max: 21rem;
  --consent-button: 2.75rem;
  --consent-inset: var(--size-16);
  --consent-shadow: 0 var(--size-12) var(--size-36) calc(var(--size-12) * -1) color-mix(in srgb, var(--ink-900) 30%, transparent);
}
