/* ============================================================
   欧科美全屋定制 · 内页公用样式
   与首页保持同一设计语言：纸白 + 墨黑 + 发丝线 + 单点品牌金
   ============================================================ */

/* ---------- 内页顶部导航：始终纸白实底 ---------- */
.sitehead.is-solid {
	background: rgba(247, 245, 240, .96);
	backdrop-filter: blur(18px);
	-webkit-backdrop-filter: blur(18px);
	border-bottom: 1px solid var(--line);
}
.sitehead.is-solid .topbar {
	color: var(--ink-3);
	border-bottom-color: var(--line);
}
.sitehead.is-solid .topbar__right a:hover {
	color: var(--ink);
}
.sitehead.is-solid .topbar__tel {
	color: var(--blue);
}
.sitehead.is-solid:not(.is-scrolled) .brand__img {
	filter: none;
}
.sitehead.is-solid .nav__link, .sitehead.is-solid:not(.is-scrolled) .nav__link {
	color: var(--ink-2);
}
.sitehead.is-solid .nav__link:hover, .sitehead.is-solid:not(.is-scrolled) .nav__link:hover {
	color: var(--blue);
}
.sitehead.is-solid .nav__link.is-current, .sitehead.is-solid:not(.is-scrolled) .nav__link.is-current {
	color: var(--blue);
}
.sitehead.is-solid .nav-toggle span {
	background: var(--ink);
}
.nav__link.is-current::after {
	transform: scaleX(1);
}
.nav.is-open .nav__link.is-current {
	color: var(--blue);
}
/* ---------- 页面节奏 ---------- */
.section {
	padding: 104px 0;
}
.factory{ background:#fff; padding:80px 0px 80px 0px; height:auto; min-height:auto;}
.section--tight {
	padding: 76px 0;
}
.section--paper2 {
	background: var(--paper-2);
}
.section--white {
	background: var(--white);
}
.container--narrow {
	max-width: 960px;
}
/* ---------- 内页首屏 ---------- */
.phero {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 480px;
	padding: 200px 0 78px;
	overflow: hidden;
	background: var(--dark);
	color: #fff;
}
.phero--slim {
	min-height: 340px;
	padding: 176px 0 54px;
}
.phero__bg {
	position: absolute;
	inset: 0;
	z-index: 0;
}
.phero__bg img {
	width: 100%;
	height: 100%;
	/*object-fit: cover;*/
	animation: pheroZoom 14s ease-out forwards;
}
@keyframes pheroZoom {
 from {
transform: scale(1.08);
}
to {
	transform: scale(1);
}
}
.phero__mask {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(8, 10, 14, .58) 0%, rgba(8, 10, 14, .26) 38%, rgba(8, 10, 14, .88) 100%), radial-gradient(ellipse at 50% 40%, rgba(8, 10, 14, .04) 0%, rgba(8, 10, 14, .46) 70%, rgba(8, 10, 14, .8) 100%);
}
.phero__inner {
	position: relative;
	z-index: 2;
	width: 100%;
}
.phero__en {
	margin: 0 0 16px;
	font-size: 11.5px;
	letter-spacing: .34em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .64);
}
.phero__title {
	margin: 0 0 18px;
	font-family: var(--f-serif);
	font-size: clamp(34px, 4.4vw, 54px);
	font-weight: 700;
	line-height: 1.18;
	letter-spacing: -.01em;
}
.phero__title em {
	font-style: normal;
	color: var(--blue);
}
.phero__sub {
	/*max-width: 640px;*/
	margin: 0;
	font-size: 14.5px;
	line-height: 1.9;
	color: rgba(255, 255, 255, .74);
	font-weight: 300;
}
.phero__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 26px;
}
.phero__meta span {
	padding: 5px 13px;
	border: 1px solid rgba(255, 255, 255, .34);
	font-size: 11.5px;
	letter-spacing: .05em;
	color: rgba(255, 255, 255, .82);
}
/* ---------- 面包屑 ---------- */
.crumb {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 11px;
	margin-bottom: 26px;
	font-size: 12px;
	letter-spacing: .05em;
	color: rgba(255, 255, 255, .58);
}
.crumb a {
	color: inherit;
}
.crumb a:hover {
	color: #fff;
}
.crumb i {
	width: 18px;
	height: 1px;
	background: currentColor;
	opacity: .55;
}
.crumb span {
	color: rgba(255, 255, 255, .9);
}
/* ---------- 内页浅色页头（详情页用） ---------- */
.pagehead {
	padding: 170px 0 0px;
	background: var(--paper);
	border-bottom: 1px solid var(--line);
}
.crumb--ink {
	color: var(--ink-3);
}
.crumb--ink a:hover {
	color: var(--ink);
}
.crumb--ink span {
	color: var(--ink);
}
/* ---------- 区块标题 ---------- */
.phead {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 44px;
	padding-bottom: 22px;
	margin-bottom: 50px;
	border-bottom: 1px solid var(--line);
	flex-wrap: wrap;
}
.phead__en {
	display: block;
	margin-bottom: 11px;
	font-size: 11px;
	letter-spacing: .32em;
	text-transform: uppercase;
	color: var(--ink-3);
}
.phead__title {
	margin: 0;
	font-family: var(--f-serif);
	font-size: clamp(26px, 3.2vw, 36px);
	font-weight: 700;
	line-height: 1.3;
}
.phead__title em {
	font-style: normal;
	color: var(--blue);
}
.phead__desc {
	max-width: 460px;
	margin: 0;
	font-size: 13.5px;
	line-height: 1.9;
	color: var(--ink-3);
}
.phead--center {
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	gap: 18px;
}
.phead--center .phead__desc {
	max-width: 620px;
}
/* ---------- 筛选条 ---------- */
.filterbar {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
}
.filterbar__label {
	margin-right: 12px;
	font-size: 11px;
	letter-spacing: .26em;
	text-transform: uppercase;
	color: var(--ink-3);
}
.filterbar--center {
	justify-content: center;
}
/* ---------- 产品卡片（列表 / 详情通用） ---------- */
.prod-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}
.prod-card {
	display: flex;
	flex-direction: column;
	background: var(--white);
	border: 1px solid var(--line);
	transition: border-color .4s var(--ease), transform .4s var(--ease), box-shadow .4s var(--ease);
}
.prod-card:hover {
	border-color: var(--ink-2);
	transform: translateY(-4px);
	box-shadow: 0 24px 46px rgba(10, 10, 9, .08);
}
.prod-card.is-hide {
	display: none;
}
.prod-card__media {
	position: relative;
	display: block;
	/* aspect-ratio: 4 / 3;
	overflow: hidden; */
	background: var(--paper-2);
}
.prod-card__media img {
	width: 100%;
	/* height: 100%;
	object-fit: cover; */
	transition: transform 1.1s var(--ease);
}
.prod-card:hover .prod-card__media img {
	/* transform: scale(1.06); */
}
.prod-card__no {
	position: absolute;
	top: 14px;
	left: 16px;
	z-index: 2;
	font-family: var(--f-serif);
	font-size: 12px;
	letter-spacing: .14em;
	color: #fff;
	text-shadow: 0 1px 8px rgba(0, 0, 0, .45);
}
.prod-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 7px;
	padding: 22px 22px 24px;
}
.prod-card__cat {
	font-size: 10.5px;
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--blue);
}
.prod-card__title {
	margin: 0;
	font-family: var(--f-serif);
	font-size: 18px;
	font-weight: 600;
	line-height: 1.45;
}
.prod-card__desc {
	margin: 0;
	font-size: 12.5px;
	line-height: 1.75;
	color: var(--ink-3);
}
.prod-card__foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-top: auto;
	padding-top: 14px;
	border-top: 1px solid var(--line);
	font-size: 12px;
	color: var(--ink-3);
}
.prod-card__foot svg {
	width: 16px;
	height: 16px;
	color: var(--blue);
	transition: transform .4s var(--ease);
}
.prod-card:hover .prod-card__foot svg {
	transform: translateX(4px);
}
/* ---------- 案例卡片（列表 / 详情通用） ---------- */
.case-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.case-card {
	position: relative;
	display: block;
	overflow: hidden;
	/*min-height: 380px;*/
	background: var(--dark);
	color: #fff;
}
.case-card.is-hide {
	display: none;
}
.case-card img {
	/*position: absolute;
	inset: 0;*/
	width: 100%;
	/*height: 100%;
	object-fit: cover;*/
	transition: transform 1.1s var(--ease), filter .6s var(--ease);
	filter: saturate(.94);
}
.case-card:hover img {
	transform: scale(1.05);
	filter: saturate(1.05);
}
.case-card__mask {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, .4) 100%);
	transition: .5s var(--ease);
}
.case-card:hover .case-card__mask {
	background: linear-gradient(180deg, rgba(0, 0, 0, .04) 18%, rgba(0, 0, 0, .86) 100%);
}
.case-card__idx {
	position: absolute;
	top: 20px;
	right: 22px;
	z-index: 2;
	font-family: var(--f-serif);
	font-size: 12px;
	letter-spacing: .16em;
	color: rgba(255, 255, 255, .8);
}
.case-card__body {
	position: absolute;
	left: 24px;
	right: 24px;
	bottom: 22px;
	z-index: 2;
	display: flex;
	flex-direction: column;
	transition: transform .5s var(--ease);
}
.case-card:hover .case-card__body {
	transform: translateY(-5px);
}
.case-card__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
	margin-bottom: 11px;
}
.case-card__tags span {
	padding: 4px 11px;
	border: 1px solid rgba(255, 255, 255, .36);
	font-size: 11px;
	color: rgba(255, 255, 255, .86);
}
.case-card__title {
	margin: 0 0 6px;
	font-family: var(--f-serif);
	font-size: 19px;
	font-weight: 600;
	line-height: 1.45;
}
.case-card__meta {
	margin: 0;
	font-size: 12px;
	color: rgba(255, 255, 255, .64);
}
/* ---------- 分页 ---------- */
.pager {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 56px;
}
.pager a, .pager span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	height: 42px;
	padding: 0 13px;
	border: 1px solid var(--line-2);
	font-size: 13px;
	color: var(--ink-2);
	background: transparent;
	transition: .3s var(--ease);
}
.pager a:hover {
	border-color: var(--ink);
	color: var(--ink);
}
.pager .is-active {
	background: var(--ink);
	border-color: var(--ink);
	color: #fff;
}
.pager .is-disabled {
	opacity: .38;
	pointer-events: none;
}
.pager svg {
	width: 15px;
	height: 15px;
}
/* ---------- 分页（showpage 结构美化，不改动原始标签） ---------- */
.showpage {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 10px;
	font-size: 11px;
	letter-spacing: .16em;
	color: var(--ink-3);
}
.showpage a,
.showpage .current {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 46px;
	height: 46px;
	padding: 0 15px;
	border: 1px solid var(--line-2);
	background: var(--white);
	font-size: 12.5px;
	font-weight: 400;
	letter-spacing: .08em;
	color: var(--ink-2);
	text-decoration: none;
	transition: .35s var(--ease);
}
.showpage a:hover {
	border-color: var(--blue);
	background: rgba(210, 146, 37, .06);
	color: var(--blue);
	transform: translateY(-1px);
}
.showpage .current {
	border-color: var(--blue);
	background: var(--blue);
	color: #fff;
	font-family: var(--f-serif);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0;
}
/* ---------- 图片说明 ---------- */
.figure {
	margin: 0;
}
.figure img {
	width: 100%;
}
.figure figcaption {
	margin-top: 12px;
	font-size: 12px;
	line-height: 1.7;
	color: var(--ink-3);
	padding-left: 14px;
	border-left: 2px solid var(--blue);
}
/* ---------- 通用小提示 ---------- */
.notice {
	display: flex;
	gap: 14px;
	padding: 20px 24px;
	background: rgba(210, 146, 37, .07);
	border-left: 2px solid var(--blue);
	font-size: 13px;
	line-height: 1.85;
	color: var(--ink-2);
}
.notice svg {
	width: 18px;
	height: 18px;
	flex: none;
	margin-top: 3px;
	color: var(--blue);
}
/* ---------- 内页 CTA 微调 ---------- */
.cta--inner {
	padding: 132px 0;
}

