/*
 * Styles e-Globulo — alignés sur les wireframes (PC/Tablette/Mobile) et le
 * design system fourni (wireframe design/_ds/.../colors_and_type.css).
 * Polices Gotham et Kalista Script sont commerciales (licences EFS à
 * confirmer pour le domaine globulo-mag.fr, cf. document §13) ; Rift est la
 * police condensée réellement fournie par l'EFS pour les accents/chiffres
 * (le document mentionnait Bebas Neue, mais les fichiers fournis sont Rift).
 */

/* ============================================================
   POLICES
   ============================================================ */
@font-face {
	font-family: 'Rift';
	src: url('../fonts/Rift_Medium.otf') format('opentype');
	font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
	font-family: 'Rift';
	src: url('../fonts/Rift_Bold.otf') format('opentype');
	font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
	font-family: 'Gotham';
	src: url('../fonts/Gotham-Light.otf') format('opentype');
	font-weight: 300; font-style: normal; font-display: swap;
}
@font-face {
	font-family: 'Gotham';
	src: url('../fonts/Gotham-Book.otf') format('opentype');
	font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
	font-family: 'Gotham';
	src: url('../fonts/Gotham-BookItalic.otf') format('opentype');
	font-weight: 400; font-style: italic; font-display: swap;
}
@font-face {
	font-family: 'Gotham';
	src: url('../fonts/Gotham-Medium.otf') format('opentype');
	font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
	font-family: 'Gotham';
	src: url('../fonts/Gotham_Italic.otf') format('opentype');
	font-weight: 500; font-style: italic; font-display: swap;
}
@font-face {
	font-family: 'Gotham';
	src: url('../fonts/Gotham-Bold.otf') format('opentype');
	font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
	font-family: 'Gotham';
	src: url('../fonts/Gotham_Bold_Italic.ttf') format('truetype');
	font-weight: 700; font-style: italic; font-display: swap;
}
@font-face {
	font-family: 'Gotham';
	src: url('../fonts/Gotham-Black.otf') format('opentype');
	font-weight: 800; font-style: normal; font-display: swap;
}
@font-face {
	font-family: 'Gotham';
	src: url('../fonts/Gotham-Ultra.otf') format('opentype');
	font-weight: 900; font-style: normal; font-display: swap;
}
@font-face {
	font-family: 'Freight Macro';
	src: url('../fonts/FreigMacProMed.otf') format('opentype');
	font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
	font-family: 'Freight Macro';
	src: url('../fonts/FreigMacProBol.otf') format('opentype');
	font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
	font-family: 'Kalista Script';
	src: url('../fonts/Kalista_Script_Bold.otf') format('opentype');
	font-weight: 700; font-style: normal; font-display: swap;
}

/* ============================================================
   TOKENS
   ============================================================ */
:root {
	--efs-navy:  #03326C;
	--efs-red:   #E3051B;
	--efs-white: #FFFFFF;
	--efs-paper: #F6F4EF;
	--efs-ink:   #1A1A1A;

	--gray-900: #1A1A1A;
	--gray-800: #2B2B2B;
	--gray-700: #444444;
	--gray-600: #5C5C5C;
	--gray-500: #7A7A7A;
	--gray-400: #A3A3A3;
	--gray-300: #C8C8C8;
	--gray-200: #E0E0E0;
	--gray-100: #EFEFEF;
	--gray-050: #F8F8F8;

	--accent-lagon:  #4BBDCF;
	--accent-blue:   #0069B4;
	--accent-yellow: #FCBC00;
	--accent-violet: #5553D3;
	--accent-orange: #FF8035;

	/* couleurs de rubrique (doivent rester alignées sur GLOBULO_RUBRIQUES en PHP) */
	--globulo-dossier: var(--efs-red);
	--globulo-projets-perspectives: var(--accent-violet);
	--globulo-quoi-de-neuf-docteur: var(--accent-orange);
	--globulo-c-est-pratique: var(--accent-lagon);
	--globulo-actu-hsedd-rh: var(--accent-yellow);

	--font-display:   'Gotham', 'Helvetica Neue', Arial, sans-serif;
	--font-condensed: 'Rift', 'Helvetica Neue Condensed', 'Arial Narrow', sans-serif;
	--font-sans:      'Gotham', 'Helvetica Neue', Arial, sans-serif;
	--font-body:      'Gotham', 'Helvetica Neue', Arial, sans-serif;
	--font-serif:     'Freight Macro', 'Times New Roman', Georgia, serif;
	--font-script:    'Kalista Script', 'Snell Roundhand', cursive;

	--r-xs: 2px; --r-sm: 4px; --r-md: 8px; --r-lg: 14px; --r-xl: 20px; --r-pill: 999px;
	--shadow-1: 0 1px 2px rgba(3, 50, 108, .08);
	--shadow-2: 0 4px 12px rgba(3, 50, 108, .10), 0 1px 3px rgba(3, 50, 108, .06);
	--shadow-3: 0 12px 28px rgba(3, 50, 108, .14), 0 4px 10px rgba(3, 50, 108, .08);

	--content-width: 1290px;
	--content-pad: 24px;
}

