/* =========================================================
   LandRate.in · భూమి ధర — light market-dashboard design
   ========================================================= */
:root {
  --bg: #f6f7f4; --surface: #ffffff; --surface-2: #fbfbf9; --ink: #0e1a15; --ink-2: #26332d; --muted: #66726c; --faint: #97a19c;
  --line: #e5e8e3; --line-2: #eef0ec;
  --brand: #0f6b4f; --brand-2: #0b5741; --brand-soft: #e7f3ee; --forest: #0c2a22;
  --gold: #b8892c; --gold-2: #e3c37a; --gold-soft: #fbf3e2;
  --up: #0a8f5a; --up-soft: #e3f5ec; --down: #cf4436; --down-soft: #fdecea; --amber: #c27c0e; --amber-soft: #fdf1dc;
  --blue: #2f6fd6; --blue-soft: #e8f0fd;
  --r-lg: 22px; --r: 16px; --r-sm: 12px;
  --sh-1: 0 1px 2px rgba(14, 26, 21, .04), 0 1px 3px rgba(14, 26, 21, .05);
  --sh-2: 0 2px 4px rgba(14, 26, 21, .04), 0 12px 32px rgba(14, 26, 21, .08);
  --sans: "Plus Jakarta Sans", "Noto Sans Telugu", system-ui, sans-serif;
  --te: "Noto Sans Telugu", "Plus Jakarta Sans", sans-serif;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 15.5px/1.6 var(--sans); -webkit-font-smoothing: antialiased; }
