/* Estilos inspirados en Panera Bread para Mazapán */
:root {
	--radius-xl: 1.75rem;
	--radius-lg: 1.25rem;
	--color-primary: #2f6f3a;
	--color-primary-dark: #25552d;
	--color-secondary: #f1b24a;
	--color-cream: #f8f5ec;
	--shadow-soft: 0 18px 45px rgba(27, 50, 33, 0.12);
	--font-main: 'Work Sans', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}


body {
	font-family: var(--font-main);
	background-color: #fcfaf5;
}


.navbar-brand {
	letter-spacing: .5px;
	font-weight: 700;
}


.navbar .nav-link {
	font-weight: 500;
	color: #3f3f3f;
	text-transform: uppercase;
	letter-spacing: .5px;
}


.navbar .nav-link.active,
.navbar .nav-link:hover {
	color: var(--color-primary);
}


.btn {
	border-radius: 999px;
	letter-spacing: .5px;
}


.hero-landing {
	background: linear-gradient(140deg, rgba(47, 111, 58, .85), rgba(47, 111, 58, .55)), url('https://images.unsplash.com/photo-1534620808140-86f9ab47b1e1?auto=format&fit=crop&w=1600&q=80') center/cover no-repeat;
	min-height: 460px;
	padding: clamp(2.5rem, 4vw, 4rem);
}


.hero-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(14, 38, 20, .55), rgba(14, 38, 20, .8));
}


.hero-content {
	position: relative;
	z-index: 1;
}


.hero-card {
	box-shadow: var(--shadow-soft);
}


.hero-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	background: var(--color-cream);
	color: var(--color-primary);
	font-weight: 600;
}


.collections-section .collection-card {
	background: #fff;
	border: 1px solid rgba(0, 0, 0, .06);
	box-shadow: 0 12px 24px rgba(27, 50, 33, 0.05);
}


.collection-card--accent {
	background: linear-gradient(140deg, #f0e3c7, #fff5da);
}


.product-card img {
	transition: transform .4s ease;
}


.product-card:hover img {
	transform: scale(1.05);
}


.product-card .card-body {
	padding: 1.5rem;
}


.product-card .badge {
	background: rgba(47, 111, 58, .1) !important;
	color: var(--color-primary) !important;
}


.club-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background: rgba(47, 111, 58, .1);
	color: var(--color-primary);
}


.club-form input {
	border-radius: 999px;
	padding: .85rem 1.2rem;
}


.club-form button {
	border-radius: 999px;
	background: var(--color-primary);
	border: none;
}


.plan-card {
	box-shadow: 0 15px 30px rgba(27, 50, 33, 0.08);
	background: linear-gradient(180deg, #ffffff, #f7fff5);
}


.plan-card .badge {
	background: rgba(47, 111, 58, .12) !important;
	color: var(--color-primary) !important;
}


@media (max-width: 991.98px) {
	.hero-landing {
		border-radius: 1.2rem;
	}

	.hero-card {
		margin-top: 1.5rem;
	}
}


@media (max-width: 575.98px) {
	.hero-landing {
		padding: 2rem;
	}

	.hero-icon {
		width: 32px;
		height: 32px;
	}
}