/**
 * pFolio — prueba: la cabecera, el cuadro de búsqueda y el menú de Specimen
 * 2.0, con sus medidas, los enlaces de pFolio y sus fuentes (Acumin y Minion
 * Display). Solo se carga con la opción pfolio_specimen_header
 * (inc/specimen-header.php).
 *
 * 1. Cabecera: marca, enlaces centrados y controles
 * 2. Controles: palabra en versalitas e icono pequeño
 * 3. Cuadro de búsqueda
 * 4. Menú
 * 5. Móvil
 */

:root {
	/* El margen de arriba baja sus elementos respecto al borde de la ventana. */
	--sp-header-top: 16px;
	--pfolio-header: 89px;
	/* Al bajar por la página, más fina y con el logo más pequeño. */
	--pfolio-header-compact: 60px;
	--sp-ink: var(--wp--preset--color--ink);
	--sp-ink-2: color-mix(in srgb, var(--wp--preset--color--ink) 72%, transparent);
	--sp-muted: var(--wp--preset--color--ash);
	--sp-rule: var(--wp--preset--color--line);
	--sp-paper: var(--wp--preset--color--paper);
	--sp-serif: var(--wp--preset--font-family--serif-display);
	--sp-text: var(--wp--preset--font-family--serif);
	--sp-sans: var(--wp--preset--font-family--ui);
	--sp-track: 0.16em;

	/* Reserva el hueco de la barra de desplazamiento: al abrir el menú o la
	   búsqueda la página no salta de lado. */
	scrollbar-gutter: stable;
}

/* =====================================================================
   1. CABECERA
   ===================================================================== */

.pfolio-header.pfolio-header {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	column-gap: 24px;
	box-sizing: border-box;
	padding-top: var(--sp-header-top);
	transition: min-height 0.4s var(--pfolio-ease), padding-top 0.4s var(--pfolio-ease);
}

.pfolio-header .wp-block-site-title {
	transition: width 0.4s var(--pfolio-ease);
}

.pfolio-site-header.is-scrolled .pfolio-header.pfolio-header {
	padding-top: 0;
}

.pfolio-site-header.is-scrolled .pfolio-header .wp-block-site-title {
	width: clamp(100px, 8.4vw, 128px);
}

/* La cabecera va en el flujo de la página: lo que encoge, lo devuelve como
 * margen, para que el contenido no salte. */
body:not(.pfolio-overlay-header) .pfolio-site-header {
	transition:
		background-color 0.4s var(--pfolio-ease),
		color 0.4s var(--pfolio-ease),
		box-shadow 0.4s var(--pfolio-ease),
		margin-bottom 0.4s var(--pfolio-ease);
}

body:not(.pfolio-overlay-header) .pfolio-site-header.is-scrolled {
	margin-bottom: calc(var(--pfolio-header) - var(--pfolio-header-compact));
}

@media (prefers-reduced-motion: reduce) {
	.pfolio-header.pfolio-header,
	.pfolio-header .wp-block-site-title,
	body:not(.pfolio-overlay-header) .pfolio-site-header {
		transition: none;
	}
}

.pfolio-header > * {
	margin: 0;
}

.pfolio-header .pfolio-header__actions {
	display: contents;
}

.pfolio-header .pfolio-nav,
.pfolio-header .pfolio-nav .wp-block-navigation__container {
	gap: 0 clamp(20px, 2.8vw, 38px);
}

.pfolio-header .pfolio-nav {
	justify-content: center;
	font-family: var(--sp-sans);
	font-size: 9.5px;
	font-weight: 400;
	line-height: 1.6;
	letter-spacing: var(--sp-track);
	text-transform: uppercase;
}

/* Sin el subrayado de la página actual del menú de siempre. */
body:not(.editor-styles-wrapper) .pfolio-site-header .pfolio-nav .wp-block-navigation-item__content::after {
	display: none;
}

.pfolio-header .pfolio-header__buttons {
	justify-self: end;
	gap: 22px;
}

.pfolio-header__buttons > .sp-mode {
	order: -1;
}

.pfolio-header__buttons > .pfolio-lang {
	order: -2;
}

