html { scroll-behavior: smooth; }
body { max-width: 1920px; margin: 0 auto; padding: 60px 20px 80px; box-sizing: border-box; background: #fff; color: #267e5c; font-family: Arial, sans-serif; -webkit-text-size-adjust: 100%; }
main { position: relative; max-width: 915px; margin: 0 auto; font-size: 24.75px; line-height: 38.5px; }
h1 { margin: 0; font-weight: normal; }
p, ul, ol, blockquote, pre { margin: 0 0 20px; }
img { display: block; max-width: 100%; height: auto; }

/* Home */
.intro { margin-bottom: 20px; }
.intro h1 { font-size: 57.5px; line-height: 1; }
.intro h1 .tagline { color: #7da595; }
address { display: flex; flex-wrap: wrap; gap: 0 20px; margin-top: 60px; font-style: normal; }
.media { display: flex; flex-wrap: wrap; gap: 20px 75px; margin-top: 20px; }
.media > * { flex: 1 1 420px; max-width: 100%; }
.media img { width: 100%; }
.media section > p:first-child { margin-top: 40px; }

/* Notes */
.back { position: absolute; top: 0; left: 0; text-decoration: none; }
.title { margin-bottom: 20px; padding-left: 50px; }
.title h1 { font-size: inherit; }
time { display: block; }
ul.notes { margin: 0; padding: 0; list-style: none; }
ul.notes li { margin-bottom: 20px; }
h2, h3 { margin: 20px 0 20px; font-size: inherit; }
ul, ol { padding-left: 30px; }
blockquote { padding-left: 20px; border-left: 2.5px solid #b0d9c8; }
code { font-family: Menlo, Consolas, monospace; font-size: .85em; line-height: 1; }
pre code { line-height: 1.5; }
pre { overflow-x: auto; padding: 20px; background: rgba(176,217,200,.25); }

/* Links */
a { color: inherit; text-decoration-color: #93bfae; text-underline-offset: 5px; transition: background-color 150ms cubic-bezier(.4,0,.2,1); }
a:focus-visible { outline: 2.5px solid currentColor; outline-offset: 5px; }
@media (hover: hover) and (pointer: fine) { a:hover { background: rgba(176,217,200,.5); text-decoration: none; } }
section > a { display: block; }
section > a:hover { background: none; }
@media (prefers-reduced-motion: reduce) { a { transition: none; } }
