/* 
Theme Name: Porto Child 
Theme URL: http://portablestage.co.uk
Description: Porto Child Theme
Theme Author: Artem
Author URL: http://portablestage.co.uk
Template: porto 
Version: 1.0.0 
Text Domain: protochild 
*/

.nexgen-hide{
	display: none !important;
}

.nexgen-remove-top-spacing{
	margin-top: 0 !important;
	padding-top: 0 !important;
}

.irs.irs--flat .irs-bar, 
.irs.irs--flat .irs-from, 
.irs.irs--flat .irs-to, 
.irs.irs--flat .irs-single,
.irs.irs--flat .irs-handle>i:first-child,
.irs.irs--flat .irs-handle.state_hover>i:first-child, 
.irs.irs--flat .irs-handle:hover>i:first-child{
	background-color: #2aa045;
}

.irs.irs--flat .irs-from, 
.irs.irs--flat .irs-to, 
.irs.irs--flat .irs-single{
	font-size: 12px;
}

.irs.irs--flat .irs-from:before, 
.irs.irs--flat .irs-to:before, 
.irs.irs--flat .irs-single:before{
	border-top-color: #2aa045;
}

/*body.single-product .product.nexgen-raffle-product form.cart > .quantity:has(input:not([style*="inline-block"])){
	display: none !important;
}*/

body.single-product .product.nexgen-raffle-product form.cart:has(.rtg-questions) > .quantity:has(+ button.single_add_to_cart_button:not([style*=" block"])){
	display: none !important;
}

body.single-product .elementor-widget-porto_cp_title + .elementor-widget-porto_cp_price{
	margin-bottom: 0;
}

