/* ======================================================================
   RojgarKhabar — design system v2 (premium, app-grade)
   Light, airy, soft depth, one confident accent (saffron), modern type.
   App-shell: top bar + mobile bottom tab bar. SVG icons, not emoji.
   ====================================================================== */
:root{
  --bg:#F6F7F9; --surface:#FFFFFF; --surface-2:#F3F4F7; --surface-3:#ECEEF2;
  --ink:#0E1116; --ink-2:#383E49; --muted:#6B7280; --faint:#9AA1AC;
  --line:#EBECF0; --line-2:#E2E4EA;
  --brand:#F4621E; --brand-2:#FF7A2E; --brand-ink:#C2480E; --brand-soft:#FFF1E9;
  --navy:#0E1B3D; --navy-2:#182444;
  --green:#0E9F6E; --green-soft:#E6F6EF;
  --amber:#B45309; --amber-soft:#FEF1E2;
  --red:#E11D5B; --red-soft:#FDE8EF;
  --blue:#2563EB; --blue-soft:#E8EFFE;
  --violet:#7C3AED; --violet-soft:#F1EAFE;
  --r-xs:8px; --r-sm:12px; --r:16px; --r-lg:22px; --r-xl:28px; --pill:999px;
  --sh-1:0 1px 2px rgba(16,17,22,.04), 0 2px 6px rgba(16,17,22,.05);
  --sh-2:0 4px 14px rgba(16,17,22,.06), 0 14px 34px rgba(16,17,22,.07);
  --sh-pop:0 20px 56px rgba(16,17,22,.16);
  --wrap:1120px; --ease:cubic-bezier(.22,.61,.36,1);
  --sans:"Mukta","Noto Sans Devanagari",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --serif:"Tiro Devanagari Hindi","Iowan Old Style",Palatino,Georgia,serif;
  --num:tabular-nums lining-nums;
  --fs-xs:12.8px; --fs-sm:14px; --fs-base:16px; --fs-md:20px; --fs-lg:25px; --fs-xl:31px;
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--sans);
  font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
a{color:inherit; text-decoration:none}
h1,h2,h3,h4{margin:0; line-height:1.2; letter-spacing:-.015em; font-weight:700; color:var(--ink)}
img,svg{max-width:100%}
/* editorial-serif display headings — bilingual (Latin + Devanagari from one family) */
.hero h1,.post-head h1,.page-title,.sec-head h2,.static-page h1,.cta h2,.done-box h1,.quiz-result h2{
  font-family:var(--serif); font-weight:600; letter-spacing:0}
/* Devanagari headings must NOT use negative tracking (crowds the shirorekha) */
:lang(hi) h1,:lang(hi) h2,:lang(hi) h3,:lang(hi) h4{letter-spacing:normal}
/* visible keyboard-focus everywhere */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--brand); outline-offset:2px; border-radius:4px}
/* aligned numbers where columns/figures must read as authoritative */
.dtable td,.dtable th,.quick-facts b,.links-table td,.calc-age,.cd-unit b,.trend-n{font-variant-numeric:var(--num)}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms !important; animation-duration:.01ms !important}
  .jcard:hover,.aff-card:hover,.cal-item:hover,.chip:hover,.btn:hover{transform:none}
}
.wrap{max-width:var(--wrap); margin:0 auto; padding:0 18px}
.muted{color:var(--muted)}
.app-main{padding:20px 18px 40px; min-height:62vh}
.ic{width:22px; height:22px}
.ic-sm{width:15px; height:15px; vertical-align:-2px}

/* ---------- Buttons ---------- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:11px 18px; border-radius:var(--r-sm); font-weight:700; font-size:14.5px;
  font-family:inherit; border:1px solid transparent; cursor:pointer; white-space:nowrap;
  transition:transform .12s var(--ease), box-shadow .18s, background .18s, border-color .18s}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn .ic{width:18px; height:18px}
.btn-brand{background:linear-gradient(180deg,var(--brand-2),var(--brand)); color:#fff; box-shadow:0 6px 18px rgba(244,98,30,.30)}
.btn-brand:hover{box-shadow:0 10px 24px rgba(244,98,30,.38)}
.btn-dark{background:var(--navy); color:#fff}
.btn-dark:hover{background:var(--navy-2)}
.btn-green{background:var(--green); color:#fff}
.btn-ghost{background:var(--surface); color:var(--ink); border-color:var(--line-2)}
.btn-ghost:hover{border-color:var(--ink-2)}
.btn-lg{padding:14px 24px; font-size:15.5px; border-radius:14px}
.btn-block{width:100%}
.icon-btn{display:inline-grid; place-items:center; width:42px; height:42px; border-radius:12px;
  background:var(--surface-2); color:var(--ink-2); border:none; cursor:pointer; transition:.16s}
.icon-btn:hover{background:var(--surface-3); color:var(--ink)}
.icon-btn .ic{width:21px; height:21px}

/* ---------- Top bar ---------- */
.topbar{position:sticky; top:0; z-index:50; background:rgba(255,255,255,.97); border-bottom:1px solid var(--line)}
.topbar-in{display:flex; align-items:center; gap:18px; height:64px}
.brand{display:flex; align-items:center; gap:10px; flex-shrink:0}
.brand-mark{display:grid; place-items:center; width:38px; height:38px; border-radius:12px;
  background:linear-gradient(140deg,var(--navy),#2A3766); color:#fff; font-family:"Noto Sans Devanagari",sans-serif;
  font-weight:700; font-size:16px; box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.12), 0 4px 12px rgba(17,26,54,.25); position:relative}