/* ---------- 响应式 ---------- */
@media (max-width: 1180px) {
.prod-grid {
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}
.case-grid {
	gap: 18px;
}
}
 @media (max-width: 1024px) {
.section {
	padding: 84px 0;
}
.phero {
	min-height: 420px;
	padding: 180px 0 64px;
}
.phero--slim {
	min-height: 300px;
	padding: 160px 0 46px;
}
.pagehead {
	padding: 136px 0 28px;
}
.phead {
	gap: 20px;
	margin-bottom: 40px;
}
.prod-grid {
	grid-template-columns: repeat(2, 1fr);
}
.case-grid {
	grid-template-columns: repeat(2, 1fr);
}
}
 @media (max-width: 780px) {
.prod-grid {
	gap: 14px;
}
.prod-card__body {
	padding: 16px 16px 18px;
}
.case-grid {
	grid-template-columns: 1fr;
}
.case-card {
	min-height: 340px;
}
.phero {
	min-height: 380px;
	padding: 160px 0 52px;
}
.phero__sub {
	font-size: 13.5px;
}
.pagehead {
	padding: 126px 0 24px;
}
}
 @media (max-width: 560px) {
.section {
	padding: 64px 0;
}
.prod-grid {
	grid-template-columns: 1fr;
}
.pager {
	margin-top: 38px;
}
.pager a,  .pager span {
	min-width: 36px;
	height: 36px;
	font-size: 12px;
}
.phero {
	min-height: 330px;
	padding: 150px 0 44px;
}
.phero__title {
	font-size: 30px;
}
.filterbar__label {
	width: 100%;
	margin: 0 0 4px;
}
}
