/*
Theme Name: GoGlobal Theme
Theme URI: https://example.com/goglobal-theme
Author: GoGlobal Team
Author URI: https://example.com
Description: Custom theme for GoGlobal, converted from static HTML.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: goglobal-theme
*/

/* =========================================
   BASE STYLES
   ========================================= */
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'Segoe UI','Noto Sans SC',system-ui,sans-serif; color:#1a1a2e; background:#fff; }
:root { --blue:#0d2b55; --accent:#f0a500; --light:#f5f7fa; --dark:#0a1e3d; --text:#333; --muted:#666; --green:#16a34a; }
a { text-decoration:none; color:inherit; }

/* =========================================
   TOP BAR
   ========================================= */
.top-bar { background:var(--dark); color:rgba(255,255,255,.8); font-size:.78rem; padding:5px 5%; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.top-bar-left { flex-shrink:0; opacity:.7; font-size:.73rem; }
.top-bar-center { flex:1; text-align:center; color:var(--accent); font-weight:600; font-size:.8rem; }
.top-bar-right { display:flex; align-items:center; gap:10px; flex-shrink:0; }

/* Custom top bar dropdowns */
.tb-dropdown { position:relative; display:inline-block; }
.tb-dropdown-btn { background:transparent; color:rgba(255,255,255,.75); border:none; font-size:.75rem; cursor:pointer; outline:none; padding:4px 8px; display:flex; align-items:center; gap:5px; border-radius:4px; transition:.15s; }
.tb-dropdown-btn:hover { background:rgba(255,255,255,.08); color:#fff; }
.tb-dropdown-btn .tb-arrow { display:inline-block; width:8px; height:8px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 10 10'%3E%3Cpath d='M2 3.5l3 3 3-3' stroke='rgba(255,255,255,0.6)' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center; transition:transform .2s; vertical-align:middle; font-size:0; }
.tb-dropdown.open .tb-arrow { transform:rotate(180deg); }
.tb-dropdown-menu { display:none; position:absolute; top:calc(100% + 6px); right:0; background:#1a2d4a; border:1px solid rgba(255,255,255,.1); border-radius:8px; min-width:140px; z-index:300; padding:4px 0; box-shadow:0 8px 24px rgba(0,0,0,.3); }
.tb-dropdown-menu::before { content:''; position:absolute; top:-6px; left:0; right:0; height:6px; background:transparent; }
.tb-dropdown.open .tb-dropdown-menu { display:block; animation:megaIn .2s ease forwards; }
.tb-dropdown-menu a { display:flex; align-items:center; gap:8px; padding:8px 14px; color:rgba(255,255,255,.7); font-size:.78rem; transition:.15s; white-space:nowrap; }
.tb-dropdown-menu a:hover { background:rgba(255,255,255,.08); color:#fff; }
.tb-dropdown-menu a.active { color:var(--accent); font-weight:600; }
.tb-divider { width:1px; height:12px; background:rgba(255,255,255,.2); }

/* =========================================
   MAIN NAV
   ========================================= */
.main-nav { background:#fff; padding:0; display:flex; align-items:center; justify-content:center; height:72px; position:sticky; top:0; z-index:100; box-shadow:0 1px 8px rgba(0,0,0,.06); }
/* Fix for logged-in admin bar pushing content down */
.admin-bar .main-nav { top: 32px; }
@media screen and (max-width: 782px) {
    .admin-bar .main-nav { top: 46px; }
}
.nav-inner { width:100%; max-width:1200px; display:flex; align-items:center; justify-content:space-between; padding:0 24px; height:100%; position:relative; }
.logo { font-weight:700; line-height:1.15; cursor:pointer; white-space:nowrap; flex-shrink:0; }
.logo-en { font-size:1.55rem; color:var(--blue); } .logo-en span { color:var(--accent); }
.logo-cn { font-size:.68rem; color:var(--muted); letter-spacing:2px; font-weight:400; text-align:center; }

/* Nav links */
.nav-links { display:flex; align-items:center; height:100%; gap:0; margin: 0; list-style: none; overflow: visible !important; } 
.nav-links .menu-item { position:relative; height:100%; display:flex; align-items:center; flex-shrink: 0; flex-grow: 0; width: auto; max-width: none; } /* Added max-width:none */
.nav-links .menu-item > a { color:var(--text); padding:0 14px; font-size:.88rem; font-weight:600; transition:color .2s; white-space:nowrap; height:100%; display:flex; align-items:center; gap:5px; position:relative; width: auto; } /* Added width:auto */
.nav-links .menu-item > a::after { content:''; position:absolute; bottom:0; left:18px; right:18px; height:2px; background:var(--blue); transform:scaleX(0); transition:transform .2s; }
.nav-links .menu-item:hover > a { color:var(--blue); }
.nav-links .menu-item:hover > a::after { transform:scaleX(1); }
.nav-links .menu-item > a .arrow { display:inline-block; width:10px; height:10px; margin-left:3px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath d='M2 3.5l3 3 3-3' stroke='%23555' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center; transition:transform .2s; vertical-align:middle; font-size:0; }
.nav-links .menu-item:hover > a .arrow { transform:rotate(180deg); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath d='M2 3.5l3 3 3-3' stroke='%230d2b55' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
/* Hide default WP submenus to avoid conflict with mega menus */
.nav-links .sub-menu { display: none; }

/* Mega dropdown base */
.mega-dropdown { display:none; position:absolute; left:0; top:100%; background:#ffffff; border-radius:12px; box-shadow:0 12px 48px rgba(0,0,0,.15); z-index:9999 !important; padding:24px; pointer-events:none; margin-top:0; width: 780px; max-width: 90vw; opacity: 0; transition: opacity 0.2s, transform 0.2s; visibility: hidden; }

@media (min-width: 993px) {
  .nav-links .menu-item:hover .mega-dropdown { display:block !important; pointer-events:auto; opacity: 1; visibility: visible; animation:megaIn .25s ease forwards; }
  .nav-links .menu-item:hover { z-index: 9999 !important; }
}

@keyframes megaIn { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } }

/* Fix width for specific megas - scoped to .mega-dropdown to avoid affecting LI items */
.mega-dropdown.mega-services, .mega-dropdown.mega-regions, .mega-dropdown.mega-resources, .mega-dropdown.mega-partners { width: 780px; }
.mega-dropdown.mega-about { width: 480px; }

/* Ensure LI items don't get messed up if they accidentally have these classes */
.nav-links .menu-item.mega-services,
.nav-links .menu-item.mega-regions,
.nav-links .menu-item.mega-resources,
.nav-links .menu-item.mega-partners,
.nav-links .menu-item.mega-about {
    width: auto !important;
    overflow: visible !important;
}

/* Custom Logo Style */
.custom-logo {
    max-height: 32px; /* Reduced from 48px to match original text logo height approximately */
    width: auto;
    height: auto;
    display: block;
}

/* Invisible bridge to prevent hover gap */
.mega-dropdown::before { content:''; position:absolute; top:-12px; left:0; right:0; height:12px; background:transparent; }

/* Mega card items */
.mega-card { display:flex; gap:14px; padding:14px 16px; border-radius:8px; transition:background .15s; cursor:pointer; align-items:flex-start; }
.mega-card:hover { background:var(--light); }
.mega-card:hover .mc-title { color:var(--blue); }
.mega-card .mc-icon { width:40px; height:40px; border-radius:10px; background:var(--light); display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:1rem; color:var(--blue); transition:background .15s; }
.mega-card:hover .mc-icon { background:rgba(13,43,85,.08); }
.mc-title { font-size:.92rem; font-weight:700; color:var(--text); margin-bottom:3px; }
.mc-desc { font-size:.78rem; color:var(--muted); line-height:1.5; }
.mega-divider { height:1px; background:#f2f3f5; margin:4px 0; }
.mega-footer { text-align:right; padding-top:12px; border-top:1px solid #f2f3f5; margin-top:8px; }
.mega-footer a { font-size:.85rem; font-weight:700; color:var(--blue); transition:.2s; }
.mega-footer a:hover { text-decoration:underline; color:var(--accent); }

/* Mega: services - split layout like resources */
.mega-dropdown.mega-services { width:780px; overflow:hidden; }
.mega-services-inner { display:table; width:100%; table-layout:fixed; }
.mega-services .svc-left { display:table-cell; width:240px; padding-right:24px; border-right:1px solid #f2f3f5; vertical-align:middle; }
.mega-services .svc-left .svc-headline { font-size:1.5rem; font-weight:700; color:var(--blue); margin-bottom:12px; line-height:1.3; }
.mega-services .svc-left .svc-body { font-size:.85rem; color:var(--muted); line-height:1.8; margin-bottom:8px; }
.mega-services .svc-left .svc-bold { font-size:.85rem; color:var(--blue); font-weight:700; margin-bottom:0; }
.mega-services .svc-left .svc-link { display:block; margin-top:20px; font-size:.85rem; font-weight:700; color:var(--accent); }
.mega-services .svc-left .svc-link:hover { text-decoration:underline; }
.mega-services .svc-right { display:table-cell; padding-left:24px; vertical-align:top; }

/* Mega: split layout (resources, partners) */
.mega-dropdown.mega-split { width:780px; overflow:hidden; }
.mega-split-inner { display:table; width:100%; table-layout:fixed; }
.mega-split-left { display:table-cell; width:240px; padding-right:24px; border-right:1px solid #f2f3f5; vertical-align:middle; }
.mega-split-left h3 { font-size:1.15rem; font-weight:700; color:var(--text); margin-bottom:10px; }
.mega-split-left p { font-size:.8rem; color:var(--muted); line-height:1.7; margin-bottom:16px; }
.mega-split-left a { font-size:.85rem; font-weight:700; color:var(--blue); }
.mega-split-left a:hover { text-decoration:underline; color:var(--accent); }
.mega-split-right { display:table-cell; padding-left:24px; vertical-align:top; }
.mega-split-grid { display:grid; grid-template-columns:1fr 1fr; gap:4px; }

/* Mega: regions - tab layout */
.mega-dropdown.mega-regions { width:780px; max-height:none; overflow:visible; scrollbar-width:unset; }
.mega-regions-inner { display:flex; gap:0; min-height:360px; }
.mega-regions-left { width:200px; border-right:1px solid #f2f3f5; padding-right:0; flex-shrink:0; display:flex; flex-direction:column; gap:2px; }
.mega-regions-left .region-tab { display:flex; align-items:center; gap:10px; padding:12px 16px; border-radius:8px 0 0 8px; font-size:.88rem; font-weight:600; color:var(--text); cursor:pointer; transition:all .15s; border:none; background:none; text-align:left; width:100%; white-space:nowrap; }
.mega-regions-left .region-tab:hover { background:#f8f9fb; color:var(--blue); }
.mega-regions-left .region-tab.active { background:var(--light); color:var(--blue); border-right:3px solid var(--blue); }
.mega-regions-left .region-tab .tab-icon { font-size:1.1rem; flex-shrink:0; }
.mega-regions-right { flex:1; padding-left:20px; overflow-y:auto; max-height:400px; }
.mega-regions-right .region-panel { display:none; }
.mega-regions-right .region-panel.active { display:block; }
.mega-regions-right .region-panel-title { font-size:.75rem; font-weight:700; color:var(--blue); text-transform:uppercase; letter-spacing:1px; padding:4px 0 12px; opacity:.6; }
.mega-regions-right .region-panel-grid { display:grid; grid-template-columns:1fr 1fr; gap:4px; }

/* Fix Apple Emoji Image Sizes */
.mc-icon img { width: 1.2em; height: 1.2em; vertical-align: middle; }
.tab-icon img { width: 1.2em; height: 1.2em; vertical-align: middle; }


/* Mega: about */
.mega-dropdown.mega-about { width:480px; }

/* Position adjustments for menus — use named classes instead of nth-child for reliability */
/* In WP, we will assign classes like 'pos-left', 'pos-center', 'pos-right' to menu items */
.nav-links .menu-item.pos-left .mega-dropdown { left:0 !important; right:auto !important; }
.nav-links .menu-item.pos-center .mega-dropdown { left:50% !important; transform:translateX(-50%) !important; }
.nav-links .menu-item.pos-center:hover .mega-dropdown { animation:megaInCenter .25s ease forwards !important; }
@keyframes megaInCenter { from { opacity:0; transform:translateX(-50%) translateY(6px); } to { opacity:1; transform:translateX(-50%) translateY(0); } }
.nav-links .menu-item.pos-right .mega-dropdown { left:auto !important; right:0 !important; }
.nav-links .menu-item.pos-left-offset .mega-dropdown { left:0 !important; right:auto !important; } /* Reset from -120px to 0 to fix "too big offset" issue */

/* Default mega menu positioning if no class is provided */
.nav-links .menu-item .mega-dropdown { left: 0; }
.nav-links .menu-item:last-child .mega-dropdown { right: 0; left: auto; }

/* Nav right buttons */
.nav-right { display:flex; align-items:center; gap:10px; flex-shrink:0; position:relative; z-index:210; }
.btn-shop-nav { background:transparent; color:var(--accent); padding:10px 20px; border-radius:8px; font-size:1rem; font-weight:700; transition:.2s; border:2px solid var(--accent); white-space:nowrap; }
.btn-shop-nav:hover { background:var(--accent); color:#fff; }
.btn-login-nav { background:var(--accent); color:#fff; padding:12px 28px; border-radius:8px; font-size:1rem; cursor:pointer; border:none; font-weight:700; transition:.2s; box-shadow:0 2px 8px rgba(240,165,0,.3); }
.btn-login-nav:hover { background:#d4920a; }
.login-arrow { display:inline-block; width:10px; height:10px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath d='M2 3.5l3 3 3-3' stroke='%23fff' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center; transition:transform .2s; vertical-align:middle; margin-left:2px; }
.login-dropdown:hover .login-arrow { transform:rotate(180deg); }
.login-dropdown { position:relative; display:inline-block; }
.login-dropdown:hover .login-dd-menu { display:block; opacity:1; pointer-events:auto; }
.login-dd-menu { display:none; position:absolute; right:0; top:100%; background:#fff; border-radius:10px; box-shadow:0 8px 30px rgba(0,0,0,.12); min-width:180px; z-index:200; padding:6px 0; padding-top:12px; opacity:0; transition:opacity .2s; }
.login-dd-menu::before { content:''; position:absolute; top:-8px; left:0; right:0; height:8px; background:transparent; }
.login-dd-menu a { display:block; padding:12px 20px; color:#333; font-size:.85rem; transition:.15s; }
.login-dd-menu a:hover { background:var(--light); color:var(--blue); }

.hamburger { display:none; background:none; border:none; color:var(--blue); font-size:1.5rem; cursor:pointer; padding:4px 8px; }

/* =========================================
   HERO
   ========================================= */
.hero { background:linear-gradient(135deg,#0d2b55 0%,#1a4a8a 50%,#0d2b55 100%); color:#fff; padding:72px 5% 64px; text-align:center; }
.hero-eyebrow { display:inline-block; background:rgba(22,163,74,.15); color:var(--green); padding:5px 18px; border-radius:16px; font-size:.72rem; font-weight:600; margin-bottom:28px; letter-spacing:.5px; border:1px solid rgba(22,163,74,.25); }
.hero h1 { font-size:2.8rem; font-weight:700; line-height:1.4; margin-bottom:24px; }
.hero h1 em { font-style:normal; color:var(--accent); display:block; }
.hero-tags { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-bottom:36px; }
.hero-tag { background:rgba(255,255,255,.1); color:#fff; padding:7px 16px; border-radius:20px; font-size:.83rem; border:1px solid rgba(255,255,255,.2); }
.hero-ctas { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.btn { display:inline-block; padding:14px 32px; border-radius:8px; font-size:1rem; font-weight:600; cursor:pointer; border:none; text-align:center; transition:.2s; }
.btn-accent { background:var(--accent); color:#fff; } .btn-accent:hover { background:#d4920a; }
.btn-outline-white { background:transparent; color:#fff; border:2px solid rgba(255,255,255,.5); } .btn-outline-white:hover { border-color:#fff; background:rgba(255,255,255,.1); }
.btn-primary { background:var(--blue); color:#fff; } .btn-primary:hover { background:#1a4a8a; }

/* =========================================
   PARTNER BAR
   ========================================= */
.partners-bar { background:#fdf6e3; border-bottom:none; padding:8px 7%; display:flex; align-items:center; gap:20px; overflow:hidden; }
.partners-label { flex-shrink:0; font-size:.7rem; color:var(--muted); text-transform:uppercase; letter-spacing:.5px; line-height:1.4; width:190px; font-weight:700; text-align:left; display:flex; align-items:center; gap:8px; }
.partners-label .p-icon { font-size:1.4rem; flex-shrink:0; }
.partners-scroll { flex:1; overflow:hidden; }
.partners-track { display:flex; gap:40px; align-items:center; animation:scrollP 25s linear infinite; width:max-content; }
.partners-track:hover { animation-play-state:paused; }
.partners-track img { height:22px; width:auto; opacity:.5; filter:grayscale(100%); transition:all .3s; cursor:pointer; }
.partners-track img:hover { opacity:1; filter:grayscale(0%); }
@keyframes scrollP { 0% { transform:translateX(0); } 100% { transform:translateX(-50%); } }

/* =========================================
   SEARCH
   ========================================= */
.search-section { background:var(--light); padding:64px 5%; text-align:center; border-bottom:1px solid #e0e0e0; }
.search-eyebrow { font-size:2.2rem; font-weight:700; color:var(--blue); margin-bottom:10px; }
.search-sub { font-size:1.05rem; color:var(--muted); margin-bottom:36px; }
.search-box { display:flex; max-width:640px; margin:0 auto; background:#fff; border-radius:12px; overflow:hidden; box-shadow:0 4px 24px rgba(0,0,0,.08); border:2px solid #e0e0e0; transition:.2s; }
.search-box:focus-within { border-color:var(--accent); box-shadow:0 6px 32px rgba(240,165,0,.12); }
.search-box input { flex:1; padding:18px 22px; border:none; outline:none; font-size:1.05rem; color:#333; background:transparent; }
.search-box button { background:var(--accent); color:#fff; border:none; padding:0 32px; font-size:1rem; cursor:pointer; font-weight:600; }
.hot-tags { margin-top:22px; display:flex; gap:8px; justify-content:center; flex-wrap:wrap; }
.hot-tag { background:#fff; color:var(--blue); padding:8px 18px; border-radius:20px; font-size:.85rem; cursor:pointer; border:1px solid #ddd; transition:.2s; font-weight:500; }
.hot-tag:hover { background:var(--accent); color:#fff; border-color:var(--accent); }

/* =========================================
   SERVICES
   ========================================= */
.services-section { padding:72px 5%; background:#fff; }
.section-title { text-align:center; margin-bottom:48px; }
.section-title h2 { font-size:2.2rem; color:var(--blue); margin-bottom:10px; }
.section-title p { color:var(--muted); font-size:1.05rem; }
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; max-width:1100px; margin:0 auto; }
.service-card { background:#fff; border-radius:12px; padding:22px 20px; box-shadow:0 2px 12px rgba(0,0,0,.05); transition:all .3s ease; cursor:pointer; border:2px solid transparent; display:flex; align-items:flex-start; gap:14px; position:relative; border-left:3px solid transparent; }
.service-card:hover { border-color:var(--accent); border-left-color:var(--accent); transform:translateY(-4px); box-shadow:0 12px 32px rgba(240,165,0,.12); }
.service-card:hover .s-icon { background:var(--accent); color:#fff; transform:scale(1.1); }
.s-icon { font-size:1.4rem; flex-shrink:0; width:38px; height:38px; display:flex; align-items:center; justify-content:center; background:var(--light); border-radius:10px; transition:all .3s ease; }
.s-body h3 { font-size:1.1rem; color:var(--blue); margin-bottom:4px; font-weight:700; }
.s-body p { font-size:.8rem; color:#888; line-height:1.5; }
.card-arrow { position:absolute; top:14px; right:14px; color:#ccc; font-size:.85rem; transition:.2s; }
.service-card:hover .card-arrow { color:var(--accent); }
.hidden-card { display:none; }
.show-more-wrap { text-align:center; margin-top:24px; }
.show-more-btn { background:none; border:2px solid var(--blue); color:var(--blue); padding:10px 28px; border-radius:8px; font-size:.9rem; font-weight:600; cursor:pointer; transition:.2s; }
.show-more-btn:hover { background:var(--blue); color:#fff; }

/* =========================================
   REGIONS
   ========================================= */
.regions-section { padding:72px 5%; background:var(--light); }
.regions-header { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:32px; flex-wrap:wrap; gap:12px; max-width:1100px; margin-left:auto; margin-right:auto; }
.regions-header h2 { font-size:2.2rem; font-weight:700; color:var(--blue); }
.rh-sub { color:var(--muted); font-size:1.05rem; margin-top:6px; }
.view-all { color:var(--accent); font-weight:600; font-size:.88rem; white-space:nowrap; } .view-all:hover { text-decoration:underline; }
.regions-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; max-width:1100px; margin:0 auto; }
.region-card { background:#fff; padding:24px 22px; border-radius:16px; border:1px solid #e8e8e8; cursor:pointer; transition:all .35s ease; border-bottom:4px solid var(--blue); position:relative; overflow:hidden; }
.region-card::after { content:''; position:absolute; top:0; left:0; right:0; bottom:0; background:linear-gradient(135deg,rgba(240,165,0,.06),transparent); opacity:0; transition:opacity .35s ease; pointer-events:none; border-radius:16px; }
.region-card:hover { transform:translateY(-6px) scale(1.02); box-shadow:0 12px 36px rgba(0,0,0,.12); border-bottom-width:5px; }
.region-card:hover::after { opacity:1; }
.region-card:hover h3 { color:var(--accent); }
.region-card.accent-border { border-bottom-color:var(--accent); }
.region-card.dark-card { background:var(--dark); color:#fff; border-bottom-color:#4a90d9; }
.r-flags { display:flex; gap:6px; margin-bottom:12px; }
.r-flags img { width:32px; height:auto; border-radius:3px; box-shadow:0 1px 4px rgba(0,0,0,.15); }
.region-card h3 { font-size:1rem; font-weight:700; margin-bottom:4px; transition:color .3s ease; }
.region-card p { font-size:.78rem; color:#999; line-height:1.5; }
.region-card.dark-card p { color:rgba(255,255,255,.5); }
.region-card.wide { grid-column:span 2; }
.region-card.hidden-region { display:none; }

/* =========================================
   REGISTER
   ========================================= */
.register-section { padding:72px 5%; background:#fff; }
.register-inner { display:flex; gap:0; max-width:1000px; margin:0 auto; border-radius:20px; overflow:hidden; box-shadow:0 8px 40px rgba(0,0,0,.1); }
.register-left { background:var(--dark); color:#fff; padding:48px 40px; width:38%; display:flex; flex-direction:column; justify-content:space-between; }
.register-left h2 { font-size:1.6rem; font-weight:700; margin-bottom:32px; }
.reg-steps { display:flex; flex-direction:column; gap:24px; }
.reg-step { display:flex; align-items:center; gap:14px; }
.reg-step .step-num { width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.9rem; flex-shrink:0; }
.reg-step .step-num.active { background:var(--accent); color:#fff; }
.reg-step .step-num.inactive { border:2px solid rgba(255,255,255,.3); color:rgba(255,255,255,.4); }
.reg-step span { font-weight:600; font-size:.92rem; }
.reg-step.dim { opacity:.4; }
.reg-encrypt { margin-top:auto; padding-top:32px; border-top:1px solid rgba(255,255,255,.1); font-size:.78rem; color:rgba(255,255,255,.4); }
.register-right { background:#fff; padding:48px 40px; width:62%; }
.register-right .form-group { margin-bottom:18px; }
.register-right label { display:block; font-size:.78rem; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.5px; margin-bottom:6px; }
.register-right select, .register-right input { width:100%; padding:16px 18px; border:2px solid #e8e8e8; border-radius:10px; font-size:1rem; outline:none; transition:.2s; background:var(--light); height:54px; appearance:none; -webkit-appearance:none; -moz-appearance:none; }
.register-right select { background:var(--light) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23999' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 16px center; padding-right:42px; cursor:pointer; }
.register-right select:focus, .register-right input:focus { border-color:var(--accent); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-hint { font-size:.7rem; color:#aaa; margin-top:4px; }

/* =========================================
   TRUST
   ========================================= */
.trust-section { padding:40px 5%; background:var(--light); }
.trust-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; text-align:center; max-width:1100px; margin:0 auto; }
.trust-item .num { font-size:3.2rem; font-weight:700; color:var(--accent); }
.trust-item p { color:var(--muted); font-size:.95rem; margin-top:6px; font-weight:500; }

/* =========================================
   WHY US
   ========================================= */
.why-section { padding:72px 5%; background:var(--dark); color:#fff; }
.why-inner { display:flex; gap:48px; max-width:1100px; margin:0 auto; align-items:stretch; }
.why-left { flex:1; }
.why-left h2 { font-size:2rem; font-weight:700; margin-bottom:28px; }
.why-item { display:flex; gap:14px; margin-bottom:24px; }
.why-icon { width:44px; height:44px; background:rgba(255,255,255,.08); border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:1.1rem; flex-shrink:0; }
.why-item h4 { font-size:1rem; font-weight:700; margin-bottom:4px; }
.why-item p { font-size:.82rem; color:rgba(255,255,255,.5); line-height:1.5; }
.why-right { flex:1; display:flex; flex-direction:column; }
.why-right-title { font-size:1.4rem; font-weight:700; color:#fff; margin-bottom:0; display:inline; }
.why-right-sub { font-size:.85rem; color:rgba(255,255,255,.4); margin-bottom:18px; display:inline; margin-left:10px; }
.why-carousel { flex:1; position:relative; overflow:hidden; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); border-radius:20px; padding:36px 32px; }
.why-t-card { display:none; animation:fadeInT .5s ease; }
.why-t-card.active { display:block; }
@keyframes fadeInT { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
.why-t-avatar { display:flex; align-items:center; gap:14px; margin-bottom:20px; }
.why-t-avatar .avatar-circle { width:48px; height:48px; border-radius:50%; background:var(--accent); display:flex; align-items:center; justify-content:center; font-size:1.2rem; flex-shrink:0; }
.why-t-avatar .avatar-info p { font-weight:700; font-size:.95rem; }
.why-t-avatar .avatar-info span { font-size:.78rem; color:rgba(255,255,255,.4); }
.why-t-stars { color:var(--accent); font-size:.9rem; margin-bottom:14px; letter-spacing:2px; }
.why-t-quote { color:rgba(255,255,255,.6); font-style:italic; line-height:1.8; font-size:.92rem; }
.why-t-dots { display:flex; gap:8px; justify-content:center; margin-top:20px; }
.why-t-dots span { width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.2); cursor:pointer; transition:.2s; }
.why-t-dots span.active { background:var(--accent); width:24px; border-radius:4px; }

/* =========================================
   CTA SUBSCRIBE
   ========================================= */
.cta-subscribe { padding:40px 5%; background:var(--light); text-align:center; }
.cta-inner { max-width:800px; margin:0 auto; background:linear-gradient(135deg,#0d2b55,#1a4a8a); border-radius:20px; padding:56px 48px; box-shadow:0 8px 40px rgba(13,43,85,.2); }
.cta-inner h3 { color:#fff; font-size:1.7rem; font-weight:700; margin-bottom:10px; }
.cta-inner p { color:rgba(255,255,255,.6); font-size:1rem; margin-bottom:28px; }
.cta-form { display:flex; gap:0; max-width:460px; margin:0 auto; border-radius:10px; overflow:hidden; box-shadow:0 4px 16px rgba(0,0,0,.15); }
.cta-form input { flex:1; padding:16px 20px; border:none; outline:none; font-size:.95rem; background:#fff; color:#333; }
.cta-form button { background:var(--accent); color:#fff; border:none; padding:0 28px; font-size:.95rem; font-weight:700; cursor:pointer; transition:.2s; white-space:nowrap; }
.cta-form button:hover { background:#d4920a; }

/* =========================================
   FOOTER
   ========================================= */
footer { background:#112d4e; color:rgba(255,255,255,.7); padding:56px 7% 16px; }
.footer-grid { display:grid; grid-template-columns:2.2fr 1fr 1fr 1fr 1fr; gap:36px; max-width:1100px; margin:0 auto; }
footer h4 { color:#fff; margin-bottom:16px; font-size:.92rem; text-transform:uppercase; letter-spacing:1px; position:relative; padding-bottom:10px; }
footer h4::after { content:''; position:absolute; bottom:0; left:0; width:24px; height:2px; background:var(--accent); }
.footer-desc { font-size:.82rem; line-height:1.8; margin-bottom:18px; }
.footer-contact { font-size:.82rem; margin-bottom:8px; display:flex; align-items:center; gap:8px; }
.footer-socials { display:flex; gap:10px; margin-top:18px; }
.footer-socials a { display:flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:8px; color:#fff; font-size:1.1rem; transition:.2s; }
.footer-socials a:hover { transform:translateY(-2px); filter:brightness(1.1); }
.footer-socials a.social-wechat { background:#07c160; }
.footer-socials a.social-whatsapp { background:#25d366; }
.footer-socials a.social-linkedin { background:#0a66c2; }
.footer-socials a.social-xiaohongshu { background:#ff2442; }
.footer-socials a.social-x { background:#000000; }
.footer-socials a.social-telegram { background:#0088cc; }
footer a { display:block; color:rgba(255,255,255,.55); font-size:.82rem; margin-bottom:9px; transition:.2s; }
footer a:hover { color:var(--accent); }
.footer-divider { border:none; border-top:1px solid rgba(255,255,255,.04); margin:0 auto; max-width:900px; }
.footer-bottom { background:#112d4e; text-align:center; padding:12px 5% 16px; font-size:.75rem; color:rgba(255,255,255,.3); }
.footer-bottom-inner { max-width:1100px; margin:0 auto; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px; }
.footer-bottom a { display:inline; margin:0 8px; color:rgba(255,255,255,.35); font-size:.72rem; }
.footer-bottom a:hover { color:var(--accent); }

/* =========================================
   RESPONSIVE
   ========================================= */
@media(max-width:1024px){
  .regions-grid{grid-template-columns:repeat(2,1fr)}
  .region-card.wide{grid-column:span 2}
  .why-inner{flex-direction:column}
  .footer-grid{grid-template-columns:1fr 1fr 1fr}
  .nav-links > li > a {padding:0 12px;font-size:.84rem}
}
/* Mobile Actions (Buttons) */
.mobile-actions { display: none; }
.mobile-menu-header { display: none; }

/* Nav Overlay */
  .nav-overlay { display: none !important; }

@media(max-width:992px){
  .main-nav { position: -webkit-sticky; position: sticky; top: 0; z-index: 1001; }
  .nav-right { display: none; } /* Hide desktop buttons */
  
  .custom-logo { max-height: 28px; } /* Slightly smaller for mobile header */
  
  .mobile-actions { display: block; margin-top: auto; padding: 20px; background: #fff; border-top: 1px solid #f0f0f0; }
  .mobile-actions-inner { display: flex; flex-direction: column; gap: 12px; }
  
  /* Mobile Bottom Bar (Language & Currency) */
  .mobile-bottom-bar { display: block; background: #0a1e3d; padding: 12px 0; margin-top: auto; width: 100%; position: absolute; bottom: 0; left: 0; right: 0; }
  /* .nav-links { padding-bottom: 60px; } Removed duplicate rule */
  

  .m-bottom-inner { display: flex; align-items: center; justify-content: center; gap: 0; width: 100%; }
  .m-bottom-inner .tb-dropdown { flex: 1; text-align: center; display: flex; justify-content: center; }
  .m-bottom-inner .tb-divider { width: 1px; height: 20px; background: rgba(255,255,255,0.2); flex-shrink: 0; }
  .m-bottom-inner .tb-dropdown-btn { color: rgba(255,255,255,0.8); font-size: 0.85rem; }
  .m-bottom-inner .tb-dropdown-menu { bottom: 100%; top: auto; margin-bottom: 8px; }

  /* Mobile Actions Adjustments */
  .mobile-actions { display: block; margin-top: auto; padding: 20px 20px 70px; background: #fff; border-top: 1px solid #f0f0f0; }
  .mobile-actions-inner { display: flex; flex-direction: column; gap: 12px; align-items: center; }
  .mobile-actions .btn-shop-nav { display: block; text-align: center; width: 100%; padding: 12px; font-size: 0.95rem; max-width: 200px; border: 2px solid var(--accent); color: var(--accent); border-radius: 8px; font-weight: 700; background: transparent; }
  .mobile-actions .btn-shop-nav:hover { background: var(--accent); color: #fff; }
  .mobile-actions .mobile-login-row { display: flex; justify-content: center; width: 100%; }
  .mobile-login-dropdown { width: 100%; max-width: 200px; text-align: center; position: relative; }
  .mobile-actions .btn-login-nav { display: block; text-align: center; padding: 12px; font-size: 0.95rem; width: 100%; background: var(--accent); color: #fff; border-radius: 8px; font-weight: 700; border:none; cursor:pointer;}
  .mobile-login-dropdown .login-dd-menu { bottom: 100%; top: auto; left: 0; right: 0; width: 100%; margin-bottom: 8px; text-align: left; position: absolute; display: none; opacity: 0; transition: opacity 0.2s; background: #fff; border-radius: 8px; box-shadow: 0 -4px 12px rgba(0,0,0,0.1); border: 1px solid #f0f0f0; padding: 6px 0; z-index: 1000; }
  .mobile-login-dropdown .login-dd-menu a { display: block; padding: 10px 16px; color: #333; font-size: 0.9rem; font-weight: 500; border-bottom: 1px solid #f9f9f9; }
  .mobile-login-dropdown .login-dd-menu a:last-child { border-bottom: none; }
  .mobile-login-dropdown.open .login-dd-menu { display: block; opacity: 1; pointer-events: auto; }
  .mobile-login-dropdown.open .login-arrow { transform: rotate(180deg); display: inline-block; }

  .hamburger{display:block;margin-left:auto}
  .logo{position:absolute;left:50%;transform:translateX(-50%)}
  /* Updated Side Drawer Style - Full Width from Top */
  .nav-links {
      display: none;
      position: absolute;
      top: 100%; /* Position right below the header */
      left: 0;
      right: 0;
      width: 100%;
      max-width: 100%; /* Ensure full width */
      background: #fff;
      flex-direction: column;
      padding: 0;
      overflow-y: auto;
      z-index: 9999;
      border-left: none;
      justify-content: flex-start;
      padding-bottom: 60px; /* Space for bottom bar */
      box-shadow: 0 10px 20px rgba(0,0,0,0.1);
      max-height: calc(100vh - 72px); /* Limit height instead of fixed height */
      height: auto; /* Allow auto height based on content */
      transform: none; /* Reset transform */
  }
  .nav-links.open {
      display: flex;
      animation: slideDown 0.3s ease-out; /* Changed to slide down animation */
  }
  @keyframes slideDown { 
      from { opacity: 0; transform: translateY(-10px); } 
      to { opacity: 1; transform: translateY(0); } 
  }
  
  /* Reset previous slideInRight animation if needed */
  @keyframes slideInRight { from { transform: none; } to { transform: none; } }
  
  /* Mobile Header inside menu - Visible Now */
  .mobile-menu-header { 
      display: flex; 
      justify-content: space-between; 
      align-items: center; 
      padding: 16px 24px; /* Reduced vertical padding */
      background: #fff; 
  }
  .mm-header-inner { width: 100%; display: flex; justify-content: space-between; align-items: center; }
  
  .mobile-menu-header .logo {
      position: static; /* Override absolute positioning from main header */
      transform: none;
      left: auto;
  }
  
  .mm-close { 
      background: none; 
      border: none; 
      font-size: 1.8rem; 
      color: var(--blue); 
      cursor: pointer; 
      padding: 0; 
      line-height: 1; 
      font-weight: 300;
  }
  
  /* Hide previous pseudo-element header if any */
  .nav-links::before { display: none; }
  
  /* Override default menu item spacing */
  .main-nav .nav-links .menu-item { margin: 0; padding: 0; width: 100%; display: block; border-bottom: 1px solid #eee; }
  .main-nav .nav-links .menu-item:last-child { border-bottom: none; }
  /* Reset any specific positioning that might affect mobile layout */
  .nav-links .menu-item.pos-center,
  .nav-links .menu-item.pos-left,
  .nav-links .menu-item.pos-right,
  .nav-links .menu-item.pos-left-offset,
  .nav-links .menu-item {
      text-align: left !important;
      align-items: stretch !important;
      justify-content: flex-start !important;
  }
  
  /* Nav Links Spacing */
  .nav-links > .menu-item > a { padding: 10px 20px !important; font-weight: 500; color: #333; display: flex !important; align-items: center; border-bottom: 1px solid #f5f5f5; width: 100% !important; justify-content: space-between !important; min-height: 44px; }
  
  /* Ensure arrow rotates */
  .nav-links .menu-item > a .arrow { transition: transform 0.3s; margin-left: auto; display: block !important; }
  .nav-links .menu-item.mobile-open > a .arrow { transform: rotate(180deg); }

  .nav-links .menu-item > a::after {
      content: '';
      display: none !important;
  }
  .nav-links .menu-item.active > a {color:var(--blue);background:#f0f4f8;}

  /* Mega Dropdown Animation & Base Style */
  .mega-dropdown {
      display: block !important;
      max-height: 0;
      overflow: hidden;
      opacity: 0;
      visibility: hidden;
      padding: 0 !important;
      margin: 0 !important;
      border: none !important;
      box-shadow: none !important;
      background: #fafafa !important;
      width: 100% !important;
      transition: max-height 0.25s ease-out, opacity 0.2s ease-out;
      position: static !important;
      transform: none !important;
  }
  
  /* Open State */
  .nav-links .menu-item.mobile-open .mega-dropdown {
      max-height: 1500px; /* Large enough to fit content */
      opacity: 1;
      visibility: visible;
  }
  
  /* Clean up Mega Menu Content for Mobile (List View Only) */
  /* Hide all redundant elements */
  .mega-dropdown .mc-icon, 
  .mega-dropdown .mc-desc, 
  .mega-dropdown .mega-divider,
  .mega-dropdown .mega-footer,
  .mega-dropdown img,
  .mega-dropdown .svc-bold,
  .mega-dropdown .svc-body,
  .mega-dropdown .region-panel-title,
  .mega-dropdown .p-icon,
  .mega-dropdown .svc-headline,
  .mega-dropdown .svc-left,
  .mega-dropdown .mega-split-left,
  .mega-dropdown .mega-regions-left {
      display: none !important;
  }

  /* Reset Containers */
  .mega-services-inner, 
  .mega-split-inner, 
  .mega-regions-inner, 
  .mega-split-grid, 
  .region-panel-grid,
  .svc-right,
  .mega-split-right,
  .mega-regions-right,
  .mega-regions-right .region-panel {
      display: block !important;
      padding: 0 !important;
      margin: 0 !important;
      width: 100% !important;
      border: none !important;
  }

  /* Unified Link Style for Submenu Items */
  .mega-dropdown a, 
  .mega-card,
  .region-tab,
  .svc-link,
  .mega-split-left a,
  .region-panel a {
      display: block !important;
      font-size: 14px !important;
      line-height: 1.4 !important;
      color: #333 !important;
      background: #fafafa !important;
      padding: 10px 16px !important;
      margin: 0 !important;
      border-bottom: 1px solid #eee !important;
      font-weight: 400 !important;
      text-decoration: none !important;
      width: 100% !important;
      box-sizing: border-box !important;
      border-radius: 0 !important;
      box-shadow: none !important;
  }

  /* Fix Mega Card Titles to look like plain text */
  .mega-card .mc-title {
      font-size: 14px !important;
      font-weight: 400 !important;
      color: #333 !important;
      margin: 0 !important;
  }

  /* Specific overrides for regions */
  .mega-regions-right .region-panel { display: block !important; }
  .mega-regions-right .region-panel-grid { display: flex !important; flex-direction: column !important; gap: 0 !important; }
  
  /* Mobile: services mega wrapper */
  .mega-services { display: block !important; }
  
  /* Mobile: split layout wrapper */
  .mega-split { display: block !important; }
  
  /* Mobile: regions mega wrapper */
  .mega-regions { display: block !important; }
  
  /* Mobile: about mega wrapper */
  .mega-about { display: block !important; }
  
  .nav-right{gap:8px}
  .btn-register-nav{padding:8px 16px;font-size:.82rem}
  .btn-login-nav{padding:7px 14px;font-size:.82rem}
}
@media(max-width:768px){
  .top-bar{flex-wrap:wrap;justify-content:center;gap:4px;padding:6px 4%}.top-bar-left,.top-bar-right{display:none}
  .hero h1{font-size:1.8rem}.hero-ctas{flex-direction:column;align-items:center}.hero-ctas .btn{width:100%;max-width:280px}
  .partners-bar{flex-direction:column;gap:8px;padding:12px 5%}.partners-label{width:auto;text-align:center}
  .services-grid{grid-template-columns:repeat(2,1fr)}
  .regions-grid{grid-template-columns:repeat(2,1fr)}.region-card.wide{grid-column:span 2}
  .region-card.mobile-hidden-region{display:none}
  .register-inner{flex-direction:column}.register-left{display:none}.register-right{width:100%;padding:32px 24px}.form-row{grid-template-columns:1fr}
  .trust-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr!important;gap:30px 15px}
  .footer-grid>div:first-child{grid-column:1 / -1;padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:10px}
  .footer-grid>div:not(:first-child){padding:0;border:none}
  .footer-logo { margin-bottom: 18px; }
  .footer-logo img { max-width: 180px; height: auto; }
  .footer-bottom-inner{flex-direction:column;text-align:center;gap:6px}
  .cta-inner{padding:36px 24px}.cta-inner h3{font-size:1.2rem}
  .cta-form{flex-direction:column;border-radius:10px}
  .cta-form input{border-radius:10px 10px 0 0}
  .cta-form button{padding:14px;border-radius:0 0 10px 10px}
}

@media(min-width:993px){
  .mobile-bottom-bar, .mobile-actions { display: none !important; }
}

/* Custom FontAwesome Icon for Xiaohongshu */
.fa-xiaohongshu::before {
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask-image: url('data:image/svg+xml;charset=utf-8,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 1024 1024%22%3E%3Cpath d=%22M512 0C229.2 0 0 229.2 0 512s229.2 512 512 512 512-229.2 512-512S794.8 0 512 0zm0 889.6c-208.6 0-377.6-169-377.6-377.6S303.4 134.4 512 134.4 889.6 303.4 889.6 512 720.6 889.6 512 889.6zm215-535.4c-13.8 0-25 11.2-25 25v150c0 13.8 11.2 25 25 25s25-11.2 25-25V379.2c0-13.8-11.2-25-25-25zm-430 0c-13.8 0-25 11.2-25 25v150c0 13.8 11.2 25 25 25s25-11.2 25-25V379.2c0-13.8-11.2-25-25-25zm215 100c-13.8 0-25 11.2-25 25v200c0 13.8 11.2 25 25 25s25-11.2 25-25V479.2c0-13.8-11.2-25-25-25z%22/%3E%3C/svg%3E');
    mask-image: url('data:image/svg+xml;charset=utf-8,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 1024 1024%22%3E%3Cpath d=%22M512 0C229.2 0 0 229.2 0 512s229.2 512 512 512 512-229.2 512-512S794.8 0 512 0zm0 889.6c-208.6 0-377.6-169-377.6-377.6S303.4 134.4 512 134.4 889.6 303.4 889.6 512 720.6 889.6 512 889.6zm215-535.4c-13.8 0-25 11.2-25 25v150c0 13.8 11.2 25 25 25s25-11.2 25-25V379.2c0-13.8-11.2-25-25-25zm-430 0c-13.8 0-25 11.2-25 25v150c0 13.8 11.2 25 25 25s25-11.2 25-25V379.2c0-13.8-11.2-25-25-25zm215 100c-13.8 0-25 11.2-25 25v200c0 13.8 11.2 25 25 25s25-11.2 25-25V479.2c0-13.8-11.2-25-25-25z%22/%3E%3C/svg%3E');
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}