* { box-sizing: border-box; }
body { margin: 0; background: #FFFDFA; font-family: Manrope, sans-serif; color: #2A1510; -webkit-font-smoothing: antialiased; }
a { color: #B4232A; text-decoration: none; }
a:hover { color: #8E1F2C; }
img { max-width: 100%; }

/* Standard image frame: wrapper controls aspect-ratio + radius + clipping,
   the <img> inside just fills it (width/height:100%). Never put aspect-ratio
   directly on an <img> that also has width/height attributes — it fights the
   attribute-derived intrinsic ratio and crops incorrectly. */
.img-frame { width: 100%; overflow: hidden; display: block; }
.img-frame img { width: 100%; height: 100%; object-fit: cover; display: block; }
p { line-height: 1.85; font-size: 17px; color: #4A362E; }
li { line-height: 1.85; font-size: 17px; color: #4A362E; margin-bottom: 6px; }

#blog-nav {
  position: sticky; top: 0; z-index: 50; background: rgba(255,253,250,.94);
  backdrop-filter: blur(12px); border-bottom: 1px solid rgba(42,21,16,.07);
}
.cta-btn:hover { background: #8E1B21 !important; color: #fff !important; }
.related-card:hover { color: inherit; }