/**
 * Kays Harbor layout system — overflow contract + carousel containment.
 *
 * Page chrome must not use overflow-x to hide leaks: that pairs overflow-y
 * to auto and creates a nested scrollbar, or clips the window bar on WebKit.
 * Horizontal overflow is contained on the components that generate it.
 *
 * Owl Carousel clones sit on .owl-stage (thousands of px wide). The plugin
 * already clips them on .owl-stage-outer; we restate that contract here so
 * later theme CSS cannot open it. Do not set overflow:hidden on .owl-carousel
 * itself — nav arrows are siblings of .owl-stage-outer.
 */

html {
	overflow-y: scroll;
	max-width: 100%;
}

/*
 * Canvas contract: 1170 is a MAX column width (live desktop), never a
 * fixed element width. Below that, boxes are 100% + shared gutter so
 * iPad / Surface cannot overflow. Do not use per-device patches.
 */
:root {
	--kh-content-max: 1170px;
	--kh-gutter: 20px;
	--kh-logo-w: 216px;
}

.container {
	width: 100% !important;
	max-width: min(100%, var(--kh-content-max)) !important;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box !important;
	padding-left: var(--kh-gutter);
	padding-right: var(--kh-gutter);
}

.section-boxed:not(.section-header):not(.header-text) {
	width: 100% !important;
	max-width: min(100%, var(--kh-content-max)) !important;
	margin-left: auto !important;
	margin-right: auto !important;
	box-sizing: border-box !important;
}

.expertise-content,
.contact-area,
.for-career,
.halfwidth,
.e_commerce_content_section {
	max-width: 100%;
	box-sizing: border-box;
}

/*
 * Homepage consult: custom_style used a 350/310/270/365px canvas.
 * Heights are auto at every width so the stacked form cannot paint
 * under the footer. ≤1170 still stacks left/right in-flow below.
 */
.style2018 .expertise-sec.hm-sec,
.expertise-sec.hm-sec {
	height: auto !important;
	max-height: none !important;
	overflow: visible !important;
}

.expertise-sec.hm-sec .expertise-content,
.style2018 .expertise-sec.hm-sec .expertise-content {
	height: auto !important;
	max-height: none !important;
	min-height: 0;
	overflow: visible;
}

.halfwidth {
	width: 100% !important;
	max-width: 100% !important;
}

/*
 * The retail text column is floated beside .wide-image-over-div-left.
 * Forcing it to 100% pulled the heading under that tablet image.
 * From 992px to 1240px that tablet stays 723px wide and still covers
 * the heading, so it scales into the space beside the text.
 */
@media screen and (min-width: 992px) and (max-width: 1240px) {
	.full-wrapper .wide-image-over-div-left {
		left: 0;
		width: 46%;
		max-width: 46%;
	}

	.full-wrapper .wide-image-over-div-left img {
		width: 100%;
		height: auto;
		max-width: 100%;
	}
}

body,
#main-container,
.page-wrapper,
.header-wrapper,
#content-container {
	max-width: 100%;
	overflow: visible;
}

body {
	overflow-x: visible !important;
}

/*
 * Porcelain style.css sets #footer { overflow:hidden } to contain floats.
 * On the homepage the consult form used to paint into that box; hidden
 * overflow then clipped REACH US AT / company details, so the footer
 * looked like it could not be scrolled into view. Keep floats cleared
 * without clipping in-flow footer content.
 */
#footer {
	overflow: visible;
	/* Child #kayscustomfooter { margin-top:50px } collapsed through
	 * overflow:visible and painted a white band above REACH US AT.
	 * Padding contains that margin inside the dark footer. */
	padding-top: 1px;
}

#footer #kayscustomfooter {
	margin-top: 0;
}

#footer .cols-wrapper,
#footer .footer-widgets.section-boxed,
#footer .section-boxed {
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
}

#footer .footer-nav,
#footer #menu-footer-bottom-menu {
	max-width: 100%;
	flex-wrap: wrap;
}

#footer::after {
	content: "";
	display: table;
	clear: both;
}

.owl-carousel {
	max-width: 100%;
}

.owl-carousel .owl-stage-outer {
	overflow: hidden;
	width: 100%;
	max-width: 100%;
}

/*
 * Slide Anything forces .owl-dots { display:block !important } even when
 * Owl marks them .disabled (pagination off). The empty bar is 10px tall,
 * full-width, and sits above VIEW ALL as a grey line. Restore the plugin
 * contract: disabled dots do not render. Enabled dots are unchanged.
 */
.owl-carousel.sa_owl_theme .owl-dots.disabled {
	display: none !important;
}

/*
 * Full-bleed carousels inherit hanging arrows (left/right: -32px) from
 * custom_style. Above the 1170 content box those sit in the page margin.
 * At ≤1170 they extend past the viewport. Keep them inside the carousel
 * without clipping .owl-carousel (that would hide the arrows).
 */
@media screen and (max-width: 1170px) {
	.about-testi-content .sa_owl_theme .owl-nav .owl-prev,
	.journey-content .sa_owl_theme .owl-nav .owl-prev {
		left: 10px;
		right: auto;
	}

	.about-testi-content .sa_owl_theme .owl-nav .owl-next,
	.journey-content .sa_owl_theme .owl-nav .owl-next {
		right: 10px;
		left: auto;
	}

	.expertise-sec.hm-sec .expertise-content,
	.style2018 .expertise-sec.hm-sec .expertise-content {
		height: auto;
	}
}

.aboutus-container {
	width: 100% !important;
	max-width: var(--kh-content-max);
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
}

.journey-content,
.about-journey-sec,
.about-testi-content,
.about-testi-sec,
.about-vision-sec,
.vision-content,
.about-philosophy-sec,
.about-growth-sec,
.about-method-content {
	max-width: 100%;
	box-sizing: border-box;
}

/* UA list margin + width:100% extends 20px past the parent. */
.vision-content > ul {
	box-sizing: border-box;
	max-width: 100%;
	margin-left: 0;
	margin-right: 0;
	padding-left: 0;
}

/*
 * Phase 2 — header contract (two modes, no page-id).
 *
 * ≥801  one flex row: logo + nav + phone. Inner bar is width 100%
 *       capped at --kh-content-max (live 1170). Gutter only when the
 *       viewport is narrower than that cap. Do not border-box
 *       .header-text.section-boxed (hero).
 * ≤800  logo | call icon | hamburger; desktop nav stays hidden;
 *       Porcelain clones .mob-nav-menu from #menu.
 */
#header,
.fixed-header #header,
.fixed-header-scroll #header {
	left: 0 !important;
	right: 0 !important;
	width: auto !important;
	max-width: 100vw !important;
	min-width: 0 !important;
	overflow-x: clip;
	overflow-y: visible;
	box-sizing: border-box;
	z-index: 10000;
}

