/*
 * Julien Orbit Motion — système typographique éditorial.
 *
 * Le thème d'origine s'appuyait sur « Arial Black » et sur une pile système :
 * c'est la signature immédiate d'un site non dessiné. Trois familles prennent
 * le relais, chacune avec un rôle précis :
 *
 *   Archivo          titres, en exploitant son axe de largeur variable
 *   Instrument Sans  texte courant
 *   JetBrains Mono   surtitres, numéros, prix — tout ce qui doit s'aligner
 *
 * Rien ici ne touche aux couleurs ni aux espacements du thème.
 */

:root {
	--jwd-display: "Archivo", "Arial Black", "Helvetica Neue", Arial, sans-serif;
	--jwd-body: "Instrument Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
	--jwd-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

/* ------------------------------------------------------------------
 * 1. Titres — largeur variable exploitée
 * ------------------------------------------------------------------ */

.jwd-type h1,
.jwd-type h2,
.jwd-type h3,
.jwd-type h4 {
	font-variation-settings: "wdth" 104;
	text-wrap: balance;
}

/*
 * Le titre principal est le seul élément de la page à porter la largeur
 * maximale : les capitales remplissent la ligne, la graisse reste sous le
 * plafond de la fonte, et l'approche se resserre à mesure que le corps grandit.
 */
.jwd-type .hero h1 {
	font-variation-settings: "wdth" 112;
	font-weight: 850;
	letter-spacing: -0.042em;
	line-height: 0.92;
}

.jwd-type .section-heading h2,
.jwd-type .process-intro h2,
.jwd-type .contact-copy h2,
.jwd-type .about-copy h2,
.jwd-type .results-copy h2,
.jwd-type .footer-cta h2 {
	font-variation-settings: "wdth" 108;
	font-weight: 800;
	letter-spacing: -0.032em;
	line-height: 0.96;
}

.jwd-type .service-card h3,
.jwd-type .price-card h3,
.jwd-type .project-card h3,
.jwd-type .process-list h3,
.jwd-type .about-values h3 {
	font-variation-settings: "wdth" 100;
	font-weight: 700;
	letter-spacing: -0.018em;
}

/* ------------------------------------------------------------------
 * 2. Texte courant
 * ------------------------------------------------------------------ */

body.jwd-type,
.jwd-type p,
.jwd-type li,
.jwd-type label,
.jwd-type input,
.jwd-type select,
.jwd-type textarea,
.jwd-type button {
	font-family: var(--jwd-body);
	font-feature-settings: "kern" 1, "liga" 1;
}

.jwd-type .hero__lead,
.jwd-type .section-heading > p,
.jwd-type .process-intro > p,
.jwd-type .about-copy p,
.jwd-type .results-copy > p,
.jwd-type .contact-copy > p {
	line-height: 1.62;
	letter-spacing: -0.004em;
}

/* ------------------------------------------------------------------
 * 3. Monospace — surtitres, numéros, prix
 *
 * Tout ce qui se lit comme une donnée passe en chasse fixe : les colonnes
 * s'alignent, et le contraste avec la grotesque des titres structure la page.
 * ------------------------------------------------------------------ */

.jwd-type .eyebrow,
.jwd-type .hero__stack li,
.jwd-type .proof-strip span,
.jwd-type .service-card__number,
.jwd-type .price-card__top span,
.jwd-type .price-card__price small,
.jwd-type .price-card__price span,
.jwd-type .price-card__badge,
.jwd-type .process-list > li > span,
.jwd-type .results-list > li > span,
.jwd-type .about-values article > span,
.jwd-type .project-card__meta > span,
.jwd-type .project-card__meta small,
.jwd-type .contact-details small,
.jwd-type .tag-list li,
.jwd-type .footer-motto,
.jwd-type .site-brand__descriptor,
.jwd-type .hero__signal-label,
.jwd-type .search-orbit__ring i {
	font-family: var(--jwd-mono);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

/* Les surtitres gagnent en tenue avec une approche plus large et un corps réduit. */
.jwd-type .eyebrow {
	font-size: 0.68rem;
	font-weight: 800;
	letter-spacing: 0.22em;
}

/* Les prix s'alignent au chiffre près d'une carte à l'autre. */
.jwd-type .price-card__price strong,
.jwd-type .about-system__core strong,
.jwd-type .proof-strip strong {
	font-family: var(--jwd-display);
	font-variation-settings: "wdth" 96;
	font-variant-numeric: tabular-nums lining-nums;
	letter-spacing: -0.03em;
}

/* ------------------------------------------------------------------
 * 4. Navigation et boutons
 * ------------------------------------------------------------------ */

.jwd-type .primary-menu a,
.jwd-type .footer-menu a {
	font-family: var(--jwd-body);
	font-weight: 600;
	letter-spacing: -0.005em;
}

.jwd-type .button,
.jwd-type .header-cta,
.jwd-type .text-link {
	font-family: var(--jwd-body);
	font-weight: 650;
	letter-spacing: -0.008em;
}

/* ------------------------------------------------------------------
 * 5. Repli si la fonte variable n'est pas disponible
 * ------------------------------------------------------------------ */

@supports not (font-variation-settings: "wdth" 100) {
	.jwd-type h1,
	.jwd-type h2,
	.jwd-type h3,
	.jwd-type h4 {
		font-stretch: expanded;
	}
}