/*================================================================
	ARTHAUS NEWSROOM ARCHIVE - archive-newsroom.php
	Structural FITFO rewrite at CURRENT VISUAL PARITY, not a redesign.
	Values are the px values extracted verbatim from style.css and the
	old template's inline style block, kept in px so every value can be
	diffed 1:1 against its style.css source. NOTE: home-page-core.css
	gives these pages the FLUID rem base (0.523vw under 1920), so a rem
	written into this file would SCALE with the viewport, not equal
	value x 10px; stay in px here. Box-sizing border-box is inherited
	from style.css.
	Author: Splat, Inc.
================================================================*/


/*//// SKIP TO CONTENT ////*/
a.skip-to-content {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 999;
	padding: 10px;
	background: #000;
	color: #fff;
}
a.skip-to-content:focus {
	left: 0;
}


/*//// SCREEN READER TEXT ////*/
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}


/*//// PAGE WRAP ////*/
/* no backgrounds declared: parity keeps body's #F7F7F7 as the page field */
div.page-container {
	position: relative;
	min-height: 100%;
}
main.newsroom-archive-page {
	position: relative;
	width: 100%;
	max-width: 100%;
	/* no margin declared: style.css compensates for the fixed header */
	padding: 80px 0; /* parity: .blog__page */
}
section.newsroom-pager-section,
section.newsroom-cards-section {
	position: relative;
	width: 100%;
	padding: 0;
	margin: 0;
}


/*/////////// CONTENT SECTIONS //////////*/
/*////// NEWSROOM PAGER SECTION (sticky) //////*/
/*//// FLEX ////*/
/* parity: .container.stickyNewsroom. The old bar had no explicit top and
   rode its static position to just under the fixed header; pinned explicitly
   here because this section now lives inside main's padding box. */
div.newsroom-pager-container {
	position: fixed;
	top: 100px; /* the fixed header's height */
	left: 50%;
	transform: translateX(-50%);
	margin: -5px auto 80px auto;
	z-index: 100;
	width: 100%;
	max-width: 1366px;
	padding-left: 32px;
	padding-right: 32px;
}
/* the WP admin bar shifts the fixed header down; track it like the old
   static-position bar did (32px bar, 46px at 782 and below) */
body.admin-bar div.newsroom-pager-container {
	top: 132px;
}

/*// ELEMENTS //*/
/* parity: .interiorNav + the old inline overrides */
nav.newsroom-pager {
	position: relative;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	overflow-x: auto;
	margin-top: 5px;
	margin-bottom: 0;
	padding-bottom: 5px;
	background-color: #F7F7F7;
}
span.newsroom-pager-link {
	display: block;
	padding: 15px 16px;
	font-size: 14px;
	line-height: 18px;
	letter-spacing: 2.33px;
	font-weight: 700;
	text-transform: uppercase;
	color: rgba(12, 11, 53, .5);
	border-bottom: 1px solid transparent;
	transition: .3s ease;
}
/* parity: .interiorNav__link:first-child / :last-child zero their outer
   padding at mobile; the label span is the only child of its link */
@media only screen and (max-width: 768px) {
	nav.newsroom-pager a:first-child span.newsroom-pager-link { padding-left: 0; }
	nav.newsroom-pager span.newsroom-pager-status:last-child { padding-right: 0; }
}

/*// BUTTONS AND LINKS //*/
nav.newsroom-pager a {
	text-decoration: none;
}
nav.newsroom-pager a:focus span.newsroom-pager-link,
nav.newsroom-pager a:hover span.newsroom-pager-link {
	color: #0c0b35;
}


/*////// NEWSROOM CARDS SECTION //////*/
/*//// FLEX ////*/
/* parity: .container + the old inline .newsroomContainer padding-top */
div.newsroom-cards-container {
	position: relative;
	width: 100%;
	max-width: 1366px;
	margin: 0 auto;
	padding: 80px 32px 0 32px;
}
/* parity: .posts */
div.newsroom-cards-flex-container {
	justify-content: flex-start;
	align-items: stretch;
	margin: 0 -10px;
}
/* parity: .post width model; the calc includes the old card side margins */
div.newsroom-cards-flex-item {
	width: calc(33.33% - 20px);
	margin: 0 10px 20px;
	padding: 0;
}

