:root{
  --ink:#12131a;
  --ink-soft:#3d4152;
  --accent:#0891b2;
  --accent-soft:#a6e4ef;
  --paper:#f7f8fb;
  --paper-alt:#eef0f6;
  --line:#dde1ea;
  --text:#181a22;
  --text-soft:#585c6b;
  --serif: Georgia, "Iowan Old Style", "Palatino Linotype", Palatino, serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--text);
  font-family:var(--sans);
  line-height:1.65;
  font-size:17px;
}
img{max-width:100%;display:block}
a{color:var(--accent)}
a:hover{color:var(--ink)}
.wrap{max-width:920px;margin:0 auto;padding:0 20px}

header.site{
  border-bottom:1px solid var(--line);
  background:var(--paper);
  position:sticky;top:0;z-index:10;
}
.header-inner{
  max-width:1100px;margin:0 auto;padding:16px 20px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
}
.brand{
  font-family:var(--sans);
  font-weight:800;font-size:1.35rem;color:var(--ink);text-decoration:none;
  letter-spacing:-0.02em;
}
.brand small{display:block;font-family:var(--sans);font-weight:400;font-size:0.6rem;color:var(--text-soft);letter-spacing:0.06em;text-transform:uppercase}
nav.main{display:flex;gap:2px;flex-wrap:wrap}
nav.main a{
  color:var(--ink-soft);text-decoration:none;font-size:0.92rem;
  padding:8px 10px;border-radius:6px;
}
nav.main a:hover{background:var(--paper-alt);color:var(--ink)}
nav.main a.current{color:var(--accent);font-weight:600}

footer.site{
  border-top:1px solid var(--line);
  margin-top:64px;padding:36px 0 48px;
  color:var(--text-soft);font-size:0.9rem;
}
footer.site .wrap{max-width:1100px}
footer.site nav{display:flex;gap:18px;flex-wrap:wrap;margin-bottom:14px}
footer.site nav a{color:var(--text-soft);text-decoration:none}
footer.site nav a:hover{color:var(--accent)}
footer.site p{max-width:640px;margin:0}

