/* ============ Reset & Base ============ */
	*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
	html { scroll-behavior: smooth; }
	body {
		font-family: 'DM Sans', 'Noto Sans SC', sans-serif;
		font-weight: 400;
		color: #1a1a1a;
		background: #fff;
		line-height: 1.6;
		overflow-x: hidden;
		-webkit-font-smoothing: antialiased;
	}
	a { text-decoration: none; color: inherit; }
	img { max-width: 100%; display: block; }
	button { font-family: inherit; cursor: pointer; border: none; background: none; }
	ul { list-style: none; }

	/* ============ Announcement Bar (深红色) ============ */
	.announcement-bar {
		background: #67082a;
		color: #fff;
		text-align: center;
		padding: 15px 20px;
		font-size: 14px;
		letter-spacing: 0.5px;
	}
	.announcement-bar strong { color: #f5d5a0; font-weight: 700; }

	/* ============ Header ============ */
	.site-header {
		position: sticky;
		top: 0;
		z-index: 1000;
		background: #fff;
		padding: 0 40px;
		height: 72px;
		display: flex;
		align-items: center;
		justify-content: space-between;
		border-bottom: 1px solid #f0f0f0;
	}
	.site-logo {
		font-family: 'Lora', serif;
		font-size: 24px;
		font-weight: bold;
		letter-spacing: 3px;
		color: #1a1a1a;
	}
	.main-nav {
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		display: flex;
		gap: 28px;
		align-items: center;
	}
	.main-nav a {
		font-size: 14px;
		font-weight: 400;
		color: #1a1a1a;
		letter-spacing: 1px;
		transition: opacity .3s;
	}
	.main-nav a:hover { opacity: 0.6; }
	.header-actions { display: flex; gap: 18px; align-items: center; }
	.header-actions a {
		font-size: 13px;
		color: #1a1a1a;
		transition: opacity .3s;
	}
	.header-actions a:hover { opacity: 0.6; }
	.menu-toggle { display: none; font-size: 22px; }

	/* ============ Hero Carousel ============ */
	.hero-carousel {
	    position: relative;
        width: 100%;
        height: 60vh;
        min-height: 400px;
        max-height: 700px;
        overflow: hidden;
	}
	.hero-slide {
		position: absolute;
		inset: 0;
		opacity: 0;
		transition: opacity 1s ease-in-out;
	}
	.hero-slide.active { opacity: 1; z-index: 1; }
	.hero-slide .bg {
		position: absolute;
		inset: 0;
		background-size: cover;
		background-position: center;
		transform: scale(1.03);
		transition: transform 8s ease-out;
	}
	.hero-slide.active .bg { transform: scale(1); }
	.hero-slide .shadow-overlay {
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		height: 80%;
		background: linear-gradient(to top, rgba(7, 51, 112, 0.70) 0%, rgba(52, 117, 207, 0.35) 70%, transparent 100%);
		z-index: 1;
	}
	.hero-content {
		position: absolute;
		bottom: 18%;
		left: 8%;
		z-index: 2;
		color: #fff;
		max-width: 660px;
	}
	.hero-tag {
		font-size: 12px;
		letter-spacing: 4px;
		text-transform: uppercase;
		color: rgba(255,255,255,0.85);
		margin-bottom: 16px;
		font-weight: 400;
		opacity: 0;
		transform: translateY(16px);
		transition: all .7s ease .2s;
	}
	.hero-title {
		/*font-family: 'Lora', serif;*/
		font-size: 42px;
		font-weight: bold;
		line-height: 1.2;
		margin-bottom: 28px;
		opacity: 0;
		transform: translateY(20px);
		transition: all .7s ease .4s;
	
	}
	.hero-title em { font-style: italic; }
	.hero-cta {
		display: inline-block;
		font-size: 18px;
		letter-spacing: 2px;
		text-transform: uppercase;
		color: #fff;
		padding: 14px 32px;
		background: rgba(255,255,255,0.9);
		color: #1a1a1a;
		transition: all .3s;
		font-weight: 500;
		opacity: 0;
		transform: translateY(20px);
		transition: all .7s ease .6s, background-color .3s, color .3s;
	}
	.hero-cta:hover { background: #fff; }
	.hero-slide.active .hero-tag,
	.hero-slide.active .hero-title,
	.hero-slide.active .hero-cta {
		opacity: 1;
		transform: translateY(0);
	}

	/* Carousel dots */
	.hero-dots {
		position: absolute;
		bottom: 30px;
		left: 50%;
		transform: translateX(-50%);
		z-index: 5;
		display: flex;
		gap: 10px;
	}
	.hero-dot {
		width: 10px;
		height: 10px;
		border-radius: 50%;
		background: rgba(255,255,255,0.4);
		cursor: pointer;
		transition: background .3s, transform .3s;
		border: none;
	}
	.hero-dot.active {
		background: #fff;
		transform: scale(1.2);
	}

	/* ============ Product Carousel ============ */
	.product-section {
		padding: 80px 40px;
		text-align: center;
		background: #fff;
	}
	.product-eyebrow {
		font-size: 11px;
		letter-spacing: 4px;
		text-transform: uppercase;
		color: #999;
		margin-bottom: 16px;
	}
	.product-section-title {
		font-family: 'Lora', serif;
		font-size: 36px;
		font-weight: 400;
		color: #1a1a1a;
		margin-bottom: 16px;
	}
	.product-section-desc {
		font-size: 14px;
		color: #888;
		line-height: 1.7;
		max-width: 980px;
		margin: 0 auto 50px;
	}
	.product-carousel-wrapper {
		position: relative;
		max-width: 1780px;
		margin: 0 auto;
		overflow: hidden;
	}
	.product-carousel-wrapper:hover .product-nav-btn {
		opacity: 1;
	}
	.product-carousel {
		display: flex;
		transition: transform .5s ease;
	}
	.product-card {
		flex: 0 0 20%;
		padding: 0 12px;
		text-align: center;
	}
	.product-card-img {
		position: relative;
		overflow: hidden;
		aspect-ratio: 3/4;
		margin-bottom: 16px;
		background: #f5f0eb;
	}
	.product-card-img img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform .6s ease;
	}
	.product-card:hover .product-card-img img {
		transform: scale(1.05);
	}
	.product-nav-btn {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		width: 44px;
		height: 44px;
		border-radius: 50%;
		background: rgba(255,255,255,0.95);
		border: 1px solid #ddd;
		color: #1a1a1a;
		font-size: 20px;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		opacity: 0;
		transition: opacity .3s, background .3s;
		z-index: 3;
	}
	.product-nav-btn:hover {
		background: #fff;
		box-shadow: 0 2px 8px rgba(0,0,0,0.1);
	}
	.product-nav-btn.prev-btn { left: 16px; }
	.product-nav-btn.next-btn { right: 16px; }
	.product-card-name {
		font-family: 'Lora', serif;
		font-size: 15px;
		font-weight: 400;
		color: #1a1a1a;
		margin-bottom: 4px;
	}
	.product-card-price {
		font-size: 14px;
		color: #888;
	}
	.product-dots {
		display: flex;
		justify-content: center;
		gap: 8px;
		margin-top: 36px;
	}
	.product-dot {
		width: 8px;
		height: 8px;
		border-radius: 50%;
		background: #ddd;
		border: none;
		cursor: pointer;
		transition: background .3s;
	}
	.product-dot.active {
		background: #1a1a1a;
	}
	.product-view-all {
		display: inline-block;
		margin-top: 36px;
		font-size: 12px;
		letter-spacing: 2px;
		text-transform: uppercase;
		padding: 14px 36px;
		background: #f5f0eb;
		color: #1a1a1a;
		transition: all .3s;
	}
	.product-view-all:hover {
		background: #1a1a1a;
		color: #fff;
	}

	/* ============ Marquee ============ */
	.marquee-section {
	   border-bottom: 1px solid #ededed;
		padding: 24px 0;
		overflow: hidden;
		white-space: nowrap;
	}
	.marquee-track {
		display: inline-flex;
		gap: 50px;
		animation: marquee-scroll 35s linear infinite;
	}
	.marquee-item {
		display: inline-flex;
		align-items: center;
		gap: 12px;
		color: #563c22;
		font-family: 'Lora', serif;
		font-size: 14px;
		font-style: italic;
		letter-spacing: 0.5px;
	}
	.marquee-item::before {
		content: '✦';
		color: #d4b038;
		font-size: 14px;
		font-style: normal;
	}
	@keyframes marquee-scroll {
		from { transform: translateX(0); }
		to { transform: translateX(-50%); }
	}

	/* ============ Collage Tabs ============ */
	.collage-tabs {
		padding: 80px 40px;
		background: #fcf9f7;
	}
	.collage-tabs-header {
		text-align: center;
		margin-bottom: 50px;
	}
	.collage-tabs-header h2 {
		font-family: 'Lora', serif;
		font-size: 36px;
		font-weight: 400;
		color: #1a1a1a;
		margin-bottom: 12px;
	}
	.collage-tabs-header p {
		font-size: 15px;
		color: #888;
	}
	.tab-nav {
		display: flex;
		justify-content: center;
		gap: 40px;
		margin-bottom: 50px;
	}
	.tab-nav button {
		font-family: 'Lora', serif;
		font-size: 22px;
		font-weight: 400;
		color: #563c22;
		background: none;
		border: none;
		padding: 8px 0;
		cursor: pointer;
		transition: color .3s;
		position: relative;
	}
	.tab-nav button.active {
		color: #563c22;
	}
	.tab-nav button.active::after {
		content: '';
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 2px;
		background: #1a1a1a;
	}
	.tab-content { display: none; }
	.tab-content.active { display: flex; }
	.tab-panel {
		display: flex;
		align-items: center;
		max-width: 1780px;
		margin: 0 auto;
		gap: 60px;
	}
	.tab-panel-img {
		flex: 1.25;
		min-width: 0;
		overflow: hidden;
	}
	.tab-panel-img img {
		width: 100%;
		height: auto;
		object-fit: cover;
		display: block;
	}
	.tab-panel-text {
		flex: 0.75;
		min-width: 0;
		text-align: center;
		padding: 40px 20px;
	}
	.tab-panel-text h2 {
		font-family: 'Lora', serif;
		font-size: 42px;
		font-weight: 400;
		margin-bottom: 24px;
	}
	.tab-panel-text p {
	    text-indent: 2em;
		font-size: 15px;
		line-height: 1.8;
		color: #666;
		margin-bottom: 32px;
		max-width: 440px;
		margin-left: auto;
		margin-right: auto;
		text-align: left;
	}
	.tab-panel-text p em { font-style: italic; }
	.tab-btn {
		display: inline-block;
		font-size: 13px;
		letter-spacing: 2px;
		text-transform: uppercase;
		padding: 14px 36px;
		background: #ecddd4;
		color: #fff;
		transition: all .3s;
	}
	.tab-btn:hover { background: #333; }

	/* ============ Showcase (Image + Text alternating) ============ */
	.showcase {
		display: flex;
		align-items: stretch;
		min-height: 85vh;
	}
	.showcase.reverse { flex-direction: row-reverse; }
	.showcase-media {
		flex: 1;
		position: relative;
		overflow: hidden;
		min-height: 500px;
	}
	.showcase-media img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform 1.2s ease;
	}
	.showcase-media:hover img { transform: scale(1.04); }
	.showcase-text {
		flex: 1;
		display: flex;
		flex-direction: column;
		justify-content: center;
		padding: 80px 80px;
		background: #fff;
	}
	.showcase.light .showcase-text { background: #faf7f1; }
	.showcase.dark .showcase-text { background: #1a1a1a; color: #fff; }
	.showcase-eyebrow {
		font-size: 12px;
		letter-spacing: 4px;
		text-transform: uppercase;
		color: #999;
		margin-bottom: 20px;
		font-weight: 400;
	}
	.showcase.dark .showcase-eyebrow { color: rgba(255,255,255,0.5); }
	.showcase-title {
		font-family: 'Lora', serif;
		font-size: 44px;
		font-weight: 400;
		line-height: 1.2;
		margin-bottom: 24px;
	}
	.showcase-title em { font-style: italic; }
	.showcase-desc {
		font-size: 15px;
		line-height: 1.8;
		margin-bottom: 36px;
		opacity: 0.8;
		max-width: 440px;
	}
	.showcase-btn {
		display: inline-block;
		width: fit-content;
		font-size: 13px;
		letter-spacing: 2px;
		text-transform: uppercase;
		padding: 14px 36px;
		border: 1px solid currentColor;
		transition: all .3s;
		font-weight: 400;
	}
	.showcase-btn:hover {
		background: #1a1a1a;
		color: #fff;
		border-color: #1a1a1a;
	}
	.showcase.dark .showcase-btn:hover {
		background: #fff;
		color: #1a1a1a;
		border-color: #fff;
	}

	/* ============ Showcase Grid (3 columns) ============ */
	.showcase-grid {
		padding: 80px 40px 0;
		background: #fff;
	}
	.showcase-grid-header {
		text-align: center;
		max-width: 900px;
		margin: 0 auto 50px;
	}
	.showcase-grid-eyebrow {
		font-size: 12px;
		letter-spacing: 4px;
		text-transform: uppercase;
		color: #999;
		margin-bottom: 16px;
		font-weight: 400;
	}
	.showcase-grid-title {
		font-family: 'Lora', serif;
		font-size: 38px;
		font-weight: 400;
		color: #1a1a1a;
		line-height: 1.3;
		margin-bottom: 20px;
	}
	.showcase-grid-desc {
		font-size: 14px;
		line-height: 1.8;
		color: #888;
		max-width: 800px;
		margin: 0 auto;
	}
	.showcase-grid-cards {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 0;
	}
	.showcase-grid-card {
		position: relative;
		overflow: hidden;
		aspect-ratio: 3/4;
	}
	.showcase-grid-card img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform 1s ease;
	}
	.showcase-grid-card:hover img { transform: scale(1.05); }
	.showcase-grid-card-overlay {
		position: absolute;
		inset: 0;
		background: linear-gradient(to top, rgba(0,0,0,0.45) 0%, transparent 55%);
		display: flex;
		flex-direction: column;
		justify-content: flex-end;
		align-items: center;
		padding: 40px 30px;
		color: #fff;
		text-align: center;
	}
	.showcase-grid-card-sub {
		font-size: 11px;
		letter-spacing: 3px;
		text-transform: uppercase;
		opacity: 0.85;
		margin-bottom: 10px;
	}
	.showcase-grid-card-title {
		font-family: 'Lora', serif;
		font-size: 34px;
		font-weight: 400;
		margin-bottom: 22px;
	}
	.showcase-grid-card-btn {
		display: inline-block;
		/* font-size: 11px;
		letter-spacing: 2px;
		text-transform: uppercase;
		padding: 10px 24px;
		background: rgba(255,255,255);
		border-radius: 8px;
		color: #1a1a1a;
		transition: all .3s; */
	}
	/* .showcase-grid-card-btn:hover { background: #fff; } */

	/* Team card background overlay */
		.team-card-bg {
		position: relative;
		overflow: hidden;
	}
	.team-card-bg img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	.team-card-overlay-bottom {
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		background:#c6c3bc;
		/* background: linear-gradient(to top, rgba(240,237,232,1) 0%, rgba(240,237,232,0.95) 40%, rgba(240,237,232,0.8) 70%, transparent 100%); */
		padding: 15px 36px 20px;
		color: #ffffff;
	}
	.team-card-main-title {
		font-family: "Source Han Serif CN", "思源宋体", serif;
		font-size: 40px;
		font-weight: 700;
		margin-bottom: 8px;
		line-height: 1.2;
	}
	.team-card-sub {
		font-size: 18px;
		color: #ffffff;
		margin-bottom: 18px;
		font-weight: 400;
	}
	.team-card-desc {
		display: flex;
		gap: 20px;
	}
	.team-card-desc p {
		font-size: 13px;
		line-height: 1.8;
		color: #ffffff;
		flex: 1;
	}

	/* ============ Image Comparison Slider ============ */
	.comparison-section {
		padding: 48px 40px 0;
		background: #fff;
	}
	.comparison-container {
		max-width: 1400px;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		gap: 0;
	}
	.comparison-slider-wrap {
		flex: 0 0 50%;
		position: relative;
		overflow: hidden;
	}
	.comparison-slider {
		position: relative;
		display: block;
		overflow: hidden;
		--percent: 50%;
		user-select: none;
		-webkit-user-select: none;
	}
	.comparison-slider img {
		display: block;
		width: 100%;
		height: auto;
		pointer-events: none;
	}
	.comparison-media {
		display: block;
		position: relative;
		overflow: hidden;
		background: #f3f3f3;
	}
	.comparison-after {
		position: absolute;
		z-index: 1;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		overflow: hidden;
		clip-path: inset(0px 0px 0px var(--percent, 50%));
	}
	.comparison-button {
		position: absolute;
		z-index: 2;
		color: inherit;
		background-color: transparent;
		border: none;
		padding: 0;
		cursor: col-resize;
		top: 0;
		left: var(--percent, 50%);
		width: 28px;
		height: 100%;
		margin-left: -14px;
		transition: none;
	}
	.comparison-button::before {
		content: '';
		position: absolute;
		background-color: #fff;
		width: 0.2rem;
		height: 100%;
		left: 50%;
		margin-left: -0.1rem;
		top: 0;
		pointer-events: none;
	}
	.comparison-button span {
		position: absolute;
		top: 50%;
		left: 50%;
		width: 4.6rem;
		height: 4.6rem;
		transform: translate(-50%, -50%);
		border-radius: 50%;
		color: #222;
		background-color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		box-shadow: 0 9px 11px rgba(0,0,0,0.11);
		pointer-events: none;
	}
	.comparison-button span svg {
		width: 2.4rem;
		height: 2.4rem;
	}
	.comparison-wrapper {
		height: 720px;
	}
	.comparison-wrapper img {
		display: block;
		max-width: 100%;
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
		object-fit: cover;
		pointer-events: none;
	}
	.comparison-label {
		position: absolute;
		z-index: 1;
		background: none;
		box-shadow: none;
		padding: 0;
		top: 1rem;
		text-align: center;
		margin: 0;
		line-height: 2.4rem;
		align-items: center;
		justify-content: center;
		opacity: 1;
		visibility: visible;
		transition: opacity .25s ease;
		font-size: 14px;
		letter-spacing: 1px;
		color: #1a1a1a;
	}
	.comparison-label.before-label {
		left: 20px;
	}
	.comparison-label.after-label {
		left: auto;
		right: 20px;
	}
	.comparison-slider[data-animation] {
		--percent: 98%;
	}
	.comparison-slider.is-visible {
		--percent: 50%;
	}
	.comparison-slider.animating .comparison-after {
		transition-property: clip-path;
		transition-duration: 1s;
		transition-timing-function: ease;
	}
	.comparison-slider.animating .comparison-button {
		transition-property: left;
		transition-duration: 1s;
		transition-timing-function: ease;
	}
	.comparison-slider.dragging .comparison-label {
		opacity: 0;
		visibility: hidden;
	}
	.comparison-text {
		flex: 0 0 50%;
		display: flex;
		align-items: center;
		padding: 40px 76px 40px 80px;
	}
	.comparison-text-inner {
		width: 100%;
	}
	.comparison-subtitle {
		font-size: 12px;
		letter-spacing: 4px;
		text-transform: uppercase;
		color: #999;
		margin-bottom: 20px;
		font-weight: 400;
	}
	.comparison-title {
		font-family: 'Lora', serif;
		font-size: 38px;
		font-weight: 400;
		color: #1a1a1a;
		line-height: 1.2;
		margin-bottom: 24px;
	}
	.comparison-desc {
		font-size: 15px;
		line-height: 1.8;
		color: #666;
		margin-bottom: 32px;
	}
	.comparison-link {
		display: inline-block;
		font-size: 13px;
		letter-spacing: 2px;
		text-transform: uppercase;
		color: #1a1a1a;
		padding-bottom: 4px;
		border-bottom: 1px solid #1a1a1a;
		transition: opacity .3s;
	}
	.comparison-link:hover { opacity: 0.6; }

	/* ============ Image with Text ============ */
	.image-with-text-section {
		margin:48px 0;
		padding: 0;
		background: #fcf9f7;
		overflow: hidden;
	}
	.image-with-text-container {
		max-width: 1400px;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 0;
	}
	.image-with-text-image {
		flex: 0 0 50%;
		position: relative;
		overflow: hidden;
	}
	.image-with-text-image img {
		width: 100%;
		height: auto;
		display: block;
	}
	.image-with-text-content {
		flex: 0 0 50%;
		padding: 40px 30px 40px 20px;
	}
	.image-with-text-title {
		font-family: 'Lora', serif;
		font-size: 36px;
		font-weight: 400;
		color: #1a1a1a;
		line-height: 1.2;
		margin-bottom: 24px;
	}
	.image-with-text-desc {
		font-size: 15px;
		line-height: 1.8;
		color: #666;
		margin-bottom: 32px;
	}
	.image-with-text-btn {
		display: inline-block;
		font-size: 12px;
		letter-spacing: 2px;
		text-transform: uppercase;
		padding: 14px 32px;
		background: #e8ddd4;
		color: #1a1a1a;
		transition: all .3s;
		font-weight: 500;
	}
	.image-with-text-btn:hover {
		background: #d4c5b9;
	}

	/* ============ Featured Product Slider ============ */
	.featured-slider-section {
		padding: 100px 40px 36px;
		background: #fff;
		overflow: hidden;
	}
	.featured-slider-header {
		text-align: center;
		margin-bottom: 50px;
	}
	.featured-slider-title {
		font-family: 'Lora', serif;
		font-size: 36px;
		font-weight: 400;
		color: #1a1a1a;
	}
	.featured-slider-wrapper {
		position: relative;
		max-width: 1400px;
		margin: 0 auto;
		overflow: hidden;
		cursor: grab;
		user-select: none;
		-webkit-user-select: none;
	}
	.featured-slider-track {
		display: flex;
		transition: transform .6s ease;
	}
	.featured-slide {
		flex: 0 0 100%;
		display: flex;
		align-items: center;
		gap: 40px;
		padding: 0 20px;
	}
	.featured-slide-images {
		flex: 0 0 55%;
		position: relative;
		aspect-ratio: 1/1;
		overflow: visible;
	}
	.featured-slide-bg {
		position: absolute;
		top: 0;
		left: 0;
		width: 70%;
		height: 100%;
		object-fit: cover;
		z-index: 1;
	}
	.featured-slide-product {
		position: absolute;
		top: 10%;
		left: 25%;
		width: 50%;
		height: 80%;
		object-fit: cover;
		object-position: left center;
		z-index: 2;
		filter: drop-shadow(0 10px 30px rgba(0,0,0,0.15));
	}
	.featured-slide-contents {
		flex: 1;
		padding: 20px 0;
	}
	.featured-slide-name {
		font-family: 'Lora', serif;
		font-size: 32px;
		font-weight: 400;
		color: #1a1a1a;
		margin-bottom: 12px;
		line-height: 1.2;
	}
	.featured-slide-price {
		font-size: 16px;
		color: #1a1a1a;
		margin-bottom: 20px;
	}
	.featured-slide-price .price-original {
		text-decoration: line-through;
		color: #999;
		margin-left: 8px;
		font-size: 14px;
	}
	.featured-slide-desc {
		font-size: 14px;
		line-height: 1.8;
		color: #666;
		margin-bottom: 28px;
		max-width: 400px;
	}
	.featured-slide-btn {
		display: inline-block;
		font-size: 12px;
		letter-spacing: 2px;
		text-transform: uppercase;
		padding: 14px 32px;
		background: #e8ddd4;
		color: #1a1a1a;
		transition: all .3s;
		font-weight: 500;
	}
	.featured-slide-btn:hover {
		background: #d4c5b9;
	}
	.featured-slider-nav {
		display: flex;
		align-items: center;
		gap: 12px;
		margin-top: 30px;
	}
	.featured-slider-nav-btn {
		width: 36px;
		height: 36px;
		border-radius: 50%;
		background: #fff;
		border: 1px solid #ddd;
		color: #1a1a1a;
		font-size: 16px;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		transition: all .3s;
	}
	.featured-slider-nav-btn:hover {
		background: #f5f5f5;
	}
	.featured-slider-counter {
		font-size: 13px;
		color: #999;
		letter-spacing: 1px;
	}

	/* ============ Hero Banner ============ */
	.hero-banner-section {
		position: relative;
		width: 100%;
		padding: 120px 40px;
		background: url('https://www.huazhiyulc.com/static/index/image/flowers.jpg') center/cover no-repeat;
		text-align: center;
		color: #fff;
	}
	.hero-banner-section::before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(0,0,0,0.3);
	}
	.hero-banner-content {
		position: relative;
		z-index: 2;
		max-width: 900px;
		margin: 0 auto;
	}
	.hero-banner-subtitle {
		font-size: 13px;
		letter-spacing: 4px;
		text-transform: uppercase;
		margin-bottom: 24px;
		/* font-weight: 500; */
	}
	.hero-banner-title {
		font-family: 'Lora', serif;
		font-size: 32px;
		font-weight: 400;
		line-height: 1.3;
		margin-bottom: 24px;
	}
	.hero-banner-desc {
		font-size: 15px;
		line-height: 1.8;
		opacity: 0.9;
		max-width: 700px;
		margin: 0 auto;
	}

	/* ============ Gallery Images ============ */
	.gallery-section {
		padding: 80px 40px;
		background: #fff;
		text-align: center;
	}
	.gallery-title {
		font-family: 'Lora', serif;
		font-size: 36px;
		font-weight: 400;
		color: #1a1a1a;
		margin-bottom: 20px;
	}
	.gallery-desc {
		font-size: 14px;
		line-height: 1.8;
		color: #666;
		margin-bottom: 40px;
		max-width: 600px;
		margin-left: auto;
		margin-right: auto;
	}
	.gallery-grid {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 10px;
		max-width: 1400px;
		margin: 0 auto;
	}
	.gallery-item {
		position: relative;
		overflow: hidden;
		/* aspect-ratio: 1/1; */
		border-radius: 30px;
	}
	.gallery-item img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform .6s ease;
	}
	.gallery-item:hover img {
		transform: scale(1.05);
	}

	/* ============ Saint of Flowers Banner ============ */
	.saint-banner-section {
		position: relative;
		width: 100%;
		padding: 80px 40px;
		background: url('https://www.huazhiyulc.com/static/index/image/bg3.jpg') center/cover no-repeat;
		text-align: center;
		color: #fff;
	}
	.saint-banner-section::before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(0,0,0,0.25);
	}
	.saint-banner-content {
		position: relative;
		z-index: 2;
		max-width: 800px;
		margin: 0 auto;
	}
	.saint-banner-subtitle {
		font-size: 12px;
		letter-spacing: 4px;
		text-transform: uppercase;
		margin-bottom: 24px;
		font-weight: 500;
	}
	.saint-banner-title {
		font-family: 'Lora', serif;
		font-size: 40px;
		font-weight: 400;
		line-height: 1.3;
		margin-bottom: 20px;
	}
	.saint-banner-desc {
		font-size: 15px;
		line-height: 1.8;
		opacity: 0.95;
		margin-bottom: 32px;
	}
	.saint-banner-btn {
		display: inline-block;
		font-size: 12px;
		letter-spacing: 2px;
		text-transform: uppercase;
		padding: 14px 32px;
		background: #e8ddd4;
		color: #1a1a1a;
		transition: all .3s;
		font-weight: 500;
	}
	.saint-banner-btn:hover {
		background: #d4c5b9;
	}

	/* ============ Image Cards Grid ============ */
	.image-cards-section { padding: 0; }
	.image-cards-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
	.image-card {
		position: relative;
		overflow: hidden;
		aspect-ratio: 3/4;
	}
	.image-card img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform 1s ease;
	}
	.image-card:hover img { transform: scale(1.05); }
	.image-card-overlay {
		position: absolute;
		inset: 0;
		background: linear-gradient(to top, rgba(0,0,0,0.5) 0%, transparent 60%);
		display: flex;
		flex-direction: column;
		justify-content: flex-end;
		padding: 40px;
		color: #fff;
	}
	.image-card-sub {
		font-size: 12px;
		letter-spacing: 2px;
		text-transform: uppercase;
		opacity: 0.8;
		margin-bottom: 8px;
	}
	.image-card-title {
		font-family: 'Lora', serif;
		font-size: 32px;
		font-weight: 400;
		margin-bottom: 20px;
	}
	.image-card-btn {
		display: inline-block;
		width: fit-content;
		font-size: 13px;
		letter-spacing: 2px;
		text-transform: uppercase;
		padding: 12px 28px;
		background: #fff;
		color: #1a1a1a;
		transition: all .3s;
	}
	.image-card-btn:hover { background: #f0f0f0; }

	/* ============ Dual Image Cards ============ */
	.dual-cards { display: grid; grid-template-columns: 1fr 1fr; }
	.dual-card {
		position: relative;
		overflow: hidden;
		aspect-ratio: 3/4;
	}
	.dual-card img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform 1s ease;
	}
	.dual-card:hover img { transform: scale(1.05); }
	.dual-card-overlay {
		position: absolute;
		inset: 0;
		background: rgba(0,0,0,0.2);
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		padding: 40px;
		color: #fff;
		text-align: center;
	}
	.dual-card-sub {
		font-size: 12px;
		letter-spacing: 3px;
		text-transform: uppercase;
		opacity: 0.85;
		margin-bottom: 12px;
	}
	.dual-card-title {
		font-family: 'Lora', serif;
		font-size: 36px;
		font-weight: 400;
		margin-bottom: 28px;
	}
	.dual-card-btn {
		display: inline-block;
		font-size: 13px;
		letter-spacing: 2px;
		text-transform: uppercase;
		padding: 14px 36px;
		border: 1px solid #fff;
		color: #fff;
		transition: all .3s;
	}
	.dual-card-btn:hover { background: #fff; color: #1a1a1a; }

	/* ============ Footer ============ */
	.site-footer {
		background: #fcf9f7;
		color: #535353;
		padding: 70px 40px 30px;
	}
	.footer-top {
		display: grid;
		grid-template-columns: 1.5fr 1fr 1fr 1fr;
		gap: 50px;
		margin-bottom: 50px;
		max-width: 1400px;
		margin-left: auto;
		margin-right: auto;
	}
	.footer-brand h3 {
		font-family: 'Lora', serif;
		font-size: 30px;
		color: #000;
		margin-bottom: 16px;
		letter-spacing: 2px;
		font-weight: 400;
	}
	.footer-brand p { font-size: 14px; line-height: 1.8; }
	.footer-col h4 {
		font-size: 12px;
		letter-spacing: 2px;
		text-transform: uppercase;
		color: #000;
		margin-bottom: 20px;
		font-weight: 500;
	}
	.footer-col ul li { margin-bottom: 10px; }
	.footer-col ul a {
		font-size: 14px;
		color: #535353;
		transition: color .3s;
	}
	.footer-col ul a:hover { color: #fff; }
	.footer-bottom {
		border-top: 1px solid #2a2a2a;
		padding-top: 24px;
		text-align: center;
		font-size: 13px;
		color: #666;
		letter-spacing: 0.5px;
	}