:root { --ita: #0d4f8b; --ita2: #12a38a; }
body { font-family: 'Noto Sans Thai', system-ui, sans-serif; background: #f4f6f9; }
.bg-primary { background-color: var(--ita) !important; }
.btn-primary { background: var(--ita); border-color: var(--ita); }
.site-hero { background: linear-gradient(120deg, var(--ita), var(--ita2)); color: #fff; padding: 2rem 0; }
.site-footer { background: #fff; border-top: 1px solid #e3e6ea; padding: 1.2rem 0; color: #6c757d; }
.doc-card { border: 0; border-radius: .8rem; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,.07); transition: transform .15s, box-shadow .15s; }
.doc-card:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(0,0,0,.12); }
.doc-cover { aspect-ratio: 16/10; object-fit: cover; width: 100%; background: #dfe6ee; }
.doc-cover-ph { aspect-ratio: 16/10; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg,#dfe6ee,#c9d6e4); color: #8aa0b8; font-size: 3rem; }
.doc-card .topic { font-weight: 700; color: var(--ita); line-height: 1.3; }
.doc-card .doc-title { color: #444; }
.doc-card .stretched-link { text-decoration: none; }
.pdf-frame { width: 100%; height: 85vh; border: 1px solid #ccd; border-radius: .5rem; background: #fff; }
.table td, .table th { vertical-align: middle; }
body.login { background: linear-gradient(120deg, var(--ita), var(--ita2)); min-height: 100vh; display: flex; align-items: center; }
body.login main { max-width: 420px; }
.hero-logo { height: 64px; width: auto; background: #fff; border-radius: .5rem; padding: 4px; }