/* ==========================================================================
   SankiSecure — socle de design
   Charte dérivée de SANKI TECHNOLOGIES : encre #0B1220, or #C9A24C.
   Couche d'urgence propre à SankiSecure : rouge #E5342A.
   Aucune police externe : la pile système reste lisible hors ligne et en 2G.
   ========================================================================== */

:root {
  /* Encre */
  --ink-950: #050912;
  --ink-900: #070C18;
  --ink-850: #0B1220;
  --ink-800: #0F1729;
  --ink-700: #14213A;
  --ink-600: #1B2B4B;
  --ink-500: #2A3D63;

  /* Or — signature SANKI */
  --gold-200: #FFF3CF;
  --gold-300: #F7E6B4;
  --gold-400: #E7C476;
  --gold-500: #C9A24C;
  --gold-600: #A9782A;
  --gold-700: #8E6417;

  /* Urgence */
  --alert-300: #FF8A6B;
  --alert-400: #F04438;
  --alert-500: #E5342A;
  --alert-600: #B42318;
  --alert-700: #8C1A12;

  /* Nature des sinistres */
  --nat-accident: #F5A524;
  --nat-incendie: #F2680C;
  --nat-medical: #22C39A;
  --nat-secours: #3B82F6;
  --nat-autre: #A78BFA;

  /* États */
  --ok-500: #16A34A;
  --warn-500: #F5A524;

  /* Neutres */
  --paper: #FAFAF8;
  --line-100: #E4E7EC;
  --mute-400: #9AA3B5;
  --mute-500: #5C6579;

  /* Surfaces sombres */
  --surface: rgba(255, 255, 255, .038);
  --surface-2: rgba(255, 255, 255, .06);
  --hairline: rgba(231, 196, 118, .16);
  --hairline-soft: rgba(255, 255, 255, .09);

  /* Typo */
  --font: 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --mono: ui-monospace, 'Cascadia Mono', Consolas, 'Courier New', monospace;

  /* Rythme */
  --r-sm: 10px;
  --r-md: 16px;
  --r-lg: 22px;
  --r-xl: 30px;

  --shadow-1: 0 1px 2px rgba(0, 0, 0, .35);
  --shadow-2: 0 12px 32px -12px rgba(0, 0, 0, .65);
  --shadow-3: 0 32px 70px -24px rgba(0, 0, 0, .8);

  --ease: cubic-bezier(.22, .61, .36, 1);

  /* Marges de sécurité pour les encoches de téléphone */
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
}

body {
  font-family: var(--font);
  background: var(--ink-850);
  color: var(--paper);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-wrap: break-word;
}

h1, h2, h3, h4 {
  margin: 0;
  font-weight: 600;
  letter-spacing: -.02em;
  line-height: 1.12;
}

p { margin: 0; line-height: 1.65; }

a { color: inherit; }

button, input, select, textarea {
  font: inherit;
  color: inherit;
}

button { cursor: pointer; }

:focus-visible {
  outline: 2px solid var(--gold-400);
  outline-offset: 3px;
  border-radius: 4px;
}

::selection {
  background: var(--gold-500);
  color: var(--ink-900);
}

/* --------------------------------------------------------------------------
   Primitives
   -------------------------------------------------------------------------- */

.wrap {
  width: min(1180px, 100% - 40px);
  margin-inline: auto;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--gold-400);
}

.eyebrow::before {
  content: '';
  width: 22px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold-500));
}

.lead {
  color: #C6CDDB;
  font-size: clamp(15px, 1.35vw, 17.5px);
}

.mono {
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
}

/* Boutons */
.btn {
  --btn-bg: var(--surface-2);
  --btn-fg: var(--paper);
  --btn-bd: var(--hairline-soft);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 13px 22px;
  min-height: 46px;
  border: 1px solid var(--btn-bd);
  border-radius: 999px;
  background: var(--btn-bg);
  color: var(--btn-fg);
  font-size: 14.5px;
  font-weight: 600;
  letter-spacing: .01em;
  text-decoration: none;
  transition: transform .16s var(--ease), filter .16s var(--ease), background .16s var(--ease);
}

.btn:hover { filter: brightness(1.09); }
.btn:active { transform: translateY(1px) scale(.995); }
.btn[disabled] { opacity: .45; pointer-events: none; }

.btn-gold {
  --btn-bg: linear-gradient(135deg, var(--gold-300), var(--gold-500) 62%, var(--gold-600));
  --btn-fg: var(--ink-900);
  --btn-bd: transparent;
  box-shadow: 0 10px 26px -14px rgba(201, 162, 76, .9);
}

.btn-alert {
  --btn-bg: linear-gradient(135deg, var(--alert-400), var(--alert-600));
  --btn-fg: #fff;
  --btn-bd: transparent;
  box-shadow: 0 12px 30px -14px rgba(229, 52, 42, .95);
}

.btn-ghost { --btn-bg: transparent; }

.btn-block { width: 100%; }

/* Cartes */
.card {
  background: var(--surface);
  border: 1px solid var(--hairline-soft);
  border-radius: var(--r-lg);
  padding: 26px;
}

/* Puces d'état */
.chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 12px;
  border-radius: 999px;
  border: 1px solid var(--hairline-soft);
  background: var(--surface);
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  white-space: nowrap;
}

.dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  flex: none;
}

/* Trame d'arrière-plan discrète */
.grain {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: .5;
  background-image:
    radial-gradient(700px 420px at 78% -8%, rgba(229, 52, 42, .13), transparent 62%),
    radial-gradient(620px 420px at 8% 4%, rgba(201, 162, 76, .10), transparent 60%);
}

.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* Signature éditeur SANKI TECHNOLOGIES */
.sanki-signature {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 22px 0;
  font-size: 12px;
  letter-spacing: .06em;
  color: var(--mute-400);
}

.sanki-signature strong {
  color: var(--gold-400);
  font-weight: 600;
  letter-spacing: .12em;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}