#langdon-app-overlay.langdon-popup-overlay {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, .78);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 9999;
	padding: 20px;
	opacity: 0;
	visibility: hidden;
	transition: opacity .22s ease, visibility .22s ease;
}

#langdon-app-overlay.langdon-popup-overlay[hidden] {
	display: none;
}

#langdon-app-overlay.langdon-popup-overlay.show {
	opacity: 1;
	visibility: visible;
}

#langdon-app-modal.langdon-popup-modal {
	max-width: 900px;
	width: 100%;
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 40px 80px rgba(0, 0, 0, .6);
	position: relative;
	background: #fff;
	color: #333;
	transform: scale(.96);
	transition: transform .22s ease;
	max-height: calc(100vh - 40px);
	overflow-y: auto;
}

#langdon-app-overlay.show #langdon-app-modal.langdon-popup-modal {
	transform: scale(1);
}

#langdonClose.langdon-close {
	position: absolute;
	top: 12px;
	right: 15px;
	width: 38px;
	height: 38px;
	font-size: 30px;
	line-height: 34px;
	border: none;
	border-radius: 50%;
	background: rgba(0, 0, 0, .14);
	color: #fff;
	cursor: pointer;
	opacity: .95;
	z-index: 10;
	padding: 0;
	text-align: center;
	appearance: none;
	transition: background .2s ease, opacity .2s ease;
}

#langdonClose.langdon-close:hover,
#langdonClose.langdon-close:focus {
	background: rgba(0, 0, 0, .28);
	opacity: 1;
	outline: 2px solid rgba(255, 255, 255, .8);
	outline-offset: 2px;
}

.langdon-popup-content {
	width: 100%;
}

.langdon-popup-content *,
.langdon-popup-content *::before,
.langdon-popup-content *::after {
	box-sizing: border-box;
}

@media (max-width: 768px) {
	#langdon-app-overlay.langdon-popup-overlay {
		padding: 12px;
	}

	#langdon-app-modal.langdon-popup-modal {
		max-height: calc(100dvh - 24px);
	}
}
