.content {
	padding-top: 0 !important;
}
@media (max-width: 989px) {
	.html_header_transparency #top .avia-builder-el-0 .container, .html_header_transparency #top .avia-builder-el-0 .slideshow_caption {
		padding-top: 30px !important;
	}
}

/* wrapper + rows */
.sf-wrap { margin: 0 0 30px 0; display: grid; gap: 28px; }
.sf-row { display: grid; gap: 14px; }
.sf-title { margin: 0; font-size: 1.15rem; }

/* Row 1 container: keep centered & wrapping */
.sf-tabbar {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px 18px;
}

/* Each main service tab item */
.sf-chip {
  text-align: center;
  cursor: pointer;
  text-decoration: none;
}
.sf-chip-icon {
  width: 44px; height: 44px; object-fit: contain; display: block; margin: 0 auto 6px;
}
/* Title uppercase */
#sf-parents .sf-chip .sf-chip-label {
  text-transform: uppercase;
  font-size: 0.95rem;
  line-height: 1.2;
  display: block;
  word-break: break-word;     /* just in case names are long */
}

/* Make the active tab label just a bit bolder (Enfold also styles .av-active-tab-title) */
.sf-chip.av-active-tab-title .sf-chip-label { font-weight: 700; }

/* Row 2: parent content (no padding; bigger h2) */
.sf-parent-content { padding: 0; }
.sf-parent-title { margin: 0 0 8px; font-size: 2rem; line-height: 1.2; }
.sf-parent-text { line-height: 1.6; }

/* Row 3: two-column specific services + companies */
.sf-children-2col .sf-2col {
  display: grid; grid-template-columns: 340px 1fr; gap: 32px; align-items: start;
}
@media (max-width: 980px) {
  .sf-children-2col .sf-2col { grid-template-columns: 1fr; }
}

/* Left filter panel */
.sf-filters-header {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 1.5rem;
}
@media (max-width: 576px) {
	.sf-filters-header {
		justify-content: space-between;
		gap: 0;
	}
}
/* force list style per your request */
.sf-list {
  list-style: none !important;
  margin: 0 0 12px 0;
  padding: 0;
  display: grid; gap: 8px;
}
.sf-checkbox { display: flex; align-items: center; gap: 8px; cursor: pointer; user-select: none; }
.sf-clear { background: transparent; border: 1px solid #ddd; border-radius: 18px; padding: 6px 12px; cursor: pointer; }

/* Right companies grid */
.sf-results { min-height: 80px; }
.sf-spinner { margin-bottom: 12px; }

/* 3 columns, bigger logos */
.sf-grid-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}
@media (max-width: 1024px) {
  .sf-grid-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 425px) {
  .sf-grid-cards { grid-template-columns: 1fr; }
}

.test .sf-grid-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px;
}
@media (max-width: 1024px) {
  .test .sf-grid-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .test .sf-grid-cards { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 375px) {
  .test .sf-grid-cards { grid-template-columns: 1fr; }
}

.sf-card { background: #fff; border: 1px solid #eee; border-radius: 12px; overflow: hidden; transition: transform .15s ease, box-shadow .15s ease; }
.sf-card:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,.06); }
.sf-card-inner { display: grid; gap: 12px; text-decoration: none; color: inherit; padding: 22px; justify-items: center; }
.sf-logo { width: auto; height: 128px; object-fit: contain; }
.sf-logo--placeholder { width: 100%; height: 128px; background: #f1f1f1; border-radius: 8px; }
.sf-name { font-size: 1.05rem; text-align: center; margin: 0; }
.sf-empty { margin: 8px 0 0; }

@media (max-width: 425px) {
	.sf-card-inner {
		padding: 16px;
	}
	.sf-logo {
		height: 110px;	
	}
	.sf-name {
		font-size: 1rem;
	}
	.test .sf-grid-cards {
		gap: 20px;
	}
}

/* Each main service item = fixed width (170px), vertically stacked */
#sf-parents .sf-chip {
  background: none;
  border: none;
  padding: 0;
  text-align: center;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;

  width: 170px;         /* fixed width */
  flex: 0 0 170px;      /* keep equal widths in the flex row */
}
/* Icon size = 90x90 */
#sf-parents .sf-chip .sf-chip-icon {
  width: 90px;
  height: 90px;
  object-fit: contain;
  display: block;
  margin: 0 auto 6px;

  /* inactive grayscale effect (kept from earlier) */
  filter: grayscale(1);
  opacity: 0.85;
  transition: filter .2s ease, opacity .2s ease, transform .12s ease;
}
@media (max-width: 575px) {
	#sf-parents .sf-chip {
		width: 130px;
  		flex: 0 0 130px;
	}
	#sf-parents .sf-chip .sf-chip-icon {
		width: 45px;
  		height: 45px;
	}
	#sf-parents .sf-chip .sf-chip-label {
		font-size: 0.75rem;
	}
}
/* Active tab = full color */
#sf-parents .sf-chip.av-active-tab-title .sf-chip-icon,
#sf-parents .sf-chip[aria-pressed="true"] .sf-chip-icon {
  filter: none;
  opacity: 1;
}
/* (optional) hover hint for non-active */
#sf-parents .sf-chip:not(.av-active-tab-title):hover .sf-chip-icon {
  opacity: 0.95;
}

#sf-parent-content {
	padding-top: 30px;
}

/* Full-bleed background for Row 1 */
.sf-bleed-bg{
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  width: 100vw;
  background: #fff;            /* the white bar across the whole viewport */
}

.sf-bleed-inner{
  /* constrain the inner content back to your page width */
  max-width: var(--sf-container, 1200px);  /* adjust if your site uses a different width */
  margin: 0 auto;
  padding: 30px 20px;          /* vertical breathing room for the tab bar */
}

/* If your .sf-row adds extra gap, you can trim it specifically for this row */
.sf-row.sf-parents { gap: 0; }

/* Collapsible region: hidden by default */
#sf-children-region[hidden] { display: none; }

#sf-children-region {
	margin-top: 1rem;
	padding: 1rem;
}

#sf-children-region ul li {
	margin-left: 0;
}

.sf-collapsible {
	border: 1px solid var(--sf-border, #e6e6e6);
  	border-radius: .375rem;
  	padding: .5rem;
  	background: #fff;
}
.sf-collapsible ul {
	margin-top: 1rem;
  	max-height: 20rem;           /* tweak for your design */
 	 overflow: auto;
  	-webkit-overflow-scrolling: touch;
	gap: 4px !important;
}
@media (max-width: 1400px) {
	.sf-collapsible ul {
		max-height: 16rem;
	}
}
.sf-collapsible ul li span {
	line-height: 1.4 !important;
}

.sf-toggle-list {
	border-radius: 35px !important;
    background-color: #1ec1f3;
	border: none !important;
	transition: background-color 0.4s;
	color: #fff;
	text-transform: uppercase;
	padding: 10px 16px 10px;
	cursor: pointer;
}