/* V14-1 · ต่อยอดจาก V14 ด้วยเอกลักษณ์ของตัวเอง: น้ำเงินคราม–ส้มอำพัน, IBM Plex Sans Thai + Prompt (ส่วนที่ต่างอยู่ท้ายไฟล์) */
:root {
  --g-950:#0b3a26; --g-900:#125037; --g-800:#17643f; --g-700:#1c7449; --g-600:#258a58; --g-500:#3ea673; --g-400:#7fc7a0;
  --g-300:#a6dabd; --g-200:#c6e8d5; --g-100:#d9f0e2; --g-75:#e6f5ec; --g-50:#f0f9f4; --g-25:#f7fcf9; --g-ink:#08281b;
  --n-0:#fff; --n-50:#fafafa; --n-100:#f5f5f5; --n-200:#eee; --n-300:#e0e0e0; --n-400:#bdbdbd; --n-500:#9e9e9e; --n-600:#6b6b6b; --n-700:#616161; --n-800:#424242; --n-900:#212121;
  --gold:#e8b23a; --gold-deep:#b7861c; --gold-50:#fbf3dc; --gold-ink:#7c5e10;
  --cream:#ffffff; --line:var(--n-200); --ink:var(--n-900); --ink-2:var(--n-700); --ink-3:var(--n-600);
  --serif:"Bai Jamjuree", "Noto Sans Thai", system-ui, sans-serif; --sans:"Anuphan", "Noto Sans Thai", system-ui, sans-serif;
  --r:12px; --shadow:0 18px 40px -22px rgba(var(--g-rgb,11,58,38),.45); --wrap:1280px;
}
html[data-font="2"] { font-size:112.5%; } html[data-font="3"] { font-size:125%; }
*,*::before,*::after { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:90px; }
body { margin:0; overflow-x:clip; font-family:var(--sans); font-size:1rem; line-height:1.65; color:var(--ink); background:var(--cream); -webkit-font-smoothing:antialiased; }
img { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; }
button,input,select { font:inherit; color:inherit; }
button { cursor:pointer; }
h1,h2,h3,h4 { margin:0; line-height:1.3; }
p { margin:0; }
ul,ol { margin:0; padding:0; list-style:none; }
:focus-visible { outline:3px solid var(--gold); outline-offset:2px; border-radius:4px; }
.container { width:100%; max-width:var(--wrap); margin:0 auto; padding:0 1.25rem; }
@media (min-width:1024px) { .container { padding:0 2.5rem; } }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; left:1rem; top:-4rem; z-index:99; background:var(--gold); color:var(--g-950); padding:.6rem 1rem; border-radius:8px; font-weight:700; transition:top .2s; }
.skip-link:focus { top:1rem; }
.muted { color:var(--ink-3); font-size:.875rem; }
.data-notice { margin-top:1rem; padding:.75rem 1rem; background:var(--gold-50); border:1px solid var(--gold-deep); border-radius:8px; }
.sample-tag { display:inline-block; vertical-align:middle; font:600 .7rem/1 var(--sans); letter-spacing:0; padding:.3rem .55rem; border-radius:99px; background:var(--gold-50); color:var(--gold-ink); border:1px dashed var(--gold-deep); }

