@charset "UTF-8";
@font-face {
	font-family: "Pretendard Variable";
	font-weight: 45 920;
	font-style: normal;
	font-display: swap;
	src: url("/home-studio/assets/PretendardStudio.woff2") format("woff2");
}
:root {
	--bg: #ededed;
	--panel: #e3e3e3;
	--ink: #0c0c0c;
	--muted: #707070;
	--line: #cacaca;
	--acid: #151515;
	--paper: #101010;
	--dark: #e5e5e5;
	--radius: 12px;
	--font:
		"Pretendard Variable", Pretendard, "Noto Sans KR", "Malgun Gothic",
		sans-serif;
	--mono: "Courier New", monospace;
	--ease: cubic-bezier(0.23, 1, 0.32, 1);
}
*,
*::before,
*::after {
	box-sizing: border-box;
}
html {
	scroll-behavior: smooth;
	scroll-padding-top: 7.5rem;
}
body {
	margin: 0;
	background: var(--bg);
	color: var(--ink);
	font-family: var(--font);
	-webkit-font-smoothing: antialiased;
	font-size: 0.9375rem;
	line-height: 1.6;
	word-break: keep-all;
}
body.locked {
	overflow: hidden;
}
::selection {
	color: var(--dark);
	background: var(--acid);
}
a {
	color: inherit;
	text-decoration: none;
}
button,
input {
	font: inherit;
}
button {
	color: inherit;
	cursor: pointer;
}
button:disabled {
	cursor: not-allowed;
	opacity: 0.65;
}
button,
a,
input,
summary {
	-webkit-tap-highlight-color: transparent;
}
button {
	border: 0;
}
button:focus-visible,
a:focus-visible,
summary:focus-visible,
input:focus-visible,
[tabindex]:focus-visible {
	outline: 2px solid var(--acid);
	outline-offset: 5px;
}
.light-section :focus-visible {
	outline-color: #9c9c9c;
}
img,
video {
	display: block;
	max-width: 100%;
	height: auto;
}
svg {
	display: inline-block;
	width: 22px;
	height: 22px;
	flex-shrink: 0;
	vertical-align: middle;
}
h1,
h2,
h3,
p {
	margin: 0;
}
h1,
h2,
h3 {
	line-height: 1.24;
	letter-spacing: -0.055em;
}
h1 {
	font-weight: 750;
}
h2 {
	font-size: clamp(1.875rem, 3.5vw, 2.8rem);
	font-weight: 700;
}
h3 {
	font-size: 1.5rem;
	font-weight: 650;
}
p {
	line-height: 1.85;
}
.container {
	width: min(1360px, calc(100% - 96px));
	margin-inline: auto;
}
.section {
	padding-block: 7rem;
}
.mono,
.eyebrow {
	font-family: var(--mono);
	font-size: 0.6875rem;
	letter-spacing: 0.08em;
	line-height: 1.5;
}
.muted {
	color: var(--muted);
}
.eyebrow {
	display: flex;
	align-items: center;
	gap: 0.625rem;
	font-weight: 600;
	margin-bottom: 1.75rem;
}
.status-dot {
	display: inline-block;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--acid);
	flex-shrink: 0;
	box-shadow: 0 0 10px #1515151a;
}
.section-number {
	margin-left: auto;
}
.button {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 2.125rem;
	padding: 1.0625rem 1.375rem;
	min-height: 56px;
	border-radius: 6px;
	font-weight: 650;
	font-size: 0.875rem;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
	white-space: nowrap;
}
.button svg {
	width: 19px;
	height: 19px;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.button:hover svg {
	transform: translateX(4px);
}
.button:active {
	transform: scale(0.98);
}
.button.primary {
	background: var(--acid);
	color: var(--dark);
}
.button.primary:hover {
	background: #0e0e0e;
}
.button.ghost {
	border: 1px solid #a9a9a9;
	background: transparent;
	color: var(--ink);
}
.button.ghost:hover {
	background: #0c0c0c0a;
	border-color: var(--ink);
}
.button.ink {
	background: var(--dark);
	color: var(--ink);
}
.button.outline-dark {
	border: 1px solid #5a5a5a;
	color: var(--dark);
	background: transparent;
}
.button.outline-dark:hover {
	background: #212121;
}
.button-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}
.text-link {
	display: inline-flex;
	gap: 1.125rem;
	align-items: center;
	font-size: 0.875rem;
	font-weight: 600;
	padding-block: 0.625rem;
}
.text-link svg {
	width: 18px;
	height: 18px;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.text-link:hover svg {
	transform: translateX(4px);
}
.fineprint {
	font-size: 0.75rem;
	color: var(--muted);
	line-height: 1.75;
}
.sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
}
.skip-link {
	position: fixed;
	left: 20px;
	top: -100px;
	background: var(--acid);
	color: var(--dark);
	padding: 0.75rem 1.25rem;
	z-index: 300;
}
.skip-link:focus {
	top: 15px;
}
[hidden] {
	display: none !important;
}
/* Navigation: responsive, keyboard accessible mega menus. */
.site-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background: #edededee;
	backdrop-filter: blur(20px);
	border-bottom: 1px solid #cbcbcb;
}
.nav-wrap {
	width: min(1440px, calc(100% - 72px));
	height: 80px;
	margin: auto;
	display: flex;
	align-items: center;
	gap: 3.5rem;
}
.wordmark {
	font-family: Arial, sans-serif;
	font-size: 1.5rem;
	letter-spacing: -1px;
	font-weight: 750;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	white-space: nowrap;
}
.wordmark img {
	width: 30px;
	height: 30px;
	object-fit: contain;
}
.wordmark-dot {
	font-size: 0.5625rem;
	align-self: flex-start;
	line-height: 32px;
	letter-spacing: 0;
	margin-left: -0.375rem;
}
.desktop-nav {
	display: flex;
	align-items: center;
	gap: 1.75rem;
	height: 100%;
}
.nav-trigger,
.nav-link {
	font-size: 0.8125rem;
	font-weight: 550;
	white-space: nowrap;
	color: #3e3e3e;
}
.nav-trigger {
	display: flex;
	align-items: center;
	gap: 0.5625rem;
	background: none;
	padding: 1.125rem 0;
}
.nav-link:hover,
.nav-trigger:hover,
.nav-trigger.current,
.nav-link.current {
	color: var(--ink);
}
.chevron {
	display: block;
	width: 5px;
	height: 5px;
	transform: rotate(45deg);
	border-right: 1px solid;
	border-bottom: 1px solid;
	margin-top: -0.1875rem;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.nav-trigger[aria-expanded="true"] .chevron {
	transform: rotate(225deg);
	margin-top: 0.1875rem;
}
.nav-actions {
	margin-left: auto;
	display: flex;
	align-items: center;
	gap: 1.5625rem;
}
.icon-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	background: none;
	border-radius: 6px;
}
.icon-button:hover {
	background: #0c0c0c0c;
}
.search-trigger {
	color: #3c3c3c;
}
.search-trigger svg {
	width: 20px;
	height: 20px;
}
.login-link {
	font-size: 0.8125rem;
	white-space: nowrap;
}
.nav-cta {
	display: flex;
	align-items: center;
	gap: 1.375rem;
	background: var(--acid);
	color: var(--dark);
	padding: 0.6875rem 1.0625rem;
	border-radius: 5px;
	font-size: 0.75rem;
	font-weight: 700;
	white-space: nowrap;
}
.nav-cta svg {
	width: 17px;
	height: 17px;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.nav-cta:hover svg {
	transform: translate(2px, -2px);
}
.mobile-toggle {
	display: none;
}
.mega-menu {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	background: #e5e5e5;
	display: grid;
	grid-template-columns: 1.25fr repeat(4, 1fr);
	gap: 2rem;
	padding: 2.625rem max(3rem, calc((100vw - 85rem) / 2));
	border-bottom: 1px solid #bbbbbb;
	box-shadow: 0 25px 35px #ffffff55;
	max-height: calc(100dvh - 80px);
	overflow: auto;
}
.mega-intro {
	font-family: Arial, sans-serif;
	font-size: 1.625rem;
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -1px;
	padding-right: 1.5rem;
}
.mega-intro em {
	color: var(--acid);
	font-weight: 500;
	font-family: Georgia, serif;
}
.mega-intro p {
	font-family: var(--font);
	font-size: 0.8125rem;
	font-weight: 400;
	line-height: 1.8;
	color: var(--muted);
	letter-spacing: 0;
	margin-top: 1.25rem;
}
.mega-intro > a {
	display: flex;
	align-items: center;
	gap: 0.9375rem;
	font-family: var(--font);
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1.5;
	letter-spacing: 0;
	margin-top: 1.5rem;
	color: var(--acid);
}
.mega-column > .mono {
	display: block;
	color: var(--muted);
	margin-bottom: 1rem;
}
.mega-column a {
	display: flex;
	justify-content: space-between;
	gap: 0.5rem;
	align-items: center;
	padding: 0.375rem 0;
	font-size: 0.75rem;
	color: #272727;
}
.mega-column a span {
	opacity: 0;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.mega-column a:hover {
	color: var(--acid);
}
.mega-column a:hover span {
	opacity: 1;
}
.mega-menu.compact {
	grid-template-columns: 1fr 3fr;
}
.mega-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.5rem 1.5rem;
}
.mega-grid a {
	padding: 1rem 0;
	border-bottom: 1px solid var(--line);
	display: flex;
	justify-content: space-between;
	font-size: 0.8125rem;
	align-items: center;
	gap: 0.625rem;
}
.mega-grid a:hover {
	color: var(--acid);
}
.mega-grid svg {
	width: 16px;
	height: 16px;
}
.menu-scrim {
	position: fixed;
	inset: 80px 0 0;
	background: #ffffff88;
	backdrop-filter: blur(4px);
	z-index: 90;
}
.mobile-nav {
	padding: 1.25rem 1.5rem 1.875rem;
	background: var(--bg);
	max-height: calc(100dvh - 70px);
	overflow: auto;
}
.mobile-nav a {
	display: flex;
	justify-content: space-between;
	padding: 1rem 0;
	border-bottom: 1px solid var(--line);
	font-size: 1.25rem;
}
/* Home: a cinematic stage and a working miniature timeline. */
.hero {
	padding-top: 2.25rem;
}
.hero-topline {
	display: flex;
	justify-content: space-between;
	color: #656565;
}
.hero-topline > span:first-child {
	display: flex;
	gap: 0.625rem;
	align-items: center;
}
.hero-heading {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1.875rem;
	padding: 2.375rem 0 2.8125rem;
}
.hero h1 {
	font-size: clamp(2.75rem, 5.55vw, 4.44rem);
	letter-spacing: -0.05em;
	line-height: 1.2;
	position: relative;
}
.hero h1 > span {
	color: var(--acid);
	white-space: nowrap;
}
.headline-spark {
	display: inline-block;
	font-family: Arial, sans-serif;
	font-size: 0.8em;
	line-height: 0;
	vertical-align: baseline;
	margin-left: 0.625rem;
	transform: translateY(-4px);
}
.hero-aside {
	max-width: 285px;
	padding: 0 0.125rem 0.125rem;
}
.hero-aside p {
	color: #565656;
	font-size: 0.875rem;
	line-height: 1.85;
	margin-bottom: 1.25rem;
}
.hero-aside > .button {
	min-width: 245px;
}
.hero-aside > .text-link {
	margin-top: 0.4375rem;
	color: #4f4f4f;
	font-size: 0.75rem;
}
.hero-media {
	height: clamp(360px, 40vw, 590px);
	position: relative;
	overflow: hidden;
	border-radius: 10px 10px 0 0;
	background: #c5c5c5;
}
.hero-media > img,
.hero-media > video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 53%;
	transform: scale(var(--hero-scale, 1));
	will-change: transform;
}
.hero-media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(
		0deg,
		#efefefa1 0%,
		transparent 45%,
		#efefef28 100%
	);
	pointer-events: none;
}
.hero-media-top {
	position: absolute;
	z-index: 2;
	left: 30px;
	right: 30px;
	top: 25px;
	display: flex;
	justify-content: space-between;
	color: #0c0c0c;
	mix-blend-mode: screen;
	font-size: 0.625rem;
	text-shadow: 0 1px 8px #ffffff66;
}
.hero-film-title {
	position: absolute;
	left: 45px;
	top: 21%;
	color: #0e0e0e;
	font-family: Arial, sans-serif;
	font-weight: 900;
	font-size: clamp(3rem, 7.5vw, 6rem);
	letter-spacing: -0.08em;
	line-height: 0.86;
	z-index: 2;
	text-shadow: 0 2px 10px #d2d2d215;
	transform: translateX(var(--title-offset, 0px));
}
.hero-film-title > span {
	font-family: Georgia, serif;
	font-weight: 400;
	font-style: italic;
	font-size: 1.15em;
	letter-spacing: -0.08em;
}
.hero-media-bottom {
	position: absolute;
	z-index: 2;
	bottom: 28px;
	left: 32px;
	right: 32px;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}
