.exec-section {
    margin-top: 30%;
}

.exec-section h2 {
    font-weight: 700;
    font-size: 2.4em;
    margin-bottom: 10%;
}

.profile {
    text-align: center;
    margin-bottom: 10%;
}

.profile img {
    width: 50%;
    aspect-ratio: 1 / 1;          /* force a square box → perfect circle */
    object-fit: cover;            /* crop to fill instead of stretching */
    object-position: center 30%;  /* keep faces in frame */
    border-radius: 50%;
    margin-bottom: 4%;
}

.profile h3 {
    margin-top: 2%;
    color: #0f5b81; /* var(--btn-dark-blue) */
}

.exec-section .profile .title small i {
    color: grey;
}

.members-hr {
    padding: 0%;
    width: 85%;
    margin: auto;
}

.members-hr hr {
    width: 100%;
    border: 0.5px solid grey;
}


.exec-section #council {
    margin-top: 15%;
}


@media only screen and (max-width: 575px) {
    .exec-section h2 {
        text-align: center;
    }
}

@media only screen and (min-width: 500px) {
    .exec-section {
        margin-top: 20%;
    }
}

@media only screen and (min-width: 425px) {
    .profile {
        margin-bottom: 12%;
    }
}

@media only screen and (min-width: 576px) {
    .exec-section h2 {
        margin-left: 10%;
        margin-bottom: 8%;
        font-size: 3em;
    }
}

@media only screen and (min-width: 700px) {
    .exec-section {
        margin-top: 15%;
    }

    .exec-section h2 {
        font-size: 3em;
    }

    .exec-section #council {
        margin-top: 10%;
    }

    .profile {
        margin-bottom: 10%;
    }
}

@media only screen and (min-width: 768px) {
    .exec-section h2 {
        margin-bottom: 7%;
    }
    .profile {
        margin-bottom: 7%;
    }
}

@media only screen and (min-width: 1024px) {
    .exec-section h2 {
        font-size: 3.8em;
        margin-left: 8%;
    }
}

@media only screen and (min-width: 1300px) {
    .exec-section {
        margin-top: 12%;
    }

    .exec-section h2 {
        margin-bottom: 5%;
    }

    .exec-section #council {
        margin-top: 7%;
    }
}

@media only screen and (min-width: 1400px) {
    .exec-section {
        margin-top: 10%;
    }

    .profile {
        margin-bottom: 5%;
    }

    .exec-section .row {
        margin-bottom: 5%;
    }
}

@media only screen and (min-width: 2000px) {
    .exec-section #council {
        margin-top: 4%;
    }

    .exec-section .profile .title small i {
        font-size: 1.5em;
    }
}