/* Reusable support compositions with independently editable native blocks. */
.wp-site-blocks .emergency-page-shell:has(.emergency-giving-composition) {
	padding-inline: 0 !important;
}

.editor-styles-wrapper .emergency-giving-composition.emergency-page-composition.alignfull,
.wp-site-blocks .wp-block-post-content > .emergency-giving-composition.emergency-page-composition.alignfull {
	width: min(100%, var(--emergency-layout-boxed-max-width)) !important;
	margin-inline: auto !important;
	max-width: var(--emergency-layout-boxed-max-width) !important;
}

.wp-site-blocks .emergency-giving-composition > .alignfull,
.editor-styles-wrapper .emergency-giving-composition > .alignfull,
.emergency-giving-hero .emergency-giving-hero__media.alignfull {
	width: 100% !important;
	max-width: 100% !important;
	margin-inline: 0 !important;
}

.emergency-giving-composition > *,
.emergency-giving-hero > *,
.emergency-giving-grid > * {
	margin-block: 0;
}

.emergency-giving-hero {
	position: relative;
	color: var(--wp--preset--color--white);
}

.emergency-giving-hero__media {
	box-sizing: border-box;
	padding: 0 var(--emergency-layout-margin);
	align-items: end;
	overflow: hidden;
}

.emergency-giving-hero__media::after {
	position: absolute;
	inset: 0;
	content: "";
	background: linear-gradient(204deg, transparent 52%, rgb(0 0 0 / 60%) 85%);
	pointer-events: none;
}

.emergency-giving-hero__media > .wp-block-cover__image-background {
	width: 136.25%;
	max-width: none;
	height: 119.25%;
	left: -18.12%;
	object-fit: fill;
}

.emergency-giving-hero__media .wp-block-cover__inner-container {
	z-index: 2;
	padding-bottom: var(--wp--preset--spacing--60);
}

.emergency-giving-hero__copy {
	width: min(52%, 40rem);
	margin-inline: 0 !important;
	color: var(--wp--preset--color--white);
}

.emergency-giving-hero__copy h1 {
	margin: 0;
	text-transform: uppercase;
}

.emergency-giving-hero__copy p {
	border-left: 3px solid var(--wp--preset--color--red);
	padding-left: 1rem;
	font-size: var(--wp--custom--utopia--step-0);
	font-weight: 700;
	line-height: 1.2;
	margin-block: var(--wp--preset--spacing--40) 0;
}

.emergency-giving-hero__form {
	position: absolute;
	z-index: 3;
	right: var(--emergency-layout-margin);
	bottom: var(--wp--preset--spacing--60);
	width: min(36%, 27.125rem);
	max-width: none;
}

.emergency-giving-hero__form.emergency-donation-sticky .wp-block-emergency-donation-form {
	--emergency-donation-card-padding: 24px;
	min-height: 472px;
	margin-top: 0;
	box-shadow: none;
	background: var(--wp--preset--color--white);
}

.emergency-giving-hero__form .emergency-donation__panel {
	min-height: 424px !important;
}

.emergency-giving-map {
	background: var(--wp--preset--color--grey-100);
	padding-block: var(--wp--preset--spacing--70);
}

.emergency-giving-map > .emergency-section__shell {
	width: calc(100% - 2 * var(--emergency-layout-margin));
	max-width: var(--emergency-layout-max-width);
	margin-inline: auto;
}

.emergency-giving-map h2 {
	text-align: center;
	margin: 0 0 var(--wp--preset--spacing--60);
}

.emergency-giving-collection {
	padding-block: var(--wp--preset--spacing--70) 0;
}

.emergency-giving-collection > h2 {
	margin: 0 0 var(--wp--preset--spacing--40);
}

.emergency-giving-grid {
	gap: var(--wp--preset--spacing--50) calc(2 * var(--emergency-layout-gutter));
	padding-block: var(--emergency-layout-gutter) 0;
}

