/**
 * Theatre / Looking Glass Concessions page
 * Targets Theatre page (slug: theatre) via body class .page-theatre.
 */
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400;600;700&family=Great+Vibes&display=swap');

/* -------------------------------------------------------------------------
   Full-screen first view: theatre fills viewport, footer only after scroll
   (mobile and all viewports)
   ------------------------------------------------------------------------- */
body.page-theatre {
	overflow-x: hidden;
	overflow-y: auto;
	min-height: 100vh;
	min-height: 100dvh;
	/* Theatre backdrop across entire page so no black space at bottom */
	background-color: #2a0a0a;
	background-image: url('./theatre/theatre-backdrop.png');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	background-attachment: scroll;
}
.page-theatre #content,
.page-theatre #content {
	min-height: 100vh;
	min-height: 100dvh;
}

/* -------------------------------------------------------------------------
   Page container: dark theatre interior, hide default page title
   ------------------------------------------------------------------------- */
.page-theatre .site-main,
.page-theatre .site-main {
	overflow-x: hidden;
	overflow-y: auto;
	/* Match body so bottom area has backdrop; transparent so body backdrop shows through */
	background: transparent;
	min-height: 100vh;
	min-height: 100dvh;
}

.page-theatre .page-header,
.page-theatre .page-header,
.page-theatre .entry-title,
.page-theatre .entry-title {
	display: none !important;
}

/* Curtain frame: fit exactly to viewport (no overflow); content centered and scrollable inside if needed */
.page-theatre .theatre-curtain-frame,
.page-theatre .theatre-curtain-frame {
	position: relative;
	background-color: #2a0a0a;
	background-image: url('./theatre/theatre-backdrop.png');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	overflow-x: visible;
	overflow-y: auto;
	height: 100vh;
	height: 100dvh;
	max-height: 100vh;
	max-height: 100dvh;
	z-index: 1;
	width: 100%;
	margin-left: 0;
	margin-right: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
}
/* Inner content fits within viewport; scrolls inside frame if content is tall */
.page-theatre .theatre-curtain-frame .elementor-container,
.page-theatre .theatre-curtain-frame .elementor-container,
.page-theatre .theatre-curtain-frame .theatre-stage-inner,
.page-theatre .theatre-curtain-frame .theatre-stage-inner {
	margin:0 auto;
	padding: 24px 20px !important;
	max-width:1200px;
	max-height: 100%;
	overflow-y: auto;
	overflow-x: hidden;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
/* Section padding for middle content */
.page-theatre .theatre-curtain-frame .elementor-section,
.page-theatre .theatre-curtain-frame .elementor-section {
	padding-top: 24px !important;
	padding-bottom: 24px !important;
}
/* First Elementor section on theatre page: exact viewport height so content fits screen */
.page-theatre .site-main > .elementor:first-child .elementor-section:first-child,
.page-theatre .site-main > .elementor:first-child .elementor-section:first-child,
.page-theatre .site-main > .elementor-section:first-child,
.page-theatre .site-main > .elementor-section:first-child {
	height: 100vh;
	height: 100dvh;
	max-height: 100vh;
	max-height: 100dvh;
	min-height: 0;
}
.page-theatre .site-main > .elementor:first-child .elementor-section:first-child .elementor-container,
.page-theatre .site-main > .elementor:first-child .elementor-section:first-child .elementor-container,
.page-theatre .site-main > .elementor-section:first-child .elementor-container,
.page-theatre .site-main > .elementor-section:first-child .elementor-container {
	height: 100%;
	max-height: 100%;
	min-height: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

/* Ensure parent containers don't clip curtains */
.page-theatre .elementor-section,
.page-theatre .elementor-section,
.page-theatre .elementor-container,
.page-theatre .elementor-container {
	overflow-x: visible !important;
}

.theatre-curtain-top {
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 3;
	object-fit: contain;
	filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.5));
}

@media (min-width: 768px) {
	.theatre-curtain-top {
		top: -30px;
	}
}

@media (min-width: 1280px) {
	.theatre-curtain-top {
		top: -256px;
	}

	.page-theatre .theatre-curtain-frame .theatre-stage-inner {
		margin-top: 85px;
	}
}

@media (min-width: 1536px) {
	.page-theatre .theatre-curtain-frame .theatre-stage-inner {
		margin-top: 100px;
	}

	.theatre-curtain-top {
		top: -320px;
	}
}

