/* Ventpro shared card components */


.vp-icon-wrap {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 3rem !important;
	height: 3rem !important;
	max-width: 3rem;
	border-radius: 0.5rem;
	background: color-mix(in srgb, var(--wp--preset--color--accent) 10%, transparent);
	color: var(--wp--preset--color--accent);
	flex-shrink: 0;
	transition: background 0.2s ease, color 0.2s ease;
	align-self: flex-start;
}

.vp-icon-wrap img {
	width: 1.35rem;
	height: 1.35rem;
	border-radius: 0 !important;
	filter: none;
	transition: filter 0.2s ease;
	display: block;
}

.vp-card:hover .vp-icon-wrap,
.vp-process-step:hover .vp-icon-wrap,
.vp-solution-card:hover .vp-icon-wrap,
.vp-listing-card:hover .vp-icon-wrap {
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--white);
}

:is(
	.vp-card:hover .vp-icon-wrap img,
	.vp-process-step:hover .vp-icon-wrap img,
	.vp-solution-card:hover .vp-icon-wrap img,
	.vp-listing-card:hover .vp-icon-wrap img
) {
	filter: brightness(0) invert(1);
}

.vp-label {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-family: var(--wp--preset--font-family--inter);
	font-size: 0.75rem !important;
	font-weight: 600;
	letter-spacing: 0.18em;
	line-height: 1.5;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent) !important;
	margin: 0;
}

.vp-label::before {
	content: "";
	display: inline-block;
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 999px;
	background: var(--wp--preset--color--accent);
	flex-shrink: 0;
}

.vp-muted {
	color: var(--wp--preset--color--muted);
	line-height: 1.625;
	margin: 0;
}

/* Small muted copy shared across cards and feature blocks. */
.vp-process-step > p,
.vp-process-step .vp-muted,
.vp-solution-card__body .vp-muted,
.vp-product-mini p,
.vp-project-card p,
.vp-knowledge-card p,
.vp-project-card .vp-card-body p,
.vp-knowledge-card .vp-card-body p,
.vp-why-list .vp-why-reason p,
.vp-feature-text p,
.vp-expertise-card .vp-muted,
.vp-social-card .vp-muted {
	margin: 0;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.625;
}

/* Compact 2.5rem icon wraps. */
.vp-solution-card .vp-icon-wrap,
.vp-product-title-row .vp-icon-wrap,
.vp-product-mini .vp-icon-wrap,
.vp-contact-item .vp-icon-wrap {
	width: 2.5rem !important;
	height: 2.5rem !important;
	max-width: 2.5rem;
}

/* Compact 1.25rem inline icons. */
.vp-product-title-row .vp-icon-wrap img,
.vp-contact-item .vp-icon-wrap img,
.vp-office-card .vp-icon img,
.vp-contact-map-header .vp-icon img,
.vp-product-card__title .wp-block-image img,
.vp-product-card__title img {
	width: 1.25rem !important;
	height: 1.25rem !important;
	border-radius: 0 !important;
}

/* Shared 1.5rem card padding. */
.vp-solution-card__body,
.vp-listing-card__body,
.vp-product-mini,
.vp-product-card,
.vp-office-card,
.vp-knowledge-related-card,
.vp-knowledge-callout {
	padding: 1.5rem;
}

/* Stretch columns in card grids. */
.vp-solutions-grid .wp-block-column,
.vp-listing-grid .wp-block-column,
.vp-family-grid .wp-block-column,
.vp-knowledge-grid .wp-block-column,
.vp-projects-grid .wp-block-column,
.vp-about-lifecycle .wp-block-column,
.vp-social-grid .wp-block-column {
	display: flex;
	flex-direction: column;
}

/* Cover media base — aspect-ratio / radius stay per component. */
.vp-solution-card__media .wp-block-image img,
.vp-product-feature .wp-block-image img,
.vp-project-card .wp-block-image img,
.vp-listing-card__media .wp-block-image img,
.vp-knowledge-grid .vp-knowledge-card .wp-block-image img,
.vp-knowledge-grid .vp-knowledge-card .wp-block-post-featured-image img,
.vp-knowledge-featured .wp-block-image img,
.vp-project-featured .wp-block-image img,
.vp-about-media .wp-block-image img,
.vp-product-spotlight__media .wp-block-image img,
.vp-why-media img {
	object-fit: cover;
	width: 100%;
	display: block;
	transition: transform 0.35s ease;
}

/* Playfair display headings on cards/features. */
.vp-product-feature h3,
.vp-product-title-row h3,
.vp-project-card h3,
.vp-knowledge-card h3,
.vp-project-featured h3,
.vp-knowledge-featured h3,
.vp-region-card h3 {
	font-family: var(--wp--preset--font-family--playfair) !important;
	font-weight: 500;
	letter-spacing: -0.02em;
}

