/*
 * Qawwam motion.
 *
 * Every rule here is progressive enhancement and nothing in it is required to
 * read the site:
 *
 * 1. All motion sits inside `prefers-reduced-motion: no-preference`, so readers
 *    who ask for reduced motion get the static layout with no overrides needed.
 * 2. Scroll-driven reveals sit inside `@supports (animation-timeline: view())`
 *    and need no JavaScript, no IntersectionObserver, and no inline styles.
 * 3. Hidden states live only in keyframes, never on the element itself. If a
 *    timeline is inactive — an unsupported browser, a page too short to
 *    scroll, a print stylesheet — the element keeps its ordinary visible base
 *    style instead of disappearing.
 */

@media (prefers-reduced-motion: no-preference) {

	html {
		scroll-behavior: smooth;
	}

	.qawwam-site-intro__spinner {
		animation: qawwam-intro-spin 700ms linear infinite;
	}

	.qawwam-site-intro__spinner img {
		animation: qawwam-intro-counter-spin 700ms linear infinite;
	}

	.qawwam-page-turn {
		transition: transform 420ms cubic-bezier(0.65, 0, 0.35, 1);
	}

	.qawwam-page-turn.is-turning {
		transform: scaleX(1.08) skewX(0);
	}

	.qawwam-reading-progress__bar {
		transition: transform 100ms linear;
	}

	/* Masthead and footer. A growing rule replaces a decorative underline. */
	.qawwam-primary-navigation .wp-block-navigation-item__content,
	.qawwam-footer-navigation .wp-block-navigation-item__content {
		background-image: linear-gradient(var(--qawwam-yellow), var(--qawwam-yellow));
		background-position: 0 100%;
		background-repeat: no-repeat;
		background-size: 0% 2px;
		transition: background-size 200ms cubic-bezier(0.22, 0.61, 0.36, 1), color 160ms ease;
	}

	.qawwam-primary-navigation .wp-block-navigation-item__content:hover,
	.qawwam-primary-navigation .wp-block-navigation-item__content:focus-visible,
	.qawwam-footer-navigation .wp-block-navigation-item__content:hover,
	.qawwam-footer-navigation .wp-block-navigation-item__content:focus-visible {
		background-size: 100% 2px;
	}

	.qawwam-masthead__search {
		transition: max-width 260ms cubic-bezier(0.22, 0.61, 0.36, 1);
	}

	.qawwam-masthead__search .wp-block-search__inside-wrapper {
		transition: background-color 200ms ease, border-color 180ms ease, box-shadow 220ms ease;
	}

	.qawwam-masthead__search .wp-block-search__button {
		transition: background-color 180ms ease, color 180ms ease, transform 180ms ease;
	}

	.qawwam-masthead__search .wp-block-search__button:hover {
		transform: scale(1.06);
	}

	.qawwam-masthead__wordmark img {
		transition: opacity 180ms ease;
	}

	.qawwam-masthead__wordmark a:hover img {
		opacity: 0.82;
	}

	/* Featured reading. The marker leads the eye toward the article. */
	.qawwam-featured-row__arrow,
	.qawwam-featured-row__number {
		transition: background-color 200ms ease, color 200ms ease, transform 220ms cubic-bezier(0.22, 0.61, 0.36, 1);
	}

	.qawwam-featured-row:hover .qawwam-featured-row__arrow,
	.qawwam-featured-row:focus-within .qawwam-featured-row__arrow {
		transform: translateX(0.4rem);
	}

	.qawwam-featured-row__title {
		transition: transform 240ms cubic-bezier(0.22, 0.61, 0.36, 1);
	}

	.qawwam-featured-row:hover .qawwam-featured-row__title,
	.qawwam-featured-row:focus-within .qawwam-featured-row__title {
		transform: translateX(0.4rem);
	}

	/* Covers. A restrained lift, never a rounded floating card. */
	.qawwam-shelf__item,
	.qawwam-issue-card,
	.qawwam-article-card,
	.qawwam-archive-card {
		transition: border-color 220ms ease;
	}

	.qawwam-shelf__cover img,
	.qawwam-issue-card__image img,
	.qawwam-article-card__image img,
	.qawwam-archive-card__image img,
	.qawwam-hero__cover img {
		transition: transform 460ms cubic-bezier(0.22, 0.61, 0.36, 1);
	}

	.qawwam-shelf__item:hover .qawwam-shelf__cover img,
	.qawwam-shelf__item:focus-within .qawwam-shelf__cover img,
	.qawwam-issue-card:hover .qawwam-issue-card__image img,
	.qawwam-issue-card:focus-within .qawwam-issue-card__image img,
	.qawwam-article-card:hover .qawwam-article-card__image img,
	.qawwam-article-card:focus-within .qawwam-article-card__image img,
	.qawwam-archive-card:hover .qawwam-archive-card__image img,
	.qawwam-archive-card:focus-within .qawwam-archive-card__image img {
		transform: scale(1.035);
	}

	.qawwam-hero__cover:hover img,
	.qawwam-issue-page__cover:hover img {
		transform: scale(1.015);
	}

	.qawwam-issue-card .wp-block-read-more,
	.qawwam-article-card .wp-block-read-more,
	.qawwam-recent-issues__all a,
	.qawwam-button .wp-block-button__link {
		transition: background-color 180ms ease, background-size 220ms cubic-bezier(0.22, 0.61, 0.36, 1), color 180ms ease, border-color 180ms ease, transform 180ms ease;
	}

	.qawwam-issue-card:hover .wp-block-read-more,
	.qawwam-article-card:hover .wp-block-read-more,
	.qawwam-recent-issues__all a:hover,
	.qawwam-button .wp-block-button__link:hover {
		transform: translateY(-2px);
	}

	/* Articles and Issues pages. Category chips fill in, titles' underlines
	   grow, and pagination gets the same chip treatment as the categories. */
	.qawwam-articles-departments__links a,
	.qawwam-article-card__meta a,
	.qawwam-article-query .wp-block-query-pagination a,
	.qawwam-issues-main .wp-block-query-pagination a {
		transition: background-color 180ms ease;
	}

	.qawwam-article-card .wp-block-post-title a,
	.qawwam-issue-card .wp-block-post-title a,
	.qawwam-article-sidebar__item-title {
		transition: background-size 220ms cubic-bezier(0.22, 0.61, 0.36, 1);
	}

	/* Departments. Yellow sweeps across the row instead of snapping on. */
	.qawwam-editorial-index .qawwam-department-link a {
		background-color: transparent;
		background-image: linear-gradient(var(--qawwam-yellow), var(--qawwam-yellow));
		background-position: 0 0;
		background-repeat: no-repeat;
		background-size: 0% 100%;
		transition: background-size 300ms cubic-bezier(0.22, 0.61, 0.36, 1), color 180ms ease;
	}

	.qawwam-editorial-index .qawwam-department-link a:hover,
	.qawwam-editorial-index .qawwam-department-link a:focus-visible {
		background-color: transparent;
		background-size: 100% 100%;
	}

	/* Issue pages. */
	.qawwam-issue-page__contents-title a,
	.qawwam-issue-page__contents-page {
		transition: text-decoration-thickness 160ms ease, transform 200ms cubic-bezier(0.22, 0.61, 0.36, 1);
	}

	.qawwam-issue-page__contents-row:hover .qawwam-issue-page__contents-page,
	.qawwam-issue-page__contents-row:focus-within .qawwam-issue-page__contents-page {
		transform: translateY(-2px);
	}

	/*
	 * Scroll-driven editorial reveals. Reserved for section transitions, cover
	 * shelves, and card grids — never applied to article body text, so reading
	 * is never waiting on an animation.
	 */
	@supports (animation-timeline: view()) {

		.qawwam-featured-row,
		.qawwam-shelf > li,
		.qawwam-archive-grid > li,
		.qawwam-department-link,
		.qawwam-issue-page__contents-row {
			animation: qawwam-rise linear both;
			animation-range: entry 5% entry 65%;
			animation-timeline: view();
		}

		/* Article and Issue covers travel fully from left to right without a fade. */
		.qawwam-articles-grid > li,
		.qawwam-issue-grid > li {
			animation: qawwam-issue-slide-in linear both;
			animation-range: entry 5% entry 75%;
			animation-timeline: view();
		}

		.qawwam-section-head,
		.qawwam-articles-header,
		.qawwam-issue-page__intro > *,
		.qawwam-issue-page__viewer-heading > *,
		.qawwam-issue-page__contents-heading > *,
		.qawwam-issue-page__newsletter-copy > * {
			animation: qawwam-lift linear both;
			animation-range: entry 0% entry 60%;
			animation-timeline: view();
		}

		.qawwam-issue-page__viewer-frame,
		.qawwam-newsletter__panel,
		.qawwam-hero__cover {
			animation: qawwam-settle linear both;
			animation-range: entry 0% entry 70%;
			animation-timeline: view();
		}
	}
}

@keyframes qawwam-intro-spin {
	to {
		transform: rotate(360deg);
	}
}

@keyframes qawwam-intro-counter-spin {
	to {
		transform: rotate(-360deg);
	}
}

@keyframes qawwam-rise {
	from {
		opacity: 0;
		transform: translateY(1.75rem);
	}
}

@keyframes qawwam-lift {
	from {
		opacity: 0;
		transform: translateY(1rem);
	}
}

@keyframes qawwam-settle {
	from {
		opacity: 0;
		transform: scale(0.975) translateY(1.25rem);
	}
}

@keyframes qawwam-issue-slide-in {
	from {
		transform: translate3d(-100%, 0, 0);
	}
}