/* ===================================================
   MY GAMING HUBB — ce-fonts.css
   Google Fonts & Typography Scale
=================================================== */

/* Google Fonts Import */
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Rajdhani:wght@400;500;600;700&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;1,9..40,400&family=Share+Tech+Mono&display=swap');

/* ── TYPE SCALE ── */

.ce-type-display {
  font-family: var(--ce-font-display);
  font-size: clamp(4rem, 10vw, 9rem);
  line-height: 0.9;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.ce-type-h1 {
  font-family: var(--ce-font-heading);
  font-size: clamp(2.4rem, 5vw, 4rem);
  font-weight: 700;
  line-height: 1.15;
}

.ce-type-h2 {
  font-family: var(--ce-font-heading);
  font-size: clamp(1.8rem, 3.5vw, 2.8rem);
  font-weight: 700;
  line-height: 1.2;
}

.ce-type-h3 {
  font-family: var(--ce-font-heading);
  font-size: clamp(1.3rem, 2.5vw, 1.8rem);
  font-weight: 700;
  line-height: 1.3;
}

.ce-type-h4 {
  font-family: var(--ce-font-heading);
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.4;
}

.ce-type-body-lg {
  font-family: var(--ce-font-body);
  font-size: 1.1rem;
  line-height: 1.85;
  font-weight: 400;
}

.ce-type-body {
  font-family: var(--ce-font-body);
  font-size: 0.95rem;
  line-height: 1.8;
}

.ce-type-body-sm {
  font-family: var(--ce-font-body);
  font-size: 0.85rem;
  line-height: 1.75;
}

.ce-type-label {
  font-family: var(--ce-font-mono);
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  line-height: 1.4;
}

.ce-type-mono {
  font-family: var(--ce-font-mono);
  font-size: 0.88rem;
  line-height: 1.6;
}

/* ── FONT WEIGHTS ── */
.ce-fw-300 { font-weight: 300; }
.ce-fw-400 { font-weight: 400; }
.ce-fw-500 { font-weight: 500; }
.ce-fw-600 { font-weight: 600; }
.ce-fw-700 { font-weight: 700; }

/* ── TEXT UTILITIES ── */
.ce-text-center { text-align: center; }
.ce-text-left   { text-align: left; }
.ce-text-right  { text-align: right; }
.ce-text-upper  { text-transform: uppercase; }
.ce-text-italic { font-style: italic; }
.ce-text-nowrap { white-space: nowrap; }

/* ── GRADIENT TEXT ── */
.ce-text-grad-1 {
  background: linear-gradient(90deg, var(--ce-neon-cyan) 0%, var(--ce-neon-purple) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.ce-text-grad-2 {
  background: linear-gradient(90deg, var(--ce-neon-purple) 0%, var(--ce-neon-pink) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.ce-text-grad-3 {
  background: linear-gradient(90deg, var(--ce-neon-green) 0%, var(--ce-neon-cyan) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.ce-text-grad-fire {
  background: linear-gradient(90deg, #ff6b35, #ffd700, #ff2d78);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ── LETTER SPACING ── */
.ce-ls-tight  { letter-spacing: -0.02em; }
.ce-ls-normal { letter-spacing: 0; }
.ce-ls-wide   { letter-spacing: 0.06em; }
.ce-ls-wider  { letter-spacing: 0.12em; }
.ce-ls-widest { letter-spacing: 0.2em; }

/* ── LINE HEIGHT ── */
.ce-lh-tight  { line-height: 1.1; }
.ce-lh-normal { line-height: 1.5; }
.ce-lh-loose  { line-height: 1.8; }
.ce-lh-looser { line-height: 2; }

/* ── ARTICLE TYPOGRAPHY ── */
.ce-prose {
  font-family: var(--ce-font-body);
  font-size: 1rem;
  line-height: 1.9;
  color: var(--ce-text-secondary);
  max-width: 720px;
}

.ce-prose > * + * { margin-top: 1.2em; }

.ce-prose strong {
  color: var(--ce-text-primary);
  font-weight: 600;
}

.ce-prose a {
  color: var(--ce-neon-cyan);
  border-bottom: 1px solid rgba(0,229,255,0.3);
  transition: border-color var(--ce-transition);
}

.ce-prose a:hover { border-color: var(--ce-neon-cyan); }

.ce-dropcap::first-letter {
  font-family: var(--ce-font-display);
  font-size: 4.5rem;
  line-height: 0.8;
  float: left;
  margin: 0.1em 0.12em 0 0;
  color: var(--ce-neon-cyan);
}

/* ── QUOTE STYLES ── */
.ce-pullquote {
  font-family: var(--ce-font-heading);
  font-size: 1.4rem;
  font-weight: 700;
  font-style: italic;
  color: var(--ce-text-primary);
  border-left: 4px solid var(--ce-neon-purple);
  padding: 1.2rem 1.5rem;
  margin: 2.5rem 0;
  background: rgba(178,75,243,0.04);
  border-radius: 0 var(--ce-radius-md) var(--ce-radius-md) 0;
  line-height: 1.5;
}