:root { color-scheme: light; --green: #07522e; --ink: #17223b; --cream: #fff5df; --line: #d8c49b; --accent: #b71919; }
* { box-sizing: border-box; }
html { background: var(--cream); }
body { margin: 0; color: var(--ink); background: linear-gradient(135deg, #fffdf7, var(--cream)); font: 1rem/1.6 system-ui, -apple-system, "Segoe UI", sans-serif; }
.shell { width: min(100% - 2rem, 72rem); margin-inline: auto; }
.site-header { background: var(--green); box-shadow: 0 2px 10px #0003; }
.site-header .shell { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; align-items: center; padding: .85rem 0; }
.brand { color: #fff; font-size: clamp(1.15rem, 2vw, 1.5rem); font-weight: 750; text-decoration: none; }
nav { display: flex; flex-wrap: wrap; gap: .25rem; }
nav a { color: #fff; padding: .35rem .5rem; border-radius: .35rem; text-decoration: none; }
nav a:hover, nav a:focus-visible, nav a[aria-current="page"] { color: #fff; background: #ffffff2e; }
.content { min-height: calc(100vh - 10rem); padding-block: 2rem 3rem; }
.content > table, .content > div, .content > section { max-width: 100%; }
h1, h2, h3 { color: var(--green); line-height: 1.15; }
h1 { font-size: clamp(1.8rem, 5vw, 2.6rem); } h2 { font-size: clamp(1.35rem, 3vw, 1.9rem); margin-top: 2.5rem; }
a { color: #8b1717; } a:hover { color: #571010; }
img { max-width: 100%; height: auto; }
.content table { max-width: 100%; } .content td { max-width: min(100vw - 2rem, 100%); }
.content [style*="width: 450px"], .content [style*="width: 500px"], .content [style*="width: 550px"] { width: 100% !important; max-width: 64rem; }
.document-list { columns: 2 15rem; padding-left: 1.25rem; } .document-list li { break-inside: avoid; }
.site-footer { border-top: 1px solid var(--line); padding: 1rem 0; color: #4d4b43; font-size: .9rem; }
.intro { max-width: 48rem; }
.albums { display: grid; gap: 2.5rem; } .album h2 { margin: 0 0 1rem; }
.gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); gap: .75rem; }
.gallery-card { aspect-ratio: 1; padding: 0; overflow: hidden; border: 0; border-radius: .55rem; background: #ddd; cursor: zoom-in; box-shadow: 0 1px 4px #0003; }
.gallery-card:focus-visible { outline: 3px solid #e69c00; outline-offset: 3px; }.gallery-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .2s ease; }.gallery-card:hover img { transform: scale(1.05); }
.lightbox { width: min(100vw, 100rem); height: 100dvh; max-width: none; max-height: none; padding: 1rem; color: #fff; background: #000e; border: 0; overflow: hidden; }.lightbox::backdrop { background: #000b; }.lightbox[open] { display: grid; place-items: center; }.lightbox figure { margin: 0; display: grid; place-items: center; max-width: 100%; max-height: 100%; }.lightbox figure img { max-width: 95vw; max-height: 84dvh; object-fit: contain; touch-action: pinch-zoom; }.lightbox figcaption { margin-top: .5rem; text-align: center; }.lightbox button { position: fixed; z-index: 1; color: #fff; background: #111b; border: 1px solid #fffc; border-radius: .4rem; font-size: 2rem; cursor: pointer; }.lightbox-close { top: 1rem; right: 1rem; width: 2.5rem; }.lightbox-prev, .lightbox-next { top: 50%; transform: translateY(-50%); width: 2.5rem; }.lightbox-prev { left: 1rem; }.lightbox-next { right: 1rem; }
@media (max-width: 40rem) { .shell { width: min(100% - 1.25rem, 72rem); }.site-header .shell { padding-block: .65rem; }.content { padding-top: 1.25rem; }.gallery-grid { grid-template-columns: repeat(2, 1fr); gap: .5rem; }.lightbox-prev { left: .35rem; }.lightbox-next { right: .35rem; } }