/*
 * ============================================================================
 * Typographie vitrine — SOURCE UNIQUE
 * Changer les polices / tailles ICI uniquement.
 * ============================================================================
 * Rôles :
 *   --font-title    → titres (H1, H2, __title) — Genos (futuriste)
 *   --font-subtitle → sous-titres (H3, leads) — Exo 2
 *   --font-body     → corps / UI / formulaires — Manrope
 *   --font-code     → code uniquement — JetBrains Mono
 * ============================================================================
 */

:root {
  /* —— Familles (seul endroit à modifier pour changer les polices) —— */
  --font-title: "Genos", ui-sans-serif, system-ui, sans-serif;
  --font-subtitle: "Exo 2", ui-sans-serif, system-ui, sans-serif;
  --font-body: "Manrope", ui-sans-serif, system-ui, sans-serif;
  --font-code: "JetBrains Mono", ui-monospace, SFMono-Regular, "SF Mono", Consolas, "Liberation Mono", Menlo, monospace;

  /* —— Échelle de tailles (identique sur toutes les pages) —— */
  --fs-hero: clamp(2.4rem, 4.6vw, 3.85rem); /* H1 page */
  --fs-title: clamp(2rem, 3.35vw, 3.15rem); /* H2 section */
  --fs-subtitle: clamp(1.2rem, 1.85vw, 1.55rem); /* H3 / sous-titres de cartes */
  --fs-lead: clamp(1.05rem, 1.3vw, 1.2rem); /* texte d'intro sous un titre */
  --fs-body: clamp(1.025rem, calc(.75rem + .375vw), 1.125rem); /* paragraphe courant */
  --fs-small: 0.9375rem;
  --fs-label: 0.72rem; /* kickers / labels tech */
  --fs-card-title: clamp(1.15rem, 1.55vw, 1.4rem);
  --fs-input: 1rem;
  --fs-button: .9375rem;
  --fs-nav: .9375rem;
  /* Rôles grands écrans, partagés avec les compositions qui ont leur propre
     échelle de titres. La base rem préserve l'effet du zoom utilisateur. */
  --type-hero-wide: clamp(3.85rem, calc(1.95rem + 1.9vw), 7rem);
  --type-title-wide: clamp(3.15rem, calc(1.45rem + 1.7vw), 6rem);
  --type-subtitle-wide: clamp(1.55rem, calc(1.05rem + .5vw), 2.5rem);
  --type-lead-wide: clamp(1.2rem, calc(.8rem + .4vw), 1.875rem);
  --type-body-wide: clamp(1.125rem, calc(.925rem + .2vw), 1.5rem);
  --type-small-wide: clamp(.9375rem, calc(.775rem + .1625vw), 1.25rem);
  --type-label-wide: clamp(.72rem, calc(.56rem + .16vw), 1rem);
  --type-ui-wide: clamp(.8125rem, calc(.5625rem + .25vw), 1.25rem);
  --type-ui-small-wide: clamp(.6875rem, calc(.4875rem + .2vw), 1rem);

  /* Alias legacy (Tailwind @theme / anciens tokens) */
  --font-sans: var(--font-body);
  --font-display: var(--font-title);
  --font-mono: var(--font-code);
}

/* —— Base —— */
html {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: 400;
  line-height: 1.7;
}

/* ============================================================================
 * TITRES — Genos
 * H1 / H2 / BEM *__title (hors H3/H4 → Exo 2)
 * ============================================================================ */
.type-hero,
.type-title,
.type-stat,
main h1,
main h2,
.font-display,
[class*="__title"]:not(h3):not(h4):not([class*="__subtitle"]):not([class*="__lead"]):not([class*="card-title"]):not([class*="panel-title"]):not([class*="situation-title"]):not([class*="need-title"]):not([class*="case-title"]):not([class*="cell-title"]):not([class*="rail-title"]),
.lm-title,
.lm-visual__title {
  font-family: var(--font-title) !important;
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.08;
}

/* H1 / héros — hors titres de documents juridiques */
.type-hero,
main h1:not(.legal-doc__title):not(.blog-article__title),
.svc-hero__title,
.blog-hero__title,
.sci-hero__title,
.desk-hero__title,
.mob-hero__title {
  font-size: var(--fs-hero) !important;
}

/* H2 / titres de section */
.type-title,
main h2:not(.legal-doc__content *):not(.blog-article__content *),
.svc-fit__title,
.svc-xp__title,
.svc-real__title,
.svc-final-cta__title,
.blog-ed__title,
.blog-cta-card__title,
.blog-h2,
.sci-panel__title,
.sci-types__title,
.sci-constraints__title,
.sci-perf__title,
.sci-maintain__title,
.sci-integ__title,
.sci-method-flow__title,
.sci-refs__title,
.sci-why__title,
.sci-contact__title,
.sci-model__title,
.sci-tech__title {
  font-size: var(--fs-title) !important;
  font-weight: 700;
}

/* Stats / grands chiffres (non sémantiques) */
.type-stat {
  font-size: var(--fs-title) !important;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.1;
}

