/* ========== 1) BRAND TOKENS (override par variation) ========== */
:root{
  /* Couleurs brand (Nina par défaut) */
  --brand-primary-900:#0D0D0D;
  --brand-primary-700:#111111;
  --brand-accent-600:#A88F5C;     /* or mat */
  --brand-accent-300:#CBB693;     /* beige doré */
  --brand-bg:#F7F6F3;             /* ivoire */
  --brand-white:#FFFFFF;

  /* Typo brand */
  --brand-font-sans:Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol", sans-serif;
  --brand-font-serif:"Playfair Display", ui-serif, Georgia, "Times New Roman", serif;
}

/* ========== 2) SEMANTIC TOKENS (utilisés par theme.json) ========== */
:root{
  /* couleurs sémantiques */
  --color-text:#111111;
  --color-text-muted:#2B2B2B;
  --color-surface:var(--brand-bg);
  --color-elevated:#FFFFFF;
  --color-primary:var(--brand-primary-700);
  --color-primary-contrast:#FFFFFF;
  --color-accent:var(--brand-accent-600);
  --color-accent-contrast:#FFFFFF;
  --color-border:rgba(0,0,0,.08);
  --color-success:#2BAE66;
  --color-danger:#D64545;
  --color-warning:#D5A013;

  /* typo scale */
  --font-sans:var(--brand-font-sans);
  --font-serif:var(--brand-font-serif);
  --fs-xs:0.875rem;
  --fs-sm:1rem;
  --fs-base:1.125rem;
  --fs-lg:1.375rem;
  --fs-xl:1.75rem;    /* h3 */
  --fs-2xl:2.25rem;   /* h2 */
  --fs-3xl:3rem;      /* h1 */

  /* line-height / weight */
  --lh-body:1.6;
  --lh-heading:1.25;
  --fw-normal:400;
  --fw-medium:500;
  --fw-semibold:600;

  /* spacing scale (8pt) */
  --sp-1:0.25rem;  /* 4 */
  --sp-2:0.5rem;   /* 8 */
  --sp-3:0.75rem;  /* 12 */
  --sp-4:1rem;     /* 16 */
  --sp-5:1.5rem;   /* 24 */
  --sp-6:2rem;     /* 32 */
  --sp-7:3rem;     /* 48 */
  --sp-8:4rem;     /* 64 */

  /* radius & shadows */
  --radius-sm:8px;
  --radius-md:12px;
  --radius-lg:20px;
  --shadow-sm:0 1px 2px rgba(0,0,0,.06);
  --shadow-md:0 8px 24px rgba(0,0,0,.08);
  --shadow-lg:0 20px 40px rgba(0,0,0,.12);

  /* containers */
  --container-xs:640px;
  --container-sm:820px;
  --container-md:1080px;
  --container-lg:1320px;

  /* motion */
  --ease: cubic-bezier(.2,.8,.2,1);
  --dur-1:150ms;
  --dur-2:300ms;
}

/* Helpers (optionnels) */
.container{max-width:var(--container-md);margin-inline:auto;padding-inline:var(--sp-5);}
.card{background:var(--color-elevated);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:var(--sp-5);}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.875rem 1.25rem;border-radius:30px;font-weight:var(--fw-semibold);transition:all var(--dur-2) var(--ease);}
.btn--primary{background:var(--color-primary);color:var(--color-primary-contrast);}
.btn--primary:hover{transform:translateY(-1px);box-shadow:var(--shadow-md);}