/* ==========================================================================
   /blog/ — the Elementor "Posts" widget (classic skin) on an otherwise plain
   GeneratePress page. Loaded after pages/post.css, which supplies the shell.

   The page differs from a post in how the article box is padded: live measures
   .site-main margin 0, .inside-article padding 40px 0 (so the white block runs
   the full 825px column), the h1 indented 10px and the widget inset 10px.

   Card metrics, live at 1440 (and baseline/css/inline/blog__elementor-*.css):
     grid 2 up, column gap 30px, row gap 35px, card 388 wide
     thumbnail ratio .66 (.5 at <=767px), 20px below it
     title 18px/21.6 w600, 9px below; excerpt 14px/21 #777, 10px below
     read more 16px/24
   ========================================================================== */

.content-area > .site-main { margin: 0; }
.inside-article { padding: 40px 0; }
.entry-title { padding-left: 10px; }

.blog-posts-widget { padding: 10px; }

.card-grid--blog { grid-template-columns: repeat(2, 1fr); }
/* post.css's .entry-content h3 would otherwise win over site.css's .card__title */
.card-grid--blog .card__title { font-size: 18px; line-height: 1.2em; font-weight: 600; margin-bottom: 9px; }

.card__excerpt { margin: 0 0 10px; }
.card__excerpt p { margin: 0; font-size: 14px; line-height: 21px; color: #777; }

.card__more {
	display: inline-block;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	color: var(--link);
}
.card__more:hover { color: #000; }

@media (max-width: 767px) {
	.card-grid--blog { grid-template-columns: 1fr; }
	.card-grid--blog .card__thumb { padding-bottom: 50%; }
}
