/* =====================================================================
   REBRICK · Pages de présentation des biens · Design tokens
   Charte « dossier éditorial industriel » (source : nassimboukrouh.com)
   Une seule ambiance : sombre. Pas de mode clair.
   ===================================================================== */

:root {
  /* ---- Couleurs ---- */
  --ink:          #0F0F0F;   /* fond de page */
  --panel:        #151515;   /* cartes, encarts, fond des photos en attente */
  --panel2:       #1B1B1A;   /* survol, avatar, fond nav active */
  --line:         #2A2A28;   /* filets, séparateurs de sections */
  --line2:        #3A3936;   /* bordures d'éléments interactifs, boîte de réservation */
  --orange:       #FF6726;   /* accent UNIQUE : CTA, chiffres, serif italique, crochet */
  --orange-deep:  #E4551A;   /* réservé, quasi jamais utilisé */
  --orange-soft:  rgba(255,103,38,.12); /* fond du bandeau de confirmation */
  --text:         #D7D3CC;   /* texte courant (blanc cassé chaud) */
  --muted:        #A8A8A0;   /* labels, sous-titres, texte secondaire */
  --dim:          #7C7B75;   /* mentions, notes de bas de section */
  --white:        #FFFFFF;   /* titres */

  /* ---- Typographie ---- */
  /* Sans gras = titres, boutons, texte. Web : Archivo (Google Fonts).
     Équivalent print/PIL : Helvetica Neue Bold. Site Nassim : Indivisible. */
  --sans:  "Archivo", "Helvetica Neue", Helvetica, Arial, sans-serif;
  /* Serif italique = UN mot ou expression par titre, en orange.
     Web : Instrument Serif italic. Print : Hoefler Text Italic. Site Nassim : Denton. */
  --serif: "Instrument Serif", "Hoefler Text", Georgia, serif;
  /* Mono = kickers, tags photo, labels de champs, adresse.
     Web : IBM Plex Mono. Print : SF Mono / Menlo. */
  --mono:  "IBM Plex Mono", "SF Mono", Menlo, monospace;

  --fs-body: 15px;          /* corps */
  --lh-body: 1.55;
  --fs-h1: 28px;            /* titre d'annonce (22px mobile) */
  --fs-h2: 22px;            /* titres de section (24px pour l'intro) */
  --fs-h3: 19px;
  --fs-final: 38px;         /* titre du CTA final (30px mobile) */
  --fs-kicker: 11px;        /* mono, letter-spacing .22em, uppercase */
  --fs-tag: 10.5px;         /* tags sur photos, mono, .18em */
  --fs-lead: 14.5px;
  --fs-small: 13px;
  --fs-fine: 12.5px;

  /* ---- Mise en page ---- */
  --max: 1120px;            /* largeur du conteneur */
  --gutter: 24px;           /* marge latérale (16px acceptable en mobile) */
  --col-side: 380px;        /* largeur de la carte de réservation */
  --gap-main: 64px;         /* écart contenu / carte */
  --sec-pad: 32px;          /* padding vertical d'une section de contenu */
  --r: 4px;                 /* rayon boutons, champs, tags */
  --r-card: 10px;           /* rayon cartes cellules, encadrés */
  --r-box: 12px;            /* rayon carte de réservation, galerie */
  --top-h: 64px;            /* hauteur de la barre sticky */
  --sticky-top: 88px;       /* top de la carte de réservation sticky */
  --shadow-card: 0 12px 40px rgba(0,0,0,.45);
}

/* ---- Traitement photo ----
   Photos réelles : saturate(.85) contrast(1.02) au repos, saturate(1) au survol.
   Photos réservées / indisponibles : saturate(.2) brightness(.7) + opacity .55 sur la carte.
   Fond photo du CTA final : saturate(.45) brightness(.42) + dégradé 90deg
   rgba(15,15,15,.85) → rgba(15,15,15,.35).
   Carte de localisation : saturate(.7) contrast(1.05). */

/* ---- Points de rupture ----
   ≤ 980px : une colonne, carte de réservation en flux (plus sticky), nav masquée.
   ≤ 680px : galerie = 1 seule photo pleine largeur, barre CTA fixe en bas,
             bouton CTA de la barre du haut masqué, grilles en 1 colonne. */