/* ------------------------------------------------------------------
   Free India Coupons — blog + glue styles (extends reference-base.css)
   ------------------------------------------------------------------ */

/* Verified stamp under each coupon card action */
.verified-line {
	margin-top: 10px;
	font-size: 12.5px;
	color: var(--color-gray-500);
}
.verified-line strong { color: var(--color-green); }

/* Brand sections */
.brand-section { padding-top: 24px; }
.section-sub {
	color: var(--color-gray-500);
	text-align: center;
	max-width: 720px;
	margin: 8px auto 0;
	font-size: 15px;
}

/* Navbar mobile toggle */
.nav-toggle {
	display: none;
	background: none;
	border: none;
	font-size: 24px;
	color: var(--color-brand-purple);
	cursor: pointer;
}

/* WordPress menus render ul > li > a — normalise them to the same
   horizontal navbar as the plain-anchor fallback (fixes the vertical
   bulleted list when a Primary menu is assigned). */
.nav-links ul {
	display: flex;
	gap: 32px;
	list-style: none;
	margin: 0;
	padding: 0;
	align-items: center;
}
.nav-links ul li { list-style: none; margin: 0; }

@media (max-width: 860px) {
	.nav-toggle { display: block; }
	.nav-links {
		display: none;
		position: absolute;
		top: 64px; left: 0; right: 0;
		background: var(--color-white);
		flex-direction: column;
		padding: 16px 24px;
		box-shadow: var(--shadow-sm);
		gap: 12px;
	}
	.nav-links ul { flex-direction: column; align-items: flex-start; gap: 12px; }
	.nav-links.open { display: flex; }
}

/* Blog home + archive grids */
.blog-home { padding: 64px 0; background: var(--color-gray-100); }
.blog-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	margin-top: 32px;
}
@media (max-width: 980px) { .blog-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .blog-grid { grid-template-columns: 1fr; } }

.blog-card {
	background: var(--color-white);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-sm);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: box-shadow .2s ease, transform .2s ease;
}
.blog-card:hover { box-shadow: var(--shadow-hover); transform: translateY(-3px); }
.blog-card-thumb img { width: 100%; height: 190px; object-fit: cover; display: block; }
.blog-card-body { padding: 20px 22px 24px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.blog-card-body h3 { font-size: 18px; line-height: 1.35; margin: 0; }
.blog-card-body h3 a { color: var(--color-gray-900); text-decoration: none; }
.blog-card-body h3 a:hover { color: var(--color-brand-purple); }
.blog-card-body p { color: var(--color-gray-500); font-size: 14px; margin: 0; flex: 1; }
.blog-card-meta { font-size: 12px; color: var(--color-gray-500); display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.post-cat {
	background: var(--color-brand-purple-light);
	color: var(--color-brand-purple);
	padding: 3px 10px;
	border-radius: var(--radius-full);
	text-decoration: none;
	font-weight: 600;
}
.read-more { width: max-content; cursor: pointer; }
.blog-all-wrap { text-align: center; margin-top: 32px; }

/* Single post */
.single-post { padding: 56px 0 40px; background: var(--color-white); }
.post-container { max-width: 860px; }
.post-title { font-size: 34px; font-weight: 800; color: var(--color-gray-900); line-height: 1.25; margin: 10px 0 18px; }
.post-thumb img { width: 100%; border-radius: var(--radius-lg); max-height: 420px; object-fit: cover; }
.post-content { color: var(--color-gray-700); line-height: 1.85; font-size: 16.5px; }
.post-content h2 { font-size: 26px; font-weight: 800; color: var(--color-gray-900); margin: 36px 0 14px; }
.post-content h3 { font-size: 21px; font-weight: 700; color: var(--color-gray-900); margin: 28px 0 12px; }
.post-content p { margin-bottom: 16px; }
.post-content ul, .post-content ol { margin: 0 0 20px; padding-left: 24px; }
.post-content li { margin-bottom: 8px; }
.post-content a { color: var(--color-brand-purple); text-decoration: underline; }
.post-content blockquote {
	border-left: 4px solid var(--color-orange);
	margin: 24px 0; padding: 12px 20px;
	background: var(--color-gray-100);
	border-radius: 0 var(--radius-md) var(--radius-md) 0;
	font-style: italic;
}
.post-content table { width: 100%; border-collapse: collapse; margin: 20px 0; font-size: 14.5px; }
.post-content th, .post-content td { border: 1px solid var(--color-gray-200); padding: 10px 12px; text-align: left; }
.post-content th { background: var(--color-gray-100); }
.post-tags { margin-top: 24px; color: var(--color-gray-500); font-size: 13.5px; }
.post-tags a { color: var(--color-brand-purple); }

.author-box {
	display: flex; gap: 16px; align-items: center;
	margin-top: 36px; padding: 20px;
	background: var(--color-gray-100);
	border-radius: var(--radius-lg);
}
.author-box img { border-radius: 50%; }
.author-box p { margin: 4px 0 0; color: var(--color-gray-500); font-size: 14px; }

.related-posts { padding: 48px 0 64px; background: var(--color-gray-100); }

/* Static pages */
.static-page { padding: 56px 0 72px; }
.page-container { max-width: 860px; }

/* Pagination */
.fic-pagination { margin: 40px 0 8px; text-align: center; }
.fic-pagination .page-numbers {
	display: inline-block; min-width: 38px; padding: 8px 12px; margin: 0 4px;
	border-radius: var(--radius-sm); background: var(--color-white);
	color: var(--color-gray-800); text-decoration: none; box-shadow: var(--shadow-sm);
}
.fic-pagination .current { background: var(--color-brand-purple); color: #fff; }

/* Search */
.fic-search { display: flex; gap: 8px; max-width: 480px; }
.fic-search input[type="search"] {
	flex: 1; padding: 10px 14px; border: 1px solid var(--color-gray-200);
	border-radius: var(--radius-sm); font: inherit;
}

/* Comments */
.comments-area { max-width: 860px; padding-bottom: 64px; }
.comment-list { list-style: none; padding-left: 0; }
.comment-list .comment { margin: 18px 0; padding: 16px; background: var(--color-gray-100); border-radius: var(--radius-md); }
.comment-form textarea, .comment-form input { width: 100%; padding: 10px 12px; margin: 6px 0 14px; border: 1px solid var(--color-gray-200); border-radius: var(--radius-sm); font: inherit; }
.comment-form .submit { background: var(--color-orange); border: none; color: #fff; padding: 10px 22px; border-radius: var(--radius-sm); cursor: pointer; font-weight: 700; }

/* Footer logo size guard — same 60px as the reference design */
.footer-logo { height: 60px; width: auto; max-width: none; }

/* Logo uploaded via Customizer → Site Identity (class "custom-logo")
   must get the same navbar constraints as the bundled logo (60px, ref). */
.logo,
.custom-logo {
	height: 60px;
	width: auto;
	max-width: none;
	object-fit: contain;
}
/* Hardening: if an old/child-theme header ever emits the broken wrapper
   anchor from the nested-anchor bug (it ends up empty of elements but full
   of whitespace, so :empty won't match), hide it so the logo stays flush left. */
.logo-link:empty,
.navbar-container > a.logo-link:not(:has(img)) { display: none; }
@media (max-width: 768px) {
	.logo,
	.custom-logo { height: 48px; }
}

/* Blog page header spacing */
.blog-archive { padding: 56px 0 72px; background: var(--color-gray-100); min-height: 60vh; }
.no-results { color: var(--color-gray-500); }