/*
 Theme Name:     District Masonry and Foundation
 Theme URI:      https://aswin.co.uk/
 Description:    Official Website Theme for District Masonry and Foundation
 Author:         Nalin Herath
 Author URI:     https://aswin.co.uk/
 Template:       Divi
 Version:        1.0.79
*/


@media (max-width: 1300px) {
.et_pb_menu .et_pb_menu__menu, .et_pb_fullwidth_menu .et_pb_menu__menu {
    display: none;
}

.et_pb_menu .et_mobile_nav_menu, .et_pb_fullwidth_menu .et_mobile_nav_menu {
    display: flex;
    float: none;
    margin: 0 6px;
    align-items: center;
}
}

.page_cnt .et-pb-contact-message{
	color: #fff !important;
}

.mobile_header  .et_pb_blurb{
	width: 65%;
	float: left;
}

.mobile_header .et_pb_social_media_follow{
	width: 35%;
	float: right;
}

.mobile_header .et_pb_blurb_container{
	padding-left: 0 !important;
}

#menu-main-menu .sub-menu li a, #mobile_menu1 li a{
	border-bottom: #d1a03e solid 1px;
}

/*--- Service Section Arrow Shaped cut-- */
.service_blocks .et_pb_image .et_pb_image_wrap {
	--arrow-depth: 42px;
	--gold-line: 10px;
	--inner-point-offset: 1px;

	position: relative;
	display: block;
	overflow: hidden;
	line-height: 0;
}

.service_blocks .et_pb_image .et_pb_image_wrap img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;

	clip-path: polygon(
		0 0,
		100% 0,
		100% 100%,
		50% calc(100% - var(--arrow-depth)),
		0 100%
	);
}

.service_blocks .et_pb_image .et_pb_image_wrap::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: calc(var(--arrow-depth) + var(--gold-line));
	background: #d1a03e;
	pointer-events: none;
	z-index: 2;

	clip-path: polygon(
		0 100%,
		50% var(--gold-line), /* top point stays same */
		100% 100%,
		100% calc(100% - var(--gold-line)),
		50% var(--inner-point-offset), /* this point moved upward */
		0 calc(100% - var(--gold-line))
	);
}
/*--- Service Section Arrow Shaped cut-- */


.et_pb_slide_content h3{
	font-weight: 600 !important;
	border-bottom: #fff solid 2px;
	padding-bottom: 15px;
	margin-bottom: 20px;
}

.et_pb_row{
  max-width: 85% !important;
  width: 85% !important;
}

.top_banner .et_pb_container{
	height: 70vh !important;
}

.top_banner .et_pb_slider_container_inner {
    display: flex !important;
    align-items: stretch;
}

.top_banner .et_pb_slide_description {
    clip-path: ellipse(85% 100% at 0% 50%);
   	height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
	padding: 10% 8% !important;
	width: 45%;
	animation: none !important;
	margin: 0;
	
	background-image:
		linear-gradient(
			to bottom right,
			rgba(209, 160, 62, 0.9) 0%,
			rgba(22, 20, 16, 0.9) 80%
		),
		url("https://districtmasonryandfoundation.com/wp-content/uploads/2026/05/Pattern1.webp");
	background-size: auto;
	background-repeat: repeat;
	background-position: top left;
	
	--arrow-size: 70px;
	--border-size: 0px;
	--blue-strip: 25px;

	position: relative;
	padding: 40px calc(var(--arrow-size) + 35px) 40px 40px;
	clip-path: polygon(
		0 0,
		calc(100% - var(--arrow-size)) 0,
		100% 50%,
		calc(100% - var(--arrow-size)) 100%,
		0 100%
	);
}

.top_banner .et_pb_slide_description::after {
	content: "";
	position: absolute;
	inset: var(--border-size);
	background: #d1a03e;
	z-index: 2;
	pointer-events: none;

	clip-path: polygon(
		calc(100% - var(--arrow-size) - var(--blue-strip)) 0,
		calc(100% - var(--arrow-size)) 0,
		100% 50%,
		calc(100% - var(--arrow-size)) 100%,
		calc(100% - var(--arrow-size) - var(--blue-strip)) 100%,
		calc(100% - var(--blue-strip)) 50%
	);
}

