:root{
    --main-width:1300px;
    --main-color: #950808;     
    --site-shadow: 0px 4px 6px 3px #00000024;
}


body {
    background-color: var(--bg-color);
    font-family: Arial, Helvetica, sans-serif;
}

main{
    background:#fff;
    box-shadow:var(--site-shadow);
    border: 1px solid #ccc;
    border-top:0;
}

footer{
    background:#fff;
    border: 1px solid #ccc;
    box-shadow:var(--site-shadow);
}

header{
    border: 1px solid #ccc;
    border-bottom:0;
    box-shadow: -1px 0px 5px 2px #00000024;
}

/* Navbar */


.hamburger-btn .line1 {
  transform-origin: top left;
}
.hamburger-btn .line3 {
  transform-origin: bottom left;
}

.hamburger-btn.open .line1 {
  transform: rotate(45deg) translate(2px, -5px);
}

.hamburger-btn.open .line2 {
  opacity: 0;
}

.hamburger-btn.open .line3 {
  transform: rotate(-45deg) translate(1px, 5px);
}


.navbar-children-group{
    width: fit-content;
    min-width: 200px;
}

.custom-logo-link img{
    height: 100px;
    width: auto;
}

nav{
        border-bottom: 1px solid #ccc;
}

nav button{
    /*
    border: 0;
    border-radius: 0;
    background: transparent;
    padding-block: 0;
    padding-inline: unset;
    text-decoration: none; */
}

nav button:hover{
    border-bottom:0;
}

.nav-elements > *{
    padding: 1rem;
    height: 100%;
    border-left: 1px solid #ccc;
    display: flex;
    align-items: center;
    justify-content: center;
    flex:1;
    font-size:1.2em;
}

.nav-elements > *:hover{
    background:#e5e5e5;
}

.navbar-children-group{
    border:1px solid #ccc;
}

.navbar-children-group .group {
    border-top: 1px solid #ccc;
}

.navbar-children-group .group:first-child {
    border-top: 0;
}

/*Mobile Menu*/

#mobile-menu .sub-menu {
    display: none;
    margin-top: 0;
    background: #efeded6e;
    padding:0;
}

#mobile-menu .menu-item-has-children{
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0;
    border-top: 1px solid #ccc;
}

#mobile-menu .menu-item-has-children > a{
    float: left;
    width: fit-content;
    border-top: 0;
    max-width: 90%;
}

#mobile-menu .menu-item-has-children.active{
    border-left: 2px solid var(--main-color);
    background: #efeded6e;
    position: relative;
    background: #efeded6e;
}

#mobile-menu .sub-menu {
  display: none;
}

/* Toggle Menu */

#mobile-menu .sub-menu {
  display: none;
  margin-top: 0.5rem;
  padding-left: 1rem;
  width:100%;
}

#mobile-menu .menu-item-has-children.active > .sub-menu {
  display: block;
  padding:0;
  margin:0;
}

.submenu-toggle {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    background-color: var(--main-color);
    color: #fff;
    padding: 0.35rem;
    border-radius: 4px;
    position: relative;
    display: inline-flex;
    font-size: 0.75rem;
    transition: transform 0.2s;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    right: 10px;
}

.menu-item-has-children.active .submenu-toggle {
  transform: rotate(180deg);
}

/* End Toggle Menu */




#mobile-menu{
    position: relative;
    background: #fff;
    z-index: 3;
    width: 100%;
    box-shadow:var(--site-shadow);
    padding:0.5rem 1rem;
}

#menu-main > li > a{
    
}

#mobile-menu #menu-main{
    /*
        max-height: 500px;
        overflow-y: auto;
    */
}

#menu-main{
    padding:0;
    margin:0;
    border-left:0;
}

#menu-main li{
    list-style: none;
}
#menu-main li a{
    display: flex;
    justify-content: space-between;
    border-top: 1px solid #ccc;
    padding: 0.5rem;
    width: 100%;
    text-decoration: none;
    font-weight: bold;
}

