/*
Theme Name: Twenty Twenty One Child
Theme URI: https://wichaiyuangkaew.com
Description: A child theme for WOOD WORTH INTERNATIONAL NATURE SCHOOL.
Author: Wichai Yuangkaew
Author URI: https://wichaiyuangkaew.com/
Template: twentytwentyone
Version: 1.8
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css");
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700&family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Roboto:ital,wght@0,300;0,400;0,500;0,700;1,400&family=Source+Serif+4:ital,opsz,wght@0,8..60,400..800;1,8..60,400..800&display=swap');
@font-face {
    font-family: 'Sukhumvit Set';
    src: url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Text.eot');
    src: url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Text.eot?#iefix') format('embedded-opentype'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Text.woff2') format('woff2'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Text.woff') format('woff'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Text.ttf') format('truetype'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Text.svg#SukhumvitSet-Text') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Sukhumvit Set';
    src: url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Thin.eot');
    src: url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Thin.eot?#iefix') format('embedded-opentype'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Thin.woff2') format('woff2'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Thin.woff') format('woff'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Thin.ttf') format('truetype'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Thin.svg#SukhumvitSet-Thin') format('svg');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Sukhumvit Set';
    src: url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-SemiBold.eot');
    src: url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-SemiBold.woff2') format('woff2'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-SemiBold.woff') format('woff'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-SemiBold.ttf') format('truetype'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-SemiBold.svg#SukhumvitSet-SemiBold') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Sukhumvit Set';
    src: url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Medium.eot');
    src: url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Medium.eot?#iefix') format('embedded-opentype'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Medium.woff2') format('woff2'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Medium.woff') format('woff'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Medium.ttf') format('truetype'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Medium.svg#SukhumvitSet-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Sukhumvit Set';
    src: url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Light.eot');
    src: url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Light.eot?#iefix') format('embedded-opentype'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Light.woff2') format('woff2'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Light.woff') format('woff'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Light.ttf') format('truetype'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Light.svg#SukhumvitSet-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Sukhumvit Set';
    src: url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Bold.eot');
    src: url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Bold.eot?#iefix') format('embedded-opentype'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Bold.woff2') format('woff2'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Bold.woff') format('woff'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Bold.ttf') format('truetype'),
        url('../twentytwentyone-child/assets/fonts/SukhumvitSet/SukhumvitSet-Bold.svg#SukhumvitSet-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
.grecaptcha-badge { 
    visibility: hidden;
}

/* ==========================================================================
   Woodworth International Nature School - Design Tokens & Brand System
   ========================================================================== */
:root {
    /* Brand Colors */
    --global--color-background: #FAF9F5; /* Warm Oat Milk Base */
    --global--color-primary: #132B45;    /* Academic Deep Navy */
    --global--color-secondary: #6A7F5B;  /* Moss Olive Green */
    --global--color-olive: #6A7F5B;
    --global--color-mist: #EFF3ED;       /* Soft Mist Tint */
    --global--color-terracotta: #132B45; /* Warm Terracotta CTA */
    --global--color-slate: #2B343D;      /* Slate Neutral Text */

    /* Buttons */
    --button--color-background: #132B45;
    --button--color-text: #FFFFFF;
    --button--color-background-active: #6A7F5B; 

    /* Typography System (Scandinavian Clean + Thai Sukhumvit / Source Serif 4 Headings) */
    --global--font-primary: 'Plus Jakarta Sans', 'Sukhumvit Set', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --global--font-secondary: 'Plus Jakarta Sans', 'Sukhumvit Set', sans-serif;
    --heading--font-family: 'Source Serif 4', 'Sukhumvit Set', Georgia, serif;
}

/* Base Body Styling */
body,
.site,
.site-content {
    background-color: var(--global--color-background);
    color: var(--global--color-slate);
    font-family: var(--global--font-primary);
}

/* Headings */
h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6,
.entry-title,
.site-title,
h1.wp-block-heading,
h2.wp-block-heading,
h3.wp-block-heading,
h4.wp-block-heading,
h5.wp-block-heading,
h6.wp-block-heading {
    clear: both;
    color: var(--global--color-primary);
    font-family: var(--heading--font-family);
    font-weight: 600;
}

/* --- Brand Signature: INTERNATIONAL NATURE SCHOOL Typography --- */
.school-tagline,
.school-subtext,
.is-style-tagline {
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--global--color-primary);
    font-size: 0.85rem;
}

/* --- CTA Buttons (Terracotta Scandinavian) --- */
.btn-terracotta,
.header-cta-btn,
.wp-block-button.is-style-terracotta .wp-block-button__link {
    color: #FFFFFF !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    display: inline-block;
    border: none !important;
}

.btn-terracotta:hover,
.header-cta-btn:hover,
.wp-block-button.is-style-terracotta .wp-block-button__link:hover {
    color: #FFFFFF !important;
    transform: translateY(-2px);
}