/*
 * Live paints an opaque #333 bar as soon as the header leaves the hero.
 * Transparent overlay is About-at-rest only; never keep it after scroll.
 */
body.fixed-header-scroll #header,
.header-wrapper.intro.fixed-header-scroll #header,
.header-wrapper.intro.fixed-header-scroll #header.kh-header-solid,
.fixed-header-scroll #header,
.fixed-header-scroll #header.kh-header-solid,
#header.kh-header-solid {
	background: #333333 none !important;
	background-color: #333333 !important;
	background-image: none !important;
	opacity: 1 !important;
	-webkit-transition: none !important;
	transition: none !important;
}

/*
 * Inner pages are not the Home/About overlay. Porcelain still writes
 * inline rgba on #header at rest, so the banner photo shows through
 * (beige/gold wordmark). Opaque #333 must win at every width.
 */
body.fixed-header:not(.home) #header {
	background: #333333 none !important;
	background-color: #333333 !important;
	background-image: none !important;
}

#header .section-header.section-boxed {
	max-width: var(--kh-content-max);
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--kh-gutter);
	padding-right: var(--kh-gutter);
	box-sizing: border-box;
}

body.home .header-text.section-boxed {
	max-width: 1170px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	box-sizing: content-box;
}

body.home .header-text h1,
body.home .header-text .typed-me {
	overflow: visible;
}

body.blog .header-wrapper,
body.blog .header-wrapper.intro,
body.archive .header-wrapper,
body.single .header-wrapper,
body.single-post .header-wrapper {
	background-image: none;
}

body.blog .header-wrapper .inner,
body.archive .header-wrapper .inner,
body.single .header-wrapper .inner,
body.single-post .header-wrapper .inner {
	padding-top: 0;
	min-height: 0;
	height: auto;
}

body.blog .header-wrapper.intro::after,
body.archive .header-wrapper.intro::after,
body.single .header-wrapper.intro::after {
	display: none;
	content: none;
}

/*
 * About Us only: live paints banner.jpg under a transparent header at rest.
 * Service templates share .style2018 + .full-bg-image but keep an opaque bar.
 */
body:not(.home):has(.aboutus-banner) .header-wrapper.intro {
	min-height: 0 !important;
	height: 0 !important;
	padding: 0 !important;
	overflow: visible;
}

body:not(.home):has(.aboutus-banner) .header-wrapper.intro .inner {
	padding-top: 0;
	min-height: 0;
	height: 0;
	overflow: visible;
}

body:not(.home):has(.aboutus-banner) .header-wrapper.intro:not(.fixed-header-scroll) #header:not(.kh-header-solid) {
	position: fixed !important;
	top: 0;
	left: 0;
	right: 0;
	width: 100% !important;
	background-color: transparent !important;
	background-image: none;
}

/*
 * Any inner-page section that owns a .full-bg-image is a full-bleed
 * band (service headers, About, etc.). Do not inherit a 1170 box.
 */
body:not(.home) .section-full-width:has(> .full-bg-image) {
	width: 100%;
	max-width: none;
	position: relative;
	left: 0;
	margin-left: 0;
	margin-top: 0 !important;
	overflow: hidden !important;
	box-sizing: border-box;
}

body:not(.home) .section-full-width:has(> .full-bg-image) > .full-bg-image {
	left: 0;
	right: 0;
	width: 100%;
}

@media only screen and (min-width: 801px) {
	#header {
		position: relative;
		overflow: visible;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	#header .section-header {
		display: -webkit-flex;
		display: flex;
		-webkit-align-items: center;
		align-items: center;
		-webkit-flex-wrap: nowrap;
		flex-wrap: nowrap;
		position: relative;
		overflow: visible;
		box-sizing: border-box !important;
		width: 100%;
		max-width: min(100%, var(--kh-content-max));
		min-width: 0;
		margin-left: auto;
		margin-right: auto;
		min-height: 52px;
		padding-left: var(--kh-gutter);
		padding-right: var(--kh-gutter);
	}

	#header .section-header > .clear,
	#header #navigation-line {
		display: none;
	}

	#header #logo-container,
	body.home #header #logo-container {
		float: none;
		display: block;
		-webkit-flex: 0 0 auto;
		flex: 0 0 auto;
		margin: 0 12px 0 0;
	}

	#header #logo-container img {
		display: block;
		width: var(--kh-logo-w) !important;
		max-width: var(--kh-logo-w) !important;
		height: auto !important;
	}

	#header .navigation-container {
		float: none !important;
		display: block;
		-webkit-flex: 1 1 auto;
		flex: 1 1 auto;
		min-width: 0;
		margin: 0 16px 0 0 !important;
	}

	#header #menu,
	#header .nav-menu {
		display: block;
		width: 100%;
	}

	#header .menu-ul {
		display: -webkit-flex;
		display: flex;
		-webkit-align-items: center;
		align-items: center;
		-webkit-flex-wrap: nowrap;
		flex-wrap: nowrap;
		-webkit-justify-content: flex-end;
		justify-content: flex-end;
		margin: 0;
		padding: 0;
		width: 100%;
	}

	#header .menu-ul > li,
	#header .navigation-container ul.menu-ul > li {
		float: none;
		display: block;
		-webkit-flex: 0 1 auto;
		flex: 0 1 auto;
		min-width: 0;
		padding: 0;
		top: auto !important;
		position: relative;
	}

	/*
	 * Porcelain draws the hover tick as a 3px clipped "-" at bottom:7px
	 * of a ~25px link, which slices through the letters. Keep the short
	 * line, but park it under the label.
	 */
	#header .nav-menu > ul > li > a,
	#header .menu-ul > li > a {
		position: relative;
		overflow: visible;
		padding-top: 4px;
		padding-bottom: 8px;
	}

	#header .nav-menu > ul > li > a::after,
	#header .nav-menu > div.menu-ul > ul > li > a::after,
	#header .menu-ul > li > a::after {
		content: "" !important;
		top: auto !important;
		bottom: 0 !important;
		left: 50%;
		margin-left: -12px;
		width: 24px;
		height: 0;
		overflow: hidden;
		background-color: #fff;
		text-indent: 0;
	}

	#header .nav-menu > ul > li > a:hover::after,
	#header .nav-menu > div.menu-ul > ul > li > a:hover::after,
	#header .nav-menu > ul > li:hover > a::after,
	#header .menu-ul > li > a:hover::after,
	#header .menu-ul > li:hover > a::after {
		height: 2px !important;
		bottom: 0 !important;
		top: auto !important;
	}

	#header .nav-menu > ul > li:last-child > a::after,
	#header .menu-ul > li:last-child > a::after,
	#header .nav-menu > ul > li:last-child > a:hover::after,
	#header .nav-menu > ul > li:last-child:hover > a::after,
	#header .menu-ul > li:last-child > a:hover::after,
	#header .menu-ul > li:last-child:hover > a::after {
		height: 0 !important;
		background: transparent !important;
	}

	#header .kh-header-call {
		position: relative !important;
		top: auto !important;
		right: auto !important;
		left: auto !important;
		float: none;
		display: -webkit-flex;
		display: flex;
		-webkit-align-items: center;
		align-items: center;
		-webkit-flex: 0 1 auto;
		flex: 0 1 auto;
		min-width: 0;
		margin: 0;
		z-index: 3;
	}

	#header #inquire_us_now,
	#header.fixed-header-scroll #inquire_us_now {
		visibility: visible;
		opacity: 1;
		position: relative !important;
		left: auto !important;
		right: auto !important;
		top: auto !important;
		bottom: auto !important;
		float: none !important;
		transform: none !important;
		margin: 0;
		z-index: 3;
		white-space: nowrap;
		display: -webkit-inline-flex;
		display: inline-flex;
		-webkit-align-items: center;
		align-items: center;
	}

	#header #inquire_us_now p {
		margin: 0;
	}

	#header .mobile-nav {
		display: none;
	}

	#header.kh-call-full #inquire_us_now {
		display: -webkit-inline-flex;
		display: inline-flex;
	}

	#header.kh-call-full #inquire_us_now_res {
		display: none;
	}

	#header.kh-call-compact #inquire_us_now {
		display: none;
	}

	#header.kh-call-compact #inquire_us_now_res {
		display: -webkit-flex;
		display: flex;
		-webkit-align-items: center;
		align-items: center;
		-webkit-justify-content: center;
		justify-content: center;
		position: relative !important;
		top: auto !important;
		right: auto !important;
		left: auto !important;
		float: none !important;
		margin: 0;
		border: 2px solid #fff;
		padding: 5px;
		line-height: 0;
		background: transparent;
		width: auto;
		height: auto;
		box-sizing: border-box;
	}

	#header.kh-call-compact #inquire_us_now_res img {
		display: block;
		width: 22px;
		height: auto;
	}

	#header #menu-main-menu li#menu-item-180 a,
	#header #menu-item-180 a,
	#header li.menu-item-180 a {
		white-space: nowrap;
		margin: 0 !important;
		top: auto !important;
		width: auto !important;
		height: 34px !important;
		min-height: 34px !important;
		max-height: 34px !important;
		padding: 0 12px !important;
		line-height: 1 !important;
		font-size: 13px !important;
		display: -webkit-inline-flex !important;
		display: inline-flex !important;
		-webkit-align-items: center;
		align-items: center;
		-webkit-justify-content: center;
		justify-content: center;
		box-sizing: border-box !important;
		vertical-align: middle;
	}
}

