/* ============================================================
   doorstep design tokens — edit THIS file to restyle the site.
   Values mirror app/styles/globalStyles.ts
   ============================================================ */

:root {
  /* Colors */
  --white: #ffffff;
  --black: #000000;
  --blue: #007aff;
  --green: #28a745;
  --red: #dc3545;
  --light-gray: #f5f5f5;
  --gray: #7a7a7a;
  --dark-gray: #303030;
  --border: #e7e7e7;
  --border-soft: #ececec;

  /* Radii (app: 10 / 20) */
  --radius: 10px;
  --radius-lg: 20px;
  --radius-pill: 999px;

  /* Spacing grid (app base: 15) */
  --space: 15px;
  --space-half: 7.5px;
  --space-2: 30px;
  --space-3: 45px;
  --space-4: 60px;
  --space-6: 90px;
  --space-8: 120px;

  /* Typography */
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI",
    Roboto, Helvetica, Arial, sans-serif;
  --headline: 21px;
  --headline-s: 18px;
  --text-l: 15px;
  --text: 12px;
  --text-s: 11px;
  --weight-bold: 700;
  --weight-medium: 500;
  --weight-regular: 400;
  --lh: 1.6;

  /* Motion (app animationDuration = 250) */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur: 250ms;
  --dur-slow: 700ms;

  /* Layout */
  --max: 1120px;
  --nav-h: 64px;

  /* Hero type (landing-only scale) */
  --hero: clamp(40px, 7vw, 76px);
  --section-title: clamp(28px, 4vw, 40px);
}