/*----------------------------------*/
/*BODY AND HEADINGS*/
/*----------------------------------*/

:root {
	--body: #66766C;
	--primary: #B37B64;
	--secondary: #66766C;
	--white: #ffffff;
	--font: "Manrope", sans-serif;
}

body
{
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-size: 18px;
	line-height: 28px;
	font-family: var(--font);
	 color: var(--body);
	font-weight: normal;

}






a
{
	text-decoration:none;
	color:var(--primary);
	transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    cursor: pointer;
}

.devbtns a
{
	display: block;
	background-color: var(--secondary);
	color: #fff;
	padding: 20px;
	margin-bottom: 10px;
}

h1, h2, h3, p, ul, table
{
	margin-bottom:20px;
}

h1
{
	color:var(--primary);
	font-size:55px;
	line-height:60px;
	font-family: 'Brooklyn';
font-weight: 600;
font-style: normal;
}

h1 span
{
	font-weight: 600;
	color: #fff !important;
}

.largetext
{
	font-size:82px;
	line-height:90px;
}

.largetext span
{
	color:var(--secondary) !important;
}

h2
{
	color:var(--secondary);
	font-size:32px;
	line-height:45px;
	font-family: 'Brooklyn';
font-weight: 600;
font-style: normal;
}

h3
{
	color:var(--primary);
	font-size:26px;
	line-height:35px;
	font-family: 'Brooklyn';
font-weight: 600;
font-style: normal;
}

h4
{
	color:#A1A69F;
	font-size:14px;
	line-height:40px;
	font-weight: 600;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.border-round
{
	border-radius: 30px;
}

h4 i
{
	color:var(--secondary);
	padding-right: 10px;
}

h5
{
	font-family: var(--font);
font-weight: 600;
font-style: normal;
	font-size:26px;
}

.border
{
	border-bottom:solid 10px var(--secondary);
}

.rounded
{
	border-radius: 40px;
}

.rounded2
{
	border-radius: 40px 40px 40px 300px;
}

.testbox
{
	padding:40px;
	background-color: var(--secondary);
	color:#fff;
	margin:80px;
}

.text-block
{
	margin-bottom:100px;
	margin-top: 100px;
}

.prefooter
{
	background-color:var(--secondary);
	color: #fff;
	padding: 40px;
	border-radius: 40px;
	position: relative;
	margin-top: 60px;
	margin-bottom: 40px;
}

.theimg
{
	position: absolute;
	bottom:-8px;
	right: 0px;
}

.prefooter h3
{

	color: #fff;
}

.prefooter .linkprimary
{

	background-color:var(--primary);
	margin-bottom: 0px;
}

/*----------------------------------*/
/*BLOCKS*/
/*----------------------------------*/

.block1
{
	background-color:var(--secondary);
	color:var(--white);
}

.block2
{
	background-color:#EEF2F8;
}

.block3
{
	background-color:var(--primary);
	color:var(--white);
}

.block1 h1, .block1 h2, .block1 h3
.block3 h1, .block3 h2, .block3 h3,
.hero-curve h1, .hero-curve h2, .hero-curve h3
{
	color:var(--white);
}

.block1 a
{
	
}

.block1 h4
{
	color:var(--primary);
}

.curvebg:after
{
	content: "";
	background-image:url("../images/curve1.svg");
	background-repeat: no-repeat;
	background-position: bottom center;
	background-size: cover;
	width: 100%;
	height:200px;
	display: block;
	background-color: #fff;
	margin-top: -60px;
}


.curvebg:before
{
	content: "";
	background-image:url("../images/curve2.svg");
	background-repeat: no-repeat;
	background-position: top center;
	background-size: cover;
	width: 100%;
	height:200px;
	display: block;
	background-color: #fff;
	margin-bottom: -60px;
}


.slantbg:after
{
	content: "";
	background-image:url("../images/slant2.svg");
	background-repeat: no-repeat;
	background-position: bottom center;
	background-size: cover;
	width: 100%;
	height:200px;
	display: block;
	background-color: #fff;
	margin-top: -60px;
}


.slantbg:before
{
	content: "";
	background-image:url("../images/slant1.svg");
	background-repeat: no-repeat;
	background-position: top center;
	background-size: cover;
	width: 100%;
	height:200px;
	display: block;
	background-color: #fff;
	margin-bottom: -60px;
}



.slantbg2:after
{
	content: "";
	background-image:url("../images/slant3.svg");
	background-repeat: no-repeat;
	background-position: bottom center;
	background-size: cover;
	width: 100%;
	height:200px;
	display: block;
	background-color: #fff;
	margin-top: -60px;
}


.slantbg2:before
{
	content: "";
	background-image:url("../images/slant4.svg");
	background-repeat: no-repeat;
	background-position: top center;
	background-size: cover;
	width: 100%;
	height:200px;
	display: block;
	background-color: #fff;
	margin-bottom: -60px;
}


.hero-curve {
  position: relative;
  height: 600px;
  background: var(--primary);
  color: var(--white);
  z-index: 1;
	color:var(--white);
	padding-top: 100px;
}

.hero-curve::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 90px;
  z-index: 1;
  background: var(--white);
  clip-path: ellipse(130vw 100vw at 50vw 100vw);
}

.hero-curve div {
  height: calc(100vh - 650px);
  color: var(--white);
}




.hero-curve-res {
  position: relative;
  height: 600px;
  background: var(--secondary);
  color: var(--white);
  z-index: 1;
	padding-top: 120px;
}

.hero-curve-res::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 80px;
    z-index: 1;
    background: var(--white);
    clip-path: ellipse(300vw 100vw at 50vw 101vw);
}

.hero-curve-res div {
  height: calc(100vh - 650px);
  color: var(--white);
}

/*----------------------------------*/
/*PARALLAX ITEMS HERO*/
/*----------------------------------*/

#parallaxitems {
  position: absolute;
  width: 100%;
  height: 900px;
  background-image: url(../images/d1.png), url(../images/d2.png), url(../images/d3.png);
  background-repeat: no-repeat;
  background-position: center;
  background-position: 50% 50%;
}

/*----------------------------------*/
/*ZOOM WRAP*/
/*----------------------------------*/

.heroslideshow {
width: 100vw;
height: 33vw;
background-size: cover;
background-repeat: no-repeat;
animation: heroslideshow 15s ease-in-out infinite;
}

@keyframes heroslideshow {
0% { background-image: url("../images/heroes/home.jpg"); }
33% { background-image: url("../images/heroes/home2.jpg"); }
66% { background-image: url("../images/heroes/home3.jpg"); }
100% { background-image: url("../images/heroes/home.jpg"); }
}


/*----------------------------------*/
/*ZOOM WRAP*/
/*----------------------------------*/

.zoomwrap {
  overflow: hidden;
  position: relative;
	-webkit-transition: .4s all;
}
.zoomwrap img {
  transition: transform .4s;
  width: 100%;
}
.zoomwrap:hover img {
  transform: scale(1.2);
}

.zoomtext
{
	display: none;
}

.zoomwrap:hover .zoomtext
{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	display: block;
	color:#fff;
	-webkit-filter: brightness(100%);
}

.zoomwrap:hover
{
	-webkit-filter: brightness(90%);
}

