@charset "UTF-8";

/* ==========================================================================
   SoLU subpage styles
   ========================================================================== */

/* 下層ヒーロー（アイキャッチ背景 + タイトル/サブタイトル）
   ------------------------------------------------------------------ */
.subpage__hero {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 570px;
	background: var(--color-navy) center / cover no-repeat;
	color: var(--color-white);
}

.subpage__hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(10, 20, 36, 0.6) 0%, rgba(10, 20, 36, 0.25) 32%, rgba(10, 20, 36, 0) 50%);
}

.subpage__hero-inner {
	position: relative;
	width: 100%;
	padding-inline: 80px;
}

.subpage__title {
	font-size: 40px;
	font-weight: 700;
	line-height: 1.5;
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}

.subpage__subtitle {
	margin-top: 12px;
	font-size: 16px;
	font-weight: 700;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}

/* アイキャッチ未設定時 */
.subpage__hero--no-image {
	min-height: 240px;
}

/* 画面幅いっぱいの緑背景セクション
   ------------------------------------------------------------------ */
.section-green {
	/* コンテンツ幅の中から左右いっぱいに背景を広げる */
	margin-inline: calc(50% - 50vw);
	padding-inline: calc(50vw - 50%);
	padding-block: 48px;
	background: #e6f1eb;
}

.section-dark-green {
	margin-inline: calc(50% - 50vw);
	padding-inline: calc(50vw - 50%);
	padding-block: 48px;
	background: #2d7a2d;
	color: var(--color-white);
}

.subpage__body .section-dark-green h2::after {
	background: var(--color-white);
}

/* 通常セクションの下部スペース（専用コンポーネントは除外） */
.subpage__body section:not(.section-green),
.subpage__body .wp-block-group:not(.section-green):not(.section-dark-green):not(.daikibo-step):not(.daikibo-card):not(.chosa-card):not(.sealing-card):not(.pit-card):not(.injection-card):not(.bousui-card):not(.tel-card):not(.emergency-card):not(.sealing-warning):not(.pit-warning):not(:has(> .daikibo-step)):not(:has(> .daikibo-card)) {
	padding-bottom: 48px;
}

@media (max-width: 767px) {
	.subpage__hero {
		min-height: 380px;
	}

	.page-company .subpage__hero {
		background-position: right;
	}

	.subpage__hero-inner {
		padding-inline: 40px;
	}

	.subpage__title {
		font-size: 28px;
	}

	.subpage__hero::before {
		background: linear-gradient(90deg, rgba(10, 20, 36, 0.6) 0%, rgba(10, 20, 36, 0.25) 60%, rgba(10, 20, 36, 0) 100%);
	}
}

.page-chosa .wp-block-columns:last-of-type > .wp-block-column:empty {
	display: block;
	visibility: hidden;
}

@media (max-width: 767px) {
	.page-chosa .wp-block-columns:last-of-type > .wp-block-column:empty {
		display: none;
	}
}

.width-70 {
	width: 70%;
	margin-inline: auto;
}

.width-50 {
	width: 50%;
	margin-inline: auto;
}

.width-100 {
	width: 100%;
	margin-inline: auto;
}

.no-radius img {
	border-radius: 0;
}

.subpage__body figure.no-radius img,
.subpage__body .no-radius img {
	margin-top: 0;
	border-radius: 0;
}

/* contactページ：電話カード */
.page-contact .tel-card {
	position: relative;
	margin-top: 20px;
	margin-bottom: 40px;
	padding: 16px 20px 20px;
	background: #e6f1eb;
	border-radius: 6px;
	color: var(--color-green);
}

.page-contact .tel-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 6px;
	border-radius: 6px 6px 0 0;
	background: var(--color-green);
}

.page-contact .tel-card h3,
.page-contact .tel-card h4 {
	margin-top: 0;
	color: var(--color-green);
	font-size: 20px;
	font-weight: 700;
}

.page-contact .tel-card p {
	margin-top: 4px;
	color: #868687;
	font-size: 12px;
}

