/* Landing pages. Loaded after the live site stylesheet, only on /game-art/ landing pages.
   Desktop sizes scale with the viewport (1440 design), matching the live site's rem scaling.
   Colours: paper #f0f0f0, blue tint #cdeefa, blue #b6e8fa, ink #2c2b29, peach #ffe1b5. */

.lcad-lp-body {
	background: #f0f0f0;
	color: #000;
}

.lp {
	--px: calc(100vw / 1440);
	--pad: calc(48 * var(--px));
	--pad-y: calc(72 * var(--px));
	--f-h1: calc(56 * var(--px));
	--lh-h1: calc(62 * var(--px));
	--f-h2: calc(40 * var(--px));
	--lh-h2: calc(48 * var(--px));
	--f-lead: calc(22 * var(--px));
	--lh-lead: calc(32 * var(--px));
	--f-body: calc(20 * var(--px));
	--lh-body: calc(30 * var(--px));
	--f-small: calc(18 * var(--px));
	--lh-small: calc(28 * var(--px));
	--f-label: calc(12 * var(--px));
	--f-btn: calc(15 * var(--px));
	--gap: calc(28 * var(--px));
	min-width: 0;
	background: #f0f0f0;
	color: #000;
	font-family: "CentraNo2-Book", Arial, sans-serif;
	overflow: hidden;
}

.lp *, .lp *::before, .lp *::after { box-sizing: border-box; }

.lp p, .lp h1, .lp h2, .lp ul, .lp li {
	margin: 0;
	padding: 0;
	letter-spacing: 0;
	font-weight: normal;
}

.lp a { color: inherit; }

/* Type */
.lp .lp-h1 { font-family: "CentraNo2-Book", Arial, sans-serif; font-size: var(--f-h1); line-height: var(--lh-h1); }
.lp .lp-h2 { font-family: "CentraNo2-Book", Arial, sans-serif; font-size: var(--f-h2); line-height: var(--lh-h2); }
.lp .lp-lead { font-size: var(--f-lead); line-height: var(--lh-lead); }
.lp .lp-body, .lp .lp-body p { font-size: var(--f-body); line-height: var(--lh-body); margin: 0; }
.lp .lp-body p + p { margin-top: calc(12 * var(--px)); }
.lp .lp-small { font-size: var(--f-small); line-height: var(--lh-small); }
.lp .lp-note, .lp .lp-note p { font-size: calc(16 * var(--px)); line-height: calc(24 * var(--px)); margin: 0; }

.lp .lp-pill {
	display: inline-block;
	align-self: flex-start;
	padding: calc(6 * var(--px)) calc(10 * var(--px));
	background: #ffe1b5;
	font-family: "CentraNo2-Medium", Arial, sans-serif;
	font-size: var(--f-label);
	line-height: calc(16 * var(--px));
	letter-spacing: 0.1em;
	text-transform: uppercase;
	white-space: pre-wrap;
}