/*----------------------------------*/
/*HOVER SLIDE UNDER*/
/*----------------------------------*/

.slideout
{
  position: relative;
	z-index: 2;
}

.slideouttext
{
	position: absolute;
	background-color:var(--secondary);
	text-align: center;
	padding: 20px;
	border-radius: 0px 0px 20px 20px;
	width: 100%;
	margin: auto;
	-webkit-transition: .4s all;
	opacity: 0;
	z-index: 0;
	bottom:-10px;
	color: var(--white);
}

.slideout:hover .slideouttext
{
	bottom:-20px;
	opacity: 1;
}

/*----------------------------------*/
/*HOVER BUTTON*/
/*----------------------------------*/

.hovercenter
{
    position: relative;
	z-index: 2;
}

.hovercentertext
{
	position: absolute;
	top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	display: block;
	color:#fff;
	-webkit-transition: .4s all;
	background-color:var(--secondary);
	padding: 20px;
	font-size: 32px;
	opacity: 0;
}

.hovercenter:hover .hovercentertext
{
	opacity: 1;
}


/*----------------------------------*/
/*HOVER COLOUR*/
/*----------------------------------*/

.hovercolor
{
  background-color:var(--secondary);
  color: #fff;
  display: inline-block;
  overflow: hidden;
  position: relative;
  text-align: center;
  width: 100%;
}

.hovercolor::before,
.hovercolor::after {
  background-color:var(--secondary);
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  content: '';
  transition: all 0.3s ease;
  z-index: 1;
  opacity: 0;
  transform: scaleY(2);
}

.hovercolor img {
  vertical-align: top;
  max-width: 100%;
  backface-visibility: hidden;
}

.hovercolortext h3
{
	position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  align-items: center;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  line-height: 1.1em;
  opacity: 0;
  z-index: 2;
  transition-delay: 0.1s;
  font-size: 24px;
}

.hovercolor:hover::before,
.hovercolor:hover::after {
  transform: scale(1);
  opacity: 1;
}

.hovercolor:hover > img {
  opacity: 0.7;
}

.hovercolor:hover h3 {
  opacity: 1;
	color: #fff !important;
}


/*----------------------------------*/
/*FANCYBOX*/
/*----------------------------------*/

#myCarousel {
        --f-carousel-slide-width: 50%;
        --f-carousel-spacing: 10px;
		height: 600px;
	
		--f-button-prev-pos: 5rem;
		--f-button-next-pos: 5rem;

		--f-button-bg: #fff;
		--f-button-color: #333;

		--f-button-width: 48px;
		--f-button-height: 48px;
		--f-button-border-radius: 50%;

		--f-button-svg-width: 27px;
		--f-button-svg-height: 27px;
		--f-button-svg-stroke-width: 1.5;

		--f-button-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 4px 6px -1px,
		rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
      }

      #myCarousel .f-carousel__slide {
        padding: 50px;
        background: #eee;
      }

		#myCarousel .f-carousel__dots
		{
			display: none;
		}





#myCarousel2 {
        --f-carousel-slide-width: 33%;
        --f-carousel-spacing: 10px;
		height: 500px;
	
		--f-button-prev-pos: 2rem;
		--f-button-next-pos: 2rem;

		--f-button-bg: #fff;
		--f-button-color: #333;

		--f-button-width: 48px;
		--f-button-height: 48px;
		--f-button-border-radius: 50%;

		--f-button-svg-width: 27px;
		--f-button-svg-height: 27px;
		--f-button-svg-stroke-width: 1.5;

		--f-button-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px,
		rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 4px 6px -1px,
		rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
      }

      #myCarousel2 .f-carousel__slide {
      }

		#myCarousel2 .f-carousel__dots
		{
			display: none;
		}




#myCarousel3 {
  --f-carousel-slide-width: calc((100% - 60px) / 4);
  --f-carousel-spacing: 20px;

  --f-button-next-pos: 1rem;
  --f-button-prev-pos: 1rem;

  --f-button-width: 44px;
  --f-button-height: 44px;
  --f-button-border-radius: 50%;

  --f-button-color: #fff;
  --f-button-hover-color: #fff;
  --f-button-active-color: #fff;

  --f-button-bg: rgba(0, 0, 0, 0.5);
  --f-button-hover-bg: rgba(0, 0, 0, 0.8);
  --f-button-active-bg: rgba(0, 0, 0, 0.8);

  --f-button-svg-width: 22px;
  --f-button-svg-height: 22px;
  --f-button-svg-stroke-width: 3;
}

#myCarousel3 .f-carousel__slide {
  display: flex;
  align-items: center;
  justify-content: center;
}

.f-parallax {
  overflow: hidden;
  aspect-ratio: 2/3;
}

.f-parallax img {
  max-width: none;
  width: 200%;
  height: 100%;
  object-fit: cover;
  margin-left: calc(var(--f-progress2, 0%) - 35%);
  transform: translateX(calc(var(--f-progress1, 0%)));
}

/*----------------------------------*/
/*OFFER*/
/*----------------------------------*/

.offer
{
	background-color:var(--secondary);
	display: block;
	text-align: center;
	color: #fff;
	padding: 10px 0px;
}

.offer span
{
	background-color:#000;
	padding: 4px 12px;
	font-size: 13px;
	border-radius: 10px;
	margin-right: 20px;
}

.offer:hover
{
	background-color:#333;
}

.offer:hover span
{
	background-color:var(--secondary);
}

/*----------------------------------*/
/*PREHEADER*/
/*----------------------------------*/

.preheader
{
	background-color:var(--primary);
	z-index:999;
	font-size:16px;
	color: var(--white);
	padding: 10px 0px;
}

.preheader p
{
	margin-bottom: 0px;
}

.preheader a
{
	color: var(--white);
	
}

.preheader a:hover
{
	color: var(--secondary);
}

.preheader a:hover i
{
	color: var(--white);
}

.preheader .right a
{
	padding-left: 10px;
}

.preheader i
{
	padding-right: 10px;
	color: var(--secondary);
}

.headerolditems a
{
	color: var(--secondary);
	margin-left: 20px;
}

.headerolditems i
{
	color: var(--primary);
}

/*----------------------------------*/
/*HEADER*/
/*----------------------------------*/

.header
{
	background-color:#ffffff;
	padding-top:30px;
	padding-bottom: 30px;
	z-index:999;	
}

.header .sectionmax
{
	position: relative;
}

.header i
{
	color: var(--primary);
	margin-right: 10px;
}

.header .tel
{
	display: inline-block;
	margin-right: 20px;
	padding-top: 30px;
	font-family: "adobe-garamond-pro", serif;
font-weight: 400;
font-style: normal;
	font-size: 24px;
}

.header .email
{
	display: inline-block;
	padding-top: 30px;
	font-family: "adobe-garamond-pro", serif;
font-weight: 400;
font-style: normal;
	font-size: 24px;
}


.topbuttons .book
{
	position: absolute;
	top:-25px;
	right:150px;
}

.topbuttons .book a
{
	background-color: #7CBA52;
	color: #fff;
	border-radius: 0px 0px 10px 10px;
	padding: 10px 20px;
	font-size: 16px;
}

