/* ==========================================================================
   Panchayat Guruji — design system (loaded last so it wins over legacy rules)
   Palette: forest green + saffron + warm cream. Typeface: Mukta (self-hosted).
   ========================================================================== */

@font-face { font-family: 'GJ Mukta'; font-style: normal; font-weight: 600; font-display: swap;
  src: url(/fonts/mukta-devanagari-600.woff2) format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF; }
@font-face { font-family: 'GJ Mukta'; font-style: normal; font-weight: 600; font-display: swap;
  src: url(/fonts/mukta-latin-600.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'GJ Mukta'; font-style: normal; font-weight: 800; font-display: swap;
  src: url(/fonts/mukta-devanagari-800.woff2) format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FF; }
@font-face { font-family: 'GJ Mukta'; font-style: normal; font-weight: 800; font-display: swap;
  src: url(/fonts/mukta-latin-800.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --gj-forest: #0A3B2C;
  --gj-forest-2: #115C42;
  --gj-teal: #0F8B6D;
  --gj-saffron: #F59E0B;
  --gj-orange: #F97316;
  --gj-cream: #FFF8EC;
  --gj-ink: #142A21;
  --gj-font: 'GJ Mukta', 'Noto Sans Devanagari', 'Nirmala UI', system-ui, sans-serif;
  --gj-shadow-1: 0 1px 2px rgba(10, 59, 44, .06), 0 8px 24px -10px rgba(10, 59, 44, .22);
  --gj-shadow-2: 0 2px 6px rgba(10, 59, 44, .08), 0 26px 50px -18px rgba(10, 59, 44, .34);
  --gj-ease: cubic-bezier(.2, .8, .2, 1);
}

h1, h2, h3, .gj-display { font-family: var(--gj-font); }

html, body { overflow-x: clip !important; overflow-y: visible !important; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  background:
    radial-gradient(1100px 520px at 88% -8%, rgba(245, 158, 11, .15), transparent 62%),
    radial-gradient(900px 520px at -8% 6%, rgba(15, 139, 109, .10), transparent 60%),
    linear-gradient(180deg, var(--bg-body) 0%, var(--bg-surface) 100%) !important;
}

::selection { background: var(--gj-saffron); color: #2B1500; }

/* ------------------------------------------------------------------ header */
#portal-header {
  background: color-mix(in srgb, var(--bg-card) 84%, transparent) !important;
  backdrop-filter: saturate(1.4) blur(14px);
  -webkit-backdrop-filter: saturate(1.4) blur(14px);
  border-bottom: 1px solid color-mix(in srgb, var(--border-color) 70%, transparent) !important;
  box-shadow: 0 6px 24px -14px rgba(10, 59, 44, .35) !important;
}
#portal-header img[alt="Panchayat Guruji logo"] {
  border: 2px solid #fff !important;
  box-shadow: 0 6px 16px -6px rgba(10, 59, 44, .5) !important;
  border-radius: 14px !important;
}
#portal-header h1 {
  font-family: var(--gj-font);
  font-weight: 800 !important;
  font-size: 1.45rem !important;
  line-height: 1.15;
  letter-spacing: -.01em;
  color: var(--gj-forest) !important;
}
#portal-header a > div > p { color: var(--text-secondary) !important; font-weight: 600; }

#portal-header [role="note"] {
  background: linear-gradient(90deg, #FFF1D6, #FFE7B8) !important;
  border-top: 1px solid rgba(217, 119, 6, .25) !important;
  box-shadow: none !important;
}
#portal-header [role="note"] p { color: #7A4A06 !important; font-weight: 600; text-align: center; }

#account-signed-out button,
#header-actions #account-signed-in button:first-of-type {
  background: linear-gradient(135deg, #FFB020, #F97316) !important;
  color: #2B1500 !important;
  border: 0 !important;
  border-radius: 12px !important;
  font-weight: 800 !important;
  padding: .6rem 1rem !important;
  box-shadow: 0 10px 22px -10px rgba(249, 115, 22, .8) !important;
  transition: transform .15s var(--gj-ease), box-shadow .2s;
}
#account-signed-out button * { color: #2B1500 !important; }
#account-signed-out button:hover { transform: translateY(-1px); }
#language-toggle {
  background: color-mix(in srgb, var(--bg-card) 90%, transparent) !important;
  border: 1px solid var(--border-color) !important;
  border-radius: 12px !important;
}
#language-toggle, #language-toggle * { color: var(--text-primary) !important; }

