.ep-age-gate[hidden] {
	display: none;
}

.ep-age-gate {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: grid;
	place-items: center;
	padding: 1.25rem;
	font-family: 'DM Sans', sans-serif;
	color: #f2f2f2;
}

.ep-age-gate__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(10, 10, 10, 0.94);
}

.ep-age-gate__panel {
	position: relative;
	width: min(100%, 34rem);
	padding: clamp(1.5rem, 5vw, 3rem);
	background: #242424;
	border: 1px solid #686868;
}

.ep-age-gate__wordmark {
	display: block;
	width: fit-content;
	margin: 0 auto 2.25rem;
	padding: 0.6rem 1rem;
	border: 2px solid #f2f2f2;
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.ep-age-gate__panel > p:not(.ep-age-gate__wordmark) {
	max-width: 52ch;
	margin: 0 0 0.9rem;
	font-size: 1rem;
	line-height: 1.65;
	color: #d0d0d0;
}

.ep-age-gate__actions {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.75rem;
	margin-top: 2rem;
}

.ep-age-gate__actions button {
	min-height: 3.25rem;
	padding: 0.875rem 1rem;
	border-radius: 0;
	font: inherit;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	cursor: pointer;
}

.ep-age-gate__confirm {
	background: #ededed;
	border: 1px solid #ededed;
	color: #171717;
}

.ep-age-gate__confirm:hover {
	background: #d2d2d2;
	border-color: #d2d2d2;
}

.ep-age-gate__leave {
	background: transparent;
	border: 1px solid #686868;
	color: #f2f2f2;
}

.ep-age-gate__leave:hover {
	background: #303030;
}

.ep-age-gate__actions button:focus-visible {
	outline: 2px solid #f2f2f2;
	outline-offset: 3px;
}

body.ep-age-gate-open {
	overflow: hidden;
}

@media (max-width: 520px) {
	.ep-age-gate {
		place-items: start center;
		overflow-y: auto;
	}

	.ep-age-gate__panel {
		margin: auto 0;
		padding: 1.25rem;
	}

	.ep-age-gate__wordmark {
		margin-bottom: 1.5rem;
	}

	.ep-age-gate__actions {
		grid-template-columns: 1fr;
		margin-top: 1.5rem;
	}
}