body.single-product .product .rtg-countdown:not(:has(#time-remaining > div)){
	display: none !important;
}

body.single-product .product .quantity.raffle-quantity{
	display: flex !important;
    width: 100%;
    gap: 10px;
}

	body.single-product .product .quantity.raffle-quantity > .irs{
		width: 100%;
	}

body.single-product .product.nexgen-raffle-product form.cart > p:has(+ .progress-wrap){
	margin-bottom: 5px;
	flex: 1 1 100%;
}

body.single-product .product.nexgen-raffle-product form.cart > p + .progress-wrap{
	margin-top: 0;
}

body.single-product .product.nexgen-raffle-product form.cart > .rtg-countdown{
	width: 100%;
}

body.single-product .product.nexgen-raffle-product .single-product-price p.price .amount::after{
	content: "per entry";
    font-weight: 400;
    font-size: 0.5em;
    display: inline-block;
    margin-left: 0.3em;
}

body.single-product .nexgen-product-tabs{
	margin: 0.8em auto;
}

	body.single-product .nexgen-product-tabs .btn-online-entry{
		cursor: default;
	    background: #9b9b9b;
		color: #fff;
		outline: none !important;
		box-shadow: none !important;
	}

.nexgen-loading.porto-ajax-loading{
	display: inline-block;
    margin-left: 10px;
    vertical-align: inherit;
    line-height: 1;
}

	.nexgen-loading.porto-ajax-loading i.porto-loading-icon{
		width: 20px;
		height: 20px;
	}

body.single-product .rtg-countdown:has(#time-remaining){
	margin-top: 0;
    padding-top: 0;
}

body.single-product .rtg-countdown #time-remaining, 
body.single-product .time-remaining{
	padding-top: 8px;
	padding-bottom: 6px;
}

body.single-product .rtg-countdown:has(.rtg-competition-ends){
	margin-top: -15px !important;
	padding-top: 0 !important;
}

body.single-product .rtg-half:has(.rtg-questions),
body.archive.tax-product_cat form.cart .rtg-half:has(.rtg-questions){
	display: block;
    width: 100%;
    padding: 0;
}

	body.single-product .rtg-questions,
	body.archive.tax-product_cat form.cart .rtg-questions{
		padding: 0;
		margin: 0;
		border: none;
		width: 100%;
	}

	body.single-product .rtg-questions > h3:first-child{
		margin-bottom: 0;
	}

	body.single-product .rtg-questions > h3:first-child::after{
		content: "Please answer this question to get started";
	    display: block;
	    margin: 0.7em 0 0.2em;
	    padding: 0;
	    font-size: 0.7em;
	    font-weight: 400;
	    font-style: normal;
	}

		body.single-product .rtg-questions h5,
		body.archive.tax-product_cat form.cart .rtg-questions h5{
			display: none;
		}

		body.single-product .rtg-questions label,
		body.archive.tax-product_cat form.cart .rtg-questions label{
			border-radius: 10px;
		    position: relative;
		    padding-left: 35px;
		}

		body.archive.tax-product_cat form.cart .rtg-questions label{
			display: block !important;
		    max-width: fit-content;
		    min-width: 70%;
		    margin-left: auto !important;
		    text-align: left;
		}

		body.single-product .rtg-questions label::before,
		body.archive.tax-product_cat form.cart .rtg-questions label::before{
			content: "";
		    width: 18px;
		    height: 18px;
		    position: absolute;
		    left: 8px;
		    top: 50%;
		    transform: translateY(-50%);
		    border-radius: 50%;
		    border: 1px solid #999;
		}
		
		body.single-product .rtg-questions input[type=radio]:checked+label,
		body.archive.tax-product_cat form.cart .rtg-questions input[type=radio]:checked+label{
			font-weight: 700;
			background-color: #fff !important;
		}
		
		body.single-product .rtg-questions input[type=radio]:checked+label::after,
		body.archive.tax-product_cat form.cart .rtg-questions input[type=radio]:checked+label::after{
			content: "";
		    width: 8px;
		    height: 8px;
		    position: absolute;
		    left: 13px;
		    top: 50%;
		    transform: translateY(-50%);
		    border-radius: 50%;
		    background: #2aa045;
		}

/* ==========================================================================
   NexGen Vercel Bridge — Porto Child isolation layer (v2.1)

   This file used to force every pixel of the Vercel design with thousands of
   `!important` overrides, because Tailwind v4 ships its utilities inside CSS
   cascade layers and *unlayered* theme CSS always beats layered CSS.

   That hack is no longer needed:

     • the plugin now loads `/wordpress.css` — the same design system with the
       layers unwrapped and every selector scoped to `[data-nx]`
       (generated by wordpress-headless/scripts/build-wp-css.mjs),
     • the plugin prints a stacking/visibility guard in `wp_head`,
     • `nx-runtime.js` portals the overlays to `<body>` and repairs duplicate
       chrome.

   What is left here is only what a *theme* has to do: hide the Porto chrome we
   replace, neutralise the theme's page-title wrappers on the Vercel homepage,
   and remove page-builder padding so the design can run edge to edge.

   The previous, override-heavy file is kept as
   `porto-child/legacy-design-overrides.css` for reference — do not enqueue it.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Hide the Porto / Elementor / HFE chrome that the bridge replaces
   -------------------------------------------------------------------------- */
#header,
.header-wrapper,
#header-boxed,
body.vercel-bridge-has-header #porto-header,
body.vercel-bridge-has-header .porto-header,
body.vercel-bridge-has-header .porto-header-builder,
body.vercel-bridge-has-header .header-main,
body.vercel-bridge-has-header #top-bar,
body.vercel-bridge-has-header .porto-top-bar,
body.vercel-bridge-has-header .header-top,
body.vercel-bridge-has-header .sticky-header,
body.vercel-bridge-has-header [data-elementor-type="header"],
body.vercel-bridge-has-header .elementor-location-header,
body.vercel-bridge-has-header #masthead:not(#site-header),
body.vercel-bridge-has-header .hfe-header,
body.vercel-bridge-has-header #hfe-header {
	display: none !important;
}

