.hg-project-archive,
.hg-project-single {
	background: #fff;
}

.hg-project-archive__hero {
	padding: 68px 0 58px;
	background: linear-gradient(135deg, #fff5ed, #f5f2ed);
}

.hg-project-breadcrumbs,
.rank-math-breadcrumb p {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 28px;
	color: var(--muted);
	font-size: 12px;
}

.hg-project-breadcrumbs a,
.rank-math-breadcrumb a {
	color: var(--orange);
}

.hg-project-archive__hero h1,
.hg-project-single h1 {
	margin: 12px 0 0;
	font-size: clamp(44px, 6vw, 76px);
	line-height: .98;
	letter-spacing: -.055em;
}

.hg-project-archive__hero p {
	max-width: 780px;
	margin: 22px 0 0;
	color: var(--muted);
	font-size: 18px;
	line-height: 1.7;
}

.hg-project-archive__content {
	padding: 42px 0 86px;
}

.hg-project-filters {
	display: flex;
	gap: 8px;
	margin: 0 0 34px;
	padding: 3px 0 9px;
	overflow-x: auto;
	scrollbar-width: thin;
}

.hg-project-filters a {
	flex: 0 0 auto;
	padding: 10px 15px;
	border: 1px solid var(--line);
	border-radius: 999px;
	background: #fff;
	color: var(--ink);
	font-size: 13px;
	font-weight: 750;
	text-decoration: none;
	transition: border-color .2s, background .2s, color .2s;
}

.hg-project-filters a:hover,
.hg-project-filters a:focus-visible,
.hg-project-filters a.is-active {
	border-color: var(--ink);
	background: var(--ink);
	color: #fff;
}

.hg-project-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}

.hg-project-card {
	min-width: 0;
	overflow: hidden;
	border: 1px solid var(--line);
	border-radius: 18px;
	background: #fff;
	transition: transform .22s ease, box-shadow .22s ease;
}

.hg-project-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--shadow);
}

.hg-project-card[hidden] {
	display: none;
}

.hg-project-card__image {
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--paper);
}

.hg-project-card__image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .35s ease;
}

.hg-project-card:hover .hg-project-card__image img {
	transform: scale(1.035);
}

.hg-project-card__placeholder {
	display: grid;
	width: 100%;
	height: 100%;
	place-items: center;
	color: #f2b49d;
	font-size: 24px;
	font-weight: 900;
	letter-spacing: .12em;
}

.hg-project-card__body {
	padding: 19px 20px 22px;
}

.hg-project-card__category {
	display: block;
	margin: 0 0 7px;
	color: var(--orange);
	font-size: 11px;
	font-weight: 850;
	letter-spacing: .07em;
	text-transform: uppercase;
}

.hg-project-card h3 {
	margin: 0;
	font-size: 20px;
	line-height: 1.25;
	letter-spacing: -.02em;
}

.hg-project-card h3 a {
	color: var(--ink);
	text-decoration: none;
}

.hg-project-card p {
	margin: 11px 0 0;
	color: var(--muted);
	font-size: 14px;
	line-height: 1.55;
}

.hg-project-card__link {
	display: inline-flex;
	gap: 7px;
	margin-top: 15px;
	color: var(--ink);
	font-size: 13px;
	font-weight: 800;
	text-decoration: none;
}

.hg-project-card__link span {
	color: var(--orange);
	transition: transform .2s;
}

.hg-project-card:hover .hg-project-card__link span {
	transform: translateX(3px);
}

.hg-project-empty,
.hg-project-empty-filter {
	max-width: 720px;
	margin: 50px auto;
	padding: 55px;
	border-radius: 22px;
	background: var(--paper);
	text-align: center;
}

.hg-project-empty h2,
.hg-project-empty-filter h2 {
	margin: 14px 0;
	font-size: clamp(30px, 4vw, 44px);
}

.hg-project-empty p,
.hg-project-empty-filter p {
	color: var(--muted);
}

.hg-home-projects {
	background: #fff;
}

.hg-project-grid--home .hg-project-card__body,
.hg-project-grid--product .hg-project-card__body {
	padding: 15px 16px 18px;
}

.hg-project-grid--home .hg-project-card h3,
.hg-project-grid--product .hg-project-card h3 {
	font-size: 17px;
}

.hg-project-single > .shell {
	padding-top: 38px;
	padding-bottom: 86px;
}

.hg-project-single__header {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(290px, .75fr);
	gap: 64px;
	align-items: end;
	padding: 28px 0 45px;
}

.hg-project-single__header > div > p {
	max-width: 720px;
	margin: 20px 0 0;
	color: var(--muted);
	font-size: 18px;
	line-height: 1.6;
}

.hg-project-facts {
	margin: 0;
	padding: 21px 24px;
	border: 1px solid var(--line);
	border-radius: 16px;
	background: var(--paper);
}

.hg-project-facts div {
	display: grid;
	grid-template-columns: 112px 1fr;
	gap: 16px;
	padding: 9px 0;
	border-bottom: 1px solid var(--line);
}

.hg-project-facts div:last-child {
	border-bottom: 0;
}

.hg-project-facts dt {
	color: var(--muted);
	font-size: 12px;
}

.hg-project-facts dd {
	margin: 0;
	font-size: 13px;
	font-weight: 750;
}

.hg-project-gallery {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	gap: 14px;
}

.hg-project-gallery__item {
	grid-column: span 4;
	margin: 0;
}

.hg-project-gallery__item--hero {
	grid-column: 1 / -1;
}

.hg-project-gallery__item a {
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: 18px;
	background: var(--paper);
}