.vp-link-arrow {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	color: var(--wp--preset--color--accent-dark);
}

.vp-link-arrow.is-dark,
.vp-link-arrow.is-dark a {
	color: var(--wp--preset--color--contrast);
}

.vp-link-arrow.is-dark:hover,
.vp-link-arrow.is-dark a:hover {
	color: var(--wp--preset--color--accent-dark);
}

.vp-link-arrow img {
	width: 1rem;
	height: 1rem;
	border-radius: 0 !important;
}
/* -------------------------------------------------------------------------
   Cards
-------------------------------------------------------------------------- */

/*
 * Nested card/list shells often keep layout:"constrained" in saved content.
 * Core then applies contentSize + margin:auto, which centers shrink-wrapped
 * flex children (icons, short headings). Neutralize that without editor edits.
 */
.vp-product-mini.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-product-feature.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-product-body.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-contact-list.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-contact-item .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-office-card .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-card.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-solution-card.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-solution-card__body.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-solution-card__media.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-listing-card.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-listing-card__body.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-listing-card__media.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-process-step.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-project-card.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-knowledge-card.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-card-body.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-knowledge-related-card.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-knowledge-video-card.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-expertise-card.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-why-reason.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.vp-check-line.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: none;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/* Empty spacer columns used to pad incomplete grids. */
.vp-solutions-grid .wp-block-column:empty,
.vp-product-minis .wp-block-column:empty,
.vp-listing-grid .wp-block-column:empty,
.vp-family-grid .wp-block-column:empty,
.vp-knowledge-grid .wp-block-column:empty,
.vp-projects-grid .wp-block-column:empty {
	visibility: hidden;
	pointer-events: none;
}

/* Shared interactive card surface. */
:is(
	.vp-card,
	.vp-solution-card,
	.vp-product-mini,
	.vp-product-feature,
	.vp-process-step,
	.vp-project-card,
	.vp-knowledge-card,
	.vp-listing-card
) {
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 0.75rem;
	background: var(--wp--preset--color--base);
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04);
}

:is(
	.vp-card,
	.vp-solution-card,
	.vp-product-mini,
	.vp-product-feature,
	.vp-process-step,
	.vp-project-card,
	.vp-knowledge-card,
	.vp-listing-card
):hover {
	box-shadow: 0 12px 32px rgba(15, 23, 42, 0.12);
}

:is(.vp-card, .vp-solution-card, .vp-product-mini, .vp-process-step):hover {
	border-color: color-mix(in srgb, var(--wp--preset--color--accent) 40%, var(--wp--preset--color--border));
}

:is(.vp-card, .vp-solution-card, .vp-product-feature, .vp-project-card, .vp-knowledge-card):hover {
	transform: translateY(-2px);
}

/* Shared media zoom on card hover. */
:is(
	.vp-solution-card:hover .vp-solution-card__media .wp-block-image img,
	.vp-product-feature:hover .wp-block-image img,
	.vp-project-card:hover .wp-block-image img,
	.vp-knowledge-card:hover .wp-block-image img,
	.vp-project-featured:hover .wp-block-image img,
	.vp-knowledge-featured:hover .wp-block-image img,
	.vp-listing-card:hover .vp-listing-card__media .wp-block-image img,
	.vp-knowledge-grid .vp-knowledge-card:hover .wp-block-image img,
	.vp-knowledge-grid .vp-knowledge-card:hover .wp-block-post-featured-image img
) {
	transform: scale(1.05);
}

.vp-card {
	padding: 2rem;
	height: 100%;
	transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}

.vp-card h3 {
	margin: 1.5rem 0 0;
	font-size: 1.125rem !important;
	font-weight: 600;
	line-height: 1.55;
	letter-spacing: normal;
}

.vp-card h3 + p,
.vp-card p {
	color: var(--wp--preset--color--muted);
	margin: 0.75rem 0 0;
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.625;
}

.vp-solution-card {
	overflow: hidden;
	height: 100%;
	transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}

.vp-solution-card__media {
	position: relative;
	overflow: hidden;
}

.vp-solution-card__media .wp-block-image {
	margin: 0;
}

.vp-solution-card__media .wp-block-image img {
	aspect-ratio: 16 / 10;
	border-radius: 0 !important;
}

.vp-solution-badge {
	position: absolute;
	top: 1rem;
	left: 1rem;
	margin: 0 !important;
	padding: 0.3rem 0.65rem;
	border-radius: 999px;
	background: color-mix(in srgb, var(--wp--preset--color--base) 90%, transparent);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	font-family: var(--wp--preset--font-family--inter);
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--wp--preset--color--contrast);
	line-height: 1.2;
}

.vp-solution-card .vp-icon-wrap {
	border-radius: 0.5rem;
}

