/* ==========================================================================
   INKÛNU — Tokens de marque
   Chargé après base.css dans layout/theme.liquid : ce fichier gagne sur les
   variables `:root` écrites en inline par le bloc {% style %} de Dawn.
   ========================================================================== */

:root {
  /* --- Palette de marque ------------------------------------------------ */
  --bg: #FAFAF8;
  --ink: #0A0A0A;
  --cream: #f7efe0;
  --soft: #5a5347;
  --amber: #4A3A20;
  --gold: #d9a94e;
  --green: #00B67A;

  /* --- Typographie : Quicksand sur les variables de police de Dawn ------- */
  --font-body-family: 'Quicksand', ui-rounded, 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-body-style: normal;
  --font-body-weight: 400;
  --font-body-weight-bold: 700;

  --font-heading-family: 'Quicksand', ui-rounded, 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-heading-style: normal;
  --font-heading-weight: 700;
}

/* Règle typographique de marque : Quicksand partout, titres 700, corps 400,
   interlettrage nul, aucune capitalisation forcée. Dawn ajoute du tracking sur
   ses classes utilitaires (.text-body 0.06rem, .caption 0.07rem) et sur les
   titres — on remet tout à plat. */
body,
h1, h2, h3, h4, h5, h6,
.h0, .h1, .h2, .h3, .h4, .h5,
.text-body,
.caption,
.header__menu-item,
.header__heading-link {
  letter-spacing: 0;
}

/* --------------------------------------------------------------------------
   Logo de marque — largeurs de référence du live.
   Dawn n'expose qu'une seule largeur de logo dans les réglages ; le palier
   mobile se fait donc ici.
   -------------------------------------------------------------------------- */

.header__heading-logo {
  width: 160px;
  max-width: 100%;
  height: auto;
}

@media screen and (max-width: 749px) {
  .header__heading-logo {
    width: 110px;
  }
}

/* Dawn applique --font-heading-weight aux titres via .h0…h5 et h1…h6.
   On force la famille au cas où une section poserait un font-family en dur. */
body,
button,
input,
select,
textarea {
  font-family: var(--font-body-family);
}

h1, h2, h3, h4, h5, h6,
.h0, .h1, .h2, .h3, .h4, .h5 {
  font-family: var(--font-heading-family);
  font-weight: var(--font-heading-weight);
}

/* ==========================================================================
   Lenis — styles requis par le smooth scroll (inlinés pour éviter une requête)
   ========================================================================== */

html.lenis,
html.lenis body {
  height: auto;
}

.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

.lenis.lenis-stopped {
  overflow: hidden;
}

.lenis.lenis-smooth iframe {
  pointer-events: none;
}

/* ==========================================================================
   Compatibilité Dawn
   Dawn pose des règles globales qui écrasent nos sections custom. Elles gagnent
   par SPÉCIFICITÉ, pas par ordre : les remonter ici ne suffit pas, il faut des
   sélecteurs plus spécifiques. Vaut pour toutes les sections INKÛNU à venir,
   d'où leur place dans ce fichier plutôt que dans une section.
   ========================================================================== */

/* base.css:486 — `div:empty{display:none}` (0,1,1) tue tous nos calques
   décoratifs vides : ciels, silhouettes de ville, sols, vignette, grain,
   scrims, trait du scroll cue, et le div porteur d'une image de fond.
   On couvre le hero entier plutôt que d'énumérer les classes : chaque calque
   ajouté au design repasserait sinon en display:none sans prévenir.
   `.ink-hero div:empty` est en (0,2,1) et reprend la main. */
.ink-hero div:empty {
  display: block;
}

/* base.css:274 — `h1{color:rgb(var(--color-foreground))}` (0,0,1) bat
   l'héritage depuis `.ink-copy`, donc le titre du hero sortait en noir sur
   la scène dorée au lieu du crème. */
.ink-hero .ink-h1 {
  color: var(--cream);
}

/* Sections pleine largeur en 100vw : pas de défilement horizontal quand la barre de défilement Windows est visible. */
html, body { overflow-x: clip; }