@media only screen and (min-width: 1171px) {
	#header #inquire_us_now {
		display: -webkit-inline-flex;
		display: inline-flex;
		top: auto !important;
		right: auto !important;
	}

	#header #menu-item-180 a,
	#header li.menu-item-180 a {
		padding: 0 16px !important;
	}

	#header:not(.kh-call-compact) #inquire_us_now_res {
		display: none;
	}

	#header .section-header,
	#header .section-header.section-boxed {
		padding-left: 0;
		padding-right: 0;
	}

	.container {
		padding-left: 0;
		padding-right: 0;
	}

	/*
	 * Wide screens: column caps at --kh-content-max (live 1170).
	 * Unbox only pages that have a full-bleed photo section.
	 */
	body:not(.home) #content-container.content-boxed {
		max-width: var(--kh-content-max) !important;
		width: 100% !important;
		margin-left: auto !important;
		margin-right: auto !important;
	}

	body:not(.home):has(.section-full-width > .full-bg-image) #content-container.content-boxed {
		max-width: none !important;
		width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		overflow: visible;
		box-sizing: border-box;
	}
}

@media only screen and (max-width: 1170px) {
	body:not(.home) #content-container.content-boxed {
		width: 100% !important;
		max-width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		box-sizing: border-box;
	}
}

@media only screen and (min-width: 801px) and (max-width: 1170px) {
	#header,
	.fixed-header #header,
	.fixed-header-scroll #header {
		left: 0 !important;
		right: 0 !important;
		width: auto !important;
		max-width: 100vw !important;
		min-width: 0 !important;
		overflow-x: clip;
		overflow-y: visible;
		padding-left: 0 !important;
		padding-right: 0 !important;
		box-sizing: border-box !important;
		background-color: #333333 !important;
	}

	body.home .header-wrapper.intro:not(.fixed-header-scroll) #header:not(.kh-header-solid),
	body:not(.home):has(.aboutus-banner) .header-wrapper.intro:not(.fixed-header-scroll) #header:not(.kh-header-solid) {
		background-color: transparent !important;
	}

	body.home .header-wrapper.intro::after,
	.header-wrapper.intro::after {
		pointer-events: none !important;
	}

	#header .section-header,
	#header .section-header.section-boxed {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		height: auto;
		min-height: 52px;
		padding: 0 16px !important;
		box-sizing: border-box !important;
	}

	#header #logo-container,
	body.home #header #logo-container {
		max-width: none;
	}

	#header #logo-container img {
		width: var(--kh-logo-w) !important;
		max-width: var(--kh-logo-w) !important;
		height: auto !important;
	}

	#header .menu-ul > li > a,
	#header .navigation-container ul.menu-ul > li > a {
		padding-left: 4px !important;
		padding-right: 4px !important;
		font-size: 10px !important;
	}

	#header.kh-call-compact .section-header {
		padding-right: 24px;
	}

	#header.kh-call-compact .kh-header-call {
		margin-right: 4px;
	}

	#header .section-header > .clear,
	#header #navigation-line {
		display: none;
	}

	#header #logo-container,
	body.home #header #logo-container {
		float: none;
		-webkit-flex: 0 0 auto;
		flex: 0 0 auto;
		margin: 0 12px 0 0;
		width: auto;
		max-width: none;
	}

	#header #logo-container img {
		display: block;
		width: var(--kh-logo-w) !important;
		max-width: var(--kh-logo-w) !important;
		height: auto !important;
	}

	#header .navigation-container {
		float: none;
		display: block;
		-webkit-flex: 1 1 auto;
		flex: 1 1 auto;
		min-width: 0;
		margin: 0 12px 0 0;
	}

	#header #menu,
	#header .nav-menu {
		display: block;
		width: 100%;
	}

	#header .menu-ul {
		display: -webkit-flex;
		display: flex;
		-webkit-align-items: center;
		align-items: center;
		-webkit-flex-wrap: nowrap;
		flex-wrap: nowrap;
		-webkit-justify-content: flex-end;
		justify-content: flex-end;
		margin: 0;
		padding: 0;
		width: 100%;
	}

	#header .menu-ul > li,
	#header .navigation-container ul.menu-ul > li {
		float: none;
		display: block;
		-webkit-flex: 0 0 auto;
		flex: 0 0 auto;
		padding: 0;
		top: auto !important;
		position: relative;
	}

	#header .menu-ul > li > a {
		padding: 4px 3px 8px;
		font-size: 10px;
		white-space: nowrap;
	}

	#header #menu-main-menu li#menu-item-180 a,
	#header #menu-item-180 a,
	#header li.menu-item-180 a {
		height: 34px !important;
		min-height: 34px !important;
		max-height: 34px !important;
		padding: 0 8px !important;
		font-size: 11px !important;
		white-space: nowrap;
		width: auto !important;
	}

	#header .kh-header-call {
		position: relative !important;
		top: auto !important;
		right: auto !important;
		-webkit-flex: 0 1 auto;
		flex: 0 1 auto;
		min-width: 0;
		margin-left: auto;
	}

	#header.kh-call-full #inquire_us_now {
		display: -webkit-inline-flex !important;
		display: inline-flex !important;
	}

	#header.kh-call-full #inquire_us_now_res,
	body.home #header.kh-call-full #inquire_us_now_res {
		display: none !important;
	}

	#header.kh-call-compact #inquire_us_now {
		display: none !important;
	}

	#header.kh-call-compact #inquire_us_now_res,
	body.home #header.kh-call-compact #inquire_us_now_res {
		display: -webkit-flex !important;
		display: flex !important;
		-webkit-align-items: center;
		align-items: center;
		-webkit-justify-content: center;
		justify-content: center;
		position: relative !important;
		top: auto !important;
		right: auto !important;
		left: auto !important;
		bottom: auto !important;
		float: none !important;
		margin: 0;
		transform: none !important;
		-webkit-flex: 0 0 auto;
		flex: 0 0 auto;
		z-index: 3;
		border: 2px solid #fff;
		padding: 5px;
		line-height: 0;
		background: transparent;
		width: auto;
		height: auto;
		box-sizing: border-box;
	}

	#header #inquire_us_now_res img,
	body.home #header #inquire_us_now_res img {
		display: block;
		width: 22px;
		height: auto;
	}

	#header .mobile-nav {
		display: none;
	}

	body.home .header-text.section-boxed {
		padding-left: 0;
		padding-right: 0;
		box-sizing: content-box;
		max-width: none;
		width: auto;
		margin-left: 0;
		margin-right: 0;
	}
}