.vp-solution-card__title-row h3 {
	margin: 0;
	font-family: var(--wp--preset--font-family--inter) !important;
	font-size: 1.125rem !important;
	font-weight: 600;
	line-height: 1.25;
	letter-spacing: normal;
}

.vp-solution-tagline {
	margin: 0.75rem 0 0 !important;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	color: var(--wp--preset--color--accent);
	line-height: 1.4;
}

/* -------------------------------------------------------------------------
   Process
-------------------------------------------------------------------------- */

.vp-process-step {
	position: relative;
	padding: 1.75rem;
	height: 100%;
	transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.vp-process-step__top {
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 0;
	width: 100%;
}

.vp-process-step__top .vp-icon-wrap {
	margin: 0;
}

.vp-process-step .vp-step-num {
	font-family: var(--wp--preset--font-family--playfair);
	font-size: 1.875rem;
	font-weight: 500;
	letter-spacing: -0.02em;
	color: var(--wp--preset--color--accent-dark);
	margin: 0;
	line-height: 1;
	flex-shrink: 0;
}

.vp-process-step h3 {
	margin: 1.5rem 0 0.5rem;
	font-size: 1.125rem !important;
	font-weight: 600;
	line-height: 1.55;
	letter-spacing: normal;
}

/* -------------------------------------------------------------------------
   Products
-------------------------------------------------------------------------- */

.vp-product-feature {
	overflow: hidden;
	height: 100%;
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.vp-product-feature .wp-block-image {
	overflow: hidden;
	margin: 0;
}

.vp-product-feature .wp-block-image img {
	border-radius: 0;
	aspect-ratio: 16 / 9;
}

.vp-product-feature .vp-product-body {
	padding: 1.5rem 1.5rem 1.75rem;
}

.vp-product-title-row {
	display: flex !important;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 0;
}

.vp-product-title-row .vp-icon-wrap {
	margin: 0;
	flex-shrink: 0;
}

.vp-product-feature h3,
.vp-product-title-row h3 {
	font-weight: 500 !important;
	font-size: clamp(1.25rem, 2vw, 1.5rem) !important;
	line-height: 1.25 !important;
	margin: 0;
}

.vp-product-feature .vp-product-kicker {
	margin: 1rem 0 0.5rem;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	color: var(--wp--preset--color--contrast);
}

.vp-product-feature .vp-product-body > p,
.vp-product-feature .has-muted-color {
	margin: 0;
	font-size: var(--wp--preset--font-size--small) !important;
	line-height: 1.625;
}

.vp-product-mini {
	display: flex;
	flex-direction: column;
	gap: 0;
	align-items: flex-start;
	height: 100%;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.vp-product-mini .vp-icon-wrap {
	margin-bottom: 1rem;
}

.vp-product-mini h3 {
	margin: 0 0 0.25rem;
	font-size: 1rem !important;
	font-weight: 600;
	line-height: 1.5;
	letter-spacing: normal;
}

.vp-product-mini .vp-product-kicker {
	margin: 0 0 0.75rem;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	color: var(--wp--preset--color--accent);
}

.vp-check-line {
	display: flex !important;
	align-items: flex-start;
	gap: 0.625rem;
	width: 100%;
}

.vp-check-line .wp-block-image,
.vp-check-line .vp-icon {
	flex-shrink: 0;
	margin: 0.125rem 0 0 !important;
	width: 1rem !important;
	height: 1rem !important;
	line-height: 0;
}

.vp-check-line .wp-block-image img,
.vp-check-line .vp-icon img {
	width: 1rem !important;
	height: 1rem !important;
	border-radius: 0 !important;
	display: block;
}

.vp-check-line p {
	margin: 0 !important;
	flex: 1;
}

/* -------------------------------------------------------------------------
   Projects / Knowledge cards
-------------------------------------------------------------------------- */

/* Media + cover cards */
:is(.vp-project-card, .vp-knowledge-card, .vp-product-feature) {
	overflow: hidden;
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}

:is(.vp-project-card, .vp-knowledge-card) .wp-block-image {
	margin: 0;
	position: relative;
	overflow: hidden;
}

.vp-project-card .wp-block-image img {
	border-radius: 0;
	aspect-ratio: 16 / 10;
}

:is(.vp-project-card, .vp-knowledge-card) .vp-card-body {
	padding: 1.25rem 1.35rem 1.5rem;
}

:is(.vp-project-card, .vp-knowledge-card) h3 {
	margin: 0 0 0.5rem;
	font-size: 1.125rem;
}

/* Only stretch when a card is alone in a column. */
.wp-block-column > .vp-project-card:only-child,
.wp-block-column > .vp-knowledge-card:only-child,
.wp-block-column > .vp-knowledge-featured {
	height: 100%;
}

.vp-knowledge-card:not(.vp-knowledge-featured) {
	height: auto;
}

.vp-knowledge > .wp-block-columns {
	align-items: stretch;
}

.vp-knowledge .wp-block-column:last-child {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--40);
}

.vp-knowledge .wp-block-column:last-child > .vp-knowledge-card {
	margin-bottom: 0 !important;
	flex: 0 0 auto;
}

.vp-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin-top: 0.85rem;
	padding: 0;
	list-style: none;
}

.vp-tags li,
.vp-tag {
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	padding: 0.25rem 0.55rem;
	border-radius: 999px;
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--muted);
	margin: 0;
}

