:root {
	--bg: #0b1220;
	--surface: rgba(255,255,255,.04);
	--surface-2: rgba(255,255,255,.06);
	--text: #e7eefc;
	--muted: rgba(231,238,252,.72);
	--border: rgba(231,238,252,.12);
	--tc-primary: #2c51a2;
	--tc-accent: #5cc8ff;
	--hero-grad-1: rgba(44,81,162,.38);
	--hero-grad-2: rgba(92,200,255,.24);
}

html, body {
	height: 100%;
}

body {
	background: var(--bg);
	color: var(--text);
	padding-top: 72px;
	padding-bottom: 72px;
	font-family: system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}

a {
	color: var(--tc-accent);
	text-decoration: none;
}

	a:hover {
		color: #8fe0ff;
	}

.tc-muted {
	color: var(--muted);
}

.tc-link {
	color: var(--text);
	opacity: .9;
}

	.tc-link:hover {
		opacity: 1;
		color: var(--text);
		text-decoration: underline;
	}

.tc-nav {
	background: rgba(11,18,32,.74);
	border-bottom: 1px solid var(--border);
	backdrop-filter: blur(12px);
}

.tc-logo {
	width: 36px;
	height: 36px;
	border-radius: 10px;
}

.tc-btn, .navbar .btn {
	min-width: 140px;
	height: 36px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	white-space: nowrap;
	border-radius: 12px;
}

.tc-card {
	background: var(--surface);
	border: 1px solid var(--border);
	border-radius: 18px;
	box-shadow: 0 10px 28px rgba(0,0,0,.28);
}

.tc-tag {
	display: inline-flex;
	gap: .45rem;
	align-items: center;
	padding: 4px 10px;
	border-radius: 999px;
	border: 1px solid var(--border);
	background: rgba(255,255,255,.03);
	font-size: .74rem;
	color: var(--text);
	opacity: .92;
}

.tc-divider {
	height: 1px;
	background: var(--border);
	margin: 1rem 0;
}

.section-title {
	position: relative;
	display: inline-block;
	letter-spacing: -.02em;
}

	.section-title::after {
		content: "";
		position: absolute;
		left: 0;
		bottom: -10px;
		width: 58%;
		height: 4px;
		border-radius: 999px;
		background: linear-gradient(90deg,var(--tc-primary),var(--tc-accent));
		opacity: .85;
	}

.section-subtitle {
	color: var(--muted);
}

.tc-hero {
	position: relative;
	overflow: hidden;
}

	.tc-hero::before {
		content: "";
		position: absolute;
		inset: -40px;
		background: radial-gradient(1100px 520px at 10% 10%, var(--hero-grad-1) 0%, rgba(0,0,0,0) 60%), radial-gradient(900px 520px at 90% 15%, var(--hero-grad-2) 0%, rgba(0,0,0,0) 55%), url('https://www.towercoverage.com/tc_mapping_1.png');
		background-size: cover;
		background-position: center;
		filter: blur(18px) saturate(1.15);
		opacity: .18;
		transform: scale(1.08);
		pointer-events: none;
	}

	.tc-hero > .container {
		position: relative;
		z-index: 1;
	}

.tc-map-img {
	max-height: 330px;
	object-fit: cover;
	border-radius: 14px;
	border: 1px solid var(--border);
}

.tc-thumb {
	width: 96px;
	height: 58px;
	object-fit: cover;
	border-radius: 12px;
	border: 1px solid var(--border);
	opacity: .9;
}

	.tc-thumb:hover {
		opacity: 1;
	}

.tc-tier-card {
	border-radius: 16px;
}

	.tc-tier-card .tc-tag {
		font-size: .70rem;
		padding: 4px 10px;
	}

	.tc-tier-card .k {
		color: var(--muted);
		font-size: .83rem;
	}

	.tc-tier-card .v {
		color: var(--text);
		font-weight: 600;
	}

	.tc-tier-card .price {
		font-weight: 800;
		letter-spacing: -.02em;
	}

/* 1024x768 target */
@media (max-width:1024px) and (max-height:768px) {
	body {
		padding-top: 64px;
		padding-bottom: 64px;
	}

	.navbar {
		padding-top: .2rem;
		padding-bottom: .2rem;
	}

	.tc-logo {
		width: 32px;
		height: 32px;
	}

	.brand-text {
		font-size: 1.02rem;
	}

	.tc-btn, .navbar .btn {
		height: 34px;
		min-width: 132px;
		font-size: .90rem;
	}

	.py-5 {
		padding-top: 1.35rem !important;
		padding-bottom: 1.35rem !important;
	}

	.py-4 {
		padding-top: 1.15rem !important;
		padding-bottom: 1.15rem !important;
	}

	.fixed-bottom .container {
		padding-top: .2rem !important;
		padding-bottom: .2rem !important;
	}

	.fixed-bottom .small {
		font-size: .86rem;
	}

	.tc-map-img {
		max-height: 300px;
	}
}

@media (max-width:576px) {
	body {
		padding-top: 66px;
	}

	.tc-map-img {
		max-height: 260px;
	}

	.tc-thumb {
		width: 88px;
		height: 54px;
	}
}
.light-blue {
	background: var(--tc-accent);
	color: #faebd7;
}