/* sidebar layout */
.cagov-with-sidebar {
	overflow: hidden;
}
.cagov-with-sidebar > * {
	display: flex;
	flex-wrap: wrap;
	margin: 0;
}
.cagov-with-sidebar .cagov-mb-1 {
	margin-bottom: 1rem;
}
.cagov-with-sidebar > * > * {
	margin: 0;
	flex-grow: 1;
}
.cagov-with-sidebar-left > * > :last-child {
	flex-basis: 0;
	flex-grow: 999;
	min-width: calc(30% - var(0px));
}
.cagov-with-sidebar-right > * > :first-child {
	flex-basis: 0;
	flex-grow: 999;
	min-width: calc(30% - 0px);
}

/* generic utility styles, should come from base-css */
.stack * + * {
	margin-top: var(--s-3, 1.5rem);
}
.cagov-border {
	border: solid 1px;
}
.no-deco {
	text-decoration: none;
}
/* spacing overrides, can these come from base-css? */
.cagov-featured-section h2 {
	padding-bottom: var(--s-2, 1rem);
}
.cagov-featured-section h3 {
	margin: 0;
}
.cagov-hero-body-content p {
	margin-bottom: var(--s-2, 1rem);
}
.cagov-p-2 {
	padding: var(--s-3, 1.5rem);
}
.cagov-bkgrd-gry {
	background-color: var(--gray-100, #f9f9fa);
}

/* featured section specific style */
.cagov-featured-sidebar {
	max-width: 400px;
	margin-top: 0;
}
.cagov-featured-section {
	margin: 0 0 var(--s-5, 3rem) 0;
}
.cagov-featured-section .components-button.image-button {
	display: block;
	height: 100%;
	margin: 0 0 var(--s-5, 3rem) 0;
	padding: 0;
}
.cagov-featured-image {
	object-fit: cover;
	width: 100%;
	display: block;
	height: 100%;
	min-width: 18rem;
	min-height: 20rem;
	max-height: 420px;
}

/* hero sidebar swap image on left to go on top when it wraps */
@media (max-width: 767px) {
	.cagov-with-sidebar > * {
		flex-direction: column-reverse;
	}
}
@media (min-width: 1176px) {
	.cagov-featured-sidebar {
		max-width: 34%;
	}
}

/* call to action */
/* styles applied to elements WordPress is adding to the markup */
.cagov-hero-body-content
	.wp-block-button:not(.is-style-outline)
	.btn-primary:not(:hover):not(:active):not(.has-background) {
	/* defined here for when css vars are not supported */
	color: var(--white, #fff);
	background-color: var(--primary-700, #165ac2);
	border-color: var(--primary-700, #165ac2);
	padding: 0.5rem 1rem;
	border-radius: 0.5rem;
	display: inline-block;
	font-size: var(--font-size-2, 1.125rem);
	font-weight: var(--font-weight-6, 600);
	padding: var(--s-1, 0.5rem) var(--s-2, 1rem);
	line-height: var(--font-lineheight-3, 1.5);
	border-radius: var(--radius-2, 4px);
	border: var(--border-1, 1px) solid;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
	cursor: pointer;
}
.cagov-hero-body-content .wp-block-button:not(.is-style-outline) .btn-primary:hover {
	background-color: var(--primary-900, #003588);
	border-color: var(--primary-900, #003588);
	box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5);
	text-decoration: none;
	color: var(--white, #fff);
	display: inline-block;
}
.cagov-hero-body-content .wp-block-button:not(.is-style-outline) .btn-primary:focus {
	border-color: var(--primary-900, #003588);
	outline: var(--border-2, 2px) solid var(--accent2-500, #ac8226);
	outline-offset: 2px;
}
.cagov-hero-body-content .btn-primary {
	overflow-wrap: normal;
	white-space: nowrap;
}