@media only screen and (max-width: 1170px) {
	body.home .header-text.section-boxed {
		box-sizing: content-box;
		padding-left: 0;
		padding-right: 0;
		max-width: 100%;
		width: auto;
	}

	body.home .header-text h1,
	body.home .header-text .typed-me {
		overflow: visible;
		word-break: break-word;
	}
}

@media only screen and (max-width: 800px) {
	#header {
		background-color: #333333;
		padding: 8px 0 !important;
		box-sizing: border-box;
	}

	#header .section-header,
	#header .section-header.section-boxed {
		display: -webkit-flex;
		display: flex;
		-webkit-align-items: center;
		align-items: center;
		-webkit-flex-wrap: nowrap;
		flex-wrap: nowrap;
		-webkit-justify-content: flex-start;
		justify-content: flex-start;
		position: relative;
		overflow: visible;
		min-height: 52px;
		height: auto;
		padding-top: 0;
		padding-bottom: 0;
		padding-left: 20px !important;
		padding-right: 20px !important;
		box-sizing: border-box;
		width: 100%;
		max-width: 100%;
	}

	#header #logo-container,
	body.home #header #logo-container {
		float: none;
		-webkit-flex: 0 0 auto;
		flex: 0 0 auto;
		-webkit-order: 1;
		order: 1;
		min-width: 0;
		max-width: none;
		overflow: visible;
	}

	#header .kh-header-call {
		position: relative;
		top: auto;
		right: auto;
		left: auto;
		float: none;
		display: -webkit-flex;
		display: flex;
		-webkit-align-items: center;
		align-items: center;
		-webkit-flex: 0 0 auto;
		flex: 0 0 auto;
		-webkit-order: 2;
		order: 2;
		margin-left: auto;
		margin-right: 8px;
		z-index: 3;
	}

	#header #logo-container img {
		display: block;
		width: min(200px, 52vw) !important;
		max-width: min(200px, 52vw) !important;
		height: auto !important;
	}

	#header #inquire_us_now {
		display: none;
	}

	#header #inquire_us_now_res,
	body.home #header #inquire_us_now_res {
		display: block;
		position: relative;
		top: auto;
		right: auto;
		left: auto;
		float: none;
		margin: 0 8px 0 0;
		transform: none;
		-webkit-flex: 0 0 auto;
		flex: 0 0 auto;
		z-index: 3;
		border: 2px solid #fff;
		padding: 4px;
		line-height: 0;
		background: transparent;
		width: auto;
		height: auto;
	}

	#header #inquire_us_now_res img,
	body.home #header #inquire_us_now_res img {
		display: block;
		width: 22px;
		height: auto;
	}

	#header .mobile-nav {
		position: relative;
		top: auto;
		right: auto;
		float: none;
		margin: 0;
		transform: none;
		-webkit-flex: 0 0 auto;
		flex: 0 0 auto;
		-webkit-order: 3;
		order: 3;
		z-index: 4;
		display: block;
		width: 32px;
		min-width: 32px;
		height: 32px;
		visibility: visible;
		opacity: 1;
	}

	#header .mob-nav-btn {
		display: block;
		width: 28px;
		height: 22px;
		margin: 5px 0 0;
		padding: 0;
		cursor: pointer;
		border-top: 2px solid #fff;
		border-bottom: 2px solid #fff;
		background: linear-gradient(#fff, #fff) center / 100% 2px no-repeat;
		text-indent: -999px;
		overflow: hidden;
		box-sizing: border-box;
	}

	#header .section-header > .clear,
	#header #navigation-line {
		display: none;
	}

	#header .navigation-container {
		display: none;
	}

	body.home .header-text h1,
	body.home .header-text .typed-me {
		font-size: 42px;
		line-height: 1.2;
		word-break: break-word;
	}

	body.blog .header-wrapper,
	body.blog .header-wrapper.intro,
	body.archive .header-wrapper,
	body.single .header-wrapper,
	body.single-post .header-wrapper {
		padding-top: 0;
		min-height: 0;
		height: auto;
		background: #fff;
		background-color: #fff;
		background-image: none;
	}

	body.fixed-header:not(.home) #header {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 1000;
		height: auto;
		min-height: 0;
		padding: 8px 0 !important;
		box-sizing: border-box;
		background: #333333 none !important;
		background-color: #333333 !important;
	}

	body.home .header-wrapper.intro:not(.fixed-header-scroll) #header:not(.kh-header-solid),
	body:not(.home):has(.aboutus-banner) .header-wrapper.intro:not(.fixed-header-scroll) #header:not(.kh-header-solid) {
		background-color: transparent !important;
	}

	body.fixed-header:not(.home) .page-title {
		padding-top: var(--kh-header-h, 56px);
		padding-bottom: 0;
		min-height: 0;
		box-sizing: border-box;
	}

	body.fixed-header:not(.home) .page-title h1 {
		margin-top: 0;
		padding-top: 16px;
		padding-bottom: 12px;
		color: #fff;
	}

	#header .navigation-container,
	#header #menu {
		display: none !important;
	}

	.mob-nav-menu {
		left: 0 !important;
		right: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box;
		z-index: 10001;
	}

	#header #inquire_us_now {
		display: none !important;
	}

	#header #inquire_us_now_res {
		display: block !important;
	}

	#header .mobile-nav {
		display: block !important;
	}
}

