/*
 * Global custom site CSS.
 *
 * Define client-specific design rules in theme.json first. Add CSS here only
 * when the Global Styles system cannot express the required behaviour.
 */

@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

.skip-link {
	position: absolute;
	inset-inline-start: -9999px;
}

.skip-link:focus {
	inset-block-start: var(--space-xxs);
	inset-inline-start: var(--section-gutter);
	z-index: 100000;
	padding: var(--space-xxs) var(--space-xs);
	background: var(--white);
	color: var(--neutral-dark);
	box-shadow: var(--box-shadow-s);
}

/*
 * Template-level page layout. ACF blocks can use alignwide or alignfull in
 * their block.json support settings. Full-width blocks own their inner padding.
 */
.site-main {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, var(--content-width)) minmax(0, 1fr);
	padding-inline: var(--section-gutter);
}

.site-main > * {
	grid-column: 2;
	min-width: 0;
}

.site-main > .alignwide {
	grid-column: 1 / -1;
	width: min(100%, var(--wide-width));
	justify-self: center;
}

.site-main > .alignfull {
	grid-column: 1 / -1;
	width: calc(100% + (var(--section-gutter) * 2));
	max-width: none;
	margin-inline: calc(var(--section-gutter) * -1);
}

/* A Group containing wide/full blocks must not inherit the prose column. */
.site-main .wp-block-group:has(.alignwide, .alignfull) {
	width: 100%;
	max-width: none;
}

.site-main > .wp-block-group:has(.alignwide, .alignfull) {
	grid-column: 1 / -1;
	width: calc(100% + (var(--section-gutter) * 2));
	margin-inline: calc(var(--section-gutter) * -1);
}

.site-main .wp-block-group:has(.alignwide, .alignfull) > .alignwide {
	width: calc(100% - (var(--section-gutter) * 2));
	max-width: var(--wide-width);
	margin-inline: auto;
}

.site-main .wp-block-group:has(.alignwide, .alignfull) > .alignfull {
	width: 100%;
	max-width: none;
	margin-inline: 0;
}

body.wp-theme-ohso-base-hybrid-theme-main {
	padding: 0;
}

/* Shared interactions for native controls and themed call-to-action links. */
button,
input:is([type="submit"], [type="button"], [type="reset"]),
.wp-block-button__link,
.wp-element-button,
.ohso-content-feature__link,
.ohso-hub-cards__link,
.ohso-latest-news__link,
.ohso-package__option,
.ohso-holding-page__button,
.ohso-home-footer__hub-link,
.ohso-home-navigation__login {
	transition: background-color var(--transition), color var(--transition), border-color var(--transition);
}
button:hover,
input:is([type="submit"], [type="button"], [type="reset"]):hover,
.wp-block-button .wp-block-button__link:hover,
.wp-element-button:hover,
.ohso-content-feature__link:hover,
.ohso-content-feature__link:hover span,
.ohso-hub-cards__link:hover,
.ohso-hub-cards__link:hover span,
.ohso-latest-news__link:hover,
.ohso-latest-news__link:hover span,
.ohso-package__option:hover,
.ohso-package__option:hover span,
.ohso-holding-page__button:hover,
.ohso-home-footer .ohso-home-footer__hub-link:hover,
.ohso-home-footer .ohso-home-footer__hub-link:hover span,
.ohso-home-navigation .ohso-home-navigation__login:hover {
	text-decoration: none;
}
.wp-block-button .wp-block-button__link::after,
.ohso-content-feature__link img,
.ohso-hub-cards__arrow,
.ohso-latest-news__link img,
.ohso-package__arrow,
.ohso-home-footer__hub-link img {
	transition: transform var(--transition);
}
.wp-block-button .wp-block-button__link:hover::after,
.ohso-content-feature__link:hover img,
.ohso-hub-cards__link:hover .ohso-hub-cards__arrow,
.ohso-latest-news__link:hover img,
.ohso-package__option:hover .ohso-package__arrow,
.ohso-home-footer__hub-link:hover img {
	transform: translateX(4px);
}
@media (prefers-reduced-motion: reduce) {
	.wp-block-button .wp-block-button__link:hover::after,
	.ohso-content-feature__link:hover img,
	.ohso-hub-cards__link:hover .ohso-hub-cards__arrow,
	.ohso-latest-news__link:hover img,
	.ohso-package__option:hover .ohso-package__arrow,
	.ohso-home-footer__hub-link:hover img { transform: none; }
}
