/* File: css/editorial.css */

.editorial-page{
	padding-top: 140px;
	padding-bottom: 90px;
	background: #f5f5f1;
}

.editorial-shell{
	max-width: 1220px;
	margin: 0 auto;
}

.editorial-topbar{
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 20px;
	margin-bottom: 35px;
	padding-bottom: 18px;
	border-bottom: 1px solid #d9d9d2;
}

.editorial-topbar-left{
	display: flex;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
}

.editorial-kicker{
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 1.6px;
	color: #7f8078;
	font-weight: 700;
	margin: 0;
}

.editorial-mini-nav{
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}

.editorial-mini-nav a{
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #3d4642;
	font-weight: 700;
}

.editorial-mini-nav a:hover{
	color: #111111;
}

.editorial-login-btn{
	display: inline-block;
	padding: 10px 18px;
	border: 1px solid #cfcfc6;
	background: #ffffff;
	color: #2f3533;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 700;
	white-space: nowrap;
}

.editorial-login-btn:hover{
	background: #f2f2ec;
	color: #2f3533;
}

.editorial-hero{
	padding: 44px 44px 40px 44px;
	background: #ffffff;
	border: 1px solid #d9d9d2;
	margin-bottom: 42px;
}

.editorial-hero-grid{
	display: grid;
	grid-template-columns: 1.35fr 0.85fr;
	gap: 30px;
	align-items: start;
}

.editorial-hero-copy h1{
	font-size: 46px;
	line-height: 1.08;
	margin-bottom: 16px;
	color: #202623;
}

.editorial-hero-copy p{
	font-size: 17px;
	line-height: 1.85;
	color: #5c625d;
	margin-bottom: 0;
	max-width: 760px;
}

.editorial-hero-panel{
	padding: 22px 24px;
	background: #f7f7f3;
	border-left: 3px solid #2d3532;
}

.editorial-hero-panel h4{
	font-size: 15px;
	text-transform: uppercase;
	letter-spacing: 1.2px;
	color: #2d3532;
	margin-bottom: 14px;
}

.editorial-hero-panel ul{
	margin: 0;
	padding-left: 18px;
	color: #59605b;
}

.editorial-hero-panel li{
	margin-bottom: 10px;
	line-height: 1.7;
}

.editorial-section{
	margin-bottom: 54px;
}

.editorial-section-header{
	display: flex;
	justify-content: space-between;
	align-items: end;
	gap: 18px;
	margin-bottom: 22px;
}

.editorial-section-title{
	margin: 0;
}

.editorial-section-title .eyebrow{
	display: block;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	color: #7f8078;
	margin-bottom: 8px;
	font-weight: 700;
}

.editorial-section-title h2{
	font-size: 31px;
	line-height: 1.15;
	margin-bottom: 8px;
	color: #202623;
}

.editorial-section-title p{
	margin-bottom: 0;
	color: #66706b;
	line-height: 1.7;
}

.editorial-featured{
	padding: 38px 42px;
	background: #ffffff;
	border: 1px solid #d9d9d2;
}

.editorial-meta{
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #7c7f79;
	margin-bottom: 14px;
}

.editorial-featured h2{
	font-size: 40px;
	line-height: 1.14;
	margin-bottom: 18px;
	color: #1e2422;
	max-width: 880px;
}

.editorial-featured p{
	font-size: 17px;
	line-height: 1.9;
	color: #59605b;
	margin-bottom: 0;
	max-width: 900px;
}

.editorial-link{
	display: inline-block;
	margin-top: 20px;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 700;
	color: #202623;
	border-bottom: 1px solid #202623;
	padding-bottom: 2px;
}

.editorial-link:hover{
	color: #202623;
	border-bottom-color: #202623;
}

.editorial-card{
	height: 100%;
	padding: 28px;
	border: 1px solid #d9d9d2;
	background: #ffffff;
	margin-bottom: 30px;
	transition: all 0.2s ease;
}

.editorial-card:hover{
	transform: translateY(-2px);
}

.editorial-card h4{
	font-size: 23px;
	line-height: 1.28;
	margin-bottom: 14px;
	color: #202623;
}

.editorial-card p{
	margin-bottom: 0;
	line-height: 1.82;
	color: #67706b;
}

.editorial-topic-card{
	height: 100%;
	padding: 28px;
	border: 1px solid #d9d9d2;
	background: #fbfbf8;
	margin-bottom: 30px;
	position: relative;
}

.editorial-topic-card:before{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 3px;
	background: #2d3532;
}

.editorial-topic-card .topic-label{
	display: inline-block;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	font-weight: 700;
	color: #7f8078;
	margin-bottom: 12px;
}