.hero{
  max-width:1100px;margin:0 auto;padding:56px 20px 40px;
  display:grid;grid-template-columns:1.05fr 1fr;gap:40px;align-items:center;
}
.hero h1{
  font-family:var(--sans);font-weight:800;font-size:2.4rem;line-height:1.16;color:var(--ink);margin:0 0 16px;
  letter-spacing:-0.02em;
}
.hero p.lede{font-size:1.1rem;color:var(--text-soft);max-width:46ch}
.hero .cta{margin-top:22px;display:flex;gap:12px;flex-wrap:wrap}
.btn{
  display:inline-block;padding:11px 20px;border-radius:8px;text-decoration:none;
  font-weight:600;font-size:0.95rem;
}
.btn.primary{background:var(--ink);color:#fff}
.btn.primary:hover{background:var(--accent)}
.btn.ghost{border:1px solid var(--line);color:var(--ink)}
.btn.ghost:hover{border-color:var(--accent);color:var(--accent)}

@media (max-width: 760px){
  .hero{grid-template-columns:1fr;padding-top:32px}
  .hero h1{font-size:1.9rem}
}

.timeline-card{
  background:var(--paper-alt);border:1px solid var(--line);border-radius:14px;padding:16px;
}
.timeline-card svg{width:100%;height:auto;display:block}
.timeline-card p.cap{font-size:0.8rem;color:var(--text-soft);margin:10px 0 0;text-align:center}

section.block{max-width:1100px;margin:0 auto;padding:36px 20px}
section.block h2.section-title{
  font-family:var(--sans);font-weight:700;font-size:1.4rem;color:var(--ink);margin:0 0 20px;
  border-bottom:2px solid var(--accent-soft);padding-bottom:10px;
}

.cat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.cat-card{
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px;
  text-decoration:none;color:inherit;transition:border-color .15s, transform .15s;
}
.cat-card:hover{border-color:var(--accent);transform:translateY(-2px)}
.cat-card h3{font-family:var(--sans);font-weight:700;color:var(--ink);margin:0 0 8px;font-size:1.1rem}
.cat-card p{margin:0;color:var(--text-soft);font-size:0.92rem}
.cat-card .count{display:inline-block;margin-top:10px;font-size:0.78rem;color:var(--accent);font-weight:600;text-transform:uppercase;letter-spacing:0.04em}

.article-list{display:grid;gap:16px}
.article-row{
  display:block;background:#fff;border:1px solid var(--line);border-radius:10px;
  padding:16px 18px;text-decoration:none;color:inherit;
}
.article-row:hover{border-color:var(--accent)}
.article-row h3{font-family:var(--sans);font-weight:700;margin:0 0 6px;font-size:1.05rem;color:var(--ink)}
.article-row p{margin:0;color:var(--text-soft);font-size:0.9rem}
.article-row .meta{font-size:0.76rem;color:var(--accent);text-transform:uppercase;letter-spacing:0.04em;margin-top:8px;display:block}

.article-head{max-width:760px;margin:0 auto;padding:44px 20px 0}
.crumb{font-size:0.82rem;color:var(--text-soft);margin-bottom:14px}
.crumb a{color:var(--text-soft)}
.crumb a:hover{color:var(--accent)}
.article-head h1{font-family:var(--sans);font-weight:800;font-size:2rem;line-height:1.2;color:var(--ink);margin:0 0 14px}
.article-head .dek{font-size:1.08rem;color:var(--text-soft);margin:0 0 12px;max-width:64ch}
.article-head .meta-line{font-size:0.82rem;color:var(--text-soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:10px 0;margin:18px 0 0}
.article-body{max-width:760px;margin:0 auto;padding:30px 20px 10px;font-size:1.06rem}
.article-body h2{font-family:var(--sans);font-weight:700;color:var(--ink);font-size:1.3rem;margin:38px 0 14px}
.article-body p{margin:0 0 18px;color:var(--text)}
.article-body ul{margin:0 0 22px;padding-left:22px}
.article-body li{margin-bottom:10px;color:var(--text)}
.key-box{
  background:var(--paper-alt);border-left:4px solid var(--accent);
  padding:16px 20px;margin:0 0 24px;border-radius:0 8px 8px 0;font-style:italic;color:var(--ink-soft);
}
.related{max-width:760px;margin:20px auto 0;padding:24px 20px 0;border-top:1px solid var(--line)}
.related h2{font-family:var(--sans);font-weight:700;font-size:1.1rem;color:var(--ink);margin:0 0 14px}
.related-grid{display:grid;gap:12px}

.content-page{max-width:700px;margin:0 auto;padding:48px 20px 20px}
.content-page h1{font-family:var(--sans);font-weight:800;color:var(--ink);font-size:2rem;margin:0 0 22px}
.content-page p{margin:0 0 18px;color:var(--text)}
.notice-box{
  background:var(--paper-alt);border:1px solid var(--line);border-radius:10px;
  padding:16px 20px;font-size:0.95rem;color:var(--text-soft);
}

.sitemap-cols{columns:2;column-gap:40px}
@media (max-width:640px){.sitemap-cols{columns:1}}
.sitemap-cols h3{font-family:var(--sans);font-weight:700;color:var(--ink);font-size:1rem;margin:18px 0 8px;break-inside:avoid}
.sitemap-cols ul{margin:0 0 8px;padding-left:18px;break-inside:avoid}
.sitemap-cols li{margin-bottom:6px;font-size:0.92rem}


/* Added contextual outbound links */
a.context-link, a.context-link:visited {
  color:#075fc4 !important;
  text-decoration:underline !important;
  text-decoration-thickness:1px !important;
  text-underline-offset:2px !important;
  overflow-wrap:anywhere;
}
a.context-link:hover, a.context-link:focus {
  color:#8a2f1b !important;
  text-decoration-thickness:2px !important;
}
