/* Exkave — contrat typographique global.
   Deux familles seulement : Avenir Next pour l'éditorial, la pile monospace
   système pour les données techniques. Le rythme, pas la graisse, porte la
   hiérarchie. */
:root {
  --font-body: "Avenir Next", Avenir, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: var(--font-body);
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, "Cascadia Mono", Consolas, monospace;

  --font-weight-regular: 400;
  --font-weight-emphasis: 600;
  --font-weight-strong: 700;

  --font-size-body: 1rem;
  --font-size-small: .8125rem;
  --font-size-h1: clamp(2.5rem, 4vw, 3.6rem);
  --font-size-h2: clamp(1.8rem, 2.8vw, 2.6rem);
  --font-size-h3: clamp(1.25rem, 2vw, 1.65rem);
  --font-size-h4: 1.0625rem;

  --line-height-body: 1.55;
  --line-height-heading: 1.05;

  --letter-spacing-h1: -.045em;
  --letter-spacing-h2: -.03em;
}

html {
  font-synthesis: none;
}

body,
p,
li,
dt,
dd,
th,
td,
label,
legend,
summary,
dialog,
[popover] {
  font-family: var(--font-body);
  font-weight: var(--font-weight-regular);
}

body {
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
}

/* Les pages n'ont pas toutes le meme type de scene, mais leur racine doit
   toujours rester centree lorsqu'elle porte une largeur maximale. Une page
   pleine largeur ne change pas ; une page comme la Bibliotheque (1500 px)
   retrouve des marges gauche/droite symetriques, du mobile a l'ultra-wide. */
body > main:not(#exkave-layout-local):not(#exkave-layout-component) {
  box-sizing: border-box;
  margin-inline: auto !important;
}

/* Les anciennes feuilles restent parfois en cache après une release. Cette
   portée forte garantit le contrat sur le DOM déjà servi, même face à leurs
   sélecteurs locaux en !important. Les données techniques sont rétablies en
   monospace plus bas. */
body *:not(#exkave-typography-local):not(#exkave-typography-component) {
  font-family: var(--font-body) !important;
  font-weight: var(--font-weight-regular) !important;
}

button,
input,
textarea,
select,
option,
optgroup,
output {
  font-family: var(--font-body) !important;
  font-weight: var(--font-weight-regular) !important;
}

::placeholder {
  font-family: var(--font-body);
  font-weight: var(--font-weight-regular);
}