.brand-mark::after{content:""; position:absolute; inset:auto 6px 6px auto; width:8px; height:8px; border-radius:50%; background:var(--brand); box-shadow:0 0 0 2px #fff}
.brand-mark.sm{width:28px; height:28px; font-size:13px; border-radius:9px}
.brand-name{font-size:20px; font-weight:700; letter-spacing:-.03em; color:var(--ink)}
.brand-name b{color:var(--ink); font-weight:800}
.topnav{display:flex; gap:4px; margin-right:auto}
.topnav a{padding:9px 14px; border-radius:10px; font-size:14.5px; font-weight:600; color:var(--ink-2); transition:.15s}
.topnav a:hover{background:var(--surface-2); color:var(--ink)}
.topnav a.on{color:var(--brand-ink); background:var(--brand-soft)}
.topbar-actions{display:flex; align-items:center; gap:8px}
.only-mobile{display:none}

/* ---------- Hero ---------- */
.hero{position:relative; overflow:hidden; border-radius:var(--r-lg); padding:34px 30px 30px; margin-bottom:18px; color:#fff;
  background:linear-gradient(155deg,#1B2A55 0%,#0F1730 100%)}
.hero-glow{position:absolute; width:360px; height:360px; right:-80px; top:-120px; border-radius:50%;
  background:radial-gradient(circle, rgba(244,98,30,.5), transparent 70%); pointer-events:none}
.hero h1{font-size:30px; font-weight:800; color:#fff; max-width:600px; position:relative}
.hero p{margin:10px 0 0; color:#C4CBDE; font-size:15.5px; max-width:540px; position:relative}
.hero-search{position:relative; display:flex; gap:8px; margin-top:20px; max-width:560px}
.hero-search .field{position:relative; flex:1}
.hero-search .ic{position:absolute; left:14px; top:50%; transform:translateY(-50%); width:20px; height:20px; color:var(--faint)}
.hero-search input{width:100%; padding:14px 16px 14px 44px; border:none; border-radius:13px; font-size:15px; font-family:inherit; background:#fff; color:var(--ink); outline:none; box-shadow:var(--sh-2)}
.hero-stats{display:flex; gap:22px; margin-top:18px; position:relative}
.hero-stats div{display:flex; flex-direction:column}
.hero-stats b{font-size:20px; font-weight:800; color:#fff}
.hero-stats span{font-size:12px; color:#9AA6C2; font-weight:500}

/* ---------- Chips (category filter row) ---------- */
.chips-row{display:flex; gap:9px; overflow-x:auto; padding:2px 2px 14px; margin:0 -2px 6px; scrollbar-width:none}
.chips-row::-webkit-scrollbar{display:none}
.chip{flex-shrink:0; display:inline-flex; align-items:center; gap:7px; padding:9px 15px; border-radius:var(--pill);
  background:var(--surface); border:1px solid var(--line-2); color:var(--ink-2); font-size:13.5px; font-weight:600; transition:.15s; box-shadow:var(--sh-1)}
.chip .ic{width:16px; height:16px; color:var(--brand)}
.chip:hover{border-color:var(--ink-2); color:var(--ink); transform:translateY(-1px)}
.chip.on{background:var(--navy); color:#fff; border-color:var(--navy)}
.chip.on .ic{color:#fff}

/* ---------- Feed sections ---------- */
.feed{display:flex; flex-direction:column; gap:26px}
.sec-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:13px}
.sec-head h2{font-size:19px; font-weight:800; display:flex; align-items:center; gap:9px}
.sec-head .dot{width:9px; height:9px; border-radius:50%; background:var(--brand)}
.sec-head .dot.green{background:var(--green)} .sec-head .dot.blue{background:var(--blue)}
.sec-head .dot.violet{background:var(--violet)} .sec-head .dot.amber{background:var(--amber)}
.see-all{display:inline-flex; align-items:center; gap:3px; font-size:13.5px; font-weight:700; color:var(--brand-ink)}
.see-all .ic{width:15px; height:15px}
.see-all:hover{gap:6px}
.cards{display:grid; grid-template-columns:repeat(2,1fr); gap:12px}

/* ---------- Job card ---------- */
.jcard{display:flex; gap:13px; align-items:center; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r); padding:14px; box-shadow:var(--sh-1); transition:transform .14s var(--ease), box-shadow .2s, border-color .2s}
.jcard:hover{transform:translateY(-2px); box-shadow:var(--sh-2); border-color:var(--line-2)}
.jcard-mono{flex-shrink:0; width:48px; height:48px; border-radius:13px; display:grid; place-items:center;
  font-size:13px; font-weight:800; letter-spacing:.02em; background:var(--brand-soft); color:var(--brand-ink)}
.jcard-mono[data-s="ssc"]{background:#EEF0FF; color:#3D43C7}
.jcard-mono[data-s="railway"]{background:#FDECEC; color:#B4322E}
.jcard-mono[data-s="banking"]{background:var(--green-soft); color:#0B7A54}
.jcard-mono[data-s="upsc"]{background:#E5F6F1; color:#0B6E54}
.jcard-mono[data-s="defence"]{background:#EEF1F5; color:#3F4A5A}
.jcard-mono[data-s="police"]{background:var(--blue-soft); color:#1D4FB8}
.jcard-mono[data-s="teaching"]{background:var(--violet-soft); color:#6D28D9}
.jcard-mono[data-s="state-psc"]{background:#FFF1E2; color:#B45309}
.jcard-main{flex:1; min-width:0}
.jcard-main h3{font-size:14.5px; font-weight:700; color:var(--ink); line-height:1.32;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.jcard-meta{display:flex; flex-wrap:wrap; gap:5px 10px; margin-top:5px; font-size:12.5px; color:var(--muted)}
.jcard-meta span{display:inline-flex; align-items:center; gap:4px}
.jcard-foot{display:flex; align-items:center; gap:8px; margin-top:9px}
.jcard-go{margin-left:auto; color:var(--faint); display:grid; place-items:center; width:26px; height:26px; border-radius:8px; background:var(--surface-2); transition:.15s}
.jcard-go .ic{width:16px; height:16px}
.jcard:hover .jcard-go{background:var(--brand); color:#fff}
/* extra sector tints so unmapped orgs still get a real seal colour */
.jcard-mono[data-s="engineering"]{background:var(--blue-soft); color:#1D4FB8}
.jcard-mono[data-s="medical"]{background:var(--green-soft); color:#0B7A54}
.jcard-mono[data-s="other"]{background:var(--surface-3); color:var(--ink-2)}

/* ---- one-line description (the owner's title+description card) ---- */
.jcard-desc{font-size:13px; color:var(--muted); line-height:1.4; margin-top:2px;
  display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden}

/* ---- compact variant used in the dense homepage panels + latest lane ---- */
.jcard-sm{gap:10px; padding:10px 12px; align-items:flex-start}
.jcard-sm .jcard-mono{width:36px; height:36px; border-radius:10px; font-size:11.5px; margin-top:1px}
.jcard-sm .jcard-main{position:relative; padding-right:15px}
.jcard-sm .jcard-main h3{-webkit-line-clamp:1}
.jcard-sm .jcard-main::after{content:"\203A"; position:absolute; right:0; top:-1px; font-size:18px;
  line-height:1; color:var(--faint); transition:color .15s}
.jcard-sm:hover .jcard-main::after{color:var(--brand)}
.jcard-sm .jcard-foot{margin-top:7px; flex-wrap:wrap; gap:5px 9px}
/* inside a section panel the monogram is tinted by SECTION (panel --acc) so the
   left rail stays one calm colour instead of a per-sector rainbow */
.panel .jcard-sm .jcard-mono{background:color-mix(in srgb, var(--acc) 13%, transparent); color:var(--acc)}

/* ---- text meta chips (no per-chip SVG — keeps DOM/LCP light) ---- */
.jm, .jm-date{font-size:12.5px; color:var(--muted); display:inline-flex; align-items:center}
.jm-urgent{color:var(--red); font-weight:600}

/* ---- category tag (latest lane only) — darkened accent for AA text contrast ---- */
.jcard-cat{display:inline-block; font-size:10.5px; font-weight:800; text-transform:uppercase;
  letter-spacing:.05em; color:color-mix(in srgb, var(--acc,#F4621E), #000 24%); margin-bottom:2px}
[data-theme="dark"] .jcard-cat{color:color-mix(in srgb, var(--acc,#F4621E) 64%, #fff)}

/* ---- today anchor (static replacement for the old blinking 'New') ---- */
.jcard-today{position:relative}
.jcard-today::before{content:""; position:absolute; left:0; top:8px; bottom:8px; width:2px;
  border-radius:2px; background:var(--brand)}
.jcard-today .jcard-main h3::before{content:""; display:inline-block; width:6px; height:6px;
  border-radius:50%; background:var(--brand); margin-right:6px; vertical-align:middle}

/* ---- expired/closed: de-emphasise, kept for user + SEO ---- */
.jcard[data-expired] h3{color:var(--muted)}
.jcard[data-expired] .jcard-mono{opacity:.6}

/* ---------- Status pills ---------- */
.pill{display:inline-flex; align-items:center; gap:4px; font-size:11px; font-weight:700; padding:4px 9px; border-radius:var(--pill); letter-spacing:.01em; line-height:1.3; white-space:nowrap}
.pill .ic{width:12px; height:12px}
.pill-brand{background:var(--brand-soft); color:var(--brand-ink)}
.pill-red{background:var(--red-soft); color:#B01049}
.pill-amber{background:var(--amber-soft); color:var(--amber)}
.pill-green{background:var(--green-soft); color:#0B7A54}
.pill-blue{background:var(--blue-soft); color:#1D4FB8}
.pill-purple{background:var(--violet-soft); color:var(--violet)}
.pill-grey{background:var(--surface-3); color:var(--muted)}
.pill-saffron{background:var(--brand-soft); color:var(--brand-ink)}

/* ---------- CTA banner ---------- */
.cta{position:relative; overflow:hidden; display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
  margin-top:28px; padding:28px 30px; border-radius:var(--r-lg); color:#fff; box-shadow:var(--sh-2);
  background:linear-gradient(150deg,#1B2A55,#0F1730)}
.cta h2{font-size:21px; color:#fff} .cta p{margin:7px 0 0; color:#C4CBDE; font-size:14.5px; max-width:520px}
.cta .glow{position:absolute; right:-60px; bottom:-100px; width:320px; height:320px; border-radius:50%; background:radial-gradient(circle,rgba(244,98,30,.5),transparent 70%)}

/* ---------- Breadcrumb / titles ---------- */
.crumbs{display:flex; align-items:center; gap:6px; font-size:12.5px; color:var(--muted); margin-bottom:14px}
.crumbs a:hover{color:var(--brand-ink)}
.crumbs .ic{width:13px; height:13px; color:var(--faint)}
.page-title{font-size:25px; font-weight:800; margin-bottom:6px}
.page-sub{color:var(--muted); margin:0 0 18px}

/* ---------- Category list ---------- */
.card-list{display:grid; grid-template-columns:repeat(2,1fr); gap:12px}

/* ---------- Post (job detail) ---------- */
.post-layout{display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:24px; align-items:start}
.post{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-1); padding:28px 30px; min-width:0}
.post-tags{display:flex; gap:7px; flex-wrap:wrap; align-items:center; margin-bottom:12px}
.tag{font-size:11.5px; font-weight:700; color:var(--ink-2); background:var(--surface-2); padding:4px 11px; border-radius:var(--pill)}
.post-head h1{font-size:26px; font-weight:800; line-height:1.22}
.post-meta{display:flex; flex-wrap:wrap; gap:6px 14px; font-size:12.5px; color:var(--muted); margin:12px 0 0}
.post-meta span{display:inline-flex; align-items:center; gap:5px}
.lead{font-size:16px; color:var(--ink-2); margin:18px 0; line-height:1.72}
.quick-facts{display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:18px 0 6px}
.quick-facts div{background:var(--surface-2); border-radius:var(--r-sm); padding:13px 14px}
.quick-facts span{display:block; font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; font-weight:600}
.quick-facts b{display:block; font-size:17px; font-weight:800; margin-top:3px}
.sec-h{font-size:18px; font-weight:800; margin:30px 0 13px; display:flex; align-items:center; gap:9px}
.sec-h .ic{width:20px; height:20px; color:var(--brand)}
.sec-h small{font-size:12.5px; color:var(--muted); font-weight:500}
.dtable{width:100%; border-collapse:separate; border-spacing:0; border:1px solid var(--line); border-radius:var(--r-sm); overflow:hidden; font-size:14.5px}
.dtable td,.dtable th{padding:12px 15px; text-align:left; border-bottom:1px solid var(--line)}
.dtable tr:last-child td{border-bottom:none}
.dtable td:first-child{color:var(--ink-2); width:46%}
.dtable tr:nth-child(even){background:var(--surface-2)}
.dtable.matrix th{background:var(--navy); color:#fff; font-size:12.5px; font-weight:700}
.dtable.matrix td:first-child{width:auto; font-weight:600; color:var(--ink)}
.table-scroll{overflow-x:auto}
.note{font-size:13px; color:var(--ink-2); background:var(--brand-soft); border-radius:var(--r-xs); padding:11px 14px; margin:11px 0}
.steps{margin:0; padding:0; list-style:none; counter-reset:s}
.steps li{position:relative; padding:6px 0 6px 34px; color:var(--ink-2)}
.steps li::before{counter-increment:s; content:counter(s); position:absolute; left:0; top:5px; width:24px; height:24px; border-radius:8px; background:var(--brand-soft); color:var(--brand-ink); font-size:12px; font-weight:800; display:grid; place-items:center}
.links-table{width:100%; border-collapse:separate; border-spacing:0 8px}
.links-table td{padding:12px 15px; font-size:14.5px; font-weight:600; background:var(--surface-2)}
.links-table td:first-child{border-radius:var(--r-xs) 0 0 var(--r-xs)}
.links-table td:last-child{border-radius:0 var(--r-xs) var(--r-xs) 0; text-align:right; display:flex; gap:8px; justify-content:flex-end}
.btn-link{background:var(--navy); color:#fff; padding:8px 16px; border-radius:9px; font-size:13.5px; font-weight:700}
.btn-link:hover{background:var(--navy-2)}
.btn-link.alt{background:var(--green)}
.source-note{font-size:13px; color:var(--muted); margin-top:22px; padding-top:16px; border-top:1px dashed var(--line-2)}
.ad-slot{min-height:90px; display:grid; place-items:center; background:var(--surface-2); border:1px dashed var(--line-2); border-radius:var(--r-sm); margin:18px 0}
.ad-slot span{font-size:10.5px; color:var(--faint); letter-spacing:.1em; text-transform:uppercase}

/* ---------- Detail sidebar ---------- */
.post-side{display:flex; flex-direction:column; gap:16px; position:sticky; top:84px}
.side-cta{background:linear-gradient(150deg,#16224A,#0F1730); color:#fff; border-radius:var(--r); padding:22px; box-shadow:var(--sh-1); position:relative; overflow:hidden}
.side-cta h3{font-size:16px; color:#fff; margin-bottom:6px}
.side-cta p{font-size:13px; color:#C4CBDE; margin:0 0 14px}
.side-cta .btn{width:100%}
.side-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--sh-1); padding:18px}
.side-card h3{font-size:14px; margin-bottom:12px}
.side-list{list-style:none; margin:0; padding:0}
.side-list li{padding:9px 0; border-top:1px solid var(--line); font-size:13.5px}
.side-list li:first-child{border-top:none}
.side-list a{color:var(--ink-2); font-weight:500}
.side-list a:hover{color:var(--brand-ink)}
.side-connect{display:flex; flex-direction:column; gap:9px}

/* ---------- Wizard ---------- */
.wizard-wrap{max-width:600px; margin:0 auto}
.steps-bar{display:flex; align-items:center; margin:18px 0 24px}
.step-dot{display:flex; flex-direction:column; align-items:center; gap:6px; flex-shrink:0}
.step-dot b{width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:var(--surface); border:2px solid var(--line-2); color:var(--muted); font-size:14px; font-weight:800; transition:.2s}
.step-dot span{font-size:11.5px; color:var(--muted); font-weight:600}
.step-dot.active b{background:var(--brand); border-color:var(--brand); color:#fff; box-shadow:0 4px 12px rgba(244,98,30,.32)}
.step-dot.active span{color:var(--ink)}
.step-line{flex:1; height:2px; background:var(--line-2); margin:0 8px 18px}
form#wizard{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-1); padding:26px}
.step{border:none; margin:0; padding:0}
.step.hidden{display:none}
.step legend{font-size:18px; font-weight:800; margin-bottom:18px; padding:0}
.field-label{display:block; font-size:13.5px; font-weight:600; color:var(--ink-2); margin-bottom:7px}
.optional{color:var(--faint); font-weight:400; font-size:12px}
.field{margin-bottom:17px}
.field-row{display:flex; gap:14px}
.field-row .field{flex:1}
.field input,.field select{width:100%; padding:12px 14px; border:1.5px solid var(--line-2); border-radius:11px; font-size:15px; font-family:inherit; outline:none; background:var(--surface); transition:.15s}
.field input:focus,.field select:focus{border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-soft)}
.hint{display:block; color:var(--red); font-size:12.5px; margin-top:6px; min-height:1px}
.chips{display:flex; flex-wrap:wrap; gap:9px; margin-bottom:20px}
.chips .chip{cursor:pointer; position:relative}
.chips .chip input{position:absolute; opacity:0; width:0; height:0}
.chips .chip span{display:inline-block}
.chips .chip:has(input:checked){background:var(--navy); border-color:var(--navy); color:#fff}
.consent{display:flex; gap:11px; align-items:flex-start; background:var(--surface-2); padding:15px; border-radius:12px; cursor:pointer; font-size:14px; color:var(--ink-2)}
.consent input{margin-top:2px; width:18px; height:18px; flex-shrink:0; accent-color:var(--brand)}
.privacy-note{font-size:12px; color:var(--muted); margin:13px 0 0}
.wizard-actions{display:flex; justify-content:space-between; gap:12px; margin-top:24px}

/* ---------- Done / 404 / empty ---------- */
.done-box{max-width:500px; margin:30px auto; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-1); padding:40px 30px; text-align:center}
.done-check{width:72px; height:72px; margin:0 auto 18px; border-radius:50%; background:var(--green-soft); color:var(--green); display:grid; place-items:center}
.done-check .ic{width:38px; height:38px}
.done-check.err{background:var(--brand-soft); color:var(--brand-ink); font-size:24px; font-weight:800}
.done-box h1{font-size:24px; margin-bottom:8px}
.done-box p{color:var(--ink-2); margin:0 0 22px}
.done-actions{display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-bottom:16px}
.back-home{font-size:13.5px; color:var(--muted)}
.empty{background:var(--surface); border:1px dashed var(--line-2); border-radius:var(--r); padding:32px; text-align:center; color:var(--muted)}
.search-page{display:flex; gap:10px; margin:0 0 20px; position:relative; max-width:520px}
.search-page .field{position:relative; flex:1}
.search-page .ic{position:absolute; left:14px; top:50%; transform:translateY(-50%); width:19px; height:19px; color:var(--faint)}
.search-page input{width:100%; padding:12px 14px 12px 42px; border:1.5px solid var(--line-2); border-radius:12px; font-size:15px; outline:none; font-family:inherit}

/* ---------- Mobile bottom tab bar + sheet ---------- */
.tabbar{display:none}
.tab-ic{width:23px; height:23px}
.sheet-backdrop{position:fixed; inset:0; background:rgba(10,12,20,.42); opacity:0; visibility:hidden; transition:.25s; z-index:60}
.sheet{position:fixed; left:0; right:0; bottom:0; transform:translateY(100%); visibility:hidden; transition:transform .3s var(--ease), visibility .3s; z-index:61;
  background:var(--surface); border-radius:22px 22px 0 0; padding:10px 18px calc(20px + env(safe-area-inset-bottom)); box-shadow:0 -20px 50px rgba(0,0,0,.2)}
body.sheet-open .sheet{transform:translateY(0); visibility:visible}
body.sheet-open .sheet-backdrop{opacity:1; visibility:visible}
.sheet-grab{width:40px; height:4px; border-radius:99px; background:var(--line-2); margin:6px auto 12px}
.sheet-h{font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin-bottom:12px}
.sheet-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:14px}
.sheet-grid a{display:flex; flex-direction:column; align-items:center; gap:7px; padding:14px 6px; border-radius:14px; background:var(--surface-2); font-size:12px; font-weight:600; color:var(--ink-2); text-align:center}
.sheet-grid a:hover{background:var(--surface-3)}
.sheet-grid .ic{width:23px; height:23px; color:var(--brand)}

/* ---------- Footer ---------- */
.site-footer{background:var(--navy); color:#AEB6CC; margin-top:36px; padding:38px 0 26px; font-size:14px}
.footer-cols{display:grid; grid-template-columns:1.7fr 1fr 1fr 1fr; gap:26px; padding-bottom:24px; border-bottom:1px solid rgba(255,255,255,.1)}
.footer-brand{display:flex; align-items:center; gap:9px; font-size:17px; font-weight:800; color:#fff; margin-bottom:10px}
.footer-cols h3{color:#fff; font-size:12.5px; text-transform:uppercase; letter-spacing:.05em; margin-bottom:12px; font-weight:700}
.footer-cols a{display:block; color:#AEB6CC; padding:4px 0; font-size:13.5px}
.footer-cols a:hover{color:#fff}
.footer-cols .muted{color:#8B93AC}
.disclaimer{display:flex; align-items:flex-start; gap:7px; font-size:12px; color:#8B93AC; margin:18px 0 6px; line-height:1.6}
.disclaimer .ic{color:#8B93AC; flex-shrink:0; margin-top:2px}
.copyright{font-size:12px; color:#8B93AC; margin:0}
.copyright a{color:#AEB6CC}

/* ---------- Responsive ---------- */
@media(max-width:980px){
  .post-layout{grid-template-columns:1fr}
  .post-side{position:static}
  .footer-cols{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
  .only-desktop{display:none}
  .only-mobile{display:inline-grid}
  .topnav{display:none}
  .topbar-in{height:58px; gap:10px}
  .brand-name{font-size:18px}
  .app-main{padding:16px 16px calc(78px + env(safe-area-inset-bottom)); }
  .tabbar{display:grid; grid-template-columns:repeat(5,1fr); position:fixed; left:0; right:0; bottom:0; z-index:55;
    background:rgba(255,255,255,.97); border-top:1px solid var(--line);
    padding-bottom:env(safe-area-inset-bottom)}
  .tab{display:flex; flex-direction:column; align-items:center; gap:3px; padding:9px 0 8px; background:none; border:none; cursor:pointer;
    font-size:10.5px; font-weight:600; color:var(--muted); transition:.15s}
  .tab .tab-ic{color:var(--faint); transition:.15s}
  .tab.on{color:var(--brand-ink)}
  .tab.on .tab-ic{color:var(--brand)}
  .cards{grid-template-columns:1fr}
  .card-list{grid-template-columns:1fr}
  .hero{padding:26px 22px; border-radius:var(--r)}
  .hero h1{font-size:24px}
  .quick-facts{grid-template-columns:repeat(2,1fr)}
  .post{padding:22px 18px; border-radius:var(--r)}
  .post-head h1{font-size:22px}
  .field-row{flex-direction:column; gap:0}
  .footer-cols{grid-template-columns:1fr 1fr; gap:18px}
  .cta{padding:24px}
}

/* ---------- Back-compat aliases (legacy class/var names: admin, subscribe, 404) ---------- */
:root{
  --navy-deep:#0F1730; --navy-soft:#EEF0FF;
  --saffron:#F4621E; --saffron-dark:#C2480E; --saffron-soft:#FFF1E9;
  --shadow:var(--sh-1); --shadow-lg:var(--sh-2);
  --radius:16px; --radius-sm:12px; --card:#FFFFFF; --purple:#7C3AED;
}
.btn-saffron{background:linear-gradient(180deg,var(--brand-2),var(--brand)); color:#fff; box-shadow:0 6px 18px rgba(244,98,30,.30)}
.btn-saffron:hover{box-shadow:0 10px 24px rgba(244,98,30,.38); color:#fff}
.btn-navy{background:var(--navy); color:#fff}
.btn-navy:hover{background:var(--navy-2); color:#fff}
/* legacy job-list (detail sidebar / admin) */
.job-list{list-style:none; margin:0; padding:0}
.job-list li{display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px 0; border-top:1px solid var(--line); font-size:13.5px}
.job-list li:first-child{border-top:none}
.job-list li a{color:var(--ink-2)} .job-list li a:hover{color:var(--brand-ink)}

/* ---------- Monetization (ads + affiliate) ---------- */
/* Reserve height even when live so a late-loading ad can't shift content (CLS<0.1). */
.ad-slot.is-live{background:none; border:none; min-height:250px; padding:0; display:block; margin:18px 0}

/* Highlighted 'Last Date to Apply' row in the dates table (highest-scanned row). */
.dtable tr.deadline td{background:rgba(214,53,33,.07); font-weight:700}
.dtable tr.deadline td:first-child{border-left:4px solid #d63521; color:#b3341f}
[data-theme="dark"] .dtable tr.deadline td{background:rgba(233,123,99,.12)}
[data-theme="dark"] .dtable tr.deadline td:first-child{border-left-color:#e97b63; color:#e97b63}

/* Important Links — big color-coded 48px conversion buttons (the money click). */
.link-btns{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:14px 0}
.lbtn{display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:48px;
  padding:12px 16px; border-radius:10px; font-weight:700; font-size:15px; color:#fff;
  text-decoration:none; line-height:1.2; box-shadow:0 1px 2px rgba(0,0,0,.08)}
.lbtn span{opacity:.8; font-weight:400}
.lbtn:active{transform:translateY(1px)}
.lbtn-apply{background:#1a7f37}
.lbtn-download{background:#1e5fa8}
.lbtn-official{background:#4a5568}
.lbtn-default{background:#6b5b1a}
@media (max-width:560px){.link-btns{grid-template-columns:1fr}}

/* Author bio page (E-E-A-T). */
.author-page{max-width:640px}
.author-head{display:flex; align-items:center; gap:14px; margin:8px 0 16px}
.author-avatar{width:54px; height:54px; border-radius:50%; display:grid; place-items:center;
  background:var(--brand,#e8890c); color:#fff; font-weight:700; font-size:23px; flex-shrink:0}
.author-role{color:var(--muted,#6b7280); font-size:14px; margin:3px 0 0}

/* 'Latest Updates' strip — returning user's #1 intent, cheapest LCP element. */
.latest-strip{background:var(--surface-2,#f6f3ec); border:1px solid var(--line-2,#e4ddcd); border-radius:12px; padding:14px 16px; margin:14px 0}
.ls-head{font-size:15.5px; font-weight:800; margin:0; display:flex; align-items:center; gap:6px; color:var(--ink); font-family:var(--sans); letter-spacing:-.01em}
.ls-list{list-style:none; margin:0; padding:0; display:grid; gap:7px}
.ls-list li{border-bottom:1px dashed var(--line-2,#e4ddcd); padding-bottom:7px}
.ls-list li:last-child{border-bottom:none; padding-bottom:0}
.ls-list a{color:var(--ink,#1a2238); text-decoration:none; font-size:14.5px; font-weight:500; line-height:1.35}
.ls-list a:hover{text-decoration:underline; color:var(--brand,#e8890c)}
.aff-block{margin:26px 0}
.aff-head{display:flex; align-items:baseline; justify-content:space-between; margin-bottom:12px}
.aff-head h3{font-size:16px; font-weight:800}
.aff-note{font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:var(--faint); font-weight:700}
.aff-list{display:grid; grid-template-columns:repeat(3,1fr); gap:12px}
.aff-card{display:flex; flex-direction:column; gap:5px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:16px; box-shadow:var(--sh-1); transition:transform .14s var(--ease), box-shadow .2s, border-color .2s}
.aff-card:hover{transform:translateY(-3px); box-shadow:var(--sh-2); border-color:var(--line-2)}
.aff-tag{align-self:flex-start; font-size:10px; font-weight:700; color:var(--brand-ink); background:var(--brand-soft); padding:3px 9px; border-radius:var(--pill); text-transform:uppercase; letter-spacing:.03em}
.aff-card b{font-size:15px; margin-top:4px}
.aff-desc{font-size:13px; color:var(--muted); flex:1; line-height:1.5}
.aff-cta{display:inline-flex; align-items:center; gap:4px; font-size:13px; font-weight:700; color:var(--brand-ink); margin-top:4px}
.aff-card:hover .aff-cta{gap:7px}
.post-side .aff-block{margin:0}
.post-side .aff-list{grid-template-columns:1fr}
@media(max-width:720px){.aff-list{grid-template-columns:1fr}}

/* ---------- Countdown (open-loop FOMO on job detail) ---------- */
.countdown{display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin:18px 0; padding:15px 18px; border-radius:var(--r); background:linear-gradient(135deg,var(--brand-soft),#fff); border:1px solid #F8D6C4}
.countdown.urgent{background:linear-gradient(135deg,#FDE7EE,#fff); border-color:#F6BFD1}
.countdown.closed{background:var(--surface-2); border-color:var(--line)}
.cd-label{display:flex; align-items:center; gap:7px; font-weight:700; font-size:14px; color:var(--brand-ink)}
.countdown.urgent .cd-label{color:var(--red)}
.cd-label .ic{width:18px; height:18px}
.cd-timer{display:flex; gap:8px; margin-left:auto}
.cd-unit{display:flex; flex-direction:column; align-items:center; min-width:50px; background:#fff; border:1px solid var(--line); border-radius:10px; padding:7px 6px; box-shadow:var(--sh-1)}
.cd-unit b{font-size:21px; font-weight:800; font-variant-numeric:tabular-nums; line-height:1.1}
.cd-unit span{font-size:9.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); font-weight:700; margin-top:2px}
.cd-apply{flex-shrink:0}
@media(max-width:720px){
  .countdown{gap:10px}
  .cd-timer{margin-left:0; width:100%; justify-content:space-between}
  .cd-unit{flex:1}
  .cd-apply{width:100%; justify-content:center}
}

/* ---------- Saved jobs (Meri List) ---------- */
.saved-link{position:relative}
.nav-badge{position:absolute; top:-3px; right:-3px; min-width:17px; height:17px; padding:0 4px; border-radius:9px; background:var(--brand); color:#fff; font-size:10px; font-weight:800; display:grid; place-items:center; font-style:normal; line-height:17px; box-shadow:0 0 0 2px #fff}
.save-btn{gap:7px}
.save-btn .ic{width:18px; height:18px; transition:.15s}
.save-btn.on{color:var(--brand-ink); border-color:#F8D6C4; background:var(--brand-soft)}
.save-btn.on .ic{fill:currentColor}
.post-actions{margin-top:14px}
.jcard-wrap{position:relative}
.jcard-wrap .jcard{padding-right:56px}
.jcard-save{position:absolute; top:12px; right:12px; width:36px; height:36px; border-radius:11px; display:grid; place-items:center; background:var(--surface-2); border:1px solid var(--line); color:var(--muted); cursor:pointer; transition:.15s; z-index:2}
.jcard-save:hover{color:var(--brand-ink); border-color:#F8D6C4}
.jcard-save.on{color:var(--brand-ink); background:var(--brand-soft); border-color:#F8D6C4}
.jcard-save.on .ic{fill:currentColor}
.jcard-save .ic{width:18px; height:18px}
.empty-ic{width:58px; height:58px; margin:0 auto 14px; border-radius:50%; background:var(--brand-soft); color:var(--brand-ink); display:grid; place-items:center}
.empty-ic .ic{width:28px; height:28px}
.empty h3{margin-bottom:6px; font-size:18px}
.empty p{margin:0 auto 16px; max-width:340px}

/* ---------- Static content pages ---------- */
.static-page{max-width:820px; margin:0 auto}
.static-page h1{font-size:26px; margin-bottom:4px}
.static-updated{font-size:12.5px; color:var(--muted); margin:0 0 20px}
.static-page h2{font-size:18px; margin:24px 0 10px}
.static-page p{margin:0 0 13px; color:var(--ink-2); line-height:1.72}
.static-page ul{margin:0 0 13px; padding-left:20px}
.static-page li{margin:6px 0; color:var(--ink-2); line-height:1.65}
.static-page a{color:var(--brand-ink); font-weight:600}
.static-page a:hover{text-decoration:underline}
.browse{margin-top:26px}
.browse .chips-row{padding-bottom:4px}
.hub-intro.static-page{max-width:none; margin:28px 0 0; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--sh-1); padding:22px 24px}
.hub-intro h2{margin-top:0}
.lang-switch{display:flex; align-items:center; gap:8px; margin-top:8px; padding-top:12px; border-top:1px solid var(--line)}
.lang-switch span{color:var(--muted); font-weight:600; font-size:13px; margin-right:auto}
.lang-switch a{padding:7px 16px; border-radius:var(--pill); border:1px solid var(--line-2); font-weight:700; color:var(--ink-2); font-size:13.5px}
.lang-switch a.on{background:var(--navy); color:#fff; border-color:var(--navy)}

/* ---------- Daily quiz (daily-return content hook) ---------- */
.quiz-wrap{max-width:640px; margin:0 auto}
.quiz-head{display:flex; align-items:flex-start; justify-content:space-between; gap:14px}
.streak-badge{display:inline-flex; align-items:center; gap:6px; background:var(--brand-soft); color:var(--brand-ink); padding:8px 14px; border-radius:var(--pill); font-size:13.5px; font-weight:700; flex-shrink:0; margin-top:4px}
.streak-badge .ic{width:16px; height:16px}
.quiz-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-1); padding:24px; margin-top:6px}
.quiz-progress{display:flex; justify-content:space-between; font-size:12.5px; font-weight:700; color:var(--muted); margin-bottom:14px}
.quiz-q{font-size:19px; font-weight:800; line-height:1.4; margin-bottom:18px}
.quiz-options{display:flex; flex-direction:column; gap:10px}
.quiz-opt{display:block; width:100%; text-align:left; padding:14px 16px; border:1.5px solid var(--line-2); border-radius:12px; background:var(--surface); font-size:15px; font-weight:600; font-family:inherit; color:var(--ink); cursor:pointer; transition:.14s}
.quiz-opt:hover:not(.disabled){border-color:var(--navy); background:var(--surface-2)}
.quiz-opt.disabled{cursor:default}
.quiz-opt.correct{border-color:var(--green); background:var(--green-soft); color:#0B7A54}
.quiz-opt.wrong{border-color:var(--red); background:var(--red-soft); color:var(--red)}
.quiz-explain{margin-top:14px; padding:12px 15px; background:var(--surface-2); border-left:3px solid var(--brand); border-radius:0 10px 10px 0; font-size:14px; color:var(--ink-2); line-height:1.6}
#q-next{margin-top:18px}
.quiz-result{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--sh-1); padding:34px 28px; text-align:center}
.result-emoji{font-size:54px; line-height:1; margin-bottom:10px}
.quiz-result h2{font-size:24px; margin-bottom:8px}
.result-score-line{font-size:16px; color:var(--ink-2); margin:0 0 14px}
.streak-big{display:inline-block; background:var(--brand-soft); color:var(--brand-ink); font-size:18px; font-weight:800; padding:10px 22px; border-radius:var(--pill); margin-bottom:12px}
.quiz-result .done-actions{margin-top:20px}

/* ---------- Dark mode ---------- */
.theme-sun{display:none}
[data-theme="dark"] .theme-moon{display:none}
[data-theme="dark"] .theme-sun{display:inline-block}
.theme-pill{display:inline-flex; align-items:center; gap:7px; padding:7px 14px; border-radius:var(--pill); border:1px solid var(--line-2); background:var(--surface); color:var(--ink-2); font-weight:700; font-size:13px; cursor:pointer; font-family:inherit}
.theme-pill .ic{width:16px; height:16px}
.theme-name-dark{display:none}
[data-theme="dark"] .theme-name-light{display:none}
[data-theme="dark"] .theme-name-dark{display:inline}
[data-theme="dark"]{
  --bg:#0B0F1A; --surface:#141A28; --surface-2:#1C2436; --surface-3:#28324C;
  --ink:#EAEEF6; --ink-2:#B7C0D2; --muted:#8A94AB; --faint:#5C667E;
  --line:#222B3E; --line-2:#2E3852;
  --navy-soft:#1C2540; --brand-soft:#3A2516; --brand-ink:#FF9356;
  --green-soft:#11271D; --amber-soft:#2A1E10; --red-soft:#2B1320;
  --blue-soft:#11213C; --violet-soft:#1F1734;
  --sh-1:0 1px 2px rgba(0,0,0,.35), 0 2px 8px rgba(0,0,0,.3);
  --sh-2:0 8px 22px rgba(0,0,0,.5); --sh-pop:0 20px 56px rgba(0,0,0,.6);
}
[data-theme="dark"] body{background:var(--bg); color:var(--ink)}
[data-theme="dark"] .topbar{background:rgba(15,20,33,.98); border-bottom-color:var(--line)}
[data-theme="dark"] .tabbar{background:rgba(15,20,33,.98); border-top-color:var(--line)}
[data-theme="dark"] .view-more{background:var(--surface-2)}
[data-theme="dark"] .nav-badge{box-shadow:0 0 0 2px var(--surface)}
[data-theme="dark"] .brand-mark::after{box-shadow:0 0 0 2px var(--surface)}
[data-theme="dark"] .quiz-opt.correct{color:#34D399}
[data-theme="dark"] .quiz-opt.wrong{color:#FB7185}
[data-theme="dark"] .ad-slot{border-color:var(--line-2)}

/* ---------- Daily GK capsule ---------- */
.gk-list{display:grid; grid-template-columns:repeat(2,1fr); gap:14px}
.gk-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--sh-1); padding:20px}
.gk-card-head{margin-bottom:12px}
.gk-cat{display:inline-block; font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--brand-ink); background:var(--brand-soft); padding:3px 10px; border-radius:var(--pill); margin-bottom:8px}
.gk-card h2{font-size:16px; font-weight:800}
.gk-points{margin:0; padding-left:18px}
.gk-points li{margin:7px 0; color:var(--ink-2); font-size:14px; line-height:1.55}
.gk-note{display:flex; align-items:center; justify-content:center; gap:7px; text-align:center; color:var(--muted); font-size:13.5px; margin-top:24px; padding:14px; background:var(--surface-2); border-radius:var(--r-sm)}
.gk-note .ic{color:var(--brand)}
.gk-note a{color:var(--brand-ink); font-weight:700}
@media(max-width:720px){.gk-list{grid-template-columns:1fr}}
.calc-age{font-size:30px; font-weight:800; color:var(--brand-ink); letter-spacing:-.02em}
.calc-result .dtable{margin-top:6px}
.quiz-card .field input[type=date]{font-family:inherit}

/* ---------- Exam calendar ---------- */
.cal-list{display:flex; flex-direction:column; gap:10px}
.cal-month{font-size:12.5px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; color:var(--brand-ink); margin:14px 0 2px}
.cal-month:first-child{margin-top:0}
.cal-item{display:flex; align-items:center; gap:14px; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:13px 16px; box-shadow:var(--sh-1); transition:transform .12s var(--ease), box-shadow .18s}
.cal-item:hover{transform:translateY(-2px); box-shadow:var(--sh-2); text-decoration:none}
.cal-date{flex-shrink:0; width:50px; text-align:center; background:var(--brand-soft); border-radius:11px; padding:7px 4px}
.cal-date b{display:block; font-size:19px; font-weight:800; color:var(--brand-ink); line-height:1}
.cal-date span{font-size:10.5px; font-weight:700; text-transform:uppercase; color:var(--brand-ink); opacity:.8}
.cal-body{flex:1; min-width:0}
.cal-body h3{font-size:14.5px; font-weight:700; color:var(--ink); line-height:1.3; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.cal-meta{font-size:12.5px; color:var(--muted); margin-top:3px}

/* ---------- Engagement pack (poll / promo / prev-next / read-next / trending) ---------- */
.poll{margin:26px 0 4px; padding:18px 20px; border-radius:var(--r); background:var(--brand-soft); border:1px solid #F8D6C4}
.poll h3{font-size:15.5px; display:flex; align-items:center; gap:8px; margin-bottom:12px}
.poll h3 .ic{width:18px; height:18px; color:var(--brand)}
.poll-opts{display:flex; gap:9px; flex-wrap:wrap}
.poll-btn{padding:9px 16px; border-radius:var(--pill); border:1.5px solid var(--line-2); background:var(--surface); font-family:inherit; font-size:14px; font-weight:600; color:var(--ink-2); cursor:pointer; transition:.14s}
.poll-btn:hover{border-color:var(--brand); color:var(--brand-ink); transform:translateY(-1px)}
.poll-done{margin:4px 0 0; font-size:14px; color:var(--ink-2)}
.poll-done a{color:var(--brand-ink); font-weight:700}
.promo-strip{display:flex; gap:9px; flex-wrap:wrap; margin:16px 0 4px}
.prevnext{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:26px; padding-top:20px; border-top:1px solid var(--line)}
.pn{display:flex; flex-direction:column; gap:5px; padding:14px 16px; border-radius:var(--r-sm); border:1px solid var(--line); background:var(--surface-2); transition:.15s; min-width:0}
.pn:hover{border-color:var(--brand); background:var(--brand-soft)}
.pn span{display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--muted)}
.pn span .ic{width:14px; height:14px}
.pn b{font-size:13.5px; font-weight:700; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.pn-prev span .ic{transform:rotate(180deg)}
.pn-next{text-align:right; align-items:flex-end}
.read-next{margin-top:30px}
.trending-list li{display:flex; align-items:baseline; gap:10px}
.trend-n{flex-shrink:0; font-size:15px; font-weight:800; color:var(--brand); font-variant-numeric:tabular-nums; width:16px}
@media(max-width:720px){.prevnext{grid-template-columns:1fr}.pn-next{text-align:left; align-items:flex-start}}
.inline-related{margin:18px 0; padding:13px 16px; border-radius:var(--r-sm); background:var(--blue-soft); font-size:14px; line-height:1.7}
.inline-related b{display:inline-flex; align-items:center; gap:5px; color:#1D4FB8; margin-right:6px}
.inline-related a{color:#1D4FB8; font-weight:600; text-decoration:underline; text-underline-offset:2px}
.inline-related span{color:var(--faint); margin:0 5px}

/* ---------- Full-article pack (FAQ / article lists / disclaimer) ---------- */
.faq{display:flex; flex-direction:column; gap:9px; margin:14px 0 6px}
.faq-item{background:var(--surface-2); border:1px solid var(--line); border-radius:var(--r-sm); overflow:hidden}
.faq-item summary{padding:13px 16px; font-size:14.5px; font-weight:700; color:var(--ink); cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:space-between; gap:10px; transition:background .15s}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+"; font-size:19px; font-weight:700; color:var(--brand); flex-shrink:0; transition:transform .18s}
.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-item summary:hover{background:var(--surface-3)}
.faq-item[open]{background:var(--surface); border-color:var(--line-2); box-shadow:var(--sh-1)}
.faq-item p{margin:0; padding:2px 16px 14px; font-size:14px; line-height:1.65; color:var(--ink-2)}
.art-list{margin:10px 0 4px; padding-left:22px}
.art-list li{margin:7px 0; color:var(--ink-2); font-size:14.5px; line-height:1.6}
.disclaimer{margin-top:14px; padding:13px 16px; border-radius:var(--r-sm); background:var(--amber-soft); border:1px solid #F3E0C0; font-size:13px; line-height:1.65; color:var(--amber)}
.disclaimer a{font-weight:700; text-decoration:underline; text-underline-offset:2px; color:inherit}

/* Verified-against-official microcopy (YMYL trust + legal accountability). */
.verified-note{font-size:13px; color:var(--good,#2e7d4f); background:rgba(46,125,79,.08); border-radius:8px; padding:7px 11px; margin:8px 0 0; display:inline-block; line-height:1.4}
[data-theme="dark"] .verified-note{color:#5cc98b; background:rgba(92,201,139,.12)}

/* ═══════════════ Home dense grid — moved from home.html inline <style> so it is
   render-blocking-in-<head> (no FOUC/CLS) and cacheable across page loads ═══════════════ */
.hero-lite{padding-bottom:14px}
.trust-ribbon{display:flex; gap:20px; justify-content:center; flex-wrap:wrap; margin-top:16px}
.trust-ribbon span{display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:600; color:var(--muted)}
.trust-ribbon .ic-sm{width:15px; height:15px; color:var(--brand-ink)}

/* 8 quick-access boxes */
.qbox-grid{display:grid; grid-template-columns:repeat(8,1fr); gap:12px; margin:24px 0}
.qbox{display:flex; flex-direction:column; align-items:center; gap:9px; padding:16px 8px;
  background:var(--surface); border:1px solid var(--line); border-radius:15px; box-shadow:var(--sh-1);
  text-align:center; transition:transform .14s, box-shadow .14s, border-color .14s}
.qbox:hover{transform:translateY(-2px); box-shadow:var(--sh-2); border-color:var(--acc); text-decoration:none}
.qbox-ic{display:grid; place-items:center; width:46px; height:46px; border-radius:13px;
  background:color-mix(in srgb, var(--acc) 12%, transparent); color:var(--acc)}
.qbox-ic .ic{width:24px; height:24px}
.qbox b{font-size:12.5px; font-weight:700; color:var(--ink); line-height:1.25}

/* latest-updates lane */
.ls-top{display:flex; align-items:baseline; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:12px}
.ls-sub{font-size:12px; color:var(--muted); font-weight:600}
.live-dot{display:inline-block; width:9px; height:9px; border-radius:50%; background:#DC2626; margin-right:8px;
  box-shadow:0 0 0 0 rgba(220,38,38,.5); animation:livePulse 1.8s infinite}
@keyframes livePulse{0%{box-shadow:0 0 0 0 rgba(220,38,38,.5)}70%{box-shadow:0 0 0 7px rgba(220,38,38,0)}100%{box-shadow:0 0 0 0 rgba(220,38,38,0)}}
.jcard-lane{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}

/* dense panel grid */
.panels{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin:8px 0 24px; align-items:start}
.panel{position:relative; background:var(--surface); border:1px solid var(--line); border-radius:16px; box-shadow:var(--sh-1);
  overflow:hidden; display:flex; flex-direction:column}
.panel:before{content:""; position:absolute; top:0; left:0; right:0; height:3px; background:var(--acc)}
.panel-head{display:flex; align-items:center; gap:9px; padding:13px 16px; border-bottom:1px solid var(--line);
  background:color-mix(in srgb, var(--acc) 8%, var(--surface))}
.panel-ic{display:grid; place-items:center; width:30px; height:30px; border-radius:9px; background:var(--acc); color:#fff; flex:none}
.panel-ic .ic-sm{width:17px; height:17px}
.panel-head h2{font-size:15.5px; font-weight:800; color:var(--ink); margin:0; margin-right:auto; letter-spacing:-.01em}
.panel-all{font-size:12px; font-weight:700; color:color-mix(in srgb, var(--acc), #000 24%)}
.panel-all:hover{text-decoration:underline}
.link-list{list-style:none; margin:0; padding:4px 0; flex:1}
.link-list li{border-bottom:1px dashed var(--line)}
.link-list li:last-child{border-bottom:none}
.link-list a{display:flex; align-items:flex-start; gap:8px; padding:9px 16px; color:var(--ink-2); font-size:13.5px; line-height:1.4; transition:background .12s}
.link-list a:hover{background:color-mix(in srgb, var(--acc) 6%, transparent); text-decoration:none; color:var(--ink)}
.link-list a:before{content:""; flex:none; width:6px; height:6px; margin-top:6px; border-radius:50%; background:var(--acc); opacity:.55}
.ll-title{flex:1; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.panel-cards{flex:1; display:flex; flex-direction:column}
.panel-cards .jcard{border:none; border-radius:0; box-shadow:none; border-bottom:1px solid var(--line)}
.panel-cards .jcard:hover{transform:none; box-shadow:none; background:color-mix(in srgb, var(--acc) 5%, transparent)}
.panel-cards .jcard:last-child{border-bottom:none}
.panel-more{display:block; text-align:center; padding:11px; font-size:12.5px; font-weight:700;
  color:color-mix(in srgb, var(--acc), #000 24%); border-top:1px solid var(--line); background:color-mix(in srgb, var(--acc) 5%, transparent)}
.panel-more:hover{background:color-mix(in srgb, var(--acc) 11%, transparent); text-decoration:none}
.panel-more .ic-sm{width:14px; height:14px; vertical-align:-2px}
/* card meta numbers align like the data tables (tabular) */
.jm,.jm-date,.jcard-meta span{font-variant-numeric:var(--num)}

/* skip-to-content (WCAG bypass-blocks) */
.skip-link{position:absolute; left:-9999px; top:0; z-index:100; background:var(--surface); color:var(--brand-ink);
  padding:10px 16px; border-radius:0 0 10px 0; font-weight:700; box-shadow:var(--sh-2)}
.skip-link:focus{left:0}

@media(max-width:960px){ .qbox-grid{grid-template-columns:repeat(4,1fr)} .panels{grid-template-columns:1fr 1fr} }
@media(max-width:640px){ .jcard-lane{grid-template-columns:1fr} }
@media(max-width:600px){ .qbox-grid{grid-template-columns:repeat(4,1fr); gap:9px} .panels{grid-template-columns:1fr}
  .qbox{padding:13px 6px; border-radius:13px} .qbox-ic{width:40px; height:40px} .qbox b{font-size:11.5px}
  /* denser panels on phones: 1-line title, hide description → ~11-12 cards/screen */
  .panel-cards .jcard-desc{display:none}
  .panel-cards .jcard-sm .jcard-main h3{-webkit-line-clamp:1}
  .panel-cards .jcard-sm{min-height:44px}
  /* the latest lane keeps its 2-line title + description (context helps there) */
  .jcard-lane .jcard-sm .jcard-main h3{-webkit-line-clamp:2}
  .jcard-lane .jcard-sm{min-height:56px}
  /* tap targets ≥44px on mobile */
  .chip{padding:11px 16px}
  .link-list a{padding:12px 16px}
  .icon-btn{width:44px; height:44px}
}
@media(prefers-reduced-motion:reduce){ .live-dot{animation:none} .jcard{transition:none} .qbox{transition:none} }

/* ═══════════════ Browse by Department (low-literacy: literal icon + big label + नया badge) ═══════════════ */
.dept-wrap{margin:22px 0}
.dept-head{font-size:15.5px; font-weight:800; color:var(--ink); margin:0 0 13px; letter-spacing:-.01em}
.dept-grid{display:grid; grid-template-columns:repeat(6,1fr); gap:12px}
.dept-tile{position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; gap:7px;
  padding:16px 8px 13px; min-height:106px; justify-content:center;
  background:var(--surface); border:1.5px solid var(--line); border-radius:16px; box-shadow:var(--sh-1);
  transition:transform .14s, box-shadow .14s, border-color .14s}
.dept-tile:hover{transform:translateY(-2px); box-shadow:var(--sh-2); border-color:var(--navy); text-decoration:none}
.dept-ic{display:grid; place-items:center; width:52px; height:52px; border-radius:15px; background:var(--brand-soft); color:var(--brand-ink)}
.dept-ic .ic{width:30px; height:30px}
.dept-tile b{font-size:13.5px; font-weight:800; color:var(--ink); line-height:1.2}
.dept-count{font-size:11.5px; color:var(--muted); font-weight:600}
.dept-tile.has-new{border-color:var(--brand)}
.dept-tile.has-new .dept-ic{background:color-mix(in srgb, var(--brand) 18%, transparent)}
.dept-new{position:absolute; top:-7px; right:-6px; font-size:10px; font-weight:800; letter-spacing:.03em;
  color:#fff; background:#DC2626; padding:2px 8px; border-radius:999px; text-transform:uppercase;
  box-shadow:0 2px 6px rgba(220,38,38,.4)}
.dept-tile.dept-all .dept-ic{background:color-mix(in srgb, var(--navy) 10%, transparent); color:var(--navy)}
@media(max-width:960px){ .dept-grid{grid-template-columns:repeat(4,1fr)} }
@media(max-width:600px){ .dept-grid{grid-template-columns:repeat(3,1fr); gap:9px}
  .dept-ic{width:46px; height:46px} .dept-ic .ic{width:26px; height:26px}
  .dept-tile{min-height:96px; padding:13px 6px 11px} .dept-tile b{font-size:12.5px} }

/* voice-search mic inside the hero search field */
.hero-search .field{display:flex; align-items:center}
.mic-btn{position:absolute; right:8px; top:50%; transform:translateY(-50%); display:grid; place-items:center;
  width:40px; height:40px; border-radius:11px; border:none; background:var(--brand-soft); color:var(--brand-ink);
  cursor:pointer; transition:.15s}
.mic-btn:hover{background:var(--brand); color:#fff}
.mic-btn .ic{width:22px; height:22px}
.hero-search input{padding-right:52px}
.mic-btn.listening{background:#DC2626; color:#fff; animation:micPulse 1.1s infinite}
@keyframes micPulse{0%{box-shadow:0 0 0 0 rgba(220,38,38,.5)}70%{box-shadow:0 0 0 9px rgba(220,38,38,0)}100%{box-shadow:0 0 0 0 rgba(220,38,38,0)}}
@media(prefers-reduced-motion:reduce){ .mic-btn.listening{animation:none} }

/* ═══════════════ Popular Organisations row (clean monograms, institutional — NO logos) ═══════════════ */
.org-wrap{margin:20px 0}
.org-row{display:flex; flex-wrap:wrap; gap:10px}
.org-chip{display:inline-flex; align-items:center; gap:9px; padding:7px 14px 7px 7px;
  background:var(--surface); border:1px solid var(--line); border-radius:999px; box-shadow:var(--sh-1);
  transition:transform .14s, box-shadow .14s, border-color .14s}
.org-chip:hover{transform:translateY(-1px); box-shadow:var(--sh-2); border-color:var(--navy); text-decoration:none}
.org-mono{display:grid; place-items:center; min-width:34px; height:34px; padding:0 7px; border-radius:9px;
  background:var(--navy); color:#fff; font-size:11.5px; font-weight:800; letter-spacing:.02em}
.org-chip b{font-size:13.5px; font-weight:700; color:var(--ink)}
@media(max-width:600px){ .org-chip{padding:6px 12px 6px 6px} .org-chip b{font-size:12.5px} .org-mono{min-width:30px; height:30px; font-size:11px} }

/* ---- Hub stat strip (honest: N open recruitments · M total posts · Updated) ---- */
.hub-stat{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:2px 0 12px;
  font-size:14px; color:var(--ink-2)}
.hub-stat-n{font-weight:800; color:var(--navy); font-variant-numeric:var(--num)}
.hub-stat-sep{color:var(--faint)}
:lang(hi) .hub-stat{font-size:15px}

/* ---- Section heading above card lists (fixes broken H1→H3 outline) ---- */
.section-h{font-size:var(--fs-md); font-weight:800; color:var(--navy); margin:18px 0 12px; letter-spacing:-.01em}
:lang(hi) .section-h{font-size:22px}

/* ---- Widget titles (demoted from <h3> so they don't pollute the article outline) ---- */
.widget-title{font-size:15px; font-weight:700; color:var(--ink); margin:0 0 10px; display:flex; align-items:center; gap:7px}
.widget-title .ic{width:18px; height:18px; flex:none}

/* ---- Share bar: WhatsApp / Telegram / Copy-link / native Web Share ---- */
.share-bar{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:14px 0 4px; padding:12px;
  background:var(--brand-soft); border:1px solid var(--line-2); border-radius:var(--r-sm)}
.share-lbl{display:flex; align-items:center; gap:6px; font-weight:700; font-size:14px; color:var(--navy); margin-right:2px}
.share-lbl .ic{width:18px; height:18px; flex:none}
.share-bar .sh{display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:44px; padding:0 15px;
  border-radius:var(--pill); font-size:14px; font-weight:700; text-decoration:none; border:0; cursor:pointer; color:#fff}
.share-bar .sh .ic{width:18px; height:18px; flex:none}
.share-bar .sh-wa{background:var(--green)}
.share-bar .sh-tg{background:#2AABEE}
.share-bar .sh-copy{background:var(--navy)}
.share-bar .sh-native{background:var(--brand)}
.share-bar .sh:hover{filter:brightness(1.05)}
.share-bar .sh:active{transform:translateY(1px)}
@media(max-width:520px){
  .share-bar{gap:7px; padding:10px}
  .share-lbl{flex-basis:100%; margin-bottom:2px}
  .share-bar .sh{flex:1 1 30%; padding:0 8px}
}
