.employee-detail.section { padding-top: 70px; padding-bottom: 90px; }
.employee-detail-photo { height: 100%; min-height: 540px; background: #f4f4f4; }
.employee-detail-photo img { width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.employee-detail-card { display: flex; flex-direction: column; justify-content: center; background: var(--surface-color); }
.employee-detail-label { align-self: flex-start; margin-bottom: 20px; padding: 7px 13px; border-radius: 30px; color: var(--contrast-color); background: var(--accent-color); font-size: .8rem; font-weight: 700; }
.employee-detail-card h2 { font-size: clamp(2rem, 4vw, 3rem); margin-bottom: 10px; }
.employee-detail-job { margin-bottom: 25px; color: color-mix(in srgb, var(--default-color), transparent 30%); font-size: 1.1rem; }
.employee-detail-text { margin-bottom: 25px; line-height: 1.7; }
.employee-detail-contacts { display: grid; gap: 12px; }
.employee-detail-contacts a { display: flex; align-items: center; gap: 14px; padding: 13px 16px; color: var(--heading-color); border: 1px solid color-mix(in srgb, var(--default-color), transparent 84%); border-radius: 10px; text-decoration: none; transition: border-color .2s ease, background .2s ease; }
.employee-detail-contacts a:hover { border-color: var(--accent-color); background: color-mix(in srgb, var(--accent-color), transparent 95%); }
.employee-detail-contacts a > i { color: var(--accent-color); font-size: 1.15rem; }
.employee-detail-contacts span { display: flex; flex-direction: column; overflow-wrap: anywhere; }
.employee-detail-contacts small { color: color-mix(in srgb, var(--default-color), transparent 40%); }
.employee-detail-card .action-buttons { justify-content: flex-start; }
@media (max-width: 767.98px) { .employee-detail.section { padding-top: 50px; padding-bottom: 65px; } .employee-detail-photo { min-height: 400px; } }