.topbuttons .emer
{
	position: absolute;
	top:-25px;
	right:0px;
}

.topbuttons .emer a
{
	background-color: #AC3636;
	color: #fff;
	border-radius: 0px 0px 10px 10px;
	padding: 10px 20px;
	font-size: 16px;
}


.headerdark
{
	background-color:var(--primary);
}


.header .right h2
{
	margin-bottom: 0px;
	font-weight: 300;
}

.header .right p
{
	margin-bottom: 0px;
}

.header .center 
{
	padding-top: 20px;
}

/*----------------------------------*/
/*HEADER ON TOP*/
/*----------------------------------*/

.headerontop
{
	padding-top:40px;
	padding-bottom: 20px;
	z-index:999;
	margin-top:0px;
	position:absolute;
	transition: .5s;
}

.headerontop a
{
	color: #fff !important;
}

.sticky {
  position: fixed;
  top: 0;
background-color:none;
	padding-top:0px;
	padding-bottom: 0px;
	margin-top:0px;
	transition: .5s;
  
}

/*----------------------------------*/
/*LAYERED IMAGES*/
/*----------------------------------*/

.layered
{
	position: relative;
}

.layered .layer1
{
	
}

.layered .layer2
{
	position: absolute;
	width: 300px;
	bottom:200px;
	right:-100px;
}

.layered .layer3
{
	position: absolute;
	width: 300px;
	top:100px;
	left:-100px;
}

.herolayer
{
	position: relative;
}

.herolayer .layer2
{
	position: absolute;
	width: 300px;
	bottom:200px;
	right:-100px;
}

.herolayer .layer3
{
	position: absolute;
	width: 300px;
	top:0px;
	left:-100px;
}


/*----------------------------------*/
/*GENERAL GSAP*/
/*----------------------------------*/

.gasp_prt_l
{
	margin-left: 150px;
}

.gasp_prt_l2
{
	margin-left: 150px;
}

.gsap_slidein_right
{
	
}

.gsap_slidein_left
{
	
}



/*----------------------------------*/
/*FOOTER REVEAL
/*----------------------------------*/


.page-content {
  min-height: 150vh;
  padding: 80px 20px;
  background: #f2f2f2;
}

.footer-reveal {
  position: relative;
  height: 100vh;
  overflow: hidden;
}

.footer-cover {
  background: #fff;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 2;
  padding: 2rem;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
}

.footer-r {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: #111;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}

/*----------------------------------*/
/*PARALLAX SECTION
/*----------------------------------*/


.parallax-section {
  position: relative;
  height: 100vh;
  overflow: hidden;
}

.parallax-image {
  background-image: url('https://images.unsplash.com/photo-1740968786458-9bf66e5e0bb4?q=80&w=4071&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D');
  background-size: cover;
  background-position: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 150%; /* Larger than container to allow vertical movement */
  z-index: -1;
}

.parallax-content {
  position: relative;
  padding: 5rem 2rem;
  color: #fff;
  text-align: center;
  z-index: 1;
}

/*----------------------------------*/
/*GSAP LAYERED CARDS*/
/*----------------------------------*/

.container {
  padding: 100px 40px;
  background-color: #ffabab;
  display: flex;
  flex-direction: column;
  gap: 32px;
  margin-bottom: 275px;
}

.card {
  height: 554px;
  border: solid 8px green;
  border-radius: 40px;
  background-color: red;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: var(--font);
  font-size: 4rem;
  font-weight: 700;
  pointer-events: none;
}


/*----------------------------------*/
/*FAN IMAGES EFFECT
/*----------------------------------*/


.fan-container {
      
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .fan-wrapper {
      position: relative;
      width: 600px;
      height: 700px; /* 3x5 aspect ratio */
    }

    .fan-image {
      position: absolute;
      width: 100%;
      height: 100%;
      border-radius: 24px;
      object-fit: cover;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
      transform-origin: 50% 66%; /* rotation point 2/3 down */
      will-change: transform;
    }

    .fan-image.bottom {
      z-index: 0;
    }

    .fan-image.top {
      z-index: 1;
    }

/*----------------------------------*/
/*RIPPLE IN TEXT
/*----------------------------------*/

.ripple-text span {
    display: inline-block;
    opacity: 0; /* Initially hidden */
    transform: translateY(-10px); /* Moves in from above */
  }

.skew-text span {
    display: inline-block;
    opacity: 0;
    transform: translateX(-20px) skewX(10deg);
  }

.glitch-text span {
    display: inline-block;
    opacity: 0;
    filter: blur(5px);
    transform: scale(1.3);
  }

.color-text {

      color: #eee; /* Start as light gray */
    }

    .color-text span {
      display: inline-block;
      color: #eee; /* Each word starts in light gray */
    }


/*----------------------------------*/
/*PINNED SECTION*/
/*----------------------------------*/


.scroll-section {
      display: flex;
      max-width: 100%;
      margin: 0 auto;
      height: auto;
    }

    .image-column {
      width: 50%;
      position: relative;
    }

    .image-column img {
      width: 100%;
      height: 100vh;
      object-fit: cover;
      border-right: 5px solid #1e3a8a;
    }

    .text-column {
      width: 50%;
      display: flex;
      flex-direction: column;
      padding: 0 20px;
    }

    .text-block-pin {
      min-height: 100vh;
      background: #1e3a8a; /* Blue */
      color: #fff;
      border-radius: 8px;
      margin: 40px 0;
      padding: 60px 40px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    }

    .text-block-pin h3 {
      font-size: 2rem;
      margin-bottom: 20px;
    }

    .text-block-pin p {
      font-size: 1.2rem;
      line-height: 1.6;
    }

/*----------------------------------*/
/*ANOTHER PINNED SECTION*/
/*----------------------------------*/


    .dual-layout {
      display: flex;
      width: 100%;
    }

    .side-text {
      width: 50%;
      background: #0f172a;
      color: #ffffff;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      padding: 80px 40px;
      position: relative;
      overflow-y: auto;
      max-height: 100vh; /* Make the pinned content scrollable if taller */
    }

    .side-text h2 {
      font-size: 2.2rem;
      line-height: 1.4;
      max-width: 400px;
      margin-bottom: 30px;
    }

    .text-block2 {
      font-size: 1rem;
      line-height: 1.6;
      max-width: 500px;
      color: #dbeafe;
    }

    .scroll-gallery {
      width: 50%;
      display: flex;
      flex-direction: column;
    }

    .photo-panel {
      height: 100vh;
      padding: 40px;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .photo-panel img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 14px;
      box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
    }

/*----------------------------------*/
/*HORIZONTAL PINNING
/*----------------------------------*/

 .horizontal-scroll-wrapper {
      position: relative;
      height: 100vh;
      overflow: hidden;
      background: #1e293b;
      color: white;
    }

    .horizontal-track {
      display: flex;
      height: 100%;
    }

    .horizontal-panel {
      flex: 0 0 100vw;
      height: 100%;
      padding: 60px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: flex-start;
      background: #0f172a;
      border-right: 2px solid #334155;
    }

    .horizontal-panel h3 {
      font-size: 2rem;
      margin-bottom: 10px;
    }

    .horizontal-panel p {
      font-size: 1.1rem;
      line-height: 1.6;
      max-width: 600px;
    }

/*----------------------------------*/
/*LAYERED IMAGES*/
/*----------------------------------*/

.pincontainer
{
	height: 100vh;
}

/*----------------------------------*/
/*GSAP COLOUR ME IN*/
/*----------------------------------*/

.colour-me-in {
    width: 100vw;
    height: 100vh;
    background-color: #111; /* Dark background for better visibility */
    position: relative;
    overflow: hidden;
  }

  #cursorCanvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 9999;
  }
/*----------------------------------*/
/*PARALLAX IMAGE HOVER EFFECT*/
/*----------------------------------*/

.parallaximg {
  --f: .1; /* the parallax factor (the smaller the better) */
  --r: 30px; /* radius */
  
  --_f: calc(100%*var(--f)/(1 + var(--f)));
  --_a: calc(30deg*var(--f));
  width: 100%; /* the image size */
  aspect-ratio: calc(1 + var(--f));
  object-fit: cover;
  clip-path: inset(0 var(--_f) 0 0 round var(--r));
  transform: perspective(800px) var(--_t,rotateY(var(--_a)));
  transition: .5s;
  cursor: pointer;
}
.parallaximg:hover {
  clip-path: inset(0 0 0 var(--_f) round var(--r));
  --_t: translateX(calc(-1*var(--_f))) rotateY(calc(-1*var(--_a)))
}

/*----------------------------------*/
/*LOGO*/
/*----------------------------------*/

.logo img
{
	
}

/*----------------------------------*/
/*VIDEO*/
/*----------------------------------*/

.video-background-container {
  position: relative;
  width: 100%;
  height: 600px; /* or any height you want */
  overflow: hidden;
}

.video-background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  z-index: -1;
  background-color: black; /* if you want to fill extra space with black */
}