.hg-project-gallery__item--hero a {
	aspect-ratio: 16 / 9;
}

.hg-project-gallery__item img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .3s ease;
}

.hg-project-gallery__item a:hover img,
.hg-project-gallery__item a:focus-visible img {
	transform: scale(1.025);
}

.hg-project-gallery__item figcaption {
	padding: 8px 3px 0;
	color: var(--muted);
	font-size: 12px;
}

.hg-project-single__content {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 360px;
	gap: 70px;
	align-items: start;
	padding: 68px 0;
}

.hg-project-single__content .content-prose {
	max-width: 760px;
	margin: 0;
}

.hg-project-cta {
	padding: 30px;
	border-radius: 20px;
	background: var(--ink);
	color: #fff;
}

.hg-project-cta h2 {
	margin: 15px 0 12px;
	font-size: 31px;
	line-height: 1.08;
}

.hg-project-cta p {
	margin: 0 0 22px;
	color: #c9ced8;
	line-height: 1.6;
}

.hg-project-cta .button {
	background: var(--orange);
}

.hg-project-products {
	padding: 55px 0 35px;
	border-top: 1px solid var(--line);
}

.hg-project-products ul.products,
.hg-project-products ul.products li.product {
	list-style: none;
}

.hg-project-products ul.products {
	margin-left: 0;
	padding-left: 0;
}

.hg-project-navigation {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	gap: 20px;
	align-items: center;
	margin-top: 44px;
	padding-top: 28px;
	border-top: 1px solid var(--line);
}

.hg-project-navigation > div:last-child {
	text-align: right;
}

.hg-project-navigation a {
	color: var(--ink);
	font-size: 13px;
	font-weight: 750;
}

.hg-product-projects {
	grid-column: 1 / -1;
	margin-top: 46px;
	padding-top: 46px;
	border-top: 1px solid var(--line);
}

.hg-project-grid--product {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.hg-project-lightbox {
	position: fixed;
	z-index: 100000;
	inset: 0;
}

.hg-project-lightbox[hidden] {
	display: none;
}

.hg-project-lightbox__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(7, 11, 20, .92);
}

.hg-project-lightbox__dialog {
	position: relative;
	display: grid;
	grid-template-columns: 52px minmax(0, 1fr) 52px;
	align-items: center;
	width: min(1180px, calc(100% - 40px));
	height: 100%;
	margin: 0 auto;
}

.hg-project-lightbox figure {
	margin: 0;
	text-align: center;
}

.hg-project-lightbox img {
	max-width: 100%;
	max-height: calc(100vh - 120px);
	object-fit: contain;
}

.hg-project-lightbox figcaption {
	min-height: 24px;
	padding-top: 12px;
	color: #d6dae2;
	font-size: 13px;
}

.hg-project-lightbox button {
	z-index: 2;
	display: grid;
	width: 42px;
	height: 42px;
	padding: 0;
	place-items: center;
	border: 1px solid rgba(255,255,255,.35);
	border-radius: 50%;
	background: rgba(15, 23, 42, .75);
	color: #fff;
	font-size: 22px;
	cursor: pointer;
}

.hg-project-lightbox__close {
	position: absolute;
	top: 22px;
	right: 0;
}

body.hg-project-lightbox-open {
	overflow: hidden;
}

@media (max-width: 1020px) {
	.hg-project-grid,
	.hg-project-grid--product {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.hg-project-single__header,
	.hg-project-single__content {
		grid-template-columns: 1fr;
		gap: 34px;
	}

	.hg-project-cta {
		max-width: 680px;
	}
}

@media (max-width: 680px) {
	.hg-project-archive__hero {
		padding: 44px 0 42px;
	}

	.hg-project-archive__hero p,
	.hg-project-single__header > div > p {
		font-size: 16px;
	}

	.hg-project-archive__content {
		padding: 26px 0 58px;
	}

	.hg-project-grid,
	.hg-project-grid--product {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	.hg-project-grid--home {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}

	.hg-project-grid--home .hg-project-card__body {
		padding: 12px;
	}

	.hg-project-grid--home .hg-project-card h3 {
		font-size: 14px;
	}

	.hg-project-grid--home .hg-project-card__link {
		display: none;
	}

	.hg-project-empty,
	.hg-project-empty-filter {
		padding: 35px 22px;
	}

	.hg-project-single > .shell {
		padding-top: 24px;
		padding-bottom: 58px;
	}

	.hg-project-single__header {
		padding: 15px 0 32px;
	}

	.hg-project-facts div {
		grid-template-columns: 100px 1fr;
	}

	.hg-project-gallery {
		grid-template-columns: 1fr;
	}

	.hg-project-gallery__item,
	.hg-project-gallery__item--hero {
		grid-column: 1;
	}

	.hg-project-gallery__item--hero a {
		aspect-ratio: 4 / 3;
	}

	.hg-project-single__content {
		padding: 45px 0;
	}

	.hg-project-cta {
		padding: 24px;
	}

	.hg-project-navigation {
		grid-template-columns: 1fr 1fr;
	}

	.hg-project-navigation > a {
		grid-column: 1 / -1;
		grid-row: 1;
		text-align: center;
	}

	.hg-project-navigation > div {
		grid-row: 2;
	}

	.hg-project-lightbox__dialog {
		grid-template-columns: 44px minmax(0, 1fr) 44px;
		width: calc(100% - 18px);
	}

	.hg-project-lightbox img {
		max-height: calc(100vh - 150px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.hg-project-card,
	.hg-project-card__image img,
	.hg-project-card__link span,
	.hg-project-gallery__item img {
		transition: none;
	}
}