.hero-media-bottom > .mono {
	font-size: 0.5625rem;
	color: #1b1b1b;
}
.showreel-button {
	display: flex;
	align-items: center;
	gap: 0.8125rem;
	border-radius: 50px;
	background: #0d0d0d13;
	backdrop-filter: blur(18px);
	padding: 0.5625rem 1.4375rem 0.5625rem 0.5625rem;
	border: 1px solid #0c0c0c3d;
	text-align: left;
	color: #0c0c0c;
	font-size: 0.8125rem;
	font-weight: 500;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.showreel-button small {
	display: block;
	font-family: var(--mono);
	font-size: 0.5rem;
	letter-spacing: 0.06em;
	opacity: 0.7;
	margin-top: 0.125rem;
}
.play-disc {
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--ink);
	color: var(--dark);
	font-size: 1.4375rem;
	width: 42px;
	height: 42px;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.showreel-button:hover {
	background: #0d0d0d28;
}
.showreel-button:hover .play-disc {
	transform: rotate(45deg);
}
.frame-corner {
	position: absolute;
	width: 13px;
	height: 13px;
	border-color: #10101080;
	z-index: 2;
	pointer-events: none;
}
.frame-corner.tl {
	top: 13px;
	left: 13px;
	border-left: 1px solid;
	border-top: 1px solid;
}
.frame-corner.tr {
	top: 13px;
	right: 13px;
	border-right: 1px solid;
	border-top: 1px solid;
}
.frame-corner.bl {
	bottom: 13px;
	left: 13px;
	border-left: 1px solid;
	border-bottom: 1px solid;
}
.frame-corner.br {
	bottom: 13px;
	right: 13px;
	border-right: 1px solid;
	border-bottom: 1px solid;
}
.mini-timeline {
	background: #dedede;
	border: 1px solid #bcbcbc;
	border-radius: 0 0 10px 10px;
	overflow: hidden;
	padding: 0 1.375rem 0.9375rem;
}
.timeline-toolbar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 43px;
	border-bottom: 1px solid #c5c5c5;
}
.timeline-toolbar > .mono {
	display: flex;
	align-items: center;
	gap: 0.4375rem;
	font-size: 0.5625rem;
	color: #424242;
}
.timeline-toolbar > div {
	display: flex;
	align-items: center;
	gap: 1rem;
}
.timeline-toolbar .mono {
	font-size: 0.5625rem;
}
.timecode {
	color: var(--acid);
	font-variant-numeric: tabular-nums;
}
.timeline-toolbar button {
	width: 25px;
	height: 27px;
	font-size: 0.6875rem;
	color: var(--acid);
}
.timeline-demo-label {
	color: #737373;
}
.timeline-ruler {
	display: flex;
	justify-content: space-between;
	height: 24px;
	padding: 0.4375rem 0.125rem 0 2.25rem;
	color: #848484;
	font-size: 0.5rem;
	background: repeating-linear-gradient(
		90deg,
		transparent 0,
		transparent calc(2.5% - 1px),
		#acacac40 calc(2.5% - 1px),
		#acacac40 2.5%
	);
	background-size: 100% 4px;
	background-repeat: no-repeat;
	background-position: bottom;
}
.timeline-tracks {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.3125rem;
	padding-top: 0.375rem;
}
.track {
	display: flex;
	gap: 0.375rem;
	height: 25px;
	align-items: stretch;
}
.track > span {
	width: 24px;
	color: #676767;
	font-size: 0.6875rem;
	display: flex;
	align-items: center;
	flex-shrink: 0;
}
.text-track > div {
	background: #3e3e3e;
	color: #d2d2d2;
	border: 1px solid #212121;
	border-radius: 3px;
	margin-left: 11%;
	width: 37%;
	font-family: var(--mono);
	font-size: 0.5rem;
	padding: 0.25rem 0.5rem;
	overflow: hidden;
	white-space: nowrap;
}
.video-track {
	height: 35px;
}
.video-track > div {
	flex: 1;
	background-image: linear-gradient(#dcdcdc2a, #dcdcdc80), var(--clip-bg);
	background-size:
		auto,
		auto 80px;
	background-position: center;
	border-radius: 3px;
	border: 1px solid #6d6d6d8c;
	font-family: var(--mono);
	font-size: 0.5rem;
	padding: 0.25rem 0.5rem;
	overflow: hidden;
	color: #0d0d0d;
}
.video-track > div:first-of-type {
	flex: 1.8;
}
.audio-track {
	height: 27px;
}
.wave-track {
	display: flex;
	gap: 0.1875rem;
	flex: 1;
	background: #b4b4b4;
	border: 1px solid #898989;
	border-radius: 3px;
	align-items: center;
	overflow: hidden;
	padding-inline: 0.5rem;
	position: relative;
}
.wave-track > span {
	position: absolute;
	left: 12px;
	z-index: 1;
	color: #1e1e1e;
	font-family: var(--mono);
	font-size: 0.5rem;
	text-shadow: 1px 1px 4px #cdcdcd;
}
.wave-track i {
	flex: 1;
	min-width: 1px;
	background: #5b5b5b;
	height: var(--wave);
	opacity: 0.5;
}
.playhead {
	position: absolute;
	top: -19px;
	bottom: 0;
	left: 0;
	border-left: 1px solid var(--acid);
	z-index: 2;
	pointer-events: none;
	filter: drop-shadow(0 0 5px #15151535);
}
.playhead i {
	position: absolute;
	top: 0;
	left: -4px;
	width: 7px;
	height: 7px;
	background: var(--acid);
	clip-path: polygon(0 0, 100% 0, 100% 60%, 50% 100%, 0 60%);
}
.timeline-scrub {
	position: absolute;
	top: -16px;
	left: 0;
	width: 100%;
	height: calc(100% + 16px);
	margin: 0;
	opacity: 0;
	cursor: ew-resize;
	z-index: 3;
}
.timeline-tracks:focus-within {
	outline: 1px solid var(--acid);
	outline-offset: 3px;
}
.hero-footnote {
	display: flex;
	justify-content: space-between;
	color: #838383;
	padding-top: 0.8125rem;
	font-size: 0.5rem;
}
.ticker {
	border-block: 1px solid #c9c9c9;
	margin-top: 3.4375rem;
	overflow: hidden;
	background: #e6e6e6;
}
.ticker > div {
	display: flex;
	align-items: center;
	gap: 2.5rem;
	width: max-content;
	padding: 1.0625rem 0;
	animation: none;
}
.ticker span {
	font-family: var(--font);
	font-size: 1.0625rem;
	letter-spacing: 0.02em;
	font-weight: 560;
	line-height: 1;
	color: #7f7f7f;
}
.ticker i {
	font-style: normal;
	font-size: 0.8125rem;
	color: var(--acid);
	line-height: 1;
}
.section-heading {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 2.5rem;
	margin-bottom: 2.75rem;
}
.section-heading > p,
.section-heading > div > p {
	font-size: 0.875rem;
	color: #626262;
	line-height: 1.95;
	max-width: 405px;
}
.section-heading .button {
	margin-bottom: 0.25rem;
}
.editorial-grid {
	display: grid;
	grid-template-columns: 1.35fr 1fr;
	gap: 1.375rem;
}
.editorial-card {
	position: relative;
	min-height: 455px;
	border-radius: 10px;
	overflow: hidden;
	isolation: isolate;
}
.editorial-card > img {
	height: 100%;
	width: 100%;
	object-fit: cover;
	position: absolute;
	inset: 0;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.editorial-card:hover > img {
	transform: scale(1.035);
}
.editorial-card::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	background: linear-gradient(0deg, #f2f2f2ed, transparent 77%);
}
.editorial-overlay {
	position: absolute;
	bottom: 31px;
	left: 30px;
	right: 30px;
	z-index: 1;
}
.editorial-overlay > .mono {
	display: block;
	font-size: 0.5625rem;
	color: #252525;
	margin-bottom: 0.875rem;
}
.editorial-overlay h3 {
	font-size: 2.1875rem;
	color: #0c0c0c;
	line-height: 1.3;
	margin-bottom: 0.9375rem;
}
.editorial-overlay > span:last-child {
	font-size: 0.75rem;
	color: #383838;
}
.circle-arrow {
	position: absolute;
	bottom: 28px;
	right: 28px;
	z-index: 2;
	width: 45px;
	height: 45px;
	border: 1px solid #0c0c0c45;
	border-radius: 50%;
	display: grid;
	place-items: center;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.editorial-card:hover .circle-arrow {
	background: var(--acid);
	color: var(--dark);
	transform: rotate(45deg);
}
.floating-tool {
	position: absolute;
	top: 37px;
	right: 25px;
	z-index: 2;
	background: #dddddddc;
	backdrop-filter: blur(12px);
	border: 1px solid #0c0c0c29;
	border-radius: 7px;
	padding: 0.8125rem 1.0625rem;
	transform: rotate(5deg);
	box-shadow: 0 10px 25px #ffffff33;
	width: 172px;
}
.floating-tool > span {
	font-size: 0.5rem;
	letter-spacing: 1px;
	color: #464646;
}
.floating-tool strong {
	display: block;
	font-family: var(--mono);
	font-size: 0.5625rem;
	font-weight: 400;
	padding-block: 0.5rem;
	color: #6f6f6f;
}
.floating-tool b {
	color: #1a1a1a;
	font-weight: 500;
	margin-right: 0.625rem;
}
.floating-tool > div {
	color: var(--acid);
	font-size: 1rem;
	line-height: 1.2;
}
.caption-pill {
	position: absolute;
	z-index: 2;
	top: 47%;
	left: 50%;
	transform: translateX(-50%) rotate(-3deg);
	background: #0c0c0c;
	padding: 0.4375rem 0.6875rem;
	border-radius: 3px;
	color: #e8e8e8;
	white-space: nowrap;
	font-size: 1.1875rem;
	font-weight: 750;
	box-shadow: 0 5px 20px #ffffff44;
}
.caption-pill mark {
	background: var(--acid);
	padding: 0 0.1875rem;
}
.utility-strip {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin-top: 2.0625rem;
	border-block: 1px solid var(--line);
}
.utility-strip > a {
	padding: 1.25rem 1.25rem 1.25rem 0;
	display: grid;
	grid-template-columns: 22px 1fr;
	align-items: center;
	gap: 0.125rem 0.5rem;
}
.utility-strip > a > span:first-child {
	grid-row: span 2;
	color: var(--acid);
	font-size: 1.5625rem;
	font-weight: 200;
}
.utility-strip > a > span:nth-child(2) {
	font-size: 0.75rem;
	font-weight: 600;
}
.utility-strip small {
	font-size: 0.5rem;
	font-family: var(--mono);
	letter-spacing: 0.06em;
	color: #7b7b7b;
}
.utility-strip > a:hover {
	color: var(--acid);
}
/* Feature directory and cards. */
.light-section {
	background: var(--paper);
	color: var(--dark);
}
.light-section .status-dot {
	background: #757575;
}
.light-section .eyebrow {
	color: #939393;
}
.light-section .muted {
	color: #818181;
}
.feature-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 2.625rem 1.5rem;
}
.feature-card {
	display: block;
	min-width: 0;
}
.feature-art {
	height: 225px;
	position: relative;
	border-radius: 9px;
	background: #dadada;
	overflow: hidden;
}
.feature-art > img {
	height: 100%;
	width: 100%;
	object-fit: cover;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.feature-art::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, #e5e5e590, transparent 70%);
	pointer-events: none;
}
.feature-card:hover .feature-art > img {
	transform: scale(1.07);
}
.art-tag {
	position: absolute;
	top: 17px;
	left: 17px;
	z-index: 1;
	border: 1px solid #0c0c0c4a;
	background: #e7e7e72e;
	backdrop-filter: blur(12px);
	border-radius: 30px;
	padding: 0.25rem 0.5rem;
	color: #0c0c0c;
	font-size: 0.5rem;
}
.art-number {
	position: absolute;
	bottom: 8px;
	right: 19px;
	font-family: Georgia, serif;
	font-size: 3.875rem;
	font-style: italic;
	line-height: 1.3;
	color: #0c0c0c;
	z-index: 1;
	opacity: 0.85;
}
.art-1 > img {
	object-position: 70% center;
}
.art-2 > img {
	transform: scale(1.17);
	filter: grayscale(1);
}
.feature-card:hover .art-2 > img {
	filter: grayscale(0);
	transform: scale(1.1);
}
.art-3 > img {
	filter: sepia(0.18) saturate(1.3);
}
.art-4 > img {
	object-position: 28% center;
}
.art-5 > img {
	filter: grayscale(0.6);
}
.feature-copy {
	padding-top: 1.1875rem;
}
.feature-copy > .mono {
	font-size: 0.5625rem;
	color: #737373;
}
.feature-copy h3 {
	font-size: 1.3125rem;
	font-weight: 650;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 0.4375rem;
	gap: 0.75rem;
	line-height: 1.4;
}
.feature-copy h3 svg {
	width: 20px;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.feature-card:hover h3 svg {
	transform: translate(3px, -3px);
}
.feature-copy p {
	font-size: 0.8125rem;
	color: #5f5f5f;
	line-height: 1.8;
	margin-top: 0.5625rem;
	max-width: 95%;
	overflow-wrap: anywhere;
}
.light-section .feature-copy > .mono {
	color: #8d8d8d;
}
.light-section .feature-copy p {
	color: #8d8d8d;
}
.sample-caption {
	position: absolute;
	z-index: 2;
	left: 15%;
	right: 15%;
	bottom: 20%;
	padding: 0.5625rem 0.5rem;
	text-align: center;
	font-size: 1.0625rem;
	color: #0c0c0c;
	font-weight: 750;
	line-height: 1.6;
	text-shadow: 1px 2px 3px #ffffffcc;
	white-space: nowrap;
}
.sample-caption mark {
	background: var(--acid);
	color: var(--dark);
	padding: 0.0625rem 0.25rem;
	text-shadow: none;
}
.motion-path {
	position: absolute;
	left: 16%;
	right: 16%;
	bottom: 26%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: var(--acid);
	font-size: 1.75rem;
	z-index: 2;
	transform: rotate(-17deg);
	text-shadow: 0 2px 4px #ffffff;
}
.motion-path i {
	height: 1px;
	background: var(--acid);
	flex: 1;
	box-shadow: 0 1px 5px #ffffff;
}
.cutout-label {
	position: absolute;
	left: 50%;
	bottom: 28%;
	transform: translateX(-50%) rotate(-6deg);
	font-family: var(--mono);
	font-size: 0.6875rem;
	z-index: 2;
	background: var(--acid);
	color: var(--dark);
	padding: 0.5625rem 0.75rem;
	border-radius: 4px;
	white-space: nowrap;
}
.comparison {
	position: relative;
	border-radius: 10px;
	overflow: hidden;
	aspect-ratio: 2.07;
	background: #c6c6c6;
}
.comparison-images {
	position: absolute;
	inset: 0;
}
.comparison-images > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: saturate(1.22) contrast(1.07);
}
.before-layer {
	position: absolute;
	inset: 0;
	clip-path: inset(0 calc(100% - var(--split)) 0 0);
}
.before-layer > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: saturate(0.18) contrast(0.7) brightness(1.14);
}
.compare-label {
	position: absolute;
	top: 25px;
	font-family: var(--mono);
	font-size: 0.625rem;
	letter-spacing: 0.1em;
	background: #e0e0e0a8;
	color: white;
	backdrop-filter: blur(8px);
	padding: 0.375rem 0.6875rem;
	border-radius: 4px;
}
.compare-label.before {
	left: 25px;
}
.compare-label.after {
	right: 25px;
}
.compare-line {
	position: absolute;
	top: 0;
	bottom: 0;
	left: var(--split);
	width: 2px;
	background: #0c0c0c;
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
}
.compare-line > span {
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: #0c0c0c;
	color: var(--dark);
	font-size: 1.5625rem;
	width: 45px;
	height: 45px;
	flex-shrink: 0;
	box-shadow: 0 0 20px #ffffff33;
}
.comparison input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	cursor: ew-resize;
	opacity: 0;
	margin: 0;
}
.comparison:focus-within {
	outline: 2px solid var(--acid);
	outline-offset: 5px;
}
.compare-hint {
	position: absolute;
	bottom: 22px;
	left: 50%;
	transform: translateX(-50%);
	background: #e0e0e09c;
	backdrop-filter: blur(12px);
	padding: 0.4375rem 0.875rem;
	font-size: 0.625rem;
	border: 1px solid #0c0c0c3a;
	border-radius: 20px;
	color: #0c0c0c;
	pointer-events: none;
	white-space: nowrap;
}
.color-meta {
	display: flex;
	justify-content: space-between;
	padding-top: 1.0625rem;
	color: #646464;
	font-size: 0.5625rem;
}
.creators-section {
	background: #e1e1e1;
	border-block: 1px solid #c8c8c8;
}
.creator-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.125rem;
}
.creator-card {
	aspect-ratio: 0.73;
	position: relative;
	overflow: hidden;
	border-radius: 9px;
	color: white;
}
.creator-card > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
	object-position: center;
}
.creator-card:nth-child(2) > img {
	object-position: 36%;
}
.creator-card:nth-child(4) > img {
	object-position: 36%;
	filter: sepia(0.35) saturate(0.75);
}
.creator-card::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, #ececece8, transparent 65%, #ececec30);
}
.creator-card > .mono {
	position: absolute;
	left: 18px;
	top: 18px;
	font-size: 0.5rem;
	z-index: 1;
	max-width: calc(100% - 30px);
}
.creator-card > div {
	position: absolute;
	bottom: 23px;
	left: 20px;
	right: 20px;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.625rem;
}
.creator-card h3 {
	font-size: 1.3125rem;
	letter-spacing: -0.06em;
}
.creator-card:hover > img {
	transform: scale(1.07);
}
.creator-card svg {
	width: 22px;
	height: 22px;
}
.workflow-tabs {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border-bottom: 1px solid var(--line);
}
.workflow-tabs button {
	padding: 1.375rem 1.125rem;
	border-bottom: 2px solid transparent;
	margin-bottom: -0.0625rem;
	display: flex;
	gap: 1.25rem;
	align-items: center;
	background: transparent;
	color: #6e6e6e;
	font-size: 1rem;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.workflow-tabs button span {
	font-family: var(--mono);
	font-size: 0.625rem;
}
.workflow-tabs button[aria-selected="true"] {
	border-color: var(--acid);
	color: var(--ink);
}
.workflow-tabs button[aria-selected="true"] span {
	color: var(--acid);
}
.workflow-panel {
	display: grid;
	grid-template-columns: 0.65fr 1.35fr;
	gap: 3.4375rem;
	align-items: center;
	padding-top: 2.5rem;
}
.workflow-panel > div > .mono {
	color: var(--acid);
	font-size: 0.5625rem;
}
.workflow-panel h3 {
	font-size: 1.9375rem;
	margin: 0.9375rem 0 1.25rem;
	line-height: 1.4;
}
.workflow-panel p {
	font-size: 0.8125rem;
	color: #5f5f5f;
}
.workflow-panel .text-link {
	margin-top: 1.25rem;
}
.workflow-image {
	border-radius: 9px;
	overflow: hidden;
	border: 1px solid #bbbbbb;
	background: #e0e0e0;
	box-shadow: 0 22px 55px #ffffff33;
}
.workflow-image img {
	width: 100%;
	height: auto;
}
.workflow-image > .mono {
	display: block;
	text-align: center;
	padding: 0.75rem;
	color: #747474;
	font-size: 0.5625rem;
}
.guide-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 2.8125rem 1.5625rem;
}
.guide-card > div {
	aspect-ratio: 1.67;
	position: relative;
	border-radius: 8px;
	overflow: hidden;
	margin-bottom: 1.125rem;
}
.guide-card > div > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.guide-card:hover > div > img {
	transform: scale(1.06);
}
.guide-arrow {
	position: absolute;
	bottom: 13px;
	right: 13px;
	background: var(--acid);
	color: var(--dark);
	width: 34px;
	height: 34px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	transform: translateY(60px);
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.guide-arrow svg {
	width: 18px;
}
.guide-card:hover .guide-arrow {
	transform: translateY(0);
}
.guide-card > .mono {
	font-size: 0.625rem;
	color: #6d6d6d;
}
.guide-card h3 {
	font-size: 1.3125rem;
	margin: 0.625rem 0;
	line-height: 1.5;
}
.guide-card p {
	font-size: 0.8125rem;
	line-height: 1.8;
	color: #5d5d5d;
}
.light-section .guide-card > .mono {
	color: #868686;
}
.light-section .guide-card p {
	color: #8d8d8d;
}
.home-faq {
	display: grid;
	grid-template-columns: 0.8fr 1.2fr;
	gap: 4.6875rem;
}
.home-faq h2 {
	font-size: 2.625rem;
	margin-bottom: 1.5625rem;
}
.home-faq .eyebrow {
	font-size: 0.5625rem;
}
.faq-list {
	border-top: 1px solid #b6b6b6;
}
.faq-list details {
	border-bottom: 1px solid #c4c4c4;
}
.faq-list summary {
	list-style: none;
	cursor: pointer;
	padding: 1.5rem 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 0.9375rem;
	font-weight: 550;
	gap: 1.5625rem;
}
.faq-list summary::-webkit-details-marker {
	display: none;
}
.faq-list summary > span {
	font-family: Arial, sans-serif;
	font-size: 1.5rem;
	line-height: 1;
	font-weight: 300;
	color: #595959;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.faq-list details[open] summary > span {
	transform: rotate(45deg);
	color: var(--acid);
}
.faq-list details[open] summary {
	color: var(--acid);
}
.faq-list details p {
	font-size: 0.8125rem;
	color: #585858;
	padding: 0 2.1875rem 1.5625rem 0;
}
.closing-cta {
	background: var(--acid);
	color: var(--dark);
	overflow: hidden;
}
.closing-cta > .container {
	position: relative;
	padding-top: 4.375rem;
	padding-bottom: 1.5625rem;
}
.closing-cta .eyebrow {
	font-size: 0.625rem;
}
.closing-cta h2 {
	font-size: clamp(2.5rem, 5.1vw, 4.08rem);
	line-height: 1.2;
	max-width: 900px;
	position: relative;
	z-index: 1;
}
.closing-cta h2 > span {
	color: #8d8d8d;
}
.closing-cta .button {
	margin-top: 1.875rem;
	min-width: 205px;
	position: relative;
	z-index: 1;
}
.cta-star {
	position: absolute;
	right: 3%;
	top: 65px;
	font-family: Arial, sans-serif;
	font-size: 20.625rem;
	line-height: 1;
	font-weight: 300;
	transform: rotate(12deg);
	color: #353535;
	pointer-events: none;
}
.closing-bottom {
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-top: 1px solid #5b5b5b;
	margin-top: 4.0625rem;
	padding-top: 1.375rem;
	font-size: 0.5625rem;
	color: #9c9c9c;
}
/* Shared inner pages. */
.page-intro {
	padding-top: 5.625rem;
	padding-bottom: 2.1875rem;
}
.page-intro h1 {
	font-size: clamp(2.375rem, 4.7vw, 3.76rem);
	line-height: 1.28;
	letter-spacing: -0.04em;
}
.page-intro > p {
	font-size: 1rem;
	color: #555555;
	line-height: 1.85;
	margin-top: 1.625rem;
	max-width: 760px;
}
.page-intro.centered {
	text-align: center;
}
.page-intro.centered .eyebrow {
	justify-content: center;
}
.page-intro.centered > p {
	margin-inline: auto;
}
.catalog-section {
	padding-top: 2.1875rem;
}
.catalog-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.25rem;
	border-block: 1px solid var(--line);
	padding: 1.25rem 0;
}
.filter-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 0.375rem;
}
.filter-tabs button {
	background: transparent;
	color: #585858;
	font-size: 0.8125rem;
	padding: 0.625rem 1rem;
	border-radius: 30px;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.filter-tabs button.active {
	background: var(--acid);
	color: var(--dark);
	font-weight: 650;
}
.filter-tabs button:hover:not(.active) {
	background: #d3d3d3;
}
.catalog-search input {
	width: 200px;
	background: #e1e1e1;
	border: 1px solid #bcbcbc;
	border-radius: 5px;
	color: var(--ink);
	padding: 0.625rem 0.75rem;
	font-size: 0.75rem;
}
.catalog-search input::placeholder {
	color: #707070;
}
.catalog-meta {
	display: flex;
	justify-content: space-between;
	color: #767676;
	padding: 1.375rem 0;
	font-size: 0.5625rem;
}
.empty-message {
	text-align: center;
	padding-block: 3.75rem;
	color: var(--muted);
}
.breadcrumbs {
	display: flex;
	gap: 0.8125rem;
	align-items: center;
	padding-top: 1.9375rem;
	color: #6f6f6f;
	font-size: 0.6875rem;
	flex-wrap: wrap;
}
.breadcrumbs a:hover {
	color: var(--acid);
}
.breadcrumbs [aria-current] {
	color: #323232;
}
.detail-hero {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 3.125rem;
	align-items: center;
	padding: 3.75rem 0 4.375rem;
}
.detail-hero h1 {
	font-size: clamp(2.25rem, 3.8vw, 3.04rem);
	line-height: 1.3;
	letter-spacing: -0.064em;
}
.detail-hero p {
	font-size: 0.9375rem;
	color: #515151;
	margin: 1.4375rem 0 1.875rem;
	max-width: 480px;
}
.detail-hero .eyebrow {
	font-size: 0.625rem;
}
.detail-category {
	display: block;
	color: #858585;
	font-size: 0.5625rem;
	margin-top: 1.5625rem;
}
.detail-visual {
	aspect-ratio: 1.15;
	position: relative;
	overflow: hidden;
	border-radius: 10px;
	background: #d2d2d2;
}
.detail-visual > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.detail-visual::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, #e5e5e580, transparent 70%);
}
.visual-label {
	position: absolute;
	top: 23px;
	left: 23px;
	color: white;
	z-index: 1;
	font-size: 0.5625rem;
	mix-blend-mode: difference;
}
.visual-code {
	font-family: Georgia, serif;
	font-size: 6.875rem;
	font-style: italic;
	position: absolute;
	bottom: 20px;
	right: 22px;
	z-index: 1;
	line-height: 1;
	color: #0c0c0cc7;
}
.visual-code sup {
	font-family: Arial, sans-serif;
	font-size: 2.625rem;
	font-style: normal;
	vertical-align: top;
	padding-left: 0.4375rem;
}
.visual-background-removal > img {
	filter: grayscale(1);
}
.visual-filters > img {
	filter: saturate(1.3);
}
.visual-text-animation > img {
	filter: grayscale(0.7);
}
.detail-subnav {
	position: sticky;
	top: 80px;
	z-index: 50;
	background: #dddddded;
	border-block: 1px solid #bcbcbc;
	backdrop-filter: blur(16px);
}
.detail-subnav > .container {
	display: flex;
	align-items: center;
	gap: 2.1875rem;
	padding-block: 1rem;
	font-size: 0.75rem;
}
.detail-subnav span {
	font-weight: 650;
	margin-right: auto;
}
.detail-subnav a {
	color: #525252;
	white-space: nowrap;
}
.detail-subnav a:hover {
	color: var(--acid);
}
.benefit-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 2.1875rem;
}
.benefit {
	border-top: 1px solid #b4b4b4;
	padding-top: 1.5rem;
}
.benefit-number {
	display: block;
	font-family: Georgia, serif;
	color: var(--acid);
	font-size: 2.6875rem;
	font-weight: 400;
	font-style: italic;
	margin-bottom: 2.125rem;
	line-height: 1.1;
}
.benefit h3,
.benefit h2 {
	font-size: 1.5rem;
	margin-bottom: 0.9375rem;
	line-height: 1.45;
}
.benefit p {
	font-size: 0.875rem;
	line-height: 1.9;
	color: #565656;
}
.steps-layout {
	display: grid;
	grid-template-columns: 0.8fr 1.2fr;
	gap: 4.375rem;
}
.steps-layout > .text-link {
	margin-top: 1.25rem;
}
.numbered-steps {
	margin: 0;
	padding: 0;
	list-style: none;
}
.numbered-steps li {
	display: flex;
	gap: 1.875rem;
	border-top: 1px solid #424242;
	padding-block: 1.875rem;
}
.numbered-steps li > .mono {
	padding-top: 0.3125rem;
	color: #878787;
	font-size: 0.8125rem;
}
.numbered-steps h3 {
	font-size: 1.4375rem;
	line-height: 1.5;
}
.numbered-steps p {
	font-size: 0.8125rem;
	color: #8e8e8e;
	line-height: 1.8;
	margin-top: 0.75rem;
}
.solution-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 3.4375rem 1.875rem;
}
.solution-card > div {
	aspect-ratio: 1.75;
	border-radius: 9px;
	overflow: hidden;
	position: relative;
}
.solution-card img {
	height: 100%;
	width: 100%;
	object-fit: cover;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.solution-card > div::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, #e2e2e275, transparent 60%);
}
.solution-card > div > .mono {
	position: absolute;
	left: 22px;
	bottom: 20px;
	font-size: 0.5625rem;
	color: #0c0c0c;
	z-index: 1;
}
.solution-card:hover img {
	transform: scale(1.06);
}
.solution-card h2 {
	display: flex;
	justify-content: space-between;
	font-size: 1.5625rem;
	align-items: center;
	margin: 1.375rem 0 0.8125rem;
}
.solution-card p {
	font-size: 0.875rem;
	color: #595959;
}
.solution-hero {
	position: relative;
	min-height: 590px;
	overflow: hidden;
	border-radius: 12px;
	isolation: isolate;
	margin-top: 2.1875rem;
	padding: 4.0625rem 3.125rem;
	display: flex;
	align-items: center;
}
.solution-hero > img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: -2;
}
.solution-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, #f1f1f1db, transparent);
	z-index: -1;
}
.solution-hero h1 {
	font-size: clamp(2.125rem, 4.2vw, 3.36rem);
	line-height: 1.3;
	letter-spacing: -0.06em;
	color: #0c0c0c;
}
.solution-hero p {
	font-size: 0.9375rem;
	max-width: 490px;
	line-height: 1.9;
	color: #1a1a1a;
	margin: 1.375rem 0 1.6875rem;
}
.solution-hero .eyebrow {
	font-size: 0.625rem;
	color: var(--acid);
}
.article-page {
	width: min(1200px, calc(100% - 96px));
	margin: 3.75rem auto 0;
}
.article-page > header {
	max-width: 900px;
	margin: 0 auto 2.5rem;
}
.article-page h1 {
	font-size: clamp(2.125rem, 4.2vw, 3.36rem);
	line-height: 1.35;
	letter-spacing: -0.06em;
}
.article-page > header > p {
	color: #525252;
	font-size: 1.0625rem;
	line-height: 1.9;
	margin-top: 1.4375rem;
}
.article-byline {
	font-size: 0.5625rem;
	color: #848484;
	margin-top: 1.625rem;
}
.article-cover {
	aspect-ratio: 2.5;
	border-radius: 10px;
	overflow: hidden;
}
.article-cover > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.article-layout {
	display: grid;
	grid-template-columns: 250px 1fr;
	gap: 5rem;
	padding-top: 4.0625rem;
	align-items: start;
}
.article-layout > aside {
	position: sticky;
	top: 125px;
}
.article-layout > aside > .mono {
	color: #7c7c7c;
	font-size: 0.625rem;
	margin-bottom: 1.0625rem;
	display: block;
}
.article-layout > aside > a:not(.text-link) {
	font-size: 0.75rem;
	color: #555555;
	display: block;
	padding: 0.6875rem 0;
	border-bottom: 1px solid #c2c2c2;
	line-height: 1.8;
}
.article-layout > aside > a:hover {
	color: var(--acid);
}
.article-layout > aside > .text-link {
	margin-top: 1.5rem;
	font-size: 0.75rem;
}
.article-content > section {
	padding-bottom: 2.875rem;
	margin-bottom: 2.5rem;
	border-bottom: 1px solid #c2c2c2;
}
.article-content > section > .mono {
	color: var(--acid);
	font-size: 0.6875rem;
	display: block;
	margin-bottom: 0.9375rem;
}
.article-content h2 {
	font-size: 1.8125rem;
	line-height: 1.5;
	letter-spacing: -0.05em;
}
.article-content p {
	font-size: 1rem;
	line-height: 2.15;
	color: #444444;
	margin-top: 1.125rem;
}
.article-end {
	padding: 2rem;
	border: 1px solid #b2b2b2;
	border-radius: 10px;
	background: #e0e0e0;
}
.article-end > .mono {
	color: var(--acid);
}
.article-end h2 {
	font-size: 1.5625rem;
	margin: 0.9375rem 0 1.375rem;
}
/* Plans: real catalogue or explicitly labelled preview data. */
.billing-toggle {
	display: inline-flex;
	align-items: center;
	gap: 0.1875rem;
	background: #d3d3d3;
	padding: 0.3125rem;
	border: 1px solid #b6b6b6;
	border-radius: 7px;
	margin-top: 2.1875rem;
}
.billing-toggle button {
	border-radius: 4px;
	padding: 0.625rem 1.375rem;
	background: transparent;
	color: #555555;
	font-size: 0.8125rem;
	min-width: 100px;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.billing-toggle button.active {
	background: #0d0d0d;
	color: var(--dark);
	box-shadow: 0 1px 7px #ffffff33;
}
.billing-toggle button > span {
	font-size: 0.5625rem;
	padding: 0.1875rem 0.3125rem;
	border-radius: 3px;
	background: #9b9b9b44;
	margin-left: 0.3125rem;
	color: #393939;
}
.billing-toggle button.active > span {
	color: #929292;
	background: #1f1f1f;
}
.page-intro > .pricing-status {
	font-size: 0.6875rem;
	margin-top: 1.25rem;
	color: #767676;
}
.pricing-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.25rem;
	margin-top: 2.25rem;
	align-items: stretch;
}
.plan-card {
	border: 1px solid #bdbdbd;
	border-radius: 11px;
	padding: 2rem 1.8125rem;
	background: #e2e2e2;
	position: relative;
	display: flex;
	flex-direction: column;
}
.plan-card.featured {
	border-color: var(--acid);
	background: #d8d8d8;
	box-shadow: 0 0 55px #15151505;
}
.recommended {
	position: absolute;
	top: -17px;
	left: 20px;
	right: 20px;
	height: 31px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: var(--acid);
	color: var(--dark);
	font-size: 0.5625rem;
	padding: 0.375rem 0.8125rem;
	border-radius: 4px;
}
.recommended svg {
	width: 15px;
	height: 15px;
}
.plan-top > .mono {
	font-size: 0.5625rem;
	color: #696969;
}
.plan-top h2 {
	font-family: Arial, sans-serif;
	font-size: 2.375rem;
	letter-spacing: -1.5px;
	margin: 1.1875rem 0 0.625rem;
	font-weight: 650;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.plan-top h2 > span {
	color: var(--acid);
	font-size: 2.1875rem;
}
.plan-top > p {
	font-size: 0.75rem;
	color: #545454;
}
.price {
	display: flex;
	align-items: baseline;
	gap: 0.5rem;
	margin: 1.875rem 0 0.625rem;
	white-space: nowrap;
}
.price strong {
	font-family: Arial, sans-serif;
	font-size: clamp(2.75rem, 4vw, 3.2rem);
	line-height: 1.1;
	font-weight: 700;
	letter-spacing: -1.8px;
	font-variant-numeric: tabular-nums;
}
.price > span {
	color: #595959;
	font-size: 0.6875rem;
}
.plan-savings:not([hidden]) {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.625rem;
	margin-top: 1.25rem;
	font-size: 0.8125rem;
}
.plan-savings del {
	color: #666;
	font-variant-numeric: tabular-nums;
}
.plan-savings span {
	padding: 0.3rem 0.6rem;
	border-radius: 4px;
	background: #202020;
	color: #fff;
	font-weight: 700;
}
.plan-savings:not([hidden]) + .price {
	margin-top: 0.625rem;
}
.plan-charge {
	margin: 0 0 1rem;
	font-size: 0.8125rem;
	line-height: 1.6;
	color: #555;
}
.plan-charge:empty {
	display: none;
}
.plan-credit {
	font-size: 0.6875rem;
	line-height: 1.85;
	color: #616161;
	min-height: 42px;
	margin-bottom: 1.4375rem;
}
.plan-card > .button {
	width: 100%;
	white-space: normal;
	font-size: 0.8125rem;
	min-height: 50px;
	padding: 0.875rem 1.125rem;
}
.plan-card > .button:disabled {
	justify-content: center;
	opacity: 0.65;
}
.plan-card > ul {
	list-style: none;
	margin: 1.8125rem 0 0;
	padding: 1.4375rem 0 0;
	border-top: 1px solid #bababa;
	display: flex;
	flex-direction: column;
	gap: 0.875rem;
}
.plan-card > ul > li {
	font-size: 0.75rem;
	display: flex;
	gap: 0.625rem;
	align-items: baseline;
	color: #323232;
}
.check {
	color: var(--acid);
	font-family: Arial, sans-serif;
}
.comparison-table-wrap {
	width: 100%;
	overflow: auto;
	border-radius: 9px;
	border: 1px solid #b9b9b9;
}
.plan-table {
	border-collapse: collapse;
	table-layout: fixed;
	width: 100%;
	min-width: 650px;
	text-align: left;
}
.plan-table caption {
	display: none;
}
.plan-table th,
.plan-table td {
	padding: 1.125rem 1.5rem;
	border-bottom: 1px solid #c1c1c1;
	font-size: 0.875rem;
	vertical-align: middle;
}
.plan-table th:first-child {
	width: 32%;
}
.plan-table thead th {
	font-size: 0.9375rem;
	font-weight: 650;
	background: #dbdbdb;
}
.plan-table tbody th {
	font-weight: 500;
	color: #3c3c3c;
}
.plan-table td {
	color: #626262;
}
.plan-table tr:last-child > * {
	border-bottom: 0;
}
.plan-table th:nth-child(3),
.plan-table td:nth-child(3) {
	background: #cfcfcf63;
	color: #1b1b1b;
}
.comparison-table-wrap + .fineprint {
	margin-top: 1rem;
	font-size: 0.625rem;
}
.credits-layout {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 4.375rem;
	align-items: center;
}
.credits-layout h2 {
	font-size: 2.375rem;
	line-height: 1.3;
}
.credits-layout > div > p {
	font-size: 0.875rem;
	line-height: 1.9;
	color: #8b8b8b;
	max-width: 480px;
	margin: 1.4375rem 0;
}
.credit-examples > div {
	display: flex;
	align-items: center;
	gap: 1.375rem;
	border-bottom: 1px solid #414141;
	padding: 1.375rem 0;
}
.credit-examples > div:first-child {
	border-top: 1px solid #414141;
}
.credit-examples > div > span {
	font-family: Georgia, serif;
	font-size: 2.25rem;
	color: #939393;
	width: 45px;
	flex-shrink: 0;
}
.credit-examples > div > div {
	flex: 1;
}
.credit-examples h3 {
	font-size: 1.25rem;
}
.credit-examples p {
	font-size: 0.75rem;
	color: #898989;
	margin-top: 0.5rem;
}
.credit-examples svg {
	width: 19px;
	color: #858585;
}
.download-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.5rem;
	margin-top: 2.1875rem;
}
.download-card {
	padding: 2.5rem;
	background: #dddddd;
	border: 1px solid #b6b6b6;
	border-radius: 12px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
.download-card.main-download {
	background: #151515;
	color: var(--dark);
	border-color: var(--acid);
}
.platform-symbol {
	font-family: Arial, sans-serif;
	font-size: 3.75rem;
	line-height: 1;
	margin-bottom: 2.1875rem;
	color: #252525;
}
.main-download .platform-symbol {
	color: #c2c2c2;
}
.download-card > .mono {
	font-size: 0.5625rem;
	color: #707070;
}
.main-download > .mono {
	color: #919191;
}
.download-card h2 {
	font-size: 2.125rem;
	line-height: 1.3;
	margin: 0.9375rem 0;
}
.download-card > p {
	font-size: 0.875rem;
	color: #585858;
	line-height: 1.85;
	margin-bottom: 1.75rem;
}
.download-card.main-download > p {
	color: #9c9c9c;
}
.main-download > .button {
	background: #d8d8d8;
	color: #0c0c0c;
}
.download-card > .fineprint {
	font-size: 0.625rem;
	display: block;
	margin-top: 1.1875rem;
	color: #727272;
}
.main-download > .fineprint {
	color: #8b8b8b;
}
.download-card.smaller h2 {
	font-size: 1.5625rem;
}
.download-card.smaller > .text-link {
	margin-top: auto;
}
.help-content {
	max-width: 900px;
	margin-top: 2.5rem;
	margin-bottom: 6.25rem;
}
.help-next {
	display: flex;
	gap: 0.9375rem;
	flex-wrap: wrap;
	margin-top: 2.5rem;
}
.about-image {
	height: 540px;
	position: relative;
	overflow: hidden;
	border-radius: 12px;
	margin-top: 2.1875rem;
}
.about-image > img {
	height: 100%;
	width: 100%;
	object-fit: cover;
}
.about-image > span {
	position: absolute;
	bottom: 35px;
	left: 40px;
	font-size: clamp(2.375rem, 6vw, 4.8rem);
	font-family: Arial, sans-serif;
	font-weight: 850;
	letter-spacing: -0.06em;
	line-height: 1;
	color: #0d0d0d;
	text-shadow: 0 2px 10px #ffffff22;
}
.about-image i {
	font-family: Georgia, serif;
	font-weight: 400;
}
.showcase-gallery {
	margin-top: 2.5rem;
	padding-bottom: 6.25rem;
	display: flex;
	flex-direction: column;
	gap: 2.8125rem;
}
.showcase-gallery > article {
	position: relative;
	overflow: hidden;
	border-radius: 10px;
	height: 560px;
	isolation: isolate;
}
.showcase-gallery > article > img {
	position: absolute;
	inset: 0;
	height: 100%;
	width: 100%;
	object-fit: cover;
	z-index: -2;
}
.showcase-gallery > article::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, #e5e5e5dd, transparent 65%);
	z-index: -1;
}
.showcase-gallery > article > div {
	position: absolute;
	left: 35px;
	bottom: 25px;
}
.showcase-gallery h2 {
	font-family: Arial, sans-serif;
	font-size: 3.4375rem;
	letter-spacing: -2.5px;
	margin-top: 0.625rem;
	color: #0c0c0c;
}
.showcase-gallery p {
	font-size: 0.8125rem;
	color: #373737;
	margin-block: 0.5rem;
}
.showcase-gallery .text-link {
	font-size: 0.75rem;
}
.showcase-gallery .mono {
	font-size: 0.5625rem;
	color: var(--acid);
}
.not-found {
	text-align: center;
	padding-block: 4.6875rem 6.875rem;
}
.not-found .eyebrow {
	justify-content: center;
}
.error-number {
	font-family: Arial, sans-serif;
	font-size: clamp(6.25rem, 23vw, 16.25rem);
	letter-spacing: -0.08em;
	font-weight: 800;
	line-height: 1.2;
	color: var(--acid);
}
.error-number > span {
	font-size: 0.8em;
	display: inline-block;
	animation: none;
	vertical-align: middle;
	margin: 0 0.9375rem;
}
.not-found h1 {
	font-size: 2.25rem;
	margin-top: 0.9375rem;
}
.not-found p {
	color: #505050;
	font-size: 0.875rem;
	margin: 1.5625rem 0;
}
.not-found .button {
	margin: 0.3125rem;
}
/* Footer and dialogs. */
.site-footer {
	width: min(1360px, calc(100% - 96px));
	margin: auto;
	padding-top: 4.0625rem;
}
.footer-top {
	display: grid;
	grid-template-columns: 2.2fr 1fr 1.4fr 1.15fr;
	gap: 2.8125rem;
	padding-bottom: 4.0625rem;
}
.footer-top > div:first-child > p {
	color: #646464;
	font-size: 0.75rem;
	margin: 1rem 0 0.6875rem;
}
.footer-top > div:first-child > .mono {
	font-size: 0.5rem;
	color: #959595;
}
.footer-top h3 {
	font-size: 0.75rem;
	color: #171717;
	letter-spacing: 0;
	margin-bottom: 1.25rem;
}
.footer-top > div:not(:first-child) > a {
	display: block;
	color: #5f5f5f;
	font-size: 0.6875rem;
	margin-top: 0.625rem;
}
.footer-top > div > a:hover {
	color: var(--acid);
}
.footer-masthead {
	font-family: var(--font);
	font-size: clamp(3.25rem, 7vw, 8.5rem);
	font-weight: 700;
	line-height: 0.9;
	letter-spacing: -0.06em;
	color: #c7c7c7;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 0.12em;
	padding-bottom: 2.125rem;
	user-select: none;
}
.footer-masthead span {
	font-weight: 300;
	font-size: 0.42em;
	line-height: 1;
	letter-spacing: -0.05em;
	color: #acacac;
	align-self: flex-start;
	margin-top: 0.15em;
}
.footer-bottom {
	display: flex;
	justify-content: space-between;
	gap: 1.25rem;
	border-top: 1px solid #c2c2c2;
	font-size: 0.5625rem;
	color: #828282;
	padding-block: 1.375rem 1.875rem;
}
.footer-bottom > a:hover {
	color: var(--acid);
}
dialog {
	color: var(--ink);
	background: #e1e1e1;
	border: 1px solid #9c9c9c;
	border-radius: 13px;
	padding: 1.625rem;
	box-shadow: 0 30px 100px #ffffff88;
	margin: auto;
	max-height: calc(100dvh - 50px);
	overflow: auto;
}
dialog::backdrop {
	background: #fbfbfbba;
	backdrop-filter: blur(12px);
}
.dialog-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5625rem;
	margin-bottom: 1.25rem;
}
.dialog-top h2 {
	font-size: 1.3125rem;
	letter-spacing: -0.04em;
}
.dialog-close {
	font-size: 1.875rem;
	font-weight: 300;
	flex-shrink: 0;
	color: #373737;
}
.search-dialog {
	width: min(650px, calc(100vw - 32px));
}
.search-dialog input {
	width: 100%;
	background: #e9e9e9;
	color: #0c0c0c;
	border: 1px solid #ababab;
	border-radius: 7px;
	padding: 1rem 1.125rem;
	font-size: 1rem;
}
.search-dialog input::placeholder {
	color: #7e7e7e;
}
.search-caption {
	font-size: 0.625rem;
	color: #7d7d7d;
	margin-top: 0.9375rem;
}
.search-dialog #search-results {
	margin-top: 0.9375rem;
	max-height: 48vh;
	overflow: auto;
}
.search-result {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 0.9375rem;
	padding: 0.8125rem 0.625rem;
	border-bottom: 1px solid #bfbfbf;
	font-size: 0.8125rem;
	border-radius: 5px;
}
.search-result:hover {
	background: #cacaca;
	color: var(--acid);
}
.search-result span {
	font-size: 0.5625rem;
	color: #626262;
}
.search-empty {
	font-size: 0.8125rem;
	color: #585858;
	padding: 1.5625rem 0;
}
.dialog-hint {
	display: flex;
	justify-content: space-between;
	font-size: 0.5625rem;
	color: #828282;
	margin-top: 1.25rem;
}
.showcase-dialog {
	width: min(1050px, calc(100vw - 32px));
}
.showcase-dialog .dialog-top .mono {
	font-size: 0.5rem;
	color: #606060;
	display: block;
	margin-bottom: 0.5625rem;
}
.showcase-dialog .dialog-top h2 {
	font-size: 1.4375rem;
}
.showcase-stage {
	aspect-ratio: 16/9;
	overflow: hidden;
	border-radius: 8px;
	position: relative;
}
.showcase-stage > img {
	height: 100%;
	width: 100%;
	object-fit: cover;
	animation: none;
}
.showcase-caption {
	position: absolute;
	left: 35px;
	bottom: 25px;
	font-family: Arial, sans-serif;
	font-size: clamp(1.5625rem, 6vw, 4.375rem);
	font-weight: 800;
	letter-spacing: -0.06em;
	line-height: 0.95;
	color: #0e0e0e;
	text-shadow: 0 2px 10px #ffffff33;
}
.showcase-caption i {
	font-family: Georgia, serif;
	font-weight: 400;
}
.showcase-controls {
	display: flex;
	gap: 0.625rem;
	margin-top: 1.0625rem;
}
.showcase-controls button {
	flex: 1;
	font-family: var(--mono);
	font-size: 0.625rem;
	background: #c9c9c9;
	border: 1px solid #a4a4a4;
	color: #5f5f5f;
	border-radius: 4px;
	padding: 0.8125rem 0.625rem;
	white-space: nowrap;
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.showcase-controls button.active {
	background: var(--acid);
	color: var(--dark);
	border-color: var(--acid);
}
.showcase-dialog > .fineprint {
	font-size: 0.625rem;
	margin-top: 0.9375rem;
}
.has-motion .reveal {
	opacity: 0;
	transform: translateY(22px);
	transition:
		transform 220ms var(--ease),
		opacity 180ms var(--ease);
}
.has-motion .reveal.visible {
	opacity: 1;
	transform: translateY(0);
}
@keyframes ticker {
	to {
		transform: translateX(-50%);
	}
}
@keyframes turn {
	to {
		transform: rotate(360deg);
	}
}
@keyframes slowzoom {
	to {
		transform: scale(1.055);
	}
}
@media (min-width: 1550px) {
	.hero-heading {
		padding-block: 3.125rem 3.4375rem;
	}
	.hero-aside {
		max-width: 325px;
	}
	.hero-aside p {
		font-size: 0.9375rem;
	}
	.hero-media {
		height: 570px;
	}
}
@media (max-width: 1180px) {
	.nav-wrap {
		gap: 1.875rem;
	}
	.desktop-nav {
		gap: 1.3125rem;
	}
	.nav-actions {
		gap: 0.9375rem;
	}
	.hero h1 {
		font-size: 5.7vw;
	}
	.hero-aside {
		max-width: 245px;
	}
	.hero-aside p {
		font-size: 0.75rem;
	}
	.hero-aside > .button {
		min-width: 220px;
	}
	.hero-media {
		height: 42vw;
	}
	.hero-film-title {
		font-size: 8vw;
	}
	.hero-media-bottom > .mono {
		font-size: 0.5rem;
	}
	.editorial-card {
		min-height: 400px;
	}
	.editorial-overlay h3 {
		font-size: 1.875rem;
	}
	.feature-art {
		height: 195px;
	}
	.sample-caption {
		font-size: 0.875rem;
		left: 8%;
		right: 8%;
	}
	.creator-card h3 {
		font-size: 1.125rem;
	}
	.workflow-panel {
		gap: 2.1875rem;
	}
	.home-faq {
		gap: 2.8125rem;
	}
	.home-faq h2 {
		font-size: 2.1875rem;
	}
	.detail-hero {
		gap: 2.1875rem;
	}
	.detail-hero .button {
		gap: 1.25rem;
		padding: 0.9375rem 1.125rem;
	}
	.detail-hero h1 {
		font-size: 4vw;
	}
	.mega-menu {
		gap: 1.25rem;
	}
	.mega-intro {
		font-size: 1.375rem;
	}
	.mega-column a {
		font-size: 0.6875rem;
	}
	.plan-card {
		padding: 1.875rem 1.375rem;
	}
	.price strong {
		font-size: 2.3125rem;
	}
	.article-layout {
		grid-template-columns: 220px 1fr;
		gap: 2.8125rem;
	}
}
@media (max-width: 960px) {
	.container {
		width: calc(100% - 56px);
	}
	.nav-wrap {
		width: calc(100% - 48px);
		gap: 1.625rem;
		height: 72px;
	}
	.wordmark {
		font-size: 1.375rem;
	}
	.desktop-nav {
		gap: 1.25rem;
	}
	.nav-trigger,
	.nav-link {
		font-size: 0.75rem;
	}
	.login-link {
		display: none;
	}
	.nav-actions {
		gap: 0.5rem;
	}
	.nav-cta {
		font-size: 0.6875rem;
		gap: 0.8125rem;
		padding: 0.625rem 0.8125rem;
	}
	.search-trigger {
		width: 30px;
	}
	.hero {
		padding-top: 1.875rem;
	}
	.hero-heading {
		gap: 1.5rem;
		padding-block: 1.875rem 2.1875rem;
	}
	.hero h1 {
		font-size: 5.6vw;
	}
	.hero-aside {
		max-width: 225px;
	}
	.hero-aside p {
		font-size: 0.6875rem;
	}
	.hero-aside > .button {
		font-size: 0.75rem;
		min-width: 200px;
		min-height: 48px;
		padding: 0.875rem 1.0625rem;
	}
	.hero-aside > .text-link {
		font-size: 0.625rem;
	}
	.hero-topline {
		font-size: 0.5625rem;
	}
	.hero-media {
		min-height: 360px;
	}
	.hero-film-title {
		font-size: 8.4vw;
		left: 30px;
		top: 24%;
	}
	.hero-media-top {
		left: 25px;
		right: 25px;
		font-size: 0.5rem;
	}
	.section {
		padding-block: 5.3125rem;
	}
	.section-heading {
		gap: 1.875rem;
		margin-bottom: 2.0625rem;
	}
	.section-heading > p,
	.section-heading > div > p {
		font-size: 0.75rem;
	}
	.eyebrow {
		font-size: 0.5625rem;
	}
	.editorial-grid {
		gap: 1rem;
	}
	.editorial-card {
		min-height: 360px;
	}
	.editorial-overlay {
		left: 23px;
		bottom: 24px;
	}
	.editorial-overlay h3 {
		font-size: 1.75rem;
	}
	.editorial-overlay > span:last-child {
		font-size: 0.625rem;
	}
	.circle-arrow {
		width: 35px;
		height: 35px;
		right: 20px;
		bottom: 22px;
	}
	.circle-arrow svg {
		width: 18px;
	}
	.caption-pill {
		font-size: 0.875rem;
	}
	.floating-tool {
		transform: scale(0.86) rotate(5deg);
		transform-origin: top right;
		top: 24px;
		right: 22px;
	}
	.utility-strip > a > span:nth-child(2) {
		font-size: 0.625rem;
	}
	.utility-strip small {
		font-size: 0.4375rem;
	}
	.feature-grid {
		gap: 2.1875rem 1.125rem;
	}
	.feature-art {
		height: 170px;
	}
	.feature-copy h3 {
		font-size: 1.125rem;
	}
	.feature-copy p {
		font-size: 0.75rem;
	}
	.art-tag {
		font-size: 0.4375rem;
		top: 12px;
		left: 12px;
	}
	.art-number {
		font-size: 3.125rem;
	}
	.creator-grid {
		gap: 0.75rem;
	}
	.creator-card > div {
		left: 14px;
		right: 14px;
		bottom: 18px;
	}
	.creator-card h3 {
		font-size: 1rem;
	}
	.creator-card > .mono {
		font-size: 0.4375rem;
		left: 13px;
		top: 14px;
	}
	.creator-card svg {
		width: 17px;
		height: 17px;
	}
	.workflow-panel {
		grid-template-columns: 0.75fr 1.25fr;
		gap: 1.5625rem;
	}
	.workflow-panel h3 {
		font-size: 1.5625rem;
	}
	.workflow-panel p {
		font-size: 0.75rem;
	}
	.workflow-tabs button {
		font-size: 0.875rem;
		padding: 1.25rem 0.75rem;
		gap: 0.9375rem;
	}
	.guide-card h3 {
		font-size: 1.125rem;
	}
	.guide-card p {
		font-size: 0.75rem;
	}
	.guide-card > .mono {
		font-size: 0.5625rem;
	}
	.home-faq {
		gap: 2.1875rem;
		grid-template-columns: 0.7fr 1.3fr;
	}
	.faq-list summary {
		font-size: 0.8125rem;
	}
	.faq-list details p {
		font-size: 0.75rem;
	}
	.closing-cta > .container {
		padding-top: 3.75rem;
	}
	.cta-star {
		font-size: 16.25rem;
	}
	.site-footer {
		width: calc(100% - 56px);
	}
	.footer-top {
		gap: 1.5625rem;
		grid-template-columns: 1.7fr 1fr 1.3fr 1.2fr;
	}
	.footer-top > div:first-child > p {
		font-size: 0.6875rem;
	}
	.footer-top > div:first-child > .mono {
		font-size: 0.4375rem;
	}
	.mega-menu {
		top: 72px;
		padding: 1.875rem 1.75rem;
		grid-template-columns: repeat(4, 1fr);
		gap: 1.5625rem;
	}
	.mega-menu:not(.compact) .mega-intro {
		display: none;
	}
	.mega-menu.compact {
		grid-template-columns: 1fr 2.5fr;
	}
	.mega-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.menu-scrim {
		top: 72px;
	}
	.page-intro {
		padding-top: 4.0625rem;
	}
	.detail-subnav {
		top: 72px;
	}
	.detail-hero {
		gap: 1.875rem;
		padding-block: 2.8125rem 3.4375rem;
	}
	.detail-hero p {
		font-size: 0.8125rem;
	}
	.detail-hero .button {
		font-size: 0.75rem;
		padding: 0.8125rem 1rem;
		min-height: 48px;
	}
	.detail-category {
		font-size: 0.5rem;
	}
	.benefit-grid {
		gap: 1.5625rem;
	}
	.benefit h3,
	.benefit h2 {
		font-size: 1.3125rem;
	}
	.benefit p {
		font-size: 0.75rem;
	}
	.steps-layout {
		gap: 2.5rem;
		grid-template-columns: 0.7fr 1.3fr;
	}
	.numbered-steps h3 {
		font-size: 1.25rem;
	}
	.numbered-steps li {
		gap: 1.4375rem;
	}
	.solution-hero {
		min-height: 490px;
		padding: 2.5rem;
	}
	.solution-hero p {
		font-size: 0.8125rem;
		max-width: 430px;
	}
	.solution-card h2 {
		font-size: 1.375rem;
	}
	.solution-card p {
		font-size: 0.8125rem;
	}
	.article-page {
		width: calc(100% - 56px);
	}
	.article-layout {
		grid-template-columns: 180px 1fr;
		gap: 2.1875rem;
	}
	.article-layout > aside > a:not(.text-link) {
		font-size: 0.6875rem;
	}
	.article-content p {
		font-size: 0.875rem;
	}
	.article-content h2 {
		font-size: 1.5625rem;
	}
	.pricing-grid {
		gap: 0.875rem;
	}
	.plan-card {
		padding: 1.6875rem 1.125rem;
	}
	.plan-top > .mono {
		font-size: 0.5rem;
	}
	.plan-top h2 {
		font-size: 2.0625rem;
	}
	.plan-top > p {
		font-size: 0.6875rem;
	}
	.price strong {
		font-size: 2.0625rem;
		letter-spacing: -1px;
	}
	.price > span {
		font-size: 0.625rem;
	}
	.plan-credit {
		font-size: 0.625rem;
		min-height: 42px;
	}
	.plan-card > ul > li {
		font-size: 0.6875rem;
	}
	.recommended {
		font-size: 0.5rem;
		left: 12px;
		right: 12px;
		padding-inline: 0.5625rem;
	}
	.credits-layout {
		gap: 2.5rem;
	}
	.credits-layout h2 {
		font-size: 2rem;
	}
	.download-card {
		padding: 2rem;
	}
	.download-card h2 {
		font-size: 1.8125rem;
	}
	.download-card p {
		font-size: 0.8125rem;
	}
	.about-image {
		height: 440px;
	}
	.showcase-gallery > article {
		height: 460px;
	}
}
@media (max-width: 740px) {
	html {
		scroll-padding-top: 6.25rem;
	}
	.container {
		width: calc(100% - 40px);
	}
	.section {
		padding-block: 4.0625rem;
	}
	.nav-wrap {
		height: 65px;
		width: calc(100% - 32px);
		gap: 0.75rem;
	}
	.wordmark {
		font-size: 1.375rem;
	}
	.wordmark img {
		width: 27px;
		height: 27px;
	}
	.wordmark-dot {
		font-size: 0.5rem;
	}
	.desktop-nav {
		display: none;
	}
	.mobile-toggle {
		display: flex;
		flex-direction: column;
		gap: 0.3125rem;
		width: 32px;
		height: 36px;
	}
	.mobile-toggle span {
		width: 18px;
		height: 1px;
		background: var(--ink);
		transition:
			transform 220ms var(--ease),
			opacity 180ms var(--ease);
	}
	.mobile-toggle[aria-expanded="true"] span:first-child {
		transform: translateY(3px) rotate(45deg);
	}
	.mobile-toggle[aria-expanded="true"] span:last-child {
		transform: translateY(-3px) rotate(-45deg);
	}
	.nav-actions {
		gap: 0.4375rem;
	}
	.nav-cta {
		padding: 0.5625rem 0.75rem;
		font-size: 0.625rem;
		gap: 0.4375rem;
	}
	.nav-cta svg {
		width: 14px;
		height: 14px;
	}
	.search-trigger {
		width: 28px;
	}
	.search-trigger svg {
		width: 17px;
		height: 17px;
	}
	.mega-menu {
		display: none !important;
	}
	.menu-scrim {
		top: 65px;
	}
	.hero {
		padding-top: 1.5625rem;
	}
	.hero-topline {
		font-size: 0.5rem;
	}
	.hero-topline > span:last-child {
		display: none;
	}
	.hero-heading {
		display: block;
		padding: 1.5625rem 0 1.75rem;
	}
	.hero h1 {
		font-size: clamp(2.125rem, 7.65vw, 3.5625rem);
		line-height: 1.24;
		letter-spacing: -0.07em;
	}
	.headline-spark {
		margin-left: 0.4375rem;
		transform: translateY(-2px);
	}
	.hero-aside {
		max-width: none;
		display: flex;
		align-items: flex-end;
		gap: 1.125rem;
		flex-wrap: wrap;
		margin-top: 1.5rem;
	}
	.hero-aside p {
		font-size: 0.75rem;
		line-height: 1.85;
		flex: 1;
		min-width: 220px;
		margin: 0;
	}
	.hero-aside > .button {
		min-width: 200px;
		font-size: 0.75rem;
		min-height: 48px;
		justify-content: space-between;
	}
	.hero-aside > .text-link {
		display: none;
	}
	.hero-media {
		min-height: 350px;
		height: 58vw;
		border-radius: 8px 8px 0 0;
	}
	.hero-media > img {
		object-position: 57% 50%;
	}
	.hero-media-top {
		left: 19px;
		right: 19px;
		top: 20px;
		font-size: 0.4375rem;
		gap: 0.75rem;
	}
	.hero-media-top > span:last-child {
		display: none;
	}
	.hero-film-title {
		font-size: clamp(2.9375rem, 11vw, 5rem);
		left: 22px;
		top: 29%;
		letter-spacing: -0.075em;
	}
	.hero-media-bottom {
		left: 20px;
		right: 20px;
		bottom: 21px;
		align-items: flex-end;
	}
	.hero-media-bottom > .mono {
		max-width: 120px;
		font-size: 0.4375rem;
	}
	.showreel-button {
		padding: 0.375rem 0.6875rem 0.375rem 0.375rem;
		gap: 0.5rem;
		font-size: 0.625rem;
	}
	.play-disc {
		width: 32px;
		height: 32px;
		font-size: 1.25rem;
	}
	.showreel-button small {
		font-size: 0.375rem;
	}
	.frame-corner {
		width: 9px;
		height: 9px;
	}
	.mini-timeline {
		padding: 0 0.75rem 0.75rem;
		border-radius: 0 0 8px 8px;
	}
	.timeline-toolbar {
		height: 36px;
	}
	.timeline-toolbar > .mono {
		font-size: 0.4375rem;
	}
	.timeline-toolbar > div {
		gap: 0.5rem;
	}
	.timeline-demo-label {
		display: none;
	}
	.timeline-toolbar .timecode {
		font-size: 0.5rem;
	}
	.timeline-ruler {
		font-size: 0.4375rem;
		height: 22px;
		padding-left: 1.5rem;
	}
	.track > span {
		width: 15px;
		font-size: 0.5625rem;
	}
	.text-track {
		height: 20px;
	}
	.text-track > div {
		font-size: 0.4375rem;
		padding: 0.1875rem 0.3125rem;
		width: 45%;
		margin-left: 6%;
	}
	.video-track {
		height: 30px;
	}
	.video-track > div {
		font-size: 0.4375rem;
		padding: 0.25rem;
	}
	.audio-track {
		height: 22px;
	}
	.wave-track {
		gap: 0.125rem;
	}
	.wave-track > span {
		font-size: 0.375rem;
	}
	.hero-footnote {
		font-size: 0.375rem;
		gap: 0.625rem;
		padding-top: 0.6875rem;
	}
	.ticker {
		margin-top: 2.1875rem;
	}
	.ticker > div {
		padding: 0.9375rem 0;
		gap: 1.75rem;
	}
	.ticker span {
		font-size: 1.625rem;
	}
	.ticker i {
		font-size: 1.625rem;
	}
	.eyebrow {
		font-size: 0.5rem;
		letter-spacing: 0.055em;
		margin-bottom: 1.25rem;
		gap: 0.4375rem;
	}
	.eyebrow > .status-dot {
		width: 5px;
		height: 5px;
	}
	h2 {
		font-size: 2rem;
		line-height: 1.3;
		letter-spacing: -0.06em;
	}
	.section-heading {
		align-items: flex-start;
		flex-direction: column;
		gap: 1.25rem;
		margin-bottom: 1.75rem;
	}
	.section-heading > p,
	.section-heading > div > p {
		font-size: 0.8125rem;
		line-height: 1.9;
	}
	.section-heading .button {
		min-height: 44px;
		font-size: 0.6875rem;
		padding: 0.75rem 0.9375rem;
	}
	.editorial-grid {
		grid-template-columns: 1fr;
		gap: 1.125rem;
	}
	.editorial-card {
		min-height: 395px;
	}
	.editorial-card.wide > img {
		object-position: 50% 25%;
	}
	.editorial-card.narrow > img {
		object-position: 50% 35%;
	}
	.editorial-overlay {
		left: 24px;
		bottom: 25px;
	}
	.editorial-overlay h3 {
		font-size: 2rem;
	}
	.editorial-overlay > .mono {
		font-size: 0.5rem;
	}
	.editorial-overlay > span:last-child {
		font-size: 0.6875rem;
	}
	.circle-arrow {
		width: 39px;
		height: 39px;
		bottom: 24px;
		right: 24px;
	}
	.floating-tool {
		transform: scale(0.9) rotate(5deg);
	}
	.caption-pill {
		font-size: 1.125rem;
		top: 48%;
	}
	.utility-strip {
		grid-template-columns: 1fr;
		margin-top: 1.625rem;
	}
	.utility-strip > a {
		padding: 0.9375rem 0;
		grid-template-columns: 23px 1fr auto;
		gap: 0.5625rem;
		border-bottom: 1px solid var(--line);
	}
	.utility-strip > a:last-child {
		border-bottom: 0;
	}
	.utility-strip > a > span:first-child {
		grid-row: auto;
		font-size: 1.25rem;
	}
	.utility-strip > a > span:nth-child(2) {
		font-size: 0.6875rem;
	}
	.utility-strip small {
		font-size: 0.4375rem;
		max-width: 130px;
		text-align: right;
	}
	.feature-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 2rem 1rem;
	}
	.feature-art {
		height: auto;
		aspect-ratio: 1.15;
	}
	.feature-copy {
		padding-top: 0.8125rem;
	}
	.feature-copy h3 {
		font-size: 1.0625rem;
		gap: 0.5rem;
		line-height: 1.45;
	}
	.feature-copy h3 svg {
		width: 17px;
		height: 17px;
	}
	.feature-copy > .mono {
		font-size: 0.5rem;
	}
	.feature-copy p {
		font-size: 0.6875rem;
		line-height: 1.85;
		max-width: 100%;
		margin-top: 0.5rem;
	}
	.art-tag {
		font-size: 0.375rem;
		padding: 0.1875rem 0.375rem;
		left: 10px;
		top: 10px;
		max-width: calc(100% - 20px);
	}
	.art-number {
		font-size: 2.625rem;
		right: 12px;
	}
	.sample-caption {
		font-size: 0.6875rem;
		bottom: 21%;
		left: 5%;
		right: 5%;
		padding: 0.375rem 0.125rem;
	}
	.motion-path {
		font-size: 1.375rem;
		left: 12%;
		right: 12%;
	}
	.cutout-label {
		font-size: 0.4375rem;
		padding: 0.375rem 0.5rem;
	}
	.comparison {
		aspect-ratio: 1.3;
		border-radius: 8px;
	}
	.comparison-images > img,
	.before-layer > img {
		object-position: 57% center;
	}
	.compare-label {
		font-size: 0.5rem;
		top: 17px;
		padding: 0.3125rem 0.5625rem;
	}
	.compare-label.before {
		left: 16px;
	}
	.compare-label.after {
		right: 16px;
	}
	.compare-line > span {
		width: 35px;
		height: 35px;
		font-size: 1.375rem;
	}
	.compare-hint {
		font-size: 0.5625rem;
		bottom: 18px;
		padding: 0.375rem 0.6875rem;
	}
	.color-meta {
		font-size: 0.4375rem;
		gap: 1.25rem;
		align-items: flex-start;
	}
	.color-meta > span:last-child {
		text-align: right;
		max-width: 50%;
	}
	.creator-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0.9375rem;
	}
	.creator-card {
		aspect-ratio: 0.82;
	}
	.creator-card > .mono {
		font-size: 0.4375rem;
		left: 15px;
	}
	.creator-card > div {
		left: 15px;
		right: 15px;
	}
	.creator-card h3 {
		font-size: 1.125rem;
	}
	.workflow-tabs button {
		font-size: 0.6875rem;
		gap: 0.5rem;
		padding: 0.9375rem 0.375rem;
	}
	.workflow-tabs button span {
		font-size: 0.5rem;
	}
	.workflow-panel {
		grid-template-columns: 1fr;
		gap: 1.6875rem;
		padding-top: 1.5625rem;
	}
	.workflow-panel h3 {
		font-size: 1.75rem;
		margin: 0.75rem 0 0.8125rem;
	}
	.workflow-panel p {
		font-size: 0.8125rem;
		max-width: 440px;
	}
	.workflow-panel .text-link {
		font-size: 0.75rem;
		margin-top: 0.75rem;
	}
	.workflow-image > .mono {
		font-size: 0.5rem;
	}
	.guide-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 2.1875rem 1rem;
	}
	.guide-card > div {
		aspect-ratio: 1.3;
		margin-bottom: 0.75rem;
	}
	.guide-card h3 {
		font-size: 1.125rem;
		line-height: 1.5;
		margin: 0.5rem 0;
	}
	.guide-card > .mono {
		font-size: 0.5rem;
	}
	.guide-card p {
		font-size: 0.6875rem;
		line-height: 1.85;
	}
	.guide-arrow {
		transform: translateY(0);
		width: 29px;
		height: 29px;
		right: 10px;
		bottom: 10px;
	}
	.guide-arrow svg {
		width: 16px;
		height: 16px;
	}
	.home-faq {
		grid-template-columns: 1fr;
		gap: 1.6875rem;
	}
	.home-faq h2 {
		font-size: 2.0625rem;
		margin-bottom: 0.875rem;
	}
	.home-faq .eyebrow {
		font-size: 0.5rem;
	}
	.home-faq .text-link {
		font-size: 0.75rem;
	}
	.faq-list summary {
		padding-block: 1.375rem;
		font-size: 0.8125rem;
	}
	.faq-list details p {
		font-size: 0.75rem;
		padding-right: 1.25rem;
	}
	.closing-cta > .container {
		padding-top: 3.125rem;
		padding-bottom: 1.25rem;
	}
	.closing-cta .eyebrow {
		font-size: 0.5rem;
	}
	.closing-cta h2 {
		font-size: clamp(2rem, 7.3vw, 3.125rem);
		line-height: 1.3;
	}
	.closing-cta .button {
		font-size: 0.75rem;
		min-height: 50px;
		min-width: 185px;
		padding: 0.9375rem 1.125rem;
	}
	.cta-star {
		font-size: 10.625rem;
		right: -40px;
		top: 65px;
		opacity: 0.8;
	}
	.closing-bottom {
		font-size: 0.4375rem;
		margin-top: 2.8125rem;
		padding-top: 1.0625rem;
	}
	.site-footer {
		width: calc(100% - 40px);
		padding-top: 2.8125rem;
	}
	.footer-top {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 1.875rem 1.25rem;
		padding-bottom: 3.125rem;
	}
	.footer-top > div:first-child {
		grid-column: 1/-1;
	}
	.footer-top > div:first-child > p {
		font-size: 0.75rem;
		margin: 0.75rem 0 0.5rem;
	}
	.footer-top > div:first-child > .mono {
		font-size: 0.4375rem;
	}
	.footer-top h3 {
		font-size: 0.6875rem;
		margin-bottom: 1.0625rem;
	}
	.footer-top > div:not(:first-child) > a {
		font-size: 0.625rem;
		line-height: 1.8;
		margin-top: 0.5rem;
	}
	.footer-masthead {
		font-size: 19vw;
		padding-bottom: 1.625rem;
	}
	.footer-bottom {
		font-size: 0.5rem;
		flex-wrap: wrap;
		gap: 0.8125rem;
		padding-block: 1.25rem;
	}
	.footer-bottom > span:first-child {
		flex-basis: 100%;
	}
	.footer-bottom > a {
		margin-left: auto;
	}
	.page-intro {
		padding-top: 3rem;
		padding-bottom: 1.5625rem;
	}
	.page-intro h1 {
		font-size: clamp(2rem, 6.8vw, 3rem);
		line-height: 1.35;
	}
	.page-intro > p {
		font-size: 0.8125rem;
		line-height: 1.9;
		margin-top: 1.375rem;
	}
	.catalog-section {
		padding-top: 1.125rem;
	}
	.catalog-toolbar {
		flex-direction: column;
		align-items: stretch;
		gap: 1rem;
		padding-block: 1.0625rem;
	}
	.filter-tabs {
		gap: 0.1875rem;
		flex-wrap: nowrap;
		overflow: auto;
		padding-bottom: 0.25rem;
	}
	.filter-tabs button {
		font-size: 0.625rem;
		white-space: nowrap;
		padding: 0.5rem 0.625rem;
	}
	.catalog-search input {
		width: 100%;
		font-size: 0.75rem;
		padding: 0.625rem 0.75rem;
	}
	.catalog-meta {
		font-size: 0.5rem;
		padding-block: 1.125rem;
	}
	.breadcrumbs {
		font-size: 0.625rem;
		padding-top: 1.5rem;
		gap: 0.5625rem;
	}
	.detail-hero {
		grid-template-columns: 1fr;
		gap: 1.875rem;
		padding-block: 2rem 2.5rem;
	}
	.detail-hero h1 {
		font-size: 2.25rem;
		line-height: 1.35;
	}
	.detail-hero p {
		font-size: 0.8125rem;
		margin: 1.25rem 0 1.5rem;
		max-width: 100%;
	}
	.detail-hero .eyebrow {
		font-size: 0.5rem;
	}
	.detail-category {
		font-size: 0.5rem;
		margin-top: 1.3125rem;
	}
	.detail-visual {
		aspect-ratio: 1.35;
	}
	.visual-code {
		font-size: 5.3125rem;
	}
	.visual-label {
		font-size: 0.5rem;
		top: 20px;
		left: 20px;
	}
	.detail-visual .sample-caption {
		font-size: 1.1875rem;
	}
	.detail-subnav {
		top: 65px;
	}
	.detail-subnav > .container {
		gap: 1.125rem;
		font-size: 0.625rem;
		padding-block: 0.9375rem;
		overflow: auto;
		white-space: nowrap;
	}
	.detail-subnav span {
		font-size: 0.6875rem;
	}
	.detail-subnav a {
		font-size: 0.625rem;
	}
	.benefit-grid {
		grid-template-columns: 1fr;
		gap: 1.875rem;
	}
	.benefit {
		padding-top: 1.375rem;
	}
	.benefit-number {
		font-size: 2.25rem;
		margin-bottom: 1.0625rem;
	}
	.benefit h3,
	.benefit h2 {
		font-size: 1.5rem;
		margin-bottom: 0.625rem;
	}
	.benefit p {
		font-size: 0.8125rem;
		line-height: 1.95;
		max-width: 550px;
	}
	.steps-layout {
		grid-template-columns: 1fr;
		gap: 1.875rem;
	}
	.steps-layout h2 {
		font-size: 2.125rem;
	}
	.numbered-steps li {
		gap: 1.375rem;
		padding-block: 1.5rem;
	}
	.numbered-steps h3 {
		font-size: 1.25rem;
	}
	.numbered-steps p {
		font-size: 0.75rem;
	}
	.numbered-steps li > .mono {
		font-size: 0.6875rem;
	}
	.solution-grid {
		grid-template-columns: 1fr;
		gap: 2.375rem;
	}
	.solution-card > div {
		aspect-ratio: 1.6;
	}
	.solution-card h2 {
		font-size: 1.5rem;
		margin: 1.125rem 0 0.6875rem;
	}
	.solution-card > div > .mono {
		font-size: 0.5rem;
	}
	.solution-card p {
		font-size: 0.75rem;
	}
	.solution-hero {
		min-height: 510px;
		padding: 2.1875rem 1.5625rem;
		margin-top: 1.5625rem;
		align-items: flex-end;
	}
	.solution-hero::after {
		background: linear-gradient(0deg, #f1f1f1ed, transparent);
	}
	.solution-hero h1 {
		font-size: 2rem;
	}
	.solution-hero p {
		font-size: 0.75rem;
		line-height: 1.9;
		margin-block: 1.125rem 1.4375rem;
	}
	.solution-hero .eyebrow {
		font-size: 0.5rem;
	}
	.solution-hero .button {
		min-height: 47px;
		font-size: 0.75rem;
		padding: 0.875rem 1.0625rem;
	}
	.article-page {
		width: calc(100% - 40px);
		margin-top: 2.3125rem;
	}
	.article-page h1 {
		font-size: 2.125rem;
	}
	.article-page > header {
		margin-bottom: 1.875rem;
	}
	.article-page > header > p {
		font-size: 0.875rem;
		line-height: 1.9;
		margin-top: 1.25rem;
	}
	.article-byline {
		font-size: 0.5rem;
		margin-top: 1.25rem;
	}
	.article-cover {
		aspect-ratio: 1.6;
	}
	.article-layout {
		display: flex;
		flex-direction: column;
		gap: 2.1875rem;
		padding-top: 1.875rem;
	}
	.article-layout > aside {
		position: static;
		width: 100%;
		background: #dddddd;
		border: 1px solid #bbbbbb;
		border-radius: 8px;
		padding: 1.4375rem;
	}
	.article-layout > aside > a:not(.text-link) {
		font-size: 0.6875rem;
		padding-block: 0.5rem;
	}
	.article-layout > aside > .text-link {
		margin-top: 0.875rem;
	}
	.article-content > section {
		padding-bottom: 1.875rem;
		margin-bottom: 1.875rem;
	}
	.article-content h2 {
		font-size: 1.5625rem;
	}
	.article-content p {
		font-size: 0.875rem;
		line-height: 2.05;
	}
	.article-end {
		padding: 1.5625rem;
	}
	.article-end h2 {
		font-size: 1.375rem;
	}
	.article-end .button {
		font-size: 0.75rem;
	}
	.pricing-grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 2.0625rem;
		max-width: 500px;
		margin-top: 1.5625rem;
	}
	.billing-toggle {
		margin-top: 1.625rem;
	}
	.billing-toggle button {
		font-size: 0.75rem;
		padding: 0.5625rem 0.9375rem;
	}
	.billing-toggle button > span {
		font-size: 0.5rem;
	}
	.page-intro > .pricing-status {
		font-size: 0.625rem;
		max-width: 90%;
	}
	.plan-card {
		padding: 1.875rem;
	}
	.plan-top > .mono {
		font-size: 0.5625rem;
	}
	.plan-top h2 {
		font-size: 2.375rem;
		margin-top: 0.9375rem;
	}
	.plan-top > p {
		font-size: 0.8125rem;
	}
	.price {
		margin-top: 1.5625rem;
	}
	.price strong {
		font-size: 2.75rem;
	}
	.price > span {
		font-size: 0.75rem;
	}
	.plan-credit {
		font-size: 0.75rem;
		min-height: 0;
		margin-bottom: 1.5625rem;
	}
	.plan-card > ul > li {
		font-size: 0.8125rem;
	}
	.plan-card > .button {
		font-size: 0.8125rem;
		min-height: 49px;
	}
	.recommended {
		left: 20px;
		right: 20px;
		font-size: 0.5625rem;
	}
	.plan-table th,
	.plan-table td {
		padding: 0.9375rem 1.25rem;
		font-size: 0.6875rem;
	}
	.plan-table thead th {
		font-size: 0.8125rem;
	}
	.comparison-table-wrap + .fineprint {
		font-size: 0.625rem;
	}
	.credits-layout {
		grid-template-columns: 1fr;
		gap: 1.75rem;
	}
	.credits-layout h2 {
		font-size: 1.9375rem;
	}
	.credits-layout > div > p {
		font-size: 0.8125rem;
	}
	.credit-examples > div {
		padding: 1.1875rem 0;
		gap: 1.0625rem;
	}
	.credit-examples h3 {
		font-size: 1.125rem;
	}
	.download-grid {
		grid-template-columns: 1fr;
		gap: 1.25rem;
		margin-top: 1.375rem;
	}
	.download-card {
		padding: 1.875rem;
	}
	.download-card h2 {
		font-size: 2rem;
	}
	.platform-symbol {
		font-size: 3.125rem;
		margin-bottom: 1.6875rem;
	}
	.download-card p {
		font-size: 0.8125rem;
	}
	.download-card .button {
		font-size: 0.75rem;
	}
	.help-content {
		margin-top: 1.125rem;
		margin-bottom: 4.0625rem;
	}
	.help-next .button {
		font-size: 0.75rem;
		min-height: 48px;
		padding: 0.8125rem 1rem;
	}
	.about-image {
		height: 380px;
		margin-top: 1.5625rem;
	}
	.about-image > span {
		font-size: 9vw;
		left: 22px;
		bottom: 25px;
	}
	.showcase-gallery {
		margin-top: 1.25rem;
		padding-bottom: 4.0625rem;
		gap: 1.5625rem;
	}
	.showcase-gallery > article {
		height: 440px;
	}
	.showcase-gallery > article > div {
		left: 25px;
		bottom: 22px;
	}
	.showcase-gallery h2 {
		font-size: 2.375rem;
		letter-spacing: -1.7px;
	}
	.showcase-gallery .mono {
		font-size: 0.5rem;
	}
	.showcase-gallery p {
		font-size: 0.75rem;
	}
	.showcase-dialog {
		padding: 1.125rem;
		border-radius: 10px;
	}
	.showcase-dialog .dialog-top h2 {
		font-size: 1.125rem;
	}
	.showcase-dialog .dialog-top .mono {
		font-size: 0.4375rem;
	}
	.showcase-stage {
		aspect-ratio: 1.2;
	}
	.showcase-caption {
		left: 20px;
		bottom: 20px;
		font-size: 2.375rem;
	}
	.showcase-controls {
		gap: 0.375rem;
	}
	.showcase-controls button {
		font-size: 0.4375rem;
		padding: 0.75rem 0.375rem;
		white-space: normal;
	}
	.showcase-dialog > .fineprint {
		font-size: 0.5625rem;
	}
	.search-dialog {
		padding: 1.25rem;
	}
	.dialog-top h2 {
		font-size: 1.125rem;
	}
	.search-dialog input {
		font-size: 0.875rem;
		padding: 0.875rem;
	}
	.search-result {
		font-size: 0.75rem;
	}
	.search-result > span {
		font-size: 0.5rem;
	}
	.not-found {
		padding-block: 3.125rem 4.375rem;
	}
	.not-found h1 {
		font-size: 1.75rem;
	}
	.not-found p {
		font-size: 0.75rem;
	}
	.not-found .button {
		font-size: 0.75rem;
		min-height: 48px;
		padding: 0.8125rem 0.9375rem;
	}
}
@media (max-width: 390px) {
	.container {
		width: calc(100% - 32px);
	}
	.nav-cta {
		font-size: 0.5625rem;
		padding: 0.5625rem 0.625rem;
	}
	.nav-cta svg {
		display: none;
	}
	.nav-wrap {
		width: calc(100% - 24px);
	}
	.wordmark {
		font-size: 1.25rem;
		gap: 0.3125rem;
	}
	.wordmark img {
		width: 25px;
		height: 25px;
	}
	.nav-actions {
		gap: 0.1875rem;
	}
	.hero h1 {
		font-size: 8.05vw;
	}
	.hero-aside p {
		font-size: 0.6875rem;
	}
	.hero-media {
		min-height: 330px;
	}
	.hero-media-bottom > .mono {
		max-width: 100px;
		font-size: 0.375rem;
	}
	.hero-film-title {
		font-size: 13vw;
	}
	.feature-grid {
		gap: 1.75rem 0.75rem;
	}
	.feature-copy h3 {
		font-size: 0.9375rem;
	}
	.feature-copy p {
		font-size: 0.625rem;
	}
	.art-tag {
		font-size: 0.3438rem;
	}
	.sample-caption {
		font-size: 0.5625rem;
	}
	.creator-card h3 {
		font-size: 1rem;
	}
	.creator-card > .mono {
		font-size: 0.375rem;
	}
	.footer-top {
		gap: 1.75rem 0.875rem;
	}
	.footer-top > div:not(:first-child) > a {
		font-size: 0.5625rem;
	}
	.hero-topline {
		font-size: 0.4375rem;
	}
	.filter-tabs button {
		font-size: 0.5625rem;
		padding: 0.5rem;
	}
	.detail-subnav > .container {
		gap: 0.875rem;
	}
	.detail-subnav span {
		font-size: 0.625rem;
	}
	.detail-subnav a {
		font-size: 0.5625rem;
	}
	.guide-card h3 {
		font-size: 1rem;
	}
	.guide-card p {
		font-size: 0.625rem;
	}
}
@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
	*,
	*::before,
	*::after {
		animation: none !important;
		transition: none !important;
	}
	.has-motion .reveal {
		opacity: 1;
		transform: none;
	}
	.hero-media > img {
		transform: none;
		will-change: auto;
	}
}