.page-contact .emergency-card {
	position: relative;
	margin-top: 20px;
	margin-bottom: 40px;
	padding: 16px 20px 20px;
	background: #f0dfe6;
	border-radius: 6px;
	color: #bd2525;
}

.page-contact .emergency-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 6px;
	border-radius: 6px 6px 0 0;
	background: #bd2525;
}

.page-contact .emergency-card h3,
.page-contact .emergency-card h4 {
	margin-top: 0;
	color: #bd2525;
	font-size: 20px;
	font-weight: 700;
}

.page-contact .emergency-card p {
	margin-top: 4px;
	color: #8f343f;
	font-size: 12px;
}

/* 直下のdiv（カラム）を下寄せにする。コアの align-items:normal!important を上書き */
.align-bottom,
.wp-block-columns.align-bottom {
	display: flex;
	align-items: flex-end !important;
}

.align-bottom > div :last-child {
	margin-bottom: 0;
}

.align-middle,
.wp-block-columns.align-middle {
	align-items: center !important;
}

/* 上部に緑バーの付いた装飾カード
   ------------------------------------------------------------------ */
.deco-card {
	position: relative;
	overflow: hidden;
	padding: 32px 24px 24px;
	background: var(--color-white);
	border-radius: 8px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.deco-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 10px;
	background: var(--color-green);
}

.deco-card h3,
.deco-card h4 {
	margin-top: 0;
	color: var(--color-text);
	font-size: 16px;
	font-weight: 700;
}

.deco-card p {
	margin-top: 12px;
	color: #868687;
	font-size: 13px;
}

/* 調査カード（画像 + タイトル + 本文）
   ------------------------------------------------------------------ */
.chosa-card {
	overflow: hidden;
	padding: 0 24px 32px;
	background: var(--color-white);
	border-radius: 8px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.chosa-card > .wp-block-image {
	position: relative;
	margin: 0 -24px;
}

.chosa-card > .wp-block-image img {
	width: 100%;
	aspect-ratio: 661 / 279;
	object-fit: cover;
	border-radius: 0;
	margin: 0;
}

.chosa-card h4 {
	margin-top: 24px;
	font-size: 16px;
	font-weight: 700;
}

.chosa-card p {
	margin-top: 16px;
	color: #868687;
	font-size: 14px;
}

/* chosaページ限定：カラムの上下マージン */
.page-chosa .wp-block-columns {
	margin-block: 40px;
}
/* 大規模修繕：施工の流れ（daikibo-step）
   ------------------------------------------------------------------ */
.wp-block-group:has(> .daikibo-step) {
	counter-reset: daikibo;
	position: relative;
	width: 70%;
	margin-inline: auto;
	gap: 56px;
	padding-bottom: 56px;
}

/* 縦の緑ライン */
.wp-block-group:has(> .daikibo-step)::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 24px;
	left: 32px;
	width: 8px;
	background: var(--color-green);
}

/* ライン末尾の片側矢印（ラインの先端から左下へのストローク） */
.wp-block-group:has(> .daikibo-step)::after {
	content: "";
	position: absolute;
	bottom: 20px;
	left: 6px;
	width: 32px;
	height: 8px;
	background: var(--color-green);
	border-radius: 4px;
	transform: rotate(45deg);
	transform-origin: right center;
}

.daikibo-step {
	counter-increment: daikibo;
	position: relative;
	width: 100%;
	padding-left: 110px;
}

/* 自動採番の丸バッジ（01, 02…）：白丸に薄緑の囲い */
.daikibo-step::before {
	content: counter(daikibo, decimal-leading-zero);
	position: absolute;
	top: 50%;
	left: 6px;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background: var(--color-white);
	box-shadow: 0 0 0 8px #dfeadf;
	color: var(--color-green);
	font-size: 20px;
	font-weight: 700;
	z-index: 1;
}

.daikibo-step > .wp-block-group__inner-container {
	position: relative;
	isolation: isolate;
	display: grid;
	grid-template-columns: 1fr 300px;
	/* 上下の1fr行でテキストブロックを垂直中央に揃える */
	grid-template-rows: 1fr auto auto 1fr;
	column-gap: 48px;
	padding-right: 40px;
}

