.Post--item {
	position:relative;
	min-width:370px;
	max-width:470px;
	min-height:100%;
	display:flex;
	flex:1;
	flex-direction:column;
	overflow:hidden;
	border:var(--border);
	border-radius:var(--largeradius);
	background:var(--surface-color);
	box-shadow:var(--box-shadow-defult);
	cursor:pointer;
	transition:
		transform .35s ease,
		box-shadow .35s ease,
		border-color .35s ease;
}

.-Po-Thumb {
	position:relative;
	height:250px;
	display:flex;
	align-items:center;
	justify-content:center;
	overflow:hidden;
	border-radius:var(--largeradius) var(--largeradius) 0 0;
	background:var(--media-placeholder);
}

.-Po-Thumb img {
	max-width:100%;
	display:block;
	object-position:center;
	transition:transform .45s ease;
}

.-Po-Info {
	min-width:0;
	display:flex;
	flex:1;
	flex-direction:column;
	align-items:flex-start;
	padding:28px 24px 26px;
}

.post-card-meta {
	width:100%;
	min-width:0;
	display:flex;
	align-items:center;
	flex-wrap:wrap;
	gap:10px 14px;
	margin-bottom:14px;
}

.post-meta-item {
	min-width:0;
	max-width:100%;
	display:inline-flex;
	align-items:center;
	gap:8px;
}

.city-initem {
	position:relative;
}

.city-initem::after {
	content:"";
	flex:0 0 1px;
	width:1px;
	height:14px;
	display:block;
	margin-inline-start:6px;
	background:var(--diver);
}

.post-meta-icon {
	width:18px;
	height:18px;
	display:inline-flex;
	flex:0 0 18px;
	align-items:center;
	justify-content:center;
	color:var(--secondarytext);
	font-size:14px;
}

.post-meta-value {
	min-width:0;
	max-width:100%;
	color:var(--primary-text);
	font-size:14px;
	font-weight:600;
	line-height:1.5;
	text-decoration:none;
	overflow-wrap:anywhere;
}

.city-initem .post-meta-icon,
.city-initem .post-meta-value {
	color:var(--uicolor);
}

.post-date .post-meta-value {
	color:var(--secondarytext);
	direction:ltr;
	unicode-bidi:isolate;
}

.sile-otm-con {
	width:100%;
	min-width:0;
	margin-bottom:9px;
}

.posts_title {
	margin:0;
	font-size:18px;
	font-weight:500;
	line-height:1.6;
	overflow-wrap:anywhere;
}

.posts_title a {
	color:var(--primary-text);
	text-decoration:none;
	transition:color .3s ease;
}

.post-excerpt {
	width:100%;
	min-width:0;
	margin-bottom:16px;
	color:var(--secondarytext);
	font-size:16px;
	line-height:1.5;
	overflow-wrap:anywhere;
}

.posts_tit {
	min-width:0;
	display:inline-flex;
	align-items:center;
	gap:8px;
	margin-top:auto;
	color:var(--uicolor);
	font-size:16px;
	font-weight:600;
	line-height:1.5;
	text-decoration:none;
	transition:color .3s ease;
}

.posts_tit i {
	flex:0 0 auto;
	transition:transform .3s ease;
}

html[dir="ltr"] .posts_tit i {
	transform:scaleX(-1);
}

/* =========================
   Focus & Interaction
========================= */

.Post--item a:focus-visible {
	outline:2px solid var(--uicolor);
	outline-offset:4px;
	border-radius:5px;
}

.Post--item:focus-within {
	border-color:color-mix(in srgb,var(--uicolor) 30%,var(--diver));
}

@media (hover:hover) and (pointer:fine) {
	.Post--item:hover {
		transform:translateY(-8px);
		border-color:var(--border-hover);
		box-shadow:var(--box-shadow-hover);
	}

	.Post--item:hover .-Po-Thumb img {
		transform:scale(1.05);
	}

	.Post--item:hover .posts_title a {
		color:var(--uicolor);
	}

	.Post--item:hover .posts_tit i {
		transform:translateX(-4px);
	}

	html[dir="ltr"] .Post--item:hover .posts_tit i {
		transform:translateX(4px) scaleX(-1);
	}
}

