/* ==========================================================================
   Whisky & Ember — Components
   Depends on variables.css. Replace placeholder layout with ported homepage HTML.
   ========================================================================== */

.we-section {
	max-width: var(--we-maxw);
	margin: 0 auto;
	padding: var(--we-space-4) var(--we-space-2);
}

/* --- Hero ------------------------------------------------------------------ */
.we-hero {
	background: var(--we-charcoal);
	color: var(--we-offwhite);
	text-align: center;
	padding: calc(var(--we-space-4) * 1.5) var(--we-space-2);
}
.we-hero__title {
	font-family: var(--we-font-display);
	font-size: var(--we-fs-hero);
	line-height: 1.05;
	margin: 0 0 var(--we-space-2);
}
.we-hero__tagline {
	color: var(--we-ember);
	letter-spacing: 0.15em;
	text-transform: uppercase;
	font-size: var(--we-fs-small);
	margin-bottom: var(--we-space-3);
}

/* --- Buttons --------------------------------------------------------------- */
.we-btn {
	display: inline-block;
	background: var(--we-ember);
	color: var(--we-charcoal);
	padding: 0.8rem 1.8rem;
	border-radius: var(--we-radius);
	text-decoration: none;
	font-weight: 600;
	letter-spacing: 0.03em;
	transition: background 0.18s ease;
}
.we-btn:hover { background: var(--we-ember-bright); }

/* --- Featured cocktails grid ----------------------------------------------- */
.we-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: var(--we-space-3);
}
.we-card {
	background: var(--we-charcoal-2);
	border: 1px solid var(--we-line);
	border-radius: var(--we-radius);
	overflow: hidden;
}
.we-card__media img { width: 100%; height: auto; display: block; }
.we-card__body { padding: var(--we-space-2); }
.we-card__title {
	font-family: var(--we-font-display);
	color: var(--we-offwhite);
	margin: 0 0 var(--we-space-1);
}
.we-card__meta { color: var(--we-muted); font-size: var(--we-fs-small); }

/* --- Signup CTA ------------------------------------------------------------ */
.we-cta {
	background: var(--we-charcoal-2);
	border-top: 2px solid var(--we-ember);
	text-align: center;
}
.we-cta__title { font-family: var(--we-font-display); font-size: var(--we-fs-h2); }

/* --- Cocktail single ------------------------------------------------------- */
.we-recipe { color: var(--we-offwhite); }
.we-recipe__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--we-space-2);
	color: var(--we-muted);
	font-size: var(--we-fs-small);
	border-bottom: 1px solid var(--we-line);
	padding-bottom: var(--we-space-2);
	margin-bottom: var(--we-space-3);
}
.we-recipe__ingredients li { margin-bottom: var(--we-space-1); }
.we-recipe__method li { margin-bottom: var(--we-space-2); line-height: var(--we-lh-body); }
.we-recipe__notes {
	border-left: 3px solid var(--we-ember);
	padding-left: var(--we-space-2);
	color: var(--we-muted);
	font-style: italic;
	margin-top: var(--we-space-3);
}