/* Accreditation logos: two by two on phones rather than four in a stack. */
@media (max-width: 781px) {
	.wp-block-columns.db-logo-row {
		flex-wrap: wrap !important;
	}

	.wp-block-columns.db-logo-row > .wp-block-column {
		flex-basis: calc(50% - 1rem) !important;
	}
}

/* Back to top glides rather than jumps. */
@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

/* Buttons lift and tilt a touch on hover, and press in on click. Not the menu. */
:is(.wp-element-button, .wp-block-button__link, .db-testimonials-grid__more, .gform_wrapper.gform-theme.gform-theme--framework .gform_footer :is(button, input[type="submit"]).gform_button.button) {
	transition: background-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

:is(.wp-element-button, .wp-block-button__link, .db-testimonials-grid__more, .gform_wrapper.gform-theme.gform-theme--framework .gform_footer :is(button, input[type="submit"]).gform_button.button):hover {
	box-shadow: 0 0.35rem 0.85rem rgb(31 22 64 / 28%);
	transform: translateY(-2px) rotate(-1deg);
}

:is(.wp-element-button, .wp-block-button__link, .db-testimonials-grid__more, .gform_wrapper.gform-theme.gform-theme--framework .gform_footer :is(button, input[type="submit"]).gform_button.button):active {
	box-shadow: 0 0.1rem 0.3rem rgb(31 22 64 / 28%);
	transform: translateY(1px) scale(0.98);
}

/* A white gap and an ink ring show up on every background colour. */
:is(.wp-element-button, .wp-block-button__link, .db-testimonials-grid__more, .gform_wrapper.gform-theme.gform-theme--framework .gform_footer :is(button, input[type="submit"]).gform_button.button):focus-visible {
	box-shadow: 0 0 0 2px var(--wp--preset--color--base);
	outline: 3px solid var(--wp--preset--color--contrast);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	:is(.wp-element-button, .wp-block-button__link, .db-testimonials-grid__more, .gform_wrapper.gform-theme.gform-theme--framework .gform_footer :is(button, input[type="submit"]).gform_button.button):is(:hover, :active) {
		transform: none;
	}
}

/* Skip link: only appears on keyboard focus. */
.skip-link.screen-reader-text:focus {
	background: var(--wp--preset--color--purple);
	border-radius: 0.875rem;
	box-shadow: 0 0 0 2px var(--wp--preset--color--base);
	color: var(--wp--preset--color--base);
	font-family: var(--wp--preset--font-family--lato);
	font-weight: 700;
	outline: 3px solid var(--wp--preset--color--contrast);
	outline-offset: 2px;
}

/* Flower bullets on lists in page content, matching the footer. */
ul.wp-block-list {
	list-style: none;
	padding-left: 0;
}

ul.wp-block-list > li {
	padding-left: 1.35em;
	position: relative;
}

ul.wp-block-list > li + li {
	margin-top: 0.25em;
}

/* The zero-width space keeps these as lists for VoiceOver in Safari. */
ul.wp-block-list > li::before {
	background: var(--wp--preset--color--orange);
	content: "\200B";
	height: 0.85em;
	left: 0;
	-webkit-mask: url("../img/bullet-flower.svg") center / contain no-repeat;
	mask: url("../img/bullet-flower.svg") center / contain no-repeat;
	position: absolute;
	top: 0.27em;
	transform: rotate(-8deg);
	width: 0.85em;
}

ul.wp-block-list > li:nth-child(even)::before {
	transform: rotate(14deg);
}

/*
 * Text links in paragraphs and lists turn purple on hover. The colour itself is in
 * theme.json, and this stays inside the content so the header icons and Back to
 * Top keep theirs. On a coloured band, links take the band's text colour.
 */
.wp-block-post-content :is(p, li) a:where(:not([class]):hover, :not([class]):focus) {
	color: var(--wp--preset--color--purple);
}

.wp-block-post-content .has-background a:where(:not([class])) {
	color: inherit;
}