.blog-hero{
  display:grid;
  align-items:end;
  min-height:100%;
  padding:clamp(150px,18vh,210px) 0 clamp(72px,9vh,110px);
  color:#fffdf8;
  background:
    radial-gradient(circle at 82% 20%,rgba(205,160,73,.22),transparent 30%),
    linear-gradient(135deg,#061d25 0%,#0a3139 62%,#173f43 100%);
}
.blog-hero__inner{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(280px,.65fr);
  gap:70px;
  align-items:end;
}
.blog-hero h1{
  margin:.15em 0 0;
  max-width:900px;
  color:#fffdf8;
  font-size:clamp(4.5rem,8.7vw,10rem);
  line-height:.78;
  letter-spacing:-.055em;
}
.blog-hero__inner>p{
  margin:0 0 8px;
  color:rgba(255,253,248,.78);
  font-size:clamp(1rem,1.35vw,1.2rem);
  line-height:1.75;
}
.blog-index-section{
  min-height:100%;
  padding:clamp(126px,14vh,170px) 0 90px;
  background:#f6efe4;
}
.blog-index-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,.7fr);
  gap:70px;
  align-items:end;
  margin-bottom:52px;
}
.blog-index-head h2{
  margin:.12em 0 0;
  font-size:clamp(3.7rem,6.2vw,7.2rem);
  line-height:.84;
}
.blog-index-head>p{
  margin:0;
  max-width:620px;
  color:var(--muted);
  line-height:1.78;
}
.blog-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:32px;
  padding-bottom:46px;
}
.blog-card{
  display:grid;
  grid-template-columns:minmax(180px,.78fr) minmax(0,1.22fr);
  min-height:300px;
  overflow:hidden;
  border:1px solid rgba(8,39,48,.11);
  border-radius:24px;
  background:#fffdf8;
  box-shadow:0 16px 44px rgba(7,30,39,.07);
}
.blog-card__media{
  min-height:100%;
  overflow:hidden;
}
.blog-card__media img{
  width:100%;
  height:100%;
  min-height:300px;
  object-fit:cover;
  transition:transform .45s ease;
}
.blog-card:hover .blog-card__media img,
.blog-card:focus-within .blog-card__media img{
  transform:scale(1.035);
}
.blog-card__body{
  display:flex;
  flex-direction:column;
  padding:28px 28px 25px;
}
.blog-card__meta,
.article-hero__meta{
  display:flex;
  flex-wrap:wrap;
  gap:12px 18px;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.blog-card__meta{
  color:#9b712b;
}
.blog-card h3{
  margin:16px 0 12px;
  font-size:clamp(1.85rem,2.4vw,2.65rem);
  line-height:.96;
}
.blog-card h3 a{color:var(--navy)}
.blog-card__body>p{
  margin:0 0 22px;
  color:var(--muted);
  line-height:1.65;
}
.blog-card__link{
  margin-top:auto;
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--navy);
  font-size:.72rem;
  font-weight:850;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.blog-card__link span{transition:transform .2s ease}
.blog-card__link:hover span{transform:translateX(4px)}

.article-hero{
  position:relative;
  min-height:100%;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
  color:#fff;
  background:#071e27;
}
.article-hero__image,
.article-hero__shade{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.article-hero__image{object-fit:cover}
.article-hero__shade{
  background:linear-gradient(90deg,rgba(3,22,28,.88) 0%,rgba(3,22,28,.62) 48%,rgba(3,22,28,.22) 100%);
}
.article-hero__inner{
  position:relative;
  z-index:2;
  padding-top:160px;
  padding-bottom:clamp(70px,9vh,110px);
}
.article-back{
  display:inline-block;
  margin-bottom:38px;
  color:#fff;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.article-hero__meta{color:#f0c66f}
.article-hero h1{
  max-width:1050px;
  margin:18px 0 22px;
  color:#fff;
  font-size:clamp(3.8rem,7.1vw,8.2rem);
  line-height:.82;
  letter-spacing:-.05em;
}
.article-hero__inner>p{
  max-width:760px;
  margin:0;
  color:rgba(255,255,255,.82);
  font-size:clamp(1.05rem,1.35vw,1.22rem);
  line-height:1.72;
}
.article-body-section{
  min-height:100%;
  padding:clamp(128px,14vh,170px) 0 100px;
  background:#fffaf3;
}
.article-layout{
  display:grid;
  grid-template-columns:minmax(0,760px) minmax(250px,340px);
  justify-content:center;
  gap:90px;
  align-items:start;
}
.article-copy{
  font-size:1.04rem;
  line-height:1.86;
  color:#25383d;
}
.article-copy>p:first-child{
  font-size:1.23rem;
  line-height:1.78;
  color:#122e35;
}
.article-copy h2{
  margin:2.1em 0 .55em;
  font-size:clamp(2.25rem,3.5vw,3.8rem);
  line-height:.95;
}
.article-copy a{
  color:#8d6422;
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
}
.article-credit{
  margin-top:56px !important;
  padding-top:20px;
  border-top:1px solid rgba(7,30,39,.12);
  color:#6f7d80;
  font-size:.76rem;
}
.article-side{
  position:sticky;
  top:135px;
  padding:30px;
  border:1px solid rgba(7,30,39,.12);
  border-radius:24px;
  background:#f2e8d8;
}
.article-side h2{
  margin:.2em 0 .6em;
  font-size:clamp(2.4rem,3.4vw,3.7rem);
  line-height:.9;
}
.article-side p{
  color:#52666a;
  line-height:1.65;
}
.article-side .button{margin-top:10px}

@media(max-width:1120px){
  .blog-grid{grid-template-columns:1fr}
  .blog-card{grid-template-columns:minmax(220px,.72fr) minmax(0,1.28fr)}
  .article-layout{grid-template-columns:minmax(0,720px) minmax(240px,300px);gap:48px}
}
@media(max-width:820px){
  .blog-hero__inner,.blog-index-head,.article-layout{grid-template-columns:1fr;gap:34px}
  .blog-hero{padding-top:124px}
  .blog-card{grid-template-columns:1fr}
  .blog-card__media img{height:270px;min-height:270px}
  .article-side{position:static}
}
@media(max-width:560px){
  .blog-grid{gap:20px}
  .blog-card{border-radius:18px}
  .blog-card__body{padding:23px 22px}
  .article-hero h1{font-size:clamp(3.25rem,15vw,5.8rem)}
  .article-body-section{padding-left:4px;padding-right:4px}
}



.blog-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:#071e27 !important;
}
.blog-hero__image,
.blog-hero__shade{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.blog-hero__image{
  z-index:-3;
  object-fit:cover;
  object-position:center 48%;
  transform:scale(1.015);
}
.blog-hero__shade{
  z-index:-2;
  background:
    linear-gradient(90deg,rgba(3,22,28,.88) 0%,rgba(3,22,28,.64) 48%,rgba(3,22,28,.30) 100%),
    linear-gradient(0deg,rgba(3,22,28,.22),rgba(3,22,28,.05));
}
.blog-hero::after{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  background:radial-gradient(circle at 76% 20%,rgba(214,171,83,.15),transparent 31%);
  pointer-events:none;
}
.blog-hero__inner{
  position:relative;
  z-index:2;
}

/* Dynamic archive pagination: new posts can grow beyond the first grid. */
.blog-pagination{
  display:flex;
  justify-content:center;
  padding:10px 0 52px;
}
.blog-pagination .page-numbers{
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
  margin:0;
  padding:0;
}
.blog-pagination .page-numbers li{
  margin:0;
}
.blog-pagination a,
.blog-pagination span.current{
  min-height:42px;
  min-width:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:9px 13px;
  border:1px solid rgba(7,30,39,.14);
  border-radius:999px;
  background:#fffdf8;
  color:var(--navy);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.04em;
}
.blog-pagination span.current{
  background:var(--navy);
  border-color:var(--navy);
  color:#fffdf8;
}
.blog-pagination a:hover,
.blog-pagination a:focus-visible{
  background:#eee1cd;
  border-color:#c8a25a;
}
.blog-pagination .prev,
.blog-pagination .next{
  padding-inline:17px;
}

/* Future posts with featured images keep a stable, editorial crop. */
.blog-card__media{
  background:#d8cec0;
}
