/**
 * Team Card v2.1
 *
 * @package FIGORA_One
 */

/*--------------------------------------------------------------
# Team Section
--------------------------------------------------------------*/

.section-team{
	padding:6rem 0;
	background:var(--color-bg);
}

.team-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
	gap:2.5rem;
	align-items:stretch;
	margin-top:4rem;
}

/*--------------------------------------------------------------
# Card
--------------------------------------------------------------*/

.team-card{
	height:100%;
}

.team-card__inner{
	display:flex;
	flex-direction:column;
	align-items:center;

	height:100%;

	padding:2.5rem;

	background:var(--color-surface);

	border:1px solid var(--color-border);
	border-radius:24px;

	box-shadow:var(--shadow-md);

	text-align:center;

	transition:
		transform var(--transition),
		box-shadow var(--transition),
		border-color var(--transition);
}

.team-card__inner:hover,
.team-card__inner:focus-within{

	transform:translateY(-10px);

	border-color:var(--color-primary);

	box-shadow:var(--shadow-xl);
}

/*--------------------------------------------------------------
# Image
--------------------------------------------------------------*/

.team-card__image{
	margin-bottom:2rem;
}

.team-card__image img{
	display:block;

	width:180px;
	height:180px;

	object-fit:cover;

	border-radius:50%;

	border:6px solid var(--color-white);

	box-shadow:0 12px 35px rgba(15,23,42,.15);
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/

.team-card__content{
	display:flex;
	flex-direction:column;
	flex:1;
	width:100%;
}

.team-card__header{
	margin-bottom:1rem;
}

.team-card__name{
	margin:0;

	font-size:1.6rem;
	font-weight:700;
	line-height:1.3;

	color:var(--color-heading);
}

.team-card__designation{
	margin:.75rem 0 .35rem;

	font-size:1rem;
	font-weight:600;

	color:var(--color-primary);
}

.team-card__department{
	margin:0;

	font-size:.95rem;

	color:var(--color-muted);
}

/*--------------------------------------------------------------
# Biography
--------------------------------------------------------------*/

.team-card__bio{
	max-width:30ch;

	margin:1.75rem auto;

	font-size:.96rem;
	line-height:1.85;

	color:var(--color-text);

	text-align:center;
}

.team-card__bio p{
	margin:0;
}

/*--------------------------------------------------------------
# Contact
--------------------------------------------------------------*/

.team-card__contact{
	display:flex;
	justify-content:center;
	flex-wrap:wrap;

	gap:.75rem;

	margin-bottom:1.75rem;
}

.team-card__button{
	display:inline-flex;
	align-items:center;
	justify-content:center;

	min-height:44px;

	gap:.5rem;

	padding:.75rem 1.2rem;

	background:#f1f5f9;

	color:var(--color-heading);

	border-radius:999px;

	font-size:.9rem;
	font-weight:600;

	text-decoration:none;

	transition:
		background var(--transition),
		color var(--transition),
		transform var(--transition);
}

.team-card__button:hover{
	background:var(--color-primary);
	color:var(--color-white);

	transform:translateY(-2px);
}

/*--------------------------------------------------------------
# Social
--------------------------------------------------------------*/

.team-card__social{
	display:flex;
	justify-content:center;

	gap:.75rem;

	margin-top:auto;
}

.team-card__social a{
	display:flex;
	align-items:center;
	justify-content:center;

	width:44px;
	height:44px;

	background:var(--color-heading);

	color:var(--color-white);

	border-radius:50%;

	text-decoration:none;

	transition:
		background var(--transition),
		transform var(--transition);
}

.team-card__social a:hover{
	background:var(--color-primary);

	transform:translateY(-3px);
}

/*--------------------------------------------------------------
# Responsive
--------------------------------------------------------------*/

@media (max-width:991px){

	.team-grid{
		grid-template-columns:repeat(2,1fr);
	}

}

@media (max-width:767px){

	.section-team{
		padding:4rem 0;
	}

	.team-grid{
		grid-template-columns:1fr;
		gap:2rem;
	}

	.team-card__inner{
		padding:2rem;
	}

	.team-card__image img{
		width:150px;
		height:150px;
	}

	.team-card__name{
		font-size:1.35rem;
	}

}