/* El selector de idioma, con la letra de los controles. El idioma actual, más
 * marcado. */
.pfolio-lang {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	font-family: var(--sp-sans);
	font-size: 10.5px;
	font-weight: 400;
	line-height: 1;
	letter-spacing: var(--sp-track);
	text-transform: uppercase;
}

.pfolio-lang a {
	padding-block: 6px;
	color: inherit;
	opacity: 0.55;
	text-decoration: none;
	transition: opacity 0.2s ease;
}

.pfolio-lang a[aria-current],
.pfolio-lang a:is(:hover, :focus-visible) {
	opacity: 1;
	text-decoration: none;
}

.pfolio-lang span {
	opacity: 0.4;
}

/* Con el menú de Specimen no hay que esconder los enlaces de la cabecera. */
html:is(.sp-menu-is-open, .sp-search-is-open) {
	overflow: hidden;
}

/* =====================================================================
   2. CONTROLES
   ===================================================================== */

.pfolio-site-header :is(.sp-search-toggle, .sp-menu-toggle, .sp-mode),
.sp-search-hub__close,
.sp-menu__close,
.sp-menu .sp-mode {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: auto;
	height: auto;
	margin: 0;
	padding: 6px 0;
	border: 0;
	border-radius: 0;
	background: none;
	color: inherit;
	font-family: var(--sp-sans);
	font-size: 10.5px;
	font-weight: 400;
	line-height: 1;
	letter-spacing: var(--sp-track);
	text-transform: uppercase;
	cursor: pointer;
}

.pfolio-site-header :is(.sp-search-toggle, .sp-menu-toggle, .sp-mode):focus-visible,
.sp-search-hub__close:focus-visible,
.sp-menu__close:focus-visible,
.sp-menu .sp-mode:focus-visible {
	outline: 1px solid currentColor;
	outline-offset: 4px;
}

.sp-ctl__label {
	position: relative;
	padding-block: 2px;
}

.sp-ctl__label::after {
	content: "";
	position: absolute;
	inset: auto 0 -2px;
	height: 1px;
	background: currentColor;
	transform: scaleX(0);
	transform-origin: right;
	transition: transform 0.35s cubic-bezier(0.65, 0, 0.35, 1);
}

:is(.sp-search-toggle, .sp-search-hub__close, .sp-menu-toggle, .sp-menu__close):is(:hover, :focus-visible) .sp-ctl__label::after {
	transform: scaleX(1);
	transform-origin: left;
}

.sp-lens,
.sp-burger,
.sp-contrast {
	display: block;
	flex-shrink: 0;
	width: 12px;
	height: 12px;
	overflow: visible;
}

/* La lupa: el mango es un tramo de una diagonal del aspa. Abierta, el círculo
   se borra y las dos diagonales se completan. */
.sp-lens * {
	transition:
		stroke-dasharray 0.5s cubic-bezier(0.65, 0, 0.35, 1),
		stroke-dashoffset 0.5s cubic-bezier(0.65, 0, 0.35, 1);
}

.sp-lens__ring {
	stroke-dasharray: 100 100;
	stroke-dashoffset: 0;
}

.sp-lens__a {
	stroke-dasharray: 30 70;
	stroke-dashoffset: -70;
}

.sp-lens__b {
	stroke-dasharray: 0 100;
	stroke-dashoffset: -50;
}

.sp-search-toggle[aria-expanded="true"] .sp-lens__ring,
.sp-search-hub.is-open .sp-lens__ring {
	stroke-dashoffset: 100;
}

.sp-search-toggle[aria-expanded="true"] .sp-lens__a,
.sp-search-hub.is-open .sp-lens__a {
	stroke-dasharray: 100 0;
	stroke-dashoffset: 0;
	transition-delay: 0.15s;
}

.sp-search-toggle[aria-expanded="true"] .sp-lens__b,
.sp-search-hub.is-open .sp-lens__b {
	stroke-dasharray: 100 0;
	stroke-dashoffset: 0;
	transition-delay: 0.25s;
}