/* ============================================================
   RESET + BASE
   ============================================================ */
* { box-sizing: border-box; }
html { font-family: var(--font-body); color: var(--gray-900); }
body { margin: 0; background: var(--efs-white); overflow-x: hidden; }
img { max-width: 100%; display: block; }
a { color: var(--efs-red); text-decoration: none; }
a:hover { color: #B30414; }
button { font-family: inherit; cursor: pointer; }

.globulo-warning {
	color: var(--efs-red);
	font-size: 12px;
	font-weight: 600;
	margin: 4px 0 0;
}

h1, h2, h3 {
	font-family: var(--font-display);
	color: var(--efs-navy);
	margin: 0 0 12px;
}
h2 { font-weight: 800; font-size: clamp(28px, 3.2vw, 42px); line-height: 1.15; letter-spacing: -0.01em; }
h3 { font-weight: 700; font-size: clamp(20px, 2vw, 26px); line-height: 1.2; }
p { margin: 0 0 14px; line-height: 1.6; }

.globulo-content {
	max-width: var(--content-width);
	margin: 0 auto;
	padding: 0 var(--content-pad);
}

/* Bandeau eyebrow générique (petites majuscules espacées) */
.globulo-eyebrow {
	font-family: var(--font-sans);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--gray-600);
}

/* Pastille de rubrique générique (couleur pilotée par --pill-color inline) */
.globulo-hero-dossier__pill,
.globulo-dossier-rappel__pill,
.globulo-push__pill,
.globulo-pastille-rubrique {
	display: inline-flex;
	align-items: center;
	padding: 7px 16px;
	border-radius: var(--r-pill);
	font-family: var(--font-sans);
	font-weight: 700;
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #fff;
	background: var(--pill-color, var(--efs-navy));
}

/* ============================================================
   HEADER
   ============================================================ */
.globulo-header {
	max-width: var(--content-width);
	margin: 0 auto;
	padding: 32px var(--content-pad) 24px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 24px;
}
.globulo-header__logo img { height: 64px; width: auto; }
.globulo-header__meta { flex: 1; min-width: 240px; }
.globulo-header__tagline {
	font-family: var(--font-sans);
	font-weight: 500;
	font-size: 18px;
	color: var(--efs-navy);
	margin: 0;
}
.globulo-header__numero {
	font-family: var(--font-sans);
	font-size: 14px;
	color: var(--gray-600);
	margin: 4px 0 0;
}
.globulo-menu-pills { width: 100%; }
.globulo-menu-pills ul {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 16px 0 0;
	padding: 0;
}
.globulo-menu-pills a {
	display: inline-flex;
	align-items: center;
	padding: 8px 18px;
	border: 1.5px solid var(--efs-navy);
	border-radius: var(--r-pill);
	color: var(--efs-navy);
	font-family: var(--font-sans);
	font-weight: 600;
	font-size: 12px;
	letter-spacing: .5px;
	text-transform: uppercase;
	white-space: nowrap;
	transition: background-color .2s ease, color .2s ease;
}
.globulo-menu-pills a:hover {
	background: var(--pill-color, var(--efs-navy));
	border-color: var(--pill-color, var(--efs-navy));
	color: #fff;
}

/* ============================================================
   HERO / DOSSIER
   ============================================================ */
.globulo-hero-dossier {
	max-width: var(--content-width);
	margin: 0 auto 48px;
	padding: 0 var(--content-pad);
}
.globulo-hero-dossier__link { display: block; position: relative; border-radius: var(--r-xs); overflow: hidden; }
.globulo-hero-dossier__image {
	width: 100%;
	aspect-ratio: 1290 / 628;
	object-fit: cover;
}
.globulo-hero-dossier__content {
	position: absolute;
	left: 0; right: 0; bottom: 48px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 18px;
	text-align: center;
	padding: 0 48px;
}
.globulo-hero-dossier__titre {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: clamp(28px, 3.6vw, 40px);
	line-height: 1.08;
	letter-spacing: -.01em;
	color: #000;
	max-width: 900px;
	margin: 0;
	text-shadow: 0 2px 12px rgba(255,255,255,.5);
}
.globulo-hero-dossier__chapo {
	font-family: var(--font-serif);
	font-size: 18px;
	color: var(--gray-800);
	margin: 0;
}

