/* Inherit root variables from styles.css */
:root {
    --red: #e11b1b;
    --black: #0b0b0b;
    --white: #ffffff;
    --light-gray: #f8f8f8;
}

body {
    padding-top: 50px; 
}

/* --- Contact Page Header --- */
.register-hero-unit {
    background: linear-gradient(rgba(11, 11, 11, 0.85), rgba(11, 11, 11, 0.85)), url('images/team card.jpg') no-repeat center center;
    background-size: cover;
    padding: 100px 0;
    color: var(--white); 
}
.register-hero-title {
    font-size: clamp(2.5rem, 6vw, 4.5rem);
    font-weight: 800;
    color: var(--white) !important; 
    text-shadow: 0 2px 8px rgba(0,0,0,0.5); 
}
.register-hero-sub {
    font-size: 1.25rem;
    color: var(--light-gray);
    max-width: 700px;
    margin: 1rem auto 0;
    opacity: 0.9;
}
/* --- End of Header --- */

/* --- Contact Card Styling --- */
.contact-card {
    background-color: var(--white);
    border: 1px solid #eee;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.contact-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(0,0,0,0.12);
}

.contact-name {
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 1.25rem;
    color: var(--black);
}

.contact-role {
    font-size: 0.95rem;
}

.contact-email-btn {
    font-weight: 600;
}

/* --- How to Reach Section --- */
.map-placeholder {
    border: 1px solid rgba(0,0,0,0.08);
}
.map-placeholder iframe {
    border-radius: 10px;
    height: 450px;
}

.accordion-item {
    border: 1px solid #ddd;
    border-radius: 8px !important;
    margin-bottom: 1rem;
    overflow: hidden;
}

.accordion-header {
    margin: 0;
}

.accordion-button {
    font-family: 'Poppins', sans-serif;
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--black);
    background-color: var(--white);
    box-shadow: none;
}

.accordion-button:not(.collapsed) {
    color: var(--red);
    background-color: #fdfdfd;
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.125);
}

.accordion-button:focus {
    box-shadow: 0 0 0 0.25rem rgba(225, 27, 27, 0.15);
    border-color: var(--red);
}

.accordion-button i {
    transition: transform 0.3s ease;
}

.accordion-button:not(.collapsed) i {
    transform: rotate(90deg);
}

.accordion-body {
    font-size: 1rem;
    line-height: 1.6;
}

.accordion-body ul {
    list-style-type: disc;
    padding-left: 20px;
}