:root {
  --font-sans: "Inter", "Raleway", system-ui, -apple-system, "Segoe UI", sans-serif;
  --body-bg: #f8fafc;
  --box-bg: #ffffff;
  --box-border: rgba(15, 23, 42, 0.1);
  --box-shadow: 15 23 42 / 0.12;
  --heading-1: #0f172a;
  --heading-2: #111827;
  --heading-3: #475569;
  --muted: rgba(15, 23, 42, 0.65);
  --pattern: rgba(30, 58, 138, 0.08);
}

[data-font="inter"] {
  --font-sans: "Inter", "Raleway", system-ui, -apple-system, "Segoe UI", sans-serif;
}

[data-font="josefin"] {
  --font-sans: "Josefin Sans", "Raleway", system-ui, -apple-system, "Segoe UI", sans-serif;
}

[data-font="poppins"] {
  --font-sans: "Poppins", "Raleway", system-ui, -apple-system, "Segoe UI", sans-serif;
}

.dark {
  --body-bg: #070b14;
  --box-bg: rgba(17, 24, 39, 0.7);
  --box-border: rgba(148, 163, 184, 0.18);
  --box-shadow: 2 6 23 / 0.55;
  --heading-1: #f8fafc;
  --heading-2: rgba(248, 250, 252, 0.92);
  --heading-3: rgba(226, 232, 240, 0.78);
  --muted: rgba(226, 232, 240, 0.7);
  --pattern: rgba(96, 165, 250, 0.12);
}

/* :root {
  --color-bg: 255 255 255;
  --color-border: 255 255 255;
  --color-box: 255 255 255;
  --box-border: 229 231 235;
  --box-sd: 226 232 240 / 0.5;
  --heading-1: 23 37 84;
  --heading-2: 31 41 55;
  --heading-3: 55 65 81;
}

.dark {
  --color-bg: 3 7 18;
  --color-box: 17 24 39;
  --box-border: 243 244 246/0.1;
  --box-sd: transparent;

  --heading-1: 255 255 255;
  --heading-2: 243 244 246;
  --heading-3: 209 213 219;
} */

/* @tailwind base;
@tailwind components;
@tailwind utilities; */

/* @layer base {
  html {
    scroll-behavior: smooth;
    font-family: "Raleway" sans-serif;
  }
} */
html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-sans);
}

/* Lightweight utilities used across the site (to match Tailwind-like naming). */
.bg-body {
  background-color: var(--body-bg);
}
.bg-box-bg {
  background-color: var(--box-bg);
}
.border-box-border {
  border-color: var(--box-border);
}
.text-heading-1 {
  color: var(--heading-1);
}
.text-heading-2 {
  color: var(--heading-2);
}
.text-heading-3 {
  color: var(--heading-3);
}
.text-muted {
  color: var(--muted);
}
.shadow-box-shadow {
  box-shadow: 0 10px 30px rgba(var(--box-shadow));
}
.dark .shadow-box-shadow {
  box-shadow: 0 18px 60px rgba(var(--box-shadow));
}

/* Subtle industrial grid background helper */
.ehv-grid {
  background-image: radial-gradient(circle at 1px 1px, var(--pattern) 1px, transparent 0);
  background-size: 22px 22px;
}

/* body {
  font-family: "Raleway", sans-serif;
} */

[data-toggle-nav][data-open-nav="true"] #line1 {
  transform: translateY(0.375rem) rotate(40deg);
}
[data-toggle-nav][data-open-nav="true"] #line2 {
  transform: scaleX(0);
  opacity: 0;
}
[data-toggle-nav][data-open-nav="true"] #line3 {
  transform: translateY(-0.375rem) rotate(-40deg);
}

[data-nav-overlay][data-is-visible="true"] {
  visibility: visible;
  display: flex;
}

.glass {
  background: rgba(255, 255, 255, 0.1) !important;
  backdrop-filter: blur(35px);
}

.glass-card {
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(35px);
  border-radius: 20px;
  /* border: 2px solid rgba(255, 255, 255, 0.1); */
  box-shadow: 0 0 80px rgba(0, 0, 0, 0.25);
  /* padding: 30px 30px 30px 30px; */
}
