/*
     Theme Name: Led Solution
     Theme URI: http://example.com/your-theme-child/
     Description: A child theme for Led Solution.
     Author: Skyhawks
     Author URI: http://example.com/
     Template: ledsolution
     Version: 1.0.0
     Text Domain: ledsolution-child
    */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Dancing+Script:wght@400..700&family=League+Gothic&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
html { scroll-behavior: smooth; }
section, header, .choose, .our-service, .portfolio, .contact {
  scroll-margin-top: 90px; /* header height */
}

body {
  background: #fff;
  color: #fff;
  margin: 0;
  font-family: "DM Sans", sans-serif;
}

h1, h2, h3, h4, h5, h6,h7 {
  font-family: "Raleway", sans-serif;
}

h2 {
  font-size: 40px;
}

p, a, .choose h3 {
  font-family: "DM Sans", sans-serif;
  font-weight: 400;
}

.main-container {
  max-width:1400px;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
}

.col {
  float: left;
  margin: 0 1%;
}

.col_6{
    width: 48%;
}
.col_3{
    width:23%;
}

.nav-bar{
	display: flex;
    align-items: center;
}

.nav-bar .col,  {margin: 0;}
.nav-bar .col_3 { width: 23%; }
.nav-bar .col_2 { width: 15%; }
.nav-bar .col_7 { width: 55%; }
.our-service .col_4 { width: 31%; }

header {
  background-color: #FFF7DA;
}

header, header a {
  font-family: "DM Sans", sans-serif;
  font-weight: 500;
}

/* ===============================
   NAVIGATION
   =============================== */

.logo {
  float:left;
  height: 54px;
  background-image: url(../img/logo.svg);
  background-repeat: no-repeat;
  text-indent:-10000px;
}

nav { float: right; }

nav ul {
  list-style:none;
  overflow: hidden;
  margin-top:20px;
}

nav ul li {
  float: left;
  margin: 10px 15px;
}

nav ul li a {
  text-decoration: none;
  color: #1C1C1C;
}

nav ul li a:hover {
  border-bottom: 1px solid #d9dfeb;
  padding-bottom: 5px;
}

/* ===============================
   BANNER
   =============================== */

.banner {
  width:100%;
  min-height: 695px;
  background-image: url(../img/banner.svg);
  overflow: hidden;
  position: relative;
}

.banner-text {
    position: absolute;
    top: 41%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    width: 700px;
}
.banner-text .wp-block-buttons.is-layout-flex.wp-block-buttons-is-layout-flex {
    justify-content: center;
}
.banner-text h1 {
  font-size:4rem;
  font-weight: bold;
  line-height: normal;
}

.banner-text p {
  font-weight: 400;
  font-size: 1.35rem;
  color: #E5E5E5;
}

header button, .button-orange {
  display: flex;
  align-items: center;
  padding:15px 15px;
  border-radius:50px;
  background-color: #F07522 !important;
  height: 50px;
  width: 200px;
  font-size: 17px;
  margin-top:15px;
  outline: none;
  border:none;
  background: transparent;
  flex: 1;
}

.button-nav { 
    width:100%; 
}
.button-nav a { font-size:13px !important; }

