/* American2Day skin — loaded as its own file so edge caches can't hold it stale. */
/* Palette lifted from the logo: cream paper, navy ink, flag red. */
:root {
	--a2d-cream: #fbf3e3;
	--a2d-cream-deep: #f3e8d2;
	--a2d-navy: #152238;
	--a2d-navy-soft: #1f3352;
	--a2d-red: #8c1c1c;
	--a2d-red-bright: #b52222;
	--a2d-ink: #1b1b1f;
	--a2d-muted: #5d6470;
	--a2d-rule: #d9cdb4;
}

/* ------------------------------------------------------------ top bar ---- */
.a2d-topbar {
	background: var(--a2d-navy);
	color: var(--a2d-cream);
	font-family: 'Oswald', 'Open Sans', sans-serif;
	font-size: 13px;
	letter-spacing: .04em;
	border-bottom: 3px solid var(--a2d-red);
}
.a2d-topbar-inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 7px 20px;
	display: flex;
	align-items: center;
	gap: 14px;
	overflow: hidden;
}
.a2d-date { text-transform: uppercase; opacity: .85; white-space: nowrap; }
.a2d-latest-label {
	background: var(--a2d-red);
	color: #fff;
	text-transform: uppercase;
	font-weight: 700;
	padding: 3px 10px;
	white-space: nowrap;
	margin-left: auto;
}
.a2d-ticker { position: relative; flex: 0 1 640px; height: 20px; }
.a2d-ticker-item {
	position: absolute;
	inset: 0;
	color: var(--a2d-cream) !important;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	opacity: 0;
	transform: translateY(6px);
	transition: opacity .45s ease, transform .45s ease;
	pointer-events: none;
	line-height: 20px;
}
.a2d-ticker-item.is-active { opacity: 1; transform: none; pointer-events: auto; }
.a2d-ticker-item:hover { color: #fff !important; text-decoration: underline; }
@media (max-width: 860px) {
	/* keep the headlines (the useful part); the date is the throwaway */
	.a2d-date { display: none; }
	.a2d-latest-label { margin-left: 0; }
	.a2d-topbar-inner { padding: 6px 14px; gap: 10px; }
	.a2d-ticker { flex: 1 1 auto; }
	.a2d-ticker-item { font-size: 12px; }
}

/* ------------------------------------------------------------ masthead --- */
.a2d-skin #cm-masthead .cm-main-header,
.a2d-skin #cm-masthead .cm-header-main-row {
	background: var(--a2d-cream) !important;
}
.a2d-skin #cm-masthead .cm-main-row {
	align-items: center;
	padding: 14px 0 12px;
}
.a2d-skin .cm-site-branding { margin-right: 16px; }
.a2d-skin .cm-site-branding img,
.a2d-skin .custom-logo {
	height: 88px !important;
	width: auto !important;
	max-width: none;
	/* logo art is already cream-backed to match the masthead */
}
.a2d-skin .cm-site-title {
	font-family: 'Playfair Display', Georgia, serif !important;
	font-weight: 900 !important;
	font-size: clamp(34px, 5.2vw, 58px) !important;
	line-height: .95 !important;
	margin: 0 !important;
	letter-spacing: -.02em;
}
.a2d-skin .cm-site-title a { color: var(--a2d-navy) !important; }
.a2d-skin .cm-site-title a:hover { color: var(--a2d-red) !important; }
.a2d-skin .cm-site-description {
	font-family: 'Oswald', sans-serif !important;
	text-transform: uppercase;
	letter-spacing: .16em;
	font-size: 11.5px !important;
	color: var(--a2d-red) !important;
	margin: 7px 0 0 !important;
	font-weight: 500;
}
/* hairline rules under the masthead, like a printed nameplate */
.a2d-skin #cm-masthead .cm-main-header {
	border-bottom: 1px solid var(--a2d-rule);
	box-shadow: inset 0 -4px 0 var(--a2d-cream-deep);
}

