/* Ma Primaire — Lisibilité générale renforcée
   S'applique aux pages niveaux modernes et améliore aussi tablette + ordinateur.
   À charger après les autres CSS.
*/

:root {
  --mpr-readable-body: clamp(17px, 0.35vw + 15.5px, 19px);
  --mpr-readable-small: clamp(15px, 0.25vw + 14px, 17px);
  --mpr-readable-card-title: clamp(20px, 0.45vw + 18px, 24px);
  --mpr-readable-section-title: clamp(34px, 1.2vw + 26px, 48px);
}

/* Base générale */
html {
  font-size: var(--mpr-readable-body);
}

body,
p,
li,
input,
select,
textarea,
button {
  font-size: 1rem !important;
  line-height: 1.62 !important;
}

/* Header / navigation */
.site-header,
.topbar,
.header-inner {
  font-size: 1rem !important;
}

.brand,
.logo-text,
.site-title {
  font-size: clamp(17px, 0.3vw + 15px, 20px) !important;
  font-weight: 800 !important;
}

.niveau-nav a,
.levels-nav a,
.top-levels a,
.level-pill,
.nav-pill {
  font-size: clamp(16px, 0.25vw + 15px, 18px) !important;
  min-height: 50px !important;
  padding: 0.85rem 1.15rem !important;
}

/* Hero */
.hero-eyebrow,
.section-eyebrow,
.eyebrow,
.kicker,
.surtitle,
.rubrique-eyebrow,
.niveau-hero__eyebrow {
  font-size: clamp(15px, 0.25vw + 14px, 17px) !important;
  line-height: 1.35 !important;
  letter-spacing: 0.06em !important;
  font-weight: 800 !important;
}

h1,
.hero-title,
.page-title,
.niveau-title,
.niveau-hero__title {
  font-size: clamp(44px, 2.8vw + 22px, 70px) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.04em !important;
}

.hero-text,
.hero-description,
.niveau-hero__text,
.niveau-hero__desc,
.intro-text {
  font-size: clamp(19px, 0.45vw + 16px, 23px) !important;
  line-height: 1.65 !important;
}

/* Boutons */
.btn,
button,
input[type="submit"],
input[type="button"],
.chip,
.pill,
.filter-chip {
  font-size: clamp(16px, 0.3vw + 15px, 18px) !important;
  line-height: 1.35 !important;
  min-height: 50px !important;
  padding: 0.85rem 1.2rem !important;
  font-weight: 800 !important;
}

/* Recherche */
.search-label,
label[for="search"],
.form-label,
.search-title {
  font-size: clamp(17px, 0.3vw + 16px, 20px) !important;
  line-height: 1.4 !important;
}

input[type="search"],
.search-input,
input[type="text"] {
  font-size: clamp(17px, 0.35vw + 15px, 20px) !important;
  min-height: 58px !important;
  padding: 1rem 1.15rem !important;
}

/* Badges / compteurs */
.stat,
.hero-stat,
.badge,
.tag,
.card-badge,
.resource-badge,
.exercise-type,
.partner-badge {
  font-size: clamp(14px, 0.25vw + 13px, 16px) !important;
  line-height: 1.35 !important;
  padding: 0.62rem 0.95rem !important;
  font-weight: 800 !important;
}

/* Sections */
h2,
.section-title,
.rubrique-title {
  font-size: var(--mpr-readable-section-title) !important;
  line-height: 1.14 !important;
  letter-spacing: -0.03em !important;
}

.section-count,
.rubrique-count,
.counter-pill {
  font-size: clamp(15px, 0.25vw + 14px, 17px) !important;
}

/* Cartes */
.card,
.exercise-card,
.resource-card,
.item-card {
  padding: clamp(1.45rem, 1vw + 1rem, 2rem) !important;
  border-radius: 24px !important;
}

.card h3,
.exercise-card__title,
.resource-card__title,
.item-card__title,
.card-title {
  font-size: var(--mpr-readable-card-title) !important;
  line-height: 1.25 !important;
  font-weight: 850 !important;
}

.card p,
.exercise-card__excerpt,
.resource-card__excerpt,
.item-card__excerpt,
.card-desc,
.card-description,
.exercise-card__desc {
  font-size: clamp(17px, 0.35vw + 15px, 20px) !important;
  line-height: 1.62 !important;
}

.card a,
.exercise-card__link,
.resource-card__link,
.item-card__link,
.card-cta {
  font-size: clamp(17px, 0.3vw + 15px, 19px) !important;
  line-height: 1.45 !important;
  font-weight: 850 !important;
}

/* Tablette */
@media (max-width: 1100px) {
  h1,
  .hero-title,
  .page-title,
  .niveau-title,
  .niveau-hero__title {
    font-size: clamp(38px, 5vw, 58px) !important;
  }

  .hero-text,
  .hero-description,
  .niveau-hero__text,
  .niveau-hero__desc {
    font-size: 1.08rem !important;
  }

  .card h3,
  .exercise-card__title,
  .resource-card__title,
  .item-card__title,
  .card-title {
    font-size: 1.24rem !important;
  }
}

/* Mobile, conservé confortable */
@media (max-width: 640px) {
  html {
    font-size: 17.5px;
  }

  h1,
  .hero-title,
  .page-title,
  .niveau-title,
  .niveau-hero__title {
    font-size: clamp(36px, 9vw, 46px) !important;
  }

  h2,
  .section-title,
  .rubrique-title {
    font-size: clamp(28px, 7vw, 36px) !important;
  }

  .btn,
  button,
  input[type="submit"],
  input[type="button"] {
    width: 100%;
    justify-content: center !important;
  }

  .card,
  .exercise-card,
  .resource-card,
  .item-card {
    padding: 1.25rem !important;
  }
}