/* ============================================================
   APCE 2027 – KV 色板 + 悬浮组件（独立文件，删除即回滚）
   加载方式：style.css 首行 @import
   ============================================================ */

/* ---------- 1. 色板：KV 蓝 ---------- */
:root{
    --n9:#142F5A;              /* 墨蓝：标题 / 深色卡片底 */
    --n8:#0C3B95;              /* 主蓝 */
    --n7:#17287B;              /* 深蓝：渐变终点 */
    --n6:#2E5AA8;
    --a:#2F63C4;               /* 强调：按钮 / 标签 */
    --ah:#0C3B95;              /* 强调 hover */
    --ag:rgba(47,99,196,0.12);
    --kv-l:#6EA3EF;            /* 亮蓝：深底上的强调 */
    --kv-lt:#CBDBED;           /* 浅灰蓝：深底次级文字 */
    --kv-mid:#5075AD;
    --g1:#F2F5FB;--g2:#DCE4F2;--g3:#C3CFE3;--g4:#8B9CB5;--g5:#5A6E8C;--g7:#2B3E5C;
    --t:#16243A;--tl:#5A6E8C;
}

/* ---------- 2. 页头：深色 + 反白 logo ---------- */
#header{background:linear-gradient(120deg,#0C3B95 0%,#17287B 100%)}
#header.scrolled{background:linear-gradient(120deg,#0B3487 0%,#14236E 100%);border-color:rgba(255,255,255,.10);box-shadow:0 6px 24px rgba(8,24,66,.28)}
.nav-l>li>a{color:rgba(255,255,255,.84)}
.nav-l>li>a:hover,.nav-l>li>a.active{color:#fff;background:rgba(255,255,255,.12)}
.mob-tog span{background:#fff}
.lang-sw{color:rgba(255,255,255,.72)}
.lang-sw:hover{color:#fff;background:rgba(255,255,255,.12)}
#header .sub{background:#fff}
#header .btn-a{background:var(--kv-l);border-color:var(--kv-l);color:#0B2154}
#header .btn-a:hover{background:#fff;border-color:#fff;color:#0C3B95}
.logo-img{filter:none}

/* ---------- 3. 深底区块上的强调色提亮 ---------- */
.hero-h1a{color:var(--kv-l)}
.sc-num,.sc-more{color:var(--kv-l)}
.ev-card--main .ev-badge{background:rgba(110,163,239,.22);color:#DCE8FB}
.dcta--ex{background:linear-gradient(135deg,#0C3B95,#17287B)}
.dcta--vi{background:linear-gradient(135deg,#17287B,#5075AD)}
.ft{background:#142F5A}
.ft-desc,.ft-col ul li a,.ft-qr-txt,.ft-contact li,.ft-bot,.ft-bot-l a{color:var(--kv-lt)}
.ft-col h4,.ft-qr-txt strong{color:#fff}
.ft-social a{background:rgba(255,255,255,.10);color:var(--kv-lt)}
.ft-social a:hover{background:var(--kv-l);color:#0B2154}
.ft-bot{border-color:rgba(255,255,255,.10)}

/* ---------- 4. 展区卡：4 行 × 3 列 ---------- */
.sc-grid .sc-row{display:grid;grid-template-columns:repeat(3,1fr);gap:0;width:100%}
.sc-grid .sc-row .sc-card{flex:0 0 auto!important;width:100%!important;max-width:none!important;height:300px;border-radius:0!important}
.sc-grid .sc-card{border-radius:0}
@media(max-width:1024px){.sc-grid .sc-row{grid-template-columns:repeat(2,1fr)}.sc-grid .sc-row .sc-card{height:260px}}
@media(max-width:768px){.sc-grid .sc-row{grid-template-columns:1fr}.sc-grid .sc-row .sc-card{height:220px}}

/* ---------- 5. 左侧竖排社媒（Facebook / LinkedIn / WhatsApp） ---------- */
.kv-rail{position:fixed;left:16px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:12px;z-index:900}
.kv-rail a{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#0C3B95;color:#fff;box-shadow:0 8px 22px rgba(8,24,66,.28);transition:all .25s ease;border:1px solid rgba(255,255,255,.14)}
.kv-rail a:hover{background:#17287B;transform:translateY(-2px) scale(1.06);box-shadow:0 12px 28px rgba(8,24,66,.38)}
.kv-rail a.kv-wa{background:#25D366;color:#fff}
.kv-rail a.kv-wa:hover{background:#1EBE5A}
.kv-rail a svg{width:20px;height:20px}
@media(max-width:1200px){.kv-rail{left:8px;gap:8px}.kv-rail a{width:38px;height:38px}.kv-rail a svg{width:17px;height:17px}}
@media(max-width:1279px){.kv-rail{display:none}}

/* ---------- 6. 右下两个方形按钮（Free Tickets / Contact Us） ---------- */
.kv-cta{position:fixed;right:20px;bottom:24px;display:flex;flex-direction:column;gap:12px;z-index:900}
.kv-cta a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:96px;height:86px;border-radius:14px;background:#0C3B95;color:#fff;font-size:12px;font-weight:700;line-height:1.2;text-align:center;box-shadow:0 10px 26px rgba(8,24,66,.30);transition:all .25s ease;padding:6px}
.kv-cta a:hover{background:#17287B;transform:translateY(-2px);box-shadow:0 14px 32px rgba(8,24,66,.40)}
.kv-cta a svg{width:22px;height:22px;flex-shrink:0}
.kv-cta a.kv-ticket{background:var(--kv-l);color:#0B2154}
.kv-cta a.kv-ticket:hover{background:#fff;color:#0C3B95}
@media(max-width:768px){
    .kv-cta{right:12px;bottom:14px;gap:8px}
    .kv-cta a{width:74px;height:70px;border-radius:12px;font-size:11px}
    .kv-cta a svg{width:18px;height:18px}
}
@media print{.kv-rail,.kv-cta{display:none}}

/* ---------- 7. 页脚与悬浮组件的避让 ---------- */
.ft{position:relative;z-index:920;padding-bottom:110px}
.kv-rail{z-index:930}
.kv-cta{z-index:940}
@media(max-width:768px){.ft{padding-bottom:150px}}

/* ---------- 8. 内页 Banner / 侧栏与悬浮按钮避让 ---------- */
.page-banner{background:linear-gradient(135deg,#0C3B95 0%,#17287B 100%)}
.inner-side{padding-right:8px}
@media(min-width:1200px){.inner-side{padding-right:104px}}

/* ---------- 9. 展区页（12 展区 / 46 细分类别） ---------- */
.zp-intro p{font-size:16px;line-height:1.8;color:var(--g5)}
.zp-list{display:flex;flex-direction:column;gap:26px;margin-top:28px}
.zp-item{display:grid;grid-template-columns:300px 1fr;gap:26px;background:#fff;border:1px solid var(--g2);border-radius:14px;padding:18px;transition:all .25s}
.zp-item:hover{box-shadow:var(--sh);border-color:#C7D6EE}
.zp-media{position:relative;border-radius:10px;overflow:hidden;background:var(--g1)}
.zp-media img{width:100%;height:100%;max-height:300px;object-fit:cover;display:block}
.zp-num{position:absolute;left:12px;top:12px;background:#0C3B95;color:#fff;font-size:12px;font-weight:700;letter-spacing:.08em;padding:5px 11px;border-radius:100px}
.zp-body h2{font-size:22px;line-height:1.3;color:var(--n9);margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--g2)}
.zp-cats{display:grid;grid-template-columns:1fr 1fr;gap:16px 22px}
.zp-cat{border-left:3px solid var(--kv-l);padding-left:12px}
.zp-cat dt{font-size:15px;font-weight:700;color:#0C3B95;margin-bottom:5px;line-height:1.35}
.zp-cat dd{margin:0;font-size:14px;line-height:1.65;color:var(--g5)}
@media(max-width:900px){.zp-item{grid-template-columns:1fr}.zp-media img{max-height:220px}.zp-cats{grid-template-columns:1fr}}

/* ---------- 10. 会议议程 ---------- */
.ag-block{border:1px solid var(--g2);border-radius:14px;padding:24px 26px;margin-bottom:20px;background:#fff}
.ag-head{margin-bottom:16px}
.ag-tag{display:inline-block;padding:4px 12px;border-radius:100px;background:var(--ag);color:#0C3B95;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-bottom:10px}
.ag-block h2{font-size:20px;line-height:1.35;color:var(--n9)}
.ag-list{margin:0;padding-left:20px}
.ag-list li{font-size:15px;line-height:1.7;color:var(--g5);margin-bottom:10px}
.ag-list li::marker{color:#2F63C4;font-weight:700}

/* ---------- 11. 联系方式 5 卡（自适应多列） ---------- */
.contact-grid{grid-template-columns:repeat(5,1fr);gap:16px;align-items:stretch}
.contact-card{padding:26px 22px;border:1px solid var(--g2);background:#fff}
.contact-card h3{font-size:16px;line-height:1.4;color:var(--n9)}
.contact-card p{font-size:14px;line-height:1.6;color:var(--g5);margin-bottom:6px}
@media(max-width:1200px){.contact-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){.contact-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.contact-grid{grid-template-columns:1fr}}

/* ---------- 12. 首页同期活动：8 块网格 ---------- */
.ev-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.ev-grid .ev-card{display:flex;flex-direction:column;overflow:hidden;text-decoration:none;background:#fff;border:1px solid var(--g2);border-radius:var(--rl);transition:all .25s}
.ev-grid .ev-card:hover{transform:translateY(-3px);box-shadow:var(--sh);border-color:#C7D6EE}
.ev-grid .ev-card-img{height:150px;background-size:cover;background-position:center;flex-shrink:0}
.ev-grid .ev-card-body{padding:18px 18px 20px;display:flex;flex-direction:column;flex:1}
.ev-grid .ev-badge{align-self:flex-start;margin-bottom:10px}
.ev-grid .ev-card h3{font-size:15px;line-height:1.45;color:var(--n9);margin-bottom:12px;flex:1}
.ev-more{margin-top:auto;font-size:12px;font-weight:700;color:#0C3B95;letter-spacing:.03em}
.ev-grid .ev-card:hover .ev-more{color:#2F63C4}
@media(max-width:1024px){.ev-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.ev-grid{grid-template-columns:1fr}}

/* ---------- 13. 展商中心页：展区 / 议程 / 联系 ---------- */
.zc-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:20px 0}
.zc-card{border:1px solid var(--g2);border-radius:12px;padding:18px;background:#fff}
.zc-head{display:flex;align-items:center;gap:10px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--g2)}
.zc-num{background:#0C3B95;color:#fff;font-size:11px;font-weight:700;padding:4px 9px;border-radius:100px;flex-shrink:0}
.zc-head h4{font-size:16px;line-height:1.35;color:var(--n9);margin:0}
.zc-cats{display:flex;flex-direction:column;gap:10px}
.zc-cat b{display:block;font-size:14px;color:#0C3B95;margin-bottom:3px}
.zc-cat span{font-size:13px;line-height:1.6;color:var(--g5)}
.ag-rows{display:flex;flex-direction:column;gap:14px;margin:20px 0}
.ag-row{border:1px solid var(--g2);border-radius:12px;padding:16px 18px;background:#fff}
.ag-row-head{margin-bottom:8px}
.ag-row-head h4{font-size:15px;line-height:1.4;color:var(--n9);margin:6px 0 0}
.ag-row-list{margin:0;padding-left:18px}
.ag-row-list li{font-size:13.5px;line-height:1.65;color:var(--g5)}
.ag-link{font-weight:700;color:#0C3B95}
@media(max-width:768px){.zc-grid{grid-template-columns:1fr}}

/* ---------- 14. 阿语 RTL（html[dir=rtl] 时生效） ---------- */
html[dir="rtl"] body{direction:rtl;text-align:right}
html[dir="rtl"] .kv-rail{left:auto;right:16px}
html[dir="rtl"] .kv-cta{right:auto;left:20px}
html[dir="rtl"] .zp-cat,html[dir="rtl"] .zc-cat{border-left:0;border-right:3px solid var(--kv-l);padding-left:0;padding-right:12px}
html[dir="rtl"] .ag-list{padding-left:0;padding-right:22px}
html[dir="rtl"] .ag-row-list{padding-left:0;padding-right:18px}
html[dir="rtl"] .ag-row,html[dir="rtl"] .ev-grid .ev-card{text-align:right}
html[dir="rtl"] .zp-num{left:auto;right:12px}
html[dir="rtl"] .inner-side{padding-right:0}
@media(min-width:1200px){html[dir="rtl"] .inner-side{padding-right:0;padding-left:104px}}
html[dir="rtl"] .mob-tog{left:18px;right:auto}
html[dir="rtl"] .lang-dropdown{right:auto;left:0}
html[dir="rtl"] .nw-card-body,html[dir="rtl"] .ev-card-body,html[dir="rtl"] .zp-body{text-align:right}
html[dir="rtl"] .contact-card{text-align:center}

/* ---------- 15. 展区卡：顶部压暗，保证标题可读 ---------- */
.sc-grid .sc-card::before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(9,26,62,.58) 0%,rgba(9,26,62,.16) 42%,rgba(9,26,62,0) 68%)}
.sc-grid .sc-num{color:#A9C8F7;opacity:1}
.sc-grid .sc-top h4{text-shadow:0 1px 8px rgba(6,18,45,.45)}

/* ---------- 18. 手机端（<=768）：白底菜单里的文字颜色 + logo 高度 ---------- */
@media (max-width:768px){
  #mainNav{background:#fff}
  #mainNav .nav-l>li>a{color:#0F2A5E}
  #mainNav .nav-l>li>a:hover,#mainNav .nav-l>li>a.active,#mainNav .nav-l>li.hover>a{color:#2C5FC4;background:rgba(12,59,149,.06)}
  #mainNav .nav-l .sub a{color:#3A4A63}
  #mainNav .nav-l .sub a:hover{color:#0C3B95;background:rgba(12,59,149,.05)}
  #mainNav .nav-acts-m .btn-a{background:#2C5FC4;color:#fff;border-color:#2C5FC4}
  #mainNav .nav-acts-m .lang-sw{color:#0F2A5E;border-color:#D7E1F2;background:#fff}
  #header .nav li a,#header .nav-l li a{white-space:normal}
  #header .logo .logo-img{max-height:46px;width:auto}
  #header .logo{height:auto;align-items:center}
  .mob-tog span{background:#fff}
}

/* 菜单展开时（白底）汉堡图标改为深色，避免看不见 */
.mob-tog.open span{background:#0F2A5E}
@media (max-width:768px){ #mainNav{padding-top:96px} }

/* ---------- 19. 手机端悬浮按钮缩小，减少遮挡 ---------- */
@media (max-width:768px){
  .kv-cta{right:10px;bottom:12px;gap:8px}
  .kv-cta a{width:58px;height:58px;border-radius:12px;font-size:9.5px;gap:3px;padding:4px;box-shadow:0 6px 16px rgba(8,24,66,.28)}
  .kv-cta a svg{width:15px;height:15px}
  .ft{padding-bottom:150px}
}