.video-background-fill {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -1;
  background-color: black; /* if you want to fill extra space with black */
}

/*----------------------------------*/
/*HERO*/
/*----------------------------------*/



.herovideo { 
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    object-fit: cover;
    object-position: center;

}

.herovideooverlay
{
	position: relative;
	height: 100vh;
}

.herovideooverlayvid
{
	width:100%;
	z-index: -1;
	top:110px;
	position: absolute;
	height: 100vh;
}

.herovideooverlaytext h1
{
	font-size:200px;
	line-height: 230px;
	margin-bottom: -100px;
	z-index: 9999;
	position: absolute;
	left: 50%;
	transformX:50%; 
	transform: translate(-50%, -50%);
}

.hero
{
	height:700px;
	position:relative;
	background-size: cover;
	background-position: center center;
	color: var(--white);
	
}

.hero p
{
	max-width: 600px;
}



.herobackcolor
{
	background-color: var(--primary);
}

.hero100
{
	height:100vh;
}

.hero h1
{
	color:var(--white);
	letter-spacing:0px;
	display: inline-block;
}

.herodarktxt
{
	color:var(--primary);
	overflow: hidden;
}

.herodarktxt h1
{
	color:var(--primary);
}

.heroimgfixed
{
	position: absolute;
	left: 600px;
}



.hero h2, .hero h3
{
	color:var(--white);
	margin:auto;
	margin-bottom:30px;
}

.hero h1 span, .hero h2 span, .hero h3 span
{
	color:var(--secondary);
}

.hero a
{
	margin-right: 10px;
}

.herosml
{
	height: 500px;
}

.herosml h1, .herosml h2, .herosml h3, .herosml
{
	color:var(--white);
}

.hero .scroll-down
{
	position: absolute;
	bottom:-610px;
	left:50%;
	transform: translateX(-50%);
	z-index: 9999;
}

/*----------------------------------*/
/*ALIGNMIDDLE*/
/*----------------------------------*/

.alignmiddle
{
	position:absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-khtml-transform: translateY(-50%);
	transform: translateY(-50%);
	margin:0;
	width:100%;
}


.alignbottom
{
	position:absolute;
	bottom: 10%;
	-webkit-transform: translateY(-10%);
	-moz-transform: translateY(-10%);
	-ms-transform: translateY(-10%);
	-o-transform: translateY(-10%);
	-khtml-transform: translateY(-10%);
	transform: translateY(-10%);
	margin:0;
	width:100%;
}

/*----------------------------------*/
/*LINKS*/
/*----------------------------------*/

.linkprimary
{
	display:inline-block;
	background-color:var(--primary);
	padding:10px 29px;
	font-size:16px;
	color:var(--white);
	transition: all .2s ease-in-out;
	-moz-border-radius: 25px;
	-webkit-border-radius: 25px;
	border-radius: 25px;
	text-align: center;
	font-weight: 600;
	text-transform: uppercase;
    border:1px solid var(--primary);
		
}

.linkprimary:hover
{
	background-color:var(--secondary);
	color:var(--white);
	transform:translateX(5px);
	border:1px solid var(--primary);
	
}

.linkprimary i
{
	padding-left: 10px;
}



.linksecondary
{
	display:inline-block;
	background-color:var(--secondary);
	padding:10px 29px;
	font-size:16px;
	color:var(--white);
	transition: all .2s ease-in-out;
	-moz-border-radius: 25px;
	-webkit-border-radius: 25px;
	border-radius: 25px;
	text-align: center;
	font-weight: 600;
	text-transform: uppercase;
	border:1px solid var(--secondary);
		
}

.linksecondary:hover
{
	background-color:var(--primary);
	color:var(--white);
	transform:translateX(5px);
	border:1px solid #fff;
	
}

.linksecondary i
{
	padding-left: 10px;
}

.linkdebt
{
	display:inline-block;
	background-color:none;
	padding:10px 29px;
	font-size:16px;
	color:var(--white);
	transition: all .2s ease-in-out;
	-moz-border-radius: 25px;
	-webkit-border-radius: 25px;
	border-radius: 25px;
	text-align: center;
	font-weight: 600;
	text-transform: uppercase;
	border:1px solid #fff;
	margin-left:10px
		
}

.linkdebt:hover
{
	background-color:var(--secondary);
	color:var(--white);
	transform:translateX(5px);
	border:1px solid #fff;
	
}

.linkdebt i
{
	padding-left: 10px;
}




.linkblue
{
	display:inline-block;
	background-color:var(--primary);
	padding:5px 20px;
	font-size:16px;
	color:var(--white);
	transition: all .2s ease-in-out;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	border-radius: 20px;
	text-align: center;
	border:solid 1px var(--primary);
		
}

.linkblue:hover
{
	background-color:var(--secondary);
	color:var(--white);
	transform:translateX(5px);
	border:solid 1px var(--secondary);
}

form div
{
 margin-bottom: 10px;
}

/*----------------------------------*/
/*FORMS*/
/*----------------------------------*/

input[type="text"], input[type="password"], input[type="email"], input[type="tel"]
{
	padding:15px;
	width:100%;
	background-color: #eee;
	border: 0px solid #ccc;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	-webkit-appearance: none;
	font-size:16px;
	color:#666;
	font-family: var(--font);
}