.editorial-topic-card h4{
	font-size: 24px;
	line-height: 1.25;
	margin-bottom: 12px;
	color: #202623;
}

.editorial-topic-card p{
	margin-bottom: 16px;
	color: #67706b;
	line-height: 1.8;
	min-height: 88px;
}

.editorial-topic-card .count{
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #7f8078;
	font-weight: 700;
}

.editorial-archive-box{
	padding: 34px 36px;
	border: 1px solid #d9d9d2;
	background: #ffffff;
}

.editorial-archive-box p{
	margin-bottom: 24px;
	color: #616964;
	line-height: 1.85;
}

.editorial-archive-grid{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
}

.editorial-archive-item{
	padding: 18px 18px;
	border: 1px solid #dfdfd8;
	background: #f8f8f4;
}

.editorial-archive-item strong{
	display: block;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #202623;
	margin-bottom: 8px;
}

.editorial-archive-item span{
	display: block;
	color: #67706b;
	line-height: 1.7;
	font-size: 14px;
}

.editorial-empty{
	padding: 35px;
	background: #ffffff;
	border: 1px solid #d9d9d2;
	color: #67706b;
}

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

	.editorial-archive-grid{
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 991px){
	.editorial-page{
		padding-top: 120px;
	}

	.editorial-topbar{
		flex-direction: column;
		align-items: flex-start;
	}

	.editorial-hero{
		padding: 32px 28px;
	}

	.editorial-hero-copy h1{
		font-size: 36px;
	}

	.editorial-featured{
		padding: 32px 28px;
	}

	.editorial-featured h2{
		font-size: 31px;
	}

	.editorial-section-header{
		flex-direction: column;
		align-items: flex-start;
	}
}

@media (max-width: 767px){
	.editorial-hero-copy h1{
		font-size: 30px;
	}

	.editorial-section-title h2{
		font-size: 27px;
	}

	.editorial-featured h2{
		font-size: 28px;
	}

	.editorial-archive-grid{
		grid-template-columns: 1fr;
	}
}

/* ========================================
   ARTICLE PAGE
======================================== */

.editorial-article-page{
	padding-top:140px;
	padding-bottom:90px;
	background:#f5f5f1;
}

.editorial-article-shell{
	max-width:980px;
	margin:0 auto;
}

.editorial-article-banner{
	padding:34px 38px;
	background:#ffffff;
	border:1px solid #d9d9d2;
	margin-bottom:34px;
}

.editorial-article-banner h1{
	font-size:18px;
	text-transform:uppercase;
	letter-spacing:1.4px;
	margin-bottom:8px;
	color:#202623;
}

.editorial-article-banner p{
	margin-bottom:0;
	color:#66706b;
	line-height:1.7;
}

.editorial-article-box{
	padding:42px 46px;
	background:#ffffff;
	border:1px solid #d9d9d2;
}

.editorial-article-meta{
	font-size:12px;
	text-transform:uppercase;
	letter-spacing:1px;
	color:#7c7f79;
	margin-bottom:20px;
}

.editorial-article-title{
	font-size:42px;
	line-height:1.18;
	margin-bottom:26px;
	color:#1e2422;
}

.editorial-article-excerpt{
	font-size:18px;
	line-height:1.85;
	color:#5d645f;
	margin-bottom:30px;
	padding-bottom:24px;
	border-bottom:1px solid #e2e2db;
}

.editorial-article-content{
	color:#2d3431;
}

.editorial-article-content p{
	font-size:18px;
	line-height:1.95;
	margin-bottom:22px;
	color:#333a37;
}

.editorial-article-content img{
	max-width:100%;
	height:auto;
}

.editorial-article-topics{
	margin-top:38px;
	padding-top:28px;
	border-top:1px solid #e2e2db;
}

.editorial-article-topics h3{
	font-size:22px;
	margin-bottom:18px;
	color:#202623;
}

.editorial-topic-list{
	display:flex;
	flex-wrap:wrap;
	gap:12px;
}

.editorial-topic-pill{
	display:inline-block;
	padding:10px 14px;
	background:#f7f7f3;
	border:1px solid #d9d9d2;
	color:#2f3533;
	font-size:13px;
}

.editorial-topic-pill:hover{
	background:#efefe8;
}

.editorial-article-back{
	display:inline-block;
	margin-top:34px;
	font-size:12px;
	text-transform:uppercase;
	letter-spacing:1px;
	font-weight:700;
	color:#202623;
	border-bottom:1px solid #202623;
	padding-bottom:2px;
}

.editorial-article-alert{
	padding:26px 30px;
	background:#ffffff;
	border:1px solid #d9d9d2;
	color:#5d645f;
}