body.home .header-text.section-boxed {
	box-sizing: content-box !important;
}

/*
 * Phase 3–4/6 — About + homepage consult as in-flow components (no page-id).
 * custom_style still paints a 1170px absolute canvas. Below that width,
 * take elements off the canvas (relative, height auto, fluid width).
 * Do not stack columns here — 1170 is a max cap. Rows stay until ≤800.
 */
@media only screen and (max-width: 1170px) {
	.about-approach-sec,
	.about-approach-content,
	.about-faq-content,
	.faq-section,
	.growth-content,
	.about-testi-sec,
	.about-testi-content,
	.about-philosophy-sec,
	.about-growth-sec,
	.about-vision-sec,
	.about-journey-sec,
	.aboutus-container {
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box;
		overflow: visible;
	}

	.about-approach-content,
	.faq-section,
	.about-testi-content {
		height: auto !important;
		min-height: 0 !important;
	}

	.about-approach-content {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: stretch;
		align-items: stretch;
		gap: 24px 16px;
		padding: 48px 16px 40px;
	}

	.about-approach-content .approach-firstbox,
	.about-approach-content .approach-secondbox,
	.about-approach-content .approach-thirdbox,
	.about-approach-content .approach-fourthbox {
		position: relative !important;
		left: auto !important;
		right: auto !important;
		top: auto !important;
		float: none !important;
		-webkit-flex: 1 1 200px;
		flex: 1 1 200px;
		width: auto !important;
		max-width: 280px;
		height: auto !important;
		min-height: 0;
		margin: 0;
	}

	.approach-logo-connector,
	.approach-firstbox-connector,
	.approach-secondbox-connector,
	.approach-thirdbox-connector,
	.approach-fourthbox-connector {
		display: none !important;
	}

	.approach-firstbox-img,
	.approach-secondbox-img,
	.approach-thirdbox-img,
	.approach-fourthbox-img {
		position: relative !important;
		left: auto !important;
		top: auto !important;
		margin: 0 auto 8px;
		display: block;
	}

	.growth-content {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-align-items: flex-start;
		align-items: flex-start;
		gap: 16px;
	}

	.growth-content .first-img,
	.growth-content .second-box,
	.growth-content .third-box,
	.growth-content .fourth-box,
	.growth-content .growth-content-right {
		position: relative !important;
		left: auto !important;
		right: auto !important;
		top: auto !important;
		float: none !important;
		-webkit-flex: 1 1 42%;
		flex: 1 1 42%;
		width: auto !important;
		max-width: 100% !important;
		height: auto !important;
		margin: 0;
		box-sizing: border-box;
		overflow: hidden;
	}

	.growth-content .growth-img {
		position: relative !important;
		left: auto !important;
		right: auto !important;
		top: auto !important;
		float: none !important;
		width: 160px !important;
		max-width: 50%;
		height: auto !important;
		margin: 12px auto;
		overflow: visible;
	}

	.growth-content .growth-img img {
		display: block;
		width: 100%;
		max-width: 308px;
		height: auto;
	}

	.growth-content .fourth-box-connector {
		display: none !important;
	}

	body .about-philosophy-sec .about-philosophycontent {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		gap: 24px;
		width: 100% !important;
		max-width: 100% !important;
		overflow: visible;
	}

	body .about-philosophy-sec .about-philosophycontent-right,
	body .about-philosophy-sec .about-philosophycontent-left {
		-webkit-flex: 1 1 280px;
		flex: 1 1 280px;
		min-width: 0;
		width: auto !important;
		max-width: 100% !important;
		overflow: visible;
	}

	.about-philosophy-sec,
	.about-philosophycontent,
	.about-philosophycontent-right,
	.about-philosophycontent-left,
	.about-growth-sec,
	.growth-content,
	.about-method-content,
	.about-vision-sec,
	.vision-content,
	.about-journey-sec,
	.journey-content {
		position: relative !important;
		left: auto !important;
		right: auto !important;
		top: auto !important;
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
		min-height: 0 !important;
		float: none !important;
		box-sizing: border-box;
	}

	.about-philosophycontent-right ul,
	.about-philosophycontent-right ul li,
	.about-philosophycontent-right .philosophy-one,
	.about-philosophycontent-right .philosophy-two,
	.about-philosophycontent-right .philosophy-three,
	.about-philosophycontent-right .philosophy-four {
		float: none !important;
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
		display: block !important;
		position: relative !important;
		left: auto !important;
		right: auto !important;
		top: auto !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		box-sizing: border-box;
		overflow: visible !important;
		white-space: normal !important;
		word-wrap: break-word;
		overflow-wrap: break-word;
	}

	html body .about-philosophycontent-right,
	html body .about-philosophycontent-right p,
	html body .about-philosophycontent-right h3,
	html body .about-philosophycontent-right li {
		overflow: visible !important;
		overflow-x: visible !important;
		white-space: normal !important;
		word-wrap: break-word;
		overflow-wrap: break-word;
		max-width: 100% !important;
	}

	.philosophy-one,
	.philosophy-two,
	.philosophy-three,
	.philosophy-four {
		float: none !important;
		position: relative !important;
		left: 0 !important;
		right: auto !important;
		top: auto !important;
		-webkit-flex: 1 1 100%;
		flex: 1 1 100%;
		min-width: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		box-sizing: border-box !important;
	}

	.about-philosophycontent-right {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		gap: 16px;
	}

	.vision-content {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-justify-content: center;
		justify-content: center;
		gap: 16px;
	}

	.vision-firstcircle,
	.vision-secondcircle,
	.vision-thirdcircle {
		position: relative !important;
		left: auto !important;
		right: auto !important;
		top: auto !important;
		float: none !important;
		-webkit-flex: 1 1 220px;
		flex: 1 1 220px;
		width: auto !important;
		max-width: 320px;
		height: auto !important;
		margin: 0;
	}

	.about-faq-top,
	.about-faq-connector,
	.faq-top-first,
	.faq-top-second,
	.faq-top-third {
		position: relative !important;
		left: auto !important;
		right: auto !important;
		top: auto !important;
		height: auto !important;
		width: auto !important;
		max-width: 100%;
		margin: 0 auto 12px;
		z-index: 0;
	}

	.faq-section {
		padding-top: 24px !important;
	}

	[id^="wpsm_accordion"] {
		position: relative;
		z-index: 2;
		overflow: visible !important;
		float: none !important;
		width: 100% !important;
	}

	[id^="wpsm_accordion"] .wpsm_panel,
	[id^="wpsm_accordion"] .wpsm_panel-body,
	[id^="wpsm_accordion"] .wpsm_panel-title a {
		overflow: visible !important;
	}

	[id^="wpsm_accordion"] .wpsm_panel-body {
		padding: 16px 18px 20px !important;
		position: relative;
		z-index: 2;
	}

	[id^="wpsm_accordion"] .wpsm_panel-heading {
		z-index: 3;
	}

	.about-testi-content {
		height: auto !important;
		min-height: 0 !important;
		max-width: 100%;
		overflow: visible !important;
		padding-bottom: 36px;
	}

	.about-testi-content .owl-carousel,
	.about-testi-content .owl-stage-outer,
	.about-testi-content .owl-item {
		height: auto !important;
		min-height: 0 !important;
	}

	.about-testi-content .sa_hover_container {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: stretch;
		align-items: stretch;
		box-sizing: border-box;
		padding: 24px 12px 16px !important;
		margin: 0 !important;
	}

	.about-testi-content .testi-left,
	.about-testi-content .testi-right {
		position: relative !important;
		float: none !important;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: column;
		flex-direction: column;
		-webkit-align-items: center;
		align-items: center;
		width: calc(50% - 12px) !important;
		max-width: 360px;
		height: auto !important;
		left: auto !important;
		right: auto !important;
		margin: 0 6px 16px;
		padding: 16px 16px 20px;
		box-sizing: border-box;
	}

	.about-testi-content .client-imgone,
	.about-testi-content .client-imgtwo {
		position: relative !important;
		top: auto !important;
		left: auto !important;
		right: auto !important;
		margin: 0 auto 12px;
		width: 90px;
		height: auto;
		-webkit-order: 1;
		order: 1;
	}

	.about-testi-content .client-imgone img,
	.about-testi-content .client-imgtwo img {
		display: block;
		width: 90px;
		height: auto;
		max-width: 100%;
		border-radius: 50%;
	}

	.about-testi-content p.about-testimonial-words {
		height: auto !important;
		margin: 8px 0 12px !important;
		order: 2;
	}

	.about-testi-content p.about-client-name {
		order: 3;
		margin: 0 0 4px !important;
	}

	.about-testi-content p.about-client-desig {
		order: 4;
		margin: 0;
	}

	.about-testi-content .view-testi-cta,
	.testimonials-view-all-cta {
		position: relative !important;
		top: auto !important;
		left: auto !important;
		right: auto !important;
		display: block;
		clear: both;
		width: auto;
		margin: 8px auto 16px;
		z-index: 8;
		text-align: center;
	}

	.expertise-sec,
	.style2018 .expertise-sec,
	.style2018 .expertise-sec.hm-sec {
		overflow: visible !important;
		height: auto !important;
		max-height: none !important;
		padding-bottom: 48px !important;
	}

	.expertise-sec .expertise-content,
	.expertise-sec.hm-sec .expertise-content,
	.style2018 .expertise-sec .expertise-content,
	.style2018 .expertise-sec.hm-sec .expertise-content {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-wrap: nowrap;
		flex-wrap: nowrap;
		-webkit-align-items: flex-start;
		align-items: flex-start;
		gap: 24px;
		height: auto !important;
		min-height: 0;
		overflow: visible;
		position: relative;
	}

	.expertise-sec .expertise-left,
	.style2018 .expertise-sec .expertise-left,
	.style2018 .expertise-sec.hm-sec .expertise-left {
		float: none !important;
		-webkit-flex: 1 1 0%;
		flex: 1 1 0%;
		min-width: 0;
		width: auto !important;
		max-width: none;
		position: relative !important;
		left: auto !important;
		right: auto !important;
		box-sizing: border-box;
	}

	.expertise-sec .expertise-right,
	.style2018 .expertise-sec .expertise-right,
	.style2018 .expertise-sec.hm-sec .expertise-right {
		position: relative !important;
		top: auto !important;
		right: auto !important;
		left: auto !important;
		-webkit-flex: 0 1 380px;
		flex: 0 1 380px;
		width: auto !important;
		max-width: 42%;
		height: auto !important;
		min-height: 0 !important;
		margin: 0;
		float: none !important;
		box-sizing: border-box;
		overflow: visible;
		touch-action: pan-y;
	}

	body.home .expertise-sec.hm-sec,
	body.home .expertise-right form,
	body.home .cf7sr-g-recaptcha {
		touch-action: pan-y;
	}

	.expertise-sec .expertise-right .text-1,
	.expertise-sec .expertise-right .text-2,
	.expertise-right .wpcf7-form-control {
		width: 100% !important;
		max-width: 100%;
		margin-left: 0 !important;
		margin-right: 0 !important;
		box-sizing: border-box;
	}

	.cf7sr-g-recaptcha,
	.expertise-right .cf7sr-g-recaptcha {
		max-width: 100%;
		overflow: visible;
		-webkit-transform-origin: left top;
		transform-origin: left top;
	}

	.section-full-width,
	.section-light {
		height: auto !important;
		min-height: 0 !important;
		overflow: visible !important;
		background-size: cover;
		background-position: center top;
	}

	body:not(.home) .section-full-width:has(> .full-bg-image) {
		overflow: hidden !important;
		margin-top: 0 !important;
	}

	.section-full-width h1,
	.section-full-width h2,
	.section-full-width h3,
	.section-full-width h4,
	.section-full-width .sub-title,
	.section-full-width .section-title,
	.section-light h1,
	.section-light h2,
	.section-light h3,
	.section-light h4,
	.section-light .sub-title,
	.section-light .section-title,
	.page-wrapper h1,
	.page-wrapper h2,
	.page-wrapper h3,
	.page-wrapper h4,
	.custom-page-content h1,
	.custom-page-content h2,
	.custom-page-content h3,
	.custom-page-content h4 {
		position: relative !important;
		z-index: 2;
		white-space: normal !important;
		height: auto !important;
		max-width: 100%;
		box-sizing: border-box;
		overflow-wrap: break-word;
		word-wrap: break-word;
	}
}

