/* v151.css — topbar + heading + palette overrides for legacy pages
   that own inline styles (about, privacy, terms, editorial-policy,
   tools, k12, ncert, upsc*, mpsc*, wbcs*, tnpsc*, tspsc*, authors,
   day-*, full-form-*, essay-*, contact, 404, downloads, important-days).
   Loaded via one <link> after each page's own <style> so it wins the
   cascade without touching source HTML. */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,72,500;1,72,400;1,72,500&family=Inter:wght@400;500;600&display=swap');

/* --- 1. Re-declare CSS custom properties from the old palette. Older
   inline stylesheets set --saffron:#22C55E (mislabelled from an earlier
   bulk-swap); re-point every legacy var into the v151 palette. */
:root{
  --saffron:#E85A3E !important;
  --saffron-700:#FFA07A !important;
  --saffron-50:rgba(232,90,62,.10) !important;
  --green:#4ADE80 !important;
  --navy:#1B1B26 !important;
  --bg:#0A0A0F !important;
  --surface:#13131A !important;
  --ink:#FAFAF7 !important;
  --ink-2:#C9C9D3 !important;
  --grey:#8B8B95 !important;
  --line:rgba(255,255,255,0.10) !important;
  --coral:#E85A3E;
  --jade:#4ADE80;
  --saffron-v151:#F8B84E;
}

/* --- 2. Hide the sitewide tricolour bands (already removed for brand
   compliance in v150). */
.tiranga-top,footer .tiranga-edge,.tiranga-band{display:none !important}

/* --- 3. Body + link defaults. Radial glow at top-right + a jade bloom
   at bottom-left carries the SEO/article page ambience. */
