/* Unified header (projects-style) */
        .header { position: fixed; top: 20px; left: 20px; z-index: 1000; width: auto; max-width: calc(100% - 40px); }
        .header .row { justify-content: flex-start; }
        .header__menu { background: rgba(13,13,13,0.85); backdrop-filter: blur(10px); border-radius: 50px; padding: 8px 24px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); border: 1px solid rgba(223,166,103,0.3); }
        .header__menu ul { list-style: none; display: flex; align-items: center; gap: 8px; margin: 0; padding: 0; }
        .header__menu ul li a { color: #fff; text-decoration: none; font-weight: 500; font-size: 14px; padding: 8px 16px; border-radius: 30px; display: block; white-space: nowrap; }
        .header__menu ul li a:hover { background: rgba(223,166,103,0.15); color: #dfa667; }
        .header__menu ul li.active a { background: rgba(223,166,103,0.2); color: aliceblue; }
        .header__menu ul li.dropdown > ul { position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(10px); background: rgba(13,13,13,0.95); min-width: 180px; border-radius: 16px; padding: 8px 0; opacity: 0; visibility: hidden; transition: all 0.3s ease; box-shadow: 0 15px 40px rgba(0,0,0,0.3); border: 1px solid rgba(223,166,103,0.3); display: flex; flex-direction: column; gap: 4px; }
        .header__menu ul li.dropdown:hover > ul { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(5px); }
        .header__menu ul li.dropdown > ul li a { padding: 8px 20px; border-radius: 0; text-align: center; font-size: 13px; }
        .header__menu ul li.dropdown > a::after { content: '▾'; margin-left: 6px; font-size: 14px; color: #dfa667; }
        .canvas__open { display: none; }
        @media (max-width: 991px) { .header { top: 10px; left: 10px; right: 10px; max-width: calc(100% - 20px); } .header__menu { display: none; } .canvas__open { display: flex !important; align-items: center; justify-content: center; position: fixed; top: 15px; right: 15px; z-index: 1001; background: rgba(13,13,13,0.9); width: 50px; height: 50px; border-radius: 50%; border: 1px solid rgba(223,166,103,0.3); color: #fff; } .hamburger-bars { display: block; width: 24px; height: 14px; background: repeating-linear-gradient(to bottom, currentColor 0, currentColor 2px, transparent 2px, transparent 6px); } }
        @media (min-width: 992px) { .canvas__open { display: none !important; } }
        /* Unified footer */
        .footer { background: linear-gradient(rgba(13,13,13,0.92), rgba(13,13,13,0.97)), url('/cn_uecc_website/static/img/footer-bg.jpg'); background-size: cover; background-position: center; padding: 50px 0 20px; color: #fff; border-top: 3px solid #dfa667; }
        .footer__content { display: flex; flex-direction: column; align-items: center; text-align: center; }
        .footer__logo { margin-bottom: 30px; align-self: flex-start; } .footer__logo img { height: 50px; width: auto; }
        .footer__branches { display: flex; justify-content: center; gap: 40px; margin-bottom: 40px; width: 100%; }
        .branch-item { flex: 0 1 auto; min-width: 200px; }
        .country-label { font-size: 11px; font-weight: 700; letter-spacing: 0.24em; text-transform: uppercase; color: #dfa667; border-left: 2px solid #dfa667; padding-left: 8px; margin-bottom: 12px; }
        .branch-address { font-size: 13px; line-height: 1.7; color: rgba(255,255,255,0.9); margin-bottom: 8px; }
        .branch-link { color: #e0c26e; text-decoration: none; font-size: 13px; }
        .branch-divider { width: 1px; height: 80px; background: linear-gradient(to bottom, transparent, #dfa667, transparent); margin: auto 0; }
        .footer__pages { margin-bottom: 40px; width: 100%; } .footer__pages h6 { font-size: 11px; font-weight: 700; letter-spacing: 0.26em; text-transform: uppercase; color: #dfa667; margin-bottom: 20px; }
        .pages-grid { display: grid; grid-template-columns: repeat(5, auto); gap: 12px 30px; justify-content: center; list-style: none; padding: 0; }
        .pages-grid li a { color: #fff; text-decoration: none; font-size: 13px; } .pages-grid li a:hover { color: #dfa667; }
        .footer__social { display: flex; gap: 12px; justify-content: center; margin-bottom: 30px; }
        .footer__social a { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: 1px solid #dfa667; border-radius: 50%; color: #fff; font-size: 14px; text-decoration: none; }
        .copyright { padding-top: 20px; border-top: 1px solid rgba(223,166,103,0.2); text-align: center; font-size: 11px; color: rgba(255,255,255,0.6); width: 100%; }
        @media (max-width: 768px) { .footer__branches { flex-direction: column; } .branch-divider { width: 80px; height: 1px; margin: 10px 0; } .pages-grid { grid-template-columns: repeat(2, auto); } }
        @media (max-width: 480px) { .pages-grid { grid-template-columns: 1fr; } }
    

                /* === NAVIGATION DROPDOWN STYLES === */
                .header__menu .dropdown {
                    position: relative;
                }

                    .header__menu .dropdown > a {
                        display: flex;
                        align-items: center;
                        gap: 5px;
                        position: relative;
                    }

                        .header__menu .dropdown > a .fa-chevron-down {
                            font-size: 12px;
                            transition: transform 0.3s ease;
                            margin-left: 5px;
                        }

                    .header__menu .dropdown:hover > a .fa-chevron-down,
                    .header__menu .dropdown.active > a .fa-chevron-down {
                        transform: rotate(180deg);
                    }

                .header__menu .dropdown-menu {
                    position: absolute;
                    top: 100%;
                    left: 0;
                    background: white;
                    min-width: 220px;
                    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
                    border-radius: 8px;
                    padding: 10px 0;
                    opacity: 0;
                    visibility: hidden;
                    transform: translateY(15px);
                    transition: all 0.3s ease;
                    z-index: 1000;
                    border: none;
                    margin-top: 10px;
                }

                .header__menu .dropdown:hover .dropdown-menu,
                .header__menu .dropdown.active .dropdown-menu {
                    opacity: 1;
                    visibility: visible;
                    transform: translateY(0);
                }

                .header__menu .dropdown-menu:before {
                    content: '';
                    position: absolute;
                    top: -8px;
                    left: 20px;
                    width: 0;
                    height: 0;
                    border-left: 8px solid transparent;
                    border-right: 8px solid transparent;
                    border-bottom: 8px solid white;
                }

                .header__menu .dropdown-menu li {
                    margin: 0;
                    list-style: none;
                }

                    .header__menu .dropdown-menu li a {
                        padding: 12px 25px;
                        color: #333;
                        font-weight: 500;
                        transition: all 0.3s ease;
                        display: block;
                        border-left: 3px solid transparent;
                        font-family: "Poppins", sans-serif;
                        text-decoration: none;
                    }

                        .header__menu .dropdown-menu li a:hover {
                            background: #f8f9fa;
                            color: #d4af37;
                            border-left-color: #d4af37;
                            padding-left: 30px;
                        }

                /* Mobile dropdown adjustments */
                @media (max-width: 768px) {
                    .header__menu .dropdown-menu {
                        position: static;
                        opacity: 1;
                        visibility: visible;
                        transform: none;
                        box-shadow: none;
                        background: transparent;
                        display: none;
                        margin-top: 0;
                        padding: 0;
                    }

                    .header__menu .dropdown.active .dropdown-menu {
                        display: block;
                    }

                    .header__menu .dropdown-menu:before {
                        display: none;
                    }

                    .header__menu .dropdown-menu li a {
                        padding: 10px 15px;
                        border-left: none;
                        border-bottom: 1px solid #f0f0f0;
                    }

                        .header__menu .dropdown-menu li a:hover {
                            padding-left: 20px;
                            border-left: none;
                            border-bottom-color: #d4af37;
                        }
                }

                /* === HERO SLIDER ADJUSTMENTS === */
                .hero__items {
                    height: 50vh !important;
                    min-height: 400px;
                    background-position: center 30% !important;
                }

                .hero__text {
                    text-align: center;
                }
                .hero__text h2 {
                    font-family: 'Aldrich', sans-serif;
                    font-size: 3rem;
                    margin-bottom: 1rem;
                    animation: fadeInDown 1s ease-out;
                }

                .hero__text p {
                    font-size: 1.2rem;
                    animation: fadeInUp 1s ease-out 0.3s both;
                }

                /* === BOARD OF DIRECTORS SECTION === */
                .board-section {
                    padding: 100px 0;
                    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
                }

                .board-member {
                    margin-bottom: 120px;
                    opacity: 0;
                    transform: translateY(50px);
                    transition: all 0.8s ease;
                }

                    .board-member.animated {
                        opacity: 1;
                        transform: translateY(0);
                    }

                .board-content {
                    padding: 40px;
                    position: relative;
                    z-index: 2;
                }

                .slide-in-left {
                    opacity: 0;
                    transform: translateX(-100px);
                    transition: all 0.8s ease;
                }

                .slide-in-right {
                    opacity: 0;
                    transform: translateX(100px);
                    transition: all 0.8s ease;
                }

                .board-member.animated .slide-in-left,
                .board-member.animated .slide-in-right {
                    opacity: 1;
                    transform: translateX(0);
                }

                .board-content h2 {
                    font-family: 'Aldrich', sans-serif;
                    font-size: 2.5rem;
                    color: #333;
                    margin-bottom: 0.5rem;
                    font-weight: 600;
                }

                .board-content h3 {
                    font-family: 'Poppins', sans-serif;
                    font-size: 1.3rem;
                    color: #d4af37;
                    margin-bottom: 1.5rem;
                    font-weight: 500;
                }

                .board-divider {
                    width: 80px;
                    height: 3px;
                    background: linear-gradient(90deg, #d4af37, #b8941f);
                    margin: 2rem 125px;
                    border-radius: 2px;
                }

                .board-content p {
                    font-size: 1.1rem;
                    line-height: 1.75;
                    text-align: justify;
                    color: #666;
                    margin-bottom: 2rem;
                }

                .board-qualifications h4 {
                    font-family: 'Aldrich', sans-serif;
                    font-size: 1.2rem;
                    color: #333;
                    margin-bottom: 1rem;
                }

                .board-qualifications ul {
                    list-style: none;
                    padding: 0;
                }

                .board-qualifications li {
                    padding: 0.5rem 0;
                    padding-left: 1.5rem;
                    position: relative;
                    color: #555;
                    font-size: 1rem;
                }

                    .board-qualifications li:before {
                        content: '▸';
                        position: absolute;
                        left: 0;
                        color: #d4af37;
                        font-weight: bold;
                    }

                /* === UPDATED BOARD IMAGE STYLES - SMALLER WITH FRAME === */
                .board-image {
                    position: relative;
                    padding: 20px;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                }

                .image-frame {
                    width: 300px;
                    height: 450px;
                    border: 15px solid white;
                    border-radius: 10px;
                    box-shadow: 0 15px 40px rgba(0,0,0,0.15);
                    background: white;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    position: relative;
                    overflow: hidden;
                    transition: all 0.6s ease;
                }

                .board-member:hover .image-frame {
                    transform: translateY(-10px) scale(1.02);
                    box-shadow: 0 25px 60px rgba(0,0,0,0.2);
                }

                .image-container {
                    width: 100%;
                    height: 100%;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    overflow: hidden;
                    border-radius: 5px;
                }

                .board-image img {
                    width: 100%;
                    height: 100%;
                    object-fit: contain;
                    transition: transform 0.6s ease;
                }

                .board-member:hover .board-image img {
                    transform: scale(1.05);
                }

                /* === MISSION & VISION SECTION === */
                .mission-vision-section {
                    padding: 100px 0;
                    background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
                    color: white;
                }

                .mission-card,
                .vision-card {
                    background: rgba(255, 255, 255, 0.1);
                    backdrop-filter: blur(10px);
                    border-radius: 20px;
                    padding: 50px 40px;
                    margin: 20px 0;
                    border: 1px solid rgba(255, 255, 255, 0.2);
                    opacity: 0;
                    transform: translateY(50px);
                    transition: all 0.8s ease;
                }

                    .mission-card.animated,
                    .vision-card.animated {
                        opacity: 1;
                        transform: translateY(0);
                    }

                    .mission-card:hover,
                    .vision-card:hover {
                        transform: translateY(-10px);
                        box-shadow: 0 20px 40px rgba(0,0,0,0.3);
                    }

                .card-icon {
                    font-size: 3rem;
                    color: #d4af37;
                    margin-bottom: 2rem;
                }

                .mission-card h3,
                .vision-card h3 {
                    font-family: 'Aldrich', sans-serif;
                    font-size: 2rem;
                    margin-bottom: 1.5rem;
                    color: white;
                }

                .mission-card p,
                .vision-card p {
                    font-size: 1.1rem;
                    line-height: 1.8;
                    color: #ccc;
                }

                /* === ANIMATION KEYFRAMES === */
                @keyframes fadeInDown {
                    from {
                        opacity: 0;
                        transform: translateY(-50px);
                    }

                    to {
                        opacity: 1;
                        transform: translateY(0);
                    }
                }

                @keyframes fadeInUp {
                    from {
                        opacity: 0;
                        transform: translateY(50px);
                    }

                    to {
                        opacity: 1;
                        transform: translateY(0);
                    }
                }

                @keyframes slideInLeft {
                    from {
                        opacity: 0;
                        transform: translateX(-100px);
                    }

                    to {
                        opacity: 1;
                        transform: translateX(0);
                    }
                }

                @keyframes slideInRight {
                    from {
                        opacity: 0;
                        transform: translateX(100px);
                    }

                    to {
                        opacity: 1;
                        transform: translateX(0);
                    }
                }

                /* === RESPONSIVE DESIGN === */
                @media (max-width: 1200px) {
                    .image-frame {
                        width: 350px;
                        height: 400px;
                    }
                }

                @media (max-width: 992px) {
                    .board-content h2 {
                        font-size: 2rem;
                    }

                    .board-content h3 {
                        font-size: 1.1rem;
                    }

                    .image-frame {
                        width: 300px;
                        height: 350px;
                    }

                    .mission-card,
                    .vision-card {
                        padding: 30px 25px;
                    }
                }

                @media (max-width: 768px) {
                    .board-section {
                        padding: 60px 0;
                    }

                    .board-member {
                        margin-bottom: 80px;
                    }

                    .board-content {
                        padding: 20px;
                        text-align: center;
                    }
                    .board-content p {
                        text-align: justify;
                    }

                    .board-image {
                        padding: 10px;
                        margin-top: 30px;
                    }

                    .image-frame {
                        width: 280px;
                        height: 320px;
                        border-width: 10px;
                    }

                    .mission-card h3,
                    .vision-card h3 {
                        font-size: 1.5rem;
                    }

                    /* Mobile dropdown adjustments */
                    .header__menu .dropdown-menu {
                        position: static;
                        opacity: 1;
                        visibility: visible;
                        transform: none;
                        box-shadow: none;
                        background: transparent;
                        display: none;
                    }

                    .header__menu .dropdown.active .dropdown-menu {
                        display: block;
                    }
                }

                @media (max-width: 576px) {
                    .hero__text h2 {
                        font-size: 2rem;
                    }

                    .board-content h2 {
                        font-size: 1.5rem;
                    }

                    .board-content p {
                        font-size: 1rem;
                        text-align: justify;
                    }

                    /* .image-frame {
                        width: 250px;
                        height: 280px;
                        border-width: 8px;
                    }*/
                }

                /* ===== MOBILE MENU BUTTON VISIBILITY ===== */
                /* Only show canvas button on mobile */
                @media (min-width: 992px) {
                    .canvas__open {
                        display: none;
                    }
                }

                @media (max-width: 991px) {
                    .canvas__open {
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        position: fixed;
                        top: 15px;
                        right: 15px;
                        z-index: 1001;
                        background: rgba(13, 13, 13, 0.9);
                        backdrop-filter: blur(10px);
                        width: 50px;
                        height: 50px;
                        border-radius: 50%;
                        border: 1px solid rgba(201, 168, 76, 0.3);
                        color: #fff;
                        font-size: 22px;
                        cursor: pointer;
                    }
                    .canvas__open i,
                    .canvas__open .fa {
                        color: inherit;
                        display: inline-block;
                    }
                    .hamburger-bars {
                        display: block;
                        width: 24px;
                        height: 14px;
                        background: repeating-linear-gradient(to bottom, currentColor 0, currentColor 2px, transparent 2px, transparent 6px);
                        border-radius: 1px;
                    }
                }


                /* === FOOTER STYLES === */
                .footer {
                    padding-top: 50px; /* Reduced from 90px */
                }

                .footer__top {
                    border-bottom: 1px solid rgba(183, 183, 183, 0.2);
                    padding-bottom: 40px; /* Reduced from 75px */
                    margin-bottom: 40px; /* Reduced from 85px */
                }

                .footer__top__text h2 {
                    color: #ffffff;
                    font-size: 38px;
                    text-transform: uppercase;
                }

                .footer__top__newslatter form {
                    position: relative;
                }

                    .footer__top__newslatter form input {
                        width: 100%;
                        height: 50px;
                        color: #b7b7b7;
                        padding-left: 30px;
                        font-size: 14px;
                        border: none;
                    }

                        .footer__top__newslatter form input::-webkit-input-placeholder {
                            color: #b7b7b7;
                        }

                        .footer__top__newslatter form input::-moz-placeholder {
                            color: #b7b7b7;
                        }

                        .footer__top__newslatter form input:-ms-input-placeholder {
                            color: #b7b7b7;
                        }

                        .footer__top__newslatter form input::-ms-input-placeholder {
                            color: #b7b7b7;
                        }

                        .footer__top__newslatter form input::placeholder {
                            color: #b7b7b7;
                        }

                    .footer__top__newslatter form button {
                        font-size: 14px;
                        color: #ffffff;
                        background: #dfa667;
                        border: none;
                        height: 100%;
                        padding: 0 20px;
                        position: absolute;
                        right: 0;
                        top: 0;
                    }

                .footer__about {
                    margin-bottom: 20px; /* Reduced from 30px */
                }

                    .footer__about .footer__logo {
                        margin-bottom: 15px; /* Reduced from 24px */
                    }

                        .footer__about .footer__logo a {
                            display: inline-block;
                        }

                    .footer__about p {
                        margin-bottom: 15px; /* Reduced from 30px */
                    }

                    .footer__about ul {
                        margin-bottom: 20px; /* Reduced from 38px */
                    }

                        .footer__about ul li {
                            font-size: 15px;
                            list-style: none;
                            line-height: 26px;
                            color: #707070;
                        }

                    .footer__about .footer__social a {
                        font-size: 18px;
                        color: #ffffff;
                        -webkit-transition: all, 0.3s;
                        -o-transition: all, 0.3s;
                        transition: all, 0.3s;
                        margin-right: 30px;
                    }

                        .footer__about .footer__social a:hover {
                            color: #dfa667;
                        }

                        .footer__about .footer__social a:last-child {
                            margin-right: 0;
                        }

                .footer__widget {
                    margin-bottom: 20px; /* Reduced from 30px */
                }

                    .footer__widget h6 {
                        color: #ffffff;
                        font-weight: 600;
                        font-family: "Poppins", sans-serif;
                        margin-bottom: 20px; /* Reduced from 30px */
                    }

                    .footer__widget ul li {
                        list-style: none;
                    }

                        .footer__widget ul li a {
                            font-size: 15px;
                            color: #707070;
                            line-height: 36px;
                        }

                .footer__address {
                    margin-bottom: 20px; /* Reduced from 30px */
                }

                    .footer__address h6 {
                        color: #ffffff;
                        font-weight: 600;
                        font-family: "Poppins", sans-serif;
                        margin-bottom: 20px; /* Reduced from 30px */
                    }

                    .footer__address p {
                        margin-bottom: 20px; /* Reduced from 30px */
                    }

                    .footer__address ul li {
                        font-size: 15px;
                        list-style: none;
                        line-height: 26px;
                        color: #707070;
                    }

                .copyright {
                    border-top: 1px solid rgba(183, 183, 183, 0.2);
                    padding: 20px 0; /* Reduced from 25px */
                    margin-top: 30px; /* Reduced from 60px */
                }

                .copyright__text p {
                    margin-bottom: 0;
                }

                    .copyright__text p i {
                        color: #dfa667;
                    }

                    .copyright__text p a {
                        color: #ffffff;
                    }

                .copyright__widget {
                    text-align: right;
                }

                    .copyright__widget a {
                        font-size: 14px;
                        color: #707070;
                        margin-right: 36px;
                        position: relative;
                    }

                        .copyright__widget a:after {
                            position: absolute;
                            right: -22px;
                            top: -3px;
                            content: "|";
                        }

                        .copyright__widget a:last-child {
                            margin-right: 0;
                        }

                            .copyright__widget a:last-child:after {
                                display: none;
                            }

                /*---------------------
          Footer Profile Button
        -----------------------*/

                .footer__profile {
                    display: flex;
                    justify-content: flex-start;
                    align-items: flex-start;
                    height: 100%;
                    padding-top: 10px;
                }

                .footer__profile__btn {
                    text-align: left;
                    margin-top: 0;
                }

                .btn-company-profile {
                    display: inline-flex;
                    align-items: center;
                    justify-content: center;
                    background: linear-gradient(135deg, #dfa667, #c18948);
                    color: #fff;
                    text-transform: uppercase;
                    font-weight: 600;
                    padding: 12px 30px;
                    border-radius: 25px;
                    text-decoration: none;
                    transition: all 0.3s ease;
                    font-size: 14px;
                    box-shadow: 0 4px 15px rgba(223, 166, 103, 0.3);
                    border: none;
                    min-width: 160px;
                    text-align: center;
                }

                    .btn-company-profile:hover {
                        background: linear-gradient(135deg, #c18948, #a5733a);
                        color: #fff;
                        text-decoration: none;
                        transform: translateY(-2px);
                        box-shadow: 0 6px 20px rgba(223, 166, 103, 0.4);
                    }

                /* Responsive adjustments for footer profile */
                @media (max-width: 991px) {
                    .footer__profile {
                        justify-content: center;
                        margin-top: 20px; /* Reduced from 30px */
                    }

                    .footer__profile__btn {
                        text-align: center;
                    }
                }

                @media (max-width: 767px) {
                    .footer__profile {
                        margin-top: 15px; /* Reduced from 20px */
                    }

                    .btn-company-profile {
                        padding: 10px 25px;
                        font-size: 13px;
                        min-width: 140px;
                    }
                }

                /* === UPDATED FOOTER CONTACT STYLES === */
                .footer__about .branches-title {
                    font-weight: 600;
                    color: #ffffff;
                    margin-bottom: 10px; /* Reduced spacing */
                    font-size: 16px;
                }

                .footer__about .country-title {
                    font-weight: 600;
                    color: #dfa667;
                    margin-bottom: 5px; /* Reduced spacing */
                    font-size: 14px;
                }

                .footer__about .address {
                    color: #b7b7b7;
                    margin-bottom: 10px; /* Reduced spacing */
                    font-size: 14px;
                    line-height: 1.4;
                }

                .footer__about .contact-info {
                    margin-bottom: 15px; /* Reduced spacing */
                }

                    .footer__about .contact-info li {
                        margin-bottom: 5px; /* Reduced spacing */
                    }

                    .footer__about .contact-info a {
                        color: #b7b7b7;
                        text-decoration: none;
                        transition: color 0.3s ease;
                        font-size: 14px;
                    }

                        .footer__about .contact-info a:hover {
                            color: #dfa667;
                            text-decoration: underline;
                        }