/*
Theme Name: GeneratePress
Theme URI: https://www.machinereport.org
Description: Editorial child theme for The Machine Report.
Author: The Machine Report
Template: generatepress
Version: 0.1.0
Text Domain: machine-report
WPVibe: yes
*/

:root {
	--mr-ink: #07111f;
	--mr-ink-soft: #111c2d;
	--mr-blue: #1269ff;
	--mr-cyan: #62d8ff;
	--mr-paper: #f6f7f9;
	--mr-white: #ffffff;
	--mr-muted: #667085;
	--mr-line: #dce2ea;
	--mr-max: 1380px;
	--mr-reading: 790px;
	--mr-rail: 340px;
}

html { scroll-behavior: smooth; }

body {
	background: var(--mr-paper);
	color: var(--mr-ink);
	font-family: "Newsreader", Georgia, serif;
	font-size: 19px;
	line-height: 1.72;
}

a { color: inherit; }

.site.grid-container,
.site-content,
.inside-header,
.inside-navigation {
	max-width: var(--mr-max);
}

.mr-masthead {
	background: var(--mr-ink);
	border-bottom: 1px solid rgba(255,255,255,.08);
}

.mr-masthead-link {
	display: block;
	max-width: 1380px;
	height: clamp(220px, 20vw, 310px);
	margin: 0 auto;
	padding: 0 28px;
	overflow: hidden;
}

.mr-masthead-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.site-header {
	display: none;
}

.site-branding {
	display: none;
}

.inside-header {
	padding: 0;
}

.site-branding .main-title,
.site-logo {
	line-height: 1;
}

.site-branding .main-title a {
	color: var(--mr-white);
	font-family: "Barlow Condensed", sans-serif;
	font-size: clamp(2rem, 4vw, 3.45rem);
	font-weight: 800;
	letter-spacing: .035em;
	text-transform: uppercase;
}