/* =========================
   Tablet Responsive
========================= */

@media only screen and (max-width:991px) {
	.Post--item {
		min-width:0;
		max-width:100%;
	}

	.-Po-Thumb img {
		width:100%;
		height:100%;
		object-fit:cover;
	}

	.posts_title {
		font-size:22px;
	}

	.post-excerpt {
		font-size:15px;
		line-height:1.7;
	}
}

/* =========================
   Mobile App Experience
========================= */

@media only screen and (max-width:767px) {
	.Post--item {
		width:100%;
		min-height:0;
		border-radius:20px;
		box-shadow:0 10px 26px rgb(var(--primary-text-code) / 7%);
	}

	.Post--item:not(.blog-box-card) {
		display:flex;
		flex-direction:column;
		align-items:stretch;
	}

	.Post--item:not(.blog-box-card) .-Po-Thumb {
		width:100%;
		height:auto;
		min-height:0;
		aspect-ratio:16 / 10;
		flex:0 0 auto;
		border-start-start-radius:20px;
		border-start-end-radius:20px;
		border-end-start-radius:0;
		border-end-end-radius:0;
	}

	.Post--item:not(.blog-box-card) .-Po-Thumb img {
		width:100%;
		height:100%;
		object-fit:cover;
	}

	.Post--item:active {
		transform:scale(.99);
	}

	.-Po-Info {
		padding:17px;
	}

	.post-card-meta {
		align-items:stretch;
		gap:7px;
		margin-bottom:11px;
	}

	.post-meta-item {
		min-height:36px;
		max-width:100%;
		padding:6px 9px;
		border:1px solid color-mix(in srgb,var(--uicolor) 8%,var(--diver));
		border-radius:9px;
		background:color-mix(in srgb,var(--uicolor) 2.5%,var(--surface-color));
		gap:6px;
	}

	.city-initem::after {
		display:none;
	}

	.post-meta-icon {
		width:16px;
		height:16px;
		flex-basis:16px;
		font-size:12px;
	}

	.post-meta-value {
		font-size:12px;
		line-height:1.45;
	}

	.sile-otm-con {
		margin-bottom:7px;
	}

	.posts_title {
		font-size:17px;
		line-height:1.5;
	}

	.post-excerpt {
		margin-bottom:13px;
		font-size:13.5px;
		line-height:1.7;
	}

	.posts_tit {
		min-height:42px;
		gap:7px;
		padding-block:7px;
		font-size:13px;
	}

	.posts_tit i {
		width:24px;
		height:24px;
		display:inline-flex;
		align-items:center;
		justify-content:center;
		border-radius:50%;
		background:color-mix(in srgb,var(--uicolor) 8%,var(--surface-color));
	}

	.posts_tit:active {
		opacity:.78;
	}
}

/* =========================
   One-column Mobile Cards
========================= */

@media only screen and (min-width:391px) and (max-width:620px) {
	.search-mixed-results .Post--item:not(.blog-box-card) {
		min-height:180px;
		flex-direction:row;
	}

	.search-mixed-results .Post--item:not(.blog-box-card) .-Po-Thumb {
		width:clamp(128px,34vw,168px);
		height:auto;
		aspect-ratio:auto;
		flex:0 0 clamp(128px,34vw,168px);
		border-start-start-radius:20px;
		border-end-start-radius:20px;
		border-start-end-radius:0;
		border-end-end-radius:0;
	}

	.search-mixed-results .Post--item:not(.blog-box-card) .-Po-Thumb img {
		position:absolute;
		inset:0;
		width:100%;
		height:100%;
		object-fit:cover;
	}

	.search-mixed-results .Post--item:not(.blog-box-card) .-Po-Info {
		padding:15px;
	}

	.search-mixed-results .Post--item:not(.blog-box-card) .post-excerpt {
		display:none;
	}
}