/* ----------------------------------------------------------------- nav --- */
.a2d-skin #cm-masthead .cm-nav-row,
.a2d-skin .cm-header-bottom-row,
.a2d-skin #cm-primary-nav,
.a2d-skin .cm-primary-nav {
	background: var(--a2d-navy) !important;
}
.a2d-skin .cm-primary-nav .cm-menu > li > a,
.a2d-skin #cm-primary-nav ul li a,
.a2d-skin .main-navigation a {
	font-family: 'Oswald', sans-serif !important;
	text-transform: uppercase;
	letter-spacing: .08em;
	font-size: 14px !important;
	font-weight: 500;
	color: var(--a2d-cream) !important;
	padding: 13px 15px !important;
	position: relative;
}
.a2d-skin .cm-primary-nav .cm-menu > li > a::after,
.a2d-skin #cm-primary-nav ul li a::after {
	content: '';
	position: absolute;
	left: 15px; right: 15px; bottom: 7px;
	height: 2px;
	background: var(--a2d-red-bright);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .25s ease;
}
.a2d-skin .cm-primary-nav .cm-menu > li:hover > a::after,
.a2d-skin #cm-primary-nav ul li:hover a::after,
.a2d-skin .cm-primary-nav .cm-menu > li.current-menu-item > a::after {
	transform: scaleX(1);
}
.a2d-skin #cm-primary-nav ul li a:hover,
.a2d-skin .cm-primary-nav .cm-menu > li > a:hover { color: #fff !important; }

/* ------------------------------------------------- section kickers/tags -- */
.a2d-skin .cm-post-categories a,
.a2d-skin .cm-above-post-title-meta .cm-post-categories a,
.a2d-skin .entry-meta .cat-links a {
	background: var(--a2d-red) !important;
	color: #fff !important;
	font-family: 'Oswald', sans-serif !important;
	text-transform: uppercase;
	letter-spacing: .1em;
	font-size: 10.5px !important;
	font-weight: 600;
	padding: 4px 9px !important;
	border-radius: 0 !important;
	line-height: 1.1;
	display: inline-block;
}
.a2d-skin .cm-post-categories a:hover { background: var(--a2d-navy) !important; }

/* --------------------------------------------------------- headlines ----- */
.a2d-skin .cm-entry-title,
.a2d-skin .cm-entry-title a,
.a2d-skin .cm-post-title,
.a2d-skin .entry-title,
.a2d-skin .cm-slider-title,
.a2d-skin h2.cm-post-title {
	font-family: 'Playfair Display', Georgia, serif !important;
	font-weight: 800 !important;
	line-height: 1.14 !important;
	letter-spacing: -.01em;
}
.a2d-skin .cm-entry-title a,
.a2d-skin .cm-post-title a,
.a2d-skin .entry-title a { color: var(--a2d-ink) !important; transition: color .2s ease; }
.a2d-skin .cm-entry-title a:hover,
.a2d-skin .cm-post-title a:hover,
.a2d-skin .entry-title a:hover { color: var(--a2d-red) !important; }

/* card headline scale: grid cards read tight, list rows a touch smaller */
.a2d-skin .cm-entry-title { font-size: 21px !important; }
.a2d-skin .cm-featured-posts .cm-post-wrapper > article:first-child .cm-entry-title,
.a2d-skin .cm-featured-posts-style-1 article:first-child .cm-entry-title { font-size: 27px !important; }
.a2d-skin .cm-post-list .cm-entry-title,
.a2d-skin .cm-featured-posts-vertical .cm-entry-title { font-size: 17px !important; }
.a2d-skin.single .cm-entry-title,
.a2d-skin.single .entry-title { font-size: clamp(32px, 4.4vw, 52px) !important; }

/* lead story in the slider gets real presence */
.a2d-skin .cm-featured-posts-slider .cm-slider-title,
.a2d-skin .cm-slider-area .cm-entry-title,
.a2d-skin .cm-slider-area .cm-post-title {
	font-size: clamp(25px, 3.1vw, 42px) !important;
	text-shadow: 0 2px 18px rgba(0, 0, 0, .55);
}
.a2d-skin .cm-featured-posts-slider .cm-post-content,
.a2d-skin .cm-slider-area .cm-post-content {
	background: linear-gradient(to top, rgba(10, 16, 28, .93) 12%, rgba(10, 16, 28, .55) 55%, transparent);
	padding-top: 46px !important;
}

/* ---------------------------------------------- widget/section headings -- */
.a2d-skin .cm-widget-title,
.a2d-skin .widget-title,
.a2d-skin .cm-section-title {
	font-family: 'Oswald', sans-serif !important;
	text-transform: uppercase;
	letter-spacing: .1em;
	font-size: 17px !important;
	font-weight: 600 !important;
	color: var(--a2d-navy) !important;
	border-bottom: 3px solid var(--a2d-navy) !important;
	padding: 0 0 8px !important;
	margin-bottom: 20px !important;
	position: relative;
	background: none !important;
}
.a2d-skin .cm-widget-title span,
.a2d-skin .widget-title span {
	background: var(--a2d-red) !important;
	color: #fff !important;
	padding: 6px 14px !important;
	display: inline-block;
	border-radius: 0 !important;
}

/* ------------------------------------------------------------- cards ----- */
.a2d-skin .cm-post-thumbnail,
.a2d-skin .cm-featured-posts .cm-post-thumbnail {
	overflow: hidden;
	position: relative;
}
.a2d-skin .cm-post-thumbnail img {
	transition: transform .5s cubic-bezier(.2, .7, .3, 1);
	display: block;
	width: 100%;
}
.a2d-skin article:hover .cm-post-thumbnail img,
.a2d-skin .cm-post:hover .cm-post-thumbnail img { transform: scale(1.055); }
.a2d-skin .cm-post,
.a2d-skin .cm-featured-posts article {
	transition: box-shadow .25s ease, transform .25s ease;
}
.a2d-skin .cm-post:hover,
.a2d-skin .cm-featured-posts article:hover {
	box-shadow: 0 10px 26px rgba(21, 34, 56, .13);
	transform: translateY(-2px);
}

/* ---------------------------------------------------------- post meta ---- */
.a2d-skin .cm-post-meta,
.a2d-skin .cm-post-meta a,
.a2d-skin .entry-meta,
.a2d-skin .entry-meta a {
	font-family: 'Oswald', sans-serif !important;
	font-size: 11.5px !important;
	text-transform: uppercase;
	letter-spacing: .07em;
	color: var(--a2d-muted) !important;
	font-weight: 400;
}
.a2d-skin .cm-post-meta a:hover { color: var(--a2d-red) !important; }

/* ----------------------------------------------------- article reading --- */
.a2d-skin.single .entry-content,
.a2d-skin.page .entry-content {
	font-size: 18px;
	line-height: 1.72;
	color: #26262b;
}
.a2d-skin.single .entry-content > p:first-of-type { font-size: 20px; color: #1b1b1f; }
.a2d-skin.single .entry-title { font-size: clamp(32px, 4.4vw, 52px) !important; }
.a2d-skin .entry-content a { color: var(--a2d-red); text-underline-offset: 3px; }
.a2d-skin .entry-content h2,
.a2d-skin .entry-content h3 {
	font-family: 'Playfair Display', Georgia, serif !important;
	font-weight: 700 !important;
	color: var(--a2d-navy);
}
.a2d-skin .entry-content blockquote {
	border-left: 5px solid var(--a2d-red);
	background: var(--a2d-cream);
	padding: 16px 22px;
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 21px;
	font-style: italic;
}
/* the Willbot methods note reads as a boxed sidebar, not body copy */
.a2d-skin .entry-content hr.wp-block-separator + h3 { margin-top: 6px; }

/* ------------------------------------------------------------ footer ----- */
.a2d-skin #cm-footer,
.a2d-skin .cm-footer-bottom-area,
.a2d-skin footer#colophon {
	background: var(--a2d-navy) !important;
	color: var(--a2d-cream);
}
.a2d-skin #cm-footer a,
.a2d-skin footer#colophon a { color: var(--a2d-cream) !important; }
.a2d-skin #cm-footer a:hover { color: #fff !important; }
.a2d-skin #cm-footer .cm-widget-title,
.a2d-skin footer#colophon .widget-title {
	color: var(--a2d-cream) !important;
	border-bottom-color: rgba(251, 243, 227, .3) !important;
}

