/* ==========================================================================
   DECG design tokens

   Matched to marutiseismic.com at the client's request: same palette, same
   colour grading, same type treatment, same buttons. Values below were read
   off their live stylesheet rather than eyeballed.

   Note this supersedes the earlier navy+gold, no-orange direction. Orange is
   back as the secondary, and the "single accent / no shadow / sharp corner"
   Swiss constraints no longer apply.
   ========================================================================== */

:root {
  /* --- Brand ------------------------------------------------------------ */
  --primary:         #1a3a5c;
  --primary-light:   #2563a8;
  --primary-dark:    #0f2340;

  /* Secondary is a BRIGHT BLUE, not orange. The palette is blue and white
     only, at the client's request. The token keeps its name so every existing
     reference converts without touching a template; only the value changed. */
  --secondary:       #4a9ae8;
  --secondary-light: #7db8f0;
  --secondary-dark:  #2f7ac4;

  /* Light blue surfaces - the box behind the logo, badge fills, preloader. */
  --sky-50:          #f0f6ff;
  --sky-100:         #dce9fa;
  --sky-200:         #c3d9f5;

  --brand-red:       #a01020;   /* DECG logo red. Logo only. */

  /* --- Neutrals --------------------------------------------------------- */
  --accent:          #64748b;
  --accent-light:    #94a3b8;
  --bg:              #f8fafc;
  --bg-alt:          #f1f5f9;
  --surface:         #ffffff;
  --border:          #e2e8f0;
  --border-strong:   #cbd5e1;
  --text-primary:    #0f172a;
  --text-secondary:  #475569;
  --text-muted:      #64748b;   /* one step darker than theirs, for AA on --bg */

  /* --- Signature gradients ---------------------------------------------- */
  --grad-hero:    linear-gradient(145deg, #f0f6ff 0%, #f8fafc 40%, #eaf3ff 100%);
  --grad-primary: linear-gradient(135deg, #2563a8 0%, #1a3a5c 100%);
  --grad-header:  linear-gradient(135deg, #1a3a5c 0%, #2563a8 100%);
  --grad-text:    linear-gradient(135deg, #1a3a5c, #4a9ae8);
  --grad-tint:    linear-gradient(135deg, rgba(37,99,168,.12), rgba(74,154,232,.10));
  --grad-badge:   linear-gradient(135deg, rgba(37,99,168,.10), rgba(74,154,232,.09));

  /* --- Elevation -------------------------------------------------------- */
  --shadow-sm: 0 1px 3px rgba(0,0,0,.06),  0 1px 2px rgba(0,0,0,.04);
  --shadow-md: 0 4px 16px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.04);
  --shadow-lg: 0 10px 40px rgba(0,0,0,.10), 0 4px 12px rgba(0,0,0,.05);
  --shadow-xl: 0 20px 60px rgba(0,0,0,.12), 0 8px 20px rgba(0,0,0,.06);
  --shadow-btn: 0 4px 20px rgba(26,58,92,.35);
  --shadow-header: 0 2px 12px rgba(15,35,64,.08);

  /* --- Radii — rounded, and pill-shaped buttons ------------------------- */
  --radius-sm:   6px;
  --radius:     12px;
  --radius-lg:  20px;
  --radius-xl:  32px;
  --radius-pill: 50px;

  /* --- Spacing / grid --------------------------------------------------- */
  --space-1:   8px;  --space-2: 16px; --space-3: 24px; --space-4: 32px;
  --space-6:  48px;  --space-8: 64px; --space-12: 96px; --space-16: 128px;
  --container: 1200px;
  --grid-cols: 12;
  --grid-gap:  24px;

  /* --- Type ------------------------------------------------------------- */
  --tracking-eyebrow: 0.12em;

  --font-sans:    'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-display: 'Poppins', var(--font-sans);

  --text-xs:   0.8rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.1rem;
  --text-xl:   1.375rem;
  --text-2xl:  1.75rem;
  --text-3xl:  2.25rem;
  --text-4xl:  3rem;
  --text-5xl:  clamp(2.4rem, 4.6vw, 3.6rem);

  /* --- Motion ----------------------------------------------------------- */
  --transition:      0.3s cubic-bezier(.4, 0, .2, 1);
  --transition-slow: 0.6s cubic-bezier(.4, 0, .2, 1);

  /* --- Layers ----------------------------------------------------------- */
  --z-dropdown: 20;
  --z-header:   30;
  --z-drawer:   50;
}