/* Container and Section Setup */
#ec-board-section {
  
    padding: 30px 20px;
    background-color: #ffffff;
    color: #1d1d1f;
}

.ec-container {
    max-width: 1200px;
    margin: 0 auto;
}

.ec-section-title {
    font-size: 32px;
   
    margin-bottom: 40px;
    border-bottom: 1px solid #d2d2d7;
    padding-bottom: 20px;
}

/* Grid Layout - Responsive */
.ec-director-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* Desktop: 4 columns */
    gap: 30px;
}

/* Director Cards */
.ec-director-card {
    margin-bottom: 20px;
}

.ec-name, .ec-name-link {
    font-size: 16px;
   
    color: #0066cc;
    text-decoration: none;
    display: block;
    margin-bottom: 5px;
}

.ec-name-link:hover {
    text-decoration: underline;
}

.ec-designation {
    font-size: 14px;
    margin: 0;
    color: #1d1d1f;
}

.ec-sub-info {
    font-size: 14px;
    color: #6e6e73;
    margin: 0;
}

/* Helpline Box */
.ec-helpline-box {
    margin-top: 50px;
    background-color: #f5f5f7;
    padding: 40px;
    border-radius: 12px;
    border: 1px solid #d2d2d7;
}

.ec-helpline-title {
    font-size: 24px;
    margin-bottom: 15px;
}

.ec-contact-detail {
    margin-bottom: 5px;
    font-size: 16px;
}

.ec-email-link {
    color: #0066cc;
    text-decoration: none;
    font-size: 16px;
}

.ec-email-link:hover {
    text-decoration: underline;
}

/* --- Media Queries for Responsiveness --- */

/* Tablets (1024px and below) */
@media (max-width: 1024px) {
    .ec-director-grid {
        grid-template-columns: repeat(3, 1fr); /* 3 columns */
    }
}

/* Small Tablets / Large Phones (768px and below) */
@media (max-width: 768px) {
    .ec-director-grid {
        grid-template-columns: repeat(2, 1fr); /* 2 columns */
    }
}

/* Mobile Phones (480px and below) */
@media (max-width: 480px) {
    .ec-director-grid {
        grid-template-columns: 1fr; /* 1 column */
        text-align: center;
    }
    .ec-section-title {
        text-align: center;
    }
    .ec-helpline-box {
        text-align: center;
        padding: 30px 15px;
    }
}