:root{
	--pbc-chevron-white: url(https://theportablebarcompany.com/wp-content/themes/AEIG2026/images/icons/chevron-right-wh.svg);
  --pbc-chevron-blue: url(https://theportablebarcompany.com/wp-content/themes/AEIG2026/images/icons/chevron-right-bl.svg);
--pbc-chevron-gray: url(https://theportablebarcompany.com/wp-content/themes/AEIG2026/images/icons/chevron-right-gr.svg);
}

#header {
	box-shadow: 0 0 20px rgba(0,0,0,0.8);
}
.aefullwidth.mtop-large {
	margin-top: 0;
}
.bluelink{
	display: inline-flex;
	align-items: center;
	color: #027eed;
	text-decoration: none;
	background: none !important;
	padding-right: 0 !important;
  text-transform: capitalize;
  font-size: 1rem;
}

.bluelink::after{
	content: "";
	display: inline-block;
	width: 14px;
	height: 14px;
	margin-left: .45rem;
	flex: 0 0 10px;
	background-image: var(--pbc-chevron-blue);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
}

.bluelink:hover{
	text-decoration: underline;
	text-underline-offset: 3px;
}
/* =========================
   Hero Typography
   ========================= */

h1.wp-block-heading,
h2.wp-block-heading{
	font-weight: 600;
}

h1,
.has-huge-font-size{
	font-size: clamp(1.6rem, 1rem + 1.4vw, 2.5rem);
	line-height: 1.14;
	letter-spacing: -0.02em;
}

.herotext,
.smalllead,
.herotext ul li{
	color: #EEEEEE;
}

.smalllead{
	display: block;
	font-size: 75%;
	font-weight: 500;
}


/* =========================
   Shared Content Widths
   ========================= */

.sectioncontent{
	width: min(100% - 2rem, 1440px);
	margin: clamp(2rem, 1.25rem + 3vw, 5rem) auto clamp(2rem, 1.25rem + 2.5vw, 4rem);
}

.herosectioncontent{
	width: min(100% - 2rem, 1600px);
	margin: clamp(2rem, 1.25rem + 3vw, 5rem) auto clamp(2rem, 1.25rem + 2.5vw, 4rem);
	align-items: center;
}

.innrcontent{
	margin: 3.5rem 0;
}


/* =========================
   Hero List
   ========================= */

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

.herolist li{
	position: relative;
	padding-left: 1.6rem;
	margin-bottom: .7rem;
	list-style-type: none !important;
	font-size: 1.1rem;
}

.herolist li::before{
	content: "✔";
	position: absolute;
	left: 0;
	top: 0.05em;
	color: #fff;
	font-size: 1.5em;
	line-height: 1;
	font-weight: 500;
}


/* =========================
   Hero CTA Cluster
   ========================= */

.hero-cta-cluster{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin: 3.5rem auto;
	text-align: center;
}

.hero-cta-row{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
	width: 100%;
}

.hero-cta-support{
	margin: 1.5rem auto 0;
	text-align: center;
}

.nobotmar{
	margin-bottom: 0 !important;
	font-size: 16px;
}

.hero-cta-support a{
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	color: #fff;
	text-decoration: none;
	font-size: 14px;
}

.hero-cta-support a::after{
	content: "";
	display: inline-block;
	width: 14px;
	height: 14px;
	background-image: var(--pbc-chevron-white);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	flex: 0 0 10px;
}

.hero-cta-support a:hover{
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* remove default spacing from wrapper divs */
.hero-cta-cluster .newmaincta,
.hero-cta-cluster .newseccta{
	margin: 0;
}

/* base button look */
.hero-cta-cluster .newmaincta a,
.hero-cta-cluster .newseccta a{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.8rem 2rem;
	border-radius: 10px;
	border: 1px solid transparent;
	text-decoration: none;
	font-size: 16px;
	line-height: 1;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
	box-sizing: border-box;
	white-space: nowrap;
}

/* primary */
.hero-cta-cluster .newmaincta a{
	background: #027eed;
	color: #fff;
	border-color: #027eed;
	font-weight: 700;
	text-shadow: 1px 1px 2px #084881;
	box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
}

/* secondary */
.hero-cta-cluster .newseccta a{
	background: transparent;
	color: #fff;
	border-color: #9D9E9F;
	border-width: 1px;
	border-style: solid;
	font-weight: 400;
}

/* hover */
.hero-cta-cluster .newmaincta a:hover{
	background: #0a86f6;
	border-color: #0a86f6;
	color: #fff;
}

.hero-cta-cluster .newseccta a:hover{
	background: rgba(255,255,255,.08);
	color: #fff;
}

/* keep CTA cluster left-positioned inside hero text */
.herotext .hero-cta-cluster{
	align-items: flex-start;
}


/* =========================
   Hero Layout Base
   ========================= */

.newhero .wp-block-cover__inner-container{
	width: 100%;
	max-width: 1600px;
	margin: 0 auto;
	padding-left: 2rem;
	padding-right: 2rem;
}

.newhero .herosectioncontent{
	width: 100%;
}

.newhero .herotext{
	position: relative;
	z-index: 2;
	margin-left: auto;
	padding: 0;
	background: transparent;
	min-width: 0;
}

.newhero .hero-spacer{
	min-width: 0;
}


/* =========================
   Desktop Page-Specific Widths
   ========================= */

@media (min-width: 1281px){

	.newhero.hero--home .herotext{
		flex: 0 0 55%;
		max-width: 55%;
	}

	.newhero.hero--home .hero-spacer{
		flex: 0 0 45%;
		max-width: 45%;
	}

	.newhero.hero--modular .herotext{
		flex: 0 0 43%;
		max-width: 43%;
	}

	.newhero.hero--modular .hero-spacer{
		flex: 0 0 57%;
		max-width: 57%;
	}
  .newhero.hero--home
  {
    min-height: 650px
  }
}


/* =========================
   721px–1280px
   Modular hero becomes 50 / 50
   ========================= */

@media (max-width: 1280px) and (min-width: 781px){

	.newhero .wp-block-cover__inner-container{
		padding-left: 1.5rem;
		padding-right: 1.5rem;
	}

	.newhero.hero--modular .herotext{
		display: block;
		flex: 0 0 60%;
		max-width: 60%;
	}

	.newhero.hero--modular .hero-spacer{
		display: block;
		flex: 0 0 40%;
		max-width: 40%;
	}

	.newhero.hero--modular .herotext{
		margin-left: 0;
		padding: 1.25rem 1rem;
		background: rgba(23,17,15,0.78);
		border-radius: 14px;
	}

	.newhero h1{
		font-size: clamp(2rem, 3vw, 3rem);
		line-height: 1.1;
	}
}


/* =========================
   CTA stack on smaller widths
   ========================= */

@media (max-width: 780px){

	.hero-cta-cluster{
		display: flex;
		width: 100%;
		align-items: stretch;
	}

	.hero-cta-row{
		flex-direction: column;
		width: 100%;
		gap: 12px;
	}

	.hero-cta-cluster .newmaincta a,
	.hero-cta-cluster .newseccta a{
		display: flex;
		width: 100%;
		font-size: 17px;
		text-align: center;
	}
}


/* =========================
   Mobile Hero Layout
   720px and below:
   - show top 500px of image first
   - place text below it
   - favor left side of image
   ========================= */

@media (max-width: 780px){

	.newhero{
		min-height: 760px;
    background-color: #17110f;
	}

	.newhero > .wp-block-cover__image-background{
		object-position: left center !important; 
    height: 500px;
	}

	.newhero .wp-block-cover__inner-container{
		padding-top: 350px;
		padding-left: 1rem;
		padding-right: 1rem;
		padding-bottom: 1rem;
	}

	.newhero .hero-spacer{
		display: none !important;
	}

	.newhero .herosectioncontent{
		display: block;
		width: 100%;
		margin: 0;
	}

	.newhero .herotext{
		flex-basis: 100% !important;
		max-width: 100%;
		width: 100%;
		margin: 0;
		padding: 1.25rem 1rem;
		background: rgba(23,17,15,0.78);
		border-radius: 14px;
	}

	.newhero h1{
		font-size: clamp(1.8rem, 7vw, 2.35rem);
		line-height: 1.12;
		margin-bottom: 1rem;
	}

	.newhero .hero-cta-row{
		flex-direction: column;
		align-items: stretch;
		width: 100%;
	}

	.newhero .newmaincta,
	.newhero .newseccta{
		width: 100%;
	}

	.newhero .newmaincta a,
	.newhero .newseccta a{
		display: block;
		width: 100%;
		text-align: center;
	}

	.newhero .hero-cta-support{
		margin-top: 1rem;
	}

	/*.newhero .hero-cta-support a{
		display: inline-block;
		margin: 0.25rem 0.75rem 0.25rem 0;
	} */
}
@media (max-width: 520px){
.newhero > .wp-block-cover__image-background
{
  left: -180px !important;
  width: auto
}
}
/* ========= CUSTOMER GALLERY ========= */
.swiper-slide img {
	border-radius: 10px;
	border: 1px solid #e2dfdf;
}
/* ========= PBC Customer Logos (CSS-only) ========= */
.pbc-customer-logos{
  position: relative;
  overflow: hidden;
  width: 100%;

  --logo-height: clamp(38px, 3vw, 60px);
  --logo-gap: clamp(20px, 3.5vw, 60px);
  --logo-speed: 28s; /* lower = faster */
  --edge-fade: 8%;
  margin: 3.5rem 0 1.5rem
}

/* Optional soft fade on left/right edges */
.pbc-customer-logos::before,
.pbc-customer-logos::after{
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: var(--edge-fade);
  z-index: 2;
  pointer-events: none;
}

.pbc-customer-logos::before{
  left: 0;
  background: linear-gradient(to right, #fff 0%, rgba(255,255,255,0) 100%);
}

.pbc-customer-logos::after{
  right: 0;
  background: linear-gradient(to left, #fff 0%, rgba(255,255,255,0) 100%);
}

/* If your section background is not white, replace #fff above with your actual bg color */

.pbc-customer-logos .pbc-logo-marquee{
  overflow: hidden;
  width: 100%;
}

.pbc-customer-logos .pbc-logo-track{
  display: flex;
  align-items: center;
  width: max-content;
  animation: pbc-logo-scroll var(--logo-speed) linear infinite;
  will-change: transform;
}

.pbc-customer-logos .pbc-logo-group{
  display: flex;
  align-items: center;
  gap: var(--logo-gap);
  flex: 0 0 auto;
  padding-inline-end: var(--logo-gap);
}

.pbc-customer-logos .pbc-logo-img{
  flex: 0 0 auto !important;
  display: block;
  width: auto !important;
  height: calc(var(--logo-height) * var(--logo-scale, 1)) !important;
  max-width: none !important;
  max-inline-size: min(320px, 52vw);
  object-fit: contain;
}

/* === Per-logo scale normalization === */
.logo--livenation{ --logo-scale: 0.78; }
.logo--hilton{     --logo-scale: 0.80; }
.logo--bacardi{    --logo-scale: 0.80; }
.logo--royal{      --logo-scale: 0.78; }
.logo--harrahs{    --logo-scale: 0.82; }
.logo--marriott,
.logo--hardrock{   --logo-scale: 1; }

.logo--cocacola{        --logo-scale: 0.74; }
.logo--disney{          --logo-scale: 0.88; }
.logo--sodexo{          --logo-scale: 0.82; }
.logo--levi{            --logo-scale: 0.86; }
.logo--oakview{         --logo-scale: 0.80; }
.logo--southerncomfort{ --logo-scale: 0.80; }
.logo--hyatt {	--logo-scale: 0.68;}

/* Seamless loop: move by exactly half the total track (because group 2 duplicates group 1) */
@keyframes pbc-logo-scroll{
  from{ transform: translateX(0); }
  to{ transform: translateX(-50%); }
}

/* Optional: pause on hover for desktop users */
@media (hover: hover) and (pointer: fine){
  .pbc-customer-logos:hover .pbc-logo-track{
    animation-play-state: paused;
  }
}

/* Reduced motion: stop the animation and allow horizontal scroll instead */
@media (prefers-reduced-motion: reduce){
  .pbc-customer-logos::before,
  .pbc-customer-logos::after{
    display: none;
  }

  .pbc-customer-logos .pbc-logo-marquee{
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
  }

  .pbc-customer-logos .pbc-logo-track{
    animation: none !important;
  }
}

/* Mobile tuning */
@media (max-width: 720px){
  .pbc-customer-logos{
    --logo-height: 38px;
    --logo-gap: 24px;
    --logo-speed: 22s;
    --edge-fade: 12%;
  }
}


/* ==========================================
  GALLERY SLIDER
   ======================================= */
.ub_image_slider{
	overflow: hidden;
  margin-bottom: 3.5rem !important
}

.ub_image_slider .swiper-slide{
	height: auto !important;
}

.ub_image_slider .swiper-slide img{
	display: block;
	width: 100% !important;
	height: 284px !important;
	object-fit: cover;
}

/* tablet */
@media (max-width: 1080px){
	.ub_image_slider .swiper-slide img{
		height: 240px !important;
	}
}

/* mobile */
@media (max-width: 720px){
	.ub_image_slider .swiper-slide img{
		height: 220px !important; 
	}
}

#ub_image_slider_83795bd2-9358-4a49-b44f-8318c1726899 .swiper-pagination{
	display: none !important;
}
/* ========================================
   PBC Feature Cards
   ======================================== */
   .gradbg{
	background: linear-gradient( to bottom, #e3e3e3 0%, #fff 8% );
  padding: 1rem 0
}

/* Responsive variables (similar to your logo clamp setup) */
.pbc-feature-cards{
  --vp-img: clamp(130px, 12vw, 210px);
  --vp-gap: clamp(12px, 2vw, 18px);        /* gap between columns */
  --vp-pad: clamp(10px, 1.2vw, 14px);      /* summary padding */
  --fade-ms: 420ms;                         /* accordion transition time */
}

/* Image zoom hover (desktop only) */
.pbc-feature__summary figure { overflow: hidden; }

.pbc-feature__summary img{
  transition: transform 220ms ease;
  transform-origin: center;
}

@media (hover: hover) and (pointer: fine) {
  .pbc-feature:hover .pbc-feature__summary img{
    transform: scale(.9);
  }
}

/* Headline hover color (desktop only) */
.pbc-feature__summary .wp-block-heading {
  transition: color 180ms ease;
}

@media (hover: hover) and (pointer: fine) {
  .pbc-feature:hover .pbc-feature__summary .wp-block-heading {
    color:#027eed;
  }
}

/* No zoom on mobile */
@media (max-width: 720px) {
  .pbc-feature__summary img { transform: none !important; }
}

/* Make the whole summary clickable */
.pbc-feature__summary {
  cursor: pointer;
  padding: var(--vp-pad);
  display: block;
  list-style: none;
}

.pbc-feature__summary::-webkit-details-marker { display: none; }

/* Headline spacing + equal height */
.pbc-feature__summary .wp-block-heading {
  margin: 0 0 10px 0;
  min-height: 3.2em;     /* ~2 lines; adjust if needed */
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.5;
  font-weight: 400;
  font-size: 1.2rem;
}

/* Center images */
.pbc-feature__summary figure {
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Responsive image sizing (like --logo-height clamp) */
.pbc-feature__summary img {
  display: block;
  max-width: 100%;
  width: auto;
  height: auto;
  max-height: var(--vp-img);
  object-fit: contain;
}

/* Smooth reveal (CSS-only) */
.pbc-feature__body {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transform: translateY(-4px);
  transition: max-height var(--fade-ms) ease, opacity 220ms ease, transform 220ms ease;
  padding: 0 12px;
  width: 221px;
  margin: 0 auto;
  text-align: center;
}

.pbc-feature[open] .pbc-feature__body {
  max-height: 600px; /* increase if your content is longer */
  opacity: 1;
  transform: translateY(0);
  padding: 12px;
}

@media (max-width: 720px) {
  /* Always show the expanded content on mobile */
  .pbc-feature{
		display: block;
	}

	.pbc-feature[open] .pbc-feature__body,
	.pbc-feature .pbc-feature__body{
		display: block !important;
		max-height: none !important;
		opacity: 1 !important;
		visibility: visible !important;
	}

	.pbc-feature summary{
		list-style: none;
	}

	.pbc-feature summary::-webkit-details-marker{
		display: none;
	}
}

/* Remove outlines */
.pbc-feature__summary:focus,
.pbc-feature__summary:focus-visible,
.pbc-feature__summary:active {
  outline: none !important;
  box-shadow: none !important;
}

/* UL helper: remove indent */
ul.pbc-feature__list {
  margin-left: 0;
  padding-left: 0;
  list-style-position: inside;
}

/* =========================
   5-up layout with responsive gap + scroll
   ========================= */
.pbc-feature-cards.wp-block-columns{
  display: flex;
  flex-wrap: nowrap !important;
  gap: var(--vp-gap);          /* responsive gap */
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 8px;
}

/* Let 5-up fit inside 1440 before scrolling */
.pbc-feature-cards.wp-block-columns > .wp-block-column{
  flex: 1 1 20% !important;   /* allow shrink/grow */
  min-width: 240px;           /* was 300px; this is why it scrolls at 1440 */
  max-width: none;            /* remove the 300px cap */
}

/* keep headings aligned but a bit tighter on mobile */
@media (max-width: 720px) {
  .pbc-feature__summary .wp-block-heading {
    min-height: 2.4em;
  }
}

/* Optional: respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .pbc-feature__body {
    transition: none;
    transform: none;
  }
}

/* ==========================================
   Folding vs Modular Comparison
   Targets existing Gutenberg HTML exactly
   ========================================== */

#foldingmodularcomparison, .flashbar-shape-card{
	--comp-bg: #f5f5f5;
	--comp-line: rgba(34,34,34,.18);
	--comp-text: #4a4a4a;
	--comp-head: #222;
	--comp-blue: #027eed;
	--comp-blue-border: #C4C5C6;
	--comp-shadow: 0 6px 20px rgba(0,0,0,.14);
	--comp-radius: 12px;
	--comp-icon-col: 92px;
	--comp-pad-x: 22px;
	--comp-pad-y: 18px;

	background: var(--comp-bg);
	border: 1.5px solid var(--comp-blue-border);
	border-radius: var(--comp-radius);
	box-shadow: var(--comp-shadow);
	padding: 24px 20px 18px;
	overflow: hidden;
}
.flashbar-shape-card {background: #fff !important;}

#foldingmodularcomparison > .wp-block-group__inner-container{
	max-width: none;
}

/* Reset Gutenberg spacing inside this block */
#foldingmodularcomparison .wp-block-columns.comptable{
	display: grid !important;
	grid-template-columns: var(--comp-icon-col) minmax(0, 1fr) minmax(0, 1.25fr);
	gap: 0 !important;
	margin: 0 !important;
	align-items: stretch;
}

#foldingmodularcomparison .wp-block-columns.comptable > .wp-block-column{
	min-width: 0;
	margin: 0 !important;
	padding: var(--comp-pad-y) var(--comp-pad-x);
	display: flex;
	flex-direction: column;

}

#foldingmodularcomparison{
	--comp-divider-inset: 6px;
}

#foldingmodularcomparison .wp-block-columns.comptable{
	position: relative;
  width: 100%
}

/* remove old full-width border-top rule */
/*
#foldingmodularcomparison .wp-block-group__inner-container > .comptable + .comptable{
	border-top: 1px solid var(--comp-line);
}
*/

#foldingmodularcomparison .wp-block-group__inner-container > .comptable + .comptable::before{
	content: "";
	position: absolute;
	top: 0;
	left: var(--comp-divider-inset);
	right: var(--comp-divider-inset);
	height: 1px;
	background: var(--comp-line);
}

