body { margin: 0; }
.hw-page,.hw-page * { box-sizing: border-box; }
.hw-page { max-width: 1120px; margin: auto; padding: 1.5rem 1.25rem 3rem; color: var(--home-text); }
body:has(.hw-page) { background: var(--home-bg); }
.hw-page a { color: var(--home-blue); text-underline-offset: 3px; }
.hw-page a:focus-visible { outline: 2px solid var(--home-blue); outline-offset: 4px; }
.hw-crumbs { display: flex; flex-wrap: wrap; gap: .6rem; font-size: .8rem; }
.hw-hero { max-width: 860px; padding: 1.25rem 0 2rem; }
.hw-kicker { color: var(--home-blue); font-size: .75rem; font-weight: 700; letter-spacing: .08em; }
.hw-hero h1 { font: 700 clamp(1.9rem,4vw,2.9rem)/1.15 "Outfit",sans-serif; letter-spacing: -.03em; margin: .65rem 0 1rem; }
.hw-hero > p:last-child { color: var(--home-text-body); line-height: 1.7; font-size: 1.05rem; margin: 0; }
.hw-byline { color: var(--home-muted); font-size: .8rem; margin: -1rem 0 1.5rem; }
.hw-topics { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.5rem; }
.hw-topics a { border: 1px solid var(--home-border); border-radius: 20px; padding: .5rem .85rem; background: var(--home-surface); font-size: .82rem; text-decoration: none; }
.hw-topics a:hover { border-color: var(--home-blue); }
.hw-article h3 { font: 600 1.15rem/1.4 "Outfit",sans-serif; margin: 1.5rem 0 .6rem; }
.hw-article [id] { scroll-margin-top: 7rem; }
.hw-layout { display: grid; grid-template-columns: 235px minmax(0,1fr); gap: 2.5rem; margin-top: 1.25rem; }
.hw-toc { align-self: start; display: grid; gap: .7rem; padding: 1rem; border: 1px solid var(--home-border); border-radius: 14px; background: var(--home-surface); }
.hw-toc a { color: var(--home-text-soft); text-decoration: none; font-size: .85rem; line-height: 1.5; }
.hw-toc a:hover { color: var(--home-blue); }
.hw-toc strong { font-size: .85rem; margin-bottom: .3rem; }
.hw-article section { margin-bottom: 2rem; }
.hw-article h2 { font: 600 1.45rem/1.3 "Outfit",sans-serif; margin: 0 0 .8rem; }
.hw-article p,.hw-article li { color: var(--home-text-soft); line-height: 1.8; font-size: .96rem; }
.hw-article ul,.hw-article ol { padding-left: 1.3rem; }
.hw-article li { padding-left: .2rem; margin-bottom: .5rem; }
.hw-article .hw-source { font-size: .78rem; color: var(--home-muted); }
.hw-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
.hw-page .hw-card { display: block; border: 1px solid var(--home-border); border-radius: 16px; padding: 1.2rem; background: var(--home-surface); text-decoration: none; }
.hw-card:hover { border-color: var(--home-blue); }
.hw-card span { color: var(--home-text); font: 600 1.1rem/1.4 "Outfit",sans-serif; }
.hw-card p { color: var(--home-text-body); line-height: 1.6; font-size: .9rem; }
.hw-card b { font-size: .8rem; }
.hw-related { border-top: 1px solid var(--home-border); padding-top: 1.2rem; margin-top: 2rem; }
.hw-note { padding: .8rem 1rem; border-left: 3px solid var(--home-blue); background: var(--home-surface); font-size: .82rem !important; }
.hw-end { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2rem; font-size: .9rem; }
@media(max-width:720px) { .hw-layout,.hw-grid { grid-template-columns: 1fr; } .hw-layout { gap: 1.5rem; } .hw-toc { grid-template-columns: 1fr 1fr; } .hw-toc strong { grid-column: 1/-1; } }
@media print { .hw-toc,.hw-related,.hw-end { display: none; } .hw-layout { display: block; } }