header button a, .button-orange a {
  color: #FFFFFF;
  font-size: 17px;
  text-decoration: none;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* ===============================
   SERVICES SECTION (NEW)
   =============================== */

.our-service {
  margin: 50px 0;
  overflow: hidden;
}

.service-column, .portfolio-column {
  margin-top: 20px;
  margin-bottom: 20px;
}

.service {
  position: relative;
  background-color: #000;
  border-radius: 20px;
  color: #ffffff;
  overflow: hidden;
  flex: 1 1 31%; /* 3 per row on desktop */
  min-height: 250px;
  margin-bottom: 20px;
}

.service-1 {
  background: none;
  border-radius: 0;
  color: #000;
  text-align: left;
}

.service-1 p {
  color: #555555;
  font-weight: 500;
}

.service-1 h2 {
  line-height: 45px;
  font-size: 40px;
}

.service-1 .button-orange {
  margin-top: 50px;
  display: inline-block;
  padding: 12px 25px;
  border-radius: 50px;
  background-color: #F07522;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  font-size: 16px;
}

.service-bg {
  width: 100%;
  height: 350px;
  object-fit: cover;
  border-radius: 20px;
  opacity: 0.5;
  display: block;
}

.service-text {
  position: absolute;
  top: 55%;
  left: 5%;
  text-align: left;
  
}

.service-text h2 {
  font-size: 25px;
  margin-bottom: 5px;
  color: #fff;
}

.service-text p {
  color: #E9E9E9;
  font-size: 18px;
  line-height: 1.4;
}

.icon-read {
  position: absolute;
  right: 5%;
  top: 5%;
  width: 24px;
  height: 24px;
}

/* Responsive */
@media (max-width: 960px) {
  .service { flex: 1 1 48%; }
  .service-1 { flex: 1 1 100%; margin-bottom: 30px; }
}

@media (max-width: 600px) {
  .service { flex: 1 1 100%; }
  .service-text {
    position: static;
    transform: none;
    padding: 15px;
  }
  .service-bg { height: 180px; }
}

/* ===============================
   PORTFOLIO & OTHERS
   =============================== */

.portfolio img{
    height: 300px;
    border-radius: 20px;
}

.google-icon img { height: 45px; width: 55px; }

.ratings, section { color: black; margin-bottom: 30px; }
.rating-comment p, .rating-date p { color: #555555; }
.rating-comment p { margin-bottom:0; margin-top: 10px; font-size: 16px; }



.ti-widget.ti-goog .ti-read-more span{
    color: #F07522 !important;
    font-size: 16px !important;
    font-weight: 500 !important;  
}

.ti-widget.ti-goog .ti-review-item>.ti-inner, .ti-widget.ti-goog .ti-load-more-reviews-container .ti-load-more-reviews-button, .ti-inner{
background-color: #FECD081A !important;
}
.fa-map-marker, .fa-envelope, .fa-phone, .checked, .fa-facebook, .fa-instagram { color:#FECD08; }

.author-section { background-color: #FECD081A; border-radius:12px; }
.author-entry { padding: 10px; }
.author-img { float: left; }
.rating-author h4 { margin-bottom: 0; font-size: 15px; }
.author-meta { padding-left: 65px; }
.google-icon { float: right; }

.why-choose-us { text-align: left; }
.why-choose-us h2 { font-size: 2rem; margin-bottom: 15px; font-weight: bold; }
.why-choose-us p { 
    font-size: 1rem; color: #555; margin-bottom: 30px; line-height: 2; 
}

.choose { text-align:center; }
.year-number { display: inline-block; vertical-align: top; font-size: 55px; line-height: 45px; }
.year-text { display: inline-block; vertical-align: top; margin-left: 10px; text-align: left; }

.choose h3 {
  font-size:20px;
  font-weight:bold;
  background-color:#FFE070;
  border-radius: 12px;
  padding: 20px 10px;
}

.choose_bg { height: 285px; }
.choose_bg img { width:100%; height:100%; border-radius: 12px; }
.choose_bglast { margin-bottom: 20px; }

.features {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 15px;
  margin-bottom: 22px;
}

.feature-box {
  background-color: #fff6d9;
  padding-left: 5px;
  border-radius: 8px;
  font-weight: bold;
  display: flex !important;
  align-items: center;
  gap: 0px;
}

.feature-box::before {
  content: url("img/star-tick.png");
  color: #f7b500;
  font-weight: bold;
}

.btn {
  background-color: #f15a29;
  color: white;
  padding: 12px 25px;
  border-radius: 25px;
  text-decoration: none;
  font-weight: bold;
  display: inline-block;
  transition: background 0.3s ease;
}

/* ===============================
   CONTACT
   =============================== */

.contact { display: flex; padding: 2.5rem;
    justify-content: space-evenly;
    align-items: center;}
.contact .icon { display: flex; justify-self: left; font-size: 16px; margin-top:7px; margin-right: 15px; }
.contact .wp-block-heading { display: flex; flex-direction: column; }
.contact-text h3 { margin-bottom: 5px; }
.contact-box h3 { color:#1C1C1C; }
.contact-box p { color:#555555; margin-bottom:20px; }

.contact ul { list-style:none; overflow: hidden; margin-top:10px; }
.contact ul li { float: left; margin: 0px 15px 0px 0; font-size: 25px; }
.contact ul li a { text-decoration: none; }

.social { display: block; margin-bottom: 10px; }
.social h3 { margin-bottom: 15px; }

.contact { background-color: #FFF7DA; border-radius: 20px; overflow: hidden; }
.contact p{font-size: 14px;}
.contact-column { padding: 50px 50px; }
.wpcf7 { background-color: #ffffff; padding: 20px 50px; border-radius: 20px; }
.wpcf7 label{font-size: 16px;}

.wpcf7 input,
.wpcf7 textarea {
  border: 1px solid #FECD08;
  outline: none;
  resize: none;
  border-radius: 10px;
  margin-top: 5px;
}

input.wpcf7-submit { 
    color: #FFFFFF; border-radius: 50px !important; 
    background-color: #F07522 !important;
}
.wpcf7 textarea { 
    min-height: 100px; 
}

.contact-text h5 { margin-bottom: 10px; }

.projects-complete { text-align:center; }
.projects-complete img { width: 100%; border-radius: 30px; }

/* ===============================
   FOOTER
   =============================== */

footer {
  color: #FFFFFF;
  background-color: #272727;
  text-align: center;
  padding: 25px 0;
}

footer ul { 
    list-style:disc; 
    overflow: hidden; 
	    list-style-position: inside;
}
footer ul li { 
    float: left; margin: 5px 25px 5px 0; 
    font-size: 13.5px; 
}
footer ul li a, footer ul li a:visited, footer ul li a:hover { text-decoration: none; color: #ffffff; }

footer ul li a:hover {
  border-bottom: 1px solid #d9dfeb;
  padding-bottom: 5px;
}

footer .col_4{
    width: 25.5%;
    margin-right: 3%;
}

footer .col_8{
width: 60%;
	text-align:left;
}

.logo-footer{
    background: white;
    border-radius: 12px;
}
.logo-footer img { margin-top:20px; }
.copyright { 
    text-align: center;
    color: #D9D9D9;
    width: 100%;
    clear: both; 
}
.copyright, .nav-footer { font-family: "DM Sans", sans-serif; }
/* Optional native smooth behavior (JS handles header offset) */
html { scroll-behavior: smooth; }

/* Helpful when jumping by hash via other means */
section, header, .choose, .our-service, .portfolio, .contact {
  scroll-margin-top: 90px; /* ~ header height */
}

/* Back-to-top button */
.back-to-top {
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #F07522;
  color: #fff;
  border: none;
  outline: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 18px rgba(0,0,0,0.2);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity .25s ease, transform .25s ease, visibility .25s;
  z-index: 999;
}

.back-to-top i { font-size: 16px; line-height: 1; }

.back-to-top.visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* Hover/active */
.back-to-top:hover { background: #d9661e; }
.back-to-top:active { transform: translateY(1px); }

/* ===============================
   RESPONSIVE NAV
   =============================== */

.menu-toggle { display: none; }
.toggleicon {
    display: none;
}
a.custom-logo-link img {
    padding: 20px;
    height: 100px;
    object-fit: contain;
}
span.toggleicon svg {
    width: 52px;
    height: 23px;
}
.menu-main-menu-container ul#primary-menu {
    text-align: center;
    margin: 0 auto;
    display: flex
;
    justify-content: center;
}
span.toggleicon svg {
    cursor: pointer;
}

.portfolio img {
    object-fit: cover;
    width: 100%;
}

@media (min-width: 960px) {
	section#portfolio p {
    font-size: 21px;
}
	section#services .service-1 p {
    font-size: 21px;
		font-weight: normal;
}
	.col.col_6.why-choose-us p {
    font-size: 21px;
    font-family: "DM Sans", sans-serif;
		line-height: 1.5;
}
	.col.col_6.why-choose-us p strong{
		font-weight:normal !important
	}
section#testimonial {
    margin-top: 75px;
    margin-bottom: 85px;
}
	section#contact .wp-block-column.is-layout-flow.wp-block-column-is-layout-flow {
    width: 50%;
}
	section#contact {
    display: block;
}
	section#contact .wpcf7 input, section#contact .wpcf7 textarea {
    width: 100%;
    padding: 10px;
}
	section#contact .wp-block-column.is-layout-flow.wp-block-column-is-layout-flow h5.wp-block-heading {
    font-size: 27px;
    margin-bottom: 2px;
}
	.contact .icon {
    font-size: 30px;
}
	section#contact .wp-block-column.is-layout-flow.wp-block-column-is-layout-flow .wp-block-columns.is-layout-flex {
    margin-bottom: 20px;
}
	.contact ul.social-icon {
    margin-top: 13px;
}

.contact ul.social-icon i.fa-brands {
    font-size: 30px;
    margin-right: 10px;
}
	
section#contact .wpcf7 textarea {
    min-height: 80px !important;
    height: 125px;
}
	section#contact .wpcf7 input.wpcf7-submit {
    padding: 16px;
}
	section#projects-completed {
    margin-top: 65px;
}
	section#why {
    margin-bottom: 55px;
}
}
/* Tablets (≤960px) */
@media (max-width: 960px) {
   

	.nav-bar .col_3 {
    width: 40%;
}
	    .nav-bar .col.col_2.header-button-widget {
        width: 30%;
    }
    nav.col.col_7.navigationmenu {
        position: fixed;
        left: 0;
        width: 86%;
        background: #fff7da;
        display: block;
        right: 0;
        z-index: 999;
        bottom: 0;
        top: 0;
        padding: 0px;
        transition: 0.3s 
ease-in-out;
        -ms-transition: 0.3s ease-in-out;
        -webkit-transition: 0.3s 
ease-in-out;
        transform: translateX(-105%);
        -ms-transform: translateX(-105%);
        -webkit-transform: translateX(-105%);
        box-shadow: 0 0 10px #00000059;
    }
    .menu-main-menu-container ul#primary-menu {
        text-align: left;
        justify-content: start;
        flex-direction: column;
        align-items: start;
        padding-left: 12px;
    }
	 body.active nav.col.col_7.navigationmenu {
        transform: none;
		 margin: 0;
    }
	
	body.active.admin-bar nav.col.col_7.navigationmenu {
		top: 33px;
	}

