.hamish-post-list {
	--hamish-columns: 1;
	--hamish-post-gap: 20px;
	--hamish-title-lines: 2;
	--hamish-content-lines: 3;
	--hamish-active-background: transparent;
	display: grid;
	grid-template-columns: repeat(var(--hamish-columns), minmax(0, 1fr));
	gap: var(--hamish-post-gap);
}

.hamish-post-list__card {
	--hamish-image-width: 180px;
	--hamish-image-height: 130px;
	--hamish-image-aspect-ratio: 16 / 9;
	--hamish-image-max-height: none;
	--hamish-image-max-width: 100%;
	--hamish-image-size-width: min(var(--hamish-image-width), var(--hamish-image-max-width));
	--hamish-aligned-image-width: var(--hamish-image-size-width);
	--hamish-media-gap: 16px;
	--hamish-image-track-width: min(var(--hamish-image-size-width), max(0px, calc(100% - var(--hamish-media-gap))));
	display: grid;
	grid-template-columns: minmax(0, var(--hamish-image-track-width)) minmax(0, 1fr);
	grid-template-areas: "media text";
	align-items: stretch;
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
	max-width: 100%;
	gap: var(--hamish-media-gap);
	padding: 16px;
	text-decoration: none;
	transition: background-color 0.2s ease;
}

.hamish-post-list__card--no-image {
	grid-template-columns: minmax(0, 1fr);
}

.hamish-post-list__media {
	grid-area: media;
	position: relative;
	align-self: start;
	width: 100%;
	min-width: 0;
	max-width: 100%;
	height: var(--hamish-image-height);
	max-height: var(--hamish-image-max-height);
	aspect-ratio: var(--hamish-image-aspect-ratio);
	min-height: 1px;
	overflow: hidden;
	background: #e2e8f0;
}

.hamish-post-list.hamish-image-height-desktop-ratio .hamish-post-list__media { height: auto; }
.hamish-post-list.hamish-image-height-desktop-fixed .hamish-post-list__media { height: var(--hamish-image-height); }

@media (max-width: 1024px) {
	.hamish-post-list.hamish-image-height-tablet-ratio .hamish-post-list__media { height: auto; }
	.hamish-post-list.hamish-image-height-tablet-fixed .hamish-post-list__media { height: var(--hamish-image-height); }
}

@media (max-width: 767px) {
	.hamish-post-list.hamish-image-height-mobile-ratio .hamish-post-list__media { height: auto; }
	.hamish-post-list.hamish-image-height-mobile-fixed .hamish-post-list__media { height: var(--hamish-image-height); }
}

.hamish-post-list__image {
	position: absolute;
	inset: 0;
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover;
	object-position: center center;
}

.hamish-post-list.hamish-image-pos-desktop-top-left .hamish-post-list__image { object-position: left top; }
.hamish-post-list.hamish-image-pos-desktop-top-center .hamish-post-list__image { object-position: center top; }
.hamish-post-list.hamish-image-pos-desktop-top-right .hamish-post-list__image { object-position: right top; }
.hamish-post-list.hamish-image-pos-desktop-center-left .hamish-post-list__image { object-position: left center; }
.hamish-post-list.hamish-image-pos-desktop-center-center .hamish-post-list__image { object-position: center center; }
.hamish-post-list.hamish-image-pos-desktop-center-right .hamish-post-list__image { object-position: right center; }
.hamish-post-list.hamish-image-pos-desktop-bottom-left .hamish-post-list__image { object-position: left bottom; }
.hamish-post-list.hamish-image-pos-desktop-bottom-center .hamish-post-list__image { object-position: center bottom; }
.hamish-post-list.hamish-image-pos-desktop-bottom-right .hamish-post-list__image { object-position: right bottom; }

@media (max-width: 1024px) {
	.hamish-post-list.hamish-image-pos-tablet-top-left .hamish-post-list__image { object-position: left top; }
	.hamish-post-list.hamish-image-pos-tablet-top-center .hamish-post-list__image { object-position: center top; }
	.hamish-post-list.hamish-image-pos-tablet-top-right .hamish-post-list__image { object-position: right top; }
	.hamish-post-list.hamish-image-pos-tablet-center-left .hamish-post-list__image { object-position: left center; }
	.hamish-post-list.hamish-image-pos-tablet-center-center .hamish-post-list__image { object-position: center center; }
	.hamish-post-list.hamish-image-pos-tablet-center-right .hamish-post-list__image { object-position: right center; }
	.hamish-post-list.hamish-image-pos-tablet-bottom-left .hamish-post-list__image { object-position: left bottom; }
	.hamish-post-list.hamish-image-pos-tablet-bottom-center .hamish-post-list__image { object-position: center bottom; }
	.hamish-post-list.hamish-image-pos-tablet-bottom-right .hamish-post-list__image { object-position: right bottom; }
}

