body {
    font-family: 'Open Sans', sans-serif;
    line-height: 1.6;
    color: #333; /* Màu chữ chính, dễ đọc trên nền sáng */
    background-color: #f4f4f4; /* Nền trang màu xám nhạt */
    margin: 0;
    padding: 0;
}

.section {
    max-width: 960px ;
    margin: 40px auto;
    padding: 20px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/*
 * HEADING STYLES
 * Định dạng cho các tiêu đề
 */
.main-heading {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 3rem; /* Kích thước lớn hơn cho tiêu đề chính */
    color: #000;
    text-align: center;
    margin-bottom: 5px;
}

.sub-heading {
    font-family: 'Open Sans', sans-serif;
    font-size: 1.2rem;
    color: #666; /* Màu xám để tạo sự khác biệt với tiêu đề chính */
    text-align: center;
    margin-top: 0;
    margin-bottom: 20px;
}

.section-heading {
    color: #59F9FF;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 2rem;
    background-color: #003366; /* Nền xanh đậm UNSW */
    padding: 15px;
    border-radius: 6px;
    margin-top: 0; /* Xóa khoảng trống trên cùng */
    color: #fff; /* Chuyển màu chữ sang trắng để tăng độ tương phản */
}

.step-heading {
    color: #000; /* Màu chữ đen để dễ đọc */
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size: 1.5rem;
    background-color: #e6f9ff; /* Nền xanh nhạt */
    padding: 10px 15px;
    border-left: 5px solid #59F9FF; /* Thêm đường viền nổi bật */
    margin: 25px 0 15px;
}

.wp-block-table {
    margin: 20px 0;
    overflow-x: auto;
}

.wp-block-table table {
    width: 100%;
    border-collapse: collapse;
}

.wp-block-table td, .wp-block-table th {
    padding: 12px;
    border: 1px solid #ddd;
    text-align: left;
}

.wp-block-table thead tr {
    background-color: #f2f2f2;
}

.wp-block-table.is-style-stripes tbody tr:nth-child(even) {
    background-color: #f9f9f9;
}


.wp-block-code {
    background-color: #2b2b2b; /* Nền tối */
    color: #f8f8f2; /* Màu chữ sáng */
    padding: 15px;
    border-radius: 8px;
    overflow-x: auto;
    font-family: 'Courier New', Courier, monospace;
}

.wp-block-code code {
    display: block;
    white-space: pre;
}

/*
 * LISTS
 * Định dạng cho danh sách
 */
.wp-block-list li {
    margin-bottom: 8px;
}

/*
 * BUTTONS & LINKS
 */
.learn-more-container {
    text-align: center;
    margin-top: 20px;
}

.learn-more-btn {
    display: inline-block;
    padding: 12px 24px;
    background-color: #59F9FF;
    color: #000;
    text-decoration: none;
    font-weight: bold;
    border-radius: 50px;
    transition: background-color 0.3s ease;
}

.learn-more-btn:hover {
    background-color: #40D0D8;
}

.drive-link-btn {
    display: inline-block;
    padding: 12px 24px;
    background-color: #34A853; /* Màu xanh lá cây của Google Drive */
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    border-radius: 5px;
    transition: background-color 0.3s ease;
    margin-top: 10px;
}

.drive-link-btn:hover {
    background-color: #2D9B4A;
}

.wp-block-details {
    margin-bottom: 15px;
    border: 1px solid #ddd;
    border-radius: 6px;
    overflow: hidden;
}

.wp-block-details summary {
    background-color: #f2f2f2;
    padding: 15px;
    cursor: pointer;
    font-weight: bold;
    outline: none;
    transition: background-color 0.3s ease;
}

.wp-block-details summary:hover {
    background-color: #e6e6e6;
}

.wp-block-details[open] summary {
    background-color: #ddd;
}
.intro-hero-section {
    background-image: url("http://gametheory.fit.hanu.vn/wp-content/uploads/2025/09/photo-1562408590-e32931084e23-scaled.jpg") ; /* ĐƯỜNG DẪN ẢNH NỀN CỦA BẠN -background url*/
    background-size: cover; /* Đảm bảo ảnh bao phủ toàn bộ khu vực */
    background-position: center; /* Căn giữa ảnh nền */
    background-repeat: no-repeat; /* Không lặp lại ảnh nền */
    min-height: 400px; /* Chiều cao tối thiểu của khối banner */
    display: flex; /* Dùng Flexbox để căn chỉnh nội dung */
    align-items: center; /* Căn giữa nội dung theo chiều dọc */
    justify-content: center; /* Căn giữa nội dung theo chiều ngang */
    text-align: center; /* Căn giữa văn bản */
    position: relative; /* Quan trọng cho việc tạo lớp phủ */
    margin: 40px auto; /* Căn giữa khối và tạo khoảng cách */
    max-width: 1300px; /* Giữ chiều rộng tối đa như các section khác */
    border-radius: 0px; /* Bo góc */
    overflow: hidden; /* Đảm bảo ảnh và lớp phủ không tràn ra ngoài */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* Lớp phủ (overlay) để làm tối ảnh nền, giúp chữ dễ đọc hơn */
.intro-hero-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6); /* Màu đen với độ trong suốt 60% */
    z-index: 1; /* Đảm bảo lớp phủ nằm dưới văn bản nhưng trên ảnh nền */
}

.intro-hero-section .intro-content {
    position: relative; /* Đặt nội dung lên trên lớp phủ */
    z-index: 2; /* Đảm bảo văn bản hiển thị trên lớp phủ */
    padding: 20px;
    max-width: 80%; /* Giới hạn chiều rộng của văn bản để không quá dài */
}

.intro-hero-section .intro-heading {
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 2.5rem; /* Kích thước chữ lớn */
    color: #FFEB3B; /* Màu vàng sáng để nổi bật */
    margin-bottom: 15px;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7); /* Thêm bóng để chữ rõ hơn */
}

.intro-hero-section .intro-text {
    font-family: 'Open Sans', sans-serif;
    font-size: 1.1rem;
    color: #fff; /* Màu chữ trắng */
    line-height: 1.8;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7); /* Thêm bóng để chữ rõ hơn */
}
.nav-container {
    display: flex;
    justify-content: center;
    gap: 50px; /* Tăng khoảng cách giữa các nút */
    margin-bottom: 200px; /* Thêm khoảng cách với nội dung bên dưới */
}

.nav-button {
    text-decoration: none; /* Bỏ gạch chân */
    background-color: #0073e6;
    color: white;
    padding: 10px 25px; /* Kích thước nút */
    border-radius: 5px; /* Bo góc */
    font-weight: bold;
    transition: background-color 0.3s ease; /* Hiệu ứng chuyển màu khi di chuột */
}

.nav-button:hover {
    background-color: #005bb5;
}
.wp-block-image img.wp-image-710,
.wp-block-image img.wp-image-713 {
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
