/* ==========================================================
   CARXIS ARTICLE — STANDARD ARTICLE CARD
========================================================== */


/* ----------------------------------------------------------
   Card
---------------------------------------------------------- */

.carxis-article-card{
	display:flex;
	flex-direction:column;

	width:100%;
	min-width:0;
	height:100%;

	background:#fff;

	border:1px solid #e8e8e8;
	border-radius:16px;

	overflow:hidden;

	box-shadow:0 6px 20px rgba(0, 0, 0, .06);

	transition:
		transform .25s ease,
		box-shadow .25s ease,
		border-color .25s ease;
}


.carxis-article-card:hover{
	transform:translateY(-3px);

	border-color:rgba(209, 0, 31, .18);

	box-shadow:0 14px 32px rgba(0, 0, 0, .10);
}


/* ----------------------------------------------------------
   Image
---------------------------------------------------------- */

.carxis-article-card-image{
	position:relative;

	display:block;

	width:100%;
	aspect-ratio:16 / 9;

	overflow:hidden;

	background:#f3f3f3;

	text-decoration:none;
}


.carxis-article-card-image img{
	display:block;

	width:100%;
	height:100%;

	object-fit:cover;

	transition:transform .35s ease;
}


.carxis-article-card:hover
.carxis-article-card-image img{
	transform:scale(1.03);
}


/* ----------------------------------------------------------
   Image Placeholder
---------------------------------------------------------- */

.carxis-article-card-placeholder{
	display:flex;
	align-items:center;
	justify-content:center;

	width:100%;
	height:100%;

	color:#d1001f;

	background:
		linear-gradient(
			135deg,
			#fafafa 0%,
			#f1f1f1 100%
		);
}


.carxis-article-card-placeholder-icon{
	display:flex;
	align-items:center;
	justify-content:center;

	width:56px;
	height:56px;

	font-size:26px;
	line-height:1;

	background:#fff;

	border-radius:14px;

	box-shadow:0 6px 18px rgba(0, 0, 0, .08);
}


/* ----------------------------------------------------------
   Card Body
---------------------------------------------------------- */

.carxis-article-card-body{
	display:flex;
	flex:1;
	flex-direction:column;

	min-width:0;

	padding:20px;
}


/* ----------------------------------------------------------
   Category
---------------------------------------------------------- */

.carxis-article-card-category{
	align-self:flex-start;

	display:inline-flex;
	align-items:center;

	margin:0 0 10px;
	padding:5px 10px;

	color:#d1001f;
	background:#fff1f3;

	font-size:11px;
	font-weight:700;
	line-height:1.4;

	letter-spacing:.03em;
	text-transform:uppercase;

	border-radius:999px;
}


/* ----------------------------------------------------------
   Title
---------------------------------------------------------- */

.carxis-article-card-title{
	margin:0 0 10px;

	color:#222;

	font-size:19px;
	font-weight:700;
	line-height:1.4;
}


.carxis-article-card-title a{
	color:inherit;

	text-decoration:none;

	transition:color .2s ease;
}


.carxis-article-card-title a:hover{
	color:#d1001f;
}


.carxis-article-card-title a:focus-visible{
	outline:3px solid rgba(209, 0, 31, .20);
	outline-offset:3px;

	border-radius:3px;
}


/* ----------------------------------------------------------
   Excerpt
---------------------------------------------------------- */

.carxis-article-card-excerpt{
	margin:0 0 16px;

	color:#666;

	font-size:14px;
	line-height:1.65;
}


/* ----------------------------------------------------------
   Footer
---------------------------------------------------------- */

.carxis-article-card-footer{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:12px;

	margin-top:auto;
	padding-top:14px;

	border-top:1px solid #eeeeee;
}


/* ----------------------------------------------------------
   Date
---------------------------------------------------------- */

.carxis-article-card-date{
	color:#888;

	font-size:12px;
	line-height:1.5;
}


/* ----------------------------------------------------------
   Read More
---------------------------------------------------------- */

.carxis-article-card-readmore{
	display:inline-flex;
	align-items:center;
	gap:5px;

	color:#d1001f;

	font-size:13px;
	font-weight:700;
	line-height:1.4;

	text-decoration:none;

	white-space:nowrap;
}


.carxis-article-card-readmore span{
	transition:transform .2s ease;
}


.carxis-article-card-readmore:hover span{
	transform:translateX(3px);
}


/* ----------------------------------------------------------
   Tablet
---------------------------------------------------------- */

@media (max-width:900px){

	.carxis-article-card-body{
		padding:18px;
	}

	.carxis-article-card-title{
		font-size:18px;
	}

}


/* ----------------------------------------------------------
   Mobile
---------------------------------------------------------- */

@media (max-width:600px){

	.carxis-article-card{
		border-radius:14px;
	}

	.carxis-article-card-body{
		padding:16px;
	}

	.carxis-article-card-title{
		font-size:17px;
		line-height:1.4;
	}

	.carxis-article-card-excerpt{
		font-size:14px;
	}

	.carxis-article-card-footer{
		padding-top:12px;
	}

}


/* ----------------------------------------------------------
   Reduced Motion
---------------------------------------------------------- */

@media (prefers-reduced-motion:reduce){

	.carxis-article-card,
	.carxis-article-card-image img,
	.carxis-article-card-title a,
	.carxis-article-card-readmore span{
		transition:none;
	}

	.carxis-article-card:hover{
		transform:none;
	}

	.carxis-article-card:hover
	.carxis-article-card-image img{
		transform:none;
	}

}