.wrapper {
     max-width: 1000px;
     margin: 60px auto;
     padding: 0 20px;
 }

 h1 {
     font-size: 46px;
     font-weight: 600;
     margin: 0;
     color: #4a4a4a;
 }

  

 .card {
     background: #ffffff;
     padding: 40px;
     border-radius: 10px;
     box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
 }

 .card a.title-link {
     font-size: 28px;
     font-weight: 600;
     color: #0d6f8f;
     text-decoration: none;
 }

 .card a.title-link:hover {
     text-decoration: underline;
 }

 .card p {
     font-size: 20px;
     line-height: 1.6;
     margin-top: 20px;
 }

 .search-section {
     margin-top: 30px;
 }

 .search-section p {
     font-size: 24px;
 }

 .search-box {
     display: flex;
     margin-top: 20px;
 }

 .search-box input {
     flex: 1;
     padding: 18px;
     font-size: 20px;
     border: 1px solid #ccc;
     border-right: none;
     border-radius: 6px 0 0 6px;
     outline: none;
 }

 .search-box button {
     padding: 18px 30px;
     font-size: 20px;
     background: #0d6f8f;
     color: #fff;
     border: none;
     border-radius: 0 6px 6px 0;
     cursor: pointer;
     transition: 0.2s ease;
 }

 .search-box button:hover {
     background: #095a74;
 }

 .contact-link {
     display: inline-block;
     margin-top: 40px;
     font-size: 26px;
     color: #0d6f8f;
     text-decoration: none;
     font-weight: 600;
 }

 .contact-link:hover {
     text-decoration: underline;
 }

 /* Responsive */
 @media (max-width: 768px) {
     h1 {
         font-size: 34px;
     }

     h2 {
         font-size: 24px;
     }

     .card a.title-link {
         font-size: 22px;
     }

     .card p {
         font-size: 16px;
     }

     .search-box {
         flex-direction: column;
     }

     .search-box input {
         border-radius: 6px;
         border-right: 1px solid #ccc;
         margin-bottom: 10px;
     }

     .search-box button {
         border-radius: 6px;
         width: 100%;
     }
 }

 .recent-section {
     max-width: 1000px;
     margin: 80px auto;
     padding: 0 20px;
 }

 .recent-section h2 {
     font-size: 48px;
     font-weight: 600;
     margin-bottom: 40px;
     color: #4a4a4a;
 }

 .question-item {
     margin-bottom: 70px;
 }

 .question-title {
     font-size: 30px;
     font-weight: 600;
     margin-bottom: 20px;
     color: #4a4a4a;
 }

 .question-answer {
     font-size: 22px;
     line-height: 1.7;
     color: #555;
     max-width: 900px;
 }

 .question-date {
     text-align: right;
     font-size: 22px;
     color: #555;
     margin-top: 20px;
 }

 /* Responsive */
 @media (max-width: 768px) {
     .recent-section h2 {
         font-size: 30px;
     }

     .question-title {
         font-size: 22px;
     }

     .question-answer {
         font-size: 18px;
     }

     .question-date {
         font-size: 16px;
     }
 }

 .category-section {
     max-width: 1150px;
     margin: 80px auto;
     padding: 0 20px;
 }

 .category-section h2 {
     font-size: 52px;
     font-weight: 600;
     margin-bottom: 40px;
     color: #4a4a4a;
 }

 .faq-entry {
     margin-bottom: 60px;
 }

 .faq-entry a.question-link {
     display: inline-block;
     font-size: 30px;
     font-weight: 600;
     color: #0d6f8f;
     text-decoration: none;
     margin-bottom: 15px;
 }

 .faq-entry a.question-link:hover {
     text-decoration: underline;
 }

 .faq-entry p {
     font-size: 22px;
     line-height: 1.7;
     color: #555;
     max-width: 900px;
     margin-bottom: 15px;
 }

 .faq-entry a.read-more {
     font-size: 22px;
     color: #0d6f8f;
     text-decoration: none;
     font-weight: 500;
 }

 .faq-entry a.read-more:hover {
     text-decoration: underline;
 }

 /* Responsive */
 @media (max-width: 768px) {
     .category-section h2 {
         font-size: 32px;
     }

     .faq-entry a.question-link {
         font-size: 22px;
     }

     .faq-entry p {
         font-size: 18px;
     }

     .faq-entry a.read-more {
         font-size: 18px;
     }
 }
 /* ===== GLOBAL STYLING ===== */

 body {
     font-family: 'Inter', Arial, sans-serif;
     background: #f3f3f3;
     margin: 0;
     padding: 0;
     color: #444;
 }

 h2 {
     font-size: 48px;
     font-weight: 600;
     color: #4a4a4a;
     margin-bottom: 40px;
 }

 p {
     margin: 0 0 15px;
 }

 /* ===== SECTION WRAPPER ===== */

 .recent-section,
 .category-section {
     max-width: 1000px;
     margin: 80px auto;
     padding: 0 20px;
 }

 /* ===== RECENT QUESTIONS ===== */

 .question-item {
     margin-bottom: 60px;
 }

 .question-title {
     font-size: 28px;
     font-weight: 600;
     color: #4a4a4a;
     margin-bottom: 15px;
 }

 .question-answer {
     font-size: 20px;
     line-height: 1.7;
     color: #555;
     max-width: 900px;
 }

 .question-date {
     text-align: right;
     font-size: 18px;
     color: #666;
     margin-top: 15px;
 }

 /* ===== CATEGORY FAQ ITEMS ===== */

 .faq-entry {
     margin-bottom: 60px;
 }

 .question-link {
     display: inline-block;
     font-size: 26px;
     font-weight: 600;
     color: #0d6f8f;
     text-decoration: none;
     margin-bottom: 12px;
     transition: 0.2s ease;
 }

 .question-link:hover {
     text-decoration: underline;
     color: #095a74;
 }

 .faq-entry p {
     font-size: 20px;
     line-height: 1.7;
     color: #555;
     max-width: 900px;
 }

 .read-more {
     display: inline-block;
     margin-top: 8px;
     font-size: 20px;
     color: #0d6f8f;
     text-decoration: none;
     font-weight: 500;
     transition: 0.2s ease;
 }

 .read-more:hover {
     text-decoration: underline;
     color: #095a74;
 }

 /* ===== RESPONSIVE ===== */

 @media (max-width: 768px) {

     h2 {
         font-size: 30px;
     }

     .question-title {
         font-size: 20px;
     }

     .question-answer,
     .faq-entry p {
         font-size: 17px;
     }

     .question-link {
         font-size: 20px;
     }

     .read-more {
         font-size: 16px;
     }

     .question-date {
         font-size: 14px;
         text-align: left;
     }
 }