/* --- Scandinavian Minimalist Cards & Box Containers --- */
.woodworth-card,
.is-style-woodworth-card {
    background: #FFFFFF;
    border-radius: 16px;
    padding: 32px;
    box-shadow: 0 4px 20px rgba(19, 43, 69, 0.05);
    border: 1px solid rgba(19, 43, 69, 0.06);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.woodworth-card:hover,
.is-style-woodworth-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(19, 43, 69, 0.08);
}

.woodworth-mist-box,
.is-style-mist-box {
    background-color: var(--global--color-mist);
    border-radius: 16px;
    padding: 32px;
}

/* --- Contact Form 7 Scandinavian Styling --- */
.wpcf7 form input[type="text"],
.wpcf7 form input[type="email"],
.wpcf7 form input[type="tel"],
.wpcf7 form input[type="date"],
.wpcf7 form textarea,
.wpcf7 form select {
    width: 100%;
    background: #FFFFFF;
    border: 1px solid #D8DFD5;
    border-radius: 12px;
    padding: 12px 18px;
    font-size: 0.95rem;
    color: var(--global--color-slate);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.wpcf7 form input:focus,
.wpcf7 form textarea:focus,
.wpcf7 form select:focus {
    border-color: var(--global--color-secondary);
    outline: none;
    box-shadow: 0 0 0 3px rgba(106, 127, 91, 0.15);
}

.wpcf7 form input[type="submit"] {
    background-color: var(--global--color-terracotta);
    color: #FFFFFF;
    border: none;
    border-radius: 30px;
    padding: 12px 32px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.25s ease;
}

.wpcf7 form input[type="submit"]:hover {
    background-color: #6A7F5B; 
    transform: translateY(-1px);
}

/* ==========================================================================
   Header Responsive Display Control
   - Desktop (>= 1080px): แสดง site-top-header, ซ่อน site-top-header-mobile
   - Tablet & Mobile (< 1080px): ซ่อน site-top-header, แสดง site-top-header-mobile
   ========================================================================== */

/* 1. ค่าเริ่มต้นสำหรับ Tablet & Mobile (< 1080px) */
.site-top-header {
    display: none !important;
}

/* --- Mobile & Tablet Header Container Layout (< 1080px) --- */
@media screen and (max-width: 1080px) {
    /* แถบ Top Header (จัดวางแบบคอลัมน์กึ่งกลาง 4 แถวตามเรฟเฟอเรนซ์ - ปรับลดระยะห่างให้กระชับ) */
    .site-top-header-mobile {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 8px 16px 8px 16px !important;
        margin: 0 !important;
        background-color: #FAF9F5 !important; /* Warm Oat Milk Base */
        border-bottom: 1px solid rgba(19, 43, 69, 0.08) !important;
        box-sizing: border-box !important;
        gap: 4px !important;
    }

    /* แถวที่ 1 & 2: ข้อมูลติดต่อ (เบอร์โทร และ เวลาทำการ) */
    .site-top-header-mobile .site-contact {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 2px !important;
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
    }

    .site-top-header-mobile .site-phone,
    .site-top-header-mobile .site-phone a {
        color: #2B343D !important;
        font-size: 0.9rem !important;
        font-weight: 500 !important;
        text-decoration: none !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
        line-height: 1.25 !important;
        letter-spacing: 0.02em !important;
    }

    .site-top-header-mobile .site-phone i {
        color: #6A7F5B !important; /* Moss Olive Green */
        font-size: 0.95rem !important;
    }

    .site-top-header-mobile .site-worktime,
    .site-top-header-mobile .site-worktime a {
        color: #2B343D !important;
        font-size: 0.85rem !important;
        font-weight: 400 !important;
        text-decoration: none !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
        line-height: 1.25 !important;
    }

    .site-top-header-mobile .site-worktime i {
        color: #6A7F5B !important; /* Moss Olive Green */
        font-size: 0.95rem !important;
    }

    /* แถวที่ 3: Social Pills สไตล์แคปซูลคู่ ใช้ชุดสี WINS (Moss Olive Green #6A7F5B) */
    .site-top-header-mobile .site-social {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 10px !important;
        margin: 2px 0 0 0 !important;
        padding: 0 !important;
        width: 100% !important;
    }

    .site-top-header-mobile .site-social .social-line,
    .site-top-header-mobile .site-social .social-tiktok,
    .site-top-header-mobile .site-social .social-pill {
        display: inline-flex !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .site-top-header-mobile .site-social a {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
        background-color: #6A7F5B !important; /* Moss Olive Green WINS */
        color: #FFFFFF !important;
        padding: 3px 14px !important;
        border-radius: 20px !important;
        font-size: 0.82rem !important;
        font-weight: 500 !important;
        text-decoration: none !important;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
        transition: background-color 0.2s ease, transform 0.2s ease !important;
    }

    .site-top-header-mobile .site-social a i {
        color: #FFFFFF !important;
        font-size: 0.92rem !important;
    }

    .site-top-header-mobile .site-social a:hover,
    .site-top-header-mobile .site-social a:focus {
        background-color: #132B45 !important; /* Deep Navy ตอน hover */
        color: #FFFFFF !important;
        transform: translateY(-1px) !important;
    }

    .site-top-header-mobile .site-social .title-line,
    .site-top-header-mobile .site-social .title-tiktok {
        display: none !important;
    }

    /* แถวที่ 4: สลับภาษา (Flag Icons + ข้อความ กึ่งกลาง ไม่มีจุด Bullet) */
    .site-top-header-mobile .site-language {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        margin-top: 0 !important;
        padding: 0 !important;
        width: 100% !important;
    }

    .site-top-header-mobile .language-menu-container,
    .site-top-header-mobile .language-menu-list {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 16px !important;
        list-style: none !important;
        list-style-type: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .site-top-header-mobile .language-menu-list li {
        display: inline-flex !important;
        align-items: center !important;
        list-style: none !important;
        list-style-type: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .site-top-header-mobile .language-menu-list li::marker {
        display: none !important;
        content: "" !important;
    }

    .site-top-header-mobile .language-menu-list li a {
        color: #2B343D !important;
        font-size: 0.86rem !important;
        font-weight: 500 !important;
        text-decoration: none !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
        transition: color 0.2s ease !important;
    }

    .site-top-header-mobile .language-menu-list li a:hover,
    .site-top-header-mobile .language-menu-list li a:focus {
        color: #6A7F5B !important;
    }

    .site-top-header-mobile .language-menu-list li a[href*="/th"]::before,
    .site-top-header-mobile .language-menu-list li.menu-item-31 a::before {
        content: "" !important;
        display: inline-block !important;
        width: 18px !important;
        height: 18px !important;
        background-image: url("polylang/flags/th.png") !important;
        background-size: cover !important;
        background-position: center !important;
        border-radius: 50% !important;
        flex-shrink: 0 !important;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
    }

    .site-top-header-mobile .language-menu-list li a[href*="/en"]::before,
    .site-top-header-mobile .language-menu-list li.menu-item-32 a::before {
        content: "" !important;
        display: inline-block !important;
        width: 18px !important;
        height: 18px !important;
        background-image: url("polylang/flags/us.png") !important;
        background-size: cover !important;
        background-position: center !important;
        border-radius: 50% !important;
        flex-shrink: 0 !important;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
    }

    /* แถบ Navbar หลัก เป็น Sticky ติดด้านบนสุดเมื่อ scroll */
    .site-header {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        max-width: 100% !important;
        background-color: #1a2e51 !important; /* Academic Deep Navy */
        padding: 10px 20px !important;
        margin: 0 !important;
        position: sticky !important;
        top: 0 !important;
        box-sizing: border-box !important;
        border-bottom: none !important;
        z-index: 99999 !important;
        transition: box-shadow 0.25s ease, padding 0.25s ease !important;
    }

    .site-header.is-scrolled {
        box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35) !important;
        padding: 8px 20px !important;
    }

    /* ขยายขนาดโลโก้ให้เหมาะสม สวยงาม คมชัด */
    .site-header .site-branding {
        display: flex !important;
        align-items: center !important;
        margin: 0 !important;
        padding: 0 !important;
        flex: 1 !important;
    }

    .site-header .site-branding .site-logo {
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
    }

    .site-header .site-branding .site-logo img,
    .site-header .site-branding .custom-logo,
    .site-header .site-branding .custom-logo-link img {
        height: 48px !important; /* ขยายขนาดโลโก้ใน Mobile */
        max-height: 52px !important;
        width: auto !important;
        max-width: 240px !important;
        object-fit: contain !important;
        display: block !important;
        margin: 0 !important;
    }

    /* ปุ่มเมนู Hamburger: ไม่มีสีพื้น + ซ่อนตัวอักษร Menu/Close ที่ซ่อนอยู่ด้านล่าง */
    .site-header .primary-navigation {
        margin: 0 !important;
        padding: 0 !important;
        width: auto !important;
        position: static !important; /* ให้ลูกใช้ absolute อิงกับ .site-header เต็มหน้าจอ */
    }

    /* 1. ซ่อน Primary Mobile Menu Toggle ในโหมด Mobile และ Tablet ทั้งหมด */
    .site-header .primary-navigation .menu-button-container,
    #primary-mobile-menu {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    /* 2. ใช้งานและปรับแต่ง mega-menu-toggle ในโหมด Mobile และ Tablet (< 1080px) */
    #mega-menu-wrap-primary {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        width: auto !important;
        background: transparent !important;
        background-color: transparent !important;
        margin: 0 !important;
        padding: 0 !important;
        position: static !important; /* ตำแหน่ง static เพื่อให้ #mega-menu-primary ยึดความกว้างเต็ม .site-header */
    }

    #mega-menu-wrap-primary .mega-menu-toggle {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: transparent !important;
        background-color: transparent !important;
        border: none !important;
        box-shadow: none !important;
        outline: none !important;
        padding: 6px !important;
        margin: 0 !important;
        height: auto !important;
        line-height: normal !important;
        cursor: pointer !important;
        width: auto !important;
        -webkit-appearance: none !important;
        z-index: 100000 !important;
    }

    #mega-menu-wrap-primary .mega-menu-toggle:hover,
    #mega-menu-wrap-primary .mega-menu-toggle:focus,
    #mega-menu-wrap-primary .mega-menu-toggle:active {
        background: transparent !important;
        background-color: transparent !important;
        box-shadow: none !important;
        outline: none !important;
    }

    #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-blocks-left,
    #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-blocks-center {
        display: none !important;
    }

    #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-blocks-right,
    #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-block-0 {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important;
        margin: 0 !important;
        height: auto !important;
        background: transparent !important;
        background-color: transparent !important;
    }

    #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-animated {
        background: transparent !important;
        background-color: transparent !important;
        border: none !important;
        outline: none !important;
        padding: 0 !important;
        margin: 0 !important;
        cursor: pointer !important;
        transform: none !important;
        height: 28px !important;
        width: 32px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* กล่องไอคอน Hamburger และโครงสร้างเส้นขีด 3 เส้น */
    #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-animated-box {
        width: 26px !important;
        height: 20px !important;
        position: relative !important;
        display: inline-block !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-animated-inner {
        position: absolute !important;
        top: 50% !important;
        left: 0 !important;
        right: 0 !important;
        width: 26px !important;
        height: 2.5px !important;
        margin-top: -1.25px !important;
        background-color: #FFFFFF !important;
        border-radius: 2px !important;
        transition: transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19), background-color 0.22s ease !important;
    }

    #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-animated-inner::before,
    #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-animated-inner::after {
        content: '' !important;
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        width: 26px !important;
        height: 2.5px !important;
        background-color: #FFFFFF !important;
        border-radius: 2px !important;
        transition: transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19), top 0.22s ease, bottom 0.22s ease, opacity 0.22s ease !important;
    }

    #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-animated-inner::before {
        top: -7px !important;
    }

    #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-animated-inner::after {
        bottom: -7px !important;
        top: auto !important;
    }

    /* เมื่อเปิดเมนู (mega-menu-open): แปลงเป็นปุ่มกดปิด (ไอคอน X สวยงาม ชัดเจน สมมาตร 100%) */
    #mega-menu-wrap-primary .mega-menu-toggle.mega-menu-open .mega-toggle-block-0 .mega-toggle-animated-inner,
    #mega-menu-wrap-primary .mega-menu-toggle.mega-menu-open .mega-toggle-block-0 .mega-toggle-animated-slider .mega-toggle-animated-inner,
    #mega-menu-wrap-primary .mega-menu-toggle.mega-menu-open .mega-toggle-animated-inner {
        background-color: transparent !important;
        background: transparent !important;
        transform: none !important;
    }

    #mega-menu-wrap-primary .mega-menu-toggle.mega-menu-open .mega-toggle-block-0 .mega-toggle-animated-inner::before,
    #mega-menu-wrap-primary .mega-menu-toggle.mega-menu-open .mega-toggle-block-0 .mega-toggle-animated-slider .mega-toggle-animated-inner::before,
    #mega-menu-wrap-primary .mega-menu-toggle.mega-menu-open .mega-toggle-animated-inner::before {
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        transform: rotate(45deg) !important;
        background-color: #FFFFFF !important;
        opacity: 1 !important;
    }

    #mega-menu-wrap-primary .mega-menu-toggle.mega-menu-open .mega-toggle-block-0 .mega-toggle-animated-inner::after,
    #mega-menu-wrap-primary .mega-menu-toggle.mega-menu-open .mega-toggle-block-0 .mega-toggle-animated-slider .mega-toggle-animated-inner::after,
    #mega-menu-wrap-primary .mega-menu-toggle.mega-menu-open .mega-toggle-animated-inner::after {
        top: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        transform: rotate(-45deg) !important;
        background-color: #FFFFFF !important;
        opacity: 1 !important;
    }

    /* ซ่อนตัวอักษรใดๆ ที่อาจค้างอยู่ใน mega-menu-toggle */
    #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-label {
        display: none !important;
    }

    /* กล่องเมนู Dropdown ของ Max Mega Menu: แสดงผลเต็มหน้าจอ (Full Width 100%) ใต้ Navbar ตรงเป๊ะ */
    #mega-menu-wrap-primary #mega-menu-primary {
        background-color: #1a2e51 !important; /* สีกรมท่า WINS Deep Navy */
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 16px 24px 28px 24px !important;
        box-shadow: 0 16px 36px rgba(0, 0, 0, 0.45) !important;
        z-index: 99999 !important;
        border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
        margin: 0 !important;
    }

    #mega-menu-wrap-primary .mega-menu-toggle.mega-menu-open + #mega-menu-primary {
        display: flex !important;
        flex-direction: column !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item {
        display: block !important;
        width: 100% !important;
        max-height: none !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:last-child {
        border-bottom: none !important;
    }

    #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link {
        color: #FFFFFF !important;
        font-family: 'Cinzel', 'Sukhumvit Set', Georgia, serif !important;
        font-size: 1.05rem !important;
        font-weight: 500 !important;
        padding: 14px 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        text-decoration: none !important;
        background: transparent !important;
        transition: color 0.2s ease, padding-left 0.2s ease !important;
    }

    #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:hover,
    #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:focus {
        color: #6A7F5B !important; /* Moss Olive Green WINS */
        background: transparent !important;
        padding-left: 6px !important;
    }

    #mega-menu-wrap-primary #mega-menu-primary ul.mega-sub-menu {
        background: rgba(0, 0, 0, 0.15) !important;
        padding: 6px 16px !important;
    }

    #mega-menu-wrap-primary #mega-menu-primary ul.mega-sub-menu li a {
        color: rgba(255, 255, 255, 0.85) !important;
        font-family: 'Plus Jakarta Sans', 'Sukhumvit Set', sans-serif !important;
        font-size: 0.92rem !important;
        padding: 8px 0 !important;
    }

    #mega-menu-wrap-primary #mega-menu-primary ul.mega-sub-menu li a:hover {
        color: #6A7F5B !important;
    }
}