/* Left curtain – responsive width and scaling, full image visible including edges */
/* Image is 832x1248px. When scaled to 100% height, width = height * (832/1248) ≈ height * 0.667 */
/* To show full image including edges, container width must accommodate scaled image width */
.page-theatre .theatre-curtain-frame::before,
.page-theatre .theatre-curtain-frame::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: clamp(180px, 32vw, 700px);
	min-width: 180px;
	max-width: 700px;
	background: url('./theatre/curtain-left.png') left center no-repeat;
	background-size: auto 100%;
	background-position: left center;
	background-repeat: no-repeat;
	pointer-events: none;
	z-index: 1;
}

/* Right curtain – responsive width and scaling, full image visible including edges */
.page-theatre .theatre-curtain-frame::after,
.page-theatre .theatre-curtain-frame::after {
	content: '';
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	width: clamp(180px, 32vw, 700px);
	min-width: 180px;
	max-width: 700px;
	background: url('./theatre/curtain-right.png') right center no-repeat;
	background-size: auto 100%;
	background-position: right center;
	background-repeat: no-repeat;
	pointer-events: none;
	z-index: 1;
}

/* Tablet: slightly narrower curtains so content has more room */
/* max-lg: width < 64rem (1024px) */
@media (width < 64rem) {
	.page-theatre .theatre-curtain-frame::before,
	.page-theatre .theatre-curtain-frame::before {
		width: clamp(150px, 28vw, 600px);
		min-width: 150px;
		max-width: 600px;
		background-size: auto 100%;
	}
	.page-theatre .theatre-curtain-frame::after,
	.page-theatre .theatre-curtain-frame::after {
		width: clamp(150px, 28vw, 600px);
		min-width: 150px;
		max-width: 600px;
		background-size: auto 100%;
	}
}

/* Mobile: thin curtain strips so content stays readable */
@media (max-width: 768px) {
	.page-theatre .theatre-curtain-frame::before,
	.page-theatre .theatre-curtain-frame::before {
		width: clamp(120px, 24vw, 450px);
		min-width: 120px;
		max-width: 450px;
		background-size: auto 100%;
		background-position: left center;
	}
	.page-theatre .theatre-curtain-frame::after,
	.page-theatre .theatre-curtain-frame::after {
		width: clamp(120px, 24vw, 450px);
		min-width: 120px;
		max-width: 450px;
		background-size: auto 100%;
		background-position: right center;
	}
}

/* Very small screens: minimal curtain width */
@media (max-width: 480px) {
	.page-theatre .theatre-curtain-frame::before,
	.page-theatre .theatre-curtain-frame::before {
		width: clamp(100px, 22vw, 350px);
		min-width: 100px;
		max-width: 350px;
		background-size: auto 100%;
	}
	.page-theatre .theatre-curtain-frame::after,
	.page-theatre .theatre-curtain-frame::after {
		width: clamp(100px, 22vw, 350px);
		min-width: 100px;
		max-width: 350px;
		background-size: auto 100%;
	}
}

/* Ensure content stays in front of curtain pseudo-elements */
.page-theatre .theatre-curtain-frame .elementor-container,
.page-theatre .theatre-curtain-frame .elementor-container,
.page-theatre .theatre-curtain-frame .elementor-section-wrap,
.page-theatre .theatre-curtain-frame .elementor-section-wrap {
	position: relative;
	z-index: 2;
}

/* -------------------------------------------------------------------------
   Title typography: "Looking Glass" (cursive gold), "CONCESSIONS", "Enjoy"
   ------------------------------------------------------------------------- */
.page-theatre .theatre-title-main,
.page-theatre .theatre-title-main {
	font-family: 'Great Vibes', 'Dancing Script', cursive !important;
	font-weight: 400 !important;
	color: #daa520 !important;
	font-size: clamp(48px, 6.5vw, 96px) !important;
	line-height: 0.92 !important;
	text-align: center !important;
	margin: 0 0 8px !important;
	text-shadow: 0 0 20px rgba(218, 165, 32, 0.38);
}

.page-theatre .theatre-title-sub,
.page-theatre .theatre-title-sub {
	font-family: 'Dancing Script', cursive !important;
	font-size: clamp(30px, 3vw, 48px) !important;
	color: #f5f5f5 !important;
	text-align: center !important;
	/* Extra space between "Enjoy" and the concession frames below */
	margin: 8px 0 28px !important;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
}

.page-theatre .theatre-concessions-label,
.page-theatre .theatre-concessions-label {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	color: #ddb769 !important;
	font-size: clamp(22px, 2.3vw, 36px) !important;
	font-family: Georgia, 'Times New Roman', serif !important;
	font-weight: 500 !important;
	letter-spacing: 0.16em;
	margin: 0 auto !important;
	padding: 0 12px 12px !important;
	text-align: center !important;
}

