/* ============================================================
   Design tokens — Colisbridge (extracted from colisbridge.fr live)
   Source: docs/research/DESIGN_TOKENS.md (vClone)
   ============================================================ */

/* ---------- Font face declarations ---------- */
@font-face {
  font-family: "ITC Avant Garde";
  src: url("/assets/fonts/ITCAvantGardeStd-Bk.woff2") format("woff2"),
       url("/assets/fonts/ITCAvantGardeStd-Bk.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "ITC Avant Garde";
  src: url("/assets/fonts/ITCAvantGardeStd-Demi.woff2") format("woff2"),
       url("/assets/fonts/ITCAvantGardeStd-Demi.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "ITC Avant Garde";
  src: url("/assets/fonts/ITCAvantGardeStd-Bold.woff2") format("woff2"),
       url("/assets/fonts/ITCAvantGardeStd-Bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Icon font Colisbridge (territoires + utilitaires) */
@font-face {
  font-family: "colisbridge";
  src: url("/assets/fonts/colisbridge.woff") format("woff"),
       url("/assets/fonts/colisbridge.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

.cb-icon {
  font-family: "colisbridge", sans-serif !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: inline-block;
}

.cb-icon-martinique::before { content: "\e91b"; }
.cb-icon-guadeloupe::before { content: "\e919"; }
.cb-icon-guyane::before     { content: "\e91a"; }
.cb-icon-reunion::before    { content: "\e91c"; }
.cb-icon-address::before    { content: "\e900"; }
.cb-icon-phone::before      { content: "\e90e"; }
.cb-icon-whatsapp::before   { content: "\e918"; }
.cb-icon-forwarding::before { content: "\e907"; }
.cb-icon-package::before    { content: "\e90d"; }
.cb-icon-order::before      { content: "\e90c"; }
.cb-icon-arrow::before      { content: "\e901"; }
.cb-icon-google-map::before { content: "\e908"; color: #e6007e; }

/* Waze — layered multi-glyph icon (same as live .icon-ic-waze) */
.cb-icon-waze .path1::before { content: "\e911"; color: #e6007e; }
.cb-icon-waze .path2::before { content: "\e912"; margin-left: -1.150390625em; color: #fff; }
.cb-icon-waze .path3::before { content: "\e913"; margin-left: -1.150390625em; color: #e6007e; }
.cb-icon-waze .path4::before { content: "\e914"; margin-left: -1.150390625em; color: #e6007e; }
.cb-icon-waze .path5::before { content: "\e915"; margin-left: -1.150390625em; color: #e6007e; }
.cb-icon-waze .path6::before { content: "\e916"; margin-left: -1.150390625em; color: #e6007e; }
.cb-icon-waze .path7::before { content: "\e917"; margin-left: -1.150390625em; color: #e6007e; }

/* ---------- CSS custom properties ---------- */
:root {
  /* Brand colors (extracted from colisbridge.fr) */
  --color-navy: #243269;
  --color-navy-95: rgba(36, 50, 105, 0.95);
  --color-pink: #e6007e;
  --color-pink-hover: #cc006f;
  --color-whatsapp: #48bf91;
  --color-whatsapp-hover: #3da880;
  --color-teal: #39c4b6; /* sampled from live theme (.underline-title border) */

  /* Aliases (legacy v2 → new brand) */
  --color-primary: var(--color-navy);
  --color-primary-dark: #1c2854;
  --color-primary-light: #2c3d80;
  --color-accent: var(--color-pink);
  --color-accent-hover: var(--color-pink-hover);
  --color-secondary: var(--color-whatsapp);
  --color-secondary-hover: var(--color-whatsapp-hover);

  /* Neutrals */
  --color-white: #ffffff;
  --color-black: #000000;
  --color-gray-50: #f8f9fa;
  --color-gray-100: #f5f5f5;
  --color-gray-200: #eeeeee;
  --color-gray-300: #e0e0e0;
  --color-gray-400: #cccccc;
  --color-gray-500: #999999;
  --color-gray-600: #6c757d;
  --color-gray-800: #333333;
  --color-text: var(--color-navy);
  --color-text-muted: #6c757d;
  --color-success: #28a745;
  --color-error: #dc3545;

  /* Typography */
  --font-heading: "ITC Avant Garde", "Avant Garde", "Avantgarde", "Century Gothic", sans-serif;
  --font-body: "ITC Avant Garde", "Avant Garde", "Century Gothic", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  --font-size-xs: 0.75rem;     /* 12 */
  --font-size-sm: 0.875rem;    /* 14 */
  --font-size-base: 1rem;      /* 16 */
  --font-size-md: 1.125rem;    /* 18 */
  --font-size-lg: 1.25rem;     /* 20 — nav links */
  --font-size-xl: 1.5rem;      /* 24 — H3 footer */
  --font-size-2xl: 1.75rem;    /* 28 — H3 cards */
  --font-size-3xl: 1.875rem;   /* 30 — tab inactive */
  --font-size-4xl: 2.125rem;   /* 34 — tab active */
  --font-size-5xl: 2.8125rem;  /* 45 — H2 sections */
  --font-size-hero: clamp(1.75rem, 4vw, 3.25rem); /* 28 → 52 */

  --font-weight-regular: 400;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  --line-height-tight: 1.2;
  --line-height-base: 1.375;   /* 22/16 — body line-height live site */
  --line-height-relaxed: 1.6;

  --letter-spacing-nav: 1.2px;

  /* Spacing */
  --space-xs: 0.25rem;   /*  4 */
  --space-sm: 0.5rem;    /*  8 */
  --space-md: 1rem;      /* 16 */
  --space-lg: 1.5rem;    /* 24 */
  --space-xl: 2rem;      /* 32 */
  --space-2xl: 3rem;     /* 48 */
  --space-3xl: 4.375rem; /* 70 — footer padding-top */
  --space-4xl: 6.875rem; /* 110 */
  --space-5xl: 11.25rem; /* 180 — services padding-top */

  /* Layout */
  --container-max: 1140px;
  --container-padding: 15px;
  --header-height: 100px;

  /* Borders & radius */
  --radius-xs: 3px;
  --radius-sm: 5px;     /* default CTA buttons */
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-full: 9999px;
  --border-width: 1px;
  --border-color: var(--color-gray-300);

  /* Shadows */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 2px 10px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 4px 12px rgba(0, 0, 0, 0.1);
  --shadow-xl: 0 8px 24px rgba(0, 0, 0, 0.12);

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition-base: 300ms ease;
  --transition-slow: 500ms ease;

  /* Z-index */
  --z-base: 1;
  --z-content: 5;
  --z-overlay: 8;
  /* Header must sit above in-page content that uses local z-index
     (hero caption/CTA up to 20, carousel chevrons, section overlays) */
  --z-header: 50;
  --z-modal: 100;
  --z-toast: 200;
}