body{font-family:'Inter','Noto Sans Devanagari','Noto Sans Tamil','Noto Sans Bengali',system-ui,sans-serif !important;background:radial-gradient(900px 600px at 85% -10%,rgba(34,197,94,.06),transparent 55%),radial-gradient(700px 500px at 5% 110%,rgba(232,90,62,.05),transparent 60%),#0A0A0F !important;color:#FAFAF7 !important;position:relative}
a{color:#FAFAF7}
a:hover{color:#FAFAF7}

/* --- 3b. Floating language-glyph layer. Positioned by DOM (each .bg-glyph
   carries its own top/left/font-family inline). Six drift keyframes keep
   the motion subtle. Respects prefers-reduced-motion. */
.bg-glyphs{position:fixed;top:78px;left:0;right:0;bottom:0;pointer-events:none;z-index:0;overflow:hidden;contain:strict;mix-blend-mode:plus-lighter;opacity:.6}@media (max-width:780px){.bg-glyphs{opacity:.55}.bg-glyph:nth-child(3n),.bg-glyph:nth-child(3n+1){display:none}.bg-glyph{font-size:.72em !important}}
.bg-glyph{position:absolute;font-weight:700;line-height:1;letter-spacing:-.02em;user-select:none;white-space:nowrap;transform:translate(-50%,-50%);will-change:transform}
@keyframes drift1{0%,100%{transform:translate(-50%,-50%)}50%{transform:translate(-50%,-50%) translate(22px,-28px) rotate(3deg)}}
@keyframes drift2{0%,100%{transform:translate(-50%,-50%)}50%{transform:translate(-50%,-50%) translate(-26px,20px) rotate(-3.5deg)}}
@keyframes drift3{0%,100%{transform:translate(-50%,-50%)}50%{transform:translate(-50%,-50%) translate(30px,16px) rotate(2deg)}}
@keyframes drift4{0%,100%{transform:translate(-50%,-50%)}33%{transform:translate(-50%,-50%) translate(-18px,-24px) rotate(-2deg)}66%{transform:translate(-50%,-50%) translate(24px,12px) rotate(3deg)}}
@keyframes drift5{0%,100%{transform:translate(-50%,-50%)}50%{transform:translate(-50%,-50%) translate(-30px,-16px) rotate(4deg)}}
@keyframes drift6{0%,100%{transform:translate(-50%,-50%)}50%{transform:translate(-50%,-50%) translate(18px,30px) rotate(-3deg)}}
.bg-glyph.d1{animation:drift1 26s ease-in-out infinite}
.bg-glyph.d2{animation:drift2 34s ease-in-out infinite}
.bg-glyph.d3{animation:drift3 42s ease-in-out infinite}
.bg-glyph.d4{animation:drift4 50s ease-in-out infinite}
.bg-glyph.d5{animation:drift5 60s ease-in-out infinite}
.bg-glyph.d6{animation:drift6 72s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.bg-glyph{animation:none !important}}
/* Make content stack above the glyphs */
header.nav,main,article,section,footer,.container,.container-wide{position:relative;z-index:1}

/* --- 4. Topbar. */
.nav,header.nav{background:rgba(10,10,15,.72) !important;backdrop-filter:saturate(140%) blur(10px) !important;-webkit-backdrop-filter:saturate(140%) blur(10px) !important;border-bottom:1px solid rgba(255,255,255,.10) !important}
.nav .brand,header .brand{font-family:'Fraunces',serif !important;font-weight:500 !important;font-size:15px !important;letter-spacing:-.01em !important;color:#FAFAF7 !important}
.nav .brand small,header .brand small{display:none !important}
.nav .brand-logo,header .brand-logo,header .brand-mark,.brand-mark{width:28px !important;height:28px !important;border-radius:6px !important;filter:none !important}
.nav .brand span[style*="accent-400"],.brand .dot,.brand .brand-dot,.brand span[style*="color:var(--saffron-700)"]{color:#E85A3E !important}

/* --- 5. Nav standardisation. The whole site collapses to ONE pattern:
   brand + hamburger. No horizontal desktop nav, no CTA button — every
   destination lives in the drawer so nothing needs updating in two places
   when the IA changes. */
.site-nav,header nav.site-nav,.nav-cta,header .nav-cta{display:none !important}
.nav-hamburger,button.nav-hamburger{display:inline-flex !important;background:transparent !important;border:0 !important;cursor:pointer !important;padding:.45rem !important;color:#FAFAF7 !important;border-radius:8px !important}
.nav-hamburger svg,button.nav-hamburger svg{width:22px !important;height:22px !important;display:block !important;stroke:#FAFAF7 !important}
.nav-hamburger:hover{background:rgba(255,255,255,.06) !important}
.nav-hamburger:focus-visible{outline:2px solid #E85A3E !important;outline-offset:2px !important}
/* Legacy lang-btn (small "Eng" pill) stays visible; drawer holds the full switcher */
.lang-btn,.lang-pill{background:transparent !important;color:#FAFAF7 !important;border:1px solid rgba(255,255,255,.20) !important;font-size:12px !important;font-weight:500 !important;padding:5px 11px !important;border-radius:999px !important;min-width:44px !important}

/* --- 7. Headings — Fraunces across all legacy pages. */
h1,.hero h1,article h1,article .h1{font-family:'Fraunces','Noto Serif Devanagari','Noto Sans Devanagari','Noto Sans Bengali','Noto Sans Tamil',serif !important;font-weight:500 !important;letter-spacing:-.032em !important;color:#FAFAF7 !important}
h2,article h2{font-family:'Fraunces','Noto Serif Devanagari','Noto Sans Devanagari','Noto Sans Bengali','Noto Sans Tamil',serif !important;font-weight:500 !important;letter-spacing:-.022em !important;color:#FAFAF7 !important}
h3{color:#FAFAF7 !important}
p,li{color:#C9C9D3}
article strong,body strong{color:#FAFAF7}

/* --- 8. Cards + callouts — neutralise old-green accents on shared
   patterns that appear across articles and legacy pages. */
.qa-block{border-left-color:#4ADE80 !important;background:transparent !important}
.related-card::before,.stat-card::before,.navigation-strip a::before{background:linear-gradient(90deg,rgba(232,90,62,.55),rgba(74,222,128,.35)) !important;height:1px !important}
.badge-ch,.pyq-callout strong{color:#4ADE80 !important}
.stat-card .big,.stat-grid .stat-card:nth-child(even) .big{color:#E85A3E !important}
.callout{background:rgba(74,222,128,.06) !important;border-left:2px solid #4ADE80 !important;border-radius:0 !important;color:#C9C9D3 !important;padding:.5rem 0 .5rem 1rem !important;font-style:normal;font-family:'Fraunces',serif !important}
.callout strong{color:#4ADE80 !important;font-family:'Inter',sans-serif !important;font-style:normal}

/* --- 9. Article "Continue on mobile" download CTA — inline-styled
   green cards baked into 925 article HTML files. Attribute selectors
   swap them to a neutral coral pill. */
a[style*="linear-gradient(135deg,#22C55E,#16A34A)"]{background:#FAFAF7 !important;color:#0A0A0F !important;border:0 !important;box-shadow:none !important}
div[style*="color:#86EFAC"]{color:#E85A3E !important}
div[style*="linear-gradient(90deg,#F7941D,#22C55E,#16A34A)"]{background:linear-gradient(90deg,rgba(232,90,62,.55),rgba(74,222,128,.35)) !important;height:1px !important}

/* --- 10. Contact + editorial-team style contact-cards. */
.contact-card{background:transparent !important;border:0 !important;border-top:1px solid rgba(255,255,255,.10) !important;border-radius:0 !important;color:#C9C9D3 !important;padding:1.8rem 0 !important}
.contact-card h3{color:#4ADE80 !important;font-family:'Fraunces',serif !important;font-style:normal;font-weight:500 !important}
.contact-card p,.contact-card a{color:#C9C9D3 !important}
.contact-card a{text-decoration:underline !important;text-decoration-color:rgba(255,255,255,.20) !important;text-underline-offset:3px}

/* --- 11. Footer polish. */
footer{background:transparent !important;border-top:1px solid rgba(255,255,255,.10) !important;color:#8B8B95 !important}
footer .brand-quote{font-family:'Fraunces',serif !important;font-style:normal !important;color:#4ADE80 !important;background:none !important;-webkit-background-clip:initial !important;-webkit-text-fill-color:initial !important;font-weight:500 !important}
footer a{color:#C9C9D3 !important;text-decoration:underline !important;text-decoration-color:rgba(255,255,255,.15) !important;text-underline-offset:3px}
footer a:hover{color:#FAFAF7 !important}

/* --- 12. Background language glyphs — soften saturation on the greens. */
.bg-glyph[style*="rgba(34,197,94"]{color:rgba(232,90,62,.09) !important}
.bg-glyph[style*="rgba(74,222,128"]{color:rgba(248,184,78,.09) !important}

/* --- 13. Mobile safety. */
@media (max-width:600px){.site-nav{display:none !important}}