select
{
	padding:15px;
	width:100%;
	background-color: #eee;
	border: 0px solid #ccc;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	-webkit-appearance: none;
	font-size:16px;
	color:#666;
	font-family: var(--font);
}

textarea
{
	padding:15px;
	width:100%;
	background-color: #eee;
	border: 0px solid #ccc;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	-webkit-appearance: none;
	font-size:16px;
	color:#666;
	font-family: var(--font);
}


input[type="submit"], input[type="button"]
{
	background-color: #444444;
	border: 0px;
	color:var(--white);
	cursor:pointer;
	padding-top: 15px;
	padding-right: 14px;
	padding-bottom: 15px;
	padding-left: 14px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
    font-size:16px;
    width:100%;
    text-transform:uppercase;
    -webkit-appearance: none;
	transition: all .2s ease-in-out;
	font-family: var(--font);
}

input[type="submit"]:hover, input[type="button"]:hover
{
	background-color:#0059B2;
	color:var(--white);
	transform:translateX(5px);
}

/*----------------------------------*/
/*IMAGE HOVER HOVER LINKS*/
/*----------------------------------*/

a img { transition: all .2s ease-in-out; }
a img:hover { transform:translateY(-5px) }






/*----------------------------------*/
/*BREAKS*/
/*----------------------------------*/

.break
{
	margin-top:2%;
	margin-bottom:2%;
	height:1px;
	background-color:#eee;
	clear:both;
}

.breakclean
{
	height:1px;
	clear:both;
}

/*----------------------------------*/
/*FOOTER*/
/*----------------------------------*/

.footer
{
	background-color: var(--white);
	margin-top:-1px;
	font-size: 14px;
	background-position: right top;
	background-repeat: no-repeat;
	color: var(--secondary);
	padding-top: 50px;
	padding-bottom: 40px;
}

.footer h3
{
	color: var(--secondary);
	font-size: 24px;
	line-height: 30px;
}

.footer h4
{
	color: var(--primary);

}


.footer a
{
	color:var(--white);
}



.footer a:hover, .footer2 a:hover
{
	text-decoration: underline;
}


.footer2
{
	
	font-size: 14px;
}

.footer .socials i
{
	font-size: 24px;
	margin-right: 10px;
}

.footer .socials a:hover
{
	color:var(--secondary);
}

.footer .contact
{
	font-size:20px;
}

.footer .contact i
{
	color:var(--secondary);
	margin-right: 10px;
}

.footer2
{
	margin-top: 40px;
	padding-bottom: 0px;
	color:#66766C;

}

.footer2 a
{
	color:#66766C;
}

.footlinks a
{
margin-left:8px;	
margin-right:8px;
text-decoration: underline;
}
/*----------------------------------*/
/*IMG FLOATS*/
/*----------------------------------*/

.imgfloatleft
{
	float:left;
	margin-right:2%;
}

.imgfloatright
{
	float:right;
	margin-left:2%;
}

/*----------------------------------*/
/*NAVIGATION*/
/*----------------------------------*/

.menu_slideout
{
	background-color:var(--primary);
	position: fixed;
	z-index: 99999;
	height: 100%;
	top:0px;
	right:0px;
	width:50%;
	padding:5%;
	color: #fff;
	display: none;
	font-weight:600;
}



.menu_slideout .menu_close
{
	position: absolute;
	top:30px;
	right:30px;
	width: 30px;
}

.menu_slideout ul
{
	list-style: none;
	margin: 0;
}

.menu_slideout li
{
	padding-bottom: 20px;
}

.menu_slideout li ul
{
	padding-top: 20px;
	margin-left: 20px;
}

.menu_slideout a {
  color: #fff;
  font-size: 22px;
  text-decoration: none;
  display: block;             /* makes the icon positioning easier */
  line-height: 1.3;
}

.menu_button a {
  margin-top: 30px;
  display: block;
}

.menu_slideout li a:hover {
  text-decoration: underline;
}

.menu_details {
  font-size: 16px;
  margin-top: 50px;
}

.menu_details a {
  font-size: 22px;
}

.menu_details i {
  color: var(--secondary);
  margin-right: 10px;
}

.menu_socials i {
  font-size: 42px;
}

.menu_socials i:hover {
  color: var(--white);
}

/* === WordPress menu structure mapping ===
   WP outputs: .menu-item-has-children for parents, .sub-menu for child <ul> */
.menu_slideout .sub-menu {
  padding-top: 20px;
  margin-left: 20px;        /* indent like your original */
}

/* Collapse submenus by default in the slideout */
.menu_slideout .menu-item-has-children > .sub-menu {
  display: none;
}


/* === Chevron icon on parent links (Font Awesome) === */
.menu_slideout .menu-item-has-children > a {
  position: relative;
  padding-right: 28px;       /* room for chevron on the right */
}


.menu_slideout .menu-item-has-children > a::after {
  content: "\f078";          /* fa-chevron-down */
font-family: "FontAwesome";
font-weight: normal;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);     /* vertically center */
  transition: transform 0.3s ease; /* smooth rotation */
}

/* Rotate when the submenu is open */
.menu_slideout .menu-item-has-children.open > a::after {
  transform: translateY(-50%) rotate(180deg);
}

/* Optional: improve hit area on tight layouts */
.menu_slideout .menu-item-has-children > a {
  min-height: 36px;
}

/* Respect reduced motion users */
@media (prefers-reduced-motion: reduce) {
  .menu_slideout .menu-item-has-children > a::after {
    transition: none;
  }
}








.nav
{
	font-size:16px;
	text-transform: uppercase;
	font-weight: 600;
	letter-spacing: 1px;
}

.trig img
{
	width:30px;
	margin-left:20px;
}

.trig-right
{
	display: none;
}

.trig-right img
{
	width:30px;
	margin-left:20px;
	position: absolute;
	right: 0%;
	top:35px;
}

#wrapper
{
	position:relative;
}

#nav-trigger
{
	display:none;
	position:absolute;
	top:35px;
	right:0px;
	z-index: 9997;
}

#nav-trigger span img
{
	max-width:40px;
}

#nav-trigger span
{
	color:var(--white);
	cursor:pointer;
	display:inline-block;
	-webkit-transition: -webkit-transform .4s ease-in-out;
    transition:         transform .4s ease-in-out;
}

/*#nav-trigger span:hover
{
	-webkit-transform: rotate(360deg);
          transform: rotate(360deg);
}
*/

.centermenu
{
	list-style-type:none;
	margin:0;
	padding:0;
	text-align:center;
}

.centermenu li
{

	display:inline-block;
	padding:0 0px;
	position:relative;
}

.centermenu a
{
	color:var(--primary);
	display:block;
	padding:10px 20px;
	transition: all .2s ease-in-out;
}


nav#nav-main a
{
	color:var(--primary);
	display:block;
	padding:10px 20px;
	transition: all .2s ease-in-out;
}

nav#nav-main
{
	padding:0px 0;
}

nav#nav-main i
{
	display: none;
}

nav#nav-main ul
{
	list-style-type:none;
	margin:0;
	padding:0;
	text-align:left;
}

.navalignright
{
	text-align:right !important;
}

.navalignleft
{
	text-align:left !important;
}

nav#nav-main li
{
	border-right:solid 0px var(--secondary);
	display:inline-block;
	padding:0 0px;
	position:relative;
}