/* El menú: dos líneas que se cruzan en un aspa. */
.sp-burger * {
	transform-box: fill-box;
	transform-origin: center;
	transition: transform 0.45s cubic-bezier(0.65, 0, 0.35, 1);
}

.sp-menu-toggle.is-open .sp-burger__a,
.sp-menu.is-open .sp-burger__a {
	transform: translateY(3px) rotate(45deg);
}

.sp-menu-toggle.is-open .sp-burger__c,
.sp-menu.is-open .sp-burger__c {
	transform: translateY(-3px) rotate(-45deg);
}

/* El modo: el círculo da media vuelta al pasar a oscuro. */
.pfolio-site-header .sp-mode,
.sp-menu .sp-mode {
	--sp-mode-turn: 0deg;

	padding-inline: 2px;
}

.sp-contrast {
	width: 13px;
	height: 13px;
	transform: rotate(var(--sp-mode-turn));
	transition: transform 0.6s cubic-bezier(0.65, 0, 0.35, 1), opacity 0.2s ease;
}

.sp-mode:hover .sp-contrast {
	opacity: 0.6;
}

:root[data-theme="dark"] .sp-mode {
	--sp-mode-turn: 180deg;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) .sp-mode {
		--sp-mode-turn: 180deg;
	}
}

/* =====================================================================
   3. CUADRO DE BÚSQUEDA: baja desde arriba sobre la página velada
   ===================================================================== */

.sp-search-hub {
	position: fixed;
	inset: 0;
	z-index: 100001;
	background: rgba(0, 0, 0, 0.35);
	opacity: 0;
	transition: opacity 0.4s ease;
}

.sp-search-hub[hidden],
.sp-menu[hidden] {
	display: none;
}

.sp-search-hub.is-open {
	opacity: 1;
}

.sp-search-hub__panel {
	position: absolute;
	inset: 0 0 auto;
	box-sizing: border-box;
	max-height: 100dvh;
	padding: calc(var(--sp-toggle-top, 24px) + var(--sp-toggle-height, 30px) + 28px) var(--wp--custom--gutter) 36px;
	overflow-y: auto;
	overscroll-behavior: contain;
	background: var(--sp-paper);
	color: var(--sp-ink);
	transform: translateY(-100%);
	transition: transform 0.5s cubic-bezier(0.65, 0, 0.35, 1);
}

.sp-search-hub.is-open .sp-search-hub__panel {
	transform: none;
}

.sp-search-hub__close {
	position: absolute;
	top: var(--sp-toggle-top, 24px);
	right: var(--sp-toggle-right, 24px);
	height: var(--sp-toggle-height, 30px);
}

.sp-search-hub p {
	margin: 0;
}

.sp-search-hub__label,
.sp-search-hub__status {
	display: block;
	margin: 0 0 10px;
	color: var(--sp-ink-2);
	font-family: var(--sp-sans);
	font-size: 10px;
	letter-spacing: var(--sp-track);
	text-transform: uppercase;
}

/* El filete del campo se dibuja de izquierda a derecha al abrir. */
.sp-search-hub__field {
	position: relative;
	display: flex;
	align-items: center;
	gap: 16px;
	border-bottom: 1px solid var(--sp-rule);
}

.sp-search-hub__field::after {
	content: "";
	position: absolute;
	inset: auto 0 -1px;
	height: 1px;
	background: var(--sp-ink);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.7s cubic-bezier(0.65, 0, 0.35, 1) 0.25s;
}

.sp-search-hub.is-open .sp-search-hub__field::after {
	transform: scaleX(1);
}

.sp-search-hub__field input {
	flex: 1;
	min-width: 0;
	padding: 6px 0 14px;
	border: 0;
	background: transparent;
	color: inherit;
	font-family: var(--sp-serif);
	font-size: clamp(34px, 5vw, 64px);
	font-weight: 400;
	line-height: 1.1;
	letter-spacing: -0.015em;
	outline: none;
	-webkit-appearance: none;
	appearance: none;
}

.sp-search-hub__field input::placeholder {
	color: var(--sp-muted);
	opacity: 1;
}

.sp-search-hub__field input::-webkit-search-cancel-button {
	display: none;
}

