/* ===========================
   CSS CUSTOM PROPERTIES
=========================== */
:root {
  --purple-deep:    #2A0E5F;
  --purple-primary: #6B1FB8;
  --orange:         #FF6B1A;
  --white:          #FFFFFF;
  --gray-light:     #F5F3F8;
  --gray-text:      #6B6781;
  --carbon:         #0F0A1F;
  --grad-hero:      linear-gradient(135deg, #2A0E5F 0%, #6B1FB8 60%, #FF6B1A 100%);
  --grad-btn:       linear-gradient(90deg, #6B1FB8 0%, #FF6B1A 100%);
  --radius-card:    16px;
  --ease-out:       cubic-bezier(0.16, 1, 0.3, 1);
}

/* ===========================
   RESET & BASE
=========================== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
  font-family: 'Inter', sans-serif;
  background: var(--white);
  color: var(--carbon);
  overflow-x: hidden;
  cursor: auto;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }