/* GENERAL */
body {
    background-color: #f5f8fa;
    color: #2c3e50;
}

/* HEADER */
.profile-header {
    text-align: center;
    padding: 40px 20px;
    background: #ffffff;
    border-bottom: 1px solid #d9d9d9;
}

.profile-pic {
    width: 150px;
    height: 150px;
    border-radius: 100%;
    border: 4px solid #e0e0e0;
    object-fit: cover;
}

.profile-name {
    margin-top: 15px;
    font-size: 2.4rem;
    font-weight: 700;
}

.profile-role {
    color: #7b8a8b;
    font-weight: 400;
}

/* SOCIAL LINKS */
.social-links {
    margin-top: 15px;
}

.social-icon {
    margin: 0 10px;
    font-size: 1rem;
    text-decoration: none;
    color: #2980b9;
}

.social-icon:hover {
    text-decoration: underline;
}

/* CONTACT PANEL */
.contact-panel {
    display: none;
    margin: 0 auto;
    width: 260px;
    padding: 15px;
    background: #ecf0f1;
    border-radius: 8px;
    border: 1px solid #bdc3c7;
}

.contact-panel.open {
    display: block;
}

.email-link {
    margin: 5px 0;
    cursor: pointer;
    color: #2980b9;
    text-decoration: underline;
}

.clock-display {
    font-size: 0.9rem;
    color: #34495e;
}

/* ABOUT SECTION */
.about-section {
    margin-top: 40px;
    margin-bottom: 60px;
}

.about-card {
    border-radius: 10px;
    background: #ffffff;
    border: 1px solid #d0d0d0;
    padding: 20px;
}

.about-card h3 {
    margin-bottom: 15px;
}

.exp-date {
    font-size: 0.9rem;
    color: #7b8a8b;
    margin-top: -8px;
    margin-bottom: 8px;
}

.about-card ul {
    margin-left: 20px;
    margin-bottom: 20px;
}

.about-card h5 {
    margin-top: 20px;
    font-weight: 600;
}

.clearance-badge {
    display: inline-block;
    margin-top: 8px;
    padding: 4px 8px;
    background: #e9f5ff;
    color: #1b6fb2;
    border-radius: 6px;
    font-size: 0.9rem;
    font-weight: 600;
}