@media (max-width: 1080px) and (min-width: 721px){
	#foldingmodularcomparison{
		--comp-divider-inset: 4px;
	}
}

@media (max-width: 720px){
	#foldingmodularcomparison{
		--comp-divider-inset: 0;
	}
}
/* Vertical dividers */
#foldingmodularcomparison .wp-block-group__inner-container > .comptable:not(:first-child) > .wp-block-column:nth-child(2),
#foldingmodularcomparison .wp-block-group__inner-container > .comptable:not(:first-child) > .wp-block-column:nth-child(3){
	border-left: 1px solid var(--comp-line);
}

/* Header row only needs the center divider */
#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child > .wp-block-column:nth-child(3){
	border-left: 1px solid var(--comp-line);
}

#foldingmodularcomparison .wp-block-image,
#foldingmodularcomparison figure{
	margin: 0;
}

#foldingmodularcomparison img{
	display: block;
	height: auto;
	max-width: 100%;
}


/* ------------------------------------------
   Header row
   ------------------------------------------ */

#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child > .wp-block-column{
	padding-top: 10px;
	padding-bottom: 15px;
}

#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child > .wp-block-column:first-child{
	padding: 0;
}

#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child .wp-block-columns{
	display: grid !important;
	grid-template-columns: minmax(95px, 132px) minmax(0, 1fr);
	gap: 16px;
	align-items: center;
	margin: 0 !important;
}

