/*
 * Lumon Corporate Terminal - Typography
 * Authentic terminal font styling with VT323
 * Version: 1.0.0
 */

/* Import VT323 font from Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');

:root {
  /* Lumon Terminal Font Stack */
  --lumon-font-family: 'VT323', 'Courier New', 'Monaco', monospace;
  --font-family: var(--lumon-font-family);
  
  /* Typography Scale */
  --lumon-font-size-xs: 0.75rem;
  --lumon-font-size-sm: 0.875rem;
  --lumon-font-size-base: 1rem;
  --lumon-font-size-lg: 1.125rem;
  --lumon-font-size-xl: 1.25rem;
  --lumon-font-size-2xl: 1.5rem;
  --lumon-font-size-3xl: 1.875rem;
  --lumon-font-size-4xl: 2.25rem;
  
  /* Line Heights */
  --lumon-line-height-tight: 1.2;
  --lumon-line-height-normal: 1.5;
  --lumon-line-height-relaxed: 1.75;
  
  /* Letter Spacing */
  --lumon-letter-spacing-tight: 0.05em;
  --lumon-letter-spacing-normal: 0.1em;
  --lumon-letter-spacing-wide: 0.15em;
}

/* Base Typography */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: var(--lumon-font-family);
}

body {
  font-family: var(--lumon-font-family);
  font-size: var(--lumon-font-size-base);
  line-height: var(--lumon-line-height-normal);
  color: var(--lumon-text-primary);
  letter-spacing: var(--lumon-letter-spacing-normal);
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--lumon-font-family);
  font-weight: normal;
  line-height: var(--lumon-line-height-tight);
  color: var(--lumon-text-primary);
  text-shadow: 0 0 15px var(--lumon-glow-primary);
  letter-spacing: var(--lumon-letter-spacing-normal);
}

h1 { 
  font-size: var(--lumon-font-size-4xl);
  text-shadow: 0 0 20px var(--lumon-glow-primary);
}
h2 { 
  font-size: var(--lumon-font-size-3xl);
  text-shadow: 0 0 15px var(--lumon-glow-primary);
}
h3 { 
  font-size: var(--lumon-font-size-2xl);
  text-shadow: 0 0 10px var(--lumon-glow-primary);
}
h4 { font-size: var(--lumon-font-size-xl); }
h5 { font-size: var(--lumon-font-size-lg); }
h6 { font-size: var(--lumon-font-size-base); }

/* Paragraphs */
p {
  margin-bottom: 1rem;
  line-height: var(--lumon-line-height-relaxed);
  color: var(--lumon-text-secondary);
  text-shadow: 0 0 5px var(--lumon-glow-secondary);
}

/* Links */
a {
  color: var(--lumon-text-primary);
  text-decoration: none;
  transition: all 0.3s ease;
  text-shadow: 0 0 5px var(--lumon-glow-secondary);
  letter-spacing: var(--lumon-letter-spacing-tight);
}

a:hover, a:focus {
  text-shadow: 0 0 15px var(--lumon-glow-intense);
  outline: 1px solid var(--lumon-text-primary);
  outline-offset: 2px;
}

/* Code and Monospace */
code, pre {
  font-family: var(--lumon-font-family);
  background-color: var(--lumon-bg-accent);
  padding: 0.2em 0.4em;
  border-radius: 2px;
  font-size: 0.9em;
}

pre {
  padding: 1rem;
  overflow-x: auto;
  line-height: var(--lumon-line-height-normal);
}

/* Responsive Typography */
@media (max-width: 767px) {
  h1 { font-size: var(--lumon-font-size-3xl); }
  h2 { font-size: var(--lumon-font-size-2xl); }
  h3 { font-size: var(--lumon-font-size-xl); }
  
  body {
    font-size: var(--lumon-font-size-sm);
  }
}

@media (max-width: 480px) {
  h1 { font-size: var(--lumon-font-size-2xl); }
  h2 { font-size: var(--lumon-font-size-xl); }
  
  body {
    font-size: var(--lumon-font-size-xs);
  }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
  h1, h2, h3, h4, h5, h6 {
    text-shadow: none;
    font-weight: bold;
  }
  
  p, a {
    text-shadow: none;
  }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
  a {
    transition: none;
  }
}