/* =====================================================
   Griffin Federal Republic
   Ministry Website Common UI
   Header + Navigation System
===================================================== */


/* =========================
   GLOBAL HEADER
========================= */

header{

position:sticky;

top:0;

z-index:100;


background:rgba(255,255,255,0.92);

backdrop-filter:blur(14px);


border-bottom:

1px solid rgba(0,0,0,0.06);


}



/* =========================
   NAVBAR
========================= */


.navbar{


display:flex;

align-items:center;

justify-content:space-between;


padding:16px 46px;


}



/* =========================
   LOGO
========================= */


.logo{

display:flex;

flex-direction:column;

}



.logo .cn{

font-size:18px;   /* 👈 原16px → 放大 */

font-weight:700;

letter-spacing:2px;

color:#1d3557;

}



.logo .en{


font-size:11px;


letter-spacing:1px;


margin-top:3px;


color:#6b7f93;


}



/* =========================
   MENU
========================= */


.nav-links{


display:flex;

align-items:center;

gap:26px;


}



.nav-links a{


position:relative;


font-size:15px;


font-weight:500;


text-decoration:none;


color:#355070;


padding:8px 2px;


transition:

color .25s ease,

transform .25s ease;


}




/* hover */

.nav-links a:hover{


color:#0a66c2;


transform:translateY(-2px);


}




/* =========================
   ACTIVE PAGE
========================= */


.nav-links a.active{


color:#0a66c2;


font-weight:600;


}



/* 动态底线 */

.nav-links a::after{


content:"";


position:absolute;


left:50%;


bottom:0;


width:0;


height:2px;


background:#0a66c2;


transition:.35s;


transform:translateX(-50%);


}




.nav-links a:hover::after,

.nav-links a.active::after{


width:100%;


}




/* =========================
   LANGUAGE BUTTON
========================= */


.lang-switch{


display:flex;

gap:6px;


}



.lang-switch button{


font-size:12px;


padding:5px 12px;


border-radius:6px;


background:white;


border:

1px solid rgba(0,0,0,.12);


cursor:pointer;


transition:.25s;


}



.lang-switch button:hover{


color:#0a66c2;


border-color:#4a90e2;


transform:translateY(-2px);


}



/* =========================
   MOBILE
========================= */


@media(max-width:900px){


.navbar{


flex-direction:column;

gap:15px;


}


.nav-links{


flex-wrap:wrap;

justify-content:center;


}



}