/* ==========================================================================
   HEBER MQ — Plataforma Editorial Científica, Cursos LaTeX & Pasarela Hotmart
   Versión 2.0 Profesional
   ========================================================================== */
:root {
  --bg-primary: #090d16;
  --bg-secondary: #0f172a;
  --bg-card: rgba(15, 23, 42, 0.85);
  --bg-elevated: #1e293b;
  --text-primary: #f8fafc;
  --text-secondary: #cbd5e1;
  --text-muted: #94a3b8;
  --accent-cyan: #38bdf8;
  --accent-blue: #2563eb;
  --accent-amber: #f59e0b;
  --accent-emerald: #10b981;
  --accent-hotmart: #f04e23;
  --border-subtle: rgba(148, 163, 184, 0.16);
  --shadow-glow: 0 20px 50px rgba(2, 6, 23, 0.65);
}
html.light-mode {
  --bg-primary: #f8fafc;
  --bg-secondary: #f1f5f9;
  --bg-card: rgba(255, 255, 255, 0.94);
  --bg-elevated: #e2e8f0;
  --text-primary: #0f172a;
  --text-secondary: #334155;
  --text-muted: #64748b;
  --border-subtle: rgba(15, 23, 42, 0.12);
  --shadow-glow: 0 16px 36px rgba(15, 23, 42, 0.08);
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 88px;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
body {
  margin: 0;
  background-color: var(--bg-primary);
  color: var(--text-primary);
  transition: background-color 0.25s ease, color 0.25s ease;
  overflow-x: hidden;
}
.font-heading {
  font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
}
.font-mono-code {
  font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}
.font-latex-serif {
  font-family: 'Crimson Pro', Georgia, Cambria, 'Times New Roman', serif;
}
/* Subtle mathematical grid background */
.math-grid-bg {
  background-image:
    radial-gradient(circle at 15% 15%, rgba(56, 189, 248, 0.12), transparent 32%),
    radial-gradient(circle at 85% 25%, rgba(245, 158, 11, 0.10), transparent 30%),
    linear-gradient(to right, rgba(148, 163, 184, 0.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(148, 163, 184, 0.04) 1px, transparent 1px);
  background-size: 100% 100%, 100% 100%, 36px 36px, 36px 36px;
}
.glass-panel {
  background: var(--bg-card);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid var(--border-subtle);
  box-shadow: var(--shadow-glow);
}
.book-cover-3d {
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease;
  box-shadow: -10px 16px 32px rgba(0, 0, 0, 0.48), 0 0 0 1px rgba(255, 255, 255, 0.08);
}
.book-cover-3d:hover {
  transform: translateY(-6px) rotate(-1.5deg) scale(1.02);
  box-shadow: -14px 24px 44px rgba(2, 6, 23, 0.65), 0 0 24px rgba(56, 189, 248, 0.22);
}
.btn-hotmart {
  background: linear-gradient(135deg, #f04e23 0%, #d9380f 100%);
  color: #ffffff;
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}
.btn-hotmart:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 26px rgba(240, 78, 35, 0.42);
  filter: brightness(1.06);
}
.btn-cyan {
  background: linear-gradient(135deg, #0ea5e9 0%, #2563eb 100%);
  color: #ffffff;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.btn-cyan:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 26px rgba(14, 165, 233, 0.38);
}
/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #090d16;
}
::-webkit-scrollbar-thumb {
  background: #334155;
  border-radius: 9999px;
}
::-webkit-scrollbar-thumb:hover {
  background: #475569;
}
/* LaTeX Logo kerning styling */
.latex-logo {
  font-family: 'Crimson Pro', Georgia, serif;
  letter-spacing: -0.02em;
}
.latex-logo sup {
  font-size: 0.72em;
  vertical-align: 0.22em;
  margin-left: -0.18em;
  margin-right: -0.08em;
}
.latex-logo sub {
  font-size: 0.78em;
  vertical-align: -0.18em;
  margin-left: -0.12em;
  margin-right: -0.08em;
}