/* Blog page, post cards, single post and archives. */

/* Post card: image on top, grey body that fills the row height. */
.cc-post-card { height: 100%; }
.cc-post-card__body { flex: 1; min-height: 198px; width: 100%; }
.cc-post-card .wp-block-post-featured-image { width: 100%; overflow: hidden; }
.cc-post-card .wp-block-post-title a:hover,
.cc-post-card .wp-block-read-more:hover { color: var(--wp--preset--color--green-800); }
.cc-post-card__term a { color: inherit; }
.cc-post-card .wp-block-post-excerpt__excerpt { margin: 0; }
.cc-post-card .wp-block-post-excerpt:empty,
.cc-post-card .wp-block-post-excerpt:has(.wp-block-post-excerpt__excerpt:empty) { display: none; }

/* Latest articles: no category label, numbered badge on the image. */
.cc-latest .cc-post-card__term { display: none; }
.cc-latest .cc-post-card__body { padding-top: 12px !important; }
.cc-latest .wp-block-post-template { counter-reset: cc-post; }
.cc-latest .wp-block-post-template > li { counter-increment: cc-post; position: relative; }
.cc-latest .wp-block-post-template > li::before {
	content: counter(cc-post, decimal-leading-zero);
	position: absolute;
	z-index: 1;
	top: 14.1px;
	left: 11.9px;
	width: 40.9px;
	height: 40.9px;
	display: grid;
	place-items: center;
	background: #fff;
	border-radius: 4.5px;
	color: var(--wp--preset--color--green-800);
	font-size: 20px;
	font-weight: 700;
	line-height: 26px;
}

/* Featured article: text column width as in Figma, read-more as outline button. */
.cc-featured .wp-block-cover { overflow: hidden; }
.cc-featured__title { max-width: 620px; }
.cc-featured__excerpt { max-width: 515px; }
.cc-featured__excerpt .wp-block-post-excerpt__excerpt { margin: 0; }
.cc-featured__more {
	display: inline-block;
	padding: 12.5px 29px;
	border: 2px solid var(--wp--preset--color--green-800);
	border-radius: 6.3px;
	background: #fff;
	color: var(--wp--preset--color--green-700);
	font-size: var(--wp--preset--font-size--lead);
	font-weight: 700;
	line-height: 29px;
}
.cc-featured__more:hover { background: var(--wp--preset--color--green-700); color: #fff; }

/* Category cards. */
.cc-cat-card a { color: inherit; }

/* Newsletter (Contact Form 7). */
.cc-newsletter .wpcf7 { margin-top: 26px; }
.cc-newsletter .wp-block-cover__inner-container > p:empty { display: none; }
.cc-newsletter .wpcf7-form p { margin: 0; }
.cc-newsletter-form > p { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; margin: 0; }
.cc-newsletter-form .wpcf7-form-control-wrap { display: block; width: 450px; max-width: 100%; }
.cc-newsletter-form input[type="email"] {
	box-sizing: border-box;
	width: 100%;
	height: 62px;
	padding: 0 21px;
	border: 1px solid var(--wp--preset--color--border-default);
	border-radius: 6.3px;
	background: #fff;
	color: var(--wp--preset--color--text-primary);
	font: inherit;
	font-size: 18px;
}
.cc-newsletter-form input[type="email"]::placeholder { color: #6f7b74; }
.cc-newsletter-form input[type="submit"] {
	height: 58px;
	padding: 0 19.6px;
	border: 2px solid var(--wp--preset--color--green-800);
	border-radius: 6.3px;
	background: var(--wp--preset--color--green-800);
	color: #fff;
	font: inherit;
	font-size: 22px;
	font-weight: 700;
	line-height: 29px;
	cursor: pointer;
}
.cc-newsletter-form input[type="submit"]:hover { background: var(--wp--preset--color--green-700); border-color: var(--wp--preset--color--green-700); }
.cc-newsletter-form .wpcf7-spinner { position: absolute; margin: 0 0 0 8px; }
.cc-newsletter-form > p { position: relative; }
.cc-newsletter .wpcf7-response-output { margin: 12px 0 0 !important; max-width: 660px; border-radius: 6.3px; }

/* Single post. */
.cc-single .wp-block-post-content > * { max-width: 760px; }
.cc-single .wp-block-post-terms a { color: inherit; }

/* Post grids: 3 columns (Figma), 2 on tablet, 1 on phone. Core's columnCount grid has no breakpoints here. */
@media (max-width: 1100px) { .cc-post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 700px) { .cc-post-grid { grid-template-columns: minmax(0, 1fr) !important; } }

/* Archive/related headings use inline padding; keep them inside the content width. */
.cc-archive > * { box-sizing: border-box; }

@media (max-width: 781px) {
	.cc-featured .wp-block-cover { min-height: 560px !important; padding: 32px 24px !important; }
	.cc-newsletter { padding: 40px 24px !important; }
	.cc-newsletter-form .wpcf7-form-control-wrap { width: 100%; }
}
