body {
     background-color: #f5f5f5;
 }

 /* --------------------------------------------------- */
 /* تنسيق خاص بصفحة المشاريع (Projects Header) */
 /* --------------------------------------------------- */
 .projects-header {
     background-color: #2d6c5b;

     background-image: url('../images/mainbanner4.jpeg');
     background-size: cover;
     background-position: center center;
     background-attachment: fixed;
     background-repeat: no-repeat;
     position: relative;
     color: #ffffff;
     padding: 3rem 1rem;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
     text-align: center;
     z-index: 1;
 }

 /* طبقة تراكبية (Overlay) لتحسين قراءة النص */
 .projects-header::before {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background-color: rgba(45, 108, 91, 0.4);
     z-index: -1;
 }

 .projects-header h1 {
     margin-top: 0;
     font-family: "Fairuz", sans-serif;
     font-size: clamp(2rem, 5vw, 3rem);
     margin-bottom: 0.5rem;
 }

 /* تعديل حجم خط الفقرة ليكون متجاوباً */
 .projects-header p {
     margin-top: 0;
     font-size: clamp(1rem, 2.5vw, 1.5rem);
     font-family: "Fairuz", sans-serif;
     font-weight: 300;
 }

 /* التجاوب مع الشاشات الصغيرة (Projects Header) */
 @media (max-width: 768px) {
     .projects-header {
         min-height: 150px;
         padding: 2rem 1rem;
         background-attachment: scroll;
     }
 }

 @media (max-width: 480px) {
     .projects-header h1 {
         font-size: 1.5rem;
         padding: 0 5px;
     }
 }

 /* زر "عرض المزيد" */
 .load-more-btn {
     background-color: #2d6c5b;
     color: #fff;
     border: none;
     padding: 12px 26px;
     font-size: 15px;
     border-radius: 10px;
     cursor: pointer;
     box-shadow: 0 8px 22px rgba(45, 108, 91, 0.14);
     transition: transform .18s ease, box-shadow .18s ease, opacity .18s;
 }

 .load-more-btn:hover {
     transform: translateY(-3px);
     box-shadow: 0 12px 28px rgba(45, 108, 91, 0.20);
 }

 .load-more-btn[disabled] {
     opacity: .75;
     cursor: not-allowed;
     transform: none;
     box-shadow: 0 6px 12px rgba(0, 0, 0, 0.06);
 }

 .custom-pagination {
     display: flex;
     justify-content: center;
     flex-wrap: wrap;
     gap: 6px;
     margin-top: 20px;
     margin-bottom: 20px;
     font-family: 'Arial', sans-serif;
 }

 .page-btn {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     padding: 8px 14px;
     border: 1px solid #ddd;
     border-radius: 8px;
     text-decoration: none;
     color: #555;
     font-weight: 500;
     transition: all 0.2s ease-in-out;
     min-width: 42px;
     height: 42px;
     background-color: #fff;
     cursor: pointer;
 }

 .page-btn:hover:not(.active):not(.disabled) {
     background-color: #2d6c5b;
     /* اللون الرسمي عند Hover */
     color: #fff;
     border-color: #2d6c5b;
 }

 .page-btn.active {
     background: linear-gradient(135deg, #2d6c5b, #1f4d3f);
     color: white;
     border: none;
     box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
     transform: scale(1.1);
 }

 .page-btn.disabled {
     color: #aaa;
     border-color: #eee;
     cursor: not-allowed;
 }

 .page-btn.dots {
     cursor: default;
     background-color: transparent;
     border: none;
     color: #888;
 }

 /* Optional: تأثير ضغط الزر */
 .page-btn:active {
     transform: scale(0.95);
 }