.sp-search-hub__submit {
	display: flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	cursor: pointer;
}

.sp-search-hub__submit .sp-icon {
	width: 28px;
	height: 28px;
	transition: transform 0.3s ease;
}

.sp-search-hub__submit:hover .sp-icon {
	transform: translateX(4px);
}

.sp-search-hub__body {
	display: grid;
	grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr);
	gap: 28px clamp(32px, 5vw, 80px);
	margin-top: 28px;
}

.sp-search-hub__list,
.sp-search-hub__explore ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sp-search-hub__explore ul {
	margin-bottom: 24px;
}

/* Los resultados entran en cascada, como el menú. */
.sp-search-hub__list li {
	animation: sp-result-in 0.4s cubic-bezier(0.29, 0.09, 0.22, 0.98) both;
	animation-delay: calc(var(--sp-i, 0) * 50ms);
}

@keyframes sp-result-in {
	from {
		opacity: 0;
		transform: translateY(8px);
	}
}

.sp-search-hub__result {
	display: grid;
	grid-template-columns: 64px minmax(0, 1fr);
	gap: 16px;
	align-items: center;
	padding-block: 12px;
	border-bottom: 1px solid var(--sp-rule);
	color: inherit;
	text-decoration: none;
}

.sp-search-hub__result img {
	display: block;
	width: 64px;
	height: 48px;
	object-fit: cover;
}

.sp-search-hub__result > span {
	display: grid;
	gap: 3px;
}

