/* Team Page Specific Styles */

/* Page Hero Section (re-using styles from portfolio.css for consistency) */
.page-hero-section {
    padding-top: var(--spacing-6xl);
    /* pt-32 */
    padding-bottom: var(--spacing-2xl);
    /* pb-16 */
    background-color: var(--color-surface-light);
    border-bottom: 1px solid var(--color-border-light);
}

.page-title {
    font-size: clamp(3rem, 6vw, 4.5rem);
    font-weight: 600;
    letter-spacing: -0.025em;
    color: var(--color-dark-charcoal);
    line-height: 1.1;
    margin-bottom: var(--spacing-md);
}

/* Team Grid Section */
.team-grid-section {
    background-color: var(--color-white);
}

.team-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--spacing-2xl);
}

@media (min-width: 768px) {
    .team-grid {
        grid-template-columns: repeat(2, 1fr);
        /* md:grid-cols-2 */
        gap: var(--spacing-2xl);
        /* md:gap-8 */
    }
}

@media (min-width: 1024px) {
    .team-grid {
        grid-template-columns: repeat(4, 1fr);
        /* lg:grid-cols-4 */
        gap: var(--spacing-3xl);
        /* lg:gap-12 */
    }
}

.team-member-card {
    background-color: var(--color-white);
    /* Ensure it's not transparent */
    border-radius: 0.5rem;
    /* Optional: rounded corners */
    color: var(--color-dark-charcoal);
    /* Ensure text color is dark by default */
    /* No explicit border or shadow from original, keeping it simple */
}

.team-member-image-wrapper {
    margin-bottom: var(--spacing-lg);
    border-radius: 0.5rem;
    /* rounded-lg */
    aspect-ratio: 4 / 5;
    /* For portrait images */
    overflow: hidden;
    /* Ensure rounded corners */
}

.team-member-name {
    font-size: 1.125rem;
    /* text-lg */
    font-weight: 600;
    /* font-semibold */
    color: var(--color-dark-charcoal);
    /* Explicitly set color */
    margin-bottom: var(--spacing-xs);
}

.team-member-role {
    font-size: 0.8125rem;
    /* text-[13px] */
    color: var(--color-accent-orange);
    font-weight: 500;
    /* font-medium */
    margin-bottom: var(--spacing-md);
}

.team-member-bio {
    font-size: 0.875rem;
    /* text-[14px] */
    color: var(--color-slate-600);
    font-weight: 300;
    /* font-light */
    line-height: 1.6;
    /* leading-relaxed */
}