/* --- Định dạng Header dãn đều --- */
.site-header {
    background: #0f172a; /* */
    padding: 15px 0;
    width: 100%;
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1); /* */
}

.header-container {
    width: 100%; /* Thay đổi từ 1400px sang 100% để dãn toàn màn hình */
    margin: 0;
    display: flex;
    justify-content: space-between; /* Đẩy Logo sang trái, Nút sang phải, Menu ở giữa */
    align-items: center;
    padding: 0 3%; /* Khoảng cách nhỏ với mép màn hình */
}

/* --- Menu dãn đều --- */
.main-nav {
    flex-grow: 1; /* Cho phép menu chiếm không gian ở giữa */
    display: flex;
    justify-content: center; /* Căn menu vào chính giữa khoảng trống */
}

.main-nav ul {
    list-style: none;
    display: flex; /* */
    gap: 40px; /* Tăng khoảng cách giữa các mục menu */
    margin: 0;
    padding: 0;
}

/* --- Các thành phần còn lại giữ nguyên hoặc tinh chỉnh nhẹ --- */
.logo a {
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 10px;
}

.logo-text {
    color: #ffffff;
    font-weight: 800;
    font-size: 1.5rem;
    white-space: nowrap; /* Không cho chữ logo xuống dòng */
}

.main-nav a {
    color: #ffffff;
    text-decoration: none;
    font-weight: 600;
    transition: 0.3s;
    white-space: nowrap;
}

.main-nav a:hover {
    color: #c5a059;
}

.header-right {
    display: flex;
    justify-content: flex-end;
}

.header-btn {
    background: #c5a059;
    color: #0f172a !important;
    padding: 10px 25px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

/* --- Nút Tư vấn ngay chuyên nghiệp --- */
.btn-consult {
    background: #e6a53d; /* Màu vàng nguyên bản */
    color: #000 !important; /* Chữ đen cho nổi bật */
    padding: 12px 25px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 800;
    font-size: 0.9rem;
    transition: all 0.3s ease; /* Tạo hiệu ứng mượt mà */
    display: inline-block;
    border: none;
    box-shadow: 0 4px 15px rgba(230, 165, 61, 0.2);
    text-transform: uppercase;
}

/* Hiệu ứng khi di chuột vào (Hover) */
.btn-consult:hover {
    background: #c98a2d; /* Vàng đậm hơn một chút */
    color: #fff !important; /* Chữ chuyển sang trắng */
    box-shadow: 0 6px 20px rgba(230, 165, 61, 0.4);
    transform: translateY(-2px); /* Nhích nhẹ lên trên */
}

/* Hiệu ứng khi click */
.btn-consult:active {
    transform: translateY(0);
}
/* --- Cấu trúc Header dãn đều --- */
.header-container {
    width: 100%;
    margin: 0;
    display: flex;
    /* Giữ Logo bên trái, đẩy tất cả thành phần khác (Menu + Nút) sang phải */
    justify-content: flex-start; 
    align-items: center;
    padding: 0 3%;
}

/* --- Menu: Đẩy sang bên phải --- */
.main-nav {
    flex-grow: 1; /* Chiếm khoảng trống ở giữa */
    display: flex;
    /* Quan trọng: Đẩy nội dung bên trong nó (ul) sang sát bên phải */
    justify-content: flex-end; 
    margin-right: 40px; /* Khoảng cách giữa Menu và Nút Tư vấn */
}

.main-nav ul {
    list-style: none;
    display: flex;
    gap: 30px; /* Khoảng cách giữa các mục menu */
    margin: 0;
    padding: 0;
}

/* --- Khối chứa nút hành động (Tư vấn ngay) --- */
.header-action {
    display: flex;
    align-items: center;
}

/* --- Giữ lại hiệu ứng nút Tư vấn ngay --- */
.btn-consult {
    background: #e6a53d;
    color: #000 !important;
    padding: 10px 22px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 800;
    font-size: 0.85rem;
    transition: all 0.3s ease;
    display: inline-block;
    box-shadow: 0 4px 15px rgba(230, 165, 61, 0.2);
    text-transform: uppercase;
    /* Đảm bảo font chữ Times New Roman đã ép từ header.php vẫn hoạt động */
}

.btn-consult:hover {
    background: #c98a2d;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(230, 165, 61, 0.4);
}