/* Buttons */
.lp .lp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: calc(14 * var(--px)) calc(22 * var(--px));
	border: 1px solid #000;
	font-family: "CentraNo2-Medium", Arial, sans-serif;
	font-size: var(--f-btn);
	line-height: calc(18 * var(--px));
	letter-spacing: 0;
	text-decoration: none;
	cursor: pointer;
	transition: opacity .2s;
}
.lp .lp-btn--fill { background: #000; color: #fff; }
.lp .lp-btn--line { background: #fff; color: #000; }
.lp .lp-btn:hover, .lp .lp-btn:focus-visible { opacity: .75; }
.lp .lp-actions { display: flex; flex-wrap: wrap; gap: calc(12 * var(--px)); }

/* Header */
.lp .lp-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: calc(22 * var(--px)) var(--pad);
	background: #f0f0f0;
}
.lp .lp-brand { display: flex; flex-direction: column; gap: calc(4 * var(--px)); text-decoration: none; }
.lp .lp-brand__logo { display: block; width: calc(152 * var(--px)); height: auto; }
.lp .lp-brand__sub { font-size: calc(13 * var(--px)); line-height: calc(18 * var(--px)); }

/* Hero */
.lp .lp-hero {
	display: grid;
	grid-template-columns: 820fr 620fr;
	min-height: calc(640 * var(--px));
	background: #f0f0f0;
}
.lp .lp-hero__copy {
	display: flex;
	flex-direction: column;
	gap: var(--gap);
	padding: var(--pad-y) var(--pad) calc(64 * var(--px));
}
.lp .lp-hero__text { display: flex; flex-direction: column; gap: calc(16 * var(--px)); max-width: calc(724 * var(--px)); }
.lp .lp-hero__media { padding: calc(40 * var(--px)); background: #cdeefa; }
.lp .lp-hero__well { position: relative; height: 100%; min-height: calc(560 * var(--px)); background: #b6e8fa; overflow: hidden; }
.lp .lp-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }

/* Facts */
.lp .lp-facts {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: calc(32 * var(--px));
	padding: calc(28 * var(--px)) var(--pad);
	background: #cdeefa;
}
.lp .lp-fact { padding: calc(8 * var(--px)) 0; display: flex; flex-direction: column; gap: calc(6 * var(--px)); }
.lp .lp-fact__label { font-family: "CentraNo2-Medium", Arial, sans-serif; font-size: var(--f-label); line-height: calc(16 * var(--px)); letter-spacing: 0.09em; text-transform: uppercase; }
.lp .lp-fact__value { font-size: var(--f-small); line-height: calc(24 * var(--px)); }

/* Qualifications */
.lp .lp-quals { display: flex; flex-direction: column; gap: var(--gap); padding: var(--pad-y) var(--pad); background: #f0f0f0; }
.lp .lp-years { display: grid; grid-template-columns: 1fr 1fr; gap: calc(16 * var(--px)); }
.lp .lp-card { display: flex; flex-direction: column; gap: calc(12 * var(--px)); padding: calc(28 * var(--px)); background: #fff; }
.lp .lp-card__label { font-family: "CentraNo2-Medium", Arial, sans-serif; font-size: calc(13 * var(--px)); line-height: calc(16 * var(--px)); letter-spacing: 0.09em; text-transform: uppercase; }
.lp .lp-card__item { font-size: var(--f-body); line-height: calc(28 * var(--px)); }

/* Theme block */
.lp .lp-theme { display: flex; flex-direction: column; gap: calc(20 * var(--px)); padding: calc(64 * var(--px)) var(--pad); background: #fff; }
.lp .lp-theme .lp-body { max-width: calc(1100 * var(--px)); }

/* Careers */
.lp .lp-careers { display: flex; flex-direction: column; gap: var(--gap); padding: var(--pad-y) var(--pad); background: #2c2b29; color: #fff; }
.lp .lp-roles { display: flex; flex-wrap: wrap; gap: calc(12 * var(--px)); list-style: none; }
.lp .lp-roles li { padding: calc(10 * var(--px)) calc(14 * var(--px)); border: 1px solid #fff; font-size: calc(16 * var(--px)); line-height: calc(20 * var(--px)); }
.lp .lp-careers__note, .lp .lp-careers__note p { font-size: var(--f-small); line-height: var(--lh-small); margin: 0; color: #fff; }
.lp .lp-careers a { color: #fff; }

/* Who can apply */
.lp .lp-who { display: grid; grid-template-columns: 1fr 1fr; gap: calc(48 * var(--px)); padding: var(--pad-y) var(--pad); background: #b6e8fa; }
.lp .lp-who__col { display: flex; flex-direction: column; gap: calc(16 * var(--px)); align-items: flex-start; }

/* Apply (wraps the live application form) */
.lp .lp-apply { padding: var(--pad-y) var(--pad) calc(80 * var(--px)); background: #f0f0f0; }
.lp .lp-apply__intro { max-width: calc(900 * var(--px)); margin: calc(20 * var(--px)) 0 calc(40 * var(--px)) !important; }
.lp .lp-apply .application-form-module { padding: 0; background: transparent; }
.lp .lp-apply .application-form-container { width: 100%; max-width: none; padding-right: 0; }
.lp .lp-apply .content-object { padding-left: 0; padding-right: 0; }

/* Footer */
.lp .lp-footer { display: flex; flex-direction: column; gap: calc(12 * var(--px)); padding: calc(36 * var(--px)) var(--pad) calc(40 * var(--px)); background: #2c2b29; color: #fff; }
.lp .lp-footer__line { font-family: "CentraNo2-Medium", Arial, sans-serif; font-size: calc(13 * var(--px)); line-height: calc(18 * var(--px)); }
.lp .lp-footer__ack { font-size: calc(13 * var(--px)); line-height: calc(20 * var(--px)); max-width: calc(1000 * var(--px)); }

/* Tablet and mobile */
@media (max-width: 900px) {
	html, body { font-size: 14px; }
	.lp {
		--pad: 22px;
		--pad-y: 44px;
		--f-h1: 36px;
		--lh-h1: 40px;
		--f-h2: 28px;
		--lh-h2: 34px;
		--f-lead: 18px;
		--lh-lead: 26px;
		--f-body: 17px;
		--lh-body: 25px;
		--f-small: 16px;
		--lh-small: 24px;
		--f-label: 12px;
		--f-btn: 15px;
		--gap: 20px;
		--px: 1px;
	}
	.lp .lp-header { padding: 16px var(--pad); }
	.lp .lp-brand__logo { width: 120px; }
	.lp .lp-brand__sub { font-size: 12px; }
	.lp .lp-hero { grid-template-columns: 1fr; min-height: 0; }
	.lp .lp-hero__copy { padding: 36px var(--pad) 40px; }
	.lp .lp-hero__media { padding: 20px; }
	.lp .lp-hero__well { min-height: 0; aspect-ratio: 4 / 3; }
	.lp .lp-facts { grid-template-columns: 1fr 1fr; gap: 12px 20px; padding: 20px var(--pad); }
	.lp .lp-fact__value { font-size: 16px; line-height: 22px; }
	.lp .lp-years { grid-template-columns: 1fr; }
	.lp .lp-card { padding: 22px; }
	.lp .lp-card__item { font-size: 17px; line-height: 24px; }
	.lp .lp-theme { padding: 40px var(--pad); }
	.lp .lp-roles li { font-size: 15px; line-height: 20px; }
	.lp .lp-who { grid-template-columns: 1fr; gap: 36px; }
	.lp .lp-apply { padding: 44px var(--pad) 56px; }
	.lp .lp-btn { padding: 14px 20px; line-height: 18px; }
	.lp .lp-pill { font-size: 12px; line-height: 16px; padding: 6px 10px; }
	.lp .lp-note, .lp .lp-note p { font-size: 15px; line-height: 22px; }
	.lp .lp-fact__label, .lp .lp-card__label { font-size: 12px; }
	.lp .lp-footer { padding: 28px var(--pad) 32px; }
	.lp .lp-footer__line, .lp .lp-footer__ack { font-size: 13px; line-height: 19px; }

	/* Keep the live form readable at this size */
	.lp .application-form-module .body1,
	.lp .application-form-module .body2,
	.lp .application-form-module .body3,
	.lp .application-form-module .body3 p { font-size: 16px; line-height: 1.3; }
	.lp .application-form-module .accordion-item-title { font-size: 24px; }
	.lp .application-form-module .form-group { grid-template-columns: 1fr; }
	.lp .application-form-module .field-group { grid-template-columns: 1fr; }
	.lp .application-form-module .accordion-item-content { padding-right: 0; }
	.lp .application-form-module input[type=text],
	.lp .application-form-module input[type=email],
	.lp .application-form-module textarea { font-size: 16px; }
}
