@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:wght@400;500;600&display=swap');
:root{--ink:#252725;--muted:#656862;--cream:#f8f7f3;--line:#d9d9d2;--accent:#596a5b}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;line-height:1.65}a{color:inherit}header{max-width:1160px;margin:auto;padding:30px 34px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}header a{text-decoration:none}header .brand{font-family:'Playfair Display',Georgia,serif;font-size:20px}header nav{display:flex;gap:22px;font-size:13px;letter-spacing:.05em}main{max-width:1160px;margin:auto;padding:55px 34px 90px}h1,h2,h3{font-family:'Playfair Display',Georgia,serif;font-weight:400;line-height:1.18}h1{font-size:clamp(34px,4.1vw,53px);margin:0 0 15px}h2{font-size:clamp(29px,3.4vw,43px)}.eyebrow{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);font-weight:700}.intro{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;gap:7%;margin-bottom:100px}.intro img{width:100%;height:auto;display:block}.intro p{font-size:15px;max-width:560px;color:#4e514e}.section-title{border-top:1px solid var(--line);padding-top:27px;margin-bottom:28px}.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.tile{text-decoration:none}.tile img{width:100%;aspect-ratio:3/4;object-fit:contain;display:block;background:#e8e8e4}.tile h3{font-size:27px;margin:15px 0 5px}.tile p{font-size:14px;color:var(--muted);margin:0}.lede{font-size:17px;color:var(--muted);max-width:790px;margin-bottom:45px}.items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.item{border-top:1px solid var(--line);padding:22px 0}.item h3{font-size:24px;margin:0 0 10px}.item p{font-size:14px;color:var(--muted);margin:0 0 14px}.button{display:inline-block;text-decoration:none;border:1px solid var(--ink);padding:8px 16px;font-size:12px;letter-spacing:.05em}.button:hover{background:var(--ink);color:white}.writing-list{list-style:none;padding:0;max-width:850px}.writing-list li{border-top:1px solid var(--line);padding:17px 0}.writing-list a{text-decoration:none;font-family:'Playfair Display',Georgia,serif;font-size:25px}.writing-list a:hover{text-decoration:underline}.prose{max-width:740px;margin:45px auto 0;font-family:Georgia,serif;font-size:17px;line-height:1.85}.prose p{margin:0 0 1.1em}.prose h2,.prose h3{margin-top:1.8em}footer{border-top:1px solid var(--line);padding:25px 34px;text-align:center;font-size:12px;color:var(--muted)}.back{font-size:13px;text-decoration:none;color:var(--accent)}@media(max-width:760px){header{padding:18px;display:block}header nav{gap:14px;flex-wrap:wrap;margin-top:12px}main{padding:35px 20px 60px}.intro{grid-template-columns:1fr;gap:25px;margin-bottom:60px}.intro img{max-height:600px;object-fit:contain}.tiles,.items{grid-template-columns:1fr}.tile{margin-bottom:20px}}
/* Version 3 */
.intro{grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr)}
.intro h1{font-size:clamp(30px,3.3vw,45px);margin-bottom:8px}
.intro .eyebrow{margin-bottom:16px}
.prose{margin-left:0;margin-right:auto;line-height:1.52}
.prose p{margin-bottom:.85em;white-space:pre-wrap}
.video-preview{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:16/9;background:linear-gradient(135deg,#354339,#879486);color:white;text-decoration:none;margin-bottom:18px;border-radius:3px}
.video-preview:hover{background:linear-gradient(135deg,#202b23,#647767)}
.play-symbol{display:grid;place-items:center;border:2px solid white;border-radius:50%;width:70px;height:70px;font-size:27px;padding-left:4px}
@media(max-width:760px){.intro{grid-template-columns:1fr}}

/* Version 4: true embedded players and literary typography */
.vimeo-embed{position:relative;aspect-ratio:16/9;background:#171b1b;margin-bottom:18px;overflow:hidden;border-radius:3px}
.vimeo-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-loading{position:absolute;inset:0;display:grid;place-items:center;color:#eee;font-size:14px;text-align:center;padding:20px}
.prose{margin:8px 0 0;max-width:900px;font-size:17px;line-height:1.36}
.prose p{margin:0 0 1.2em;white-space:normal}
.prose p.byline{margin:0 0 3px;text-indent:0;padding-left:0;line-height:1.25}
.prose p.work-text{margin-left:clamp(36px,7vw,100px);white-space:pre-wrap;line-height:1.36;margin-bottom:1.3em}
main:has(.prose) h1{margin-bottom:7px}
@media(max-width:600px){.prose p.work-text{margin-left:24px}}

/* Version 5: direct Vimeo embeds and faithful stanza/line formatting */
.vimeo-embed{position:relative;background:#171b1b;overflow:hidden;border-radius:3px;margin-bottom:16px;width:100%}
.vimeo-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.prose{margin:6px 0 0;max-width:1100px;font-family:Georgia,serif;font-size:17px;line-height:1.19}
.prose p.byline{margin:0 0 2px;line-height:1.18;text-indent:0;padding:0}
.prose p.work-stanza{margin:0 0 2.4em 0;margin-left:clamp(72px,14vw,200px);line-height:1.19;white-space:normal}
.prose p.byline + p.work-stanza{margin-top:3.6em}
main:has(.prose) h1{margin-bottom:5px}
.intro{grid-template-columns:minmax(0,1.14fr) minmax(0,.86fr);align-items:stretch}
.intro>div{display:flex;flex-direction:column;align-items:flex-start}
.intro>div>p{margin-top:auto;margin-bottom:0}
.intro>img{width:100%;height:auto;object-fit:contain;align-self:start}
@media(max-width:760px){.intro{grid-template-columns:1fr}.intro>div>p{margin-top:25px}.prose p.work-stanza{margin-left:clamp(32px,10vw,72px)}}

/* Version 5B: portrait on left; introduction naturally aligned, not bottom-justified. */
.intro{grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);align-items:center}
.intro>div{display:block;align-self:center}
.intro>div>p{margin-top:14px;margin-bottom:0}
.intro>img{align-self:center}
/* Avoid an extra black mat around the player. Native letterboxing within Vimeo is controlled by the source video. */
.vimeo-embed{background:transparent}
@media(max-width:760px){.intro{grid-template-columns:1fr}.intro>div>p{margin-top:14px}}

/* Version 5C: every embedded player occupies the same 16:9 frame,
   ensuring horizontal alignment of videos in each two-column row. */
.items{align-items:start}
.items .item{min-width:0}
.items .item .vimeo-embed{aspect-ratio:16 / 9 !important;height:auto;margin-top:0}
.items .item .vimeo-embed iframe{width:100%;height:100%;inset:0}