/* ==========================================================================
   Base Typography, Elements & Accessibility — website.prasadkamble.com
   ========================================================================== */

/* Accessibility Skip Link */
.skip-link {
  position: absolute;
  top: -100px;
  left: 1rem;
  z-index: 9999;
  background-color: var(--color-primary);
  color: var(--color-white);
  padding: 0.75rem 1.25rem;
  border-radius: var(--radius-sm);
  font-weight: var(--font-weight-semibold);
  transition: top var(--transition-fast);
}

.skip-link:focus {
  top: 1rem;
  outline: 3px solid var(--color-focus);
}

/* Text Selection */
::selection {
  background-color: var(--color-primary-soft);
  color: var(--color-primary-dark);
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
  color: var(--color-text);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  letter-spacing: -0.02em;
}

h1 {
  font-size: var(--font-size-4xl);
  margin-bottom: var(--space-4);
}

h2 {
  font-size: var(--font-size-3xl);
  margin-bottom: var(--space-3);
}

h3 {
  font-size: var(--font-size-2xl);
  margin-bottom: var(--space-3);
}

h4 {
  font-size: var(--font-size-xl);
  margin-bottom: var(--space-2);
}

p {
  color: var(--color-text-soft);
  margin-bottom: var(--space-4);
  line-height: var(--line-height-relaxed);
}

p:last-child {
  margin-bottom: 0;
}

/* Utility Text Classes */
.text-xs { font-size: var(--font-size-xs); }
.text-sm { font-size: var(--font-size-sm); }
.text-base { font-size: var(--font-size-base); }
.text-md { font-size: var(--font-size-md); }
.text-lg { font-size: var(--font-size-lg); }
.text-xl { font-size: var(--font-size-xl); }

.text-soft { color: var(--color-text-soft); }
.text-muted { color: var(--color-text-muted); }
.text-primary { color: var(--color-primary); }
.text-accent { color: var(--color-accent); }

.font-medium { font-weight: var(--font-weight-medium); }
.font-semibold { font-weight: var(--font-weight-semibold); }
.font-bold { font-weight: var(--font-weight-bold); }

.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }

/* Inline Code & Technical Snippets */
code {
  font-family: var(--font-family-mono);
  font-size: 0.9em;
  padding: 0.15rem 0.4rem;
  background-color: var(--color-surface-strong);
  color: var(--color-primary-dark);
  border-radius: var(--radius-xs);
  border: 1px solid var(--color-border-subtle);
}

pre {
  background-color: var(--color-surface-dark);
  color: #e5e7eb;
  padding: var(--space-4);
  border-radius: var(--radius-md);
  overflow-x: auto;
  margin-bottom: var(--space-4);
  font-family: var(--font-family-mono);
  font-size: var(--font-size-sm);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

pre code {
  background: transparent;
  padding: 0;
  border: none;
  color: inherit;
}

/* Ambient Visual Glows */
.ambient-glow-wrapper {
  position: relative;
  overflow: hidden;
}

.ambient-glow {
  position: absolute;
  width: 450px;
  height: 450px;
  border-radius: 50%;
  filter: blur(100px);
  pointer-events: none;
  z-index: 0;
  opacity: 0.6;
}

.ambient-glow-green {
  background: radial-gradient(circle, var(--color-primary-glow) 0%, rgba(5, 159, 27, 0) 70%);
  top: -150px;
  right: -100px;
}

.ambient-glow-orange {
  background: radial-gradient(circle, var(--color-accent-glow) 0%, rgba(244, 128, 15, 0) 70%);
  bottom: -150px;
  left: -100px;
}
