/*
Theme Name: Paperkite
Theme URI: https://paperkite.io
Author: Paperkite
Description: A warm, editorial block theme built for product studios and growth: big serif headlines, a pastel tile per product, and an Aurora dark style. Pairs with the Paperkite plugin.
Requires at least: 6.6
Tested up to: 6.9
Requires PHP: 8.2
Version: 0.2.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: paperkite
Tags: block-patterns, full-site-editing, editor-style, wide-blocks, style-variations
*/

/* Only what theme.json can't express. */

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 2px solid var(--wp--preset--color--contrast);
	outline-offset: 3px;
}

/* 44px minimum touch targets for small text links. */
.wp-block-navigation-item__content,
.wp-block-post-terms a,
.wp-block-query-pagination a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}

/* Headline emphasis: <em> inside a heading picks up the primary colour. */
:where(h1, h2, h3) em {
	color: var(--wp--preset--color--primary);
}

/* A second emphasised word takes the accent colour ("executed … actually"). */
:where(h1, h2) em ~ em {
	color: var(--wp--preset--color--accent);
}

/* On a primary-coloured band, emphasis switches to the highlight colour. */
.has-primary-background-color :where(h1, h2, h3) em {
	color: var(--wp--preset--color--highlight);
}

/* Block styles: Tile, Chip, Sticker, Rule above. */
.is-style-pk-tile {
	border-radius: var(--wp--custom--radius--lg);
	padding: clamp(1.5rem, 3vw, 2.5rem);
}

.is-style-pk-chip,
.is-style-pk-sticker {
	display: inline-block;
	width: fit-content;
	padding: 0.4rem 0.9rem;
	border-radius: 999px;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
}
.is-style-pk-chip:not(.has-background) {
	background: var(--wp--preset--color--tint-2);
}
.is-style-pk-sticker {
	background: var(--wp--preset--color--highlight);
	color: var(--wp--preset--color--contrast);
	transform: rotate(-3deg);
}

.is-style-pk-rule {
	border-top: 2px solid color-mix(in srgb, currentColor 35%, transparent);
	padding-top: var(--wp--preset--spacing--40);
}

/* Cards that lift on hover. Add the "is-style-pk-lift" class or the block style. */
.is-style-pk-lift {
	transition: transform var(--wp--custom--motion--base) var(--wp--custom--motion--ease);
}
.is-style-pk-lift:hover {
	transform: translateY(-4px);
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
	.is-style-pk-lift:hover {
		transform: none;
	}
}