:root{
  --navy:#123a63;
  --navy-2:#1d527f;
  --blue:#1675d1;
  --green:#23945d;
  --gold:#cda33b;
  --ink:#18324e;
  --muted:#6a7a8e;
  --line:#e7edf3;
  --surface:rgba(255,255,255,.88);
  --shadow:0 22px 65px rgba(18,58,99,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--ink);
  background:#f7faff;
  font-family:"Noto Sans Thai","Leelawadee UI","Tahoma",sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit}
.skip-link{
  position:fixed;left:12px;top:-80px;z-index:100;
  padding:10px 14px;background:#111;color:#fff;border-radius:8px;
}
.skip-link:focus{top:12px}
.site-shell{min-height:100vh;display:flex;flex-direction:column;overflow:hidden}
.container{width:min(1120px,calc(100% - 40px));margin:auto}
.topbar{
  position:relative;z-index:5;
  border-bottom:1px solid rgba(220,229,238,.7);
  background:rgba(255,255,255,.72);
  backdrop-filter:blur(14px);
}
.topbar-inner{
  min-height:44px;display:flex;align-items:center;justify-content:space-between;
  color:#64758a;font-size:12px;letter-spacing:.1px;
}
.topbar-right{display:flex;align-items:center;gap:12px}
.divider{width:1px;height:14px;background:#d7e0e9}
.hero{
  position:relative;flex:1;
  display:flex;align-items:center;
  min-height:calc(100vh - 120px);
  background:
    radial-gradient(circle at 12% 56%,rgba(219,235,253,.72),transparent 28%),
    radial-gradient(circle at 88% 58%,rgba(222,246,234,.68),transparent 29%),
    linear-gradient(180deg,#fbfdff 0%,#f7faff 100%);
}
.hero:before,.hero:after{
  content:"";position:absolute;border-radius:50%;filter:blur(2px);pointer-events:none;
}
.hero:before{
  width:520px;height:520px;left:-330px;bottom:-270px;
  border:1px solid rgba(50,126,201,.12);
  box-shadow:0 0 0 70px rgba(50,126,201,.035),0 0 0 140px rgba(50,126,201,.018);
}
.hero:after{
  width:480px;height:480px;right:-300px;top:-260px;
  border:1px solid rgba(43,151,97,.11);
  box-shadow:0 0 0 70px rgba(43,151,97,.03),0 0 0 140px rgba(43,151,97,.015);
}
.ambient{position:absolute;border-radius:50%;pointer-events:none}
.ambient-a{width:180px;height:180px;left:10%;top:18%;background:rgba(255,255,255,.75);box-shadow:0 15px 55px rgba(34,102,165,.07)}
.ambient-b{width:150px;height:150px;right:12%;bottom:20%;background:rgba(255,255,255,.7);box-shadow:0 15px 55px rgba(34,102,165,.06)}
.hero-inner{position:relative;z-index:2;padding:48px 0 34px}
.brand{text-align:center;max-width:940px;margin:0 auto 34px}
.brand-mark{
  width:88px;height:88px;margin:0 auto 17px;border-radius:50%;
  display:grid;place-items:center;
  background:rgba(255,255,255,.94);
  border:1px solid rgba(205,163,59,.38);
  box-shadow:0 15px 40px rgba(18,58,99,.10);
  overflow:hidden;
}
.brand-mark img{width:72px;height:72px;object-fit:contain}
.logo-fallback{
  color:var(--navy);font-weight:800;font-size:18px;line-height:1.05;text-align:center;
}
.eyebrow{
  margin:0 0 6px;color:#667890;font-size:12px;letter-spacing:2.8px;font-weight:700;
}
h1{
  margin:0;color:var(--navy);font-size:clamp(25px,3.2vw,40px);
  line-height:1.35;font-weight:750;letter-spacing:-.35px;
}
.gold-rule{
  width:72px;height:2px;margin:19px auto 14px;background:var(--gold);position:relative;
}
.gold-rule:after{
  content:"";position:absolute;width:7px;height:7px;left:50%;top:50%;
  transform:translate(-50%,-50%);background:var(--gold);border-radius:50%;
}
.tagline{margin:0;color:#5f7086;font-size:15px}
.entry-grid{
  width:min(820px,100%);margin:0 auto;
  display:grid;grid-template-columns:1fr 1fr;gap:18px;
}
.entry-card{
  position:relative;display:flex;align-items:center;gap:18px;
  min-height:182px;padding:28px 28px;
  text-decoration:none;border:1px solid rgba(255,255,255,.96);
  border-radius:24px;background:var(--surface);
  box-shadow:var(--shadow);backdrop-filter:blur(14px);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.entry-card:hover,.entry-card:focus-visible{
  transform:translateY(-4px);
  box-shadow:0 28px 75px rgba(18,58,99,.17);
  outline:none;
}
.entry-card:focus-visible{border-color:#8cbce9}
.entry-public{box-shadow:0 20px 60px rgba(22,117,209,.11)}
.entry-staff{box-shadow:0 20px 60px rgba(35,148,93,.10)}
.entry-icon{
  flex:0 0 66px;width:66px;height:66px;border-radius:50%;
  display:grid;place-items:center;
}
.entry-public .entry-icon{background:#e8f3ff;color:var(--blue)}
.entry-staff .entry-icon{background:#e7f6ee;color:var(--green)}
.entry-icon svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.entry-copy{min-width:0;text-align:left}
.entry-label{display:block;font-size:21px;font-weight:800;color:var(--navy)}
.entry-sub{display:block;margin-top:3px;font-size:13px;color:#556a82;font-weight:650}
.entry-desc{display:block;margin-top:10px;font-size:12px;color:#77879a;line-height:1.55}
.entry-arrow{
  position:absolute;right:24px;bottom:19px;font-size:21px;font-weight:700;
  transition:transform .2s ease;
}
.entry-card:hover .entry-arrow{transform:translateX(4px)}
.entry-public .entry-arrow{color:var(--blue)}
.entry-staff .entry-arrow{color:var(--green)}
.quick-links{
  width:min(900px,100%);margin:22px auto 0;
  display:grid;grid-template-columns:repeat(3,1fr);
  background:rgba(255,255,255,.65);border:1px solid rgba(226,233,240,.9);
  border-radius:18px;overflow:hidden;backdrop-filter:blur(12px);
}
.quick-links a{
  min-height:76px;display:flex;flex-direction:column;justify-content:center;align-items:center;
  gap:5px;padding:10px 8px;text-decoration:none;color:#536981;font-size:12px;
  border-right:1px solid var(--line);transition:background .15s,color .15s;
}
.quick-links a:last-child{border-right:0}
.quick-links a:hover,.quick-links a:focus-visible{background:#fff;color:var(--blue);outline:none}
.quick-icon{font-size:20px;line-height:1}
.footer{
  position:relative;z-index:3;background:#fff;border-top:1px solid var(--line);
}
.footer-inner{
  min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px;
  color:#7a899a;font-size:11px;line-height:1.7;
}
.footer-inner strong{display:block;color:#51677f;font-size:12px}
.footer-meta{text-align:right}
@media(max-width:780px){
  .container{width:min(100% - 28px,1120px)}
  .topbar-inner{min-height:40px;font-size:10px}
  .topbar-left{display:none}
  .topbar-inner{justify-content:flex-end}
  .hero{min-height:calc(100vh - 110px)}
  .hero-inner{padding:32px 0 24px}
  .brand{margin-bottom:25px}
  .brand-mark{width:76px;height:76px}
  .brand-mark img{width:62px;height:62px}
  .eyebrow{font-size:9px;letter-spacing:1.7px}
  h1{font-size:24px}
  .tagline{font-size:13px}
  .entry-grid{grid-template-columns:1fr;gap:13px}
  .entry-card{min-height:145px;padding:23px}
  .entry-label{font-size:19px}
  .entry-desc{font-size:11px}
  .quick-links{grid-template-columns:repeat(2,1fr)}
  .quick-links a:nth-child(2n){border-right:0}
  .quick-links a{border-bottom:1px solid var(--line)}
  .footer-inner{padding:15px 0;flex-direction:column;align-items:flex-start}
  .footer-meta{text-align:left}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{transition:none!important}
}

/* Three-item quick navigation: centered, balanced, and intentionally lighter than the main entry cards. */
.quick-links-three{
  width:min(760px,100%);
  grid-template-columns:repeat(3,1fr);
  margin:26px auto 0;
}
.quick-links-three a{
  min-height:82px;
  padding:13px 16px;
  gap:7px;
}
.quick-links-three .quick-icon{
  font-size:21px;
}
@media(max-width:780px){
  .quick-links-three{
    width:100%;
    grid-template-columns:repeat(3,1fr);
  }
  .quick-links-three a{
    min-height:74px;
    padding:10px 5px;
    font-size:11px;
  }
  .quick-links-three a:nth-child(2n){
    border-right:1px solid var(--line);
  }
  .quick-links-three a:last-child{
    border-right:0;
  }
}
@media(max-width:460px){
  .quick-links-three{
    grid-template-columns:1fr;
  }
  .quick-links-three a,
  .quick-links-three a:nth-child(2n){
    border-right:0;
    border-bottom:1px solid var(--line);
  }
  .quick-links-three a:last-child{
    border-bottom:0;
  }
}