.sp-search-hub__result-label,
.sp-search-hub__result-date {
	color: var(--sp-ink-2);
	font-family: var(--sp-sans);
	font-size: 9.5px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.sp-search-hub__result-title {
	font-family: var(--sp-serif);
	font-size: 19px;
	font-weight: 400;
	line-height: 1.2;
}

.sp-search-hub__result:is(:hover, :focus-visible) {
	text-decoration: none;
}

.sp-search-hub__result:is(:hover, :focus-visible) .sp-search-hub__result-title {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.15em;
}

.sp-search-hub__sections a {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	padding-block: 7px;
	border-bottom: 1px solid var(--sp-rule);
	color: inherit;
	font-family: var(--sp-serif);
	font-size: 22px;
	font-weight: 400;
	text-decoration: none;
}

.sp-search-hub__sections a span {
	color: var(--sp-muted);
	font-family: var(--sp-sans);
	font-size: 10px;
	letter-spacing: 0.1em;
}

.sp-search-hub__topics {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.sp-search-hub__topics a {
	display: block;
	padding: 4px 12px;
	border: 1px solid var(--sp-rule);
	border-radius: 999px;
	color: var(--sp-ink-2);
	font-family: var(--sp-text);
	font-size: 13px;
	text-decoration: none;
}

.sp-search-hub__topics a:hover {
	border-color: var(--sp-ink);
	color: var(--sp-ink);
	text-decoration: none;
}

.sp-search-hub .sp-search-hub__hint {
	margin-top: 8px;
	color: var(--sp-muted);
	font-family: var(--sp-sans);
	font-size: 10.5px;
	letter-spacing: 0.06em;
}

/* =====================================================================
   4. MENÚ: en escritorio, un panel oscuro que entra por la derecha sobre la
   página velada, que se desplaza 24px a la izquierda; en pantallas
   estrechas, a pantalla completa. Cada elemento entra en cascada.
   ===================================================================== */

.sp-menu {
	--sp-menu-ink: var(--wp--preset--color--night);
	--sp-menu-paper: #f3f1ec;

	position: fixed;
	inset: 0;
	z-index: 100000;
	overflow-y: auto;
	overscroll-behavior: contain;
	background: var(--sp-menu-ink);
	color: var(--sp-menu-paper);
	opacity: 0;
	transition: opacity 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.sp-menu.is-open {
	opacity: 1;
	transition: opacity 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.sp-menu__panel {
	position: relative;
	box-sizing: border-box;
	min-height: 100%;
	padding: calc(var(--sp-toggle-top, 24px) + var(--sp-toggle-height, 26px) + 40px) clamp(20px, 5vw, 40px) 32px;
}

.sp-menu a {
	color: inherit;
	text-decoration: none;
}

/* El aspa, en el mismo sitio que el botón que abre el menú. */
.sp-menu__close {
	position: absolute;
	top: var(--sp-toggle-top, 24px);
	right: var(--sp-toggle-right, 20px);
	height: var(--sp-toggle-height, 30px);
}

.sp-menu li {
	opacity: 0;
	transform: matrix(0.99939, 0, 0, 1.055, 0, 8);
	transform-origin: 0 0;
	transition:
		transform 275ms cubic-bezier(0.29, 0.09, 0.22, 0.98),
		opacity 275ms cubic-bezier(0.29, 0.09, 0.22, 0.98);
}

.sp-menu.is-open li {
	opacity: 1;
	transform: matrix(1, 0, 0, 1, 0, 0);
	transition-delay: calc(var(--sp-i, 0) * 50ms + 250ms);
}

.sp-menu-content {
	--sp-menu-rule: color-mix(in srgb, currentColor 16%, transparent);

	display: flex;
	flex-direction: column;
	min-height: calc(100dvh - var(--sp-toggle-top, 24px) - var(--sp-toggle-height, 26px) - 72px);
}

.sp-menu-content > * {
	margin: 0;
}

.sp-menu-content .sp-menu-content__label {
	margin-bottom: 10px;
	color: color-mix(in srgb, currentColor 55%, transparent);
	font-family: var(--sp-sans);
	font-size: 10px;
	letter-spacing: var(--sp-track);
	text-align: right;
	text-transform: uppercase;
}

.sp-menu-content .sp-menu-content__nav {
	margin-bottom: 36px;
	padding: 0;
	border-top: 1px solid var(--sp-menu-rule);
	font-family: var(--pfolio-title-font);
	font-size: clamp(34px, 9vw, 46px);
	font-weight: var(--pfolio-head-small);
	line-height: 1.15;
	letter-spacing: -0.01em;
	list-style: none;
}

.sp-menu-content__nav > li {
	margin: 0;
	border-bottom: 1px solid var(--sp-menu-rule);
}

/* Las categorías, a la derecha; el número de entradas, al margen izquierdo. */
.sp-menu-content__nav a {
	display: flex;
	flex-direction: row-reverse;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	padding: 10px 0;
	transition: opacity 0.2s ease, padding 0.3s cubic-bezier(0.65, 0, 0.35, 1);
}

/* Al pasar por una sección, se desplaza un poco y las demás se atenúan. */
.sp-menu-content__nav a:is(:hover, :focus-visible) {
	padding-right: 10px;
	text-decoration: none;
}

.sp-menu-content__nav:has(a:is(:hover, :focus-visible)) a:not(:hover, :focus-visible) {
	opacity: 0.4;
}

.sp-menu-count {
	color: color-mix(in srgb, currentColor 55%, transparent);
	font-family: var(--sp-sans);
	font-size: 10px;
	letter-spacing: 0.1em;
}

.sp-menu-content .sp-menu-content__topics {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 8px;
	margin-bottom: 36px;
	padding: 0;
	list-style: none;
}

.sp-menu-content__topics > li {
	margin: 0;
}

.sp-menu-content__topics a {
	display: block;
	padding: 4px 12px;
	border: 1px solid color-mix(in srgb, currentColor 28%, transparent);
	border-radius: 999px;
	font-family: var(--sp-text);
	font-size: 13px;
	transition: border-color 0.2s ease;
}

.sp-menu-content__topics a:is(:hover, :focus-visible) {
	border-color: currentColor;
	text-decoration: none;
}

/* Las páginas, solo en móvil: en escritorio ya están en la cabecera. */
.sp-menu-content .sp-menu-content__pages {
	display: none;
}

/* Abajo del todo: el lema y el interruptor de modo. */
.sp-menu-content .sp-menu-content__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	margin-top: auto;
	padding-top: 18px;
	border-top: 1px solid var(--sp-menu-rule);
}

.sp-menu-content__controls {
	display: flex;
	flex: none;
	align-items: center;
	gap: 22px;
}

.sp-menu-content .sp-menu-content__tagline {
	margin: 0;
	color: color-mix(in srgb, currentColor 70%, transparent);
	font-family: var(--sp-sans);
	font-size: 10.5px;
	line-height: 1.35;
	letter-spacing: var(--sp-track);
	text-transform: uppercase;
}

@media (min-width: 1025px) {
	.sp-menu {
		overflow: hidden;
		background: rgba(0, 0, 0, 0.28);
		transition: opacity 0.3s linear;
	}

	.sp-menu.is-open {
		transition: opacity 0.2s linear;
	}

	.sp-menu .sp-menu__panel {
		position: absolute;
		inset: 0 0 0 auto;
		width: clamp(400px, 34vw, 540px);
		min-height: 0;
		padding: calc(var(--sp-toggle-top, 24px) + var(--sp-toggle-height, 26px) + 56px) clamp(32px, 4vw, 64px) 40px;
		overflow-y: auto;
		overscroll-behavior: contain;
		background: var(--sp-menu-ink);
		transform: translateX(100%);
		transition: transform 377ms cubic-bezier(0.5, 0.29, 0.43, 0.96);
	}

	.sp-menu.is-open .sp-menu__panel {
		transform: none;
	}

	.sp-menu-content {
		min-height: calc(100dvh - var(--sp-toggle-top, 24px) - var(--sp-toggle-height, 26px) - 96px);
	}

	/* La página, un poco a la izquierda mientras el panel entra. */
	.wp-site-blocks {
		position: relative;
		left: 0;
		transition: left 435ms cubic-bezier(0.72, 0.17, 0.29, 0.87);
	}

	html.sp-menu-is-open .wp-site-blocks {
		left: -24px;
	}
}

/* =====================================================================
   5. MÓVIL: los controles, como en escritorio, sin el de modo
   ===================================================================== */

/* Sin la barra de la cabecera, sus páginas van tras los temas: centradas y juntas. */
@media (max-width: 1024px) {
	.sp-menu-content .sp-menu-content__pages {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 0 14px;
		margin-bottom: 20px;
		font-family: var(--sp-sans);
		font-size: 10px;
		line-height: 1;
		letter-spacing: 0.12em;
		text-transform: uppercase;
	}

	.sp-menu-content__pages a {
		padding-block: 17px;
	}

	.sp-menu-content .sp-menu-content__topics {
		margin-bottom: 16px;
	}
}

@media (max-width: 781px) {
	:root {
		--sp-header-top: 12px;
		--pfolio-header: 76px;
		--pfolio-header-compact: 56px;
	}

	.pfolio-header.pfolio-header {
		grid-template-columns: 1fr auto;
	}

	.pfolio-header .pfolio-nav {
		display: none;
	}

	/* El modo y el idioma solo están en el menú. */
	.pfolio-site-header :is(.sp-mode, .pfolio-lang) {
		display: none;
	}

	/* Zona táctil de 44px de alto en el selector de idioma. */
	.sp-menu .pfolio-lang a {
		padding-block: 17px;
	}

	/* Zona táctil de 44px de alto, sin cambiar cómo se ven. */
	.pfolio-site-header :is(.sp-search-toggle, .sp-menu-toggle),
	.sp-menu .sp-mode {
		position: relative;
	}

	:is(.sp-search-toggle, .sp-menu-toggle, .sp-search-hub__close, .sp-menu__close, .sp-menu .sp-mode)::before {
		content: "";
		position: absolute;
		inset: calc(50% - 22px) -8px;
	}

	.sp-search-hub__body {
		grid-template-columns: minmax(0, 1fr);
	}

	/* Sin resultados aún, la frase no deja hueco. */
	.sp-search-hub__results:not(:has(li)) {
		margin-bottom: -12px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sp-search-hub__panel,
	.sp-search-hub__field::after,
	.sp-menu li,
	.sp-menu .sp-menu__panel,
	.sp-lens *,
	.sp-burger *,
	.sp-contrast,
	.wp-site-blocks {
		transition: none;
	}

	.sp-search-hub__list li {
		animation: none;
	}
}