
:root{
  --bg:#fbfaf8;
  --ink:#1b1b1b;
  --muted:#5c5c5c;
  --line:#e7e1da;
  --accent:#6b5b95;
  --card:#ffffff;
  --max: 1040px;
  --shadow: 0 10px 30px rgba(27,27,27,0.06);
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:"Libre Baskerville", Georgia, serif;
  background:var(--bg);
  color:var(--ink);
  line-height:1.72;
}
a{color:var(--accent); text-decoration:none;}
a:hover{text-decoration:underline;}
.container{max-width:var(--max); margin:0 auto; padding:0 18px;}
header.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(251,250,248,0.92);
  backdrop-filter: blur(7px);
  border-bottom:1px solid var(--line);
}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 0;}
.brand{display:flex;flex-direction:column;gap:2px;}
.brand .name{font-family:"Parisienne", cursive;font-size:42px;line-height:1;letter-spacing:0.2px;}
.brand .tag{font-size:12px;color:var(--muted);}
nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:10px;padding:0;margin:0;justify-content:flex-end;}
nav a{
  font-size:13px;color:var(--ink);
  padding:8px 11px;border-radius:999px;
  border:1px solid transparent; display:inline-block;
}
nav a:hover{border-color:var(--line);background:#fff;text-decoration:none;}
nav a.active{border-color:var(--line);background:#fff;}
@media (max-width:920px){
  .header-inner{flex-direction:column;align-items:flex-start;}
  nav ul{justify-content:flex-start;}
}
.hero{margin:24px 0 10px;}
.banner{
  border:1px solid var(--line);
  border-radius:18px;
  overflow:hidden;
  box-shadow: var(--shadow);
}
.banner.img::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(135deg, rgba(251,250,248,0.35), rgba(251,250,248,0.12) 55%, rgba(107,91,149,0.16));
}
.grid{display:grid;grid-template-columns:1.2fr 0.8fr;gap:18px;margin-top:16px;}
@media (max-width:920px){.grid{grid-template-columns:1fr;}}
.card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:18px;
  padding:18px;
  box-shadow: var(--shadow);
}
h1,h2,h3{margin:0 0 10px;}
h1{font-size:28px;margin-top:6px;}
h2{font-size:20px;margin-top:18px;}
h3{font-size:16px;margin-top:16px;}
.small{font-size:13px;color:var(--muted);}
.thesis{font-style:italic;color:var(--muted);margin-top:8px;}
.divider{border-top:1px solid var(--line);margin:16px 0;}
.cta-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px;}
.btn{
  display:inline-block;padding:10px 14px;border-radius:999px;
  border:1px solid var(--line);background:#fff;color:var(--ink);font-size:13px;
}
.btn:hover{background:#f7f3ee;text-decoration:none;}
blockquote{margin:14px 0;padding:12px 14px;border-left:3px solid var(--accent);background:#fff;border-radius:12px;}
blockquote p{margin:0;}
blockquote .cite{margin-top:6px;font-size:12px;color:var(--muted);}
.list{margin:0;padding-left:18px;}
.list li{margin:6px 0;}
.poem{padding:18px 0;border-bottom:1px solid var(--line);}
.poem:last-child{border-bottom:none;}
.poem-title{font-size:16px;margin:0 0 10px;}
.poem-text{white-space:pre-wrap;font-size:15px;}
.portrait-wrap{display:flex;justify-content:center;}
.portrait{
  width:340px; max-width:72%;
  border-radius:16px;border:1px solid var(--line);
  overflow:hidden; box-shadow:var(--shadow);
  margin:10px 0 14px; background:#fff;
}
.portrait img{display:block;width:100%;height:auto;filter:saturate(0.88) contrast(1.03) brightness(1.04);}
.section-title{display:flex;align-items:baseline;justify-content:space-between;gap:12px;}
.kicker{color:var(--muted);font-size:13px;}
footer{margin:34px 0 18px;color:var(--muted);font-size:12px;}
footer a{color:var(--muted);}

/* Banner image (more reliable than CSS background-image) */
.banner-img{
  display:block;
  width:100%;
  height:220px;
  object-fit:cover;
  object-position:center;
}