/*
 * Compact / phone: this is the only place columns become a single stack.
 * 1170 is a max canvas cap, not a stack breakpoint (801–1170 keeps rows).
 */
@media only screen and (max-width: 800px) {
	.about-approach-content .approach-firstbox,
	.about-approach-content .approach-secondbox,
	.about-approach-content .approach-thirdbox,
	.about-approach-content .approach-fourthbox {
		-webkit-flex: 1 1 100%;
		flex: 1 1 100%;
		width: 100% !important;
		max-width: 100%;
	}

	.about-testi-content .testi-left,
	.about-testi-content .testi-right {
		width: 100% !important;
		max-width: 100%;
		margin-left: 0;
		margin-right: 0;
	}

	.growth-content .first-img,
	.growth-content .second-box,
	.growth-content .third-box,
	.growth-content .fourth-box,
	.growth-content .growth-content-right {
		-webkit-flex: 1 1 100%;
		flex: 1 1 100%;
		width: 100% !important;
	}

	body .about-philosophy-sec .about-philosophycontent-left,
	body .about-philosophy-sec .about-philosophycontent-right,
	.philosophy-one,
	.philosophy-two,
	.philosophy-three,
	.philosophy-four,
	.vision-firstcircle,
	.vision-secondcircle,
	.vision-thirdcircle {
		-webkit-flex: 1 1 100%;
		flex: 1 1 100%;
		width: 100% !important;
		max-width: 100%;
	}

	.expertise-sec .expertise-content,
	.expertise-sec.hm-sec .expertise-content,
	.style2018 .expertise-sec .expertise-content,
	.style2018 .expertise-sec.hm-sec .expertise-content {
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-flex-direction: column;
		flex-direction: column;
	}

	.expertise-sec .expertise-left,
	.style2018 .expertise-sec .expertise-left,
	.style2018 .expertise-sec.hm-sec .expertise-left,
	.expertise-sec .expertise-right,
	.style2018 .expertise-sec .expertise-right,
	.style2018 .expertise-sec.hm-sec .expertise-right {
		-webkit-flex: 1 1 100%;
		flex: 1 1 100%;
		width: 100% !important;
		max-width: 100%;
		margin: 0;
	}

	.expertise-sec .expertise-right,
	.style2018 .expertise-sec .expertise-right,
	.style2018 .expertise-sec.hm-sec .expertise-right {
		margin-top: 24px;
	}
}

