.team-card .avatar { width: 92px; height: 92px; border-radius: 50%; background: var(--grad-mark); padding: 3px; margin-block-end: 18px; }
.team-card .avatar span { display: grid; place-items: center; width: 100%; height: 100%; border-radius: inherit; background: #10172d; font-weight: 700; }
.map-card iframe { width: 100%; min-height: 360px; border: 0; border-radius: var(--radius-lg); filter: grayscale(.2) invert(.88) hue-rotate(180deg); }
.map-visual { display: block; position: relative; border-radius: var(--radius-lg); overflow: hidden; border: 1px solid rgba(58, 122, 254, 0.25); transition: border-color .25s ease, transform .25s ease; }
.map-visual img { display: block; width: 100%; height: auto; }
.map-visual .map-open-hint { position: absolute; right: 16px; bottom: 14px; padding: 6px 14px; border-radius: 999px; font-size: 0.8rem; letter-spacing: 0.04em; color: #E2E6F0; background: rgba(8, 16, 32, 0.75); border: 1px solid rgba(34, 211, 238, 0.4); opacity: 0; transform: translateY(4px); transition: opacity .25s ease, transform .25s ease; }
.map-visual:hover { border-color: rgba(34, 211, 238, 0.55); }
.map-visual:hover .map-open-hint, .map-visual:focus-visible .map-open-hint { opacity: 1; transform: translateY(0); }
.story-visual { position: relative; border-radius: var(--radius-lg); overflow: hidden; border: 1px solid rgba(58, 122, 254, 0.28); box-shadow: 0 24px 60px -28px rgba(13, 71, 255, 0.55); min-height: 340px; }
.story-visual img { display: block; width: 100%; height: 100%; object-fit: cover; }
.story-visual::after { content: ""; position: absolute; inset: 0; pointer-events: none; box-shadow: inset 0 0 80px -20px rgba(34, 211, 238, 0.35); border-radius: inherit; }

/* The idea behind the mark */
.mark-idea { position: relative; }
.mark-idea .mark-idea-lead { max-width: 720px; margin: 16px 0 0; color: #A9B2C9; font-size: 1.05rem; line-height: 1.65; }
.mark-strip { margin: 44px auto 0; max-width: 1180px; padding: 34px 34px 40px; background: #050B1E; border: 1px solid rgba(58, 122, 254, 0.18); border-radius: 4px; box-shadow: 0 30px 80px -42px rgba(13, 71, 255, 0.7); }
.mark-strip-title { display: flex; align-items: center; gap: 18px; justify-content: center; margin-bottom: 34px; }
.mark-strip-title::before, .mark-strip-title::after { content: ""; flex: 0 0 72px; height: 1px; background: rgba(148, 163, 200, 0.45); }
.mark-strip-title span { font-family: "Space Grotesk", sans-serif; font-size: 0.82rem; font-weight: 600; letter-spacing: 0.32em; color: #DCE3F5; white-space: nowrap; }
.mark-strip-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.mark-item { flex: 1 1 0; min-width: 0; text-align: center; }
.mark-icon { display: grid; place-items: center; height: 88px; margin-bottom: 16px; }
.mark-icon svg { height: 74px; width: auto; max-width: 100%; }
.mark-item strong { display: block; font-family: "Space Grotesk", sans-serif; font-size: 0.78rem; font-weight: 600; letter-spacing: 0.14em; color: #EDF1FB; margin-bottom: 8px; }
.mark-item span { display: block; font-size: 0.76rem; line-height: 1.55; color: #97A1BC; max-width: 150px; margin-inline: auto; }
.mark-op { flex: 0 0 auto; align-self: flex-start; margin-top: 26px; font-family: "Space Grotesk", sans-serif; font-size: 1.7rem; font-weight: 300; color: #A9B4D4; }
.mark-final img { display: block; width: 100%; max-width: 190px; height: auto; border-radius: 6px; margin: -8px auto 12px; }
@media (max-width: 960px) {
  .mark-strip { padding: 26px 20px 32px; }
  .mark-strip-row { flex-wrap: wrap; justify-content: center; row-gap: 28px; }
  .mark-item { flex: 0 0 40%; }
  .mark-op { margin-top: 34px; }
  .mark-final { flex-basis: 100%; }
}
@media (max-width: 560px) {
  .mark-item { flex: 0 0 100%; }
  .mark-op { display: none; }
  .mark-strip-title::before, .mark-strip-title::after { flex-basis: 34px; }
}