:root{
	--green: #078400;
	--green-600: #056300;
	--blue: #086dac;
	--blue-600: #005a8e;
	--grey: #4e4e4e;
	--grey-200: #3a3a3a;
	--bg: #949494;
	--glass: rgba(83, 241, 255, 0.6);
}

*{box-sizing:border-box}
body{
	margin:0;
	font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
	background: linear-gradient(180deg, #f3f6fb 0%, #eef2f6 100%);
	color: var(--grey);
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}

.container{
	max-width:1000px;
	margin:48px auto;
	background: white;
	padding:32px;
	border-radius:12px;
	box-shadow: 0 8px 24px rgba(30,41,59,0.06);
}

h1{color:var(--blue);margin-top:0}
p{line-height:1.6;color:#333}

.btn, button{
	display:inline-block;
	background:linear-gradient(180deg,var(--green),var(--green-600));
	color:white;
	border:0;
	padding:10px 16px;
	border-radius:8px;
	cursor:pointer;
	font-weight:600;
}
.btn:hover, button:hover{filter:brightness(.95)}

.card{
	background:var(--glass);
	border:1px solid rgba(78,78,78,0.08);
	padding:16px;
	border-radius:10px;
}

.muted{color:#6b7280}

/* Embed styles */
.embed-section{
	margin-top:28px;
	display:flex;
	justify-content:center;
}
.embed-card{
	max-width:560px;
	width:100%;
	background: linear-gradient(180deg, rgba(78,78,78,0.03), rgba(78,78,78,0.01));
	border:1px solid var(--grey);
	padding:12px;
	border-radius:10px;
	display:flex;
	flex-direction:column;
	gap:8px;
	align-items:center;
}
.embed-card h2{margin:0;color:var(--blue);font-size:1rem}

.embed-wrapper{
	width:100%;
	display:flex;
	justify-content:center;
}
.embed-wrapper iframe{
	width:100%;
	max-width:552px;
	height:167px;
	border:0;
	border-radius:6px;
	box-shadow:0 6px 18px rgba(0,0,0,0.12);
}

/* Utilities */
.center{display:flex;justify-content:center;align-items:center}
.stack{display:flex;flex-direction:column;gap:12px}

@media (max-width:600px){
	.container{margin:18px;padding:18px}
	.embed-wrapper iframe{height:150px}
}