/* ================================================
   AZURE PETAL — Design Tokens & CSS Variables
   ================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600&family=DM+Sans:wght@300;400;500;600&family=Fira+Code:wght@400;500&display=swap');

:root {
  --azure-50:  #f0f7ff;
  --azure-100: #e0effe;
  --azure-200: #bae0fd;
  --azure-300: #7dc9fc;
  --azure-400: #38aef8;
  --azure-500: #0e91e9;
  --azure-600: #0272c7;
  --azure-700: #035ba1;
  --azure-800: #074d85;
  --azure-900: #0c416e;

  --petal-light:  #d6ecff;
  --petal-soft:   #a8d4f7;
  --petal-mid:    #4ea8de;
  --petal-core:   #0e91e9;
  --petal-deep:   #035ba1;
  --petal-dark:   #02213d;

  --accent-teal:  #00c6c6;
  --accent-pearl: #f7fbff;
  --accent-mist:  #e8f4fd;
  --accent-ink:   #091e2e;

  --white: #ffffff;
  --gray-50:  #f8fafc;
  --gray-100: #f0f4f8;
  --gray-200: #d9e4f0;
  --gray-300: #b0c4d8;
  --gray-400: #7a9bb5;
  --gray-500: #4d7090;
  --gray-600: #2e5070;
  --gray-700: #1a3450;
  --gray-800: #0f1f30;
  --gray-900: #060d16;

  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body:    'DM Sans', sans-serif;
  --font-code:    'Fira Code', monospace;

  --container-max: 1200px;
  --container-pad: clamp(1.5rem, 5vw, 3rem);
  --nav-height: 72px;
  --section-pad: clamp(4rem, 10vw, 7rem);

  --radius-sm:   6px;
  --radius-md:   12px;
  --radius-lg:   20px;
  --radius-xl:   32px;
  --radius-full: 9999px;

  --shadow-sm:  0 1px 3px rgba(9,30,46,0.08);
  --shadow-md:  0 4px 16px rgba(9,30,46,0.10);
  --shadow-lg:  0 10px 40px rgba(9,30,46,0.14);
  --shadow-xl:  0 20px 60px rgba(9,30,46,0.18);
  --shadow-glow: 0 0 40px rgba(14,145,233,0.25);
  --shadow-petal: 0 8px 32px rgba(14,145,233,0.20);

  --transition-fast:   150ms ease;
  --transition-base:   250ms ease;
  --transition-slow:   400ms ease;
  --transition-spring: 350ms cubic-bezier(0.34, 1.56, 0.64, 1);

  --gradient-hero:  linear-gradient(135deg, #02213d 0%, #035ba1 50%, #0e91e9 100%);
  --gradient-petal: linear-gradient(135deg, #0e91e9 0%, #00c6c6 100%);
  --gradient-soft:  linear-gradient(180deg, #f0f7ff 0%, #ffffff 100%);
  --gradient-card:  linear-gradient(145deg, #ffffff 0%, #f0f7ff 100%);
}