.page-theatre .theatre-concessions-label::after,
.page-theatre .theatre-concessions-label::after {
	content: '';
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
	width: min(500px, 72vw);
	height: 1px;
	background: linear-gradient(90deg, rgba(221, 183, 105, 0) 0%, rgba(221, 183, 105, 0.62) 20%, rgba(221, 183, 105, 0.62) 80%, rgba(221, 183, 105, 0) 100%);
}

.page-theatre .theatre-heading-wrap,
.page-theatre .theatre-heading-wrap {
	text-align: center;
	margin: 0 auto 20px;
}

.page-theatre .theatre-title-icon,
.page-theatre .theatre-title-icon {
	width: clamp(38px, 3.2vw, 56px);
	height: clamp(38px, 3.2vw, 56px);
	object-fit: contain;
	filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.4));
}

/* -------------------------------------------------------------------------
   Marquee box: realistic light frame like poster reference
   ------------------------------------------------------------------------- */
.page-theatre .theatre-marquee-box,
.page-theatre .theatre-marquee-box {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	border: none !important;
	background-color: #2b140b !important;
	background-image:
		url('./theatre/light-bar-horizontal.png'),
		url('./theatre/light-bar-horizontal.png'),
		url('./theatre/light-bar-vertical.png'),
		url('./theatre/light-bar-vertical.png'),
		linear-gradient(rgba(32, 10, 8, 0.12), rgba(32, 10, 8, 0.12)),
		url('./theatre/theatre-backdrop.png') !important;
	background-repeat: repeat-x, repeat-x, repeat-y, repeat-y, no-repeat, no-repeat !important;
	background-position: top center, bottom center, left top, right top, center center, center center !important;
	background-size: auto 17px, auto 17px, 17px auto, 17px auto, cover, cover !important;
	border-radius: 8px;
	z-index: 2;
	box-shadow:
		0 0 0 2px rgba(110, 52, 18, 0.85),
		0 0 14px rgba(255, 191, 64, 0.26),
		inset 0 0 26px rgba(0, 0, 0, 0.35);
	/* Less top padding so icon and text sit a bit higher in the frame */
	padding: 25px 26px 32px !important;
	text-align: center !important;
}

/* Clickable marquee cards (Audiobooks, Soundtracks, Reviews): no default link styling */
.page-theatre a.theatre-marquee-box,
.page-theatre .theatre-marquee-link {
	color: inherit;
	text-decoration: none;
}

/* Inner panel like cinema poster card */
.page-theatre .theatre-marquee-box::before,
.page-theatre .theatre-marquee-box::before {
	content: '';
	position: absolute;
	inset: 16px;
	border-radius: 4px;
	border: 2px solid rgba(241, 179, 62, 0.55);
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(0, 0, 0, 0.08));
	pointer-events: none;
	z-index: 0;
}

.page-theatre .theatre-marquee-box::after,
.page-theatre .theatre-marquee-box::after {
	content: '';
	position: absolute;
	inset: -2px;
	border-radius: 12px;
	box-shadow:
		0 0 10px 2px rgba(255, 211, 106, 0.28),
		0 0 20px 4px rgba(255, 184, 61, 0.2);
	pointer-events: none;
	z-index: 0;
}

.page-theatre .theatre-marquee-box > *,
.page-theatre .theatre-marquee-box > * {
	position: relative;
	z-index: 1;
}

/* Center all content in the middle of each frame; slight upward shift */
.page-theatre .theatre-marquee-box .elementor-widget-wrap,
.page-theatre .theatre-marquee-box .elementor-widget-wrap {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	width: 100%;
	padding-top: 0;
	margin-top: -6px;
}
.page-theatre .theatre-marquee-box .elementor-heading-title,
.page-theatre .theatre-marquee-box .elementor-heading-title,
.page-theatre .theatre-marquee-box .elementor-widget-text-editor,
.page-theatre .theatre-marquee-box .elementor-widget-text-editor,
.page-theatre .theatre-marquee-box .elementor-widget-text-editor p,
.page-theatre .theatre-marquee-box .elementor-widget-text-editor p {
	text-align: center !important;
	margin-left: auto;
	margin-right: auto;
}

/* Fallback card content (icon + title + subtitle) */
.page-theatre .theatre-marquee-icon,
.page-theatre .theatre-marquee-icon {
	display: block;
	width: clamp(42px, 5.5vw, 66px);
	height: clamp(42px, 5.5vw, 66px);
	margin-left: auto;
	margin-right: auto;
	object-fit: contain;
	margin-bottom: 12px;
	filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.45));
}