.te { font-family: var(--te); }
a { color: var(--brand); text-decoration: none; }
a:hover { color: var(--brand-2); }
img, svg { vertical-align: middle; }
.wrap { max-width: 1180px; margin: 0 auto; padding: 0 20px; }
[id] { scroll-margin-top: 130px; }
::selection { background: #cfe9de; }
.muted { color: var(--muted); } .faint { color: var(--faint); }
.num { font-variant-numeric: tabular-nums; }

/* ---------- header ---------- */
.top { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.92); backdrop-filter: saturate(1.6) blur(14px); border-bottom: 1px solid var(--line); }
.top .wrap { display: flex; align-items: center; gap: 18px; height: 64px; }
.logo { display: flex; align-items: center; gap: 10px; color: var(--ink); flex: none; }
.logo:hover { color: var(--ink); }
.logo .mark { width: 36px; height: 36px; border-radius: 11px; background: linear-gradient(145deg, var(--forest), var(--brand)); color: var(--gold-2); display: grid; place-items: center; font-weight: 800; font-size: 17px; box-shadow: 0 4px 12px rgba(15,107,79,.28); }
.logo b { display: block; font-size: 16.5px; line-height: 1.1; font-weight: 800; }
.logo small { display: block; font-size: 12px; color: var(--muted); font-weight: 600; letter-spacing: .01em; }
.nav { display: flex; gap: 2px; margin-left: 8px; }
.nav a { color: var(--ink-2); font-weight: 600; font-size: 14px; padding: 8px 12px; border-radius: 10px; display: inline-flex; gap: 6px; align-items: center; }
.nav a:hover, .nav a.on { background: var(--bg); color: var(--ink); }
.nav a.on { color: var(--brand); }
.top-right { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.saved-pill { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 13.5px; color: var(--ink-2); border: 1px solid var(--line); padding: 7px 12px; border-radius: 999px; background: #fff; }
.saved-pill b { background: var(--gold-soft); color: #8a6516; border-radius: 999px; padding: 0 7px; font-size: 12px; }
.menu-btn { display: none; background: none; border: 0; padding: 8px; color: var(--ink); cursor: pointer; }

/* ---------- search ---------- */
.search { position: relative; }
.search form { display: flex; align-items: center; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 5px 5px 5px 14px; box-shadow: var(--sh-1); transition: border-color .15s, box-shadow .15s; }
.search form:focus-within { border-color: var(--brand); box-shadow: 0 0 0 4px rgba(15,107,79,.12); }
.search svg { color: var(--faint); flex: none; }
.search input { flex: 1; border: 0; outline: 0; font: inherit; font-size: 15px; padding: 9px 10px; min-width: 0; color: var(--ink); background: transparent; }
.search button { border: 0; background: var(--brand); color: #fff; font: inherit; font-weight: 700; padding: 10px 18px; border-radius: 10px; cursor: pointer; }
.search button:hover { background: var(--brand-2); }
.search.big form { padding: 7px 7px 7px 18px; border-radius: 18px; box-shadow: var(--sh-2); }
.search.big input { font-size: 17px; padding: 12px 10px; }
.search.big button { padding: 13px 24px; border-radius: 13px; font-size: 15.5px; }
.search .hint { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 12px; font-size: 13px; color: var(--muted); align-items: center; }
.search .hint a { background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 3px 11px; color: var(--ink-2); font-weight: 600; }
.search .hint a:hover { border-color: var(--brand); color: var(--brand); }
.hsearch { flex: 1; max-width: 380px; }
.hsearch form { box-shadow: none; background: var(--bg); border-color: transparent; padding-left: 12px; }
.hsearch input { font-size: 14px; padding: 7px 8px; }
.suggest { position: absolute; left: 0; right: 0; top: calc(100% + 6px); background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--sh-2); overflow: hidden; z-index: 60; display: none; }
.suggest a { display: flex; justify-content: space-between; gap: 10px; padding: 11px 16px; border-top: 1px solid var(--line-2); color: var(--ink); font-weight: 600; }
.suggest a:first-child { border-top: 0; }
.suggest a:hover, .suggest a.on { background: var(--brand-soft); }
.suggest small { color: var(--muted); font-weight: 500; text-align: right; }

/* ---------- page heads ---------- */
main { padding: 30px 0 80px; }
.eyebrow { font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.eyebrow.brand { color: var(--brand); } .eyebrow.gold { color: var(--gold); }
.crumbs { font-size: 13px; color: var(--muted); display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.crumbs a { color: var(--muted); font-weight: 600; } .crumbs a:hover { color: var(--brand); }
.crumbs .sep { color: var(--faint); }
.phead { padding: 26px 0 6px; }
.phead h1 { font-size: clamp(28px, 4.6vw, 44px); line-height: 1.15; margin: 12px 0 6px; font-weight: 800; letter-spacing: -.02em; }
.phead h1 .en { display: block; font-size: 16px; font-weight: 600; color: var(--muted); letter-spacing: 0; margin-top: 8px; font-family: var(--sans); }
.phead-row { display: flex; justify-content: space-between; gap: 18px; align-items: flex-end; flex-wrap: wrap; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; }
.btn { display: inline-flex; align-items: center; gap: 7px; font: inherit; font-weight: 700; font-size: 14px; padding: 10px 16px; border-radius: 12px; border: 1px solid var(--line); background: #fff; color: var(--ink-2); cursor: pointer; transition: border-color .15s, background .15s, transform .15s; }
.btn:hover { border-color: var(--ink-2); color: var(--ink); }
.btn.primary { background: var(--brand); border-color: var(--brand); color: #fff; } .btn.primary:hover { background: var(--brand-2); }
.btn.gold { background: linear-gradient(135deg, var(--gold-2), var(--gold)); border-color: transparent; color: var(--forest); }
.btn.wa { background: #1fae5b; border-color: #1fae5b; color: #fff; }
.btn.saved { background: var(--gold-soft); border-color: #ecd59d; color: #8a6516; }
.btn svg { flex: none; }

/* ---------- home hero ---------- */
.hero { padding: 54px 0 34px; }
.hero h1 { font-size: clamp(34px, 6vw, 64px); line-height: 1.06; margin: 14px 0 16px; font-weight: 800; letter-spacing: -.03em; max-width: 900px; }
.hero h1 .hl { color: var(--brand); }
.hero p.sub { font-size: 17px; color: var(--muted); max-width: 640px; margin: 0 0 26px; }
.hero .search { max-width: 700px; }

/* ---------- cards ---------- */
.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 22px; box-shadow: var(--sh-1); }
a.card { color: var(--ink); display: block; transition: transform .18s, box-shadow .18s, border-color .18s; }
a.card:hover { transform: translateY(-2px); box-shadow: var(--sh-2); border-color: #d6dbd4; color: var(--ink); }
.grid { display: grid; gap: 16px; }
.g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .g4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.sec { margin-top: 44px; }
.sec-h { display: flex; justify-content: space-between; align-items: flex-end; gap: 14px; margin-bottom: 16px; flex-wrap: wrap; }
.sec-h h2 { margin: 6px 0 0; font-size: clamp(21px, 3vw, 27px); line-height: 1.25; font-weight: 800; letter-spacing: -.01em; }
.sec-h h2 .en { font-size: 14px; color: var(--muted); font-weight: 600; margin-left: 8px; letter-spacing: 0; }
.sec-h .more { font-weight: 700; font-size: 14px; }

/* lens cards */
.lens .k { font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.lens .big { font-size: 46px; font-weight: 800; letter-spacing: -.03em; line-height: 1; margin: 16px 0 4px; }
.lens .big small { font-size: 15px; color: var(--muted); font-weight: 600; letter-spacing: 0; margin-left: 4px; }
.lens .d { color: var(--muted); font-size: 14px; }
.lens .go { display: inline-block; margin-top: 18px; font-weight: 700; font-size: 14px; color: var(--ink); }
.c-up { color: var(--up); } .c-amber { color: var(--amber); } .c-blue { color: var(--blue); } .c-down { color: var(--down); } .c-ink { color: var(--ink); } .c-brand { color: var(--brand); }

/* chips */
.chip { display: inline-flex; align-items: center; gap: 3px; font-size: 12.5px; font-weight: 800; padding: 3px 9px; border-radius: 999px; white-space: nowrap; }
.chip.up { background: var(--up-soft); color: var(--up); } .chip.down { background: var(--down-soft); color: var(--down); }
.chip.amber { background: var(--amber-soft); color: var(--amber); } .chip.blue { background: var(--blue-soft); color: var(--blue); }
.chip.gray { background: var(--bg); color: var(--muted); border: 1px solid var(--line); }
.chip.gold { background: var(--gold-soft); color: #8a6516; }

/* movers row */
.movers { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(210px, 1fr); gap: 12px; overflow-x: auto; padding-bottom: 6px; scrollbar-width: thin; }
.mover { padding: 16px 18px; }
.mover .rank { font-size: 12px; color: var(--faint); font-weight: 800; display: flex; justify-content: space-between; align-items: center; }
.mover .nm { font-weight: 800; font-size: 16px; margin-top: 10px; line-height: 1.25; }
.mover .nm .te { display: block; font-size: 13.5px; color: var(--muted); font-weight: 600; }
.mover .loc { font-size: 12.5px; color: var(--muted); margin-top: 2px; }
.mover .rate { font-size: 20px; font-weight: 800; margin-top: 10px; letter-spacing: -.01em; }
.mover .rate small { font-size: 12px; color: var(--muted); font-weight: 600; }

/* KPI tiles */
.kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.kpi { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 16px 18px; box-shadow: var(--sh-1); }
.kpi .k { font-size: 12.5px; color: var(--muted); font-weight: 600; }
.kpi .k .te { color: var(--ink-2); font-weight: 700; font-size: 13.5px; display: block; }
.kpi .v { font-size: 30px; font-weight: 800; letter-spacing: -.02em; line-height: 1.1; margin: 10px 0 4px; }
.kpi .u { font-size: 12.5px; color: var(--muted); display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.kpi.feature { background: linear-gradient(160deg, var(--forest), var(--brand-2)); border-color: transparent; color: #fff; }
.kpi.feature .k, .kpi.feature .u { color: rgba(255,255,255,.72); }
.kpi.feature .k .te, .kpi.feature .v { color: #fff; }

/* answer */
.answer { background: var(--surface); border: 1px solid var(--line); border-left: 4px solid var(--brand); border-radius: var(--r); padding: 16px 20px; box-shadow: var(--sh-1); }
.answer p { margin: 0; font-size: 16px; }
.answer p + p { margin-top: 6px; color: var(--muted); font-size: 14.5px; }
.answer b { color: var(--brand); }

/* chart/map panels */
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--sh-1); overflow: hidden; }
.panel-h { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 16px 20px 0; flex-wrap: wrap; }
.panel-h b { font-size: 15.5px; } .panel-h .te { font-weight: 700; }
.panel-b { padding: 14px 20px 18px; }
.chart-box { position: relative; height: 260px; }
.map { height: 360px; background: #e9ece6; }
.map.tall { height: calc(100vh - 64px); }
.legend { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--muted); }
.legend .bar { width: 140px; height: 8px; border-radius: 99px; background: linear-gradient(90deg, #2f6fd6, #0a8f5a, #e3c37a, #e8892b, #cf4436); }
.leaflet-popup-content { font: 13.5px/1.45 var(--sans); }
.leaflet-popup-content b { font-size: 14.5px; }
.pop-rate { font-size: 17px; font-weight: 800; color: var(--forest); }
.leaflet-container a.pop-link { color: var(--brand); font-weight: 700; }

/* tables */
.tablewrap { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--sh-1); overflow: auto; }
table { width: 100%; border-collapse: collapse; font-size: 14px; }
th, td { padding: 12px 16px; text-align: left; border-bottom: 1px solid var(--line-2); white-space: nowrap; }
th { background: var(--surface-2); color: var(--muted); font-size: 11.5px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; position: sticky; top: 0; z-index: 1; }
tr:last-child td { border-bottom: 0; }
tr:hover td { background: #fafbf8; }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }
td.strong { font-weight: 800; color: var(--ink); }
td a { font-weight: 700; color: var(--ink); } td a:hover { color: var(--brand); }
td.wrap-cell { white-space: normal; min-width: 180px; }
.te-sub { display: block; font-size: 12.5px; color: var(--muted); font-weight: 600; font-family: var(--te); }
.scroll { max-height: 560px; overflow: auto; }
.filter { width: 100%; max-width: 340px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 12px; font: inherit; background: #fff; margin: 0 0 12px; }
.filter:focus { outline: 0; border-color: var(--brand); box-shadow: 0 0 0 4px rgba(15,107,79,.12); }
details.acc { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 2px 20px; box-shadow: var(--sh-1); margin-top: 12px; }
details.acc > summary { cursor: pointer; font-weight: 800; padding: 15px 0; list-style: none; display: flex; justify-content: space-between; align-items: center; }
details.acc > summary::-webkit-details-marker { display: none; }
details.acc > summary::after { content: "+"; font-size: 22px; color: var(--brand); line-height: 1; }
details.acc[open] > summary::after { content: "–"; }
details.acc .tablewrap { box-shadow: none; margin-bottom: 18px; }

/* lists */
.tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.tile { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 13px 16px; color: var(--ink); font-weight: 700; display: flex; justify-content: space-between; align-items: center; gap: 10px; transition: border-color .15s, box-shadow .15s, transform .15s; }
.tile:hover { border-color: var(--brand); box-shadow: var(--sh-1); color: var(--ink); transform: translateY(-1px); }
.tile small { display: block; color: var(--muted); font-weight: 500; font-size: 12.5px; }
.tile .arr { color: var(--faint); }

/* tabs */
.tabs { display: inline-flex; gap: 4px; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 4px; flex-wrap: wrap; box-shadow: var(--sh-1); }
.tabs a { padding: 8px 14px; border-radius: 10px; font-weight: 700; font-size: 14px; color: var(--ink-2); white-space: nowrap; }
.tabs a.on { background: var(--forest); color: #fff; }
.tabs a:not(.on):hover { background: var(--bg); }
.filters { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin: 16px 0; }
.filters select { padding: 10px 14px; border: 1px solid var(--line); border-radius: 12px; font: inherit; background: #fff; font-weight: 600; min-width: 200px; }

/* jump bar */
.jump { position: sticky; top: 64px; z-index: 30; display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 10px 0; margin-top: 14px; background: rgba(246,247,244,.94); backdrop-filter: blur(10px); }
.jump::-webkit-scrollbar { display: none; }
.jump a { flex: none; padding: 7px 14px; border-radius: 999px; background: #fff; border: 1px solid var(--line); color: var(--ink-2); font-weight: 700; font-size: 13.5px; }
.jump a:hover { border-color: var(--brand); color: var(--brand); }

/* trend */
.trend { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.trend-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 18px 20px 8px; box-shadow: var(--sh-1); }
.trend-h { display: flex; justify-content: space-between; align-items: flex-start; }
.trend-h .te { display: block; font-weight: 800; font-size: 15.5px; } .trend-h small { color: var(--muted); font-size: 12.5px; }
.trend-svg { width: 100%; height: auto; display: block; margin-top: 4px; }
.trend-svg .axis { stroke: var(--line); stroke-width: 1.5; } .trend-svg .bar-old { fill: #e3e7e1; }
.trend-svg .link { fill: none; stroke: var(--brand); stroke-width: 1.5; stroke-dasharray: 4 4; }
.trend-svg text { text-anchor: middle; font-family: var(--sans); }
.trend-svg .val { font-size: 13px; font-weight: 700; fill: var(--muted); } .trend-svg .val.strong { fill: var(--ink); font-size: 15px; font-weight: 800; }
.trend-svg .lbl { font-size: 11px; fill: var(--faint); }

/* calculator */
.calc { display: grid; grid-template-columns: 1.15fr 1fr; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--sh-2); }
.calc .inputs { padding: 24px; }
.calc .row { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px; }
.calc .row + .row { margin-top: 14px; }
.calc label { display: block; font-size: 12px; font-weight: 800; letter-spacing: .05em; color: var(--muted); margin-bottom: 6px; text-transform: uppercase; }
.calc input, .calc select { width: 100%; padding: 11px 13px; border: 1px solid var(--line); border-radius: 12px; font: inherit; background: #fff; color: var(--ink); }
.calc input:focus, .calc select:focus { outline: 0; border-color: var(--brand); box-shadow: 0 0 0 4px rgba(15,107,79,.12); }
.calc .radios { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 16px; }
.calc .radios label { text-transform: none; letter-spacing: 0; font-size: 14px; font-weight: 600; color: var(--ink); display: flex; gap: 8px; align-items: center; margin: 0; padding: 9px 14px; border: 1px solid var(--line); border-radius: 999px; cursor: pointer; }
.calc .radios label:has(input:checked) { border-color: var(--brand); background: var(--brand-soft); }
.calc .radios input { width: auto; accent-color: var(--brand); }
.result { background: linear-gradient(165deg, var(--forest), var(--brand-2)); color: #fff; padding: 24px; display: flex; flex-direction: column; }
.result .rl { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-2); font-weight: 800; }
.result .big { font-size: 42px; font-weight: 800; letter-spacing: -.02em; margin: 8px 0 2px; }
.result .bigsub { font-size: 13px; color: rgba(255,255,255,.65); margin-bottom: 16px; }
.result table { font-size: 14px; }
.result td { color: rgba(255,255,255,.82); border-bottom: 1px solid rgba(255,255,255,.1); padding: 9px 0; white-space: normal; background: none !important; }
.result td.num { color: #fff; font-weight: 700; }
.result .fine { color: rgba(255,255,255,.55); margin-top: auto; padding-top: 14px; }
.fine { font-size: 12.5px; color: var(--muted); margin-top: 10px; }

/* report CTA */
.report-cta { display: grid; grid-template-columns: auto 1fr auto; gap: 18px; align-items: center; padding: 20px 22px; border-radius: var(--r-lg); background: linear-gradient(120deg, var(--gold-soft), #fff 60%); border: 1px solid #ecd9ab; box-shadow: var(--sh-1); }
.rc-icon { width: 54px; height: 54px; border-radius: 16px; display: grid; place-items: center; background: linear-gradient(135deg, var(--gold-2), var(--gold)); color: var(--forest); }
.rc-eyebrow { font-size: 11.5px; letter-spacing: .14em; color: var(--gold); font-weight: 800; }
.rc-title { font-size: 18px; font-weight: 800; margin: 2px 0 4px; }
.rc-sub { font-size: 14px; color: var(--muted); }
.rc-actions { display: flex; flex-direction: column; gap: 8px; }

/* compare */
.cmp th:first-child, .cmp td:first-child { position: sticky; left: 0; background: var(--surface-2); z-index: 2; font-weight: 700; color: var(--muted); }
.cmp td { white-space: normal; min-width: 190px; }
.cmp td.best { background: var(--up-soft) !important; }
.slot-pick { border: 2px dashed var(--line); border-radius: var(--r); padding: 18px; color: var(--muted); }

/* faq */
.faq { display: grid; gap: 10px; margin: 0; }
.faq div { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 16px 20px; }
.faq dt { font-weight: 800; } .faq dd { margin: 6px 0 0; color: var(--muted); }

/* legal */
.box { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 22px; box-shadow: var(--sh-1); }
.legal { max-width: 820px; padding: 28px 30px; line-height: 1.75; }
.legal h3 { margin: 26px 0 8px; font-size: 18px; color: var(--forest); }
.legal ul { padding-left: 20px; } .legal li { margin: 6px 0; }
.contact-card { display: inline-flex; flex-direction: column; gap: 4px; margin: 10px 0 6px; padding: 16px 22px; border-radius: 16px; background: linear-gradient(160deg, var(--forest), var(--brand-2)); }
.contact-card span { font-size: 12px; color: var(--gold-2); letter-spacing: .06em; }
.contact-card a { color: #fff; font-size: 22px; font-weight: 800; }

/* mobile bottom bar (hidden on desktop) */
.mbar { display: none; }

/* ---------- footer ---------- */
footer.foot { margin-top: 30px; padding: 56px 0 28px; color: rgba(255,255,255,.66); font-size: 14px; background: linear-gradient(180deg, #0d2b23, #081c16); position: relative; }
footer.foot::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, transparent, var(--gold), transparent); }
.foot-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 36px; }
.foot .logo b { color: #fff; } .foot .logo small { color: var(--gold-2); }
.foot-brand .tag { color: #fff; font-size: 15.5px; font-weight: 700; margin: 18px 0 8px; }
.foot-muted { margin: 0; line-height: 1.7; max-width: 340px; }
.foot-col h4 { margin: 4px 0 14px; font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-2); }
.foot-col a { display: block; color: rgba(255,255,255,.78); padding: 4px 0; }
.foot-col a:hover { color: #fff; }
.foot-stats div { margin-bottom: 12px; } .foot-stats b { display: block; font-size: 26px; font-weight: 800; color: #fff; } .foot-stats span { font-size: 12.5px; }
.foot-note { display: flex; gap: 12px; align-items: flex-start; margin-top: 40px; padding: 16px 20px; border: 1px solid rgba(227,195,122,.22); border-radius: 16px; background: rgba(255,255,255,.03); font-size: 13px; line-height: 1.7; }
.foot-note svg { flex: none; color: var(--gold-2); margin-top: 2px; } .foot-note p { margin: 0; } .foot-note b { color: #fff; }
.foot-note a { color: var(--gold-2); }
.foot-bottom { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-top: 24px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.08); font-size: 12.5px; color: rgba(255,255,255,.45); }
.foot-bottom a { color: rgba(255,255,255,.6); }

/* ---------- responsive ---------- */
@media (max-width: 980px) {
  .g4, .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .g3 { grid-template-columns: 1fr; }
  .foot-grid { grid-template-columns: 1fr 1fr; } .foot-brand { grid-column: 1 / -1; }
  .calc { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  .nav, .hsearch, .saved-pill .lbl { display: none; }
  .menu-btn { display: block; }
  .nav.open { display: flex; position: absolute; top: 64px; left: 0; right: 0; flex-direction: column; background: #fff; border-bottom: 1px solid var(--line); padding: 10px 16px 14px; margin: 0; box-shadow: var(--sh-2); }
  .nav.open a { padding: 12px; font-size: 15px; }
  .hsearch.open { display: block; position: absolute; top: 64px; left: 0; right: 0; max-width: none; padding: 10px 16px 12px; background: #fff; border-bottom: 1px solid var(--line); }
  .g2 { grid-template-columns: 1fr; }
  .report-cta { grid-template-columns: auto 1fr; } .rc-actions { grid-column: 1 / -1; flex-direction: row; } .rc-actions .btn { flex: 1; justify-content: center; }
  .mbar { display: flex; position: fixed; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 40; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 10px 10px 18px; border-radius: 18px; background: rgba(12,42,34,.96); color: #fff; box-shadow: 0 14px 40px rgba(0,0,0,.28); transition: transform .3s, opacity .3s; }
  .mbar.hide { transform: translateY(140%); opacity: 0; }
  .mbar span { display: block; font-size: 11.5px; color: var(--gold-2); }
  .mbar b { font-size: 21px; font-weight: 800; } .mbar b small { font-size: 12px; color: rgba(255,255,255,.65); font-weight: 600; margin-left: 3px; }
  .mbar a { background: linear-gradient(135deg, var(--gold-2), var(--gold)); color: var(--forest); font-weight: 800; padding: 12px 16px; border-radius: 13px; font-size: 14px; white-space: nowrap; }
  body:has(.mbar) footer.foot { padding-bottom: 110px; }
}
@media (max-width: 640px) {
  .wrap { padding: 0 16px; }
  .hero { padding: 34px 0 22px; }
  .lens .big { font-size: 38px; }
  .kpi .v { font-size: 25px; }
  .search.big button { padding: 13px 16px; }
  .search.big input { font-size: 16px; }
  .map { height: 300px; }
  .tablewrap:has(table.stack) { background: none; border: 0; box-shadow: none; overflow: visible; }
  table.stack, table.stack tbody { display: block; }
  table.stack tr:first-child { display: none; }
  table.stack tr { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 14px; background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 14px 16px; margin-bottom: 10px; box-shadow: var(--sh-1); }
  table.stack td { display: block; border: 0; padding: 0; white-space: normal; text-align: left !important; background: none !important; }
  table.stack td::before { content: attr(data-label); display: block; font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--faint); margin-bottom: 1px; }
  table.stack td:first-child, table.stack td:has(> a) { grid-column: 1 / -1; font-size: 16.5px; }
  table.stack td:first-child::before, table.stack td:has(> a)::before { display: none; }
  table.stack td[data-label="#"] { display: none; }
  .tiles { grid-template-columns: 1fr 1fr; gap: 8px; }
  .tile { padding: 12px; font-size: 14px; } .tile .arr { display: none; }
  .foot-grid { gap: 26px 18px; }
}

.lr-tiles { filter: grayscale(.9) contrast(.92) brightness(1.08); }

/* =========================================================
   Premium layer: display type, two-column listing, side card,
   command palette, hero dot-map, page transitions
   ========================================================= */
:root { --display: "Bricolage Grotesque", "Noto Sans Telugu", "Plus Jakarta Sans", sans-serif; }
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .22s; }
.hero h1, .phead h1, .sec-h h2, .kpi .v, .lens .big, .result .big, .mover .rate, .side-price, .cp-title, .foot-stats b { font-family: var(--display); }
.phead h1 .en { font-family: var(--sans); }
.hero h1 { letter-spacing: -.035em; }

/* hero with live dot-map */
.hero .wrap { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 34px; align-items: center; }
.hero-viz { position: relative; aspect-ratio: 1 / 1; max-height: 520px; border-radius: 28px; overflow: hidden;
  background: radial-gradient(120% 90% at 30% 20%, #133a2f 0%, #0b231c 55%, #081a14 100%); box-shadow: 0 30px 60px rgba(12,42,34,.25); }
.hero-viz canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-viz .viz-label { position: absolute; left: 18px; bottom: 16px; right: 18px; display: flex; justify-content: space-between; align-items: flex-end; color: rgba(255,255,255,.75); font-size: 12.5px; }
.hero-viz .viz-label b { display: block; color: #fff; font-family: var(--display); font-size: 26px; line-height: 1.1; }
.hero-viz .viz-legend { display: flex; align-items: center; gap: 6px; }
.hero-viz .viz-legend .bar { width: 90px; height: 6px; border-radius: 99px; background: linear-gradient(90deg, #4f8ff7, #22c58b, #f2d58c, #ff9d4a, #ff5a4a); }
.hero-viz .viz-tag { position: absolute; top: 16px; left: 18px; font-size: 11.5px; font-weight: 800; letter-spacing: .14em; color: var(--gold-2); text-transform: uppercase; }

/* village two-column listing layout */
.vlayout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 28px; align-items: start; }
.vtop { grid-column: 1; grid-row: 1; }
.vrest { grid-column: 1; grid-row: 2; min-width: 0; }
.vside { grid-column: 2; grid-row: 1 / span 2; position: sticky; top: 132px; display: grid; gap: 14px; }
.vlayout .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.side-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--sh-2); overflow: hidden; }
.side-top { padding: 20px 22px 18px; background: linear-gradient(160deg, var(--forest), var(--brand-2)); color: #fff; position: relative; }
.side-top::after { content: ""; position: absolute; right: -40px; top: -40px; width: 160px; height: 160px; border-radius: 50%; background: radial-gradient(circle, rgba(227,195,122,.35), transparent 70%); }
.side-top .te { font-weight: 700; font-size: 15px; }
.side-top small { display: block; color: rgba(255,255,255,.7); font-size: 12.5px; }
.side-price { font-size: 40px; font-weight: 800; letter-spacing: -.02em; line-height: 1.05; margin: 12px 0 4px; }
.side-price small { font-family: var(--sans); font-size: 14px; font-weight: 600; color: rgba(255,255,255,.7); display: inline; }
.side-meta { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; font-size: 12.5px; color: rgba(255,255,255,.75); }
.side-meta .chip { background: rgba(255,255,255,.15); color: #fff; }
.side-body { padding: 16px 22px 20px; display: grid; gap: 12px; }
.qc label { font-size: 11.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.qc-row { display: flex; gap: 8px; margin-top: 6px; }
.qc-row input, .qc-row select { flex: 1; min-width: 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: 11px; font: inherit; background: #fff; }
.qc-row input:focus, .qc-row select:focus { outline: 0; border-color: var(--brand); box-shadow: 0 0 0 4px rgba(15,107,79,.12); }
.qc-out { display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; font-size: 13.5px; margin-top: 10px; }
.qc-out span { color: var(--muted); } .qc-out b { text-align: right; font-variant-numeric: tabular-nums; }
.qc-out .tot { font-size: 16px; color: var(--brand); }
.side-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.side-actions .btn { justify-content: center; padding: 10px 8px; font-size: 13.5px; }
.side-actions .btn.full { grid-column: 1 / -1; }
.side-note { font-size: 12px; color: var(--faint); text-align: center; }
.conv { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 10px; }
.conv div { background: var(--bg); border-radius: 10px; padding: 8px 6px; text-align: center; }
.conv b { display: block; font-size: 14px; font-variant-numeric: tabular-nums; }
.conv span { font-size: 11px; color: var(--muted); }

/* command palette */
.cp { position: fixed; inset: 0; z-index: 200; display: none; align-items: flex-start; justify-content: center; padding: 12vh 16px 16px; background: rgba(9, 20, 16, .45); backdrop-filter: blur(6px); }
.cp.open { display: flex; }
.cp-box { width: 100%; max-width: 640px; background: #fff; border-radius: 20px; box-shadow: 0 30px 80px rgba(0,0,0,.35); overflow: hidden; animation: cpIn .16s ease-out; }
@keyframes cpIn { from { transform: translateY(8px) scale(.98); opacity: 0; } to { transform: none; opacity: 1; } }
.cp-in { display: flex; align-items: center; gap: 10px; padding: 16px 18px; border-bottom: 1px solid var(--line); }
.cp-in input { flex: 1; border: 0; outline: 0; font: inherit; font-size: 18px; }
.cp-in kbd, .kbd { font: 700 11px var(--sans); color: var(--muted); border: 1px solid var(--line); border-bottom-width: 2px; border-radius: 6px; padding: 2px 6px; background: var(--bg); }
.cp-list { max-height: 50vh; overflow: auto; }
.cp-list a { display: flex; justify-content: space-between; gap: 12px; padding: 12px 18px; color: var(--ink); border-top: 1px solid var(--line-2); }
.cp-list a:first-child { border-top: 0; }
.cp-list a.on, .cp-list a:hover { background: var(--brand-soft); }
.cp-list .nm { font-weight: 700; } .cp-list .nm .te { color: var(--muted); font-weight: 600; margin-left: 6px; }
.cp-list small { color: var(--muted); text-align: right; }
.cp-list .rate { font-weight: 800; color: var(--brand); white-space: nowrap; }
.cp-empty { padding: 22px 18px; color: var(--muted); font-size: 14px; }
.cp-empty a { display: inline-block; margin: 6px 6px 0 0; padding: 5px 11px; border: 1px solid var(--line); border-radius: 999px; color: var(--ink-2); font-weight: 600; font-size: 13px; }
.hsearch-btn { flex: 1; max-width: 360px; display: flex; align-items: center; gap: 10px; background: var(--bg); border: 1px solid transparent; border-radius: 12px; padding: 9px 12px; color: var(--muted); font: inherit; font-size: 14px; cursor: pointer; text-align: left; }
.hsearch-btn:hover { border-color: var(--line); background: #fff; }
.hsearch-btn span { flex: 1; } .hsearch-btn .kbd { margin-left: auto; }

/* reveal + count-up niceties */
.reveal { opacity: 0; transform: translateY(12px); transition: opacity .5s ease, transform .5s ease; }
.reveal.in { opacity: 1; transform: none; }

@media (max-width: 1080px) {
  .vlayout { grid-template-columns: minmax(0, 1fr) 300px; }
}
@media (max-width: 900px) {
  .hero .wrap { grid-template-columns: 1fr; }
  .hero-viz { aspect-ratio: 16 / 10; max-height: 340px; }
  .vlayout { grid-template-columns: 1fr; }
  .vtop, .vrest, .vside { grid-column: 1; grid-row: auto; }
  .vside { position: static; }
  .vlayout .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 820px) { .hsearch-btn { display: none; } }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; transition: none; } }
.vside, .side-card, .side-body, .qc { min-width: 0; }
.qc-row select { width: 100%; max-width: 48%; }
.qc-row input { max-width: 52%; }
.qc-out b { white-space: nowrap; }
.conv div { min-width: 0; overflow: hidden; }
.conv b { font-size: 13px; overflow: hidden; text-overflow: ellipsis; }
.hsearch-btn { white-space: nowrap; min-width: 190px; }
.hsearch-btn span:first-of-type { overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 1240px) { .nav a.te { display: none; } }
@media (max-width: 1020px) { .nav a svg { display: none; } .hsearch-btn { min-width: 150px; } }
.cp { z-index: 3000; }
.top { z-index: 1100; }
.leaflet-pane, .leaflet-top, .leaflet-bottom { z-index: 400; }
.leaflet-top, .leaflet-bottom { z-index: 500; }

/* state switch next to the logo */
.state-switch { display: inline-flex; gap: 2px; padding: 3px; background: var(--bg); border: 1px solid var(--line); border-radius: 12px; flex: none; position: relative; margin-left: 4px; }
.state-switch::after { content: ""; position: absolute; right: -13px; top: 6px; bottom: 6px; width: 1px; background: var(--line); }
.state-switch a { padding: 5px 11px; border-radius: 9px; color: var(--ink-2); font-size: 13px; font-weight: 600; line-height: 1.5; white-space: nowrap; }
.state-switch a:hover { color: var(--ink); background: #fff; }
.state-switch a.on { background: #fff; color: var(--brand); box-shadow: var(--sh-1); }
.nav { margin-left: 18px; }
.nav a.nav-state { display: none; }
@media (max-width: 1240px) { .nav a.te { display: inline-flex; } }
@media (max-width: 1100px) { .nav a svg { display: none; } .nav a { padding: 8px 9px; } }
@media (max-width: 960px) { .state-switch { display: none; } .nav { margin-left: 8px; } }
@media (max-width: 820px) { .nav.open a.nav-state { display: flex; } }

/* hero backdrop: soft glows + faint survey-grid so the light side isn't flat next to the dark map */
.hero { position: relative; isolation: isolate; overflow: hidden; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -2;
  background:
    radial-gradient(700px 420px at 8% 0%, rgba(15,107,79,.16), transparent 65%),
    radial-gradient(560px 380px at 46% 105%, rgba(184,137,44,.14), transparent 65%),
    radial-gradient(520px 520px at 88% 40%, rgba(12,42,34,.10), transparent 70%),
    linear-gradient(180deg, #f2f6f1 0%, #f6f7f4 100%); }
.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .55;
  background-image:
    linear-gradient(rgba(15,107,79,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,107,79,.07) 1px, transparent 1px);
  background-size: 44px 44px;
  -webkit-mask-image: radial-gradient(ellipse 70% 80% at 30% 40%, #000 30%, transparent 80%);
          mask-image: radial-gradient(ellipse 70% 80% at 30% 40%, #000 30%, transparent 80%); }
.hero h1 { font-size: clamp(34px, 5.2vw, 58px); }
.hero .eyebrow { display: inline-flex; align-items: center; gap: 8px; background: rgba(255,255,255,.75); border: 1px solid rgba(15,107,79,.18);
  padding: 6px 12px; border-radius: 999px; backdrop-filter: blur(6px); }
.hero .eyebrow::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--up); box-shadow: 0 0 0 4px rgba(10,143,90,.18); animation: pulse 2s infinite; }
@keyframes pulse { 0%, 100% { box-shadow: 0 0 0 4px rgba(10,143,90,.18); } 50% { box-shadow: 0 0 0 7px rgba(10,143,90,.06); } }
.hero h1 .hl { background: linear-gradient(120deg, #0a8f5a, #0f6b4f 60%, #b8892c); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero .search.big form { background: rgba(255,255,255,.92); backdrop-filter: blur(8px); }
.hero .hint a { background: rgba(255,255,255,.8); }
.hero-viz { box-shadow: 0 30px 70px rgba(12,42,34,.30), 0 0 0 1px rgba(227,195,122,.18) inset; }
@media (prefers-reduced-motion: reduce) { .hero .eyebrow::before { animation: none; } }

/* page background: soft brand glows + faint grid so white space never looks flat */
body { background:
  radial-gradient(900px 600px at 100% 0%, rgba(184,137,44,.07), transparent 60%),
  radial-gradient(900px 700px at 0% 30%, rgba(15,107,79,.07), transparent 60%),
  radial-gradient(800px 600px at 100% 85%, rgba(15,107,79,.06), transparent 60%),
  #f3f6f2; background-attachment: fixed; }
main { position: relative; }
main::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .5;
  background-image: linear-gradient(rgba(15,107,79,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(15,107,79,.05) 1px, transparent 1px);
  background-size: 44px 44px;
  -webkit-mask-image: linear-gradient(180deg, #000, transparent 420px); mask-image: linear-gradient(180deg, #000, transparent 420px); }
main { isolation: isolate; }
.phead { position: relative; }
.card, .panel, .kpi:not(.feature), .tablewrap, .tile, .answer, .trend-card, .faq div, .calc, .side-card { background-color: rgba(255,255,255,.96); }
.jump { background: rgba(243,246,242,.92); }

/* top-right search: looks like a real search field */
.hsearch-btn { min-width: 270px; max-width: 320px; background: #fff; border: 1px solid var(--line); box-shadow: var(--sh-1); padding: 9px 12px; color: var(--muted); transition: border-color .15s, box-shadow .15s; }
.hsearch-btn:hover { border-color: var(--brand); box-shadow: 0 0 0 4px rgba(15,107,79,.10); color: var(--ink-2); }
.hsearch-btn svg { color: var(--brand); }
@media (max-width: 1360px) { .hsearch-btn { min-width: 220px; } }
@media (max-width: 1180px) { .hsearch-btn { min-width: 44px; max-width: 44px; padding: 9px 12px; } .hsearch-btn span, .hsearch-btn .kbd { display: none; } }
@media (max-width: 820px) { .hsearch-btn { display: none; } }
.top-right { flex: 1; justify-content: flex-end; min-width: 0; }
.hsearch-btn { flex: 0 1 300px; width: 300px; }
@media (max-width: 1360px) { .hsearch-btn { flex-basis: 240px; width: 240px; } }
@media (max-width: 1180px) { .hsearch-btn { flex: 0 0 44px; width: 44px; } }
.hsearch-btn .kbd { flex: none; }
.hsearch-btn span:not(.kbd) { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }

/* ---------- side drawer (☰ left of the logo) ---------- */
.drawer-btn { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; border: 1px solid var(--line); background: #fff; color: var(--ink); cursor: pointer; margin-right: -4px; transition: border-color .15s, background .15s; }
.drawer-btn:hover { border-color: var(--brand); color: var(--brand); }
.drawer-scrim { position: fixed; inset: 0; z-index: 2400; background: rgba(9,20,16,.42); backdrop-filter: blur(3px); opacity: 0; pointer-events: none; transition: opacity .25s; }
.drawer-scrim.open { opacity: 1; pointer-events: auto; }
.drawer { position: fixed; top: 0; bottom: 0; left: 0; z-index: 2500; width: 340px; max-width: 88vw; background: #fff; box-shadow: 20px 0 60px rgba(0,0,0,.18);
  transform: translateX(-102%); transition: transform .28s cubic-bezier(.2,.8,.2,1); overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; }
.drawer.open { transform: none; }
.drawer-head { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; border-bottom: 1px solid var(--line); position: sticky; top: 0; background: #fff; z-index: 1; }
.drawer-x { background: none; border: 0; cursor: pointer; color: var(--muted); padding: 6px; border-radius: 10px; }
.drawer-x:hover { background: var(--bg); color: var(--ink); }
.drawer-search { margin: 14px 16px 4px; display: flex; align-items: center; gap: 10px; padding: 11px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--bg); color: var(--muted); font: inherit; font-size: 14.5px; cursor: pointer; text-align: left; }
.drawer-search svg { color: var(--brand); }
.drawer-sec { padding: 10px 10px; border-bottom: 1px solid var(--line-2); }
.drawer-h { font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--faint); padding: 6px 8px 4px; }
.drawer-sec > a { display: flex; align-items: center; gap: 12px; padding: 10px 10px; border-radius: 11px; color: var(--ink-2); font-weight: 600; font-size: 14.5px; }
.drawer-sec > a svg { color: var(--muted); flex: none; }
.drawer-sec > a:hover { background: var(--bg); color: var(--ink); }
.drawer-sec > a.on { background: var(--brand-soft); color: var(--brand); } .drawer-sec > a.on svg { color: var(--brand); }
.drawer-sec > a span { flex: 1; }
.drawer-count { background: var(--gold-soft); color: #8a6516; border-radius: 999px; padding: 0 8px; font-size: 12px; }
.drawer-state summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; padding: 10px; border-radius: 11px; }
.drawer-state summary::-webkit-details-marker { display: none; }
.drawer-state summary:hover { background: var(--bg); }
.drawer-state summary .te { display: block; font-weight: 800; font-size: 16px; color: var(--ink); }
.drawer-state summary small { color: var(--muted); font-size: 12.5px; }
.drawer-state summary::after { content: ""; width: 9px; height: 9px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg); transition: transform .2s; margin-right: 6px; }
.drawer-state[open] summary::after { transform: rotate(-135deg); }
.drawer-all { font-size: 13px !important; color: var(--brand) !important; padding: 6px 10px !important; }
.drawer-dists { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; padding: 2px 0 6px; }
.drawer-dists a { display: flex; justify-content: space-between; gap: 6px; padding: 8px 10px; border-radius: 9px; color: var(--ink-2); font-size: 13.5px; font-weight: 600; line-height: 1.3; }
.drawer-dists a small { color: var(--faint); font-weight: 600; font-size: 11.5px; }
.drawer-dists a:hover { background: var(--bg); color: var(--ink); }
.drawer-dists a.on { background: var(--brand-soft); color: var(--brand); }
.drawer-foot { border-bottom: 0; margin-top: auto; display: flex; flex-wrap: wrap; gap: 2px 4px; padding: 14px 16px 22px; }
.drawer-foot a { padding: 4px 8px !important; font-size: 13px !important; color: var(--muted) !important; }
.drawer-foot p { width: 100%; margin: 8px 8px 0; font-size: 12px; color: var(--faint); line-height: 1.5; }
@media (max-width: 820px) { .drawer-btn { width: 38px; height: 38px; } .top .wrap { gap: 10px; } .nav, .nav.open { display: none !important; } }

/* PDF button in page headers */
.btn.pdf-top { box-shadow: 0 6px 18px rgba(184,137,44,.28); }
.btn.pdf-top:hover { transform: translateY(-1px); color: var(--forest); box-shadow: 0 10px 24px rgba(184,137,44,.36); }
@media (max-width: 640px) { .phead .actions { width: 100%; } .phead .actions .pdf-top { flex: 1 1 100%; justify-content: center; } }