/* ============================================================
   atdrive.com — Design System tokens
   Derived from the Atdrive Figma file (source of truth).
   Import into any page: <link rel="stylesheet" href="styles.css">
   ============================================================ */
@import './components/fig-tokens.css';

:root {
  /* Brand */
  --ad-orange: #FF4401;
  --ad-orange-2: #FF6600;
  --ad-orange-grad: linear-gradient(90deg, #FF4401 0%, #FF6600 100%);
  --ad-orange-stat: #FF5722;

  /* Neutrals */
  --ad-black: #000000;
  --ad-ink: #1E1E1E;      /* body text */
  --ad-navy: #0B1220;     /* dark section top */
  --ad-navy-2: #111827;   /* dark section bottom */
  --ad-navy-grad: linear-gradient(180deg, #0B1220 0%, #111827 100%);
  --ad-slate: #64748B;    /* muted labels */
  --ad-muted: #8A8F98;    /* light captions */

  /* Surfaces */
  --ad-white: #FFFFFF;
  --ad-fafafa: #FAFAFA;   /* alt section bg */
  --ad-tint: rgba(255,68,1,0.05);

  /* Radii */
  --ad-r-sm: 4px;
  --ad-r-md: 8px;
  --ad-r-lg: 16px;

  /* Shadows */
  --ad-shadow-btn: 0 4px 25px rgba(0,0,0,0.25), inset 0 4px 4px rgba(0,0,0,0.05);
  --ad-shadow-card: 0 4px 44px rgba(0,0,0,0.06);
  --ad-shadow-img: 0 40px 80px rgba(0,0,0,0.15);
  --ad-glass-border: inset 0 0 0 2px rgba(255,255,255,0.3), 0 4px 4px rgba(0,0,0,0.15);

  /* Layout */
  --ad-container: 1312px;
  --ad-pad-x: 64px;
  --ad-pad-section: 112px;

  /* Type */
  --ad-font: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Global resets shared by every page */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: var(--ad-white); }
body { font-family: var(--ad-font); color: var(--ad-ink); }
a { color: var(--ad-orange); text-decoration: none; }
a:hover { color: var(--ad-orange-2); }