.page-theatre .theatre-marquee-title,
.page-theatre .theatre-marquee-title {
	margin: 0 0 8px;
	font-family: Georgia, 'Times New Roman', serif;
	font-size: clamp(20px, 2.2vw, 30px);
	line-height: 1.05;
	color: #e0b55d;
	text-align: center;
	text-shadow: 0 2px 6px rgba(0, 0, 0, 0.5);
}

.page-theatre .theatre-marquee-title::after,
.page-theatre .theatre-marquee-title::after {
	content: '';
	display: block;
	width: min(72%, 220px);
	height: 1px;
	margin: 10px auto 0;
	background: linear-gradient(
		90deg,
		rgba(224, 181, 93, 0) 0%,
		rgba(224, 181, 93, 0.85) 25%,
		rgba(224, 181, 93, 0.85) 75%,
		rgba(224, 181, 93, 0) 100%
	);
}

.page-theatre .theatre-marquee-sub,
.page-theatre .theatre-marquee-sub {
	margin: 0;
	font-family: Georgia, 'Times New Roman', serif;
	font-size: clamp(15px, 1.7vw, 24px);
	line-height: 1.2;
	color: #e0b55d;
	text-align: center;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
}

/* Audiobooks title: slightly smaller so it fits with more side spacing */
.page-theatre .theatre-card-audiobooks .theatre-marquee-title,
.page-theatre .theatre-card-audiobooks .theatre-marquee-title {
	font-size: clamp(20px, 2.2vw, 30px);
}

/* Hover glow */
.page-theatre .theatre-marquee-box:hover,
.page-theatre .theatre-marquee-box:hover {
	box-shadow:
		0 0 0 2px rgba(150, 70, 22, 0.9),
		0 0 18px rgba(255, 209, 102, 0.34),
		inset 0 0 26px rgba(0, 0, 0, 0.35);
}

/* Fallback grid wrapper (page-theatre.php); extra space above so gap between Enjoy and frames */
.page-theatre .theatre-marquee-grid,
.page-theatre .theatre-marquee-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 22px;
	max-width: 760px;
	margin: 24px auto 0;
}

/* -------------------------------------------------------------------------
   Short viewport (e.g. iPad Mini 768x1024): fit all content without scrolling
   ------------------------------------------------------------------------- */
@media (max-height: 1024px) {
	.page-theatre .theatre-title-main,
	.page-theatre .theatre-title-main {
		font-size: clamp(36px, 5.5vw, 64px) !important;
		margin: 0 0 4px !important;
	}
	.page-theatre .theatre-title-sub,
	.page-theatre .theatre-title-sub {
		font-size: clamp(24px, 2.6vw, 36px) !important;
		margin: 4px 0 14px !important;
	}
	.page-theatre .theatre-concessions-label,
	.page-theatre .theatre-concessions-label {
		font-size: clamp(18px, 2vw, 26px) !important;
		gap: 10px;
		padding: 0 8px 8px !important;
	}
	.page-theatre .theatre-heading-wrap,
	.page-theatre .theatre-heading-wrap {
		margin: 0 auto 10px;
	}
	.page-theatre .theatre-title-icon,
	.page-theatre .theatre-title-icon {
		width: clamp(28px, 2.8vw, 42px);
		height: clamp(28px, 2.8vw, 42px);
	}
	.page-theatre .theatre-marquee-grid,
	.page-theatre .theatre-marquee-grid {
		gap: 14px;
		max-width: 680px;
		margin: 14px auto 0;
	}
	.page-theatre .theatre-marquee-box,
	.page-theatre .theatre-marquee-box {
		padding: 20px 18px 24px !important;
		background-size: auto 14px, auto 14px, 14px auto, 14px auto, cover, cover !important;
	}
	.page-theatre .theatre-marquee-box .elementor-widget-wrap,
	.page-theatre .theatre-marquee-box .elementor-widget-wrap {
		margin-top: -4px;
	}
	.page-theatre .theatre-marquee-box::before,
	.page-theatre .theatre-marquee-box::before {
		inset: 12px;
	}
	.page-theatre .theatre-marquee-icon,
	.page-theatre .theatre-marquee-icon {
		width: clamp(34px, 4.5vw, 48px);
		height: clamp(34px, 4.5vw, 48px);
		margin-bottom: 6px;
	}
	.page-theatre .theatre-marquee-title,
	.page-theatre .theatre-marquee-title {
		font-size: clamp(16px, 1.8vw, 22px);
		margin: 0 0 4px;
	}
	.page-theatre .theatre-marquee-title::after,
	.page-theatre .theatre-marquee-title::after {
		margin: 6px auto 0;
	}
	.page-theatre .theatre-marquee-sub,
	.page-theatre .theatre-marquee-sub {
		font-size: clamp(12px, 1.4vw, 18px);
	}
	.page-theatre .theatre-card-audiobooks .theatre-marquee-title,
	.page-theatre .theatre-card-audiobooks .theatre-marquee-title {
		font-size: clamp(16px, 1.9vw, 22px);
	}
	.page-theatre .theatre-curtain-frame .elementor-container,
	.page-theatre .theatre-curtain-frame .elementor-container,
	.page-theatre .theatre-curtain-frame .theatre-stage-inner,
	.page-theatre .theatre-curtain-frame .theatre-stage-inner {
		padding: 14px 16px !important;
	}
	.page-theatre .theatre-curtain-frame .elementor-section,
	.page-theatre .theatre-curtain-frame .elementor-section {
		padding-top: 14px !important;
		padding-bottom: 14px !important;
	}
	.page-theatre .theatre-concession-img.theatre-img-left,
	.page-theatre .theatre-concession-img.theatre-img-left {
		left: -4px !important;
	}
	.page-theatre .theatre-concession-img.theatre-img-right,
	.page-theatre .theatre-concession-img.theatre-img-right {
		right: -4px !important;
	}
}