.menu-item-has-children > .sub-menu{
    border-top: 1px solid #ccc;
}

#menu-main .sub-menu a{
    padding-left: 1.5rem;
}

#menu-main li:first-child a{
    border-top:0;
}

#menu-main li:last-child a{

}

#mobile-menu-toggle {
    background: var(--main-color);
    border: 0;
    color: #fff;
    width: 40px;
    height: 40px;
    justify-content: center;
    gap: 0.33rem;
    border-radius: 4px;
}

#mobile-menu-toggle span{
    background: #fff;
}

/* Slider */

.slick-dots li button::before{
    color: var(--main-color);
    content: '•';
    font-size: 15px;
}

.slick-dots li.slick-active button:before {
    color: var(--main-color);
}

.slick-prev {
    left: 0;
}

.slick-next {
    right: 0;
}

.slick-prev, .slick-next{
    z-index: 7;
    width: auto;
    height: auto;
    padding: 0.5rem;
    background: #950808b8;
}

.slick-prev:before, .slick-next:before {
    color: #fff;
    font-size: 40px;
    font-family: "Font Awesome 6 Free";
    font-weight: 600;
}

.slick-prev:before{
    content:"\f053";
}

.slick-next:before{
    content:"\f054";
}

.slick-prev:hover, .slick-next:hover, .slick-prev:active, .slick-next:active,.slick-prev:focus, .slick-next:focus{
    background:#5b0606;
}

.homepage-slider .single-slider figure img{
    width:100%;
    height:400px;
    object-fit:cover;
    object-position:center;
}

.homepage-slider figure{
    margin-bottom:0;
}

.homepage-slider{
    position:relative;
    border-bottom:1px solid #ccc;
    padding:0.5rem 1rem 1rem 1rem;
}

.slider-inner-content-container {
    position: absolute;
    bottom: 0;
    padding: 2rem 1rem;
    padding-left:6rem;
}

.slider-content > *{
    position:Relative;
}

.slider-content .title{
    padding: 1rem;
    background: #000000b8;
    color: #fff;
    z-index: 2;
    font-size: 2em;
    font-weight: 500;
    font-family: "";
}

.homepage-slider .slick-dots {
    bottom: -32px;
}

.slider-content .category{
    background:#fff;
    color:#000;
    padding:0.5rem;
    width:fit-content;
    font-style:italic;
    z-index:3;
    margin-left: -25px;
    margin-bottom: -10px;
    font-weight:bold;
}

.slider-main-btn{
    padding: 1rem 1.5rem;
    background: var(--main-color);
    text-decoration: none;
    color: #fff;
    font-weight: bold;
    gap:1rem;
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: fit-content;
    margin-left: auto;
    right: -25px;
    top: -10px;
    z-index: 3;
}

.slider-main-btn:hover{
    background:#5b0606;
}

/* Projects */
 
.projects-home-container .single:active{
    color:#fff;
    text-decoration:none;
} 

.projects-home-container .single h3{
    color:#fff;
}

.projects-home-container .content, .single-project-list .title{
    padding: 0.5rem;
    padding-right:0.5rem;
    background: #000000c2;
    position: absolute;
    z-index: 2;
    color:#fff;
    width:100%;
    bottom:20px;
    align-items: center;
}

.single-project-list .title{
    font-weight:bold;
}

.projects-home-container .single img{
    height:200px;
    width:100%;
    object-fit:cover;
    object-position:center;
    z-index:1;
    position:relative
}
.projects-home-container .single:hover .content, .single-project-list:hover .title{
    background:#910406e0;
    color:#fff;
}

.projects-home-container .single h3{
    margin:0;
    transition:all 0.2s ease-in-out;
}

.projects-home-container .single:hover h3{
    color:#fff;
}

.projects-home-container .single:hover span{
    text-decoration:underline
}

.single-project-list .post-image img{
    width:100%;
    height:250px;
    object-fit:cover;
    object-position:center;
}

.main-post-image-background{
    opacity: 0.6;
    z-index: 1;
    filter: blur(13px);
    width: 200%;
}

