/* ── Intro → grid spacing ── */
.team-page .page-intro__title {
  color: #f00600;
}

.team-page .page-intro {
  padding-bottom: var(--page-section-space);
}

/* ── Team grid ── */
.team-grid {
  padding-bottom: var(--page-section-space);
}

.team-grid__list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: var(--page-grid-gap);
  row-gap: var(--page-col-gap);
}

.team-card__media {
  overflow: hidden;
  margin-bottom: var(--page-title-gap);
  border-radius: var(--page-image-radius);
}

/* Malin Andersson — same size as others, very subtle vertical oval */
.team-card--soft-oval .team-card__media {
  width: 100%;
  margin-inline: 0;
  aspect-ratio: 4 / 5;
  border-radius: 46% / 48%;
}

.team-card--soft-oval .team-card__media img {
  width: 100%;
  height: 100%;
  border-radius: 0;
  aspect-ratio: auto;
  object-fit: cover;
}

/* Carl Arfwidson — flat bottom, semicircle top */
.team-card--arch-top .team-card__media {
  width: 100%;
  aspect-ratio: 4 / 5;
  border-radius: 50% 50% var(--page-image-radius) var(--page-image-radius) / 40% 40%
    var(--page-image-radius) var(--page-image-radius);
}

.team-card--arch-top .team-card__media img {
  width: 100%;
  height: 100%;
  border-radius: 0;
  aspect-ratio: auto;
  object-fit: cover;
}

.team-card__media .img-placeholder,
.team-card__media img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5;
  border-radius: var(--page-image-radius);
  object-fit: cover;
  transition: transform 0.55s ease;
}

.team-card:hover .team-card__media .img-placeholder,
.team-card:focus-within .team-card__media .img-placeholder,
.team-card:hover .team-card__media img,
.team-card:focus-within .team-card__media img {
  transform: scale(1.035);
}

.team-card__link {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  margin: 0 0 0.25rem;
  font-family: var(--font-team-name);
  font-size: clamp(1.0625rem, 1.5vw, 1.25rem);
  font-weight: 500;
  line-height: 1.35;
  color: var(--color-text);
  transition: color var(--transition-fast);
}

.team-card__link:hover,
.team-card__link:focus-visible {
  color: #f00600;
}

.team-card__arrow {
  width: 1.125rem;
  height: 1.125rem;
  flex-shrink: 0;
  color: var(--color-text);
}

.team-card__name {
  display: block;
  margin: 0 0 0.25rem;
  font-family: var(--font-team-name);
  font-size: clamp(1.0625rem, 1.5vw, 1.25rem);
  font-weight: 500;
  line-height: 1.35;
  color: var(--color-text);
}

.team-card__role {
  margin: 0;
  font-family: var(--font-team-role);
  font-size: 0.9375rem;
  font-weight: 400;
  line-height: var(--page-body-lh);
  color: var(--color-text-muted);
}

/* ── Related pages ── */
.team-related {
  padding-bottom: clamp(4.5rem, 9vw, 7rem);
}

.team-related__title {
  margin: 0 0 clamp(2rem, 4vw, 3rem);
  font-family: var(--font-gov-title);
  font-size: var(--page-module-title-size);
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

.team-related__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--page-grid-gap);
}

.related-card {
  display: block;
  border-radius: var(--page-card-radius);
  padding: clamp(1.125rem, 2vw, 1.375rem);
  transition: opacity var(--transition-fast);
}

.related-card:hover,
.related-card:focus-visible {
  opacity: 0.85;
}

.related-card--cyan {
  background: var(--color-related-cyan);
}

.related-card--blue {
  background: var(--color-related-blue);
}

.related-card--beige {
  background: var(--color-related-beige);
}

.related-card__media {
  overflow: hidden;
  margin-bottom: var(--page-title-gap);
}

.team-related .related-card__media,
.team-related .governance-card__media {
  border-radius: 0;
  -webkit-mask-image:
    radial-gradient(circle at 0 0, transparent var(--related-scallop-r), #000 calc(var(--related-scallop-r) + 1px)),
    radial-gradient(circle at 100% 0, transparent var(--related-scallop-r), #000 calc(var(--related-scallop-r) + 1px)),
    radial-gradient(circle at 0 100%, transparent var(--related-scallop-r), #000 calc(var(--related-scallop-r) + 1px)),
    radial-gradient(circle at 100% 100%, transparent var(--related-scallop-r), #000 calc(var(--related-scallop-r) + 1px));
  mask-image:
    radial-gradient(circle at 0 0, transparent var(--related-scallop-r), #000 calc(var(--related-scallop-r) + 1px)),
    radial-gradient(circle at 100% 0, transparent var(--related-scallop-r), #000 calc(var(--related-scallop-r) + 1px)),
    radial-gradient(circle at 0 100%, transparent var(--related-scallop-r), #000 calc(var(--related-scallop-r) + 1px)),
    radial-gradient(circle at 100% 100%, transparent var(--related-scallop-r), #000 calc(var(--related-scallop-r) + 1px));
  -webkit-mask-composite: source-in;
  mask-composite: intersect;
}

.related-card__media .img-placeholder,
.related-card__media img {
  display: block;
  width: 100%;
  aspect-ratio: var(--related-media-ratio);
  object-fit: cover;
  border-radius: 0;
  transition: transform 0.55s ease;
}

.team-related .related-card__media img,
.team-related .governance-card__media img {
  border-radius: 0;
}

.related-card:hover .related-card__media .img-placeholder,
.related-card:focus-visible .related-card__media .img-placeholder,
.related-card:hover .related-card__media img,
.related-card:focus-visible .related-card__media img {
  transform: scale(1.03);
}

.related-card__label {
  font-size: var(--page-body-size);
  font-weight: 400;
  line-height: 1.35;
  color: var(--color-text);
}

/* ── Responsive ── */
@media (max-width: 1024px) {
  .team-grid__list {
    grid-template-columns: repeat(2, 1fr);
    row-gap: var(--page-stack-gap);
  }
}

@media (max-width: 768px) {
  .team-grid__list,
  .team-related__grid {
    grid-template-columns: 1fr;
    gap: var(--page-stack-gap);
  }
}