:root {
    --ia-indigo: #2e3192;
    --ia-blue: #1c75bc;
    --ia-sky: #8ad4fb;
    --nrru-purple: #5b2a8e;
    --nrru-purple-2: #8e44ad;
    --nrru-gold: #e0a800;
    --nrru-green: #0b4d1b;
    --body-bg: #f3f5fa;
}

body {
    font-family: 'Sarabun', sans-serif;
    background: var(--body-bg);
    color: #263040;
    font-size: 1rem;
}
h1, h2, h3, h4, h5, h6, .brand-th, .main-nav .nav-link, .side-head, .section-title, .footer-title { font-family: 'Kanit', sans-serif; }
a { color: var(--ia-blue); }

/* ---------- Header ---------- */
.site-header {
    background: #fff linear-gradient(100deg, #fff 55%, #eef4ff 100%);
    border-bottom: 3px solid var(--ia-sky);
}
.brand-logo { height: 84px; width: auto; }
.brand-th { color: var(--ia-indigo); font-weight: 600; font-size: 1.35rem; line-height: 1.25; }
.brand-en { color: var(--ia-indigo); letter-spacing: .12em; font-weight: 500; font-size: .95rem; }
.brand-slogan { color: var(--nrru-purple-2); font-size: 1rem; font-weight: 500; }
.header-ovals { gap: 0; }
.header-ovals .oval {
    width: 190px; height: 92px; border-radius: 50%;
    background-size: cover; background-position: center;
    border: 3px solid #fff; box-shadow: 0 0 0 2px var(--ia-indigo), 0 4px 14px rgba(46, 49, 146, .25);
    margin-left: -18px;
}
.nrru-logo { height: 84px; width: auto; }

@media (max-width: 575.98px) {
    .brand-logo { height: 56px; }
    .brand-th { font-size: 1rem; }
    .brand-en, .brand-slogan { font-size: .8rem; }
}

/* ---------- Top nav ---------- */
.main-nav {
    background: linear-gradient(90deg, var(--ia-indigo), var(--ia-blue));
    box-shadow: 0 2px 8px rgba(0, 0, 0, .15);
    padding-top: 0; padding-bottom: 0;
}
.main-nav .nav-link {
    color: #fff !important; font-weight: 400; font-size: .98rem;
    padding: .8rem .9rem !important; border-bottom: 3px solid transparent;
}
.main-nav .nav-link:hover, .main-nav .nav-link.active, .main-nav .nav-link.show {
    background: rgba(255, 255, 255, .12); border-bottom-color: var(--nrru-gold);
}
.main-nav .dropdown-menu { border-radius: 0 0 .5rem .5rem; border: 0; box-shadow: 0 6px 18px rgba(0, 0, 0, .15); }
.main-nav .dropdown-item.active, .main-nav .dropdown-item:active { background: var(--nrru-purple); }

/* ---------- Layout ---------- */
.page-body { background: #fff; box-shadow: 0 0 20px rgba(30, 40, 80, .06); min-height: 60vh; }
.main-col { padding: 1.5rem; }
.side-col { background: #fbfaff; border-right: 1px solid #e6e2f0; padding: 1rem .75rem; }
@media (max-width: 991.98px) { .side-col { border-right: 0; border-top: 1px solid #e6e2f0; } }

.side-group { margin-bottom: .9rem; }
.side-head {
    display: block; text-align: center; color: #fff; text-decoration: none;
    background: linear-gradient(180deg, #a874d8, var(--nrru-purple));
    border: 1px solid #4a1f78; border-radius: .6rem;
    padding: .6rem .75rem; font-size: .95rem; font-weight: 500;
    box-shadow: 0 2px 6px rgba(91, 42, 142, .3);
}
a.side-head:hover, a.side-head.active { color: #fff; filter: brightness(1.1); }
.side-toggle { width: 100%; display: flex; align-items: center; gap: .5rem; text-align: center; cursor: pointer; }
.side-toggle span { flex: 1; }
.side-toggle:hover { filter: brightness(1.1); }
.side-toggle .bi { transition: transform .2s; }
.side-toggle:not(.collapsed) .bi { transform: rotate(180deg); }
.side-list { list-style: none; padding: .5rem 0 0 .4rem; margin: 0; }
.side-list li a {
    display: block; padding: .3rem .5rem; color: #3b3f55; text-decoration: none; font-size: .93rem; border-radius: .35rem;
}
.side-list li a::before { content: "–"; margin-right: .45rem; color: var(--nrru-purple-2); }
.side-list li a:hover, .side-list li a.active { background: #efe7fa; color: var(--nrru-purple); }

/* ---------- Content ---------- */
.section-title {
    font-size: 1.3rem; color: var(--ia-indigo); font-weight: 600;
    border-left: 5px solid var(--nrru-purple); padding-left: .6rem; margin-bottom: 1rem;
}
.page-content { line-height: 1.85; }
.page-content img { max-width: 100%; height: auto; }
.page-content table { max-width: 100%; }
.page-content iframe { max-width: 100%; }

.banner-carousel { border-radius: .75rem; overflow: hidden; box-shadow: 0 4px 16px rgba(0, 0, 0, .12); }
.banner-carousel .carousel-item img { width: 100%; aspect-ratio: 16 / 6; object-fit: cover; }
.banner-carousel .carousel-caption { background: rgba(20, 20, 60, .55); border-radius: .5rem; padding: .4rem .8rem; bottom: 1rem; }

.news-card { border: 0; border-radius: .75rem; overflow: hidden; box-shadow: 0 2px 10px rgba(20, 30, 80, .08); transition: transform .15s, box-shadow .15s; }
.news-card:hover { transform: translateY(-3px); box-shadow: 0 8px 22px rgba(20, 30, 80, .15); }
.news-card .cover { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; background: #e9ecf5; }
.news-card .card-title { font-size: 1rem; font-weight: 600; color: #22284a; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.news-card a { text-decoration: none; }
.news-meta { font-size: .82rem; color: #7a8099; }
.badge-pin { background: var(--nrru-gold); }

.dl-item { display: flex; gap: .9rem; align-items: center; padding: .75rem; border-bottom: 1px dashed #dde1ee; }
.dl-item:last-child { border-bottom: 0; }
.dl-item .bi { font-size: 1.8rem; }

/* ---------- Footer ---------- */
.site-footer { background: linear-gradient(180deg, #23266f, #181a52); color: #dfe3ff; margin-top: 0; }
.site-footer a { color: #cfe6ff; text-decoration: none; }
.site-footer a:hover { color: #fff; text-decoration: underline; }
.footer-title { color: var(--ia-sky); font-weight: 500; margin-bottom: .75rem; }
.footer-links { list-style: none; padding: 0; margin: 0; font-size: .92rem; }
.footer-links li { padding: .2rem 0; }
.footer-links li::before { content: "› "; color: var(--nrru-gold); }
.footer-bottom { background: rgba(0, 0, 0, .25); color: #aab2e0; }