#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child .wp-block-image{
	text-align: center;
}

#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child .wp-block-image img{
	max-width: 132px;
	margin: 0 auto;
}

#foldingmodularcomparison h4.wp-block-heading{
	margin: 0 0 .35rem;
	color: var(--comp-head);
	font-size: 1.05rem;
	line-height: 1.2;
	font-weight: 700;
	letter-spacing: .02em;
	text-transform: uppercase;
}

#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child p{
	margin: 0;
	color: var(--comp-text);
	font-size: 1rem;
	line-height: 1.45;
	max-width: 23ch;
}

/* ------------------------------------------
   Left icon/title column
   ------------------------------------------ */

#foldingmodularcomparison .comptable:not(:first-child) > .wp-block-column:first-child{
	align-items: center;
	text-align: center;
	padding-left: 10px;
	padding-right: 10px;
}

#foldingmodularcomparison .comptable:not(:first-child) > .wp-block-column:first-child .wp-block-image{
	margin-bottom: 8px;
}

#foldingmodularcomparison .comptable:not(:first-child) > .wp-block-column:first-child img{
	max-width: 46px;
	max-height: 42px;
	width: auto;
	margin: 0 auto;
	opacity: .9;
}

#foldingmodularcomparison .icontitle{
	display: block;
	margin: 0 auto;
	max-width: 76px;
	color: #666;
	font-size: .68rem;
	line-height: 1.2;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	word-break: normal;
	overflow-wrap: normal;
}

