/*
Theme Name: Kalighat Sanatan
Theme URI: https://kolakatakalighat.in
Author: kolakatakalighat.in
Description: Fast, mobile-first block theme for Hindi spiritual/astrology content. No page builder, no web fonts, no jQuery. Built for Core Web Vitals, Google Discover, and AI answer-engine citability.
Version: 1.1.0
Requires at least: 6.4
Requires PHP: 7.4
Tested up to: 6.6
License: GPL v2 or later
Text Domain: kalighat-sanatan
*/

:root {
	--k-maroon: #7a1220;
	--k-maroon-dark: #5c0d18;
	--k-gold: #d9a441;
	--k-gold-soft: #f3e3bd;
	--k-cream: #fffaf3;
	--k-paper: #fff;
	--k-ink: #2a2018;
	--k-muted: #7a6a55;
	--k-line: #eadfc9;
	--k-radius: 14px;
	--k-shadow: 0 6px 20px rgba(60, 30, 10, .08);
	--k-shadow-hover: 0 14px 30px rgba(60, 30, 10, .14);
	--k-max: 1100px;
	--k-read: 760px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--k-cream); color: var(--k-ink); }
img, video { max-width: 100%; height: auto; display: block; }
a { color: var(--k-maroon); text-decoration: none; }
a:hover, a:focus-visible { text-decoration: underline; }
:focus-visible { outline: 3px solid var(--k-gold); outline-offset: 2px; }

