/* ==========================================================================
   Project Overview Strip (neilkelly/project-overview-strip)
   Figma: project-profile / Overview Strip (4622:100)
   Two-column overview section: narrative + team grid (left), key-facts card
   grid + social sharing (right). Token-driven.
   Wrapper: .wp-block-neilkelly-project-overview-strip.nk-project-overview-strip
   ========================================================================== */
.wp-block-neilkelly-project-overview-strip.nk-project-overview-strip {
	/* Full-bleed white band; content capped to content-width and centered, with
	   the gutter as the min side padding — matches the sibling project sections. */
	padding: var(--wp--preset--spacing--10) max( var(--wp--preset--spacing--gutter), calc( ( 100% - var(--wp--custom--layout--content-width) ) / 2 ) );
	background: var(--wp--preset--color--brand-white);
	font-family: var(--wp--preset--font-family--inter);
	box-sizing: border-box;
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__content {
	display: flex;
	align-items: flex-start;
	gap: var(--wp--preset--spacing--16);
}

/* Shared section eyebrow (Project Overview / The Team / Key Facts). */
.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__label {
	margin: 0;
	font-size: var(--wp--preset--font-size--sm-md);
	font-weight: var(--wp--custom--font-weight--semibold);
	line-height: var(--wp--custom--line-height--none);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--brand-red);
}

/* --- Left column: overview narrative + team. --- */
.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__left {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--10);
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__copy {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--4);
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__overview {
	font-size: var(--wp--preset--font-size--md-base);
	font-weight: var(--wp--custom--font-weight--regular);
	line-height: var(--wp--custom--line-height--base);
	color: var(--wp--preset--color--ink-primary);
}
.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__overview > :first-child { margin-top: 0; }
.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__overview > :last-child { margin-bottom: 0; }
.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__overview p {
	margin: 0 0 var(--wp--preset--spacing--4);
}

/* Team grid. */
.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__team {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--4);
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__team-grid {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--4) var(--wp--preset--spacing--6);
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__member-link {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--3);
	text-decoration: none;
	color: inherit;
}
/* Only the anchor variant is interactive; the span fallback stays static. */
a.nk-project-overview-strip__member-link:hover .nk-project-overview-strip__member-name {
	text-decoration: underline;
}
a.nk-project-overview-strip__member-link:focus-visible {
	outline: 2px solid var(--wp--preset--color--ink-primary);
	outline-offset: 2px;
	border-radius: var(--wp--custom--radius--default);
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__avatar,
.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__avatar-img {
	width: var(--wp--preset--spacing--10);
	height: var(--wp--preset--spacing--10);
	border-radius: var(--wp--custom--radius--full);
	object-fit: cover;
	object-position: center top;
	display: block;
}
/* Thin ring around the avatar; border on the wrapper with overflow:hidden so the
   image clips to the circle (matches nk-faq-article-header__avatar). */
.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__avatar {
	flex-shrink: 0;
	border: 1px solid var(--wp--preset--color--border-default);
	overflow: hidden;
}
.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__avatar-img {
	width: 100%;
	height: 100%;
}
/* Neil Kelly box-logo fallback (no active designer): the logo sits on the brand-red-logo
   disc (#d71921, the logo's own red) so there's no white gap inside the circle. Matches
   the project-related fallback avatar. */
.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__avatar--logo .nk-project-overview-strip__avatar-img {
	object-fit: contain;
	background: var(--wp--preset--color--brand-red-logo);
	padding: var(--wp--preset--spacing--0-5);
	box-sizing: border-box;
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__member-info {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--0-5);
	min-width: 0;
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__member-name {
	font-size: var(--wp--preset--font-size--sm-md);
	font-weight: var(--wp--custom--font-weight--semibold);
	line-height: var(--wp--custom--line-height--none);
	color: var(--wp--preset--color--ink-primary);
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__member-role {
	font-size: var(--wp--preset--font-size--xs);
	font-weight: var(--wp--custom--font-weight--regular);
	line-height: var(--wp--custom--line-height--none);
	color: var(--wp--preset--color--ink-secondary);
}

/* --- Right column: key facts + social. --- */
.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__right {
	flex-shrink: 0;
	width: var(--wp--custom--components--project--overview-right-width);
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--8);
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__facts {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--4);
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__facts-grid {
	margin: 0;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--wp--preset--spacing--4);
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__fact {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--1);
	padding: var(--wp--preset--spacing--4);
	background: var(--wp--preset--color--surface-subtle);
	border-radius: var(--wp--custom--radius--lg);
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__fact-label {
	font-size: var(--wp--preset--font-size--ui-label);
	font-weight: var(--wp--custom--font-weight--semibold);
	line-height: var(--wp--custom--line-height--none);
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--wp--preset--color--ink-secondary);
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__fact-value {
	margin: 0;
	font-size: var(--wp--preset--font-size--base);
	font-weight: var(--wp--custom--font-weight--semibold);
	line-height: var(--wp--custom--line-height--sm);
	color: var(--wp--preset--color--ink-primary);
}

/* Social sharing row. */
.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__social {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	padding-top: var(--wp--preset--spacing--4);
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__share {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--wp--preset--spacing--1-5);
	padding-inline: var(--wp--preset--spacing--4);
	background: none;
	border: 0;
	cursor: pointer;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--ui-label);
	font-weight: var(--wp--custom--font-weight--regular);
	line-height: var(--wp--custom--line-height--none);
	color: var(--wp--preset--color--ink-secondary);
	text-decoration: none;
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__share--pin {
	color: var(--wp--preset--color--brand-red);
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__share:focus-visible {
	outline: 2px solid var(--wp--preset--color--ink-primary);
	outline-offset: 2px;
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__share svg {
	display: block;
}

/* Flickr keeps its brand two-dot mark (blue + pink) rather than the monochrome
   currentColor treatment of the other icons. */
.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__flickr-dot--blue {
	fill: var(--wp--custom--components--project--social-flickr-blue);
}
.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__flickr-dot--pink {
	fill: var(--wp--custom--components--project--social-flickr-pink);
}

/* Facebook keeps its brand blue mark; the "Share" label stays ink-secondary
   (fill targets the icon only, not the link's text color). */
.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__share--facebook svg {
	fill: var(--wp--custom--components--project--social-facebook);
}

.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__divider {
	flex-shrink: 0;
	width: 1px;
	height: var(--wp--preset--spacing--8);
	background: var(--wp--preset--color--neutral-300);
}

/* --- Responsive --- */
@media (max-width: 1023px) {
	.wp-block-neilkelly-project-overview-strip.nk-project-overview-strip {
		padding: var(--wp--preset--spacing--16) var(--wp--preset--spacing--12);
	}
	.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__content {
		flex-direction: column;
		gap: var(--wp--preset--spacing--12);
	}
	.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__right {
		width: 100%;
	}
}

@media (max-width: 767px) {
	.wp-block-neilkelly-project-overview-strip.nk-project-overview-strip {
		padding: var(--wp--preset--spacing--12) var(--wp--preset--spacing--6);
	}
	.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__facts-grid {
		grid-template-columns: 1fr;
	}
	.wp-block-neilkelly-project-overview-strip .nk-project-overview-strip__social {
		justify-content: space-between;
	}
}

/* No block-gap seam between full-bleed sections. */
.wp-block-neilkelly-project-overview-strip { margin-block: 0; }
