/*
 * Titres de pages — une identité par page au lieu du gabarit unique
 * « tiret + surtitre doré + serif + fin en italique doré ».
 * Sélecteurs par ID + !important : passent devant les surcouches
 * historiques (LT26, grand-line, premium, app-light) quel que soit l'ordre
 * de chargement. Les couleurs reprennent les variables de chaque page,
 * donc les thèmes clair / sombre suivent sans redéfinition.
 * (Accueil, Acheter et Carte : voir accueil-react.css, acheter-gallery.css,
 * carte-gallery.css.)
 */

/* Certains thèmes posent un dégradé en background-clip:text sur les h1/em :
   on le neutralise pour tous les titres gérés ici. */
html body :is(#vendre-gl-title, #depot-title, #hunter-title, #forum-title, #ccm26-title, #seller-title, #lt-site-footer-title),
html body :is(#vendre-gl-title, #depot-title, #hunter-title, #forum-title, #ccm26-title, #seller-title, #lt-site-footer-title) em {
  background-image: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  filter: none !important;
  text-shadow: none !important;
  text-transform: none !important;
}

/* ——— Vendre, Chasseur, Comment ça marche : « sobre et direct » ———
   Un vrai fil d'Ariane à la place du surtitre décoratif, un titre en une
   phrase concrète, sans mot mis en couleur. */
html body .lt-crumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 18px;
  font: 500 13px/1.4 Inter, system-ui, sans-serif;
  letter-spacing: 0;
  text-transform: none;
}
html body .lt-crumbs a { color: inherit !important; opacity: .62; text-decoration: none; }
html body .lt-crumbs a:hover { opacity: 1; text-decoration: underline; text-underline-offset: 3px; }
html body .lt-crumbs > span[aria-hidden] { opacity: .35; }
html body .lt-crumbs [aria-current] { opacity: .9; }
html body .vendre-gl-hero .lt-crumbs { color: var(--vs-text); }
html body .hunter-hero .lt-crumbs { color: var(--h-text); }
html body .ccm26-hero .lt-crumbs { color: var(--ccm-ink); }

html body :is(#vendre-gl-title, #hunter-title, #ccm26-title) {
  max-width: 17em;
  font: 600 clamp(2rem, 1.35rem + 2.3vw, 3.25rem)/1.1 Inter, system-ui, sans-serif !important;
  letter-spacing: -.04em !important;
  text-wrap: balance;
}
html body #vendre-gl-title { color: var(--vs-text) !important; -webkit-text-fill-color: var(--vs-text) !important; }
html body #hunter-title { color: var(--h-text) !important; -webkit-text-fill-color: var(--h-text) !important; }
html body #ccm26-title { color: var(--ccm-ink) !important; -webkit-text-fill-color: var(--ccm-ink) !important; }

/* ——— Déposer : « socle d'exposition » ———
   Grande sans fine, puis un cartel posé sur une plinthe dorée. */
html body .lt26-deposer .depot-eyebrow {
  gap: 10px;
  color: var(--dq-muted) !important;
  font: 500 13px/1.4 Inter, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
html body .lt26-deposer .depot-eyebrow::before {
  content: "+";
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 4px;
  background: var(--dq-gold);
  color: var(--dq-bg);
  font: 600 15px/1 Inter, system-ui, sans-serif;
}
html body #depot-title {
  color: var(--dq-text) !important;
  -webkit-text-fill-color: var(--dq-text) !important;
  font: 250 clamp(2.4rem, 1.6rem + 3.2vw, 4.4rem)/1.02 Inter, system-ui, sans-serif !important;
  letter-spacing: -.055em !important;
}
html body #depot-title em {
  display: block;
  width: fit-content;
  margin-top: .45em;
  padding-top: .45em;
  border-top: 3px solid var(--dq-gold);
  color: var(--dq-text) !important;
  -webkit-text-fill-color: var(--dq-text) !important;
  font: 600 .4em/1.3 Inter, system-ui, sans-serif !important;
  letter-spacing: -.01em !important;
}


/* ——— Forum : « prise de parole » ———
   Serif éditoriale, le mot-clé dans une bulle de discussion. */
html body .f26-hero .f26-kicker {
  color: var(--f26-muted) !important;
  font: 500 13px/1.4 Inter, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
html body #forum-title {
  color: var(--f26-text) !important;
  -webkit-text-fill-color: var(--f26-text) !important;
  font: 400 clamp(2.3rem, 1.6rem + 3vw, 4.1rem)/1.12 Fraunces, Georgia, serif !important;
  letter-spacing: -.04em !important;
}
html body #forum-title em {
  display: inline-block;
  padding: .02em .32em .1em;
  border: 1.5px solid var(--f26-gold);
  border-radius: .45em .45em .45em .08em;
  background: var(--f26-gold-wash) !important;
  color: var(--f26-text) !important;
  -webkit-text-fill-color: var(--f26-text) !important;
  font-style: normal !important;
  font-weight: 500 !important;
}


/* ——— Mon espace : « tableau de bord » ———
   Salutation directe, prénom en gras sur un trait doré épais. */
html body #seller-title {
  color: var(--me-ink-strong) !important;
  -webkit-text-fill-color: var(--me-ink-strong) !important;
  font: 400 clamp(1.9rem, 1.4rem + 1.8vw, 2.8rem)/1.1 Inter, system-ui, sans-serif !important;
  letter-spacing: -.045em !important;
}
html body #seller-title em {
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  font-style: normal !important;
  font-weight: 700 !important;
  text-decoration: underline var(--me-gold) .14em;
  text-decoration-skip-ink: none;
  text-underline-offset: .12em;
}

/* ——— Footer (toutes les pages) : « mot de la fin » ———
   Deux tons de la même serif, sans italique ni doré. */
html body .lt-site-footer__cta .lt-site-footer__eyebrow {
  color: var(--lf-muted) !important;
  font: 500 12px/1.4 Inter, system-ui, sans-serif !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
html body .lt-site-footer__cta .lt-site-footer__eyebrow::before { display: none; }
html body #lt-site-footer-title {
  color: var(--lf-text) !important;
  -webkit-text-fill-color: var(--lf-text) !important;
  font: 500 clamp(1.9rem, 1.4rem + 1.7vw, 3rem)/1.1 Fraunces, Georgia, serif !important;
  letter-spacing: -.04em !important;
}
html body #lt-site-footer-title em {
  color: var(--lf-muted) !important;
  -webkit-text-fill-color: var(--lf-muted) !important;
  font-style: normal !important;
  font-weight: 400 !important;
}

@media (max-width: 480px) {
  html body #depot-title em { font-size: .48em !important; }
}