/* テキスト背面の薄緑バンド（画像の右に少しはみ出る） */
.daikibo-step > .wp-block-group__inner-container::before {
	content: "";
	position: absolute;
	inset: 36px 0;
	left: -48px;
	background: #dfeadf;
	border-radius: 8px;
	z-index: -1;
}

.daikibo-step h3,
.subpage__body .daikibo-step h3 {
	grid-area: 2 / 1;
	margin-top: 0;
	padding-left: 32px;
}

.daikibo-step p,
.subpage__body .daikibo-step p {
	grid-area: 3 / 1;
	margin-top: 12px;
	padding-left: 32px;
	color: var(--color-text);
	font-size: 14px;
}

.daikibo-step figure {
	grid-area: 1 / 2 / span 4;
	margin: 0;
}

.daikibo-step figure img {
	width: 100%;
	height: auto;
	border-radius: 8px;
}

/* 大規模修繕：工事詳細カード（daikibo-card）
   ------------------------------------------------------------------ */
.wp-block-group:has(> .daikibo-card) {
	width: 1000px;
	max-width: 100%;
	margin-inline: auto;
}

/* 親フレックスの幅に関係なく全カードを同一幅に */
.daikibo-card {
	width: 100%;
}

.daikibo-card > .wp-block-group__inner-container {
	display: grid;
	grid-template-columns: 340px 1fr;
	grid-template-rows: auto auto 1fr;
	column-gap: 40px;
	padding: 24px;
	background: #2e693a;
	border-radius: 8px;
	color: var(--color-white);
}

.daikibo-card figure {
	grid-area: 1 / 1 / span 3;
	display: flex;
	align-items: center;
	margin: 0;
}

.daikibo-card figure img,
.subpage__body .daikibo-card figure img {
	width: 100%;
	height: auto;
	margin: 0;
	border-radius: 4px;
}

.daikibo-card h3,
.subpage__body .daikibo-card h3 {
	grid-column: 2;
	margin-top: 0;
	color: var(--color-white);
	font-size: 16px;
}

.daikibo-card p,
.subpage__body .daikibo-card p {
	grid-column: 2;
	margin-top: 16px;
	font-size: 12px;
}

.daikibo-card ul,
.subpage__body .daikibo-card ul {
	grid-column: 2;
	margin-top: 16px;
	padding-left: 0;
	list-style: none;
	font-size: 12px;
}

.daikibo-card ul li::before {
	content: "* ";
}

/* sealingページ：劣化リスクの注意カード
   ------------------------------------------------------------------ */
.page-sealing .sealing-warning {
	width: 70%;
	margin-inline: auto;
}

.page-pit .pit-warning {
	margin-inline: auto;
	padding: 12px 16px 14px;
	background: #fdf5e6;
	border: 1px solid #e3a640;
	border-radius: 8px;
}

.page-sealing .sealing-warning > .wp-block-group__inner-container,
.page-pit .pit-warning > .wp-block-group__inner-container {
	padding: 20px 28px 24px;
	background: #fdf5e6;
	border: 1px solid #e3a640;
	border-radius: 8px;
}

.page-sealing .sealing-warning h3,
.subpage__body .sealing-warning h3,
.page-pit .pit-warning h3,
.subpage__body .pit-warning h3 {
	margin-top: 0;
	color: #6f4f1d;
	font-size: 15px;
	font-weight: 700;
}

.page-sealing .sealing-warning p,
.subpage__body .sealing-warning p,
.page-pit .pit-warning p,
.subpage__body .pit-warning p {
	margin-top: 10px;
	color: #c78435;
	font-size: 13px;
}

.page-pit .pit-warning h3 {
	margin-top: 0;
	color: #6f4f1d;
	font-size: 13px;
}

.page-pit .pit-warning p {
	margin-top: 6px;
	color: #c78435;
	font-size: 11px;
}

/* sealing/pitページ：工法カード（画像 + タイトル + 本文） */
.page-sealing .sealing-card,
.page-pit .pit-card,
.page-injection .injection-card,
.page-bousui .bousui-card {
	overflow: hidden;
	margin-top: 40px;
	padding-bottom: 18px;
	background: var(--color-white);
	border-radius: 8px;
}

