:root{
  --ink:#1c2a33;--ink-2:#4f5f69;--paper:#f7f9f9;--line:#dde4e6;--sea:#0f5f7a;
  --font:"Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,sans-serif;
  --wrap:1200px;--pad:16px;--gap:24px;--block:64px;
}
@media (min-width:768px){:root{--pad:24px;--block:96px}}
html,body{overflow-x:clip}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:16px;line-height:28px;letter-spacing:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)}
main{padding:32px 0 var(--block)}
h1{font-size:32px;line-height:44px;font-weight:700;margin:0 0 8px;text-wrap:balance}
@media (min-width:1024px){h1{font-size:48px;line-height:64px}}
.cap{color:var(--ink-2);margin:0 0 24px;max-width:35em}
figure{margin:0;max-width:640px}
figure img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:8px;background:var(--line)}
nav.pages{margin-top:48px;border-top:1px solid var(--line);padding-top:24px}
nav.pages ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 24px}
nav.pages a{color:var(--sea);text-decoration:none}
nav.pages a:hover{text-decoration:underline}
nav.pages a[aria-current]{color:var(--ink);font-weight:700}
footer{border-top:1px solid var(--line);padding:24px 0 48px;color:var(--ink-2);font-size:14px;line-height:24px}
footer p{margin:0}
footer a{color:var(--sea)}