.rcp-duo {
	--rcp-duo-ratio: 4 / 5;
	--rcp-duo-w1: 64%;
	--rcp-duo-w2: 52%;
	--rcp-duo-frame: #fff;
	--rcp-duo-block: var(--e-global-color-secondary, #f3ede1);
	--rcp-duo-off: 48px;
	--rcp-duo-r: 0px;
	position: relative;
}

.rcp-duo__fig {
	margin: 0;
	overflow: hidden;
	aspect-ratio: var(--rcp-duo-ratio);
	border-radius: var(--rcp-duo-r);
	background: rgba(0, 0, 0, 0.04);
}

.rcp-duo .rcp-duo__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
}

/* Dwa zdjęcia: główne u góry z lewej, mniejsze w ramce na dole z prawej. */
.rcp-duo-overlap .rcp-duo {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
}

.rcp-duo-overlap .rcp-duo__fig--main {
	width: var(--rcp-duo-w1);
}

.rcp-duo-overlap .rcp-duo__fig--small {
	position: relative;
	z-index: 2;
	justify-self: end;
	box-sizing: border-box;
	width: var(--rcp-duo-w2);
	/* Nachodzi na główne zdjęcie mniej więcej o 40% swojej wysokości. */
	margin-top: calc(var(--rcp-duo-lap, calc(var(--rcp-duo-w2) * 0.5)) * -1);
	border: 10px solid var(--rcp-duo-frame);
}

/* Elementor zeruje margines <figure> regułą o wysokiej szczegółowości. */
.elementor-widget.rcp-duo-overlap .rcp-duo .rcp-duo__fig.rcp-duo__fig--small {
	margin-top: calc(var(--rcp-duo-lap, calc(var(--rcp-duo-w2) * 0.5)) * -1);
	border-radius: calc(var(--rcp-duo-r) + 10px);
}

/* Jedno zdjęcie z blokiem koloru wystającym spod lewego dolnego rogu. */
.rcp-duo-block .rcp-duo {
	padding: 0 0 var(--rcp-duo-off) var(--rcp-duo-off);
}

.rcp-duo-block .rcp-duo::before {
	content: "";
	position: absolute;
	inset: var(--rcp-duo-off) var(--rcp-duo-off) 0 0;
	background: var(--rcp-duo-block);
	border-radius: var(--rcp-duo-r);
}

.rcp-duo-block .rcp-duo__fig--main {
	position: relative;
}