a.custom-logo-link img {
    height: 75px;
    padding: 15px;
    object-fit: contain;
}

	.toggleicon {
    display: block;
}
	.nav-bar {
    justify-content: space-between;
}
	.nav-bar .col.col_2.header-button-widget {
    width: 20%;
}
	.nav-bar span.toggleicon {
    width: 20%;
}
  .container_12 { width: 95% !important; margin: 0 auto; }
  .banner-text { position: static; width: auto; text-align: center; padding: 20px; transform: none; }
	
	.banner {
    min-height: auto;
}
	.banner .main-container.banner-text .wp-block-buttons.is-layout-flex.wp-block-buttons-is-layout-flex {
    justify-content: center;
}
	.banner .main-container.banner-text h2.wp-block-heading {
    font-size: 32px;
}
	.contact form.wpcf7-form input {
    width: 100%;
    padding: 10px;
}
	.contact h5.wp-block-heading {
    margin-bottom: 1px;
}
.contact .icon {
    font-size: 27px;
}

}

/* Mobiles (≤767px) */
@media (max-width: 767px) {
	
	.footerpopup .wpcf7 {
		padding: 11px;
	}
	.footerpopup {
		width: 96%;
	}
	
.wpcf7 textarea {
    height: 100px;
}
.wpcf7 input, .wpcf7 textarea {
    width: 100%;
}
	.wpcf7 input.wpcf7-form-control.wpcf7-submit {
    width: auto;
}
	.our-service .col_4 {
    width: 100%;
}
	.service-1 h2 {
    font-size: 32px;
}
	.col {
    margin: 0;
}
	.choose, .our-service, .portfolio, .contact {
    padding: 10px;
}
	.our-service {
    margin: 0px 0;
    overflow: hidden;
}
	.main-container.service-column {
    margin-top: 0;
    margin-bottom: 0;
}
	section#services {
    margin-top: 20px;
}
	.col.col_2.header-button-widget {
    display: none;
}
	.col_6 {
    width: 100%;
}
	.portfolio-column h2 {
    font-size: 32px;
}
	    .our-service .col_4 {
        margin-bottom: 15px;
    }
