/* Container Logic */
 .jaz-events-section {
     background-color: #000000;
     /* Dark background from image */
     padding: 60px 0;
     font-family: 'Cairo', sans-serif;
     direction: ltr;
     /* Right to Left */
 }

 .jaz-container {
     max-width: 1250px;
     margin: 0 auto;
     padding: 0 20px;
 }

 /* Header Styling */
 .jaz-events-header {
     background-color: #333333;
     /* Dark grey bar */
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding: 12px 20px;
     border-right: 5px solid var(--primary-color);
     /* Teal accent bar */
     margin-bottom: 25px;
 }

 .jaz-events-title {
     color: #ffffff;
     margin: 0;
     font-size: 22px;
 }

 .jaz-more-link {
     color: #ffffff;
     text-decoration: none;
     font-size: 14px;
     display: flex;
     align-items: center;
     gap: 8px;
     opacity: 0.8;
 }

 .jaz-more-link:hover {
     opacity: 1;
 }

 /* Grid Layout */
 .jaz-events-grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     /* 4 columns on desktop */
     gap: 20px;
 }

 /* Card Styling */
 .jaz-event-card {
     display: flex;
     flex-direction: column;
 }

 .jaz-event-image {
     position: relative;
     width: 100%;
     overflow: hidden;
     margin-bottom: 15px;
 }

 .jaz-event-image img {
     width: 100%;
     height: auto;
     display: block;
     transition: transform 0.4s ease;
 }

 .jaz-event-card:hover img {
     transform: scale(1.05);
     /* Slight zoom on hover */
 }

 /* Teal Date Tag */
 .jaz-event-date {
     position: absolute;
     bottom: 0;
     left: 0;
     background-color: var(--primary-color);
     color: white;
     padding: 4px 10px;
     font-size: 11px;
     font-weight: 600;
 }

 .jaz-event-info p {
     color: #ffffff;
     font-size: 15px;
     line-height: 1.6;
     margin: 0;
     font-weight: 500;
 }

 /* RESPONSIVE DESIGN */

 /* Tablet View (2 Columns) */
 @media (max-width: 1024px) {
     .jaz-events-grid {
         grid-template-columns: repeat(2, 1fr);
     }
 }

 /* Mobile View (1 Column) */
 @media (max-width: 600px) {
     .jaz-events-grid {
         grid-template-columns: 1fr;
     }

     .jaz-events-header {
         padding: 10px 15px;
     }

     .jaz-events-title {
         font-size: 18px;
     }
 }