h1:not(#exkave-typography-local):not(#exkave-typography-component),
h2:not(#exkave-typography-local):not(#exkave-typography-component),
h3:not(#exkave-typography-local):not(#exkave-typography-component),
h4:not(#exkave-typography-local):not(#exkave-typography-component),
h5:not(#exkave-typography-local):not(#exkave-typography-component),
h6:not(#exkave-typography-local):not(#exkave-typography-component),
.page-title,
.hero-title,
.product-title,
.base-title,
.section-title,
.panel-title,
.modal-title,
.drawer-title,
.card-title,
.heading,
.heading-large,
.heading-small,
.pf-title,
.search-title,
.library-title,
.result-title,
.pressing-title,
.master-title,
.album-title,
.news-title,
.titre-xl,
.titre-l,
.titre-m,
.titre-s,
.ex-titre-xl,
.ex-titre-l,
.ex-titre-m,
.ex-titre-s {
  font-family: var(--font-display) !important;
  font-weight: var(--font-weight-regular) !important;
  text-wrap: balance;
}

h1:not(#exkave-typography-local):not(#exkave-typography-component),
.page-title,
.hero-title,
.product-title,
.base-title,
.titre-xl,
.ex-titre-xl {
  font-size: var(--font-size-h1) !important;
  line-height: var(--line-height-heading) !important;
  letter-spacing: var(--letter-spacing-h1) !important;
}

h2:not(#exkave-typography-local):not(#exkave-typography-component),
.section-title,
.panel-title,
.modal-title,
.drawer-title,
.heading-large,
.search-title,
.library-title,
.result-title,
.titre-l,
.ex-titre-l {
  font-size: var(--font-size-h2) !important;
  line-height: var(--line-height-heading) !important;
  letter-spacing: var(--letter-spacing-h2) !important;
}

h3:not(#exkave-typography-local):not(#exkave-typography-component),
.card-title,
.heading,
.pressing-title,
.master-title,
.album-title,
.news-title,
.pf-title,
.titre-m,
.ex-titre-m {
  font-size: var(--font-size-h3) !important;
  line-height: 1.16 !important;
  letter-spacing: -.02em !important;
}

h4:not(#exkave-typography-local):not(#exkave-typography-component),
h5:not(#exkave-typography-local):not(#exkave-typography-component),
h6:not(#exkave-typography-local):not(#exkave-typography-component),
.heading-small,
.titre-s,
.ex-titre-s {
  font-size: var(--font-size-h4) !important;
  line-height: 1.25 !important;
  letter-spacing: -.01em !important;
}

.eyebrow,
.kicker,
.overline,
.micro-title,
.result-section-head,
.ex-meta,
.mono {
  font-size: var(--font-size-small);
  font-weight: var(--font-weight-regular) !important;
}

:is(code, pre, kbd, samp, .mono, .ex-meta, [data-technical-font]):not(#exkave-typography-local):not(#exkave-typography-component) {
  font-family: var(--font-mono) !important;
  font-weight: var(--font-weight-regular) !important;
}

/* Exception editoriale : la date monumentale du master et la hierarchie de
   titres structurent la lecture. Les annees des cartes, textes courants,
   aides, metadonnees et libelles de controle restent a 400. */
:is(.master-top .master-meta-stat:not(.exb-total-enfants) .mmy-v):not(#exkave-typography-local):not(#exkave-typography-component) {
  font-weight: var(--font-weight-emphasis) !important;
}

:is(
  h1, h2, h3, h4, h5, h6,
  .page-title, .hero-title, .product-title, .base-title,
  .card-title, .heading, .pressing-title, .master-title, .album-title,
  .news-title, .pf-title, .heading-small,
  .titre-xl, .ex-titre-xl, .titre-l, .ex-titre-l,
  .titre-m, .ex-titre-m, .titre-s, .ex-titre-s,
  .statement > p:not(.suite)
):not(#exkave-typography-local):not(#exkave-typography-component) {
  font-weight: var(--font-weight-emphasis) !important;
}

strong,
b,
label,
.bold,
.font-bold,
.font-semibold,
.font-medium,
.semibold,
.medium {
  font-weight: var(--font-weight-regular) !important;
}

/* Le nom de la formule active est un statut de compte, pas du texte courant. */
body.profile-page :is(
  #subscriptionStatus > strong,
  #subscriptionPlans .plan-name
):not(#exkave-typography-local):not(#exkave-typography-component) {
  font-weight: var(--font-weight-emphasis) !important;
}

/* Les noms Free, Plus et Pro structurent les cartes tarifaires de la landing
   comme les noms de formule du profil. Ils partagent donc le même accent. */
body.landing-page .plus-grille .formule > .mono:not(#exkave-typography-local):not(#exkave-typography-component) {
  font-weight: var(--font-weight-emphasis) !important;
}

/* Une action doit rester immédiatement identifiable, quelle que soit la page. */
html body :is(
  button,
  input[type="button"],
  input[type="submit"],
  input[type="reset"],
  [role="button"],
  .button,
  .btn,
  .bouton,
  .cta,
  .action,
  .read-link,
  .submit-btn,
  [class$="-button"],
  [class*="-button "],
  [class$="-btn"],
  [class*="-btn "],
  [class$="-cta"],
  [class*="-cta "]
):not(#exkave-typography-local):not(#exkave-typography-component) {
  font-weight: var(--font-weight-emphasis) !important;
}

@media (max-width: 680px) {
  :root {
    --font-size-h1: clamp(2.2rem, 11vw, 3.3rem);
    --font-size-h2: clamp(1.75rem, 8vw, 2.55rem);
    --font-size-h3: clamp(1.2rem, 5vw, 1.5rem);
  }
}

/* Le rail d'albums est un composant dense : ses titres utilisent 80 % de
   l'echelle h3 globale afin de conserver deux lignes lisibles sans rognage. */
body.library-page[data-ex-biblio] #results#results.album-rail .result h3 {
  font-size: clamp(1rem, 1.6vw, 1.32rem) !important;
}

/* La page Bibliotheque gagne en presence sur grand ecran sans imposer ces
   proportions aux formats tactiles plus etroits. Les maxima correspondent au
   viewport desktop de reference (1449 px). */
@media (min-width: 721px) {
  body.library-page[data-ex-biblio] #result-title#result-title {
    font-size: clamp(34px, 3.313vw, 48px) !important;
  }

  body.library-page[data-ex-biblio] #search-submit#search-submit {
    font-size: clamp(13.44px, 1.273vw, 18.44px) !important;
  }

  body.library-page[data-ex-biblio] .search-scan-separator.search-scan-separator {
    font-size: clamp(12.48px, 1.206vw, 17.48px) !important;
  }
}
