:root { color-scheme: light; --ink:#152843; --body:#32435b; --muted:#53677f; --line:#d6dfeb; --accent:#205fa1; --surface:#eef4fa; }
* { box-sizing:border-box; }
html { scroll-padding-top:2rem; }
body { margin:0; background:#fff; color:var(--body); font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:1rem; line-height:1.85; }
a { color:var(--accent); text-underline-offset:.2em; overflow-wrap:anywhere; }
a:hover { text-decoration-thickness:2px; }
a:focus-visible { outline:3px solid #d96819; outline-offset:5px; border-radius:2px; }
.skip { position:absolute; top:-8rem; left:1rem; padding:.6rem 1rem; background:#fff; z-index:5; }
.skip:focus { top:1rem; }
.masthead { max-width:76rem; margin:auto; padding:1.5rem 2.5rem; display:flex; align-items:center; justify-content:space-between; gap:1.5rem; border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:.7rem; color:var(--ink); font-weight:750; font-size:1.15rem; text-decoration:none; }
.monogram { background:var(--ink); color:white; width:2rem; height:2rem; display:grid; place-items:center; line-height:1; border-radius:.45rem; font-size:1.25rem; }
nav { display:flex; flex-wrap:wrap; gap:1.25rem; font-size:.9375rem; }
.intro { max-width:52rem; margin:auto; padding:3.5rem 2.5rem 2.5rem; }
.eyebrow { margin:0 0 .75rem; font-size:.875rem; font-weight:650; letter-spacing:.025em; color:var(--muted); }
h1 { color:var(--ink); margin:0; font-size:clamp(2.25rem,6vw,3.5rem); font-weight:750; line-height:1.2; letter-spacing:-.035em; }
h1 span { display:block; margin-top:.7rem; font-size:clamp(1.3rem,4vw,1.7rem); font-weight:550; letter-spacing:-.02em; }
.date { margin:1.65rem 0 .75rem; color:var(--muted); font-size:.9375rem; }
.date time { padding-left:.75rem; font-weight:550; }
.contact { display:flex; flex-wrap:wrap; align-items:baseline; gap:.2rem 1.75rem; font-size:.9375rem; }
.contact strong { margin-left:.35rem; color:var(--ink); }
main { max-width:52rem; margin:auto; padding:0 2.5rem; }
article { border-top:2px solid var(--ink); padding:1.75rem 0 3.5rem; scroll-margin-top:1.5rem; }
.language-heading { display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:.75rem; margin-bottom:1.25rem; }
h2 { color:var(--ink); margin:0; font-size:1.25rem; font-weight:700; }
.language-heading a { font-size:.9375rem; }
p { margin:.9rem 0; }
.summary { margin:1.75rem 0 2rem; padding:1.4rem 1.5rem; border-left:3px solid var(--accent); background:var(--surface); }
.summary strong { color:var(--ink); }
.summary p { margin:.4rem 0 0; }
section { margin:2.25rem 0 0; }
h3 { color:var(--accent); font-size:.875rem; font-weight:650; display:flex; align-items:baseline; gap:.8rem; line-height:1.5; margin:0 0 .65rem; }
h3 span { color:var(--ink); font-size:1.2rem; font-weight:700; }
ul { margin:1rem 0; padding-left:1.3rem; }
li { padding-left:.2rem; margin:.8rem 0; }
strong { color:var(--ink); font-weight:650; }
[lang="ko"] p, [lang="ko"] li { word-break:keep-all; overflow-wrap:anywhere; }
footer { max-width:76rem; margin:auto; border-top:1px solid var(--line); padding:1.5rem 2.5rem 2.5rem; display:flex; justify-content:space-between; flex-wrap:wrap; gap:.75rem; color:var(--muted); font-size:.9375rem; }
@media (max-width:600px) { .masthead { padding:1.1rem 1.25rem; align-items:flex-start; } .intro { padding:2.5rem 1.25rem 2rem; } main { padding:0 1.25rem; } footer { padding:1.25rem; } nav { gap:.75rem; } .summary { padding:1rem 1.15rem; } .date time { display:block; padding:0; } }
@media print { .masthead, .skip, .language-heading a, footer a { display:none; } .intro, main, footer { max-width:none; padding:0; } body { font-size:11pt; } article { padding:1rem 0; } section { break-inside:avoid; } .summary { background:none; } #ko { break-before:page; } }
