/* Responsive corrections for the locally mirrored PG game landing page. */
:root {
	--site-header-height: 76px;
	--site-content-width: 1200px;
	--site-gutter: clamp(16px, 3vw, 40px);
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	width: 100%;
	max-width: 100%;
	overflow-x: clip;
	scroll-padding-top: var(--site-header-height);
}

body {
	width: 100%;
	max-width: 100%;
	margin-inline: auto;
	overflow-x: hidden;
}

img,
svg,
video,
iframe {
	max-width: 100%;
}

img {
	height: auto;
}

.elementor,
.elementor-section,
.elementor-container,
.elementor-column,
.elementor-widget-wrap,
.elementor-widget-container {
	min-width: 0;
}

.elementor-section.elementor-section-boxed > .elementor-container {
	width: min(calc(100% - 2 * var(--site-gutter)), var(--site-content-width));
	max-width: var(--site-content-width);
}

.elementor-261 .elementor-element-968e5d4.elementor-sticky--active {
	left: 0 !important;
	right: 0 !important;
	width: 100vw !important;
	max-width: 100vw !important;
}

.elementor-background-slideshow,
.elementor-background-slideshow .swiper-wrapper,
.elementor-background-slideshow .swiper-slide,
.elementor-background-slideshow__slide__image {
	height: 100% !important;
}

.elementor-background-slideshow__slide__image {
	background-position: center center !important;
	background-size: cover !important;
}

.elementor-element-228cd5c3 {
	min-height: min(85vh, 900px);
	min-height: min(85svh, 900px);
}

.elementor-element-228cd5c3 > .elementor-container {
	min-height: inherit;
}

.elementor-element-228cd5c3 .elementor-background-slideshow .swiper-slide {
	min-height: 100%;
}

.elementor-widget-heading,
.elementor-widget-text-editor,
.elementor-widget-button {
	max-width: 100%;
}

/* Keep the desktop header promotion button at its natural width. The nested
   Elementor shortcode otherwise lets the Chinese label wrap one character
   per line when its auto-width columns shrink. */
@media (min-width: 768px) {
	.elementor-261 .elementor-element-2a1183d,
	.elementor-261 .elementor-element-2a1183d > .elementor-widget-container,
	.elementor-261 .elementor-element-2a1183d .elementor-shortcode,
	.elementor-33905 .elementor-element-2547e90,
	.elementor-33905 .elementor-element-2547e90 > .elementor-container,
	.elementor-33905 .elementor-element-b9c4a00,
	.elementor-33905 .elementor-element-b9c4a00 > .elementor-element-populated,
	.elementor-33905 .elementor-element-ea97123,
	.elementor-33905 .elementor-element-ea97123 > .elementor-widget-container,
	.elementor-33905 .elementor-element-ea97123 .elementor-button-wrapper {
		width: max-content !important;
		max-width: none !important;
		flex: 0 0 auto;
	}

	.elementor-33905 .elementor-element-ea97123 .elementor-button {
		display: inline-flex;
		width: max-content;
		min-width: 236px;
		min-height: 52px;
		max-width: none;
		align-items: center;
		justify-content: center;
		padding: 12px 20px;
		white-space: nowrap;
	}

	.elementor-33905 .elementor-element-ea97123 .elementor-button-content-wrapper {
		display: inline-flex;
		width: max-content;
		flex-wrap: nowrap;
		align-items: center;
		white-space: nowrap;
	}

	.elementor-33905 .elementor-element-ea97123 .elementor-button-text {
		white-space: nowrap;
		word-break: keep-all;
	}
}

.elementor-widget-heading h1,
.elementor-widget-heading h2,
.elementor-widget-heading h3 {
	text-wrap: balance;
}

@media (min-width: 768px) and (max-width: 1024px) {
	:root {
		--site-header-height: 72px;
		--site-gutter: 24px;
	}

	.elementor-261 .elementor-element-968e5d4.elementor-sticky--active {
		inset-inline: 0 !important;
		width: 100vw !important;
		max-width: 100vw !important;
	}
}

@media (max-width: 1024px) {
	.elementor-349 .elementor-column.elementor-col-25,
	.elementor-349 .elementor-column.elementor-col-33 {
		width: 50% !important;
	}
}