/* Interaction refinements informed by apple-design and review-animations. */
body {
	font-optical-sizing: auto;
}
p {
	letter-spacing: 0;
}
.button:active,
.nav-cta:active {
	transform: scale(0.98);
	transition: transform 120ms var(--ease);
}
.has-motion .reveal {
	transform: translateY(12px);
	transition:
		opacity 260ms var(--ease),
		transform 280ms var(--ease);
}
.has-motion .reveal.visible {
	transform: none;
}
.hero-media > img {
	will-change: auto;
}
.mega-menu {
	transform-origin: top center;
}
@media (hover: none), (pointer: coarse) {
	.button:hover svg,
	.text-link:hover svg,
	.nav-cta:hover svg,
	.showreel-button:hover .play-disc,
	.editorial-card:hover > img,
	.feature-card:hover .feature-art > img,
	.creator-card:hover > img,
	.guide-card:hover > div > img,
	.solution-card:hover img,
	.feature-card:hover h3 svg {
		transform: none;
	}
	.feature-card:hover .art-2 > img {
		filter: grayscale(1);
		transform: scale(1.17);
	}
	.editorial-card:hover .circle-arrow {
		transform: none;
	}
	.guide-arrow {
		transform: none;
	}
}
@media (prefers-reduced-transparency: reduce) {
	.site-header,
	.detail-subnav,
	.floating-tool,
	.showreel-button,
	.art-tag {
		backdrop-filter: none;
		background: #e1e1e1;
	}
	.menu-scrim,
	dialog::backdrop {
		backdrop-filter: none;
		background: #ffffffdd;
	}
}
@media (prefers-contrast: more) {
	:root {
		--muted: #393939;
		--line: #797979;
	}
	.site-header {
		background: #ededed;
	}
	.feature-copy p,
	.guide-card p,
	.faq-list details p,
	.benefit p,
	.plan-credit,
	.plan-card > ul > li,
	.article-content p {
		color: #272727;
	}
	.light-section p {
		color: #c3c3c3;
	}
	.icon-button,
	.button.ghost {
		border: 1px solid currentColor;
	}
}
@media (max-width: 740px) {
	.feature-copy p,
	.guide-card p,
	.solution-card p {
		font-size: 0.8125rem;
	}
	.feature-copy h3 {
		font-size: 1.125rem;
	}
	.footer-top > div:not(:first-child) > a {
		font-size: 0.75rem;
	}
	.nav-cta {
		font-size: 0.6875rem;
	}
	.hero-film-title {
		font-size: clamp(2.75rem, 10vw, 5rem);
	}
	.icon-button,
	.mobile-toggle {
		min-width: 36px;
		min-height: 44px;
	}
	.plan-credit {
		font-size: 0.8125rem;
	}
}