
.sm{
	/* Palette — deliberately small. Reuses the footer's ink so the two agree. */
	--sm-red:#d00202;        /* site link red, footer accent */
	--sm-ink:#14181c;        /* footer dark panel — headings */
	--sm-body:#2b3138;       /* body/link text */
	--sm-muted:#6b7480;      /* secondary text */
	--sm-line:#e3e6e9;       /* hairlines */
	--sm-tint:#f6f7f8;       /* tinted panel */

	font-family:inherit;
	color:var(--sm-body);
	text-align:left;         /* #main sets justify; this overrides it */
	font-size:15px;
	line-height:1.6;
	padding:40px;
}
.sm *,.sm *::before,.sm *::after{box-sizing:border-box;}

/* --------------------------------------------------------------------------
   Page head
   -------------------------------------------------------------------------- */
.sm__head{
	border-bottom:1px solid var(--sm-line);
	padding-bottom:22px;
	margin-bottom:30px;
}
.sm__eyebrow{
	display:block;
	font-size:11px;
	font-weight:600;
	letter-spacing:.18em;
	text-transform:uppercase;
	color:var(--sm-red);
	margin-bottom:8px;
}
/* text-transform is reset explicitly: style2015.min.css uppercases all h1 */
.sm h1.sm__title{
	font-size:34px;
	line-height:1.15;
	font-weight:700;
	color:var(--sm-ink);
	margin:0 0 10px;
	padding:0;
	letter-spacing:-.01em;
	text-transform:none;
}
.sm__intro{
	font-size:15px;
	color:var(--sm-muted);
	margin:0;
	max-width:62ch;
}

/* Jump navigation */
.sm__jump{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
	margin-top:22px;
	padding:0;
	list-style:none;
}
.sm__jump li{margin:0;}
.sm__jump a,
#main .sm__jump a{
	display:inline-flex;
	align-items:baseline;
	gap:7px;
	padding:7px 14px;
	border:1px solid var(--sm-line);
	border-radius:100px;
	background:#fff;
	font-size:13px;
	font-weight:500;
	color:var(--sm-body);
	text-decoration:none;
	transition:background .18s ease,border-color .18s ease,color .18s ease;
}
.sm__jump a:hover,
#main .sm__jump a:hover{
	background:var(--sm-red);
	border-color:var(--sm-red);
	color:#fff;
}
.sm__count{
	font-size:11px;
	color:var(--sm-muted);
	font-weight:600;
}
.sm__jump a:hover .sm__count,
#main .sm__jump a:hover .sm__count{color:rgba(255,255,255,.75);}

/* --------------------------------------------------------------------------
   Section
   -------------------------------------------------------------------------- */
.sm__section{
	padding-top:14px;
	margin-bottom:44px;
	scroll-margin-top:20px;
	width: 100%;
}
.sm__section:last-of-type{margin-bottom:32px;}
.sm__section-head{
	display:flex;
	align-items:baseline;
	flex-wrap:wrap;
	gap:6px 14px;
	padding-bottom:12px;
	margin-bottom:24px;
	border-bottom:2px solid var(--sm-ink);
}
.sm h2.sm__section-title{
	font-size:21px;
	font-weight:700;
	color:var(--sm-ink);
	margin:0;
	padding:0;
	letter-spacing:-.005em;
	text-transform:none;
}
.sm h2.sm__section-title a,
#main .sm h2.sm__section-title a{
	color:var(--sm-ink);
	text-decoration:none;
	border-bottom:2px solid transparent;
	transition:color .18s ease,border-color .18s ease;
}
.sm h2.sm__section-title a:hover,
#main .sm h2.sm__section-title a:hover{
	color:var(--sm-red);
	border-bottom-color:var(--sm-red);
}
.sm__section-meta{
	font-size:12px;
	font-weight:600;
	letter-spacing:.06em;
	text-transform:uppercase;
	color:var(--sm-muted);
	margin-left:auto;
	white-space:nowrap;
}

