/*
Theme Name: GSIR Editorial (HBR Style)
Theme URI: https://thegsir.com
Description: CSS stylesheet featuring HBR signature red accents, heavy black borders, stark contrast, and refined serif typography.
Version: 1.0.0
Author: Nikola
Text Domain: gsir
*/

:root {
	--color-hbr-red: #C00000;
	--color-black: #121212;
	--color-dark-grey: #222222;
	--color-mid-grey: #666666;
	--color-light-grey: #F4F4F4;
	--color-border: #E0E0E0;
	--color-white: #FFFFFF;

	--font-serif: 'Libre Baskerville', Georgia, serif;
	--font-sans: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	--font-branding: 'Cinzel', serif;
}

*, *::before, *::after {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

body {
	font-family: var(--font-serif);
	color: var(--color-dark-grey);
	background-color: var(--color-white);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

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

a:hover {
	color: var(--color-hbr-red);
}

.container {
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 20px;
}

.site-header {
	border-bottom: 2px solid var(--color-black);
	padding: 20px 0 15px;
	background: var(--color-white);
}

.header-top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-bottom: 15px;
	border-bottom: 1px solid var(--color-border);
}

.brand-logo {
	font-family: var(--font-sans);
	font-weight: 900;
	font-size: 2rem;
	letter-spacing: -0.5px;
	text-transform: uppercase;
	color: var(--color-black);
}

.brand-logo span {
	color: var(--color-hbr-red);
}

.site-navigation {
	padding-top: 12px;
}

.site-navigation ul {
	display: flex;
	list-style: none;
	gap: 25px;
}

.site-navigation a {
	font-family: var(--font-sans);
	font-size: 0.85rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: var(--color-black);
}

.hbr-grid-featured {
	display: grid;
	grid-template-columns: 2fr 1fr 1fr;
	gap: 30px;
	padding: 40px 0;
	border-bottom: 1px solid var(--color-border);
}

.article-card {
	display: flex;
	flex-direction: column;
}

.article-card .category {
	font-family: var(--font-sans);
	font-size: 0.75rem;
	font-weight: 800;
	text-transform: uppercase;
	color: var(--color-hbr-red);
	letter-spacing: 1px;
	margin-bottom: 8px;
}

.article-card .title {
	font-family: var(--font-serif);
	font-weight: 700;
	line-height: 1.25;
	color: var(--color-black);
	margin-bottom: 12px;
}

.featured-lead .title {
	font-size: 2.25rem;
}

.secondary-card .title {
	font-size: 1.25rem;
}

.article-card .excerpt {
	font-size: 0.95rem;
	color: var(--color-mid-grey);
	margin-bottom: 15px;
}

.article-card .meta {
	font-family: var(--font-sans);
	font-size: 0.8rem;
	color: var(--color-mid-grey);
	font-weight: 600;
}

.single-post-container {
	max-width: 760px;
	margin: 50px auto;
}

.single-header {
	margin-bottom: 30px;
	border-bottom: 1px solid var(--color-border);
	padding-bottom: 20px;
}

.single-header .title {
	font-size: 2.75rem;
	line-height: 1.15;
	margin: 10px 0 20px;
}

.post-content {
	font-size: 1.125rem;
	line-height: 1.8;
}

.post-content p {
	margin-bottom: 24px;
}

.site-footer {
	background-color: var(--color-black);
	color: var(--color-white);
	padding: 50px 0 30px;
	margin-top: 60px;
	border-top: 4px solid var(--color-hbr-red);
}

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

@media (max-width: 900px) {
	.hbr-grid-featured {
		grid-template-columns: 1fr;
	}
}

/* HBR Components & Gutenberg Styles */
:root {
	--hbr-red: #C00000;
	--hbr-black: #121212;
	--hbr-grey-bg: #F8F8F8;
	--hbr-border: #E0E0E0;
}

.has-drop-cap:not(:focus)::first-letter {
	float: left;
	font-family: var(--font-sans);
	font-size: 4.2rem;
	line-height: 0.8;
	font-weight: 800;
	margin: 0.1rem 0.15em 0 0;
	color: var(--hbr-black);
	text-transform: uppercase;
}

.wp-block-pullquote {
	margin: 2.5rem 0;
	padding: 1.5rem 0;
	border-top: 3px solid var(--hbr-black);
	border-bottom: 1px solid var(--hbr-black);
	text-align: left;
}

.wp-block-pullquote blockquote {
	margin: 0;
	padding: 0;
}

.wp-block-pullquote p {
	font-family: var(--font-serif);
	font-size: 1.6rem;
	font-weight: 700;
	line-height: 1.3;
	color: var(--hbr-black);
	letter-spacing: -0.3px;
	margin-bottom: 0.75rem;
}

.wp-block-pullquote cite {
	display: block;
	font-family: var(--font-sans);
	font-size: 0.75rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: var(--hbr-red);
	font-style: normal;
}

.hbr-exec-summary {
	background-color: var(--hbr-grey-bg);
	border-left: 4px solid var(--hbr-red);
	padding: 24px 28px;
	margin: 2.5rem 0;
	border-top: 1px solid var(--hbr-border);
	border-right: 1px solid var(--hbr-border);
	border-bottom: 1px solid var(--hbr-border);
}

.hbr-exec-summary-label {
	font-family: var(--font-sans);
	font-size: 0.75rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: var(--hbr-red);
	margin-bottom: 12px !important;
}

.hbr-exec-summary ul {
	margin: 0;
	padding-left: 1.2rem;
	font-family: var(--font-sans);
	font-size: 0.95rem;
	line-height: 1.6;
	color: var(--hbr-black);
}

.hbr-exec-summary li {
	margin-bottom: 8px;
}

.hbr-exec-summary li:last-child {
	margin-bottom: 0;
}

.hbr-exec-summary strong {
	color: var(--hbr-black);
	font-weight: 700;
}
