/*
 * Theme Name:  Revision Child
 * Theme URI:   https://revision.codesupply.co/
 * Description: Revision Child Theme
 * Author:      Code Supply Co.
 * Author URI:  https://codesupply.co/
 * Template:    revision
 * Version:     1.0.5
 */

/* Copy any classes from parent theme here. They will override the parent's version. */

/* --- Full-width article body on single posts -------------------------------
 * The single-post sidebar is turned off in Customizer > Post Settings >
 * Default Sidebar. With no sidebar the parent theme still centres the article
 * in a narrow 640px content wrapper, so posts look pinched on large screens.
 * Let the post body use the theme's full 1248px desktop content area.
 *
 * Scoped to .single so archives, the home page and pages keep their own
 * layout. Delete this block to restore the parent's narrow reading measure.
 */
@media (min-width: 992px) {
	.single .cs-entry__container {
		--cs-entry-content-width: var(--cs-entry-content-full);
	}

	.single .cs-entry__content-wrap {
		width: 100%;
		max-width: 100%;
	}
}

/* ==========================================================================
   Author name in post meta
   The parent theme renders the byline at the same size as the date and the
   view count, so the writer's name disappears into the row. Give it its own
   size and weight so it reads as the byline it is.
   ========================================================================== */

.cs-entry__post-meta .cs-meta-author-name {
	font-size: 1.0625rem;
	font-weight: 600;
	letter-spacing: -0.01em;
}

.cs-entry__footer .cs-entry__post-meta .cs-meta-author-name,
.cs-entry__header .cs-entry__post-meta .cs-meta-author-name {
	font-size: 1.125rem;
	font-weight: 600;
}

.cs-entry__post-meta .cs-meta-author-avatar img {
	border-radius: 50%;
}

@media (max-width: 575px) {
	.cs-entry__post-meta .cs-meta-author-name,
	.cs-entry__footer .cs-entry__post-meta .cs-meta-author-name,
	.cs-entry__header .cs-entry__post-meta .cs-meta-author-name {
		font-size: 1rem;
	}
}

/* ==========================================================================
   Author archive page  (/blog/author/{name}/)
   Markup lives in inc/author.php.
   ========================================================================== */

.vl-author {
	position: relative;
	margin-bottom: 3rem;
	overflow: hidden;
	background: var(--cs-layout-background, #fff);
	border: 1px solid var(--cs-color-border);
	border-radius: 16px;
	box-shadow: 0 1px 2px rgba(var(--cs-color-box-shadow-rgb, 16, 16, 16), 0.04),
		0 12px 32px -12px rgba(var(--cs-color-box-shadow-rgb, 16, 16, 16), 0.12);
}

/* Blurred banner behind the top of the card. */
.vl-author__cover {
	height: 150px;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.vl-author__cover::after {
	content: "";
	display: block;
	height: 100%;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.35) 100%);
}

@media (min-width: 768px) {
	.vl-author__cover {
		height: 200px;
	}
}

.vl-author__body {
	position: relative;
	padding: 0 1.5rem 2rem;
}

@media (min-width: 768px) {
	.vl-author__body {
		padding: 0 2.75rem 2.5rem;
	}
}

/* --- Identity: photo + name --------------------------------------------- */

.vl-author__identity {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1.25rem;
}

@media (min-width: 768px) {
	.vl-author__identity {
		flex-direction: row;
		align-items: flex-end;
		gap: 1.75rem;
	}
}

.vl-author__photo {
	/* Lift the portrait so it straddles the edge of the banner. */
	margin-top: -68px;
	flex: 0 0 auto;
	width: 136px;
	height: 136px;
	border-radius: 50%;
	padding: 5px;
	background: var(--cs-layout-background, #fff);
	box-shadow: 0 8px 28px -10px rgba(var(--cs-color-box-shadow-rgb, 16, 16, 16), 0.45);
}

.vl-author__photo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
	border-radius: 50%;
}

@media (min-width: 768px) {
	.vl-author__photo {
		margin-top: -76px;
		width: 172px;
		height: 172px;
		padding: 6px;
	}
}

/* Without a cover image the portrait must not hang off the top of the card. */
.vl-author--no-cover .vl-author__body {
	padding-top: 2rem;
}

.vl-author--no-cover .vl-author__photo {
	margin-top: 0;
}

.vl-author__intro {
	padding-bottom: 0.25rem;
	min-width: 0;
}

.vl-author__eyebrow {
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--cs-color-secondary);
	margin-bottom: 0.375rem;
}

.vl-author__name {
	margin: 0;
	font-size: 2rem;
	line-height: 1.15;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--cs-color-primary);
}

@media (min-width: 768px) {
	.vl-author__name {
		font-size: 2.75rem;
	}
}

.vl-author__position {
	margin-top: 0.5rem;
	font-size: 1.0625rem;
	font-weight: 500;
	color: var(--cs-color-accent);
}

.vl-author__facts {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem;
	margin-top: 0.75rem;
	font-size: 0.9375rem;
	color: var(--cs-color-secondary);
}

.vl-author__fact {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	color: inherit;
	text-decoration: none;
}

a.vl-author__fact:hover {
	color: var(--cs-color-accent);
}