/* ------------------------------------------
   Data cells
   ------------------------------------------ */

#foldingmodularcomparison .comptable:not(:first-child):not(.comptable-buttons) p{
	margin: 0 auto;
	max-width: 35ch;
	color: var(--comp-text);
	text-align: center;
	font-size: 1rem;
	line-height: 1.55;
}

#foldingmodularcomparison .comptable:not(:first-child):not(.comptable-buttons) strong{
	display: block;
	margin-bottom: 1rem; /* reduce this further if needed */
	color: var(--comp-head);
	font-size: 1.05rem;
	line-height: 1.55;
	font-weight: 700;
}

/* ------------------------------------------
   Buttons row
   ------------------------------------------ */

#foldingmodularcomparison .comptable-buttons > .wp-block-column{
	padding-top: 22px;
	padding-bottom: 12px;
}

#foldingmodularcomparison .comptable-buttons .wp-block-buttons{
	margin: 0;
}

#foldingmodularcomparison .comptable-buttons .wp-block-button{
	margin: 0;
}

#foldingmodularcomparison .comptable-buttons .wp-block-button__link, .flashbar-shape-card__btn{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 180px;
	padding: .9rem 1.55rem;
	border: 1.5px solid var(--comp-blue);
	border-radius: 10px;
	background: #fff;
	color: var(--comp-blue) !important;
	text-decoration: none;
	font-size: 1rem;
	line-height: 1.2;
	font-weight: 600;
	box-shadow: none;
	transition: all .2s ease;
}

