/* Team */
.bel-team { position: relative; }
.bel-team--carousel { background: linear-gradient(to bottom, var(--bel-bg) 0 46%, var(--bel-dark) 46%); }
.bel-team--carousel::after { content: ""; position: absolute; inset: 46% 0 0; background-image: var(--bel-tex-dark); pointer-events: none; }
.bel-team > .bel-container { position: relative; z-index: 1; }
.bel-team__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 24px 40px; margin-bottom: 48px; }
.bel-team__head .bel-heading { margin-bottom: 0; }

.bel-team__track { display: flex; gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.bel-team__track::-webkit-scrollbar { display: none; }
.bel-team__track > .bel-team-card { flex: 0 0 calc((100% - 48px) / 3); scroll-snap-align: start; }
.bel-team__nav { display: flex; justify-content: center; gap: 30px; margin-top: 56px; }
.bel-team__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; }

.bel-team-card { position: relative; overflow: hidden; aspect-ratio: 413 / 560; background-color: var(--bel-dark-2); background-image: var(--bel-tex-dark); }
.bel-team-card__photo, .bel-team-card__photo img, .bel-team-card__photo .bel-ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.bel-team-card__photo img { transition: transform .8s var(--bel-ease); }
.bel-team-card:hover .bel-team-card__photo img { transform: scale(1.05); }
.bel-team-card__band { position: absolute; left: 0; right: 0; bottom: 0; padding: 30px 20px 32px; background: rgba(30, 30, 30, .82); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); color: #fff; text-align: center; transition: background-color .35s; }
.bel-team-card__name { margin: 0 0 6px; color: #fff; font-size: clamp(1.35rem, 2vw, 1.75rem); }
.bel-team-card__name a { color: inherit; }
.bel-team-card__role { margin: 0; color: rgba(255, 255, 255, .85); font-size: 15.5px; }
.bel-team-card__social { display: flex; justify-content: center; gap: 8px; max-height: 0; margin: 0; overflow: hidden; opacity: 0; transition: max-height .4s var(--bel-ease), opacity .3s, margin .4s; }
.bel-team-card__social a { display: grid; place-items: center; width: 34px; height: 34px; background: var(--bel-accent); color: var(--bel-on-accent); }
.bel-team-card__social a:hover { background: #fff; color: var(--bel-dark); }
.bel-team-card__social .bel-icon { width: 16px; height: 16px; }
.bel-team-card:hover .bel-team-card__social, .bel-team-card:focus-within .bel-team-card__social { max-height: 40px; margin-bottom: 16px; opacity: 1; }
.bel-team-card:hover .bel-team-card__name { color: var(--bel-accent); }

@media (max-width: 1024px) {
	.bel-team__track > .bel-team-card { flex-basis: calc((100% - 24px) / 2); }
	.bel-team__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
	.bel-team__track > .bel-team-card { flex-basis: 86%; }
	.bel-team__grid { grid-template-columns: 1fr; }
	.bel-team--carousel { background: linear-gradient(to bottom, var(--bel-bg) 0 30%, var(--bel-dark) 30%); }
	.bel-team--carousel::after { top: 30%; }
}