nav#nav-main li:last-child
{
	border-right:none;
}

nav#nav-main a
{
	color:var(--primary);
	display:block;
	padding:10px 20px;
	transition: all .2s ease-in-out;
}

.headerdark nav#nav-main a, .navbar nav#nav-main a
{
	color:var(--white);
}


nav#nav-main a:hover
{
}

nav#nav-main a:after {
  display:block;
  content: '';
  border-bottom:solid 2px var(--secondary); 
  transform: scaleX(0);  
  transition: transform 250ms ease-in-out;
}

nav#nav-main a:hover:after { transform: scaleX(1); }

nav#nav-main .selected
{
 
	color: var(--secondary);
}



nav#nav-main ul li ul
{
  position:absolute;
  top:50px;
  left:0px;
  width:200px;
  z-index:9999;
  margin:auto;
  left:0px;
  text-align:left;
  padding:0px;
  display:none;
}


nav#nav-main ul li ul li a
{
  text-align:left;
  padding:5px 15px;
  background-color:var(--primary) !important;
  color:var(--white);
  min-width:200px;
  margin-top:0px;
  font-size:14px;
  text-transform:none;
	border-radius: 0px !important;
	margin-left: 0px !important;
	padding-left: 15px !important;
}


nav#nav-main ul li:last-child a {
    background-color: var(--secondary);
    color: var(--white);
    padding-left: 30px;
    padding-right: 30px;
    border-radius: 30px;
	margin-left: 20px;
}

nav#nav-main ul li ul li:last-child
{
  text-align:left;
	 padding-left: 0px;
    padding-right: 0px;
  background-color:var(--secondary);
  color:var(--white);
  min-width:200px;
  margin-top:0px;
  font-size:13px;
  text-transform:none;
	border-radius: 0px !important;
}

nav#nav-mobile
{
	display:none;
	position:absolute;
	z-index:9999;
	font-size:20px;
	width:100%;
	background-color:var(--secondary);
	
	
}

nav#nav-mobile .closemobilenav
{
	text-align:right;
	margin:auto;
	padding:20px 0px;
	cursor:pointer;
	-webkit-transition: -webkit-transform .4s ease-in-out;
    transition:         transform .4s ease-in-out;
	padding-right: 30px;
}


nav#nav-mobile .closemobilenav:hover
{
	
}


nav#nav-mobile ul
{
	
	display:block;
	list-style-type:none;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
	padding-left: 30px;
	padding-right: 30px;
	
}

nav#nav-mobile ul li ul
{
	margin-bottom:0px;
}

nav#nav-mobile ul li ul li a
{
	color:var(--primary);
}

nav#nav-mobile li ul
{
	
}

nav#nav-mobile li ul li
{
	
}


nav#nav-mobile li
{
	padding:5px;
	border-bottom:solid 1px #CBB681;
}

nav#nav-mobile li i
{
	float:right;
	font-size:24px;
}

nav#nav-mobile li:last-child
{
	border-bottom:none;
}

nav#nav-mobile a
{
	color:var(--white);
	display:block;
	padding:5px 0px;
}

nav#nav-mobile a:hover
{
	color:var(--primary);
}

/*fixed nav bar*/

.navbar
{
	background-color:var(--primary);
	padding-top: 8px;
	padding-bottom: 8px;
	color:#fff;
	font-size: 16px;

}

.navbar i
{
	color:#C8D4E5;
	margin-right: 10px;

}

.navbar a
{
	color:#C8D4E5;

}

.navbar nav#nav-main ul
{
	text-align:left;
}

.navbar nav#nav-main a
{
	margin-top:0px;
}

.navbar #nav-main ul li:last-child a {
    background-color: var(--primary);
    color: var(--white);
    padding:5px 15px;
	margin-left: 0px;
}





/*----------------------------------*/
/*MEDIA QUERIES*/
/*----------------------------------*/
@media only screen and (max-width: 1250px) 
{

.theimg
{
	display:none;
}
	
}

@media only screen and (max-width: 1120px) 
{
	.topbuttons, .header .tel, .header .email
	{
		display: none;
	}
	
	nav#nav-main
	{
		display:none;
	}
	
	nav#nav-mobile
	{
		display:block;
	}
	
	.centermenu, .firstcenter
	{
		display: none;
	}
	
	.logocenter
	{
		text-align: left !important;
	}
	
	.headerolditems
	{
		display: none;
	}
	
	.header
	{
		position: relative;
	}
	
	.trig
	{
		position: absolute;
		top:45px;
		right:10%;
	}
	
	.trig-right
	{
		display: block;
	}
	
	.telehead
	{
		margin-right:40px;
	}
	
	
}


@media only screen and (max-width: 920px) 
{
	
	
	.trig-right img
{
	width:30px;
	margin-left:20px;
	position: absolute;
	right: 0%;
	top:15px;
}
	
	
	.herovideooverlaytext h1
{
	font-size:62px;
	line-height: 84px;
	z-index: 9999;
	position: absolute;
	left: 50%;
	transformX:50%; 
	transform: translate(-50%, -50%);
	top:60px;
}
	
	#myCarousel, #myCarousel2, #myCarousel3 {
        --f-carousel-slide-width: 100%;
      }
	
	.menu_slideout
	{
		width:100%;
		padding: 10%;
	}
	
	.herosml
	{
		height: 300px;
	}
	
	/*LOGO*/
	
	.logo img
	{
		max-width: 240px;
	}
	
	/*HEADINGS*/
	
	h1
	{
		line-height: 60px;
		font-size: 44px;
	}
	
	.h2big
	{
		line-height: 60px;
		font-size: 44px;
	}
	
	h2
	{
		font-size: 32px;
		line-height:40px;
	}
	
	h3
	{
		font-size: 24px;
	}
	
	h4
	{
		font-size: 14px;
	}
	
	.largetext
{
	font-size:42px;
	line-height:50px;
}
	
	.preheader a
	{
		padding:0px !important;
		display: block;
		text-align: center;
	}
	
	/*GALLERY*/
	
	.galleryThumb
	{
		width:100%;
		float:none;
		margin-right:0%;
		margin-bottom:2%;
		overflow:hidden;
	  max-height:100%;
	}

	.galleryThumb img
	{
		width:100%;
		min-height:auto;
	}

	.galleryThumb:nth-child(3n+1)
	{
	  float:none;
	  margin-right:0px;
	}
	
	/*SIMPLE GALLERY*/
	
	.simple-gallery .gallery-cell
	{
	  width: 100%;
	  margin:0%;
	}
	
	/*FOOTER*/
	
	.footer, .footer2
	{
		text-align: center;
	}
	
	.footer h2
{
	color: var(--white);
	font-size: 44px;
	line-height: 60px;
}
	
	/*HERO*/
	
	.hero
	{
		background-attachment: scroll !important;
	}
	
	.hero h1
	{
		
	}
	
	
	.hero .linkprimary
	{
		margin-bottom:20px;
	}
	
	.hero-gallery .alignmiddle
	{
	  padding-left:10%;
	  padding-right:10%;
	}
	
	/*RIGHT AND LEFT*/
	
	.right, .left
	{
		text-align:center;
	}
	
	.linkprimary, .linksecondary, .linkdebt
	{
		display: block;
	}
	
	
	.linkdebt
	{
		margin-left:auto;
		margin-top:10px
	}
	
	/*TESTIMONIALS*/
	
	.testimonials-gallery h2
	{
	  line-height:30px;
	  font-size: 18px;
	  font-weight: 400;
	}
	
	/*FIXED HEIGHT*/
	
	.fixedheight
	{
		height: 100%;
		background-size: cover;
		background-position: center center;
	}
	
	.fixedheightimg
	{
		height: 400px;
	}
	
	
	.fixedheightcontent
	{
		position: relative;
	  top: 0%;
	  left: 0%;
	  transform: translate(0%, 0%);
	}
	
	/*REORDER COLUMNS*/
	
	.box-2 { display: flex; flex-flow: column; }
    .boxt { order: 2; }
    .boxi { order: 1;  }
	
	
	.col-2 { display: flex; flex-flow: column; }
	.col-2-1 { display: flex; flex-flow: column; }
	.col-1-2 { display: flex; flex-flow: column; }
    .colt { order: 2; }
    .coli { order: 1;  }
	
		
}