/* ปรับแต่งสำหรับ Tablet โดยเฉพาะ (หน้าจอ 600px - 1080px) */
@media screen and (min-width: 600px) and (max-width: 1080px) {
    header#masthead,
    .site-header {
        padding: 6px 28px !important;
    }

    header#masthead.is-scrolled,
    .site-header.is-scrolled {
        padding: 6px 28px !important;
    }

    /* ขยายโลโก้ให้เด่นสง่างามบน Tablet */
    .site-header .site-branding .site-logo img,
    .site-header .site-branding .custom-logo,
    .site-header .site-branding .custom-logo-link img {
        height: 56px !important;
        max-height: 60px !important;
        max-width: 300px !important;
    }
}

/* 2. สำหรับหน้าจอ Desktop (กว้างตั้งแต่ 1080px ขึ้นไป) - Full Screen Width & Centered Layout */
@media screen and (min-width: 1081px) {
    /* ซ่อน Header Mobile */
    .site-top-header-mobile {
        display: none !important;
    }

    /* Container รวมของ Header ทั้งหมด (Full Screen Width 100% + สีพื้นหลังน้ำเงิน) */
    header#masthead:not(.is-scrolled),
    .site-header:not(.is-scrolled),
    .site-header.is-sticky:not(.is-scrolled),
    .tw-header-sticky .site-header:not(.is-scrolled),
    .tw-header-opaque .site-header:not(.is-scrolled) {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 4px 40px 10px 40px !important;
        margin: 0 !important;
        background-color: #1a2e51 !important; /* สีกรมท่า #1a2e51 */
        border-bottom: none !important;
        position: sticky !important;
        top: 0 !important;
        z-index: 99999 !important;
        transition: padding 0.25s ease, box-shadow 0.25s ease !important;
    }


    /* 1. แถบ Top Header ด้านบน (ปรับลดความสูง, ลด Padding บนล่าง, ลดขนาดฟอนต์, ไม่มีเส้นขอบล่าง) */
    .site-top-header {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 4px 0 !important;
        padding: 2px 0 4px 0 !important;
        border-bottom: none !important; /* ไม่มีเส้น border ล่าง */
        font-size: 0.8rem !important; /* ลดขนาดฟอนต์ลง */
        line-height: 1.2 !important;
        position: relative !important;
        z-index: 5 !important;
    }

    .site-top-header,
    .site-top-header a {
        color: #FFFFFF !important; /* ลิงค์และข้อความสีขาว */
        font-size: 0.8rem !important; /* ลดขนาดฟอนต์ลง */
        line-height: 1.2 !important;
        text-decoration: none !important;
        transition: color 0.25s ease !important;
    }

    .site-top-header a:hover,
    .site-top-header a:focus {
        color: #6A7F5B !important; /* Hover สีเขียว */
    }

    .site-top-header a i {
        font-size: 0.8rem !important;
    }

    .site-top-header a span {
        color: inherit !important;
    }

    .site-top-header .site-contact {
        display: flex !important;
        align-items: center !important;
        gap: 20px !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1.2 !important;
    }

    .site-top-header .site-phone,
    .site-top-header .site-worktime {
        display: inline-flex !important;
        align-items: center !important;
        gap: 5px !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1.2 !important;
    }

    .site-top-header .site-social {
        display: flex !important;
        align-items: center !important;
        gap: 16px !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1.2 !important;
    }

    .site-top-header .site-social .social-line,
    .site-top-header .site-social .social-tiktok {
        display: inline-flex !important;
        align-items: center !important;
        gap: 5px !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1.2 !important;
    }

    .site-top-header .language-menu-container,
    .site-top-header .language-menu-container .language-menu-list {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        list-style: none !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1.2 !important;
    }

    .site-top-header .language-menu-container .language-menu-list li {
        margin: 0 !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        line-height: 1.2 !important;
    }

    /* 2. ส่วนโลโก้ตรงกลาง - แสดงผลซ้อนบน row ของ site-top-header เพื่อให้ขยายขนาดใหญ่ขึ้นได้ */
    .site-header .site-branding {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-top: -26px !important; /* ซ้อนขึ้นไปอยู่บน row ของ site-top-header ในตำแหน่งกึ่งกลาง */
        margin-bottom: 10px !important;
        padding: 0 !important;
        position: relative !important;
        z-index: 10 !important;
        pointer-events: none !important; /* ป้องกันพื้นที่ว่างโปร่งใสบังคลิกลิงก์บน site-top-header */
    }

    .site-header .site-branding .site-logo,
    .site-header .site-branding .site-logo a {
        display: inline-flex !important;
        justify-content: center !important;
        align-items: center !important;
        pointer-events: auto !important; /* ให้โลโก้คลิกเปิดหน้าแรกได้ตามปกติ */
    }

    .site-header .site-branding .site-logo img,
    .site-header .site-branding .custom-logo {
        height: 70px !important; /* ขยายขนาดความสูงของโลโก้ให้เด่นชัด */
        width: auto !important;
        max-height: 78px !important;
        margin: 0 auto !important;
        display: block !important;
        transition: transform 0.25s ease !important;
    }

    @media screen and (min-width: 1280px) {
        .site-header .site-branding .site-logo img,
        .site-header .site-branding .custom-logo {
            height: 76px !important; /* จอความละเอียดสูงขยายโลโก้ให้สง่างามยิ่งขึ้น */
            max-height: 84px !important;
        }
    }

    .site-header .site-branding .site-logo img:hover,
    .site-header .site-branding .custom-logo:hover {
        transform: scale(1.03);
    }

    /* 3. แถบเมนูตรงกลางใต้โลโก้ (Primary Nav - ความสูงห้ามเกิน 50px + กระชับระยะขอบ) */
    .site-header .primary-navigation {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        max-height: 50px !important; /* ความสูง row nav ห้ามเกิน 50px */
        height: auto !important;
    }

    .site-header .primary-navigation .menu-button-container {
        display: none !important;
    }

    .site-header .primary-navigation .primary-menu-container,
    .site-header .primary-navigation .menu-wrapper,
    .site-header .primary-navigation #primary-menu-list {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        flex-wrap: wrap !important;
        gap: 0 16px !important; /* ลดระยะขอบแนวตั้งเป็น 0 และระยะห่างแนวนอน 16px */
        list-style: none !important;
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        max-height: 50px !important;
    }

    .site-header .primary-navigation .menu-wrapper > li,
    .site-header .primary-navigation #primary-menu-list > li {
        margin: 0 !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        position: relative !important;
        max-height: 50px !important;
    }

    /* เมนูระดับแรก (Root Level Link) -> ฟอนต์ Source Serif 4 + ตัวพิมพ์ใหญ่ (Uppercase) + น้ำหนัก Normal + ลิงค์สีขาว */
    .site-header .primary-navigation .menu-wrapper > li > a,
    .site-header .primary-navigation #primary-menu-list > li > a {
        color: #FFFFFF !important; /* ลิงค์สีขาว */
        font-family: 'Source Serif 4', 'Sukhumvit Set', Georgia, serif !important; /* ฟอนต์ Source Serif 4 */
        font-size: 1.05rem !important; /* ขนาดพอดีสมดุลกับความสูง 50px */
        line-height: 1.2 !important; /* ควบคุมความสูงตัวอักษรไม่ให้ล้น */
        font-weight: normal !important; /* ขนาดน้ำหนัก Normal (400) */
        text-transform: uppercase !important; /* ตัวพิมพ์ใหญ่ Uppercase */
        text-decoration: none !important;
        padding: 4px 6px !important; /* ลด padding บนล่างให้กระชับ */
        display: inline-flex !important;
        align-items: center !important;
        gap: 4px !important;
        transition: color 0.25s ease, transform 0.25s ease !important;
    }

    .site-header .primary-navigation .menu-wrapper > li:hover > a,
    .site-header .primary-navigation .menu-wrapper > li > a:hover,
    .site-header .primary-navigation #primary-menu-list > li:hover > a,
    .site-header .primary-navigation #primary-menu-list > li > a:hover {
        color: #6A7F5B !important; /* Hover สีเขียว #6A7F5B */
        transform: translateY(-1px);
    }

    /* เมนูย่อย (Sub Menu Dropdown) -> ฟอนต์ Plus Jakarta Sans */
    .site-header .primary-navigation .sub-menu li a,
    .site-header .primary-navigation ul.sub-menu a {
        font-family: 'Plus Jakarta Sans', 'Sukhumvit Set', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
        font-weight: 500 !important;
        transition: color 0.2s ease !important;
    }

    .site-header .primary-navigation .sub-menu li:hover > a,
    .site-header .primary-navigation .sub-menu li a:hover,
    .site-header .primary-navigation ul.sub-menu a:hover {
        color: #6A7F5B !important; /* Hover สีเขียว #6A7F5B */
    }

    /* สัญลักษณ์ลูกศรลง (Chevron Down) สำหรับเมนูย่อย */
    .site-header .primary-navigation .menu-wrapper > li.menu-item-has-children > a::after,
    .site-header .primary-navigation #primary-menu-list > li.menu-item-has-children > a::after {
        content: "\F282";
        font-family: "bootstrap-icons" !important;
        font-size: 0.75rem;
        margin-left: 4px;
        transition: transform 0.2s ease;
        opacity: 0.85;
        color: inherit !important;
    }

    .site-header .primary-navigation .menu-wrapper > li.menu-item-has-children:hover > a::after,
    .site-header .primary-navigation #primary-menu-list > li.menu-item-has-children:hover > a::after {
        transform: translateY(2px);
    }

    /* ซัพพอร์ต Max Mega Menu หากเปิดใช้งาน (Root: Source Serif 4 / Sub: Plus Jakarta Sans) */
    #mega-menu-wrap-primary {
        display: flex !important;
        justify-content: center !important;
        width: 100% !important;
        max-width: 100% !important;
        background: transparent !important;
        max-height: 50px !important;
    }

    #mega-menu-wrap-primary #mega-menu-primary {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 16px !important; /* ลดระยะห่างระหว่างเมนู */
        background: transparent !important;
        margin: 0 auto !important;
        width: 100% !important;
        max-height: 50px !important;
        height: auto !important;
    }

    #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item {
        max-height: 50px !important;
        display: inline-flex !important;
        align-items: center !important;
    }

    #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link {
        color: #FFFFFF !important; /* ลิงค์สีขาว */
        font-family: 'Source Serif 4', 'Sukhumvit Set', Georgia, serif !important; /* ฟอนต์ Source Serif 4 */
        font-size: 1.05rem !important; /* ปรับขนาดฟอนต์ให้กระชับสมดุล */
        line-height: 1.2 !important; /* ควบคุมความสูงตัวอักษรไม่ให้ล้น 50px */
        height: auto !important;
        padding: 4px 6px !important; /* ลด padding บนล่างให้กระชับ */
        font-weight: normal !important; /* ขนาดน้ำหนัก Normal (400) */
        text-transform: uppercase !important; /* ตัวพิมพ์ใหญ่ Uppercase */
        background: transparent !important;
        transition: color 0.25s ease !important;
    }

    #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:hover > a.mega-menu-link,
    #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:hover,
    #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:focus,
    #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-toggle-on > a.mega-menu-link {
        color: #6A7F5B !important; /* Hover สีเขียว #6A7F5B */
        background: transparent !important;
    }

    #mega-menu-wrap-primary #mega-menu-primary ul.mega-sub-menu li a,
    #mega-menu-wrap-primary #mega-menu-primary ul.mega-sub-menu a {
        font-family: 'Plus Jakarta Sans', 'Sukhumvit Set', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
        font-weight: 500 !important;
    }

    #mega-menu-wrap-primary #mega-menu-primary ul.mega-sub-menu li:hover > a,
    #mega-menu-wrap-primary #mega-menu-primary ul.mega-sub-menu li a:hover,
    #mega-menu-wrap-primary #mega-menu-primary ul.mega-sub-menu a:hover {
        color: #6A7F5B !important; /* Hover สีเขียว #6A7F5B */
    }
}

