/* ============================================================
   TAKEAWAY — Team
   ============================================================ */

#team {
  display: flex;
  width: 100%;
  max-width: 1728px;
  height: 1024px;
  padding: 128px 64px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  margin: 0 auto;
  background: var(--c-bg);
}

.team-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.team-label {
  font-family: var(--font);
  font-size: var(--text-body-md);
  font-weight: var(--fw-regular);
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  color: var(--c-label);
  line-height: var(--lh-body-sm);
  text-align: center;
  margin-bottom: var(--sp-md);
}

.team-members {
  display: flex;
  align-items: stretch;
  width: 100%;
}

.team-member {
  display: flex;
  padding: 48px 80px 80px 80px;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 128px;
  flex: 1 0 0;
  border-left: 1px solid var(--c-border);
}

.team-member:first-child { border-left: none; }

.team-member-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-md);
}

.team-member-name {
  font-family: var(--font);
  font-size: var(--text-h4);
  font-weight: var(--fw-regular);
  line-height: var(--lh-h4);
  letter-spacing: var(--ls-body);
  color: var(--c-text);
  text-align: center;
  white-space: nowrap;
}

.team-member-role {
  font-family: var(--font);
  font-size: var(--text-body-lg);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body-lg);
  letter-spacing: var(--ls-md);
  color: var(--c-text);
  text-align: center;
  white-space: nowrap;
}

.team-member-social {
  display: flex;
  gap: var(--sp-lg);
  justify-content: center;
}

.team-member-social a {
  font-family: var(--font);
  font-size: var(--text-body-sm);
  font-weight: var(--fw-regular);
  line-height: var(--lh-body-sm);
  letter-spacing: var(--ls-md);
  color: var(--c-text);
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: none;
  text-decoration-thickness: 1.5%;
  text-underline-offset: 25%;
  text-underline-position: from-font;
  transition: opacity 0.2s;
}

.team-member-social a:hover { opacity: 0.6; }

/* ── Responsive ── */
@media (max-width: 1200px) {
  #team { height: auto; padding: 112px 40px; }
  .team-member { padding: 48px 24px 40px; gap: 0; justify-content: space-between; min-height: 320px; }
  .team-member-info { gap: var(--sp-md); }
  .team-member-name { font-size: var(--text-h4); line-height: var(--lh-h4); }
  .team-member-role { font-size: var(--text-body-lg); }
}

@media (max-width: 768px) {
  #team { height: auto; min-height: unset; padding: 112px 20px; justify-content: center; align-items: center; }
  .team-block { gap: var(--sp-md); width: 100%; }
  .team-members { flex-direction: column; width: 100%; gap: 0; }
  .team-member { height: auto; min-height: unset; padding: 48px 0; align-items: center; justify-content: flex-start; gap: var(--sp-lg); border-left: none; border-top: 1px solid var(--c-border); flex: unset; width: 100%; }
  .team-member:first-child { border-top: none; padding-top: 0; }
  .team-member-info { gap: var(--sp-md); }
  .team-member-name { font-size: var(--text-h4); line-height: var(--lh-h4); white-space: normal; text-align: center; }
  .team-member-role { font-size: var(--text-body-lg); line-height: var(--lh-body-lg); white-space: normal; }
  .team-member-social a { font-size: var(--text-body-sm); }
}