@media (max-width: 639px) {
	.theatre-curtain-top {
		top: -50px;
		width: 115%;
		max-width: 115%;
	}

	.page-theatre .theatre-curtain-frame .theatre-stage-inner {
		padding-top: 85px !important;
	}
}

/* When both narrow and short (e.g. iPad Mini): keep compact, no tall portrait cards */
@media (max-width: 768px) and (max-height: 1024px) {
	.page-theatre .theatre-marquee-box,
	.page-theatre .theatre-marquee-box {
		aspect-ratio: auto !important;
		min-height: 0 !important;
		padding: 18px 14px 14px !important;
	}
	.page-theatre .theatre-marquee-grid,
	.page-theatre .theatre-marquee-grid {
		gap: 12px;
		max-width: 520px;
		margin: 12px auto 0;
	}
}

/* -------------------------------------------------------------------------
   Mobile tuning: make the 4 cards poster-like (portrait), like reference
   ------------------------------------------------------------------------- */
@media (max-width: 768px) {
	.page-theatre .theatre-heading-wrap,
	.page-theatre .theatre-heading-wrap {
		margin-bottom: 18px;
	}

	.page-theatre .theatre-title-main,
	.page-theatre .theatre-title-main {
		font-size: clamp(44px, 10.5vw, 68px) !important;
		margin-bottom: 6px !important;
	}

	.page-theatre .theatre-concessions-label,
	.page-theatre .theatre-concessions-label {
		font-size: clamp(20px, 5.8vw, 32px) !important;
		letter-spacing: 0.12em;
		gap: 10px;
		padding-bottom: 10px !important;
	}

	.page-theatre .theatre-concessions-label::after,
	.page-theatre .theatre-concessions-label::after {
		width: min(420px, 88vw);
	}

	.page-theatre .theatre-title-icon,
	.page-theatre .theatre-title-icon {
		width: clamp(32px, 8.6vw, 48px);
		height: clamp(32px, 8.6vw, 48px);
	}

	.page-theatre .theatre-title-sub,
	.page-theatre .theatre-title-sub {
		font-size: clamp(30px, 8.2vw, 46px) !important;
		margin: 8px 0 22px !important;
	}

	.page-theatre .theatre-marquee-grid,
	.page-theatre .theatre-marquee-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 16px;
		max-width: 560px;
		padding: 0 6px;
	}

	.page-theatre .theatre-marquee-box,
	.page-theatre .theatre-marquee-box {
		box-sizing: border-box;
		width: 100%;
		max-width: 100%;
		justify-self: stretch;
		margin: 0;
		border-radius: 10px;
		/* Portrait card ratio so frames are tall, not square */
		aspect-ratio: 3 / 3.2;
		min-height: 240px;
		padding: 28px 14px 24px !important;
		background-size: auto 15px, auto 15px, 15px auto, 15px auto, cover, cover !important;
		/* Center icon + text vertically in the frame */
		display: flex !important;
		flex-direction: column !important;
		justify-content: start !important;
		align-items: center !important;
	}
	.page-theatre .theatre-marquee-box .elementor-widget-wrap,
	.page-theatre .theatre-marquee-box .elementor-widget-wrap {
		margin-top: 0 !important;
	}
	/* Let inner column fill height so content can center in middle of frame */
	.page-theatre .theatre-marquee-box > .elementor-element,
	.page-theatre .theatre-marquee-box > .elementor-element {
		flex: 1;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		min-height: 0;
		width: 100%;
	}

	.page-theatre .theatre-marquee-box::before,
	.page-theatre .theatre-marquee-box::before {
		inset: 15px;
	}

	.page-theatre .theatre-marquee-box::after,
	.page-theatre .theatre-marquee-box::after {
		inset: -1px;
	}

	/* Center all text in the middle of the frame on mobile */
	.page-theatre .theatre-marquee-box .elementor-widget-wrap,
	.page-theatre .theatre-marquee-box .elementor-widget-wrap {
		align-items: center;
		justify-content: center;
		text-align: center;
	}
	.page-theatre .theatre-marquee-box .elementor-heading-title,
	.page-theatre .theatre-marquee-box .elementor-heading-title,
	.page-theatre .theatre-marquee-box .elementor-widget-text-editor,
	.page-theatre .theatre-marquee-box .elementor-widget-text-editor {
		text-align: center !important;
		margin-left: auto;
	/* Slightly smaller fonts in frame for mobile view only */
		margin-right: auto;
	}

	.page-theatre .theatre-marquee-box .elementor-heading-title,
	.page-theatre .theatre-marquee-box .elementor-heading-title {
		font-size: clamp(30px, 4.8vw, 42px) !important;
		line-height: 1.06;
	}

	.page-theatre .theatre-marquee-box .elementor-widget-text-editor,
	.page-theatre .theatre-marquee-box .elementor-widget-text-editor {
		font-size: clamp(20px, 3.4vw, 28px);
	}

	/* Larger icons in frame on mobile */
	.page-theatre .theatre-marquee-icon,
	.page-theatre .theatre-marquee-icon {
		width: clamp(64px, 14vw, 88px) !important;
		height: clamp(64px, 14vw, 88px) !important;
		margin-bottom: 12px;
	}
	.page-theatre .theatre-marquee-box .elementor-icon,
	.page-theatre .theatre-marquee-box .elementor-icon {
		font-size: clamp(48px, 12vw, 72px) !important;
		width: clamp(64px, 14vw, 88px) !important;
		height: clamp(64px, 14vw, 88px) !important;
	}

	.page-theatre .theatre-marquee-title,
	.page-theatre .theatre-marquee-title {
		font-size: clamp(20px, 4.1vw, 28px);
		line-height: 1.1;
		margin-bottom: 8px;
		text-align: center;
	}

	.page-theatre .theatre-marquee-title::after,
	.page-theatre .theatre-marquee-title::after {
		margin-top: 8px;
		width: min(74%, 180px);
	}

	.page-theatre .theatre-card-audiobooks .theatre-marquee-title,
	.page-theatre .theatre-card-audiobooks .theatre-marquee-title {
		font-size: clamp(20px, 4.2vw, 30px);
	}

	.page-theatre .theatre-marquee-sub,
	.page-theatre .theatre-marquee-sub {
		font-size: clamp(16px, 3.7vw, 24px);
		text-align: center;
	}

	.page-theatre .theatre-soon-badge,
	.page-theatre .theatre-soon-badge {
		top: 8px;
		right: 8px;
	}

	/* Larger concession images (popcorn, drink, etc.) on mobile */
	.page-theatre .theatre-concession-img,
	.page-theatre .theatre-concession-img {
		width: 90px !important;
		max-width: 90px !important;
		bottom: -10px !important;
		z-index: 0 !important;
	}

	.page-theatre .theatre-concession-img.theatre-img-left,
	.page-theatre .theatre-concession-img.theatre-img-left {
		left: -4px !important;
	}

	.page-theatre .theatre-concession-img.theatre-img-right,
	.page-theatre .theatre-concession-img.theatre-img-right {
		right: -4px !important;
	}

	.page-theatre .theatre-card-soundtracks .theatre-concession-img,
	.page-theatre .theatre-card-soundtracks .theatre-concession-img {
		width: 90px !important;
		right: -4px !important;
	}
}

