/* ============================================================
   MEGACORE — Colors & Type Foundations
   Vietnamese B2B server-infrastructure / data-center brand.
   Source: megacore_design_system.md (megacore.net) + brand logo SVGs.

   FONTS — real brand typefaces (July 2026):
   Exo (variable, full Vietnamese) drives display + body; Conthrax
   (single master) is the brand numeral/stat accent; JetBrains Mono
   handles technical/spec/eyebrow labels. This supersedes the earlier
   Be Vietnam Pro substitution used before the real fonts were provided.
   ============================================================ */

/* ============================================================
   REAL BRAND TYPEFACES (July 2026 upload).
   Exo  = display + body — variable 100–900, full Vietnamese coverage.
   Conthrax = brand display accent for large numerals/stats (single
   master; weight range declared so heading weights never synthesize).
   JetBrains Mono (below) kept for technical / spec / eyebrow labels.
   Supersedes the earlier Be Vietnam Pro substitution.
   ============================================================ */
@font-face {
  font-family: 'Exo';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/Exo.ttf") format('truetype-variations');
}
@font-face {
  font-family: 'Exo';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/Exo-Italic.ttf") format('truetype-variations');
}
@font-face {
  font-family: 'Conthrax';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("../fonts/Conthrax.ttf") format('truetype');
}

/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/462b91d2-7750-45a8-baab-bf63d49115cb.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/67289ab8-5927-4b7e-bfc9-d993d856b03a.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/0ff8211c-854b-4aac-9eca-fc6d832996fb.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/4d1757f5-9496-4554-ab70-d79ff19c5248.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/83981469-2f9c-4f4c-a801-fea0cb7bcd07.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/591f690e-5191-4964-8050-3f56dbc426a8.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/462b91d2-7750-45a8-baab-bf63d49115cb.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/67289ab8-5927-4b7e-bfc9-d993d856b03a.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/0ff8211c-854b-4aac-9eca-fc6d832996fb.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/4d1757f5-9496-4554-ab70-d79ff19c5248.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/83981469-2f9c-4f4c-a801-fea0cb7bcd07.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/591f690e-5191-4964-8050-3f56dbc426a8.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/462b91d2-7750-45a8-baab-bf63d49115cb.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/67289ab8-5927-4b7e-bfc9-d993d856b03a.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/0ff8211c-854b-4aac-9eca-fc6d832996fb.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/4d1757f5-9496-4554-ab70-d79ff19c5248.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/83981469-2f9c-4f4c-a801-fea0cb7bcd07.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/591f690e-5191-4964-8050-3f56dbc426a8.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