.vl-author__fact .cs-icon {
	font-size: 1.125rem;
}

/* --- Bio ----------------------------------------------------------------- */

.vl-author__bio {
	margin-top: 1.75rem;
	max-width: 68ch;
	font-size: 1.0625rem;
	line-height: 1.75;
	color: var(--cs-color-secondary);
}

.vl-author__bio p {
	margin: 0;
}

.vl-author__bio p + p {
	margin-top: 0.875rem;
}

@media (min-width: 768px) {
	.vl-author__bio {
		font-size: 1.125rem;
	}
}

/* --- Stats + social ------------------------------------------------------ */

.vl-author__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1.25rem 2rem;
	margin-top: 1.75rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--cs-color-border);
}

.vl-author__stats {
	display: flex;
	align-items: stretch;
	gap: 2rem;
}

.vl-author__stat {
	display: flex;
	flex-direction: column;
	gap: 0.125rem;
}

.vl-author__stat + .vl-author__stat {
	padding-left: 2rem;
	border-left: 1px solid var(--cs-color-border);
}

.vl-author__stat-value {
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.02em;
	color: var(--cs-color-primary);
}

.vl-author__stat-label {
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--cs-color-secondary);
}

/* The parent's social link list carries its own top margin; not wanted here. */
.vl-author__meta .cs-page__author-social-links {
	margin-top: 0;
}

/* --- "Articles by ..." heading ------------------------------------------- */

.vl-author__section-heading {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-bottom: 1.75rem;
}

.vl-author__section-heading h2 {
	margin: 0;
	font-size: 1.25rem;
	font-weight: 600;
	letter-spacing: -0.01em;
	color: var(--cs-color-primary);
	white-space: nowrap;
}

.vl-author__section-heading::after {
	content: "";
	flex: 1 1 auto;
	height: 1px;
	background: var(--cs-color-border);
}

/* ==========================================================================
   Author box at the end of a single post
   ========================================================================== */

.vl-author-box {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1.25rem;
	margin: 2.5rem 0;
	padding: 1.75rem;
	background: var(--cs-color-highlight-background);
	border-radius: 16px;
}

@media (min-width: 576px) {
	.vl-author-box {
		flex-direction: row;
		gap: 1.75rem;
		padding: 2rem;
	}
}

.vl-author-box__photo {
	flex: 0 0 auto;
	display: block;
	width: 88px;
	height: 88px;
	border-radius: 50%;
	overflow: hidden;
	transition: 0.25s;
}

.vl-author-box__photo:hover {
	transform: translateY(-2px);
}

.vl-author-box__photo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
	border-radius: 50%;
}

@media (min-width: 576px) {
	.vl-author-box__photo {
		width: 104px;
		height: 104px;
	}
}

.vl-author-box__content {
	min-width: 0;
}

.vl-author-box__eyebrow {
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--cs-color-secondary);
	margin-bottom: 0.25rem;
}

.vl-author-box__name {
	margin: 0;
	font-size: 1.5rem;
	line-height: 1.25;
	font-weight: 700;
	letter-spacing: -0.02em;
}

.vl-author-box__name a {
	color: var(--cs-color-primary);
	text-decoration: none;
	transition: 0.25s;
}

.vl-author-box__name a:hover {
	color: var(--cs-color-accent);
}

.vl-author-box__position {
	margin-top: 0.25rem;
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--cs-color-accent);
}

.vl-author-box__bio {
	margin: 0.75rem 0 0;
	font-size: 1rem;
	line-height: 1.7;
	color: var(--cs-color-secondary);
}

.vl-author-box__footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem 1.5rem;
	margin-top: 1rem;
}

.vl-author-box__link {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--cs-color-accent);
	text-decoration: none;
	transition: 0.25s;
}

.vl-author-box__link::after {
	content: "\2192";
	transition: 0.25s;
}

.vl-author-box__link:hover {
	color: var(--cs-color-primary);
}

.vl-author-box__link:hover::after {
	transform: translateX(3px);
}

.vl-author-box__footer .cs-page__author-social-links {
	margin-top: 0;
	gap: 0.875rem;
}

.vl-author-box__footer .cs-page__author-social-links a svg {
	width: 22px;
	height: 22px;
}

/* ==========================================================================
   ISP Square branding
   The wordmark is a wide 1226x168 PNG; the parent sizes logos by header
   height, which makes it huge. Pin it to the size used on ispsquare.com.
   The hero highlight is a hardcoded purple gradient in the parent: use the
   logo red instead.
   ========================================================================== */

.cs-header__logo img,
.cs-header__inner-desktop .cs-header__logo img {
	width: auto;
	height: 30px;
	max-height: 30px;
}

.cs-footer__logo img {
	width: auto;
	height: 28px;
	max-height: 28px;
}

@media (max-width: 575px) {
	.cs-header__logo img {
		height: 24px;
		max-height: 24px;
	}
}

:root .cs-hero-type-1 .cs-hero__content .cs-hero__heading span,
body[data-scheme=light] .cs-hero-type-1 .cs-hero__content .cs-hero__heading span {
	background: linear-gradient(180deg, #F0506B 0%, #C41C39 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}