.top_banner .et_pb_slide_title, .top_banner .et_pb_slide_content{
	padding-right: 50px;
}

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

.top_banner .et_pb_slide{
	padding: 0;
}

@media only screen and (max-width: 1024px){
  .et_pb_row{
    max-width: 95% !important;
    width: 95% !important;
  }
	
	.top_banner .et_pb_slide_description {
		width: 100% !important;
		
		--arrow-size: 85px;
		--blue-strip: 22px;
		--border-size: 0px;

		padding: calc(var(--arrow-size) + 20px) 3% 60px 3% !important;

		clip-path: polygon(
			0 var(--arrow-size),
			50% 0,
			100% var(--arrow-size),
			100% 100%,
			0 100%
		);
		
		margin-top: calc(200 / 375 * 100vw) !important;
	}
	
	.top_banner .et_pb_slide_description::after {
		content: "";
		position: absolute;
		inset: var(--border-size);
		background: #d1a03e;
		z-index: 2;
		pointer-events: none;

		clip-path: polygon(
			0 var(--arrow-size),
			50% 0,
			100% var(--arrow-size),
			100% calc(var(--arrow-size) + var(--blue-strip)),
			50% var(--blue-strip),
			0 calc(var(--arrow-size) + var(--blue-strip))
		);
	}

	
	.top_banner .et_pb_slide_title, .top_banner .et_pb_slide_content{
		padding-right: 0;
	}
	
	.top_banner .et-pb-controllers{
		bottom: 2% !important;
	}
	
	.top_banner .et-pb-slider-arrows{
		display: none !important;
	}
}


 
/*Mobile Menu Styles*/
/* Parent item */
.et_mobile_menu .first-level {
  position: relative;
}

/* Keep link clickable (leave space for the toggle icon) */
.et_mobile_menu .first-level > a {
  display: block;
  padding-right: 44px; /* space for toggle button */
}

/* The toggle button we inject via JS */
.et_mobile_menu .submenu-toggle {
  position: absolute;
  top: 0;
  right: 0;
  width: 44px;
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
	color: #d1a03e;
}

/* Icon using ETmodules font (same as your :after) */
.et_mobile_menu .submenu-toggle:after {
  font-family: 'ETmodules';
  content: '\4c'; /* plus */
  font-size: 20px;
  font-weight: normal;
}

/* When open, switch icon */
.et_mobile_menu .submenu-toggle.is-open:after {
  content: '\4d'; /* minus */
}

/* Submenu show/hide */
.et_mobile_menu .second-level {
  display: none;
}
.et_mobile_menu .second-level.reveal-items, .et_mobile_menu .second-level.reveal-items li {
  display: block;
}

/* Footer Links */
.list-item li{
	margin-bottom: 10px;
}

.footer-links{
	color: white;
}
.footer-links:hover{
	color: #d1a03e;
}
.footer-tick{
	display: inline-block;
	width: 15px;
	height: 15px;
	border-radius: 100px;	
	margin-right: 5px;
	background-image:url("https://districtmasonryandfoundation.com/wp-content/uploads/2026/05/Orange-tick.webp");
	background-size: cover;
  	background-repeat: no-repeat;
 	background-position: center;
}

/* Gallery */
.gal .et_pb_gallery_item {
  margin-bottom: 20px !important;
  margin-top: 0px !important;
}
.gal-one .et_pb_gallery_item {
  margin-bottom: 0px !important;
  margin-top: 20px !important;
}

@media (max-width: 980px){
	.gal .et_pb_gallery_item {
		margin-bottom: 0px !important;
  		margin-top: 0px !important;
	}
	.gal-one .et_pb_gallery_item {
  		margin-bottom: 0px !important;
  		margin-top: 0px !important;
	}
}