/* ===========================================================
   GPACTS 2026 - Design Tokens
   Brand system locked from Brand Guidelines + Build Brief
   =========================================================== */

@import url("https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap");

:root {
  /* --- Core surfaces --- */
  --void: #0a0a12; /* Void Black - base */
  --void-2: #0d0d16; /* slightly lifted black */
  --deep-space: #1a0e30; /* Deep Space */
  --ink-violet: #3a2b6e; /* Ink Violet */
  --panel: #12121c; /* card surface */
  --panel-2: #15131f; /* alt card surface */
  --hairline: rgba(255, 255, 255, 0.09);
  --hairline-strong: rgba(255, 255, 255, 0.16);

  /* --- Brand accents --- */
  --violet: #7c5af7; /* Signal Violet - primary */
  --violet-bright: #8b6bff;
  --violet-deep: #5b34d6;
  --violet-glow: #7122e0;
  --emerald: #2ee6a0; /* Forward. / emphasis green */
  --emerald-dim: #1fb37d;

  /* --- City coding --- */
  --mumbai: #95d180; /* PADC Mumbai - green */
  --ahmedabad: #eeff55; /* PMIC Ahmedabad - yellow */
  --hyderabad: #7c5af7; /* Flagship - violet */

  /* --- Text --- */
  --white: #ffffff;
  --text-1: #f4f3f8;
  --text-2: #c3c1cf; /* muted body - brightened for readability */
  --text-3: #908d9e; /* labels / faint */
  --mist: #7a7a85;

  /* --- Type (all DM Sans) --- */
  --font-display:
    "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-body:
    "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono:
    "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  /* --- Gradients --- */
  --grad-violet: linear-gradient(135deg, #8b6bff 0%, #5b34d6 55%, #2a1660 100%);
  --grad-arrow: linear-gradient(150deg, #9d82ff 0%, #7c5af7 45%, #4a26b8 100%);
  --grad-band-violet: linear-gradient(180deg, #7122e0 0%, #0a0a12 100%);

  /* --- Layout --- */
  --maxw: 1320px;
  --gutter: clamp(20px, 5vw, 80px);
  --radius: 18px;
  --radius-lg: 26px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body {
  margin: 0;
  background: var(--void);
  color: var(--text-1);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.6;
  letter-spacing: 0.01em;
}

::selection {
  background: var(--violet);
  color: #fff;
}

h1,
h2,
h3,
h4 {
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 0.98;
  margin: 0;
}

/* mono eyebrow / labels */
.eyebrow {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--emerald);
}

.forward {
  font-family: var(--font-display);
  font-weight: 800;
  color: var(--emerald);
  letter-spacing: -0.03em;
}

a {
  color: inherit;
  text-decoration: none;
}
img {
  display: block;
  max-width: 100%;
}