:root {
  /* ---------- BRAND / PRIMARY ---------- */
  --mc-green:          #009A44;  /* primary — CTA, links, active, highlight */
  --mc-green-bright:   #21F267;  /* neon accent — data/network glow, on-dark */
  --mc-green-deep:     #014135;  /* logo gradient start, deep brand green */
  --mc-green-mid:      #1AA44A;  /* logo gradient end */
  --mc-green-700:      #007A36;  /* pressed / darker hover on solid green */
  --mc-green-050:      #EEF9F2;  /* tint — icon chips, soft fills */
  --mc-green-100:      #DDF3E5;  /* tint — hover surfaces, badges */

  /* ---------- INK / DARK ---------- */
  --mc-black:          #050705;  /* deepest — pure brand black */
  --mc-dark:           #08110C;  /* hero/footer canvas */
  --mc-dark-2:         #111814;  /* dark gradient end / raised dark surface */
  --mc-ink:            #1B1F1D;  /* primary text on light (gray-900) */

  /* ---------- NEUTRALS ---------- */
  --mc-gray-700:       #4A4A4A;  /* secondary text */
  --mc-gray-500:       #646B67;  /* muted text, labels — AA on white (~5:1) */
  --mc-gray-300:       #C2CBC5;  /* disabled, faint */
  --mc-gray-100:       #F4F7F5;  /* soft section background */
  --mc-white:          #FFFFFF;

  /* ---------- SECONDARY / SLATE (cool neutral accent) ---------- */
  --mc-slate:          #52635F;  /* technical sub-labels, secondary accent */
  --mc-slate-soft:     #EEF2F1;  /* slate tint surface */

  /* ---------- SEMANTIC SURFACES ---------- */
  --mc-bg:             #FFFFFF;
  --mc-bg-soft:        #F4F7F5;  /* alternating sections, fills */
  --mc-surface:        #FFFFFF;  /* cards */
  --mc-border:         #E2EAE4;  /* default hairline */
  --mc-border-strong:  #D3DED7;
  --mc-border-dashed:  #DBE4DE;  /* spec-row dividers */

  /* ---------- TEXT TOKENS ---------- */
  --mc-fg-1:           var(--mc-ink);      /* primary */
  --mc-fg-2:           var(--mc-gray-700); /* secondary */
  --mc-fg-3:           var(--mc-gray-500); /* muted */
  --mc-fg-on-dark:     #FFFFFF;
  --mc-fg-on-dark-2:   rgba(255,255,255,0.82);
  --mc-fg-on-dark-3:   rgba(255,255,255,0.66);

  /* ---------- STATUS ---------- */
  --mc-amber:          #F5B301;  /* star ratings */
  --mc-success:        #009A44;
  --mc-danger:         #E5484D;

  /* ---------- GRADIENTS ---------- */
  --mc-gradient-green:  linear-gradient(135deg, #009A44 0%, #21F267 100%);
  --mc-gradient-logo:   linear-gradient(180deg, #014135 0%, #1AA44A 100%);
  --mc-gradient-dark:   linear-gradient(135deg, #06100A 0%, #111814 100%);
  --mc-glow-green:      radial-gradient(60% 60% at 50% 40%, rgba(33,242,103,0.22) 0%, rgba(33,242,103,0) 70%);

  /* ---------- RADII ---------- */
  --mc-radius-xs:  8px;
  --mc-radius-sm:  10px;
  --mc-radius-md:  16px;
  --mc-radius-lg:  24px;
  --mc-radius-xl:  32px;
  --mc-radius-pill: 999px;

  /* ---------- SHADOWS ---------- */
  --mc-shadow-xs:    0 1px 2px rgba(8,17,12,0.06);
  --mc-shadow-card:  0 16px 50px rgba(8,17,12,0.08);
  --mc-shadow-lift:  0 28px 70px rgba(8,17,12,0.12);
  --mc-shadow-green: 0 22px 48px rgba(0,154,68,0.30);
  --mc-shadow-green-soft: 0 16px 36px rgba(0,154,68,0.18);

  /* ---------- SPACING / LAYOUT ---------- */
  --mc-container: 1200px;
  --mc-section-y: 88px;
  --mc-gutter: 24px;
  --mc-space-1: 4px;
  --mc-space-2: 8px;
  --mc-space-3: 12px;
  --mc-space-4: 16px;
  --mc-space-5: 20px;
  --mc-space-6: 24px;
  --mc-space-8: 32px;
  --mc-space-10: 40px;
  --mc-space-12: 48px;
  --mc-space-16: 64px;
  --mc-space-20: 80px;

  /* ---------- TYPE FAMILIES ---------- */
  --mc-font-display: "Exo", system-ui, sans-serif;                 /* headings, hero, UI titles */
  --mc-font-body:    "Exo", system-ui, -apple-system, sans-serif;  /* body, leads, buttons */
  --mc-font-mono:    "JetBrains Mono", ui-monospace, "SFMono-Regular", monospace;
  --mc-font-stat:    "Conthrax", "Exo", system-ui, sans-serif;     /* brand numerals — big stats only */

  /* ---------- TYPE SCALE ---------- */
  --mc-text-hero:  clamp(48px, 7vw, 88px);
  --mc-text-h1:    56px;
  --mc-text-h2:    42px;
  --mc-text-h3:    28px;
  --mc-text-h4:    20px;
  --mc-text-lg:    18px;
  --mc-text-body:  16px;
  --mc-text-sm:    14px;
  --mc-text-xs:    12px;

  --mc-lh-tight:   1.12;
  --mc-lh-snug:    1.25;
  --mc-lh-body:    1.65;

  --mc-tracking-tight: -0.04em;
  --mc-tracking-snug:  -0.02em;
  --mc-tracking-label: 0.08em;

  --mc-weight-regular: 400;
  --mc-weight-medium:  500;
  --mc-weight-semibold:600;
  --mc-weight-bold:    700;
  --mc-weight-black:   800;
}

/* ============================================================
   SEMANTIC TYPE CLASSES — apply directly or copy the rules.
   ============================================================ */

.mc-hero {
  font-family: var(--mc-font-display);
  font-weight: var(--mc-weight-black);
  font-size: var(--mc-text-hero);
  line-height: var(--mc-lh-tight);
  letter-spacing: var(--mc-tracking-tight);
  color: var(--mc-fg-1);
}
.mc-h1 {
  font-family: var(--mc-font-display);
  font-weight: var(--mc-weight-black);
  font-size: var(--mc-text-h1);
  line-height: var(--mc-lh-tight);
  letter-spacing: var(--mc-tracking-tight);
  color: var(--mc-fg-1);
}
.mc-h2 {
  font-family: var(--mc-font-display);
  font-weight: var(--mc-weight-bold);
  font-size: var(--mc-text-h2);
  line-height: var(--mc-lh-snug);
  letter-spacing: var(--mc-tracking-snug);
  color: var(--mc-fg-1);
}
.mc-h3 {
  font-family: var(--mc-font-display);
  font-weight: var(--mc-weight-bold);
  font-size: var(--mc-text-h3);
  line-height: var(--mc-lh-snug);
  letter-spacing: var(--mc-tracking-snug);
  color: var(--mc-fg-1);
}
.mc-h4 {
  font-family: var(--mc-font-display);
  font-weight: var(--mc-weight-semibold);
  font-size: var(--mc-text-h4);
  line-height: 1.35;
  color: var(--mc-fg-1);
}
.mc-lead {
  font-family: var(--mc-font-body);
  font-weight: var(--mc-weight-regular);
  font-size: var(--mc-text-lg);
  line-height: var(--mc-lh-body);
  color: var(--mc-fg-2);
}
.mc-body {
  font-family: var(--mc-font-body);
  font-weight: var(--mc-weight-regular);
  font-size: var(--mc-text-body);
  line-height: var(--mc-lh-body);
  color: var(--mc-fg-2);
}
.mc-small {
  font-family: var(--mc-font-body);
  font-size: var(--mc-text-sm);
  line-height: 1.55;
  color: var(--mc-fg-3);
}
/* Eyebrow / kicker — uppercase technical label */
.mc-eyebrow {
  font-family: var(--mc-font-mono);
  font-weight: var(--mc-weight-medium);
  font-size: var(--mc-text-xs);
  letter-spacing: var(--mc-tracking-label);
  text-transform: uppercase;
  color: var(--mc-green);
}
/* Numeric / spec / metric — monospace */
.mc-mono {
  font-family: var(--mc-font-mono);
  font-weight: var(--mc-weight-medium);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}
.mc-stat {
  font-family: var(--mc-font-display);
  font-weight: var(--mc-weight-black);
  font-size: 28px;
  color: var(--mc-green);
  letter-spacing: var(--mc-tracking-snug);
}