:root {
		--ink: #141010;
		--ink-soft: #2a1616;
		--surface: #f6ebe3;
		--surface-2: #ead9cc;
		--cream: #faeee0;
		--line: rgba(20, 16, 16, 0.1);
		--muted: #7d5e54;
		--accent: #5c2020;
		--accent-deep: #481818;
		--accent-2: #c4a078;
		--accent-gold: #e4c6a8;
		--accent-hot: #9c785a;
		--white: #ffffff;
		--danger: #8b1e1e;
		--radius: 18px;
		--shadow: 0 18px 50px rgba(72, 24, 24, 0.16);
		--font-ar: "Cairo", sans-serif;
		--font-display: "Syne", "Cairo", sans-serif;
		--container: 1180px;
		--transition: 0.28s cubic-bezier(0.22, 1, 0.36, 1);
	}

	* { box-sizing: border-box; margin: 0; padding: 0; }

	html { scroll-behavior: smooth; }

	body {
		font-family: var(--font-ar);
		background: var(--cream);
		color: var(--ink);
		line-height: 1.7;
		overflow-x: hidden;
	}

	img { max-width: 100%; display: block; }
	a { color: inherit; text-decoration: none; }
	button, input { font: inherit; }
	ul { list-style: none; }

	.container {
		width: min(100% - 2rem, var(--container));
		margin-inline: auto;
	}

	/* Announcement */
	.announce {
		background: linear-gradient(90deg, #141010, #5c2020 42%, #481818 58%, #141010);
		color: var(--white);
		font-size: 0.92rem;
		font-weight: 600;
	}

	.announce-track {
		display: flex;
		gap: 2.5rem;
		justify-content: center;
		flex-wrap: wrap;
		padding: 0.7rem 1rem;
	}

	.announce-item {
		display: inline-flex;
		align-items: center;
		gap: 0.45rem;
	}

	.announce-dot {
		width: 6px;
		height: 6px;
		border-radius: 50%;
		background: var(--accent-2);
	}

	/* Header */
	.site-header {
		position: sticky;
		top: 0;
		z-index: 50;
		backdrop-filter: blur(14px);
		background: rgba(250, 238, 224, 0.9);
		border-bottom: 1px solid rgba(156, 120, 90, 0.28);
	}

	.header-row {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 1rem;
		min-height: 74px;
	}

	.brand {
		display: inline-flex;
		align-items: center;
	}

	.brand-logo,
	.footer-logo {
		display: block;
		width: auto;
		object-fit: contain;
		background: transparent;
	}

	.brand-logo {
		height: 54px;
		opacity: 0.88;
	}

	.nav-links {
		display: flex;
		align-items: center;
		gap: 1.4rem;
		font-weight: 700;
		font-size: 0.95rem;
	}

	.nav-links a {
		opacity: 0.78;
		transition: opacity var(--transition);
	}

	.nav-links a:hover { opacity: 1; }

	.header-actions {
		display: flex;
		align-items: center;
		gap: 0.7rem;
	}

	.icon-btn {
		border: 1px solid var(--line);
		background: var(--white);
		min-width: 44px;
		min-height: 44px;
		border-radius: 999px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 0.4rem;
		padding: 0 0.9rem;
		cursor: pointer;
		transition: transform var(--transition), box-shadow var(--transition);
		font-weight: 700;
	}

	.icon-btn:hover {
		transform: translateY(-1px);
		box-shadow: 0 8px 22px rgba(20, 16, 16, 0.08);
	}

	.cart-count {
		background: var(--accent);
		color: white;
		min-width: 1.35rem;
		height: 1.35rem;
		border-radius: 999px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		font-size: 0.75rem;
	}

	.menu-toggle { display: none; }

	/* Hero */
	.hero {
		position: relative;
		isolation: isolate;
		min-height: min(88vh, 820px);
		display: grid;
		align-items: end;
		overflow: hidden;
		background:
			radial-gradient(ellipse at 18% 18%, rgba(196, 160, 120, 0.32), transparent 42%),
			radial-gradient(ellipse at 78% 28%, rgba(92, 32, 32, 0.72), transparent 52%),
			linear-gradient(155deg, #100c0c 0%, #2a1214 46%, #481818 100%);
		color: var(--cream);
	}

	.hero::before {
		content: "";
		position: absolute;
		inset: 0;
		background:
			linear-gradient(180deg, transparent 35%, rgba(16, 12, 12, 0.82) 100%),
			url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
		z-index: -1;
	}

	.hero-visual {
		position: absolute;
		inset: 0;
		z-index: -2;
		background:
			radial-gradient(circle at 72% 42%, rgba(255,255,255,0.08), transparent 28%),
			linear-gradient(120deg, transparent 40%, rgba(196,160,120,0.16) 100%);
	}

	.hero-visual-orb {
		position: absolute;
		width: min(52vw, 520px);
		aspect-ratio: 1;
		border-radius: 50%;
		right: -8%;
		top: 8%;
		background:
			radial-gradient(circle at 35% 35%, rgba(255,255,255,0.18), transparent 45%),
			radial-gradient(circle at 60% 60%, rgba(92,32,32,0.85), rgba(16,12,12,0.12) 70%);
		filter: blur(2px);
		animation: floatOrb 8s ease-in-out infinite;
	}

	.hero-visual-blade {
		position: absolute;
		width: min(38vw, 380px);
		height: min(58vw, 520px);
		right: 8%;
		bottom: -4%;
		border-radius: 48% 48% 18% 18%;
		background:
			linear-gradient(180deg, rgba(250,238,224,0.2), rgba(250,238,224,0.02)),
			linear-gradient(140deg, #6e2a2a, #141010);
		border: 1px solid rgba(228, 198, 168, 0.28);
		box-shadow: inset 0 0 60px rgba(196,160,120,0.22);
		transform: rotate(-8deg);
		animation: riseIn 1.1s var(--transition) both;
	}

	.hero-photo {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
		z-index: -2;
	}

	.hero.hero-has-image::before {
		background: linear-gradient(180deg, rgba(16, 12, 12, 0.15) 0%, rgba(16, 12, 12, 0.28) 42%, rgba(16, 12, 12, 0.84) 100%);
	}

	.hero-content {
		padding: 6rem 0 4.5rem;
		max-width: 640px;
		animation: fadeUp 0.9s var(--transition) both;
	}

	.brand-hero {
		font-family: var(--font-display);
		font-size: clamp(3.4rem, 10vw, 6.4rem);
		font-weight: 800;
		letter-spacing: -0.05em;
		line-height: 0.95;
		margin-bottom: 1rem;
	}

	.brand-hero span {
		display: block;
		color: var(--accent-2);
	}

	.hero-copy {
		font-size: clamp(1.05rem, 2vw, 1.25rem);
		color: rgba(255,255,255,0.82);
		max-width: 32rem;
		margin-bottom: 1.8rem;
	}

	.cta-row {
		display: flex;
		flex-wrap: wrap;
		gap: 0.8rem;
	}

	.btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 0.45rem;
		min-height: 48px;
		padding: 0.75rem 1.35rem;
		border-radius: 999px;
		border: 0;
		cursor: pointer;
		font-weight: 800;
		transition: transform var(--transition), box-shadow var(--transition), background var(--transition);
	}

	.btn:hover { transform: translateY(-2px); }

	.btn-primary {
		background: linear-gradient(135deg, var(--accent-gold), var(--accent-2));
		color: var(--accent-deep);
		box-shadow: 0 12px 30px rgba(156, 120, 90, 0.32);
	}

	.btn-ghost {
		background: rgba(255,255,255,0.08);
		color: white;
		border: 1px solid rgba(255,255,255,0.18);
	}

	.btn-solid {
		background: var(--accent);
		color: white;
	}

	.btn-outline {
		background: transparent;
		border: 1px solid var(--line);
		color: var(--ink);
	}

	/* Sections */
	.section {
		padding: 4.5rem 0;
	}

	.section-head {
		display: flex;
		align-items: end;
		justify-content: space-between;
		gap: 1rem;
		margin-bottom: 2rem;
		flex-wrap: wrap;
	}

	.section-title {
		font-size: clamp(1.6rem, 3vw, 2.2rem);
		font-weight: 800;
		letter-spacing: -0.02em;
	}

	.section-sub {
		color: var(--muted);
		font-weight: 600;
	}

	/* Products */
	.products-grid {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.1rem;
	}

	.product-open {
		display: block;
		color: inherit;
	}

	.product-open:hover .product-name {
		color: var(--accent);
	}

	.product {
		background: var(--white);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		overflow: hidden;
		display: flex;
		flex-direction: column;
		transition: transform var(--transition), box-shadow var(--transition);
	}

	.product:hover {
		transform: translateY(-4px);
		box-shadow: var(--shadow);
	}

	.product-media {
		aspect-ratio: 1 / 1.05;
		background:
			radial-gradient(circle at 30% 20%, rgba(228,198,168,0.45), transparent 45%),
			linear-gradient(160deg, #f3e4d8, #e4cfc0);
		position: relative;
		overflow: hidden;
	}

	.product-media.alt {
		background:
			radial-gradient(circle at 70% 30%, rgba(92,32,32,0.18), transparent 42%),
			linear-gradient(160deg, #f7eee6, #ead8c8);
	}

	.product-shape {
		position: absolute;
		inset: 12% 18% 10%;
		border-radius: 40% 40% 18% 18% / 35% 35% 20% 20%;
		background:
			linear-gradient(180deg, rgba(255,255,255,0.55), transparent),
			linear-gradient(145deg, #5c2020, #141010);
		box-shadow: 0 25px 40px rgba(20,16,16,0.22);
		animation: floatSoft 5.5s ease-in-out infinite;
	}

	.product-shape.bottle {
		inset: 16% 28% 12%;
		border-radius: 18px 18px 28px 28px;
		background:
			linear-gradient(180deg, rgba(255,255,255,0.4), transparent 30%),
			linear-gradient(160deg, #8a3a38, #481818);
	}

	.product-badge {
		position: absolute;
		top: 1rem;
		inset-inline-start: 1rem;
		background: rgba(20,16,16,0.88);
		color: white;
		font-size: 0.78rem;
		font-weight: 800;
		padding: 0.35rem 0.7rem;
		border-radius: 999px;
	}

	.product-body {
		padding: 1.15rem 1.15rem 1.25rem;
		display: grid;
		gap: 0.55rem;
		flex: 1;
	}

	.product-name {
		font-size: 1.05rem;
		font-weight: 800;
		line-height: 1.4;
		min-height: 2.8em;
	}

	.price-row {
		display: flex;
		align-items: baseline;
		gap: 0.55rem;
		flex-wrap: wrap;
	}

	.price-now {
		font-size: 1.15rem;
		font-weight: 900;
		color: var(--accent);
	}

	.price-old {
		color: var(--muted);
		text-decoration: line-through;
		font-weight: 600;
		font-size: 0.92rem;
	}

	.discount-badge {
		position: absolute;
		top: 1rem;
		inset-inline-end: 1rem;
		background: red;
		color: white;
		font-size: 1.56rem;
		font-weight: 900;
		padding: 0.7rem 1.4rem;
		border-radius: 999px;
		box-shadow: 0 8px 18px rgba(156, 120, 90, 0.35);
	}

	.rule-label {
		color: var(--accent);
		font-size: 0.82rem;
		font-weight: 800;
	}

	.product-media img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.products-empty {
		grid-column: 1 / -1;
		text-align: center;
		color: var(--muted);
		font-weight: 700;
		padding: 2rem 1rem;
		background: white;
		border: 1px dashed var(--line);
		border-radius: var(--radius);
	}

	.group-filters {
		display: flex;
		flex-wrap: wrap;
		gap: 0.55rem;
		margin-bottom: 1.2rem;
	}

	.group-filter {
		border: 1px solid var(--line);
		background: white;
		border-radius: 999px;
		min-height: 40px;
		padding: 0.4rem 0.95rem;
		font-weight: 800;
		cursor: pointer;
		color: var(--ink);
		transition: var(--transition);
	}

	.group-filter.active {
		background: var(--accent);
		border-color: var(--accent);
		color: white;
	}

	.search-wrap { margin-bottom: 1rem; }

	.search-input {
		width: 100%;
		min-height: 48px;
		border-radius: 999px;
		border: 1px solid var(--line);
		background: white;
		padding: 0 1.1rem;
		outline: none;
		font-weight: 600;
	}

	.search-input:focus {
		border-color: rgba(92, 32, 32, 0.5);
		box-shadow: 0 0 0 3px rgba(92, 32, 32, 0.12);
	}

	.toast {
		position: fixed;
		bottom: 1.25rem;
		inset-inline-start: 50%;
		transform: translateX(50%) translateY(120%);
		background: var(--ink);
		color: white;
		padding: 0.75rem 1.15rem;
		border-radius: 999px;
		font-weight: 800;
		font-size: 0.92rem;
		z-index: 120;
		opacity: 0;
		pointer-events: none;
		transition: transform 0.3s var(--transition), opacity 0.3s var(--transition);
		box-shadow: var(--shadow);
		white-space: nowrap;
	}

	html[dir="rtl"] .toast { transform: translateX(-50%) translateY(120%); }

	.toast.show {
		opacity: 1;
		transform: translateX(50%) translateY(0);
	}

	html[dir="rtl"] .toast.show { transform: translateX(-50%) translateY(0); }

	.icon-btn:disabled {
		opacity: 0.45;
		cursor: not-allowed;
		transform: none;
		box-shadow: none;
	}

	.lang-switch {
		display: inline-flex;
		align-items: center;
		gap: 0.25rem;
		padding: 0.2rem;
		border: 1px solid var(--line);
		border-radius: 999px;
		background: white;
	}

	.lang-btn {
		border: 0;
		background: transparent;
		min-height: 34px;
		padding: 0 0.7rem;
		border-radius: 999px;
		font-weight: 800;
		font-size: 0.78rem;
		cursor: pointer;
		color: var(--muted);
		transition: var(--transition);
	}

	.lang-btn.active {
		background: var(--ink);
		color: white;
	}

	.cart-line-meta {
		display: grid;
		gap: 0.25rem;
	}

	/* Categories */
	.cats {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1rem;
	}

	.cat {
		min-height: 220px;
		border-radius: calc(var(--radius) + 4px);
		padding: 1.5rem;
		display: flex;
		flex-direction: column;
		justify-content: end;
		color: white;
		position: relative;
		overflow: hidden;
		isolation: isolate;
	}

	.cat-photo {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
		z-index: -2;
	}

	.cat::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: -1;
		background: linear-gradient(180deg, transparent 20%, rgba(16,12,12,0.82));
	}

	.cat.has-image::before {
		background: linear-gradient(180deg, rgba(20, 16, 16, 0.2) 0%, rgba(16, 12, 12, 0.82) 100%);
	}

	.cat-shave {
		background:
			radial-gradient(circle at 70% 30%, rgba(228,198,168,0.38), transparent 40%),
			linear-gradient(145deg, #6e2a2a, #141010);
	}

	.cat-wash {
		background:
			radial-gradient(circle at 30% 20%, rgba(196,160,120,0.42), transparent 42%),
			linear-gradient(145deg, #481818, #100c0c);
	}

	.cat h3 {
		font-size: 1.45rem;
		font-weight: 800;
		margin-bottom: 0.25rem;
	}

	.cat p {
		opacity: 0.8;
		font-weight: 600;
		margin-bottom: 0.9rem;
	}

	/* Reviews */
	.reviews-wrap {
		background:
			radial-gradient(circle at 85% 0%, rgba(196, 160, 120, 0.22), transparent 38%),
			linear-gradient(165deg, #5c2020 0%, #2a1214 58%, #141010 100%);
		border: 1px solid rgba(196, 160, 120, 0.28);
		color: var(--cream);
		border-radius: 28px;
		padding: 2rem 1.4rem;
		position: relative;
		overflow: hidden;
	}

	.reviews-wrap::before {
		content: "";
		position: absolute;
		width: 280px;
		height: 280px;
		border-radius: 50%;
		background: radial-gradient(circle, rgba(196,160,120,0.28), transparent 70%);
		top: -80px;
		inset-inline-start: -60px;
	}

	.rating-pill {
		display: inline-flex;
		align-items: center;
		gap: 0.5rem;
		background: rgba(255,255,255,0.08);
		border: 1px solid rgba(255,255,255,0.12);
		border-radius: 999px;
		padding: 0.45rem 0.9rem;
		font-weight: 700;
		margin-bottom: 1.4rem;
	}

	.stars { color: var(--accent-2); letter-spacing: 0.08em; }

	.reviews-grid {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 0.9rem;
	}

	.review {
		background: rgba(255,255,255,0.05);
		border: 1px solid rgba(255,255,255,0.1);
		border-radius: 16px;
		padding: 1.1rem;
		display: grid;
		gap: 0.7rem;
	}

	.review p {
		color: rgba(255,255,255,0.88);
		font-size: 0.95rem;
	}

	.review-meta {
		display: flex;
		justify-content: space-between;
		gap: 0.5rem;
		align-items: center;
		color: rgba(255,255,255,0.65);
		font-size: 0.85rem;
		font-weight: 700;
	}

	/* Trust */
	.trust-grid {
		display: grid;
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 1rem;
	}

	.trust {
		background: var(--white);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		padding: 1.35rem 1.1rem;
		text-align: center;
	}

	.trust-icon {
		width: 52px;
		height: 52px;
		margin: 0 auto 0.9rem;
		border-radius: 16px;
		display: grid;
		place-items: center;
		background: linear-gradient(145deg, rgba(92,32,32,0.12), rgba(196,160,120,0.28));
		font-size: 1.35rem;
	}

	.trust h3 {
		font-size: 1.05rem;
		font-weight: 800;
		margin-bottom: 0.35rem;
	}

	.trust p {
		color: var(--muted);
		font-size: 0.92rem;
		font-weight: 600;
	}

	/* Footer */
	.site-footer {
		background:
			radial-gradient(circle at 10% 0%, rgba(196, 160, 120, 0.16), transparent 34%),
			linear-gradient(180deg, #2a1214 0%, #141010 100%);
		border-top: 1px solid rgba(196, 160, 120, 0.28);
		color: rgba(250, 238, 224, 0.82);
		padding: 3.5rem 0 1.5rem;
		margin-top: 2rem;
	}

	.footer-grid {
		display: grid;
		grid-template-columns: 1.4fr 1fr 1fr;
		gap: 2rem;
		margin-bottom: 2.2rem;
	}

	.footer-logo {
		height: 64px;
		margin-bottom: 0.7rem;
		opacity: 0.9;
	}

	.footer-col h4 {
		color: white;
		font-size: 1.05rem;
		margin-bottom: 0.9rem;
	}

	.footer-col a {
		display: block;
		padding: 0.28rem 0;
		opacity: 0.78;
		font-weight: 600;
	}

	.footer-col a:hover { opacity: 1; }

	.newsletter {
		display: flex;
		gap: 0.5rem;
		margin-top: 0.8rem;
		flex-wrap: wrap;
	}

	.newsletter input {
		flex: 1;
		min-width: 180px;
		min-height: 46px;
		border-radius: 999px;
		border: 1px solid rgba(255,255,255,0.16);
		background: rgba(255,255,255,0.06);
		color: white;
		padding: 0 1rem;
		outline: none;
	}

	.footer-bottom {
		border-top: 1px solid rgba(255,255,255,0.1);
		padding-top: 1.2rem;
		display: flex;
		justify-content: space-between;
		gap: 1rem;
		flex-wrap: wrap;
		font-size: 0.9rem;
		font-weight: 600;
	}

	/* Order popup — hidden by default, shown only with .open */
	.overlay {
		position: fixed;
		inset: 0;
		background: rgba(20, 16, 16, 0.55);
		z-index: 80;
		display: none;
	}

	.overlay.open {
		display: block;
	}

	.order-popup {
		position: fixed;
		inset: 0;
		z-index: 90;
		display: none;
		align-items: center;
		justify-content: center;
		padding: 1rem;
		background: rgba(20, 16, 16, 0.55);
	}

	.order-popup.open {
		display: flex;
	}

	.order-dialog {
		width: min(100%, 460px);
		max-height: min(92vh, 760px);
		background: var(--cream);
		border-radius: 22px;
		box-shadow: var(--shadow);
		overflow: hidden;
		display: flex;
		flex-direction: column;
		animation: fadeUp 0.35s var(--transition) both;
	}

	.order-dialog-head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 1rem 1.15rem;
		background: white;
		border-bottom: 1px solid var(--line);
		flex-shrink: 0;
	}

	.order-dialog-head h2 {
		font-size: 1.15rem;
		font-weight: 900;
	}

	.order-dialog-body {
		overflow: auto;
		padding: 1rem 1.15rem 1.2rem;
		display: grid;
		gap: 0.85rem;
	}

	.order-cart-list {
		display: grid;
		gap: 0.7rem;
		max-height: 220px;
		overflow: auto;
	}

	.order-total {
		display: flex;
		justify-content: space-between;
		font-weight: 900;
		font-size: 1.05rem;
		padding: 0.7rem 0;
		border-top: 1px solid var(--line);
		border-bottom: 1px solid var(--line);
	}

	.checkout-fields {
		display: grid;
		gap: 0.55rem;
	}

	.checkout-fields input {
		min-height: 44px;
		border-radius: 12px;
		border: 1px solid var(--line);
		background: white;
		padding: 0 0.9rem;
		outline: none;
	}

	.checkout-fields input:focus {
		border-color: rgba(92, 32, 32, 0.55);
		box-shadow: 0 0 0 3px rgba(92, 32, 32, 0.12);
	}

	.cart-empty {
		text-align: center;
		color: var(--muted);
		padding: 1.2rem 1rem;
		font-weight: 700;
	}

	.cart-line {
		display: grid;
		grid-template-columns: 64px 1fr auto;
		gap: 0.75rem;
		background: white;
		border: 1px solid var(--line);
		border-radius: 14px;
		padding: 0.7rem;
		align-items: center;
	}

	.cart-thumb {
		width: 64px;
		height: 64px;
		border-radius: 12px;
		background: linear-gradient(145deg, #f0ddd0, #e4cfc0);
	}

	.cart-line img {
		width: 64px;
		height: 64px;
		border-radius: 12px;
		object-fit: cover;
	}

	.cart-line h3 {
		font-size: 0.9rem;
		font-weight: 800;
		line-height: 1.35;
		margin-bottom: 0.35rem;
	}

	.qty-control {
		display: inline-flex;
		align-items: center;
		border: 1px solid var(--line);
		border-radius: 999px;
		overflow: hidden;
	}

	.qty-control button {
		width: 30px;
		height: 30px;
		border: 0;
		background: var(--surface-2);
		cursor: pointer;
		font-weight: 800;
	}

	.qty-control span {
		min-width: 28px;
		text-align: center;
		font-weight: 800;
		font-size: 0.9rem;
	}

	.cart-line-price {
		font-weight: 900;
		color: var(--accent);
		font-size: 0.9rem;
	}

	.cart-line-old {
		font-size: 0.75rem;
		color: var(--muted);
		text-decoration: line-through;
		font-weight: 600;
	}

	.status {
		min-height: 1.2em;
		font-size: 0.88rem;
		font-weight: 700;
		color: var(--muted);
	}

	.status.ok { color: var(--accent); }
	.status.err { color: var(--danger); }

	/* Mobile nav */
	.mobile-nav {
		display: none;
		position: absolute;
		inset-inline: 0;
		top: 100%;
		background: rgba(250,238,224,0.98);
		border-bottom: 1px solid var(--line);
		padding: 0.8rem 1rem 1.1rem;
	}

	.mobile-nav.open { display: grid; gap: 0.7rem; }

	.mobile-nav a {
		font-weight: 800;
		padding: 0.55rem 0.2rem;
	}

	@keyframes fadeUp {
		from { opacity: 0; transform: translateY(22px); }
		to { opacity: 1; transform: translateY(0); }
	}

	@keyframes riseIn {
		from { opacity: 0; transform: translateY(40px) rotate(-8deg); }
		to { opacity: 1; transform: translateY(0) rotate(-8deg); }
	}

	@keyframes floatOrb {
		0%, 100% { transform: translateY(0); }
		50% { transform: translateY(-16px); }
	}

	@keyframes floatSoft {
		0%, 100% { transform: translateY(0); }
		50% { transform: translateY(-8px); }
	}

	@media (max-width: 900px) {
		.nav-links { display: none; }
		.menu-toggle { display: inline-flex; }
		.reviews-grid { grid-template-columns: 1fr; }
		.trust-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
		.footer-grid { grid-template-columns: 1fr; }
		.hero-visual-blade { opacity: 0.55; }
		.lang-switch { order: 3; }
		.header-actions { flex-wrap: wrap; justify-content: flex-end; }
	}

	@media (max-width: 640px) {
		.products-grid,
		.cats,
		.trust-grid { grid-template-columns: 1fr; }
		.announce-track { gap: 1rem; }
		.hero-content { padding-top: 4.5rem; }
		.brand-hero { font-size: 3.2rem; }
	}

	.whatsapp-float {
		position: fixed;
		inset-inline-end: 1.25rem;
		inset-block-end: 1.25rem;
		width: 58px;
		height: 58px;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 50%;
		background: #25d366;
		color: #fff;
		box-shadow: 0 10px 24px rgba(37, 211, 102, 0.45);
		z-index: 95;
		transition: transform 0.2s ease, box-shadow 0.2s ease;
	}

	.whatsapp-float:hover {
		transform: scale(1.08);
		box-shadow: 0 14px 30px rgba(37, 211, 102, 0.55);
	}

	@media (max-width: 640px) {
		.whatsapp-float {
			width: 50px;
			height: 50px;
			inset-inline-end: 1rem;
			inset-block-end: 1rem;
		}
	}

	.detail-section { padding-top: 2rem; }

	.back-link {
		display: inline-flex;
		margin-bottom: 1.2rem;
		font-weight: 800;
		color: var(--accent);
	}

	.detail-layout {
		display: grid;
		grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
		gap: 1.6rem;
		align-items: start;
	}

	.item-stage {
		position: relative;
		aspect-ratio: 1;
		border-radius: 24px;
		overflow: hidden;
		background:
			radial-gradient(circle at 30% 20%, rgba(228, 198, 168, 0.35), transparent 45%),
			linear-gradient(160deg, #f6ebe3, #ead9cc);
		border: 1px solid rgba(156, 120, 90, 0.28);
	}

	.item-stage img {
		width: 100%;
		height: 100%;
		object-fit: contain;
		background: #fff;
	}

	.gallery-arrow,
	.thumbs-arrow {
		border: 0;
		cursor: pointer;
		display: grid;
		place-items: center;
		background: rgba(20, 16, 16, 0.78);
		color: var(--accent-gold);
	}

	.gallery-arrow {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		width: 46px;
		height: 46px;
		border-radius: 50%;
		z-index: 2;
	}

	.gallery-prev { inset-inline-start: 0.8rem; }
	.gallery-next { inset-inline-end: 0.8rem; }

	.chevron-prev::before { content: "‹"; font-size: 1.8rem; line-height: 1; }
	.chevron-next::before { content: "›"; font-size: 1.8rem; line-height: 1; }

	[dir="rtl"] .chevron-prev::before { content: "›"; }
	[dir="rtl"] .chevron-next::before { content: "‹"; }

	.item-thumbs-row {
		display: grid;
		grid-template-columns: 42px minmax(0, 1fr) 42px;
		gap: 0.55rem;
		align-items: center;
		margin-top: 0.8rem;
	}

	.thumbs-arrow {
		width: 42px;
		height: 42px;
		border-radius: 50%;
	}

	.item-thumbs {
		display: flex;
		gap: 0.55rem;
		overflow-x: auto;
		scroll-behavior: smooth;
		scrollbar-width: none;
	}

	.item-thumbs::-webkit-scrollbar { display: none; }

	.item-thumb {
		flex: 0 0 84px;
		width: 84px;
		height: 84px;
		padding: 0;
		border-radius: 14px;
		border: 2px solid transparent;
		overflow: hidden;
		background: white;
		cursor: pointer;
	}

	.item-thumb img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.item-thumb.active {
		border-color: var(--accent-2);
		box-shadow: 0 0 0 2px rgba(196, 160, 120, 0.35);
	}

	.detail-info {
		background: white;
		border: 1px solid var(--line);
		border-radius: 24px;
		padding: 1.4rem 1.3rem 1.5rem;
		display: grid;
		gap: 0.7rem;
	}

	.detail-code {
		color: var(--muted);
		font-weight: 700;
	}

	.detail-code strong {
		color: var(--ink);
		margin-inline-start: 0.35rem;
	}

	.detail-title {
		font-size: clamp(1.7rem, 3vw, 2.4rem);
		font-weight: 900;
		line-height: 1.25;
	}

	.detail-price { align-items: center; }

	.detail-price .price-now { font-size: 1.45rem; }

	.detail-discount {
		background: linear-gradient(135deg, var(--accent-gold), var(--accent-2));
		color: var(--accent-deep);
		font-weight: 900;
		border-radius: 999px;
		padding: 0.25rem 0.7rem;
		font-size: 0.85rem;
	}

	.detail-subtitle {
		font-size: 1.05rem;
		font-weight: 800;
		margin-top: 0.4rem;
	}

	.item-desc {
		color: var(--ink-soft);
		font-weight: 600;
		white-space: pre-line;
	}

	.detail-add { width: fit-content; min-width: 180px; }

	.detail-missing {
		background: white;
		border: 1px solid var(--line);
		border-radius: 24px;
		padding: 2rem 1.4rem;
		display: grid;
		gap: 1rem;
		justify-items: start;
	}

	@media (max-width: 800px) {
		.detail-layout { grid-template-columns: 1fr; }
		.detail-add { width: 100%; }
	}