/* Add to the BOTTOM of your style.css */
		/* Landing Overlay */
		/* =============================================== */
		/* LANDING OVERLAY - ADD AT VERY BOTTOM OF CSS FILE */
		/* =============================================== */
		/* =============================================== */
		/* FULLSCREEN LANDING OVERLAY - ADD AT VERY BOTTOM */
		/* =============================================== */
		html.landing-mode,
		html.landing-mode body {
			overflow: hidden;
			height: 100%;
			margin: 0;
			padding: 0;
			position: fixed;
			width: 100%;
		}

		#landing-overlay {
			position: fixed;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			width: 100%;
			height: 100%;
			min-height: -webkit-fill-available;
			background-color: black;
			z-index: 999999;
			margin: 0;
			padding: 0;
			display: flex;
			justify-content: center;
			align-items: center;
		}

		#landing-content {
			background: rgba(0, 0, 0, 0.95);
			padding: 3rem;
			border-radius: 15px;
			text-align: center;
			max-width: 600px;
			width: 90%;
			animation: fadeIn 1s ease-out;
		}

		#couple-circle {
			width: 200px;
			height: 200px;
			border-radius: 50%;
			border: 4px solid white;
			margin: 1.5rem auto;
			overflow: hidden;
		}

		#couple-circle img {
			width: 100%;
			height: 100%;
			object-fit: cover;
		}

		@keyframes gentlePulse {

			0%,
			100% {
				transform: scale(1);
			}

			50% {
				transform: scale(1.05);
			}
		}

		#open-invitation-btn {
			animation: gentlePulse 2s infinite ease-in-out;
			background: white;
				color: #b66230;
				border: none;
				padding: 10px 20px;
				font-size: 1.2rem;
				border-radius: 30px;
				cursor: pointer;
				margin-top: 1.5rem;
				transition: all 0.3s ease;
				font-size: large;
				color: black;
		}

		#open-invitation-btn:hover {
			
			animation: none;
			transform: scale(1.05);
		}

		.landing-text {

			font-size: 3rem;
			color: white;
			margin-bottom: 0;
			font-family: Engagement;
			font-size: 90px;
			line-height: 1.5;
		}

		.landing-date {
			font-size: 30px;
			line-height: 1.5;
			color: white;
			margin-bottom: 0;
			font-family: Engagement;
		}

		@media screen and (max-width: 768px) {
			.landing-text {
				font-size: 3rem;
				color: rgb(255, 255, 255);
				margin-bottom: 0;
				font-family: Engagement;
				font-size: 40px;
				line-height: 1.5;
			}

			.landing-date {
				font-size: 20px;
				line-height: 1.5;
				color: white;
				margin-bottom: 0;
				font-family: Engagement;
			}

			#open-invitation-btn {
				background: white;
				color: #b66230;
				border: none;
				padding: 10px 20px;
				font-size: 1.2rem;
				border-radius: 30px;
				cursor: pointer;
				margin-top: 1.5rem;
				transition: all 0.3s ease;
				font-size: large;
				color: black;
			}
		}

		@media screen and (max-width: 480px) {
			.landing-text {
				font-size: 3rem;
				color: rgb(255, 255, 255);
				margin-bottom: 0;
				font-family: Engagement;
				font-size: 40px;
				line-height: 1.5;
			}

			.landing-date {
				font-size: 20px;
				line-height: 1.5;
				color: white;
				margin-bottom: 0;
				font-family: Engagement;
			}
		}

		@keyframes fadeIn {
			from {
				opacity: 0;
				transform: translateY(20px);
			}

			to {
				opacity: 1;
				transform: translateY(0);
			}
		}