/**
 * SISt – project index (Progetti): header band, sidebar filters, card grid.
 */

.sist-projects-page { padding: 0 !important; max-width: none !important; }
body.sist-overlay-header .sist-projects-page .site-main { margin: 0; }

/* ---------- Header band ---------- */
.sist-projects-hero {
	display: flex;
	align-items: flex-end;
	min-height: 40vh;
	padding: calc(var(--wp--preset--spacing--60, 4rem) + 84px) var(--sist-gutter) var(--wp--preset--spacing--50, 3rem);
	background-color: var(--sist-primary-dark);
	color: #fff;
}
.sist-projects-hero__inner { width: 100%; max-width: var(--sist-wide); margin: 0 auto; }
.sist-projects-hero h1 { margin: 0; }
.sist-projects-hero__count {
	margin: 1rem 0 0;
	font-family: var(--sist-font-heading);
	font-size: 0.875rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .7);
	font-stretch: normal;
}
.sist-projects-hero__count .sist-counter { color: #fff; }
.sist-projects-intro { padding-top: var(--wp--preset--spacing--50); padding-bottom: 0; }

/* ---------- Layout ---------- */
.sist-projects {
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr);
	gap: clamp(2rem, 4vw, 3.5rem);
	max-width: var(--sist-shell);
	margin: 0 auto;
	padding: var(--wp--preset--spacing--50, 3rem) var(--sist-gutter) var(--wp--preset--spacing--70, 6rem);
	align-items: start;
}

/* ---------- Sidebar ---------- */
.sist-filters {
	position: sticky;
	top: calc(var(--sist-header-h) + 1.5rem + var(--sist-admin-bar, 0px));
	max-height: calc(100vh - var(--sist-header-h) - 3rem - var(--sist-admin-bar, 0px));
	overflow-y: auto;
	scrollbar-width: thin;
}
.sist-filters__form { display: grid; gap: 1.75rem; }
.sist-filters__head { display: none; }
.sist-filters__title {
	margin: 0;
	font-family: var(--sist-font-heading);
	font-size: 1.375rem;
	font-weight: 300;
	color: var(--sist-primary-dark);
	font-stretch: normal;
}
.sist-filter { margin: 0; padding: 0; border: 0; min-width: 0; }
.sist-filter__label {
	display: block;
	width: 100%;
	margin: 0 0 0.75rem;
	padding: 0 0 0.6rem;
	border-bottom: 1px solid var(--sist-light);
	font-family: var(--sist-font-heading);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--sist-primary-dark);
	font-stretch: normal;
}

