/*
	(c)2025 - visuallizard.com

	General styles.
	Template, view, plugin and element specific, etc.
*/

:where(.primary :where(p, ul, ol)) {
	font-size: 18px;
}

:where(.intro :where(p, ul, ol)) {
	font-size: 24px;
}
:where(.primary :where(p, ul, ol)).intro {
	font-size: 24px;
}


a[href="#temp"],
.temp {
	outline: 1px dashed red;
}


.metagrid {
	display: grid;
	grid-template-columns: max-content;
	grid-template-rows: 1fr;
	row-gap: .5rem;
	column-gap: 1rem;
	margin-block: 0;
}
.metagrid dd + dt,
.metagrid dt + dd,
.metagrid dd + dd {
	margin-top: 0;
}
.metagrid dt {
	grid-column-start: 1;
	grid-column-end: 2;
}
.metagrid dd {
	grid-column-start: 2;
	grid-column-end: 3;

	font-weight: normal;
}


.cke img {
	border-radius: var(--border-radius);
}


.more {
	font-weight: 600;
}
.more-all > a {
	display: inline-block;
	color: inherit;
	text-decoration: underline;
	font-size: 1rem;
	font-weight: 700;
}
.more-all > a:focus,
.more-all > a:hover {
	color: var(--blue-bright);
}
.more-all > a > .icon {
	width: 1.5rem;
	height: 1.5rem;
}
a:has( > .icon) {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
}

.page-title {
	/* font-size: clamp(2rem, .75rem + 5vw, 4rem); */
	font-size: clamp(2rem, 1.5rem + 3vw, 4.5rem);
	text-wrap: balance;
}
.page-title:empty {
	display: none;
}

.pagination-links:not(:has( * ))  {
	display: none;
}


/* Newsletter feed */
.newsletter-feed ul {
	list-style: none;
	display: flex;
	flex-direction: column;
	max-width: 45rem;
	margin: 2rem 0;
	padding: .5rem 0;

	border-radius: var(--border-radius);
	/* border: 1px solid var(--blue-light); */

	background-color: var(--peach);
}

	.newsletter-feed li {
		display: flex;
		flex-wrap: wrap;
		border-bottom: .5px solid #fff;
		padding: .75rem 1rem .5rem 3.5rem;
		position: relative;
	}
	.newsletter-feed li::before {
		content: " " / "envelop";
		flex-shrink: 0;
		position: absolute;
		left: 1.25rem;
		aspect-ratio: 1;
		width: 1.5rem;
		height: auto;
		background-color: currentcolor;
		mask: var(--icon-email-outline) right center / 100% auto no-repeat;

		background-size: 100%;
		transform-origin: center center;
	}
	.newsletter-feed li:has(a:hover)::before {
		mask-image: var(--icon-email-open-outline);
	}
	.newsletter-feed li > a {
		font-weight: 700;
		flex-grow: 1;
		max-width: 500px;
		margin-right: auto;
	}
	@media (width < 600px) {
		.newsletter-feed li {
			flex-direction: column;
			padding-left: 4.5rem;
		}
		.newsletter-feed li::before {
			width: 2.5rem;
		}
		.newsletter-feed li > a {
			line-height: 1.1;
		}
		.newsletter-feed li > date {
			font-size: .875rem;
		}
	}


/* Newsletter Signup form */
.signup-container  {
	display: flex;
	flex-direction: column;
	max-width: 45rem;
	margin: 2rem 0 4rem;
	padding: 1.5rem 1.5rem;

	background-color: var(--blue-sky);
	border-radius: var(--border-radius);
}
	.signup-container img {
		border: 0;
		vertical-align: middle;
		height: auto;
	}
	.signup-container h2 {
		margin: 1rem 0;
		color: var(--blue-navy);
		font-size: 2rem;
		font-size: clamp(1.5rem, 3vw, 2rem);
		font-weight: 700;
		line-height: 1.15;
	}
		.signup-container  h2 b {
			display: block;
		}
		.signup-container header p {
			margin-bottom: 1rem;
			font-size: 90%;
			font-weight: 600;
			color: #0057b7;
			color: var(--blue-dark);
		}

		.signup-content > :last-child {
			margin-block-end: 0;
		}
		.signup-container input {
			padding: .75rem 1em;
			border-radius: var(--border-radius);

			font-size: 16px;
			color: #666;
			margin: 0;
			width: 100%;
			max-width: 100%;
			min-width: 80px;
		}

		.signup-container input::placeholder {
			font-weight: 700;
			letter-spacing: .075em;
			color: #c9c9c9;
			opacity: 1;
		}

		.signup-container .frm-input {
			width: 100%;
			margin-bottom: 1.5rem;
		}

		.signup-container .button {

		}

		.signup-container .signup-logo {
			margin-bottom: 0rem;
		}
		.signup-container .signup-logo img {
			display: block;
			margin: 0 auto;
			width: 130px;
			height: 100px;
		}
		@media (width > 800px) {

			.signup-container .signup-logo {
				display: block;
			}
				.signup-container .signup-logo img {
					display: block;
					float: right;
					margin-top: 0;
					margin-bottom: -3rem;
					margin-right: .5rem;
				}
		}


/* Search Results */
.search-results {
	list-style: none;
	padding-left: 0;
}
	.search-results > li {
		margin-bottom: 1rem;
	}
	.search-results > li h3 {
		margin-bottom: .25rem;
	}
	.search-results > li mark {
		background-color: var(--beige);
	}