/* ============================================================================
   Open Projets - Design tokens
   Importés 1:1 depuis le projet design « Open Projets » (openprojets.com).
   Marque ombrelle : rouge #FF0037, Space Grotesk + Inter, gradients & blobs.
   Le vert applicatif (#059669 / #14AE5C) sert uniquement aux captures produit
   recomposées, pour rester fidèle à l'app Chantiers réelle.
   ============================================================================ */

:root {
  /* - Marque Open Projets - */
  --color-primary:        #FF0037;
  --color-primary-light:  rgba(255, 0, 55, 0.06);
  --color-primary-10:     rgba(255, 0, 55, 0.10);
  --color-amber:          #F2B327;
  --color-green:          #5AAB7D;
  --color-purple:         #4E2BFF;
  --color-dark:           #111111;
  --color-gray-text:      #555555;
  --color-gray-bg:        #FAFAFA;
  --color-gray-border:    rgba(0, 0, 0, 0.08);

  /* - Vert applicatif (captures produit Chantiers) - */
  --app-emerald:      #059669;
  --app-emerald-600:  #059669;
  --app-emerald-500:  #10b981;
  --app-emerald-50:   #ecfdf5;
  --app-emerald-700:  #047857;

  /* Statuts chantier (couleurs exactes de maplibre.config.ts) */
  --st-pas-commence:  #9ca3af;
  --st-ouverture:     #60a5fa;
  --st-en-cours:      #facc15;
  --st-suspendu:      #fb923c;
  --st-fin-provisoire:#a78bfa;
  --st-fin-definitive:#14b8a6;
  /* Zones de référence (maplibre.config.ts) */
  --zone-voirie:      #2563eb;
  --zone-intervenant: #dc2626;
  --zone-gestionnaire:#d97706;

  /* Typographie */
  --font-heading: 'Space Grotesk', ui-sans-serif, system-ui, sans-serif;
  --font-body:    'Inter', ui-sans-serif, system-ui, sans-serif;
  --tracking-tight-hero: -1.824px;

  /* Effets & layout */
  --shadow-card:   0 24px 64px -16px rgba(0, 0, 0, 0.09);
  --shadow-soft:   0 1px 2px rgba(0,0,0,.03), 0 10px 30px -16px rgba(0,0,0,.09);
  --shadow-lift:   0 34px 80px -30px rgba(0,0,0,.20);
  --max-w-container: 1200px;
  --radius-card: 20px;
}

/* - Clipped text gradients (signature de la marque) - */
.text-gradient,
.text-gradient-purple,
.text-gradient-green,
.text-gradient-contact {
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.text-gradient         { background-image: linear-gradient(180deg, #FF0037 0%, #F2B327 100%); }
.text-gradient-purple  { background-image: linear-gradient(180deg, #4E2BFF 0%, #FF0037 100%); }
.text-gradient-green   { background-image: linear-gradient(180deg, #F2B327 0%, #5AAB7D 100%); }
.text-gradient-contact { background-image: linear-gradient(180deg, #FF0037 0%, #4E2BFF 100%); }

/* - Radial background blobs - */
.blob-red      { background: radial-gradient(circle, rgba(255,0,55,.125) 0%, rgba(242,179,39,.063) 50%, transparent 70%); }
.blob-purple   { background: radial-gradient(circle, rgba(78,43,255,.082) 0%, rgba(90,171,125,.063) 50%, transparent 70%); }
.blob-amber    { background: radial-gradient(circle, rgba(242,179,39,.125) 0%, rgba(90,171,125,.063) 50%, transparent 70%); }
.blob-green    { background: radial-gradient(circle, rgba(90,171,125,.082) 0%, rgba(242,179,39,.063) 50%, transparent 70%); }
.blob-contact-1{ background: radial-gradient(circle, rgba(255,0,55,.125) 0%, rgba(78,43,255,.063) 50%, transparent 70%); }
.blob-contact-2{ background: radial-gradient(circle, rgba(78,43,255,.082) 0%, rgba(255,0,55,.063) 50%, transparent 70%); }