/* ═══════════════════════════════════════════════════════════════════════
   IL ÉTAIT UN PIXEL · iup-type-0.17.css
   ───────────────────────────────────────────────────────────────────────
   L'échelle typographique complète, desktop et mobile.

   POURQUOI CE FICHIER EXISTE
   Squarespace 7.1 n'expose qu'une seule valeur de taille par niveau : le
   basculement desktop / mobile en haut du panneau est un aperçu, pas un
   jeu de réglages séparé. Squarespace applique ensuite sa propre réduction
   automatique sur petit écran, que l'on ne contrôle pas. Ce fichier reprend
   la main sur les deux.

   COMMENT L'ACTIVER
   Settings → Advanced → Code Injection, champ Header :

     <link rel="stylesheet" href="https://files.iletaitunpixel.fr/fx/iup-type-0.17.css">
     <script>document.documentElement.classList.add('iup-type');</script>

   Retirer ces deux lignes rend au site ses réglages Site Styles, intacts.
   C'est le commutateur en un clic : Site Styles n'est jamais modifié.

   POUR UN PILOTE SUR QUELQUES PAGES
   Mettre le <link> dans l'injection globale et la ligne de script dans
   l'injection de page, page par page.

   Base 16px. Les valeurs desktop sont identiques à celles de Site Styles :
   le fichier peut donc être posé sans rien changer visuellement, puis les
   réglages Site Styles remis à leur état d'origine une fois validé.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── TITRES ──────────────────────────────────────────────────────────────
   Bodoni Moda, Normal, 500. Un seul interligne pour les quatre niveaux
   dans Squarespace : 1.12em est le minimum qui dégage le circonflexe de
   « Château » et la cédille, sans desserrer visiblement le titre. */

.iup-type h1, .iup-type h2, .iup-type h3, .iup-type h4 {
  line-height: 1.12em !important;
  letter-spacing: -0.015em !important;
  text-transform: none !important;
}

.iup-type h1 { font-size: 7rem !important; }
.iup-type h2 { font-size: 4.5rem !important; }
.iup-type h3 { font-size: 3rem !important; }
.iup-type h4 { font-size: 1.75rem !important; }

/* ── PARAGRAPHES ─────────────────────────────────────────────────────────
   P1 accroche, P2 corps de texte, P3 légende. Les classes sqsrte-* sont
   celles que Squarespace émet selon le style choisi dans l'éditeur : c'est
   la seule dépendance fragile de ce fichier, et la tâche cron la surveille. */

.iup-type p,
.iup-type .sqsrte-large,
.iup-type .sqsrte-small {
  line-height: 1.6em !important;
  letter-spacing: 0 !important;
}

.iup-type .sqsrte-large { font-size: 1.4rem !important; }
.iup-type p             { font-size: 1.1rem !important; }
.iup-type .sqsrte-small { font-size: 0.9rem !important; }

/* ── BOUTONS ─────────────────────────────────────────────────────────────
   Instrument Sans pour les trois niveaux : le design system n'admet que
   deux familles, et Poppins en était une troisième. */

.iup-type .sqs-button-element--primary,
.iup-type .sqs-button-element--secondary,
.iup-type .sqs-button-element--tertiary,
.iup-type .sqs-block-button-element {
  font-family: 'Instrument Sans', system-ui, -apple-system, 'Helvetica Neue', sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.8rem !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  border-radius: 0 !important;
}

/* ── MOBILE ──────────────────────────────────────────────────────────────
   Le seul endroit où ce fichier fait ce que Site Styles ne sait pas faire.
   Interligne remonté à 1.18em : les lignes courtes le supportent mieux, et
   un titre mobile passe presque toujours sur trois ou quatre lignes. */

@media screen and (max-width: 767px) {
  .iup-type h1, .iup-type h2, .iup-type h3, .iup-type h4 {
    line-height: 1.18em !important;
  }

  .iup-type h1 { font-size: 3rem !important; }
  .iup-type h2 { font-size: 2.25rem !important; }
  .iup-type h3 { font-size: 1.75rem !important; }
  .iup-type h4 { font-size: 1.25rem !important; }

  .iup-type .sqsrte-large { font-size: 1.15rem !important; }
  .iup-type p             { font-size: 1rem !important; }
  .iup-type .sqsrte-small { font-size: 0.85rem !important; }
}

/* ── VARIANTE HÉROS GÉANT ────────────────────────────────────────────────
   Si vous voulez le H1 à 160px de Challain sans l'imposer aux 300 pages :
   décommentez, et posez « hero » dans l'Anchor ID de la section concernée
   (ouverture--dark--hero). Aucun JavaScript, le sélecteur lit l'id brut.

.iup-type [id$="-hero"] h1,
.iup-type [id*="-hero-"] h1 { font-size: 10rem !important; }

@media screen and (max-width: 767px) {
  .iup-type [id$="-hero"] h1,
  .iup-type [id*="-hero-"] h1 { font-size: 3.25rem !important; }
}
*/