/* Hallmark · macrostructure: 15 Split Studio · nav: N7 Brutal slab
 * footer: Ft6 Letter close · hero: H4 Stat-led
 * theme: violet ink hue 285 + violet accent hue 296 + brand gold CTA hue 82
 * motion: hover-only (lift + glow + ring), 0 keyframes
 * pre-emit: P4 H4 E4 S4 R4 V4
 */

@font-face {
  font-family: "Space Grotesk";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/space-grotesk-400.woff2") format("woff2");
}
@font-face {
  font-family: "Space Grotesk";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/space-grotesk-700.woff2") format("woff2");
}
@font-face {
  font-family: "Instrument Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/instrument-sans-400.woff2") format("woff2");
}
@font-face {
  font-family: "Instrument Sans";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/instrument-sans-700.woff2") format("woff2");
}
@font-face {
  font-family: "DM Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/dm-mono-400.woff2") format("woff2");
}
@font-face {
  font-family: "DM Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/dm-mono-500.woff2") format("woff2");
}

:root {
  /* Tone tim-indigo, do tu anh tham chieu nguoi dung gui (11/09/2026):
     panel ref oklch(18.5% .053 285) - card ref oklch(20.7% .06 280)
     tim ref oklch(55.9% .223 296) - nut CTA ref oklch(79% .136 77)
     Nut CTA cua ref la mau ho phach, gan trung vang brand ONG777 (70.6% .123 82.3)
     => giu VANG lam CTA + logo, chuyen chrome/be mat sang TIM. */
  --ong7-paper: oklch(14.5% 0.042 285);
  --ong7-ink: oklch(93% 0.020 300);
  --ong7-ink-muted: oklch(72% 0.035 300);
  --ong7-accent: oklch(70.6% 0.123 82.3);
  --ong7-highlight: oklch(95.9% 0.109 104.3);
  --ong7-accent-deep: oklch(50.5% 0.102 63.2);
  --ong7-accent-ink: oklch(15% 0.05 82.3);
  --ong7-violet: oklch(72% 0.168 298);
  --ong7-violet-deep: oklch(42% 0.180 289);
  --ong7-violet-ink: oklch(97% 0.015 300);
  --ong7-rule: oklch(31% 0.055 287);
  --ong7-rule-accent: oklch(66% 0.190 297);
  --ong7-card-bg: oklch(19.5% 0.055 284);
  --ong7-card-bg-alt: oklch(24% 0.062 283);
  --ong7-focus: oklch(80% 0.150 298);
  /* hover hien dai - chi transform/opacity/mau, khong dung layout property */
  --ong7-lift-y: -3px;
  --ong7-lift-time: 160ms;
  --ong7-lift-ease: cubic-bezier(0.2, 0.7, 0.3, 1);
  --ong7-glow-violet: 0 0 0 1px oklch(66% 0.190 297 / 0.55), 0 10px 28px oklch(66% 0.190 297 / 0.30);
  --ong7-glow-gold: 0 0 0 1px oklch(70.6% 0.123 82.3 / 0.6), 0 10px 26px oklch(70.6% 0.123 82.3 / 0.22);
  --ong7-ring-violet: 0 0 0 3px oklch(66% 0.190 297 / 0.38);

  --ong7-font-display: "Space Grotesk", system-ui, sans-serif;
  --ong7-font-body: "Instrument Sans", system-ui, sans-serif;
  --ong7-font-mono: "DM Mono", ui-monospace, monospace;

  --ong7-tilew-wide: 320px;
  --ong7-tilew-classic: 236px;
  --ong7-tilew-square: 195px;
  /* Lobby tile shortcode: anh that 300px, hien thi 220px -> khong bao gio phong to. */
  --ong7-lobbyw: 220px;

  --ong7-space-1: 4px;
  --ong7-space-2: 8px;
  --ong7-space-3: 12px;
  --ong7-space-4: 16px;
  --ong7-space-5: 20px;
  --ong7-space-6: 24px;
  --ong7-space-7: 32px;
  --ong7-space-8: 40px;
  --ong7-space-9: 48px;
  --ong7-space-10: 64px;

  --ong7-measure: 65ch;
  --ong7-clamp: 420px;

  /* Cutout-grid tile background gradients (home "Sixteen titles" section) -
     literal colour must live in :root per plan.tokens; the rule below only
     references these via var(). */
  --ong7-cutout-g1-a: oklch(28% 0.11 296);
  --ong7-cutout-g1-b: oklch(16% 0.05 286);
  --ong7-cutout-g2-a: oklch(27% 0.10 316);
  --ong7-cutout-g2-b: oklch(16% 0.05 290);
  --ong7-cutout-g3-a: oklch(29% 0.09 262);
  --ong7-cutout-g3-b: oklch(16% 0.05 282);
  --ong7-cutout-g4-a: oklch(27% 0.10 338);
  --ong7-cutout-g4-b: oklch(16% 0.05 292);
  --ong7-cutout-g5-a: oklch(28% 0.08 240);
  --ong7-cutout-g5-b: oklch(16% 0.05 280);
  --ong7-cutout-g6-a: oklch(29% 0.10 276);
  --ong7-cutout-g6-b: oklch(16% 0.05 288);
  --ong7-cutout-g7-a: oklch(27% 0.09 350);
  --ong7-cutout-g7-b: oklch(16% 0.05 294);
  --ong7-cutout-g8-a: oklch(28% 0.11 306);
  --ong7-cutout-g8-b: oklch(16% 0.05 284);
}