.page-sealing .wp-block-columns:has(> .sealing-card),
.page-pit .wp-block-columns:has(> .pit-card),
.page-injection .wp-block-columns:has(> .injection-card),
.page-bousui .wp-block-columns:has(> .bousui-card) {
	align-items: flex-start;
}

.page-sealing .sealing-card figure,
.page-pit .pit-card figure,
.page-injection .injection-card figure,
.page-bousui .bousui-card figure {
	margin: 0;
}

.page-sealing .sealing-card figure img,
.subpage__body .sealing-card figure img,
.page-pit .pit-card figure img,
.subpage__body .pit-card figure img,
.page-injection .injection-card figure img,
.subpage__body .injection-card figure img,
.page-bousui .bousui-card figure img,
.subpage__body .bousui-card figure img {
	width: 100%;
	height: auto;
	margin: 0;
	border-radius: 8px 8px 0 0;
}

	@media (max-width: 1114px) {
		.wp-block-group:has(> .daikibo-step) {
			width: 100%;
			gap: 36px;
			padding-inline: 24px 16px;
		}

		.wp-block-group:has(> .daikibo-step)::before {
			left: 28px;
			width: 6px;
		}

		.wp-block-group:has(> .daikibo-step)::after {
			left: 1px;
		}

		.daikibo-step {
			padding-left: 44px;
		}

		.daikibo-step::before {
			left: -17px;
			top: 62px;
			transform: translateY(-50%);
			width: 48px;
			height: 48px;
			font-size: 16px;
			box-shadow: 0 0 0 6px #dfeadf;
		}

		.daikibo-step > .wp-block-group__inner-container {
			display: flex;
			flex-direction: column;
			align-items: stretch;
			padding: 18px 12px 0;
		}

		.daikibo-step > .wp-block-group__inner-container::before {
			top: 0;
			bottom: auto;
			height: 168px;
			inset-inline: 0;
			left: -24px;
			border-radius: 6px;
		}

		.daikibo-step h3,
		.subpage__body .daikibo-step h3 {
			order: 1;
			padding-left: 0;
			font-size: 15px;
		}

		.daikibo-step p,
		.subpage__body .daikibo-step p {
			order: 2;
			margin-top: 8px;
			padding-left: 0;
			font-size: 12px;
		}

		.daikibo-step figure {
			order: 3;
			margin: 8px 0 -2px;
		}

		.daikibo-step figure img {
			width: 100%;
			border-radius: 0;
            margin-left: -24px;
		}

		.wp-block-group:has(> .daikibo-card) {
			width: 100%;
			padding-inline: 16px;
		}

		.daikibo-card > .wp-block-group__inner-container {
			display: flex;
			flex-direction: column;
			gap: 0;
			padding: 14px 14px 20px;
			border-radius: 8px;
		}

		.daikibo-card figure {
			order: 1;
			margin: 0;
		}

		.daikibo-card figure img {
			width: 100%;
			border-radius: 4px;
		}

		.daikibo-card h3,
		.subpage__body .daikibo-card h3 {
			order: 2;
			margin: 14px 0 0;
			font-size: 15px;
		}

		.daikibo-card p,
		.subpage__body .daikibo-card p {
			order: 3;
			margin: 10px 0 0;
			font-size: 12px;
			line-height: 1.6;
		}

		.daikibo-card ul,
		.subpage__body .daikibo-card ul {
			order: 4;
			margin: 18px 0 0;
			font-size: 12px;
			line-height: 1.7;
		}
	}
.page-sealing .sealing-card h3,
.subpage__body .sealing-card h3,
.page-pit .pit-card h3,
.subpage__body .pit-card h3,
.page-injection .injection-card h3,
.subpage__body .injection-card h3,
.page-bousui .bousui-card h3,
.subpage__body .bousui-card h3 {
	margin: 8px 12px 0;
	color: var(--color-text);
	font-size: 15px;
	font-weight: 700;
}