.site-description {
	color: #b8c3d4;
	font-family: "Barlow Condensed", sans-serif;
	font-size: 1.05rem;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.main-navigation {
	background: #050b14;
	border-bottom: 1px solid rgba(255,255,255,.08);
}

.main-navigation .inside-navigation {
	display: flex;
	align-items: center;
	min-height: 30px;
	padding-top: 0;
	padding-bottom: 0;
}

.main-navigation .menu-toggle {
	display: none !important;
}

.main-navigation .main-nav {
	display: block !important;
	width: 100%;
}

.main-navigation .main-nav ul {
	display: flex !important;
	align-items: center;
	flex-wrap: nowrap;
	margin: 0;
}

.main-navigation .main-nav ul li a {
	min-height: 30px;
	line-height: 30px;
	padding: 0 11px;
	color: #c7d1df;
	font-family: "Barlow Condensed", sans-serif;
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .075em;
	text-transform: uppercase;
}

.main-navigation .main-nav ul li:hover > a,
.main-navigation .main-nav ul li[class*="current-menu-"] > a {
	background: rgba(255,255,255,.06);
	color: var(--mr-cyan);
}

#page,
.site-content {
	background: transparent;
}

.mr-shell {
	max-width: var(--mr-max);
	margin: 0 auto;
	padding: 42px 28px 72px;
}

.mr-section-label,
.mr-kicker {
	color: var(--mr-blue);
	font-family: "Barlow Condensed", sans-serif;
	font-size: .92rem;
	font-weight: 800;
	letter-spacing: .13em;
	text-transform: uppercase;
}

.mr-home-header {
	display: flex;
	justify-content: space-between;
	gap: 24px;
	align-items: end;
	margin-bottom: 24px;
	border-bottom: 1px solid var(--mr-line);
	padding-bottom: 15px;
}

.mr-home-header h1,
.mr-section-heading {
	margin: 0;
	font-family: "Barlow Condensed", sans-serif;
	font-weight: 800;
	line-height: .95;
	letter-spacing: -.02em;
}

.mr-home-header h1 {
	font-size: clamp(2.6rem, 7vw, 6.5rem);
	text-transform: uppercase;
}

.mr-home-deck {
	max-width: 480px;
	margin: 0;
	color: var(--mr-muted);
	font-family: "Barlow Condensed", sans-serif;
	font-size: 1.2rem;
	line-height: 1.35;
	text-align: right;
}

.mr-hero {
	display: grid;
	grid-template-columns: minmax(0, 1.65fr) minmax(300px, .8fr);
	min-height: 520px;
	margin-bottom: 46px;
	background: var(--mr-ink);
	color: var(--mr-white);
	overflow: hidden;
}

.mr-hero-media {
	min-height: 390px;
	background:
		radial-gradient(circle at 25% 35%, rgba(18,105,255,.55), transparent 22%),
		linear-gradient(135deg, #14233a 0%, #08111f 62%, #020711 100%);
}

.mr-hero-media img {
	width: 100%;
	height: 100%;
	min-height: 100%;
	object-fit: cover;
	display: block;
}

.mr-hero-copy {
	display: flex;
	flex-direction: column;
	justify-content: end;
	padding: clamp(28px, 4vw, 54px);
}

.mr-hero-title {
	margin: 10px 0 18px;
	font-family: "Barlow Condensed", sans-serif;
	font-size: clamp(2.7rem, 5.2vw, 5.6rem);
	font-weight: 800;
	line-height: .92;
	letter-spacing: -.025em;
}

.mr-hero-title a:hover,
.mr-card-title a:hover {
	color: var(--mr-cyan);
}

.mr-hero-excerpt {
	margin: 0;
	color: #cad3df;
	font-size: 1.12rem;
	line-height: 1.45;
}

.mr-section {
	margin-top: 48px;
}

.mr-section-heading {
	margin-bottom: 20px;
	padding-bottom: 10px;
	border-bottom: 4px solid var(--mr-ink);
	font-size: 2.05rem;
	text-transform: uppercase;
}

.mr-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 30px 24px;
}

.mr-card {
	border-top: 1px solid var(--mr-line);
	padding-top: 12px;
}

.mr-card-media {
	display: block;
	aspect-ratio: 16 / 9;
	margin-bottom: 13px;
	background:
		linear-gradient(135deg, rgba(18,105,255,.92), rgba(7,17,31,.96));
	overflow: hidden;
}

.mr-card-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .28s ease;
}

.mr-card:hover .mr-card-media img {
	transform: scale(1.025);
}

.mr-card-title {
	margin: 4px 0 7px;
	font-family: "Barlow Condensed", sans-serif;
	font-size: 1.75rem;
	font-weight: 800;
	line-height: 1.03;
}

.mr-card-excerpt {
	margin: 0;
	color: #445064;
	font-size: 1rem;
	line-height: 1.42;
}

.mr-card-meta,
.mr-article-meta {
	color: var(--mr-muted);
	font-family: "Barlow Condensed", sans-serif;
	font-size: .9rem;
	letter-spacing: .035em;
	text-transform: uppercase;
}

.mr-pagination {
	margin-top: 44px;
	font-family: "Barlow Condensed", sans-serif;
	font-weight: 700;
}

.mr-article-shell {
	max-width: var(--mr-max);
	margin: 0 auto;
	padding: 40px 28px 80px;
}

.mr-article-grid {
	display: grid;
	grid-template-columns: minmax(0, var(--mr-reading)) minmax(280px, var(--mr-rail));
	justify-content: space-between;
	gap: clamp(46px, 6vw, 86px);
	align-items: start;
}

.mr-article-header {
	margin-bottom: 22px;
}

.mr-article-title {
	max-width: 850px;
	margin: 8px 0 14px;
	font-family: "Barlow Condensed", sans-serif;
	font-size: clamp(3rem, 6.4vw, 6.25rem);
	font-weight: 800;
	line-height: .91;
	letter-spacing: -.03em;
}

.mr-article-deck {
	max-width: 740px;
	margin: 0 0 18px;
	color: #445064;
	font-size: 1.28rem;
	line-height: 1.42;
}