/* scroll-to-top and accents pick up the brand red */
.a2d-skin #cm-scroll-top,
.a2d-skin .cm-scroll-top { background: var(--a2d-red) !important; }

/* ---------------------------------------- overlay cards: text over photos --
 * ColorMag already paints a dark scrim on the slider and highlighted cards,
 * so headlines there must stay light — the ink colour above is for cards that
 * sit on white. Without this the lead story is dark-on-dark and unreadable.
 */
.a2d-skin .cm-slide-content .cm-entry-title a,
.a2d-skin .cm-highlighted-posts .cm-post-content .cm-entry-title a,
.a2d-skin .cm-slide-content .cm-entry-title,
.a2d-skin .cm-highlighted-posts .cm-post-content .cm-entry-title {
	color: #fff !important;
	text-shadow: 0 2px 14px rgba(0, 0, 0, .75);
}
.a2d-skin .cm-slide-content .cm-entry-title a:hover,
.a2d-skin .cm-highlighted-posts .cm-post-content .cm-entry-title a:hover {
	color: #ffd9d9 !important;
}
.a2d-skin .cm-slide-content .cm-post-date,
.a2d-skin .cm-slide-content .cm-below-entry-meta,
.a2d-skin .cm-slide-content .cm-below-entry-meta a,
.a2d-skin .cm-highlighted-posts .cm-post-content .cm-post-date,
.a2d-skin .cm-highlighted-posts .cm-post-content .cm-below-entry-meta a {
	color: rgba(255, 255, 255, .88) !important;
}
/* deepen the scrim so type always clears the artwork */
.a2d-skin .cm-slide-content,
.a2d-skin .cm-highlighted-posts .cm-post-content {
	background-image: linear-gradient(to top,
		rgba(10, 16, 28, .94) 0%, rgba(10, 16, 28, .74) 45%, rgba(10, 16, 28, 0) 100%) !important;
	padding: 34px 22px 18px !important;
}
.a2d-skin .cm-highlighted-posts .cm-post-content .cm-entry-title { font-size: 18px !important; }

