/* === 全站共用 nav + footer + float-btn（給 member/ 子頁用） === */
:root{--shell-dark:#0F1A26;--shell-blue:#3A6EA5;--shell-blue-light:#C8D8E8;--shell-blue-pale:#EEF2F7;--shell-copper:#C8924A;--shell-copper-light:#E5B46A;--nav-h:56px;}
body{padding-top:var(--nav-h);}
/* NAV */
#site-nav{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--nav-h);background:var(--shell-dark);display:flex;align-items:center;justify-content:space-between;padding:0 48px;}
#site-nav .nav-logo{display:flex;flex-direction:column;gap:1px;text-decoration:none;}
#site-nav .nav-logo-cn{font-family:'Noto Serif TC',serif;font-size:16px;font-weight:600;color:#fff;letter-spacing:.06em;}
#site-nav .nav-logo-en{font-size:8.5px;color:rgba(255,255,255,.38);letter-spacing:.14em;}
#site-nav .nav-links{display:flex;gap:4px;align-items:center;}
#site-nav .nav-links a{font-size:13px;color:rgba(255,255,255,.68);padding:6px 12px;border-radius:50px;perspective:300px;overflow:hidden;text-decoration:none;}
#site-nav .nav-flip{display:block;position:relative;transition:transform .45s ease;transform-style:preserve-3d;}
#site-nav .nav-links a:hover .nav-flip{transform:rotateX(180deg);}
#site-nav .nav-flip-cn,#site-nav .nav-flip-en{display:block;backface-visibility:hidden;white-space:nowrap;}
#site-nav .nav-flip-cn{position:relative;}
#site-nav .nav-flip-en{position:absolute;top:0;left:50%;transform:translateX(-50%) rotateX(180deg);font-size:11px;letter-spacing:.06em;color:#fff;}
#site-nav .nav-links a:hover{background:rgba(255,255,255,.08);}
#site-nav .nav-lang{font-size:11px!important;font-weight:600;color:rgba(255,255,255,.6)!important;border:1px solid rgba(255,255,255,.25);border-radius:50px;padding:4px 12px!important;letter-spacing:.08em;transition:color .2s,border-color .2s,background .2s;}
#site-nav .nav-lang:hover{color:#fff!important;border-color:var(--shell-copper);background:rgba(200,146,74,.15);}
#site-nav .nav-cta{background:var(--shell-copper)!important;color:#fff!important;padding:8px 20px!important;border-radius:50px;font-weight:500;transition:background .2s!important;}
#site-nav .nav-cta:hover{background:var(--shell-copper-light)!important;}
#site-nav .nav-cta .nav-flip-cn,#site-nav .nav-cta .nav-flip-en{color:#fff!important;}
#site-nav .nav-burger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px;background:none;border:none;}
#site-nav .nav-burger span{width:22px;height:1.5px;background:#fff;border-radius:2px;display:block;}
.shell-drawer{display:none;position:fixed;top:0;left:0;right:0;bottom:0;z-index:200;background:rgba(0,0,0,.5);}
.shell-drawer.open{display:block;}
.shell-drawer-inner{position:absolute;top:0;right:0;bottom:0;width:280px;background:var(--shell-dark);display:flex;flex-direction:column;padding:72px 32px 40px;gap:8px;animation:shell-slideIn .25s ease;overflow-y:auto;}
@keyframes shell-slideIn{from{transform:translateX(100%);}to{transform:translateX(0);}}
.shell-drawer-inner a{font-size:16px;color:rgba(255,255,255,.75);padding:12px 0;border-bottom:1px solid rgba(255,255,255,.06);display:block;text-decoration:none;transition:color .2s;}
.shell-drawer-inner a:hover{color:#fff;}
.shell-drawer-close{position:absolute;top:16px;right:20px;background:none;border:none;color:rgba(255,255,255,.6);font-size:24px;cursor:pointer;padding:8px;}
.shell-drawer-cta{margin-top:16px;background:var(--shell-copper);color:#fff!important;text-align:center;padding:13px;border-radius:50px;font-weight:500;font-size:15px;}
/* FOOTER */
#site-footer{background:var(--shell-dark);position:relative;overflow:hidden;margin-top:80px;}
#site-footer .footer-main{padding:52px 48px 36px;display:grid;grid-template-columns:1.8fr 1fr 1fr 1.3fr;gap:48px;}
#site-footer .f-brand{font-family:'Noto Serif TC',serif;font-size:17px;font-weight:600;color:#fff;margin-bottom:4px;letter-spacing:.05em;display:block;text-decoration:none;}
#site-footer .f-brand-en{font-size:9px;color:rgba(255,255,255,.35);letter-spacing:.14em;margin-bottom:18px;}
#site-footer .f-desc{font-size:13px;color:rgba(255,255,255,.45);line-height:2;}
#site-footer .f-socials{display:flex;gap:10px;margin-top:20px;}
#site-footer .f-social{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.55);transition:background .2s,color .2s;text-decoration:none;}
#site-footer .f-social:hover{background:var(--shell-copper);color:#fff;border-color:var(--shell-copper);}
#site-footer .f-social svg{width:15px;height:15px;fill:currentColor;}
#site-footer .f-col-title{font-size:13px;font-weight:500;color:#fff;margin-bottom:16px;}
#site-footer .f-links{display:flex;flex-direction:column;gap:11px;}
#site-footer .f-links a{font-size:13px;color:rgba(255,255,255,.45);text-decoration:none;transition:color .2s;}
#site-footer .f-links a:hover{color:rgba(255,255,255,.8);}
#site-footer .f-contact{display:flex;flex-direction:column;gap:14px;}
#site-footer .f-ci{display:flex;align-items:flex-start;gap:10px;}
#site-footer .f-ci-icon{width:15px;height:15px;flex-shrink:0;stroke:rgba(255,255,255,.4);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;margin-top:2px;}
#site-footer .f-ci-text{font-size:13px;color:rgba(255,255,255,.45);line-height:1.8;}
#site-footer .f-ci-text a{color:rgba(255,255,255,.45);text-decoration:none;transition:color .2s;}
#site-footer .f-ci-text a:hover{color:rgba(255,255,255,.8);}
#site-footer .footer-hr{border:none;border-top:1px solid rgba(255,255,255,.08);margin:0 48px 20px;}
#site-footer .footer-copy{text-align:center;font-size:12px;color:rgba(255,255,255,.28);padding-bottom:32px;line-height:1.9;}
/* FLOATING */
.site-float-btns{position:fixed;bottom:28px;right:28px;display:flex;flex-direction:column;gap:10px;z-index:99;}
.site-float-btn{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 4px 16px rgba(0,0,0,.2);transition:transform .2s;text-decoration:none;border:none;cursor:pointer;}
.site-float-btn:hover{transform:scale(1.1);}
.site-float-btn.phone{background:var(--shell-copper);}
.site-float-btn.line{background:#06C755;}
.site-float-btn svg{width:20px;height:20px;}
@media(max-width:900px){
  #site-nav{padding:0 20px;}
  #site-nav .nav-links{display:none;}
  #site-nav .nav-burger{display:flex;}
  #site-footer .footer-main{grid-template-columns:1fr;gap:32px;padding:40px 24px 32px;}
  #site-footer .footer-hr,#site-footer .footer-copy{margin-inline:24px;}
  #site-footer .footer-copy{padding-bottom:24px;}
}