.page-sealing .sealing-card p,
.subpage__body .sealing-card p,
.page-pit .pit-card p,
.subpage__body .pit-card p,
.page-injection .injection-card p,
.subpage__body .injection-card p,
.page-bousui .bousui-card p,
.subpage__body .bousui-card p {
	margin: 6px 12px 0;
	color: #868687;
	font-size: 12px;
	line-height: 1.45;
}
.subpage__body {
	padding-block: 56px 96px;
}

/* 本文の基本スタイル */
.subpage__body h2 {
	margin-top: 48px;
	font-size: 24px;
	font-weight: 700;
    margin-bottom: 30px;
}

.subpage__body h2::after {
	content: "";
	display: block;
	width: 100px;
	height: 7px;
	background: var(--color-green);
}

/* 管理画面のテキスト配置に下線を追従させる */
.subpage__body h2.has-text-align-center::after {
	margin-inline: auto;
}

.subpage__body h2.has-text-align-right::after {
	margin-left: auto;
}

.subpage__body h3 {
	margin-top: 32px;
	color: var(--color-green);
	font-size: 24px;
	font-weight: 700;
}

.subpage__body p {
	margin-top: 16px;
}

.subpage__body ul,
.subpage__body ol {
	margin-top: 16px;
	padding-left: 1.5em;
}

.subpage__body ul {
	list-style: disc;
}

.subpage__body ol {
	list-style: decimal;
}

.subpage__body img {
	margin-top: 16px;
	border-radius: 6px;
}

.subpage__body table {
	width: 100%;
	margin-top: 24px;
	border-collapse: collapse;
}

.subpage__body th,
.subpage__body td {
	padding: 12px 16px;
	border: 1px solid #dfe0e0;
	text-align: left;
}

.subpage__body th {
	background: var(--color-gray-bg);
	font-weight: 700;
}

/* companyページ：会社概要テーブル */
.page-company .company-table > table,
.page-company .company-table figure > table,
.page-company .company-table .wp-block-table > table {
	border-top: 0.25pt solid #000000;
	border-right: 0;
	border-bottom: 0;
	border-left: 0;
}

.page-company .company-table th,
.page-company .company-table td {
	border-top: 0;
	border-right: 0;
	border-bottom: 0.25pt solid #000000;
	border-left: 0;
	padding: 10px 16px;
	font-size: 13px;
	text-align: left;
	vertical-align: top;
}

.page-company .company-table th {
	width: 160px;
	background: #dbdbdb;
	font-weight: 700;
}

.page-company .company-table tr > :first-child {
	width: 160px;
	background: #dbdbdb;
	font-weight: 700;
}

.page-company .company-table td {
	background: var(--color-white);
}
.error-404__content {
	max-width: 720px;
	margin: 0 auto;
	text-align: center;
}
.error-404__content h2 {
	margin-top: 0;
}
.error-404__content h2::after {
	margin-inline: auto;
}
.error-404__content p {
	margin-top: 20px;
	color: #868687;
}
.error-404__links {
	display: flex;
	justify-content: center;
	gap: 16px;
	margin-top: 32px;
}
.c-btn--outline-green {
	border: 3px solid var(--color-green);
	color: var(--color-green);
}

/* Archive */
.archive-page__header {
	padding: 48px 0;
	background: var(--color-navy);
	color: var(--color-white);
}

.archive-page__title {
	font-size: 28px;
	font-weight: 700;
}

.archive-page__description {
	margin-top: 12px;
	font-size: 14px;
}

.archive-page__body {
	padding-block: 56px 96px;
}

.archive-page__list {
	display: grid;
	gap: 20px;
}

.archive-card {
	display: grid;
	grid-template-columns: 240px 1fr;
	gap: 24px;
	padding: 20px;
	border: 1px solid #dfe0e0;
	border-radius: 6px;
	background: var(--color-white);
}

.archive-card__image img {
	width: 100%;
	aspect-ratio: 16 / 9;
	border-radius: 4px;
	object-fit: cover;
}

.archive-card__date {
	color: #868687;
	font-size: 13px;
}

.archive-card__title {
	margin-top: 8px;
	font-size: 18px;
}

