.inBanner {
	height: 430px;
	position: relative;
	background: var(--dark);
	display: flex;
	align-items: end;
	color: #fff;
	padding: 150px 0 76px;
	overflow: hidden
}
.inBannerBg {
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(15, 18, 22, .94), rgba(15, 18, 22, .55)), url('../images/inbanner.jpg') center/cover no-repeat
}
.inBanner:after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px);
	background-size: 90px 90px
}
.inBanner .container {
	position: relative;
	z-index: 1
}
.inBanner span, .pageLabel {
	font-family: var(--eng);
	letter-spacing: .18em;
	color: var(--gold);
	font-weight: 700
}
.inBanner h1 {
	font-size: clamp(42px, 6vw, 52px);
	line-height: 1.05;
	margin: 14px 0
}
.inBanner p {
	max-width: 760px;
	color: rgba(255, 255, 255, .72);
	font-size: 18px
}
.catalogGrid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px
}
.catalogCard {
	background: #fff;
	box-shadow: 0 18px 42px rgba(31, 36, 41, .08);
	transition: .35s;
	overflow: hidden
}
.catalogCard figure {
	height: 300px;
	overflow: hidden;
	background: #222
}
.catalogCard img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: .5s
}
.catalogCard div {
	padding: 28px
}
.catalogCard span {
	font-family: var(--eng);
	font-size: 30px;
	color: var(--gold)
}
.catalogCard h3 {
	font-size: 24px;
	margin: 8px 0
}
.catalogCard p {
	color: var(--muted);
	font-size: 15px
}
.catalogCard b {
	display: inline-block;
	margin-top: 18px;
	font-family: var(--eng);
	letter-spacing: .12em;
	color: var(--dark)
}
.catalogCard:hover {
	transform: translateY(-8px)
}
.catalogCard:hover img {
	transform: scale(1.08)
}
.detailGrid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 70px;
	align-items: center
}
.detailText h2 {
	font-size: clamp(32px, 4vw, 42px);
	line-height: 1.25;
	margin: 14px 0 22px
}
.detailText p {
	color: var(--muted);
	font-size: 17px
}
.detailText ul {
	margin-top: 28px;
	display: grid;
	gap: 12px
}
.detailText li {
	background: #fff;
	padding: 14px 18px;
	border-left: 4px solid var(--gold);
	box-shadow: 0 12px 30px rgba(31, 36, 41, .06)
}
.detailPhoto img {
	aspect-ratio: 4/3;
	object-fit: cover
}
.featureBand {
	background: var(--dark);
	color: #fff;
	padding: 62px 0
}
.featureGrid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px
}
.featureGrid div {
	background: rgba(255, 255, 255, .06);
	border: 1px solid rgba(255, 255, 255, .12);
	padding: 28px
}
.featureGrid b {
	font-family: var(--eng);
	font-size: 36px;
	color: var(--gold)
}
.featureGrid h3 {
	font-size: 24px;
	margin: 8px 0
}
.featureGrid p {
	color: rgba(255, 255, 255, .65)
}
.relatedGrid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px
}
.relatedCase {
	background: #fff;
	box-shadow: 0 15px 36px rgba(31, 36, 41, .08);
	overflow: hidden;
	transition: .3s
}
.relatedCase img {
	height: 190px;
	width: 100%;
	object-fit: cover
}
.relatedCase div {
	padding: 22px
}
.relatedCase span {
	color: var(--gold);
	font-weight: 700
}
.relatedCase h3 {
	font-size: 20px
}
.relatedCase p {
	color: var(--muted);
	font-size: 14px
}
.relatedCase:hover {
	transform: translateY(-6px)
}
.contactCta {
	padding: 90px 0;
	background: linear-gradient(135deg, var(--gold), #b88c45)
}
.ctaBox {
	display: flex;
	justify-content: space-between;
	gap: 40px;
	align-items: center;
	color: #171b20
}
.ctaBox span {
	font-family: var(--eng);
	letter-spacing: .18em;
	font-weight: 700
}
.ctaBox h2 {
	font-size: clamp(28px, 4vw, 46px);
	line-height: 1.25;
	margin: 10px 0
}
.ctaBox p {
	max-width: 650px
}
.ctaActions {
	display: flex;
	gap: 14px;
	flex-wrap: wrap
}
.contactCta .ghostBtn {
	border-color: rgba(20, 24, 28, .45);
	color: #171b20
}
.contactCta .mainBtn {
	background: #171b20;
	color: #fff
}
@media(max-width:1100px) {
	.catalogGrid {
		grid-template-columns: repeat(2, 1fr)
	}
	.detailGrid {
		grid-template-columns: 1fr
	}
	.relatedGrid {
		grid-template-columns: repeat(2, 1fr)
	}
}
@media(max-width:700px) {
	.inBanner {
		height: auto;
		padding: 130px 0 62px
	}
	.catalogGrid, .featureGrid, .relatedGrid {
		grid-template-columns: 1fr
	}
	.ctaBox {
		display: block
	}
	.ctaActions {
		margin-top: 26px
	}
	.catalogCard figure {
		height: 300px
	}
}