/* Drone Shop Lab design tokens.
   Source of truth: O-output/clients/dronelab/04-design/design-system.json
   Do not add a value here that is not in that file. */

:root {
  /* Brand */
  --c-blue: #1d6fe0;
  --c-blue-deep: #1559b8;
  --c-blue-tint: #eef4fd;
  --c-blue-tint-hover: #dfebfb;
  --c-blue-border: #cfe0f8;
  --c-hero-wash: #eef3fb;

  /* Text */
  --c-ink: #0c1524;
  --c-text: #101828;
  --c-body: #2c3646;
  --c-text-2: #3d4a5c;
  --c-muted: #5c6b7d;
  --c-subtle: #65717f;

  /* Surfaces & lines */
  --c-control: #8592a0;
  --c-divider: #d8e0e9;
  --c-border: #e6ebf1;
  --c-section-rule: #e9eef4;
  --c-sunken: #eef2f7;
  --c-hairline: #f1f4f8;
  --c-surface-alt: #f8fafc;
  --c-page: #f5f7fa;
  --c-surface: #ffffff;

  /* Status */
  --c-star: #f5a623;
  --c-warn: #b45309;
  --c-warn-signal: #d97706;
  --c-warn-tint: #fef3e2;
  --c-ok: #157a3a;
  --c-ok-tint: #e7f6ee;

  /* Shadows (base #0f172a, brand #1d6fe0) */
  --sh-card: 0 8px 26px rgba(15, 23, 42, .05);
  --sh-lift: 0 16px 38px rgba(15, 23, 42, .1);
  --sh-media: 0 16px 40px rgba(15, 23, 42, .07);
  --sh-btn: 0 6px 18px rgba(29, 111, 224, .22);
  --sh-premium: 0 18px 40px rgba(29, 111, 224, .32);

  /* Type */
  --f-sans: "Heebo", system-ui, sans-serif;
  --f-mono: "JetBrains Mono", ui-monospace, monospace;
  --fs-10: .625rem;
  --fs-11: .6875rem;
  --fs-12: .75rem;
  --fs-13: .8125rem;
  --fs-14: .875rem;
  --fs-15: .9375rem;
  --fs-16: 1rem;
  --fs-17: 1.0625rem;
  --fs-18: 1.125rem;
  --fs-19: 1.1875rem;
  --fs-20: 1.25rem;
  --fs-22: 1.375rem;
  --fs-24: 1.5rem;
  --fs-26: 1.625rem;
  --fs-28: 1.75rem;
  --fs-34: 2.125rem;
  --fs-40: 2.5rem;
  --fs-52: 3.25rem;
  --fs-62: 3.875rem;

  /* Spacing scale */
  --s-2: 2px;
  --s-4: 4px;
  --s-6: 6px;
  --s-8: 8px;
  --s-10: 10px;
  --s-12: 12px;
  --s-14: 14px;
  --s-16: 16px;
  --s-18: 18px;
  --s-20: 20px;
  --s-22: 22px;
  --s-24: 24px;
  --s-28: 28px;
  --s-32: 32px;
  --s-36: 36px;
  --s-40: 40px;
  --s-44: 44px;
  --s-64: 64px;

  /* Radii */
  --r-6: 6px;
  --r-8: 8px;
  --r-10: 10px;
  --r-12: 12px;
  --r-14: 14px;
  --r-16: 16px;
  --r-18: 18px;
  --r-pill: 999px;

  /* Responsive layout values (mobile first; overridden at 560px and 1000px) */
  --pad: var(--s-16);
  --sec-pad: var(--s-28);
  --nav-h: 56px;
  --h1-hero: var(--fs-40);
  --h1: var(--fs-26);
  --h2: var(--fs-22);
  --h3: var(--fs-20);
  --lead: var(--fs-15);
  --body-long: var(--fs-16);

  --ease: cubic-bezier(.22, .61, .36, 1);
}

@media (min-width: 560px) {
  :root {
    --pad: var(--s-24);
    --sec-pad: var(--s-44);
    --nav-h: 64px;
    --h1-hero: var(--fs-52);
    --h1: var(--fs-34);
    --h2: var(--fs-28);
    --h3: var(--fs-24);
    --lead: var(--fs-17);
    --body-long: var(--fs-17);
  }
}

@media (min-width: 1000px) {
  :root {
    --pad: var(--s-40);
    --h1-hero: var(--fs-62);
  }
}