/* Portada — identidad propia Café Isabel */

.site-main--front { padding: 0; }

.ci-home-hero {
	position: relative;
	min-height: 72vh;
	display: flex;
	align-items: center;
	background-size: cover;
	background-position: center;
}

.ci-home-hero__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		90deg,
		rgba(44, 24, 16, 0.88) 0%,
		rgba(44, 24, 16, 0.55) 55%,
		rgba(44, 24, 16, 0.25) 100%
	);
}

.ci-home-hero__content {
	position: relative;
	z-index: 1;
	max-width: 560px;
	padding: 4rem 0;
	color: #fff;
}

.ci-home-hero__tag {
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--ci-gold);
	margin: 0 0 1rem;
}

.ci-home-hero__title {
	font-family: var(--ci-font-display);
	font-size: clamp(2.25rem, 5vw, 3.25rem);
	font-weight: 600;
	line-height: 1.12;
	margin: 0 0 1rem;
	color: #fff;
}

.ci-home-hero__desc {
	font-size: 1.125rem;
	line-height: 1.65;
	opacity: 0.92;
	margin: 0 0 2rem;
}

.ci-home-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}

.ci-btn {
	display: inline-block;
	padding: 0.85rem 1.75rem;
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none;
	border-radius: 6px;
	transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.ci-btn--fill {
	background: var(--ci-brand);
	color: #fff !important;
	border: 2px solid var(--ci-brand);
}

.ci-btn--fill:hover {
	background: var(--ci-brand-dark);
	border-color: var(--ci-brand-dark);
}

.ci-btn--line {
	background: transparent;
	color: #fff !important;
	border: 2px solid rgba(255, 255, 255, 0.65);
}

.ci-btn--line:hover {
	background: rgba(255, 255, 255, 0.12);
	border-color: #fff;
}

.ci-trust {
	background: var(--ci-cream-dark);
	border-bottom: 1px solid var(--ci-border);
}

.ci-trust__inner {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 1rem 2.5rem;
	padding: 1rem 0;
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--ci-coffee);
}

.ci-home-section {
	padding: 4rem 0;
	background: var(--ci-cream);
}

.ci-home-section--alt {
	background: #fff;
}

.ci-home-section__head {
	text-align: center;
	max-width: 520px;
	margin: 0 auto 2.5rem;
}

.ci-home-section__head h2 {
	font-family: var(--ci-font-display);
	font-size: clamp(1.75rem, 3vw, 2.35rem);
	font-weight: 600;
	margin: 0 0 0.5rem;
	color: var(--ci-coffee);
}

.ci-home-section__head p {
	margin: 0;
	color: var(--ci-muted);
}

.ci-home-products {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
}

.ci-home-products .product-card {
	background: #fff;
	border-radius: 10px;
	border: 1px solid var(--ci-border);
	box-shadow: 0 4px 20px rgba(44, 24, 16, 0.06);
	overflow: hidden;
}

.ci-home-products .product-card__image {
	background: #faf8f5;
}

.ci-home-products .product-card__actions .button {
	border-radius: 6px !important;
	background: var(--ci-brand) !important;
}

.ci-home-section__cta {
	text-align: center;
	margin-top: 2.5rem;
}

.ci-pillars {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2rem;
}

.ci-pillars article {
	padding: 1.5rem;
	background: var(--ci-cream);
	border-radius: 10px;
	border: 1px solid var(--ci-border);
}

.ci-pillars h3 {
	font-family: var(--ci-font-display);
	font-size: 1.2rem;
	margin: 0 0 0.5rem;
	color: var(--ci-coffee);
}

.ci-pillars p {
	margin: 0 0 0.75rem;
	font-size: 0.9375rem;
	color: var(--ci-muted);
	line-height: 1.55;
}

.ci-pillars a {
	font-weight: 600;
	font-size: 0.875rem;
	color: var(--ci-brand);
	text-decoration: none;
}

.ci-pillars a:hover {
	text-decoration: underline;
}

@media (max-width: 900px) {
	.ci-home-products {
		grid-template-columns: repeat(2, 1fr);
	}

	.ci-pillars {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 480px) {
	.ci-home-products {
		grid-template-columns: 1fr;
	}

	.ci-home-hero__actions {
		flex-direction: column;
	}

	.ci-home-hero__actions .ci-btn {
		text-align: center;
	}
}