/* ================================================================
   css/home.css  — 1:1 对标 cotpe.tw/ 真实首页 (抓到的 main_1h.css)
   - 5色常量 (bg-primary=#00a04e 绿, bg-blue=#0078d0, bg-yellow=#ffb114,
             bg-red=#f0282d, bg-dark=#212121)
   - masthead fixed / height:auto / navbar flex-wrap:wrap
   - ribbon2: right:0, top:20, width 62.5%, height 24vw 竖排5条
   - fluid  max-width 1520px / 40px px px
   - newsitem-pic: 1:1 正方形 + border-radius 3.75rem
   - navbar-link-underline: 定位 bottom:0 / height 5px / left+right 0
   - navbar-item.active  → underline opacity:1（真实类名，不是 .active-link）
   - mastfoot-rings i height:10px / 固定屏幕底部不随滚动走
   对照文件: _cotpe_home_latest.html / _cotpe_main.css (183KB)
================================================================ */

*,*::before,*::after{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{font-family:"Helvetica Neue",Helvetica,Arial,"Microsoft JhengHei","PingFang TC","PingFang SC","Hiragino Sans GB",sans-serif;color:#212121;background:#fff;line-height:1.5;-webkit-font-smoothing:antialiased;}
a{color:inherit;text-decoration:none;}
a:hover{text-decoration:none;}
figure{margin:0;}
ul{list-style:none;margin:0;padding:0;}
.overflow-hidden{overflow:hidden;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
[hidden]{display:none !important;}
.d-block{display:block !important;}
.mw-100{max-width:100%;}
.w-100{width:100% !important;}
.h-100{height:100% !important;}
.ofi-cover{object-fit:cover;}

/* ============ 间距 & 布局辅助 ============ */
.py-3{padding-top:1rem;padding-bottom:1rem;}
.py-4{padding-top:1.5rem;padding-bottom:1.5rem;}
.py-5{padding-top:3rem;padding-bottom:3rem;}
.py-lg-5{padding-top:3rem;padding-bottom:3rem;}
.mt-2{margin-top:.5rem;}
.mt-10{margin-top:.1rem;}
.mb-1{margin-bottom:.25rem;}
.mb-2{margin-bottom:.5rem;}
.mb-3{margin-bottom:1rem;}
.mb-5{margin-bottom:3rem;}
.pb-3{padding-bottom:.75rem;}
.ml-3{margin-left:.75rem;}
.mr-2{margin-right:.5rem;}
.pl-2{padding-left:.5rem;}
.pr-2{padding-right:.5rem;}
.px-2{padding-left:.5rem;padding-right:.5rem;}
.position-relative{position:relative;}
.d-none{display:none !important;}
.d-flex{display:flex !important;}
.align-items-center{align-items:center;}
.justify-content-center{justify-content:center;}
.justify-content-between{justify-content:space-between;}
@media(min-width:768px){ .d-md-flex{display:flex !important;} }

.row{display:flex;flex-wrap:wrap;margin-left:-15px;margin-right:-15px;}
.mx-lg-n4{margin-left:-2rem;margin-right:-2rem;}
.col-6{flex:0 0 50%;max-width:50%;padding:0 15px;}
@media(min-width:768px){
    .col-md-4{flex:0 0 33.333333%;max-width:33.333333%;padding:0 15px;}
}
@media(min-width:992px){
    .col-lg-3{flex:0 0 25%;max-width:25%;padding:0 15px;}
}

/* ============ 文字尺寸 & 颜色 (真实抄) ============ */
.h1-mb{font-weight:700;letter-spacing:-0.5px;margin:0;}
.h2-mb{font-weight:700;margin:0;}
.h3-mb{font-weight:700;margin:0;}
.h4-mb{font-weight:700;margin:0;}
.h5{font-size:1.25rem;font-weight:600;margin:0;}
.h5-mb{font-size:1.25rem;font-weight:600;margin:0;}
.h6{font-size:1rem;font-weight:600;margin:0;}
.h6-mb{font-size:1rem;font-weight:600;margin:0;}
.h7{font-size:.8125rem;}
.h7-mb{font-size:.8125rem;margin:0;}
.display-1{font-size:3.75rem;line-height:1;margin:0;}
@media(max-width:991px){ .display-1{font-size:2.25rem;} }
@media(max-width:575px){ .display-1{font-size:1.75rem;} }
.text-gray{color:#666 !important;}
.text-gray-light{color:#d2d2d2 !important;}
.text-white{color:#fff !important;}
.text-dark{color:#212121 !important;}
.lh-none{line-height:1;}
.lh-sm{line-height:1.25;}
.lh-lg{line-height:1.7;}
.lh-base{line-height:1.5;}
.d-block{display:block !important;}

/* ============ 5 色常量 (真实值) ============ */
.bg-primary{background-color:#00a04e !important;}
.bg-blue{background-color:#0078d0 !important;}
.bg-red{background-color:#f0282d !important;}
.bg-yellow{background-color:#ffb114 !important;}
.bg-dark{background-color:#212121 !important;}
.bg-white{background-color:#fff !important;}
.bg-gray{background-color:#f0f0f0 !important;}
.bg-gray-light{background-color:#d2d2d2 !important;}

/* ============ Buttons ============ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:1px solid transparent;border-radius:.375rem;padding:.55rem 1.1rem;font-size:.9375rem;font-weight:500;cursor:pointer;line-height:1.2;transition:.15s;user-select:none;white-space:nowrap;text-decoration:none;}
.btn-sm{padding:.35rem .7rem;font-size:.8125rem;}
.btn-lg{padding:.9rem 1.5rem;font-size:1rem;}
.rounded-pill{border-radius:9999px !important;}
.border-gray{border-color:#d7d7d7;}
.btn-primary{background:#0078d0;color:#fff;border-color:#0078d0;}
.btn-primary:hover{background:#005b9d;border-color:#005b9d;}
.btn-ghost{background:#f6f8fa;color:#24292f;border-color:#d0d7de;}
.btn-dark{background:#212121;color:#fff;border-color:#212121;}
.btn-dark:hover{background:#000;}
.btn-social-circle{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;padding:0;font-size:.8125rem;}
.btn-social-circle:hover{opacity:.88;}

/* ==================================================================
   Masthead (fixed顶部, 真实 height: auto, 高度自适应 navbar wrap )
   ================================================================== */
.masthead{
    position:fixed;
    z-index:20;
    left:0;
    right:0;
    top:0;
    background:#fff;
    -webkit-user-select:none;
    user-select:none;
    box-shadow:0 1px 2px rgba(0,0,0,.05);
    /* height: 75px; */ /* 真实被注释掉，height由内容wrap决定（31项需要两行） */
}
.masthead-inner{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:space-between;
    height:100%;
    margin:0 auto;
}
.masthead-logo{
    position:absolute;
    left:40px;
    top:21px;
    display:block;
    height:32px;
}
.masthead-logo-img{
    display:block;
    height:100%;
    display:flex;
    align-items:center;
    gap:6px;
}
.masthead-logo-img img{
    display:block;
    height:100%;
    width:auto;
}
.logo-mark{
    font-weight:800;
    font-size:1.15rem;
    letter-spacing:-0.3px;
    color:#0078d0;
}
.logo-sub{
    font-weight:600;
    font-size:.85rem;
    color:#212121;
    opacity:.82;
}

/* 语言按钮，position:absolute右40px，真实写死 */
.masthead-service{
    position:absolute;
    right:40px;
    display:flex;
    align-items:center;
    height:100%;
    pointer-events:none;
}
.masthead-btn-lang{
    white-space:nowrap;
    pointer-events:auto;
    padding:.35rem .8rem;
    border:1px solid #d7d7d7;
    background:#fff;
    color:#666;
    border-radius:9999px;
    display:inline-flex;
    align-items:center;
    gap:6px;
    text-decoration:none;
}
.masthead-btn-lang:hover{
    background:#f6f8fa;
}
.ico-ui-globe{
    display:inline-block;
    width:14px;height:14px;
    background:currentColor;
    -webkit-mask:no-repeat center/contain;
    mask:no-repeat center/contain;
    border-radius:50%;
    opacity:.7;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.25);
}
@media(max-width: 1650px){
    .masthead-service{
        flex:0 0 auto;
        margin-right:40px;
        position:static;
        right:auto;
    }
    .masthead-inner{
        padding-right:0;
    }
}
@media(min-width:1201px) and (max-width:1536px){
    .masthead-logo{
        left:40px;
    }
}
@media(max-width:767px){
    .masthead-service{
        display:none;
    }
}

/* ==================================================================
   Navbar (核心：真实站 flex-wrap:wrap + justify-content:flex-end)
   31 个链接需要两行显示 → height 由 wrap 自然撑开
   ================================================================== */
@media(min-width:1201px){
    .navbar{
        flex:1 1 auto;
        max-width:1440px;
        margin:auto;
        display:flex;
        justify-content:flex-end;
        flex-wrap:wrap;   /* 关键！真实是wrap，不是nowrap！31项会换行成2行 */
    }
    .navbar-item{
        position:relative;
        flex:0 0 auto;
    }
    .navbar-link{
        position:relative;
        display:flex;
        align-items:center;
        justify-content:center;
        height:75px;
        padding:0 15px;
        text-align:center;
        line-height:1.2;
        color:#212121;
        font-weight:500;
        transition:.12s;
        text-decoration:none;
    }
    .navbar-link:hover{
        color:#0078d0;
    }
    .navbar-link-txt{
        white-space:nowrap;
        display:block;
    }
    .navbar-link-underline{
        position:absolute;
        left:0;
        right:0;
        bottom:0;
        height:5px;              /* 真实 5px 高度，贴底部 */
        opacity:0;
        transition:opacity .12s;
        background:#0078d0;      /* 默认蓝色，bg-* 类覆盖 */
    }
    /* hover / active → underline 显示 */
    .navbar-link:hover .navbar-link-underline,
    .navbar-link:focus .navbar-link-underline,
    .navbar-link:active .navbar-link-underline{
        opacity:1;
    }
    /* 真实类名：active状态加在 navbar-item 上！（不是navbar-link.active-link）*/
    .navbar-item.active .navbar-link .navbar-link-underline{
        opacity:1;
    }
}
@media(max-width:1650px){
    .navbar{
        padding-right:20px;
        margin:0;
    }
}
@media(max-width:1200px){
    .navbar{
        display:none;  /* 小于1200px 隐藏桌面导航（真实逻辑） */
    }
}

/* 语言下拉 & 移动端汉堡（占位，真实由JS控制，简化版不用管） */
.masthead-toggle{
    display:none;
    transition:.15s;
}
[js-panel]{
    display:none;
}
.panel--active[js-panel]{
    display:block;
}

/* ==================================================================
   Mastbody (真实没有加固定75px padding-top，因为masthead高度自适应)
   ================================================================== */
.mastbody{
    min-height:calc(100vh - 72px);
    /* padding-top 真实没写，因为masthead高度由wrap决定，用一个较大默认值兜底 */
    padding-top:160px;
}
/* 如果用户屏幕很大（31项只需要一行，75px）→ 这里用JS动态处理也行，兜底160px不会错 */
@media(max-width:1200px){
    .mastbody{
        padding-top:60px;   /* 导航隐藏，只留logo高度 */
    }
}

/* fluid (真实抄 1520 / 40px) */
.fluid{
    max-width:1520px;
    margin-left:auto;
    margin-right:auto;
    padding-left:40px;
    padding-right:40px;
    padding-bottom:.1px;
}
.fluid-px{
    padding-left:40px;
    padding-right:40px;
}
.fluid-center{
    max-width:1440px;
    margin-left:auto;
    margin-right:auto;
}
@media(max-width:991px){
    .fluid{ padding-left:30px; padding-right:30px; }
}
@media(max-width:575px){
    .fluid{ padding-left:20px; padding-right:20px; }
}

/* ==================================================================
   ribbon2 (右上角 5 段竖条，完全按真实抄：位置/宽高/5段百分比)
   ================================================================== */
.ribbon2{
    position:absolute;
    right:0;
    top:20px;
    width:62.5%;
    height:24vw;
    max-height:360px;
    display:flex;
    flex-direction:column;
    pointer-events:none;
    z-index:1;
}
.ribbon2 i{ display:block; }
.ribbon2 i:nth-child(1){ height:58.3333333333%; }
.ribbon2 i:nth-child(2){ height:16.6666666667%; }
.ribbon2 i:nth-child(3){ height:15%; }
.ribbon2 i:nth-child(4){ height:6.1111111111%; }
.ribbon2 i:nth-child(5){ height:3.8888888889%; }
@media(max-width:575px){
    .ribbon2{
        top:-20px;
        height:50vw;
        width:70%;
        max-height:320px;
    }
}

/* ==================================================================
   News 4 卡片（真实 col-lg-3 / col-md-4 / col-6, newslist-col 外距）
   ================================================================== */
.newslist-col{
    padding:0 2.7777777778%;
    margin-bottom:3rem;
}
@media(min-width: 1750px){
    .newslist{
        margin-left:-6vw;
        margin-right:-6vw;
    }
}
.newsitem{
    display:block;
    position:relative;
    z-index:2;
    text-decoration:none;
}
.newsitem-pic{
    position:relative;
    padding-top:100%;
    overflow:hidden;
    border-radius:3.75rem;
    -webkit-backface-visibility:hidden;
    -webkit-transform:translate3d(0,0,0);
    background:#f0f0f0;
}
.newsitem-pic .newsitem-cover{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:5rem;
    color:#fff;
    font-weight:700;
    transition:transform .12s ease-out;
}
.newsitem:hover .newsitem-pic .newsitem-cover,
.newsitem:active .newsitem-pic .newsitem-cover{
    transform:scale(1.1);
}
.newsitem-pic img{
    transition:transform .12s ease-out;
    position:absolute;
    left:0;
    top:0;
}
.newsitem:hover .newsitem-pic img,
.newsitem:active .newsitem-pic img{
    transform:scale(1.1);
}
.newsitem-txt{
    padding-left:.5rem;
    padding-top:.75rem;
}
.newsitem-date{
    position:relative;
    display:block;
    font-size:.75rem;
    color:#666;
    margin-bottom:.6rem;
    padding-bottom:.6rem;
    line-height:1;
}
.newsitem-date::after{
    content:"";
    display:block;
    position:absolute;
    left:0;
    bottom:0;
    width:25px;
    height:1px;
    background:#999;
}
.newsitem-title{
    font-size:1.1rem;
    line-height:1.6;
    font-weight:600;
    color:#212121;
    margin:0;
}
.newsitem:hover .newsitem-title{
    color:#0078d0;
}
@media(max-width:1200px){
    .newsitem-pic{ border-radius:1.875rem; }
}
@media(max-width:575px){
    .newsitem-title{ font-size:1rem; }
}

/* ==================================================================
   Intro 段落（真实一个 p）
   ================================================================== */
.intro-txt{
    max-width:1100px;
}
.intro-txt p{
    font-size:1.05rem;
    line-height:1.9;
    color:#555;
    margin:0;
}
.intro-txt a{
    color:#0078d0;
    font-weight:600;
    border-bottom:1px solid #bfddf3;
    text-decoration:none;
}
.intro-txt a:hover{
    background:#f0f7ff;
}

/* ==================================================================
   WinTogether 横幅 — 真实站是一张 img/wintogether.png（白底，左右两个奥运五环色块
   中间大文字 WIN TOGETHER!!），这里用纯CSS还原纯图片视觉，不要渐变/按钮
   ================================================================== */
.win-banner{
    margin:0 auto 3rem;
    padding:0;
}
.win-inner-simple{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1.5rem;
    padding:2rem 2.5rem;
    background:#fff;
    border-radius:0;
}
.win-inner-simple .win-row{
    display:flex;
    gap:10px;
    align-items:center;
}
.win-inner-simple .win-dot{
    width:28px;
    height:28px;
    border-radius:50%;
    display:inline-block;
    box-shadow:inset 0 0 0 2px rgba(255,255,255,.35);
}
.win-text{
    flex:1;
    text-align:center;
    font-size:clamp(2rem,5vw,3.75rem);
    font-weight:900;
    letter-spacing:1.5px;
    color:#212121;
    margin:0;
    line-height:1;
    background:linear-gradient(90deg,#0078d0 0%,#0078d0 20%,#ffb114 20%,#ffb114 40%,#00a04e 40%,#00a04e 60%,#f0282d 60%,#f0282d 80%,#212121 80%);
    -webkit-background-clip:text;
    background-clip:text;
    -webkit-text-fill-color:transparent;
}
@media(max-width:991px){
    .win-inner-simple{
        flex-direction:column;
        padding:1.5rem 1rem;
        text-align:center;
    }
    .win-inner-simple .win-row{gap:6px;}
    .win-inner-simple .win-dot{width:20px;height:20px;}
}

/* ==================================================================
   Subnav 黑底下拉（真实 #212121 背景，白字 hover #666）
   ================================================================== */
@media(min-width:1201px){
    .subnav{
        position:absolute;
        z-index:10;
        left:0;
        top:100%;
        margin-top:-5px;
        box-shadow:0 2px 2px rgba(0,0,0,.1);
        display:none;
    }
    .navbar-item:hover .subnav,
    .navbar-item:focus-within .subnav{
        display:block;
    }
    .subnav-inner{
        position:relative;
        min-width:220px;
        max-width:300px;
        padding:15px 0;
        background:#212121;
        color:#fff;
    }
    .subnav-row{
        display:block;
        list-style:none;
        margin:0;
        padding:0;
    }
    .subnav-item{
        display:block;
    }
    .subnav-link{
        display:flex;
        padding:8px 30px;
        font-weight:500;
        line-height:1.2;
        color:#fff;
        text-decoration:none;
        transition:background .12s;
    }
    .subnav-link:hover,
    .subnav-link:focus,
    .subnav-link:active,
    .subnav-item.active .subnav-link{
        background:#666;
        color:#fff;
    }
}

/* Mastbody 顶部 padding 响应式兜底：大屏幕(31项一行=75px) 中屏(31项两行=150px) */
@media(min-width:1850px){
    .mastbody{ padding-top:90px; }
}
@media(min-width:1500px) and (max-width:1849px){
    .mastbody{ padding-top:110px; }
}
@media(min-width:1201px) and (max-width:1499px){
    .mastbody{ padding-top:170px; }
}
@media(max-width:1200px){
    .mastbody{ padding-top:80px; }
}

/* Intro 段落 L520 真实：无 fluid → 用 body 80px padding 左右 + 文本不超过容器 */
.mastbody .py-4.py-lg-5 > p{
    max-width:1100px;
    margin:0 auto;
    padding:0 40px;
    font-size:1.05rem;
    line-height:1.9;
    color:#555;
}
.mastbody .py-4.py-lg-5 > p a{
    color:#0078d0;
    font-weight:600;
    border-bottom:1px solid #bfddf3;
    text-decoration:none;
}
.mastbody .py-4.py-lg-5 > p a:hover{
    background:#f0f7ff;
}
@media(max-width:991px){
    .mastbody .py-4.py-lg-5 > p{ padding:0 30px; }
}
@media(max-width:575px){
    .mastbody .py-4.py-lg-5 > p{ padding:0 20px; font-size:1rem; }
}

/* ==================================================================
   Mastfoot + mastfoot-rings (fixed 底部5色横条 height 10px！之前漏了)
   ================================================================== */
.mastfoot{
    position:relative;
    padding-top:1.5rem;
}
.mastfoot-inner{
    display:flex;
    align-items:flex-start;
    justify-content:center;
    height:72px;
    max-width:1520px;
    margin:0 auto;
    padding:0 40px;
    gap:2rem;
}
.mastfoot-declare{
    margin-top:10px;
    color:#666;
    font-size:.85rem;
    line-height:1.3;
}
.mastfoot-social{
    margin-left:auto;
    display:flex;
    align-items:center;
}
.mastfoot-social .h6{
    font-size:.95rem;
    margin-right:1rem;
    color:#666;
    line-height:1;
    margin-top:10px;
}
.mastfoot-social .btn-social-circle{
    width:36px;
    height:36px;
    font-size:.75rem;
}
.mastfoot-rings{
    position:fixed;
    z-index:19;
    left:0;
    right:0;
    bottom:0;
    display:flex;
}
.mastfoot-rings i{
    flex:1 1 20%;
    display:block;
    height:10px;   /* 真实：必须有 height！之前漏了，环看不见 */
}
@media(max-width:575px){
    .mastfoot-rings i{
        height:6px;
    }
}

/* ==================================================================
   Back-top
   ================================================================== */
.btn-backtop{
    position:fixed;
    right:24px;
    bottom:30px;
    width:46px;
    height:46px;
    border-radius:50%;
    background:#212121;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:50;
    box-shadow:0 4px 14px rgba(0,0,0,.2);
    opacity:.8;
    text-decoration:none;
}
.btn-backtop::before{
    content:"↑";
    font-size:1.1rem;
    font-weight:700;
}
.btn-backtop:hover{
    opacity:1;
    transform:translateY(-2px);
}

/* ==================================================================
   Coming Soon (用于 server.py 直接返回 & 占位页复用)
   ================================================================== */
.cs-wrap{
    max-width:720px;
    margin:10vh auto;
    padding:60px 30px;
    text-align:center;
}
.cs-emoji{
    font-size:80px;
    margin-bottom:18px;
}
.cs-title{
    font-size:32px;
    font-weight:800;
    margin-bottom:10px;
    letter-spacing:-0.4px;
}
.cs-sub{
    color:#666;
    font-size:16px;
    margin-bottom:30px;
    line-height:1.7;
}
.cs-btns{
    display:inline-flex;
    gap:10px;
    flex-wrap:wrap;
    justify-content:center;
}

/* ==================================================================
   Sub-hero (passport-photolook 子页蓝色 Hero + 面包屑)
   ================================================================== */
.sub-hero{
    position:relative;
    padding:40px 0 90px;
    margin-top:-20px;
    background:linear-gradient(135deg,#0b1b3a 0%,#1f6feb 100%);
    color:#fff;
    overflow:hidden;
}
.sub-hero::before{
    content:"";
    position:absolute;
    inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
    background-size:36px 36px;
}
.sub-inner{
    position:relative;
    z-index:2;
}
.crumb{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:.9rem;
    color:rgba(255,255,255,.85);
    margin-bottom:12px;
}
.crumb a{
    color:#fff;
    opacity:.95;
}
.crumb-sep{opacity:.6;}
.sub-title{
    font-size:2.2rem;
    letter-spacing:-.3px;
    font-weight:800;
    margin:0;
}
.sub-sub{
    font-size:1rem;
    opacity:.9;
    margin-top:8px;
}
.sub-hero .inline-lang{
    position:absolute;
    right:40px;
    top:36px;
    display:flex;
    gap:4px;
    padding:3px;
    border-radius:999px;
    background:rgba(255,255,255,.15);
    backdrop-filter:blur(6px);
}
.sub-hero .inline-lang a{
    padding:6px 14px;
    border-radius:999px;
    font-size:.85rem;
    color:#fff;
    opacity:.9;
    text-decoration:none;
}
.sub-hero .inline-lang a.active{
    background:#fff;
    color:#1f6feb;
    font-weight:700;
}

.wrap-sub{
    max-width:1440px;
    margin:-44px auto 0;
    padding:0 30px 60px;
    position:relative;
    z-index:3;
}
.search-row{
    background:#fff;
    border-radius:14px;
    box-shadow:0 6px 24px rgba(15,30,70,.12);
    padding:16px 20px;
    margin-bottom:24px;
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}
.search-row input{
    flex:1;
    min-width:240px;
    padding:10px 14px;
    border:1px solid #b9b9b9;
    border-radius:6px;
    font-size:.95rem;
    font-family:inherit;
}
.search-row button{
    padding:10px 20px;
    border-radius:6px;
    background:#212121;
    color:#fff;
    border:1px solid #212121;
    cursor:pointer;
    font-weight:600;
    font-family:inherit;
}
.search-row button:hover{
    background:#000;
}

@media(max-width:960px){
    .sub-title{font-size:1.6rem;}
    .sub-hero{padding:28px 0 80px;}
    .sub-hero .inline-lang{position:static;margin-top:18px;justify-content:flex-start;display:inline-flex;}
}
@media(max-width:480px){
    .search-row input{min-width:100%;}
}

/* AccessKey anchors 隐藏 */
#acckey-x, #acckey-c, #acckey-b, #acckey-n{
    position:absolute;
    left:-9999px;
    top:auto;
    width:1px;
    height:1px;
    overflow:hidden;
}

@media(max-width:1200px){
    .masthead-inner{padding:0 20px;}
    .masthead-logo{left:20px;}
}

/* =========================================================
   简洁大方风格补充（数据优先，不花哨）
   ========================================================= */
/* 子页通用 */
.cat-page .sub-hero h1,
.cat-page .sub-hero .sub-title { letter-spacing:-.01em; }
.cat-page .sub-hero .inline-lang a { transition:all .15s; }
.cat-page .sub-hero .inline-lang a:hover:not(.active) { background:rgba(255,255,255,.18); }

/* 通用文字行高呼吸感 */
body.cat-page { line-height:1.7; color:#0f172a; }
body.cat-page h1,body.cat-page h2,body.cat-page h3,body.cat-page h4 { letter-spacing:-.01em; }

/* 列表容器 */
.cat-page ul#tplList > li + li { margin-top:18px; }
.cat-page ul#tplList figure { border-radius:8px; }

/* 侧栏国家列表链接简洁化 */
#countryList li a:hover:not([style*="background"]) { background:#f1f5f9 !important; }
#countryList li a { transition:background .12s; }

/* 搜索框占位符简洁灰 */
.cat-page input[type="text"]::placeholder { color:#94a3b8; }

/* Alert提示里中/英切换（配合语言按钮） */
body.cat-page.lang-zh .zh-text { display:inline !important; }
body.cat-page.lang-zh .zh-text { display:initial !important; }