/* cyrillic */
@font-face {
	font-family: 'Playfair Display';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url(fonts/nuFiD-vYSZviVYUb_rj3ij__anPXDTjYgFE_.woff2) format('woff2');
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
	font-family: 'Playfair Display';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url(fonts/nuFiD-vYSZviVYUb_rj3ij__anPXDTLYgFE_.woff2) format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
	font-family: 'Playfair Display';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url(fonts/nuFiD-vYSZviVYUb_rj3ij__anPXDTzYgA.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic */
@font-face {
	font-family: 'Playfair Display';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url(fonts/nuFiD-vYSZviVYUb_rj3ij__anPXDTjYgFE_.woff2) format('woff2');
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
	font-family: 'Playfair Display';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url(fonts/nuFiD-vYSZviVYUb_rj3ij__anPXDTLYgFE_.woff2) format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
	font-family: 'Playfair Display';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url(fonts/nuFiD-vYSZviVYUb_rj3ij__anPXDTzYgA.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic */
@font-face {
	font-family: 'Playfair Display';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url(fonts/nuFiD-vYSZviVYUb_rj3ij__anPXDTjYgFE_.woff2) format('woff2');
	unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* latin-ext */
@font-face {
	font-family: 'Playfair Display';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url(fonts/nuFiD-vYSZviVYUb_rj3ij__anPXDTLYgFE_.woff2) format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
	font-family: 'Playfair Display';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url(fonts/nuFiD-vYSZviVYUb_rj3ij__anPXDTzYgA.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 300;
	font-display: swap;
	src: url(fonts/pxiByp8kv8JHgFVrLDz8Z1JlFc-K.woff2) format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 300;
	font-display: swap;
	src: url(fonts/pxiByp8kv8JHgFVrLDz8Z1xlFQ.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url(fonts/pxiEyp8kv8JHgFVrJJnecmNE.woff2) format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url(fonts/pxiEyp8kv8JHgFVrJJfecg.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url(fonts/pxiByp8kv8JHgFVrLGT9Z1JlFc-K.woff2) format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url(fonts/pxiByp8kv8JHgFVrLGT9Z1xlFQ.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url(fonts/pxiByp8kv8JHgFVrLEj6Z1JlFc-K.woff2) format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url(fonts/pxiByp8kv8JHgFVrLEj6Z1xlFQ.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* =====================================================================
	 0. RESET
	 ===================================================================== */
/*ignore dark mode*/
:root {color-scheme:light}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { font-family: "Poppins", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
	sans-serif; color:#333; background:#fefaf7; }
img { max-width:100%; display:block; }
.visually-hidden { position:absolute; left:-9999px; }

.container, .header-inner, .footer-inner { max-width:1200px; margin:auto; padding:0 20px; }

/* =====================================================================
	 1. ANNOUNCEMENT BAR
	 ===================================================================== */
.announcement {
	background:#f8f8f8;
	text-align:center;
	padding:5px 0;
	color:#666;
	font-size:12px;
}

/* =====================================================================
	 2. HEADER
	 ===================================================================== */
.header {
	position:sticky;
	top:0;
	background:#fff;
	border-bottom:1px solid #eee;
	z-index:5000;
}

.header-inner {
	display:flex;
	align-items:center;
	gap:20px;
	padding:15px 0;
}

.logo {
	font-family: "Playfair Display", serif;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	font-size:24px;
	text-decoration:none;
	color:#333;
	margin-left: 20px;
}

/* Hamburger */
.hamburger {
	display:none;
	flex-direction:column;
	gap:5px;
	cursor:pointer;
	margin-left:15px;
}

.hamburger span {
	width:26px;
	height:2px;
	background:#333;
	border-radius: 100px;
	transition:.3s;
}

/* Toggle animation */
#nav-toggle:checked ~ .site-wrapper .header .hamburger span:nth-child(1) {
	transform: rotate(45deg) translate(6px,6px);
}
#nav-toggle:checked ~ .site-wrapper .header .hamburger span:nth-child(2) {
	opacity:0;
}
#nav-toggle:checked ~ .site-wrapper .header .hamburger span:nth-child(3) {
	transform: rotate(-45deg) translate(6px,-6px);
}

/* =====================================================================
	 2.1 TEXTS
	 ===================================================================== */
.section-header {
	text-align: center;
	margin: 15px 0;
	gap: 1.5rem;
}

.section-header.flex {
	text-align: left;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
}

.section-header h2 {
	font-family: "Playfair Display", serif;
	font-size: 1.8rem;
	margin: 0 0 0.5rem;
}

.section-header p {
	margin-left: 2px;
	font-size: 0.95rem;
	color: #8b807d;
}

.link-inline {
	font-size: 0.9rem;
	text-decoration: none;
	color: #3e3534;
	padding-bottom: 0.1rem;
}

.link-inline:hover {
	color: #d18890;
}

/* =====================================================================
	 3. NAVIGATION (DESKTOP)
	 ===================================================================== */
.nav {
	display:flex;
	align-items:center;
	gap:30px;
}

.nav-menu {
	display:flex;
	list-style:none;
	gap:25px;
}

.nav-link {
	display:flex;
	align-items:center;
	gap:6px;
	cursor:pointer;
	padding:8px 4px;
	font-size:15px;
	background:none;
	border:none;
	color:#333;
	text-decoration:none;
	text-transform:uppercase;
}
.nav-link a{color:#333;text-decoration:none}
.nav-link:hover, .nav-link a:hover { color:#ff6b9d; }

.arrow { display:none }

/* Desktop Mega Menu */
@media (min-width:769px) {

	.mega-panel {
		position:absolute;
		top:100%; left:50%;
		transform:translateX(-50%);
		width:100%;
		background:#fff;
		padding:30px 40px;
		border-top:1px solid #f4f4f4;
		border-bottom:1px solid #f4f4f4;
		opacity:0;
		visibility:hidden;
		transition:.25s ease;
		z-index:4000;
	}

	.has-panel:hover > .mega-panel {
		opacity:1;
		visibility:visible;
	}

	.mega-inner {
		display:grid;
		grid-template-columns: 1fr;
		margin: 0 auto;
		width: min(960px, 100%);
	}

	.mega-banner { border-radius: 3px; overflow:hidden; }

	.banner-text {
		background:linear-gradient(135deg,#ffecd2,#fcb69f);
		padding:14px;
	}

	.banner-text h4 { font-size:16px; margin-bottom:6px; font-weight:600; }
	.banner-link { text-decoration:none; color:#ff6b9d; font-weight:600; font-size:14px; }

	.mega-columns {
		display:grid;
		grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
		gap:30px;
	}

	.mega-col h5 {
		margin-bottom:6px;
		font-weight:600;
		font-size:15px;
	}
	.mega-col h5 a {
		color: #333;
		text-decoration:none;
	}
	.mega-col h5 a:hover { color:#ff6b9d; }

	.mega-col ul { list-style:none; }
	.mega-col ul li { margin-bottom:6px; }

	.mega-col ul li a {
		text-decoration:none;
		color:#666;
		font-size:14px;
	}
	.mega-col ul li a:hover { color:#ff6b9d; }

	/* Header alignment fix */
	.header-inner {
		display: grid;
		grid-template-columns: 1fr auto 1fr;
		align-items: center;
	}

	.header .nav { justify-content: center; }
	.header-utils { justify-self:end; }
	.hamburger { display:none!important; }
}

/* =====================================================================
	 4. HEADER ICONS
	 ===================================================================== */
.header-utils {
	margin-right:20px;
	display:flex;
	gap:20px;
}

.util-btn {
	text-decoration:none;
	position:relative;
	width: 20px;
	height: 19px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

.util-btn.search {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' focusable='false' width='18' height='18' viewBox='0 0 18 18'><path d='M12.336 12.336c2.634-2.635 2.682-6.859.106-9.435c-2.576-2.576-6.8-2.528-9.435.106C.373 5.642.325 9.866 2.901 12.442c2.576 2.576 6.8 2.528 9.435-.106zm0 0L17 17' fill='none' stroke='%23333' stroke-width='1'/></svg>");
}

.util-btn.search:hover {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' focusable='false' width='18' height='18' viewBox='0 0 18 18'><path d='M12.336 12.336c2.634-2.635 2.682-6.859.106-9.435c-2.576-2.576-6.8-2.528-9.435.106C.373 5.642.325 9.866 2.901 12.442c2.576 2.576 6.8 2.528 9.435-.106zm0 0L17 17' fill='none' stroke='%23ff6b9d' stroke-width='1'/></svg>");
}

.util-btn.cart {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' focusable='false' width='20' height='19' viewBox='0 0 20 19'><path d='M3 7H17L18 18H2L3 7Z' fill='none' stroke='%23333' stroke-width='1'/><path d='M13 4V4C13 2.34315 11.6569 1 10 1V1C8.34315 1 7 2.34315 7 4V4' fill='none' stroke='%23333' stroke-width='1'/></svg>");
}

.util-btn.cart:hover {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' focusable='false' width='20' height='19' viewBox='0 0 20 19'><path d='M3 7H17L18 18H2L3 7Z' fill='none' stroke='%23ff6b9d' stroke-width='1'/><path d='M13 4C13 2.343 11.657 1 10 1C8.343 1 7 2.343 7 4' fill='none' stroke='%23ff6b9d' stroke-width='1'/></svg>");
}

.util-btn.wishlist {
	background-image: url("data:image/svg+xml;utf8,<svg focusable='false' width='27' height='25' viewBox='0 0 15 15' xmlns='http://www.w3.org/2000/svg'><path d='M7.5 13.9l-.4-.3C6.9 13.4 2.5 10.1 1.3 8.8C.4 7.7-.1 6.4 0 5.1c.1-1.2.7-2.2 1.6-3c.9-.8 2.3-1 3.6-.8C6.1 1.5 6.9 2 7.5 2.6c.6-.6 1.4-1.1 2.4-1.3c1.3-.2 2.6 0 3.5.8c.9.7 1.5 1.8 1.6 3c.1 1.3-.3 2.6-1.3 3.7c-1.2 1.4-5.6 4.7-5.7 4.8l-.5.3z' fill='none' stroke='%23444' stroke-width='0.8' stroke-linejoin='round'/></svg>");
}

.util-btn.wishlist:hover {
	background-image: url("data:image/svg+xml;utf8,<svg focusable='false' width='27' height='25' viewBox='0 0 15 15' xmlns='http://www.w3.org/2000/svg'><path d='M7.5 13.9l-.4-.3C6.9 13.4 2.5 10.1 1.3 8.8C.4 7.7-.1 6.4 0 5.1c.1-1.2.7-2.2 1.6-3c.9-.8 2.3-1 3.6-.8C6.1 1.5 6.9 2 7.5 2.6c.6-.6 1.4-1.1 2.4-1.3c1.3-.2 2.6 0 3.5.8c.9.7 1.5 1.8 1.6 3c.1 1.3-.3 2.6-1.3 3.7c-1.2 1.4-5.6 4.7-5.7 4.8l-.5.3z' fill='none' stroke='%23ff6b9d' stroke-width='0.8' stroke-linejoin='round'/></svg>");
}

.badge {
	background:#ff6b9d;
	color:white;
	font-size:11px;
	padding:0 5px;
	border-radius: 3px;
	position:absolute;
	top:-6px; right:-8px;
}

/* =====================================================================
	 5. MOBILE NAVIGATION
	 ===================================================================== */
.nav-overlay { display:none; }
.nav-mobile-header { display:none; }
.submenu-toggle { display:none; }

@media (max-width:768px) {
	.logo {margin:0 auto}

	.hamburger { display:flex; }

	.nav {
		position:fixed;
		top:0; left:0;
		height:100vh;
		width:85%;
		max-width:380px;
		background:#ffffff;
		box-shadow:6px 0 25px rgba(0,0,0,.12);
		overflow-y:auto !important;
		transform:translateX(-100%);
		opacity:0;
		transition:transform .35s cubic-bezier(.4,0,.2,1),
					 opacity .35s ease;
		flex-direction:column;
		z-index:4000;
		gap:0px;
	}
	.nav-menu {
		overflow-y:auto !important;
	}

	#nav-toggle:checked ~ .site-wrapper .header .nav {
		transform:translateX(0);
		opacity:1;
	}

	#nav-toggle:checked ~ .nav-overlay {
		display:block;
		position:fixed;
		inset:0;
		background:rgba(0,0,0,0.45);
		backdrop-filter:blur(2px);
		z-index:3500;
	}

	.nav-mobile-header {
		display:flex;
		align-items:center;
		justify-content:space-between;
		padding:0px 22px;
		background:#fafafa;
		border-bottom:1px solid #ececec;
		width:100%;
	}

	.nav-close { font-size:30px; color:#333; cursor:pointer; width:50px; border-radius: 3px; }
	.nav-close:hover { background:#eaeaea; }

	.nav-menu {
		gap:0!important;
		width:100%;
		flex-direction:column;
	}

	.nav-item { width:100%; border-bottom:1px solid #f4f4f4; }
	.nav-link { padding:18px 24px; font-size:17px; font-weight:500; color:#333; }

	.nav-link .arrow { display:block; margin-left: auto;}

	.submenu-toggle:checked ~ .nav-link .arrow {
		transform:rotate(45deg);
		color:#ff6b9d;
	}

	.mega-panel {
		background:#fafafa;
		display:none;
		padding:14px 0 20px;
		border-left:3px solid #ff6b9d1f;
		box-shadow:none;
		position:static;
	}

	.submenu-toggle:checked ~ .mega-panel { display:block; }

	.mega-inner { display:block; }

	.mega-columns { padding-left:22px; }
	.mega-col h5 { margin:16px 0 6px; font-size:15px; color:#444; font-weight:600; }
	.mega-col h5 a {
		color: #333;
		text-decoration:none;
	}
	.mega-col h5 a:hover { color:#ff6b9d; }
	.mega-col ul li{list-style:none}
	.mega-col ul li a {
		display:block;
		padding:8px;
		font-size:15px;
		color:#666;
		text-decoration:none;
	}
	.mega-col ul li a:hover{color:#ff6b9d}
	.mega-banner { display:none; }

	.section-header.flex{text-align:center; display:grid;justify-content:normal;align-items:start;gap:10px}
}

/* =====================================================================
	 6. HERO
	 ===================================================================== */
.hero {
	padding: 120px 0;
	text-align: center;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}
.hero-inner {text-align:left; margin:auto; }
.hero h1 { font-family:"Playfair Display", serif;font-size:2.5rem; margin-bottom:12px; text-shadow:2px 2px 18px rgba(255,255,255,1)}
.hero p { margin-bottom:25px; text-shadow:1px 1px 4px rgba(255,255,255,1)}

.btn-primary {
	background-color:#ff6b9d;
	padding:12px 30px;
	border-radius: 3px;
	color:white;
	text-decoration:none;
	font-weight:600;
}
.btn-primary:hover {background-color:#e85a8a;}

/* =====================================================================
	 7. CATEGORIES
	 ===================================================================== */
.categories { padding:25px 0; }

.grid-4 {
	display:grid;
	gap:30px;
	grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
}

.category-card {
	background:white;
	border-radius: 3px;
	padding-bottom:15px;
	text-align:center;
	box-shadow:0 1px 3px rgba(0,0,0,0.08);
	transition:.3s;
}
.category-card:hover {
	transform:translateY(-6px);
	box-shadow:0 3px 6px rgba(0,0,0,0.15);
}
.category-card h3 { margin-top:14px; }

/* =====================================================================
	 8. PRODUCTS (General product cards)
	 ===================================================================== */

.product-list {
	flex: 1;
	display: grid;
	gap: 30px;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	margin-bottom:25px;
}

.product {
	background: #fff;
/*	border: 1px solid #eee;*/
	border-radius: 3px;
	overflow: hidden;
	text-align: center;
	transition: transform .25s ease, box-shadow .25s ease;
	position: relative;
}

.product:hover {
	transform: translateY(-6px);
/*	box-shadow: 0 1px 3px rgba(0,0,0,0.08);*/
}

.product h3 {
	font-size:14px;
	font-weight: 400;
/*	height: 45px;*/
	line-height: 1.55;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	overflow: hidden;
}

.product p {
	padding-top:3px;
	font-size:12px;
	color: #777;
}

.product a {
	text-decoration:none;
	color: #333;
}

.product-image {
	position: relative;
	display: block;
	overflow: hidden;
	width: 100%;
}

.product-image img {
	aspect-ratio: 1 / 1;
	width: 100%;
	height: auto;
	display: block;
	opacity: 0;
	transition: transform 0.4s ease, opacity 0.35s ease;
}

/*lazy load*/
.product-image::after {
    content: "";
    position: absolute;
    inset: 0;
    margin: auto;
    width: 22px;
    height: 22px;
    border: 2px solid #e6dad4;
    border-top-color: #ff6b9d;
    border-radius: 50%;
    animation: spin 0.7s linear infinite;
}

.product-image:not(.image-loading)::after {
    display: none;
}

.product-image:not(.image-loading) img {
    opacity: 1;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}
/*end of lazy load*/

.product:hover img {
	transform: scale(1.07);
}

.product-content {
	padding: 0 12px 0;
}

.product-bottom-row {
	display: flex;
	align-items: center;
	justify-content: space-evenly;
	gap: 14px;
	padding-bottom:5px;
}

.product-price {
	font-size: 1rem;
	color: #a3948d;
}

.product-price s{
		font-size: 0.85rem;
}

.add-to-cart {
	background-color: #ff6b9d;
	font-size: 0.8rem;
	font-weight: 600;
	padding: 10px 12px 8px 38px;
	border-radius: 3px;
	transition: background .2s ease;
	text-decoration: none;
	text-transform: uppercase;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 19'><path d='M3 7H17L18 18H2L3 7Z' fill='none' stroke='%23fff' stroke-width='2'/><path d='M13 4C13 2.343 11.657 1 10 1C8.343 1 7 2.343 7 4' fill='none' stroke='%23fff' stroke-width='2'/></svg>");
	background-repeat: no-repeat;
	background-position: 10px;
	background-size: 20px;
	color: white;
	border: none;
	cursor: pointer;
}

.add-to-cart:hover {
	background-color: #e85a8a;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 19'><path d='M2 6h16l1 13H1L2 6zm8-6c2.2 0 4 1.8 4 4h-2c0-1.1-.9-2-2-2s-2 .9-2 2H6c0-2.2 1.8-4 4-4z' fill='%23fff'/></svg>");
}

.wishlist-btn {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.9);
	border: 1px solid #eee;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: .25s ease;
	z-index: 20;

	background-image: url("data:image/svg+xml;utf8,<svg viewBox='0 0 15 15' xmlns='http://www.w3.org/2000/svg'><path d='M7.5 13.9l-.4-.3C6.9 13.4 2.5 10.1 1.3 8.8C.4 7.7-.1 6.4 0 5.1c.1-1.2.7-2.2 1.6-3c.9-.8 2.3-1 3.6-.8C6.1 1.5 6.9 2 7.5 2.6c.6-.6 1.4-1.1 2.4-1.3c1.3-.2 2.6 0 3.5.8c.9.7 1.5 1.8 1.6 3c.1 1.3-.3 2.6-1.3 3.7c-1.2 1.4-5.6 4.7-5.7 4.8l-.5.3zM4.2 2.7c-.6 0-1.2.2-1.7.6c-.6.5-.9 1.2-1 1.9c-.1.9.3 1.8.9 2.6c.9 1 3.9 3.4 5.1 4.3c1.2-.9 4.2-3.3 5.1-4.3c.7-.8 1-1.7.9-2.6c-.1-.8-.4-1.4-1-1.9c-.6-.5-1.5-.7-2.3-.5C9.3 3 8.6 3.5 8.2 4.2l-.7 1.2l-.7-1.2c-.4-.7-1.1-1.2-1.9-1.4C4.7 2.8 4.4 2.7 4.2 2.7z' fill='%23444'/></svg>");

	background-repeat: no-repeat;
	background-position: center;
	background-size: 16px;
}

.wishlist-btn:hover {
	border-color: #ff6b9d;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 15'><path d='M7.5 13.9l-.4-.3C6.9 13.4 2.5 10.1 1.3 8.8C.4 7.7-.1 6.4 0 5.1C.1 3.9.7 2.9 1.6 2.1C2.5 1.3 3.9 1.1 5.2 1.3c.9.2 1.7.7 2.3 1.3c.6-.6 1.4-1.1 2.4-1.3C11.2 1.1 12.5 1.3 13.4 2.1C14.3 2.9 14.9 3.9 15 5.2c.1 1.2-.3 2.5-1.3 3.6c-1.2 1.3-5.6 4.6-5.7 4.8l-.5.3z' fill='%23FF6B9D'/></svg>")

}

.product-badge {
	position: absolute;
	top: 10px;
	left: 10px;
	background: #e7b7be;
	color: white;
	padding: 2px 8px;
	font-size: 0.8rem;
	border-radius: 3px;
	z-index: 3;
}

.product-badge.sale {
	background: #ff6b9d;
}

.product-badge.soldout {
	background: #f9f1ed;
	color:#999;
}

.product-badge.variants {
	background: none;
	color: #8b807d;
	text-shadow: 1px 1px 2px white;
	bottom: 5px;
	right: 0;
	top: auto;
	left: auto;
	z-index: 1;
	font-size: 10px;
}


/* =====================================================================
	 11. FOOTER
	 ===================================================================== */
.site-footer {
	background: #2f2623;
	color: #f7eee9;
}

.footer-inner {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 2.2rem;
	padding:20px 20px;
}

.footer-column h4 {
	margin: 0 0 0.7rem;
	font-size: 0.95rem;
	text-transform: uppercase;
	letter-spacing: 0.13em;
}

.footer-column ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.footer-column li + li {
	margin-top: 0.35rem;
}

.footer-column a {
	text-decoration: none;
	color: #f7eee9;
	font-size: 0.88rem;
}

.footer-column a:hover {
	text-decoration: underline;
}

.footer-column-last p {
	margin: 0 0 0.8rem;
	font-size: 0.9rem;
}

.footer-social {
	display: flex;
	flex-wrap: wrap;
	gap: 0.9rem;
}

.footer-social a {
	font-size: 0.85rem;
	text-decoration: none;
	color: #f7eee9;
	border-bottom: 1px solid rgba(247, 238, 233, 0.45);
}

.footer-social a:hover {
	border-color: #e7b7be;
	text-decoration: none;
}

.footer-bottom {
	border-top: 1px solid rgba(247, 238, 233, 0.18);
	padding: 0.9rem 0;
	font-size: 0.8rem;
}

.footer-bottom-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 0.9rem;
}

.footer-bottom-links {
	display: flex;
	gap: 1.1rem;
}

.footer-bottom-links a {
	text-decoration: none;
	color: #f7eee9;
}

.footer-bottom-links a:hover {
	text-decoration: underline;
}


/* =====================================================================
	 13. PRODUCT LISTING PAGE (Filters + Sorting + Layout)
	 ===================================================================== */

/* Wrapper */
.product-listing {
	padding: 25px 0;
	background-color: #fff;
}

/* Header */
.listing-header {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 16px;
}

.listing-eyebrow {
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: #999;
	margin-bottom: 6px;
}

.product-listing h1 {
	font-family: "Playfair Display", serif;
	font-size: 2.3rem;
	font-weight: 600;
	color: #333;
	margin-bottom: 6px;
}

.product-listing-intro {
	margin-bottom:15px;
	font-size: 0.85rem;
	color: #645652;
	text-align: justify;
}

.listing-result-count {
	font-size: 0.85rem;
	color: #666;
}

.listing-controls {
	display: flex;
	align-items: center;
	gap: 12px;
}

/* Filter pill */
.filters-pill {
	border-radius: 3px;
	border: 1px solid #eee;
	padding: 8px 16px 8px 35px;
	background-color: #fff;
	font-size: 0.9rem;
	font-weight: 500;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.04);
	transition: all 0.2s ease;
	background-image: url("data:image/svg+xml;utf8,\
<svg focusable='false' width='16' height='16' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'>\
<path d='M0 4h16M0 12h16' fill='none' stroke='%23333' />\
<circle cx='5' cy='4' r='2' fill='%23fff' stroke='%23333' stroke-width='1' />\
<circle cx='11' cy='12' r='2' fill='%23fff' stroke='%23333' stroke-width='1' />\
</svg>");
	background-repeat: no-repeat;
	background-position: 10px;
	background-size: auto;
}
.filters-pill:hover {
	border-color: #ff6b9d;
}

.filters-btn {
	background-color: #ff6b9d;
	font-size: 0.8rem;
	padding: 10px 12px 8px 12px;
	border-radius: 3px;
	transition: background .2s ease;
	text-decoration: none;
	text-transform: uppercase;
	color: white;
	border: none;
	cursor: pointer;
}

.filters-btn:hover {
	background-color: #e85a8a;
}

.filters-btn-flex{
	display: flex;
	align-items: center;
	justify-content: end;
	padding-top: 18px;
}


/* Sorting */
.sort-select-wrapper {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 0.9rem;
	color: #777;
}
.sort-select {
	-webkit-appearance: none;
	appearance: none;

	min-width: 180px;
	padding: 8px 34px 8px 14px;
	color: #333;
	border-radius: 3px;
	border: 1px solid #eee;
	background-color: #fff;
	box-shadow: 0 1px 3px rgba(0,0,0,0.04);

	font-size: 0.9rem;
	font-family: "Poppins", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	cursor: pointer;

	background-image: url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'>\
<path d='M0 0l5 6 5-6' fill='%23666'/></svg>");
	background-repeat: no-repeat;
	background-position: right 12px center;
	background-size: 10px 6px;
}

.sort-select:hover {
	border-color: #ff6b9d;
}

/* Main layout */
.products-layout {
	display: flex;
	align-items: flex-start;
	width:100%;
	margin-top: 25px;
}

.products-layout > .product-grid {
	flex: 1;
}

/* Filters panel */
.filters-panel {
	width: 260px;
	flex-shrink: 0;
	padding: 20px 18px;
	border-radius: 3px;
	background-color: #fdfdfd;
	border: 1px solid #eee;
	box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.filter-section + .filter-section {
	margin-top: 20px;
}

.filter-section h3 {
	font-size: 0.85rem;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: #999;
	margin-bottom: 10px;
}

.filter-options {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.filter-option {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 0.9rem;
	color: #555;
	cursor: pointer;
}

/* Size pills */
.filter-options--pill {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.size-pill {
	border-radius: 3px;
	border: 1px solid #e5e5e5;
	padding: 6px 12px;
	font-size: 0.85rem;
	background-color: #fff;
	cursor: pointer;
	transition: all 0.15s ease;
}
.size-pill:hover { border-color: #ff6b9d; }
.size-pill--active {
	border-color: #ff6b9d;
	background-color: #ffe5ef;
	color: #d2467a;
}

/* Price filter */
.filter-price input[type="range"] { width:100%; }
.filter-price-labels {
	display:flex;
	justify-content:space-between;
	font-size:0.8rem;
	color:#999;
	margin-top:4px;
}
.filter-price-value {
	font-weight:500;
	color:#555;
}

/* Color dots */
.filter-colors {
	display:flex;
	flex-wrap:wrap;
	gap:8px;
}
.filter-color-dot {
	width:24px;
	height:24px;
	border-radius: 3px;
	border:2px solid transparent;
	background-color:var(--dot-color,#eee);
	cursor:pointer;
	transition:all .2s ease;
}
.filter-color-dot:hover {
	transform:scale(1.05);
	box-shadow:0 0 0 2px rgba(255,107,157,.2);
}

/* ==========================================
	 ACTIVE FILTERS BAR
========================================== */
.active-filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 14px;
	padding-top: 12px;
	border-radius: 3px;
}

.active-filters-list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

/* Filter pill */
.filter-tag {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 10px;
	font-size: 0.85rem;
	background: #fff;
	border: 1px solid #eee;
	border-radius: 3px;
	box-shadow:0 1px 3px rgba(0,0,0,0.04);
	text-decoration: none;
	color: #333;
}

.filter-tag span {
	font-size: 1rem;
	line-height: 1;
	color: #b2a39d;
}

.filter-tag:hover {
	border-color: #ff6b9d;
	color: #d2467a;
}

/* Clear all */
.filter-tag.clear {
	border:none;
	box-shadow:none;
}

@media (max-width: 992px) {
	.products-layout {
	flex-wrap: wrap;
	}
	.filters-accordion {
	width: 100%;
	order: 1;
	}
	.product-list {
	width: 100%;
	order: 2;
	gap: 15px;
	margin-bottom:15px;
	}



	/* COLLAPSED default state */
	.filters-panel {
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	padding: 0 18px;
	transform: translateY(-8px);
	transition: all .35s ease;
	border: 1px solid #eee;
	border-radius: 3px;
	background: #fafafa;
	}

	/* ✅ EXPANDED when toggle is checked */
	#filters-toggle:checked ~ .products-layout .filters-accordion .filters-panel {
	max-height: 2000px;
	opacity: 1;
	padding: 20px 18px;
	transform: translateY(0);
	margin-bottom:25px;
	}

	/* ✅ Active styling for Filters button */
	#filters-toggle:checked ~ .listing-header .listing-controls .filters-pill {
	border-color: #ff6b9d;
	background-color: #ffe5ef;
	color: #d2467a;
	}

	.filters-accordion {
	width: 100%;
	}
}


/* DESKTOP BEHAVIOR (unchanged) */
@media (min-width: 993px) {
	.filters-accordion {
		width: 260px;
		flex-shrink: 0;
	}
	#filters-toggle:checked ~ .products-layout .filters-accordion {
		width: 260px !important; /* normal desktop width */
		margin-right: 32px;
	}

	/* Hide filters panel entirely from layout */
	.filters-accordion {
		width: 0 !important;
		flex-shrink: 0 !important;
		overflow: hidden !important;
	}

	/* Product grid expands to full width */
	.products-layout .product-list {
		width: 100% !important;
		flex: 1 !important;
	}
}

.filters-panel {
	max-height: 0 !important;
	overflow: hidden !important;
	opacity: 0 !important;
	padding: 0 18px !important;
	transform: translateY(-8px);
	transition: all .35s ease;
}

/* Show filters only when toggle is active */
#filters-toggle:checked ~ .products-layout .filters-accordion .filters-panel {
	max-height: 2500px !important;
	opacity: 1 !important;
	padding: 20px 18px !important;
	transform: translateY(0);
}


.products-layout .product-list,
.filters-accordion {
	transition: all .3s ease;
}


/* =========================================================
	 Page Text Layout for Info Pages
	 ========================================================= */
.page-text {
	max-width: 800px;
	margin: 0 auto;
	font-size: 16px;
	line-height: 1.7;
	color: rgb(75, 85, 57);
	text-align: justify;
}

.page-text p {
	margin-bottom: 1.2rem;
}

.page-text h3 {
	font-size: 20px;
	font-weight: 600;
	margin-top: 2rem;
	margin-bottom: 0.8rem;
	color: rgb(60, 71, 44);
}

.page-text img {
	float: left;
	width: 360px;
	margin: 0 14px 10px 0;
	border-radius: 3px;
}

.page-text ul {
	list-style: disc;
	padding-left: 1.5rem;
	margin-bottom: 1.2rem;
}

.page-text li {
	margin-bottom: 0.4rem;
}

.page-text a {
	color: rgb(90, 110, 75); /* soft muted green link */
	text-decoration: underline;
}

.page-text a:hover {
	color: rgb(55, 70, 45);
}

/* ============================================
	 PAGINATION
=============================================== */

.pagination {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
	margin: 0 0 20px;
}

.page-btn {
	padding: 8px 14px;
	border: 1px solid #e5e5e5;
	background: #fff;
	color: #555;
	font-size: 0.9rem;
	border-radius: 3px;
	cursor: pointer;
	text-decoration: none;
	transition: all .2s ease;
}

.page-btn:hover {
	border-color: #ff6b9d;
	color: #d2467a;
	background: #ffe5ef;
}

.page-btn.active {
	background: #ff6b9d;
	border-color: #ff6b9d;
	color: #fff;
	font-weight: 600;
}

.page-btn.disabled {
	opacity: .4;
	pointer-events: none;
}

.page-dots {
	padding: 8px 6px;
	color: #999;
	font-size: 1rem;
}

/* Breadcrumb */
.breadcrumb-section {
	background: #f8f8f8;
	padding: 8px 0;
}

.breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	font-size: 0.8rem;
	color: #8b807d;
}

.breadcrumb a {
	color: #666666;
	text-decoration: none;
}

.breadcrumb a:hover {
	color: #ff6b9d;
}

.breadcrumb .separator {
	color: #999999;
}

.breadcrumb .current {
	font-weight: 500;
	color: #333333;
}

/* =====================================================================
	 14. RESPONSIVE ADJUSTMENTS
	 ===================================================================== */

@media (max-width:992px) {
	.products-layout { flex-direction:column; }
	.filters-panel { width:100%; order:-1; }
	.listing-header { flex-direction:column; align-items:flex-start; margin-bottom:0}
	.listing-controls { width:100%; justify-content:space-between; }
	.footer-inner {grid-template-columns: repeat(2, minmax(0, 1fr));}
	.header .nav {
		overflow: hidden; /* hide overflow outside */
 		justify-content: left;
	}
	.nav-menu {
		gap: 15px;
		overflow-x: auto;
		overflow-y: hidden;
		scrollbar-width: thin;              /* Firefox */
		-webkit-overflow-scrolling: touch;  /* Smooth scroll */
	}
}

@media (max-width:600px) {
	.container {padding: 0 15px}
	.product-list {grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));}
	.product h3 {align-items:normal;font-size:11px;height:18px;white-space:nowrap;text-overflow:ellipsis;display:block;}
	.product p {font-size:9px}
	.product-price {font-size: 0.8rem}
	.product-price s{font-size: 0.65rem}

	.product-listing { padding:10px 0; }
	.product-listing h1 { font-size:1.8rem; }
	.listing-controls { flex-wrap:wrap; gap:8px; }
	.filters-panel { box-shadow:none; border-radius: 3px; }
	.sort-select-wrapper label {display: none;}
	.footer-inner {grid-template-columns: 1fr;}
	.page-text img {width:100%;float:none}
	.pagination {gap: 6px;}
	.page-btn {padding: 6px 10px;font-size: 0.85rem;}
	.page-dots {padding: 6px 4px;}
}