#footer,
.footer-wrapper,
#footer-wrapper,
body.vercel-bridge-has-footer .porto-footer,
body.vercel-bridge-has-footer .porto-footer-builder,
body.vercel-bridge-has-footer .footer-top,
body.vercel-bridge-has-footer .footer-main,
body.vercel-bridge-has-footer .footer-bottom,
body.vercel-bridge-has-footer [data-elementor-type="footer"],
body.vercel-bridge-has-footer .elementor-location-footer,
body.vercel-bridge-has-footer #colophon:not(#contact),
body.vercel-bridge-has-footer .hfe-footer,
body.vercel-bridge-has-footer #hfe-footer,
body.vercel-bridge-has-footer .hfe-before-footer-wrap {
	display: none !important;
}

/* --------------------------------------------------------------------------
   2. Drop Porto's page title / breadcrumb band on the Vercel homepage
   -------------------------------------------------------------------------- */
.vercel-bridge-home .page-title,
.vercel-bridge-home .page-top,
.vercel-bridge-home .page-title-wrap,
.vercel-bridge-home .breadcrumbs,
.vercel-bridge-home .breadcrumbs-wrap,
.vercel-bridge-home .entry-header,
.vercel-bridge-home .post-title,
.vercel-bridge-home .page-sub-title,
.vercel-bridge-home .porto-page-title,
body.home.vercel-bridge-active .page-top,
body.home.vercel-bridge-active .page-title-wrap,
body:has(#vercel-homepage-container) .page-top,
body:has(#vercel-homepage-container) .page-title-wrap,
body:has(#vercel-homepage-container) .breadcrumbs-wrap,
body:has(#vercel-homepage-container) .entry-header {
	display: none !important;
}

/* --------------------------------------------------------------------------
   3. Full-bleed layout for the Vercel homepage inside Porto/Elementor/WPBakery
   -------------------------------------------------------------------------- */
.vercel-bridge-home #main,
.vercel-bridge-home .main-content,
.vercel-bridge-home .main-content-wrap,
.vercel-bridge-home .page-wrapper,
.vercel-bridge-home .container,
.vercel-bridge-home #main > .container,
.vercel-bridge-home #main > .container-fluid,
.vercel-bridge-home #main > .container > .row,
.vercel-bridge-home #content,
.vercel-bridge-home .site-content,
.vercel-bridge-home .porto-sections-container,
.vercel-bridge-home article.page,
.vercel-bridge-home .page-content,
.vercel-bridge-home .entry-content,
body:has(#vercel-homepage-container) #main,
body:has(#vercel-homepage-container) .main-content,
body:has(#vercel-homepage-container) .main-content-wrap,
body:has(#vercel-homepage-container) #main > .container,
body:has(#vercel-homepage-container) #main > .container > .row,
body:has(#vercel-homepage-container) .entry-content,
body:has(#vercel-homepage-container) .elementor-section:has(#vercel-homepage-container),
body:has(#vercel-homepage-container) .elementor-container:has(#vercel-homepage-container),
body:has(#vercel-homepage-container) .e-con:has(#vercel-homepage-container),
body:has(#vercel-homepage-container) .e-con-inner:has(#vercel-homepage-container),
body:has(#vercel-homepage-container) .vc_row:has(#vercel-homepage-container),
#vercel-homepage-container,
#vercel-homepage-container #vercel-main,
#vercel-homepage-container .vercel-bridge-main {
	width: 100% !important;
	max-width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
	border: 0 !important;
}

/* --------------------------------------------------------------------------
   4. Clip guards — no theme wrapper may trap the sticky navbar or turn
      `position: fixed` overlays into container-relative boxes
   -------------------------------------------------------------------------- */
body.vercel-bridge-active #wrapper,
body.vercel-bridge-active #top,
body.vercel-bridge-active #main,
body.vercel-bridge-active #content,
body.vercel-bridge-active .page-wrapper,
body.vercel-bridge-active .site-content,
body.vercel-bridge-active .porto-sections-container {
	overflow: visible !important;
	transform: none !important;
	filter: none !important;
	perspective: none !important;
}

html,
body {
	overflow-x: clip !important;
}

body.nx-modal-open {
	overflow: hidden !important;
}

/* --------------------------------------------------------------------------
   5. Design-root normalisation
      `wordpress.css` already resets the design subtree; this only removes the
      Porto-specific leakage that is selector-independent (theme font colours
      inherited from .entry-content, image borders, list markers).
   -------------------------------------------------------------------------- */
:is(
	aside[aria-label="Funding announcement"],
	#site-header,
	#vercel-homepage-container,
	#vercel-main,
	.vercel-app-scope,
	footer#contact,
	#cart-overlay,
	#funding-overlay,
	#quote-overlay,
	#mobile-menu-overlay,
	#back-to-top
),
:is(
	aside[aria-label="Funding announcement"],
	#site-header,
	#vercel-homepage-container,
	#vercel-main,
	.vercel-app-scope,
	footer#contact,
	#cart-overlay,
	#funding-overlay,
	#quote-overlay,
	#mobile-menu-overlay,
	#back-to-top
) * {
	box-sizing: border-box;
}

:is(
	aside[aria-label="Funding announcement"],
	#site-header,
	#vercel-homepage-container,
	#vercel-main,
	.vercel-app-scope,
	footer#contact,
	#cart-overlay,
	#funding-overlay,
	#quote-overlay,
	#mobile-menu-overlay,
	#back-to-top
) img {
	border: 0 !important;
	box-shadow: none;
	background: transparent;
}

/* --------------------------------------------------------------------------
   6. Stacking contract (mirrors vercel-bridge-integration.php)

      announcement 2147482800
        < navbar      2147482900
        < dropdowns   2147482950
        < overlays    2147483000   (basket drawer, Get Code, quote, mobile menu)
        < toast       2147483002

      The navbar used to sit at 900, which was below the design's own
      `isolate`/`z-index` sections on the homepage (the open Shop/Links panel
      was painted over) and only barely above Porto's wrapper. Keeping every
      layer in the same high range makes the result independent of whatever the
      theme, Elementor or a page builder chooses.
   -------------------------------------------------------------------------- */
#site-header {
	position: sticky !important;
	top: 0 !important;
	z-index: 2147482900 !important;
	overflow: visible !important;
	transform: none !important;
	filter: none !important;
	perspective: none !important;
	isolation: auto !important;
}

body.admin-bar #site-header { top: 32px !important; }

@media screen and (max-width: 782px) {
	body.admin-bar #site-header { top: 46px !important; }
}

/* Dropdown panels: only re-assert the layer. Never `left`/`transform` — the
   design already centres them with `left-1/2` + `-translate-x-1/2`, and a
   second translate pushes them off-screen. */
#site-header #shop-mega,
#site-header #links-mega,
#site-header #account-menu {
	z-index: 2147482950 !important;
}

#site-header #primary-nav,
#site-header #primary-nav > div,
#site-header .on-light,
#site-header [data-search-root] {
	overflow: visible !important;
}

.nx-overlay,
#cart-overlay,
#funding-overlay,
#quote-overlay,
#mobile-menu-overlay {
	position: fixed !important;
	inset: 0 !important;
	z-index: 2147483000 !important;
}

#back-to-top { z-index: 2147482999 !important; }

/* --------------------------------------------------------------------------
   7. Never let a theme wrapper hide the design behind a stacking context
   -------------------------------------------------------------------------- */
body.vercel-bridge-active #wrapper,
body.vercel-bridge-active #top,
body.vercel-bridge-active #main,
body.vercel-bridge-active #content,
body.vercel-bridge-active .page-wrapper,
body.vercel-bridge-active .site-content,
body.vercel-bridge-active .main-content,
body.vercel-bridge-active .main-content-wrap,
body.vercel-bridge-active .porto-sections-container,
body.vercel-bridge-active .elementor-section,
body.vercel-bridge-active .e-con,
body.vercel-bridge-active .vc_row {
	isolation: auto !important;
	contain: none !important;
}

/* The design root owns its own background; Porto's body colour would show
   through the transparent sections otherwise. */
body.vercel-bridge-home,
body.vercel-bridge-active:has(#vercel-homepage-container) {
	background-color: #f8fafc;
}

/* ==========================================================================
   8. Design-fidelity guard (v2.2) — home page parity with the Vercel build

   Reported symptoms on https://www.comparestaging.com/ that this section
   fixes, all of them caused by Porto/Bootstrap/Elementor rules layered *on
   top of* the design on the Elementor-canvas home page:

     • buttons and cards show an extra 1px border the design never asks for
       (the design draws cards with `ring-*`, i.e. box-shadow, not border),
     • buttons are taller than the Vercel build because the theme adds
       min-height / padding / line-height to <button> and <a>,
     • the "NexGen / 01–05" card row loses its column spans and row heights,
       so the five cards no longer line up like they do on Vercel,
     • the #shop bento cards lose their fixed 360/400px height.

   Everything here is scoped to the design roots, so WooCommerce, the blog,
   Elementor widgets and wp-admin keep their own styling. Values are the
   design's own (index.html / style.css) — this file only re-asserts them.
   ========================================================================== */

/* --------------------------------------------------------------------------
   8a. No phantom borders on the design's own controls and cards.
       The design only draws a border where a `border*` utility is present,
       so anything else must not inherit the theme's border.
   -------------------------------------------------------------------------- */
:is(
	aside[aria-label="Funding announcement"],
	#site-header,
	#vercel-homepage-container,
	.vercel-app-scope,
	footer#contact,
	#promo-details,
	#cart-overlay,
	#funding-overlay,
	#quote-overlay,
	#mobile-menu-overlay,
	#back-to-top,
	[data-nx]
) :is(button, a, article, aside, li):not([class*="border"]) {
	border-style: none !important;
	border-width: 0 !important;
}

/* --------------------------------------------------------------------------
   8b. Button geometry.
       Design heights: icon buttons + cart pill + quick-add = h-10 (40px),
       sm:h-11 (44px) from 640px up. Theme min-height/padding must not win.
   -------------------------------------------------------------------------- */
:is(
	aside[aria-label="Funding announcement"],
	#site-header,
	#vercel-homepage-container,
	footer#contact,
	#cart-overlay,
	#funding-overlay,
	#quote-overlay,
	#mobile-menu-overlay,
	[data-nx]
) :is(button, a)[class*="h-10"] {
	height: 2.5rem !important;
	min-height: 2.5rem !important;
}

@media (min-width: 640px) {
	:is(
		aside[aria-label="Funding announcement"],
		#site-header,
		#vercel-homepage-container,
		footer#contact,
		#cart-overlay,
		#funding-overlay,
		#quote-overlay,
		#mobile-menu-overlay,
		[data-nx]
	) :is(button, a)[class*="sm:h-11"] {
		height: 2.75rem !important;
		min-height: 2.75rem !important;
	}
}

/* Free-height CTAs (rounded-* with px-/py- padding) must keep the padding the
   design specifies instead of a theme min-height or extra vertical padding. */
:is(
	aside[aria-label="Funding announcement"],
	#site-header,
	#vercel-homepage-container,
	footer#contact,
	#cart-overlay,
	#funding-overlay,
	#quote-overlay,
	#mobile-menu-overlay,
	[data-nx]
) :is(button, a)[class*="rounded"]:not([class*="h-"]) {
	min-height: 0 !important;
	line-height: inherit;
}

/* Quick-add pills on the #shop bento cards — exactly as on Vercel. */
:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) #shop button[data-quick-add] {
	height: 2.5rem !important;
	min-height: 2.5rem !important;
	padding: 0 0.875rem 0 0.75rem !important;
	border: 0 !important;
	border-radius: 9999px !important;
	font-size: 0.75rem !important;
	line-height: 1 !important;
	box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   8c. #shop bento cards — fixed 360px / 400px boxes with a full-bleed image.
   -------------------------------------------------------------------------- */
:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) #shop article {
	height: 360px !important;
	min-height: 360px !important;
	overflow: hidden !important;
	isolation: isolate !important;
	border: 0 !important;
	border-radius: 1.5rem !important;
	background-color: #0a2a1a !important;
}

@media (min-width: 640px) {
	:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) #shop article {
		height: 400px !important;
		min-height: 400px !important;
	}
}

:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) #shop article > img {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	max-width: none !important;
	height: 100% !important;
	object-fit: cover !important;
}

:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) #shop article > div {
	height: 100% !important;
}