#foldingmodularcomparison .comptable-buttons .wp-block-button__link:hover, .flashbar-shape-card:hover .flashbar-shape-card__btn{
	background: var(--comp-blue);
	border-color: var(--comp-blue);
	color: #fff !important;
}

.comptable-readmore {
	margin-top: 2rem;
}
/* ==========================================
   Tablet
   breakpoint-small: 1080px
   ========================================== */

@media (max-width: 1080px) and (min-width: 721px){

	#foldingmodularcomparison{
		--comp-icon-col: 84px;
		--comp-pad-x: 16px;
		--comp-pad-y: 15px;
		padding: 20px 14px 16px;
	}

	#foldingmodularcomparison .wp-block-columns.comptable{
		grid-template-columns: var(--comp-icon-col) minmax(0, 1fr) minmax(0, 1fr);
	}

	#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child .wp-block-columns{
		grid-template-columns: 96px minmax(0, 1fr);
		gap: 12px;
	}

	#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child .wp-block-image img{
		max-width: 108px;
	}

	#foldingmodularcomparison h4.wp-block-heading{
		font-size: .98rem;
	}

	#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child p{
		font-size: .92rem;
		max-width: 19ch;
	}

	#foldingmodularcomparison .comptable:not(:first-child) > .wp-block-column:first-child img{
		max-width: 40px;
		max-height: 36px;
	}

	#foldingmodularcomparison .icontitle{
		font-size: .6rem;
		max-width: 68px;
	}

	#foldingmodularcomparison .comptable:not(:first-child):not(.comptable-buttons) p{
		font-size: .92rem;
		line-height: 1.5;
		max-width: 30ch;
	}

	#foldingmodularcomparison .comptable:not(:first-child):not(.comptable-buttons) strong{
		font-size: .98rem;
	}

	#foldingmodularcomparison .comptable-buttons .wp-block-button__link{
		min-width: 0;
		padding: .8rem 1.15rem;
		font-size: .95rem;
	}
}