@media only screen and (max-width: 767px) {
	/*
	 * Do not use `.page-wrapper ul li` here. Portfolio paging is a plain
	 * ul inside .page-wrapper, and the cloned mobile menu is too, so that
	 * selector stacks 1/2/3 with bullets.
	 */
	.post-content ul li,
	.custom-page-content ul li,
	.healthcare ul li,
	ul.left-bullets li,
	ul.right-bullets li,
	ul.default-bullets li {
		list-style-position: outside !important;
		margin-left: 1.25em !important;
		padding-left: 0.35em !important;
		height: auto !important;
		float: none !important;
		width: auto !important;
		max-width: 100%;
		text-align: left !important;
		box-sizing: border-box;
		display: list-item;
	}

	ul.left-bullets,
	ul.right-bullets,
	ul.default-bullets {
		float: none !important;
		display: block;
		width: auto !important;
		max-width: 100%;
		text-align: left !important;
		margin: 12px 16px 12px 20px !important;
		padding-left: 0.5em;
	}

	.cf7sr-g-recaptcha {
		-webkit-transform: scale(0.86);
		transform: scale(0.86);
		-webkit-transform-origin: 0 0;
		transform-origin: 0 0;
	}

	/*
	 * The content-bullet rule above also matches portfolio paging and the
	 * cloned mobile menu, so 1/2/3 stack and the menu picks up bullets.
	 */
	.page-wrapper .pg-pagination ul,
	.page-wrapper #blog-pagination ul,
	.page-wrapper .wp-pagenavi {
		display: -webkit-flex !important;
		display: flex !important;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-align-items: center;
		align-items: center;
		list-style: none !important;
		float: none !important;
		width: 100% !important;
		max-width: 100%;
		margin: 16px auto !important;
		padding: 0 !important;
		text-align: center !important;
	}

	.page-wrapper .pg-pagination li,
	.page-wrapper #blog-pagination li {
		display: -webkit-inline-flex !important;
		display: inline-flex !important;
		list-style: none !important;
		float: none !important;
		width: auto !important;
		margin: 4px !important;
		padding: 0 !important;
		height: auto !important;
	}

	.page-wrapper .pg-pagination li::marker,
	.page-wrapper #blog-pagination li::marker {
		content: none;
	}

	.page-wrapper .mob-nav-menu,
	.page-wrapper .mob-nav-menu ul {
		list-style: none !important;
		margin: 0 !important;
		padding: 0 !important;
		width: 100% !important;
		float: none !important;
		box-sizing: border-box;
	}

	.page-wrapper .mob-nav-menu li,
	.page-wrapper #header .menu-ul > li {
		display: block !important;
		list-style: none !important;
		float: none !important;
		width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	.page-wrapper .mob-nav-menu li::marker,
	.page-wrapper #header .menu-ul > li::marker {
		content: none;
	}
}

@media only screen and (max-width: 400px) {
	#content-container {
		max-width: 100%;
		overflow-x: hidden;
	}

	.cf7sr-g-recaptcha,
	.wpcf7-form-control-wrap.cf7sr-recaptcha {
		max-width: 100% !important;
		overflow: hidden;
		-webkit-transform-origin: 0 0;
		transform-origin: 0 0;
	}

	.cf7sr-g-recaptcha {
		-webkit-transform: scale(0.78);
		transform: scale(0.78);
	}

	.container,
	html body .halfwidth,
	.contact-area .halfwidth,
	.halfwidth {
		float: none !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 12px !important;
		padding-right: 12px !important;
		box-sizing: border-box !important;
		overflow-x: hidden;
	}

	.wpcf7-form-control-wrap.cf7sr-recaptcha iframe {
		max-width: 100% !important;
	}
}

.app-content .app-content-container,
.android-app-content .app-content-container {
	width: 100%;
	max-width: 1170px;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
	padding-left: 16px;
	padding-right: 16px;
}

body.home .hm-full-wrapper.hm-portfolio-section {
	overflow: hidden;
}

body.home .our-expertise-new {
	clear: both;
}

body.home .our-expertise-new::after {
	content: "";
	display: table;
	clear: both;
}

body.home .hm-full-wrapper.grey-row.hm-kays-blogs {
	height: auto;
	overflow: visible;
}

body.home .hm-kays-blogs .fixed-content-div {
	position: relative;
	height: auto;
}

