/* Variables inlined for remoteCSS compatibility */
/* Buttons */
.btn {
	display: inline-flex;
	width: auto;
}

.btn a {
	display: flex;
	gap: 8px;
	align-items: center;
	font-family: "Faculty Glyphic", sans-serif;
	font-size: 16px;
	border-radius: 9999px;
	padding: 24px 32px;
	width: 100%;
	text-decoration: none;
}

.btn.primary a {
	background-color: #000073;
	color: #f8e7d5;
}

.btn.primary a:hover {
	background-color: #fcc626;
	color: #000073;
}

.btn.clear a {
	background-color: transparent;
	color: #000073;
}

.btn.clear a:hover {
	background-color: #f8e7d5;
}

.btn.arrow a::after {
	content: "→";
	margin-left: 8px;
}

/*.page-hero-title {
	padding-top: 120px;
	overflow: hidden;
	position: relative;
}

.page-hero-title .tiles {
	height: 70px;
}
.page-hero-title .deco-left {
	position: absolute;
	top: 1rem;
	left: 0;
	width: 150px;
}
.page-hero-title .deco-right {
	position: absolute;
	right: 60px;
	bottom: 70px;
	width: 224px;
}*/
.page-hero-title {
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.page-hero-title:before,
.page-hero-title:after {
	position: absolute;
	content: "";
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	z-index: -1;
}

.page-hero-title:before {
	top: 40px;
	left: 0;
	background-image: url('https://asia.wordcamp.org/2027/files/2026/08/left-bg-leaf.png');
	background-position: top left;
	background-size: clamp(80px, 15vw, 170px);
}

.page-hero-title:after {
	right: 25px;
	bottom: -60px;
	background-image: url('https://asia.wordcamp.org/2027/files/2026/08/right-bg-leaf.png');
	background-position: bottom right;
	background-size: clamp(100px, 20vw, 220px);
}

@media (max-width: 600px) {
	.page-hero-title:before {
		top: -40px;
		left: -10px;
	}
	
	.page-hero-title:after {
		right: -40px;
		bottom: -30px;
	}
}

/* Mobile / smaller screens overrides */
@media (max-width: 1023px) {
	/*.page-hero-title {
			padding-top: 120px;
		}
	
		.page-hero-title .tiles {
			height: 35px;
		}
		.page-hero-title .deco-left {
			top: -55px;
			width: 73px;
		}
		.page-hero-title .deco-right {
			right: -40px;
			bottom: 35px;
			width: 112px;
		}*/
	
}