/* ==========================================
   Mobile
   breakpoint-xsmall: 720px
   ========================================== */

@media (max-width: 720px){

	#foldingmodularcomparison{
		--comp-pad-x: 12px;
		--comp-pad-y: 12px;
		padding: 16px 12px 16px;
		border-radius: 10px;
	}

	/* Header row */
	#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child{
		grid-template-columns: 1fr 1fr !important;
	}

	#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child > .wp-block-column:first-child{
		display: none;
	}

	#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child > .wp-block-column:nth-child(2),
	#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child > .wp-block-column:nth-child(3){
		padding: 12px 10px 16px;
		border-left: 0;
	}

	#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child > .wp-block-column:nth-child(3){
		border-left: 1px solid var(--comp-line);
	}

	#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child .wp-block-columns{
		grid-template-columns: 1fr;
		gap: 10px;
		text-align: center;
	}

	#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child .wp-block-image img{
		max-width: 92px;
	}

	#foldingmodularcomparison h4.wp-block-heading{
		font-size: .95rem;
	}

	#foldingmodularcomparison .wp-block-group__inner-container > .comptable:first-child p{
		font-size: .88rem;
		line-height: 1.4;
		max-width: 16ch;
		margin: 0 auto;
	}

	/* Feature rows become:
	   row 1 = icon/title full width
	   row 2 = folding cell | modular cell
	*/
	#foldingmodularcomparison .comptable:not(:first-child):not(.comptable-buttons){
		grid-template-columns: 1fr 1fr !important;
	}

	#foldingmodularcomparison .comptable:not(:first-child):not(.comptable-buttons) > .wp-block-column:first-child{
		grid-column: 1 / -1;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		gap: 10px;
		padding: 12px 10px 10px;
	}

	#foldingmodularcomparison .comptable:not(:first-child):not(.comptable-buttons) > .wp-block-column:first-child .wp-block-image{
		margin: 0;
	}

	#foldingmodularcomparison .comptable:not(:first-child):not(.comptable-buttons) > .wp-block-column:first-child img{
		max-width: 34px;
		max-height: 34px;
	}

	#foldingmodularcomparison .comptable:not(:first-child):not(.comptable-buttons) > .wp-block-column:first-child .icontitle{
		max-width: none;
		margin: 0;
		font-size: .72rem;
		line-height: 1.1;
	}

	#foldingmodularcomparison .wp-block-group__inner-container > .comptable:not(:first-child) > .wp-block-column:nth-child(2),
	#foldingmodularcomparison .wp-block-group__inner-container > .comptable:not(:first-child) > .wp-block-column:nth-child(3){
		border-left: 0 !important;
	}

	#foldingmodularcomparison .comptable:not(:first-child):not(.comptable-buttons) > .wp-block-column:nth-child(2){
		border-right: 1px solid var(--comp-line);
	}

	#foldingmodularcomparison .comptable:not(:first-child):not(.comptable-buttons) > .wp-block-column:nth-child(2),
	#foldingmodularcomparison .comptable:not(:first-child):not(.comptable-buttons) > .wp-block-column:nth-child(3){
		padding: 10px 10px 14px;
	}

	#foldingmodularcomparison .comptable:not(:first-child):not(.comptable-buttons) p{
		max-width: none;
		font-size: .88rem;
		line-height: 1.45;
	}

	#foldingmodularcomparison .comptable:not(:first-child):not(.comptable-buttons) strong{
		font-size: .94rem;
		margin-bottom: .3rem;
	}

	/* Buttons stack */
	#foldingmodularcomparison .comptable-buttons{
		grid-template-columns: 1fr !important;
	}

	#foldingmodularcomparison .comptable-buttons > .wp-block-column:first-child{
		display: none;
	}

	#foldingmodularcomparison .comptable-buttons > .wp-block-column:nth-child(2),
	#foldingmodularcomparison .comptable-buttons > .wp-block-column:nth-child(3){
		grid-column: 1;
		padding: 10px 0 0;
		border-left: 0 !important;
	}

	#foldingmodularcomparison .comptable-buttons .wp-block-button__link{
		width: 100%;
		max-width: 340px;
		min-width: 0;
		padding: .9rem 1rem;
		font-size: .95rem;
	}

	#foldingmodularcomparison .comptable-readmore{
		margin-top: 14px;
	}	
}


