/* ════════════════════════════════════════════════════════
   BRITOL GROUP — CSS Custom Properties / Design Tokens
   ════════════════════════════════════════════════════════ */

:root {
  /* Blues */
  --blue-50: #e9f6fc;
  --blue-100: #c8eaf7;
  --blue-200: #9ad9f2;
  --blue-300: #66c8eb;
  --blue-400: #4bbfe6;
  --blue-500: #33acdc;
  --blue-600: #2b95bf;
  --blue-700: #1e7a9e;
  --blue-800: #155d7a;
  --blue-900: #0d3f56;

  /* Neutrals */
  --white: #ffffff;
  --gray-50: #f8f9fb;
  --gray-100: #f0f2f5;
  --gray-200: #e2e5e9;
  --gray-300: #c5c9cf;
  --gray-400: #8a919a;
  --gray-500: #5f666e;
  --gray-600: #3d4249;
  --gray-700: #2a2e33;
  --gray-800: #1a1d21;
  --gray-900: #0d0f11;

  /* Accents */
  --gold: #f0c040;
  --gold-light: #fef7e0;

  /* Fonts */
  --font-heading: 'Outfit', sans-serif;
  --font-body: 'Inter', sans-serif;

  /* Spacing */
  --section-padding: 100px 0;
  --container-max: 1200px;

  /* Shadows */
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, .06);
  --shadow-md: 0 8px 30px rgba(0, 0, 0, .08);
  --shadow-lg: 0 15px 50px rgba(0, 0, 0, .12);
  --shadow-blue: 0 8px 30px rgba(51, 172, 220, .25);

  /* Transitions */
  --transition: .35s cubic-bezier(.4, 0, .2, 1);
}

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=Inter:wght@300;400;500;600;700&display=swap');