h1, h2, h3, h4, h5, h6 {
    font-family: "Roboto", sans-serif !important;
  }
  
  body, div, p {
    font-family: "Nunito", sans-serif !important;
  }

  h1, h2, h3, h4, h5, h6 {
    font-family: Roboto, Inter, system-ui, sans-serif;
  }
  body {
    font-family: Nunito, Inter, system-ui, sans-serif;
  }
  
  /* FAQ Accordion Styling */
  .faq-item {
    margin-bottom: 0.75rem;
  }
  .faq-item button {
    width: 100%;
    text-align: left;
    border: none;
    outline: none;
  }
  .faq-item button:focus {
    outline: 2px solid rgba(255, 255, 255, 0.2);
  }
  .faq-item button[aria-expanded="true"] {
    border-radius: 0.75rem 0.75rem 0 0;
  }
  .faq-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .faq-content.active {
    max-height: 1000px;
  }
  .faq-toggle-icon {
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  }
  [aria-expanded="true"] .faq-toggle-icon {
    transform: rotate(45deg);
  }

  @keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
  }
  .animate-marquee {
    animation: marquee 30s linear infinite;
  }

  body { background: #f3f4f6; }
  .header-bg { background-color: #134e4a; }
  .book-card { transition: transform 0.4s cubic-bezier(0.4,0,0.2,1), box-shadow 0.4s; }
  .book-card:hover { transform: translateY(-10px) scale(1.04); box-shadow: 0 20px 25px -5px rgba(0,0,0,0.12), 0 10px 10px -5px rgba(0,0,0,0.06); }
  .book-cover { box-shadow: 0 4px 24px 0 rgba(0,0,0,0.10); border-radius: 1rem; }

  /* Responsive improvements */
  @media (max-width: 768px) {
      .container {
          padding-left: 1rem;
          padding-right: 1rem;
      }
      
      h1 {
          font-size: 2rem;
      }
      
      .article-card {
          margin-bottom: 2rem;
      }
      
      .mobile-menu {
          max-height: 0;
          overflow: hidden;
          transition: max-height 0.5s ease;
      }
      
      .mobile-menu.active {
          max-height: 500px;
      }
  }
  
  /* Modern card design */
  .modern-card {
      border-radius: 1rem;
      overflow: hidden;
      background: white;
      box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.05);
      transition: all 0.3s ease;
  }
  
  .modern-card:hover {
      transform: translateY(-8px);
      box-shadow: 0 20px 30px -10px rgba(0, 0, 0, 0.1);
  }
  
  /* Button styles */
  .btn-primary {
      background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
      color: white;
      padding: 0.75rem 1.5rem;
      border-radius: 0.5rem;
      font-weight: 600;
      transition: all 0.3s ease;
      box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  }
  
  .btn-primary:hover {
      transform: translateY(-2px);
      box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  }
  
  /* Improved text styles */
  .heading-xl {
      font-size: 2.5rem;
      font-weight: 800;
      line-height: 1.2;
      margin-bottom: 1.5rem;
  }
  
  .heading-lg {
      font-size: 2rem;
      font-weight: 700;
      line-height: 1.3;
      margin-bottom: 1.25rem;
  }
  
  .heading-md {
      font-size: 1.5rem;
      font-weight: 700;
      line-height: 1.4;
      margin-bottom: 1rem;
  }