/**
 * NCB Funeral Notices - single notice.
 * Author: NCB Software
 *
 * Adjustable: --ncbfn-decor-radius, --ncbfn-decor-shadow, --ncbfn-media-gap,
 * --ncbfn-decor-mobile-width.
 */
.ncbfn-notice {
	--ncbfn-decor-radius: 22px;
	--ncbfn-decor-shadow: 0 6px 18px rgba(0, 0, 0, 0.28);
	--ncbfn-media-gap: 24px;
	--ncbfn-decor-mobile-width: min(75%, 280px);
	box-sizing: border-box;
}

.ncbfn-notice__media {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--ncbfn-media-gap);
}

/* Desktop: decor 40% | notice 60%, same height. */
.ncbfn-notice--has-decor .ncbfn-notice__media {
	grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
	align-items: stretch;
}

.ncbfn-notice__decor {
	position: relative;
	overflow: hidden;
	min-height: 0;
	border-radius: var(--ncbfn-decor-radius);
	box-shadow: var(--ncbfn-decor-shadow);
	background: #1a0d08;
}

/* Absolute, so the decor never pushes the row taller than the notice. */
.ncbfn-notice .ncbfn-notice__decor-image {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	margin: 0;
	object-fit: cover;
	object-position: center;
}

.ncbfn-notice__frame {
	position: relative;
	min-width: 0;
}

.ncbfn-notice .ncbfn-notice__image {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
}

.ncbfn-notice__form {
	margin-top: 2.5em;
}

/* Mobile: decor on top at its own proportions, notice underneath. */
@media (max-width: 640px) {
	.ncbfn-notice--has-decor .ncbfn-notice__media {
		grid-template-columns: minmax(0, 1fr);
	}

	.ncbfn-notice__decor {
		width: var(--ncbfn-decor-mobile-width);
		margin: 0 auto;
		aspect-ratio: var(--ncbfn-decor-ratio, 3 / 4);
	}
}