body {
    font-family: Arial, sans-serif;
    line-height: 1.6;
    margin: 0;
    padding: 0;
    background-color: #f4f4f4;
}

header {
    background: #35424a;
    color: #ffffff;
    padding: 20px;
    text-align: center;
}

main {
    padding: 20px;
}

h2 {
    color: #35424a;
}

footer {
    text-align: center;
    padding: 10px;
    background: #35424a;
    color: white;
    position: relative;
    bottom: 0;
    width: 100%;
}

header {
    background: #35424a;
    color: #ffffff;
    padding: 20px;
    text-align: center;
}

#header-image {
    width: 15%; /* Điều chỉnh kích thước hình ảnh */
    max-width: 300px; /* Kích thước tối đa */
    height: auto; /* Giữ tỉ lệ */
    border-radius: 15px; /* Bo góc */
    margin-bottom: 15px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Đổ bóng nhẹ */
}

#download {
    text-align: center;
    margin: 20px 0;
}

.button-container {
    display: flex;
    justify-content: center;
    gap: 20px; /* Khoảng cách giữa các nút */
}

.download-button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 150px; /* Đặt chiều rộng cố định cho các nút */
    height: 50px; /* Đặt chiều cao cố định */
    border-radius: 10px; /* Bo góc */
    background-color: #f0f0f0; /* Màu nền cho nút */
    transition: transform 0.3s, background-color 0.3s; /* Hiệu ứng khi hover */
}

.download-button img {
    max-width: 100%; /* Đảm bảo hình ảnh không vượt quá chiều rộng nút */
    max-height: 40px; /* Giới hạn chiều cao hình ảnh */
    margin: auto; /* Canh giữa hình ảnh */
}

.download-button:hover {
    background-color: #e0e0e0; /* Màu nền khi hover */
    transform: scale(1.05); /* Phóng to khi hover */
}

#features {
    padding: 20px;
    background-color: #f9f9f9; /* Màu nền nhẹ */
    border-radius: 10px; /* Bo góc */
    margin: 20px 0;
}

#features h3 {
    text-align: center; /* Canh giữa tiêu đề */
    margin-bottom: 20px; /* Khoảng cách dưới tiêu đề */
    color: #35424a; /* Màu tiêu đề */
}
#features p {
    text-align: center;
    margin: 10px 0;
    line-height: 1.6; /* Khoảng cách giữa các dòng */
}

.feature-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 15px; /* Khoảng cách giữa các mục */
}

.feature-item {
    background-color: #fff; /* Màu nền trắng cho từng mục */
    padding: 15px;
    border-radius: 8px; /* Bo góc cho từng mục */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Đổ bóng */
}

.feature-item h3 {
    color: #2c3e50; /* Màu tiêu đề mục */
}

.language-list {
    text-align: center;
    margin-top: 15px;
    font-size: 0.9em; /* Kích thước chữ nhỏ hơn */
}

#supported-languages {
    padding: 20px;
    background-color: #f2f2f2; /* Màu nền nhẹ cho section */
    border-radius: 10px; /* Bo góc */
    margin: 20px 0; /* Khoảng cách trên và dưới */
    text-align: center; /* Canh giữa nội dung */
}

#supported-languages h4 {
    color: #35424a; /* Màu tiêu đề */
}

.language-list {
    font-size: 0.9em; /* Kích thước chữ nhỏ hơn */
}