/* ------------------------------------------------------ nav on one line --- */
.a2d-skin .cm-primary-nav .cm-primary-menu > li > a {
	font-size: 13px !important;
	padding: 12px 11px !important;
	letter-spacing: .06em;
}
.a2d-skin .cm-primary-nav .cm-primary-menu > li > a::after { left: 11px; right: 11px; bottom: 6px; }
.a2d-skin .cm-primary-nav .cm-primary-menu { display: flex; flex-wrap: wrap; align-items: center; }
@media (min-width: 1100px) {
	.a2d-skin .cm-primary-nav .cm-primary-menu { flex-wrap: nowrap; }
}

/* menu labels must never break mid-item */
.a2d-skin .cm-primary-nav .cm-primary-menu > li > a { white-space: nowrap; }
/* the logo art already carries the masthead's cream, so no blend trick needed
 * (multiply was darkening cream-on-cream into a visible tile) */
.a2d-skin .cm-site-branding img,
.a2d-skin .custom-logo { mix-blend-mode: normal; }

/* 11 sections have to clear the container without clipping the last item */
.a2d-skin .cm-primary-nav .cm-primary-menu > li > a {
	font-size: 12.5px !important;
	padding: 12px 8px !important;
	letter-spacing: .045em;
}
.a2d-skin .cm-primary-nav .cm-primary-menu > li > a::after { left: 8px; right: 8px; }
@media (min-width: 1100px) {
	.a2d-skin .cm-primary-nav .cm-primary-menu { justify-content: space-between; width: 100%; }
}

/* ------------------------------------------- single post: news running order
 * ColorMag prints the photo first, which buries the headline below the fold.
 * Reorder to kicker -> headline -> byline -> photo -> body, like a news story.
 */
.a2d-skin.single .cm-post-content { display: flex; flex-direction: column; }
.a2d-skin.single .cm-entry-header-meta { order: 1; }
.a2d-skin.single .cm-entry-header      { order: 2; }
.a2d-skin.single .cm-below-entry-meta  { order: 3; }
.a2d-skin.single .cm-featured-image    { order: 4; margin: 18px 0 26px; }
.a2d-skin.single .cm-entry-summary     { order: 5; }
.a2d-skin.single .cm-entry-header { margin: 6px 0 10px; }
.a2d-skin.single .cm-featured-image img { width: 100%; height: auto; }

/* ------------------------------------------------------ masthead on phones -
 * Stacked logo + full tagline ate the entire first screen; go side-by-side and
 * drop the tagline so the lead story is visible without scrolling.
 */
@media (max-width: 860px) {
	.a2d-skin #cm-masthead .cm-mobile-row .cm-main-row,
	.a2d-skin #cm-masthead .cm-mobile-row .cm-header-left-col {
		display: flex;
		align-items: center;
		gap: 12px;
		flex-wrap: nowrap;
	}
	.a2d-skin .cm-site-branding { margin: 0; flex: 0 0 auto; }
	.a2d-skin .cm-site-branding img,
	.a2d-skin .custom-logo { height: 52px !important; }
	.a2d-skin .cm-site-title { font-size: 30px !important; }
	.a2d-skin .cm-site-description { display: none !important; }
	.a2d-skin #cm-masthead .cm-main-row { padding: 10px 0; }
}
@media (max-width: 600px) {
	.a2d-skin .cm-site-title { font-size: 26px !important; }
	.a2d-skin .cm-slide-content .cm-entry-title { font-size: 22px !important; }
	.a2d-skin .cm-slide-content { padding: 26px 16px 14px !important; }
}