/* ~744px view (e.g. Pixel 5): slightly larger concession images (popcorn, drink, etc.) */
@media (min-width: 600px) and (max-width: 768px) {
	.page-theatre .theatre-concession-img,
	.page-theatre .theatre-concession-img {
		width: 104px !important;
		max-width: 104px !important;
		bottom: -8px !important;
	}
	.page-theatre .theatre-img-landscape {
		width: 130px !important;
		max-width: 130px !important;
	}
	.page-theatre .theatre-concession-img.theatre-img-left,
	.page-theatre .theatre-concession-img.theatre-img-left {
		left: -2px !important;
	}
	.page-theatre .theatre-concession-img.theatre-img-right,
	.page-theatre .theatre-concession-img.theatre-img-right {
		right: -2px !important;
	}
	.page-theatre .theatre-card-soundtracks .theatre-concession-img,
	.page-theatre .theatre-card-soundtracks .theatre-concession-img {
		width: 104px !important;
	}
}

@media (max-width: 480px) {
	.page-theatre .theatre-title-main,
	.page-theatre .theatre-title-main {
		font-size: clamp(50px, 10.5vw, 84px) !important;
	}

	.page-theatre .theatre-concessions-label,
	.page-theatre .theatre-concessions-label {
		font-size: clamp(15px, 5.2vw, 22px) !important;
		letter-spacing: 0.1em;
		gap: 8px;
	}

	.page-theatre .theatre-title-icon,
	.page-theatre .theatre-title-icon {
		width: 26px;
		height: 26px;
	}

	.page-theatre .theatre-title-sub,
	.page-theatre .theatre-title-sub {
		font-size: clamp(22px, 7.5vw, 32px) !important;
		margin: 6px 0 14px !important;
	}

	.page-theatre .theatre-marquee-grid,
	.page-theatre .theatre-marquee-grid {
		gap: 12px;
		padding: 0 4px;
	}

	.page-theatre .theatre-marquee-box,
	.page-theatre .theatre-marquee-box {
		aspect-ratio: 2.6 / 4;
		min-height: 220px;
		padding: 15px 14px 40px !important;
		background-size: auto 13px, auto 13px, 13px auto, 13px auto, cover, cover !important;
		/* Center icon + text in the middle of the frame */
		display: flex !important;
		flex-direction: column !important;
		justify-content: center !important;
		align-items: center !important;
	}

	.page-theatre .theatre-marquee-box .elementor-widget-wrap,
	.page-theatre .theatre-marquee-box .elementor-widget-wrap {
		align-items: center;
		justify-content: center;
		text-align: center;
		margin-top: 0 !important;
	}
	.page-theatre .theatre-marquee-box > .elementor-element,
	.page-theatre .theatre-marquee-box > .elementor-element {
		flex: 1;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		min-height: 0;
		width: 100%;
	}
	.page-theatre .theatre-marquee-box .elementor-heading-title,
	.page-theatre .theatre-marquee-box .elementor-heading-title,
	.page-theatre .theatre-marquee-box .elementor-widget-text-editor,
	.page-theatre .theatre-marquee-box .elementor-widget-text-editor {
		text-align: center !important;
		margin-left: auto;
		margin-right: auto;
	}
	/* Smaller font sizes in frame for 480px view only */
	.page-theatre .theatre-marquee-box .elementor-heading-title,
	.page-theatre .theatre-marquee-box .elementor-heading-title {
		font-size: clamp(18px, 5.5vw, 24px) !important;
	}
	.page-theatre .theatre-marquee-box .elementor-widget-text-editor,
	.page-theatre .theatre-marquee-box .elementor-widget-text-editor {
		font-size: clamp(13px, 4vw, 18px) !important;
	}

	/* Larger icons on small mobile */
	.page-theatre .theatre-marquee-icon,
	.page-theatre .theatre-marquee-icon {
		width: clamp(48px, 14vw, 68px) !important;
		height: clamp(48px, 14vw, 68px) !important;
		margin-bottom: 8px;
	}
	.page-theatre .theatre-marquee-box .elementor-icon,
	.page-theatre .theatre-marquee-box .elementor-icon {
		font-size: clamp(36px, 12vw, 56px) !important;
		width: clamp(48px, 14vw, 68px) !important;
		height: clamp(48px, 14vw, 68px) !important;
	}

	.page-theatre .theatre-marquee-box::before,
	.page-theatre .theatre-marquee-box::before {
		inset: 13px;
	}

	.page-theatre .theatre-marquee-title,
	.page-theatre .theatre-marquee-title {
		font-size: clamp(14px, 5.5vw, 19px);
		text-align: center;
	}

	.page-theatre .theatre-marquee-title::after,
	.page-theatre .theatre-marquee-title::after {
		margin-top: 6px;
		width: min(78%, 150px);
	}

	.page-theatre .theatre-card-audiobooks .theatre-marquee-title,
	.page-theatre .theatre-card-audiobooks .theatre-marquee-title {
		font-size: clamp(15px, 6vw, 20px);
	}

	.page-theatre .theatre-marquee-sub,
	.page-theatre .theatre-marquee-sub {
		font-size: clamp(12px, 5vw, 17px);
		text-align: center;
	}

	/* Larger concession images (popcorn, drink, etc.) on small mobile */
	.page-theatre .theatre-concession-img,
	.page-theatre .theatre-concession-img {
		width: 45px !important;
		max-width: 45px !important;
		bottom: -8px !important;
		z-index: 0 !important;
	}

	.page-theatre .theatre-img-landscape {
		width: 70px !important;
		max-width: 70px !important;
	}

	.page-theatre .theatre-concession-img.theatre-img-left,
	.page-theatre .theatre-concession-img.theatre-img-left {
		left: -4px !important;
	}

	.page-theatre .theatre-concession-img.theatre-img-right,
	.page-theatre .theatre-concession-img.theatre-img-right {
		right: -4px !important;
	}

	.page-theatre .theatre-card-soundtracks .theatre-concession-img,
	.page-theatre .theatre-card-soundtracks .theatre-concession-img {
		width: 45px !important;
		right: -4px !important;
	}
}

