/* ============================================================
   COHERENCE DES PAGES — les titres, partout (2026-10-06).

   ⚠️⚠️ DEFAUT MESURE. Deux pages n'ont JAMAIS ete migrees au langage du site :
   `/contact` et `/artisan`. Elles utilisent l'ANCIEN vocabulaire
   (`.container` + `.page-head h1`, `.artisan-hero h1`), dont le style vivait
   dans `devisaly.css`. Or cette feuille n'est plus chargee (le double theme a
   ete retire) : leur `h1` retombait donc sur le style PAR DEFAUT DU NAVIGATEUR.

     /              Anton, MAJUSCULES, 48px     -> correct
     /pricing       Anton, MAJUSCULES, 37px     -> correct
     /contact       Inter, 33px, minuscules     -> DEFAUT
     /artisan       Inter, 33px, minuscules     -> DEFAUT

   ⚠️ La regle ci-dessous rend le style de titre du site a TOUT `h1` place dans
   une page du gabarit `n-`, quelle que soit la classe heritee. Une page future
   ne pourra donc plus « oublier » son style de titre.
   ⚠️ On cible `h1` et non une liste de classes : c'est justement parce qu'une
   liste de classes avait laisse ces deux pages de cote.
   ============================================================ */

/* ---- 1. LE TITRE DE PAGE ---- */
.n-screen h1,
.n-formwrap h1,
.n-lecture h1,
.artisan-hero h1,
.page-head h1,
.container > h1 {
  font-family: Anton, Archivo, sans-serif;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: -.012em;
  line-height: 1.12;
  color: var(--n-fg);
  font-size: clamp(1.9rem, 7.2vw, 2.6rem);
  margin: 0;
  /* ⚠️ Anton a une hauteur de glyphe > son interligne : sans cette reserve, le
     haut des capitales est rogne (piege connu du site). */
  padding: .06em 0 .04em;
  max-width: none;
}

/* ---- 2. LE SOUS-TITRE QUI SUIT ---- */
.n-formwrap .page-head > p,
.artisan-hero > p {
  font-family: Inter, Archivo, system-ui, sans-serif;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--n-dim);
  margin: .9rem 0 0;
  max-width: 60ch;
}

/* ---- 3. LE MOT MIS EN AVANT DANS UN TITRE (`<em>`) = l'or de la marque ---- */
.artisan-hero h1 em,
.n-formwrap h1 em {
  font-style: normal;
  color: var(--n-or);
}

/* ---- 4. LES CONTENEURS HERITES NE DOIVENT PAS IMPOSER LEUR MISE EN PAGE ----
   `.container` venait de l'ancien theme (largeur, centrage, padding). Sur une
   page `n-`, c'est `.n-formwrap` / `.n-screen` qui porte la mise en page : on
   neutralise donc ce que `.container` pourrait encore imposer. */
.n-formwrap .container {
  max-width: none;
  padding: 0;
  margin: 0;
}

/* ============================================================
   DEUX DEFAUTS RESIDUELS (2026-10-06), mesures sur les pages applicatives.
   ============================================================ */

/* ⚠️ 1. DEGRADE SUR L'ENCART DE L'ESPACE CLIENT.
   `.upsell-banner` (devisaly.css) posait
   `background: linear-gradient(160deg, var(--gold-bg), rgba(...))`.
   Le site interdit les degrades : remplace par l'aplat pale de la marque, qui
   donne le meme effet de « bloc mis en avant » sans le degrade. */
