/* =========================
   Team Subpage – UI
   ========================= */

.team-page{
  background:
    radial-gradient(900px 460px at 18% 0%, rgba(255,106,0,.26), transparent 62%),
    radial-gradient(720px 420px at 86% 24%, rgba(255,255,255,.24), transparent 70%),
    linear-gradient(180deg, #0f131b 0%, #151b26 42%, #efe7da 100%);
}

.team-stage{
  padding-top: 52px;
}

.team-split-panel{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  border:1px solid rgba(255,255,255,.14);
  border-radius: var(--radius2);
  overflow:hidden;
  box-shadow: var(--shadow);
  background: linear-gradient(102deg, rgba(10,14,22,.92) 0 50%, rgba(246,238,224,.96) 50% 100%);
}

.team-copy{
  padding: clamp(22px, 3vw, 34px);
}
.team-copy .badge{
  margin-bottom: 14px;
}
.team-copy h1{
  margin:0 0 10px;
  font-size: clamp(32px, 4vw, 48px);
  line-height:1.08;
  letter-spacing:-0.02em;
}
.team-copy .lead{
  margin:0;
  max-width: 38ch;
  color: rgba(232,237,246,.86);
}

.team-actions{
  margin-top: 18px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.team-actions .btn-ghost{
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.20);
}

.team-image-wrap{
  padding: clamp(22px, 3vw, 34px);
  color:#19202c;
  display:grid;
  gap:12px;
  align-content:start;
}
.team-figure{
  margin:0;
  border-radius: 18px;
  overflow:hidden;
  border:1px solid rgba(21,28,38,.18);
  background: rgba(255,255,255,.76);
}
.team-figure img{
  width:100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}
.team-figure figcaption{
  padding:10px 12px;
  font-size: 13px;
  line-height:1.4;
  color:#1f2532;
  background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(247,240,229,.86));
}
.team-note{
  margin:0;
  color:#2d3442;
  font-size: 14px;
}

.team-portraits{
  padding-top: 44px;
}
.portrait-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:14px;
}
.portrait-card{
  border:1px solid rgba(255,255,255,.14);
  background: linear-gradient(160deg, rgba(16,21,31,.9), rgba(28,35,48,.7));
  border-radius: 18px;
  overflow:hidden;
}
.portrait-media{
  margin:0;
  min-height: 180px;
  display:grid;
  place-items:center;
  border-bottom:1px solid rgba(255,255,255,.14);
  background:
    radial-gradient(circle at 50% 25%, rgba(255,255,255,.22), transparent 58%),
    linear-gradient(135deg, rgba(255,106,0,.4), rgba(255,255,255,.08));
}
.portrait-media span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width: 132px;
  padding: 8px 12px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.20);
  background: rgba(15,20,29,.58);
  color: rgba(232,237,246,.92);
  font-size: 12px;
  font-weight:700;
  letter-spacing:.03em;
  text-transform: uppercase;
}
.portrait-body{
  padding: 14px;
}
.portrait-body h3{
  margin:0 0 8px;
  font-size: 20px;
}
.portrait-body p{
  margin:0;
  color: rgba(232,237,246,.84);
}

.team-page .section-alt{
  background: linear-gradient(180deg, rgba(255,255,255,.34), rgba(248,239,223,.40));
  border-top:1px solid rgba(255,255,255,.44);
  border-bottom:1px solid rgba(29,37,52,.15);
}
.team-page .section-head .muted{
  color:#4a5364;
}

.team-card-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:14px;
}
.team-member{
  border:1px solid rgba(36,47,62,.16);
  background: linear-gradient(170deg, rgba(255,255,255,.94), rgba(246,238,224,.86));
  color:#151a24;
  border-radius: 18px;
  padding: 16px;
}
.team-member h3{
  margin:0;
  font-size: 22px;
}
.team-member p{
  margin:0;
  color:#2f3849;
}
.role-tag{
  margin-top: 8px !important;
  padding: 7px 10px;
  border-radius: 999px;
  width: fit-content;
  border:1px solid rgba(255,106,0,.35);
  background: rgba(255,106,0,.13);
  color:#532f11 !important;
  font-size: 12px;
  font-weight:700;
}
.team-member p:last-child{
  margin-top: 10px;
}

.team-values{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:14px;
}
.value-card{
  border:1px solid rgba(255,255,255,.14);
  background: linear-gradient(145deg, rgba(16,20,30,.88), rgba(28,36,49,.68));
  border-radius: 18px;
  padding: 16px;
}
.value-card h3{
  margin:0 0 8px;
  font-size: 20px;
}
.value-card p{
  margin:0;
  color: rgba(232,237,246,.84);
}

.team-page .footer{
  background: rgba(14,18,25,.80);
}

@media (max-width: 980px){
  .team-split-panel{
    grid-template-columns: 1fr;
    background: linear-gradient(180deg, rgba(10,14,22,.92) 0 56%, rgba(246,238,224,.96) 56% 100%);
  }
  .portrait-grid{
    grid-template-columns: 1fr 1fr;
  }
  .team-card-grid{
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 760px){
  .team-stage{
    padding-top: 34px;
  }
  .team-copy,
  .team-image-wrap{
    padding: 20px;
  }
  .portrait-grid,
  .team-card-grid,
  .team-values{
    grid-template-columns: 1fr;
  }
}