/**
 * Trendy Indian Women — Homepage Stylesheet
 *
 * @package Trendy Indian Women
 * @since 1.0.0
 */

/* ─── Hero Section ─── */
.hero {
	background: var(--beige);
	padding: 78px 0 60px;
	text-align: center;
}

.hero h1 {
	font-size: clamp(1.9rem, 4.2vw, 2.9rem);
	max-width: 720px;
	margin: 0 auto 14px;
	font-weight: 700;
}

.hero h1 span {
	display: block;
	color: var(--rose);
	font-style: italic;
	font-weight: 600;
	margin-top: 4px;
}

.hero p {
	color: #5a5754;
	font-size: 1.08rem;
	margin-bottom: 28px;
}

/* ─── Category Chips Strip ─── */
.home-categories {
	padding: 26px 0 10px;
	display: flex;
	gap: 10px;
	overflow: auto;
	scrollbar-width: none;
	width: min(1120px, 92%);
	margin: auto;
}

.home-categories::-webkit-scrollbar {
	display: none;
}

.home-categories .chip {
	flex: 0 0 auto;
	padding: 9px 16px;
	border-radius: 999px;
	background: #f6f0eb;
	border: 1px solid #ede1d8;
	font-size: .9rem;
	font-weight: 500;
	color: #5b4b44;
	cursor: pointer;
	white-space: nowrap;
	transition: .2s;
	text-decoration: none;
}

.home-categories .chip:hover,
.home-categories .chip.active {
	background: var(--blush);
	color: white;
	border-color: var(--blush);
}

/* ─── Blog Posts Grid ─── */
.home-posts {
	padding: 48px 0;
}

.home-posts h2 {
	font-size: 1.6rem;
	margin-bottom: 22px;
}

/* ─── Deals Section ─── */
.home-deals {
	background: var(--beige);
	border-top: 1px solid #f0e6dd;
	border-bottom: 1px solid #f0e6dd;
	padding: 48px 0;
}

.home-deals h2 {
	font-size: 1.6rem;
	margin-bottom: 22px;
}

/* ─── Newsletter Section ─── */
.home-newsletter {
	background: linear-gradient(180deg, #fdecef, #f9e4e8);
	padding: 60px 0;
	text-align: center;
	border-top: 1px solid #f5d6dc;
}

.home-newsletter h3 {
	font-size: 1.5rem;
	margin-bottom: 8px;
}

.home-newsletter p {
	color: #7a5a62;
	margin-bottom: 20px;
}

.home-newsletter .news-form {
	display: flex;
	gap: 10px;
	max-width: 440px;
	margin: 0 auto;
	background: white;
	padding: 6px;
	border-radius: 14px;
	box-shadow: var(--shadow);
	border: 1px solid #f3d7dd;
}

.home-newsletter .news-form input {
	flex: 1;
	border: none;
	padding: 12px 14px;
	font-size: .95rem;
	outline: none;
	border-radius: 10px;
	font-family: Inter, sans-serif;
}

.home-newsletter .news-form button {
	background: var(--rose);
	color: white;
	border: none;
	padding: 0 18px;
	border-radius: 10px;
	font-weight: 600;
	cursor: pointer;
	font-family: Poppins, sans-serif;
}
