:root{
	--accent-1: #6f00ff;   /* vibrant purple */
	--accent-2: #b300ff;   /* magenta highlight */
	--muted: rgba(255,255,255,0.75);
	--glass-border: rgba(255,255,255,0.06);
	font-family: "Poppins", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
	margin:0;
	min-height:100%;
	color:var(--muted);
	background:
		radial-gradient(circle at 10% 20%, rgba(107,0,255,0.12), transparent 8%),
		radial-gradient(circle at 90% 80%, rgba(179,0,255,0.10), transparent 10%),
		linear-gradient(180deg,#0b0014 0%, #150027 40%, #1b0636 100%);
	background-attachment:fixed;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
	padding:24px 16px;
}

/* layout */
.container{max-width:720px;margin:0 auto}
.site-header .container{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.brand{color:var(--accent-2);margin:0;font-weight:600;font-size:1.25rem;letter-spacing:0.2px}
.tagline{margin:0;font-weight:300;color:rgba(255,255,255,0.85);font-size:0.95rem}

/* hero */
.hero{margin:20px 0 12px}
.hero h2{margin:0;color:linear-gradient(var(--accent-1),var(--accent-2));font-size:1.5rem}
.hero p{margin:8px 0 0;color:rgba(255,255,255,0.85);font-size:0.98rem}

/* card / form */
.card{
	background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
	border:1px solid var(--glass-border);
	backdrop-filter: blur(8px);
	padding:18px;
	border-radius:14px;
	box-shadow: 0 6px 24px rgba(11,0,20,0.5);
}

.form-wrap{margin:8px 0 18px}
label{
	display:block;
	font-size:0.85rem;
	margin-top:10px;
	margin-bottom:6px;
	color:rgba(255,255,255,0.9);
	font-weight:500;
}
input[type="text"],
input[type="email"],
input[type="tel"],
textarea{
	width:100%;
	padding:12px 14px;
	border-radius:10px;
	border:1px solid rgba(255,255,255,0.06);
	background: rgba(0,0,0,0.25);
	color: #fff;
	font-size:1rem;
	outline:none;
	transition: box-shadow .18s ease, transform .08s ease, border-color .12s ease;
}

input::placeholder, textarea::placeholder { color: rgba(255,255,255,0.6); font-weight:300; }

input:focus, textarea:focus{
	border-color: rgba(183,0,255,0.6);
	box-shadow: 0 6px 20px rgba(107,0,255,0.14);
	transform:translateY(-1px);
}

/* submit */
.submit-btn{
	margin-top:14px;
	width:100%;
	padding:14px;
	border-radius:12px;
	border:0;
	background: linear-gradient(90deg,var(--accent-1),var(--accent-2));
	color:white;
	font-weight:600;
	font-size:1.05rem;
	letter-spacing:0.2px;
	box-shadow: 0 8px 30px rgba(107,0,255,0.24);
	cursor:pointer;
	transition: transform .12s ease, box-shadow .12s ease, opacity .12s;
	display:inline-flex;
	justify-content:center;
	align-items:center;
}

.submit-btn:active{transform:translateY(1px)}
.submit-btn:disabled{opacity:0.6;cursor:not-allowed}

/* small utilities */
.site-footer{margin:28px 0 60px;text-align:center;color:rgba(255,255,255,0.6);font-size:0.85rem}

/* accessibility helpers */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* responsive tweaks */
@media (min-width:720px){
	body{padding:40px}
	.hero h2{font-size:2rem}
	.brand{font-size:1.4rem}
	.card{padding:26px;border-radius:16px}
}