/* =====================================================
   NV TAX & ACCOUNTING SERVICES LLC
   CSS Design Tokens
   ===================================================== */

:root {
  /* ---- Colors: Primary Brand Palette ---- */
  --color-primary: #006048;           /* Teal — buttons, icons, links           */
  --color-primary-dark: #004d3a;      /* Dark teal — hover states, accents      */
  --color-primary-darker: #00303C;    /* Navy — hero bg, footer, contrast       */
  --color-primary-hover: #005040;     /* Button hover                           */
  --color-primary-light: #e0f2ec;     /* Very light teal — badges, bg tints     */

  /* ---- Colors: Extended Palette ---- */
  --color-accent: #38c99b;            /* Mint — highlights on dark bg           */
  --color-sage: #38c99b;              /* Mint — tags, secondary accents         */
  --color-sage-light: rgba(56, 201, 155, 0.15); /* Mint tint for hover/bg      */

  /* ---- Colors: Neutrals ---- */
  --color-white: #FFFFFF;
  --color-bg-light: #f4f7f6;          /* Lightly teal-tinted light background   */
  --color-bg-lighter: #f9fbfa;        /* Near-white background                  */

  /* ---- Colors: Text ---- */
  --color-text-primary: #0d2a24;      /* Very dark teal (near black)            */
  --color-text-secondary: #374151;
  --color-text-tertiary: #6B7280;
  --color-text-light: #9CA3AF;

  /* ---- Colors: Borders ---- */
  --color-border: #d4e4df;            /* Soft teal-tinted border                */
  --color-border-dark: #b8d4cc;       /* Slightly darker teal-tinted border     */

  /* ---- Colors: Semantic ---- */
  --color-success: #006048;
  --color-warning: #F59E0B;
  --color-error: #EF4444;
  --color-info: #3B82F6;

  /* ---- Colors: Overlays ---- */
  --overlay-dark: rgba(0, 48, 60, 0.45);
  --overlay-medium: rgba(0, 48, 60, 0.65);

  /* ---- Typography: Font Families ---- */
  --font-heading: 'Montserrat', sans-serif;
  --font-body: 'Open Sans', sans-serif;

  /* ---- Typography: Sizes ---- */
  --text-xs: 0.75rem;    /* 12px */
  --text-sm: 0.875rem;   /* 14px */
  --text-base: 1rem;     /* 16px */
  --text-lg: 1.125rem;   /* 18px */
  --text-xl: 1.25rem;    /* 20px */
  --text-2xl: 2.5rem;    /* 40px — bumped for more premium feel */
  --text-3xl: 3.5rem;    /* 56px — more impactful hero headings  */

  /* ---- Typography: Weights ---- */
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-extrabold: 800;

  /* ---- Typography: Line Heights ---- */
  --leading-tight: 1.15;
  --leading-normal: 1.5;
  --leading-relaxed: 1.65;
  --leading-loose: 1.8;

  /* ---- Spacing ---- */
  --space-xs: 0.25rem;   /* 4px  */
  --space-sm: 0.5rem;    /* 8px  */
  --space-md: 1rem;      /* 16px */
  --space-lg: 1.5rem;    /* 24px */
  --space-xl: 2rem;      /* 32px */
  --space-2xl: 3rem;     /* 48px */
  --space-3xl: 4.5rem;   /* 72px */

  /* ---- Border Radius ---- */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-xl: 16px;
  --radius-full: 999px;

  /* ---- Shadows ---- */
  --shadow-sm: 0 1px 2px rgba(0, 48, 60, 0.06);
  --shadow-md: 0 2px 4px rgba(0, 48, 60, 0.08), 0 1px 2px rgba(0, 48, 60, 0.05);
  --shadow-lg: 0 6px 12px rgba(0, 48, 60, 0.1), 0 2px 4px rgba(0, 48, 60, 0.06);
  --shadow-xl: 0 12px 24px rgba(0, 48, 60, 0.12), 0 4px 8px rgba(0, 48, 60, 0.06);
  --shadow-hover: 0 6px 20px rgba(0, 96, 72, 0.22);
  --shadow-card-hover: 0 8px 24px rgba(0, 77, 58, 0.15);
  --shadow-dropdown: 0 8px 24px rgba(0, 48, 60, 0.15);

  /* ---- Transitions ---- */
  --transition-fast: 150ms ease-in-out;
  --transition-normal: 300ms ease-in-out;
  --transition-slow: 500ms ease-in-out;

  /* ---- Layout ---- */
  --container-max: 1200px;
  --container-narrow: 800px;
  --nav-height: 70px;

  /* ---- Section Padding ---- */
  --section-padding: 80px 24px;
  --section-padding-sm: 52px 24px;
}