/* =========================================================
   Page family: Market Briefings (blog index + post)
   Ownership boundary: this file owns .blog-index* and .post-* only.
   Loads after styles.css + editorial-base.css, same order as other
   editorial page-family stylesheets (see area-detail-editorial.css).
   Reuses shared primitives from editorial-base.css: .editorial-shell,
   .editorial-eyebrow, .editorial-btn, .editorial-pull, .editorial-note,
   .editorial-action-link, .editorial-caption, .editorial-label.
========================================================= */

:root{
  --blog-navy:#0c1a3d;
  --blog-navy-2:#16275a;
  --blog-gold:#b8923a;
  --blog-gold-lt:#d4aa5a;
  --blog-cream:#f7f4ed;
  --blog-sand:#e8e1d0;
  --blog-ink:#1a1a2e;
  --blog-page:min(1180px, calc(100vw - 52px));
  --blog-page-mobile:calc(100vw - 32px);
  --blog-article:min(760px, calc(100vw - 52px));
}

@media (max-width:720px){
  :root{ --blog-page:var(--blog-page-mobile); }
}

/* ---------- Shared section rhythm ---------- */

.blog-hero,
.post-hero{
  position:relative;
  padding:clamp(6.2rem, 11vw, 8.6rem) 0 clamp(3.2rem, 6vw, 4.4rem);
  background:var(--hero-photo-overlay),url('/images/valley/irrigation-canal-mount-garfield.webp') center 45%/cover no-repeat,var(--blog-navy);
  color:#fff;
}

.blog-hero__inner,
.post-hero__inner{
  width:var(--blog-page);
  margin:0 auto;
}

.blog-hero .editorial-eyebrow,
.post-hero .editorial-eyebrow{ margin-bottom:1rem; }

.blog-hero h1{
  max-width:16ch;
  color:#fff;
  font-size:clamp(2.4rem, 5vw, 3.8rem);
  font-weight:300;
  letter-spacing:-.02em;
  line-height:1.05;
}

.blog-hero__deck{
  max-width:56ch;
  margin-top:1.1rem;
  color:rgba(247,244,237,.78);
  font-size:clamp(1.02rem, 1.5vw, 1.18rem);
  line-height:1.6;
}

.post-hero h1{
  max-width:22ch;
  color:#fff;
  font-size:clamp(2.15rem, 4.4vw, 3.4rem);
  font-weight:300;
  letter-spacing:-.02em;
  line-height:1.1;
}

.post-hero__deck{
  max-width:62ch;
  margin-top:1rem;
  color:rgba(247,244,237,.8);
  font-size:clamp(1rem, 1.4vw, 1.12rem);
  line-height:1.62;
}

.post-hero__meta{
  display:flex;
  flex-wrap:wrap;
  gap:.6rem 1.1rem;
  margin-top:clamp(1.35rem, 2.4vw, 2rem);
  color:rgba(247, 244, 237, .62);
  font-size:.64rem;
  font-weight:800;
  letter-spacing:.13em;
  line-height:1.5;
  text-transform:uppercase;
}

.post-hero__meta span{ white-space:nowrap; }
.post-hero__meta span + span::before{
  content:"·";
  margin-right:1.1rem;
  color:rgba(184,146,58,.7);
}

/* ---------- Blog index: editorial list, not a card grid ---------- */

.blog-index{
  padding:clamp(4.4rem, 8vw, 6.4rem) 0;
  background:var(--blog-cream);
}

.blog-index__list{
  width:var(--blog-page);
  margin:0 auto;
  display:grid;
  gap:0;
}

.blog-index__row{
  display:grid;
  grid-template-columns:minmax(120px, .22fr) minmax(0, .78fr);
  gap:clamp(1.2rem, 4vw, 3rem);
  align-items:start;
  padding:clamp(2rem, 4vw, 2.8rem) 0;
  border-top:1px solid rgba(12,26,61,.14);
}

.blog-index__list .blog-index__row:last-child{
  border-bottom:1px solid rgba(12,26,61,.14);
}

.blog-index__date{
  color:rgba(26,26,46,.5);
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.13em;
  text-transform:uppercase;
  padding-top:.3rem;
}

.blog-index__row h2{
  margin:0 0 .55rem;
  font-size:clamp(1.4rem, 2.4vw, 1.9rem);
  font-weight:400;
  line-height:1.16;
}

.blog-index__row h2 a{
  color:var(--blog-navy);
  text-decoration:none;
}

