/* ============================================================
   RESEARCH (recherches récentes) — styles de composition.
   Tout dérive des tokens du design system.
   ============================================================ */

/* ---- Hero ---- */
.research-hero {
  background:
    radial-gradient(120% 120% at 0% 0%, var(--blue-50) 0%, transparent 55%),
    var(--surface-page);
  padding: clamp(1.5rem, 3.5vw, 2.5rem) 0 clamp(1.25rem, 2.5vw, 2rem);
  border-bottom: 1px solid var(--border-subtle);
}
.research-hero__title {
  font-size: var(--text-h1);
  font-weight: var(--weight-black);
  letter-spacing: var(--tracking-tight);
  margin: 10px 0 0;
  color: var(--text-strong);
}
.research-hero__lead {
  max-width: 60ch;
  margin: 14px 0 0;
  font-size: var(--text-body-lg);
  color: var(--text-muted);
}

/* ---- Onglets (CSS pur, basés sur des radios) ---- */
.research-tabs { padding-top: clamp(1.5rem, 3vw, 2.5rem); }
.research-tabs__radio { position: absolute; opacity: 0; width: 0; height: 0; }
.research-tabs__nav {
  display: inline-flex; gap: 4px; padding: 4px;
  background: var(--surface-sunken);
  border: var(--border-width) solid var(--border-subtle);
  border-radius: var(--radius-pill);
  margin-bottom: var(--space-2);
}
.research-tabs__tab {
  font-size: var(--text-sm); font-weight: var(--weight-semibold);
  color: var(--text-muted); cursor: pointer;
  padding: 0.45rem 1rem; border-radius: var(--radius-pill);
  transition: background var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.research-tabs__tab:hover { color: var(--text-strong); }
/* onglet actif selon la radio cochée */
#restab-team:checked   ~ .research-tabs__nav label[for="restab-team"],
#restab-collab:checked ~ .research-tabs__nav label[for="restab-collab"] {
  background: var(--surface-card); color: var(--color-primary); box-shadow: var(--shadow-xs);
}
.research-tabs__radio:focus-visible ~ .research-tabs__nav label { box-shadow: var(--focus-ring); }
/* panneaux : masqués par défaut, affichés selon la radio cochée */
.research-tabs__panel { display: none; }
#restab-team:checked   ~ .research-tabs__panel[data-panel="team"],
#restab-collab:checked ~ .research-tabs__panel[data-panel="collab"] { display: block; }
.research-tabs__hint { margin: var(--space-2) 0 0; color: var(--text-muted); font-size: var(--text-sm); }

/* ---- Liste de publications (deux colonnes) ---- */
.research-list {
  padding-block: clamp(1.5rem, 3vw, 2.5rem);
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  align-items: start;
}
@media (max-width: 720px) {
  .research-list { grid-template-columns: 1fr; }
}
.research-pub { transition: box-shadow var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out); }
.research-pub:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }

.research-pub__title {
  font-size: var(--text-h3);
  font-weight: var(--weight-semibold);
  color: var(--text-strong);
  margin: 0 0 var(--space-2);
  line-height: var(--leading-snug);
}
.research-pub__meta {
  margin: 0 0 var(--space-4);
  color: var(--text-body);
  font-size: var(--text-sm);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.research-pub__src { color: var(--text-muted); font-size: var(--text-sm); }
.phla-btn.is-secondary svg { width: 1em; height: 1em; }

/* ---- Disclaimer ---- */
.research-foot { padding-bottom: clamp(2rem, 5vw, 3.5rem); max-width: 860px; }