@media only screen and (max-width: 600px) 
{
	
	
	.imgfloatright
	{
		float:none;
		margin-right:0px;
	}
	
	.imgfloatleft
	{
		float:none;
		margin-left:0px;
	}
	
	.preheader .left
	{
		text-align: center;
	}
	
	
}


/* ==========================================================
   SERVICE LINK LIST
   Turns a normal bulleted list of links into tappable rows.
   Two columns on desktop, one on mobile.
   How to use: in any Text Block make a bulleted list where
   each item is a link, then on the Code tab add the class:
       <ul class="cb-service-links">
   ========================================================== */
ul.cb-service-links{list-style:none !important;margin:26px 0 0 !important;padding:0 !important;
  display:grid;grid-template-columns:1fr 1fr;column-gap:44px}
ul.cb-service-links li{margin:0 !important;padding:0 !important;list-style:none !important;
  border-bottom:1px solid #E9E3DA}
ul.cb-service-links li:before{display:none !important;content:none !important}
ul.cb-service-links li a{display:flex !important;align-items:center;justify-content:space-between;gap:16px;
  padding:15px 2px !important;font-size:16.5px;font-weight:700;line-height:1.35;
  color:#3F5A4C !important;text-decoration:none !important;transition:color .15s,padding .15s}
ul.cb-service-links li a:after{content:'\203A';font-size:26px;font-weight:400;line-height:1;
  color:#3F5A4C;flex:0 0 auto;transition:transform .15s}
ul.cb-service-links li a:hover{color:#2C4136 !important;padding-left:10px !important}
ul.cb-service-links li a:hover:after{transform:translateX(4px)}
ul.cb-service-links li a:focus-visible{outline:3px solid #3F5A4C;outline-offset:2px}
@media(max-width:900px){ul.cb-service-links{grid-template-columns:1fr;column-gap:0}}
@media(max-width:560px){ul.cb-service-links li a{font-size:15.5px;padding:14px 2px !important}}

/* Fix: WPBakery grid gutter caused a 5px horizontal scroll on phones.
   .vc_pageable-slide-wrapper inherits margin-right:-30px from vc_grid-gutter-30px
   while its parent .vc_grid.vc_row only compensates -14px. Mobile-only; desktop untouched. */
@media(max-width:767px){
  .vc_grid .vc_pageable-slide-wrapper{margin-right:0 !important}
}

/* Latest News on the home page: cards all match the tallest, desktop only.
   Uses grid so the card's internal layout is left untouched. */
@media(min-width:768px){
  .vc_grid .vc_pageable-slide-wrapper{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;align-items:stretch;margin-right:0}
  .vc_grid .vc_grid-item.vc_grid-item{width:auto !important;float:none;padding:0;display:block}
  .vc_grid .vc_grid-item-mini{height:100%}
  /* close the gap between the photo and the card text */
  .vc_grid .vc_gitem-animated-block{height:auto !important;min-height:0 !important;flex:0 0 auto}
  /* the wrapper is a clearfix; its pseudo-elements would otherwise take grid cells */
  .vc_grid .vc_pageable-slide-wrapper::before,
  .vc_grid .vc_pageable-slide-wrapper::after{display:none}
}

/* Blog posts: space and rounded corners under the featured image */
.single-post .wp-post-image,
.single-post .post-thumbnail img,
.single-post article img.attachment-post-thumbnail{
  border-radius:10px;
  margin-bottom:32px;
  display:block;
}


/* Related insights: close the gap between the band and the enquiry form */
.wpb_text_column:has(> .wpb_wrapper > .cbsa){margin-bottom:7px !important}


/* Hide empty paragraphs and headings left behind by removed bylines */
.single-post article p:empty,
.single-post article h1:empty,
.single-post article h2:empty,
.single-post article h3:empty,
.single-post article h4:empty{display:none}


/* ---- Careers page ---- */
.cb-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:8px 0 0}
.cb-benefit{background:#fff;border:1px solid #E3DDD4;border-radius:10px;padding:26px 26px 22px}
.cb-benefit h2,.cb-benefit h3{font-size:20px;margin:0 0 12px}
.cb-benefit p{margin:0 0 10px}
.cb-benefit ul{margin:0;padding-left:18px}
.cb-benefit li{margin:0 0 10px}
.cb-benefit li:last-child{margin-bottom:0}
.cb-benefit-ico{display:block;font-size:30px;line-height:1;color:#B37B64;margin:0 0 16px}
@media(max-width:1024px){.cb-benefits{grid-template-columns:repeat(2,1fr);gap:18px}}
@media(max-width:700px){.cb-benefits{grid-template-columns:1fr}}

.cb-stats{background:#66766C;width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding:44px 0}
.cb-stats-inner{width:80%;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.cb-stat-n{display:block;font-size:42px;line-height:1.1;font-weight:700;color:#F6F4F0}
.cb-stat-l{display:block;margin-top:6px;font-size:15px;line-height:1.4;color:#E3DDD4}
@media(max-width:1500px){.cb-stats-inner{width:90%}}
@media(max-width:1024px){.cb-stats-inner{width:85%;grid-template-columns:repeat(2,1fr);gap:28px}}
@media(max-width:560px){.cb-stats-inner{grid-template-columns:1fr}}

.cb-voices{background:#F6F4F0;width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding:56px 0}
.cb-voices-inner{width:80%;margin:0 auto}
.cb-voices-inner h2{margin:0 0 24px}
.cb-voices-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.cb-voice{background:#fff;border:0;border-radius:10px;margin:0;padding:26px 28px}
.cb-voice p{margin:0 0 14px;font-style:normal}
.cb-voice cite{font-style:normal;font-size:14px;color:#B37B64}
@media(max-width:1500px){.cb-voices-inner{width:90%}}
@media(max-width:1024px){.cb-voices-inner{width:85%}}
@media(max-width:760px){.cb-voices-grid{grid-template-columns:1fr}}

.cb-vacancies ul{list-style:none !important;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.cb-vacancies li{margin:0;list-style:none !important;display:block}
.cb-vacancies li::marker{content:none}
.cb-vacancies li a{display:flex;justify-content:space-between;align-items:center;gap:16px;background:#fff;border:1px solid #E3DDD4;border-radius:10px;padding:20px 24px;text-decoration:none;transition:border-color .15s,transform .15s}
.cb-vacancies li a:after{content:'\203A';font-size:26px;line-height:1;color:#B37B64}
.cb-vacancies li a:hover{border-color:#B37B64;transform:translateX(3px)}
@media(max-width:760px){.cb-vacancies ul{grid-template-columns:1fr}}


/* ---- Vacancies ---- */
.cb-vacancies li a{align-items:flex-start}
.cb-vac-text{display:block}
.cb-vac-t{display:block;font-size:16.5px;font-weight:700;line-height:1.35;color:#3F5A4C}
.cb-vac-m{display:block;margin-top:5px;font-size:14px;color:#66766C;font-weight:400}
.cb-vacancies--empty p{margin:0;padding:24px 26px;background:#F6F4F0;border-radius:10px;color:#66766C}

.cb-vac-facts{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 30px;padding:0 0 26px;border-bottom:1px solid #E3DDD4}
.cb-vac-fact{background:#F6F4F0;border-radius:10px;padding:14px 20px;min-width:150px}
.cb-vac-fact-l{display:block;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:#8D968F}
.cb-vac-fact-v{display:block;margin-top:4px;font-size:16.5px;font-weight:700;color:#3F5A4C}
.cb-vac-apply{margin:36px 0 0;padding:30px 32px;background:#F6F4F0;border-radius:10px}
.cb-vac-apply h2{margin:0 0 12px}
.cb-vac-apply p{margin:0 0 12px}
.cb-vac-apply p:last-child{margin:20px 0 0}
.cb-vac-apply .linkprimary{display:inline-block;margin-bottom:0}
@media(max-width:560px){.cb-vac-fact{min-width:0;flex:1 1 100%}}

.cb-vac-hero{background:#66766C;width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding:150px 0 70px;margin-bottom:44px}
.cb-vac-hero-inner{width:80%;margin:0 auto}
.cb-vac-hero h1{margin:0;color:#F6F4F0}
@media(max-width:1500px){.cb-vac-hero-inner{width:90%}}
@media(max-width:1024px){.cb-vac-hero-inner{width:85%}.cb-vac-hero{padding:130px 0 50px;margin-bottom:32px}}

/* Vacancy body lists match the site square list style */
.single-vacancy article ul:not(.cb-service-links):not(.cbsa-list),
.cb-vac-body ul{list-style-type:square;margin:0 0 20px 20px;padding-left:0}
.single-vacancy article ul:not(.cb-service-links):not(.cbsa-list) li::marker,
.cb-vac-body ul li::marker{color:#B37B64}
.single-vacancy article ul:not(.cb-service-links):not(.cbsa-list) li{margin:0 0 10px}
.cb-vac-back{margin:24px 0 0}
.cb-vac-back .linkprimary{display:inline-block;margin-bottom:0}


/* Latest news cards match the blog post previews on the category pages */
.vc_basic_grid .vc_gitem-post-data-source-post_title h3,
.vc_basic_grid .vc_gitem-post-data-source-post_title h3 a,
.vc_basic_grid .vc_gitem-post-data-source-post_title,
.vc_basic_grid .vc_gitem-post-data-source-post_title *{
  color:#66766C !important;
  font-size:18px !important;
  line-height:1.35 !important;
  font-weight:700 !important;
}


/* Information hub service tiles: sage title on the cream boxes */
body.page-id-38684 .service_title a{color:#66766C !important}

/* Latest news cards: strip the duplicated WPBakery padding so the card
   matches the blog previews on the category pages */
.vc_grid .vc_gitem_row{padding:0 !important;margin:0 !important}
.vc_grid .vc_gitem-col{padding:0 !important}
.vc_grid .vc_gitem-zone-c .vc_gitem-zone-mini{padding:20px 24px 24px !important}
.vc_grid .vc_gitem-post-data-source-post_categories{margin:0 0 12px !important}
.vc_grid .vc_gitem-post-data-source-post_date{margin:0 0 10px !important}
.vc_grid .vc_gitem-post-data-source-post_title,
.vc_grid .vc_gitem-post-data-source-post_title h3{margin:0 !important}
.vc_grid .vc_gitem-post-data-source-post_categories a{font-size:11px !important;padding:4px 11px !important;line-height:1.45 !important}
.vc_grid .vc_gitem-post-data-source-post_date,
.vc_grid .vc_gitem-post-data-source-post_date *{font-size:13px !important;line-height:1.45 !important}

/* Sectors carousel: let the cards run to the edge of the screen */
.business-carousel-container{padding-left:0 !important;padding-right:0 !important}

/* Sectors carousel on mobile: one full width card, arrows kept, snap into place */
@media(max-width:599px){
  /* card width matches the 85% sectionmax used by Latest News */
  .business-carousel-container{padding-left:7.5% !important;padding-right:7.5% !important}
  #businessSlider{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
  #businessSlider .business-card{scroll-snap-align:center;scroll-snap-stop:always}
  .business-carousel-container .carousel-controls{display:flex}
}

/* Hide paragraphs left empty after removing a caption */
.wpb_text_column p:empty{display:none}


/* ---- Internal page heroes ---- */
body:not(.home) .customhero,
body:not(.home) .bloghero{padding-top:200px !important;padding-bottom:100px !important}
@media(max-width:767px){
  body:not(.home) .customhero,
  body:not(.home) .bloghero{padding-top:100px !important;padding-bottom:10px !important}
}

/* Internal page H1 — mobile only, desktop keeps the theme size */
@media(max-width:767px){
  body:not(.home) h1,
  body:not(.home) .customhero h1,
  body:not(.home) .bloghero h1{font-size:30px !important;line-height:35px !important}
}

/* Home hero button above the video and background layers on mobile */
@media(max-width:767px){
  body.home .customhero .wpb_text_column{z-index:30}
}

/* Information hub: image fills the card so it matches the cream block below */
body.page-id-38684 .wpb_single_image img{width:100%;display:block}
body.page-id-38684 .wpb_single_image figure,
body.page-id-38684 .wpb_single_image .vc_figure,
body.page-id-38684 .wpb_single_image .vc_single_image-wrapper{display:block !important;width:100% !important}


/* Sector pages: keep the Speak to our team card aligned to the top of the row
   rather than vertically centred against the longer left column. cbcc-align */
.wpb_column:has(> .vc_column-inner > .wpb_wrapper .cbcc){align-items:flex-start !important}
.wpb_column:has(> .vc_column-inner > .wpb_wrapper .cbcc) > .vc_column-inner{align-self:flex-start}

/* Sector pages have no team block, so close the dead white gap that sat
   where the team used to be, above Related insights. Sector pages are the
   children of page 745 (Sectors). cbsec-gap */
.parent-pageid-745 .wpb-content-wrapper > br{display:none}
.parent-pageid-745 .cbsa{margin-top:0}
.parent-pageid-745 .wpb-content-wrapper > .vc_row:last-child:not(:has(.cbsa)){display:none}