/* Section design shared by every section: torn top edge and paper texture.
   The section colors are built from the brand palette in includes/section-style.php. */

/* Torn top edge. The section moves up 32px over the section above, and the
   top 40px is cut along a torn-paper line, so the section above shows through. */
section.skyd-edge-torn {
	margin-top: -32px;
	padding-top: calc(var(--skyd-section-y, 64px) + 32px);
	-webkit-mask:
		var(--skyd-torn) top left / 1440px 40px repeat-x,
		linear-gradient(#000 0 0) 0 39px / 100% calc(100% - 39px) no-repeat;
	mask:
		var(--skyd-torn) top left / 1440px 40px repeat-x,
		linear-gradient(#000 0 0) 0 39px / 100% calc(100% - 39px) no-repeat;
}
@media (max-width: 767px) {
	section.skyd-edge-torn {
		-webkit-mask-size: 960px 32px, 100% calc(100% - 31px);
		mask-size: 960px 32px, 100% calc(100% - 31px);
		-webkit-mask-position: top left, 0 31px;
		mask-position: top left, 0 31px;
	}
}
/* The first section on a page has nothing above it to overlap. */
.skyd-main > section.skyd-edge-torn:first-child,
.skyd-content > section.skyd-edge-torn:first-child,
.entry-content > section.skyd-edge-torn:first-child { margin-top: 0; }

/* Paper texture: soft grain and fibers over the section color. */
section.skyd-texture {
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='256' height='256'%3E%3Cfilter id='f' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.875' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .12 0 0 0 0 .1 0 0 0 0 .08 0 0 0 .36 -.14'/%3E%3C/filter%3E%3Crect width='256' height='256' filter='url(%23f)'/%3E%3C/svg%3E"),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='640' height='640'%3E%3Cfilter id='g' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.0125 .025' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .1 0 0 0 0 .08 0 0 0 0 .05 0 0 0 .1 -.03'/%3E%3C/filter%3E%3Crect width='640' height='640' filter='url(%23g)'/%3E%3C/svg%3E") !important;
	background-repeat: repeat, repeat !important;
}

/* Panels that stay dark on any section color keep the brand accent. */
.skyd-field .skyd-pillars__item {
	--_accent: var(--skyd-brand-accent, #E4AF0D);
}

/* Buttons: Medium weight, never bold. Hover changes the color, no lift. */
body :is(.skyd-hero__btn, .skyd-statement__btn, .skyd-story__btn, .skyd-compare__button, .skyd-contact__button) {
	font-weight: 500;
	transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease;
}
body :is(.skyd-hero__btn--primary, .skyd-statement__btn, .skyd-story__btn, .skyd-compare__button, .skyd-contact__button):is(:hover, :focus-visible) {
	transform: none;
	box-shadow: none;
	background: var(--skyd-field-1, #0E7C86);
	border-color: var(--skyd-field-1, #0E7C86);
	color: #FFFFFF;
}
body .skyd-hero__btn--secondary:is(:hover, :focus-visible) { transform: none; }
