/*
Pages built with blocks. Loaded by inc/base/editor.php on those pages only.
The page runs full width, like Page Builder rows; Group blocks keep the
content width from theme.json.
*/

.ing-blocks .site-inner .content-sidebar-wrap .entry {
	max-width: none;
	width: auto;
	padding: 0;
}

/*
main.css gives every heading color: #333 and font-weight: 400, which beats
the color a block inherits from its container (white text on a dark
GenerateBlocks section turns gray) and flattens bold headings. Hand both
back to the blocks. Low specificity, so block classes still win; GenerateBlocks
text sets its own color and weight, so it is left out. So are pages converted
from Page Builder (wrapped in .iphc-legacy), which keep main.css headings.
*/

.ing-blocks .entry-content :where(h1, h2, h3, h4, h5, h6):not(:where(.gb-text, .iphc-legacy *)) {
	color: inherit;
	font-weight: 700;
}

/* Accordion converted from Page Builder: core Details blocks with the iphc-accordion class */
.iphc-accordion { margin: 0; padding-bottom: 15px; background: #f9f9f9; }
.iphc-accordion > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 0; padding: 15px 30px; background: #828282; color: #fff; font-size: 16px; line-height: 26px; cursor: pointer; list-style: none; transition: background-color .15s; }
.iphc-accordion > summary::-webkit-details-marker { display: none; }
.iphc-accordion > summary::after { content: "+"; font-size: 22px; line-height: 1; }
.iphc-accordion[open] > summary::after { content: "\2212"; }
.iphc-accordion > summary:hover { background: #8c8c8c; }
.iphc-accordion:not([open]) { padding-bottom: 0; }
.iphc-accordion > :not(summary) { margin-left: 30px; margin-right: 30px; }
.iphc-accordion > summary + * { margin-top: 15px; }

/*
Parallax background: add iphc-parallax to a block's Additional CSS class(es).
A copy of the block's own background sits a little taller than the block and
drifts as the page scrolls. Browsers without scroll-driven animations, and
visitors who prefer reduced motion, keep the normal background.
*/

@supports (animation-timeline: view()) {
	@media (prefers-reduced-motion: no-preference) {
		.iphc-parallax {
			position: relative;
			isolation: isolate;
			overflow: clip;
			view-timeline: --iphc-parallax;
		}

		.iphc-parallax::after {
			content: "";
			position: absolute;
			inset: -20% 0;
			z-index: -1;
			background-image: inherit;
			background-size: cover;
			background-position: inherit;
			background-repeat: no-repeat;
			pointer-events: none;
			animation: iphc-parallax linear both;
			animation-timeline: --iphc-parallax;
		}
	}
}

@keyframes iphc-parallax {
	from { transform: translateY(-12%); }
	to { transform: translateY(12%); }
}