/* The team / admin entrances belong to staff, not to every visitor: they live in the footer. */
#tab-work, #header-actions .relative:has(> button[onclick="openContentAdmin()"]) { display: none !important; }

/* ----------------------------------------------------------- side navigation */
#page-navigation {
  background: color-mix(in srgb, var(--bg-card) 92%, transparent) !important;
  backdrop-filter: blur(10px);
}
#page-nav-links { padding: .75rem !important; gap: .25rem !important; }
#page-nav-links .tab-btn {
  width: 100% !important;
  min-height: 2.6rem !important;
  border-radius: 14px !important;
  padding: .55rem .7rem !important;
  font-size: .8rem !important;
  font-weight: 700 !important;
  gap: .65rem !important;
  transition: background .18s, transform .18s var(--gj-ease), box-shadow .18s !important;
}
#page-nav-links .tab-btn i {
  width: 1.9rem !important; height: 1.9rem; display: inline-grid; place-items: center; flex: 0 0 auto;
  border-radius: 10px; background: color-mix(in srgb, var(--gj-saffron) 16%, transparent);
  color: #B45309 !important; font-size: .8rem;
}
#page-nav-links .tab-btn:hover { transform: translateX(2px); }
#page-nav-links .tab-btn.bg-emerald-600 {
  background: linear-gradient(135deg, var(--gj-forest), var(--gj-forest-2)) !important;
  border: 0 !important;
  border-left: 0 !important;
  box-shadow: 0 12px 22px -12px rgba(10, 59, 44, .8) !important;
}
#page-nav-links .tab-btn.bg-emerald-600, #page-nav-links .tab-btn.bg-emerald-600 * { color: #fff !important; }
#page-nav-links .tab-btn.bg-emerald-600 i { background: rgba(255, 255, 255, .18); }
#page-nav-links summary { font-weight: 700; color: var(--text-secondary) !important; padding: .4rem .6rem; cursor: pointer; }

