/* ----------------------------------------------------------------------
   utilities.css — sr-only, reveal, print, misc helpers
---------------------------------------------------------------------- */

/* Screen-reader only */
.sr-only {
	position: absolute;
	width: 1px; height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
	border: 0;
}

/* Reveal (reveal.js toggles .is-visible) */
[data-reveal] {
	opacity: 0;
	transform: translateY(16px);
	transition: opacity 500ms var(--ease), transform 500ms var(--ease);
	will-change: opacity, transform;
}
[data-reveal].is-visible {
	opacity: 1;
	transform: none;
}
@media (prefers-reduced-motion: reduce) {
	[data-reveal] { opacity: 1; transform: none; transition: none; }
}

/* Alignment helpers */
.text-center { text-align: center; }
.text-left   { text-align: left; }
.text-right  { text-align: right; }

/* Colour helpers */
.c-accent     { color: var(--c-accent); }
.c-accent-sec { color: var(--c-accent-sec); }
.c-white      { color: var(--c-white); }
.c-dim        { color: var(--c-text-dim); }

/* Font helpers */
.f-mono    { font-family: var(--f-mono); }
.f-heading { font-family: var(--f-heading); }
.italic    { font-style: italic; }

/* Spacing helpers */
.mt-0  { margin-top: 0; }
.mt-16 { margin-top: var(--s-16); }
.mt-24 { margin-top: var(--s-24); }
.mt-32 { margin-top: var(--s-32); }
.mt-48 { margin-top: var(--s-48); }
.mb-16 { margin-bottom: var(--s-16); }
.mb-24 { margin-bottom: var(--s-24); }
.mb-32 { margin-bottom: var(--s-32); }
.mb-48 { margin-bottom: var(--s-48); }

/* Flex helpers */
.flex { display: flex; }
.flex-wrap { flex-wrap: wrap; }
.flex-col { flex-direction: column; }
.items-center { align-items: center; }
.items-start  { align-items: flex-start; }
.justify-between { justify-content: space-between; }
.justify-center  { justify-content: center; }
.gap-8  { gap: var(--s-8); }
.gap-16 { gap: var(--s-16); }
.gap-24 { gap: var(--s-24); }

/* Full-width block */
.w-full { width: 100%; }

/* Anchor target offset for fixed header */
[id] { scroll-margin-top: calc(var(--header-h) + var(--s-24)); }

/* Print */
@media print {
	body { color: #111; background: #fff; padding-top: 0; }
	.header, .footer, .age-gate, .kw-form__actions, .filter-bar, .tabs, .hero__ornament, .ornament, .rule-paired { display: none !important; }
	a { color: #111; text-decoration: underline; }
	a[href]::after { content: " (" attr(href) ")"; font-size: 0.8em; color: #666; }
	h1, h2, h3 { color: #111; }
	.plate { padding: 0; background: transparent; }
	.plate__inner { padding: 0; background: transparent; }
}
