/*
 * We The Revolt blocks: shared styles.
 *
 * These rules make every plugin block readable with any theme. The We The
 * Revolt theme supplies the colours and fonts through theme.json, and these
 * rules read them as CSS variables with sensible fallbacks, so the same block
 * looks right on a paper section or an ink section.
 */

:root {
	--wtr-ink: var(--wp--preset--color--ink, #0b0b0c);
	--wtr-bone: var(--wp--preset--color--bone, #f2efe8);
	--wtr-paper: var(--wp--preset--color--paper, #faf8f4);
	--wtr-orange: var(--wp--preset--color--orange, #FF5A1F);
	--wtr-red: var(--wp--preset--color--red, #C8102E);
	--wtr-ash: var(--wp--preset--color--ash, #8a8780);
	--wtr-display: var(--wp--preset--font-family--display, "Instrument Serif", Georgia, serif);
	--wtr-sans: var(--wp--preset--font-family--sans, "Geist", system-ui, sans-serif);
	--wtr-mono: var(--wp--preset--font-family--mono, "Geist Mono", ui-monospace, monospace);
	--wtr-line: color-mix(in srgb, currentColor 16%, transparent);
	--wtr-ease: cubic-bezier(.2, .7, .1, 1);
}

/* ---------- Buttons ---------- */
.wtr-btn {
	display: inline-flex;
	align-items: center;
	gap: .6em;
	padding: .95em 1.4em;
	border: 1px solid currentColor;
	border-radius: 2px;
	background: transparent;
	color: inherit;
	font: 500 .78rem/1 var(--wtr-mono);
	letter-spacing: .08em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .25s var(--wtr-ease), color .25s var(--wtr-ease), border-color .25s var(--wtr-ease);
}
.wtr-btn:focus-visible { outline: 2px solid var(--wtr-orange); outline-offset: 3px; }
.wtr-btn--light { background: var(--wtr-bone); border-color: var(--wtr-bone); color: var(--wtr-ink); }
.wtr-btn--light:hover { background: var(--wtr-orange); border-color: var(--wtr-orange); }
.wtr-btn--accent { background: var(--wtr-orange); border-color: var(--wtr-orange); color: var(--wtr-ink); }
.wtr-btn--accent:hover { background: var(--wtr-bone); border-color: var(--wtr-bone); }
.wtr-btn--ghost-light { border-color: color-mix(in srgb, currentColor 40%, transparent); }
.wtr-btn--outline:hover { background: var(--wtr-ink); color: var(--wtr-bone); border-color: var(--wtr-ink); }
.wtr-btn--ghost-light:hover { background: var(--wtr-bone); color: var(--wtr-ink); border-color: var(--wtr-bone); }
.wtr-btn__play {
	width: 0; height: 0;
	border-left: .62em solid currentColor;
	border-top: .38em solid transparent;
	border-bottom: .38em solid transparent;
}

/* ---------- Video facade and modal ---------- */
.wtr-video {
	position: relative;
	overflow: hidden;
	background: var(--wtr-ink);
	color: var(--wtr-bone);
	border-radius: 2px;
}
.wtr-video__poster, .wtr-video iframe, .wtr-video video {
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	object-fit: cover; border: 0;
}
.wtr-video__poster { filter: grayscale(.35) contrast(1.05); transition: transform 1.2s var(--wtr-ease), filter .6s; }
.wtr-video__play {
	position: absolute; inset: 0;
	display: flex; align-items: center; justify-content: center; gap: 1rem;
	border: 0; background: linear-gradient(0deg, rgba(11,11,12,.55), rgba(11,11,12,.1));
	color: inherit; cursor: pointer;
	font: 500 .78rem/1 var(--wtr-mono); letter-spacing: .12em; text-transform: uppercase;
}
.wtr-video__icon {
	width: 4.5rem; height: 4.5rem; border-radius: 50%;
	border: 1px solid currentColor; position: relative;
	transition: background-color .3s, transform .4s var(--wtr-ease);
}
.wtr-video__icon::after {
	content: ""; position: absolute; left: 53%; top: 50%; transform: translate(-50%, -50%);
	border-left: 14px solid currentColor; border-top: 9px solid transparent; border-bottom: 9px solid transparent;
}
.wtr-video:hover .wtr-video__poster { transform: scale(1.03); filter: grayscale(0) contrast(1.05); }
.wtr-video:hover .wtr-video__icon { background: var(--wtr-orange); color: var(--wtr-ink); transform: scale(1.06); border-color: var(--wtr-orange); }
.wtr-video__play:focus-visible { outline: 2px solid var(--wtr-orange); outline-offset: -6px; }
.wtr-video__soon {
	position: absolute; left: 1.25rem; bottom: 1.25rem;
	font: 500 .72rem/1 var(--wtr-mono); letter-spacing: .12em; text-transform: uppercase;
	padding: .6em .8em; background: rgba(11,11,12,.7);
}

.wtr-modal {
	width: min(1200px, 94vw); max-width: none; max-height: none;
	padding: 0; border: 0; background: transparent; overflow: visible;
}
.wtr-modal::backdrop { background: rgba(11,11,12,.92); backdrop-filter: blur(6px); }
.wtr-modal__stage { aspect-ratio: 16 / 9; background: #000; }
.wtr-modal__stage iframe, .wtr-modal__stage video { width: 100%; height: 100%; border: 0; display: block; }
.wtr-modal__close {
	position: absolute; right: 0; top: -3rem;
	width: 2.5rem; height: 2.5rem; border: 1px solid rgba(242,239,232,.4); border-radius: 50%;
	background: transparent; color: var(--wtr-bone); font-size: 1.4rem; line-height: 1; cursor: pointer;
}
.wtr-modal__close:hover { background: var(--wtr-bone); color: var(--wtr-ink); }
html.wtr-modal-open { overflow: hidden; }

/* ---------- Labels used across blocks ---------- */
.wtr-showcase__eyebrow, .wtr-showcase__facts, .wtr-showcase__billing, .wtr-film__index, .wtr-film__facts, .wtr-film__billing, .wtr-film__status,
.wtr-film-details dt, .wtr-person__role, .wtr-tier__cta, .wtr-give__fund, .wtr-showcase__soon, .wtr-film__soon {
	font-family: var(--wtr-mono);
	font-size: .72rem;
	letter-spacing: .1em;
	text-transform: uppercase;
}

/* ---------- Film showcase (cinematic hero) ---------- */
.wtr-showcase {
	position: relative; isolation: isolate;
	display: flex; align-items: flex-end;
	min-height: 78vh;
	color: var(--wtr-bone); background: var(--wtr-ink);
	overflow: hidden;
}
.wtr-showcase--full { min-height: 100svh; }
.wtr-showcase--medium { min-height: 64vh; }
.wtr-showcase--short { min-height: 48vh; }
.wtr-showcase__media { position: absolute; inset: 0; z-index: -1; }
.wtr-showcase__img, .wtr-showcase__loop { width: 100%; height: 100%; object-fit: cover; filter: grayscale(.2); }
.wtr-showcase__grade {
	position: absolute; inset: 0;
	background:
		linear-gradient(0deg, rgba(11,11,12,.96) 0%, rgba(11,11,12,.55) 38%, rgba(11,11,12,0) 70%),
		linear-gradient(90deg, rgba(11,11,12,.7) 0%, rgba(11,11,12,0) 60%);
}
.wtr-showcase__body {
	width: 100%; max-width: var(--wp--style--global--wide-size, 1320px); margin: 0 auto;
	padding: clamp(2rem, 6vw, 6rem) var(--wp--style--root--padding-right, clamp(1rem, 4vw, 3rem));
}
.wtr-showcase__eyebrow { margin: 0 0 1.25rem; color: var(--wtr-orange); }
.wtr-showcase__title {
	margin: 0; max-width: 14ch;
	font: 400 clamp(3.4rem, 10vw, 9.5rem)/.9 var(--wtr-display); letter-spacing: -.02em;
}
.wtr-showcase__facts { margin: 1.5rem 0 0; opacity: .75; }
.wtr-showcase__logline { margin: 1.25rem 0 0; max-width: 46ch; font-size: clamp(1.05rem, 1.6vw, 1.3rem); line-height: 1.5; opacity: .9; }
.wtr-showcase__actions { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; margin-top: 2.25rem; }
.wtr-showcase__soon { opacity: .6; padding-right: .5rem; }

/* ---------- Film grid ---------- */
.wtr-films { display: grid; gap: clamp(2rem, 4vw, 4rem); }
.wtr-film { position: relative; }
.wtr-film__poster {
	position: relative; display: block; aspect-ratio: 2 / 3; overflow: hidden;
	background: var(--wtr-ink); color: var(--wtr-bone); border-radius: 2px;
}
.wtr-film__poster img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--wtr-ease); }
.wtr-film:hover .wtr-film__poster img { transform: scale(1.035); }
.wtr-film__poster-type { position: absolute; inset: auto 1.25rem 1.25rem; font: 400 2.4rem/1 var(--wtr-display); }
.wtr-film__status {
	position: absolute; top: 1rem; left: 1rem;
	padding: .5em .7em; background: var(--wtr-orange); color: var(--wtr-ink); font-size: .65rem;
}
.wtr-film__title { margin: 0; font: 400 clamp(2rem, 3.4vw, 3.2rem)/1 var(--wtr-display); letter-spacing: -.01em; }
.wtr-film__title a { color: inherit; text-decoration: none; }
.wtr-film__title a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .12em; }
.wtr-film__facts { margin: .9rem 0 0; opacity: .65; }
.wtr-film__index { margin: 0 0 1rem; color: var(--wtr-ash); }
.wtr-film__logline { margin: 1.25rem 0 0; font: italic 400 1.4rem/1.3 var(--wtr-display); max-width: 34ch; }
.wtr-film__excerpt { margin: 1rem 0 0; max-width: 52ch; line-height: 1.6; opacity: .82; }
.wtr-film__actions { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; margin-top: 1.75rem; }
.wtr-film__soon { opacity: .55; margin-right: .5rem; }

.wtr-films--slate .wtr-film {
	display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(1.5rem, 5vw, 5rem);
	align-items: center; padding-top: clamp(2rem, 4vw, 4rem); border-top: 1px solid var(--wtr-line);
}
.wtr-films--slate .wtr-film:nth-child(even) .wtr-film__poster { order: 2; }
.wtr-films--posters { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 2rem 1.5rem; }
.wtr-films--posters .wtr-film__body { padding-top: 1rem; }
.wtr-films--posters .wtr-film__title { font-size: 1.6rem; }
@media (max-width: 760px) {
	.wtr-films--slate .wtr-film { grid-template-columns: 1fr; }
	.wtr-films--slate .wtr-film:nth-child(even) .wtr-film__poster { order: 0; }
	.wtr-films--slate .wtr-film__poster { max-width: 420px; }
}

/* ---------- Film details ---------- */
.wtr-film-details__trailer { margin-bottom: clamp(2rem, 5vw, 4rem); }
.wtr-film-details__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 2.5rem clamp(2rem, 4vw, 4rem); }
.wtr-film-details dl { margin: 0; }
.wtr-film-details dl > div { display: grid; grid-template-columns: 9rem 1fr; gap: 1rem; padding: .85rem 0; border-top: 1px solid var(--wtr-line); }
.wtr-film-details dt { opacity: .6; padding-top: .2em; }
.wtr-film-details dd { margin: 0; }
.wtr-film-details__laurels { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; }
.wtr-film-details__laurels li { font: italic 400 1.25rem/1.3 var(--wtr-display); padding-left: 1.5rem; position: relative; }
.wtr-film-details__laurels li::before { content: ""; position: absolute; left: 0; top: .6em; width: .8rem; height: 1px; background: currentColor; }
.wtr-film-details__cta { display: flex; flex-direction: column; align-items: flex-start; gap: .75rem; }
.wtr-film-details__cta p { margin: 0 0 .5rem; font: 400 1.6rem/1.2 var(--wtr-display); }

/* ---------- Team ---------- */
.wtr-team {
	list-style: none; margin: 0; padding: 0;
	display: grid; grid-template-columns: repeat(var(--wtr-cols, 4), minmax(0, 1fr)); gap: 3rem 1.5rem;
}
@media (max-width: 1000px) { .wtr-team { grid-template-columns: repeat(min(var(--wtr-cols, 4), 3), minmax(0, 1fr)); } }
@media (max-width: 640px) { .wtr-team { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 1rem; } }
.wtr-person__photo { margin: 0 0 1rem; aspect-ratio: 4 / 5; overflow: hidden; background: color-mix(in srgb, currentColor 8%, transparent); border-radius: 2px; position: relative; }
.wtr-person__photo img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); transition: filter .6s, transform 1s var(--wtr-ease); }
.wtr-person:hover .wtr-person__photo img { filter: grayscale(0); transform: scale(1.02); }
.wtr-person__initials { position: absolute; inset: 0; display: grid; place-items: center; font: 400 3rem/1 var(--wtr-display); opacity: .5; }
.wtr-person__name { margin: 0; font: 400 1.6rem/1.1 var(--wtr-display); }
.wtr-person__name a { color: inherit; }
.wtr-person__role { margin: .5rem 0 0; opacity: .7; line-height: 1.5; }
.wtr-person__hub { display: block; opacity: .75; }
.wtr-person__bio { margin: .75rem 0 0; font-size: .95rem; line-height: 1.55; opacity: .8; }

/* ---------- Giving ---------- */
.wtr-give { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; }
@media (max-width: 900px) { .wtr-give { grid-template-columns: 1fr; } }
.wp-block-column .wtr-give { grid-template-columns: 1fr; }
.wtr-give__fund { margin: 0 0 1rem; display: inline-block; padding: .5em .75em; background: var(--wtr-orange); color: var(--wtr-ink); }
.wtr-give__heading { margin: 0; font: 400 clamp(2.6rem, 5vw, 4.4rem)/.95 var(--wtr-display); letter-spacing: -.015em; }
.wtr-give__intro { margin: 1.25rem 0 0; font-size: 1.1rem; line-height: 1.6; max-width: 44ch; opacity: .85; }
.wtr-give__tiers, .wtr-tiers { list-style: none; margin: 2rem 0 0; padding: 0; display: grid; gap: .6rem; }
.wtr-tiers { grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 1rem; margin: 0; }
.wtr-tier {
	display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: .2rem 1.25rem;
	padding: 1.1rem 1.25rem; border: 1px solid var(--wtr-line); border-radius: 2px;
	color: inherit; text-decoration: none;
	transition: border-color .25s, background-color .25s, transform .35s var(--wtr-ease);
}
.wtr-tier:hover { border-color: currentColor; transform: translateX(3px); }
.wtr-tier.is-selected { border-color: var(--wtr-ink); background: var(--wtr-orange); color: var(--wtr-ink); }
.wtr-tier__amount { grid-row: span 2; font: 400 2.4rem/1 var(--wtr-display); }
.wtr-tier__amount small { font: 400 .8rem/1 var(--wtr-mono); opacity: .6; margin-left: .15em; }
.wtr-tier__name { font-weight: 600; }
.wtr-tier__line { font-size: .92rem; opacity: .75; line-height: 1.45; }
.wtr-tiers .wtr-tier { grid-template-columns: 1fr; height: 100%; align-content: start; padding: 1.75rem 1.5rem; }
.wtr-tiers .wtr-tier__amount { grid-row: auto; font-size: 3.4rem; margin-bottom: .75rem; }
.wtr-tier__cta { margin-top: 1.25rem; }
.wtr-tiers .wtr-tier:hover { transform: translateY(-3px); background: var(--wtr-orange); color: var(--wtr-ink); border-color: var(--wtr-orange); }
.wtr-give__promise { margin: 1.5rem 0 0; font-size: .85rem; line-height: 1.55; opacity: .65; max-width: 48ch; }
.wtr-give__form { background: var(--wtr-paper); color: var(--wtr-ink); border-radius: 2px; padding: clamp(.5rem, 1.5vw, 1rem); min-height: 520px; box-shadow: 0 40px 80px -40px rgba(11,11,12,.35); }
.wtr-give__form iframe { display: block; width: 100%; border: 0; }
.wtr-give__ways { grid-column: 1 / -1; border-top: 1px solid var(--wtr-line); padding-top: 1.25rem; }
.wtr-give__ways summary { cursor: pointer; font: 500 .78rem/1 var(--wtr-mono); letter-spacing: .1em; text-transform: uppercase; }
.wtr-give__ways dl { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 1.5rem; margin: 1.5rem 0 0; }
.wtr-give__ways dt { font-weight: 600; margin-bottom: .35rem; }
.wtr-give__ways dd { margin: 0; opacity: .8; line-height: 1.55; }

/* ---------- Motion preferences ---------- */
@media (prefers-reduced-motion: reduce) {
	.wtr-btn, .wtr-video__poster, .wtr-video__icon, .wtr-film__poster img, .wtr-person__photo img, .wtr-tier { transition: none !important; }
	.wtr-film:hover .wtr-film__poster img, .wtr-video:hover .wtr-video__poster, .wtr-person:hover .wtr-person__photo img { transform: none; }
}

/* Title card billing: the films are made with partners, and say so. */
.wtr-showcase__billing { margin: 1.1rem 0 0; opacity: .9; }
.wtr-film__billing { margin: .7rem 0 0; opacity: .85; }
.wtr-film__billing + .wtr-film__facts { margin-top: .35rem; }