/* Rules the WordPress build needs on top of the ported stylesheet. */

/* The admin bar pushes the page down; the sticky bar sits under it. */
.admin-bar #navbar.navbar--sticky {
	top: var(--wp-admin--admin-bar--height, 32px);
}

/* Core blocks inside a case study: the figure a table or image comes wrapped
   in takes the article's rhythm, the element inside it the article's type. */
.case-page__section > figure {
	margin-bottom: 0;
}

.case-page__section > figure > table {
	margin: 0;
	width: 100%;
}

.case-page__section .case-page__figure img {
	width: 100%;
	height: auto;
}

/* A case study tab panel that is not open. */
.case-panel[hidden] {
	display: none;
}

/* ------------------------------------------------- footer (WP glue only) */
/* The footer's layout lives in site.css (`.site-footer*`, `.clutch-badge*`);
   these rules only cover what WordPress adds: a Site Identity logo of any
   size sits in the 118×32 slot, the ported reset does not reach the footer's
   lists, and the columns are <nav> elements rather than plain divs. */
.site-footer__logo .custom-logo {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: left center;
}

.site-footer__social-list,
.site-footer__legal {
	margin: 0;
	padding-inline-start: 0;
	list-style: none;
}

.site-footer__social-list li,
.site-footer__legal li {
	margin: 0;
}

.site-footer nav.site-footer__column {
	margin: 0;
}

.site-footer__column a:focus-visible,
.site-footer__social-list a:focus-visible,
.site-footer__legal a:focus-visible,
.clutch-badge:focus-visible,
.site-footer__logo:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

/* Logo grid: as many equal cells as there are logos, up to six, then a new
   row. The hairlines are 1px gaps over the line colour — the same trick as
   `.measure__grid` — so no edge doubles up however the cells wrap. */
.partner-bar.b2bgaps-logo-grid {
	grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr));
	grid-auto-flow: row;
	gap: 1px;
	padding: 1px 0;
	border: 0;
	background: var(--page-line);
}

.partner-bar.b2bgaps-logo-grid > .partner-bar__cell {
	min-height: 130px;
	border: 0;
	background: var(--page-bg);
}

.partner-bar.b2bgaps-logo-grid .partner-bar__logo {
	object-fit: contain;
}

/* Two across on tablets and phones, coloured rather than waiting for a hover
   that touch cannot give. */
@media (max-width: 1024px) {
	.partner-bar.b2bgaps-logo-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.partner-bar.b2bgaps-logo-grid > .partner-bar__cell {
		min-height: 5.5rem;
	}

	.partner-bar.b2bgaps-logo-grid .partner-bar__logo {
		filter: none;
		opacity: 1;
	}
}

@media (max-width: 359px) {
	.partner-bar.b2bgaps-logo-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* An uploaded image in a Process stage's graphic box fills the same dark
   rounded box the animated scene sits in; the box's edge fade stays on top. */
.how-it-works-scroll__graphic > .how-it-works-scroll__graphic-image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: inherit;
}

/* A System card's figure set to "photo": fills the box instead of sitting
   padded on the gradient like the illustrations. */
.principle-grid__image--cover {
	object-fit: cover;
	padding: 0;
}

/* package D */
/* Featured case studies: every case's copy ships in the plate and the script
   shows one at a time. */
.case-panel .pricing-panel__content[hidden] {
	display: none;
}

/* The hero hands its client bar and reel to the two blocks that follow it, so
   the three read as one screen: the hero closes without bottom padding, the
   followers sit on the hero's ground with no padding of their own, and the
   reel takes the 4rem the hero used to end on. */
.b2bgaps-hero .hero__layout--central {
	padding-bottom: 0;
}

.b2bgaps-hero-follow {
	overflow: visible;
}

.b2bgaps-hero-follow .hero__container {
	padding-block: 0;
}

/* 4rem flex gap + the showcase's 3rem margin on the reference = 112px. */
.b2bgaps-logo-grid-section .hero__container {
	padding-top: 7rem;
}

/* The reference hero closed on 3.75rem after the reel. */
.b2bgaps-ticker .hero__container {
	padding-bottom: 3.75rem;
}

@media (max-width: 1024px) {
	.b2bgaps-logo-grid-section .hero__container {
		padding-top: 4rem;
	}
}

/* The tiles inside the hero's aside; the wrapper is only there for the editor. */
.hero__tiles {
	display: contents;
}

/* Stakes stage art: "Photo — fills the box" covers the plate edge to edge;
   the default keeps illustrations whole inside it. */
.point-stage__art--cover {
	object-fit: cover;
	width: 100%;
	height: 100%;
	max-width: none;
	max-height: none;
}

/* A point's own image sits in the icon's 16px slot. */
.how-it-works-scroll__feature-image {
	flex: none;
	width: 1rem;
	height: 1rem;
	object-fit: contain;
}