/* Melaaura Home — Blog + Newsletter band.
   Ported from Claude Design "BLOG + NEWSLETTER".
   Shared tokens / fonts / scroll-reveal come from melaaura-home-base. */

.mh-blog{
	--mh-blog-radius:16px;
	padding:clamp(76px,12vh,160px) clamp(20px,5vw,100px);
}
.mh-blog__wrap{max-width:1360px;margin:0 auto;}

/* ── Header ──────────────────────────────────── */
.mh-blog__head{
	display:flex;align-items:flex-end;justify-content:space-between;
	gap:24px;flex-wrap:wrap;margin-bottom:clamp(40px,6vh,64px);
}
.mh-blog__eyebrow{display:flex;align-items:center;gap:14px;margin-bottom:22px;}
.mh-blog__eyebrow-line{width:36px;height:1px;background:var(--mh-gold);display:block;}
.mh-blog__eyebrow-txt{
	font-size:12px;letter-spacing:0.28em;text-transform:uppercase;color:var(--mh-mute);
}
.mh-blog__title{
	font-weight:400;font-size:clamp(32px,4.2vw,64px);line-height:1.02;
	letter-spacing:-0.01em;color:var(--mh-ink);margin:0;
}
.mh-blog__more{
	display:inline-flex;align-items:center;gap:12px;font-size:12px;letter-spacing:0.18em;
	text-transform:uppercase;color:var(--mh-ink);text-decoration:none;
	border-bottom:1px solid var(--mh-ink);padding-bottom:6px;
	transition:color .3s ease,border-color .3s ease;
}
.mh-blog__more:hover{color:var(--mh-gold);border-color:var(--mh-gold);}
.mh-blog__more span{font-size:1.35em;line-height:1;}

/* ── Post cards ────────────────────────────── */
.mh-blog__grid{
	display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
	gap:clamp(24px,3vw,40px);margin-bottom:clamp(56px,8vh,90px);
}
.mh-blog__card{text-decoration:none;display:block;}
.mh-blog__media{
	aspect-ratio:16/10;overflow:hidden;border-radius:var(--mh-blog-radius);
	background:#F2EFE9;margin-bottom:22px;
}
.mh-blog__img{
	width:100%;height:100%;object-fit:cover;display:block;
	transition:transform 1.5s cubic-bezier(.22,.61,.36,1);
}
.mh-blog__card:hover .mh-blog__img{transform:scale(1.05);}
.mh-blog__cat{
	font-size:11px;letter-spacing:0.2em;text-transform:uppercase;
	color:var(--mh-gold);margin-bottom:12px;
}
.mh-blog__date{
	font-size:11px;letter-spacing:0.16em;text-transform:uppercase;
	color:var(--mh-mute);margin-bottom:12px;
}
.mh-blog__card-title{
	font-weight:400;font-size:clamp(24px,2.2vw,34px);line-height:1.12;
	color:var(--mh-ink);margin:0;max-width:18ch;
	transition:color .3s ease;
}
.mh-blog__card:hover .mh-blog__card-title{color:var(--mh-gold);}
.mh-blog__excerpt{
	font-weight:300;font-size:14px;line-height:1.7;color:var(--mh-stone);
	margin:14px 0 0;max-width:42ch;
}

/* ── Newsletter ────────────────────────────── */
.mh-blog__news{
	border-top:1px solid rgba(22,19,15,0.14);padding-top:clamp(40px,6vh,60px);
	display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
	gap:clamp(32px,4vw,72px);align-items:center;
}
.mh-blog__news-title{
	font-weight:400;font-size:clamp(26px,2.8vw,42px);line-height:1.06;
	color:var(--mh-ink);margin:0 0 14px;
}
.mh-blog__news-sub{
	font-weight:300;font-size:15px;line-height:1.7;color:var(--mh-stone);
	max-width:440px;margin:0;
}

/* Embedded form shell — keeps the design's lean, underlined-field aesthetic
   regardless of which plugin renders the shortcode. */
.mh-blog__news-form{width:100%;}
.mh-blog__news-form form{
	display:flex;align-items:flex-end;gap:18px;flex-wrap:wrap;margin:0;
}
.mh-blog__news-form input[type="email"],
.mh-blog__news-form input[type="text"]{
	flex:1;min-width:200px;border:none;border-bottom:1px solid rgba(22,19,15,0.4);
	background:transparent;padding:10px 2px;font-family:'DM Sans',sans-serif;
	font-size:16px;color:var(--mh-ink);outline:none;
}
.mh-blog__news-form button,
.mh-blog__news-form input[type="submit"]{
	font-family:'DM Sans',sans-serif;font-size:12px;letter-spacing:0.18em;
	text-transform:uppercase;color:#fff;background:var(--mh-ink);border:none;
	padding:15px 34px;border-radius:999px;cursor:pointer;transition:background .4s ease;
}
.mh-blog__news-form button:hover,
.mh-blog__news-form input[type="submit"]:hover{background:var(--mh-gold);}
.mh-blog__news-ph{
	font-weight:300;font-size:14px;line-height:1.7;color:var(--mh-mute);
	border:1px dashed rgba(22,19,15,0.25);border-radius:12px;padding:18px 22px;margin:0;
}

@media(max-width:600px){
	.mh-blog__more{align-self:flex-start;}
}