/* ==========================================================================
   ทุก Link ใน Header ตอน Hover / Focus เป็นสี #6A7F5B
   ========================================================================== */
.site-header a:hover,
.site-header a:focus,
.site-top-header a:hover,
.site-top-header a:focus,
.site-top-header-mobile a:hover,
.site-top-header-mobile a:focus,
.primary-navigation a:hover,
.primary-navigation a:focus,
.primary-navigation li:hover > a,
.primary-navigation .menu-wrapper a:hover,
.primary-navigation .menu-wrapper li:hover > a,
.primary-navigation .menu-wrapper > li:hover > a,
.primary-navigation .menu-wrapper > li > a:hover,
.primary-navigation #primary-menu-list a:hover,
.primary-navigation #primary-menu-list li:hover > a,
.primary-navigation #primary-menu-list > li:hover > a,
.primary-navigation #primary-menu-list > li > a:hover,
.primary-navigation .sub-menu a:hover,
.primary-navigation .sub-menu li:hover > a,
.primary-navigation .sub-menu li a:hover,
#mega-menu-wrap-primary #mega-menu-primary a:hover,
#mega-menu-wrap-primary #mega-menu-primary a:focus,
#mega-menu-wrap-primary #mega-menu-primary li:hover > a,
#mega-menu-wrap-primary #mega-menu-primary li a:hover,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:hover > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:hover,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-toggle-on > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary ul.mega-sub-menu li:hover > a,
#mega-menu-wrap-primary #mega-menu-primary ul.mega-sub-menu a:hover {
    color: #6A7F5B !important;
}

