/* ============================================================
   Metiri blog — listing, post pages and the home page roundup.
   Site standard: star label, 600-weight navy headings with a teal
   accent word, teal links. Hover motion only.
   ============================================================ */
.mtr-blog__in{max-width:1320px; margin:0 auto; padding-inline:var(--pg-shell,clamp(20px,4vw,64px));}

/* ── card ── */
.mtr-bcard{
  position:relative; display:flex; flex-direction:column; overflow:hidden;
  background:#fff; border:1px solid #dce7e9; border-radius:18px;
  box-shadow:0 1px 2px rgba(18,51,60,.04), 0 18px 40px -30px rgba(18,51,60,.25);
  transition:transform .3s ease, box-shadow .3s ease;
}
.mtr-bcard:hover{transform:translateY(-4px); box-shadow:0 1px 2px rgba(18,51,60,.05), 0 26px 50px -30px rgba(18,51,60,.32);}
.mtr-bcard__media{display:block; aspect-ratio:16/9.5; overflow:hidden; background:#e6eef0;}
.mtr-bcard__media img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s cubic-bezier(.2,.7,.2,1);}
.mtr-bcard:hover .mtr-bcard__media img{transform:scale(1.04);}
.mtr-bcard__body{display:flex; flex-direction:column; flex:1; padding:clamp(20px,1.8vw,28px);}
.mtr-bcard__meta{display:flex; flex-wrap:wrap; align-items:center; gap:6px 14px; margin:0 0 14px; font-size:13.5px; color:#6a7b82;}
.mtr-bcard__meta span + span::before{content:"•"; margin-right:14px; color:#a9b8bd;}
.mtr-bcard__meta .mtr-bcard__cat + span::before{content:none;}
.mtr-bcard__cat{padding:5px 12px; border-radius:999px; background:#e2f4f6; color:#00737e; font-weight:600; font-size:12.5px;}
.mtr-bcard h2,.mtr-bcard h3{margin:0 0 12px; font-size:clamp(18px,1.45vw,21px); line-height:1.3; letter-spacing:-.02em; font-weight:600;}
.mtr-bcard h2 a,.mtr-bcard h3 a{color:#12333c; text-decoration:none;}
.mtr-bcard h2 a::after,.mtr-bcard h3 a::after{content:""; position:absolute; inset:0;}   /* whole card is the link */
.mtr-bcard__desc{
  margin:0 0 20px; font-size:15px; line-height:1.6; color:#53656d;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.mtr-bcard__more{
  position:relative; z-index:1; margin-top:auto; align-self:flex-start;
  display:inline-flex; align-items:center; gap:8px; font-size:15px; font-weight:600; color:#008490; text-decoration:none;
}
.mtr-bcard__more svg{width:16px; height:16px; transition:transform .3s ease;}
.mtr-bcard:hover .mtr-bcard__more svg{transform:translateX(4px);}

/* feature card on the listing: photo left, text right */
.mtr-bcard--feature{flex-direction:row; margin-bottom:clamp(20px,2vw,28px);}
.mtr-bcard--feature .mtr-bcard__media{flex:0 0 58%; aspect-ratio:auto; min-height:clamp(300px,30vw,440px);}
.mtr-bcard--feature .mtr-bcard__body{justify-content:center; padding:clamp(26px,3vw,48px);}
.mtr-bcard--feature h2{font-size:clamp(24px,2.4vw,34px); line-height:1.2;}
.mtr-bcard--feature .mtr-bcard__desc{-webkit-line-clamp:4; font-size:16px;}

/* ── listing page ── */
.mtr-blog{padding-bottom:clamp(72px,8vw,120px);}
.mtr-blog__head{padding:clamp(56px,6vw,96px) 0 clamp(32px,3.4vw,48px);}
.mtr-blog__head h1{margin:0; font-size:clamp(44px,6vw,84px); line-height:1.02; letter-spacing:-.045em; color:#12333c;}
.mtr-blog__head h1 em,.mtr-post__more h2 em,.mtr-homeblog h2 em{font-style:normal; color:#008490;}
.mtr-blog__grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(18px,2vw,28px);}
.mtr-blog__grid--three{grid-template-columns:repeat(3,minmax(0,1fr));}

/* ── post page ── */
.mtr-post__head{max-width:860px; margin:0 auto; padding:clamp(56px,6vw,96px) var(--pg-shell,24px) clamp(28px,3vw,40px);}
.mtr-post__back{display:inline-flex; gap:8px; margin-bottom:26px; font-size:14.5px; font-weight:600; color:#008490; text-decoration:none;}
.mtr-post__back:hover span{transform:translateX(-3px);}
.mtr-post__back span{display:inline-block; transition:transform .25s ease;}
.mtr-post__head h1{margin:0; font-size:clamp(34px,4.4vw,60px); line-height:1.08; letter-spacing:-.04em; color:#12333c;}
.mtr-post__hero{max-width:1200px; margin:0 auto clamp(40px,4.4vw,64px); padding:0 var(--pg-shell,24px);}
.mtr-post__hero img{display:block; width:100%; aspect-ratio:16/8; object-fit:cover; border-radius:20px;}
.mtr-post__body{max-width:760px; margin:0 auto; padding:0 var(--pg-shell,24px) clamp(56px,6vw,90px);}
.mtr-post__body h2{margin:clamp(36px,3.6vw,50px) 0 14px; font-size:clamp(23px,2.1vw,29px); line-height:1.25; letter-spacing:-.025em; font-weight:600; color:#12333c;}
.mtr-post__body h3{margin:28px 0 10px; font-size:20px; font-weight:600; color:#12333c;}
.mtr-post__body p,.mtr-post__body li{font-size:clamp(16px,1.15vw,17.5px); line-height:1.8; color:#4c5d68;}
.mtr-post__body p{margin:0 0 18px;}
.mtr-post__body ul,.mtr-post__body ol{margin:0 0 20px; padding:0; list-style:none;}
.mtr-post__body li{position:relative; padding-left:24px; margin:0 0 10px;}
.mtr-post__body li::before{content:""; position:absolute; left:3px; top:.75em; width:7px; height:7px; border-radius:50%; background:#008490;}
.mtr-post__body a{color:#008490; text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px;}
.mtr-post__body a:hover{color:#0f6b73;}
.mtr-post__body strong{color:#12333c;}
.mtr-post__more{background:#fff; border-top:1px solid #e3ecee; padding:clamp(56px,6vw,96px) 0;}
.mtr-post__more h2{margin:0 0 clamp(26px,2.6vw,40px); font-size:clamp(30px,3.4vw,48px); letter-spacing:-.04em; color:#12333c;}

/* ── home page roundup ── */
.mtr-homeblog{background:#fff; padding:clamp(72px,8vw,130px) 0; font-family:"Montserrat",ui-sans-serif,system-ui,sans-serif;}
.mtr-homeblog *,.mtr-homeblog *::before,.mtr-homeblog *::after{box-sizing:border-box;}
.mtr-homeblog .mtr-blog__in{max-width:1440px; padding-inline:clamp(20px,3.8vw,56px);}
.mtr-homeblog .mtr-eyebrow{display:flex; align-items:center; gap:8px; margin:0 0 16px; font-size:15px; font-weight:500; color:#05080c;}
.mtr-homeblog .mtr-eyebrow__star{width:14px; height:14px; color:#008490;}
.mtr-homeblog__head{display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:clamp(28px,3vw,44px);}
.mtr-homeblog h2{margin:0; font-size:clamp(38px,4.6vw,68px); line-height:1.05; letter-spacing:-.045em; font-weight:600; color:#12333c;}
.mtr-homeblog__all{flex:none;}

/* ── responsive ── */
@media (max-width:1024px){
  .mtr-blog__grid--three{grid-template-columns:repeat(2,minmax(0,1fr));}
  .mtr-blog__grid--three > :nth-child(3){display:none;}
  .mtr-bcard--feature{flex-direction:column;}
  .mtr-bcard--feature .mtr-bcard__media{flex:none; min-height:0; aspect-ratio:16/9;}
}
@media (max-width:640px){
  .mtr-blog__grid,.mtr-blog__grid--three{grid-template-columns:1fr;}
  .mtr-blog__grid--three > :nth-child(3){display:flex;}
  .mtr-homeblog__head{flex-direction:column; align-items:flex-start;}
  .mtr-post__hero img{aspect-ratio:16/10; border-radius:14px;}
}
@media (prefers-reduced-motion:reduce){
  .mtr-bcard,.mtr-bcard__media img,.mtr-bcard__more svg,.mtr-post__back span{transition:none;}
}

/* "View all posts" — the site's teal pill button (as on /services/) */
.mtr-homeblog .mtr-s3__btn{
  display:inline-flex; align-items:center; gap:14px; padding:6px 6px 6px 24px;
  border-radius:100px; background:#008490; color:#fff; text-decoration:none;
  font-size:16px; font-weight:500; transition:background .25s ease;
}
.mtr-homeblog .mtr-s3__btn span{display:grid; place-items:center; width:40px; height:40px; border-radius:50%; background:#fff; color:#05080c; transition:transform .3s ease;}
.mtr-homeblog .mtr-s3__btn svg{width:18px; height:18px;}
.mtr-homeblog .mtr-s3__btn:hover{background:#0f6b73;}
.mtr-homeblog .mtr-s3__btn:hover span{transform:translateX(3px);}
