/* ============================================================
   ONASER — Variante v3 « CLARTÉ »
   Institutionnel, aéré, fond blanc dominant.
   Rouge = accent fonctionnel uniquement. Aucun fond sombre.
   Indépendante : classes .r3-* uniquement.
   ============================================================ */

:root {
  --r3-red: #c21017;      /* accent unique : boutons, liens, filets, chiffres */
  --r3-red-d: #A00C24;    /* survol */
  --r3-red-wash: #FCF7F7; /* fond alterné, blanc très légèrement rosé */
  --r3-red-line: #F3DADE; /* filets teintés discrets */
  --r3-white: #FFFFFF;
  --r3-ink: #1E1E20;      /* texte principal (noir doux) */
  --r3-ink-2: #5B5B60;    /* métadonnées, texte secondaire */
  --r3-line: #ECECEE;     /* bordures fines neutres */

  --r3-serif: 'Lora', Georgia, serif;      /* titres */
  --r3-sans: 'Public Sans', system-ui, sans-serif; /* texte */
  --r3-oswald: 'Oswald', monospace;  /* code */

  --r3-pad: clamp(20px, 5vw, 60px);
  --r3-maxw: 1200px;
  --r3-radius: 10px;
  --r3-shadow: 0 6px 24px rgba(30, 30, 32, .07);
  --r3-ease: cubic-bezier(.22, .61, .36, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; font-family: var(--r3-sans); color: var(--r3-ink);
  background: var(--r3-white); line-height: 1.65; font-size: 17px;
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
img, video { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
h1, h2, h3 { font-family: var(--r3-serif); font-weight: 600; margin: 0; line-height: 1.15; letter-spacing: -.01em; }

/* Accessibilité */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible {
  outline: 3px solid var(--r3-red); outline-offset: 2px; border-radius: 3px;
}
.r3-skip {
  position: absolute; left: 12px; top: -60px; background: var(--r3-red); color: #fff;
  padding: 10px 16px; border-radius: 8px; z-index: 200; transition: top .2s var(--r3-ease);
}
.r3-skip:focus { top: 12px; }
.r3-vh {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.r3-wrap { max-width: var(--r3-maxw); margin: 0 auto; padding: 0 var(--r3-pad); }

/* Petit intitulé de section (texte, pas d'icône) */
.r3-eyebrow {
  font-family: var(--r3-sans); font-weight: 700; font-size: 13px; letter-spacing: .12em;
  text-transform: uppercase; color: var(--r3-red); margin: 0 0 12px; display: block;
}
.r3-h2 { font-size: clamp(27px, 3.6vw, 40px); }
.r3-lead { font-size: 18px; color: var(--r3-ink-2); max-width: 62ch; margin: 12px 0 0; }

/* ============ TOPBAR ============ */
.r3-topbar { background: var(--r3-white); border-bottom: 1px solid var(--r3-line); font-size: 12px; }
.r3-topbar .r3-wrap { display: flex; align-items: center; gap: 20px; min-height: 20px; flex-wrap: wrap; }
.r3-topbar-left { color: var(--r3-ink-2); }
.r3-topbar-links { margin-left: auto; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.r3-topbar-links a {     color: #000000;
    transition: color .15s;
    text-decoration: underline; }
.r3-topbar-links a:hover { color: var(--r3-red); }
.r3-mini-btn {
  background: none; border: none; color: var(--r3-ink-2); cursor: pointer;
  font-family: var(--r3-sans); font-size: 14px; padding: 0; transition: color .15s;
}
.r3-mini-btn:hover { color: var(--r3-red); }

.r3-pulse { width: 7px; height: 7px; border-radius: 50%; background: #fff; animation: r3-pulse 1.8s infinite; }
@keyframes r3-pulse {
  0% { box-shadow: 0 0 0 0 rgba(255,255,255,.6); } 70% { box-shadow: 0 0 0 8px rgba(255,255,255,0); }
  100% { box-shadow: 0 0 0 0 rgba(255,255,255,0); }
}

/* ============ HEADER ============ */
/* État par défaut (en haut, non défilé) : header BLANC, onglets sombres.
   Au défilement (.r3-scrolled) : header ROUGE, onglets BLANCS (voir plus bas). */
.r3-header {
  position: sticky; top: 0; z-index: 100; background: var(--r3-white);
  border-bottom: 1px solid var(--r3-line);
  transition: background-color .25s var(--r3-ease), box-shadow .2s, border-color .25s;
}
/* .r3-header::after { content: ""; display: block; height: 3px; background: var(--r3-red); } */
.r3-header.r3-scrolled {
  background: var(--r3-red);
  border-bottom-color: rgba(255, 255, 255, .12);
  box-shadow: var(--r3-shadow);
}
.r3-header .r3-wrap { display: flex; align-items: center; gap: 20px; min-height: 62px; }
.r3-logo img {  width: auto; height: 50px;}
.r3-nav { display: flex; align-items: center; gap: 2px; margin-left: 6px; }
.r3-ni { position: relative; }
.r3-ni > a {
  display: inline-flex; align-items: center; gap: 5px; padding: 11px 10px;font-family: var(--r3-oswald);
  font-weight: 600; font-size: 13px; text-transform: uppercase; color: var(--r3-ink); border-radius: 6px; transition: color .15s;
}
.r3-ni > a .r3-chev { font-size: 10px; opacity: .55; transition: transform .2s; }
.r3-ni:hover > a, .r3-ni:focus-within > a { color: var(--r3-red); }
.r3-ni:hover > a .r3-chev { transform: rotate(180deg); }
.r3-ni > a.r3-act { color: var(--r3-red); }
.r3-ni > a.r3-act::after {
  content: ""; position: absolute; left: 13px; right: 13px; bottom: 4px; height: 2px; background: var(--r3-red);
}

/* --- État ROUGE (header défilé / sticky) : onglets blancs ---
   Sur fond rouge, l'accent rouge serait invisible : on passe donc au BLANC
   (fond blanc translucide au survol, soulignement blanc pour l'actif). */
.r3-header.r3-scrolled .r3-burger span { background: #fff; }
@media (min-width: 901px) {
  .r3-header.r3-scrolled .r3-ni > a { color: #fff; }
  .r3-header.r3-scrolled .r3-ni > a .r3-chev { opacity: .8; }
  .r3-header.r3-scrolled .r3-ni:hover > a,
  .r3-header.r3-scrolled .r3-ni:focus-within > a { color: #fff; background: rgba(255, 255, 255, .16); }
  .r3-header.r3-scrolled .r3-ni > a.r3-act { color: #fff; background: rgba(255, 0, 0); }
  .r3-header.r3-scrolled .r3-ni > a.r3-act::after { background: #fff; }
}
.r3-drop {
  position: absolute; top: calc(100% + 8px); left: 0; min-width: 250px; background: #fff;
  border: 1px solid var(--r3-line); border-top: 3px solid var(--r3-red); border-radius: 0 0 10px 10px;
  box-shadow: var(--r3-shadow); padding: 8px; opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: all .2s var(--r3-ease); z-index: 30;
}
.r3-ni:hover .r3-drop, .r3-ni:focus-within .r3-drop { opacity: 1; visibility: visible; transform: translateY(0); }
.r3-drop a {
  display: block; padding: 9px 12px; font-size: 14.5px;font-family: var(--r3-oswald); font-weight: 500; color: var(--r3-ink-2);
  border-radius: 6px; transition: background .12s, color .12s;
}
.r3-drop a:hover { background: var(--r3-red-wash); color: var(--r3-red); }
.r3-header-actions { margin-left: auto; display: flex; align-items: center; gap: 14px; }
/* --- Langue FR / EN --- */
.r3-lang { position: relative; }
.r3-lang-btn {
  display: inline-flex; align-items: center; gap: 7px; background: none; cursor: pointer;
  border: 1px solid var(--r3-line); border-radius: 999px; padding: 7px 12px;
  font-family: var(--r3-sans); font-weight: 700; font-size: 13px; color: var(--r3-ink);
  transition: border-color .15s, color .15s, background .15s;
}
.r3-lang-btn:hover { border-color: var(--r3-red); color: var(--r3-red); }
.r3-lang-globe { width: 16px; height: 16px; }
.r3-lang-chev { width: 12px; height: 12px; opacity: .6; transition: transform .2s; }
.r3-lang:hover .r3-lang-chev, .r3-lang:focus-within .r3-lang-chev { transform: rotate(180deg); }
.r3-lang-menu {
  position: absolute; top: calc(100% + 8px); right: 0; min-width: 156px; background: #fff;
  border: 1px solid var(--r3-line); border-top: 3px solid var(--r3-red); box-shadow: var(--r3-shadow);
  padding: 6px; opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: all .2s var(--r3-ease); z-index: 40;
}
.r3-lang:hover .r3-lang-menu, .r3-lang:focus-within .r3-lang-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.r3-lang-item { display: block; padding: 9px 12px; font-family: var(--r3-sans); font-weight: 600; font-size: 14px; color: var(--r3-ink-2); border-radius: 4px; transition: background .12s, color .12s; }
.r3-lang-item:hover { background: var(--r3-red-wash); color: var(--r3-red); }
.r3-lang-item.is-on { color: var(--r3-red); }
/* --- Icône connexion --- */
.r3-login { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--r3-line); display: grid; place-items: center; color: var(--r3-ink); transition: border-color .15s, color .15s, background .15s; flex-shrink: 0; }
.r3-login:hover { border-color: var(--r3-red); color: var(--r3-red); }
.r3-login svg { width: 19px; height: 19px; }
/* --- Numéro vert (exergue) --- */
.r3-hot { display: inline-flex; align-items: center; gap: 11px; background: var(--r3-red); color: #fff; padding: 7px 18px 7px 8px; flex-shrink: 0; transition: background .15s, transform .15s; }
.r3-hot:hover { background: var(--r3-red-d); transform: translateY(-1px); }
.r3-hot-ic { width: 40px; height: 40px; border-radius: 50%; background: #fff; color: var(--r3-red); display: grid; place-items: center; flex-shrink: 0; box-shadow: 0 0 0 0 rgba(255, 255, 255, .7); animation: r3-pulse 1.9s infinite; }
.r3-hot-ic svg { width: 21px; height: 21px; }
.r3-hot-txt { display: flex; flex-direction: column; line-height: 1; }
.r3-hot-txt small { font-family: var(--r3-sans); font-weight: 700; font-size: 10px; letter-spacing: .07em; text-transform: uppercase; opacity: .92; margin-bottom: 4px; }
.r3-hot-txt b { font-family: var(--r3-serif); font-weight: 700; font-size: 23px; letter-spacing: .02em; }
/* état header ROUGE (défilé) : inverser pour rester visible */
.r3-header.r3-scrolled .r3-lang-btn { border-color: rgba(255, 255, 255, .45); color: #fff; }
.r3-header.r3-scrolled .r3-lang-btn:hover { background: rgba(255, 255, 255, .16); }
.r3-header.r3-scrolled .r3-login { border-color: rgba(255, 255, 255, .45); color: #fff; }
.r3-header.r3-scrolled .r3-login:hover { background: rgba(255, 255, 255, .16); }
.r3-header.r3-scrolled .r3-hot { background: #fff; color: var(--r3-red); }
.r3-header.r3-scrolled .r3-hot-ic { background: var(--r3-red); color: #fff; box-shadow: 0 0 0 0 rgba(200, 16, 46, .5); animation: r3-pulse-red 1.9s infinite; }
.r3-search {
  display: flex; align-items: center; gap: 8px; background: var(--r3-white);
  border: 1px solid var(--r3-red); border-radius: 999px; padding: 7px 7px 7px 16px; transition: border-color .15s;
}
.r3-search:focus-within { border-color: var(--r3-red); }
.r3-search input { border: none; background: none; outline: none; font-family: var(--r3-sans); font-size: 14.5px; width: 148px; color: var(--r3-ink); }
.r3-search button {
  border: none; cursor: pointer; width: 34px; height: 34px; border-radius: 50%; background: var(--r3-red);
  color: #fff; display: grid; place-items: center; transition: background .15s; flex-shrink: 0;
}
.r3-search button:hover { background: var(--r3-red-d); }
.r3-search svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 2; }
.r3-burger { display: none; width: 44px; height: 44px; border: none; background: none; cursor: pointer; flex-direction: column; justify-content: center; gap: 5px; }
.r3-burger span { display: block; height: 2.5px; width: 24px; background: var(--r3-ink); border-radius: 2px; transition: .25s var(--r3-ease); margin: 0 auto; }
.r3-burger.r3-open span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
.r3-burger.r3-open span:nth-child(2) { opacity: 0; }
.r3-burger.r3-open span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }
.r3-scrim { position: fixed; inset: 0; background: rgba(30,30,32,.4); opacity: 0; visibility: hidden; transition: .25s; z-index: 90; }
.r3-scrim.r3-show { opacity: 1; visibility: visible; }

/* ============ BOUTONS / LIENS ============ */
.r3-btn {
  display: inline-flex; align-items: center; gap: 9px; font-family: var(--r3-sans); font-weight: 600;
  font-size: 16px; padding: 13px 26px; border-radius: 999px; cursor: pointer; border: 2px solid transparent;
  transition: background .18s, color .18s, border-color .18s; line-height: 1; text-align: center;
}
.r3-btn svg { width: 17px; height: 17px; }
.r3-btn-primary { background: var(--r3-red); color: #fff; }
.r3-btn-primary:hover { background: var(--r3-red-d); }
.r3-btn-outline { background: #fff; color: var(--r3-red); border-color: var(--r3-red); }
.r3-btn-outline:hover { background: var(--r3-red-wash); }
.r3-link {
  display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: var(--r3-red);
  transition: gap .18s, color .15s;
}
.r3-link svg { width: 15px; height: 15px; transition: transform .18s; }
.r3-link:hover { color: var(--r3-red-d); }
.r3-link:hover svg { transform: translateX(3px); }
.r3-link-u { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1.5px; }

/* ============ SECTIONS ============ */
.r3-sec { padding: clamp(38px, 4.4vw, 60px) 0; }
.r3-sec-tint { background: var(--r3-red-wash); }
.r3-sec-head { max-width: 760px; margin-bottom: 26px; }
.r3-sec-head-row { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; margin-bottom: 26px; }
/* léger filet rouge sous l'eyebrow des en-têtes, pour structurer sans vide */
.r3-sec-head .r3-h2, .r3-sec-head-row .r3-h2 { position: relative; }

/* ============ BANDE INFO DÉFILANTE ============ */
.r3-ticker { background: var(--r3-red); color: #fff; display: flex; align-items: stretch; overflow: hidden; }
.r3-ticker-label {
  flex-shrink: 0; display: inline-flex; align-items: center; gap: 8px; background: var(--r3-red-d);
  color: #fff; font-family: var(--r3-sans); font-weight: 700; font-size: 12.5px; letter-spacing: .08em;
  text-transform: uppercase; padding: 0 18px; position: relative; z-index: 2;
}
.r3-ticker-label::after { content: ""; position: absolute; right: -10px; top: 0; bottom: 0; width: 10px; background: var(--r3-red-d); clip-path: polygon(0 0, 100% 50%, 0 100%); }
.r3-ticker-view { flex: 1; overflow: hidden; position: relative; display: flex; align-items: center; }
.r3-ticker-track {
  display: inline-flex; align-items: center; white-space: nowrap; flex-shrink: 0;
  will-change: transform; animation: r3-ticker-scroll 34s linear infinite;
}
.r3-ticker-view:hover .r3-ticker-track { animation-play-state: paused; }
.r3-ticker-item {
  display: inline-flex; align-items: center; font-size: 14px; color: #fff; padding: 3px 0; margin: 0 26px;
  transition: opacity .15s;
}
.r3-ticker-item::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.55); margin-right: 26px; }
.r3-ticker-item:hover { opacity: .82; text-decoration: underline; text-underline-offset: 3px; }
@keyframes r3-ticker-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ============ HERO SLIDER ============ */
.r3-hero3 { position: relative; height: clamp(440px, 78vh, 720px); overflow: hidden; background: var(--r3-white); }
.r3-slides { position: absolute; inset: 0; }
.r3-slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; z-index: 1; background: var(--r3-white); }
.r3-slide.is-active { opacity: 1; visibility: visible; z-index: 2; }
.r3-slide-media { position: absolute; inset: 0; overflow: hidden; }
/* image entièrement contenue dans le slide, sans zoom ni recadrage */
.r3-slide-media img { width: 100%;  object-fit: cover; }

/* Bandes pour l'effet « slice » (masquées sauf pendant la transition) */
.r3-slide-strips { position: absolute; inset: 0; display: none; }
.r3-slide-strips .r3-strip { position: absolute; inset: 0; background-size: contain; background-repeat: no-repeat; background-position: center; }

/* (plus d'overlay sombre : image contenue sur fond blanc) */
.r3-slide-scrim { display: none; }
/* Texte du slide : SANS fond (transparent), flottant à droite, détaché haut/bas.
   Design = barre gauche rouge nette + ligne pointillée de liaison. */
.r3-slide-content {
  position: absolute; z-index: 3;
  top: clamp(24px, 10%, 80px); bottom: clamp(24px, 10%, 80px);
  right: clamp(24px, 4vw, 64px); width: clamp(300px, 36%, 520px);
}
.r3-slide-panel {
  position: relative; width: 100%; height: 100%;
  display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
  /* léger voile noir translucide derrière le texte (lisibilité) */
  background: rgba(0, 0, 0, .34); border: none; box-shadow: none; border-radius: 12px;
  padding: clamp(24px, 2.6vw, 42px) clamp(26px, 2.4vw, 40px) clamp(24px, 2.6vw, 42px) clamp(26px, 2.6vw, 44px);
  text-align: left; color: #fff;
}
/* barre gauche NETTE (rouge plein), animée en hauteur */
.r3-slide-panel::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
  background: var(--r3-red); border-radius: 2px; transform-origin: top;
}
/* ligne pointillée de liaison, parallèle à la barre */
.r3-slide-panel::after {
  content: ""; position: absolute; left: 11px; top: 6%; bottom: 6%;
  border-left: 2px dashed rgba(200, 16, 46, .5);
}
/* texte clair sur le voile sombre */
.r3-slide-title { text-shadow: 0 2px 16px rgba(0, 0, 0, .45); }
.r3-slide-eyebrow { font-family: var(--r3-sans); font-weight: 700; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: #fff; opacity: .95; display: block; margin-bottom: 10px; }
.r3-slide-title { font-family: var(--r3-serif); font-weight: 700; font-size: clamp(25px, 2.4vw, 38px); line-height: 1.14; color: #fff; margin: 0 0 22px; }
.r3-slide-content .r3-btn { margin-top: 2px; box-shadow: 0 8px 22px rgba(200, 16, 46, .28); }

/* Apparition SÉQUENCÉE (retard après l'entrée de l'image) :
   barre → pointillés → eyebrow → titre → bouton. */
.r3-slide.is-active .r3-slide-panel::before { animation: r3-bar-grow .55s var(--r3-ease) .32s both; }
.r3-slide.is-active .r3-slide-panel::after { animation: r3-appear .5s ease .52s both; }
.r3-slide.is-active .r3-slide-eyebrow { animation: r3-rise .5s var(--r3-ease) .58s both; }
.r3-slide.is-active .r3-slide-title { animation: r3-rise .55s var(--r3-ease) .70s both; }
.r3-slide.is-active .r3-slide-content .r3-btn { animation: r3-rise .5s var(--r3-ease) .88s both; }
@keyframes r3-bar-grow { from { transform: scaleY(0); opacity: .4; } to { transform: scaleY(1); opacity: 1; } }
@keyframes r3-appear { from { opacity: 0; } to { opacity: 1; } }
@keyframes r3-rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
/* fin mouvement de sortie de la slide sortante */
.r3-slide.is-leaving .r3-slide-panel { animation: r3-panel-out .5s var(--r3-ease) both; }
@keyframes r3-panel-out { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateX(24px); } }

/* Contrôles */
.r3-hero-arrow {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; width: 48px; height: 48px;
  border-radius: 50%; border: none; cursor: pointer; background: rgba(255,255,255,.28);
  backdrop-filter: blur(4px); color: #fff; display: grid; place-items: center; transition: background .18s;
}
.r3-hero-arrow:hover { background: var(--r3-red); }
.r3-hero-arrow svg { width: 22px; height: 22px; stroke: currentColor; fill: none; stroke-width: 2.4; }
.r3-hero-prev { left: clamp(12px, 2vw, 24px); }
.r3-hero-next { right: clamp(12px, 2vw, 24px); }
.r3-hero-dots { position: absolute; z-index: 5; bottom: 18px; left: 50%; transform: translateX(-50%); display: flex; gap: 10px; }
.r3-hero-dot { width: 11px; height: 11px; border-radius: 50%; border: 2px solid #fff; background: transparent; cursor: pointer; padding: 0; transition: background .18s, transform .18s; }
.r3-hero-dot.is-on { background: #fff; transform: scale(1.15); }

/* Transitions d'ENTRÉE (tirées au hasard, appliquées à la slide entrante) */
.r3-slide.enter-fade { animation: r3-e-fade .9s ease both; }
@keyframes r3-e-fade { from { opacity: 0; } to { opacity: 1; } }
.r3-slide.enter-wipe-h { animation: r3-e-wipeh 1s var(--r3-ease) both; }
@keyframes r3-e-wipeh { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
.r3-slide.enter-wipe-v { animation: r3-e-wipev 1s var(--r3-ease) both; }
@keyframes r3-e-wipev { from { clip-path: inset(100% 0 0 0); } to { clip-path: inset(0 0 0 0); } }
.r3-slide.enter-circle { animation: r3-e-circle 1s var(--r3-ease) both; }
@keyframes r3-e-circle { from { clip-path: circle(0% at 50% 50%); } to { clip-path: circle(150% at 50% 50%); } }
.r3-slide.enter-slice .r3-slide-media { display: none; }
.r3-slide.enter-slice .r3-slide-strips { display: block; }
.r3-slide.enter-slice .r3-strip { animation: r3-e-slice .9s var(--r3-ease) both; }
@keyframes r3-e-slice { from { transform: translateY(102%); } to { transform: translateY(0); } }

@media (max-width: 620px) {
  .r3-slide-content { top: auto; left: 16px; right: 16px; bottom: 16px; width: auto; }
  .r3-slide-panel { height: auto; align-items: flex-start; padding: 22px; }
  .r3-hero-arrow { width: 40px; height: 40px; }
}
@media (prefers-reduced-motion: reduce) {
  .r3-ticker-track { animation: none; }
  .r3-slide.is-leaving .r3-slide-panel,
  .r3-slide-panel::before, .r3-slide-panel::after,
  .r3-slide-eyebrow, .r3-slide-title, .r3-slide-content .r3-btn { animation: none !important; opacity: 1 !important; transform: none !important; }
  .r3-slide.enter-fade, .r3-slide.enter-wipe-h, .r3-slide.enter-wipe-v,
  .r3-slide.enter-circle { animation: r3-e-fade .3s ease both; }
  .r3-slide.enter-slice .r3-slide-media { display: block; }
  .r3-slide.enter-slice .r3-slide-strips { display: none; }
}

/* ============ ACCÈS RAPIDES (recherche + raccourcis texte) ============ */
.r3-access { background: var(--r3-red-wash); border-top: 1px solid var(--r3-red-line); border-bottom: 1px solid var(--r3-red-line); }
.r3-access .r3-wrap { padding-top: 20px; padding-bottom: 20px; display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.r3-access-search {
  display: flex; align-items: center; gap: 10px; background: #fff; border: 1px solid var(--r3-red);
  border-radius: 999px; padding: 9px 9px 9px 20px; flex: 1; min-width: 280px;
}
.r3-access-search:focus-within { border-color: var(--r3-red); }
.r3-access-search input { flex: 1; border: none; outline: none; font-family: var(--r3-sans); font-size: 16px; background: none; color: var(--r3-ink); }
.r3-access-search button { border: none; cursor: pointer; background: var(--r3-red); color: #fff; border-radius: 999px; padding: 9px 20px; font-family: var(--r3-sans); font-weight: 600; font-size: 15px; transition: background .15s; }
.r3-access-search button:hover { background: var(--r3-red-d); }
.r3-access-links { display: flex; align-items: center; gap: 8px 22px; flex-wrap: wrap; font-size: 15px; }
.r3-access-links span { color: var(--r3-ink-2); font-weight: 600; }
.r3-access-links a { color: var(--r3-red); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1.5px; }
.r3-access-links a:hover { color: var(--r3-red-d); }

/* ============ MOT DU DIRECTEUR (image + texte, asymétrique) ============ */
.r3-dir { padding-top: clamp(30px, 3.4vw, 46px); padding-bottom: clamp(30px, 3.4vw, 46px); }
.r3-dir-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(30px, 5vw, 72px); align-items: center; }
.r3-dir-media { position: relative; margin: 0; }
/* blocs rouges décalés derrière l'image : coin bas-droit + coin haut-gauche */
.r3-dir-media::before { content: ""; position: absolute; right: -18px; bottom: -18px; width: 60%; height: 60%; background: var(--r3-red); z-index: 0; }
.r3-dir-media::after { content: ""; position: absolute; left: -18px; top: -18px; width: 44%; height: 46%; background: var(--r3-red); z-index: 0; }
.r3-dir-media img { position: relative; z-index: 1; width: 100%; display: block; aspect-ratio: 5 / 4; object-fit: cover; border-radius: 0; }
.r3-dir-badge {
  position: absolute; z-index: 2; left: -16px; bottom: 26px; background: #fff; border-left: 4px solid var(--r3-red);
  padding: 12px 20px; box-shadow: 0 12px 30px rgba(20, 20, 24, .18);
  font-family: var(--r3-serif); font-weight: 700; font-size: 17px; color: var(--r3-ink);
}
.r3-dir-badge span { display: block; font-family: var(--r3-sans); font-weight: 600; font-size: 12.5px; color: var(--r3-ink-2); margin-top: 2px; }
.r3-dir-quote {
  font-family: var(--r3-serif); font-weight: 600; font-size: clamp(21px, 2.2vw, 31px); line-height: 1.3;
  color: var(--r3-ink); margin: 12px 0 18px; position: relative; padding-top: 34px;
}
.r3-dir-quote::before { content: "\201C"; position: absolute; top: 6px; left: -4px; font-family: var(--r3-serif); font-size: 68px; line-height: 0; color: var(--r3-red); }
.r3-dir-body > p { color: var(--r3-ink-2); font-size: 16px; line-height: 1.6; margin: 0 0 18px; max-width: 60ch; }

/* ============ ACTUALITÉS (section blog : filtres + à la une + grille) ============ */
/* Onglets de filtre */
.r3-blog-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 22px; }
.r3-blog-tab {
  font-family: var(--r3-sans); font-weight: 600; font-size: 14px; padding: 8px 16px; cursor: pointer;
  background: #fff; color: var(--r3-ink-2); border: 1px solid var(--r3-line); border-radius: 0;
  transition: background .15s, color .15s, border-color .15s, transform .1s;
}
.r3-blog-tab:hover { border-color: var(--r3-red); color: var(--r3-red); }
.r3-blog-tab.is-on { background: var(--r3-red); border-color: var(--r3-red); color: #fff; }
.r3-blog-tab:active { transform: translateY(1px); }

.r3-blog-tag {
  display: inline-block; font-family: var(--r3-sans); font-weight: 700; font-size: 11.5px; letter-spacing: .05em;
  text-transform: uppercase; background: var(--r3-red); color: #fff; padding: 4px 10px; border-radius: 0;
}

/* Carte À LA UNE : image plein cadre + dégradé + texte superposé */
.r3-blog-feat { position: relative; display: block; overflow: hidden; margin-bottom: 16px; color: #fff; }
.r3-blog-feat-media { aspect-ratio: 21 / 8; overflow: hidden; }
.r3-blog-feat-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--r3-ease); }
.r3-blog-feat:hover .r3-blog-feat-media img { transform: scale(1.05); }
.r3-blog-feat-body {
  position: absolute; left: 0; right: 0; bottom: 0; padding: clamp(20px, 3vw, 40px);
  background: linear-gradient(0deg, rgba(15, 15, 17, .92) 0%, rgba(15, 15, 17, .55) 45%, transparent 100%);
}
.r3-blog-feat-body h3 { font-family: var(--r3-serif); font-weight: 700; font-size: clamp(21px, 2.6vw, 34px); line-height: 1.16; color: #fff; margin: 12px 0 8px; max-width: 26ch; }
.r3-blog-feat-body p { color: rgba(255, 255, 255, .86); font-size: 15px; line-height: 1.5; margin: 0 0 10px; max-width: 64ch;
  display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.r3-blog-meta { font-family: var(--r3-sans); font-weight: 600; font-size: 13.5px; color: #fff; }
.r3-blog-feat::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--r3-red); transform: scaleY(0); transform-origin: top; transition: transform .35s var(--r3-ease); z-index: 3; }
.r3-blog-feat:hover::after { transform: scaleY(1); }

/* Grille de cartes standard */
.r3-blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(258px, 1fr)); gap: 16px; }
.r3-blog-card {
  position: relative; display: flex; flex-direction: column; background: #fff; overflow: hidden;
  border: 1px solid var(--r3-line); border-radius: 0; box-shadow: 0 1px 2px rgba(20, 20, 24, .05);
  transition: transform .18s var(--r3-ease), box-shadow .18s;
}
.r3-blog-card::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--r3-red); transform: scaleX(0); transform-origin: left; transition: transform .3s var(--r3-ease); z-index: 3; }
.r3-blog-card:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(20, 20, 24, .14); }
.r3-blog-card:hover::before { transform: scaleX(1); }
.r3-blog-card-media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; }
.r3-blog-card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s var(--r3-ease); }
.r3-blog-card:hover .r3-blog-card-media img { transform: scale(1.07); }
.r3-blog-card-media .r3-blog-tag { position: absolute; top: 10px; left: 10px; z-index: 2; }
.r3-blog-card-body { display: flex; flex-direction: column; flex: 1; padding: 14px 16px 16px; }
.r3-blog-date { font-family: var(--r3-sans); font-size: 12.5px; color: var(--r3-ink-2); margin-bottom: 6px; }
.r3-blog-card h4 { font-family: var(--r3-serif); font-weight: 600; font-size: 17px; line-height: 1.26; margin: 0 0 7px; transition: color .15s; }
.r3-blog-card:hover h4 { color: var(--r3-red); }
.r3-blog-card p { font-size: 13.5px; color: var(--r3-ink-2); line-height: 1.45; margin: 0 0 12px;
  display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.r3-blog-more { margin-top: auto; font-family: var(--r3-sans); font-weight: 700; font-size: 13.5px; color: var(--r3-red); display: inline-flex; align-items: center; gap: 6px; }
.r3-blog-more svg { width: 15px; height: 15px; transition: transform .18s; }
.r3-blog-card:hover .r3-blog-more svg { transform: translateX(4px); }

/* Filtrage */
.r3-blog-feat.is-hidden, .r3-blog-card.is-hidden { display: none; }
.r3-blog-card.is-filtering, .r3-blog-feat.is-filtering { animation: r3-blog-in .42s var(--r3-ease) both; }
@keyframes r3-blog-in { from { opacity: 0; transform: scale(.96) translateY(10px); } to { opacity: 1; transform: none; } }
.r3-blog-empty { text-align: center; color: var(--r3-ink-2); padding: 30px 0; font-size: 15px; }

/* --- Section actualités PLEINE LARGEUR : slider plein cadre + liste rouge à miniatures --- */
.r3-actu .r3-sec-head-row { margin-bottom: 22px; }
.r3-news2 { display: grid; grid-template-columns: 1.6fr 1fr; align-items: stretch; width: 100%; }
/* --- Slider gauche (mouvement de translation) --- */
.r3-nf { position: relative; overflow: hidden; background: var(--r3-ink); }
.r3-nf-view { overflow: hidden; height: 100%; min-height: clamp(420px, 44vw, 600px); }
.r3-nf-track { display: flex; height: 100%; will-change: transform; transition: transform .6s var(--r3-ease); }
.r3-nf-slide { position: relative; flex: 0 0 100%; height: 100%; display: block; color: #fff; overflow: hidden; }
.r3-nf-slide img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.r3-nf-scrim { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(15, 15, 17, .9) 0%, rgba(15, 15, 17, .35) 45%, rgba(15, 15, 17, .15) 100%); }
.r3-nf-top { position: absolute; z-index: 2; top: 0; left: 0; right: 0; padding: clamp(18px, 2vw, 30px); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.r3-nf-date { display: inline-flex; align-items: center; gap: 7px; font-family: var(--r3-sans); font-weight: 600; font-size: 13px; color: #fff; background: rgba(0, 0, 0, .35); backdrop-filter: blur(4px); padding: 5px 12px; }
.r3-nf-date svg { width: 15px; height: 15px; }
.r3-nf-body { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; padding: clamp(22px, 3vw, 44px); max-width: 760px; }
.r3-nf-body h3 { font-family: var(--r3-serif); font-weight: 700; font-size: clamp(22px, 2.6vw, 36px); line-height: 1.15; color: #fff; margin: 0 0 10px; }
.r3-nf-body p { font-size: clamp(14px, 1vw, 16px); line-height: 1.5; color: rgba(255, 255, 255, .88); margin: 0 0 14px; max-width: 64ch;
  display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.r3-nf-more { display: inline-flex; align-items: center; gap: 7px; font-family: var(--r3-sans); font-weight: 700; font-size: 14.5px; color: #fff;
  background: var(--r3-red); padding: 10px 18px; transition: background .18s, gap .18s; }
.r3-nf-slide:hover .r3-nf-more { background: var(--r3-red-d); gap: 11px; }
.r3-nf-more svg { width: 16px; height: 16px; }
.r3-nf-dots { position: absolute; z-index: 3; bottom: 18px; right: clamp(20px, 3vw, 44px); display: flex; gap: 8px; }
.r3-nf-dot { width: 11px; height: 11px; border-radius: 50%; border: 2px solid #fff; background: transparent; cursor: pointer; padding: 0; transition: background .18s, transform .18s; }
.r3-nf-dot.is-on { background: #fff; transform: scale(1.15); }

/* --- Liste rouge droite : miniatures + pastille de date ronde --- */
.r3-nl { background: var(--r3-red); color: #fff; padding: clamp(24px, 2.6vw, 40px) clamp(24px, 2.6vw, 40px) clamp(20px, 2vw, 30px); display: flex; flex-direction: column; }
.r3-nl-title { font-family: var(--r3-serif); font-weight: 700; font-size: 21px; color: #fff; margin: 0 0 6px; }
.r3-nl-item { display: flex; align-items: center; gap: 18px; padding: 16px 0; border-top: 1px solid rgba(255, 255, 255, .22); color: #fff; }
.r3-nl-item:first-of-type { border-top: none; }
.r3-nl-thumb { position: relative; flex: 0 0 104px; width: 104px; height: 76px; overflow: hidden; }
.r3-nl-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s var(--r3-ease); }
.r3-nl-item:hover .r3-nl-thumb img { transform: scale(1.08); }
.r3-nl-badge { position: absolute; left: -14px; bottom: -14px; width: 50px; height: 50px; border-radius: 50%; background: #fff; color: var(--r3-red);
  display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1; box-shadow: 0 4px 14px rgba(0, 0, 0, .3);
  font-family: var(--r3-sans); text-transform: uppercase; }
.r3-nl-badge b { font-size: 18px; font-weight: 800; }
.r3-nl-badge { font-size: 9.5px; font-weight: 700; letter-spacing: .04em; }
.r3-nl-txt { flex: 1; min-width: 0; }
.r3-nl-txt h4 { font-family: var(--r3-serif); font-weight: 600; font-size: 15.5px; line-height: 1.28; color: #fff; margin: 0 0 6px; }
.r3-nl-item:hover .r3-nl-txt h4 { text-decoration: underline; text-underline-offset: 3px; }
.r3-nl-more { font-family: var(--r3-sans); font-weight: 700; font-size: 12.5px; color: rgba(255, 255, 255, .92); }
.r3-nl-all { margin-top: auto; text-align: right; padding-top: 18px; font-family: var(--r3-sans); font-weight: 700; font-size: 14px; color: #fff; }
.r3-nl-all:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ============ QUIZ (bloc unique sobre) ============ */
.r3-quiz-grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(22px, 3vw, 42px); align-items: center; }
.r3-quiz-intro p { color: var(--r3-ink-2); }
.r3-quiz-facts { display: flex; gap: 28px; margin-top: 22px; flex-wrap: wrap; }
.r3-quiz-facts b { font-family: var(--r3-serif); font-weight: 600; font-size: 26px; color: var(--r3-red); display: block; }
.r3-quiz-facts span { font-size: 14px; color: var(--r3-ink-2); }
.r3-quiz-card {
  background: #fff; border: 1px solid var(--r3-line); border-top: 3px solid var(--r3-red);
  border-radius: 0; padding: 24px; box-shadow: 0 6px 20px rgba(20, 20, 24, .08);
}
.r3-quiz-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; font-family: var(--r3-sans); font-size: 14px; }
.r3-quiz-step { color: var(--r3-red); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; font-size: 12.5px; }
.r3-quiz-score { color: var(--r3-ink-2); }
.r3-quiz-q { font-family: var(--r3-serif); font-weight: 600; font-size: 21px; line-height: 1.3; margin: 0 0 20px; }
.r3-quiz-opts { display: grid; gap: 11px; }
.r3-quiz-opt {
  display: flex; align-items: center; gap: 12px; width: 100%; background: #fff;
  border: 1.5px solid var(--r3-line); border-radius: 0; padding: 11px 14px; cursor: pointer;
  font-family: var(--r3-sans); font-size: 15px; text-align: left; color: var(--r3-ink);
  transition: border-color .15s, background .15s;
}
.r3-quiz-opt:hover { border-color: var(--r3-red); background: var(--r3-red-wash); }
.r3-quiz-opt .r3-key {
  width: 25px; height: 25px; border-radius: 0; border: 1.5px solid var(--r3-line); flex-shrink: 0;
  display: grid; place-items: center; font-weight: 700; font-size: 12.5px; color: var(--r3-ink-2);
}
.r3-quiz-opt.r3-correct { border-color: #157a37; background: #f0faf3; }
.r3-quiz-opt.r3-correct .r3-key { background: #157a37; color: #fff; border-color: #157a37; }
.r3-quiz-opt.r3-wrong { border-color: var(--r3-red); background: var(--r3-red-wash); }
.r3-quiz-opt.r3-wrong .r3-key { background: var(--r3-red); color: #fff; border-color: var(--r3-red); }
.r3-quiz-feedback { margin-top: 15px; font-size: 14.5px; min-height: 20px; font-weight: 600; }
.r3-quiz-feedback.r3-ok { color: #157a37; }
.r3-quiz-feedback.r3-no { color: var(--r3-red); }

/* ============ RESSOURCES & MÉDIAS (fond noir léger, 2 colonnes) ============ */
.r3-media { background: #17171a; color: #fff; padding: clamp(44px, 5vw, 72px) 0; }
.r3-media .r3-eyebrow { color: #ff5a63; }
.r3-media-title { font-family: var(--r3-serif); font-weight: 700; font-size: clamp(23px, 2.6vw, 32px); color: #fff; margin: 0 0 18px; }
.r3-media-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(30px, 4vw, 60px); }
.r3-mdocs { border-right: 1px solid rgba(255, 255, 255, .1); padding-right: clamp(0px, 2vw, 40px); }
@media (max-width: 900px) { .r3-mdocs { border-right: none; padding-right: 0; } }

/* onglets */
.r3-mtabs { display: flex; flex-wrap: wrap; gap: 6px 22px; margin-bottom: 20px; border-bottom: 1px solid rgba(255, 255, 255, .12); }
.r3-tab { background: none; border: none; cursor: pointer; font-family: var(--r3-sans); font-weight: 600; font-size: 14.5px; color: rgba(255, 255, 255, .62); padding: 8px 0; position: relative; transition: color .15s; }
.r3-tab::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--r3-red); transform: scaleX(0); transition: transform .2s var(--r3-ease); }
.r3-tab:hover { color: #fff; }
.r3-tab.is-on { color: #fff; }
.r3-tab.is-on::after { transform: scaleX(1); }
/* variante pilule (média) */
.r3-mtabs-pill { border: none; margin-bottom: 0; gap: 8px; }
.r3-mtabs-pill .r3-tab { padding: 7px 16px; border: 1px solid rgba(255, 255, 255, .2); border-radius: 999px; }
.r3-mtabs-pill .r3-tab::after { display: none; }
.r3-mtabs-pill .r3-tab.is-on { background: var(--r3-red); border-color: var(--r3-red); }

/* lignes de documents (sombre) */
.r3-mdoc { display: flex; align-items: center; gap: 14px; padding: 13px 14px; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .09); border-left: 3px solid var(--r3-red); margin-bottom: 10px; transition: background .15s, transform .15s; color: #fff; }
.r3-mdoc:hover { background: rgba(255, 255, 255, .09); transform: translateX(3px); }
.r3-mdoc-type { flex-shrink: 0; min-width: 42px; text-align: center; font-family: var(--r3-sans); font-weight: 700; font-size: 11px; letter-spacing: .05em; color: #ff5a63; border: 1px solid rgba(255, 90, 99, .5); padding: 4px 7px; }
.r3-mdoc-info { flex: 1; min-width: 0; }
.r3-mdoc-info b { font-family: var(--r3-serif); font-weight: 600; font-size: 15px; line-height: 1.25; display: block; color: #fff; }
.r3-mdoc-info span { font-size: 12px; color: rgba(255, 255, 255, .55); }
.r3-mdoc-dl { flex-shrink: 0; color: #fff; }
.r3-mdoc-dl svg { width: 20px; height: 20px; }
.r3-mdoc-all { display: inline-block; margin-top: 6px; font-family: var(--r3-sans); font-weight: 700; font-size: 14px; color: #ff5a63; }
.r3-mdoc-all:hover { color: #fff; }

/* média droit */
.r3-mmedia-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; }
.r3-mvideo { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: #000; }
.r3-mvideo video { width: 100%; height: 100%; object-fit: cover; }
.r3-mvid-btn { position: absolute; inset: 0; display: grid; place-items: center; border: none; cursor: pointer; background: linear-gradient(0deg, rgba(0, 0, 0, .45), rgba(0, 0, 0, .1)); }
.r3-mvid-btn span { width: 72px; height: 72px; border-radius: 50%; background: var(--r3-red); color: #fff; display: grid; place-items: center; box-shadow: 0 0 0 0 rgba(200, 16, 46, .5); animation: r3-pulse-red 2s infinite; }
@keyframes r3-pulse-red { 0% { box-shadow: 0 0 0 0 rgba(200, 16, 46, .5); } 70% { box-shadow: 0 0 0 20px rgba(200, 16, 46, 0); } 100% { box-shadow: 0 0 0 0 rgba(200, 16, 46, 0); } }
.r3-mvid-btn svg { width: 28px; height: 28px; fill: #fff; margin-left: 3px; }
.r3-mvid-badge { position: absolute; top: 14px; left: 14px; font-family: var(--r3-sans); font-weight: 700; font-size: 11.5px; letter-spacing: .05em; text-transform: uppercase; background: var(--r3-red); color: #fff; padding: 5px 10px; }
.r3-mvid-cap { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 14px; }
.r3-mvid-cap h4 { font-family: var(--r3-serif); font-weight: 600; font-size: 17px; color: #fff; margin: 0; }
.r3-mmore { font-family: var(--r3-sans); font-weight: 700; font-size: 14px; color: #ff5a63; flex-shrink: 0; }
.r3-mmore:hover { color: #fff; }
/* grille photos */
.r3-mphotos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.r3-mphoto { position: relative; aspect-ratio: 1; overflow: hidden; display: block; }
.r3-mphoto img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s var(--r3-ease); }
.r3-mphoto:hover img { transform: scale(1.08); }
.r3-mphoto-more { background: var(--r3-red); display: grid; place-items: center; color: #fff; font-family: var(--r3-serif); font-weight: 700; font-size: 22px; line-height: 1; }
.r3-mphoto-more small { display: block; font-family: var(--r3-sans); font-weight: 600; font-size: 11px; text-transform: uppercase; letter-spacing: .05em; margin-top: 3px; }
@media (max-width: 900px) { .r3-media-grid { grid-template-columns: 1fr; } }

/* ============ IMPACT (façon innovation.ca : titre + intro + 3 stats icône/nombre) ============ */
.r3-infra-head { max-width: 900px; margin-bottom: clamp(28px, 4vw, 46px); }
.r3-infra-title { font-family: var(--r3-serif); font-weight: 700; font-size: clamp(28px, 4vw, 46px); line-height: 1.08; margin-top: 4px; }
.r3-infra-sub { font-size: 18px; color: var(--r3-ink-2); margin: 14px 0 0; max-width: 72ch; }
.r3-infra-report { color: var(--r3-red); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1.5px; white-space: nowrap; }
.r3-infra-report:hover { color: var(--r3-red-d); }
.r3-infra-pdf { display: inline-block; font-size: 10.5px; font-weight: 700; letter-spacing: .04em; color: #fff; background: var(--r3-red); padding: 2px 5px; margin-right: 6px; vertical-align: middle; }
.r3-infra-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(26px, 4vw, 56px); }
.r3-stat { text-align: left; }
.r3-stat-top { display: flex; align-items: center; gap: 16px; }
.r3-stat-ico { color: var(--r3-red); flex-shrink: 0; }
.r3-stat-ico svg { width: 50px; height: 50px; stroke: currentColor; fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.r3-stat b { font-family: var(--r3-serif); font-weight: 700; font-size: clamp(34px, 4.4vw, 52px); color: var(--r3-ink); line-height: 1; }
.r3-stat-cap { display: block; margin-top: 12px; font-size: 15.5px; color: var(--r3-ink-2); line-height: 1.45; }
/* filet pointillé rouge en bas (écho de la ligne pointillée de la référence) */
.r3-infra::after { content: ""; display: block; margin-top: clamp(28px, 4vw, 46px); border-top: 2px dotted var(--r3-red-line); }

/* ============ FORUM (bandeau horizontal) ============ */
.r3-forum {
  display: flex; align-items: center; justify-content: space-between; gap: 28px; flex-wrap: wrap;
  background: #fff; border: 1px solid var(--r3-line); border-left: 4px solid var(--r3-red);
  padding: clamp(20px, 2.6vw, 32px) clamp(22px, 3vw, 44px);
}
.r3-forum-txt { max-width: 70ch; }
.r3-forum h2 { font-size: clamp(23px, 2.8vw, 33px); margin: 6px 0 8px; }
.r3-forum p { color: var(--r3-ink-2); font-size: 15.5px; margin: 0; }
.r3-forum .r3-btn { flex-shrink: 0; }

/* ============ PARTENAIRES (pleine largeur, fond rouge, logos défilants) ============ */
.r3-plog { background: linear-gradient(135deg, var(--r3-red) 0%, var(--r3-red-d) 100%); color: #fff; padding: clamp(38px, 4.4vw, 58px) 0; overflow: hidden; }
.r3-plog-head { margin-bottom: 26px; }
.r3-plog .r3-eyebrow { color: rgba(255, 255, 255, .85); }
.r3-plog-head h2 { font-family: var(--r3-serif); font-weight: 700; font-size: clamp(27px, 3.6vw, 42px); color: #fff; margin-top: 2px; }
/* marquee : bords fondus */
.r3-plog-marquee { position: relative; overflow: hidden;
  -webkit-mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
  mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.r3-plog-track { display: flex; gap: 18px; width: max-content; will-change: transform; animation: r3-plog-scroll 34s linear infinite; }
.r3-plog-marquee:hover .r3-plog-track { animation-play-state: paused; }
@keyframes r3-plog-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
/* plaque-logo (wordmark) */
.r3-plog-item {
  flex: 0 0 auto; position: relative; display: flex; align-items: center; justify-content: center;
  min-width: 200px; height: 110px; padding: 18px 34px; background: #fff; color: var(--r3-ink);
  transition: transform .2s var(--r3-ease), box-shadow .2s;
}
.r3-plog-item:hover { transform: translateY(-6px); box-shadow: 0 18px 36px rgba(0, 0, 0, .3); z-index: 2; }
/* logo : contenu, en niveaux de gris au repos, couleur au survol */
.r3-plog-img {
  max-height: 72px; max-width: 150px; width: auto; height: auto; object-fit: contain;
  filter: grayscale(1); opacity: .78; transition: filter .25s var(--r3-ease), opacity .25s var(--r3-ease), transform .25s var(--r3-ease);
}
.r3-plog-item:hover .r3-plog-img { filter: grayscale(0); opacity: 1; transform: scale(1.04); }
/* anciennes plaques-texte (repli si pas d'image) */
.r3-plog-mk { font-family: var(--r3-serif); font-weight: 700; font-size: 21px; letter-spacing: .02em; line-height: 1; }
.r3-plog-sub { font-family: var(--r3-sans); font-weight: 600; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; color: var(--r3-ink-2); }
.r3-plog-item::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--r3-red); transform: scaleX(0); transform-origin: left; transition: transform .25s var(--r3-ease); }
.r3-plog-item:hover::after { transform: scaleX(1); }
@media (prefers-reduced-motion: reduce) {
  .r3-plog-track { animation: none !important; transform: none !important; }
  .r3-plog-marquee { overflow-x: auto; }
}

/* ============ NEWSLETTER (2 colonnes : texte + carte rouge) ============ */
.r3-nlet { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(30px, 5vw, 72px); align-items: center; }
.r3-nlet-title { font-family: var(--r3-serif); font-weight: 700; font-size: clamp(28px, 4vw, 48px); line-height: 1.08; margin: 4px 0 16px; }
/* surlignage « marqueur » rouge sur les mots-clés */
.r3-hl { background: var(--r3-red); color: #fff; padding: 0 .14em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.r3-nlet-left p { font-size: 17px; line-height: 1.6; color: var(--r3-ink-2); max-width: 56ch; margin: 0; }
/* carte rouge */
.r3-nlet-card { background: linear-gradient(135deg, var(--r3-red) 0%, var(--r3-red-d) 100%); color: #fff; padding: clamp(26px, 3vw, 40px); box-shadow: 0 18px 44px rgba(200, 16, 46, .28); }
.r3-nlet-card-head { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
.r3-nlet-logo { height: 44px; width: auto; background: #fff; padding: 4px; }
.r3-nlet-slogan { font-family: var(--r3-serif); font-weight: 700; font-size: 19px; color: #fff; }
.r3-nlet-sub { font-size: 15.5px; line-height: 1.5; color: rgba(255, 255, 255, .9); margin: 0 0 18px; }
.r3-nlet-form { display: flex; gap: 10px; flex-wrap: wrap; }
.r3-nlet-form input { flex: 1; min-width: 200px; border: none; background: #fff; color: var(--r3-ink); font-family: var(--r3-sans); font-size: 15px; padding: 13px 16px; outline: 2px solid transparent; transition: outline-color .15s; }
.r3-nlet-form input:focus-visible { outline-color: var(--r3-ink); }
.r3-nlet-form button { border: none; cursor: pointer; background: var(--r3-ink); color: #fff; font-family: var(--r3-sans); font-weight: 700; font-size: 15px; padding: 13px 26px; transition: background .15s, transform .1s; }
.r3-nlet-form button:hover { background: #000; }
.r3-nlet-form button:active { transform: translateY(1px); }
.r3-nlet-note { font-size: 13px; color: rgba(255, 255, 255, .78); margin: 12px 0 0; }
.r3-nlet-note.r3-ok { color: #fff; font-weight: 600; }

/* ============ FOOTER (clair) ============ */
.r3-footer { background: var(--r3-red-wash); border-top: 3px solid var(--r3-red); padding: 42px 0 0; }
.r3-foot-main { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.3fr; gap: 32px; padding-bottom: 30px; border-bottom: 1px solid var(--r3-red-line); }
.r3-foot-brand { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.r3-foot-brand img { height: 48px; }
.r3-foot-brand span { font-family: var(--r3-serif); font-weight: 600; font-size: 21px; }
.r3-footer .r3-bio { color: var(--r3-ink-2); font-size: 15px; max-width: 40ch; margin: 0; }
.r3-fsoc { display: flex; gap: 10px; margin-top: 16px; }
.r3-fsoc a { width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--r3-red-line); display: grid; place-items: center; transition: background .15s, border-color .15s; }
.r3-fsoc a:hover { background: var(--r3-red); border-color: var(--r3-red); }
.r3-fsoc a:hover svg { stroke: #fff; }
.r3-fsoc svg { width: 17px; height: 17px; fill: none; stroke: var(--r3-red); stroke-width: 2; transition: stroke .15s; }
.r3-footer h4 { font-family: var(--r3-sans); font-weight: 700; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--r3-red); margin: 0 0 16px; }
.r3-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.r3-footer ul a { color: var(--r3-ink); font-size: 15px; transition: color .15s, padding-left .15s; }
.r3-footer ul a:hover { color: var(--r3-red); padding-left: 4px; }
.r3-foot-contact div { color: var(--r3-ink-2); font-size: 15px; margin-bottom: 12px; line-height: 1.5; }
.r3-foot-contact a { color: var(--r3-ink); }
.r3-foot-contact a:hover { color: var(--r3-red); }
.r3-foot-bottom { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding: 20px 0; font-size: 13.5px; color: var(--r3-ink-2); }
.r3-foot-bottom a { color: var(--r3-ink-2); text-decoration: underline; text-underline-offset: 2px; }
.r3-foot-bottom a:hover { color: var(--r3-red); }

/* ============ REVEAL ============ */
.r3-reveal { opacity: 0; transform: translateY(22px); transition: opacity .6s var(--r3-ease), transform .6s var(--r3-ease); }
.r3-reveal.r3-in { opacity: 1; transform: none; }
.r3-reveal-2 { transition-delay: .08s; }
.r3-reveal-3 { transition-delay: .16s; }
.r3-reveal-4 { transition-delay: .24s; }

/* ============ RESPONSIVE ============ */
@media (max-width: 1024px) {
  .r3-dir-grid { grid-template-columns: 1fr; gap: 40px; }
  .r3-dir-media { max-width: 460px; }
  .r3-blog-feat-media { aspect-ratio: 2 / 1; }
  .r3-quiz-grid { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .r3-nav, .r3-header-actions .r3-search, .r3-lang, .r3-login { display: none; }
  .r3-hot { padding: 6px 12px 6px 6px; }
  .r3-hot-txt small { display: none; }
  .r3-hot-txt b { font-size: 18px; }
  .r3-hot-ic { width: 34px; height: 34px; }
  .r3-burger { display: flex; }
  .r3-nav.r3-mobile {
    display: flex; flex-direction: column; align-items: stretch; gap: 0; position: fixed; top: 0; right: 0; bottom: 0;
    width: min(340px, 85vw); background: #fff; z-index: 95; padding: 80px 20px 30px; overflow-y: auto;
    transform: translateX(100%); transition: transform .3s var(--r3-ease); margin: 0; box-shadow: -10px 0 40px rgba(0,0,0,.14);
  }
  .r3-nav.r3-mobile.r3-open { transform: translateX(0); }
  .r3-nav.r3-mobile .r3-ni { width: 100%; }
  .r3-nav.r3-mobile .r3-ni > a { padding: 14px 8px; font-size: 17px; border-bottom: 1px solid var(--r3-line); border-radius: 0; }
  .r3-nav.r3-mobile .r3-ni > a.r3-act::after { display: none; }
  .r3-nav.r3-mobile .r3-drop {
    position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: none;
    padding: 0 0 6px 12px; max-height: 0; overflow: hidden; transition: max-height .28s var(--r3-ease);
  }
  .r3-nav.r3-mobile .r3-ni.r3-expanded .r3-drop { max-height: 440px; }
}
@media (max-width: 760px) {
  .r3-blog-feat-media { aspect-ratio: 16 / 10; }
  .r3-blog-feat-body h3 { font-size: 20px; }
  .r3-news2 { grid-template-columns: 1fr; }
  .r3-nf-view { min-height: 300px; }
  .r3-nlet { grid-template-columns: 1fr; }
  .r3-infra-stats { grid-template-columns: 1fr; gap: 22px; }
  .r3-docs { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  body { font-size: 16px; }
  .r3-topbar-left, .r3-hide-sm { display: none; }
  .r3-access .r3-wrap { flex-direction: column; align-items: stretch; }
  .r3-hero-cta { flex-direction: column; align-items: stretch; }
  .r3-btn { justify-content: center; }
  .r3-doc { flex-wrap: wrap; }
  .r3-foot-main { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 460px) { .r3-foot-main { grid-template-columns: 1fr; } }

/* ============ REDUCED MOTION ============ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
  .r3-reveal { opacity: 1; transform: none; }
}

/* ============ IMPRESSION ============ */
@media print {
  .r3-topbar, .r3-header, .r3-scrim, .r3-access, .r3-burger, .r3-quiz-card, .r3-hero-cta, .r3-fsoc { display: none !important; }
  body { color: #000; background: #fff; font-size: 12pt; }
  .r3-sec-tint, .r3-footer, .r3-access { background: #fff !important; }
  .r3-sec { padding: 14px 0; }
  a { color: #000; text-decoration: underline; }
}