@media only screen and (min-width:391px) and (max-width:575px) {
	.-Posts-RelatedBoxes .Post--item:not(.blog-box-card) {
		min-height:180px;
		flex-direction:row;
	}

	.-Posts-RelatedBoxes .Post--item:not(.blog-box-card) .-Po-Thumb {
		width:clamp(128px,34vw,168px);
		height:auto;
		aspect-ratio:auto;
		flex:0 0 clamp(128px,34vw,168px);
		border-start-start-radius:20px;
		border-end-start-radius:20px;
		border-start-end-radius:0;
		border-end-end-radius:0;
	}

	.-Posts-RelatedBoxes .Post--item:not(.blog-box-card) .-Po-Thumb img {
		position:absolute;
		inset:0;
		width:100%;
		height:100%;
		object-fit:cover;
	}

	.-Posts-RelatedBoxes .Post--item:not(.blog-box-card) .-Po-Info {
		padding:15px;
	}

	.-Posts-RelatedBoxes .Post--item:not(.blog-box-card) .post-excerpt {
		display:none;
	}
}

/* =========================
   Small Mobile Adjustments
========================= */

@media only screen and (max-width:430px) {
	.Post--item {
		border-radius:18px;
	}

	.Post--item:not(.blog-box-card) .-Po-Thumb {
		border-start-start-radius:18px;
		border-start-end-radius:18px;
	}

	.-Po-Info {
		padding:16px;
	}

	.post-card-meta {
		display:grid;
		grid-template-columns:minmax(0,1fr);
	}

	.post-meta-item {
		width:100%;
	}

	.posts_title {
		font-size:17px;
	}

	.post-excerpt {
		font-size:13px;
	}

	.posts_tit {
		width:100%;
		justify-content:space-between;
	}
}

@media only screen and (max-width:340px) {
	.Post--item {
		border-radius:16px;
	}

	.Post--item:not(.blog-box-card) .-Po-Thumb {
		border-start-start-radius:16px;
		border-start-end-radius:16px;
	}

	.-Po-Info {
		padding:14px;
	}

	.posts_title {
		font-size:16px;
	}
}

/* =========================
   Editorial Cards
========================= */

.articles-slider-track {
	width:100%;
	min-width:0;
}

.blog-box-card {
	min-width:0;
}

.blog-box-card .blog-card-placeholder {
	width:100%;
	height:100%;
	display:flex;
	align-items:center;
	justify-content:center;
	color:var(--uicolor);
	background:var(--media-placeholder);
	font-size:42px;
}

.blog-cat {
	max-width:100%;
	display:inline-flex;
	color:var(--secondarytext);
	font-size:13px;
	font-weight:700;
	line-height:1.4;
	text-decoration:none;
	overflow-wrap:anywhere;
	transition:color var(--transition);
}

.blog-meta {
	width:100%;
	min-width:0;
	display:flex;
	align-items:center;
	flex-wrap:wrap;
	gap:8px 14px;
}

.blog-meta span {
	min-width:0;
	max-width:100%;
	display:inline-flex;
	align-items:center;
	gap:7px;
	color:var(--primary-text);
	font-size:13px;
	line-height:1.5;
	overflow-wrap:anywhere;
}

.blog-meta span + span {
	position:relative;
	padding-inline-start:14px;
}

.blog-meta span + span::before {
	content:"";
	position:absolute;
	inset-inline-start:0;
	top:50%;
	width:1px;
	height:16px;
	background:var(--diver);
	transform:translateY(-50%);
}

.blog-meta i {
	flex:0 0 auto;
	color:var(--uicolor);
	font-size:15px;
}

.blog-meta time {
	font-family:var(--f-number);
	direction:ltr;
	unicode-bidi:isolate;
}

@media (hover:hover) and (pointer:fine) {
	.blog-cat:hover {
		color:var(--uicolor2);
	}
}

@media only screen and (max-width:767px) {
	.blog-cat,
	.blog-meta span {
		font-size:12px;
	}

	.blog-meta {
		gap:7px 11px;
	}

	.blog-meta span + span {
		padding-inline-start:11px;
	}
}

@media (prefers-reduced-motion:reduce) {
	.Post--item,
	.-Po-Thumb img,
	.posts_title a,
	.posts_tit,
	.posts_tit i,
	.blog-cat {
		transition:none;
	}
}