/* =========================================================
   BLOG styles — loaded after styles.css + a11y.css
   ========================================================= */
.header{position:sticky}           /* on blog pages the header flows in-page, always solid */
.blog-back{color:var(--ink);font-weight:600;font-size:.98rem;transition:color .2s}
.blog-back:hover{color:var(--gold-2)}

/* ---- Blog index hero ---- */
.blog-hero{padding:clamp(120px,16vw,170px) 0 clamp(40px,6vw,60px);text-align:center;background:linear-gradient(180deg,var(--cream),var(--paper))}
.blog-hero .eyebrow{justify-content:center}
.blog-hero .lead{margin-inline:auto}

/* ---- Post cards grid ---- */
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem}
.post-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line-soft);border-radius:var(--radius-lg);
  overflow:hidden;box-shadow:var(--shadow-sm);transition:transform .5s var(--ease),box-shadow .5s;color:inherit}
.post-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.pc-media{aspect-ratio:16/10;overflow:hidden;position:relative}
.pc-media img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.post-card:hover .pc-media img{transform:scale(1.06)}
.pc-tag{position:absolute;top:14px;inset-inline-start:14px;background:rgba(20,39,62,.85);color:#fff;font-size:.72rem;
  font-weight:600;letter-spacing:.12em;padding:.4rem .9rem;border-radius:100px}
.pc-body{padding:1.5rem 1.6rem 1.7rem;display:flex;flex-direction:column;flex:1}
.pc-date{color:var(--gold-2);font-size:.85rem;font-weight:600;margin-bottom:.5rem;letter-spacing:.05em}
.post-card h3{font-size:1.45rem;margin-bottom:.6rem}
.pc-body p{color:var(--muted);font-size:1.02rem;line-height:1.6;margin-bottom:1.2rem}
.pc-more{margin-top:auto;color:var(--navy);font-weight:700}
.pc-more::after{content:" \2190"}
.post-card.soon{opacity:.6;pointer-events:none}
.post-card.soon .pc-more{color:var(--muted)}

/* ---- Single post ---- */
.post-hero{position:relative;height:min(54vh,460px);overflow:hidden}
.post-hero>img{width:100%;height:100%;object-fit:cover}
.post-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(11,22,37,.78),rgba(11,22,37,.12))}
.post-hero-txt{position:absolute;inset-inline:0;bottom:0;z-index:2;color:#fff}
.post-hero-txt .wrap{padding-bottom:2.6rem}
.post-hero-txt .pc-tag{position:static;display:inline-block;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.35);
  color:#fff;margin-bottom:1rem}
.post-hero-txt h1{color:#fff;font-size:clamp(1.9rem,4.5vw,3.2rem);max-width:22ch;line-height:1.15}
.post-hero-txt .meta{margin-top:1rem;color:rgba(255,255,255,.85);font-size:.95rem}

.post-body{max-width:760px;margin-inline:auto;padding-block:clamp(40px,6vw,64px)}
.post-body>p{font-size:1.18rem;line-height:1.85;color:#33373f;margin-bottom:1.4rem}
.post-body .lead{font-size:1.3rem;color:var(--ink);font-weight:500;line-height:1.7;margin-bottom:1.6rem}
.post-body h2{font-size:clamp(1.5rem,3vw,2rem);margin:2.6rem 0 1rem}
.post-body h3{font-size:1.35rem;margin:1.9rem 0 .7rem}
.post-body img{width:100%;border-radius:var(--radius);margin:2rem 0;box-shadow:var(--shadow-sm)}
.post-body ul{margin:0 0 1.5rem;padding-inline-start:1.4rem;list-style:disc}
.post-body li{font-size:1.14rem;line-height:1.7;color:#33373f;margin-bottom:.5rem}
.post-body li b{color:var(--ink)}
.post-cta{background:var(--navy);color:#fff;border-radius:var(--radius-lg);padding:clamp(28px,4vw,44px);text-align:center;margin-top:2.6rem}
.post-cta h3{color:#fff;font-size:1.6rem;margin-bottom:.6rem}
.post-cta p{color:rgba(255,255,255,.82);margin-bottom:1.5rem}
.post-back-link{display:inline-block;margin-top:2rem;color:var(--navy);font-weight:700}
.post-back-link::before{content:"\2190 "}

@media(max-width:900px){.post-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.post-grid{grid-template-columns:1fr}}

/* stone-house image inside blog CTA */
.post-cta-img{width:100%;height:220px;object-fit:cover;object-position:center 30%;border-radius:14px;margin-bottom:1.5rem;display:block}
@media(max-width:600px){.post-cta-img{height:170px}}