.sm__groups{
	display:grid;
	grid-template-columns:repeat(3,minmax(0,1fr));
	gap:30px 36px;
	align-items:start;
}
.sm__group{
	margin:0;
	padding:0;
	min-width:0;
}
.sm h3.sm__group-title{
	font-size:12px;
	font-weight:700;
	letter-spacing:.11em;
	text-transform:uppercase;
	color:var(--sm-ink);
	margin:0 0 10px;
	padding-bottom:8px;
	border-bottom:1px solid var(--sm-line);
}
.sm h3.sm__group-title a,
#main .sm h3.sm__group-title a{
	color:var(--sm-ink);
	text-decoration:none;
	transition:color .18s ease;
}
.sm h3.sm__group-title a:hover,
#main .sm h3.sm__group-title a:hover{color:var(--sm-red);}

.sm__list{
	list-style:none;
	margin:0;
	padding:0;
}
.sm__list li{margin:0;padding:0;}
.sm__list a,
#main .sm__list a{
	display:block;
	padding:4px 0 4px 13px;
	font-size:14px;
	color:var(--sm-body);
	text-decoration:none;
	position:relative;
	transition:color .16s ease,padding-left .16s ease;
}
.sm__list a::before,
#main .sm__list a::before{
	content:"";
	position:absolute;
	left:0;
	top:50%;
	transform:translateY(-50%);
	width:5px;
	height:1px;
	background:#c3c9cf;
	transition:background .16s ease,width .16s ease;
}
.sm__list a:hover,
#main .sm__list a:hover{
	color:var(--sm-red);
	padding-left:17px;
}
.sm__list a:hover::before,
#main .sm__list a:hover::before{
	background:var(--sm-red);
	width:9px;
}
.sm__list a[target="_blank"]::after,
#main .sm__list a[target="_blank"]::after{
	content:"\2197";
	font-size:10px;
	margin-left:5px;
	color:var(--sm-muted);
	vertical-align:1px;
}

/* Focus states — keyboard users get a visible target */
.sm a:focus-visible,
#main .sm a:focus-visible{
	outline:2px solid var(--sm-red);
	outline-offset:2px;
	border-radius:2px;
}

/* --------------------------------------------------------------------------
   Footnote
   -------------------------------------------------------------------------- */
.sm__note{
	margin:0;
	padding:16px 18px;
	background:var(--sm-tint);
	border-left:3px solid var(--sm-red);
	font-size:13px;
	color:var(--sm-muted);
	line-height:1.6;
}
.sm__note a,
#main .sm__note a{color:var(--sm-red);text-decoration:none;}
.sm__note a:hover,
#main .sm__note a:hover{text-decoration:underline;}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width:1040px){
	/* Side gutters once the fixed container stops providing them */
	.sm{padding-left:20px;padding-right:20px;}
}
@media (max-width:900px){
	.sm__groups{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 28px;}
	.sm h1.sm__title{font-size:28px;}
}
@media (max-width:600px){
	.sm{padding:6px 16px 32px;}
	.sm__groups{grid-template-columns:minmax(0,1fr);gap:24px;}
	.sm h1.sm__title{font-size:24px;}
	.sm__section{padding-top:10px;margin-bottom:34px;}
	.sm__section-head{margin-bottom:20px;}
	.sm__section-meta{margin-left:0;}
	.sm__list a,
	#main .sm__list a{padding-top:6px;padding-bottom:6px;}
}
@media (prefers-reduced-motion:reduce){
	.sm a{transition:none !important;}
}

/* --------------------------------------------------------------------------
   Print — a sitemap is a thing people print
   -------------------------------------------------------------------------- */
@media print{
	.sm{font-size:11pt;color:#000;padding:0;}
	.sm__jump,.sm__note{display:none;}
	.sm__list a,#main .sm__list a{color:#000;}
	.sm__section{page-break-inside:avoid;}
}

@media (max-width:1040px){
	#main{
		width:auto !important;
		max-width:100%;
	}
}
