.elementor-kit-10{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#4B4D5A;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-c4b7b3a:#222222;--e-global-color-3f784c7:#FFFFFF;--e-global-color-79ea0d1:#9CC3F1;--e-global-color-ca428a4:#CCE2F5;--e-global-color-e391bb0:#050226;--e-global-color-dcbdb3c:#FFFFFF0A;--e-global-color-b569e57:#FFFBFB1A;--e-global-color-154388c:#343B78;--e-global-color-b76d204:#FFFFFF2E;--e-global-color-4802156:#14133E;--e-global-color-881fd1c:#FFFFFF00;--e-global-color-079e8cb:#0F0E2B;--e-global-color-c5ab5f0:#343B7894;--e-global-color-bab662d:#151338;--e-global-color-901fe7a:#191E44;--e-global-color-335dcbe:#36526954;--e-global-color-aa0dd0d:#343B7852;--e-global-color-7617b09:#0640BD;--e-global-color-d560b90:#7478F3;--e-global-color-44985f7:#2377D5;--e-global-color-beb1ac9:#FCD667;--e-global-typography-primary-font-family:"Be Vietnam Pro";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Be Vietnam Pro";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Be Vietnam Pro";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Be Vietnam Pro";--e-global-typography-accent-font-weight:500;--e-global-typography-10544c1-font-family:"Be Vietnam Pro";--e-global-typography-10544c1-font-size:4.9em;--e-global-typography-10544c1-font-weight:600;--e-global-typography-10544c1-text-transform:capitalize;--e-global-typography-10544c1-line-height:1.1em;--e-global-typography-1205c21-font-family:"Be Vietnam Pro";--e-global-typography-1205c21-font-size:28px;--e-global-typography-1205c21-font-weight:600;--e-global-typography-1205c21-line-height:1.3em;--e-global-typography-8a5f751-font-family:"Be Vietnam Pro";--e-global-typography-8a5f751-font-size:26px;--e-global-typography-8a5f751-font-weight:600;--e-global-typography-8a5f751-text-transform:capitalize;--e-global-typography-8a5f751-line-height:1.4em;--e-global-typography-a7090c7-font-family:"Be Vietnam Pro";--e-global-typography-a7090c7-font-size:2.1em;--e-global-typography-a7090c7-font-weight:600;--e-global-typography-a7090c7-text-transform:capitalize;--e-global-typography-a7090c7-line-height:1.1em;--e-global-typography-3066b83-font-family:"Be Vietnam Pro";--e-global-typography-3066b83-font-size:1.5em;--e-global-typography-3066b83-font-weight:600;--e-global-typography-3066b83-text-transform:capitalize;--e-global-typography-3066b83-line-height:1.1em;--e-global-typography-5e45b79-font-family:"Be Vietnam Pro";--e-global-typography-5e45b79-font-size:1.2em;--e-global-typography-5e45b79-font-weight:600;--e-global-typography-5e45b79-text-transform:capitalize;--e-global-typography-5e45b79-line-height:1.1em;--e-global-typography-5ab7ba6-font-family:"Be Vietnam Pro";--e-global-typography-5ab7ba6-font-size:4.5em;--e-global-typography-5ab7ba6-font-weight:600;--e-global-typography-5ab7ba6-text-transform:capitalize;--e-global-typography-5ab7ba6-line-height:1.1em;--e-global-typography-a7cf974-font-family:"Be Vietnam Pro";--e-global-typography-a7cf974-font-size:1.3em;--e-global-typography-a7cf974-font-weight:600;--e-global-typography-a7cf974-text-transform:capitalize;--e-global-typography-a7cf974-line-height:1.1em;--e-global-typography-0f8495e-font-family:"Be Vietnam Pro";--e-global-typography-0f8495e-font-size:1.2em;--e-global-typography-0f8495e-font-weight:600;--e-global-typography-0f8495e-text-transform:capitalize;--e-global-typography-0f8495e-line-height:1.1em;--e-global-typography-4b057bc-font-family:"Be Vietnam Pro";--e-global-typography-4b057bc-font-size:1em;--e-global-typography-4b057bc-font-weight:600;--e-global-typography-4b057bc-text-transform:uppercase;--e-global-typography-4b057bc-line-height:1.1em;--e-global-typography-660dd44-font-family:"Be Vietnam Pro";--e-global-typography-660dd44-font-size:1.2em;--e-global-typography-660dd44-font-weight:500;--e-global-typography-660dd44-text-transform:capitalize;--e-global-typography-660dd44-line-height:1.3em;--e-global-typography-f0376b6-font-family:"Be Vietnam Pro";--e-global-typography-f0376b6-font-size:6.9em;--e-global-typography-f0376b6-font-weight:600;--e-global-typography-f0376b6-text-transform:capitalize;--e-global-typography-f0376b6-line-height:1.1em;--e-global-typography-26c2516-font-family:"Be Vietnam Pro";--e-global-typography-26c2516-font-size:14.3em;--e-global-typography-26c2516-font-weight:800;--e-global-typography-26c2516-text-transform:uppercase;--e-global-typography-26c2516-letter-spacing:0.27em;color:#333333;}.elementor-kit-10 e-page-transition{background-color:#FFBC7D;}.elementor-kit-10 a{font-weight:400;text-decoration:none;}.elementor-kit-10 h1{font-family:var( --e-global-typography-10544c1-font-family ), Sans-serif;font-size:var( --e-global-typography-10544c1-font-size );font-weight:var( --e-global-typography-10544c1-font-weight );text-transform:var( --e-global-typography-10544c1-text-transform );line-height:var( --e-global-typography-10544c1-line-height );}.elementor-kit-10 h2{font-family:var( --e-global-typography-1205c21-font-family ), Sans-serif;font-size:var( --e-global-typography-1205c21-font-size );font-weight:var( --e-global-typography-1205c21-font-weight );line-height:var( --e-global-typography-1205c21-line-height );}.elementor-kit-10 h3{font-family:var( --e-global-typography-8a5f751-font-family ), Sans-serif;font-size:var( --e-global-typography-8a5f751-font-size );font-weight:var( --e-global-typography-8a5f751-font-weight );text-transform:var( --e-global-typography-8a5f751-text-transform );line-height:var( --e-global-typography-8a5f751-line-height );}.elementor-kit-10 h4{font-family:var( --e-global-typography-a7090c7-font-family ), Sans-serif;font-size:var( --e-global-typography-a7090c7-font-size );font-weight:var( --e-global-typography-a7090c7-font-weight );text-transform:var( --e-global-typography-a7090c7-text-transform );line-height:var( --e-global-typography-a7090c7-line-height );}.elementor-kit-10 h5{font-family:var( --e-global-typography-3066b83-font-family ), Sans-serif;font-size:var( --e-global-typography-3066b83-font-size );font-weight:var( --e-global-typography-3066b83-font-weight );text-transform:var( --e-global-typography-3066b83-text-transform );line-height:var( --e-global-typography-3066b83-line-height );}.elementor-kit-10 h6{font-family:var( --e-global-typography-5e45b79-font-family ), Sans-serif;font-size:var( --e-global-typography-5e45b79-font-size );font-weight:var( --e-global-typography-5e45b79-font-weight );text-transform:var( --e-global-typography-5e45b79-text-transform );line-height:var( --e-global-typography-5e45b79-line-height );}.elementor-kit-10 button,.elementor-kit-10 input[type="button"],.elementor-kit-10 input[type="submit"],.elementor-kit-10 .elementor-button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );border-style:none;border-radius:5px 5px 5px 5px;padding:5px 08px 5px 8px;}.elementor-kit-10 button:hover,.elementor-kit-10 button:focus,.elementor-kit-10 input[type="button"]:hover,.elementor-kit-10 input[type="button"]:focus,.elementor-kit-10 input[type="submit"]:hover,.elementor-kit-10 input[type="submit"]:focus,.elementor-kit-10 .elementor-button:hover,.elementor-kit-10 .elementor-button:focus{border-radius:999px 999px 999px 999px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1500px;}.e-con{--container-max-width:1500px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-kit-10{--e-global-typography-10544c1-font-size:4.1em;--e-global-typography-10544c1-line-height:1.1em;--e-global-typography-1205c21-font-size:24px;--e-global-typography-1205c21-line-height:1.3em;--e-global-typography-8a5f751-font-size:20px;--e-global-typography-8a5f751-line-height:1.3em;--e-global-typography-a7090c7-font-size:1.9em;--e-global-typography-a7090c7-line-height:1.1em;--e-global-typography-3066b83-font-size:1.3em;--e-global-typography-3066b83-line-height:1.1em;--e-global-typography-5e45b79-font-size:1.2em;--e-global-typography-5e45b79-line-height:1.1em;--e-global-typography-5ab7ba6-font-size:3em;--e-global-typography-a7cf974-font-size:1.3em;--e-global-typography-a7cf974-line-height:1.1em;--e-global-typography-0f8495e-font-size:1.2em;--e-global-typography-0f8495e-line-height:1.1em;--e-global-typography-4b057bc-font-size:1em;--e-global-typography-4b057bc-line-height:1.1em;--e-global-typography-660dd44-font-size:1.1em;--e-global-typography-660dd44-line-height:1.1em;--e-global-typography-26c2516-font-size:10.2em;--e-global-typography-26c2516-letter-spacing:0em;}.elementor-kit-10 h1{font-size:var( --e-global-typography-10544c1-font-size );line-height:var( --e-global-typography-10544c1-line-height );}.elementor-kit-10 h2{font-size:var( --e-global-typography-1205c21-font-size );line-height:var( --e-global-typography-1205c21-line-height );}.elementor-kit-10 h3{font-size:var( --e-global-typography-8a5f751-font-size );line-height:var( --e-global-typography-8a5f751-line-height );}.elementor-kit-10 h4{font-size:var( --e-global-typography-a7090c7-font-size );line-height:var( --e-global-typography-a7090c7-line-height );}.elementor-kit-10 h5{font-size:var( --e-global-typography-3066b83-font-size );line-height:var( --e-global-typography-3066b83-line-height );}.elementor-kit-10 h6{font-size:var( --e-global-typography-5e45b79-font-size );line-height:var( --e-global-typography-5e45b79-line-height );}.elementor-kit-10 button,.elementor-kit-10 input[type="button"],.elementor-kit-10 input[type="submit"],.elementor-kit-10 .elementor-button{padding:17px 30px 17px 30px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-10{--e-global-typography-10544c1-font-size:3.3em;--e-global-typography-1205c21-font-size:20px;--e-global-typography-1205c21-line-height:1.5em;--e-global-typography-8a5f751-font-size:16px;--e-global-typography-8a5f751-line-height:1.3em;--e-global-typography-a7090c7-font-size:1.6em;--e-global-typography-3066b83-font-size:1.3em;--e-global-typography-5e45b79-font-size:1.1em;--e-global-typography-5ab7ba6-font-size:3em;--e-global-typography-a7cf974-font-size:1.3em;--e-global-typography-0f8495e-font-size:1.2em;--e-global-typography-4b057bc-font-size:1em;--e-global-typography-660dd44-font-size:1.1em;--e-global-typography-f0376b6-font-size:10.4em;--e-global-typography-26c2516-font-size:3em;--e-global-typography-26c2516-letter-spacing:20em;}.elementor-kit-10 h1{font-size:var( --e-global-typography-10544c1-font-size );line-height:var( --e-global-typography-10544c1-line-height );}.elementor-kit-10 h2{font-size:var( --e-global-typography-1205c21-font-size );line-height:var( --e-global-typography-1205c21-line-height );}.elementor-kit-10 h3{font-size:var( --e-global-typography-8a5f751-font-size );line-height:var( --e-global-typography-8a5f751-line-height );}.elementor-kit-10 h4{font-size:var( --e-global-typography-a7090c7-font-size );line-height:var( --e-global-typography-a7090c7-line-height );}.elementor-kit-10 h5{font-size:var( --e-global-typography-3066b83-font-size );line-height:var( --e-global-typography-3066b83-line-height );}.elementor-kit-10 h6{font-size:var( --e-global-typography-5e45b79-font-size );line-height:var( --e-global-typography-5e45b79-line-height );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* TẠO SUBMENU */
.custom-menu-item-wrapper {
    position: relative; /* Quan trọng để định vị submenu */
    display: inline-block; /* Hoặc block, tùy theo layout của bạn */
}

/* CSS cho submenu */
.project-submenu {
    position: absolute;
    top: 100%; /* Hiển thị ngay bên dưới trigger */
    left: -115%; 
    background-color: #2C2F33; /* Màu nền tối như trong ảnh */
    min-width: 300px !important;
    list-style: none;
    padding: 15px;
    margin: 8px 0 0 0; /* Khoảng cách từ trigger đến submenu, 8px này dành cho mũi tên cao 8px */
    border-radius: 12px; /* Bo góc */
 
    box-shadow: 0 5px 15px rgba(0,0,0,0.3); /* Đổ bóng */
    z-index: 1000; /* Đảm bảo nó hiển thị trên các phần tử khác */
    font-family: Arial, sans-serif; /* Chọn font chữ phù hợp */

    /* Thuộc tính cho hiệu ứng xuất hiện */
    opacity: 0;
    visibility: hidden; /* Ẩn hoàn toàn và không tương tác được */
    transform: translateY(10px); /* Ban đầu dịch chuyển xuống dưới 10px */
    transition: opacity 0.25s ease-out, transform 0.25s ease-out, visibility 0s linear 0.25s;
    /*
     * Giải thích transition:
     * - opacity và transform sẽ chuyển đổi mượt trong 0.25s.
     * - visibility sẽ chuyển giá trị ngay lập tức (0s duration) NHƯNG chỉ sau 0.25s delay.
     *   Điều này đảm bảo khi ẩn, submenu mờ đi và trượt đi trước khi biến mất hoàn toàn.
     */
}

/* Hiển thị submenu khi hover vào wrapper và áp dụng hiệu ứng */
.custom-menu-item-wrapper:hover .project-submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0); /* Trở về vị trí ban đầu (không dịch chuyển) */
    transition-delay: 0s; /* Quan trọng: Reset delay cho tất cả các thuộc tính (đặc biệt là visibility)
                             để submenu xuất hiện ngay lập tức khi bắt đầu hover. */
}