/* ---------- ปุ่ม ชิป หัวข้อ ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; min-height:44px; padding:.6rem 1.15rem; border-radius:8px; border:1.5px solid transparent; font-weight:700; font-size:.9rem; line-height:1.2; transition:background .2s,color .2s,border-color .2s,transform .2s; }
.btn:hover { transform:translateY(-1px); }
.btn.sm { min-height:36px; padding:.4rem .85rem; font-size:.82rem; }
.btn.block { display:flex; width:100%; }
.btn.pill { border-radius:99px; }
.btn-green { background:var(--g-900); color:#fff; } .btn-green:hover { background:var(--g-950); }
.btn-gold { background:var(--gold); color:var(--g-950); } .btn-gold:hover { background:var(--gold-300,#f2c75c); }
.btn-outline { border-color:var(--g-900); color:var(--g-900); background:transparent; } .btn-outline:hover { background:var(--g-900); color:#fff; }
.btn-line { border-color:rgba(255,255,255,.55); color:#fff; } .btn-line:hover { background:rgba(255,255,255,.12); }
.btn-ghost { background:#fff; border-color:var(--line); color:var(--g-900); } .btn-ghost:hover { border-color:var(--g-800); }
.btn-row { display:flex; flex-wrap:wrap; gap:.75rem; }
.eyebrow { display:flex; align-items:center; gap:.75rem; font-size:.72rem; font-weight:700; letter-spacing:.28em; color:var(--g-800); text-transform:uppercase; }
.eyebrow::before { content:""; width:28px; height:2px; background:var(--gold-deep); flex:none; }
.eyebrow.light, .eyebrow.gold { color:var(--gold); } .eyebrow.light::before, .eyebrow.gold::before { background:var(--gold); }
.h-serif { font-family:var(--serif); font-weight:800; color:var(--g-950); font-size:clamp(1.5rem,2.4vw,1.9rem); }
.h-serif.xl { font-size:clamp(1.9rem,3.4vw,2.6rem); margin-top:.35rem; }
.lead-sm { color:var(--ink-2); font-size:.92rem; margin-top:.6rem; max-width:44rem; }
.link-under { display:inline-flex; align-items:center; gap:.4rem; font-weight:700; font-size:.88rem; color:var(--g-900); border-bottom:2px solid var(--gold-deep); padding-bottom:2px; }
.link-under i { font-size:.75rem; transition:transform .2s; } .link-under:hover i { transform:translateX(3px); }
.chip-gold { display:inline-flex; align-items:center; gap:.35rem; background:var(--gold); color:var(--g-950); font-weight:700; font-size:.78rem; padding:.25rem .65rem; border-radius:99px; white-space:nowrap; }
.chip-gold.sm { font-size:.7rem; padding:.2rem .55rem; }
.chip-green { display:inline-block; background:var(--g-950); color:#fff; font-size:.72rem; font-weight:700; padding:.2rem .6rem; border-radius:6px; }
.chip-mini { display:block; font-style:normal; font-size:.72rem; font-weight:700; color:var(--g-800); }
.chip-outline { display:inline-flex; align-items:center; gap:.4rem; border:1.5px solid var(--gold-deep); border-radius:99px; padding:.3rem .8rem; font-size:.8rem; font-weight:700; color:var(--g-900); background:#fff; }
.section { padding:4.5rem 0; }
.sec-head { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:2rem; }
.sec-head.line { border-bottom:1px solid var(--n-300); padding-bottom:.9rem; margin-bottom:1.25rem; }
.sec-actions { display:flex; align-items:center; gap:1rem; flex-wrap:wrap; }
.reveal { opacity:0; transform:translateY(14px); transition:opacity .6s ease,transform .6s ease; }
.reveal.in { opacity:1; transform:none; }

/* ---------- ส่วนหัว ---------- */
.scroll-progress { position:fixed; inset:0 0 auto; height:3px; z-index:60; pointer-events:none; }
.scroll-progress i { display:block; height:100%; width:0; background:linear-gradient(90deg,var(--gold-deep),var(--gold)); }
.site-header { position:sticky; top:0; z-index:40; transition:top .3s; }
.topbar { background:var(--g-950); color:#fff; }
.topbar-in { display:flex; justify-content:flex-end; align-items:center; gap:.6rem; height:56px; }
.a11y { display:flex; border:1px solid rgba(255,255,255,.2); border-radius:99px; overflow:hidden; }
.a11y button { background:none; border:0; padding:.3rem .75rem; font-size:.82rem; color:#fff; min-width:2.4rem; }
.a11y button[aria-pressed="true"] { background:var(--gold); color:var(--g-950); font-weight:800; border-radius:99px; }
.tb-btn, .lang { display:inline-flex; align-items:center; gap:.4rem; border:1px solid rgba(255,255,255,.2); background:none; color:#fff; font-size:.82rem; padding:.35rem .8rem; border-radius:99px; }
.tb-btn[aria-pressed="true"] { background:#fff; color:var(--g-950); }
.lang i { color:var(--gold); } .lang select { background:transparent; border:0; color:#fff; font-size:.82rem; } .lang option { color:var(--ink); }
.tb-staff { display:inline-flex; gap:.4rem; align-items:center; border:1.5px solid var(--gold); color:var(--gold); padding:.35rem .9rem; border-radius:99px; font-size:.82rem; font-weight:700; }
.tb-staff:hover { background:var(--gold); color:var(--g-950); }
.mainbar { background:rgba(255,255,255,.97); backdrop-filter:blur(8px); border-bottom:2px solid var(--gold-deep); transition:box-shadow .3s; }
.mainbar-in { display:flex; align-items:center; gap:1.25rem; height:88px; transition:height .3s; }
.site-header.compact { top:-56px; }
.site-header.compact .mainbar-in { height:66px; }
.site-header.compact .mainbar { box-shadow:0 10px 30px -18px rgba(var(--g-rgb,11,58,38),.4); }
.brand { display:flex; align-items:center; gap:.85rem; min-width:0; margin-right:auto; }
.brand-seal { flex:none; width:56px; height:56px; border-radius:50%; padding:3px; background:conic-gradient(var(--gold),var(--gold-deep),var(--gold)); box-shadow:0 4px 12px -6px rgba(0,0,0,.4); transition:width .3s,height .3s; }
.brand-seal img { width:100%; height:100%; border-radius:50%; object-fit:contain; background:#fff; }
.site-header.compact .brand-seal { width:44px; height:44px; }
.brand-txt { display:flex; flex-direction:column; min-width:0; }
.brand-txt strong { font-family:var(--serif); font-weight:800; font-size:1.3rem; color:var(--g-900); line-height:1.25; }
.brand-txt small { font-size:.62rem; letter-spacing:.22em; color:var(--g-800); font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.main-nav > ul { display:flex; gap:.15rem; }
.has-mega { position:relative; display:flex; align-items:center; }
.nav-top { padding:.5rem .35rem .5rem .7rem; font-weight:700; font-size:.94rem; color:var(--n-800); border-radius:8px; }
.nav-top:hover { color:var(--g-900); }
.mega-btn { background:none; border:0; width:22px; height:32px; color:var(--n-600); font-size:.62rem; padding:0; }
.mega { position:absolute; top:calc(100% + 14px); left:50%; transform:translate(-50%,8px); width:min(560px,90vw); background:rgba(255,255,255,.98); border:1px solid var(--line); border-top:3px solid var(--gold-deep); border-radius:14px; box-shadow:0 30px 60px -28px rgba(var(--g-rgb,11,58,38),.45); padding:1.1rem 1.25rem 1.25rem; opacity:0; visibility:hidden; transition:.2s; }
.mega::before { content:""; position:absolute; left:0; right:0; top:-18px; height:18px; }
.has-mega:hover .mega, .has-mega.open .mega, .has-mega:focus-within .mega { opacity:1; visibility:visible; transform:translate(-50%,0); }
.has-mega:hover .mega-btn i, .has-mega.open .mega-btn i { transform:rotate(180deg); }
.mega-btn i { transition:transform .2s; }
.mega-head { display:flex; align-items:center; gap:.8rem; }
.mega-ic { width:42px; height:42px; border-radius:10px; background:var(--g-900); color:var(--gold); display:grid; place-items:center; }
.mega-head small { display:block; font-size:.72rem; color:var(--ink-3); }
.mega-head strong { font-family:var(--serif); font-size:1.35rem; color:var(--g-950); }
.mega-home { margin-left:auto; font-size:.8rem; font-weight:700; color:var(--g-900); border:1.5px solid var(--g-900); border-radius:8px; padding:.35rem .7rem; display:inline-flex; gap:.4rem; align-items:center; }
.mega-desc { font-size:.8rem; color:var(--ink-3); margin:.6rem 0 .8rem; padding-bottom:.8rem; border-bottom:1px solid var(--line); }
.mega-links { display:grid; grid-template-columns:1fr 1fr; gap:.15rem 1.25rem; }
.mega-links a { display:block; padding:.5rem .6rem; border-radius:8px; font-size:.88rem; font-weight:600; color:var(--n-800); }
.mega-links a:hover { background:var(--g-50); color:var(--g-900); }
.round-btn { flex:none; width:42px; height:42px; border-radius:50%; border:1.5px solid var(--n-300); background:#fff; color:var(--g-900); display:grid; place-items:center; }
.round-btn:hover { border-color:var(--g-800); background:var(--g-50); }
.menu-toggle, .nav-close { display:none; } .menu-toggle span { display:none; }

.alert-strip { background:#fff; border-bottom:1px solid var(--line); }
.alert-strip summary { display:flex; align-items:center; gap:.85rem; min-height:52px; cursor:pointer; list-style:none; font-size:.9rem; font-weight:700; color:var(--g-950); }
.alert-strip summary::-webkit-details-marker { display:none; }
.alert-title { flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.alert-strip .chev { color:var(--ink-3); font-size:.75rem; transition:transform .2s; }
.alert-strip details[open] .chev { transform:rotate(180deg); }
.alert-body { padding:0 0 1rem; color:var(--ink-2); font-size:.9rem; display:grid; gap:.5rem; }
.text-link { color:var(--g-900); font-weight:700; }

/* ---------- Hero ---------- */
.hero { position:relative; overflow:hidden; background:var(--cream); padding:3.25rem 0 0; }
.hero-bg { position:absolute; inset:0; background:var(--hero-img) center/cover; opacity:.12; pointer-events:none; }
.hero-bg::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,var(--cream) 30%,rgba(251,250,245,.6) 60%,var(--cream)); }
.hero-side { position:absolute; left:0; top:0; bottom:0; width:2.5rem; display:none; align-items:center; justify-content:center; writing-mode:vertical-rl; transform:rotate(180deg); font-size:.62rem; letter-spacing:.3em; font-weight:700; color:var(--g-800); border-right:1px solid var(--g-100); }
@media (min-width:1280px) { .hero-side { display:flex; } }
.hero-grid { position:relative; display:grid; gap:2.5rem; align-items:center; grid-template-columns:1fr; }
.hero-copy .eyebrow { letter-spacing:.2em; font-size:.68rem; }
.hero-title { font-family:var(--serif); font-weight:800; color:var(--g-900); font-size:clamp(3.2rem,8.2vw,6.2rem); line-height:1.12; margin:1rem 0 .4rem; text-shadow:0 2px 0 rgba(255,255,255,.6); }
.hero-rule { display:block; width:min(100%,25rem); height:7px; border-radius:4px; background:linear-gradient(90deg,var(--gold-deep),var(--gold) 60%,var(--gold-deep)); box-shadow:inset 0 -2px 0 rgba(124,94,16,.25); }
.hero-tag { margin-top:1.1rem; font-size:.75rem; letter-spacing:.3em; font-weight:800; color:var(--g-900); }
.hero-quote { margin:1.1rem 0 0; padding:.7rem 1rem; border-left:3px solid var(--gold); background:rgba(255,248,219,.5); font-size:.85rem; color:var(--ink-3); max-width:36rem; }
.hero-lead { margin-top:1.4rem; font-size:1.15rem; color:var(--ink-2); max-width:30rem; }
.hero-btns { display:flex; flex-direction:column; align-items:flex-start; gap:.85rem; margin-top:1.75rem; }
.hero-media { position:relative; }
.hero-stage { position:relative; aspect-ratio:16/11; border-radius:18px; overflow:visible; }
.hero-stage .act-slide { border-radius:18px; overflow:hidden; box-shadow:0 30px 60px -30px rgba(0,0,0,.45); background:var(--g-50); }
.hero-wave { display:block; width:72%; height:14px; margin:1.4rem auto 0; background:radial-gradient(ellipse at 50% 0,var(--gold-deep) 0 1px,transparent 2px) 0 0/22px 14px; opacity:.5; }
.car-ctl.float { position:absolute; left:50%; bottom:-.5rem; transform:translate(-50%,50%); background:rgba(var(--g-rgb,11,58,38),.92); color:#fff; padding:.35rem .5rem .35rem .4rem; border-radius:99px; z-index:3; box-shadow:0 10px 24px -12px rgba(0,0,0,.5); }
.hero-strip { position:relative; display:grid; grid-template-columns:1fr; margin-top:3.25rem; background:#fff; border-top:2px solid var(--gold-deep); box-shadow:0 -1px 0 rgba(0,0,0,.02); }
.hs-brand { background:var(--g-950); color:#fff; padding:1rem 1.25rem; }
.hs-brand small { display:block; color:var(--gold); font-size:.72rem; font-weight:700; }
.hs-brand strong { font-family:var(--serif); font-size:1.5rem; }
.hs-brand strong span { color:var(--gold); }
.hs-cell { display:flex; align-items:center; gap:.9rem; padding:1rem 1.25rem; border-left:1px solid var(--line); }
.hs-cell i { width:42px; height:42px; display:grid; place-items:center; border-radius:50%; border:1.5px solid var(--n-300); color:var(--g-900); flex:none; }
.hs-cell small { display:block; font-size:.72rem; color:var(--ink-3); }
.hs-cell b { font-size:.9rem; color:var(--g-950); word-break:break-all; }
.hs-cell:hover b { color:var(--g-700); }
@media (min-width:768px) { .hero-strip { grid-template-columns:1.25fr 1fr 1fr 1fr; } }
@media (min-width:1024px) { .hero-grid { grid-template-columns:.95fr 1.25fr; gap:3rem; } .hero-btns { margin-bottom:.5rem; } }

/* ---------- สไลด์ใช้ร่วมกัน ---------- */
.act-slide { position:absolute; inset:0; margin:0; opacity:0; visibility:hidden; transition:opacity .7s ease,visibility .7s; }
.act-slide.on { opacity:1; visibility:visible; }
.act-bg { position:absolute; inset:-20px; background:center/cover; filter:blur(18px) saturate(1.1); opacity:.55; }
.act-slide > img, .slide-link > img { position:relative; width:100%; height:100%; object-fit:contain; }
.slide-link { position:absolute; inset:0; }
.car-nav { position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:44px; height:44px; border-radius:50%; border:1px solid var(--line); background:#fff; color:var(--g-900); box-shadow:0 8px 18px -10px rgba(0,0,0,.4); }
.car-nav.prev { left:-22px; } .car-nav.next { right:-22px; }
.car-nav:hover { background:var(--g-900); color:#fff; }
.car-ctl { display:flex; align-items:center; gap:.85rem; font-size:.78rem; }
.pill-btn { border:1.5px solid currentColor; background:transparent; border-radius:99px; padding:.15rem .75rem; font-size:.75rem; font-weight:700; }
.dots { display:inline-flex; gap:.4rem; align-items:center; }
.dots i { width:7px; height:7px; border-radius:99px; background:currentColor; opacity:.4; transition:width .3s,opacity .3s,background .3s; }
.dots i.on { width:22px; opacity:1; background:var(--gold); }
.count b { font-weight:800; }

/* ---------- ผู้บริหาร ---------- */
.leader { position:relative; overflow:hidden; color:#fff; background:linear-gradient(110deg,var(--g-950) 0%,#164d1b 45%,var(--g-900) 100%); border-top:4px solid var(--gold); padding:3.5rem 0; }
.leader::before { content:""; position:absolute; inset:0; background:radial-gradient(rgba(255,255,255,.05) 1px,transparent 1px) 0 0/18px 18px, repeating-linear-gradient(115deg,transparent 0 60px,rgba(var(--gold-rgb,232,178,58),.04) 60px 61px); pointer-events:none; }
.leader-grid { position:relative; display:grid; gap:2.5rem; align-items:center; }
.leader-quote { font-size:clamp(1.7rem,3vw,2.35rem); font-weight:800; line-height:1.45; margin-top:1.4rem; }
.leader-quote span { display:block; } .leader-quote .gold { color:var(--gold); padding-left:1.5rem; }
.leader-tag { margin-top:1.5rem; padding-top:1.25rem; border-top:1px solid rgba(var(--gold-rgb,232,178,58),.25); color:var(--gold); font-size:.72rem; letter-spacing:.28em; font-weight:800; display:flex; align-items:center; gap:.75rem; }
.leader-tag::before { content:""; width:28px; height:2px; background:var(--gold); }
.leader-sub { margin-top:.5rem; font-size:.72rem; letter-spacing:.14em; color:rgba(255,255,255,.75); font-weight:700; }
.leader .btn-row { margin-top:1.75rem; }
.leader-photo { position:relative; margin:0 auto; width:min(100%,260px); }
.lp-frame { background:#fff; padding:6px; border-radius:16px; border:2px solid var(--gold-deep); box-shadow:0 30px 60px -25px rgba(0,0,0,.6); aspect-ratio:4/5; overflow:hidden; }
.lp-frame img { width:100%; height:100%; object-fit:cover; object-position:top; border-radius:12px; background:var(--g-50); }
.leader-photo figcaption { position:absolute; left:-1.5rem; right:1rem; bottom:-1.5rem; display:flex; gap:.7rem; align-items:center; background:var(--cream); color:var(--g-950); border:2px solid var(--gold); border-radius:12px; padding:.7rem .9rem; box-shadow:0 12px 30px -12px rgba(0,0,0,.5); }
.leader-photo figcaption i { color:var(--g-700); font-size:1.4rem; }
.leader-photo figcaption strong { display:block; font-family:var(--serif); font-size:.95rem; }
.leader-photo figcaption small { display:block; font-size:.72rem; color:var(--gold-ink); font-weight:700; }
@media (min-width:1024px) { .leader-grid { grid-template-columns:1.6fr 1fr; } .leader-photo { margin-right:0; } }

/* ---------- แถบสถานะ ---------- */
.status-band { background:var(--g-950); border-block:1px solid var(--gold-deep); color:rgba(255,255,255,.88); font-size:.84rem; }
.status-row { display:flex; flex-wrap:wrap; gap:.6rem 2.25rem; align-items:center; padding-block:1rem; }
.st { display:inline-flex; align-items:center; gap:.5rem; }
.st > i { color:var(--gold); }
.st b { color:#fff; font-weight:700; } .st b.gold { color:var(--gold); font-size:1rem; font-weight:800; }
.dot-sep { color:rgba(255,255,255,.4); }
.open-pill { font-style:normal; font-size:.7rem; font-weight:800; padding:.1rem .5rem; border-radius:99px; }
.open-pill.ok { background:var(--g-500); color:#fff; } .open-pill.bad { background:rgba(255,255,255,.15); }

/* ---------- ประกาศปักหมุด ---------- */
.notices { padding-bottom:2.5rem; }
.notices .sec-head { margin-bottom:1rem; }
.pin-head { display:flex; gap:.5rem; align-items:center; font-weight:800; color:var(--g-950); padding:.5rem 0; border-bottom:2px solid var(--gold-deep); margin-bottom:1.5rem; }
.pin-head i { color:var(--gold-deep); transform:rotate(30deg); }
.pin-grid { display:grid; gap:1.5rem; }
@media (min-width:768px) { .pin-grid { grid-template-columns:1fr 1fr; } }
.pin-card { display:flex; flex-direction:column; background:#fff; border:1px solid var(--n-300); border-radius:14px; overflow:hidden; transition:box-shadow .25s,transform .25s; }
.pin-card:hover { box-shadow:var(--shadow); transform:translateY(-3px); }
.pin-media { position:relative; display:block; background:var(--g-50); height:260px; padding:0 2rem; }
.pin-media img { width:100%; height:100%; object-fit:contain; }
.pin-flag { position:absolute; top:.75rem; right:.75rem; background:var(--gold-50); color:var(--gold-ink); border:1px solid var(--gold-deep); font-size:.72rem; font-weight:800; padding:.15rem .55rem; border-radius:6px; }
.pin-body { display:flex; flex-direction:column; gap:.6rem; padding:1.15rem 1.25rem 1.25rem; flex:1; border-top:1px solid var(--line); }
.pin-body .chip-green { align-self:flex-start; }
.pin-body h3 { font-size:1.08rem; color:var(--g-950); }
.pin-body h3 a:hover { color:var(--g-700); }
.pin-body p { color:var(--ink-3); font-size:.88rem; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.pin-foot { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:auto; padding-top:.9rem; border-top:1px solid var(--line); font-size:.8rem; color:var(--ink-3); }
.pin-foot i { color:var(--g-700); }

/* ---------- ภาพกิจกรรม ---------- */
.activity { padding-top:2rem; border-top:1px solid var(--g-100); }
.act-stage { position:relative; height:clamp(300px,42vw,540px); border-radius:16px; background:var(--g-950); }
.act-stage .act-slide { border-radius:16px; overflow:hidden; }
.act-stage .act-slide::after { content:""; position:absolute; inset:auto 0 0; height:55%; background:linear-gradient(transparent,rgba(28,28,28,.85)); pointer-events:none; }
.act-count { position:absolute; top:1rem; right:1rem; z-index:2; background:var(--g-950); color:#fff; border:1px solid rgba(255,255,255,.25); border-radius:8px; padding:.3rem .65rem; font-size:.78rem; font-weight:800; }
.act-slide figcaption { position:absolute; left:0; right:0; bottom:0; z-index:2; padding:1.5rem 1.25rem; color:#fff; display:grid; grid-template-columns:1fr auto; gap:.25rem 1rem; align-items:end; }
.act-slide figcaption time { grid-column:1/-1; font-size:.75rem; font-weight:700; opacity:.9; }
.act-slide figcaption h3 { font-size:clamp(1rem,1.6vw,1.3rem); font-weight:800; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; max-width:52rem; }
.act-slide figcaption a { font-size:.82rem; font-weight:700; white-space:nowrap; }
.act-thumbs { display:grid; grid-template-columns:repeat(6,1fr); gap:.6rem; margin-top:.75rem; }
.thumb { background:none; border:0; padding:0; text-align:center; font-size:.72rem; color:var(--ink-3); }
.thumb img { width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:8px; border:2px solid transparent; opacity:.75; transition:.2s; }
.thumb.on img { border-color:var(--gold-deep); opacity:1; box-shadow:0 0 0 2px var(--gold-50); }
.thumb span { display:block; margin-top:.3rem; }
.activity .car-ctl { justify-content:space-between; margin-top:.85rem; color:var(--g-900); }
.activity .car-ctl .dots { flex:1; justify-content:center; }
@media (max-width:767px) { .act-thumbs { grid-template-columns:repeat(3,1fr); } .car-nav.prev { left:.5rem; } .car-nav.next { right:.5rem; } }

/* ---------- ข่าว / จัดซื้อจัดจ้าง ---------- */
.news-cols { padding-top:1.5rem; padding-bottom:2rem; }
.cols-2 { display:grid; gap:2.5rem; }
@media (min-width:1024px) { .cols-2 { grid-template-columns:1fr 1fr; } }
.col-title { font-size:1rem; font-weight:800; color:var(--g-950); padding-bottom:.6rem; border-bottom:2px solid var(--gold-deep); }
.feed li { border-bottom:1px solid var(--line); }
.feed a { display:flex; align-items:center; gap:1rem; padding:1rem .25rem; }
.feed a:hover strong { color:var(--g-700); }
.datebox { flex:none; width:56px; text-align:center; background:#fff; border:1px solid var(--n-300); border-top:3px solid var(--gold-deep); border-radius:6px; padding:.3rem 0; line-height:1.1; }
.datebox b { display:block; font-family:var(--serif); font-size:1.35rem; color:var(--g-950); }
.datebox small { font-size:.62rem; color:var(--ink-3); font-weight:700; }
.feed-txt { flex:1; min-width:0; }
.feed-txt strong { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:.92rem; color:var(--n-900); font-weight:600; }
.feed img { flex:none; width:68px; height:44px; object-fit:cover; border-radius:4px; }
.feed .go { color:var(--g-800); font-size:.8rem; }
.feed + .btn { margin-top:1.25rem; }

/* ---------- ภาพลายเส้นริมน้ำ ---------- */
.river { height:clamp(120px,15vw,220px); margin-top:-1rem; overflow:hidden; border-bottom:1px solid var(--gold-deep); position:relative; }
.river::after { content:""; position:absolute; left:10%; right:10%; bottom:-1px; height:2px; background:linear-gradient(90deg,transparent,var(--gold),transparent); }
.river svg { width:100%; height:100%; }

/* ---------- บริการประชาชน ---------- */
.services .h-serif { font-size:1.65rem; }
.svc-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:.75rem; }
@media (min-width:768px) { .svc-grid { grid-template-columns:repeat(4,1fr); } }
.svc { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.8rem; min-height:128px; background:#fff; border:1px solid var(--n-300); border-radius:12px; text-align:center; font-weight:800; color:var(--g-950); transition:.25s; }
.svc i { font-size:2.1rem; color:var(--g-900); transition:transform .25s; }
.svc:hover { border-color:var(--g-700); box-shadow:var(--shadow); }
.svc:hover i { transform:translateY(-3px) scale(1.05); color:var(--g-700); }
.svc-all { display:block; margin-top:.75rem; text-align:center; font-weight:800; color:var(--g-950); padding:.7rem; border:1.5px solid var(--g-800); border-radius:10px; background:#fff; }
.svc-all:hover { background:var(--g-50); }
.svc-links { display:flex; flex-wrap:wrap; gap:.5rem 1.25rem; margin:1.25rem 0 2rem; font-size:.82rem; font-weight:700; }
.svc-links a { color:var(--g-900); text-decoration:underline; text-decoration-color:var(--gold-deep); text-underline-offset:4px; text-decoration-thickness:2px; }
.finder { display:grid; border:1px solid var(--g-100); border-radius:18px; overflow:hidden; background:#fff; box-shadow:0 24px 50px -36px rgba(var(--g-rgb,11,58,38),.5); }
@media (min-width:1024px) { .finder { grid-template-columns:1.55fr 1fr; } }
.finder-form { position:relative; padding:2rem; }
.bar-gold { display:block; width:42px; height:4px; border-radius:2px; background:var(--gold); }
.finder h3 { font-family:var(--serif); font-size:1.45rem; color:var(--g-950); margin:.8rem 0 1.25rem; }
.finder label { display:block; font-size:.82rem; font-weight:700; margin-bottom:.4rem; }
.finder-row { display:flex; gap:.6rem; flex-wrap:wrap; }
.finder-input { flex:1 1 260px; display:flex; align-items:center; gap:.6rem; border:1.5px solid var(--n-300); border-radius:10px; padding:0 .9rem; background:#fff; }
.finder-input:focus-within { border-color:var(--g-800); box-shadow:0 0 0 3px var(--g-75); }
.finder-input i { color:var(--ink-3); }
.finder-input input { flex:1; border:0; outline:0; min-height:46px; background:none; }
.finder-list { position:absolute; left:2rem; right:2rem; z-index:5; margin-top:.35rem; background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow); max-height:280px; overflow:auto; }
.finder-list a { display:flex; gap:.6rem; align-items:center; padding:.65rem 1rem; font-size:.9rem; }
.finder-list a:hover, .finder-list a.on { background:var(--g-50); color:var(--g-900); }
.finder-list i { color:var(--g-700); }
.hint { font-size:.78rem; color:var(--ink-3); margin-top:.6rem; }
.try { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; margin-top:1rem; font-size:.78rem; color:var(--ink-3); }
.chip-try { border:1.5px solid var(--g-200); background:var(--g-25); color:var(--g-900); border-radius:99px; padding:.35rem .9rem; font-size:.82rem; font-weight:700; }
.chip-try:hover { background:var(--g-900); color:#fff; border-color:var(--g-900); }
.finder-art { background:linear-gradient(160deg,var(--g-25),var(--g-50)); display:grid; place-items:center; padding:1.5rem; }
.finder-art svg { width:100%; max-width:360px; }

/* ---------- แบบฟอร์ม ---------- */
.forms-band { position:relative; background:var(--g-900); color:#fff; padding:4rem 0; overflow:hidden; border-top:1px solid var(--line); }
.forms-band::before { content:""; position:absolute; inset:0; background:repeating-radial-gradient(circle at 0 100%,transparent 0 38px,rgba(var(--gold-rgb,232,178,58),.05) 38px 39px); }
.forms-grid { position:relative; display:grid; gap:2.5rem; align-items:center; }
@media (min-width:1024px) { .forms-grid { grid-template-columns:1fr 1fr; } }
.forms-copy .h-serif { color:#fff; font-size:clamp(1.8rem,3vw,2.4rem); margin:.8rem 0 1rem; }
.forms-copy > p { color:rgba(255,255,255,.85); font-size:.92rem; max-width:30rem; }
.steps-gold { counter-reset:s; display:grid; gap:.6rem; margin:1.4rem 0 1.75rem; font-size:.85rem; font-weight:700; }
.steps-gold li { counter-increment:s; display:flex; align-items:center; gap:.75rem; }
.steps-gold li::before { content:counter(s); width:24px; height:24px; border-radius:50%; background:var(--gold); color:var(--g-950); display:grid; place-items:center; font-size:.75rem; font-weight:800; }
.forms-hours { margin-top:1.5rem; font-size:.8rem; color:rgba(255,255,255,.75); }
.forms-hours a { color:#fff; font-weight:800; text-decoration:underline; }
.forms-card { background:#fff; color:var(--ink); border-radius:16px; border-top:4px solid var(--gold); padding:1.25rem; box-shadow:0 30px 60px -30px rgba(0,0,0,.6); }
.fc-head { display:flex; justify-content:space-between; align-items:baseline; gap:1rem; padding-bottom:.75rem; border-bottom:1px solid var(--line); margin-bottom:.75rem; }
.fc-head strong { font-family:var(--serif); color:var(--g-950); }
.fc-head span { font-size:.75rem; color:var(--ink-3); } .fc-head b { font-family:var(--serif); font-size:1.05rem; color:var(--g-900); }
.fc-row { display:flex; align-items:center; gap:1rem; padding:.85rem 1rem; border:1px solid var(--line); border-radius:10px; margin-bottom:.6rem; transition:.2s; }
.fc-row:hover { border-color:var(--g-700); background:var(--g-25); }
.fc-row > b { font-family:var(--serif); color:var(--gold-ink); font-size:1.1rem; }
.fc-row span { flex:1; } .fc-row strong { display:block; font-family:var(--serif); color:var(--g-950); }
.fc-row small { font-size:.75rem; color:var(--ink-3); }
.fc-row i { color:var(--g-800); }
.fc-foot { font-size:.75rem; color:var(--ink-3); margin-top:1.25rem; }

/* ---------- นโยบาย ---------- */
.pol-grid { display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); }
.pol { display:flex; flex-direction:column; gap:.6rem; background:#fff; border:1px solid var(--n-300); border-top:3px solid var(--g-800); border-radius:12px; padding:1.25rem; transition:.25s; }
.pol:hover { box-shadow:var(--shadow); transform:translateY(-3px); }
.pol-ic { width:62px; height:62px; border-radius:50%; display:grid; place-items:center; background:var(--g-25); border:1.5px solid var(--g-200); color:var(--g-800); font-size:1.5rem; margin-bottom:.4rem; }
.pol h3 { font-size:.98rem; color:var(--g-950); font-weight:800; }
.pol h3 b { font-family:var(--serif); font-size:1.7rem; color:var(--g-800); margin-right:.2rem; }
.pol p { font-size:.8rem; color:var(--ink-3); flex:1; }
.pol a { font-size:.78rem; font-weight:800; color:var(--g-800); display:flex; gap:.35rem; align-items:center; }

/* ---------- รางวัล ---------- */
.awards-band { position:relative; background:var(--g-950); color:#fff; padding-top:4rem; border-top:3px solid var(--gold); overflow:hidden; }
.awards-band::before { content:""; position:absolute; inset:0; background:repeating-linear-gradient(135deg,transparent 0 80px,rgba(var(--gold-rgb,232,178,58),.035) 80px 82px); pointer-events:none; }
.awards-band > .container { position:relative; }
.awards-band .h-serif { color:#fff; margin-top:.5rem; }
.aw-count { margin:.6rem 0 1.75rem; font-size:.88rem; font-weight:700; display:flex; align-items:baseline; gap:.6rem; }
.aw-count b { font-family:var(--serif); color:var(--gold); font-size:2rem; }
.aw-grid { display:grid; gap:1.25rem; padding-bottom:3rem; }
@media (min-width:768px) { .aw-grid { grid-template-columns:repeat(3,1fr); } }
.aw { position:relative; border:1px solid rgba(var(--gold-rgb,232,178,58),.45); border-radius:14px; overflow:hidden; background:rgba(18,80,55,.35); display:flex; flex-direction:column; }
.aw-no { position:absolute; top:.6rem; left:.6rem; z-index:1; font-size:.72rem; font-weight:800; color:var(--gold); background:rgba(var(--g-rgb,11,58,38),.85); border:1px solid rgba(var(--gold-rgb,232,178,58),.5); border-radius:6px; padding:.1rem .45rem; }
.aw-img { height:220px; background:var(--g-975,#0a2e0f); overflow:hidden; }
.aw-img img { height:100%; width:100%; object-fit:contain; }
.aw-body { padding:1rem 1.1rem 1.2rem; display:flex; flex-direction:column; gap:.55rem; align-items:flex-start; }
.aw-body h3 { font-size:.95rem; font-weight:800; }
.aw-body time { font-size:.78rem; color:var(--gold); font-weight:700; }
.aw-foot { background:var(--cream); color:var(--ink-2); border-bottom:1px solid var(--line); position:relative; }
.aw-foot-row { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; padding-block:1.25rem; font-size:.85rem; }

/* ---------- ธรรมาภิบาล ---------- */
.gov-grid { display:grid; gap:2.5rem; align-items:start; }
@media (min-width:1024px) { .gov-grid { grid-template-columns:1fr 340px; } }
.ledger { margin-top:2rem; }
.ledger-h { display:flex; justify-content:space-between; font-size:.68rem; letter-spacing:.2em; font-weight:800; color:var(--ink-3); padding-bottom:.6rem; border-bottom:1px solid var(--n-300); }
.ledger-row { display:grid; grid-template-columns:1fr auto; gap:1.5rem; padding:1.4rem 0; border-bottom:1px solid var(--line); }
.ledger-row h3 { font-size:1.05rem; font-weight:800; color:var(--g-950); }
.ledger-row p { font-size:.82rem; color:var(--ink-3); }
.ledger-links { display:flex; flex-wrap:wrap; gap:.6rem 1.25rem; align-items:center; margin-top:1rem; font-size:.8rem; font-weight:800; color:var(--g-900); }
.ledger-links > a:not(.chip-outline) { border-bottom:2px solid var(--gold-deep); }
.ledger-stat { text-align:right; display:flex; flex-direction:column; align-items:flex-end; gap:.4rem; min-width:150px; }
.ledger-stat p { font-size:.8rem; color:var(--ink-3); }
.ledger-stat b { font-family:var(--serif); font-size:1.9rem; color:var(--g-900); margin-right:.2rem; }
.ledger-stat small { font-size:.72rem; color:var(--ink-3); }
.ok-pill { font-size:.7rem; font-weight:800; color:var(--g-900); border:1px solid var(--g-300); background:var(--g-25); border-radius:6px; padding:.1rem .5rem; }
.ticks { display:block; width:150px; height:10px; background:repeating-linear-gradient(90deg,var(--gold-deep) 0 3px,transparent 3px 6px); -webkit-mask:linear-gradient(90deg,#000 var(--p),rgba(0,0,0,.2) var(--p)); mask:linear-gradient(90deg,#000 var(--p),rgba(0,0,0,.2) var(--p)); }
.gov-card { background:var(--g-950); color:#fff; border-radius:16px; border-top:4px solid var(--gold); padding:1.5rem; box-shadow:0 30px 60px -30px rgba(0,0,0,.6); position:sticky; top:96px; }
.gov-card h3 { font-family:var(--serif); font-size:1.4rem; margin:.7rem 0 .4rem; }
.gov-card > p { font-size:.85rem; color:rgba(255,255,255,.8); margin-bottom:1.1rem; }
.gov-card dl { margin:1.25rem 0 1rem; font-size:.8rem; }
.gov-card dl div { display:flex; justify-content:space-between; gap:1rem; padding:.45rem 0; border-bottom:1px solid rgba(255,255,255,.12); }
.gov-card dt { color:rgba(255,255,255,.7); } .gov-card dd { margin:0; font-weight:800; color:var(--gold); text-align:right; }
.gov-card > small { font-size:.72rem; color:rgba(255,255,255,.6); }

/* ---------- สถานที่ ---------- */
.places { border-top:1px solid var(--line); }
.pl-stats { display:flex; gap:2rem; }
.pl-stats span { display:flex; flex-direction:column; border-left:2px solid var(--gold-deep); padding-left:.75rem; line-height:1.1; }
.pl-stats b { font-family:var(--serif); font-size:2.3rem; color:var(--g-900); }
.pl-stats small { font-size:.72rem; color:var(--ink-3); }
.pl-feature { display:grid; gap:1rem; }
@media (min-width:1024px) { .pl-feature { grid-template-columns:2.1fr 1fr; grid-template-rows:1fr 1fr; height:520px; } .pl-tile.big { grid-row:1/3; } }
.pl-tile { position:relative; display:flex; flex-direction:column; min-height:240px; border:1px solid var(--n-300); border-radius:14px; overflow:hidden; background:var(--g-25); }
.pl-img { flex:1; position:relative; overflow:hidden; }
.pl-img::before { content:""; position:absolute; inset:-20px; background:var(--bg) center/cover; filter:blur(16px); opacity:.35; }
.pl-img img { position:absolute; inset:0; margin:auto; height:100%; width:100%; object-fit:contain; transition:transform .6s; }
.pl-tile:hover .pl-img img { transform:scale(1.04); }
.pl-tile > em { position:absolute; top:.75rem; left:.75rem; z-index:1; }
.pl-cap { position:relative; background:var(--g-950); color:#fff; border-top:3px solid var(--gold-deep); padding:.75rem 2.5rem .75rem 1rem; }
.pl-cap strong { display:block; font-family:var(--serif); font-size:1.1rem; } .pl-tile.big .pl-cap strong { font-size:1.5rem; }
.pl-cap small { font-size:.75rem; opacity:.85; }
.pl-cap i { position:absolute; right:1rem; top:50%; transform:translateY(-50%) rotate(-45deg); color:var(--gold); }
.pl-board { margin-top:1.5rem; background:#fff; border:1px solid var(--line); border-radius:18px; padding:1rem; box-shadow:0 30px 60px -40px rgba(var(--g-rgb,11,58,38),.5); }
.pl-filters { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1rem; }
.pl-filters button { border:1.5px solid var(--n-300); background:#fff; border-radius:99px; padding:.4rem .9rem; font-size:.8rem; font-weight:700; color:var(--g-950); display:inline-flex; gap:.4rem; align-items:center; }
.pl-filters button i { color:var(--g-700); }
.pl-filters button.on { background:var(--g-950); color:#fff; border-color:var(--g-950); box-shadow:0 0 0 3px var(--gold-50); }
.pl-filters button.on i { color:var(--gold); }
.pl-body { display:grid; gap:1rem; }
@media (min-width:1024px) { .pl-body { grid-template-columns:1.8fr 1fr; } }
.pl-map { position:relative; min-height:420px; border-radius:12px; overflow:hidden; background:var(--g-50); z-index:0; }
.pl-loading { position:absolute; inset:0; display:grid; place-items:center; font-size:.85rem; color:var(--ink-3); }
.pl-pin { width:34px; height:34px; border-radius:50%; background:var(--g-900); color:#fff; border:3px solid var(--gold); display:grid; place-items:center; font-weight:800; font-size:.8rem; box-shadow:0 6px 14px -6px rgba(0,0,0,.6); }
.pl-pin.on { background:var(--gold); color:var(--g-950); border-color:var(--g-950); transform:scale(1.15); }
.pl-detail { background:var(--cream); border:1px solid var(--line); border-top:3px solid var(--gold); border-radius:12px; padding:1.1rem; display:flex; flex-direction:column; gap:.6rem; }
.pl-detail h3 { font-family:var(--serif); font-size:1.5rem; color:var(--g-950); }
.pl-detail img { width:100%; height:180px; object-fit:cover; border-radius:10px; }
.pl-detail p { font-size:.85rem; color:var(--ink-2); }
.pl-detail .btn-row { margin-top:auto; } .pl-detail .btn { flex:1; }
.pl-detail [data-f="cat"]:empty { display:none; }
.pl-list { display:grid; gap:0 1.5rem; margin-top:1rem; }
@media (min-width:768px) { .pl-list { grid-template-columns:1fr 1fr; } }
.pl-list li { border-bottom:1px solid var(--line); } .pl-list li[hidden] { display:none; }
.pl-list button { width:100%; display:flex; align-items:center; gap:.85rem; padding:.75rem .25rem; background:none; border:0; text-align:left; }
.pl-list button b { flex:none; width:24px; height:24px; border-radius:50%; background:var(--gold); color:var(--g-950); display:grid; place-items:center; font-size:.72rem; }
.pl-list button span { flex:1; } .pl-list strong { display:block; font-size:.9rem; color:var(--g-950); }
.pl-list small { font-size:.75rem; color:var(--ink-3); }
.pl-list button > i { color:var(--n-400); font-size:.7rem; }
.pl-list button.on strong, .pl-list button:hover strong { color:var(--g-700); }
.pl-foot { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; margin-top:1rem; }
.yt-btn { display:flex; gap:.75rem; align-items:center; text-align:left; background:var(--g-950); color:#fff; border:0; border-radius:10px; padding:.7rem 1rem; }
.yt-btn > i { color:var(--gold); }
.yt-btn strong { display:block; font-size:.85rem; } .yt-btn small { font-size:.72rem; opacity:.8; }
.yt-frame { width:100%; aspect-ratio:16/9; border:0; border-radius:12px; margin-top:1rem; }
.pl-nearby { margin-top:2rem; }
.pl-nearby h3 { font-size:1rem; font-weight:800; color:var(--g-950); }
.pl-nearby p { font-size:.8rem; color:var(--ink-3); margin:.3rem 0 .8rem; }
.chip-row { display:flex; flex-wrap:wrap; gap:.5rem; }
.chip-link { display:inline-flex; gap:.45rem; align-items:center; border:1.5px solid var(--n-300); background:#fff; border-radius:8px; padding:.4rem .8rem; font-size:.82rem; font-weight:700; color:var(--g-950); }
.chip-link i { font-size:.7rem; color:var(--g-700); }
.chip-link:hover { border-color:var(--g-700); }

/* ---------- ลิงก์ที่เกี่ยวข้อง ---------- */
.related { padding-top:2rem; }
.rel-grid { display:grid; gap:.85rem; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); }
.rel { display:flex; flex-direction:column; gap:.6rem; background:var(--g-25); border:1px solid var(--g-75); border-radius:12px; padding:1rem; font-size:.84rem; transition:.2s; }
.rel:hover { background:#fff; border-color:var(--g-300); box-shadow:var(--shadow); }
.rel-logo { height:56px; display:grid; place-items:center; } .rel-logo img { max-height:56px; width:auto; object-fit:contain; }
.rel-logo i { font-size:1.6rem; color:var(--g-700); }
.rel strong { color:var(--g-950); flex:1; }
.rel small { font-size:.72rem; color:var(--ink-3); display:flex; gap:.35rem; align-items:center; }

/* ---------- ส่วนท้าย ---------- */
.site-footer { position:relative; background:#0f4316; color:#fff; border-top:4px solid var(--gold); padding-top:3rem; overflow:hidden; }
.site-footer::before { content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(255,255,255,.04) 1px,transparent 1px); background-size:16px 16px; pointer-events:none; }
.site-footer > * { position:relative; }
.site-footer a:hover { color:var(--gold); }
.ft-top { display:grid; gap:2rem; }
@media (min-width:1024px) { .ft-top { grid-template-columns:1.6fr 1fr; } }
.ft-office h2 { font-family:var(--serif); font-size:1.65rem; margin:.5rem 0 .4rem; }
.ft-office > p { font-size:.88rem; color:rgba(255,255,255,.85); }
.ft-dl { margin:1.5rem 0 0; display:grid; gap:.75rem; font-size:.88rem; }
.ft-dl div { display:grid; grid-template-columns:110px 1fr; gap:1rem; }
.ft-dl dt { color:rgba(255,255,255,.65); font-size:.8rem; } .ft-dl dd { margin:0; font-weight:800; }
.u { text-decoration:underline; text-underline-offset:3px; }
.ft-sos { align-self:start; border:1.5px solid var(--gold-deep); border-radius:12px; background:rgba(18,80,55,.6); padding:1.1rem 1.25rem; font-size:.85rem; }
.ft-sos .eyebrow::before { display:none; }
.sos-nums { display:flex; align-items:baseline; gap:.75rem; flex-wrap:wrap; margin-top:.2rem; }
.sos-nums .big { font-family:var(--serif); font-size:1.9rem; font-weight:800; text-decoration:underline; text-underline-offset:5px; }
.sos-nums .gold, .gold { color:var(--gold); }
.ft-sos hr { border:0; border-top:1px solid rgba(255,255,255,.15); margin:.9rem 0; }
.ft-sos .mid { font-family:var(--serif); font-size:1.3rem; font-weight:800; margin-left:.5rem; text-decoration:underline; }
.ft-mid { display:grid; gap:2rem; margin-top:2.5rem; }
@media (min-width:1024px) { .ft-mid { grid-template-columns:1.4fr 1fr .8fr; } }
.site-footer h3 { font-size:.82rem; font-weight:800; margin-bottom:.75rem; }
.ft-channels a { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:.62rem 0; border-bottom:1px solid rgba(255,255,255,.12); font-size:.86rem; font-weight:600; }
.ext { font-style:normal; font-size:.68rem; color:var(--gold); border:1px solid var(--gold-deep); border-radius:99px; padding:.05rem .55rem; white-space:nowrap; }
.tiny { font-size:.72rem; color:rgba(255,255,255,.6); margin-top:.75rem; }
.ft-cols { display:grid; gap:1.5rem; align-content:start; }
.ft-cols nav { display:flex; flex-direction:column; }
.ft-cols a { padding:.4rem 0; font-size:.86rem; color:rgba(255,255,255,.9); }
.map-lazy { height:150px; border-radius:10px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.15); display:grid; place-items:center; font-size:.75rem; color:rgba(255,255,255,.6); overflow:hidden; margin-bottom:.6rem; }
.map-lazy iframe { width:100%; height:100%; border:0; }
.ft-map > a { font-size:.8rem; }
.ft-line { display:flex; gap:.85rem; align-items:center; margin-top:1rem; font-size:.8rem; }
.ft-line .qr { width:72px; height:72px; background:#fff; border-radius:8px; display:grid; place-items:center; color:var(--g-950); font-size:2rem; padding:4px; flex:none; }
.ft-line small { display:block; color:rgba(255,255,255,.7); }
.pm-strip { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:1rem; margin-top:2.5rem; padding:1.25rem 0; border-top:1px solid rgba(255,255,255,.16); }
.pm-main { display:flex; flex-wrap:wrap; align-items:baseline; gap:.5rem 1rem; }
.pm-main .eyebrow::before { display:none; }
.pm-val { font-family:var(--serif); font-size:2rem; color:var(--gold); }
.pm-pill { display:inline-flex; align-items:center; gap:.35rem; background:#fff; color:var(--g-950); font-size:.75rem; font-weight:800; border-radius:99px; padding:.15rem .6rem; }
.pm-pill i { width:8px; height:8px; border-radius:50%; background:#2196f3; }
.pm-pill.lv2 i { background:var(--g-500); } .pm-pill.lv3 i { background:#fbc02d; } .pm-pill.lv4 i { background:#fb8c00; } .pm-pill.lv5 i { background:#e53935; }
.pm-scale { display:inline-flex; gap:2px; align-items:center; }
.pm-scale i { width:22px; height:4px; border-radius:2px; opacity:.45; }
.pm-scale i:nth-child(1) { background:#2196f3; } .pm-scale i:nth-child(2) { background:var(--g-500); } .pm-scale i:nth-child(3) { background:#fbc02d; } .pm-scale i:nth-child(4) { background:#fb8c00; } .pm-scale i:nth-child(5) { background:#e53935; }
.pm-scale[style*="--lv:1"] i:nth-child(1), .pm-scale[style*="--lv:2"] i:nth-child(2), .pm-scale[style*="--lv:3"] i:nth-child(3), .pm-scale[style*="--lv:4"] i:nth-child(4), .pm-scale[style*="--lv:5"] i:nth-child(5) { opacity:1; height:7px; }
.pm-main p { flex-basis:100%; font-size:.75rem; color:rgba(255,255,255,.75); }
.pm-src { font-size:.78rem; font-weight:700; color:var(--gold); }
.ft-bottom { border-top:1px solid rgba(255,255,255,.2); padding:1.25rem 0 6rem; font-size:.78rem; color:rgba(255,255,255,.8); }
.ft-bottom .container { display:grid; gap:.7rem; }
.ft-policy { display:flex; flex-wrap:wrap; gap:.3rem 1.25rem; }
.ft-policy a, .ft-policy button { color:#fff; background:none; border:0; padding:0; font-size:.78rem; }
.ft-policy button:hover { color:var(--gold); }
@media (min-width:1024px) { .ft-bottom { padding-bottom:1.5rem; } }

/* ---------- ลอย / ป๊อปอัป ---------- */
.to-top { position:fixed; right:1.25rem; bottom:calc(5.5rem + env(safe-area-inset-bottom)); z-index:40; display:inline-flex; gap:.4rem; align-items:center; background:var(--g-950); color:var(--gold); border:2px solid var(--gold); border-radius:99px; padding:.45rem .95rem; font-weight:800; font-size:.82rem; box-shadow:0 10px 24px -10px rgba(0,0,0,.6); opacity:0; pointer-events:none; transform:translateY(10px); transition:.25s; }
.to-top.show { opacity:1; pointer-events:auto; transform:none; }
@media (min-width:1024px) { .to-top { bottom:1.5rem; } }
.mobile-bar { position:fixed; inset:auto 0 0; z-index:30; background:#fff; border-top:2px solid var(--gold-deep); box-shadow:0 -10px 30px -20px rgba(0,0,0,.4); padding-bottom:env(safe-area-inset-bottom); }
.mobile-bar ul { display:grid; grid-template-columns:repeat(5,1fr); }
.mobile-bar a { display:flex; flex-direction:column; align-items:center; gap:.15rem; padding:.55rem 0; font-size:.7rem; font-weight:700; color:var(--n-700); }
.mobile-bar i { font-size:1.05rem; color:var(--g-800); }
.mobile-bar a[aria-current] { color:var(--g-900); } .mobile-bar a[aria-current] i { color:var(--gold-deep); }
@media (min-width:1024px) { .mobile-bar { display:none; } }
.search-dialog { width:min(640px,92vw); border:0; border-radius:16px; padding:1rem; border-top:4px solid var(--gold); box-shadow:0 40px 80px -30px rgba(0,0,0,.6); }
.search-dialog::backdrop { background:rgba(var(--g-rgb,11,58,38),.55); backdrop-filter:blur(3px); }
.search-dialog form { display:flex; align-items:center; gap:.75rem; border:1.5px solid var(--n-300); border-radius:10px; padding:0 .9rem; }
.search-dialog input { flex:1; border:0; outline:0; min-height:52px; font-size:1.05rem; }
.search-close { border:1px solid var(--n-300); background:var(--n-100); border-radius:6px; font-size:.72rem; padding:.2rem .5rem; }
.search-hints { display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; margin-top:.85rem; font-size:.8rem; }
.search-hints span { color:var(--ink-3); }
.search-hints a { border:1px solid var(--g-200); background:var(--g-25); color:var(--g-900); border-radius:99px; padding:.2rem .75rem; font-weight:700; }
.cookie { position:fixed; left:1rem; bottom:calc(4.5rem + env(safe-area-inset-bottom)); z-index:50; width:min(420px,calc(100vw - 2rem)); background:#fff; border:1px solid var(--line); border-top:4px solid var(--gold); border-radius:14px; padding:1.1rem; box-shadow:0 30px 60px -25px rgba(0,0,0,.5); font-size:.85rem; display:grid; gap:.7rem; }
.cookie[hidden] { display:none; }
.cookie h2 { font-family:var(--serif); font-size:1.05rem; color:var(--g-950); }
.cookie a { color:var(--g-800); text-decoration:underline; }
.cookie-opts { display:grid; gap:.4rem; } .cookie-opts[hidden] { display:none; } .cookie-opts label { display:flex; gap:.5rem; align-items:center; }
@media (min-width:1024px) { .cookie { bottom:1.5rem; } }
.splash { position:fixed; inset:0; z-index:70; display:grid; place-items:center; background:rgba(28,28,28,.82); backdrop-filter:blur(4px); padding:1rem; }
.splash[hidden] { display:none; }
.splash-dlg { position:relative; width:min(720px,100%); display:flex; flex-direction:column; align-items:center; gap:.9rem; }
.splash-stage { position:relative; width:100%; height:min(70vh,560px); }
.splash-stage .act-slide img { border-radius:8px; }
.splash-stage figcaption { position:absolute; left:0; right:0; bottom:-1.6rem; text-align:center; color:#fff; font-size:.8rem; }
.splash-x { position:absolute; top:-.5rem; right:-.5rem; z-index:4; width:42px; height:42px; border-radius:50%; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.4); color:#fff; }
.car-ctl.light { color:#fff; margin-top:1.4rem; }
.splash-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:.6rem; }
.splash-actions .btn { border-color:var(--gold-deep); }
.splash-enter { background:none; border:0; color:#fff; text-decoration:underline; text-underline-offset:4px; font-weight:700; font-size:.88rem; }

/* ---------- หน้าใน ---------- */
.page-head { background:linear-gradient(110deg,var(--g-950),var(--g-900)); color:#fff; padding:2.5rem 0 2.75rem; border-bottom:3px solid var(--gold); }
.page-head .h-serif { color:#fff; font-size:clamp(1.5rem,3vw,2.2rem); margin-top:.6rem; max-width:56rem; }
.crumbs { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; font-size:.8rem; color:rgba(255,255,255,.8); margin-bottom:1rem; }
.crumbs i { font-size:.55rem; color:var(--gold); } .crumbs a:hover { color:var(--gold); }
.detail-wrap { display:grid; gap:2rem; padding-block:2.5rem; align-items:start; }
@media (min-width:1024px) { .detail-wrap { grid-template-columns:1fr 330px; } }
.prose-card { background:#fff; border:1px solid var(--line); border-radius:16px; padding:clamp(1.25rem,3vw,2.25rem); }
.prose-card.empty { text-align:center; display:grid; gap:.75rem; justify-items:center; }
.err { font-family:var(--serif); font-size:4rem; color:var(--gold-deep); line-height:1; }
.meta { display:flex; flex-wrap:wrap; gap:.5rem 1.25rem; align-items:center; font-size:.82rem; color:var(--ink-3); padding-bottom:1rem; border-bottom:1px solid var(--line); margin-bottom:1.5rem; }
.meta i { color:var(--g-700); } .meta-tools { margin-left:auto; display:flex; gap:.4rem; flex-wrap:wrap; }
.cover { width:100%; max-height:520px; object-fit:contain; background:var(--g-50); border-radius:12px; margin-bottom:1.5rem; }
.prose { font-size:1.02rem; line-height:1.85; overflow-wrap:anywhere; }
.prose p, .prose ul, .prose ol, .prose table, .prose figure { margin:0 0 1rem; }
.prose ul { list-style:disc; padding-left:1.5rem; } .prose ol { list-style:decimal; padding-left:1.5rem; }
.prose a { color:var(--g-800); text-decoration:underline; }
.prose img { height:auto; border-radius:8px; margin:1rem auto; }
.prose table { width:100%; border-collapse:collapse; display:block; overflow-x:auto; }
.prose td, .prose th { border:1px solid var(--line); padding:.5rem .75rem; }
.prose h2, .prose h3, .prose h4 { font-family:var(--serif); color:var(--g-950); margin:1.5rem 0 .75rem; }
.sub { font-family:var(--serif); font-size:1.15rem; color:var(--g-950); margin:2rem 0 1rem; padding-bottom:.5rem; border-bottom:2px solid var(--gold-deep); }
.pics { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:.6rem; }
.pics img { width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:8px; }
.files { display:grid; gap:.6rem; }
.file { display:flex; align-items:center; gap:.85rem; padding:.7rem .9rem; border:1px solid var(--line); border-radius:10px; font-size:.88rem; }
.file > span:nth-child(2) { flex:1; word-break:break-all; }
.file .ext { background:var(--g-900); color:#fff; font-size:.7rem; font-weight:800; border-radius:6px; padding:.2rem .45rem; }
.side-list { background:#fff; border:1px solid var(--line); border-top:3px solid var(--gold); border-radius:14px; padding:1.25rem; position:sticky; top:96px; }
.side-list h2 { font-family:var(--serif); font-size:1.1rem; color:var(--g-950); }

/* ---------- จอเล็ก ---------- */
@media (max-width:1023px) {
  .topbar-in { height:46px; justify-content:flex-start; gap:.4rem; overflow-x:auto; scrollbar-width:none; }
  .tb-btn, .lang, .a11y { flex:none; }
  .tb-staff { display:none; }
  .site-header.compact { top:-46px; }
  .mainbar { backdrop-filter:none; background:#fff; } /* backdrop-filter ทำให้ลิ้นชักเมนู position:fixed ยึดกับแถบนี้แทนหน้าจอ */
  .mainbar-in { height:70px; }
  .main-nav:not(.open) { visibility:hidden; }
  .nav-close { display:grid; position:absolute; top:1rem; right:1rem; }
  .menu-toggle { display:inline-flex; width:auto; padding:0 .9rem; border-radius:99px; gap:.4rem; align-items:center; } .menu-toggle span { display:inline; font-size:.82rem; font-weight:700; }
  .main-nav { position:fixed; inset:0 0 0 auto; width:min(380px,88vw); background:#fff; z-index:45; padding:5rem 1.25rem 2rem; overflow:auto; transform:translateX(100%); transition:transform .3s; box-shadow:-20px 0 50px -20px rgba(0,0,0,.4); }
  .main-nav.open { transform:none; }
  .main-nav > ul { flex-direction:column; gap:0; }
  .has-mega { flex-wrap:wrap; border-bottom:1px solid var(--line); }
  .nav-top { flex:1; padding:.9rem .25rem; font-size:1rem; }
  .mega-btn { width:44px; height:44px; }
  .mega { position:static; transform:none; width:100%; opacity:1; visibility:visible; display:none; box-shadow:none; border:0; padding:0 0 1rem; background:none; }
  .has-mega:hover .mega { transform:none; }
  .has-mega.open .mega { display:block; transform:none; }
  .mega-head, .mega-desc { display:none; }
  .mega-links { grid-template-columns:1fr; }
  .brand-txt strong { font-size:1.05rem; }
  .brand-seal { width:46px; height:46px; }
  .ledger-row { grid-template-columns:1fr; } .ledger-stat { align-items:flex-start; text-align:left; }
  .gov-card, .side-list { position:static; }
}
body.nav-open::after { content:""; position:fixed; inset:0; background:rgba(28,28,28,.5); z-index:39; }
body.nav-open { overflow:hidden; }

/* ---------- โหมดสีตัดกัน ---------- */
html[data-contrast="1"] body { background:#000; color:#fff; }
html[data-contrast="1"] :is(.mainbar,.alert-strip,.hero,.hero-strip,.pin-card,.svc,.svc-all,.finder,.forms-card,.pol,.aw-foot,.pl-board,.pl-detail,.rel,.prose-card,.side-list,.mobile-bar,.cookie,.chip-link,.datebox,.fc-row,.mega,.pl-tile,.btn-ghost,.round-btn,.chip-try,.pl-filters button) { background:#000 !important; color:#ff0 !important; border-color:#ff0 !important; }
html[data-contrast="1"] :is(h1,h2,h3,strong,b,a,p,span,small,dt,dd,label,em,time,i) { color:#ff0 !important; }
html[data-contrast="1"] :is(.hero-bg,.act-bg,.river,.finder-art) { display:none; }
html[data-contrast="1"] img { filter:grayscale(1) contrast(1.2); }
html[data-contrast="1"] .btn { background:#ff0 !important; color:#000 !important; border-color:#ff0 !important; }
html[data-contrast="1"] .btn * { color:#000 !important; }

@media (prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none !important; animation:none !important; scroll-behavior:auto !important; } .reveal { opacity:1; transform:none; } }
@media print { .site-header,.site-footer,.mobile-bar,.to-top,.cookie,.splash,.meta-tools,.side-list,.alert-strip { display:none !important; } .page-head { background:none; color:#000; } .page-head .h-serif { color:#000; } body { background:#fff; } }

/* =========================================================
   หน้าใน V14: รายการข่าว เอกสาร บุคลากร ITA บริการ กระทู้ ค้นหา ติดต่อ ประชากร
   ========================================================= */
.page-lead { margin-top:.75rem; color:rgba(255,255,255,.85); font-size:.95rem; max-width:48rem; }
.page-body { padding-block:2.25rem 3.5rem; }
.page-body.with-side { display:grid; gap:2rem; align-items:start; }
@media (min-width:1024px) { .page-body.with-side { grid-template-columns:290px 1fr; } }
.toolbar { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:1rem; }
.tabs-pill { display:flex; flex-wrap:wrap; gap:.45rem; }
.tabs-pill a { display:inline-flex; align-items:center; gap:.35rem; border:1.5px solid var(--n-300); background:#fff; border-radius:99px; padding:.4rem .95rem; font-size:.85rem; font-weight:700; color:var(--g-950); transition:.2s; }
.tabs-pill a:hover { border-color:var(--g-700); }
.tabs-pill a.on { background:var(--g-950); border-color:var(--g-950); color:#fff; box-shadow:0 0 0 3px var(--gold-50); }
.tabs-pill small { font-size:.7rem; opacity:.7; }
.search-inline { display:flex; align-items:center; gap:.5rem; background:#fff; border:1.5px solid var(--n-300); border-radius:10px; padding:.25rem .3rem .25rem .8rem; min-width:min(100%,320px); }
.search-inline:focus-within { border-color:var(--g-800); box-shadow:0 0 0 3px var(--g-75); }
.search-inline i { color:var(--ink-3); }
.search-inline input { flex:1; min-width:0; border:0; outline:0; background:none; min-height:38px; }
.search-inline.full { width:100%; margin-bottom:1rem; }
.result-meta { font-size:.85rem; color:var(--ink-3); margin-bottom:1.25rem; } .result-meta b { color:var(--g-900); }
mark { background:var(--gold-50); color:inherit; box-shadow:inset 0 -2px 0 var(--gold); padding:0 .1em; }
.empty-box { display:grid; justify-items:center; gap:.4rem; text-align:center; padding:3rem 1rem; background:#fff; border:1.5px dashed var(--n-300); border-radius:14px; color:var(--ink-3); }
.empty-box i { font-size:2.2rem; color:var(--g-300); } .empty-box strong { color:var(--g-950); font-size:1.05rem; }
.pager { display:flex; flex-wrap:wrap; justify-content:center; gap:.4rem; margin-top:2rem; }
.pager a, .pager span { min-width:40px; height:40px; display:grid; place-items:center; padding:0 .6rem; border-radius:8px; border:1.5px solid var(--n-300); background:#fff; font-weight:700; font-size:.88rem; }
.pager a:hover { border-color:var(--g-700); color:var(--g-800); }
.pager .on { background:var(--g-900); border-color:var(--g-900); color:#fff; } .pager .gap { border:0; background:none; }

/* การ์ดข่าว */
.card-grid { display:grid; gap:1.25rem; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); }
.news-card { display:flex; flex-direction:column; background:#fff; border:1px solid var(--n-300); border-radius:14px; overflow:hidden; transition:box-shadow .25s,transform .25s; }
.news-card:hover { box-shadow:var(--shadow); transform:translateY(-3px); }
.nc-media { position:relative; display:block; aspect-ratio:16/10; background:var(--g-50); overflow:hidden; }
.nc-media img { width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.nc-media.noimg img { object-fit:contain; padding:2.5rem; opacity:.35; }
.news-card:hover .nc-media img { transform:scale(1.04); }
.nc-media .datebox { position:absolute; left:.75rem; top:.75rem; box-shadow:0 6px 16px -8px rgba(0,0,0,.5); }
.nc-body { display:flex; flex-direction:column; gap:.45rem; padding:1rem 1.1rem 1.1rem; flex:1; }
.nc-body h2 { font-size:1rem; font-weight:800; color:var(--g-950); display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.nc-body h2 a:hover { color:var(--g-700); }
.nc-body p { font-size:.84rem; color:var(--ink-3); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.nc-foot { display:flex; justify-content:space-between; align-items:center; margin-top:auto; padding-top:.7rem; border-top:1px solid var(--line); font-size:.8rem; color:var(--ink-3); }
.nc-foot a { font-weight:800; color:var(--g-800); }
.feed-card { background:#fff; border:1px solid var(--line); border-radius:14px; padding:0 1rem; }
.feed-card li:last-child { border-bottom:0; }
.ext.dark { color:var(--g-900); border-color:var(--gold-deep); background:var(--gold-50); }

/* อัลบั้มภาพ */
.album-grid { display:grid; gap:1.25rem; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); }
.album-card { display:flex; flex-direction:column; background:#fff; border:1px solid var(--n-300); border-radius:14px; overflow:hidden; transition:.25s; }
.album-card:hover { box-shadow:var(--shadow); transform:translateY(-3px); }
.ac-img { position:relative; aspect-ratio:4/3; background:var(--g-950); overflow:hidden; }
.ac-img::before, .ac-img::after { content:""; position:absolute; inset:auto 8% -6px; height:10px; border-radius:0 0 8px 8px; background:rgba(255,255,255,.25); z-index:1; }
.ac-img img { width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.album-card:hover .ac-img img { transform:scale(1.05); }
.ac-img em { position:absolute; right:.6rem; bottom:.6rem; z-index:2; font-style:normal; font-size:.75rem; font-weight:800; color:#fff; background:rgba(var(--g-rgb,11,58,38),.88); border:1px solid rgba(var(--gold-rgb,232,178,58),.6); border-radius:6px; padding:.15rem .5rem; }
.ac-body { display:flex; flex-direction:column; gap:.35rem; padding:.9rem 1rem 1rem; }
.ac-body time { font-size:.75rem; color:var(--gold-ink); font-weight:700; }
.ac-body strong { color:var(--g-950); font-size:.95rem; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.ac-body small { color:var(--ink-3); font-size:.75rem; }

/* แถบเมนูข้าง */
.side-nav { background:#fff; border:1px solid var(--line); border-top:3px solid var(--gold); border-radius:14px; padding:1rem; position:sticky; top:84px; max-height:calc(100vh - 100px); overflow:auto; }
.side-nav > .btn { margin-bottom:.75rem; }
.sn-all, .sn-link, .sn-cat a { display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding:.55rem .7rem; border-radius:8px; font-size:.88rem; font-weight:600; color:var(--n-800); }
.sn-all { font-weight:800; color:var(--g-950); gap:.6rem; justify-content:flex-start; }
.sn-all:hover, .sn-link:hover, .sn-cat a:hover { background:var(--g-50); color:var(--g-900); }
.sn-all.on, .sn-link.on, .sn-cat a.on { background:var(--g-900); color:#fff; }
.sn-link small, .sn-cat small { font-size:.72rem; color:var(--ink-3); background:var(--n-100); border-radius:99px; padding:0 .45rem; flex:none; }
.sn-cat a.on small, .sn-link.on small { background:rgba(255,255,255,.2); color:#fff; }
.sn-cat { border-top:1px solid var(--line); }
.sn-cat summary { display:flex; justify-content:space-between; align-items:center; gap:.5rem; padding:.7rem .5rem; cursor:pointer; list-style:none; font-weight:800; font-size:.9rem; color:var(--g-950); }
.sn-cat summary::-webkit-details-marker { display:none; }
.sn-cat summary::after { content:"\f078"; font:900 .65rem "Font Awesome 6 Free"; color:var(--ink-3); transition:transform .2s; }
.sn-cat[open] summary::after { transform:rotate(180deg); }
.sn-cat a { padding-left:1rem; }
.side-note { font-size:.75rem; color:var(--ink-3); margin-top:1rem; padding-top:.75rem; border-top:1px solid var(--line); }
@media (max-width:1023px) { .side-nav { position:static; max-height:none; } }

/* รายการเอกสาร */
.doc-list { display:grid; gap:.6rem; }
.doc { display:flex; align-items:center; gap:1rem; background:#fff; border:1px solid var(--line); border-radius:12px; padding:.85rem 1rem; transition:.2s; }
.doc:hover { border-color:var(--g-300); box-shadow:0 12px 30px -24px rgba(var(--g-rgb,11,58,38),.6); }
.doc-ic { font-size:1.6rem; color:var(--g-800); width:2rem; text-align:center; flex:none; }
.doc-ic.fa-file-pdf { color:#c62828; } .doc-ic.fa-file-word { color:#1565c0; } .doc-ic.fa-file-excel { color:var(--g-800); }
.doc-txt { flex:1; min-width:0; }
.doc-txt strong { display:block; color:var(--g-950); font-size:.94rem; overflow-wrap:anywhere; }
.doc-txt small { font-size:.75rem; color:var(--ink-3); } .doc-txt small a { color:var(--g-800); font-weight:700; }
.doc .btn { flex:none; }
@media (max-width:600px) { .doc { flex-wrap:wrap; } .doc .btn { width:100%; } }

/* บุคลากร */
.type-row { display:flex; flex-wrap:wrap; align-items:center; gap:.75rem; margin-bottom:.75rem; }
.type-label { font-size:.72rem; letter-spacing:.2em; font-weight:800; color:var(--gold-ink); min-width:6.5rem; }
.org { position:relative; margin-top:2rem; display:grid; gap:1.5rem; }
.org-row { display:flex; flex-wrap:wrap; justify-content:center; gap:1.25rem; }
.org-line { display:block; width:2px; height:28px; margin:-1rem auto -.5rem; background:var(--gold-deep); }
.person { width:210px; background:#fff; border:1px solid var(--n-300); border-radius:14px; overflow:hidden; text-align:center; transition:.25s; }
.person:hover { box-shadow:var(--shadow); }
.org-row.lead .person { width:250px; border-top:4px solid var(--gold); }
.ps-img { aspect-ratio:4/5; background:linear-gradient(160deg,var(--g-25),var(--g-75)); display:grid; place-items:center; overflow:hidden; }
.ps-img img { width:100%; height:100%; object-fit:cover; object-position:top; }
.ps-img > i { font-size:3.5rem; color:var(--g-300); }
.ps-body { padding:.85rem .8rem 1rem; display:grid; gap:.25rem; }
.ps-body strong { font-family:var(--serif); color:var(--g-950); font-size:.98rem; }
.ps-body > span { font-size:.8rem; color:var(--ink-3); }
.ps-tel { font-size:.8rem; font-weight:700; color:var(--g-800); }
.ps-resp { font-size:.78rem; text-align:left; margin-top:.3rem; } .ps-resp summary { cursor:pointer; color:var(--g-800); font-weight:700; text-align:center; }
@media (max-width:480px) { .person, .org-row.lead .person { width:calc(50% - .65rem); } }

/* ITA */
.ita-summary { display:grid; gap:1.25rem; align-items:center; background:#fff; border:1px solid var(--line); border-top:4px solid var(--gold); border-radius:16px; padding:1.25rem 1.5rem; margin-bottom:1.5rem; }
@media (min-width:900px) { .ita-summary { grid-template-columns:auto 1fr auto; } }
.its-stat { display:flex; align-items:center; gap:.75rem; } .its-stat b { font-family:var(--serif); font-size:3rem; color:var(--g-900); line-height:1; } .its-stat span { font-size:.82rem; color:var(--ink-3); }
.its-bar .bar { height:12px; border-radius:99px; background:var(--g-50); overflow:hidden; border:1px solid var(--g-100); }
.its-bar .bar i { display:block; height:100%; background:linear-gradient(90deg,var(--g-700),var(--g-500)); border-radius:99px; }
.its-bar small { display:block; margin-top:.4rem; font-size:.78rem; color:var(--ink-3); }
.its-act { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.ita-cat { background:#fff; border:1px solid var(--line); border-radius:14px; margin-bottom:.75rem; overflow:hidden; }
.ita-cat summary { display:flex; align-items:center; gap:.9rem; padding:1rem 1.25rem; cursor:pointer; list-style:none; }
.ita-cat summary::-webkit-details-marker { display:none; }
.ita-cat[open] summary { border-bottom:1px solid var(--line); background:var(--g-25); }
.ita-cat .chev { margin-left:.5rem; color:var(--ink-3); transition:transform .2s; } .ita-cat[open] .chev { transform:rotate(180deg); }
.ic-range { font-size:.72rem; font-weight:800; color:var(--gold-ink); background:var(--gold-50); border:1px solid var(--gold-deep); border-radius:6px; padding:.1rem .5rem; white-space:nowrap; }
.ita-cat summary strong { flex:1; font-family:var(--serif); color:var(--g-950); font-size:1.05rem; }
.ic-count { font-size:.78rem; font-weight:800; color:var(--ink-3); } .ic-count.ok { color:var(--g-700); }
.ita-list { padding:.25rem 1.25rem; }
.ita-item { display:grid; grid-template-columns:auto 1fr auto; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--line); }
.ita-item:last-child { border-bottom:0; }
.o-no { width:48px; height:48px; border-radius:12px; background:var(--g-900); color:var(--gold); display:grid; place-items:center; font-weight:800; font-size:.9rem; }
.ita-item h3 { font-size:.96rem; color:var(--g-950); }
.ita-item p { font-size:.82rem; color:var(--ink-3); margin-top:.2rem; }
.ita-item .pending { color:var(--gold-ink); }
.ita-links { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.5rem; }
.ita-links a { display:inline-flex; gap:.4rem; align-items:center; font-size:.8rem; font-weight:700; color:var(--g-900); border:1px solid var(--g-200); background:var(--g-25); border-radius:8px; padding:.25rem .65rem; }
.ita-links a:hover { background:var(--g-900); color:#fff; }
.state { align-self:start; font-size:.72rem; font-weight:800; white-space:nowrap; padding:.15rem .55rem; border-radius:6px; background:var(--n-100); color:var(--ink-3); }
.state.ok { background:var(--g-50); color:var(--g-800); border:1px solid var(--g-200); }
@media (max-width:640px) { .ita-item { grid-template-columns:auto 1fr; } .state { grid-column:2; justify-self:start; } }
.note-box { display:flex; gap:1rem; align-items:flex-start; margin-top:1.5rem; background:var(--g-950); color:#fff; border-radius:14px; padding:1.25rem 1.5rem; border-left:4px solid var(--gold); }
.note-box > i { font-size:1.5rem; color:var(--gold); } .note-box p { font-size:.88rem; color:rgba(255,255,255,.85); margin-top:.2rem; } .note-box a { color:var(--gold); text-decoration:underline; }

/* e-Service */
.steps-row { display:grid; gap:1rem; margin-bottom:2rem; counter-reset:none; }
@media (min-width:768px) { .steps-row { grid-template-columns:repeat(3,1fr); } }
.steps-row li { display:flex; gap:.9rem; align-items:center; background:#fff; border:1px solid var(--line); border-radius:12px; padding:1rem 1.1rem; }
.steps-row b { flex:none; width:42px; height:42px; border-radius:50%; background:var(--gold); color:var(--g-950); display:grid; place-items:center; font-family:var(--serif); font-size:1.2rem; }
.steps-row strong { display:block; color:var(--g-950); } .steps-row small { font-size:.78rem; color:var(--ink-3); }
.svc-layout { display:grid; gap:2rem; align-items:start; }
@media (min-width:1024px) { .svc-layout { grid-template-columns:1fr 340px; } }
.form-grid { display:grid; gap:.85rem; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); }
.form-card { display:flex; flex-direction:column; gap:.6rem; background:#fff; border:1px solid var(--n-300); border-radius:12px; padding:1.1rem; transition:.25s; }
.form-card:hover { border-color:var(--g-700); box-shadow:var(--shadow); transform:translateY(-2px); }
.fc-ic { width:46px; height:46px; border-radius:12px; display:grid; place-items:center; background:var(--g-25); border:1.5px solid var(--g-200); color:var(--g-800); font-size:1.2rem; }
.form-card strong { color:var(--g-950); font-size:.93rem; flex:1; }
.form-card small { font-size:.78rem; font-weight:800; color:var(--g-800); }
.svc-side { display:grid; gap:1rem; position:sticky; top:84px; }
.track-card { background:var(--g-950); color:#fff; border-radius:16px; border-top:4px solid var(--gold); padding:1.35rem; display:grid; gap:.7rem; }
.track-card h2 { font-family:var(--serif); font-size:1.3rem; } .track-card p, .track-card small { font-size:.8rem; color:rgba(255,255,255,.75); }
.track-card input { min-height:46px; border-radius:10px; border:1.5px solid rgba(255,255,255,.3); background:rgba(255,255,255,.08); color:#fff; padding:0 .9rem; }
.track-card input::placeholder { color:rgba(255,255,255,.5); }
.side-card { background:#fff; border:1px solid var(--line); border-radius:14px; padding:1.1rem; display:grid; gap:.2rem; }
.side-card.soft { background:var(--g-25); border-color:var(--g-100); gap:.6rem; }
.side-card h3 { font-family:var(--serif); color:var(--g-950); font-size:1.05rem; margin-bottom:.4rem; }
.side-card p { font-size:.85rem; color:var(--ink-2); }
.side-card > a:not(.btn) { display:flex; gap:.8rem; align-items:center; padding:.6rem .4rem; border-radius:8px; font-size:.88rem; font-weight:700; color:var(--g-950); }
.side-card > a:not(.btn):hover { background:var(--g-50); }
.side-card > a > i { width:36px; height:36px; flex:none; border-radius:10px; display:grid; place-items:center; background:var(--g-50); color:var(--g-800); }
.side-card a small { display:block; font-size:.74rem; font-weight:500; color:var(--ink-3); }
@media (max-width:1023px) { .svc-side { position:static; } }

/* กระทู้ */
.topic-list { background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.topic-list li + li { border-top:1px solid var(--line); }
.topic-list a { display:flex; align-items:center; gap:1rem; padding:1rem 1.1rem; }
.topic-list a:hover { background:var(--g-25); } .topic-list li.pinned { background:var(--gold-50); }
.avatar { flex:none; width:42px; height:42px; border-radius:50%; background:var(--g-900); color:var(--gold); display:grid; place-items:center; font-weight:800; }
.pinned .avatar { background:var(--gold); color:var(--g-950); }
.tp-txt { flex:1; min-width:0; } .tp-txt strong { display:block; color:var(--g-950); } .tp-txt small { font-size:.76rem; color:var(--ink-3); }
.tp-num { text-align:center; min-width:52px; line-height:1.15; } .tp-num b { display:block; font-family:var(--serif); color:var(--g-900); } .tp-num small { font-size:.68rem; color:var(--ink-3); }
@media (max-width:600px) { .tp-num:last-child { display:none; } }
.post { background:#fff; border:1px solid var(--line); border-radius:14px; padding:1.1rem 1.25rem; margin-bottom:.85rem; }
.post.main-post { border-top:4px solid var(--gold); }
.post.staff { border-left:4px solid var(--g-700); background:var(--g-25); }
.post header { display:flex; gap:.8rem; align-items:center; margin-bottom:.8rem; }
.post header strong { display:block; color:var(--g-950); } .post header small { font-size:.76rem; color:var(--ink-3); }

/* ค้นหา */
.big-search { display:flex; align-items:center; gap:.75rem; background:#fff; border:2px solid var(--g-800); border-radius:14px; padding:.4rem .4rem .4rem 1.1rem; box-shadow:0 20px 40px -30px rgba(var(--g-rgb,11,58,38),.6); margin-bottom:1.25rem; }
.big-search > i { color:var(--g-800); font-size:1.1rem; }
.big-search input { flex:1; min-width:0; border:0; outline:0; min-height:50px; font-size:1.05rem; background:none; }
.search-hints.big { margin-top:0; }
.result-group { margin-top:2rem; }
.result-group .col-title { display:flex; gap:.6rem; align-items:baseline; margin-bottom:.5rem; }
.result-group .col-title i { color:var(--gold-deep); }
.result-list li { border-bottom:1px solid var(--line); }
.result-list a { display:grid; gap:.2rem; padding:.85rem .25rem; }
.result-list strong { color:var(--g-900); font-size:1rem; } .result-list a:hover strong { text-decoration:underline; }
.result-list span { font-size:.85rem; color:var(--ink-2); } .result-list small { font-size:.75rem; color:var(--ink-3); }
.result-group .link-under { margin-top:.75rem; }

/* ติดต่อ */
.contact-grid { display:grid; gap:2rem; align-items:start; }
@media (min-width:1024px) { .contact-grid { grid-template-columns:1fr 340px; } }
.addr { margin:.6rem 0 1.25rem; color:var(--ink-2); } .addr i { color:var(--gold-deep); }
.ct-cards { display:grid; gap:.75rem; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
.ct { display:grid; gap:.15rem; background:#fff; border:1px solid var(--line); border-radius:12px; padding:1rem 1.1rem; }
.ct > i { width:40px; height:40px; border-radius:50%; display:grid; place-items:center; background:var(--g-900); color:var(--gold); margin-bottom:.4rem; }
.ct small { font-size:.76rem; color:var(--ink-3); display:flex; gap:.4rem; align-items:center; } .ct b { color:var(--g-950); word-break:break-all; }
a.ct:hover { border-color:var(--g-700); }
.ct-social { display:flex; flex-wrap:wrap; gap:.6rem; margin:1.25rem 0; }
.map-frame { border-radius:14px; overflow:hidden; border:1px solid var(--line); height:360px; background:var(--g-50); }
.map-frame iframe { width:100%; height:100%; border:0; }
.contact-side { display:grid; gap:1rem; }
.sos-card { background:var(--g-950); color:#fff; border-radius:16px; border:1.5px solid var(--gold-deep); padding:1.25rem; }
.sos-card .eyebrow::before { display:none; }
.sos-card a { display:flex; justify-content:space-between; align-items:center; padding:.6rem 0; border-bottom:1px solid rgba(255,255,255,.12); font-size:.88rem; }
.sos-card a:last-child { border-bottom:0; } .sos-card b { font-family:var(--serif); font-size:1.5rem; color:var(--gold); }
.qr-card { justify-items:center; text-align:center; margin:0; } .qr-card img { width:160px; } .qr-card figcaption { font-size:.8rem; color:var(--ink-3); }
.dept { margin-top:3rem; }
.dept-grid { display:grid; gap:.75rem; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); }
.dept-card { display:flex; gap:.9rem; align-items:center; background:#fff; border:1px solid var(--line); border-radius:12px; padding:.9rem 1rem; }
.dept-card:hover { border-color:var(--g-700); }
.dept-card > i:first-child { width:40px; height:40px; flex:none; border-radius:10px; display:grid; place-items:center; background:var(--g-50); color:var(--g-800); }
.dept-card span { flex:1; } .dept-card strong { display:block; color:var(--g-950); } .dept-card small { font-size:.75rem; color:var(--ink-3); }
.dept-card > i:last-child { color:var(--g-700); font-size:.8rem; }

/* ประชากร */
.stat-grid { display:grid; gap:1rem; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); }
.stat { background:#fff; border:1px solid var(--line); border-radius:14px; padding:1.25rem; display:grid; gap:.15rem; }
.stat.big { background:var(--g-950); color:#fff; border-top:4px solid var(--gold); }
.stat > i { font-size:1.4rem; color:var(--gold-deep); margin-bottom:.4rem; }
.stat small { font-size:.8rem; color:var(--ink-3); } .stat.big small, .stat.big span { color:rgba(255,255,255,.75); }
.stat b { font-family:var(--serif); font-size:2.2rem; line-height:1.2; color:var(--g-900); } .stat.big b { color:var(--gold); }
.stat span { font-size:.8rem; color:var(--ink-3); }
.gender-bar { display:flex; height:34px; border-radius:10px; overflow:hidden; margin:1.25rem 0 2rem; font-size:.78rem; font-weight:800; }
.gender-bar i { display:flex; align-items:center; padding:0 .8rem; background:var(--g-800); color:#fff; white-space:nowrap; }
.gender-bar i:last-child { flex:1; justify-content:flex-end; background:var(--gold); color:var(--g-950); }
.bars { display:flex; align-items:flex-end; gap:.5rem; height:180px; padding:1rem; background:#fff; border:1px solid var(--line); border-radius:14px; margin:.75rem 0 2rem; }
.bar-col { flex:1; height:100%; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; gap:.3rem; }
.bar-col i { width:100%; max-width:42px; border-radius:6px 6px 0 0; background:linear-gradient(var(--g-600),var(--g-900)); }
.bar-col small { font-size:.68rem; color:var(--ink-3); }
.table-wrap { overflow-x:auto; background:#fff; border:1px solid var(--line); border-radius:14px; }
.data-table { width:100%; border-collapse:collapse; font-size:.88rem; }
.data-table th { text-align:left; background:var(--g-950); color:#fff; font-weight:700; padding:.7rem .9rem; white-space:nowrap; }
.data-table td { padding:.6rem .9rem; border-top:1px solid var(--line); }
.data-table tbody tr:nth-child(even) { background:var(--g-25); }
.data-table tfoot td { font-weight:800; background:var(--gold-50); border-top:2px solid var(--gold-deep); }
.data-table .num { text-align:right; font-variant-numeric:tabular-nums; }
.bar-cell { width:22%; min-width:100px; } .bar-cell i { display:block; height:10px; border-radius:99px; background:linear-gradient(90deg,var(--g-600),var(--gold)); }

/* แผนผังเว็บไซต์ */
.map-grid { display:grid; gap:1.25rem; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); }
.map-col { background:#fff; border:1px solid var(--line); border-top:3px solid var(--gold); border-radius:14px; padding:1.15rem; }
.map-col h2 { display:flex; align-items:center; gap:.7rem; font-family:var(--serif); font-size:1.15rem; color:var(--g-950); }
.map-col h3 { font-size:.95rem; color:var(--g-950); margin-bottom:.4rem; }
.map-col p { margin:.4rem 0 .6rem; }
.map-col li a { display:block; padding:.35rem 0; font-size:.88rem; color:var(--n-800); border-bottom:1px dashed var(--line); }
.map-col li a:hover { color:var(--g-700); }
.map-grid.small .map-col { border-top-width:1px; }

/* หน้ารายละเอียด */
.detail-side { display:grid; gap:1rem; position:sticky; top:84px; }
.detail-side .side-list { position:static; }
.mini-card { display:flex; gap:.8rem; align-items:center; padding:.7rem 0; border-bottom:1px solid var(--line); }
.mini-card img { width:84px; height:60px; object-fit:cover; border-radius:8px; flex:none; }
.mini-card strong { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:.86rem; color:var(--g-950); }
.mini-card small { font-size:.72rem; color:var(--ink-3); }
.mini-card:hover strong { color:var(--g-700); }
.side-list .btn { margin-top:.9rem; }
.share { display:flex; align-items:center; gap:.5rem; margin-top:2rem; padding-top:1.1rem; border-top:1px solid var(--line); font-size:.85rem; font-weight:700; color:var(--ink-3); }
.share a, .share button { width:40px; height:40px; border-radius:50%; display:grid; place-items:center; border:1.5px solid var(--n-300); background:#fff; color:var(--g-900); }
.share a:hover, .share button:hover { background:var(--g-900); color:#fff; border-color:var(--g-900); }
.prev-next { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:1rem; }
.prev-next a { display:grid; gap:.2rem; background:#fff; border:1px solid var(--line); border-radius:12px; padding:.9rem 1.1rem; }
.prev-next a:hover { border-color:var(--g-700); }
.prev-next .nx { text-align:right; grid-column:2; }
.prev-next small { font-size:.75rem; font-weight:800; color:var(--gold-ink); }
.prev-next strong { font-size:.88rem; color:var(--g-950); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.pics a { display:block; overflow:hidden; border-radius:8px; cursor:zoom-in; } .pics a img { transition:transform .4s; } .pics a:hover img { transform:scale(1.06); }
.lightbox { width:100vw; height:100vh; max-width:none; max-height:none; margin:0; padding:0; border:0; background:rgba(28,28,28,.94); }
.lightbox[open] { display:grid; place-items:center; }
.lightbox::backdrop { background:transparent; }
.lightbox img { max-width:92vw; max-height:84vh; object-fit:contain; border-radius:6px; }
.lb-x, .lb-nav { position:fixed; width:46px; height:46px; border-radius:50%; border:1px solid rgba(255,255,255,.35); background:rgba(255,255,255,.1); color:#fff; display:grid; place-items:center; }
.lb-x { top:1rem; right:1rem; } .lb-nav { top:50%; transform:translateY(-50%); } .lb-nav.prev { left:1rem; } .lb-nav.next { right:1rem; }
.lb-count { position:fixed; bottom:1.25rem; left:0; right:0; text-align:center; color:#fff; font-size:.85rem; }
@media (max-width:1023px) { .detail-side { position:static; } }
@media print { .detail-side, .share, .prev-next, .side-nav, .svc-side, .toolbar, .pager, .its-act { display:none !important; } .ita-cat:not([open]) > * { display:block; } }

/* =========================================================
   V14-1 · ส่วนที่ต่างจาก V14 (เอกลักษณ์ของตัวเอง)
   สี: น้ำเงินคราม + ส้มอำพัน · หัวเรื่อง Prompt · มุมโค้งใหญ่ ปุ่มทรงแคปซูล
   Hero สลับด้าน · บริการอยู่ก่อนข่าว · ผู้บริหาร/รางวัล/หัวหน้าในพื้นสว่าง
   ========================================================= */
:root { --r:18px; --shadow:0 22px 44px -26px rgba(var(--g-rgb,11,58,38),.5); }
.h-serif, .brand-txt strong, .hero-title { font-weight:700; letter-spacing:-.01em; }
.btn { border-radius:99px; padding-inline:1.3rem; }
.eyebrow { display:inline-flex; gap:.45rem; background:var(--gold-50); color:var(--gold-ink); padding:.28rem .8rem; border-radius:99px; letter-spacing:.06em; font-size:.74rem; text-transform:none; }
.eyebrow::before { display:none; }
.eyebrow.light, .eyebrow.gold { background:rgba(255,255,255,.12); color:var(--gold); }
.link-under { border-bottom:2px dotted var(--g-300); }
.chip-green { border-radius:99px; padding:.2rem .75rem; }
.sec-head.line { border-bottom-style:dashed; }
.col-title { border-bottom:0; border-left:5px solid var(--gold); padding:.1rem 0 .1rem .8rem; margin-bottom:.5rem; font-family:var(--serif); font-size:1.15rem; }
.sub { border-bottom:0; border-left:5px solid var(--gold); padding:0 0 0 .8rem; }
.datebox { background:var(--g-900); border:0; border-radius:12px; padding:.4rem 0; }
.datebox b { color:#fff; } .datebox small { color:var(--g-200); }

/* ส่วนหัว: แถบบนพื้นสว่าง ตราทรงเหลี่ยมมน */
.topbar { background:var(--g-50); color:var(--g-950); border-bottom:1px solid var(--g-100); }
.a11y { border-color:var(--n-300); background:#fff; } .a11y button { color:var(--g-950); }
.a11y button[aria-pressed="true"] { background:var(--g-900); color:#fff; }
.tb-btn, .lang { border-color:var(--n-300); background:#fff; color:var(--g-950); }
.tb-btn[aria-pressed="true"] { background:var(--g-950); color:#fff; }
.lang i { color:var(--gold-deep); } .lang select { color:var(--g-950); }
.tb-staff { border-color:var(--g-900); color:var(--g-900); background:#fff; } .tb-staff:hover { background:var(--g-900); color:#fff; }
.mainbar { border-bottom:1px solid var(--line); box-shadow:0 8px 24px -20px rgba(var(--g-rgb,11,58,38),.5); }
.brand-seal { border-radius:16px; padding:0; background:#fff; border:2px solid var(--g-100); box-shadow:none; }
.brand-seal img { border-radius:13px; }
.nav-top { position:relative; }
.nav-top::after { content:""; position:absolute; left:.7rem; right:.35rem; bottom:.2rem; height:3px; border-radius:3px; background:var(--gold); transform:scaleX(0); transform-origin:left; transition:transform .25s; }
.has-mega:hover .nav-top::after, .nav-top:focus-visible::after { transform:scaleX(1); }
.mega { border-top-color:var(--g-700); border-radius:20px; } .mega-ic { border-radius:50%; }
.round-btn { border-radius:14px; }
.alert-strip { background:var(--gold-50); border-bottom-color:rgba(217,122,30,.3); }
.alert-strip .chip-gold { background:var(--g-900); color:#fff; }

/* Hero: ภาพอยู่ซ้าย ข้อความอยู่ขวา พื้นไล่เฉด + ลายจุด */
.hero { background:linear-gradient(135deg,#fff 0%,var(--g-50) 55%,var(--g-100) 100%); padding:2.5rem 0 2.5rem; }
.hero::before { content:""; position:absolute; inset:0; background:radial-gradient(rgba(var(--g-rgb,11,58,38),.08) 1.5px,transparent 1.5px) 0 0/22px 22px; -webkit-mask:linear-gradient(120deg,transparent 35%,#000); mask:linear-gradient(120deg,transparent 35%,#000); pointer-events:none; }
.hero-bg, .hero-wave { display:none; }
.hero-title { font-size:clamp(2.6rem,5.6vw,4.4rem); line-height:1.15; margin:.9rem 0 .7rem; text-shadow:none; color:var(--g-950); }
.hero-title small { display:block; font-size:1rem; font-weight:600; color:var(--gold-ink); letter-spacing:.04em; margin-bottom:.2rem; }
.hero-rule { width:72px; height:6px; border-radius:99px; background:var(--gold); box-shadow:none; }
.hero-tag { display:inline-block; margin-top:1rem; background:var(--g-900); color:#fff; border-radius:99px; padding:.3rem .95rem; letter-spacing:.12em; font-size:.66rem; }
.hero-quote { position:relative; border-left:0; background:#fff; border:1px solid var(--g-100); border-radius:16px; padding:.9rem 1rem .9rem 3rem; color:var(--ink-2); }
.hero-quote::before { content:"\f10d"; font:900 1.1rem "Font Awesome 6 Free"; position:absolute; left:1rem; top:.95rem; color:var(--gold-deep); }
.hero-lead { font-size:1.05rem; }
.hero-btns { flex-direction:row; flex-wrap:wrap; }
.hero-stage { aspect-ratio:4/3; }
.hero-stage, .hero-stage .act-slide { border-radius:32px 32px 32px 8px; }
.hero-media .car-nav { top:auto; bottom:1rem; transform:none; border-radius:14px; }
.hero-media .car-nav.prev { left:1rem; } .hero-media .car-nav.next { left:4.2rem; right:auto; }
.car-ctl.float { left:auto; right:1rem; bottom:1rem; transform:none; }
.hero-strip { background:none; border-top:0; box-shadow:none; gap:1rem; margin-top:2.25rem; }
.hs-brand { border-radius:20px; background:linear-gradient(120deg,var(--g-950),var(--g-700)); }
.hs-cell { background:#fff; border:1px solid var(--g-100); border-radius:20px; box-shadow:0 16px 30px -26px rgba(var(--g-rgb,11,58,38),.6); transition:transform .2s; }
.hs-cell:hover { transform:translateY(-3px); }
.hs-cell i { border:0; border-radius:14px; background:var(--gold-50); color:var(--gold-ink); }
@media (min-width:1024px) { .hero-grid { grid-template-columns:1.15fr 1fr; } .hero-media { order:-1; } }

/* แถบสถานะ: พื้นขาว ป้ายแคปซูล */
.status-band { background:#fff; border-block:1px solid var(--line); color:var(--ink-2); }
.status-row { gap:.6rem; padding-block:.9rem; }
.st { background:var(--g-50); border:1px solid var(--g-100); border-radius:99px; padding:.4rem .95rem; }
.st > i { color:var(--gold-deep); } .st b { color:var(--g-950); } .st b.gold { color:#c62828; }
.dot-sep { color:var(--n-400); } .open-pill.bad { background:var(--n-200); color:var(--ink-2); }

/* บริการ: ไอคอนอยู่ซ้าย */
.services { background:#fff; }
.svc { flex-direction:row; justify-content:flex-start; gap:.9rem; min-height:84px; padding:0 1.1rem; text-align:left; border-radius:18px; border-color:var(--g-100); background:var(--g-25); }
.svc i { font-size:1.25rem; width:50px; height:50px; flex:none; display:grid; place-items:center; border-radius:16px; background:var(--g-900); color:var(--gold); }
.svc:hover { background:#fff; } .svc:hover i { transform:rotate(-6deg) scale(1.05); color:#fff; }
.svc-all { background:var(--g-900); color:#fff; border:0; border-radius:99px; } .svc-all:hover { background:var(--g-950); }
.svc-links a { text-decoration:none; background:#fff; border:1px solid var(--n-300); border-radius:99px; padding:.3rem .85rem; }
.svc-links a:hover { border-color:var(--g-700); }
.finder { border-radius:26px; } .finder-input { border-radius:99px; } .finder-list { border-radius:16px; }

/* ประกาศปักหมุด: การ์ดแนวนอน */
.pin-head { border-bottom:0; display:inline-flex; background:var(--g-900); color:#fff; border-radius:99px; padding:.35rem 1rem; font-size:.85rem; margin-bottom:1.25rem; }
.pin-head i { color:var(--gold); }
.pin-card { border-radius:22px; border-color:var(--g-100); }
.pin-flag { border-radius:99px; }
@media (min-width:640px) { .pin-card { flex-direction:row; } .pin-media { width:42%; height:auto; min-height:230px; padding:0 .75rem; flex:none; } .pin-body { border-top:0; border-left:1px solid var(--line); } }
.pin-foot { flex-wrap:wrap; }

/* ภาพกิจกรรม / ข่าว */
.activity { border-top:0; background:#fff; padding-top:3.5rem; }
.act-stage, .act-stage .act-slide { border-radius:26px; }
.thumb img { border-radius:14px; }
.news-cols { padding-top:.5rem; padding-bottom:3.5rem; }
.feed li { border-bottom-style:dashed; }

/* ผู้บริหาร: พื้นสว่าง รูปวงกลมอยู่ซ้าย */
.leader { background:linear-gradient(180deg,var(--g-50),#fff); color:var(--ink); border-top:1px solid var(--g-100); border-bottom:1px solid var(--g-100); padding:4rem 0; }
.leader::before { background:radial-gradient(rgba(var(--g-rgb,11,58,38),.07) 1.5px,transparent 1.5px) 0 0/22px 22px; -webkit-mask:linear-gradient(90deg,#000,transparent 45%); mask:linear-gradient(90deg,#000,transparent 45%); }
.leader .eyebrow.gold { background:var(--gold-50); color:var(--gold-ink); }
.leader-quote { color:var(--g-950); font-family:var(--serif); font-weight:700; }
.leader-quote .gold { color:var(--gold-deep); padding-left:0; }
.leader-tag { color:var(--g-800); border-top-color:var(--g-100); } .leader-tag::before { background:var(--gold); }
.leader-sub { color:var(--ink-3); }
.leader .btn-gold { background:var(--g-900); color:#fff; } .leader .btn-gold:hover { background:var(--g-950); }
.leader .btn-line { border-color:var(--g-900); color:var(--g-900); } .leader .btn-line:hover { background:var(--g-900); color:#fff; }
.leader-photo { width:min(100%,280px); text-align:center; }
.lp-frame { aspect-ratio:1; border-radius:50%; padding:8px; border:0; background:conic-gradient(var(--gold),var(--g-500),var(--g-900),var(--gold)); box-shadow:0 30px 50px -30px rgba(var(--g-rgb,11,58,38),.7); }
.lp-frame img { border-radius:50%; border:6px solid #fff; }
.leader-photo figcaption { position:static; margin-top:1rem; justify-content:center; background:#fff; border:1px solid var(--g-100); border-radius:99px; box-shadow:none; }
.leader-photo figcaption i { color:var(--gold-deep); font-size:1.1rem; }
@media (min-width:1024px) { .leader-grid { grid-template-columns:320px 1fr; gap:4rem; } .leader-photo { order:-1; margin:0; } }

/* แบบฟอร์ม: การ์ดอยู่ซ้าย */
.forms-band { background:linear-gradient(120deg,var(--g-950),var(--g-800)); border-top:0; }
.forms-band::before { background:radial-gradient(rgba(255,255,255,.08) 1.5px,transparent 1.5px) 0 0/22px 22px; }
.forms-card { border-top:0; border-left:6px solid var(--gold); border-radius:24px; }
.fc-row { border-radius:14px; }
@media (min-width:1024px) { .forms-card { order:-1; } }

/* นโยบาย / ธรรมาภิบาล / รางวัล */
.pol { border-top:1px solid var(--g-100); border-left:5px solid var(--gold); border-radius:20px; }
.pol-ic { border-radius:18px; background:var(--g-900); color:var(--gold); border:0; }
.gov-card { background:#fff; color:var(--ink); border:1px solid var(--g-100); border-top:5px solid var(--g-700); border-radius:22px; box-shadow:var(--shadow); }
.gov-card .eyebrow.light { background:var(--gold-50); color:var(--gold-ink); }
.gov-card h3 { color:var(--g-950); } .gov-card > p { color:var(--ink-2); }
.gov-card dl div { border-bottom-color:var(--line); } .gov-card dt { color:var(--ink-3); } .gov-card dd { color:var(--g-900); }
.gov-card > small { color:var(--ink-3); }
.gov-card .btn-gold { background:var(--g-900); color:#fff; }
.awards-band { background:var(--g-50); color:var(--ink); border-top:1px solid var(--g-100); }
.awards-band::before { display:none; }
.awards-band .eyebrow.light { background:var(--gold-50); color:var(--gold-ink); }
.awards-band .h-serif { color:var(--g-950); }
.aw-count b { color:var(--gold-deep); }
.aw { background:#fff; border-color:var(--g-100); border-radius:22px; box-shadow:0 20px 40px -32px rgba(var(--g-rgb,11,58,38),.6); }
.aw-no { background:var(--g-900); border:0; border-radius:99px; padding:.15rem .6rem; }
.aw-img { background:var(--g-100); }
.aw-body h3 { color:var(--g-950); } .aw-body h3 a:hover { color:var(--g-700); } .aw-body time { color:var(--gold-ink); }
.aw-foot { background:#fff; border-top:1px solid var(--g-100); }

/* สถานที่ / ลิงก์ */
.pl-tile { border-radius:24px; } .pl-cap { background:var(--g-900); border-top:0; }
.pl-board { border-radius:26px; } .pl-map, .pl-detail { border-radius:18px; } .pl-detail { border-top-color:var(--g-700); }
.pl-pin { border-radius:12px 12px 12px 2px; }
.rel { background:#fff; border-color:var(--g-100); border-radius:18px; }

/* ส่วนท้าย: มุมบนโค้ง */
.site-footer { background:linear-gradient(180deg,var(--g-950),var(--g-975,#0a2e0f)); border-top:0; border-radius:32px 32px 0 0; margin-top:1rem; }
.site-footer::after { content:""; position:absolute; top:0; left:10%; right:10%; height:5px; border-radius:0 0 6px 6px; background:var(--gold); }
.ft-sos { border-radius:20px; border-color:rgba(var(--gold-rgb,232,178,58),.6); background:rgba(255,255,255,.06); }
.map-lazy { border-radius:16px; }
.to-top { border-radius:16px; background:var(--gold); color:var(--g-950); border:0; padding:.7rem .85rem; }
.to-top span { display:none; }
.mobile-bar { border-top:1px solid var(--line); border-radius:18px 18px 0 0; }
.cookie, .search-dialog { border-top:0; border-left:5px solid var(--gold); border-radius:20px; }

/* หน้าใน: หัวหน้าพื้นสว่าง */
.page-head { background:linear-gradient(135deg,#fff,var(--g-50) 60%,var(--g-100)); color:var(--ink); border-bottom:1px solid var(--g-100); position:relative; overflow:hidden; }
.page-head::after { content:""; position:absolute; right:-60px; top:-60px; width:260px; height:260px; border-radius:50%; border:36px solid rgba(var(--gold-rgb,232,178,58),.16); pointer-events:none; }
.page-head .h-serif { color:var(--g-950); position:relative; }
.page-head .eyebrow.light { background:var(--gold-50); color:var(--gold-ink); }
.crumbs { color:var(--ink-3); } .crumbs i { color:var(--gold-deep); } .crumbs a:hover { color:var(--g-800); }
.page-lead { color:var(--ink-2); }
.tabs-pill a.on { background:var(--g-900); border-color:var(--g-900); box-shadow:none; }
.news-card, .album-card { border-radius:20px; border-color:var(--g-100); }
.side-nav, .side-list { border-top:1px solid var(--line); border-radius:20px; }
.prose-card { border-radius:24px; } .cover { border-radius:18px; }
.doc, .form-card, .person, .ita-cat, .topic-list, .post, .stat, .ct, .dept-card, .map-col { border-radius:18px; }
.ita-summary { border-top:1px solid var(--line); border-left:6px solid var(--gold); border-radius:22px; }
.o-no { border-radius:50%; }
.track-card, .sos-card { border-radius:22px; }
.track-card { border-top:0; background:linear-gradient(140deg,var(--g-950),var(--g-800)); }
.org-row.lead .person { border-top:1px solid var(--n-300); box-shadow:0 0 0 4px var(--gold-50), var(--shadow); }
.map-col { border-top:1px solid var(--line); border-left:5px solid var(--gold); }
.big-search { border-radius:99px; border-color:var(--g-700); }
.data-table th { background:var(--g-900); }
html[data-contrast="1"] :is(.topbar,.status-band,.leader,.awards-band,.page-head,.gov-card,.aw,.st,.hs-cell,.hero-quote) { background:#000 !important; border-color:#ff0 !important; }
@media print { .page-head { border:0; } .page-head::after { display:none; } }

/* =========================================================
   V14-1 รอบ 3 · ลายไทย + สีสด
   สีหลัก: คราม · ทอง · แดงชาด (+ มรกต ม่วง ส้ม ชมพู สำหรับไอคอนบริการ/นโยบาย)
   ลาย: ประจำยาม (พื้น) · กระจัง (ขอบแถบ) · ประจำยามคั่นหัวข้อ · กนกมุมการ์ด — เป็น SVG ในตัว ไม่มีไฟล์ภาพ
   ========================================================= */
:root {
  --chad:var(--g-800); --chad-ink:var(--g-900); --chad-50:var(--g-50); --emerald:var(--g-700); --violet:var(--g-900); --orange:#a67c00; --pink:var(--g-600); --sky:var(--g-800); --teal:var(--g-550,#2f9763); /* สีเน้นทั้งหมดอยู่ในโทนเขียว–ทอง */
  --thai-gold:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cg fill='none' stroke='%23e8b23a' stroke-opacity='.2' stroke-width='1'%3E%3Cpath d='M48 48c-3-4-3-8 0-13 3 5 3 9 0 13zM48 48c4-3 8-3 13 0-5 3-9 3-13 0zM48 48c3 4 3 8 0 13-3-5-3-9 0-13zM48 48c-4 3-8 3-13 0 5-3 9-3 13 0z'/%3E%3Ccircle cx='48' cy='48' r='1.500'/%3E%3C/g%3E%3C/svg%3E");
  --thai-ink:none;
  --kj-gold:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='14' viewBox='0 0 28 14'%3E%3Cpath d='M0 14C5 11 10 7 14 0c4 7 9 11 14 14z' fill='%23e8b23a'/%3E%3Cpath d='M7 14c3-2 5-5 7-9 2 4 4 7 7 9z' fill='%23125037'/%3E%3C/svg%3E");
  --kj-cream:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='14' viewBox='0 0 28 14'%3E%3Cpath d='M0 14C5 11 10 7 14 0c4 7 9 11 14 14z' fill='%23ffffff'/%3E%3Cpath d='M7 14c3-2 5-5 7-9 2 4 4 7 7 9z' fill='%23e8b23a'/%3E%3C/svg%3E");
  --yam-rule:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='14' viewBox='0 0 150 14'%3E%3Cpath d='M0 7h54M96 7h54' stroke='%23b7861c' stroke-width='2'/%3E%3Cpath d='M75 0l9 7-9 7-9-7z' fill='%23125037'/%3E%3Cpath d='M75 3.500l4.500 3.500-4.500 3.500-4.500-3.500z' fill='%23e8b23a'/%3E%3Ccircle cx='60' cy='7' r='2' fill='%23b7861c'/%3E%3Ccircle cx='90' cy='7' r='2' fill='%23b7861c'/%3E%3C/svg%3E");
  --kanok:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg fill='none' stroke='%23b7861c' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M2 54V14C2 7 7 2 14 2h40'/%3E%3Cpath d='M10 54V22c0-7 5-12 12-12h32' opacity='.45'/%3E%3Cpath d='M15 15c8 0 14 5 14 12 0 5-4 8-8 8s-6-3-6-6 2-4 4-4' stroke='%23125037'/%3E%3C/g%3E%3C/svg%3E");
}
.scroll-progress i { background:linear-gradient(90deg,var(--gold),var(--chad)); }
.btn-green { background:linear-gradient(135deg,var(--g-800),var(--g-950)); } .btn-green:hover { background:linear-gradient(135deg,var(--g-700),var(--g-900)); }
.btn-gold { background:linear-gradient(135deg,var(--gold-300,#f2c75c),var(--gold)); box-shadow:0 10px 20px -12px rgba(var(--gold-rgb,232,178,58),.9); }
.eyebrow { background:var(--chad-50); color:var(--chad-ink); }
.datebox { background:linear-gradient(160deg,var(--g-700),var(--g-950)); } .datebox small { color:var(--gold); }
.tabs-pill a.on { background:linear-gradient(135deg,var(--g-800),var(--g-950)); border-color:var(--g-900); }
.to-top { background:var(--gold); color:var(--g-950); }

/* ลายประจำยามคั่นใต้หัวข้อ section */
.sec-head h2::after { content:""; display:block; width:150px; height:14px; margin-top:.55rem; background:var(--yam-rule) no-repeat left center; }
.col-title { border-left-color:var(--gold); } .cols-2 > div:last-child .col-title { border-left-color:var(--chad); }

/* ส่วนหัว: แถบบนครามไล่เฉด ขอบกระจังห้อยใต้เมนู */
.topbar { background:linear-gradient(90deg,var(--g-950),var(--g-800)); color:#fff; border-bottom:0; }
.a11y { background:transparent; border-color:rgba(255,255,255,.3); } .a11y button { color:#fff; }
.a11y button[aria-pressed="true"] { background:var(--gold); color:var(--g-950); }
.tb-btn, .lang { background:transparent; border-color:rgba(255,255,255,.3); color:#fff; }
.tb-btn[aria-pressed="true"] { background:#fff; color:var(--g-950); }
.lang i { color:var(--gold); } .lang select { color:#fff; }
.tb-staff { background:var(--gold); border-color:var(--gold); color:var(--g-950); } .tb-staff:hover { background:#fff; border-color:#fff; color:var(--g-950); }
.mainbar { position:relative; border-bottom:3px solid var(--gold); }
.mainbar::after { content:""; position:absolute; left:0; right:0; top:calc(100% + 3px); height:9px; background:var(--kj-gold) repeat-x 0 0/18px 9px; transform:scaleY(-1); pointer-events:none; }
.alert-strip { padding-top:6px; }

/* Hero: ครามเข้ม–ม่วง ลายประจำยามทอง ชื่อเมืองไล่เฉดทอง */
.hero { background:linear-gradient(125deg,var(--g-950) 0%,var(--g-900) 45%,var(--g-800) 100%); color:#fff; padding-bottom:3.75rem; }
.hero::before { background:var(--thai-gold) 0 0/96px 96px; -webkit-mask:linear-gradient(110deg,rgba(0,0,0,.35),#000); mask:linear-gradient(110deg,rgba(0,0,0,.35),#000); }
.hero::after { content:""; position:absolute; left:0; right:0; bottom:0; height:14px; background:var(--kj-gold) repeat-x 0 0/28px 14px; }
.hero-copy .eyebrow { background:rgba(255,255,255,.14); color:var(--gold); }
.hero-title { background:linear-gradient(90deg,#fff3c4,var(--gold) 55%,#e0a800); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero-title small { color:#fff; -webkit-text-fill-color:#fff; }
.hero-rule { width:150px; height:14px; border-radius:0; background:var(--yam-rule) no-repeat left center; }
.hero-tag { background:var(--chad); }
.hero-quote { background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.22); color:#fff; } .hero-quote::before { color:var(--gold); }
.hero-lead { color:rgba(255,255,255,.9); }
.hero .btn-green { background:linear-gradient(135deg,var(--gold-300,#f2c75c),var(--gold)); color:var(--g-950); }
.hero .btn-outline { border-color:#fff; color:#fff; } .hero .btn-outline:hover { background:#fff; color:var(--g-900); }
.hero-stage { box-shadow:0 0 0 4px var(--gold), 0 0 0 11px rgba(var(--gold-rgb,232,178,58),.22), 0 40px 60px -30px rgba(0,0,0,.7); }
.hero-stage .act-slide { box-shadow:none; }
.hs-brand { background:linear-gradient(120deg,var(--chad),var(--orange)); } .hs-brand small { color:#fff; opacity:.9; } .hs-brand strong span { color:#fff3c4; }
.hs-cell { border:0; }
.hs-cell:nth-child(2) i { background:var(--g-50); color:var(--emerald); } .hs-cell:nth-child(3) i { background:var(--chad-50); color:var(--chad); } .hs-cell:nth-child(4) i { background:var(--g-75); color:var(--g-700); }

/* แถบสถานะ: ทองสด ปุ่มเหตุด่วนแดงชาด */
.status-band { background:linear-gradient(90deg,var(--gold),#e8b923); border-block:0; }
.st { background:#fff; border:0; box-shadow:0 6px 14px -10px rgba(var(--g-rgb,11,58,38),.6); }
.st:first-child { background:#c62828; color:#fff; } .st:first-child > i, .st:first-child b.gold { color:#fff; }
.st > i { color:var(--g-700); }

/* บริการ: ไอคอนคนละสี */
.svc { --c:var(--g-700); background:#fff; border-color:var(--line); border-bottom:4px solid var(--c); }
.svc i { background:var(--c); color:#fff; } .svc:hover i { color:#fff; } .svc:hover { border-color:var(--c); }
.svc:nth-child(8n+1) { --c:var(--chad); } .svc:nth-child(8n+2) { --c:var(--sky); } .svc:nth-child(8n+3) { --c:var(--violet); } .svc:nth-child(8n+4) { --c:var(--emerald); }
.svc:nth-child(8n+5) { --c:var(--orange); } .svc:nth-child(8n+6) { --c:var(--g-700); } .svc:nth-child(8n+7) { --c:var(--pink); } .svc:nth-child(8n+8) { --c:var(--teal); }
.svc-all { background:linear-gradient(90deg,var(--g-900),var(--g-800) 55%,var(--chad)); }
.finder, .gov-card, .pl-board { position:relative; }
.finder::before, .gov-card::before, .pl-board::before { content:""; position:absolute; left:6px; top:6px; width:56px; height:56px; background:var(--kanok) no-repeat; pointer-events:none; z-index:1; }
.finder::after, .pl-board::after { content:""; position:absolute; right:6px; bottom:6px; width:56px; height:56px; background:var(--kanok) no-repeat; transform:rotate(180deg); pointer-events:none; z-index:1; }
.finder-form { padding-left:2.5rem; } .finder-art { background:linear-gradient(160deg,var(--gold-50),var(--g-75)); }
.bar-gold { display:none; }

/* แบบฟอร์ม: คราม–ม่วง ลายประจำยาม ขอบกระจัง */
.forms-band { background:linear-gradient(120deg,var(--g-950),var(--g-800) 60%,var(--g-800)); padding:4.75rem 0; }
.forms-band::before { background:var(--thai-gold) 0 0/96px 96px; }
.forms-band::after { content:""; position:absolute; left:0; right:0; bottom:0; height:14px; background:var(--kj-cream) repeat-x 0 0/28px 14px; }
.forms-card { border-left-color:var(--chad); }
.fc-row > b { color:var(--chad); }
.steps-gold li::before { background:linear-gradient(135deg,var(--gold-300,#f2c75c),var(--gold)); }

/* ประกาศ / ข่าว / กิจกรรม */
.notices { background:var(--thai-ink) 0 0/96px 96px, var(--cream); }
.pin-head { background:linear-gradient(135deg,var(--chad),var(--orange)); } .pin-head i { color:#fff; }
.pin-flag { background:var(--chad); color:#fff; border:0; }
.pin-card { border-top:4px solid var(--gold); }
.chip-mini { color:var(--chad-ink); }
.act-count { background:var(--chad); border:0; }
.thumb.on img { border-color:var(--chad); box-shadow:0 0 0 2px var(--chad-50); }
.dots i.on { background:var(--chad); }

/* ธรรมาภิบาล / ผู้บริหาร */
.ledger-stat b { color:var(--chad); } .ticks { background:repeating-linear-gradient(90deg,var(--emerald) 0 3px,transparent 3px 6px); }
.ok-pill { color:var(--g-900); border-color:var(--g-200); background:var(--g-50); }
.gov-card { border-top-color:var(--chad); padding-top:2rem; }
.leader { background:var(--thai-ink) 0 0/96px 96px, linear-gradient(180deg,var(--gold-50),#fff); border-color:rgba(224,154,0,.3); }
.leader::before { display:none; }
.leader-quote .gold { color:var(--chad); }
.lp-frame { background:conic-gradient(var(--gold),var(--chad),var(--g-700),var(--gold)); }

/* นโยบาย: การ์ดคนละสี */
.pol { --c:var(--g-700); border-left-color:var(--c); } .pol-ic { background:var(--c); color:#fff; } .pol h3 b, .pol a { color:var(--c); }
.pol:nth-child(5n+1) { --c:var(--sky); } .pol:nth-child(5n+2) { --c:var(--violet); } .pol:nth-child(5n+3) { --c:var(--emerald); } .pol:nth-child(5n+4) { --c:var(--chad); } .pol:nth-child(5n+5) { --c:var(--orange); }

/* รางวัล: ทองอ่อนลายประจำยาม */
.awards-band { background:var(--thai-ink) 0 0/96px 96px, linear-gradient(180deg,var(--gold-50),#fff); border-top:0; }
.aw { border-top:4px solid var(--gold); } .aw-no { background:var(--chad); color:#fff; } .aw-count b { color:var(--chad); }

/* สถานที่ */
.pl-cap { background:linear-gradient(90deg,var(--g-950),var(--g-800)); } .pl-cap i { color:var(--gold); }
.pl-filters button.on { background:linear-gradient(135deg,var(--chad),var(--orange)); border-color:var(--chad); box-shadow:none; }
.pl-pin { background:var(--chad); border-color:#fff; } .pl-pin.on { background:var(--gold); border-color:var(--g-950); }
.pl-filters { padding-left:3.5rem; }
.pl-stats span { border-left-color:var(--chad); } .pl-stats b { color:var(--g-800); }

/* ส่วนท้าย: ครามเข้ม ลายประจำยาม ขอบกระจังทอง */
.site-footer { background:linear-gradient(180deg,var(--g-950),var(--g-975,#0a2e0f)); border-radius:0; border-top:4px solid var(--gold); padding-top:3.75rem; }
.site-footer::before { background:var(--thai-gold) 0 0/96px 96px; opacity:.6; }
.site-footer::after { content:""; position:absolute; top:0; left:0; right:0; height:14px; border-radius:0; background:var(--kj-gold) repeat-x 0 0/28px 14px; transform:scaleY(-1); }
.ft-sos { border-color:var(--gold-deep); background:rgba(198,40,40,.16); }
.mobile-bar { border-top:3px solid var(--gold); } .mobile-bar a[aria-current] i { color:var(--chad); }

/* หน้าใน: หัวหน้าครามลายไทย ขอบกระจัง */
.page-head { background:linear-gradient(120deg,var(--g-950),var(--g-800) 65%,var(--g-800)); color:#fff; border-bottom:0; padding-bottom:3.5rem; }
.page-head::before { content:""; position:absolute; inset:0; background:var(--thai-gold) 0 0/96px 96px; pointer-events:none; }
.page-head::after { right:auto; left:0; top:auto; bottom:0; width:100%; height:14px; border:0; border-radius:0; background:var(--kj-cream) repeat-x 0 0/28px 14px; }
.page-head > .container { position:relative; }
.page-head .h-serif { color:#fff; }
.page-head .eyebrow.light { background:rgba(255,255,255,.14); color:var(--gold); }
.crumbs { color:rgba(255,255,255,.8); } .crumbs i { color:var(--gold); } .crumbs a:hover { color:var(--gold); }
.page-lead { color:rgba(255,255,255,.88); }
.side-nav, .side-list, .ita-summary { border-top:4px solid var(--gold); }
.o-no { background:linear-gradient(135deg,var(--chad),var(--orange)); color:#fff; }
.track-card { background:var(--thai-gold) 0 0/96px 96px, linear-gradient(140deg,var(--g-950),var(--g-800)); }
.fc-ic { background:var(--chad-50); border-color:var(--g-200); color:var(--chad); }
.form-card:nth-child(3n+2) .fc-ic { background:var(--g-50); border-color:var(--g-200); color:var(--emerald); } .form-card:nth-child(3n) .fc-ic { background:var(--g-75); border-color:var(--g-200); color:var(--g-700); }
.stat.big { background:var(--thai-gold) 0 0/96px 96px, linear-gradient(140deg,var(--g-950),var(--g-800)); }
.gender-bar i { background:var(--g-700); } .bar-cell i { background:linear-gradient(90deg,var(--g-600),var(--chad)); }
html[data-contrast="1"] :is(.hero,.status-band,.forms-band,.page-head,.site-footer,.notices,.leader,.awards-band) { background:#000 !important; }
html[data-contrast="1"] .hero-title { -webkit-text-fill-color:#ff0; }
html[data-contrast="1"] :is(.hero::before,.site-footer::before,.page-head::before,.forms-band::before) { display:none; }
.gov-card::before { left:auto; right:6px; transform:rotate(90deg); } .gov-card { padding-top:1.5rem; }
.page-head { padding-top:3rem; }

/* =========================================================
   V14-1 รอบ 5 · ลายไทยแบบสบายตา
   เลิกปูลายถี่เต็มพื้น → ดอกประจำยามเล็กวางห่าง (96px) จาง ๆ และค่อย ๆ จางหายไปด้านหนึ่ง
   พื้นสว่างไม่ปูลาย ใช้ดอกประจำยามดวงใหญ่จาง ๆ ที่มุมแทน · ขอบกระจังเล็กลง
   ========================================================= */
:root { --thai-mark:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260' viewBox='0 0 260 260'%3E%3Cg fill='none' stroke='%23b7861c' stroke-opacity='.16' stroke-width='2'%3E%3Cpath d='M130 130c-22-30-22-62 0-98 22 36 22 68 0 98zM130 130c30-22 62-22 98 0-36 22-68 22-98 0zM130 130c22 30 22 62 0 98-22-36-22-68 0-98zM130 130c-30 22-62 22-98 0 36-22 68-22 98 0z'/%3E%3Cpath d='M130 130c-34-8-52-28-62-62 34 10 54 28 62 62zM130 130c8-34 28-52 62-62-10 34-28 54-62 62zM130 130c34 8 52 28 62 62-34-10-54-28-62-62zM130 130c-8 34-28 52-62 62 10-34 28-54 62-62z' stroke-opacity='.1'/%3E%3Ccircle cx='130' cy='130' r='10'/%3E%3Ccircle cx='130' cy='130' r='118' stroke-dasharray='2 10'/%3E%3C/g%3E%3C/svg%3E"); }
.hero::before, .forms-band::before, .page-head::before, .site-footer::before { -webkit-mask:linear-gradient(100deg,transparent 45%,#000); mask:linear-gradient(100deg,transparent 45%,#000); opacity:1; }
.site-footer::before { -webkit-mask:linear-gradient(180deg,#000,transparent 55%); mask:linear-gradient(180deg,#000,transparent 55%); }
.track-card, .stat.big { background:linear-gradient(140deg,var(--g-950),var(--g-800)); }
.notices { background:var(--thai-mark) no-repeat right -70px top -70px/260px, var(--cream); }
.leader { background:var(--thai-mark) no-repeat right -60px bottom -90px/300px, linear-gradient(180deg,var(--gold-50),#fff); }
.awards-band { background:var(--thai-mark) no-repeat left -80px top -80px/280px, linear-gradient(180deg,var(--gold-50),#fff); }
.hero::after, .forms-band::after, .site-footer::after, .page-head::after { height:10px; background-size:20px 10px; }
.mainbar::after { height:7px; background-size:14px 7px; opacity:.9; }
/* รอบ 7: เอาขอบลายกระจังใต้เมนูออก เหลือเส้นทองเรียบ */
.mainbar::after { display:none; }
.alert-strip { padding-top:0; }
.page-head { padding-top:2.5rem; }