Update style.css

style.css

@@ -199,24 +199,48 @@ pre {
     padding: 20px;
 }
 
-/* Specific fix for Usage section to prevent grey-on-grey */
-.usage-text {
-    color: #ffffff !important; /* Ensure white text on dark background */
+/* Fix for grey-on-grey text across all sections */
+.lead-text {
+    color: #ffffff !important; /* White text on dark backgrounds */
 }
 
-.usage-light {
-    color: #000000 !important; /* Ensure black text on light background */
+.light-lead-text {
+    color: #000000 !important; /* Black text on light backgrounds */
 }
 
-#usage .card.bg-ghost-light .card-body {
+.bg-ghost-card .lead-text,
+.bg-dark .lead-text {
+    color: #ffffff !important; /* Ensure white text in dark cards and sections */
+}
+
+.bg-ghost-light .light-lead-text,
+.bg-light .light-lead-text {
+    color: #000000 !important; /* Ensure black text in light cards and sections */
+}
+
+/* Specific fix for Usage and Tutorials sections */
+#usage .card.bg-ghost-light .card-body,
+#tutorials .card.bg-ghost-light .card-body {
     background: #e0e0e0 !important; /* Light background for contrast */
     color: #000000 !important; /* Black text for readability */
 }
 
-#usage ol, #usage ul {
+#usage ol, #usage ul,
+#tutorials ol, #tutorials ul {
     color: #ffffff !important; /* White text for list items on dark sections */
 }
 
-#usage .card.bg-ghost-light ol, #usage .card.bg-ghost-light ul {
+#usage .card.bg-ghost-light ol, #usage .card.bg-ghost-light ul,
+#tutorials .card.bg-ghost-light ol, #tutorials .card.bg-ghost-light ul {
     color: #000000 !important; /* Black text for list items on light cards */
+}
+
+/* Apply to all lead texts site-wide */
+.lead {
+    color: #ffffff !important; /* Default white for lead text on dark backgrounds */
+}
+
+.bg-light .lead,
+.bg-ghost-light .lead {
+    color: #000000 !important; /* Black for lead text on light backgrounds */
 }