/* --------------------------------------------------------------------------
   8d. "NexGen / 01–05" card row — same columns, spans and equal heights as
       the Vercel build (1 / 2 / 6 / 12 columns; spans 3-3-2-2-2 then 3-2-2-2-3),
       plus guaranteed top-bar visibility and sm:p-6 spacing over Bootstrap .p-5.
   -------------------------------------------------------------------------- */
:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] > div > [data-trust-bar],
:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] > div > div:first-child {
	display: flex !important;
	align-items: center !important;
	visibility: visible !important;
	opacity: 1 !important;
}

:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] > div > ul {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) !important;
	align-items: stretch !important;
	grid-auto-rows: auto !important;
	gap: 0.75rem !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] > div > ul > li {
	display: flex !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] article {
	display: flex !important;
	flex-direction: column !important;
	width: 100% !important;
	height: 100% !important;
	min-height: 292px !important;
	overflow: hidden !important;
	border: 0 !important;
	border-radius: 26px !important;
	background-color: #06180f !important;
	color: #ffffff !important;
}

:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] article > img {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	max-width: none !important;
	height: 100% !important;
	object-fit: cover !important;
}

:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] article > div:last-child {
	flex: 1 1 auto !important;
	min-height: 292px !important;
	padding: 1.25rem !important;
}