.site-header a:hover i,
.site-header a:hover span,
.site-top-header a:hover i,
.site-top-header a:hover span,
.site-top-header-mobile a:hover i,
.site-top-header-mobile a:hover span,
.primary-navigation a:hover i,
.primary-navigation a:hover span,
#mega-menu-wrap-primary #mega-menu-primary a:hover i,
#mega-menu-wrap-primary #mega-menu-primary a:hover span {
    color: #6A7F5B !important;
}

.site-top-header-mobile .site-social a:hover i,
.site-top-header-mobile .site-social a:hover span {
    color: #FFFFFF !important;
}

/* ==========================================================================
   Footer Copyright Styling
   ปรับขนาดฟอนต์ copyright ให้เท่ากับ ขนาดฟอนต์ site-top-header (0.8rem)
   ========================================================================== */
.site-footer .site-info,
.site-footer .site-info .powered-by,
.site-footer .site-info .copyright,
.site-footer .powered-by,
.site-footer .copyright,
.site-footer .site-info a {
    font-size: 0.8rem !important;
    line-height: 1.2 !important;
}

/* ==========================================================================
   DESKTOP STICKY HEADER (เมื่อ SCROLL บนหน้าจอ >= 1080px)
   ========================================================================== */
@media screen and (min-width: 1081px) {
    /* 1. ซ่อนแถบข้อมูลติดต่อ, เบอร์โทร, social, ภาษา เมื่อ Scroll */
    .site-header.is-scrolled .site-top-header,
    body.header-is-scrolled .site-header .site-top-header {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* 2. เปลี่ยนแถบ Navbar เป็นแนวนอนแถวเดียว (Logo ซ้าย, Menu ขวา) - ระยะขอบบนและล่างห่างจาก Logo 8px */
    .site-header.is-scrolled,
    body.header-is-scrolled .site-header,
    body.header-is-scrolled.tw-header-sticky .site-header,
    body.tw-header-sticky.header-is-scrolled .site-header,
    body.tw-header-sticky .site-header.is-scrolled,
    body.header-is-scrolled .site-header.is-scrolled,
    .tw-header-sticky .site-header.is-scrolled,
    .tw-header-opaque .site-header.is-scrolled {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        padding: 5px 48px !important;
        padding-top: 5px !important;
        padding-bottom: 5px !important;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
        background-color: #1a2e51 !important;
    }

    /* 3. จัดโลโก้ชิดซ้ายเด่นชัด ไม่ทับกับเมนู */
    .site-header.is-scrolled .site-branding,
    body.header-is-scrolled .site-header .site-branding {
        margin: 0 !important;
        padding: 0 !important;
        width: auto !important;
        max-width: none !important;
        position: static !important;
        justify-content: flex-start !important;
        align-items: center !important;
        pointer-events: auto !important;
        flex: 0 0 auto !important;
    }

    .site-header.is-scrolled .site-branding .site-logo,
    body.header-is-scrolled .site-header .site-branding .site-logo {
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
    }

    .site-header.is-scrolled .site-branding .site-logo img,
    .site-header.is-scrolled .site-branding .custom-logo,
    body.header-is-scrolled .site-header .site-branding .site-logo img,
    body.header-is-scrolled .site-header .site-branding .custom-logo {
        height: 48px !important;
        max-height: 52px !important;
        width: auto !important;
        margin: 0 !important;
    }

    /* 4. จัดชุดเมนูให้อยู่ในแถวทางขวา ไม่ลอยทับโลโก้ */
    .site-header.is-scrolled .primary-navigation,
    body.header-is-scrolled .site-header .primary-navigation {
        position: static !important;
        top: auto !important;
        right: auto !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        justify-content: flex-end !important;
        align-items: center !important;
        flex: 1 1 auto !important;
    }

    .site-header.is-scrolled #mega-menu-wrap-primary,
    body.header-is-scrolled .site-header #mega-menu-wrap-primary {
        justify-content: flex-end !important;
        width: auto !important;
        max-width: 100% !important;
        margin: 0 !important;
    }

    .site-header.is-scrolled #mega-menu-wrap-primary #mega-menu-primary,
    body.header-is-scrolled .site-header #mega-menu-wrap-primary #mega-menu-primary {
        justify-content: flex-end !important;
        gap: 18px !important;
        width: auto !important;
        margin: 0 !important;
    }

    .site-header.is-scrolled #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link,
    body.header-is-scrolled .site-header #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link {
        font-size: 0.95rem !important;
        padding: 6px 8px !important;
    }
}