body.home .hm-kays-blogs .kays-why-card {
	position: relative;
	top: auto;
	right: auto;
	left: auto;
	float: none;
	height: auto;
	width: 100%;
	box-sizing: border-box;
}

.wpcf7-form-control-wrap > span.wpcf7-not-valid-tip ~ span.wpcf7-not-valid-tip {
	display: none !important;
}

#cookie-notice {
	z-index: 99990 !important;
	box-sizing: border-box;
	padding-right: 120px;
	padding-bottom: 12px;
}

/* Hidden notice still painted a 12px black strip under the copyrights bar. */
#cookie-notice.cookie-notice-hidden,
#cookie-notice.cookie-notice-hidden.cookie-revoke-hidden {
	padding: 0 !important;
	height: 0 !important;
	min-height: 0 !important;
	overflow: hidden !important;
	border: 0 !important;
	visibility: hidden;
}

#cookie-notice #cn-more-info,
#cookie-notice a.cn-more-info {
	position: relative;
	z-index: 2;
}

a.button[href*="zohopublic"],
a.button[href*="recruit"],
a.button[href*="Portal"] {
	position: relative !important;
	z-index: 6;
	pointer-events: auto !important;
}

/*
 * Request-a-consult form: Name/Email, Website/Attachment+Browse, and
 * Message must share one right edge. custom_style still uses 86%/252px
 * content-box widths, so Browse paints past Message.
 */
.consult-form {
	box-sizing: border-box;
	max-width: 100%;
}

.consult-form .custom_contact_form {
	display: -webkit-grid;
	display: grid;
	-webkit-grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	-webkit-column-gap: 12px;
	column-gap: 12px;
	-webkit-row-gap: 10px;
	row-gap: 10px;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

.consult-form .custom_contact_form > .halfwidth,
.consult-form .custom_contact_form > .halfwidthattachment,
.consult-form .custom_contact_form > .fullwidth,
.consult-form .custom_contact_form > p.fullwidth {
	float: none !important;
	width: auto !important;
	max-width: 100%;
	height: auto !important;
	min-height: 0;
	min-width: 0;
	margin: 0;
	box-sizing: border-box;
}

.consult-form .custom_contact_form > .fullwidth,
.consult-form .custom_contact_form > p.fullwidth,
.consult-form .custom_contact_form > .content-clear {
	-webkit-grid-column: 1 / -1;
	grid-column: 1 / -1;
}

.consult-form .custom_contact_form input[type="text"],
.consult-form .custom_contact_form input[type="email"],
.consult-form .custom_contact_form input[type="url"],
.consult-form .custom_contact_form input[type="tel"],
.consult-form .custom_contact_form textarea,
.consult-form .custom_contact_form textarea#usermessage,
.consult-form .custom_contact_form #uploadtextfield,
.consult-form .custom_contact_form div #uploadtextfield {
	width: 100% !important;
	max-width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	box-sizing: border-box !important;
	height: 55px !important;
	float: none !important;
}

.consult-form .custom_contact_form textarea#usermessage {
	height: 96px !important;
}

.consult-form .uploadfieldtrick,
.consult-form .halfwidthattachment .uploadfieldtrick {
	display: block !important;
	position: relative;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	box-sizing: border-box !important;
}

.consult-form .uploadfieldtrick > .wpcf7-form-control-wrap,
.consult-form .uploadfieldtrick input[type="file"] {
	position: absolute !important;
	left: 0;
	top: 0;
	width: 1px !important;
	height: 1px !important;
	opacity: 0;
	overflow: hidden !important;
}

.consult-form .uploadfieldtrick .group-items,
.consult-form .halfwidthattachment .group-items {
	display: -webkit-flex !important;
	display: flex !important;
	-webkit-flex: 1 1 auto;
	flex: 1 1 auto;
	-webkit-align-items: stretch;
	align-items: stretch;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0;
	margin: 0 !important;
	box-sizing: border-box !important;
	gap: 0;
}

.consult-form .uploadfieldtrick .group-input,
.consult-form .halfwidthattachment .group-input,
.consult-form .uploadfieldtrick .group-input .wpcf7-form-control-wrap,
.consult-form .halfwidthattachment .group-input .wpcf7-form-control-wrap {
	-webkit-flex: 1 1 0%;
	flex: 1 1 0%;
	min-width: 0;
	width: 100% !important;
	display: block !important;
	box-sizing: border-box;
}

.consult-form .uploadfieldtrick .group-btn,
.consult-form .halfwidthattachment .group-btn,
.consult-form #uploadbrowsebutton {
	-webkit-flex: 0 0 auto;
	flex: 0 0 auto;
	margin: 0 !important;
	height: 55px !important;
	box-sizing: border-box;
}

@media only screen and (max-width: 800px) {
	.consult-form {
		width: 100% !important;
		max-width: 100%;
	}

	.consult-form .custom_contact_form {
		-webkit-grid-template-columns: minmax(0, 1fr);
		grid-template-columns: minmax(0, 1fr);
	}
}

/*
 * ≤767 list reset (.page-wrapper ul li) was also hitting portfolio
 * pagination and the cloned mobile menu, so page numbers stacked with
 * bullets and the open menu sat in a narrow column beside the page.
 */
@media only screen and (max-width: 800px) {
	.page-wrapper .pg-pagination {
		float: none !important;
		width: 100% !important;
		clear: both;
		text-align: center;
		position: relative;
		top: auto;
	}

	.page-wrapper .pg-pagination ul {
		display: -webkit-flex !important;
		display: flex !important;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-justify-content: center;
		justify-content: center;
		list-style: none !important;
		margin: 12px auto !important;
		padding: 0 !important;
		width: auto !important;
		max-width: 100%;
	}

	.page-wrapper .pg-pagination li {
		display: -webkit-inline-flex !important;
		display: inline-flex !important;
		list-style: none !important;
		float: none !important;
		width: auto !important;
		margin: 4px !important;
		padding: 0 !important;
		height: auto !important;
	}

	.page-wrapper .pg-pagination li::marker {
		content: none;
	}

	.page-wrapper .mob-nav-menu,
	.page-wrapper .mob-nav-menu ul,
	.page-wrapper .mob-nav-menu li,
	.page-wrapper #header #menu,
	.page-wrapper #header #menu ul,
	.page-wrapper #header #menu li {
		list-style: none !important;
		margin-left: 0 !important;
		padding-left: 0 !important;
	}

	.page-wrapper .mob-nav-menu {
		position: absolute;
		left: 0 !important;
		right: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box;
		z-index: 10020;
	}

	.page-wrapper .mob-nav-menu ul {
		width: 100% !important;
		margin: 0 !important;
	}

	#header .navigation-container {
		display: none !important;
	}
}

.scroll-to-top {
	right: 12px !important;
	left: auto !important;
	margin-bottom: 0 !important;
}