/* =====================================
   GOOGLE TRUST RESET – BUSINESS BLOG
===================================== */

/* Base */
body {
  background: #f9fafb;
  color: #111827;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  line-height: 1.8;
  font-size: 16px;
}

/* =====================================
   HEADING AUTHORITY (VERY IMPORTANT)
===================================== */

h1 {
  font-size: 42px;
  font-weight: 800;
  letter-spacing: -0.02em;
}

h2 {
  font-size: 28px;
  font-weight: 700;
  margin-top: 42px;
}

h3 {
  font-size: 22px;
  font-weight: 600;
}

h1, h2, h3 {
  color: #020617;
}

/* =====================================
   BRAND COLOR LOGIC (NOT BLOGGY)
===================================== */

a {
  color: #1d4ed8;
  font-weight: 500;
}

a:hover {
  color: #1e40af;
}

/* =====================================
   HERO SECTION – BRAND NOT PERSON
===================================== */

.hero, .hero-section {
  padding: 100px 20px 80px;
  background: linear-gradient(180deg, #ffffff, #f1f5f9);
  text-align: left;
}

.hero p {
  max-width: 720px;
  font-size: 17px;
  color: #475569;
}

/* =====================================
   CTA BUTTON – BUSINESS SIGNAL
===================================== */

button, .btn {
  background: #1d4ed8;
  color: #ffffff;
  border-radius: 8px;
  padding: 12px 22px;
  font-weight: 700;
  border: none;
}

button:hover {
  background: #1e40af;
}

/* =====================================
   CONTENT WIDTH – GOOGLE SAFE
===================================== */

.post-content,
.single-post .content {
  max-width: 760px;
  margin: auto;
  font-size: 16.5px;
}

/* Paragraph rhythm (Ads + UX) */
.post-content p {
  margin-bottom: 20px;
}

/* =====================================
   POST / CARD – KNOWLEDGE BASE STYLE
===================================== */

.post, .card, .post-item {
  background: #ffffff;
  border-radius: 14px;
  border: 1px solid #e5e7eb;
  padding: 26px;
}

/* =====================================
   CATEGORY – BUSINESS INTENT
===================================== */

.category, .category-box {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  padding: 28px;
}

.category p {
  color: #475569;
}

/* =====================================
   TAGS – TOPICAL AUTHORITY
===================================== */

.tags a {
  background: #e0e7ff;
  color: #1e40af;
  font-weight: 500;
  border-radius: 999px;
  padding: 6px 14px;
  font-size: 13px;
}

/* =====================================
   FOOTER – COMPANY FEEL
===================================== */

footer {
  background: #020617;
  color: #cbd5f5;
}

footer h4 {
  color: #ffffff;
}

footer a {
  color: #cbd5f5;
}

/* =====================================
   ADSENSE SAFE SPACING
===================================== */

.ad-slot {
  margin: 40px 0;
  padding: 20px;
  background: #ffffff;
  border: 1px dashed #cbd5f5;
}
/* =====================================
   VISIBILITY FIX – FOOTER & LOWER SECTIONS
===================================== */

/* About / Footer / Sidebar text */
.about-me p,
.about-me,
.footer p,
footer p,
footer span,
footer li,
.sidebar p,
.quick-links a {
  color: #334155 !important; /* Dark readable grey */
  opacity: 1 !important;
}

/* Section headings visibility */
footer h4,
.about-me h4,
.tags h4,
.quick-links h4 {
  color: #020617 !important;
  font-weight: 700;
}

/* Categories text */
.category p,
.category-box p {
  color: #334155 !important;
  font-size: 14.5px;
}

/* Tags visibility */
.tags a {
  color: #1e40af !important;
  background: #e0e7ff !important;
  font-weight: 500;
}

/* Newsletter text */
.newsletter p,
.newsletter label {
  color: #334155 !important;
}

/* Quick links hover */
.quick-links a:hover {
  color: #1e40af !important;
}

/* =====================================
   MOBILE EXTRA READABILITY
===================================== */

@media (max-width: 768px) {
  footer p,
  .about-me p,
  .category p {
    font-size: 15px;
  }
}
/* =====================================
   FIX: ABOUT ME & LOWER CONTENT VISIBILITY
===================================== */

/* ABOUT ME heading */
.about-me h4,
.about-me h3,
.about-me h2 {
  color: #020617 !important;   /* Strong dark text */
  font-weight: 800 !important;
  letter-spacing: 0.02em;
}

/* ABOUT ME paragraph */
.about-me p {
  color: #334155 !important;   /* Readable dark grey */
  opacity: 1 !important;
  font-size: 15.5px;
  line-height: 1.7;
}

/* Address / small text */
.about-me span,
.about-me address {
  color: #475569 !important;
  opacity: 1 !important;
}

/* Quick links heading */
.quick-links h4 {
  color: #020617 !important;
  font-weight: 700;
}

/* Quick links text */
.quick-links a {
  color: #334155 !important;
  font-weight: 500;
}

/* Tags section */
.tags h4 {
  color: #020617 !important;
  font-weight: 700;
}

/* Footer background contrast boost */
footer {
  background: #f8fafc !important;
}

/* =====================================
   MOBILE READABILITY BOOST
===================================== */

@media (max-width: 768px) {
  .about-me p,
  footer p {
    font-size: 15.8px;
  }
}