/* Deliberately plain CSS, served unchanged for browsers without modern CSS or JS.
   Keep content in document order; no Grid, variables, layers or feature queries. */
@font-face {
	font-family: 'Manrope Static';
	font-style: normal;
	font-weight: 400;
	src: url('/fonts/manrope-latin-400.woff') format('woff');
}
html {
	font-family: 'Manrope Static', 'Helvetica Neue', Arial, sans-serif;
	color: #f3f2e9;
	background: #292a28;
}
body {
	margin: 0;
	line-height: 1.5;
}
header, main, nav, section, article {
	display: block;
}
a {
	color: #f3f2e9;
	text-decoration: underline;
}
a:focus, button:focus {
	outline: 3px solid #ffda40;
	outline-offset: 3px;
}
img {
	max-width: 100%;
	border: 0;
}
svg, .sky, .map, .mini-route, .project-visual {
	display: none;
}
.site, .masthead {
	max-width: 1000px;
	margin: 0 auto;
	padding: 20px;
}
.sky-header {
	background: #6d89de;
	background-image: url('/bg/sky-poster.jpg');
	background-position: center;
	background-size: cover;
}
.identity h1 {
	font-size: 48px;
}
.identity-arrow, .heading-arrow, .about-symbol {
	display: none;
}
.signpost {
	display: block;
	padding: 12px 0;
}
.route-letter, .line-badge {
	margin-right: 10px;
}
.route-letter {
	margin-left: 10px;
}
.project, .small-project, .about, .contact {
	border-top: 1px solid #50514b;
}
.project-name, .project-description {
	display: block;
}
.project-description {
	font-size: 16px;
	font-weight: normal;
}
.project-links a {
	display: inline-block;
	margin-right: 20px;
	padding: 10px 0;
}
.email {
	font-size: 24px;
	word-wrap: break-word;
}
.skip-link {
	display: inline-block;
	padding: 10px 20px;
}

/* Images and route colours do not depend on layout engines, scripts or variables. */
.project-visual {
	display: block;
	position: relative;
	max-width: 480px;
	margin: 16px 0;
}
.project-poster {
	display: block;
	width: 100%;
}
.clock-embed {
	width: 100%;
	height: 240px;
	border: 0;
}
.poster-link {
	display: block;
	padding: 8px 0;
}
.projects-sign, .project-name {
	color: #6bc653;
}
.about-sign {
	color: #ffda40;
}
.contact-sign {
	color: #ff624c;
}
.project, .small-project {
	margin-bottom: 32px;
}
.map {
	display: block;
	padding: 16px 0;
}
.map-fallback {
	display: block;
	width: 100%;
	max-width: 920px;
}