.vp-tag.is-accent {
	background: color-mix(in srgb, var(--wp--preset--color--accent) 15%, transparent);
	color: var(--wp--preset--color--accent-dark);
}

.vp-project-featured {
	display: grid;
	gap: 0;
	border-radius: 0.75rem;
	overflow: hidden;
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04);
}

.vp-project-featured .wp-block-columns {
	gap: 0 !important;
}

.vp-project-featured .wp-block-image {
	overflow: hidden;
	margin: 0;
}

.vp-project-featured .wp-block-image img {
	border-radius: 0.75rem 0 0 0.75rem;
	aspect-ratio: 4 / 3;
	height: 100%;
}

.vp-project-featured .vp-card-body {
	padding: 1.75rem 2.5rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100%;
	border: 1px solid var(--wp--preset--color--border);
	border-left: 0;
	border-radius: 0 0.75rem 0.75rem 0;
	background: var(--wp--preset--color--base);
}

.vp-project-featured .vp-card-body > p:not(.vp-meta):not(.vp-link-arrow) {
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.625;
}

.vp-project-featured .vp-meta {
	color: var(--wp--preset--color--accent);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	font-weight: 500;
	margin-bottom: 0.75rem;
}

.vp-knowledge-featured .wp-block-image {
	overflow: hidden;
}

.vp-knowledge-featured .wp-block-image img {
	aspect-ratio: 16 / 9;
	border-radius: 0;
}

.vp-knowledge-featured .vp-card-body > p:not(.vp-meta):not(.vp-tag) {
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.625;
	opacity: 0.7;
}

.vp-meta {
	font-size: var(--wp--preset--font-size--xs);
	color: var(--wp--preset--color--muted);
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}
/* -------------------------------------------------------------------------
   Solutions listing cards
-------------------------------------------------------------------------- */

.vp-listing-card {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	height: 100%;
	transition: box-shadow 0.25s ease, border-color 0.25s ease;
}

.vp-listing-card:hover {
	border-color: color-mix(in srgb, var(--wp--preset--color--accent) 30%, var(--wp--preset--color--border));
}

.vp-listing-card__media {
	overflow: hidden;
	margin: 0;
}

.vp-listing-card__media .wp-block-image {
	margin: 0;
}

.vp-listing-card__media .wp-block-image img {
	aspect-ratio: 16 / 9;
	border-radius: 0 !important;
	transition: transform 0.5s ease;
}

.vp-listing-card__body {
	display: flex;
	flex-direction: column;
	flex: 1;
	gap: 0;
}

.vp-listing-card__body .vp-icon-wrap {
	margin-bottom: 1rem;
}

.vp-listing-card__body h3 {
	margin: 0 0 0.75rem;
	font-size: 1.5rem;
	font-weight: 600;
	line-height: 1.25;
	transition: color 0.2s ease;
}

.vp-listing-card:hover h3 {
	color: var(--wp--preset--color--accent);
}

.vp-listing-card__body > p,
.vp-listing-card__desc {
	margin: 0 0 1.25rem;
}

.vp-bullet-list {
	list-style: none !important;
	padding: 0 !important;
	margin: 0 0 1.5rem !important;
}

.vp-bullet-list li {
	position: relative;
	padding-left: 1.15rem;
	margin: 0 0 0.5rem;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--muted);
	line-height: 1.5;
}

.vp-bullet-list li:last-child {
	margin-bottom: 0;
}

.vp-bullet-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.55em;
	width: 0.375rem;
	height: 0.375rem;
	border-radius: 999px;
	background: var(--wp--preset--color--accent);
}

.vp-listing-card .wp-block-buttons,
.vp-knowledge-grid .vp-knowledge-card .vp-card-body > .vp-link-arrow,
.vp-knowledge-grid .vp-knowledge-card .wp-block-read-more,
.vp-projects-grid .vp-project-card .vp-card-body > .vp-link-arrow {
	margin-top: auto;
}

.vp-listing-card .wp-block-button.is-style-outline .wp-block-button__link {
	border: 1px solid var(--wp--preset--color--border);
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	padding: 0.5rem 1rem;
	font-size: var(--wp--preset--font-size--small);
}

.vp-listing-card .wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: var(--wp--preset--color--accent);
	border-color: var(--wp--preset--color--accent);
	color: #fff;
}