/* Fix for text clipping issue - ensure proper spacing for descenders */
/* This fixes the issue where letters like p, g, j, q, y have their bottom parts cut off */

/* Global fixes for large text classes */
.text-4xl, .text-5xl {
  line-height: 1.3 !important;
  padding-bottom: 0.25rem !important;
  overflow: visible !important;
}

/* Specific fixes for large headings to prevent clipping of descenders */
h1.text-4xl, h1.text-5xl,
h2.text-4xl, h2.text-5xl,
h3.text-4xl, h3.text-5xl,
h4.text-4xl, h4.text-5xl {
  line-height: 1.25 !important;
  padding-bottom: 0.5rem !important;
  margin-bottom: 1.5rem !important;
  overflow: visible !important;
}

/* Fix for mobile responsive text */
@media (max-width: 768px) {
  h1.text-4xl, h1.text-5xl,
  h2.text-4xl, h2.text-5xl,
  h3.text-4xl, h3.text-5xl,
  h4.text-4xl, h4.text-5xl {
    line-height: 1.3 !important;
    padding-bottom: 0.375rem !important;
  }
}

/* Additional fix for gradient text specifically */
.gradient-text {
  line-height: inherit !important;
  padding-bottom: 0.125rem !important;
  overflow: visible !important;
}

.gradient-text-alt {
  line-height: inherit !important;
  padding-bottom: 0.125rem !important;
  overflow: visible !important;
}

/* Ensure containers don't clip text */
.text-4xl, .text-5xl {
  box-sizing: content-box !important;
}

/* Fix for any parent containers that might be clipping */
section, div {
  overflow-y: visible;
}