.archive-card__excerpt {
	margin-top: 10px;
	color: #868687;
	font-size: 13px;
}

.archive-pagination {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
	margin-top: 40px;
	padding: 26px 0;
}

.archive-pagination::before,
.archive-pagination::after {
	content: "";
	position: absolute;
	left: 15%;
	right: 15%;
	height: 1px;
	background: #dfe0e0;
}

.archive-pagination::before {
	top: 0;
}

.archive-pagination::after {
	bottom: 0;
}

.archive-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 50px;
	height: 50px;
	border: 1px solid #dfe0e0;
	border-radius: 50%;
	font-size: 14px;
	font-weight: 700;
}

.archive-pagination .page-numbers.current {
	border-color: var(--color-green);
	background: var(--color-green);
	color: var(--color-white);
}

.archive-pagination .page-numbers.prev,
.archive-pagination .page-numbers.next {
	min-width: auto;
	height: auto;
	margin-inline: 16px;
	border: 0;
	border-radius: 0;
	font-size: 14px;
}

.archive-page__empty {
	text-align: center;
}
.works-filter {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 14px 34px;
	margin-bottom: 40px;
}
.works-filter a {
	min-width: 118px;
	padding: 8px 18px;
	border: 1px solid var(--color-text);
	border-radius: 8px;
	font-size: 13px;
	font-weight: 700;
	text-align: center;
}
.works-filter a.is-active,
.works-filter a:hover {
	background: var(--color-green);
	color: var(--color-white);
	opacity: 1;
}
.works-archive-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px 36px;
}

.works-ajax-cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px 36px;
}
.works-archive-card {
	min-width: 0;
	border: 1px solid #dfe0e0;
	background: var(--color-white);
}
.works-archive-card__image {
	display: block;
	background: #d3d3d3;
}
.works-archive-card__image img,
.works-archive-card__image span {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	margin: 0;
	border-radius: 0;
	object-fit: cover;
}
.works-archive-card__summary {
	padding: 14px 16px;
	background: #e6f1eb;
}
.works-archive-card__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 11px;
}
.works-archive-card__meta a,
.works-archive-card__meta span {
	padding: 3px 18px;
	border-radius: 999px;
	background: var(--color-white);
	color: var(--color-text);
	font-weight: 700;
}
.works-archive-card__summary h3 {
	margin-top: 16px;
	color: var(--color-green);
	font-size: 14px;
	font-weight: 700;
}

.works-archive-card__summary h3::after {
	content: none;
}
.works-archive-card__details {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
	padding: 16px;
	font-size: 10px;
}

.works-archive-card__details strong,
.works-archive-card__details span {
	display: block;
}
.works-archive-card__details div {
	display: grid;
	gap: 4px;
}
.works-archive-card__details-heading {
	grid-column: 1 / -1;
}
.works-archive-card__details-heading strong {
	color: var(--color-green);
	font-size: 14px;
}
.works-archive-card__link {
	display: block;
	padding: 0 16px 14px;
	color: var(--color-green);
	font-size: 11px;
	font-weight: 700;
}