.sist-search { position: relative; }
.sist-search .fa { position: absolute; left: 0.9rem; top: 50%; transform: translateY(-50%); color: #8795a0; font-size: 0.9rem; pointer-events: none; }
.sist-search input[type="search"] {
	width: 100%;
	padding: 0.8rem 0.9rem 0.8rem 2.4rem;
	border: 1px solid #d5dde3;
	border-radius: 6px;
	background: var(--sist-surface);
	font-size: 0.9375rem;
	-webkit-appearance: none;
	appearance: none;
}
.sist-search input[type="search"]:focus { background: #fff; }

/* Custom checkboxes */
.sist-check {
	position: relative;
	display: grid;
	grid-template-columns: 1.15rem 1fr auto;
	align-items: center;
	gap: 0.7rem;
	padding: 0.45rem 0.5rem;
	margin: 0 -0.5rem;
	border-radius: 5px;
	cursor: pointer;
	transition: background-color .2s ease, opacity .2s ease;
}
.sist-check:hover { background: var(--sist-surface); }
.sist-check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.sist-check__box {
	width: 1.15rem;
	height: 1.15rem;
	border: 1.5px solid #b9c6cf;
	border-radius: 3px;
	background: #fff;
	display: grid;
	place-content: center;
	transition: background-color .2s ease, border-color .2s ease;
}
.sist-check__box::after {
	content: "";
	width: 0.6rem;
	height: 0.34rem;
	border-left: 2px solid #fff;
	border-bottom: 2px solid #fff;
	transform: rotate(-45deg) scale(0);
	margin-top: -0.12rem;
	transition: transform .18s cubic-bezier(.34, 1.56, .64, 1);
}
.sist-check input:checked + .sist-check__box { background: var(--sist-primary); border-color: var(--sist-primary); }
.sist-check input:checked + .sist-check__box::after { transform: rotate(-45deg) scale(1); }
.sist-check input:focus-visible + .sist-check__box { box-shadow: 0 0 0 3px rgba(44, 80, 106, .2); }
.sist-check__text { font-size: 0.9375rem; line-height: 1.35; color: var(--sist-text); }
.sist-check input:checked ~ .sist-check__text { color: var(--sist-primary-dark); font-weight: 600; }
.sist-check__count {
	min-width: 1.75rem;
	padding: 0.1rem 0.45rem;
	border-radius: 999px;
	background: var(--sist-surface);
	font-size: 0.75rem;
	font-variant-numeric: tabular-nums;
	text-align: center;
	color: #66737c;
}
.sist-check.is-empty { opacity: .45; }

.sist-filters__reset {
	justify-self: start;
	padding: 0;
	border: 0;
	background: none !important;
	color: var(--sist-primary) !important;
	font-family: var(--sist-font-heading);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: underline;
	text-underline-offset: 0.25em;
	cursor: pointer;
}
.sist-filters__reset:hover { color: var(--sist-primary-dark) !important; }
.sist-filters__apply,
.sist-filters-toggle { display: none; }

/* ---------- Results bar ---------- */
.sist-results__bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem 1rem;
	margin-bottom: 1.75rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--sist-light);
}
.sist-results__count { margin: 0; font-size: 0.9375rem; color: #66737c; }
.sist-results__count strong { color: var(--sist-primary-dark); font-size: 1.125rem; }
.sist-results__active { display: flex; flex-wrap: wrap; gap: 0.4rem; flex: 1 1 auto; }
.sist-chip {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.3rem 0.5rem 0.3rem 0.8rem !important;
	border: 1px solid var(--sist-light) !important;
	border-radius: 999px !important;
	background: var(--sist-surface) !important;
	color: var(--sist-primary-dark) !important;
	font-family: var(--sist-font-body) !important;
	font-size: 0.8125rem !important;
	font-weight: 400 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	cursor: pointer;
	transition: border-color .2s ease;
}
.sist-chip:hover { border-color: var(--sist-primary) !important; }
.sist-chip span:last-child { font-size: 1rem; line-height: 1; opacity: .6; }
.sist-sort { margin-left: auto; }
.sist-sort select {
	padding: 0.5rem 2.2rem 0.5rem 0.9rem;
	border: 1px solid #d5dde3;
	border-radius: 6px;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%232C506A' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 0.85rem center;
	font-size: 0.875rem;
	color: var(--sist-primary-dark);
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
}

/* ---------- Cards ---------- */
.sist-cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: clamp(1.25rem, 2.2vw, 2rem);
	margin: 0;
	padding: 0;
	list-style: none;
}
.sist-card { margin: 0; }
.sist-card[hidden] { display: none; }
.sist-card article {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #fff;
	border: 1px solid var(--sist-light);
	border-radius: 8px;
	overflow: hidden;
	transition: transform .4s cubic-bezier(.2, .7, .2, 1), box-shadow .4s cubic-bezier(.2, .7, .2, 1), border-color .4s ease;
}
.sist-card article:hover {
	transform: translateY(-4px);
	border-color: transparent;
	box-shadow: 0 2px 6px rgba(28, 53, 71, .06), 0 22px 48px rgba(28, 53, 71, .14);
}
.sist-card__media {
	position: relative;
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--sist-surface);
}
.sist-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	margin: 0;
	transition: transform .9s cubic-bezier(.2, .7, .2, 1);
}
.sist-card__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(16, 33, 46, 0) 55%, rgba(16, 33, 46, .35) 100%);
	opacity: 0;
	transition: opacity .4s ease;
}
.sist-card article:hover .sist-card__media img { transform: scale(1.05); }
.sist-card article:hover .sist-card__media::after { opacity: 1; }
.sist-card__placeholder {
	position: absolute;
	inset: 0;
	background-color: var(--sist-primary-dark);
	background-image:
		linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
	background-size: 24px 24px;
}
.sist-card__tag {
	position: absolute;
	left: 0.85rem;
	top: 0.85rem;
	z-index: 1;
	padding: 0.35rem 0.65rem;
	border-radius: 4px;
	background: rgba(255, 255, 255, .94);
	color: var(--sist-primary-dark);
	font-family: var(--sist-font-heading);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	font-stretch: normal;
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}
.sist-card__body { display: flex; flex-direction: column; gap: 0.5rem; flex: 1 1 auto; padding: 1.15rem 1.25rem 1.35rem; }
.sist-card__year {
	margin: 0;
	font-family: var(--sist-font-heading);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: var(--sist-primary);
	font-stretch: normal;
}
.sist-card__year.is-ongoing::before {
	content: "";
	display: inline-block;
	width: 7px;
	height: 7px;
	margin-right: 0.45rem;
	border-radius: 50%;
	background: #3c9a6a;
	box-shadow: 0 0 0 3px rgba(60, 154, 106, .18);
	vertical-align: 0.05em;
}
.sist-card__title {
	margin: 0;
	font-family: var(--sist-font-heading);
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: 0;
	font-stretch: normal;
	text-wrap: pretty;
}
.sist-card__title a { color: var(--sist-primary-dark); text-decoration: none; }
.sist-card__title a::after { content: ""; position: absolute; inset: 0; z-index: 2; } /* whole card clickable */
.sist-card article:hover .sist-card__title a { color: var(--sist-primary); }
.sist-card__title a:focus-visible { outline: none; }
.sist-card article:has(.sist-card__title a:focus-visible) { outline: 2px solid var(--sist-primary); outline-offset: 3px; }
.sist-card__meta {
	display: grid;
	gap: 0.3rem;
	margin: auto 0 0;
	padding-top: 0.85rem;
	border-top: 1px solid var(--sist-light);
	font-size: 0.8125rem;
	line-height: 1.4;
}
.sist-card__meta > div { display: grid; grid-template-columns: 4.25rem 1fr; gap: 0.5rem; }
.sist-card__meta dt { margin: 0; font-weight: 600; color: #8795a0; }
.sist-card__meta dd { margin: 0; color: #4a5660; }

.sist-card.is-entering article { animation: sist-card-in .5s cubic-bezier(.16, 1, .3, 1) both; }
@keyframes sist-card-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }

/* ---------- Empty state ---------- */
.sist-empty {
	padding: 3rem 1.5rem;
	border: 1px dashed #c9d3da;
	border-radius: 8px;
	text-align: center;
}
.sist-empty[hidden] { display: none; }
.sist-empty__title { margin: 0 0 1rem; color: #56626b; }

/* ---------- Tablet / mobile: filters in a drawer ---------- */
@media (max-width: 960px) {
	.sist-projects { grid-template-columns: minmax(0, 1fr); }
	.sist-filters-toggle {
		display: inline-flex;
		align-items: center;
		gap: 0.6rem;
		justify-self: start;
		padding: 0.75rem 1.1rem !important;
		border: 1px solid #d5dde3 !important;
		border-radius: 6px !important;
		background: #fff !important;
		color: var(--sist-primary-dark) !important;
		font-family: var(--sist-font-heading);
		font-size: 0.8125rem !important;
		font-weight: 700;
		letter-spacing: 0.1em;
	}
	.sist-filters-toggle__badge {
		display: inline-grid;
		place-content: center;
		min-width: 1.35rem;
		height: 1.35rem;
		border-radius: 999px;
		background: var(--sist-primary);
		color: #fff;
		font-size: 0.6875rem;
		letter-spacing: 0;
	}
	.sist-filters-toggle__badge[hidden] { display: none; }
	.sist-filters {
		position: fixed;
		inset: 0 auto 0 0;
		z-index: 100000;
		width: min(88vw, 360px);
		max-height: none;
		padding: 1.25rem 1.5rem 2rem;
		background: #fff;
		box-shadow: 0 0 60px rgba(16, 33, 46, .3);
		transform: translateX(-105%);
		visibility: hidden;
		transition: transform .45s cubic-bezier(.7, 0, .2, 1), visibility 0s linear .45s;
	}
	.sist-projects.is-filters-open .sist-filters { transform: none; visibility: visible; transition: transform .5s cubic-bezier(.16, 1, .3, 1), visibility 0s; }
	.sist-projects.is-filters-open::before {
		content: "";
		position: fixed;
		inset: 0;
		z-index: 99999;
		background: rgba(16, 33, 46, .45);
	}
	.sist-filters__head { display: flex; align-items: center; justify-content: space-between; }
	.sist-filters__close {
		width: 40px;
		height: 40px;
		padding: 0 !important;
		border: 0 !important;
		background: none !important;
		color: var(--sist-primary-dark) !important;
		font-size: 1.75rem !important;
		line-height: 1;
	}
	.sist-filters__apply {
		display: block;
		width: 100%;
	}
	body.sist-drawer-open { overflow: hidden; }
}
@media (max-width: 600px) {
	.sist-sort { margin-left: 0; }
	.sist-cards { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
	.sist-card article, .sist-card__media img, .sist-filters { transition: none !important; }
	.sist-card.is-entering article { animation: none; }
}