/* ============================================================================
 * SOUS-TITRES — Exo 2
 * H3, titres de cartes, leads d'intro
 * ============================================================================ */
.type-subtitle,
.type-lead,
.type-card-title,
main h3:not(.rx-card-title):not(.cf-person__name):not(.cf-location__title):not(.home-folio__chapter-title):not(.blog-article__content *):not(.legal-doc__content *),
main h4,
[class*="__lead"],
/* __subtitle éditorial — exclure les kickers tech (ex. svc-tech-ring__subtitle) */
[class*="__subtitle"]:not(.svc-tech-ring__subtitle),
[class*="__heading"],
.sci-method-flow__heading,
.sci-why__panel-text,
.sci-why__sheet-sub,
.sci-why__step-title,
.sci-perf__subtitle,
.sci-maintain__chapter-title,
.blog-ed__heading,
.blog-ed__rail-title,
.rx-card-desc,
.cf-label,
.lm-visual__subtitle,
.lm-lead {
  font-family: var(--font-subtitle) !important;
  letter-spacing: -0.015em;
}

/* Titres de projets (Réalisations) — Genos, police de titres */
.rx-project-card .rx-card-title {
  font-family: var(--font-title) !important;
  letter-spacing: -0.02em;
}

/* H3 / sous-titres de section & cartes */
.type-subtitle,
.type-card-title,
main h3:not(.rx-card-title):not(.cf-person__name):not(.cf-location__title):not(.home-folio__chapter-title):not(.blog-article__content *):not(.legal-doc__content *),
.svc-final-cta__subtitle,
.svc-fit__cell-title,
.svc-xp__panel-title,
.svc-real__case-title,
.svc-why__col-title,
.sci-types-card__title,
.sci-constraints__card-title,
.sci-constraints__need-title,
.sci-why__panel-title,
.sci-contact__situation-title,
.sci-model__pane-title,
.sci-integ__panel-title,
.sci-method-flow__heading,
.sci-perf__subtitle,
.sci-maintain__chapter-title,
.blog-ed__heading,
.blog-filter-panel__title,
.rx-xp-card__title {
  font-family: var(--font-subtitle) !important;
  font-size: var(--fs-subtitle) !important;
  font-weight: 600;
  line-height: 1.25;
}

.rx-project-card .rx-card-title {
  font-size: var(--fs-card-title) !important;
  font-weight: 700;
  line-height: 1.2;
}

main h4 {
  font-family: var(--font-subtitle) !important;
  font-size: var(--fs-h4, clamp(1.05rem, 1.4vw, 1.2rem)) !important;
  font-weight: 600;
  line-height: 1.3;
}

/* Leads / intros */
.type-lead,
[class*="__lead"],
.sci-panel__lead,
.sci-types__lead,
.sci-constraints__lead,
.sci-perf__lead,
.sci-maintain__lead,
.sci-integ__intro,
.sci-refs__lead,
.sci-contact__lead,
.sci-model__lead,
.sci-why__panel-text,
.blog-hero__lead,
.svc-hero__lead,
.svc-fit__lead,
.svc-xp__lead,
.svc-real__lead,
.desk-hero__lead,
.mob-hero__lead,
.lm-lead,
main h1 + p,
main h2 + p {
  font-family: var(--font-subtitle) !important;
  font-size: var(--fs-lead) !important;
  font-weight: 500;
  line-height: 1.65;
}

.rx-card-desc,
.blog-ed__rail-title {
  font-size: var(--fs-small) !important;
  font-weight: 400;
  line-height: 1.6;
}


/* Intros de section Tailwind (pas les paragraphes de cartes en text-lg) */
main p.type-lead,
main p.max-w-4xl.text-lg,
main p.max-w-3xl.text-lg,
main p.max-w-2xl.text-xl,
main p.max-w-3xl.text-base.md\:text-lg,
main p.max-w-2xl.text-base.md\:text-lg {
  font-family: var(--font-subtitle) !important;
  font-size: var(--fs-lead) !important;
  font-weight: 500;
  line-height: 1.65;
}
/* ============================================================================
 * CORPS — Manrope
 * ============================================================================ */
.type-body,
main p:not([class*="__lead"]):not(.type-lead):not([class*="__title"]):not([class*="__subtitle"]):not([class*="__kicker"]):not([class*="__eyebrow"]):not([class*="__topic"]):not([class*="__meta"]):not(.rx-label):not(.type-label):not(.font-mono):not(.results-hud-num):not(.desk-meta):not(.mob-meta):not(.desk-chips):not(.mob-chips):not(.rx-card-sectors):not(.blog-article__content *):not(.legal-doc__content *),
main li:not(.blog-article__content *):not(.legal-doc__content *),
main td,
main th,
main label:not(.cf-label):not(.rx-label),
main input,
main textarea,
main select,
main blockquote:not(.blog-article__content *):not(.legal-doc__content *),
.cf-field,
.glass-input-wrap input,
.rx-select-trigger,
.rx-select-option {
  font-family: var(--font-body) !important;
}