.upsell-banner {
  background: var(--n-or-pale, #f3ead6);
  background-image: none;
  border-radius: 0;
}

/* ⚠️ 2. TITRE D'AUTHENTIFICATION EN ANTON MINUSCULES.
   `.auth-card > h1` forcait `font-size: 22px !important` en minuscules. Or
   **Anton est une police dessinee pour les CAPITALES** : en minuscules elle est
   etroite et peu lisible, et elle n'a plus rien a voir avec les titres du site.
   On applique donc le style de titre du site (Anton + MAJUSCULES), avec une
   taille de page interieure (plus petite que l'accueil, c'est voulu) mais ou le
   texte respire. */
.titre-erreur,
.auth-card > h1 {
  font-family: Anton, Archivo, sans-serif !important;
  text-transform: uppercase;
  letter-spacing: -.008em;
  line-height: 1.14;
  font-size: clamp(1.5rem, 3.2vw, 2rem) !important;
  padding: .05em 0 .03em;
  color: var(--n-fg);
}
@media (max-width: 600px) {
  .titre-erreur,
  .auth-card > h1 {
    font-size: clamp(1.35rem, 6.4vw, 1.7rem) !important;
  }
}

/* ============================================================
   LES LIENS RESTAIENT AU BLEU PAR DEFAUT (2026-10-06).

   ⚠️⚠️ MESURE : 234 liens affiches en `rgb(0, 0, 238)` — le bleu par defaut du
   navigateur. Sur un site blanc / noir / or, c'est le signe le plus visible
   d'une page « pas finie » :
       /blog        105 liens (les articles)
       /prix/<metier> 101 liens (les departements)
       /artisan       4 liens (pied de page)
       /agence-ou-devisaly, /services/…

   CAUSE : ces pages n'ont AUCUNE regle `a { color }`. Le navigateur applique
   alors sa couleur par defaut. Le site n'a jamais eu de regle globale pour les
   liens nus (seules les classes `.n-link`, `.n-btn`, `.n-villes a` en avaient).

   CORRECTIF : une regle globale pour les liens NUS. `:not([class])` garantit
   qu'on ne touche a AUCUN lien deja stylise (`.n-btn`, `.n-link`, `.n-btn--or`…).
   Un lien souligne a l'encre, qui prend l'or au survol — le langage du site.
   ============================================================ */
a:not([class]) {
  color: var(--n-fg);
  text-decoration: underline;
  text-decoration-color: var(--n-or-ligne);
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  transition: color .15s, text-decoration-color .15s;
}
a:not([class]):hover {
  color: var(--n-or-texte);
  text-decoration-color: var(--n-or);
}

/* ⚠️ Le selecteur de langue et le pied de page du menu ont leurs propres
   classes : on s'assure qu'ils ne prennent pas le bleu non plus. */
.n-menu-foot a,
.n-doc a,
.n-villes a { color: var(--n-fg); text-decoration-color: var(--n-or-ligne); }
.n-menu-foot a:hover,
.n-doc a:hover,
.n-villes a:hover { color: var(--n-or-texte); text-decoration-color: var(--n-or); }

/* ⚠️ 2 liens restaient bleus : ils portent une CLASSE, donc la regle
   `a:not([class])` ne les atteignait pas.
     `.artisan-brand`   (logo du tunnel /artisan)
     `.footer-mail`     (email brut du pied de page)
   Le tunnel `/artisan` est un parcours epure dont la feuille (`artisan.css`)
   n'est pas chargee ici : sa marque retombait donc sur le bleu par defaut. */
.artisan-brand,
.footer-mail,
a.artisan-brand,
a.footer-mail {
  color: var(--n-fg);
  text-decoration: none;
}
.artisan-brand:hover,
.footer-mail:hover {
  color: var(--n-or-texte);
  text-decoration: underline;
  text-decoration-color: var(--n-or);
}

/* ⚠️ BOUTONS DU BUILDER EN POLICE PAR DEFAUT (2026-10-06).
   Mesure : `/app` — « + Ajouter une prestation » et « Réinitialiser »
   s'affichaient en **Arial**, la police par defaut du navigateur. `.add-service`
   et `.clear-draft` (devisaly.css) declarent taille et couleur mais PAS de
   `font-family` : ils heritent d'une chaine qui ne remonte a aucune police du
   site. On la declare explicitement.
   ⚠️ Angles droits aussi : c'est la contrainte du design system. */
.add-service, .clear-draft, .svc-actions button, .lib-btn {
  font-family: 'IBM Plex Mono', monospace;
  letter-spacing: .06em;
  border-radius: 0;
}