@media (min-width: 640px) {
	:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] > div > ul {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 1rem !important;
	}

	:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] article > div:last-child {
		padding: 1.5rem !important;
	}
}

@media (min-width: 768px) {
	:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] > div > ul {
		grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
	}

	:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] > div > ul > li:nth-child(-n + 2) {
		grid-column: span 3 / span 3 !important;
	}

	:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] > div > ul > li:nth-child(n + 3) {
		grid-column: span 2 / span 2 !important;
	}
}

@media (min-width: 1024px) {
	:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] > div > ul {
		grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
	}

	:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] > div > ul > li:nth-child(1),
	:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] > div > ul > li:nth-child(5) {
		grid-column: span 3 / span 3 !important;
	}

	:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] > div > ul > li:nth-child(2),
	:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] > div > ul > li:nth-child(3),
	:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] > div > ul > li:nth-child(4) {
		grid-column: span 2 / span 2 !important;
	}
}

/* Below the md breakpoint the design shows one card per row (portrait cards).
   Make sure the flex row stretch above cannot squash them. */
@media (max-width: 639px) {
	:is(#vercel-homepage-container, body.vercel-bridge-home main#main, [data-nx]) section[aria-labelledby="trust-heading"] > div > ul > li {
		grid-column: 1 / -1 !important;
	}
}

/* --------------------------------------------------------------------------
   8e. Elementor / page-builder wrappers around the design must not paint a
       border, padding or background of their own around the cards.
   -------------------------------------------------------------------------- */
body.vercel-bridge-home .elementor-widget-container:has(:is(#vercel-homepage-container, main#main, [data-nx])),
body.vercel-bridge-home .elementor-widget-html:has(:is(#vercel-homepage-container, main#main, [data-nx])),
body.vercel-bridge-home .elementor-section:has(:is(#vercel-homepage-container, main#main, [data-nx])),
body.vercel-bridge-home .e-con:has(:is(#vercel-homepage-container, main#main, [data-nx])),
body.vercel-bridge-home .vc_row:has(:is(#vercel-homepage-container, main#main, [data-nx])) {
	border: 0 !important;
	box-shadow: none !important;
	background: transparent !important;
	padding: 0 !important;
}