.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); }
.skip-link:focus { position: fixed; left: 12px; top: 12px; width: auto; height: auto; clip: auto; background: var(--k-maroon); color: #fff; padding: 12px 18px; border-radius: 8px; z-index: 100000; }

/* Reading progress bar (single posts) */
.k-progress { position: fixed; top: 0; left: 0; height: 4px; width: 0; background: linear-gradient(90deg, var(--k-gold), var(--k-maroon)); z-index: 1001; transition: width .1s linear; }

/* ------------------------------------------------------------------ */
/* Header                                                              */
/* ------------------------------------------------------------------ */
.site-header {
	position: sticky; top: 0; z-index: 999;
	background: rgba(255, 250, 243, .96);
	backdrop-filter: saturate(140%) blur(6px);
	border-bottom: 1px solid var(--k-line);
	padding: 10px 16px !important;
	max-width: none !important;
}
.site-header > * { max-width: var(--k-max); }
.site-header .wp-block-site-title { margin: 0; font-size: 1.25rem; letter-spacing: .01em; }
.site-header .wp-block-site-title a { color: var(--k-maroon); font-weight: 800; display: inline-flex; align-items: center; gap: 8px; }
.site-header .wp-block-site-title a::before { content: "ॐ"; color: var(--k-gold); font-size: 1.35em; line-height: 1; }
.site-header .wp-block-navigation a { color: var(--k-ink); font-weight: 600; font-size: .98rem; padding: 6px 4px; border-bottom: 2px solid transparent; }
.site-header .wp-block-navigation a:hover { color: var(--k-maroon); border-bottom-color: var(--k-gold); text-decoration: none; }
.site-header .wp-block-navigation__responsive-container-open,
.site-header .wp-block-navigation__responsive-container-close { color: var(--k-maroon); }
.site-header .wp-block-navigation__responsive-container-open svg { width: 30px; height: 30px; }
.wp-block-navigation__responsive-container.is-menu-open { background: var(--k-cream) !important; padding: 24px !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 0 !important; }
.wp-block-navigation__responsive-container.is-menu-open a { display: block; padding: 16px 6px; font-size: 1.18rem; border-bottom: 1px solid var(--k-line); width: 100%; }

/* ------------------------------------------------------------------ */
/* Homepage hero + category chips                                      */
/* ------------------------------------------------------------------ */
.k-hero {
	background: radial-gradient(1200px 400px at 20% -20%, #fbe6c2 0%, transparent 60%),
	            linear-gradient(180deg, #fdf3e2 0%, var(--k-cream) 100%);
	border-bottom: 1px solid var(--k-line);
	padding: 40px 16px 26px;
	text-align: center;
}
.k-hero h1 { margin: 0 0 8px; font-size: clamp(1.7rem, 5vw, 2.6rem); color: var(--k-maroon); line-height: 1.2; }
.k-hero p { margin: 0 auto; max-width: 640px; color: var(--k-muted); font-size: 1.05rem; }
.k-chips { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin: 22px auto 0; max-width: 820px; padding: 0; list-style: none; }
.k-chips a {
	display: inline-flex; align-items: center; gap: 6px;
	background: var(--k-paper); border: 1px solid var(--k-line); border-radius: 999px;
	padding: 10px 16px; font-weight: 600; font-size: .95rem; color: var(--k-ink);
	box-shadow: 0 2px 6px rgba(60,30,10,.05); min-height: 44px;
}
.k-chips a:hover { border-color: var(--k-gold); color: var(--k-maroon); text-decoration: none; transform: translateY(-1px); }

.k-section { max-width: var(--k-max); margin: 0 auto; padding: 28px 16px 8px; }
.k-section-title { display: flex; align-items: center; gap: 12px; margin: 0 0 16px; font-size: 1.25rem; color: var(--k-maroon); }
.k-section-title::after { content: ""; flex: 1; height: 1px; background: var(--k-line); }

/* Hub tiles */
.k-hubs { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; padding: 0; margin: 0; list-style: none; }
.k-hubs a {
	display: flex; flex-direction: column; gap: 6px; min-height: 96px;
	background: linear-gradient(135deg, var(--k-maroon) 0%, var(--k-maroon-dark) 100%);
	color: #fff; border-radius: var(--k-radius); padding: 16px; font-weight: 700; line-height: 1.3;
	box-shadow: var(--k-shadow);
}
.k-hubs a small { font-weight: 500; opacity: .85; font-size: .8rem; }
.k-hubs a:hover { text-decoration: none; transform: translateY(-2px); box-shadow: var(--k-shadow-hover); }

/* ------------------------------------------------------------------ */
/* Post cards (home, archives, related)                                */
/* ------------------------------------------------------------------ */
.wp-block-post-template { gap: 16px !important; }
.k-card, .related-card {
	display: flex; flex-direction: column; gap: 8px;
	background: var(--k-paper); border: 1px solid var(--k-line); border-left: 5px solid var(--k-gold);
	border-radius: var(--k-radius); padding: 18px 18px 16px; color: var(--k-ink);
	box-shadow: var(--k-shadow); transition: transform .15s ease, box-shadow .15s ease;
	height: 100%;
}
.k-card:hover, .related-card:hover { transform: translateY(-3px); box-shadow: var(--k-shadow-hover); text-decoration: none; }
.k-card__img { margin: -18px -18px 6px -18px !important; border-radius: calc(var(--k-radius) - 2px) calc(var(--k-radius) - 2px) 0 0; overflow: hidden; }
.k-card__img img { width: 100%; height: auto; display: block; }
.k-card .wp-block-post-terms, .related-card__label, .k-badge {
	font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; font-weight: 800; color: var(--k-maroon);
}
.k-card .wp-block-post-terms a { color: inherit; }
.k-card .wp-block-post-title { margin: 0; font-size: 1.12rem; line-height: 1.4; }
.k-card .wp-block-post-title a { color: var(--k-ink); }
.k-card .wp-block-post-title a:hover { color: var(--k-maroon); }
.k-card .wp-block-post-excerpt { margin: 0; color: var(--k-muted); font-size: .95rem; line-height: 1.6; }
.k-card .wp-block-post-excerpt__more-text { margin-top: 6px; }
.k-card .wp-block-post-excerpt__more-link { font-weight: 700; color: var(--k-maroon); }
.k-card .wp-block-post-date { font-size: .8rem; color: var(--k-muted); margin-top: auto; }
.related-card__title { font-weight: 700; line-height: 1.4; }
.related-card__img { width: calc(100% + 36px); margin: -18px -18px 6px -18px; border-radius: calc(var(--k-radius) - 2px) calc(var(--k-radius) - 2px) 0 0; aspect-ratio: 16/9; object-fit: cover; }

/* Category accent colors on cards */
.category-tantra-mantra-sadhana .k-card, .related-card.cat-tantra-mantra-sadhana { border-left-color: #7a1220; }
.category-tyohar-tithi .k-card,        .related-card.cat-tyohar-tithi        { border-left-color: #d9a441; }
.category-prem-vivah .k-card,          .related-card.cat-prem-vivah          { border-left-color: #c2417a; }
.category-suraksha-jagrukta .k-card,   .related-card.cat-suraksha-jagrukta   { border-left-color: #2f6f73; }
.category-court-vyapar .k-card,        .related-card.cat-court-vyapar        { border-left-color: #3a5aa8; }
.category-puja-parampara .k-card,      .related-card.cat-puja-parampara      { border-left-color: #b8651b; }

/* Pagination */
.wp-block-query-pagination { max-width: var(--k-max); margin: 24px auto 0; padding: 0 16px; justify-content: center; gap: 10px; }
.wp-block-query-pagination a, .wp-block-query-pagination .page-numbers { display: inline-flex; min-width: 44px; min-height: 44px; align-items: center; justify-content: center; padding: 0 14px; border: 1px solid var(--k-line); border-radius: 10px; background: var(--k-paper); font-weight: 600; }
.wp-block-query-pagination .current { background: var(--k-maroon); color: #fff; border-color: var(--k-maroon); }

/* Archive header */
.k-archive-head { max-width: var(--k-max); margin: 0 auto; padding: 32px 16px 4px; }
.k-archive-head h1 { margin: 0 0 6px; color: var(--k-maroon); font-size: clamp(1.5rem, 4vw, 2.1rem); }
.k-archive-head .wp-block-term-description { color: var(--k-muted); margin: 0; }

/* ------------------------------------------------------------------ */
/* Single article                                                      */
/* ------------------------------------------------------------------ */
.breadcrumbs { font-size: .85rem; color: var(--k-muted); max-width: var(--k-read); margin: 0 auto; padding: 16px 0 0; }
.breadcrumbs a { color: var(--k-muted); }
.breadcrumbs a:hover { color: var(--k-maroon); }

.single-article { max-width: var(--k-read) !important; margin: 0 auto; padding: 8px 16px 40px; }
.single-article > * { max-width: none !important; }
.single-article h1.wp-block-post-title { font-size: clamp(1.65rem, 4.6vw, 2.35rem); line-height: 1.25; margin: 10px 0 12px; color: var(--k-ink); }
.entry-meta { color: var(--k-muted); font-size: .9rem; gap: 6px !important; margin-bottom: 18px; flex-wrap: wrap; }
.entry-meta a { color: var(--k-maroon); font-weight: 600; }
.k-readtime { display: inline-flex; align-items: center; gap: 4px; }
.k-readtime::before { content: "⏱"; }

.entry-content { font-size: 1.1rem; line-height: 1.9; }
.entry-content > p:first-of-type { font-size: 1.16rem; color: #3a2e22; }
.entry-content h2 { margin: 2.1em 0 .6em; color: var(--k-maroon); font-size: 1.45rem; line-height: 1.3; padding-top: 4px; scroll-margin-top: 80px; }
.entry-content h3 { margin: 1.5em 0 .4em; font-size: 1.15rem; scroll-margin-top: 80px; }
.entry-content a { color: #a3341f; border-bottom: 1px solid #e3c9a8; }
.entry-content a:hover { background: var(--k-gold-soft); text-decoration: none; }
.entry-content ul, .entry-content ol { padding-left: 1.4em; }
.entry-content li { margin-bottom: .45em; }
.entry-content blockquote { border-left: 4px solid var(--k-gold); margin: 1.5em 0; padding: .6em 1.2em; background: #fdf6e9; color: #5a4a35; border-radius: 0 10px 10px 0; }
.entry-content table { width: 100%; border-collapse: collapse; margin: 1.4em 0; font-size: .95rem; display: block; overflow-x: auto; }
.entry-content th, .entry-content td { border: 1px solid var(--k-line); padding: 10px 12px; text-align: left; vertical-align: top; }
.entry-content th { background: var(--k-gold-soft); color: var(--k-ink); font-weight: 700; white-space: nowrap; }
.entry-content tr:nth-child(even) td { background: #fdf8ef; }
.entry-content strong { color: #1f1712; }
.entry-content hr { border: 0; border-top: 1px solid var(--k-line); margin: 2em 0; }

/* Table of contents */
.k-toc { background: var(--k-paper); border: 1px solid var(--k-line); border-radius: var(--k-radius); padding: 16px 18px; margin: 20px 0 26px; box-shadow: var(--k-shadow); }
.k-toc summary { cursor: pointer; font-weight: 800; color: var(--k-maroon); list-style: none; display: flex; align-items: center; gap: 8px; }
.k-toc summary::-webkit-details-marker { display: none; }
.k-toc summary::before { content: "☰"; color: var(--k-gold); }
.k-toc ol { margin: 12px 0 0; padding-left: 1.3em; }
.k-toc li { margin: 6px 0; }
.k-toc a { color: var(--k-ink); border: 0; }
.k-toc a:hover { color: var(--k-maroon); }

/* FAQ */
.faq-item { border: 1px solid var(--k-line); border-radius: 12px; padding: 14px 16px; margin: 10px 0; background: var(--k-paper); }
.faq-q { font-weight: 800; color: var(--k-ink); margin: 0 0 .4em !important; font-size: 1.05rem !important; padding-left: 26px; position: relative; }
.faq-q::before { content: "?"; position: absolute; left: 0; top: 0; width: 20px; height: 20px; border-radius: 50%; background: var(--k-gold); color: #fff; font-size: .8rem; display: inline-flex; align-items: center; justify-content: center; }
.faq-a { margin: 0; color: #4a3c2c; }

/* Disclaimer */
.disclaimer-box { background: #f6efe0; border: 1px solid #e6d6b3; border-radius: 12px; padding: 14px 18px; font-size: .92rem; color: #5a4a35; margin: 1.5em 0; }
.disclaimer-box p { margin: 0; }

/* Key takeaways callout (optional, from content) */
.k-callout { background: var(--k-gold-soft); border-left: 5px solid var(--k-gold); border-radius: 0 12px 12px 0; padding: 14px 18px; margin: 1.5em 0; }

/* ------------------------------------------------------------------ */
/* Engagement blocks after content                                     */
/* ------------------------------------------------------------------ */
.k-share { max-width: var(--k-read); margin: 2em auto 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.k-share__label { width: 100%; font-weight: 700; color: var(--k-ink); margin-bottom: 2px; }
.k-share__btn { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: 999px; font-weight: 700; color: #fff !important; border: 0; cursor: pointer; font-size: .95rem; text-decoration: none !important; box-shadow: var(--k-shadow); }
.k-share__btn:hover { transform: translateY(-1px); box-shadow: var(--k-shadow-hover); }
.k-share__wa { background: #25d366; }
.k-share__tg { background: #229ed9; }
.k-share__fb { background: #1877f2; }
.k-share__x { background: #111; }
.k-share__copy { background: var(--k-maroon); }

.related-articles { max-width: var(--k-read); margin: 2.5em auto 0; padding: 24px 0 0; border-top: 2px solid var(--k-gold-soft); }
.related-articles h2 { font-size: 1.2rem; color: var(--k-maroon); margin: 0 0 14px; }
.related-articles__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; }

.continue-reading { max-width: var(--k-read); margin: 1.4em auto 0; }
.continue-reading a {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	background: linear-gradient(135deg, var(--k-maroon), var(--k-maroon-dark)); color: #fff !important;
	padding: 16px 20px; border-radius: 12px; font-weight: 700; line-height: 1.35; box-shadow: var(--k-shadow);
}
.continue-reading a::after { content: "→"; font-size: 1.4rem; flex: none; }
.continue-reading a:hover { text-decoration: none; transform: translateY(-2px); box-shadow: var(--k-shadow-hover); }

.k-topic-strip { max-width: var(--k-read); margin: 2em auto 0; padding: 18px; background: var(--k-paper); border: 1px solid var(--k-line); border-radius: var(--k-radius); }
.k-topic-strip h2 { font-size: 1.05rem; margin: 0 0 10px; color: var(--k-ink); }
.k-topic-strip .k-chips { justify-content: flex-start; margin: 0; }

/* ------------------------------------------------------------------ */
/* Footer                                                              */
/* ------------------------------------------------------------------ */
.site-footer { background: var(--k-ink); color: #d9cbb2; margin-top: 60px; padding: 40px 16px 28px !important; max-width: none !important; }
.site-footer > * { max-width: var(--k-max); margin-left: auto; margin-right: auto; }
.site-footer a { color: #f1dfb8; }
.footer-inner { gap: 28px !important; }
.footer-inner h3 { color: #fff; font-size: .95rem; margin: 0 0 10px; letter-spacing: .04em; text-transform: uppercase; }
.footer-inner ul { list-style: none; padding: 0; margin: 0; }
.footer-inner li { margin-bottom: 8px; font-size: .95rem; }
.footer-inner .wp-block-navigation a { padding: 4px 0; }
.footer-bottom { margin-top: 26px; padding-top: 18px; border-top: 1px solid #453a2c; font-size: .82rem; color: #a79878; }
.footer-bottom p { margin: 0; }

/* ------------------------------------------------------------------ */
/* Mobile refinements                                                  */
/* ------------------------------------------------------------------ */
@media (max-width: 600px) {
	.wp-block-post-template.is-layout-grid { grid-template-columns: 1fr !important; }
	.entry-content { font-size: 1.05rem; line-height: 1.85; }
	.k-hero { padding: 30px 16px 20px; }
	.k-hubs { grid-template-columns: repeat(2, 1fr); }
	.continue-reading a { font-size: .98rem; }
}