/* 10 sections: squeeze gaps on narrower desktops, breathe on wide screens */
@media (min-width: 1100px) and (max-width: 1439px) {
	.a2d-skin .cm-primary-nav .cm-primary-menu > li > a {
		padding: 12px 6px !important;
		font-size: 12px !important;
		letter-spacing: .03em;
	}
	.a2d-skin .cm-primary-nav .cm-primary-menu > li > a::after { left: 6px; right: 6px; }
}
@media (min-width: 1440px) {
	.a2d-skin .cm-primary-nav .cm-primary-menu > li > a { padding: 12px 13px !important; }
	.a2d-skin .cm-primary-nav .cm-primary-menu > li > a::after { left: 13px; right: 13px; }
}

/* ---------------------------------------------------------- nav sizing -----
 * NOTE: the base nav rule above matches `#cm-primary-nav ul li a`, and an ID
 * selector outranks every plain-class rule — so all sizing overrides must also
 * carry the ID or they silently lose the cascade.
 */
#cm-primary-nav ul li a { white-space: nowrap; }
@media (min-width: 1100px) and (max-width: 1439px) {
	.a2d-skin #cm-primary-nav ul li a {
		padding: 12px 14px !important;
		font-size: 12.5px !important;
		letter-spacing: .04em;
	}
	.a2d-skin #cm-primary-nav ul li a::after { left: 14px; right: 14px; }
}
@media (min-width: 1440px) {
	.a2d-skin #cm-primary-nav ul li a {
		padding: 13px 12px !important;
		font-size: 13px !important;
	}
	.a2d-skin #cm-primary-nav ul li a::after { left: 12px; right: 12px; }
}

/* ------------------------------------------------- two-county page layout --
 * Eaton and Ingham sit side by side with a hard rule between them, so it reads
 * as two distinct county desks rather than one merged feed.
 */
.a2d-counties {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 38px;
	align-items: start;
}
.a2d-counties .a2d-county + .a2d-county {
	border-left: 1px solid var(--a2d-rule);
	padding-left: 38px;
}
.a2d-county-head {
	font-family: 'Oswald', sans-serif !important;
	text-transform: uppercase;
	letter-spacing: .09em;
	font-size: 15px !important;
	margin: 0 0 4px !important;
}
.a2d-county-head a {
	background: var(--a2d-red);
	color: #fff !important;
	padding: 7px 15px;
	display: inline-block;
}
.a2d-county-head + .a2d-county-blurb {
	border-top: 3px solid var(--a2d-navy);
	padding-top: 10px;
	margin: 0 0 18px;
	color: var(--a2d-muted);
	font-size: 13.5px;
	font-style: italic;
}
.a2d-county-list { list-style: none; margin: 0; padding: 0; }
.a2d-county-item {
	display: flex;
	gap: 14px;
	padding: 14px 0;
	border-bottom: 1px solid #ececef;
}
.a2d-county-item:last-child { border-bottom: 0; }
.a2d-county-thumb { flex: 0 0 96px; overflow: hidden; display: block; }
.a2d-county-thumb img {
	width: 96px; height: 66px; object-fit: cover; display: block;
	transition: transform .4s cubic-bezier(.2,.7,.3,1);
}
.a2d-county-item:hover .a2d-county-thumb img { transform: scale(1.07); }
.a2d-county-item h3 {
	font-family: 'Playfair Display', Georgia, serif !important;
	font-size: 16.5px !important;
	font-weight: 700 !important;
	line-height: 1.24 !important;
	margin: 0 0 5px !important;
}
.a2d-county-item h3 a { color: var(--a2d-ink) !important; }
.a2d-county-item h3 a:hover { color: var(--a2d-red) !important; }
.a2d-county-date {
	font-family: 'Oswald', sans-serif;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--a2d-muted);
}
/* lead story in each column gets a bigger picture and headline */
.a2d-county-item.is-lead { display: block; padding-top: 0; }
.a2d-county-item.is-lead .a2d-county-thumb { margin-bottom: 10px; }
.a2d-county-item.is-lead .a2d-county-thumb img { width: 100%; height: 190px; }
.a2d-county-item.is-lead h3 { font-size: 22px !important; }
.a2d-county-more {
	display: inline-block;
	margin-top: 16px;
	font-family: 'Oswald', sans-serif;
	text-transform: uppercase;
	letter-spacing: .07em;
	font-size: 12px;
	color: var(--a2d-red) !important;
	border-bottom: 2px solid var(--a2d-red);
	padding-bottom: 2px;
}
.a2d-county-more:hover { color: var(--a2d-navy) !important; border-color: var(--a2d-navy); }
.a2d-county-empty { color: var(--a2d-muted); font-style: italic; }
@media (max-width: 780px) {
	.a2d-counties { grid-template-columns: 1fr; gap: 0; }
	.a2d-counties .a2d-county + .a2d-county {
		border-left: 0; padding-left: 0;
		border-top: 3px solid var(--a2d-navy); margin-top: 34px; padding-top: 26px;
	}
}

