:root{
  --navy:#0B3D91; --navy-deep:#082B66; --navy-ink:#0A1F44;
  --saffron:#E8720C; --green:#0E7A3D; --gold:#C9A227;
  --bg:#F2F5FA; --card:#FFFFFF; --line:#D9E1EE;
  --text:#1B2A44; --muted:#5A6B87; --cream:#FFF8E9;
  --fs:16px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Mukta',-apple-system,'Segoe UI',sans-serif;font-size:var(--fs);color:var(--text);background:var(--bg);line-height:1.6}
img{max-width:100%}
a{color:var(--navy);text-decoration:none}
a:focus-visible,button:focus-visible{outline:3px solid var(--saffron);outline-offset:2px}
.container{max-width:1200px;margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-999px;top:0;background:var(--navy-ink);color:#fff;padding:8px 16px;z-index:2000}
.skip:focus{left:8px}

/* tricolor strip — signature */
.tricolor{display:flex;height:5px}
.tricolor span{flex:1}
.tricolor .s1{background:#FF9933}.tricolor .s2{background:#fff}.tricolor .s3{background:#138808}

/* top utility bar */
.utilbar{background:var(--navy-ink);color:#CBD8F0;font-size:13.5px}
.utilbar .container{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;min-height:36px;gap:8px}
.utilbar a{color:#CBD8F0;padding:4px 6px}
.utilbar a:hover{color:#fff}
.util-left,.util-right{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.util-right .divider{opacity:.35;padding:0 2px}
.fontbtn,.langbtn,.contrastbtn{background:transparent;border:1px solid #3A4E78;color:#CBD8F0;border-radius:4px;padding:2px 8px;cursor:pointer;font-family:inherit;font-size:13px}
.fontbtn:hover,.langbtn:hover,.contrastbtn:hover{background:#1A335F;color:#fff}
.langbtn{font-weight:700;border-color:var(--saffron);color:#FFC58A}

/* header */
header.masthead{background:linear-gradient(180deg,#0D47A8 0%,var(--navy) 100%);color:#fff;padding:14px 0}
.masthead .container{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.emblem{width:58px;height:74px;flex:none}
.brand h1{font-size:24px;font-weight:800;line-height:1.2;letter-spacing:.2px}
.brand .hi-line{font-size:15px;font-weight:600;color:#FFD9A8}
.brand .region{font-size:15px;font-weight:600;color:#BBD0F5}
.mast-actions{margin-left:auto;display:flex;gap:10px;align-items:center}
.btn{display:inline-block;border-radius:6px;padding:9px 18px;font-weight:700;font-size:14.5px;border:none;cursor:pointer;font-family:inherit}
.btn-outline{border:1.5px solid #9FB9E8;color:#fff;background:rgba(255,255,255,.06)}
.btn-outline:hover{background:rgba(255,255,255,.14)}
.btn-primary{background:var(--saffron);color:#fff}
.btn-primary:hover{background:#CF6408}
.btn-green{background:var(--green);color:#fff}
.btn-green:hover{background:#0B6331}

/* nav */
nav.mainnav{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:900;box-shadow:0 1px 6px rgba(10,31,68,.07)}
.mainnav ul{list-style:none;display:flex;flex-wrap:wrap}
.mainnav > .container > ul > li{position:relative}
.mainnav a.top{display:block;padding:14px 16px;font-weight:600;color:var(--navy-ink);font-size:15px;border-bottom:3px solid transparent}
.mainnav a.top:hover,.mainnav a.top.active{color:var(--navy);border-bottom-color:var(--saffron)}
.dropdown{position:absolute;top:100%;left:0;background:#fff;min-width:250px;border:1px solid var(--line);border-top:3px solid var(--saffron);box-shadow:0 10px 24px rgba(10,31,68,.14);display:none;z-index:950}
li:hover > .dropdown, li:focus-within > .dropdown{display:block}
.dropdown a{display:block;padding:10px 16px;font-size:14.5px;color:var(--text);border-bottom:1px solid #EEF2F9}
.dropdown a:hover{background:var(--cream);color:var(--navy)}
.navtoggle{display:none;background:none;border:none;font-size:26px;color:var(--navy);cursor:pointer;padding:8px 16px}

/* ticker */
.ticker{background:var(--cream);border-bottom:1px solid #F0E2C0;display:flex;align-items:stretch;overflow:hidden}
.ticker .label{background:var(--saffron);color:#fff;font-weight:700;padding:8px 16px;white-space:nowrap;display:flex;align-items:center;gap:6px;font-size:14px}
.ticker .track{flex:1;overflow:hidden;display:flex;align-items:center}
.ticker .items{display:inline-block;white-space:nowrap;animation:scroll 38s linear infinite;padding-left:100%}
.ticker:hover .items{animation-play-state:paused}
.ticker .items a{margin-right:56px;font-size:14.5px;color:#7A4A00;font-weight:500}
.ticker .items a b{color:#B23A00}
@keyframes scroll{to{transform:translateX(-100%)}}

/* hero */
.hero{position:relative;color:#fff;overflow:hidden;background:var(--navy-deep)}
.slide{display:none;min-height:380px;align-items:center;background:linear-gradient(100deg,#082B66 0%,#0D47A8 55%,#1560D0 100%)}
.slide.active{display:flex}
.slide .container{display:grid;grid-template-columns:1.15fr .85fr;gap:32px;align-items:center;padding-top:36px;padding-bottom:36px}
.slide h2{font-size:34px;font-weight:800;line-height:1.25;margin-bottom:10px}
.slide h2 .accent{color:#FFC073}
.slide p{font-size:17px;color:#C9DAF7;margin-bottom:22px;max-width:52ch}
.hero-art{display:flex;justify-content:center}
.hero-dots{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);display:flex;gap:8px}
.hero-dots button{width:11px;height:11px;border-radius:50%;border:none;background:rgba(255,255,255,.4);cursor:pointer}
.hero-dots button.on{background:var(--saffron)}

/* quick services */
.quick{margin-top:-34px;position:relative;z-index:10}
.quick-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.qcard{background:var(--card);border:1px solid var(--line);border-top:4px solid var(--navy);border-radius:10px;padding:16px 12px;text-align:center;box-shadow:0 6px 18px rgba(10,31,68,.08);transition:transform .15s,box-shadow .15s;display:block}
.qcard:hover{transform:translateY(-4px);box-shadow:0 12px 26px rgba(10,31,68,.15);border-top-color:var(--saffron)}
.qcard .qicon{width:46px;height:46px;margin:0 auto 8px;border-radius:50%;background:#E9F0FC;display:flex;align-items:center;justify-content:center;font-size:22px}
.qcard .qt{font-weight:700;font-size:14px;color:var(--navy-ink);line-height:1.35}
.qcard .qs{font-size:12px;color:var(--muted)}

/* sections */
section{padding:38px 0}
.sec-head{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.sec-head h3{font-size:23px;font-weight:800;color:var(--navy-ink)}
.sec-head .bar{width:46px;height:5px;border-radius:3px;background:linear-gradient(90deg,var(--saffron),var(--green))}
.grid-3{display:grid;grid-template-columns:1.1fr 1.1fr .9fr;gap:18px}
.panel{background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:hidden;display:flex;flex-direction:column}
.panel .phead{background:var(--navy);color:#fff;font-weight:700;padding:12px 16px;font-size:16.5px;display:flex;justify-content:space-between;align-items:center}
.panel .phead a{color:#FFD9A8;font-size:13px;font-weight:600}
.plist{list-style:none;max-height:330px;overflow-y:auto}
.plist li{padding:12px 16px;border-bottom:1px solid #EEF2F9;display:flex;gap:12px;align-items:flex-start}
.plist li:hover{background:var(--cream)}
.datebadge{flex:none;background:#E9F0FC;color:var(--navy);border-radius:6px;font-size:11.5px;font-weight:800;text-align:center;padding:4px 8px;line-height:1.25;min-width:52px}
.datebadge b{display:block;font-size:15px}
.plist .new{display:inline-block;background:#D62828;color:#fff;font-size:10px;font-weight:800;border-radius:3px;padding:0 5px;margin-left:6px;vertical-align:2px;animation:blink 1.2s infinite}
@keyframes blink{50%{opacity:.35}}
.plist a{font-size:14.5px;font-weight:500;color:var(--text);line-height:1.45}
.plist a:hover{color:var(--navy)}

/* officer card */
.officer{background:linear-gradient(180deg,#fff,#F6F9FF);text-align:center;padding:22px 18px}
.officer .photo{width:110px;height:110px;border-radius:50%;margin:0 auto 12px;background:linear-gradient(135deg,#0D47A8,#1560D0);display:flex;align-items:center;justify-content:center;color:#fff;font-size:40px;font-weight:800;border:4px solid var(--gold)}
.officer h4{font-size:18px;color:var(--navy-ink)}
.officer .desig{color:var(--saffron);font-weight:700;font-size:14px;margin-bottom:8px}
.officer p{font-size:13.5px;color:var(--muted);margin-bottom:14px}

/* stats */
.stats{background:linear-gradient(100deg,var(--navy-deep),#0D47A8);color:#fff}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;text-align:center}
.stat .num{font-size:38px;font-weight:800;color:#FFC073}
.stat .lbl{font-size:14.5px;color:#C9DAF7;font-weight:600}

/* jurisdiction */
.juris-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.jcard{background:var(--card);border:1px solid var(--line);border-left:6px solid var(--saffron);border-radius:10px;padding:20px}
.jcard.jh{border-left-color:var(--green)}
.jcard h4{font-size:19px;color:var(--navy-ink);margin-bottom:6px}
.jcard .tag{display:inline-block;background:var(--cream);color:#7A4A00;font-size:12px;font-weight:700;border-radius:4px;padding:2px 8px;margin-bottom:8px}
.jcard p{font-size:14.5px;color:var(--muted);margin-bottom:10px}
.jcard ul{list-style:none;font-size:14px}
.jcard ul li{padding:4px 0;border-bottom:1px dashed #E4EAF5}
.jcard ul li::before{content:"▸ ";color:var(--saffron);font-weight:800}

/* gallery */
.gal-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.gitem{border-radius:10px;overflow:hidden;position:relative;aspect-ratio:4/3;display:flex;align-items:flex-end;color:#fff;font-weight:700;font-size:14px;padding:12px;background:linear-gradient(135deg,#0D47A8,#082B66)}
.gitem::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(8,25,55,.85))}
.gitem span{position:relative;z-index:2}
.gitem svg{position:absolute;inset:0;width:100%;height:100%}

/* footer */
footer{background:var(--navy-ink);color:#B9C7E2;margin-top:20px}
.foot-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;padding:36px 0 24px}
.foot-grid h5{color:#fff;font-size:16px;margin-bottom:12px;border-bottom:2px solid var(--saffron);display:inline-block;padding-bottom:4px}
.foot-grid ul{list-style:none}
.foot-grid li{padding:4px 0}
.foot-grid a{color:#B9C7E2;font-size:14px}
.foot-grid a:hover{color:#FFC073}
.social{display:flex;gap:10px;margin:10px 0 14px}
.social a{width:38px;height:38px;border-radius:50%;background:#16305C;display:flex;align-items:center;justify-content:center;font-weight:800;color:#fff;font-size:15px}
.social a:hover{background:var(--saffron)}
.newsbox{display:flex;border-radius:6px;overflow:hidden;border:1px solid #2A4472}
.newsbox input{flex:1;border:none;background:#10264D;color:#fff;padding:9px 12px;font-family:inherit;font-size:13.5px}
.newsbox button{background:var(--saffron);color:#fff;border:none;padding:0 14px;font-weight:700;cursor:pointer;font-family:inherit}
.foot-bottom{border-top:1px solid #22406F;padding:14px 0;font-size:13px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
.foot-bottom a{color:#B9C7E2;margin-left:14px}
.visitor{font-size:12.5px;color:#7E93BC}

#backtop{position:fixed;right:22px;bottom:96px;width:44px;height:44px;border-radius:50%;background:var(--saffron);color:#fff;border:none;font-size:20px;cursor:pointer;display:none;z-index:1200;box-shadow:0 6px 16px rgba(0,0,0,.3)}

/* high contrast */
body.contrast{--bg:#000;--card:#0A0A0A;--line:#444;--text:#FFEE32;--muted:#FFD65C;--navy:#FFEE32;--navy-ink:#000;--cream:#111}
body.contrast header.masthead,body.contrast .stats,body.contrast .slide{background:#000;border-bottom:2px solid #FFEE32}
body.contrast nav.mainnav,body.contrast .panel,body.contrast .qcard,body.contrast .jcard{background:#0A0A0A;color:#FFEE32}
body.contrast .phead{background:#000;border-bottom:2px solid #FFEE32}
body.contrast a,body.contrast .qcard .qt,body.contrast .plist a,body.contrast .sec-head h3{color:#FFEE32}

@media (prefers-reduced-motion:reduce){.ticker .items{animation:none}.plist .new{animation:none}}
@media (max-width:980px){
  .quick-grid{grid-template-columns:repeat(3,1fr)}
  .grid-3{grid-template-columns:1fr}
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .slide .container{grid-template-columns:1fr}
  .hero-art{display:none}
  .gal-grid{grid-template-columns:repeat(2,1fr)}
  .foot-grid{grid-template-columns:repeat(2,1fr)}
  .juris-grid{grid-template-columns:1fr}
}
@media (max-width:760px){
  .navtoggle{display:block}
  .mainnav > .container > ul{display:none;flex-direction:column;width:100%}
  .mainnav > .container > ul.open{display:flex}
  .dropdown{position:static;display:none;box-shadow:none}
  li.open > .dropdown{display:block}
  .quick-grid{grid-template-columns:repeat(2,1fr)}
  .brand h1{font-size:19px}
  .slide h2{font-size:26px}
}