#foldingmodularcomparison {background-color:#fff; border-radius: 10px; box-shadow: 0 0 10px rgba(0,0,0,0.1);width: min(100% - 2rem, 900px);
	margin-inline: auto;
    margin:3.5rem auto 0 auto} 

/* =========================
   PBC Testimonial Slider
   Centered content wrapper
   ========================= */

.pbc-testimonial-slider{
  --pbc-text: #2f2f2f;
  --pbc-muted: #6b6b6b;
  --pbc-line: #e9e8e8;
  --pbc-arrow: #e9e8e8;
  --pbc-arrow-hover: #8f8f8f;
  --pbc-dot: #cfcfcf;
  --pbc-dot-active: #555;
  --pbc-max: 1100px;
  --pbc-quote-open: url("https://theportablebarcompany.com/wp-content/themes/AEIG2026/images/open_quote.svg");
  --pbc-quote-close: url("https://theportablebarcompany.com/wp-content/themes/AEIG2026/images/close_quote.svg");
  position: relative;
  max-width: var(--pbc-max);
  margin: 0 auto;
  padding: 22px 72px 56px;
  box-sizing: border-box;
}

.pbc-testimonial-slider,
.pbc-testimonial-slider *{
  box-sizing: border-box;
}

.pbc-testimonial-stage{
  position: relative;
  overflow: hidden;
  min-height: 280px;
}

.pbc-testimonial-track{
  position: relative;
  min-height: 280px;
}

.pbc-testimonial{
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 320ms ease, visibility 320ms ease;
  margin: 0;
  padding: 0;
}

.pbc-testimonial.is-active{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  z-index: 2;
}

.pbc-testimonial-card{
  position: relative;
  width: min(100% - 2rem, 900px);
  min-height: 278px;
  margin: 0 auto;
  padding: 28px 34px;
  border: 1.5px solid var(--pbc-line);
  border-radius: 10px;
  background: transparent;
  display: grid;
  place-items: center;
}

.pbc-testimonial-card::before,
.pbc-testimonial-card::after{
  content: "";
  position: absolute;
  display: block;
  width: 46px;
  height: 46px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  pointer-events: none;
}

.pbc-testimonial-card::before{
  top: 20px;
  left: 24px;
  background-image: var(--pbc-quote-open);
}

.pbc-testimonial-card::after{
  right: 24px;
  bottom: 20px;
  background-image: var(--pbc-quote-close);
}

.pbc-testimonial-content{
  width: min(100%, 720px);
  margin: 0 auto;
  text-align: center;
}

.pbc-testimonial-slider blockquote{
  margin: 0;
  padding: 0;
  border-left: 0 !important;
}

.pbc-testimonial-quote{
  margin: 0;
  color: var(--pbc-text);
  font-family: "Libre Baskerville", serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(18px, 1.4vw, 20px);
  line-height: 1.75;
  text-align: center;
  quotes: none;
}

.pbc-testimonial-name,
.pbc-testimonial-company{
  margin-left: 0;
  margin-right: 0;
  text-align: center;
  font-family: Arial, Helvetica, sans-serif;
}

.pbc-testimonial-name{
  margin-top: 3rem;
  margin-bottom: 0 !important;
  color: var(--pbc-muted);
  font-size: 12px;
  line-height: 1.4;
}

.pbc-testimonial-company{
  margin-top: 6px;
  margin-bottom: 0;
  color: var(--pbc-text);
  font-size: 15px;
  line-height: 1.3;
  font-weight: 500;
}

/* nav arrows */
.pbc-testimonial-nav{
 position: absolute;
	top: calc(50% - 20px);
	transform: translateY(-50%);
	border: 0;
	background: transparent;
	padding: 0;
	width: 40px;
	height: 40px;
	cursor: pointer;
	z-index: 10;
}
/* Swiper icon font for the arrow itself */
.pbc-testimonial-nav::after{
content: "";
	display: block;
	width: 40px;
	height: 40px;
	margin: 0 auto;
	background-image: var(--pbc-chevron-gray);
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	transition: transform 180ms ease, opacity 180ms ease;
}

/* Important: these content values are what actually render the icon */
.pbc-testimonial-prev::after{
	transform: rotate(180deg);
}

.pbc-testimonial-next::after{
	transform: rotate(0deg);
}
.pbc-testimonial-nav:hover::after{
	opacity: .8;
}
.pbc-testimonial-prev{ left: 10px; }
.pbc-testimonial-next{ right: 10px; }

.pbc-testimonial-nav:hover,
.pbc-testimonial-nav:focus-visible{
  color: var(--pbc-arrow-hover);
}

.pbc-testimonial-nav:focus-visible,
.pbc-testimonial-dot:focus-visible,
.pbc-testimonial-toggle:focus-visible{
  outline: 2px solid #999;
  outline-offset: 3px;
}