.mr-article-hero {
	margin: 24px 0 30px;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: var(--mr-ink);
}

.mr-article-hero img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.mr-prose {
	font-size: 1.15rem;
	line-height: 1.76;
}

.mr-prose > * {
	max-width: var(--mr-reading);
}

.mr-prose p {
	margin: 0 0 1.25em;
}

.mr-prose h2,
.mr-prose h3 {
	font-family: "Barlow Condensed", sans-serif;
	font-weight: 800;
	line-height: 1.02;
}

.mr-prose h2 {
	margin: 1.65em 0 .55em;
	font-size: 2.45rem;
}

.mr-prose h3 {
	margin: 1.45em 0 .45em;
	font-size: 1.85rem;
}

.mr-prose blockquote {
	margin: 1.7em 0;
	padding: 4px 0 4px 24px;
	border-left: 5px solid var(--mr-blue);
	color: #263449;
	font-size: 1.25em;
	font-style: italic;
}

.mr-rail {
	position: sticky;
	top: 24px;
}

.mr-rail-heading {
	margin: 0 0 12px;
	padding: 10px 0 9px;
	border-top: 5px solid var(--mr-ink);
	border-bottom: 1px solid var(--mr-line);
	font-family: "Barlow Condensed", sans-serif;
	font-size: 1.5rem;
	font-weight: 800;
	letter-spacing: .03em;
	text-transform: uppercase;
}

.mr-rail-card {
	display: grid;
	grid-template-columns: 112px minmax(0,1fr);
	gap: 12px;
	padding: 14px 0;
	border-bottom: 1px solid var(--mr-line);
}

.mr-rail-thumb {
	aspect-ratio: 4 / 3;
	background: linear-gradient(135deg, var(--mr-blue), var(--mr-ink));
	overflow: hidden;
}

.mr-rail-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.mr-rail-title {
	margin: 0;
	font-family: "Barlow Condensed", sans-serif;
	font-size: 1.25rem;
	font-weight: 800;
	line-height: 1.02;
}

.mr-next {
	max-width: var(--mr-max);
	margin: 58px auto 0;
	padding-top: 24px;
	border-top: 7px solid var(--mr-ink);
}

.mr-next .mr-grid {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.site-footer {
	background: var(--mr-ink);
	color: #b8c3d4;
}

.site-footer a {
	color: var(--mr-white);
}

@media (max-width: 1020px) {
	.mr-hero {
		grid-template-columns: 1fr;
	}

	.mr-hero-media {
		min-height: 360px;
	}

	.mr-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.mr-article-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.mr-rail {
		position: static;
		display: grid;
		grid-template-columns: repeat(2, minmax(0,1fr));
		gap: 0 24px;
		margin-top: 44px;
	}

	.mr-rail-heading {
		grid-column: 1 / -1;
	}

	.mr-next .mr-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 650px) {
	body {
		font-size: 17px;
	}

	.inside-header,
	.mr-shell,
	.mr-article-shell {
		padding-left: 18px;
		padding-right: 18px;
	}

	.mr-masthead-link {
		height: clamp(165px, 34vw, 230px);
		padding-left: 0;
		padding-right: 0;
	}

	.mr-masthead-image {
		object-position: center;
	}

	.mr-home-header {
		display: block;
	}

	.mr-home-deck {
		margin-top: 12px;
		text-align: left;
	}

	.mr-hero {
		min-height: 0;
	}

	.mr-hero-media {
		min-height: 230px;
	}

	.mr-hero-copy {
		padding: 24px 20px 28px;
	}

	.mr-grid,
	.mr-rail,
	.mr-next .mr-grid {
		grid-template-columns: 1fr;
	}

	.mr-article-title {
		font-size: clamp(2.9rem, 15vw, 4.5rem);
	}

	.mr-article-deck {
		font-size: 1.12rem;
	}

	.mr-rail-card {
		grid-template-columns: 105px minmax(0,1fr);
	}
}