@media (max-width: 767px) {
	.hamish-post-list.hamish-image-pos-mobile-top-left .hamish-post-list__image { object-position: left top; }
	.hamish-post-list.hamish-image-pos-mobile-top-center .hamish-post-list__image { object-position: center top; }
	.hamish-post-list.hamish-image-pos-mobile-top-right .hamish-post-list__image { object-position: right top; }
	.hamish-post-list.hamish-image-pos-mobile-center-left .hamish-post-list__image { object-position: left center; }
	.hamish-post-list.hamish-image-pos-mobile-center-center .hamish-post-list__image { object-position: center center; }
	.hamish-post-list.hamish-image-pos-mobile-center-right .hamish-post-list__image { object-position: right center; }
	.hamish-post-list.hamish-image-pos-mobile-bottom-left .hamish-post-list__image { object-position: left bottom; }
	.hamish-post-list.hamish-image-pos-mobile-bottom-center .hamish-post-list__image { object-position: center bottom; }
	.hamish-post-list.hamish-image-pos-mobile-bottom-right .hamish-post-list__image { object-position: right bottom; }
}

.hamish-post-list__image-placeholder {
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(130deg, #e2e8f0, #cbd5e1);
}

.hamish-post-list__text {
	grid-area: text;
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.hamish-post-list.hamish-image-placement-desktop-left .hamish-post-list__card {
	grid-template-columns: minmax(0, var(--hamish-image-track-width)) minmax(0, 1fr);
	grid-template-areas: "media text";
}

.hamish-post-list.hamish-image-placement-desktop-right .hamish-post-list__card {
	grid-template-columns: minmax(0, 1fr) minmax(0, var(--hamish-image-track-width));
	grid-template-areas: "text media";
}

.hamish-post-list.hamish-image-placement-desktop-above .hamish-post-list__card {
	grid-template-columns: minmax(0, 1fr);
	grid-template-areas: "media" "text";
}

.hamish-post-list.hamish-image-placement-desktop-above .hamish-post-list__media,
.hamish-post-list.hamish-image-placement-desktop-below .hamish-post-list__media {
	width: var(--hamish-aligned-image-width);
}

.hamish-post-list.hamish-image-placement-desktop-below .hamish-post-list__card {
	grid-template-columns: minmax(0, 1fr);
	grid-template-areas: "text" "media";
}

@media (max-width: 1024px) {
	.hamish-post-list.hamish-image-placement-tablet-left .hamish-post-list__card { grid-template-columns: minmax(0, var(--hamish-image-track-width)) minmax(0, 1fr); grid-template-areas: "media text"; }
	.hamish-post-list.hamish-image-placement-tablet-right .hamish-post-list__card { grid-template-columns: minmax(0, 1fr) minmax(0, var(--hamish-image-track-width)); grid-template-areas: "text media"; }
	.hamish-post-list.hamish-image-placement-tablet-above .hamish-post-list__card { grid-template-columns: minmax(0, 1fr); grid-template-areas: "media" "text"; }
	.hamish-post-list.hamish-image-placement-tablet-below .hamish-post-list__card { grid-template-columns: minmax(0, 1fr); grid-template-areas: "text" "media"; }
	.hamish-post-list.hamish-image-placement-tablet-left .hamish-post-list__media,
	.hamish-post-list.hamish-image-placement-tablet-right .hamish-post-list__media { width: 100%; }
	.hamish-post-list.hamish-image-placement-tablet-above .hamish-post-list__media,
	.hamish-post-list.hamish-image-placement-tablet-below .hamish-post-list__media { width: var(--hamish-aligned-image-width); }
}

@media (max-width: 767px) {
	.hamish-post-list.hamish-image-placement-mobile-left .hamish-post-list__card { grid-template-columns: minmax(0, var(--hamish-image-track-width)) minmax(0, 1fr); grid-template-areas: "media text"; }
	.hamish-post-list.hamish-image-placement-mobile-right .hamish-post-list__card { grid-template-columns: minmax(0, 1fr) minmax(0, var(--hamish-image-track-width)); grid-template-areas: "text media"; }
	.hamish-post-list.hamish-image-placement-mobile-above .hamish-post-list__card { grid-template-columns: minmax(0, 1fr); grid-template-areas: "media" "text"; }
	.hamish-post-list.hamish-image-placement-mobile-below .hamish-post-list__card { grid-template-columns: minmax(0, 1fr); grid-template-areas: "text" "media"; }
	.hamish-post-list.hamish-image-placement-mobile-left .hamish-post-list__media,
	.hamish-post-list.hamish-image-placement-mobile-right .hamish-post-list__media { width: 100%; }
	.hamish-post-list.hamish-image-placement-mobile-above .hamish-post-list__media,
	.hamish-post-list.hamish-image-placement-mobile-below .hamish-post-list__media { width: var(--hamish-aligned-image-width); }
}

.hamish-post-list.hamish-image-alignment-desktop-left .hamish-post-list__card { --hamish-aligned-image-width: var(--hamish-image-size-width); }
.hamish-post-list.hamish-image-alignment-desktop-right .hamish-post-list__card { --hamish-aligned-image-width: var(--hamish-image-size-width); }
.hamish-post-list.hamish-image-alignment-desktop-centered .hamish-post-list__card { --hamish-aligned-image-width: var(--hamish-image-size-width); }
.hamish-post-list.hamish-image-alignment-desktop-justified .hamish-post-list__card { --hamish-aligned-image-width: min(100%, var(--hamish-image-max-width)); }
.hamish-post-list.hamish-image-alignment-desktop-left .hamish-post-list__media { justify-self: start; }
.hamish-post-list.hamish-image-alignment-desktop-right .hamish-post-list__media { justify-self: end; }
.hamish-post-list.hamish-image-alignment-desktop-centered .hamish-post-list__media { justify-self: center; }
.hamish-post-list.hamish-image-alignment-desktop-justified .hamish-post-list__media { justify-self: stretch; }

@media (max-width: 1024px) {
	.hamish-post-list.hamish-image-alignment-tablet-left .hamish-post-list__card,
	.hamish-post-list.hamish-image-alignment-tablet-right .hamish-post-list__card,
	.hamish-post-list.hamish-image-alignment-tablet-centered .hamish-post-list__card { --hamish-aligned-image-width: var(--hamish-image-size-width); }
	.hamish-post-list.hamish-image-alignment-tablet-justified .hamish-post-list__card { --hamish-aligned-image-width: min(100%, var(--hamish-image-max-width)); }
	.hamish-post-list.hamish-image-alignment-tablet-left .hamish-post-list__media { justify-self: start; }
	.hamish-post-list.hamish-image-alignment-tablet-right .hamish-post-list__media { justify-self: end; }
	.hamish-post-list.hamish-image-alignment-tablet-centered .hamish-post-list__media { justify-self: center; }
	.hamish-post-list.hamish-image-alignment-tablet-justified .hamish-post-list__media { justify-self: stretch; }
}

@media (max-width: 767px) {
	.hamish-post-list.hamish-image-alignment-mobile-left .hamish-post-list__card,
	.hamish-post-list.hamish-image-alignment-mobile-right .hamish-post-list__card,
	.hamish-post-list.hamish-image-alignment-mobile-centered .hamish-post-list__card { --hamish-aligned-image-width: var(--hamish-image-size-width); }
	.hamish-post-list.hamish-image-alignment-mobile-justified .hamish-post-list__card { --hamish-aligned-image-width: min(100%, var(--hamish-image-max-width)); }
	.hamish-post-list.hamish-image-alignment-mobile-left .hamish-post-list__media { justify-self: start; }
	.hamish-post-list.hamish-image-alignment-mobile-right .hamish-post-list__media { justify-self: end; }
	.hamish-post-list.hamish-image-alignment-mobile-centered .hamish-post-list__media { justify-self: center; }
	.hamish-post-list.hamish-image-alignment-mobile-justified .hamish-post-list__media { justify-self: stretch; }
}

.hamish-post-list .hamish-post-list__card.hamish-post-list__card--no-image {
	grid-template-columns: minmax(0, 1fr);
	grid-template-areas: "text";
}

.hamish-post-list__title {
	margin: 0 0 8px;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var(--hamish-title-lines);
	line-clamp: var(--hamish-title-lines);
}

.hamish-post-list__excerpt {
	margin: 0;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var(--hamish-content-lines);
	line-clamp: var(--hamish-content-lines);
}

.hamish-post-list__date {
	display: block;
	margin: 0 0 8px;
	color: #64748b;
}

.hamish-post-list__card:focus-visible {
	outline: 2px solid #2563eb;
	outline-offset: 2px;
}

.hamish-post-list__card:active,
.hamish-post-list__card.hamish-post-list__card--active {
	background-color: var(--hamish-active-background) !important;
}