/* tablet */
@media (max-width: 1024px){
  .pbc-testimonial-slider{
    padding: 20px 56px 50px;
  }

  .pbc-testimonial-stage,
  .pbc-testimonial-track{
    min-height: 250px;
  }

  .pbc-testimonial-card{
    width: min(100%, 760px);
    min-height: 248px;
    padding: 26px 28px;
    border-radius: 24px;
  }

  .pbc-testimonial-card::before,
  .pbc-testimonial-card::after{
    width: 38px;
    height: 38px;
  }

  .pbc-testimonial-card::before{
    top: 16px;
    left: 18px;
  }

  .pbc-testimonial-card::after{
    right: 18px;
    bottom: 16px;
  }

  .pbc-testimonial-content{
    width: min(100%, 560px);
  }

  .pbc-testimonial-quote{
    font-size: clamp(15px, 1.9vw, 19px);
  }
}

/* mobile */
@media (max-width:720px){
  .pbc-testimonial-slider{
    padding: 16px 38px 48px;
  }

  .pbc-testimonial-stage,
  .pbc-testimonial-track{
    min-height: 220px;
  }

  .pbc-testimonial-card{
    width: min(100%, 440px);
    min-height: 190px;
    padding: 22px 18px;
    border-radius: 22px;
  }

  .pbc-testimonial-card::before,
  .pbc-testimonial-card::after{
    width: 30px;
    height: 30px;
  }

  .pbc-testimonial-card::before{
    top: 10px;
    left: 12px;
  }

  .pbc-testimonial-card::after{
    right: 12px;
    bottom: 10px;
  }

  .pbc-testimonial-content{
    width: min(100%, 300px);
  }

  .pbc-testimonial-quote{
    font-size: clamp(14px, 4vw, 17px);
    line-height: 1.35;
  }

  .pbc-testimonial-name{
    margin-top: 10px;
    font-size: 11px;
  }

  .pbc-testimonial-company{
    margin-top: 5px;
    font-size: 13px;
  }

  .pbc-testimonial-nav{
    font-size: 38px;
    width: 30px;
    height: 30px;
  }

  .pbc-testimonial-prev{ left: 4px; }
  .pbc-testimonial-next{ right: 4px; }

  .pbc-testimonial-controls{
    gap: 12px;
    flex-wrap: wrap;
  }
}

@media (prefers-reduced-motion: reduce){
  .pbc-testimonial,
  .pbc-testimonial-nav,
  .pbc-testimonial-dot,
  .pbc-testimonial-toggle{
    transition: none;
  }
}

/* =========================
   PBC Association Logos
   Matches testimonial card width
   ========================= */

.pbc-association-logos{
  --logo-set-max: 900px;              /* same visual width as testimonial card */
  --logo-gap: clamp(20px, 2.6vw, 42px);
  --logo-height: clamp(34px, 4vw, 62px);
  --logo-pad-x: clamp(14px, 2vw, 24px);
  --edge-fade: 26px;
  --scroll-pad: 12px;
}

.pbc-association-logos__viewport{
  width: min(100%, var(--logo-set-max));
  margin-inline: auto;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  padding-inline: var(--scroll-pad);
}

.pbc-association-logos__track{
  display: flex;
  align-items: center;
  gap: var(--logo-gap);
  width: max-content;
  min-width: 100%;
  padding-block: 8px;
}

/* centered desktop layout */
@media (min-width: 901px){
  .pbc-association-logos__viewport{
    overflow: hidden;
    padding-inline: 0;
  }

  .pbc-association-logos__track{
    width: 100%;
    justify-content: space-between;
  }
}

.pbc-association-logo{
  --logo-scale: 1;
  flex: 0 0 auto;
  display: block;
  width: auto;
  height: calc(var(--logo-height) * var(--logo-scale));
  max-width: min(120px, 22vw);
  object-fit: contain;
}

/* optional per-logo normalization */
.logo--nra{         --logo-scale: 0.98; }
.logo--catersource{ --logo-scale: 0.98; }
.logo--niga{        --logo-scale: 0.98; }
.logo--cmaa{        --logo-scale: 0.98; }
.logo--nightclub{   --logo-scale: 0.98; }

/* smaller screens: keep row horizontal and scrollable */
@media (max-width: 900px){
  .pbc-association-logos{
    --logo-gap: 24px;
    --logo-height: 40px;
    --edge-fade: 16px;
  }

  .pbc-association-logos__track{
    justify-content: flex-start;
    padding-inline: 2px;
  }

  .pbc-association-logo{
    max-width: 150px;
  }
}

@media (max-width: 720px){
  .pbc-association-logos{
    --logo-gap: 20px;
    --logo-height: 34px;
    --scroll-pad: 10px;
  }

  .pbc-association-logo{
    max-width: 132px;
  }
} 

/* =========================
   Footer CTAs
   ========================= */
.footcta {text-align: center;}
.footctacluster, .footctarow {display: block;}

.has-light-gray-background-color {
	padding: clamp(2rem, 1.25rem + 3vw, 5rem) 0;
}
.has-light-gray-background-color .sectioncontent {margin: 0 auto !important}

#footer {margin-top: 0 !important}