main p:not([class*="__lead"]):not(.type-lead):not([class*="__title"]):not([class*="__subtitle"]):not([class*="__kicker"]):not([class*="__eyebrow"]):not([class*="__topic"]):not([class*="__meta"]):not(.rx-label):not(.type-label):not(.font-mono):not(.results-hud-num):not(.desk-meta):not(.mob-meta):not(.desk-chips):not(.mob-chips):not(.rx-card-sectors):not(.blog-article__content *):not(.legal-doc__content *),
main li:not(.blog-article__content *):not(.legal-doc__content *),
main blockquote:not(.blog-article__content *):not(.legal-doc__content *),
.type-body {
  font-size: var(--fs-body) !important;
  font-weight: 400;
  line-height: 1.7;
}

main input,
main textarea,
main select,
.cf-field,
.glass-input-wrap input,
.rx-select-trigger,
.rx-select-option {
  font-size: var(--fs-input) !important;
  font-weight: 400;
  line-height: 1.625;
}

/* Labels tech / kickers — Genos compact (réf. Nos réalisations) */
.type-label,
.rx-label,
.font-label,
.sci-kicker,
.ch-globe-skel-label,
.blog-label,
.lm-kicker,
[class*="__kicker"],
[class*="__eyebrow"],
[class*="__topic"],
.blog-cta-card__eyebrow,
.blog-filter-panel__eyebrow,
main p.font-mono.uppercase,
main p.font-mono.font-semibold.uppercase {
  font-family: var(--font-title) !important;
  font-size: var(--fs-label) !important;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  line-height: 1.3;
}

.rx-badge,
.rx-tag-pill,
.rx-card-cta,
.rx-step-num,
.glass-chip,
.seg-btn {
  font-family: var(--font-title) !important;
  letter-spacing: 0.04em;
}

/* Navigation & CTAs — corps Manrope (lisibilité) */
#site-header,
#site-header nav,
#mobile-drawer nav,
#site-header a,
#mobile-drawer a,
.nav-auth-cta,
.vitrine-cta,
.rx-cta,
.svc-hero__cta,
.blog-cta-card__btn,
.sci-hero-btn,
.sci-contact__btn {
  font-family: var(--font-body) !important;
}

/* Menu mobile — titres Genos, sous-liens Manrope */
#mobile-drawer .nav-m__link,
#mobile-drawer .nav-m__brand-name {
  font-family: var(--font-title) !important;
  letter-spacing: -0.01em;
}
#mobile-drawer .nav-m__sub-link,
#mobile-drawer .nav-m__auth-link {
  font-family: var(--font-body) !important;
  letter-spacing: 0;
}

/* Code (fenêtres hero, blocs technique) */
.font-code,
pre,
code,
kbd,
samp,
.font-mono:not(.uppercase):not([class*="__kicker"]):not([class*="__eyebrow"]):not(.type-label):not(.rx-label) {
  font-family: var(--font-code) !important;
  letter-spacing: 0;
}

/* Utilitaires explicites (à poser dans le markup si besoin) */
.type-hero {
  font-family: var(--font-title) !important;
  font-size: var(--fs-hero) !important;
}
.type-title {
  font-family: var(--font-title) !important;
  font-size: var(--fs-title) !important;
}
.type-subtitle {
  font-family: var(--font-subtitle) !important;
  font-size: var(--fs-subtitle) !important;
}
.type-lead {
  font-family: var(--font-subtitle) !important;
  font-size: var(--fs-lead) !important;
}
.type-body {
  font-family: var(--font-body) !important;
  font-size: var(--fs-body) !important;
}
.type-label {
  font-family: var(--font-title) !important;
  font-size: var(--fs-label) !important;
}
.type-card-title {
  font-family: var(--font-subtitle) !important;
  font-size: var(--fs-subtitle) !important;
}
.type-stat {
  font-family: var(--font-title) !important;
  font-size: var(--fs-title) !important;
}

/* Le mobile conserve son échelle. Chaque rôle progresse encore à 1920,
   2560 et 3840px CSS ; aucun changement de la taille racine du document. */
@media (min-width: 1600px) {
  :root {
    --fs-hero: var(--type-hero-wide);
    --fs-title: var(--type-title-wide);
    --fs-subtitle: var(--type-subtitle-wide);
    --fs-lead: var(--type-lead-wide);
    --fs-body: var(--type-body-wide);
    --fs-small: var(--type-small-wide);
    --fs-label: var(--type-label-wide);
    --fs-h4: clamp(1.2rem, calc(.85rem + .35vw), 1.75rem);
    --fs-card-title: clamp(1.4rem, calc(.9rem + .5vw), 2.25rem);
    --fs-input: clamp(1rem, calc(.8rem + .2vw), 1.375rem);
    --fs-button: clamp(.9375rem, calc(.75rem + .1875vw), 1.25rem);
    --fs-nav: clamp(.9375rem, calc(.7125rem + .225vw), 1.25rem);
  }
}
