/* ============================================================
   Exit-intent newsletter modal — desktop only.
   See assets/exit-intent.js for trigger logic and inc/exit-intent.php
   for the markup + server-side eligibility.
   ============================================================ */

/* Hard belt-and-suspenders mobile skip. JS already gates by
   viewport, but if storage is blocked or the user resizes the
   window after page load, this prevents a tablet from getting
   a modal that wasn't designed for it. */
@media (max-width: 720px) {
	.uj-exit-intent { display: none !important; }
}

/* The container takes the full viewport but is invisible until
   .is-open is added. */
.uj-exit-intent {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s ease;
}
.uj-exit-intent[hidden] {
	display: none !important;
}
.uj-exit-intent.is-open {
	opacity: 1;
	pointer-events: auto;
}

/* Backdrop — soft slate dim, click-to-close */
.uj-exit-intent__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(31, 41, 55, 0.55);
	cursor: pointer;
}

/* Panel — centered card with brand-red accent */
.uj-exit-intent__panel {
	position: relative;
	width: 100%;
	max-width: 480px;
	background: #ffffff;
	border-radius: 12px;
	border-top: 4px solid #B3421D;
	padding: 2rem 2rem 1.625rem;
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
	transform: translateY(20px) scale(0.96);
	transition: transform 0.25s cubic-bezier(0.2, 0, 0.2, 1);
	font: 0.9375rem/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.uj-exit-intent.is-open .uj-exit-intent__panel {
	transform: translateY(0) scale(1);
}

/* Close (X) button — flex-centered so the glyph sits dead-center
   inside the circular hover halo (default text baseline alignment
   leaves it slightly low). */
.uj-exit-intent__close {
	position: absolute;
	top: 0.5rem;
	right: 0.5rem;
	width: 36px;
	height: 36px;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: 0;
	color: #9ca3af;
	font: 700 1.5rem/1 -apple-system, BlinkMacSystemFont, sans-serif;
	cursor: pointer;
	border-radius: 50%;
	transition: background 0.15s ease, color 0.15s ease;
	-webkit-appearance: none;
	appearance: none;
}
.uj-exit-intent__close:hover,
.uj-exit-intent__close:focus-visible {
	background: #f3f4f6;
	color: #1f2937;
	outline: none;
}

/* Eyebrow */
.uj-exit-intent__eyebrow {
	margin: 0 0 0.5rem !important;
	font: 700 0.6875rem/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
	color: #B3421D !important;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

/* Headline — Oswald to match brand voice */
.uj-exit-intent__heading {
	margin: 0 0 0.75rem !important;
	font: 600 1.5rem/1.2 "Oswald", "Arial Narrow", "Helvetica Neue Condensed", Impact, sans-serif !important;
	color: #B3421D !important;
	letter-spacing: 0.01em;
}

/* Body copy */
.uj-exit-intent__body {
	margin: 0 0 1.25rem !important;
	color: #4b5563 !important;
	font-size: 0.9375rem !important;
	line-height: 1.55 !important;
}

/* Strip the nested [uj_newsletter_inline] shortcode's container
   chrome (warm gradient, red border-left, padding). The modal panel
   already provides its own card surround, so the inner aside would
   otherwise read as a duplicate boxed-within-a-box. Same pattern
   as .uj-cta--exit .uj-cta--newsletter in single-article.css. */
.uj-exit-intent__form .uj-cta--newsletter {
	background: transparent !important;
	border: 0 !important;
	border-left: 0 !important;
	border-radius: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	box-shadow: none !important;
}

/* Small backstop link under the form for visitors who'd rather
   browse past issues before subscribing. Quiet gray underline so
   it doesn't compete with the Subscribe button above or the
   decline link below. */
.uj-exit-intent__archive-link {
	margin: 0.75rem 0 0 !important;
	text-align: center;
	font-size: 0.8125rem !important;
	line-height: 1.4 !important;
	color: #6b7280 !important;
}
.uj-exit-intent__archive-link a {
	color: #6b7280;
	text-decoration: underline;
}
.uj-exit-intent__archive-link a:hover,
.uj-exit-intent__archive-link a:focus-visible {
	color: #1f2937;
	outline: none;
}

/* Forminator form inside the modal — match site CTA visual language */
.uj-exit-intent__form .forminator-button-submit,
.uj-exit-intent__form button[type="submit"] {
	display: block !important;
	width: 100% !important;
	padding: 0.875rem 1.5rem !important;
	background: #B3421D !important;
	color: #ffffff !important;
	border: 0 !important;
	border-radius: 999px !important;
	font: 600 0.9375rem/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
	text-decoration: none !important;
	cursor: pointer !important;
	letter-spacing: 0.01em !important;
	transition: background 0.15s ease, transform 0.15s ease;
	-webkit-appearance: none;
	appearance: none;
}
.uj-exit-intent__form .forminator-button-submit:hover,
.uj-exit-intent__form button[type="submit"]:hover {
	background: #8E331A !important;
	transform: translateY(-1px);
}

/* Decline link — quieter than the X, tells the visitor "you don't
   have to engage". Underlined gray text, hover darken. */
.uj-exit-intent__decline {
	display: block;
	margin: 0.875rem auto 0;
	background: transparent;
	border: 0;
	color: #6b7280;
	font: 500 0.875rem/1 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	cursor: pointer;
	padding: 0.5rem 0.75rem;
	text-decoration: underline;
	-webkit-appearance: none;
	appearance: none;
}
.uj-exit-intent__decline:hover,
.uj-exit-intent__decline:focus-visible {
	color: #1f2937;
	outline: none;
}