* {
   	margin: 0;
   	padding: 0;
   	box-sizing: border-box;
   }

   body,
   html {
   	width: 100%;
   	height: 100%;
   	overflow-x: hidden;
   	font-family: Arial, sans-serif;

   }

   body {
   	background: url('./img/ps4i7hg1nq8htyq4pnp7tf991mlprfbd4g940b2d74-c5fe-485b-a554-cd81f5354845.png') no-repeat center center;
   	background-size: cover;
   	position: relative;
   }

   a {
   	text-decoration: none;
   }

   .pointer {
   	cursor: pointer;
   }

   .container {
   	display: flex;
   	min-height: 100vh;
   	position: relative;
   	justify-content: center;
   	align-items: center;
   	padding: 20px;
   }

   .content {
   	display: flex;
   	max-width: 1200px;
   	width: 100%;
   	border-radius: 15px;
   	overflow: hidden;
   }

   .leftBox {
   	flex: 1;
   	display: flex;
   	flex-direction: column;
   	align-items: center;
   	justify-content: center;
   	max-width: 350px;
   }

   .rightBox {
   	width: 780px;
   	flex: 1;
   	display: flex;
   	justify-content: center;
   	align-items: center;
   	position: relative;
   }

   .animated-image {
   	position: absolute;
   	right: 121px;
   	bottom: 23px;
   	width: 340px;
   	height: auto;
   	z-index: 3;
   }

   .rightBox img {
   	max-width: 100%;
   	height: auto;
   	object-fit: contain;
   }

   .header {
   	margin-bottom: 30px;
   }

   .logo-container {
   	display: flex;
   	flex-direction: column;
   	justify-content: center;
   	align-items: center;
   }

   .logo {
   	width: 270px;
   	height: auto;
   }

   .logo-tagline {
   	background-color: rgba(252, 2, 2, 1);
   	border-radius: 10px;
   	padding: 8px 15px;
   	margin-top: 10px;
   	width: 200px;
   	box-sizing: border-box;
   	display: flex;
   	align-items: center;
   	justify-content: center;
   }

   .logo-tagline span {
   	color: white;
   	font-size: 16px;
   	font-weight: bold;
   }

   .button-group {
   	display: flex;
   	flex-direction: column;
   	gap: 15px;
   	margin-bottom: 30px;
   }

   .action-button {
   	display: flex;
   	align-items: center;
   	background: url('./img/psw6gw01duy27r26gpushvvudyig8a5exib8f91428-870e-4b41-b464-9c44e03331ee.png') no-repeat;
   	background-size: 100% 100%;
   	height: 50px;
   	padding: 0 25px;
   	position: relative;
   	color: white;
   	transition: all 0.3s ease;
   }

   /* 发光层（用伪元素实现） */
   .action-button::before {
   	content: '';
   	position: absolute;
   	top: 0;
   	left: 0;
   	width: 100%;
   	height: 100%;
   	background: url('./img/ps7legxzprawcyny2yi4d9bj4tkwuttokslbb70e904-8416-4db4-bd74-60a68419bd61.png') no-repeat;
   	background-size: 100% 100%;
   	opacity: 0;
   	/* 默认完全透明 */
   	transition: opacity 1s ease;
   	z-index: 1;
   }

   /* 鼠标悬停时发光层渐显 */
   .action-button:hover::before {
   	opacity: 1;
   }

   /* 确保文字在发光层上方 */
   .action-button span {
   	position: relative;
   	z-index: 2;
   }
   
   

   .button-icon {
   	position: relative;
   	width: 20px;
   	height: 20px;
   	z-index: 2;
   	margin-right: 15px;
   }

   .hover-icon {
   	height: 24px;
   }

   .button-text {
   	color: white;
   	font-size: 16px;
   	font-weight: bold;
   	white-space: nowrap;
   }

   .download-content {
   	flex-direction: column;
   	display: flex;
   	align-items: center;
   	justify-content: center;
   }

   .download-icons {
   	display: flex;
   	gap: 20px;
   	margin-bottom: 15px;
   	align-items: center;
   }

   .app-icon {
   	width: 55px;
   	height: 55px;
   }

   .store-icon {
   	width: 120px;
   	height: auto;
   }

   .download-note {
   	color: #2f2f2f;
   	font-size: 14px;
   	text-align: left;
   }




   /* Frosted Glass Modal Styles */


   .modal-overlay {
   	width: 100%;
   	position: fixed;
   	top: 0;
   	left: 0;
   	right: 0;
   	bottom: 0;
   	background-color: rgba(0, 0, 0, 0.4);
   	backdrop-filter: blur(0px);
   	-webkit-backdrop-filter: blur(0px);
   	opacity: 0;
   	display: flex;
   	justify-content: center;
   	align-items: center;
   	z-index: 9999;
   	transition: all 0.5s ease;
   	pointer-events: none;
   }

   .modal-overlay.active {
   	opacity: 1;
   	backdrop-filter: blur(15px);
   	-webkit-backdrop-filter: blur(15px);
   	pointer-events: all;
   }

   .modal-content {
   	background-color: white;
   	border-radius: 14px;
   	width: 400px;
   	min-height: 480px;
   	padding: 10px 20px;
   	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
   	opacity: 0;
   	transition: all 0.6s ease-out 0.3s;
   }

   .modal-overlay.active .modal-content {
   	transform: scale(1);
   	opacity: 1;
   }

   .modal-content .title {
   	text-align: center;
   	font-size: 14px;
	
   }

   .lineBox {
   	width: 320px;
   	margin: 0 auto;
   	height: 40px;
   	border-radius: 8px;
   	background-color: #dbd5d5;
   	display: flex;
   	font-size: 13px;
   	box-sizing: border-box;
   	margin-top: 10px;
   	display: flex;
   	justify-content: center;
   	align-items: center;

   }

   .lineBox:hover {
   	background: url('img/line_btn.png') no-repeat;
   	background-size: 100% 100%;
   	color: #fff;
   }

   .lineBox .left-box {
   	width: 75px;
   	color: #fff;
   	display: flex;
   	justify-content: center;
   	align-items: center;
   	background-color: #494949;
   	border-top-left-radius: 10px;
   	border-bottom-left-radius: 10px;
   }

   .d {
   	margin-right: 3px;
   }

   .centerBox {
   	width: 195px;
   	display: flex;
   	justify-content: center;
   	align-items: center;
   	color: #2f2f2f;
   }

   .modal-content .right-box {
   	position: relative;
   }

   .text {
   	position: absolute;
   	left: 50%;
   	top: 50%;
   	transform: translate(-50%, -50%);
   	white-space: nowrap;
   	color: #fff;

   }

   .jb_btn {
   	height: 33px;

   }

   .green {
   	color: green;
   }

   .yellow {
   	color: yellow;
   }

   .red {
   	color: red;
   }

   .close {
   	width: 32px;
   	height: 32px;
   	position: absolute;
   	left: 50%;
   	bottom: -6px;
   	transform: translate(-50%, -50%);
   }

   .m-box {
   	display: flex;
   	width: 80px;
   	margin: 0 auto;
   	margin-top: 18px;
   }

   .m-1 {
   	width: 30px;
   	height: 30px;
   }

   .m-2 {
   	width: 46px;
   	height: 14px;
   	margin-top: 11px;
   	margin-left: 10px;
   }