.emergency-giving-grid--featured {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.emergency-giving-card {
	position: relative;
	min-width: 0;
	max-width: none !important;
	width: 100%;
}

.emergency-giving-card + .emergency-giving-card::before {
	left: calc(-1 * var(--emergency-layout-gutter));
}

.emergency-giving-card:nth-child(3n + 1)::before,
.emergency-giving-grid--featured
.emergency-giving-card:nth-child(2n + 1)::before {
	display: none;
}

.emergency-giving-grid--featured .emergency-giving-card:nth-child(2n)::before {
	display: block;
}

.emergency-giving-card figure {
	margin: 0;
}

.emergency-giving-card h3 {
	margin-block: var(--wp--preset--spacing--40) var(--wp--preset--spacing--30);
}

.emergency-giving-card p {
	margin: 0;
}

.emergency-giving-card .wp-block-buttons {
	margin-block: var(--wp--preset--spacing--40) 0;
}

.emergency-giving-methods {
	padding-block: var(--wp--preset--spacing--70);
	text-align: center;
}

.emergency-giving-methods > h2,
.emergency-giving-methods > p {
	max-width: 54rem;
	margin-inline: auto;
}

.emergency-giving-methods > h2 {
	font-family: var(--wp--preset--font-family--serif-text);
	font-size: var(--emergency-type-title-serif-3xl);
	font-weight: 400;
	line-height: 1.1;
	margin-block: 0 var(--wp--preset--spacing--50);
}

.emergency-giving-methods__accounts {
	max-width: 70rem;
	margin: var(--wp--preset--spacing--70) auto !important;
	text-align: left;
	gap: calc(2 * var(--emergency-layout-gutter));
}

.emergency-giving-methods__accounts .wp-block-column + .wp-block-column {
	border-left: 1px solid var(--wp--preset--color--grey-300);
	padding-left: var(--emergency-layout-gutter);
}

.emergency-giving-methods__accounts h3 {
	font:
		400 var(--emergency-type-title-serif-2xl) / 1.1
		var(--wp--preset--font-family--serif);
}

.emergency-giving-methods__accounts p {
	font-size: var(--wp--custom--utopia--step-minus-2);
	overflow-wrap: anywhere;
}

.emergency-giving-faq {
	padding-block: var(--wp--preset--spacing--70);
}

.emergency-giving-faq .emergency-faq__aside {
	text-align: center;
}

.emergency-giving-faq .emergency-faq__list {
	max-width: 50.4375rem;
	margin-inline: auto;
}

.emergency-giving-extra {
	padding-bottom: var(--wp--preset--spacing--60);
}

@media (max-width: 63.999rem) {

	.emergency-giving-hero__media {
		min-height: 655px !important;
	}

	.emergency-giving-hero__media > .wp-block-cover__image-background {
		width: 346.99%;
		height: 100%;
		left: -92.87%;
		object-fit: cover;
	}

	.emergency-giving-hero__media .wp-block-cover__inner-container {
		padding-bottom: 104px;
	}

	.emergency-giving-hero__copy {
		width: 100%;
		max-width: 35rem;
	}

	.emergency-giving-hero__copy h1 {
		max-width: 12ch;
	}

	.emergency-giving-hero__copy p {
		font-size: 18px;
	}

	.emergency-giving-hero .emergency-giving-hero__form {
		padding: 0;
		position: relative;
		right: auto;
		bottom: auto;
		width: calc(100% - 2 * var(--emergency-layout-margin));
		max-width: 27.125rem;
		margin: -96px auto 0 !important;
	}

	.emergency-giving-map {
		padding-block: var(--wp--preset--spacing--60);
	}

	.emergency-giving-map h2 {
		margin-bottom: var(--wp--preset--spacing--50);
	}

	.emergency-giving-map .emergency-map__inner {
		padding-block: 0;
	}

	.emergency-giving-collection {
		padding-top: var(--wp--preset--spacing--60);
	}

	.emergency-giving-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap:
			var(--wp--preset--spacing--50)
			var(--emergency-layout-mobile-gutter);
	}

	.emergency-giving-grid--featured {
		grid-template-columns: minmax(0, 1fr);
	}

	.emergency-giving-card::before {
		display: none !important;
	}

	.emergency-giving-methods,
	.emergency-giving-faq {
		padding-block: var(--wp--preset--spacing--60);
		text-align: left;
	}

	.emergency-giving-methods__accounts {
		margin-block: var(--wp--preset--spacing--60) !important;
		flex-direction: column;
	}

	.emergency-giving-methods__accounts .wp-block-column + .wp-block-column {
		border-left: 0;
		padding-left: 0;
	}

	.emergency-giving-faq .emergency-faq__aside {
		text-align: left;
	}
}

/* The editor previews the map geometry without loading interactive tiles. */
.editor-styles-wrapper .emergency-map--editorial .emergency-map__canvas {
	background: url(../images/support-figma/map-preview.png) center / cover;
}

.editor-styles-wrapper .emergency-map--editorial .emergency-map__drawer,
.editor-styles-wrapper .emergency-map--editorial .emergency-map__scrim {
	display: none;
}

@media (min-width: 64rem) {

	.editor-styles-wrapper .emergency-giving-hero__form {
		position: absolute !important;
		margin-inline: 0 !important;
	}
}