:root { --paper:#fff; --ink:#233e42; --muted:#657473; --accent:#bd5131; --line:#d9ddd4; --scene:#fff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font:15px/1.65 Arial,Helvetica,sans-serif; }
a { color:inherit; text-decoration:none; }
button,input,select { font:inherit; color:inherit; }
button,a,input,select { touch-action:manipulation; }
button { cursor:pointer; border:0; }
button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible { outline:2px solid var(--accent); outline-offset:5px; }
img { display:block; max-width:100%; }
h1,h2,h3,p,figure { margin:0; }
h1,h2 { font-family:Georgia,serif; font-weight:400; line-height:1.15; letter-spacing:-.035em; }
h1 { font-size:clamp(38px,4.8vw,68px); }
h3 { line-height:1.4; }
p { color:var(--muted); }
.eyebrow,.project-meta,.brand small { font:10px/1.5 Consolas,monospace; letter-spacing:1.3px; }
.site-header { padding:22px 5%; display:flex; align-items:center; gap:26px; border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:14px; font-weight:600; font-size:17px; line-height:1.4; }
.brand-cat { display:inline-flex; }
.icon { display:inline-block; width:1em; height:1em; vertical-align:-.15em; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; pointer-events:none; }
.brand-cat .icon { width:25px; height:25px; }
.close .icon { width:22px; height:22px; }
.legend span:first-child .icon { fill:currentColor; }
.brand small { display:block; color:var(--muted); font-size:9px; font-weight:400; }
.site-header nav { display:flex; gap:28px; margin-left:auto; font-size:13px; }
.site-header nav a { padding:6px 0; border-bottom:2px solid transparent; }
.site-header nav a[aria-current] { border-color:var(--accent); }
.motion { background:none; border:1px solid var(--line); border-radius:20px; padding:5px 11px; font-size:11px; }
.skip { position:absolute; top:-100px; padding:10px; background:white; z-index:20; }
.skip:focus { top:0; }
.hero { min-height:380px; position:relative; overflow:hidden; background:var(--scene); display:grid; grid-template-columns:1fr 1.1fr; align-items:center; gap:40px; padding:28px 6% 62px; isolation:isolate; }
.hero-copy,.hero-map { position:relative; z-index:2; }
.hero-copy { pointer-events:none; }
.hero-copy a { pointer-events:auto; }
.hero-copy h1 { margin:8px 0 6px; font-size:clamp(54px,6vw,80px); }
.hero-copy p { max-width:360px; font-size:16px; color:#3e5555; }
.hero-copy .hero-tagline { max-width:none; font:400 clamp(21px,2vw,27px)/1.4 Georgia,serif; margin-bottom:12px; color:var(--ink); }
.hero-copy .hero-actions { margin-top:18px; }
.hero-actions { display:flex; gap:23px; align-items:center; flex-wrap:wrap; margin-top:25px; }
.button { display:inline-flex; align-items:center; gap:25px; background:var(--ink); color:white; padding:11px 18px; font-size:13px; border-radius:3px; }
.button:hover { background:var(--accent); }
.text-link { background:none; padding:0; border-bottom:1px solid var(--accent); font-size:13px; }
.hero-map img { width:100%; max-height:260px; object-fit:contain; }
.season-controls { position:absolute; bottom:22px; left:6%; display:flex; align-items:center; gap:12px; z-index:3; font-size:11px; }
.season-controls select { background:#fff9; border:1px solid #233e4225; padding:6px 10px; border-radius:20px; font-size:11px; }
#season-canvas,.season-landscape { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:0; }
.season-landscape { z-index:-1; }
.season-landscape canvas { width:100%; height:100%; display:block; }
.hero[data-season=spring] { --scene:#bdcda6; }
.hero[data-season=summer] { --scene:#a8ccd2; }
.hero[data-season=autumn] { --scene:#d5bc98; }
.hero[data-season=winter] { --scene:#becfdb; }
.section,.page-intro { width:min(1440px,100%); margin:auto; padding:55px 5%; }
.hero + .section { padding-top:30px; }
.section-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:28px; }
.section-title { font:500 20px/1.4 Arial,sans-serif; letter-spacing:-.3px; }
.highlights { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.project-card { display:block; width:100%; text-align:left; background:none; padding:0; break-inside:avoid; }
.art-frame { overflow:hidden; }
.art-frame img { width:100%; height:auto; transition:opacity .2s; }
.project-card:hover img { opacity:.88; }
.highlights .art-frame { aspect-ratio:16/10; display:flex; align-items:center; }
.highlights .art-frame img { width:100%; height:100%; object-fit:contain; }
.project-caption { padding:13px 0 0; }
.project-card h3 { font-size:14px; font-weight:500; letter-spacing:-.1px; }
.project-card p { font-size:13px; margin-top:8px; }
.project-meta { display:block; color:var(--muted); margin-top:9px; font-size:9px; }
.project-meta:empty { display:none; }
.compact-intro { padding-top:38px; padding-bottom:16px; display:flex; justify-content:space-between; align-items:center; }
.compact-intro h1 { font:500 26px/1.3 Arial,sans-serif; letter-spacing:-.5px; }
.gallery-section { padding-top:0; }
.filters { display:flex; gap:30px; align-items:end; padding-bottom:22px; margin-bottom:28px; border-bottom:1px solid var(--line); }
.filters label { display:grid; gap:7px; font-size:11px; color:var(--muted); }
.filters input,.filters select { background:none; border:0; border-bottom:1px solid #aeb9b0; padding:8px 0; font-size:13px; border-radius:0; }
.filters input { width:260px; }
.filters span { margin-left:auto; font-size:12px; color:var(--muted); }
.project-collection { margin-bottom:44px; }
.collection-title { display:flex; gap:12px; align-items:baseline; font:500 17px/1.5 Arial,sans-serif; letter-spacing:-.2px; margin-bottom:20px; }
.collection-title span { color:var(--muted); font:11px Consolas,monospace; }
.masonry { columns:4; column-gap:24px; }
.masonry .project-card { margin-bottom:28px; }
.news .section-title { margin-bottom:22px; }
.news :is(#news-items,#news-archive)>a { display:grid; grid-template-columns:160px 1fr; align-items:center; gap:25px; padding:19px 0; border-top:1px solid var(--line); }
.news :is(#news-items,#news-archive)>a:last-child { border-bottom:1px solid var(--line); }
.news-thumbnail { display:block; width:100%; height:auto; aspect-ratio:8/5; object-fit:cover; }
.news-copy { display:grid; gap:9px; min-width:0; }
.news-label { font:10px Consolas,monospace; color:var(--muted); }
.news strong { font-size:16px; line-height:1.5; font-weight:400; }
.news-date { font:11px Consolas,monospace; color:var(--muted); }
.news-item:hover strong { color:var(--accent); }
.news-archive { margin-top:15px; }
.news-archive summary { cursor:pointer; font-size:12px; color:var(--accent); padding:8px 0; }
footer { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:25px 5%; border-top:1px solid var(--line); font-size:11px; }
.social-links,.resource-links { display:flex; gap:16px; flex-wrap:wrap; }
dialog { padding:35px; width:min(1000px,94vw); max-height:92vh; border:0; border-radius:5px; background:var(--paper); color:var(--ink); }
dialog::backdrop { background:#102d33b8; backdrop-filter:blur(5px); }
dialog h2 { font-size:32px; padding-right:35px; margin:12px 0; }
dialog p { max-width:750px; margin:20px 0; }
dialog .detail-image { width:100%; max-height:65vh; object-fit:contain; margin:25px auto; }
dialog .close { position:sticky; top:0; float:right; width:35px; height:35px; border:1px solid var(--line); border-radius:100%; font-size:23px; background:var(--paper); z-index:2; }
body:has(dialog[open]) { overflow:hidden; }
.travel-section { padding-top:12px; --travel-accent:#8b6e54; --travel-gold:#cba982; --travel-line:#e6ddd2; }
.travel-toolbar { display:flex; align-items:center; gap:25px; padding:16px 0; border-block:1px solid var(--line); margin-bottom:28px; font-size:12px; }
.travel-toolbar>div { margin-right:auto; color:var(--muted); }
.travel-toolbar select { background:none; border:1px solid var(--line); padding:5px; }
.travel-layout { display:grid; grid-template-columns:minmax(0,2.6fr) minmax(280px,1fr); gap:40px; }
.travel-map { position:relative; aspect-ratio:750/385; }
.travel-base { width:100%; height:100%; object-fit:contain; }
.travel-map:has(#country-layer svg) .travel-base { visibility:hidden; }
#country-layer,#city-pins { position:absolute; inset:0; }
#country-layer svg { width:100%; height:100%; display:block; }
#countries .map-region,#countries .map-region path { fill:#dedede!important; stroke:var(--paper)!important; stroke-width:.4; }
#countries .visited,#countries .visited path { fill:var(--visited-color,#cba982)!important; }
#countries [data-country].visited { fill:var(--visited-color,#cba982)!important; }
#city-pins { pointer-events:none; }
.city-pin { position:absolute; transform:translate(-50%,-50%); width:10px; height:10px; padding:0; border:2px solid white; border-radius:50%; background:var(--travel-accent); pointer-events:auto; }
.city-pin:hover { outline:3px solid #cba98266; }
.city-pin.active { outline:3px solid #57493e; z-index:2; }
.residence-label { display:inline-block; margin-left:8px; font-size:10px; font-weight:400; color:var(--travel-accent); }
.travel-timeline-scroll { max-height:620px; overflow-y:auto; padding:0 14px 10px 5px; scrollbar-color:var(--travel-gold) white; scrollbar-width:thin; }
.travel-year-group { margin-bottom:28px; }
.travel-year-group h2 { position:sticky; top:0; z-index:2; padding:8px 0 12px; background:white; font:400 27px/1.2 Georgia,serif; color:#745b47; }
.travel-timeline { list-style:none; padding:0 0 0 20px; margin:0 0 0 5px; border-left:1px solid var(--travel-line); }
.travel-moment { position:relative; padding:5px 0 20px; }
.travel-moment::before { content:''; position:absolute; top:13px; left:-24px; width:7px; height:7px; border-radius:50%; background:var(--travel-gold); }
.travel-date { font:11px/1.5 Consolas,monospace; color:var(--travel-accent); margin:0 0 8px; }
.travel-stop { display:block; width:100%; padding:9px 10px; margin:2px 0; background:none; text-align:left; border-radius:3px; }
.travel-stop:hover,.travel-stop.active { background:#f6f2e7; }
.stop-title { display:block; font-size:14px; line-height:1.5; color:#57493e; }
.stop-country { display:block; font-size:11px; color:var(--muted); }
.stop-note { display:block; font-size:12px; color:var(--travel-accent); margin-top:5px; }
.travel-photo { margin:10px 0; border-radius:3px; }
.legend { display:flex; gap:22px; font-size:11px; color:var(--muted); margin-top:18px; }
.legend span:first-child { color:var(--travel-accent); }
.map-credit { font-size:10px; margin-top:12px; }
.map-credit a { text-decoration:underline; text-underline-offset:2px; }
.empty-travel { font-size:13px; padding:20px 0; }
.country-chip { display:inline-block; margin:15px 8px 0 0; color:var(--travel-accent); font-size:11px; }
.about-intro { display:grid; grid-template-columns:1.5fr 1fr; gap:65px; align-items:start; }
.about-intro h1 { font:500 26px/1.3 Arial,sans-serif; letter-spacing:-.5px; margin-bottom:25px; }
.about-intro p { max-width:640px; font-size:15px; margin-bottom:16px; }
.about-intro figure img { width:100%; max-height:430px; object-fit:cover; }
.resume-section { padding-top:0; }
.resume-section h3 { font:500 21px/1.4 Arial,sans-serif; border-top:1px solid var(--line); padding-top:25px; margin:30px 0 20px; }
.resume-section h4 { font-size:16px; margin:27px 0 5px; }
.resume-section h5 { color:var(--muted); font-size:13px; font-weight:400; margin:6px 0; }
.resume-section li,.resume-section p { font-size:13px; color:var(--muted); margin:8px 0; }
.resume-section a { text-decoration:underline; text-underline-offset:3px; }
.timeline-toolbar { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:25px; }
.resume-timeline { margin:0 0 35px 8px; border-left:1px solid var(--line); }
.timeline-entry { position:relative; padding-left:30px; }
.timeline-entry::before { content:''; position:absolute; left:-5px; top:27px; width:9px; height:9px; border-radius:50%; background:white; border:2px solid var(--muted); }
.timeline-entry[open]::before { border-color:var(--accent); background:var(--accent); }
.timeline-entry summary { position:relative; list-style:none; cursor:pointer; padding:20px 30px 20px 0; border-bottom:1px solid var(--line); }
.timeline-entry summary::-webkit-details-marker { display:none; }
.timeline-indicator { position:absolute; right:5px; top:22px; color:var(--accent); }
.timeline-entry summary:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.timeline-label { display:block; font-size:16px; line-height:1.5; }
.timeline-role { display:block; color:var(--muted); font-size:13px; margin-top:4px; }
.timeline-content { padding:5px 0 20px; max-width:950px; }
.timeline-content ul { padding-left:20px; }
@media print { .timeline-toolbar { display:none; } .timeline-entry { break-inside:avoid; } .timeline-entry summary::after { display:none; } }
.no-motion * { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
.no-motion #season-canvas { display:none; }
@media(min-width:1700px) { .masonry { columns:5; } }
@media(max-width:1100px) { .masonry { columns:3; } .brand-cat { display:none; } .site-header nav { gap:20px; } }
@media(max-width:800px) { .masonry { columns:2; } .hero { gap:25px; } .highlights { gap:20px; } .about-intro { gap:30px; } }
@media(max-width:600px) {
 .site-header { flex-wrap:wrap; gap:15px; padding:16px 6%; }
 .site-header nav { order:3; width:100%; margin:0; justify-content:space-between; gap:12px; }
 .motion { margin-left:auto; }
 .hero { display:block; padding:26px 6% 65px; min-height:350px; }
 .hero h1 { font-size:54px; }
 .hero-copy p { font-size:14px; }
 .hero-map { position:absolute; width:30%; right:6%; top:35px; }
 .hero-copy .eyebrow { display:block; max-width:65%; font-size:9px; }
 .hero-copy .hero-tagline { font-size:21px; margin-top:15px; }
 .section { padding:35px 6%; }
 .compact-intro { padding:25px 6% 12px; }
 .section-heading { margin-bottom:20px; }
 .section-title { font-size:18px; }
 .section-heading .text-link { font-size:11px; }
 .highlights { grid-template-columns:1fr; gap:28px; }
 .highlights .art-frame { aspect-ratio:16/9; }
 .gallery-section { padding-top:0; }
 .filters { flex-wrap:wrap; gap:16px; }
 .filters label:first-child { width:100%; }
 .filters input { width:100%; }
 .masonry { column-gap:16px; }
 .project-card h3 { font-size:12px; }
 .project-caption { padding-top:9px; }
 .masonry .project-card { margin-bottom:23px; }
 .collection-title { font-size:16px; }
 .news :is(#news-items,#news-archive)>a { grid-template-columns:100px 1fr; gap:15px; }
 .news strong { font-size:14px; }
 .news-copy { gap:6px; }
 .travel-layout,.about-intro { grid-template-columns:1fr; }
 .travel-toolbar { flex-wrap:wrap; gap:15px; }
 .travel-toolbar>div { width:100%; }
 .about-intro figure { max-width:320px; }
 footer { flex-wrap:wrap; }
 dialog { padding:22px; } dialog h2 { font-size:25px; }
}
@media(max-width:350px) { .masonry { columns:1; } }
@media(prefers-reduced-motion:reduce) { * { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
@media print { .site-header,footer,.hero-actions,.about-intro figure { display:none; } .about-intro { display:block; padding:0; } .section { padding:10px 0; } body { background:white; color:black; } .resume-section h3 { break-after:avoid; } }