.mobilemargi {
    margin: 0 !important;
}
	section#testimonial h2 {
    font-size: 32px;
}

section#testimonial {
    padding: 10px;
}
	.wp-block-button.feature-box {
    width: 100%;
}
	.why-choose-us h2 {
    font-size: 32px;
}
	.contact {
    display: block;
    width: 95%;
    margin: 0 auto;
}
	.portfolio-column h2 {
    margin-bottom: 0;
}
.portfolio-column.main-container .col_3.col {
    width: 50%;
    padding: 7px;
}
.contact h2.wp-block-heading {
    font-size: 32px;
    text-align: center;
}

.contact .wp-block-columns.is-layout-flex {
    justify-content: center;
    text-align: center;
    gap: 10px;
    margin-bottom: 30px;
}
	.contact ul.social-icon li {
    font-size: 30px;
}

.contact ul.social-icon {
    display: flex
;
    justify-content: center;
}
	.contact .wpcf7 {
    padding: 14px;
    text-align: left;
}

.contact form.wpcf7-form input {
    width: 100%;
    padding: 10px;
}
	section#projects-completed h2 {
    font-size: 32px;
    margin-top: 24px;
}
	footer .main-container {
    padding: 17px;
}
	footer .main-container .nav-footer.col.col_8 {
    width: 100%;
}
	footer .main-container .nav-footer.col.col_8 h3.wp-block-heading {
    margin-top: 15px;
}
	footer .main-container .logo-footer.col.col_4 figure {
    margin-bottom: 0;
}

