/* =========================================================
   ARTÍCULOS
   Blanca Sosa World Lawyer
========================================================= */

.bs-articles {

	position:
		relative;

	padding:
		88px 0 96px;

	background:
		var(--bs-cream);
}


/* =========================================================
   HEADING
========================================================= */

.bs-articles__heading {

	margin-bottom:
		42px;
}


.bs-articles__eyebrow {

	display:
		inline-block;

	margin-bottom:
		8px;

	color:
		var(--bs-gold);

	font-size:
		0.78rem;

	font-weight:
		700;

	text-transform:
		uppercase;

	letter-spacing:
		0.18em;
}


.bs-articles__title {

	margin:
		0;

	color:
		var(--bs-navy);

	font-family:
		var(--bs-font-title);

	font-size:
		clamp(2.6rem, 4vw, 4rem);

	line-height:
		1;

	letter-spacing:
		-0.025em;
}


/* =========================================================
   GRID
========================================================= */

.bs-articles__grid {

	display:
		grid;

	grid-template-columns:
		repeat(3, minmax(0, 1fr));

	gap:
		26px;
}


/* =========================================================
   CARD
========================================================= */

.bs-article-card {

	display:
		flex;

	flex-direction:
		column;

	min-width:
		0;

	background:
		transparent;
}


/* =========================================================
   IMAGE
========================================================= */

.bs-article-card__image {

	position:
		relative;

	display:
		block;

	aspect-ratio:
		16 / 10;

	margin-bottom:
		20px;

	border-radius:
		12px;

	overflow:
		hidden;

	background:
		var(--bs-navy);
}


.bs-article-card__image img {

	width:
		100%;

	height:
		100%;

	object-fit:
		cover;

	transition:
		transform 500ms ease;
}


.bs-article-card:hover
.bs-article-card__image img {

	transform:
		scale(1.045);
}


/* Placeholder
========================================================= */

.bs-article-card__image-placeholder {

	width:
		100%;

	height:
		100%;

	display:
		flex;

	align-items:
		center;

	justify-content:
		center;

	background:
		linear-gradient(
			135deg,
			var(--bs-navy-dark),
			var(--bs-navy-light)
		);

	color:
		rgba(255, 255, 255, 0.62);
}


.bs-article-card__image-placeholder span {

	font-family:
		var(--bs-font-title);

	font-size:
		1.6rem;
}


/* =========================================================
   CONTENT
========================================================= */

.bs-article-card__content {

	display:
		flex;

	flex-direction:
		column;

	flex:
		1;
}


/* Meta
========================================================= */

.bs-article-card__meta {

	margin-bottom:
		8px;

	color:
		var(--bs-text-muted);

	font-size:
		0.78rem;

	text-transform:
		lowercase;
}


/* Title
========================================================= */

.bs-article-card__title {

	margin:
		0 0 12px;

	color:
		var(--bs-navy);

	font-size:
		clamp(1.15rem, 1.6vw, 1.35rem);

	font-weight:
		800;

	line-height:
		1.16;
}


.bs-article-card__title a {

	color:
		inherit;
}


.bs-article-card__title a:hover {

	color:
		var(--bs-gold);
}


/* Excerpt
========================================================= */

.bs-article-card__excerpt {

	margin-bottom:
		18px;

	color:
		var(--bs-text-dark);

	font-size:
		0.92rem;

	line-height:
		1.5;
}


.bs-article-card__excerpt p {

	margin:
		0;
}


/* Link
========================================================= */

.bs-article-card__link {

	display:
		inline-flex;

	align-items:
		center;

	gap:
		8px;

	margin-top:
		auto;

	color:
		var(--bs-navy);

	font-size:
		0.82rem;

	font-weight:
		800;

	text-transform:
		uppercase;

	letter-spacing:
		0.05em;
}


.bs-article-card__link span {

	transition:
		transform var(--bs-transition);
}


.bs-article-card__link:hover {

	color:
		var(--bs-gold);
}


.bs-article-card__link:hover span {

	transform:
		translateX(4px);
}


/* =========================================================
   FOOTER
========================================================= */

.bs-articles__footer {

	display:
		flex;

	justify-content:
		flex-end;

	margin-top:
		42px;
}


.bs-articles__all {

	display:
		inline-flex;

	align-items:
		center;

	gap:
		10px;

	padding-bottom:
		5px;

	border-bottom:
		1px solid rgba(25, 55, 95, 0.35);

	color:
		var(--bs-navy);

	font-size:
		0.84rem;

	font-weight:
		800;

	text-transform:
		uppercase;

	letter-spacing:
		0.06em;
}


.bs-articles__all span {

	transition:
		transform var(--bs-transition);
}


.bs-articles__all:hover {

	color:
		var(--bs-gold);

	border-color:
		var(--bs-gold);
}


.bs-articles__all:hover span {

	transform:
		translateX(4px);
}


/* =========================================================
   EMPTY
========================================================= */

.bs-articles__empty {

	padding:
		42px;

	border:
		1px solid var(--bs-border);

	background:
		rgba(255, 255, 255, 0.4);
}


.bs-articles__empty p {

	margin:
		0;

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