/* -------------------------------------------------------------------------
   SOON badge
   ------------------------------------------------------------------------- */
.page-theatre .theatre-soon-badge,
.page-theatre .theatre-soon-badge {
	display: inline-block;
	padding: 2px 8px;
	background: linear-gradient(180deg, #e5bd72 0%, #c7933c 100%);
	color: #2a1a05;
	font-size: 10px;
	font-weight: 700;
	line-height: 1.15;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	border: 1px solid rgba(90, 55, 14, 0.35);
	border-radius: 0;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
	position: absolute;
	top: 14px;
	right: 16px;
	z-index: 3;
}

/* -------------------------------------------------------------------------
   Concession box content: icon and text in gold/white
   ------------------------------------------------------------------------- */
.page-theatre .theatre-marquee-box .elementor-icon,
.page-theatre .theatre-marquee-box .elementor-icon {
	color: #daa520;
}

.page-theatre .theatre-marquee-box .elementor-heading-title,
.page-theatre .theatre-marquee-box .elementor-heading-title {
	color: #daa520 !important;
}

.page-theatre .theatre-marquee-box .elementor-widget-text-editor,
.page-theatre .theatre-marquee-box .elementor-widget-text-editor {
	color: #e0b55d;
}

/* Concession image in corner: behind text (lower z-index), smaller, pushed to corner */
.page-theatre .theatre-concession-img,
.page-theatre .theatre-concession-img {
	position: absolute;
	bottom: -8px;
	width: 65px;
	height: auto;
	max-width: 65px;
	opacity: 0.9;
	z-index: 0;
	pointer-events: none;
	filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.4));
	object-fit: contain;
	object-position: bottom;
}

