/* =========================================================================
   IRADA VENTURE — Design tokens partagés
   Repris à l'identique de la vitrine (dev/assets/css/main.css) pour que la
   plateforme paraisse le prolongement naturel du site.
   ========================================================================= */
:root {
  /* Brand */
  --color-primary: #5C65F5;
  --color-primary-600: #4951E0;
  --color-primary-700: #3A41B8;
  --color-primary-50: #EEF0FF;
  --color-navy: #0B1437;
  --color-navy-700: #1A2456;
  --color-navy-500: #2C3878;
  --color-coral: #FCA08B;
  --color-coral-600: #F47F66;
  --color-coral-50: #FFF1ED;

  /* Neutrals */
  --color-bg: #FAFBFF;
  --color-surface: #FFFFFF;
  --color-text: #0B1437;
  --color-text-muted: #5A6280;
  --color-border: #E6E8F5;
  --color-border-strong: #C9CEEA;

  /* États sémantiques */
  --color-success: #1B7A3E;
  --color-success-bg: #E8F8EE;
  --color-success-bd: #BFE6CC;
  --color-danger: #B2363B;
  --color-danger-bg: #FDECEE;
  --color-danger-bd: #F2B6BB;
  --color-warn: #8A5A00;
  --color-warn-bg: #FFF6E5;
  --color-warn-bd: #FFE2A8;

  /* Effects */
  --gradient-primary: linear-gradient(135deg, #5C65F5 0%, #7B5CFF 100%);
  --gradient-warm: linear-gradient(135deg, #FCA08B 0%, #F47F66 100%);
  --gradient-hero: linear-gradient(135deg, #0B1437 0%, #1A2456 50%, #3A41B8 100%);

  --shadow-sm: 0 1px 2px rgba(11,20,55,.06), 0 1px 3px rgba(11,20,55,.05);
  --shadow-md: 0 6px 16px rgba(11,20,55,.08), 0 2px 4px rgba(11,20,55,.04);
  --shadow-lg: 0 18px 40px rgba(11,20,55,.12), 0 4px 12px rgba(11,20,55,.06);
  --shadow-xl: 0 30px 60px rgba(11,20,55,.18);
  --shadow-glow: 0 10px 40px rgba(92,101,245,.35);

  /* Layout */
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  --radius-pill: 999px;

  --container: 1200px;
  --header-h: 68px;

  /* Type scale (fluid) */
  --fs-xs: clamp(.75rem, .72rem + .15vw, .82rem);
  --fs-sm: clamp(.85rem, .82rem + .15vw, .92rem);
  --fs-base: clamp(.95rem, .92rem + .2vw, 1.05rem);
  --fs-lg: clamp(1.05rem, 1rem + .3vw, 1.2rem);
  --fs-xl: clamp(1.2rem, 1.1rem + .5vw, 1.5rem);
  --fs-2xl: clamp(1.5rem, 1.3rem + 1vw, 2rem);
  --fs-3xl: clamp(1.8rem, 1.4rem + 2vw, 2.75rem);

  /* Motion */
  --ease-out: cubic-bezier(.22,.61,.36,1);
  --t-fast: .18s;
  --t-base: .28s;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  font-size: var(--fs-base);
  line-height: 1.6;
  color: var(--color-text);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img, svg { max-width: 100%; height: auto; display: block; }
button { font: inherit; cursor: pointer; border: 0; background: none; color: inherit; }
input, textarea, select { font: inherit; color: inherit; }
a { color: var(--color-primary); text-decoration: none; transition: color var(--t-fast) var(--ease-out); }
a:hover { color: var(--color-primary-600); }
ul { list-style: none; }
:focus-visible { outline: 3px solid var(--color-coral); outline-offset: 2px; border-radius: 4px; }
::selection { background: var(--color-primary); color: #fff; }

h1,h2,h3,h4 { font-family: inherit; line-height: 1.18; letter-spacing: -.015em; font-weight: 800; color: var(--color-navy); }
h1 { font-size: var(--fs-2xl); }
h2 { font-size: var(--fs-xl); }
h3 { font-size: var(--fs-lg); }
p { color: var(--color-text-muted); }

.eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: var(--fs-xs); font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--color-primary); background: var(--color-primary-50);
  padding: 6px 12px; border-radius: var(--radius-pill);
}
.eyebrow::before { content:""; width:6px; height:6px; border-radius:50%; background: var(--color-primary); }

/* Boutons (repris de la vitrine) */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 12px 22px; border-radius: var(--radius-pill);
  font-weight: 700; font-size: var(--fs-sm); letter-spacing: .01em;
  cursor: pointer; transition: transform var(--t-base) var(--ease-out), box-shadow var(--t-base), background var(--t-base);
  white-space: nowrap; line-height: 1;
}
.btn:disabled { opacity: .55; cursor: not-allowed; }
.btn-primary { background: var(--gradient-primary); color:#fff; box-shadow: var(--shadow-glow); }
.btn-primary:hover:not(:disabled) { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(92,101,245,.45); color:#fff; }
.btn-accent { background: var(--gradient-warm); color:#fff; box-shadow: 0 10px 30px rgba(244,127,102,.35); }
.btn-accent:hover:not(:disabled) { transform: translateY(-2px); color:#fff; }
.btn-ghost { background: var(--color-primary-50); color: var(--color-primary); }
.btn-ghost:hover:not(:disabled) { background: #e3e6ff; }
.btn-outline { background: transparent; color: var(--color-primary); border: 1.5px solid var(--color-border-strong); }
.btn-outline:hover:not(:disabled) { border-color: var(--color-primary); }
.btn-danger { background: var(--color-danger-bg); color: var(--color-danger); border:1px solid var(--color-danger-bd); }
.btn-danger:hover:not(:disabled) { background:#fbdfe2; }
.btn-sm { padding: 8px 14px; font-size: var(--fs-xs); }
.btn-lg { padding: 16px 28px; font-size: var(--fs-base); }
.btn-block { width: 100%; }

/* Badges / pills d'état */
.badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; border-radius: var(--radius-pill);
  font-size: var(--fs-xs); font-weight: 700; line-height: 1.2;
  background: var(--color-primary-50); color: var(--color-primary);
}
.badge-success { background: var(--color-success-bg); color: var(--color-success); }
.badge-danger  { background: var(--color-danger-bg);  color: var(--color-danger); }
.badge-warn    { background: var(--color-warn-bg);    color: var(--color-warn); }
.badge-muted   { background: #EEF0F6; color: var(--color-text-muted); }