:root{

	--primary:#C8102E;
	--primary-dark:#A30D26;
	--text:#1F2937;
	--light:#6B7280;
	--border:#E5E7EB;
	--bg:#FAF8F5;
	--white:#FFFFFF;

}

/*==================================================
BODY
==================================================*/

body{

	background:var(--bg);
	color:var(--text);
	font-family:Poppins,sans-serif;
	-webkit-font-smoothing:antialiased;
	text-rendering:optimizeLegibility;

}

/*==================================================
CONTAINER
==================================================*/

.srm-container{

	max-width:1320px;
	margin:80px auto;
	padding:0 24px;

}

/*==================================================
HERO
==================================================*/

.srm-hero{

	margin-bottom:90px;

}

.srm-breadcrumb{

	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:10px;

	font-size:14px;

	color:var(--light);

	margin-bottom:28px;

}

.srm-breadcrumb a{

	color:var(--light);
	text-decoration:none;
	transition:.3s;

}

.srm-breadcrumb a:hover{

	color:var(--primary);

}

.srm-hero-header{

	max-width:900px;

	margin-bottom:40px;

}

.srm-hero h1{

	font-size:64px;

	font-weight:700;

	line-height:1.08;

	color:var(--text);

	margin:0 0 22px;

}

.srm-subtitle{

	font-size:21px;

	line-height:1.8;

	color:var(--light);

	max-width:720px;

}

/*==================================================
META
==================================================*/

.srm-meta{

	display:flex;

	flex-wrap:wrap;

	gap:18px;

	margin:45px 0;

}

.srm-pill{

	background:#fff;

	border:1px solid var(--border);

	border-radius:18px;

	padding:22px 24px;

	min-width:155px;

	text-align:center;

	box-shadow:0 10px 30px rgba(0,0,0,.04);

	transition:.3s;

}

.srm-pill:hover{

	transform:translateY(-4px);

	box-shadow:0 18px 40px rgba(0,0,0,.08);

}

.srm-pill strong{

	display:block;

	font-size:20px;

	color:var(--primary);

	margin-bottom:8px;

}

.srm-pill span{

	font-size:14px;

	color:var(--light);

}

/*==================================================
BUTTONS
==================================================*/

.srm-buttons{

	display:flex;

	flex-wrap:wrap;

	gap:16px;

	margin-bottom:50px;

}

.srm-btn-primary,

.srm-btn-secondary{

	display:inline-flex;

	align-items:center;

	justify-content:center;

	height:52px;

	padding:0 34px;

	border-radius:12px;

	font-weight:600;

	transition:.3s;

}

.srm-btn-primary{

	background:var(--primary);

	color:#fff;

	text-decoration:none;

}

.srm-btn-primary:hover{

	background:var(--primary-dark);

	color:#fff;

}

.srm-btn-secondary{

	background:#fff;

	border:1px solid var(--border);

	color:var(--text);

	cursor:pointer;

}

.srm-btn-secondary:hover{

	background:#F8F8F8;

}

/*==================================================
FEATURED IMAGE
==================================================*/

.srm-featured-image{

	border-radius:24px;

	overflow:hidden;

	box-shadow:0 25px 70px rgba(0,0,0,.08);

}

.srm-hero-img{

	width:100%;

	display:block;

	aspect-ratio:16/9;

	object-fit:cover;

}

/*==================================================
LAYOUT
==================================================*/

.srm-layout{

	display:grid;

	grid-template-columns:minmax(0,1fr) 360px;

	gap:70px;

	align-items:start;

}

.srm-main{

	min-width:0;

}

.srm-sidebar{

	position:sticky;

	top:120px;

	height:fit-content;

}

/*==================================================
COMMON
==================================================*/

.srm-section{

	margin-bottom:80px;

}

.srm-section-title{

	font-size:38px;

	font-weight:700;

	line-height:1.2;

	margin-bottom:35px;

}

.srm-card{

	background:#fff;

	border-radius:22px;

	padding:40px;

	border:1px solid var(--border);

	box-shadow:0 15px 40px rgba(0,0,0,.05);

	transition:.3s;

}

.srm-card:hover{

	transform:translateY(-3px);

	box-shadow:0 22px 50px rgba(0,0,0,.08);

}

/*==================================================
COMMON LIST
==================================================*/

.srm-list{

	list-style:none;

	margin:0;

	padding:0;

}

.srm-list li{

	padding:18px 0;

	border-bottom:1px solid var(--border);

}

.srm-list li:last-child{

	border-bottom:none;

}

/*==================================================
IMAGES
==================================================*/

img{

	max-width:100%;

	height:auto;

	display:block;

}

/*==================================================
RESPONSIVE
==================================================*/

@media(max-width:1200px){

	.srm-layout{

		grid-template-columns:1fr 320px;

		gap:50px;

	}

}

@media(max-width:1024px){

	.srm-layout{

		grid-template-columns:1fr;

	}

	.srm-sidebar{

		position:relative;

		top:auto;

		order:-1;

		margin-bottom:40px;

	}

	.srm-hero h1{

		font-size:48px;

	}

}

@media(max-width:768px){

	.srm-container{

		padding:0 18px;

		margin:50px auto;

	}

	.srm-hero{

		margin-bottom:60px;

	}

	.srm-hero h1{

		font-size:36px;

	}

	.srm-subtitle{

		font-size:18px;

	}

	.srm-meta{

		gap:12px;

	}

	.srm-pill{

		flex:1 1 calc(50% - 12px);

		min-width:auto;

	}

	.srm-buttons{

		flex-direction:column;

	}

	.srm-btn-primary,

	.srm-btn-secondary{

		width:100%;

	}

	.srm-card{

		padding:28px;

	}

	.srm-section-title{

		font-size:30px;

	}

}

@media(max-width:480px){

	.srm-container{

		padding:0 15px;

	}

	.srm-hero h1{

		font-size:30px;

	}

	.srm-pill{

		flex:1 1 100%;

	}

	.srm-card{

		padding:22px;

	}

	.srm-section-title{

		font-size:26px;

	}

}