.page-theatre .theatre-img-landscape {
	width: 80px;
	max-width: 80px;
}

.page-theatre .theatre-concession-img.theatre-img-left,
.page-theatre .theatre-concession-img.theatre-img-left {
	left: -6px;
}

.page-theatre .theatre-concession-img.theatre-img-right,
.page-theatre .theatre-concession-img.theatre-img-right {
	right: -6px;
}

/* Ensure icon, title and subtitle stay above concession images */
.page-theatre .theatre-marquee-box .theatre-marquee-icon,
.page-theatre .theatre-marquee-box .theatre-marquee-icon,
.page-theatre .theatre-marquee-box .theatre-marquee-title,
.page-theatre .theatre-marquee-box .theatre-marquee-title,
.page-theatre .theatre-marquee-box .theatre-marquee-sub,
.page-theatre .theatre-marquee-box .theatre-marquee-sub,
.page-theatre .theatre-marquee-box .elementor-heading-title,
.page-theatre .theatre-marquee-box .elementor-heading-title,
.page-theatre .theatre-marquee-box .elementor-widget-text-editor,
.page-theatre .theatre-marquee-box .elementor-widget-text-editor {
	position: relative;
	z-index: 2;
}

/* -------------------------------------------------------------------------
   Theatre page: footer area uses same backdrop (no black space below content)
   ------------------------------------------------------------------------- */
body.page-theatre #site-footer,
body.page-theatre #site-footer,
.page-theatre .elementor-location-footer,
.page-theatre .elementor-location-footer {
	background: transparent !important;
}
body.page-theatre .elementor-location-footer .elementor-section,
body.page-theatre .elementor-location-footer .elementor-section {
	background: transparent !important;
}
