/**
 * KH Components
 *
 * Shared component styles.
 */

@import url("components/slider-navigation.css");
@import url("components/venture-slider.css");
@import url("components/testimonial-slider.css");
@import url("components/visual-moments.css");
@import url("components/marquee.css");
@import url("components/bleed.css");
@import url("components/timeline.css");

:root {
	--kh-container-width: 1600px;

	--kh-outer-width:   1664px;
  --kh-outer-padding: 32px;

	--kh-slider-edge-gap: 32px;

	--kh-nav-size: 50px;
	--kh-nav-size-mobile: 40px;
	--kh-nav-border-radius: 50%;
	--kh-nav-blur: 12px;

  --kh-container-padding-mobile: 16px;
	--kh-container-padding-tablet: 32px;
  --kh-bleed-col-gap: 60px;
  --kh-section-padding-v: 80px;
  --kh-bleed-breakpoint: 1366px;
}

.elementor-widget-n-accordion {
	--n-accordion-title-justify-content: space-between;
	--n-accordion-title-icon-order: 2;
}

.hfe-breadcrumbs a {
	text-decoration: none;
}

.kh-vision-mission {
	position: relative;
}

.kh-vision-mission::before {
	content: "";
	position: absolute;
	top: var(--padding-block-start);
	left: 50%;
	width: 1px;
	height: calc(100% - var(--padding-block-start) - var(--padding-block-end));
	background: #C6A65D; /* Gold */
	transform: translateX(-50%);
}

.kh-vision-mission::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 48px;
	height: 48px;
	transform: translate(-50%,-50%);
	background: url('/wp-content/uploads/custom-upload/star.png') center/32px no-repeat;
	background-color: #F8F5F0;
}

@media (max-width:1024px){

	.kh-vision-mission::before{
		top: 50%;
		left: var(--padding-inline-start);
		width: calc(100% - var(--padding-inline-start) - var(--padding-inline-end));
		height: 1px;

		transform: translateY(-50%);
	}

	.kh-vision-mission::after{
		top: 50%;
		left: 50%;

		transform: translate(-50%, -50%);
	}

}

/* Square gallery */
.sq-gallery .gallery {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 10px !important;
}

.sq-gallery .gallery-item {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

.sq-gallery .gallery-icon {
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
  display: block !important;
}

.sq-gallery .gallery-icon img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

.catering-counter .elementor-counter-number-suffix {
	color: #E54B37;
}
