/* 由 build.mjs 產生，請勿直接修改此檔 —— 改 src/ 底下的來源再跑 `node build.mjs` */
html{ scroll-padding-top:calc(var(--jsd-head-h, 96px) + 12px); }
.skip-link{ position:absolute; left:-9999px; top:0; z-index:200; padding:12px 20px; background:#0066cc; color:#fff; border-radius:0 0 10px 0; font-weight:700; text-decoration:none; }
.skip-link:focus{ left:0; }
@media (forced-colors:active){
:where(a,button,input,select,textarea,[tabindex]):focus-visible{
outline:3px solid Highlight !important;
outline-offset:3px !important;
box-shadow:none !important;
}
[role="radio"][aria-checked="true"],
[role="checkbox"][aria-checked="true"]{
outline:3px double Highlight !important;
outline-offset:-5px !important;
}
}
@view-transition{ navigation:auto; }
::view-transition-old(root),::view-transition-new(root){ animation-duration:.22s; }
.site-head{ view-transition-name:jsd-head; }
@media (prefers-reduced-motion:reduce){
@view-transition{ navigation:none; }
}
.site-head{
--g-rgb:255,255,255;
--s:#ffffff; --sep:rgba(60,60,67,.16);
--tx:#1d1d1f; --tx-rgb:29,29,31; --tx2:#55555b;
--ac:#0071e3; --ac-rgb:0,113,227; --ac-l:#0066cc; --on-ac:#ffffff;
--ac-fill:#0071e3; --ac-fill-h:#0066cc;
position:sticky; top:0; z-index:90; display:block;
background:rgba(var(--g-rgb),.88);
backdrop-filter:saturate(180%) blur(20px); -webkit-backdrop-filter:saturate(180%) blur(20px);
border-bottom:1px solid rgba(var(--tx-rgb),.08);
color:var(--tx);
font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI","PingFang TC",
"Noto Sans TC","Noto Sans CJK TC","Microsoft JhengHei",system-ui,sans-serif;
font-size:17px; line-height:1.7;
transition:box-shadow .32s cubic-bezier(.4,0,.2,1);
}
.site-head.is-scrolled{ box-shadow:0 6px 24px -10px rgba(16,24,40,.14); }
.site-head *,.site-head *::before,.site-head *::after{ box-sizing:border-box; }
.site-head a:focus-visible,.site-head button:focus-visible{ outline:2px solid var(--ac); outline-offset:2px; border-radius:6px; }
.site-head a,.site-head button{
transition:color .18s cubic-bezier(.4,0,.2,1), background-color .18s cubic-bezier(.4,0,.2,1),
border-color .18s cubic-bezier(.4,0,.2,1), box-shadow .18s cubic-bezier(.4,0,.2,1);
}
.site-head .btn-quote:active,.site-head .btn-member:active,.site-head .hamburger:active{ transform:scale(.96); transition-duration:.08s; }
@media (prefers-reduced-motion:reduce){
.site-head a,.site-head button{ transition:none; }
.site-head .btn-quote:active,.site-head .btn-member:active,.site-head .hamburger:active{ transform:none; }
.site-head{ transition:none; }
.site-head nav.main-nav a::after{ transition:none; }
}
.site-head .marquee-bar{ background:var(--s); color:var(--tx); border-bottom:1px solid var(--sep); }
.site-head .marquee-inner{ max-width:1240px; margin:0 auto; padding:0 28px; display:flex; align-items:center; gap:12px; }
.site-head .marquee-badge{ flex:0 0 auto; padding:3px 11px; border-radius:999px; background:var(--ac-fill); color:var(--on-ac); font-size:12.5px; font-weight:600; line-height:1.7; }
.site-head .marquee-static{ flex:1 1 auto; min-width:0; margin:0; padding:7px 0; color:var(--tx); font-size:14px; font-weight:600; letter-spacing:.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.site-head .marquee-viewport{ flex:1 1 auto; min-width:0; overflow:hidden; white-space:nowrap; padding:7px 0; }
.site-head .marquee-track{ display:inline-flex; animation:jsdMarquee 38s linear infinite; font-size:14px; letter-spacing:.02em; color:var(--tx); }
.site-head .marquee-track > span{ display:inline-flex; gap:44px; padding-right:44px; }
.site-head .marquee-viewport:hover .marquee-track,
.site-head .marquee-viewport:focus-within .marquee-track{ animation-play-state:paused; }
.site-head .marquee-track.paused{ animation-play-state:paused !important; }
.site-head .marquee-pause{
flex:0 0 auto; width:30px; height:30px; display:inline-flex; align-items:center; justify-content:center;
border:0; border-radius:999px; background:rgba(120,120,128,.12); color:var(--tx); cursor:pointer; font-family:inherit;
position:relative;
}
.site-head .marquee-pause::after{ content:""; position:absolute; inset:-9px; border-radius:inherit; }
.site-head .marquee-pause:hover{ background:rgba(120,120,128,.2); }
@keyframes jsdMarquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
.site-head .head-bar{ max-width:1240px; margin:0 auto; padding:8px 28px; display:flex; align-items:center; gap:20px; }
.site-head .brand{ display:flex; align-items:center; gap:10px; min-height:44px; text-decoration:none; color:var(--tx); flex:0 0 auto; }
.site-head .brand-logo{ display:block; width:164px; height:auto; aspect-ratio:720/124; object-fit:contain; border-radius:5px; }
.site-head .brand span{ font-weight:600; font-size:17px; letter-spacing:-.01em; color:var(--tx); white-space:nowrap; line-height:1; }
.site-head nav.main-nav{ flex:1 1 auto; min-width:0; display:flex; align-items:center; gap:2px; }
.site-head nav.main-nav a{
flex:0 0 auto; display:inline-flex; align-items:center; min-height:44px;
padding:0 12px; position:relative;
font-size:14px; font-weight:650; letter-spacing:-.01em; text-decoration:none; white-space:nowrap; color:var(--tx2);
}
.site-head nav.main-nav a:hover{ color:var(--tx); }
.site-head nav.main-nav a::after{
content:""; position:absolute; left:12px; right:12px; bottom:2px; height:3px;
border-radius:0; background:var(--ac);
transform:scaleX(0); transform-origin:left center;
transition:transform .26s cubic-bezier(.25,1,.5,1);
}
.site-head nav.main-nav a:hover::after{ transform:scaleX(1); }
.site-head nav.main-nav a[aria-current="page"]{ color:var(--tx); }
.site-head nav.main-nav a[aria-current="page"]::after{ transform:scaleX(1); }
.site-head .head-actions{ display:flex; align-items:center; gap:8px; flex:0 0 auto; margin-left:auto; }
.site-head .btn-member{
display:inline-flex; align-items:center; gap:8px; padding:6px 14px; border-radius:10px; border:0;
background:rgba(var(--ac-rgb),.11); color:var(--ac-l); font-size:15px; font-weight:600; cursor:pointer;
white-space:nowrap; min-height:44px; text-decoration:none; font-family:inherit;
}
.site-head .btn-member:hover{ background:rgba(var(--ac-rgb),.18); color:var(--ac-l); }
.site-head .btn-member:active{ transform:scale(.97); transition-duration:.08s; }
.site-head .btn-member.is-in{ background:rgba(120,120,128,.12); color:var(--tx); }
.site-head .btn-member.is-in:hover{ background:rgba(120,120,128,.2); color:var(--tx); }
.site-head .btn-member.is-in{ padding:6px 14px 6px 6px; }
.site-head .btn-member .avatar{
width:28px; height:28px; border-radius:999px; background:var(--ac-fill); color:var(--on-ac);
display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; flex:0 0 auto;
}
.site-head .btn-member .btn-member-text{ max-width:9em; overflow:hidden; text-overflow:ellipsis; }
.site-head .btn-member.is-in .btn-member-text{ display:flex; flex-direction:column; align-items:flex-start; line-height:1.15; max-width:11em; }
.site-head .btn-member.is-in .bm-t{ font-size:14px; font-weight:600; }
.site-head .btn-member.is-in .bm-s{ font-size:11px; font-weight:600; opacity:.72; letter-spacing:.02em; font-variant-numeric:tabular-nums; }
.site-head .btn-member.is-cta{
display:inline-flex; padding:0 18px; border-radius:10px; background:transparent;
color:var(--ac-l); box-shadow:inset 0 0 0 1.5px var(--ac);
}
.site-head .btn-member.is-cta:hover{ background:rgba(var(--ac-rgb),.08); color:var(--ac-l); }
.site-head{ --dg:#cd0014; --dg-rgb:205,0,20; }
.site-head .btn-signout{
display:inline-flex; align-items:center; min-height:44px; padding:0 12px;
border:0; background:rgba(var(--dg-rgb),.10); color:var(--dg); font-size:14px; font-weight:600;
font-family:inherit; cursor:pointer; white-space:nowrap; border-radius:10px;
}
.site-head .btn-signout:hover{ color:var(--dg); background:rgba(var(--dg-rgb),.18); }
.site-head .btn-signout:active{ transform:scale(.97); transition-duration:.08s; }
.site-head .btn-signout[hidden]{ display:none; }
.site-head .btn-member[hidden]{ display:none !important; }
.site-head .btn-quote{
display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:0 18px; border-radius:10px;
background:var(--ac-fill); color:var(--on-ac); font-size:15px; font-weight:600; text-decoration:none; white-space:nowrap;
}
.site-head .btn-quote:hover{ background:var(--ac-fill-h); color:var(--on-ac); }
.site-head .btn-quote[aria-current="page"]{ background:transparent; color:var(--ac-l); box-shadow:inset 0 0 0 1.5px var(--ac); }
.site-head .btn-quote[aria-current="page"]:hover{ background:rgba(var(--ac-rgb),.08); color:var(--ac-l); }
.site-head .btn-quote[hidden]{ display:none; }
.site-head .hamburger{
display:none; flex:0 0 auto; width:44px; height:44px; align-items:center; justify-content:center;
border:0; border-radius:10px; background:rgba(120,120,128,.12); color:var(--tx); cursor:pointer;
}
.site-head .hamburger svg path{
transform-origin:center;
transition:transform .26s cubic-bezier(.2,.9,.3,1.02), opacity .14s linear;
}
.site-head .hamburger[aria-expanded="true"]{ background:rgba(120,120,128,.2); }
.site-head .hamburger[aria-expanded="true"] svg path:nth-of-type(1){ transform:rotate(45deg) translateY(6px); }
.site-head .hamburger[aria-expanded="true"] svg path:nth-of-type(2){ opacity:0; transform:scaleX(.2); }
.site-head .hamburger[aria-expanded="true"] svg path:nth-of-type(3){ transform:rotate(-45deg) translateY(-6px); }
@media (prefers-reduced-motion:reduce){ .site-head .hamburger svg path{ transition:none; } }
.jsd-mm-scrim{
position:fixed; inset:0; z-index:80;
opacity:0; visibility:hidden; pointer-events:none;
background:rgba(20,22,28,.30);
backdrop-filter:blur(16px) saturate(130%); -webkit-backdrop-filter:blur(16px) saturate(130%);
transition:opacity .26s cubic-bezier(.4,0,.2,1), visibility 0s linear .26s;
}
.jsd-mm-scrim.open{ opacity:1; visibility:visible; pointer-events:auto; transition:opacity .26s cubic-bezier(.4,0,.2,1), visibility 0s; }
@media print{ .jsd-mm-scrim{ display:none !important; } }
.site-head .mobile-menu{
position:absolute; top:calc(100% - 2px); right:12px; z-index:3;
width:min(304px, calc(100vw - 24px));
max-height:calc(100vh - var(--jsd-head-h, 96px) - 24px);
overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain;
border-radius:18px; border:1px solid rgba(var(--tx-rgb),.08);
background:rgba(var(--g-rgb),.86);
backdrop-filter:saturate(180%) blur(24px); -webkit-backdrop-filter:saturate(180%) blur(24px);
box-shadow:0 12px 34px rgba(16,24,40,.20), 0 3px 10px rgba(16,24,40,.10);
opacity:0; visibility:hidden; transform:translateY(-10px) scale(.94); transform-origin:top right;
transition:opacity .16s cubic-bezier(.4,0,.2,1), transform .2s cubic-bezier(.4,0,.2,1), visibility 0s linear .2s;
}
.site-head .mobile-menu.open{
opacity:1; visibility:visible; transform:none;
transition:opacity .18s cubic-bezier(.4,0,.2,1), transform .28s cubic-bezier(.2,.9,.3,1.02), visibility 0s;
}
.site-head .mm-inner{ min-height:0; }
.site-head .mm-inner > nav{ padding:6px 8px; }
@media (prefers-reduced-motion:reduce){
.site-head .mobile-menu,.site-head .mobile-menu.open,.jsd-mm-scrim,.jsd-mm-scrim.open{ transition:opacity .01s, visibility 0s; transform:none; }
}
.site-head .mobile-menu a{
display:flex; align-items:center; width:100%; min-height:48px; padding:10px 12px;
border-radius:11px; font-size:16px; font-weight:600; text-decoration:none; color:var(--tx);
}
.site-head .mobile-menu a + a{ margin-top:2px; }
.site-head .mobile-menu a:has(.mm-t){ flex-direction:column; align-items:flex-start; justify-content:center; gap:2px; }
.site-head .mobile-menu .mm-s{ font-size:12px; font-weight:500; color:var(--tx2); font-variant-numeric:tabular-nums; }
.site-head .mobile-menu a:hover{ background:rgba(var(--tx-rgb),.05); }
.site-head .mobile-menu a:active{ background:rgba(var(--tx-rgb),.09); }
.site-head .mobile-menu a[aria-current="page"]{ color:var(--ac-l); background:rgba(var(--ac-rgb),.10); }
.site-head .mobile-menu a[aria-current="page"]:hover{ background:rgba(var(--ac-rgb),.15); }
.site-head .mobile-menu .mm-signout{
display:flex; align-items:center; width:100%; min-height:48px; padding:10px 12px; margin-top:2px;
border:0; border-radius:11px; background:rgba(var(--dg-rgb),.10); text-align:left;
font-family:inherit; font-size:16px; font-weight:600; color:var(--dg); cursor:pointer;
}
.site-head .mobile-menu .mm-signout:hover{ background:rgba(var(--dg-rgb),.18); color:var(--dg); }
.site-head .mobile-menu .mm-signout[hidden]{ display:none; }
.site-head .mobile-menu .mm-sep{ height:1px; margin:8px 4px; background:var(--sep); }
@media (max-width:1080px){
.site-head nav.main-nav{ display:none; }
.site-head .btn-member{ display:inline-flex; }
.site-head .btn-quote{ display:none; }
.site-head .btn-signout{ display:none; }
.site-head .hamburger{ display:inline-flex; }
.site-head .head-bar{ gap:12px; padding:10px 16px; }
.site-head .mm-inner > nav{ padding:8px 16px 12px; }
.site-head .marquee-inner{ padding:0 16px; }
}
@media (max-width:600px){
.site-head .marquee-inner{ padding:0 12px; gap:8px; }
.site-head .marquee-viewport{ padding:5px 0; }
.site-head .marquee-track{ font-size:13px; }
.site-head .marquee-badge{ padding:2px 9px; font-size:11.5px; }
.site-head .marquee-static{ padding:5px 0; font-size:13px; }
.site-head .marquee-pause{ width:26px; height:26px; }
.site-head .head-bar{ min-width:0; padding:5px 12px; }
.site-head .brand-logo{ width:136px; }
.site-head .brand span{ font-size:16px; }
.site-head .head-actions{ min-width:0; gap:4px; }
.site-head .btn-member{ min-width:0; gap:6px; padding:6px 9px; }
.site-head .btn-member.is-in{ padding:6px 9px 6px 6px; }
.site-head .btn-member.is-in .btn-member-text{ max-width:6.5em; }
.site-head .btn-member.is-in .bm-t{ font-size:13px; }
.site-head .btn-member.is-in .bm-s{
display:block; max-width:6.5em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.site-head .mm-inner > nav{ padding:8px 12px 12px; }
}
@media (max-width:340px){
.site-head .head-bar{ gap:6px; padding:5px 8px; }
.site-head .brand{ min-width:0; }
.site-head .brand-logo{ width:120px; }
.site-head .hamburger{ width:44px; height:44px; }
}
@media (max-width:319px){
.site-head .head-bar{ gap:4px; padding:5px 6px; }
.site-head .brand-logo{ width:104px; }
.site-head .btn-member:not(.is-in) .btn-member-text{ display:none; }
.site-head .btn-member:not(.is-in){ padding:6px 8px; }
.site-head .btn-member.is-in .bm-t{ max-width:3.6em; }
.site-head .btn-quote{ padding:6px 9px; }
.site-head .btn-quote .long{ display:none; }
.site-head .head-actions{ gap:3px; }
}
@media (prefers-reduced-motion:reduce){
.site-head .marquee-track{ animation-duration:38s !important; animation-iteration-count:infinite !important; }
}
@media print{ .site-head{ display:none !important; } }