footer .main-container .logo-footer.col.col_4 img {
    padding: 25px;
    width: 242px !important;
    margin: 0 auto;
}
footer .main-container .logo-footer.col.col_4 {
    width: 100%;
}
	footer .main-container .nav-footer.col.col_8 ul li {
    width: 100%;
}
	.contact .wp-block-columns.is-layout-flex h5.wp-block-heading {
    margin-bottom: 5px;
}
	.contact .wp-block-columns.is-layout-flex .icon {
    margin: 0 auto;
    font-size: 40px;
}
	    .contact .wp-block-columns.is-layout-flex .icon {
        justify-self: center !important;
			        width: 100%;
    }
	.contact .wp-block-columns.is-layout-flex .icon .fa{
		margin:0 auto;
	}
.portfolio-column.main-container .col_6.col {
    padding: 7px;
}
	.portfolio img {
    height: auto;
    border-radius: 10px;
}
	.portfolio-column.main-container .col_3.col img {
    height: 160px;
    object-fit: cover;
}
/* 	.nav-bar.main-container {
    flex-direction: row-reverse;
} */
	    .nav-bar span.toggleicon {
        width: 15%;
    }
	    a.custom-logo-link img {
        height: 56px;
        object-fit: contain;
        padding: 10px;
        width: auto;
    }
	    .nav-bar .col_3 {
        width: 70%;
    }
  .menu-toggle { display: block; font-size: 28px; color: #1C1C1C; cursor: pointer; padding: 10px; float: left; }
  header nav { display: none; float: none !important; width: 100%; background: #FFF7DA; margin-top: 10px; border-radius: 8px; }
  header nav.active { display: block; }
  header nav ul { display: flex; flex-direction: column; align-items: center; padding: 10px 0; margin: 0; }
  header nav ul li { margin: 10px 0; float: none; text-align: center; }
  .container_12 [class*="grid_"] { width: 100% !important; margin: 10px 0 !important; }
  .grid_7, .grid_2 { width: 100% !important; text-align: center; margin-top: 10px; }
}

/* Small Phones (≤480px) */
@media (max-width: 480px) {
  .banner-text h1 { font-size: 1.8rem; line-height: 1.3; }
  .banner-text p { font-size: 1rem; }
}


@media (max-width: 960px) {
    .banner {
        min-height: 350px;
        background-position: center;
        background-size: cover;
    }
}

@media (max-width: 767px) {
    .nav-bar span.toggleicon {
        width: 15%;
        order: 1;
    }
	    .nav-bar .col_3 {
        order: 0;
    }
	    .nav-bar .col.col_2.header-button-widget {
        width: 45%;
        display: block;
    }
	header#masthead .col.col_2.header-button-widget a.wp-block-button__link.has-white-color.has-luminous-vivid-orange-background-color.has-text-color.has-background.has-link-color.wp-element-button {
    padding: 9px 0;
}

}