/*// ELEMENTS //*/
/* term archive page heading (taxonomy-newsroom_category.php only) */
h1.newsroom-term-heading {
	margin: 0 0 32px 0;
	font-family: "Playfair Display", serif;
	font-size: 32px;
	line-height: 1.2;
	font-weight: 400;
	color: #0C0B35;
}
/* parity: .post, with a real <img> replacing the CSS background */
article.newsroom-card {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 250px;
	height: 100%;
	padding: 24px 32px;
	overflow: hidden;
	/* no background: parity, a thumbnail-less card is the scrim over the
	   page field, exactly as the old empty background-image rendered */
}
article.newsroom-card picture {
	display: contents; /* the WebP path wraps the img in <picture> */
}
article.newsroom-card img.newsroom-card-image {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
}
div.newsroom-card-inner {
	position: relative;
	z-index: 2;
	pointer-events: none; /* parity: .post__inner, clicks fall through to the card link */
}
p.newsroom-card-category {
	/*font-size: 12px;
	line-height: 16px;
	letter-spacing: 2px;
	font-weight: 700;*/
	margin: 0 0 6px 0;
	margin: 0 0;
	color: #ffffff;
	font-size: 18px;
	line-height: 24px;
	/*text-transform: uppercase;*/
}
p.newsroom-card-category a {
	position: relative;
	z-index: 3; /* above the scrim link */
	pointer-events: auto; /* the card inner disables pointer events; re-enable for this link */
	color: #ffffff;
	text-decoration: none;
	transition: color 0.3s ease;
}
p.newsroom-card-category a:hover,
p.newsroom-card-category a:focus {
	color: #83EED4;
}
h2.newsroom-card-title {
	margin: 0;
	color: #ffffff;
	font-family: "Playfair Display", serif;
	font-size: 24px;
	line-height: 32px;
	font-weight: 400;
	text-transform: capitalize;
}
p.newsroom-card-source {
	margin: 0;
	color: #ffffff;
	font-size: 18px;
	line-height: 24px;
}

/*// BUTTONS AND LINKS //*/
/* parity: .post__link, the dark scrim IS the click target */
a.newsroom-card-link {
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, .5);
}

/*// PRESS DETAILS + PAGINATION //*/
/* parity: .press__details (p variant carries the term archive's empty state) */
div.newsroom-press-details,
p.newsroom-press-details,
p.newsroom-pagination-status,
div.newsroom-pagination-controls {
	margin-top: 14px;
	text-transform: uppercase;
	font-weight: 700;
	color: #0C0B35;
	font-size: 14px;
	letter-spacing: 2.33px;
}
p.newsroom-pagination-status {
	margin-bottom: 0;
}
div.newsroom-pagination-controls a {
	color: #0C0B35;
	text-decoration: none;
}
div.newsroom-pagination-controls a:hover {
	color: #0c0b35;
	text-decoration: underline;
}


/*///////// RESPONSIVE / BREAKPOINTS ////////*/
/* breakpoints mirror the home page (1090, 851) plus the parity holdovers
   from style.css (782 admin bar, 768 mobile) */
@media only screen and (max-width: 1090px) {

	div.newsroom-pager-container { top: 83px; } /* the shorter mobile header */
	body.admin-bar div.newsroom-pager-container { top: 115px; }
	/* cards go 2-up here rather than style.css's old 1025: three-up below
	   1090 squashes the card titles against the 250px min-height */
	div.newsroom-cards-flex-item { width: calc(50% - 20px); }

}
/* band-scoped: the 480-and-under mobile design keeps its 24px 32px cards.
   The pager-link rule is effectively 769-851 only; the later 768 block's
   tighter 15px 6px wins below it, which is the intended progression. */
@media only screen and (min-width: 481px) and (max-width: 851px) {

	article.newsroom-card { padding: 24px; }
	span.newsroom-pager-link { padding: 15px 10px; }

}
@media only screen and (max-width: 782px) {

	body.admin-bar div.newsroom-pager-container { top: 129px; } /* WP's 46px mobile admin bar */

}
@media only screen and (max-width: 768px) {

	main.newsroom-archive-page { padding: 48px 0; }
	div.newsroom-pager-container { padding-left: 24px; padding-right: 24px; }
	div.newsroom-cards-container { padding-left: 24px; padding-right: 24px; }
	h1.newsroom-term-heading { margin-bottom: 24px; font-size: 24px; }
	div.newsroom-cards-flex-container { display: block; margin: 0; }
	div.newsroom-cards-flex-item { width: 100%; margin: 0 0 20px; }
	span.newsroom-pager-link { padding: 15px 6px; font-size: 12px; }
	h2.newsroom-card-title { font-size: 21px; line-height: 1.33; }
	p.newsroom-card-source { font-size: 16px; line-height: 1.33; }

}