:root{
	--csm-bg: #0f172a;
	--csm-text: #ffffff;
	--csm-accent: #f59e0b;
	--csm-grad-start: #4338ca;
	--csm-grad-end: #0ea5e9;
}
*{box-sizing:border-box;}
html,body{height:100%;margin:0;padding:0;}
body.csm-body{
	min-height:100vh;
	display:flex;
	align-items:center;
	justify-content:center;
	font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color:var(--csm-text);
	background:var(--csm-bg);
	padding:24px;
	position:relative;
	overflow-x:hidden;
}
.csm-wrap{
	position:relative;
	z-index:2;
	max-width:640px;
	width:100%;
	text-align:center;
}
.csm-logo{margin-bottom:32px;}
.csm-logo img{max-height:64px;width:auto;}

.csm-eyebrow{
	display:inline-block;
	font-size:13px;
	letter-spacing:2px;
	text-transform:uppercase;
	opacity:.75;
	margin-bottom:16px;
	padding:6px 14px;
	border:1px solid currentColor;
	border-radius:999px;
}
.csm-headline{
	font-size:clamp(32px,6vw,56px);
	font-weight:700;
	line-height:1.6;
	margin:0 0 16px;
}
.csm-message{
	font-size:17px;
	line-height:1.6;
	opacity:.85;
	max-width:480px;
	margin:0 auto 36px;
}

.csm-countdown{
	display:flex;
	justify-content:center;
	gap:16px;
	margin-bottom:36px;
	flex-wrap:wrap;
}
.csm-countdown-item{
	background:rgba(255,255,255,.08);
	border:1px solid rgba(255,255,255,.14);
	border-radius:12px;
	padding:16px 20px;
	min-width:80px;
}
.csm-countdown-number{
	display:block;
	font-size:32px;
	font-weight:700;
	font-variant-numeric:tabular-nums;
}
.csm-countdown-label{
	display:block;
	font-size:11px;
	letter-spacing:1.5px;
	text-transform:uppercase;
	opacity:.65;
	margin-top:4px;
}

.csm-subscribe-form{
	display:flex;
	gap:8px;
	max-width:420px;
	margin:0 auto 8px;
	flex-wrap:wrap;
	justify-content:center;
}
.csm-subscribe-form input[type=email]{
	flex:1 1 220px;
	padding:14px 16px;
	border-radius:8px;
	border:1px solid rgba(255,255,255,.2);
	background:rgba(255,255,255,.08);
	color:var(--csm-text);
	font-size:15px;
	outline:none;
}
.csm-subscribe-form input[type=email]::placeholder{color:currentColor;opacity:.6;}
.csm-subscribe-form button{
	padding:14px 24px;
	border-radius:8px;
	border:none;
	background:var(--csm-accent);
	color:#111;
	font-weight:600;
	font-size:15px;
	cursor:pointer;
	transition:transform .15s ease, box-shadow .15s ease;
}
.csm-subscribe-form button:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(0,0,0,.25);}
.csm-subscribe-form button:disabled{opacity:.6;cursor:default;transform:none;box-shadow:none;}
.csm-form-message{font-size:14px;margin-bottom:24px;min-height:20px;}

.csm-social{display:flex;gap:14px;justify-content:center;}
.csm-social a{
	width:40px;height:40px;
	display:flex;align-items:center;justify-content:center;
	border-radius:50%;
	border:1px solid rgba(255,255,255,.2);
	color:var(--csm-text);
	text-decoration:none;
	font-size:12px;
	font-weight:700;
	transition:background .15s ease;
}
.csm-social a:hover{background:rgba(255,255,255,.12);}

/* ---------- Minimal template ---------- */
.csm-template-minimal{background:#f8fafc;color:#0f172a;}
.csm-template-minimal .csm-eyebrow,
.csm-template-minimal .csm-countdown-item,
.csm-template-minimal .csm-subscribe-form input[type=email],
.csm-template-minimal .csm-social a{
	border-color:#e2e8f0;
	background:#fff;
	color:#0f172a;
}
.csm-template-minimal .csm-card{
	background:#fff;
	border:1px solid #e5e7eb;
	border-radius:20px;
	padding:56px 40px;
	box-shadow:0 20px 60px rgba(15,23,42,.08);
}
.csm-template-minimal .csm-subscribe-form button{color:#fff;}

/* ---------- Gradient hero template ---------- */
.csm-template-gradient .csm-bg-shape{
	position:absolute;inset:0;z-index:0;
	background:linear-gradient(135deg,var(--csm-grad-start),var(--csm-grad-end));
}
.csm-template-gradient .csm-blob{
	position:absolute;border-radius:50%;filter:blur(70px);opacity:.35;z-index:1;pointer-events:none;
}

/* ---------- Dark countdown template ---------- */
.csm-template-dark{background:#0a0a0f;}
.csm-template-dark .csm-headline{
	background:linear-gradient(90deg,#fff,var(--csm-accent));
	-webkit-background-clip:text;
	background-clip:text;
	color:transparent;
}
.csm-template-dark .csm-countdown-item{border-color:rgba(245,158,11,.25);}

/* ---------- Under construction template ---------- */
.csm-template-construction .csm-stripes{
	position:absolute;top:0;left:0;right:0;height:14px;
	background:repeating-linear-gradient(45deg,var(--csm-accent),var(--csm-accent) 20px,#111 20px,#111 40px);
	z-index:3;
}
.csm-template-construction .csm-stripes.csm-bottom{top:auto;bottom:0;}

@media (max-width:480px){
	.csm-countdown{gap:10px;}
	.csm-countdown-item{min-width:64px;padding:12px 14px;}
	.csm-countdown-number{font-size:24px;}
	.csm-template-minimal .csm-card{padding:40px 24px;}
}