:root {color-scheme:dark;--bg:#050609;--ink:#eeeeef;--muted:#a9adb4;--line:#26292e;--accent:#B77A51;--accent-dim:#59402D;}
/* Album previews: local photographs, full albums on Google Photos. */
.album-list {display:grid;gap:48px;margin-top:36px;}
.album-card {padding-bottom:40px;border-bottom:1px solid var(--line);min-width:0;}
.content-section .album-collage {display:grid;grid-template-columns:1.25fr 1fr 1fr;grid-template-rows:280px;gap:5px;overflow:hidden;text-decoration:none;}
.album-collage img {display:block;width:100%;height:100%;object-fit:cover;object-position:center 28%;min-height:0;}
.album-collage img:first-child {object-position:center;}
.album-copy {padding-top:21px;}
.content-section .album-year {font-size:.74rem;letter-spacing:.14em;color:var(--accent);margin:0 0 7px;}
.album-copy h3 {font-size:1.25rem;font-weight:550;line-height:1.3;margin:0 0 12px;}
.content-section .album-copy h3 a {color:var(--ink);text-decoration:none;}
.content-section .album-copy > p:not(.album-year) {font-size:.96rem;margin-bottom:16px;}
.content-section .album-link {font-size:.85rem;}
.album-collage:hover {filter:brightness(1.08);}
@media(max-width:460px) {.content-section .album-collage {grid-template-rows:210px;}.album-list {gap:36px;}}
* {box-sizing:border-box;}
html,body {margin:0;width:100%;height:100%;}
body {font:16px/1.65 system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--bg);color:var(--ink);}
a {color:inherit;text-decoration:none;}
a:focus-visible {outline:2px solid var(--accent);outline-offset:5px;}
/* The photo is a separate, stationary column. Only .reading-panel scrolls. */
.site {display:grid;grid-template-columns:clamp(340px, 34vw, 480px) minmax(0,1fr);height:100vh;height:100dvh;overflow:hidden;}
.portrait {position:relative;min-height:0;background:#050609 var(--portrait-image, none) no-repeat left center;background-size:auto 100%;}
.portrait::after {content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 75%,rgba(5,6,9,.12) 88%,#050609 100%);pointer-events:none;}
.reading-panel {min-height:0;overflow-y:auto;overscroll-behavior:contain;scroll-behavior:smooth;scroll-padding-top:122px;border-left:1px solid rgba(255,255,255,.04);}
.site-header {z-index:2;position:sticky;top:0;background:linear-gradient(#050609 65%,rgba(5,6,9,.96));padding:20px clamp(24px,5vw,85px) 20px clamp(18px,2vw,32px);border-bottom:1px solid var(--line);}
.nav {display:flex;flex-wrap:wrap;gap:12px 26px;margin-top:0;color:#aeb2b9;font-size:.87rem;}
.nav a.active {color:var(--accent);}
.nav a:hover,.text-links a:hover {color:var(--accent);}
.content {padding:0 clamp(24px,5vw,85px) 60px clamp(18px,2vw,32px);max-width:780px;}
.intro-block {display:flex;flex-direction:column;justify-content:center;min-height:calc(100dvh - 120px);padding:76px 0;}
.intro-block > p {margin:0;}
.intro-block > p + p {margin-top:6px;}
.intro-block > .text-links {margin-top:36px;}
.kicker {text-transform:uppercase;letter-spacing:.19em;color:var(--accent);font-size:.73rem;font-weight:600;margin:0 0 22px;}
h1 {font-size:clamp(3.1rem,5vw,5.5rem);letter-spacing:-.06em;font-weight:620;line-height:1.04;margin:0 0 25px;}
.lead {font-size:clamp(1.04rem,1.4vw,1.23rem);color:#bbc0c9;line-height:1.7;max-width:450px;margin:0 0 31px;}
.text-links {display:flex;flex-wrap:wrap;gap:14px 24px;color:#d9dadd;font-size:.92rem;}
.text-links a {border-bottom:1px solid var(--accent-dim);padding-bottom:4px;}
.content-section {padding:72px 0 100px;min-height:54vh;}
.content-section h2 {font-size:1.45rem;letter-spacing:-.025em;font-weight:600;margin:0 0 18px;}
.content-section p {max-width:480px;font-size:1.04rem;color:#b8bdc6;margin:0 0 20px;}
.content-section h2:not(:first-child){margin-top:38px;}
.content-section a{color:var(--accent);text-decoration:underline;text-decoration-color:var(--accent-dim);text-underline-offset:3px;}
.content-section strong{color:var(--ink);font-weight:600;}
.small {font-size:.86rem!important;color:#7f858e!important;}
.page-footer {border-top:1px solid var(--line);color:#737a85;padding:23px 0;font-size:.78rem;}
@media(max-width:820px) {
 html,body {height:auto;}
 .site {display:block;height:auto;overflow:visible;}
 .portrait {height:56svh;background-size:auto 100%;background-position:left top;}
 .portrait::after {background:linear-gradient(180deg,transparent 55%,#050609 100%);}
 .reading-panel {overflow:visible;border:0;}
 .site-header {position:sticky;top:0;padding:15px 25px;}
 .nav {gap:12px 21px;}
 .content {padding:0 25px 38px;max-width:720px;}
 .intro-block {min-height:0;padding:80px 0 100px;}
 h1 {font-size:clamp(3rem,10vw,4.5rem);}
 .content-section {min-height:0;padding:55px 0 70px;}
}
@media(max-width:460px){.portrait{height:52svh;background-size:cover;background-position:left top}.nav{font-size:.81rem;gap:8px 16px}.intro-block{padding:61px 0 75px}.lead{font-size:1.03rem}}
