@import url('https://fonts.googleapis.com/css2?family=Prompt&display=swap');
body{ 
	
	margin:0;
	/*box-sizing: border-box;*/
	font-family: 'Prompt',Tahoma,sans-serif,Kanit; 
	background-color:#fefae0 ; /*#D4AF37;#fffdf0;#F5F5DC #f8f9fa*/
	color:#1f2a44;
	/*font-size:16px;*/
}

	.container{
		max-width:960px;
		margin:auto;
		padding:2rem;
		text-align:center;
	}
	header{
		background:linear-gradient(to bottom,#e0c878 0%,#fff8dc 100%);
		/*background-color:#d4a017;*/
		color:#4a4a4a;
		padding:3rem 0;
		border-bottom:4px solid #fcebb3;
	}
	header h1{
		font-size:2.5rem;
		margin-bottom:1rem;
	}
	header p{
		font-size:1.2rem;
		margin-bottom:2rem;
	}
	.cta-button{
		background-color:#1f2a44;
		color:#fff;
		padding:0.75rem 1.5rem;
		text-decoration:none;
		border-radius:6px;
		font-weight:blod;
		transition:background-color 0.3s ease;
	}
	.cta-button:hover{
		background-color:#2c3e50;
	}
	main{
		padding:2rem;
	}
	.topics-horizontal{
		text-align:center;
		padding:3rem 1rem;
		background-color:#fefae0;
	}
	.topics-horizontal h2{
		font-size:2rem;
		color:#1f2a44;
		margin-bottom:2rem;
		font-weight:600;
	}
	.topic-row{
		list-style:none;
		padding:0;
		margin:0;
		display:flex;
		justify-content:center;
		gap:2rem;
		flex-wrap:wrap;
	}
	.topic-row li{
		font-size:1.3rem;
		color:#1f2a44;
		font-weight:500;
		position:relative;
		padding:0.5rem 1rem;
		transition:color 0.3s ease;
	}
	.toppic-row li::before{
		content:".";
		color:#d4a017;
		font-size:1.5rem;
		margin-right:0.5rem;
		position:absolute;
		left:-1rem;
		top:0.2rem;
	}
	.topic-row li:hover{
		color:#d4a017;
		/*cursor:pointer;*/
	}
		
	
	
	
	
	
	
	
	
	
	
	
	.highlight-phrase{
		background-color:#fefae0;
		text-align:center;
		padding:3rem 1rem;
	}
	.highlight-phrase p{
		font-size:1.6rem;
		font-weight:500;
		color:#1f2a44;
		max-width:800px;
		margin:auto;
		line-height:1.8;
		position:relative;
	}
	.highlight-phrase p :: before{	
		content:""";
		font-size:2rem;
		color:#d4a017;
		position:absolute;
		left:-1.5rem;
		top:-0.5rem;
	}
	.highlight-phrase p :: after{	
		content:""";
		font-size:2rem;
		color:#d4a017;
		position:absolute;
		left:-1.5rem;
		top:-0.5rem;
	}	
	
	
	
	
	
	
	
	.intro{
		text-align:center;
		margin-bottom:3rem;
	}
	.features{
		display:flex;
		flex-wrap:wrap;
		justify-content:center;
		gap:2rem;
	}
	.feature-box{
		background-color:#fff;
		boder-left:6px solid #d4a017;
		padding:1.5rem;
		border-radius:8px;
		box-shadow:0 2px 8px rgba(0,0,0,0.05);
		width:250px;
	}
	footer{
		text-align:center;
		padding:1rem;
		background-color:#1f2a44;
		color:#fff;
	}
		

 /*  #fff8dc  */
/*	main{
		padding:40px 20px;
		background-color:#fefae0; 
		padding-top:60px;
	}
	.hero{
		text-align:center;
		padding:100px 20px;

		background:linear-gradient(to bottom,#fff8dc 0%,#ffffff 100%);
		color:#1a1a1a;
	}
	.hero h1{
		font-size:36px;
		margin-bottom:20px;
		color:#d4af37;
		text-shadow:1px 1px 2px rgba(0,0,0,0.1);
	}
	.hero p{
		font-size:20px;
		margin-bottom:30px;
		color:#555555;
		max-width:700px;
		margin:0 auto;
	}
	.price-banner{
		margin:30px auto 20px;
		max-width:600px;
	}
	.price-banner iframe{
		width:100%;
		height:85px;
		border:none;
		background-color:transparent;
	}
	
	.cta-button{
		background-color:#d4af37;
		color:#1a1a1a;
		 padding:12px 30px;
		text-decoration:none;
		font-weight:bold;
		border-radius:6px;
		transition:background-color 0.2s ease;
		font-size:18px;
		margin-top:30px;
		cursor:pointer;
		text-shadow:0 4px 10px rgba(212, 175, 55, 0.3);
		transition:transform 0.2s ease, background-color 0.3s ease;
	}
	.cta-button:hover{
		background-color:#c19e2b;
		transform:scale(1.05);
	}
	.features{
		display:grid;
		grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
		
		gap:30px;
		padding:40px 20px;
		background-color:#fefae0;
		
	}
	.feature-box{
		background-color:#ffffff;
		border:1px solid #d4af37;
		border-radius:8px;
		padding:25px;
		box-shadow:0 4px 10px rgba(0,0,0,0.05);
		transition:transform 0.3s ease;
		text-align:center;
	}
	.feature-box:hover{
		transform:translateY(-5px);
	}
	.feature-box h2{
		color:#d4af37;
		margin-bottom:10px;
		font-size:20px;
	}
	.feature-box p{
		color:#333333;
		font-size:16px;
		line-height:1.5;
	}
	*/
	
	
@media (max-width: 768px) {
	
	
}