.blog-index__row h2 a:hover,
.blog-index__row h2 a:focus-visible{ color:var(--blog-gold); }

.blog-index__row p{
  max-width:62ch;
  color:rgba(26,26,46,.72);
  font-size:.98rem;
  line-height:1.62;
}

.blog-index__row .editorial-action-link{
  max-width:220px;
  margin-top:.9rem;
}

.blog-index__empty-note{
  width:var(--blog-page);
  margin:0 auto;
  padding:clamp(2rem, 4vw, 2.8rem) 0;
  color:rgba(26,26,46,.7);
  font-size:.92rem;
  line-height:1.6;
  border-top:1px solid rgba(12,26,61,.14);
}

/* ---------- Post: video embed ---------- */

.post-video{
  width:var(--blog-page);
  margin:clamp(-2.2rem, -4vw, -3.2rem) auto 0;
  position:relative;
}

.post-video__frame{
  position:relative;
  width:100%;
  padding-top:56.25%;
  overflow:hidden;
  border-radius:6px;
  box-shadow:0 24px 60px -18px rgba(12,26,61,.45);
  background:#000;
}

.post-video__frame iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}

/* ---------- Post article body ---------- */

.post-article{
  width:var(--blog-article);
  margin:0 auto;
  padding:clamp(3.6rem, 7vw, 5.2rem) 0 clamp(2rem, 4vw, 3rem);
}

.post-article__body{
  display:grid;
  gap:1.3rem;
  color:var(--blog-ink);
  font-size:1.06rem;
  line-height:1.72;
}

.post-article__body--closing p:first-child::first-letter{
  float:none;
  margin:0;
  font-size:inherit;
  font-family:inherit;
  color:inherit;
  line-height:inherit;
}

.post-article__body:not(.post-article__body--closing) p:first-child::first-letter{
  float:left;
  margin:.06em .16em 0 0;
  color:var(--blog-gold);
  font-family:"Cormorant Garamond", Georgia, serif;
  font-size:clamp(3.4rem, 5.4vw, 4.6rem);
  line-height:.72;
}

.post-article__body h2{
  margin-top:1.4rem;
  font-size:clamp(1.4rem, 2.4vw, 1.9rem);
  font-weight:400;
  color:var(--blog-navy);
}

.post-article__body strong{ color:var(--blog-navy); }

.post-article .editorial-pull{
  margin:1.6rem 0;
  border-top:2px solid rgba(184,146,58,.5);
  padding-top:1.1rem;
}

.post-sources{
  width:var(--blog-article);
  margin:0 auto;
  padding:1.6rem 0 0;
  border-top:1px solid rgba(12,26,61,.14);
  color:rgba(26,26,46,.7);
  font-size:.82rem;
  line-height:1.6;
}

.post-sources p{ margin:0 0 .4rem; max-width:72ch; }
.post-author p{ max-width:68ch; }

.post-author{
  width:var(--blog-article);
  margin:clamp(2.4rem, 5vw, 3.2rem) auto 0;
}

/* ---------- Post closing CTA (dark navy anchor) ---------- */

.post-closing{
  margin-top:clamp(3.6rem, 7vw, 5.2rem);
  padding:clamp(4rem, 7.6vw, 5.6rem) 0;
  background:var(--blog-navy);
  color:#fff;
}

.post-closing__inner{
  width:var(--blog-page);
  margin:0 auto;
  display:grid;
  gap:1.6rem;
}

.post-closing h2{
  max-width:20ch;
  color:#fff;
  font-size:clamp(1.7rem, 3vw, 2.3rem);
  font-weight:300;
}

.post-closing p{
  max-width:56ch;
  color:rgba(247,244,237,.78);
  font-size:1rem;
  line-height:1.6;
}

.post-closing__actions{
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
  margin-top:.4rem;
}

.post-related{
  width:var(--blog-article);
  margin:clamp(2rem, 4vw, 2.8rem) auto 0;
  padding-top:1.4rem;
  border-top:1px solid rgba(12,26,61,.14);
}

.post-related .editorial-label{ margin-bottom:.6rem; }

@media (max-width:720px){
  .blog-index__row{ grid-template-columns:1fr; gap:.5rem; }
  .post-article__body{ font-size:1.02rem; }
}

/* Author byline avatar */
.post-hero__meta .post-hero__author{display:inline}
.post-hero__meta .post-hero__author img{display:inline-block;vertical-align:middle;margin:-4px .5rem 0 0;width:28px;height:28px;border-radius:50%;object-fit:cover;border:1px solid rgba(184,146,58,.6)}