
:root { --ink:#1c1c1c; --muted:#5c564e; --line:#d7d0c6; --paper:#f7f4ef; --bronze:#8a734a; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Iowan Old Style","Palatino Linotype",Palatino,"Songti SC","Noto Serif CJK TC",serif; font-size:18px; line-height:1.7; }
a { color:inherit; }
header { position:sticky; top:0; z-index:4; background:rgba(247,244,239,.94); border-bottom:1px solid var(--line); }
.nav { max-width:1080px; margin:0 auto; padding:14px 28px; display:flex; justify-content:space-between; align-items:center; gap:12px; }
.brand { letter-spacing:.16em; font-size:13px; text-decoration:none; font-family:"Gill Sans","Trebuchet MS",sans-serif; }
.links { display:flex; gap:16px; flex-wrap:wrap; font-family:"Gill Sans","Trebuchet MS",sans-serif; font-size:14px; }
.links a { text-decoration:none; }
.hero { height:420px; background:url("/hongkong.jpg") center 40%/cover no-repeat; display:flex; align-items:flex-end; }
.hero .panel { margin:0 0 28px 8vw; background:rgba(247,244,239,.88); padding:22px 28px 18px; max-width:640px; }
.hero h1 { margin:6px 0 8px; font-weight:500; font-size:44px; line-height:1.1; color:#1c1c1c; }
.hero h1:after { content:""; display:block; width:64px; height:2px; margin-top:12px; background:var(--bronze); }
.kicker { letter-spacing:.12em; font-size:12px; font-family:"Gill Sans","Trebuchet MS",sans-serif; color:var(--bronze); margin:0; }
.stage { position:relative; }
#vein { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.wrap { position:relative; max-width:1040px; margin:0 auto; padding:48px 28px 8px; }
.cards { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin:28px 0; }
.card, .focus { background:rgba(255,252,248,.9); border:1px solid var(--line); padding:18px 18px 8px; }
h2 { font-size:32px; font-weight:700; color:#1c1c1c; margin:48px 0 16px; }
h3 { margin:0 0 8px; font-size:20px; font-weight:700; color:#1c1c1c; }
.focuses { display:grid; grid-template-columns:repeat(6,1fr); gap:16px; }
.focus:nth-child(-n+3) { grid-column:span 2; }
.focus:nth-child(n+4) { grid-column:span 3; }
footer { border-top:1px solid var(--line); margin-top:36px; }
.foot { max-width:1040px; margin:0 auto; padding:22px 28px 40px; font-size:14px; color:var(--muted); }
.legal { display:flex; gap:14px; flex-wrap:wrap; margin-top:10px; }
.legal a { color:var(--ink); }
@media (max-width: 800px) {
  .hero { height:280px; }
  .hero h1 { font-size:32px; }
  .hero .panel { margin:0 16px 16px; }
  .cards, .focuses { grid-template-columns:1fr; }
  .focus, .focus:nth-child(-n+3), .focus:nth-child(n+4) { grid-column:auto; }
}

.ico { width:28px; height:28px; stroke:#8a734a; fill:none; stroke-width:1.4; margin-bottom:8px; }
.hero .tag { margin:8px 0 0; font-size:16px; }