/* ============================================================
   ÉDITO + ACTUALITÉ EN BREF (rangée)
   ============================================================ */
.globulo-edito,
.globulo-actualite-en-bref {
	max-width: var(--content-width);
	margin: 0 auto 48px;
	padding: 0 var(--content-pad);
}
@media (min-width: 1024px) {
	.globulo-edito,
	.globulo-actualite-en-bref {
		display: inline-block;
		vertical-align: top;
		width: 48%;
		margin-right: 3%;
	}
	.globulo-actualite-en-bref { margin-right: 0; }
}

.globulo-edito {
	background: #fff;
	border: 1px solid var(--gray-200);
	border-bottom: 4px solid var(--efs-red);
	box-shadow: var(--shadow-2);
	padding: 32px;
}
.globulo-edito__label {
	font-family: var(--font-display);
	font-weight: 100;
	font-size: 42px;
	color: var(--efs-navy);
	margin-bottom: 18px;
	text-transform: none;
}
.globulo-edito__chapo {
	font-family: var(--font-serif);
	font-weight: 700;
	font-size: 15px;
	line-height: 1.5;
	color: var(--gray-900);
}
.globulo-edito__texte { font-size: 15px; line-height: 1.5; color: #333; }
.globulo-edito__signature {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-top: 20px;
	padding-top: 20px;
	border-top: 1px solid var(--gray-100);
}
.globulo-edito__signature-photo { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; flex-shrink: 0; }
.globulo-edito__signature-nom { font-family: var(--font-sans); font-weight: 700; font-size: 14px; color: var(--efs-ink); margin: 0; }
.globulo-edito__signature-fonction {
	font-family: var(--font-sans); font-weight: 600; font-size: 13px;
	letter-spacing: .06em; text-transform: uppercase; color: var(--gray-600); margin: 6px 0 0;
}

.globulo-actualite-en-bref__heading {
	font-family: var(--font-sans); font-weight: 700; font-size: 13px;
	letter-spacing: .16em; text-transform: uppercase; color: var(--gray-600);
	border-top: 1px solid var(--efs-navy); padding-top: 10px; margin: 0 0 18px;
}
.globulo-actualite-en-bref__carousel { position: relative; }
.globulo-actualite-en-bref-item { display: none; }
.globulo-actualite-en-bref-item.is-active { display: block; }
.globulo-actualite-en-bref-item__image { width: 100%; aspect-ratio: 16/10; object-fit: cover; border-radius: var(--r-xs); margin-bottom: 14px; }
.globulo-actualite-en-bref-item__titre {
	font-family: var(--font-serif); font-weight: 700; font-size: 26px; line-height: 1.1; color: var(--efs-navy); margin: 0 0 12px;
}
.globulo-actualite-en-bref-item__meta {
	font-family: var(--font-sans); font-weight: 600; font-size: 13px; letter-spacing: .06em;
	text-transform: uppercase; color: var(--gray-600); display: flex; gap: 10px; margin-bottom: 12px;
}
.globulo-actualite-en-bref-item__meta time::after { content: ''; }
.globulo-actualite-en-bref-item__texte { font-size: 15px; line-height: 1.5; color: #333; }
.globulo-actualite-en-bref__pager {
	display: flex; gap: 16px; margin-top: 16px; list-style: none; padding: 0;
}

/* ============================================================
   VOS RÉUSSITES
   ============================================================ */
.globulo-reussites {
	background: var(--efs-navy);
	color: #fff;
	padding: 56px var(--content-pad);
	text-align: center;
	margin-bottom: 48px;
}
.globulo-reussites__label {
	font-family: var(--font-sans); font-weight: 700; font-size: 13px;
	letter-spacing: .18em; text-transform: uppercase; color: #fff; margin: 0;
}
.globulo-reussites__titre {
	font-family: var(--font-display); font-weight: 900; font-size: 32px; color: #fff; margin: 14px 0 0;
}
.globulo-reussites__list {
	max-width: var(--content-width);
	margin: 40px auto 0;
	display: flex;
	justify-content: center;
	gap: 26px;
	flex-wrap: wrap;
}
.globulo-reussite-item { display: none; max-width: 620px; margin: 0 auto; text-align: left; }
.globulo-reussite-item.is-active { display: flex; gap: 40px; flex-wrap: wrap; }
.globulo-reussite-item__photo { display: none; } /* affichée uniquement dans la bande de miniatures générée en JS */
.globulo-reussite-item__content { flex: 1; min-width: 240px; }
.globulo-reussite-item__titre { margin: 0; }
.globulo-reussite-item__nom { font-family: var(--font-display); font-weight: 700; font-size: 24px; color: #fff; }
.globulo-reussite-item__fonction { display: block; font-size: 13px; color: #fff; opacity: .8; }
.globulo-reussite-item__sous-titre {
	font-family: var(--font-sans); font-weight: 600; font-size: 13px; letter-spacing: .06em;
	text-transform: uppercase; color: var(--accent-lagon); margin: 8px 0;
}
.globulo-reussite-item__chapo { font-family: var(--font-body); font-weight: 600; font-size: 18px; color: #fff; }
.globulo-reussite-item__texte { font-size: 15px; line-height: 1.6; color: rgba(255,255,255,.85); }

/* Bande photo de sélection (les 4 miniatures rondes) */
.globulo-reussites__thumbs { display: flex; justify-content: center; gap: 26px; margin-top: 32px; flex-wrap: wrap; }
.globulo-reussites__thumb {
	width: 90px; height: 90px; border-radius: 50%; object-fit: cover; cursor: pointer;
	border: 3px solid transparent; transition: border-color .2s ease, transform .2s ease;
}
.globulo-reussites__thumb.is-active { border-color: #fff; transform: scale(1.15); }

/* ============================================================
   PORTRAIT DÉCALÉ + DOSSIER (rappel) — rangée
   ============================================================ */
.globulo-portrait-decale,
.globulo-dossier-rappel {
	max-width: var(--content-width);
	margin: 0 auto 48px;
	padding: 0 var(--content-pad);
}
@media (min-width: 1024px) {
	.globulo-portrait-decale,
	.globulo-dossier-rappel {
		display: inline-block;
		vertical-align: top;
		width: 46%;
		margin-right: 4%;
	}
	.globulo-dossier-rappel { margin-right: 0; }
}
.globulo-portrait-decale {
	background: #6d757f;
	color: #fff;
	border-radius: var(--r-lg);
	padding: 24px;
	text-align: center;
}
.globulo-portrait-decale__video { position: relative; aspect-ratio: 16/9; border-radius: var(--r-xs); overflow: hidden; margin-bottom: 20px; }
.globulo-portrait-decale__video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.globulo-portrait-decale__label {
	font-family: var(--font-sans); font-weight: 700; font-size: 13px; letter-spacing: .16em;
	text-transform: uppercase; color: #fff; margin: 0 0 12px;
}
.globulo-portrait-decale__nom { font-family: var(--font-sans); font-weight: 700; font-size: 16px; color: #fff; margin: 0; }
.globulo-portrait-decale__poste {
	font-family: var(--font-sans); font-weight: 600; font-size: 13px; letter-spacing: .06em;
	text-transform: uppercase; color: #e2e6ec; margin: 6px 0 0;
}

.globulo-dossier-rappel {
	background: #fff;
	border: 1px solid var(--gray-200);
	box-shadow: var(--shadow-2);
	padding: 24px;
}
.globulo-dossier-rappel__image { width: 100%; aspect-ratio: 16/9; object-fit: cover; margin-bottom: 16px; }
.globulo-dossier-rappel__titre { font-family: var(--font-serif); font-weight: 700; font-size: 26px; color: var(--efs-navy); margin: 14px 0 0; }
.globulo-dossier-rappel__meta {
	font-family: var(--font-sans); font-weight: 600; font-size: 13px; letter-spacing: .06em;
	text-transform: uppercase; color: var(--gray-600); margin: 12px 0;
}
.globulo-dossier-rappel__chapo { font-size: 15px; color: #333; }
.globulo-dossier-rappel__lien {
	display: inline-flex; align-items: center; gap: 8px; padding: 10px 20px;
	border: 1px solid var(--efs-red); color: var(--efs-red); font-family: var(--font-sans);
	font-weight: 500; font-size: 13px; letter-spacing: .06em; text-transform: uppercase;
}

/* ============================================================
   CARTES PUSH (Projets & perspectives, Quoi de neuf docteur,
   C'est pratique, Actu HSEDD/RH)
   ============================================================ */
.globulo-push {
	max-width: var(--content-width);
	margin: 0 auto 48px;
	padding: 0 var(--content-pad);
}
.globulo-push__titre { font-family: var(--font-serif); font-weight: 700; font-size: 26px; color: var(--efs-navy); margin: 20px 0 0; }
.globulo-push__meta {
	font-family: var(--font-sans); font-weight: 600; font-size: 13px; letter-spacing: .06em;
	text-transform: uppercase; color: var(--gray-600); margin: 12px 0;
}
.globulo-push__image { width: 100%; aspect-ratio: 4/3; object-fit: cover; margin-top: 16px; }
.globulo-push__texte { font-size: 15px; line-height: 1.5; color: #333; }
.globulo-push__lien {
	display: inline-flex; align-items: center; gap: 8px; padding: 3px 10px;
	border: 1px solid var(--efs-red); color: var(--efs-red); font-family: var(--font-sans);
	font-weight: 500; font-size: 13px; letter-spacing: .1em; text-transform: uppercase;
}

.globulo-push-double {
	max-width: var(--content-width);
	margin: 0 auto 48px;
	padding: 0 var(--content-pad);
	display: flex;
	flex-wrap: wrap;
	gap: 32px;
}
.globulo-push-double .globulo-push { flex: 1 1 320px; margin: 0; padding: 0; max-width: none; }
.globulo-push__sous-entree {
	border-top: 1px solid var(--efs-navy); padding-top: 9px; margin-bottom: 12px;
	font-family: var(--font-sans); font-weight: 700; font-size: 12px; letter-spacing: .14em;
	text-transform: uppercase; color: var(--pill-color, var(--efs-navy));
}

/* ============================================================
   CHIFFRES CLÉS
   ============================================================ */
.globulo-chiffres-cles {
	max-width: var(--content-width);
	margin: 0 auto 48px;
	padding: var(--content-pad);
	background: var(--gray-100);
	border-radius: var(--r-lg);
}
.globulo-chiffres-cles__label {
	font-family: var(--font-sans); font-weight: 700; font-size: 13px; letter-spacing: .14em;
	text-transform: uppercase; color: var(--gray-600); margin: 0 0 16px;
}
.globulo-chiffres-cles__list { display: flex; flex-direction: column; gap: 32px; }
.globulo-chiffre-cle-item { display: flex; gap: 24px; flex-wrap: wrap; }
.globulo-chiffre-cle-item[hidden] { display: none; }
.globulo-chiffre-cle-item__top { display: flex; align-items: center; gap: 16px; }
.globulo-chiffre-cle-item__icon { width: 48px; height: 48px; border-radius: 50%; }
.globulo-chiffre-cle-item__chiffre {
	font-family: var(--font-condensed); font-weight: 700; font-size: 52px; line-height: .9; color: var(--efs-red);
}
.globulo-chiffre-cle-item__bottom { flex: 1; min-width: 200px; border-left: 1px solid var(--gray-300); padding-left: 18px; }
.globulo-chiffre-cle-item__titre { font-family: var(--font-sans); font-weight: 700; font-size: 15px; color: var(--efs-navy); margin: 0 0 6px; }
.globulo-chiffre-cle-item__descriptif { font-family: var(--font-sans); font-weight: 700; font-size: 16px; color: var(--efs-navy); margin: 0; }
.globulo-chiffre-cle-item__evolution { font-family: var(--font-sans); font-style: italic; font-size: 13px; margin: 8px 0 0; }
.globulo-chiffre-cle-item__evolution--positive { color: #17AF28; }
.globulo-chiffre-cle-item__evolution--negative { color: #F36403; }
.globulo-chiffres-cles__nav { display: flex; justify-content: center; gap: 16px; margin-top: 24px; }
.globulo-chiffres-cles__prev,
.globulo-chiffres-cles__next {
	width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--gray-400);
	background: transparent; color: var(--gray-700); font-size: 18px; font-weight: 700;
}
.globulo-chiffres-cles__prev:disabled,
.globulo-chiffres-cles__next:disabled { opacity: .3; cursor: default; }

/* ============================================================
   RÉSEAUX SOCIAUX
   ============================================================ */
.globulo-reseaux-sociaux {
	background: var(--efs-navy);
	color: #fff;
	padding: 56px var(--content-pad);
	margin-bottom: 48px;
}
.globulo-reseaux-sociaux .globulo-content,
.globulo-reseaux-sociaux__inner { max-width: var(--content-width); margin: 0 auto; }
.globulo-reseaux-sociaux__label {
	font-family: var(--font-sans); font-weight: 700; font-size: 13px; letter-spacing: .16em;
	text-transform: uppercase; color: #fff; margin: 0;
}
.globulo-reseaux-sociaux__titre { font-family: var(--font-display); font-weight: 700; font-size: 28px; color: #fff; margin: 16px 0 0; }
.globulo-reseaux-sociaux__texte { font-size: 16px; color: #fff; margin: 18px 0 0; max-width: 460px; }
.globulo-reseaux-sociaux__liens { display: flex; gap: 12px; margin-top: 24px; flex-wrap: wrap; }
.globulo-reseaux-sociaux__liens a {
	display: inline-flex; align-items: center; justify-content: center;
	width: 40px; height: 40px; border-radius: 50%; background: #fff; color: var(--efs-navy);
	font-size: 0;
}
.globulo-reseaux-sociaux__liens a::before { content: attr(href); font-size: 11px; } /* repli textuel si pas d'icône */
.globulo-reseaux-sociaux__visuels {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 16px;
	margin-top: 32px;
}
.globulo-reseau-social-visuel-item img { width: 100%; aspect-ratio: 4/5; object-fit: cover; border-radius: var(--r-xs); }

/* ============================================================
   LE SAVIEZ-VOUS
   ============================================================ */
.globulo-le-saviez-vous {
	max-width: var(--content-width);
	margin: 0 auto 48px;
	padding: var(--content-pad);
	background: #E94F3E;
	color: #fff;
	border-radius: var(--r-xs);
	display: flex;
	align-items: center;
	gap: 32px;
	flex-wrap: wrap;
}
.globulo-le-saviez-vous__image { width: 160px; flex-shrink: 0; }
.globulo-le-saviez-vous__content { flex: 1; min-width: 220px; }
.globulo-le-saviez-vous__label {
	font-family: var(--font-sans); font-weight: 700; font-size: 13px; letter-spacing: .1em;
	text-transform: uppercase; margin: 0 0 8px;
}
.globulo-le-saviez-vous__chiffre {
	font-family: var(--font-condensed); font-weight: 700; font-size: 48px; line-height: 1;
}
.globulo-le-saviez-vous__description { font-size: 15px; line-height: 1.5; margin: 8px 0 0; }

/* ============================================================
   LA PAUSE GLOBULO
   ============================================================ */
.globulo-pause-globulo {
	max-width: 480px;
	margin: 0 auto 48px;
	border: 1px solid var(--gray-200);
	border-radius: var(--r-md);
	box-shadow: var(--shadow-2);
	overflow: hidden;
	background: #fff;
}
.globulo-pause-globulo__header { background: var(--accent-yellow); padding: 18px 26px; }
.globulo-pause-globulo__label {
	font-family: var(--font-sans); font-weight: 700; font-size: 12px; letter-spacing: .14em;
	text-transform: uppercase; color: var(--gray-700); margin: 0 0 6px;
}
.globulo-pause-globulo__intitule { font-family: var(--font-display); font-weight: 900; font-size: 18px; color: #fff; margin: 0; }
.globulo-pause-globulo__visuel-lien { display: block; }
.globulo-pause-globulo__visuel { width: 100%; }
.globulo-pause-globulo__stepper { padding: 24px 26px 28px; }
.globulo-pause-globulo__question[hidden] { display: none; }
.globulo-pause-globulo__question-texte { font-family: var(--font-display); font-weight: 700; font-size: 24px; color: #000; margin: 0 0 12px; }
.globulo-pause-globulo__question-description { font-size: 14px; color: #444; margin: 0 0 20px; }
.globulo-pause-globulo__reponses { display: flex; flex-direction: column; gap: 12px; }
.globulo-pause-globulo__reponse {
	border: 1px solid var(--gray-300); border-radius: 6px; padding: 14px 16px; text-align: left;
	font-family: var(--font-sans); font-weight: 600; font-size: 15px; color: var(--efs-navy); background: #fff;
}
.globulo-pause-globulo__reponse.is-chosen { border-color: var(--efs-navy); background: var(--gray-050); }
.globulo-pause-globulo__resultats[hidden] { display: none; }
.globulo-pause-globulo__resultats { display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.globulo-pause-globulo__barre { position: relative; height: 32px; background: var(--gray-100); border-radius: 6px; overflow: hidden; }
.globulo-pause-globulo__barre-remplissage { position: absolute; inset: 0; background: var(--accent-lagon); }
.globulo-pause-globulo__barre-valeur {
	position: relative; display: block; padding: 6px 10px; font-size: 13px; font-weight: 700; color: var(--efs-navy);
}
.globulo-pause-globulo__nav { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 24px; }
.globulo-pause-globulo__prev,
.globulo-pause-globulo__next {
	width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--gray-400); background: transparent; font-size: 18px;
}
.globulo-pause-globulo__progress { font-family: var(--font-sans); font-weight: 700; font-size: 13px; color: var(--efs-red); }

/* ============================================================
   ENCART DE RESTITUTION (CTA)
   ============================================================ */
.globulo-encart-restitution {
	max-width: 760px;
	margin: 0 auto 48px;
	padding: 0 var(--content-pad);
	text-align: center;
}
.globulo-encart-restitution h2 { font-family: var(--font-display); font-weight: 700; font-size: 34px; color: #000; }
.globulo-encart-restitution__image { margin: 0 auto 20px; }
.globulo-encart-restitution__texte { font-size: 18px; line-height: 1.55; color: var(--gray-700); }
.globulo-encart-restitution__bouton {
	display: inline-flex; align-items: center; gap: 10px; margin-top: 24px; padding: 15px 34px;
	color: var(--gray-700); font-family: var(--font-sans); font-weight: 700; font-size: 14px;
	letter-spacing: .08em; text-transform: uppercase; border: 1px solid var(--gray-400);
}

/* ============================================================
   FOOTER
   ============================================================ */
.globulo-footer {
	background: var(--efs-navy);
	color: #fff;
	padding: 64px var(--content-pad) 32px;
	margin-top: 64px;
}
.globulo-footer__top {
	max-width: var(--content-width); margin: 0 auto;
	display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap;
}
.globulo-footer__logo { height: 56px; width: auto; }
.globulo-footer__logo-efs { height: 100px; width: auto; }
.globulo-footer__accroche { font-family: var(--font-script); font-weight: 700; font-size: 32px; color: #fff; text-align: center; flex: 1; margin: 0; }
.globulo-footer__editions-precedentes {
	display: block; max-width: var(--content-width); margin: 32px auto 0; color: #fff; font-family: var(--font-sans);
	font-weight: 700; font-size: 15px;
}
.globulo-footer__bottom {
	max-width: var(--content-width); margin: 32px auto 0; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.2);
	display: flex; justify-content: space-between; gap: 32px; flex-wrap: wrap;
}
.globulo-footer__adresse { font-size: 15px; line-height: 1.6; color: #cdd9ec; margin: 0; max-width: 460px; }
.globulo-footer__reseaux { text-align: right; }
.globulo-footer__reseaux p { font-size: 15px; color: #cdd9ec; margin: 0; }
.globulo-footer__reseaux-liens { display: flex; gap: 12px; margin-top: 14px; justify-content: flex-end; }
.globulo-footer__reseaux-liens a {
	display: inline-flex; align-items: center; justify-content: center; padding: 8px 14px;
	border-radius: var(--r-pill); background: #fff; color: var(--efs-navy); font-size: 12px; font-weight: 700;
}
.globulo-footer__legal {
	max-width: var(--content-width); margin: 24px auto 0; display: flex; justify-content: center; gap: 32px;
	font-family: var(--font-sans); font-weight: 600; font-size: 14px;
}
.globulo-footer__legal a { color: #fff; text-decoration: underline; }

/* ============================================================
   ARTICLE
   ============================================================ */
.globulo-article { max-width: var(--content-width); margin: 0 auto; padding: 32px var(--content-pad) 64px; }
.globulo-article__header { text-align: center; margin-bottom: 24px; }
.globulo-article__titre {
	font-family: var(--font-display); font-weight: 800; font-size: clamp(32px, 4vw, 48px); color: var(--efs-navy);
	margin: 16px 0 8px; text-transform: none;
}
.globulo-article-meta-ligne {
	font-family: var(--font-sans); font-weight: 600; font-size: 13px; letter-spacing: .06em;
	text-transform: uppercase; color: var(--gray-600);
}
.globulo-article__hero img { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: var(--r-xs); margin: 24px 0; }
.globulo-article__layout { display: grid; grid-template-columns: 1fr; gap: 48px; margin-top: 32px; }
@media (min-width: 900px) {
	.globulo-article__layout { grid-template-columns: 2fr 1fr; }
}
.globulo-article__body { font-size: 16px; line-height: 1.65; color: var(--gray-700); }
.globulo-article__body h2 { margin-top: 40px; }
.globulo-article__body blockquote {
	border-left: 3px solid var(--efs-red); padding-left: 26px; margin: 32px 0; font-family: var(--font-serif);
	font-size: 19px; color: var(--efs-navy);
}

.globulo-points-a-retenir {
	background: #fff; box-shadow: var(--shadow-2); border-bottom: 3px solid var(--efs-red);
	padding: 28px 30px; margin: 32px 0;
}
.globulo-points-a-retenir__label {
	font-family: var(--font-sans); font-weight: 700; font-size: 13px; letter-spacing: .1em;
	text-transform: uppercase; color: var(--efs-navy); margin: 0 0 14px;
}
.globulo-points-a-retenir__liste { margin: 0; padding-left: 20px; color: var(--efs-red); font-weight: 700; }
.globulo-points-a-retenir__liste li { margin-bottom: 8px; }

.globulo-chiffre-cle-encart {
	background: var(--gray-050); border-radius: var(--r-md); padding: 20px 24px; margin: 24px 0;
}
.globulo-chiffre-cle-encart__chiffre { font-family: var(--font-condensed); font-weight: 700; font-size: 44px; color: var(--efs-red); }
.globulo-chiffre-cle-encart__descriptif { font-family: var(--font-sans); font-weight: 700; font-size: 15px; color: var(--efs-navy); margin-top: 8px; }
.globulo-chiffre-cle-encart__evolution { font-style: italic; font-size: 13px; margin-top: 6px; }
.globulo-chiffre-cle-encart__evolution--positive { color: #17AF28; }
.globulo-chiffre-cle-encart__evolution--negative { color: #F36403; }

.globulo-article-colonne-droite__label {
	font-family: var(--font-sans); font-weight: 700; font-size: 13px; letter-spacing: .11em;
	text-transform: uppercase; color: var(--gray-900); margin: 0 0 16px;
}
.globulo-article-colonne-droite__auteur,
.globulo-article-colonne-droite__contributeurs,
.globulo-article-colonne-droite__articles-lies { margin-bottom: 40px; }
.globulo-article-colonne-droite__contributeurs ul,
.globulo-article-colonne-droite__articles-lies ul { list-style: none; margin: 0; padding: 0; }
.globulo-article-colonne-droite__contributeur {
	display: flex; align-items: center; gap: 12px; margin-bottom: 20px;
}
.globulo-article-colonne-droite__contributeur-photo { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.globulo-article-colonne-droite__contributeur-nom {
	display: block; font-family: var(--font-sans); font-weight: 600; font-size: 12px; letter-spacing: .05em;
	text-transform: uppercase; color: var(--gray-600);
}
.globulo-article-colonne-droite__contributeur-poste { display: block; font-size: 12px; color: var(--gray-400); }
.globulo-article-colonne-droite__article-lie {
	display: flex; gap: 14px; align-items: flex-start; padding: 16px 0; border-bottom: 1px solid var(--gray-200);
}
.globulo-article-colonne-droite__article-lie-image { width: 78px; height: 62px; object-fit: cover; border-radius: var(--r-xs); flex-shrink: 0; }
.globulo-article-colonne-droite__article-lie span { font-family: var(--font-sans); font-size: 12px; line-height: 1.45; color: var(--gray-600); }

.globulo-article-navigation {
	display: flex; justify-content: space-between; gap: 24px; margin-top: 48px; padding-top: 24px;
	border-top: 1px solid var(--gray-200); font-family: var(--font-sans); font-weight: 600; font-size: 14px;
}

/* ============================================================
   RESPONSIVE — repli mobile/tablette
   (les wireframes tablette/mobile empilent tout en une colonne)
   ============================================================ */
@media (max-width: 1023px) {
	.globulo-header { padding: 20px var(--content-pad); }
	.globulo-hero-dossier__content { padding: 0 20px; bottom: 24px; gap: 12px; }
	.globulo-reussites__list { flex-direction: column; align-items: center; }
	.globulo-push-double { flex-direction: column; }
	.globulo-chiffre-cle-item:nth-child(-n+2) { flex-direction: column; }
	.globulo-le-saviez-vous { flex-direction: column; text-align: center; }
	.globulo-footer__top,
	.globulo-footer__bottom { flex-direction: column; text-align: center; }
	.globulo-footer__reseaux { text-align: center; }
	.globulo-footer__reseaux-liens { justify-content: center; }
}

@media (max-width: 599px) {
	:root { --content-pad: 16px; }
	.globulo-edito__label { font-size: 32px; }
	.globulo-hero-dossier__titre { font-size: 26px; }
	.globulo-article__layout { gap: 32px; }
}