.works-single__header {
	margin-inline: calc(50% - 50vw);
	margin-top: 56px;
	background: #e6f1eb;
	color: var(--color-text);
}
.works-single__header-inner {
	max-width: 1040px;
	padding-block: 14px 28px;
}
.works-single__meta {
	display: flex;
	align-items: center;
	gap: 16px;
	font-size: 10px;
}
.works-single__meta a {
	padding: 2px 16px;
	border-radius: 999px;
	background: var(--color-white);
	color: var(--color-green);
	font-weight: 700;
}
.works-single__header h1 {
	margin-top: 12px;
	color: var(--color-green);
	font-size: 22px;
	font-weight: 700;
}
.works-single__thumbnail img {
	width: 100%;
	border-radius: 6px;
}
.works-single__details {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0 32px;
	margin-top: 24px;
	padding: 20px 24px;
	border-top: 4px solid var(--color-green);
	background: #e6f1eb;
}
.works-single__details div {
	display: grid;
	grid-template-columns: 7em 1fr;
	gap: 12px;
	padding: 8px 0;
	font-size: 13px;
}
.works-single__details-heading {
	grid-column: 1 / -1;
	display: block !important;
	padding-top: 0 !important;
}
.works-single__details-heading strong {
	color: var(--color-green);
	font-size: 16px;
}
.works-single__details strong {
	font-weight: 700;
}
.works-single__content {
	margin-top: 32px;
}
.works-single__content h2,
.works-single__content h3 {
	color: var(--color-text);
	font-weight: 700;
}
.works-single__content h2 {
	margin: 32px 0 16px;
	font-size: 24px;
}
.works-single__content h2::after {
	content: none;
}
.works-single__content h3 {
	margin: 24px 0 12px;
	font-size: 20px;
}
.works-single__nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	margin-top: 48px;
	padding-block: 20px;
	border-block: 1px solid #dfe0e0;
	font-size: 13px;
	font-weight: 700;
}
.works-single__back,
.works-single__adjacent a {
	color: var(--color-green);
}
.works-single__adjacent {
	display: flex;
	gap: 24px;
}
.single-works > .subpage__body {
	max-width: 1040px;
}
.news-single__header {
	margin-inline: calc(50% - 50vw);
	margin-top: 56px;
	background: #e6f1eb;
	color: var(--color-text);
}
.news-single__header-inner {
	max-width: 1040px;
	padding-block: 14px 28px;
}
.news-single__meta {
	display: flex;
	align-items: center;
	gap: 16px;
	font-size: 10px;
}
.news-single__meta span {
	padding: 2px 16px;
	border-radius: 999px;
	background: var(--color-white);
	color: var(--color-green);
	font-weight: 700;
}
.news-single__header h1 {
	margin-top: 12px;
	color: var(--color-green);
	font-size: 22px;
	font-weight: 700;
}
.news-single__thumbnail img {
	width: 100%;
	border-radius: 6px;
}
.news-single__content {
	margin-top: 32px;
}
.news-single__content h2,
.news-single__content h3 {
	color: var(--color-text);
	font-weight: 700;
}
.news-single__content h2 {
	margin: 32px 0 16px;
	font-size: 24px;
}
.news-single__content h2::after {
	content: none;
}
.news-single__content h3 {
	margin: 24px 0 12px;
	font-size: 20px;
}
.news-single__nav {
	margin-top: 48px;
	padding-block: 20px;
	border-block: 1px solid #dfe0e0;
	font-size: 13px;
	font-weight: 700;
}
.news-single__back {
	color: var(--color-green);
}
.single-news > .subpage__body {
	max-width: 1040px;
}

@media (max-width: 767px) {
	.works-filter {
		gap: 10px;
		margin-bottom: 24px;
	}
	.works-filter a {
		min-width: 92px;
		font-size: 11px;
	}
	.works-archive-grid {
		grid-template-columns: 1fr;
	}

	.works-ajax-cards {
		grid-template-columns: 1fr;
	}
	.single-works .subpage__hero {
		background-position: right center;
	}
	.news-single__header {
		margin-top: 32px;
	}
	.news-single__header-inner {
		padding-block: 24px 28px;
	}
	.news-single__header h1 {
		font-size: 22px;
	}

	.works-single__title {
		font-size: 22px;
	}
	.works-single__header-inner {
		padding-block: 24px 28px;
	}
	.works-single__header {
		margin-top: 32px;
	}
	.works-single__header h1 {
		font-size: 22px;
	}
	.works-single__details {
		grid-template-columns: 1fr;
		padding-inline: 16px;
	}
	.works-single__nav {
		align-items: flex-start;
		flex-direction: column;
	}
	.works-single__adjacent {
		justify-content: space-between;
		width: 100%;
	}
}

@media (max-width: 767px) {
	.archive-page__header {
		padding: 32px 0;
	}

	.archive-page__title {
		font-size: 24px;
	}

	.archive-card {
		display: block;
		padding: 16px;
	}

	.archive-card__content {
		margin-top: 14px;
	}
	.error-404__links {
		align-items: stretch;
		flex-direction: column;
	}
}