/* ============================================================
   MAINE STAYS — blog listing / pagination pages (assets-v2)
   Loaded after base.css + theme.css.  ms-bloglist-v1
   ============================================================ */

/* hero */
.bloglist-hero{position:relative;overflow:hidden;background:var(--ink-deep);
  padding:clamp(6.5rem,14vh,9rem) 0 clamp(2.6rem,6vh,4rem);}
.bloglist-hero .band-bg{position:absolute;inset:0;}
.bloglist-hero .band-bg img{width:100%;height:100%;object-fit:cover;}
.bloglist-hero .band-bg::after{content:"";position:absolute;inset:0;
  background:
    radial-gradient(80% 60% at 88% -8%, rgba(43,212,212,.20), transparent 58%),
    linear-gradient(180deg, rgba(9,13,17,.86) 0%, rgba(9,13,17,.92) 100%);}
.bloglist-hero .section-inner{position:relative;z-index:1;}
.bloglist-hero h1{font-family:var(--font-head);font-weight:600;color:#fff;
  font-size:clamp(2rem,4.4vw,3.2rem);line-height:1.08;letter-spacing:-.015em;}
.bloglist-hero .blog-sub{margin-top:.8rem;max-width:38rem;color:rgba(255,255,255,.66);
  line-height:1.55;font-size:.98rem;}

/* grid */
.blog-body{background:var(--fog);padding:clamp(2.4rem,6vh,4rem) 0 clamp(3rem,7vh,5rem);}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.1rem,2.2vw,1.7rem);
  max-width:1180px;margin:0 auto;}
@media(max-width:980px){.blog-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.blog-grid{grid-template-columns:1fr;max-width:460px;}}

.blog-card{display:flex;flex-direction:column;background:#fff;border-radius:var(--radius-card);
  overflow:hidden;border:1px solid rgba(22,24,26,.06);box-shadow:var(--shadow-soft);
  transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s;}
.blog-card:hover{transform:translateY(-6px);
  box-shadow:0 38px 76px -30px rgba(11,127,138,.38),0 0 0 1px rgba(43,212,212,.22);}
.blog-header-link{display:block;text-decoration:none;}
.blog-header{position:relative;min-height:186px;display:flex;align-items:flex-end;
  padding:1.1rem 1.2rem;background-size:cover !important;background-position:center !important;
  transition:transform .7s cubic-bezier(.2,.7,.2,1);}
.blog-card:hover .blog-header{transform:scale(1.04);}
.blog-header h3{font-family:var(--font-head);font-weight:600;font-size:1.12rem;line-height:1.25;
  color:#fff;letter-spacing:-.005em;}

.blog-content{display:flex;flex-direction:column;gap:.6rem;flex:1;padding:1rem 1.2rem 1.2rem;}
.blog-meta{display:flex;gap:.75rem;font-family:var(--font-ui);font-weight:600;font-size:.72rem;
  letter-spacing:.04em;text-transform:uppercase;color:var(--teal);}
.blog-excerpt{margin:0;font-size:.88rem;line-height:1.55;color:var(--ink-60);}
.blog-content .blog-link,.blog-content a.read-more{margin-top:auto;align-self:flex-start;
  display:inline-flex;align-items:center;gap:.4rem;font-family:var(--font-ui);font-weight:600;
  font-size:.86rem;color:var(--teal);text-decoration:none;}
.blog-content .blog-link:hover,.blog-content a.read-more:hover{color:var(--teal-deep);}

/* pagination */
.pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.45rem;
  margin-top:clamp(1.8rem,4vh,2.6rem);}
.pagination-num,.pagination-btn{display:inline-flex;align-items:center;justify-content:center;
  min-width:42px;height:42px;padding:0 .85rem;border-radius:var(--radius-pill);
  font-family:var(--font-ui);font-weight:600;font-size:.88rem;text-decoration:none;
  color:var(--ink);background:#fff;border:1px solid rgba(22,24,26,.10);
  transition:background .2s,color .2s,border-color .2s;}
.pagination-num:hover,.pagination-btn:hover{border-color:var(--teal);color:var(--teal);}
.pagination-num.active{background:var(--teal);color:#fff;border-color:var(--teal);}
.pagination-btn.disabled{opacity:.4;pointer-events:none;}