/* ============================================================
   OLScan — variants.css
   3 feuilles : Plan de servitude · Carnet de terrain · Élévation
   Tout est piloté par variables ; base.css consomme ces tokens.
   ============================================================ */

/* ─────────────────────────────────────────────
   01 · PLAN DE SERVITUDE  (kraft clair, carte imprimée)
   ───────────────────────────────────────────── */
body[data-variant="plan"] {
  --paper:        #ECE5D4;
  --ink:          #2A2820;
  --muted:        #5C5848;
  --line:         rgba(42,40,32,.17);
  --line-strong:  rgba(42,40,32,.34);
  --accent:       #5E6B36;
  --accent-soft:  rgba(94,107,54,.20);
  --accent-shadow:rgba(94,107,54,.30);
  --on-accent:    #F1EBDB;
  --ochre:        #AD7C2C;
  --rust:         #9E4A2A;
  --panel:        rgba(42,40,32,.025);

  --contour:        rgba(94,107,54,.22);
  --contour-major:  rgba(94,107,54,.42);
  --hatch:          rgba(42,40,32,.07);

  --tex: linear-gradient(var(--grid) 1px, transparent 1px),
         linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  --grid: rgba(42,40,32,.045);
  --tex-size: 30px 30px;
  --tex-opacity: 1;

  --tint:        #E5DDC9;
  --card-bg:     #F4EEDF;
  --card-hover:  #EFE8D5;
  --card-feature:#F7F2E5;

  --bar-bg:#24271B; --bar-ink:#E7E1CE; --bar-line:rgba(231,225,206,.18);
  --bar-accent:#C2933C; --bar-active:rgba(255,255,255,.06);

  --stat-bg:#24271B; --stat-ink:#E7E1CE; --stat-line:rgba(231,225,206,.14); --stat-accent:#CBA152;

  --contact-bg:#24271B; --contact-ink:#E7E1CE; --contact-line:#24271B;
  --contact-link-line:rgba(231,225,206,.25); --contact-link-hover:rgba(231,225,206,.1);

  --footer-bg:#24271B; --footer-ink:rgba(231,225,206,.7);
}
body[data-variant="plan"] .problem,
body[data-variant="plan"] .offres { background: var(--tint); }

/* ─────────────────────────────────────────────
   02 · CARNET DE TERRAIN  (olive sombre, papier millimétré)
   ───────────────────────────────────────────── */
body[data-variant="carnet"] {
  --paper:        #20241A;
  --ink:          #E8E2CF;
  --muted:        rgba(232,226,207,.62);
  --line:         rgba(232,226,207,.15);
  --line-strong:  rgba(232,226,207,.32);
  --accent:       #A6B36A;
  --accent-soft:  rgba(166,179,106,.22);
  --accent-shadow:rgba(166,179,106,.30);
  --on-accent:    #20241A;
  --ochre:        #D6A24E;
  --rust:         #D2774A;
  --panel:        rgba(232,226,207,.045);

  --contour:        rgba(166,179,106,.16);
  --contour-major:  rgba(166,179,106,.34);
  --hatch:          rgba(232,226,207,.055);

  --tex: linear-gradient(var(--grid) 1px, transparent 1px),
         linear-gradient(90deg, var(--grid) 1px, transparent 1px),
         linear-gradient(var(--grid2) 1px, transparent 1px),
         linear-gradient(90deg, var(--grid2) 1px, transparent 1px);
  --grid:  rgba(232,226,207,.10);
  --grid2: rgba(232,226,207,.035);
  --tex-size: 120px 120px, 120px 120px, 24px 24px, 24px 24px;
  --tex-opacity: 1;

  --tint:        #1A1E14;
  --card-bg:     #272C1D;
  --card-hover:  #2D3322;
  --card-feature:#2B3020;

  --bar-bg:#171A11; --bar-ink:#E8E2CF; --bar-line:rgba(232,226,207,.16);
  --bar-accent:#D6A24E; --bar-active:rgba(232,226,207,.07);

  --stat-bg:#171A11; --stat-ink:#E8E2CF; --stat-line:rgba(232,226,207,.13); --stat-accent:#C7D38A;

  --contact-bg:#171A11; --contact-ink:#E8E2CF; --contact-line:rgba(232,226,207,.16);
  --contact-link-line:rgba(232,226,207,.25); --contact-link-hover:rgba(232,226,207,.1);

  --footer-bg:#171A11; --footer-ink:rgba(232,226,207,.65);
}
body[data-variant="carnet"] .problem,
body[data-variant="carnet"] .offres { background: var(--tint); }
/* la grille millimétrée est plus présente en carnet */

/* ─────────────────────────────────────────────
   03 · ÉLÉVATION  (clair, hypsométrique, éditorial)
   ───────────────────────────────────────────── */
body[data-variant="elevation"] {
  --maxw: 1140px;
  --paper:        #F4EFE3;
  --ink:          #2B2B23;
  --muted:        #62604F;
  --line:         rgba(43,43,35,.14);
  --line-strong:  rgba(43,43,35,.30);
  --accent:       #6E7A43;
  --accent-soft:  rgba(110,122,67,.18);
  --accent-shadow:rgba(110,122,67,.26);
  --on-accent:    #F4EFE3;
  --ochre:        #B7842F;
  --rust:         #A85234;
  --panel:        rgba(43,43,35,.03);

  --contour:        rgba(110,122,67,.20);
  --contour-major:  rgba(110,122,67,.40);
  --hatch:          rgba(43,43,35,.05);

  --tex: radial-gradient(var(--grid) 1px, transparent 1.6px);
  --grid: rgba(43,43,35,.06);
  --tex-size: 32px 32px;
  --tex-opacity: .8;

  --tint:        #EDE6D5;
  --card-bg:     #FAF6EC;
  --card-hover:  #F5F0E2;
  --card-feature:#FBF8F0;

  --bar-bg:#2E3325; --bar-ink:#EDE7D6; --bar-line:rgba(237,231,214,.16);
  --bar-accent:#C5933E; --bar-active:rgba(237,231,214,.07);

  /* bande stat claire et éditoriale */
  --stat-bg:#E7DFCC; --stat-ink:#2B2B23; --stat-line:rgba(43,43,35,.14); --stat-accent:#5E6B3A;

  --contact-bg:#2E3325; --contact-ink:#EDE7D6; --contact-line:#2E3325;
  --contact-link-line:rgba(237,231,214,.25); --contact-link-hover:rgba(237,231,214,.1);

  --footer-bg:#2E3325; --footer-ink:rgba(237,231,214,.7);
}
body[data-variant="elevation"] .problem,
body[data-variant="elevation"] .reglo { background: var(--tint); }

/* En élévation : plus d'air, titres plus tranchés */
body[data-variant="elevation"] .band { padding-block: clamp(64px, 9vw, 124px); }
body[data-variant="elevation"] h2 { letter-spacing: -.03em; }
body[data-variant="elevation"] .hero h1 { font-weight: 900; }

/* bande hypsométrique signature sous le hero (élévation only) */
body[data-variant="elevation"] .stat-bar::before {
  content: '';
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 4px;
  background: linear-gradient(90deg,
    #DACBA0 0%, #B9B273 28%, #8C8E52 52%, #5E6B3A 76%, #41502E 100%);
}
body[data-variant="elevation"] .stat-bar { position: relative; }
