.demo-terminal {
	position: sticky;
	top: 80px;
}

.demo-terminal .terminal-window {
	box-shadow: 0 40px 100px rgba(0, 0, 0, 0.7);
}

.demo-tabs {
	display: flex;
	gap: 0;
	background: var(--bg-raised);
	border-bottom: 1px solid var(--border);
}

.demo-tab {
	font-family: var(--font-mono);
	font-size: 10px;
	color: var(--text-muted);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 10px 18px;
	cursor: pointer;
	border-right: 1px solid var(--border);
	transition:
	    color 0.2s,
	    background 0.2s;
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
}

.demo-tab.active {
	color: var(--accent);
	background: var(--bg-card);
	border-bottom-color: var(--accent);
}

.demo-tab:hover:not(.active) {
	color: var(--text-dim);
}

.demo-content {
	padding: 24px;
	font-family: var(--font-mono);
	font-size: 12px;
	line-height: 1.9;
	min-height: 380px;
}

.demo-pane {
	display: none;
}

.demo-pane.active {
	display: block;
}