/* blog.html (article list) and post-*.html (single articles).
   Rome posts also load theme-sogno.css for the green accent. */

/* ---------- list page ---------- */
.eyebrow,.label{font-family:"DM Mono",monospace;font-size:10px;letter-spacing:.28em;color:#62584e;text-transform:uppercase}
.blog-hero{padding:80px 0 10px;text-align:center}
.blog-hero h1{font-family:"Cormorant Garamond",serif;font-size:clamp(56px,9vw,110px);font-weight:500;line-height:.85;letter-spacing:-.05em;color:var(--accent);margin:18px 0 22px}
.blog-hero h1 em{font-style:italic}
.blog-hero p{font-family:"Cormorant Garamond",serif;font-size:21px;line-height:1.35;max-width:600px;margin:0 auto}
.filters{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:34px 0 46px}
.filter-chip{font-family:"DM Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;padding:11px 20px;border:1px solid var(--line);background:transparent;color:var(--ink);cursor:pointer;border-radius:2px}
.filter-chip:hover{border-color:var(--accent)}
.filter-chip[aria-pressed="true"]{background:var(--accent);color:var(--cream);border-color:var(--accent)}
.filter-chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-bottom:100px}
.post-card{min-height:300px;border:1px solid var(--line);padding:28px;position:relative;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.post-card[hidden]{display:none}
.post-card:after{content:"";position:absolute;inset:auto -20px -70px -20px;height:140px;background:var(--accent-soft);transform:rotate(-4deg)}
.post-card>*{position:relative;z-index:1}
.post-card[data-city="rome"]{--accent:var(--green);--accent-soft:rgba(23,53,30,.10)}
.post-card.featured{grid-column:1/-1;min-height:300px}
/* cards with a featured image */
.post-card.has-thumb{padding:0;min-height:0;justify-content:flex-start}
.post-card.has-thumb:after{display:none}
.post-thumb{aspect-ratio:3/2;overflow:hidden;background:var(--paper2)}
.post-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease;filter:saturate(.68) sepia(.12)}
.post-card:hover .post-thumb img{transform:scale(1.04)}
.post-card.has-thumb .post-body{padding:22px 24px 0}
.post-card.has-thumb .post-link{margin:20px 24px 24px}
.post-card.featured.has-thumb{display:grid;grid-template-columns:1.15fr 1fr;grid-template-rows:1fr auto}
.post-card.featured.has-thumb .post-thumb{grid-row:1/3;aspect-ratio:auto;min-height:340px}
.post-card.featured.has-thumb .post-body{padding:34px 34px 0;align-self:end}
.post-card.featured.has-thumb .post-link{margin:22px 34px 34px;align-self:start}

.post-card.featured h2{font-size:clamp(38px,4.4vw,56px);max-width:820px}
.post-card:hover h2{color:var(--accent)}
.post-meta{display:flex;flex-wrap:wrap;gap:6px 16px;font-family:"DM Mono",monospace;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:#62584e;margin-bottom:18px}
.post-city{color:var(--accent)}
.post-card h2{font-family:"Cormorant Garamond",serif;font-size:30px;line-height:.98;font-weight:500;margin:0 0 16px}
.post-excerpt{font-family:"Cormorant Garamond",serif;font-size:19px;line-height:1.3;color:#3f362e;margin:0;max-width:640px}
.post-link{align-self:flex-start;margin-top:22px;border-bottom:1px solid var(--accent);font-family:"DM Mono",monospace;font-size:9px;letter-spacing:.1em;text-transform:uppercase;padding-bottom:5px}

/* ---------- article page ---------- */
.container.narrow{width:min(760px,calc(100% - 72px))}
.crumb{display:inline-block;font-family:"DM Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#62584e;border-bottom:1px solid var(--line);padding-bottom:4px;margin-bottom:34px}
.crumb:hover{color:var(--accent);border-color:var(--accent)}
.post-head{padding:70px 0 34px}
.post-head h1{font-family:"Cormorant Garamond",serif;font-size:clamp(42px,6.4vw,74px);font-weight:500;line-height:.94;letter-spacing:-.03em;color:var(--accent);margin:0 0 22px}
.byline{font-family:"Nothing You Could Do",cursive;font-size:22px;color:#4b4138}
.post-head .post-meta{margin-bottom:22px}

.post-hero{width:min(960px,calc(100% - 72px));margin:6px auto 46px;padding:10px;background:#f7efe1;box-shadow:0 16px 35px rgba(55,39,25,.14)}
.post-hero img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;filter:saturate(.68) sepia(.12)}
.prose{padding-bottom:80px;font-family:"Cormorant Garamond",serif;font-size:21px;line-height:1.5;color:var(--ink)}
.prose>*:first-child{margin-top:0}
.prose>h2:first-child{border-top:0;padding-top:0}
.prose p{margin:0 0 1.05em}
.prose p.see-also{font-family:"DM Mono",monospace;font-size:11px;letter-spacing:.03em;color:#5d5349;background:var(--accent-soft);border-left:2px solid var(--accent);padding:12px 16px;margin:0 0 1.4em}
.prose p.see-also a{color:var(--accent);border-bottom:1px solid currentColor}
.prose h2{font-size:clamp(34px,4.6vw,46px);font-weight:500;line-height:.98;color:var(--accent);margin:1.7em 0 .5em;padding-top:1em;border-top:1px solid var(--line)}
.prose h3{font-size:30px;font-weight:600;line-height:1.05;margin:1.5em 0 .45em}
.prose h4{font-size:22px;font-style:italic;font-weight:600;margin:1.3em 0 .3em}
.prose ul,.prose ol{margin:0 0 1.2em;padding-left:1.3em}
.prose li{margin:0 0 .4em;padding-left:.2em}
.prose li p{margin:0 0 .3em}
.prose li::marker{color:var(--accent)}
.prose a{color:var(--accent);border-bottom:1px solid currentColor}
.prose blockquote{margin:1.6em 0;padding:.2em 0 .2em 1.3em;border-left:2px solid var(--accent);font-style:italic;font-size:23px}
.prose blockquote p{margin:0}
.prose strong{font-weight:700}

.post-cta{background:var(--accent);color:var(--cream);padding:82px 0}
.post-cta-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.post-cta h2{font-family:"Cormorant Garamond",serif;font-size:clamp(46px,5.5vw,62px);font-weight:500;line-height:.88;margin:0}
.post-cta h2 em{font-style:italic}
.post-cta p{font-family:"Cormorant Garamond",serif;font-size:21px;line-height:1.3;margin:0 0 24px}
.post-cta .mini{font-family:"DM Mono",monospace;font-size:9px;letter-spacing:.18em;text-transform:uppercase;margin-bottom:18px}
.cta{display:inline-block}
.cta--light{background:var(--cream);color:var(--accent)}

.related{padding:80px 0 0}
.related .label{margin-bottom:22px}
.post-grid--related{padding-bottom:100px;grid-template-columns:1fr 1fr}
.post-grid--related .post-card{min-height:290px}
.post-grid--related .post-card.has-thumb{min-height:0}

@media(max-width:1000px){
  .post-grid{grid-template-columns:1fr 1fr}
  .post-card.featured.has-thumb{grid-template-columns:1fr}
  .post-card.featured.has-thumb .post-thumb{grid-row:auto;aspect-ratio:3/2;min-height:0}
  .post-card.featured.has-thumb .post-body{padding:24px 24px 0}
  .post-card.featured.has-thumb .post-link{margin:20px 24px 24px}
}
@media(max-width:850px){
  .post-hero{width:calc(100% - 34px);padding:7px;margin-bottom:32px}
  .container.narrow{width:calc(100% - 34px)}
  .blog-hero{padding-top:56px}
  .post-grid,.post-grid--related{grid-template-columns:1fr}
  .post-card{min-height:240px}
  .post-head{padding-top:48px}
  .prose{font-size:20px}
  .post-cta-grid{grid-template-columns:1fr;gap:30px}
}

/* ---------- Soro blog embed (blog.html) ----------
   Soro injects its own light theme at runtime; the #soro-blog prefix
   outranks it so the journal keeps the site's paper, ink and serif look. */
.soro-wrap{padding:40px 0 100px}
main:has(.soro-blog-article.visible) .blog-hero{display:none}
#soro-blog .soro-blog{max-width:none;font-family:"Cormorant Garamond",serif;color:var(--ink)}
#soro-blog .soro-blog-list{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
#soro-blog .soro-blog-card{flex-direction:column;gap:0;padding:0;border:1px solid var(--line);border-radius:0;background:transparent;overflow:hidden}
#soro-blog .soro-blog-card:hover{box-shadow:none;border-color:var(--accent)}
#soro-blog .soro-blog-card-image{width:100%;height:auto;aspect-ratio:3/2;border-radius:0;filter:saturate(.68) sepia(.12);transition:transform .5s ease}
#soro-blog .soro-blog-card:hover .soro-blog-card-image{transform:scale(1.04)}
#soro-blog .soro-blog-card-content{padding:22px 24px 26px;display:flex;flex-direction:column;background:var(--paper);position:relative}
#soro-blog .soro-blog-card-title{font-family:"Cormorant Garamond",serif;font-size:27px;font-weight:500;line-height:1.02;color:var(--ink);margin:0 0 12px}
#soro-blog .soro-blog-card-excerpt{font-family:"Cormorant Garamond",serif;font-size:18px;line-height:1.35;color:#4a4038;-webkit-line-clamp:3;margin:0 0 16px}
#soro-blog .soro-blog-card-date{order:-1;font-family:"DM Mono",monospace;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:#62584e;margin-bottom:12px}
#soro-blog .soro-blog-card:first-child{grid-column:1/-1;flex-direction:row}
#soro-blog .soro-blog-card:first-child .soro-blog-card-image{width:58%;aspect-ratio:auto;min-height:340px}
#soro-blog .soro-blog-card:first-child .soro-blog-card-content{padding:40px;justify-content:center}
#soro-blog .soro-blog-card:first-child .soro-blog-card-title{font-size:44px;line-height:.95}

/* single article view */
#soro-blog header{height:auto;border:0;padding:0}
#soro-blog .soro-blog-article-title{margin:0 0 14px}
#soro-blog .soro-blog-article-image{margin-top:10px}
#soro-blog .soro-blog-header{margin-bottom:26px}
#soro-blog .soro-blog-back{font-family:"DM Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);border:1px solid var(--line);border-radius:2px;background:transparent}
#soro-blog .soro-blog-back:hover{border-color:var(--accent);background:transparent}
#soro-blog .soro-blog-article{max-width:760px;margin:0 auto}
#soro-blog .soro-blog-article-title{font-family:"Cormorant Garamond",serif;font-size:clamp(40px,6vw,68px);font-weight:500;line-height:.95;letter-spacing:-.02em;color:var(--accent)}
#soro-blog .soro-blog-article-date{font-family:"DM Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#62584e}
#soro-blog .soro-blog-article-image{border-radius:0}
#soro-blog .soro-blog-article-content{font-family:"Cormorant Garamond",serif;font-size:21px;line-height:1.5;color:var(--ink)}
#soro-blog .soro-blog-article-content p,#soro-blog .soro-blog-article-content li{font-size:21px;line-height:1.5;color:var(--ink)}
#soro-blog .soro-blog-article-content h2{font-family:"Cormorant Garamond",serif;font-size:36px;font-weight:500;line-height:1.05;color:var(--accent)}
#soro-blog .soro-blog-article-content h3{font-family:"Cormorant Garamond",serif;font-size:27px;font-weight:600;color:var(--ink)}
#soro-blog .soro-blog-article-content a{color:var(--accent);border-bottom:1px solid var(--accent);text-decoration:none}
#soro-blog .soro-blog-article-content img{border-radius:0}

@media(max-width:900px){
  #soro-blog .soro-blog-list{grid-template-columns:1fr 1fr}
  #soro-blog .soro-blog-card:first-child{flex-direction:column}
  #soro-blog .soro-blog-card:first-child .soro-blog-card-image{width:100%;min-height:0;aspect-ratio:3/2}
  #soro-blog .soro-blog-card:first-child .soro-blog-card-content{padding:22px 24px 26px}
  #soro-blog .soro-blog-card:first-child .soro-blog-card-title{font-size:34px}
}
@media(max-width:600px){
  #soro-blog .soro-blog-list{grid-template-columns:1fr}
}