/* Tạo mũi tên phía trên submenu */
.project-submenu::before {
    content: "";
    position: absolute;
    bottom: 100%; /* Đặt mũi tên ngay trên đỉnh của .project-submenu (chạm vào margin-top 8px) */
    left: 47%;  /* Điều chỉnh giá trị này để căn mũi tên!
                   Ví dụ: 25px từ mép trái của submenu.
                   Bạn cần thử nghiệm giá trị này để nó nằm đúng vị trí dưới chữ "Projects" như trong ảnh.
                   Nếu "Projects" của bạn nằm ở giữa, bạn có thể thử:
                   left: 50%;
                   transform: translateX(-50%); */
    width: 0;
    height: 0;
    border-left: 8px solid transparent;  /* Nửa chiều rộng đáy của tam giác */
    border-right: 8px solid transparent; /* Nửa chiều rộng đáy của tam giác */
    border-bottom: 8px solid #2C2F33; /* Màu trùng với background submenu, đây cũng là chiều cao của tam giác */
}

/* CSS cho các mục trong submenu */
.project-submenu li {
    margin: 0;
    padding: 0;
}

.project-submenu li a {
    display: block;
    color: white;
    text-decoration: none;
    padding: 10px 12px; /* Khoảng đệm cho mỗi mục */
    font-size: 15px; /* Cỡ chữ, điều chỉnh nếu cần */
    border-radius: 4px; /* Bo góc nhẹ cho link nếu muốn hiệu ứng hover đẹp hơn */
    transition: background-color 0.2s ease-in-out; /* Hiệu ứng chuyển màu nền */
}

.project-submenu li a:hover {
    background-color: #4F545C; /* Màu nền khi hover vào mục con */
}

/* Tùy chỉnh cho trigger text "Projects" nếu cần */
.project-trigger p { /* Text editor thường bọc text trong <p> */
    margin-bottom: 0; /* Loại bỏ margin mặc định nếu có */
    cursor: pointer; /* Biểu thị đây là một yếu tố có thể tương tác */
}/* End custom CSS */