/* Site-wide responsive tweaks (mobile-first) */
@media (max-width: 767px) {
	/* Header: compact brand, full-width collapsed menu */
	.navbar-header {
		float: none;
		display: flex;
		align-items: center;
		justify-content: space-between;
		min-height: 50px;
	}
	.navbar-header .navbar-toggle {
		margin: 0;
		margin-left: 10px;
		padding: 9px 10px;
		align-self: center;
		border-color: #ed3437;
		background-color: transparent;
	}
	.navbar-header .navbar-toggle:hover,
	.navbar-header .navbar-toggle:focus {
		background-color: rgba(237, 52, 55, 0.08);
		border-color: #eb1d20;
	}
	.navbar-header .navbar-toggle .icon-bar {
		background-color: #ed3437;
	}
	.navbar-brand { padding: 10px 15px 10px 0; order: -1; }
	.navbar-brand img { max-height: 24px; width: auto; vertical-align: middle; }
	#vpnfail-navbar-collapse .navbar-nav { margin: 0 -15px; }
	#vpnfail-navbar-collapse .navbar-nav > li > a { padding: 12px 15px; }
	#vpnfail-navbar-collapse .btn.navbar-btn { margin: 8px 15px; display: block; text-align: center; }
	/* Container: reduce horizontal padding on very small screens */
	.container { padding-left: 12px; padding-right: 12px; }
	/* Jumbotron: less padding on mobile (text size kept same as desktop) */
	.jumbotron { padding-top: 24px; padding-bottom: 24px; }
	/* Footer: stack links, readable text */
	footer nav ul { padding-left: 0; }
	footer nav li { display: block; margin: 0.25em 0; }
	footer .lead, footer .small { font-size: 1rem; }
}

@media (max-width: 480px) {
	.container { padding-left: 10px; padding-right: 10px; }
}