/* --------------------------------------------------------------- shared bits */
.gj-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
  min-height: 48px; padding: 0 1.4rem; border-radius: 14px; border: 0; cursor: pointer;
  font-family: var(--gj-font); font-weight: 800; font-size: 1rem; line-height: 1;
  transition: transform .15s var(--gj-ease), box-shadow .2s, background .2s;
  text-decoration: none;
}
.gj-btn, .gj-btn * { color: inherit !important; }
.gj-btn:active { transform: translateY(1px) scale(.99); }
.gj-btn-primary { background: linear-gradient(135deg, #FFB020, #F97316); color: #2B1500 !important; box-shadow: 0 14px 28px -12px rgba(249, 115, 22, .9); }
.gj-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 18px 32px -12px rgba(249, 115, 22, 1); }
.gj-btn-ghost { background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .38); color: #fff !important; backdrop-filter: blur(6px); }
.gj-btn-ghost:hover { background: rgba(255, 255, 255, .2); transform: translateY(-2px); }
.gj-btn-forest { background: linear-gradient(135deg, var(--gj-forest), var(--gj-forest-2)); color: #fff !important; box-shadow: 0 14px 28px -14px rgba(10, 59, 44, .9); }
.gj-btn-forest:hover { transform: translateY(-2px); }
.gj-btn-white { background: #fff; color: #3B0764 !important; box-shadow: 0 14px 28px -12px rgba(0, 0, 0, .45); }
.gj-btn-white:hover { transform: translateY(-2px); }

:focus-visible, [tabindex="-1"]:focus-visible { outline: none; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--gj-saffron) 80%, #fff); outline-offset: 2px;
}

.gj-section { margin-top: clamp(30px, 5vw, 60px); }
#view-home > .gj-section { margin-top: clamp(30px, 5vw, 56px) !important; }
.gj-section-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.gj-kicker { display: block; font-weight: 800; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: #C2610C !important; }
.gj-h2 { font-family: var(--gj-font); font-weight: 800 !important; font-size: clamp(1.5rem, 3.2vw, 2.2rem) !important; line-height: 1.2; margin: 4px 0 0; color: var(--text-primary) !important; }
.gj-lead { max-width: 46rem; margin: 6px 0 0; font-size: 1rem; line-height: 1.6; color: var(--text-secondary) !important; }

/* ---------------------------------------------------------------------- hero */
.gj-hero {
  position: relative; overflow: hidden; isolation: isolate; color: #fff;
  border-radius: clamp(24px, 3vw, 34px);
  padding: clamp(22px, 4vw, 50px);
  background:
    radial-gradient(900px 420px at 86% 8%, rgba(245, 158, 11, .34), transparent 60%),
    radial-gradient(700px 380px at 0% 100%, rgba(15, 139, 109, .5), transparent 62%),
    linear-gradient(135deg, #062419 0%, #0A3B2C 46%, #0E5A43 100%);
  box-shadow: var(--gj-shadow-2);
}
.gj-hero::before {
  content: ""; position: absolute; inset: 0; z-index: -1; opacity: .55; pointer-events: none;
  background-image: radial-gradient(rgba(255, 255, 255, .16) 1.2px, transparent 1.3px);
  background-size: 22px 22px;
  -webkit-mask-image: linear-gradient(180deg, #000, transparent 78%); mask-image: linear-gradient(180deg, #000, transparent 78%);
}
.gj-hero p, .gj-hero span, .gj-hero label, .gj-hero a, .gj-hero li { color: inherit !important; }
.gj-hero-grid { display: grid; gap: clamp(22px, 4vw, 40px); align-items: center; }
@media (min-width: 980px) { .gj-hero-grid { grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); } }

.gj-eyebrow {
  display: inline-flex; align-items: center; gap: .6rem; padding: .4rem .95rem; border-radius: 999px;
  font-weight: 700; font-size: .85rem; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .24);
  backdrop-filter: blur(6px); color: #fff !important;
}
.gj-dot { width: 9px; height: 9px; border-radius: 50%; background: #4ADE80; box-shadow: 0 0 0 0 rgba(74, 222, 128, .7); animation: gjPing 2s infinite; }
@keyframes gjPing { 0% { box-shadow: 0 0 0 0 rgba(74, 222, 128, .65); } 70%, 100% { box-shadow: 0 0 0 10px rgba(74, 222, 128, 0); } }

.gj-title {
  font-family: var(--gj-font); font-weight: 800 !important; color: #fff !important;
  font-size: clamp(2.05rem, 5.4vw, 3.7rem) !important; line-height: 1.2 !important; letter-spacing: -.01em; margin: 1rem 0 0 !important;
}
.gj-grad {
  background: linear-gradient(90deg, #FFD166, #FF9F43 60%, #FF7A3D); -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent !important; padding-bottom: .12em; display: inline-block;
}
.gj-sub { margin: 1rem 0 0; max-width: 36rem; font-size: clamp(1rem, 1.7vw, 1.18rem); line-height: 1.7; color: rgba(255, 255, 255, .88) !important; }

.gj-search {
  display: flex; gap: .5rem; margin-top: 1.5rem; padding: .5rem; max-width: 38rem; background: #fff; border-radius: 20px;
  box-shadow: 0 18px 44px -14px rgba(0, 0, 0, .55);
}
.gj-search:focus-within { box-shadow: 0 0 0 4px rgba(255, 176, 32, .55), 0 18px 44px -14px rgba(0, 0, 0, .55); }
.gj-search i.fa-magnifying-glass { align-self: center; margin-left: .85rem; color: #C2610C !important; font-size: 1.05rem; }
.gj-search input {
  flex: 1; min-width: 0; border: 0 !important; outline: 0; background: transparent !important; box-shadow: none !important;
  font-size: 1.05rem; padding: .8rem .6rem !important; color: var(--gj-ink) !important;
}
.gj-search input::placeholder { color: #7B8A82 !important; }
.gj-search .gj-btn { min-height: 46px; padding: 0 1.3rem; }

.gj-quick { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .9rem; align-items: center; }
.gj-quick > span { font-size: .85rem; font-weight: 700; color: rgba(255, 255, 255, .75) !important; }
.gj-pill {
  border: 1px solid rgba(255, 255, 255, .3); background: rgba(255, 255, 255, .1); color: #fff !important; cursor: pointer;
  border-radius: 999px; padding: .38rem .85rem; font-size: .88rem; font-weight: 700; transition: background .2s, transform .15s;
}
.gj-pill:hover { background: rgba(255, 255, 255, .22); transform: translateY(-1px); }

.gj-cta { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.4rem; }
.gj-fine { margin: 1.1rem 0 0; font-size: .8rem; line-height: 1.55; color: rgba(255, 255, 255, .72) !important; }

.gj-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; margin-top: 1.6rem; max-width: 38rem; }
@media (min-width: 640px) { .gj-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.gj-stat { padding: .7rem .85rem; border-radius: 16px; background: rgba(255, 255, 255, .09); border: 1px solid rgba(255, 255, 255, .16); backdrop-filter: blur(6px); }
.gj-stat b { display: block; font-family: var(--gj-font); font-weight: 800; font-size: 1.6rem; line-height: 1.1; color: #FFD166 !important; }
.gj-stat span { display: block; margin-top: .15rem; font-size: .78rem; font-weight: 700; color: rgba(255, 255, 255, .8) !important; }

.gj-scene-wrap { position: relative; width: 100%; max-width: 560px; margin-inline: auto; }
.gj-scene { display: block; width: 100%; height: auto; filter: drop-shadow(0 34px 44px rgba(0, 0, 0, .38)); }
.gj-float {
  position: absolute; display: flex; align-items: center; gap: .55rem; padding: .5rem .8rem; border-radius: 16px;
  background: #fff; color: var(--gj-ink) !important; font-weight: 800; font-size: .84rem; box-shadow: 0 16px 30px -12px rgba(0, 0, 0, .5);
  animation: gjFloat 6s ease-in-out infinite;
}
.gj-float i { width: 1.8rem; height: 1.8rem; display: grid; place-items: center; border-radius: 10px; color: #fff !important; font-size: .8rem; }
.gj-float span { color: var(--gj-ink) !important; }
.gj-float-a { left: -2%; top: 14%; }
.gj-float-b { right: -1%; top: 50%; animation-delay: -2s; }
.gj-float-c { left: 6%; bottom: 8%; animation-delay: -4s; }
@keyframes gjFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@media (max-width: 979px) { .gj-scene-wrap { max-width: 440px; } .gj-float-c { display: none; } }
@media (max-width: 560px) { .gj-float { font-size: .74rem; padding: .4rem .6rem; } .gj-float-a { left: 0; } .gj-float-b { right: 0; } }
@media (prefers-reduced-motion: reduce) { .gj-float, .gj-dot { animation: none !important; } }

/* ------------------------------------------------------------ action cards */
.gj-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
@media (min-width: 768px) { .gj-actions { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; } }
.gj-action {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: .75rem; text-align: left; overflow: hidden;
  padding: 1.1rem; border-radius: 24px; cursor: pointer; background: var(--bg-card); border: 1px solid var(--border-color);
  box-shadow: var(--gj-shadow-1); transition: transform .25s var(--gj-ease), box-shadow .25s, border-color .25s;
}
.gj-action::after {
  content: ""; position: absolute; right: -34px; top: -34px; width: 120px; height: 120px; border-radius: 50%;
  background: var(--gj-a); opacity: .13; transition: transform .4s var(--gj-ease), opacity .3s;
}
.gj-action:hover { transform: translateY(-5px); box-shadow: var(--gj-shadow-2); border-color: color-mix(in srgb, var(--gj-a) 55%, var(--border-color)); }
.gj-action:hover::after { transform: scale(1.7); opacity: .18; }
.gj-ico {
  display: grid; place-items: center; width: 54px; height: 54px; border-radius: 17px; font-size: 1.35rem; color: #fff !important;
  background: linear-gradient(135deg, var(--gj-a), var(--gj-b)); box-shadow: 0 12px 20px -10px var(--gj-a);
}
.gj-ico i { color: #fff !important; }
.gj-action-title { font-family: var(--gj-font); font-weight: 800; font-size: 1.12rem; line-height: 1.25; color: var(--text-primary) !important; }
.gj-action-desc { font-size: .88rem; line-height: 1.5; color: var(--text-secondary) !important; }
.gj-action-go { margin-top: auto; font-size: .85rem; font-weight: 800; color: var(--gj-a) !important; display: inline-flex; gap: .4rem; align-items: center; }
.gj-action-go i { transition: transform .2s var(--gj-ease); }
.gj-action:hover .gj-action-go i { transform: translateX(4px); }
.gj-badge {
  position: absolute; top: .8rem; right: .8rem; z-index: 1; padding: .15rem .55rem; border-radius: 999px; font-size: .7rem; font-weight: 800;
  color: #fff !important; background: linear-gradient(135deg, #EC4899, #8B5CF6);
}

/* ------------------------------------------------------------------- steps */
.gj-steps { display: grid; gap: 1.5rem; }
@media (min-width: 768px) { .gj-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; } }
.gj-step {
  position: relative; padding: 1.7rem 1.3rem 1.3rem; border-radius: 24px; background: var(--bg-card); border: 1px solid var(--border-color); box-shadow: var(--gj-shadow-1);
}
.gj-step-num {
  position: absolute; top: -18px; left: 1.2rem; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 13px;
  font-family: var(--gj-font); font-weight: 800; font-size: 1.15rem; color: #fff !important; background: linear-gradient(135deg, var(--gj-forest-2), var(--gj-teal));
  box-shadow: 0 10px 18px -8px rgba(15, 139, 109, .8);
}
.gj-step h3 { margin: .2rem 0 0; font-weight: 800; font-size: 1.15rem; color: var(--text-primary) !important; }
.gj-step p { margin: .45rem 0 0; font-size: .92rem; line-height: 1.6; color: var(--text-secondary) !important; }
@media (min-width: 768px) {
  .gj-step:not(:last-child)::after { content: "\f054"; font-family: "Font Awesome 6 Free"; font-weight: 900; position: absolute; right: -1.15rem; top: 50%; transform: translateY(-50%); color: var(--gj-saffron); font-size: .9rem; z-index: 2; }
}

/* --------------------------------------------------------- T-shirt studio */
.gj-studio {
  position: relative; overflow: hidden; isolation: isolate; display: grid; gap: 1.5rem; align-items: center; color: #fff;
  padding: clamp(22px, 4vw, 44px); border-radius: clamp(24px, 3vw, 34px);
  background: radial-gradient(600px 300px at 100% 0%, rgba(244, 114, 182, .5), transparent 60%), linear-gradient(135deg, #2E1065 0%, #5B21B6 55%, #BE185D 120%);
  box-shadow: var(--gj-shadow-2);
}
@media (min-width: 860px) { .gj-studio { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); } }
.gj-studio p, .gj-studio span, .gj-studio li, .gj-studio h2 { color: inherit !important; }
.gj-studio h2 { font-family: var(--gj-font); font-weight: 800 !important; font-size: clamp(1.7rem, 3.6vw, 2.6rem) !important; line-height: 1.2; margin: .5rem 0 0; color: #fff !important; }
.gj-studio .gj-kicker { color: #FBCFE8 !important; }
.gj-studio ul { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .55rem; }
.gj-studio li { display: flex; gap: .6rem; align-items: flex-start; font-size: 1rem; font-weight: 600; color: rgba(255, 255, 255, .95) !important; }
.gj-studio li i { margin-top: .25rem; color: #86EFAC !important; }
.gj-shirts { position: relative; min-height: 260px; }
.gj-shirts img {
  position: absolute; width: 56%; max-width: 270px; height: auto; border-radius: 22px; background: #fff;
  box-shadow: 0 26px 40px -16px rgba(0, 0, 0, .6); transition: transform .4s var(--gj-ease);
}
.gj-shirts img:nth-child(1) { left: 2%; top: 14%; transform: rotate(-9deg); }
.gj-shirts img:nth-child(2) { left: 22%; top: 0; transform: rotate(2deg); z-index: 2; }
.gj-shirts img:nth-child(3) { right: 1%; top: 20%; transform: rotate(10deg); }
.gj-studio:hover .gj-shirts img:nth-child(1) { transform: rotate(-13deg) translateX(-8px); }
.gj-studio:hover .gj-shirts img:nth-child(3) { transform: rotate(14deg) translateX(8px); }
.gj-studio:hover .gj-shirts img:nth-child(2) { transform: rotate(0deg) translateY(-8px); }

/* ------------------------------------------------------------------- trust */
.gj-trust { display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); gap: .9rem; }
@media (min-width: 640px) { .gj-trust { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .gj-trust { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.gj-trust-card { padding: 1.2rem; border-radius: 22px; background: var(--bg-card); border: 1px solid var(--border-color); box-shadow: var(--gj-shadow-1); }
.gj-trust-card .gj-ico { width: 46px; height: 46px; border-radius: 14px; font-size: 1.1rem; }
.gj-trust-card h3 { margin: .8rem 0 0; font-weight: 800; font-size: 1.08rem; color: var(--text-primary) !important; }
.gj-trust-card p { margin: .35rem 0 0; font-size: .9rem; line-height: 1.6; color: var(--text-secondary) !important; }
.gj-trust-card.is-honest { background: linear-gradient(180deg, #FFF6E0, #FFFBF0); border-color: rgba(245, 158, 11, .45); }
.gj-trust-card.is-honest h3 { color: #7A4A06 !important; }
.gj-trust-card.is-honest p { color: #6B4A1E !important; }

/* ------------------------------------------------- legacy blocks, restyled */
#view-home .gj-tracker > div:first-child {
  position: relative; border-radius: 26px !important; padding: clamp(18px, 3vw, 30px) !important; box-shadow: var(--gj-shadow-1) !important; overflow: hidden;
  border: 1px solid var(--border-color) !important;
}
#view-home .gj-tracker > div:first-child::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 5px; background: linear-gradient(90deg, #FFB020, #F97316, #0F8B6D); }
#view-home .gj-tracker h2 { font-family: var(--gj-font); font-weight: 800 !important; font-size: clamp(1.4rem, 3vw, 1.9rem) !important; color: var(--text-primary) !important; }
#view-home .gj-tracker button[type="submit"] { background: linear-gradient(135deg, var(--gj-forest), var(--gj-forest-2)) !important; border-radius: 14px !important; color: #fff !important; font-weight: 800; }
#view-home .gj-tracker button[type="submit"] * { color: #fff !important; }
#view-home .gj-tracker input { border-radius: 14px !important; min-height: 48px; font-size: 1rem; }
#view-home .gj-tracker > aside {
  border-radius: 26px !important; padding: clamp(18px, 3vw, 28px) !important; border: 1px solid rgba(15, 139, 109, .3) !important;
  background: linear-gradient(160deg, rgba(15, 139, 109, .12), rgba(245, 158, 11, .10)) !important; box-shadow: var(--gj-shadow-1) !important;
}
#view-home .gj-tracker > aside h3 { color: var(--gj-forest-2) !important; font-weight: 800; }

.gj-fold { border-radius: 24px; background: var(--bg-card); border: 1px solid var(--border-color); box-shadow: var(--gj-shadow-1); overflow: hidden; }
.gj-fold > summary {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem; cursor: pointer; list-style: none; padding: 1.1rem 1.3rem;
  font-family: var(--gj-font); font-weight: 800; font-size: 1.15rem; color: var(--text-primary) !important;
}
.gj-fold > summary::-webkit-details-marker { display: none; }
.gj-fold > summary small { display: block; font-family: system-ui, sans-serif; font-weight: 600; font-size: .82rem; color: var(--text-secondary) !important; margin-top: .15rem; }
.gj-fold > summary i { transition: transform .25s var(--gj-ease); color: #C2610C !important; }
.gj-fold[open] > summary i { transform: rotate(180deg); }
.gj-fold-body { padding: 0 1.3rem 1.3rem; display: grid; gap: 1.25rem; }

/* ------------------------------------------------------------------- footer */
body > footer {
  margin-top: 2rem; padding: 2rem 1rem 1.5rem !important;
  background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--gj-forest) 8%, transparent)) !important; border-top: 0 !important;
}
.gj-foot-links { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem 1.25rem; margin-top: .75rem; }
.gj-foot-links a, .gj-foot-links button { font-size: .85rem; font-weight: 700; color: var(--text-secondary) !important; background: none; border: 0; cursor: pointer; text-decoration: none; }
.gj-foot-links a:hover, .gj-foot-links button:hover { color: var(--gj-forest-2) !important; text-decoration: underline; }
.gj-foot-brand { font-family: var(--gj-font); font-weight: 800; font-size: 1.05rem; color: var(--gj-forest) !important; }
.gj-foot-note { max-width: 40rem; margin: .5rem auto 0; font-size: .78rem; line-height: 1.6; color: var(--text-muted) !important; }

/* --------------------------------------------------- scroll reveal (JS adds) */
.gj-js .gj-reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s var(--gj-ease), transform .7s var(--gj-ease); transition-delay: var(--gj-delay, 0ms); }
.gj-js .gj-reveal.gj-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .gj-js .gj-reveal { opacity: 1; transform: none; transition: none; } }

/* ----------------------------------------------- mobile: app-style bottom bar */
#gj-bottom-nav, #gj-menu-backdrop { display: none; }
@media (max-width: 767px) {
  body { padding-bottom: calc(74px + env(safe-area-inset-bottom)); }
  main { padding-top: 1.1rem !important; }

  #portal-header .py-3 { padding-top: .55rem !important; padding-bottom: .55rem !important; }
  #portal-header h1 { font-size: 1.1rem !important; }
  #portal-header a { gap: .5rem !important; }
  #portal-header .flex-wrap { flex-wrap: nowrap !important; gap: .5rem !important; }
  #account-signed-out button { padding: .5rem .75rem !important; font-size: .8rem !important; gap: .4rem !important; }
  #language-toggle { padding: .5rem .65rem !important; }
  #account-display-name, #account-signed-in button span { display: none; }
  #portal-header a > div > p { display: none; }
  #portal-header img[alt="Panchayat Guruji logo"] { width: 2.5rem !important; height: 2.5rem !important; }
  #header-actions { flex-wrap: nowrap !important; gap: .4rem !important; }
  #header-actions > .glass-surface { display: none !important; }
  #language-toggle-label { display: none; }
  #pwa-install-button span { display: none; }

  #page-navigation { display: none !important; }
  .gj-menu-open #page-navigation {
    display: block !important; position: fixed !important; left: 0; right: 0; top: auto !important;
    bottom: calc(66px + env(safe-area-inset-bottom)); max-height: 72vh; overflow-y: auto; z-index: 70;
    border-radius: 26px 26px 0 0; border: 1px solid var(--border-color) !important; box-shadow: 0 -24px 60px -20px rgba(0, 0, 0, .5) !important;
    background: var(--bg-card) !important; animation: gjSheet .28s var(--gj-ease);
  }
  .gj-menu-open #page-nav-links .tab-btn { min-height: 3rem !important; font-size: .95rem !important; }
  @keyframes gjSheet { from { transform: translateY(24px); opacity: 0; } to { transform: none; opacity: 1; } }
  .gj-menu-open #gj-menu-backdrop { display: block; position: fixed; inset: 0; z-index: 65; background: rgba(6, 36, 25, .5); backdrop-filter: blur(2px); }

  #gj-bottom-nav {
    display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 75;
    padding: .35rem .4rem calc(.35rem + env(safe-area-inset-bottom));
    background: color-mix(in srgb, var(--bg-card) 92%, transparent); backdrop-filter: saturate(1.4) blur(14px); -webkit-backdrop-filter: saturate(1.4) blur(14px);
    border-top: 1px solid var(--border-color); box-shadow: 0 -10px 30px -18px rgba(10, 59, 44, .5);
  }
  #gj-bottom-nav button {
    position: relative; display: flex; flex-direction: column; align-items: center; gap: .15rem; padding: .35rem .2rem; border: 0; background: none; cursor: pointer;
    font-size: .72rem; font-weight: 800; color: var(--text-secondary) !important; border-radius: 14px;
  }
  #gj-bottom-nav button i { font-size: 1.15rem; transition: transform .2s var(--gj-ease); }
  #gj-bottom-nav button span { color: inherit !important; }
  #gj-bottom-nav button[aria-current="page"] { color: var(--gj-forest-2) !important; }
  #gj-bottom-nav button[aria-current="page"] i { transform: translateY(-2px) scale(1.12); color: #D97706 !important; }
  #gj-bottom-nav button[aria-current="page"]::before { content: ""; position: absolute; top: -.35rem; width: 28px; height: 4px; border-radius: 0 0 6px 6px; background: linear-gradient(90deg, #FFB020, #F97316); }

  .ai-agent-fab { bottom: calc(86px + env(safe-area-inset-bottom)) !important; width: 56px !important; height: 56px !important; }
  .ai-agent-teaser { bottom: calc(96px + env(safe-area-inset-bottom)) !important; }
  #whatsapp-help-widget { bottom: calc(152px + env(safe-area-inset-bottom)) !important; }

  .gj-hero { border-radius: 26px; }
  .gj-search { flex-wrap: wrap; }
  .gj-search input { flex: 1 1 60%; }
  .gj-search .gj-btn { flex: 1 1 100%; }
  .gj-cta .gj-btn { flex: 1 1 100%; }
}