/* active section: red underline, not ColorMag's default blue block */
.a2d-skin #cm-primary-nav ul li.current-menu-item > a,
.a2d-skin #cm-primary-nav ul li.current_page_item > a,
.a2d-skin #cm-primary-nav ul li.current-menu-parent > a,
.a2d-skin #cm-primary-nav ul li.current-category-ancestor > a {
	background: transparent !important;
	color: #fff !important;
}
.a2d-skin #cm-primary-nav ul li.current-menu-item > a::after,
.a2d-skin #cm-primary-nav ul li.current_page_item > a::after { transform: scaleX(1); }

/* -------------------------------------------------------- opinion archive -- */
.a2d-archive { margin-top: 6px; }
.a2d-arch-block { margin-bottom: 46px; }
.a2d-arch-head {
	font-family: 'Oswald', sans-serif !important;
	text-transform: uppercase;
	letter-spacing: .1em;
	font-size: 15px !important;
	border-bottom: 3px solid var(--a2d-navy);
	padding: 0 !important;
	margin: 0 0 10px !important;
}
.a2d-arch-head span {
	background: var(--a2d-red);
	color: #fff;
	padding: 7px 15px;
	display: inline-block;
}
.a2d-arch-note {
	color: var(--a2d-muted);
	font-style: italic;
	font-size: 13.5px;
	margin: 0 0 18px;
}
.a2d-arch-jump {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 30px;
	padding-bottom: 22px;
	border-bottom: 1px solid var(--a2d-rule);
}
.a2d-arch-jump a {
	font-family: 'Oswald', sans-serif;
	text-transform: uppercase;
	letter-spacing: .05em;
	font-size: 11.5px;
	background: var(--a2d-cream);
	border: 1px solid var(--a2d-rule);
	color: var(--a2d-navy) !important;
	padding: 6px 11px;
}
.a2d-arch-jump a:hover { background: var(--a2d-navy); color: #fff !important; border-color: var(--a2d-navy); }
.a2d-arch-jump a em { font-style: normal; opacity: .55; margin-left: 4px; }
.a2d-arch-topic { margin-bottom: 30px; scroll-margin-top: 90px; }
.a2d-arch-topic h3 {
	font-family: 'Playfair Display', Georgia, serif !important;
	font-size: 21px !important;
	font-weight: 800 !important;
	color: var(--a2d-navy) !important;
	border-left: 5px solid var(--a2d-red);
	padding-left: 12px;
	margin: 0 0 10px !important;
}
.a2d-arch-count {
	font-family: 'Oswald', sans-serif;
	font-size: 12px;
	color: var(--a2d-muted);
	vertical-align: middle;
	margin-left: 6px;
}
.a2d-arch-list { list-style: none; margin: 0; padding: 0; }
.a2d-arch-item {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 14px;
	padding: 9px 0;
	border-bottom: 1px solid #ededf0;
}
.a2d-arch-date {
	font-family: 'Oswald', sans-serif;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--a2d-muted);
	flex: 0 0 86px;
}
.a2d-arch-title {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 17px;
	font-weight: 700;
	color: var(--a2d-ink) !important;
	flex: 1 1 340px;
	line-height: 1.3;
}
.a2d-arch-title:hover { color: var(--a2d-red) !important; }
.a2d-arch-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.a2d-arch-tags a {
	font-family: 'Oswald', sans-serif;
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: .07em;
	background: var(--a2d-cream-deep);
	color: var(--a2d-navy) !important;
	padding: 3px 8px;
}
.a2d-arch-tags a:hover { background: var(--a2d-red); color: #fff !important; }
@media (max-width: 620px) {
	.a2d-arch-date { flex: 0 0 100%; }
	.a2d-arch-title { flex: 1 1 100%; font-size: 16px; }
}