/* ============================================
   About Team — Block-specific override'lar
   (Layout/container/heading/grid/image frame için utility'lere bakın:
    .dm-section--white, .dm-container, .dm-heading--display, .dm-grid--4,
    .dm-img-frame--card, .dm-img-frame--zoom)
============================================ */

/* Heading — center align + bottom margin (utility default left) */
.dm-about-team__heading {
    text-align: center;
    margin: 0 0 clamp(32px, 5vh, 72px);
}

/* Team card — basit merkez-hizalı grid item (.dm-card DEĞİL, renkli bg yok) */
.dm-about-team__card {
    display: flex;
    flex-direction: column;
    text-align: center;
    gap: 4px;
    padding: 0 0 8px;
    transition: transform 0.35s ease;
}
.dm-about-team__card:hover {
    transform: translateY(-4px);
}

/* Photo wrap — img-frame utility üstüne meta (margin + hover shadow) */
.dm-about-team__photo-wrap {
    margin-bottom: 18px;
    transition: box-shadow 0.35s ease;
}
.dm-about-team__card:hover .dm-about-team__photo-wrap {
    box-shadow: var(--dm-shadow-lg);
}

/* No-photo placeholder */
.dm-about-team__photo-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(var(--dm-dark-rgb), 0.25);
    background:
        radial-gradient(ellipse at center top, rgba(var(--dm-primary-rgb), 0.12) 0%, transparent 50%),
        var(--dm-light);
}
.dm-about-team__photo-placeholder svg {
    width: 40%;
    height: auto;
    max-width: 100px;
}

/* Member meta tipografi */
.dm-about-team__name {
    font-family: var(--dm-font-heading);
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.01em;
    color: var(--dm-dark);
    text-transform: uppercase;
    margin: 0;
    line-height: 1.2;
}
.dm-about-team__location,
.dm-about-team__role {
    font-family: var(--dm-font-body);
    font-size: 13px;
    font-weight: 400;
    color: var(--dm-muted);
    margin: 2px 0 0;
    line-height: 1.3;
}
.dm-about-team__location { margin-top: 4px; }

/* Responsive — mobil'de grid'i 360px ile sınırla (.dm-grid--4 zaten 1fr'e düşüyor) */
@media (max-width: 480px) {
    .dm-about-team__grid {
        max-width: 360px;
        margin: 0 auto;
    }
}