.main-post-image{
    z-index:2;
    height:100%;
    width:auto;
}

.single-project figure, .single-page figure{
    width:100%;
    display:flex;
    align-items:center;
    overflow: hidden;
    justify-content: center;
}

/* Contact Form */

input[type="tel"]{
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    transition: border-color 0.2s, box-shadow 0.2s;
}

input[type="submit"]{
    border: 0;
    background: var(--main-color);
    color: #fff;
    padding: 1rem 2rem;
    font-weight: bold;
    text-transform: uppercase;
    cursor:pointer;
}

input[type="submit"]:hover{
    background:#666;
}

.contact-details{
    padding:1rem;
}

/* MISC */

.wpb_wrapper > p:first-child{
    margin-top:0;
}

/* WP Block Gallery */

/* Lightbox overlay */
#gallery-lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.9);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 10000;
}

#gallery-lightbox.active {
  display: flex;
}

#gallery-lightbox img {
  max-width: 90vw;
  max-height: 90vh;
  box-shadow: 0 0 20px rgba(0,0,0,0.5);
}

/* Arrows */
.gallery-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 2rem;
  color: white;
  cursor: pointer;
  user-select: none;
  z-index: 10001;
  padding: 0 1rem;
  background: rgba(0,0,0,0.5);
  border-radius: 4px;
}

.gallery-arrow.left { left: 1rem; }
.gallery-arrow.right { right: 1rem; }

.wp-block-gallery img {
  cursor: zoom-in;
}

.pagination {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.pagination .page-numbers {
  padding: 0.5rem 0.75rem;
  background: #f3f4f6;
  border-radius: 4px;
  text-decoration: none;
}
.pagination .current {
  background: var(--main-color);
  color: white;
}

/* Services */ 

.wpb_wrapper ul{
}

.wpb_wrapper ul li p{
    margin-top:0;
}

.services-row-container .single-service h3{
    margin-top:0;
}

.services-row-container .single-service{
    position:relative;
}

.services-row-container .single-service .vc_column-inner > .wpb_wrapper{
    padding:1rem;
    border:1px solid var(--main-color);
    height: 100%;
}

.services-row-container .more-information .vc_column-inner > .wpb_wrapper{
    display: flex;
    flex-direction: column;
    background: var(--main-color);
    height: 100%;
    color: #fff;
    padding: 3rem 2rem;
    justify-content: flex-end;
}

.more-information h2{
    color:#fff;
    margin-top:0;
}

.more-information a{
    background:#000;
    color:#fff;
    text-decoration:none;
    padding:1rem 1.5rem;
    border-radius:4px;
    font-weight:bold;
}

.more-information a:hover{
    color:#000;
    background:#fff;
}

/* Footer Links */

.footer-links .link + .link::before{
    content:" | ";
    color:#d1d1d1;
    margin-right:0.15rem;
}

.footer-links .link a{
    color:#454545;
}


@media screen and (max-width: 820px) {

.custom-logo-link img {
    height: 60px;
}

h1 {
    font-size: 1.5rem;
}

.homepage-slider .single-slider figure img {
    height: 330px;
}

.slider-inner-content-container {
    padding: 0;
    padding-bottom:1rem;
}

.slider-content .category{
    margin-left: 0px;
}

.slider-main-btn{
    right: 0px;
    margin: auto;
    font-size:0.8em;
    padding: 0.5rem 1rem;
}

.slider-content .title, .slider-inner-content-container{
    width:100%;
}

.slick-prev, .slick-next{
    display:none !important;
}

.slider-inner-content-container .slider-content{
    font-size: 0.7em;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}

.slider-content .title{
    font-weight:400;
    text-align:center;

}

.services-row-container .single-service +  .single-service, .services-row-container .single-service +  .more-information{
    margin-top:25px;
}

.services-row-container .more-information .vc_column-inner > .wpb_wrapper {
    padding: 2rem 1rem;
}

body{
    padding-bottom:2.5rem;
}


}