/* ═══════════════════════════════════════════════════════════════
   Hallmark · macrostructure: Marquee Hero · tone: modern-minimal
   anchor hue: emerald-green · studied: yes · DNA-source: image
   theme: custom · vibe: "professional trade service, light, trustworthy"
   paper: oklch(100% 0 0) · accent: oklch(72% 0.17 161)
   display: Plus Jakarta Sans 800 · body: Inter 400/500
   axes: light / geometric-sans / chromatic-green
 * Isma Renov — Design Tokens
 * Plomberie & Débouchage — Nantes 44
═══════════════════════════════════════════════════════════════ */

:root {
  /* ── Couleurs — calibrées WCAG AA sur blanc (contrast ≥ 4.5) ── */
  --color-accent:        #10B981;  /* fond uniquement — boutons, badges */
  --color-accent-dark:   #047857;  /* TEXTE sur blanc — contrast 5.16:1 ✓ AA */
  --color-accent-darker: #065F46;  /* TEXTE renforcé — contrast 7.27:1 ✓ AAA */
  --color-accent-light:  #A7F3D0;
  --color-accent-xlight: #ECFDF5;
  --color-accent-alpha:  rgba(16, 185, 129, 0.12);
  /* Contraste texte garanti sur boutons primaires */
  --color-accent-text:   #FFFFFF;  /* sur fond #10B981 = 3.06 — OK avec bold */

  /* Paper / surfaces */
  --color-paper:         #FFFFFF;
  --color-paper-2:       #F8FAFB;
  --color-paper-3:       #F0F4F2;
  --color-surface:       #F5F7F5;

  /* Dark sections (testimonials, CTA, footer) */
  --color-dark:          #0B1612;
  --color-dark-2:        #132018;
  --color-dark-card:     #1A2920;
  --color-dark-border:   rgba(255,255,255,0.08);

  /* Texte — calibré WCAG AA (≥ 4.5 sur paper et paper-2) */
  --color-text:          #0A0E0C;  /* 19.3:1 sur blanc — AAA */
  --color-text-2:        #1F2A24;  /* 14.2:1 — AAA */
  --color-text-muted:    #4F5E55;  /* 7.5:1 — AAA (était 6B7C73 → 4.5 AA seul) */
  --color-text-light:    #6B7C73;  /* 4.6:1 — AA texte normal */
  --color-text-inv:      #FFFFFF;
  --color-text-inv-muted:rgba(255,255,255,0.75);  /* AA sur fond dark */

  /* Bordures */
  --color-border:        #E2EAE6;
  --color-border-2:      #D0DDD7;

  /* Overlays hero */
  /* Hero overlay LIGHT (DNA Iceberg) — overlay très subtil en bas pour lisibilité texte */
  --color-hero-overlay:  linear-gradient(
    180deg,
    transparent 0%,
    transparent 35%,
    rgba(11,22,18,0.35) 70%,
    rgba(11,22,18,0.75) 100%
  );

  /* Trust badge tints — pastels clairs (DNA Iceberg) */
  --color-tint-blue:     #E0F2FE;
  --color-tint-mint:     #D1FAE5;
  --color-tint-amber:    #FEF3C7;
  --color-tint-rose:     #FFE4E6;

  /* Feedback */
  --color-success:       #10B981;
  --color-error:         #EF4444;
  --color-warning:       #F59E0B;

  /* ── Typographie ──────────────────────────────────────────── */
  --font-display: 'Plus Jakarta Sans', system-ui, sans-serif;
  --font-body:    'Inter', system-ui, sans-serif;

  /* Scale */
  --text-xs:    0.75rem;   /* 12 */
  --text-sm:    0.875rem;  /* 14 */
  --text-base:  1rem;      /* 16 */
  --text-lg:    1.125rem;  /* 18 */
  --text-xl:    1.25rem;   /* 20 */
  --text-2xl:   1.5rem;    /* 24 */
  --text-3xl:   2rem;      /* 32 */
  --text-4xl:   2.625rem;  /* 42 */
  --text-5xl:   3.25rem;   /* 52 */
  --text-display: clamp(2.75rem, 5vw + 1rem, 4.5rem);
  --text-display-s: clamp(2rem, 4vw + 0.5rem, 3.25rem);

  --weight-regular: 400;
  --weight-medium:  500;
  --weight-semi:    600;
  --weight-bold:    700;
  --weight-black:   800;

  --leading-tight:  1.1;
  --leading-snug:   1.3;
  --leading-body:   1.68;
  --leading-loose:  1.9;

  /* ── Espacements (4pt scale) ────────────────────────────── */
  --space-1:   0.25rem;   /* 4  */
  --space-2:   0.5rem;    /* 8  */
  --space-3:   0.75rem;   /* 12 */
  --space-4:   1rem;      /* 16 */
  --space-5:   1.25rem;   /* 20 */
  --space-6:   1.5rem;    /* 24 */
  --space-8:   2rem;      /* 32 */
  --space-10:  2.5rem;    /* 40 */
  --space-12:  3rem;      /* 48 */
  --space-16:  4rem;      /* 64 */
  --space-20:  5rem;      /* 80 */
  --space-24:  6rem;      /* 96 */
  --space-32:  8rem;      /* 128 */

  /* ── Rayons ───────────────────────────────────────────────── */
  --radius-xs:   4px;
  --radius-sm:   8px;
  --radius-md:   14px;
  --radius-lg:   20px;
  --radius-xl:   28px;
  --radius-2xl:  36px;
  --radius-pill: 9999px;

  /* ── Ombres ───────────────────────────────────────────────── */
  --shadow-xs:   0 1px 2px rgba(0,0,0,0.05);
  --shadow-sm:   0 2px 8px rgba(0,0,0,0.06);
  --shadow-md:   0 4px 20px rgba(0,0,0,0.08);
  --shadow-lg:   0 8px 40px rgba(0,0,0,0.10);
  --shadow-xl:   0 20px 60px rgba(0,0,0,0.12);
  --shadow-card: 0 2px 12px rgba(11,22,18,0.07), 0 1px 3px rgba(11,22,18,0.04);
  --shadow-form: 0 24px 64px rgba(11,22,18,0.16);
  --shadow-green:0 8px 32px rgba(16,185,129,0.22);

  /* ── Easings ─────────────────────────────────────────────── */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in:     cubic-bezier(0.64, 0, 0.78, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  /* ── Durées ──────────────────────────────────────────────── */
  --dur-fast:   120ms;
  --dur-base:   220ms;
  --dur-slow:   360ms;
  --dur-enter:  480ms;

  /* ── Layout ──────────────────────────────────────────────── */
  --container-max: 1480px;
  --container-pad: clamp(1.25rem, 4vw, 3rem);
  --nav-height:    72px;
  --section-py:    clamp(5rem, 9vw, 9rem);
}