:root {
  /* Brand Colors */
  --color-primary: #0F172A;        /* Dark Slate */
  --color-accent: #E85A00;     
  --color-accent-yellow: #F5A623;    /* Primary Orange */
  --color-accent-hover: #C74D00;   /* Darker Orange for Hover */
  --color-bg: #FFFFFF;             /* Pure White Background */
  --color-surface-subtle: #F8FAFC; /* Minimal Light Gray */
  --color-border: #E2E8F0;         /* Subtle Divider Border */
  --color-border-hover: #CBD5E1; 
  --color-accent-light: rgba(232, 90, 0, 0.08); /* Soft tint for badge backgrounds */
  --color-accent-border: rgba(232, 90, 0, 0.25);  /* Elevated Border on Hover */
  
  /* Text Tones */
  --color-text-main: #0F172A;      /* Primary Headings / Active Links */
  --color-text-muted: #64748B;     /* Secondary Body / Inactive Links */
  --color-text-light: #94A3B8;     /* Captions & Meta Text */
  
  /* Typography */
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", Consolas, monospace;
  
  /* Layout & Spacing */
  --nav-height: 72px;
  --container-max-width: 1280px;
  --radius-sm: 6px;
  --radius-md: 8px;
  
  /* Elevation & Transitions */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-nav: 0 4px 20px -2px rgba(0, 0, 0, 0.03);
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-smooth: 250ms cubic-bezier(0.4, 0, 0.2, 1);
  --z-nav: 1000;
}

/* ==========================================
   GLOBAL LIGHT ENTERPRISE DOT MATRIX PATTERN
   ========================================== */

html, body {
  margin: 0;
  padding: 0;
  background-color: #FFFFFF !important;
  color: var(--color-text-main);
  font-family: var(--font-sans);
  min-height: 100vh;
}

/* Fixed Full-Screen UIverse Light Dot Grid Overlay */
.bg-grid-pattern {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  z-index: 0;
  background-color: #FFFFFF;
  /* Dark grey/slate dots on pure white canvas */
  background-image: radial-gradient(rgba(15, 23, 42, 0.12) 1.5px, transparent 0);
  background-size: 28px 28px;
  background-position: -5px -5px;
}

/* Interactive Ambient Orange Glow Follower for Light Mode */
.bg-grid-pattern::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(
    600px circle at var(--mouse-x, 50%) var(--mouse-y, 30%),
    rgba(255, 90, 31, 0.08),
    transparent 80%
  );
  pointer-events: none;
}

/* Keep sections above background and transparent */
.hero-section,
.clients-section,
.industries-section,
.tech-section,
.cta-section,
#navbar-mount,
#footer-mount {
  position: relative;
  z-index: 1;
}

.hero-section,
.clients-section,
.industries-section,
.tech-section,
.cta-section {
  background-color: transparent !important;
}

/* Light Mode Card Styling over the pattern */
.industry-card,
.tech-card,
.cta-card {
  background-color: rgba(255, 255, 255, 0.85) !important;
  border: 1px solid var(--color-border) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.industry-card:hover,
.tech-card:hover {
  background-color: #FFFFFF !important;
  border-color: rgba(255, 90, 31, 0.4) !important;
}