@media (max-width: 767px) {
	:root {
		--site-header-height: 64px;
		--site-gutter: 16px;
	}

	.elementor-261 .elementor-element-968e5d4.elementor-sticky--active {
		inset-inline: 0 !important;
		width: 100vw !important;
		max-width: 100vw !important;
		margin-inline: 0 !important;
	}

	.elementor-261 .elementor-element-968e5d4 > .elementor-container {
		display: flex !important;
		width: 100% !important;
		max-width: none !important;
		min-height: var(--site-header-height);
		padding-inline: 16px;
		align-items: center;
		justify-content: space-between;
		flex-wrap: nowrap !important;
	}

	.elementor-261 .elementor-element-02bcf69,
	.elementor-261 .elementor-element-85a229b {
		width: auto !important;
		max-width: none !important;
		flex: 0 0 auto;
	}

	.elementor-261 .elementor-element-5d9eb79,
	.elementor-261 .elementor-element-5d9eb79 .elementor-widget-container,
	.elementor-261 .elementor-element-5d9eb79 a {
		display: block;
		width: auto;
		max-width: 46vw;
	}

	.elementor-261 .elementor-element-5d9eb79 img {
		display: block;
		width: clamp(132px, 40vw, 176px) !important;
		max-width: 100%;
		height: auto !important;
	}

	.elementor-261 .elementor-element-2a1183d {
		display: none !important;
	}

	.elementor-261 .elementor-element-d34be01 {
		display: block !important;
		width: 42px !important;
		margin-inline-start: auto;
	}

	.elementor-261 .elementor-element-d34be01 .elementor-icon {
		display: flex;
		width: 42px;
		height: 42px;
		align-items: center;
		justify-content: center;
	}

	.elementor-element-228cd5c3 {
		min-height: clamp(600px, calc(100svh - var(--site-header-height)), 760px);
		padding-block: 80px 32px;
	}

	.elementor-element-228cd5c3 > .elementor-container {
		min-height: 0;
	}

	.elementor-element-228cd5c3 .elementor-background-slideshow,
	.elementor-element-228cd5c3 .elementor-background-slideshow .swiper-wrapper,
	.elementor-element-228cd5c3 .elementor-background-slideshow .swiper-slide {
		position: absolute;
		inset: 0;
	}

	.elementor-349 .elementor-column.elementor-col-50,
	.elementor-349 .elementor-column.elementor-col-66,
	.elementor-349 .elementor-column.elementor-col-100 {
		width: 100% !important;
	}

	.elementor-349 .elementor-section,
	.elementor-349 .elementor-container {
		max-width: 100%;
	}

	.elementor-349 .elementor-column-gap-default > .elementor-column > .elementor-element-populated,
	.elementor-349 .elementor-column-gap-wide > .elementor-column > .elementor-element-populated,
	.elementor-349 .elementor-column-gap-wider > .elementor-column > .elementor-element-populated {
		padding: 8px;
	}

	.elementor-widget-heading h1 {
		font-size: clamp(28px, 8vw, 42px) !important;
		line-height: 1.2;
	}

	.elementor-widget-heading h2 {
		font-size: clamp(23px, 6.5vw, 34px) !important;
		line-height: 1.3;
	}

	.elementor-widget-heading h3 {
		font-size: clamp(18px, 5vw, 24px) !important;
		line-height: 1.35;
	}

	.elementor-widget-text-editor,
	.elementor-widget-text-editor p {
		font-size: 15px;
		line-height: 1.75;
	}

	.elementor-widget-button .elementor-button {
		max-width: 100%;
		white-space: normal;
	}

	.elementor-widget-image img {
		object-fit: contain;
	}
}

@media (max-width: 420px) {
	.elementor-261 .elementor-element-5d9eb79 img {
		width: 132px !important;
	}

	.elementor-element-228cd5c3 {
		min-height: 620px;
	}

	.elementor-349 .elementor-column-gap-default > .elementor-column > .elementor-element-populated {
		padding: 6px;
	}
}

/* Keep the homepage hero compact across breakpoints. Elementor sets a fixed
   min-height on the inner container, so both levels need an explicit override. */
@media (min-width: 1025px) {
	.elementor-349 .elementor-element.elementor-element-228cd5c3 {
		min-height: clamp(560px, 67svh, 740px) !important;
	}

	.elementor-349 .elementor-element.elementor-element-228cd5c3 > .elementor-container {
		min-height: clamp(560px, 67svh, 740px) !important;
	}
}

@media (min-width: 768px) and (max-width: 1024px) {
	.elementor-349 .elementor-element.elementor-element-228cd5c3 {
		min-height: clamp(520px, 70svh, 640px) !important;
		padding-block: 0 !important;
	}

	.elementor-349 .elementor-element.elementor-element-228cd5c3 > .elementor-container {
		min-height: clamp(520px, 70svh, 640px) !important;
	}
}

@media (max-width: 767px) {
	.elementor-349 .elementor-element.elementor-element-228cd5c3 {
		min-height: clamp(420px, 52svh, 460px) !important;
		padding-block: 48px 24px !important;
	}

	.elementor-349 .elementor-element.elementor-element-228cd5c3 > .elementor-container {
		min-height: clamp(420px, 52svh, 460px) !important;
	}

	.elementor-349 .elementor-element.elementor-element-228cd5c3 > .elementor-background-overlay {
		height: 100%;
	}
}

@media (max-width: 767px) {
	.elementor-261 .elementor-element-02bcf69 {
		flex: 1 1 auto !important;
		width: auto !important;
		min-width: 0 !important;
	}

	.elementor-261 .elementor-element-02bcf69 > .elementor-widget-wrap {
		min-width: 0;
	}

	.elementor-261 .elementor-element-5d9eb79,
	.elementor-261 .elementor-element-5d9eb79 > .elementor-widget-container,
	.elementor-261 .elementor-element-5d9eb79 a {
		width: auto !important;
		max-width: min(46vw, 176px) !important;
	}

	.elementor-261 .elementor-element-85a229b {
		flex: 0 0 42px !important;
		width: 42px !important;
		max-width: 42px !important;
		min-width: 42px !important;
		margin: 0 !important;
	}

	.elementor-261 .elementor-element-85a229b > .elementor-widget-wrap {
		width: 100%;
		min-width: 0;
		padding: 0 !important;
	}

	.elementor-261 .elementor-element-d34be01 {
		width: 42px !important;
		max-width: 42px !important;
		margin: 0 !important;
	}

	.elementor-349 .elementor-column.elementor-col-25 .elementor-widget-spacer .elementor-spacer-inner {
		height: clamp(72px, 25vw, 96px) !important;
	}
}

@media (max-width: 359px) {
	.elementor-349 .elementor-element-e0e1433 {
		width: min(200px, 62vw) !important;
		max-width: min(200px, 62vw) !important;
		left: -8px !important;
	}

	.elementor-349 .elementor-element-4ce2725 {
		width: min(176px, 55vw) !important;
		max-width: min(176px, 55vw) !important;
		left: 100px !important;
	}
}
