* {margin: 0; padding: 0; box-sizing: border-box;}
body {font-family: 'Roboto', Arial, sans-serif; font-size: 15px; line-height: 1.6; color: #333; background: #fff;}
.container {max-width: 1200px; margin: 0 auto; padding: 0 15px;}
.row {display: flex; flex-wrap: wrap; margin: 0 -15px;}
.col-4 {width: 33.33%; padding: 0 15px;}
.col-6 {width: 50%; padding: 0 15px;}
img {max-width: 100%; height: auto; display: block;}
a {color: #b20000; text-decoration: none;}
a:hover {color: #8c0000;}

.site-header {background: #fff; box-shadow: 0 2px 5px rgba(0,0,0,0.1);}
.header-top {display: flex; justify-content: space-between; align-items: center; padding: 15px 0;}
.logo img {height: 70px; width: auto;}
.header-info {color: #c00; font-weight: bold; font-size: 16px;}

.main-nav {background: #b20000;}
.nav-menu {list-style: none; display: flex;}
.nav-menu li {position: relative;}
.nav-menu li a {display: block; padding: 15px 20px; color: #fff; text-transform: uppercase; font-weight: 500; font-size: 14px;}
.nav-menu li a:hover, .nav-menu li.current-menu-item a {background: #8c0000;}

.slider {margin-bottom: 40px;}
.slider img {width: 100%;}
.section-title {text-align: center; font-size: 28px; color: #b20000; margin-bottom: 30px; position: relative; padding-bottom: 15px; text-transform: uppercase; font-weight: 700;}
.section-title:after {content: ''; width: 80px; height: 3px; background: #b20000; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);}
.gioi-thieu, .tin-tuc, .linh-vuc {padding: 50px 0;}
.gioi-thieu {background: #f7f7f7;}

.btn {display: inline-block; background: #b20000; color: #fff; padding: 12px 30px; text-decoration: none; margin-top: 15px; text-transform: uppercase; font-weight: 500;}
.btn:hover {background: #8c0000; color: #fff;}

.service-box {background: #fff; border: 1px solid #eee; padding: 30px 20px; text-align: center; margin-bottom: 30px; transition: all 0.3s;}
.service-box:hover {box-shadow: 0 5px 15px rgba(0,0,0,0.1); transform: translateY(-5px);}
.service-box h3 {color: #b20000; margin-bottom: 15px; font-size: 18px;}

.news-item {border: 1px solid #eee; margin-bottom: 30px; background: #fff;}
.news-item h3 {padding: 15px; font-size: 16px; line-height: 1.4;}
.news-item h3 a {color: #333;}
.news-item p {padding: 0 15px 15px; color: #666;}

.page-content {padding: 40px 15px; min-height: 400px;}
.page-title {color: #b20000; margin-bottom: 25px; font-size: 28px; text-transform: uppercase;}
.post-meta {color: #888; margin-bottom: 20px; font-size: 14px;}
.entry {line-height: 1.8;}
.entry p {margin-bottom: 15px;}

.site-footer {background: #222; color: #ccc; padding: 40px 0 20px; margin-top: 40px;}
.footer-widgets {display: flex; margin-bottom: 20px;}
.footer-widgets .col {width: 50%; padding: 0 15px;}
.widget-title {color: #fff; margin-bottom: 15px; font-size: 18px; text-transform: uppercase;}
.copyright {text-align: center; border-top: 1px solid #444; padding-top: 20px; font-size: 14px;}

@media (max-width: 768px) {
    .col-4, .col-6 {width: 100%;}
    .nav-menu {flex-direction: column;}
    .header-top {flex-direction: column; gap: 15px;}
    .footer-widgets {flex-direction: column;}
    .footer-widgets .col {width: 100%; margin-bottom: 30px;}
}
