body {font-family:Arial, sans-serif; margin:0;padding:0;line-height:1.6;}
.container{width:80%;margin:0 auto;}
/*Header*/
  header{background:#333;color:#fff;padding: 1rem 0;z-index:10;}
  header h1{margin:0;text-align:center;}
  .header-top{display:flex;justify-content: space-between;align-items:center;}
  .header-top a {color:#fff;text-decoration:none;}
  .header-top .social-links a{margin-left:10px;color:#fff;}
/*Company name at the top of nav bar*/
  .company-name{font-size:32px; font-weight:bold; color:#fff; text-align:center; margin: 10px 0;}
/* nav design */
  nav{display:flex;justify-content: space-between;align-items:center;padding:1rem 0;}
  .nav-links{list-style:none;padding:0;margin:0;display:flex;gap:1rem;}
  .nav-links li{display:inline;}
  .nav-links a{color:#fff;text-decoration:none;}
  .nav-links a:hover{text-decoration:underline;/*font-size:1.25rem;*/}
  .menu-icon {display:none;cursor:pointer;}
  .menu-icon i{color:#fff;font-size:1.5rem;}

@media (max-width: 768px){
  .nav-links {
    display:none !important;
    flex-direction:column;
    background:#333;
    position:absolute;
    top:60px;
    left:0;
    width:100%;
    padding:1rem 0;
    z-index:1000;
  }
    .menu-icon{
    display:block;
    z-index:1001;
  }
}
 
  .nav-links.active {
    display:flex !important;
  }
  
  .nav-links li{
    text-align:center;
    margin: 1rem 0;
  }
  
  /* CTA Section Styling */
.cta-section {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin: 20px auto;
  padding: 10px;
  max-width: 600px;
}

/* CTA Buttons */
.cta-box-1 {
  flex: 1;
  padding: 10px;
  text-align: center;
  font-size: 18px;
  font-weight: bold;
  text-decoration: none;
  border-radius: 8px;
  transition: all 0.3s ease-in-out;
}

/* Call Button - Blue */
.call {
  background-color: #007BFF;
  color: white;
  border: 2px solid #007BFF;
}
.call:hover {
  background-color: #0056b3;
  border-color: #004494;
}

/* Quote Button - Grey */
.quote {
  background-color: #6c757d;
  color: white;
  border: 2px solid #6c757d;
}
.quote:hover {
  background-color: #545b62;
  border-color: #3e444a;
}

/* Mobile Responsive: Stack Buttons */
@media (max-width: 600px) {
  .cta-section {
    flex-direction: column;
    gap: 15px;
  }
}

  .footer-section{margin-bottom:1rem;}
  .payment-methods{flex-direction:row;justify-content:center;flex-wrap: wrap;}
  .payment-method{flex-direction:row;align-items:center;margin-bottom:1rem;}
  .payment-method i{margin-bottom:0;margin-right:0.5rem;}
  

/*hero sections*/

.hero {
  position:relative;
  color:#fff;
  text-align:center;
  padding:4rem 0;
}

.hero::before{
  content:'';
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  background: rgba(0, 0, 0, 0.5);
  z-index:1;
}

.hero .container{
  position:relative;
  z-index:2;
}

/*hero defualt*/
.hero {
  background: url(../img/local-electrician-van-1.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*TRUSTED TRADES LINKS*/
/*HUTCHINSONS PLASTERING*/
.hero-hutchinsons-logo{
  background: url(../img/external_logos/hutchinsons-logo.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*HD Construction*/
.hero-hd-construction-logo {
  background: url(../img/external_logos/hd-construction-logo.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*FRONT ROW ROOFING*/
.hero-front-row-roofing-logo {
  background: url(../img/external_logos/front-row-roofing-logo.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*EXTREME CLEAN*/
.hero-extreme-clean-logo {
  background: url(../img/external_logos/extreme-clean-logo.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero home*/
.hero-home{
  background: url(../img/local-electrician-van-1.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero main blog page*/
.hero-blog-page{
  background: url(../img/bristol-electrician.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero fuseboard upgrades*/
.hero-fuseboard-upgrades{
  background: url(../img/fuseboard-2.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero small jobs*/
.hero-small-jobs{
  background: url(../img/small-jobs-electrician.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero external sockets*/
.hero-external-socket{
  background: url(../img/outside-socket-3.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}
/*hero-spotlight-installations*/.hero-spotlight-installations{background: url(../img/spotlighting-3.jpg) no-repeat center center/cover;color:#fff;padding:5rem 0;text-align:center;}
/*hero Home Buyers EICR*/.hero-home-buyer-reports{background: url(../img/home-buyers-electrical-reports.jpg) no-repeat center center/cover;color:#fff;padding:5rem 0;text-align:center;}
/*hero House rewiring*/.hero-house-rewires{background: url(../img/house-rewire-bristol.jpg) no-repeat center center/cover;color:#fff;padding:5rem 0;text-align:center;}
/*hero fault finding*/.hero-fault-finding{background: url(../img/fault-finding-electrician-bristol.jpg) no-repeat center center/cover;color:#fff;padding:5rem 0;text-align:center;}
/*hero emergecny lighting*/.hero-emergency-lighting{background: url(../img/emergency-lighting-maintenance.jpg) no-repeat center center/cover;color:#fff;padding:5rem 0;text-align:center;}

/*hero smoke detection installation and testing*/
.hero-smoke-detection{
  background: url(../img/smoke-detection-1.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}
/*solar*/
.hero-solar{
  background: url(../img/solar-panel.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero ev installations*/
.hero-ev-installations{
  background: url(../img/zappi-car-charger-1.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero kitchen rewirng*/
.hero-kitchen-rewire{
  background: url(../img/kitchen-rewiring-electrician.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero appliance testing*/
.hero-appliance-testing{
  background: url(../img/applicance-tester.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero commerical sercices main page*/
.hero-commercial-main{
  background: url(../img/led-lighting-upgrade.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero commerical rewiring*/
.hero-commercial-rewiring-service{
  background: url(../img/commercial-rewiring.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero led lighting*/
.hero-led-lighting {
  background: url(../img/commercial-lighting.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero commercial eicr*/
.hero-commercial-eicr {
  background: url(../img/commercial-eicr.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero commerical fuse board*/
.hero-commercial-fuse-board {
  background: url(../img/commercial-fuseboard-upgrade.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero commercial electrical installations*/
.hero-commercial-electrical-inst {
  background: url(../img/commercial-installations.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero offcie rewiring*/
.hero-office-rewiring {
  background: url(../img/office-rewiring.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*LANDLORD AND HMO PAGES*/
/*hero landlord services main pages*/
.hero-landlord-main {
  background: url(../img/landlord-hmo-services.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero smoke detection  installations*/
.hero-smoke-detection {
  background: url(../img/smoke-detection-1.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero electrical maintenance*/
.hero-maintenance {
  background: url(../img/landlord-electrical-maintenance.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero landlord eicr*/
.hero-landlord-eicr {
  background: url(../img/landlord-electrical-reports.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero landlord emergency light testing*/
.hero-emergency-lighting {
  background: url(../img/emergency-lighting-maintenance.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero loandlord smoke alaram testing*/
.hero-smoke-detection {
  background: url(../img/smoke-detection-1.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*hero portable apppliacne testing*/
.hero-appliance-testing {
  background: url(../img/appliance-tester.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

/*BLOG*/

/*hero blog articles*/
.hero .hero-ouside-light-controls{
  background: url(../img/outdoor-light-control.jpg) no-repeat center center/cover;
  color:#fff;
  padding:5rem 0;
  text-align:center;
}

.hero h1 {
  margin:0;
  font-size:2.5rem;
}

.hero p{
  font-size:1.2rem;
}

.cta{
  display:inline-block;
  background:#4e4eff;
  color:#fff;
  padding:0.7rem 1.2rem;
  text-decoration:none;
  margin-top:10px;
}

.services {
  padding:2rem 0;
  text-align:center;
}

.services h2 {
  margin-bottom:1rem;
}

.service-item {
  margin-bottom:1.5rem;
}

.service-item i {
  font-size:2rem;
  color:#4e4eff;
  margin-bottom:0.5rem;
  
}

.service-item h3{
  margin-top:0.5rem;
  margin-bottom:0.5rem;
}

.description{
  padding:2rem 0;
}

.benefits{background:#f4f4f4; padding:2rem; }
.benefits ul{list-style:none; padding:0;}
.benefits ul li{background:#fff; margin:1rem 0;padding:1rem;border:1px solid #ddd}
.benefits ul li i{font-size:2rem; color:#4e4eff;margin-bottom:0.5rem;text-align:center;}

.contact {
  padding:2rem 0;
  text-align:center;
}

.contact h2{
  margin-bottom:1rem;
}
.service-item p{
  font-size:1rem;
  color:#333;
}

.realated-blogs ul{
  list-style:none;
  padding:0;
}

.related-blogs ul li{
  margin-bottom:0.5rem;
}

.related-blogs ul li a{
  color:#e8491d;
  text-decoration:none;
}

.related-blogs ul li a:hover{
  text-decoration:underline;
}

.services {
  text-align: center;
  padding: 50px 20px;
  background: #f8f9fa;
}

.services-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 20px;
  margin-top: 30px;
}

.service-box {
  position: relative;
  background-size: cover;
  background-position: center;
  height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

.overlay {
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
  padding: 20px;
  text-align: center;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  transition: background 0.3s;
}

.service-box:hover .overlay {
  background: rgba(0, 0, 0, 0.8);
}

.overlay h3 {
  font-size: 22px;
  margin-bottom: 10px;
}

.overlay p {
    max-height:60px;
  font-size: 16px;
  margin-bottom: 15px;
}

.buttons {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
}

.btn {
  text-decoration: none;
  background: #007bff;
  color: #fff;
  padding: 10px 15px;
  border-radius: 5px;
  font-weight: bold;
  transition: background 0.3s;
}

.btn:hover {
  background: #0056b3;
}

.call-btn {
  background: #28a745;
}

.call-btn:hover {
  background: #1e7e34;
}

.quote-btn {
  background: #ffc107;
  color: #000;
}

.quote-btn:hover {
  background: #e0a800;
}

/* Responsive Design */
@media (max-width: 768px) {
  .services-grid {
    grid-template-columns: 1fr;
  }
}
.service-links-container {
  background: linear-gradient(135deg, #222, #444); /* Modern dark gradient */
  padding: 40px 20px;
  text-align: center;
  border-radius: 10px;
}

.service-links-container h2 {
  color: #fff;
  font-size: 26px;
  margin-bottom: 20px;
  text-transform: uppercase;
  font-weight: bold;
}
.service-links-container h3{color:#fff;font-size:22px;font-weight:bold;margin-bottom:15px;}
.service-links-container p{ color:#fff;}

.service-links-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 15px;
  max-width: 900px;
  margin: auto;
}

.service-links-grid a {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #007bff;
  color: #fff;
  font-size: 18px;
  padding: 12px;
  border-radius: 8px;
  text-decoration: none;
  font-weight: bold;
  transition: background 0.3s, transform 0.2s;
}

.service-links-grid a:hover {
  background: #0056b3;
  transform: scale(1.05);
}


@media (max-width: 768px) {
  .service-links-grid {
    grid-template-columns: 1fr; /* Stacks links on mobile */
  }
}



.related-services ul{list-style:none;padding:0;}
.related-services ul li{margin-bottom:0.5rem;}
.related-services ul li a{color:#e8491d;text-decoration:none;}
.related-services ul li a:hover{text-decoration:underline;}

main{
  padding:2rem 0;
}

.blog-categories{
  margin-bottom:2rem;
}

.blog-categories ul{
  list-style:none;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
}

.blog-categories ul li{
  background:#f4f4f4;
  padding:0.5rem 1rem;
  border-radius:5px;
}

.blog-categories ul li a{
  text-decoration:none;
  color:#333;
}

.blog-posts{
  display:flex;
  flex-direction:column;
  gap: 2rem;
}

.blog-post{
  background:#f9f9f9;
  padding:1rem;
  border-radius:5px;
}

.blog-post h3{
  margin-top:0;
}

.blog-post article {
  margin-bottom:1rem;
}

.blog-post h4{
  margin:0;
}

.blog-post h4 a{
  text-decoration:none;
  color:#e8491d;
}

.blog-post h4 a:hover{
  text-decoration:underline;
}

.blog-content{
  flex:2;
}

.blog-content h2{
  color:#e8491d;
}

.related-posts{
  flex:1;
  background:#f4f4f4;
  padding:1rem;
  border-radius:5px;
}

.related-posts h2{
  color:#333;
}

.related-posts ul{
  list-style:none;
  padding:0;
  margin:0;
}

.related-posts ul li{
  margin-bottom:1rem;
}

.related-posts ul li a{
  text-decoration:none;
  color:#e8491d;
}

.related-posts ul il a:hover{
  text-decoration:underline;
}

.footer{
  background:#333;
  color:#fff;
  padding:2rem 0;
}

.footer .container{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
}

.footer-links{
  flex:1;
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
}

.footer-links .social-media {
  flex:1;
  margin:1rem;
}

.footer-links h4{
  margin-bottom:1rem;
}

.footer-links ul{
  list-style:none;
  padding:0;
}

.footer-links ul li{
  margin-bottom:0.5rem;
}

.footer-links ul li a{
  color:#fff;
  text-decoration:none;
}

.footer-links ul li a:hover{
  text-decoration:underline;
}

.footer .social-media ul{
  display:flex;
  flex-direction:column;
}

.footer .social-media ul li a {
  display:flex;
  align-items:center;
}

.footer .social-media ul li a i{
  margin-right:0.5rem;
}

.live-feeds{
  flex:1;
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  margin-top:2rem;
}

.live-feeds>div {
  flex:1;
  margin:1rem;
}

.live-feeds h4 {
  margin-bottom:1rem;
}

.footer p{
  text-align:center;
  margin-top:2rem;
}

.video-container{
  position:relative;
  padding-bottom:56.25%;
  height:0;
  overflow:hidden;
  max-width:100%;
  background:#000;
  margin-bottom:1rem;
}

.video-container iframe{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  border:0;
}
/*Accreditation */

.accreditation{
  padding:2rem 0;
  background:#fff;
  text-align:center;
  
}

.accreditation h2{
  margin-bottom:1rem;
}

.accreditation .logos{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:1rem;
}

.accreditation .logos img{
  max-width:100px;
  height:auto;
  object-fit:contain;
}

.footer-section{
  margin-bottom:1.5rem;
}

.footer-section h3{
  margin-bottom: 0.5rem;
}

.footer-section p, .footer-section ul{
  margin:0;
  padding:0;
  list-style:none;
}

.footer-section ul li{
  margin-bottom:0.5rem;
}

.payment-methods{
  display:flex;
  gap:1rem;
}

.payment-method {
  display: flex;
  flex-direction:column;
  align-items:center;
}

.payment-method i{
  font-size:2rem;
  margin-bottom:0.5rem;
}

.quick-links ul {display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: 3px;padding: 10px;color:#fff;}
.quick-links li{font-size:1rem;text-align: left;padding-left:20px;list-style-type:none;}
.quick-links a{text-decoration:none;color:#fff;}
.quick-links a:hover{text-decoration:underline;}

@media (max-width:480px){
	.quick-links ul{
    	display:block;
        margin:0;
        padding:0.5rem;
        width:100%;
        text-align:center;
        }
    
}
@media (max-width:768px){
	.quick-links ul{
        grid-template-columns:repeat(3, 1fr);
    }
}


.footer-bottom{
  text-align:center;
  margin-top:2rem;
}

/*404 page not found css*/
.hero-404{
  text-align:center;
  padding:100px 20px;
}

.hero-404 h2{
  font-size:10rem;
  margin:0;
}

.hero-404 {
  font-size:1.5rem;
  margin:20px 0;
}

.cta-button {
  display:inline-block;
  padding:10px 20px;
  background:#333;
  color:#fff;
  text-decoration:none;
  font-size:1.2rem;
}

.suggestions {
  text-align:center;
  padding:20px;
}

.suggestions h2{
  font-size:2rem;
  margin:0 0 20px;
}

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

.suggestions ul li{
  margin:10px 0;
}

.suggestions ul li a{
  text-decoration:none;
  color:#333;
}
/* Carousel Wrapper */
.carousel-wrapper {
    overflow: hidden;
    width: 100%;
    position: relative;
    padding: 10px 0; /* Optional padding */
    background-color: #f9f9f9; /* Optional background */
}

/*.container {
  max-width: 1200px;
  margin: auto;
  padding: 20px;
  position: relative;
  overflow: hidden;
}
*/
.carousel-container {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.carousel {
  display: flex;
  gap: 10px;
  transition: transform 0.5s ease;
  will-change: transform;
}

.carousel-item {
  min-width: 300px; /* Adjust size as needed */
  flex: 0 0 auto; /* Prevents items from shrinking */
  overflow: hidden;
  border-radius: 8px;
  position: relative;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1), 
                0 6px 20px rgba(0, 0, 0, 0.1); /* Soft shadow */
    transition: transform 0.3s, opacity 0.3s, box-shadow 0.3s;
}

.carousel-item img {
  width: 100%;
  height: 300px; /* Consistent image size */
  object-fit: contain;
  border-radius: 8px;
  transition: transform 0.3s;
}

.carousel-item:hover img {
  transform: scale(1.05);
}

button.carousel-prev, button.carousel-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background-color: rgba(0, 0, 0, 0.5);
  border: none;
  color: white;
  padding: 10px;
  cursor: pointer;
  z-index: 10;
  border-radius: 50%;
}

button.carousel-prev {
  left: 10px;
}

button.carousel-next {
  right: 10px;
}

button:focus {
  outline: none;
}

.carousel-container:hover .carousel-item img {
  animation-play-state: paused;
}
@media (max-width: 768px) {
    .carousel {
        gap: 0.5rem; /* Reduce gap on mobile */
    }
    .carousel-item {
        min-width: 200px; /* Smaller size on mobile */
    }
}


/*nav buttons for carousel */
.carousel-prev, .carousel-next {position:absolute; top:50%; transform:translateY(-50%); background-color: rgba(0,0,0,0.5); color:#fff; border:none; padding:1rem; cursor:pointer; z-index:1;}
.carousel-prev{left:10px;}
.carousel-next{right:10px;}

/*area navigational links*/
.area-navigation {list-style:none; margin:0; padding:0; text-align:center;}
.area-navigation li {display:inline-block;margin-right:15px;}
.area-navigation a {text-decoration:none; color:#ff6f61;font-weight:bold;font-size:1.2em;}
.area-navigation a:hover {color:#333;}

/*section style*/
.area-section {background-color:#fff; margin: 20px 0; padding: 20px; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);}
.area-section h2 {margin-bottom:10px; font-size:1.8em; color:#333;}
.area-section p {margin-bottom:15px;}
.area-section a {text-decoration:none; color:#007BFF;font-weight:bold;}
.area-section a:hover {text-decoration:underline;}
.area-section img.area-image {display:block; max-width:100%;height:auto;margin:15px 0; border-radius:8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);}
.area-section .cta-area {display:inline-block;background:#4e4eff;color:#fff;padding:0.7rem 1.2rem;text-decoration:none;margin-top:10px;}
.area-section {opacity;0; transition:opacity 0.5s ease;}
.area-section[style="display:block"] {opacity:1;}

/*FAQS CSS*/
#faq {background-color:#f8f9fa;padding: 50px 20px; margin: 20px auto; max-width:1200px; border-radius:8px; box-shadow: 0 4px 8px rgba(0,0,0,0.1);}
.faq-section{ margin-bottom:30px;}
.faq-section h2{font-size:24px; font-weight:bold; color:#333; margin:bottom:10px;}
.faq-section p{font-size:18px color:#555; line-height:1.6; margin-bottom:0;}
.faq-section .faq-question {cursor:pointer; padding:15px; background-color:#e9ecef; border: 1px solid #dee2e6; border-radius:6px; margin-bottom:5px;}
.faq-section .faq-answer{display:none; padding:15px; background-color:#ffffff; border:1px solid #dee2e6; border-radius:6px; margin-top:-5px;}
.faq-section.open .faq-answer {display:block;}
.faq-section .faq-section:hover, .faq-section .faq-section:focus {background-color:#dfe3e6; transition: background-color 0.3s;}
@media (max-width: 768px) {
#faq{padding:30px 15px;} .faq-section h2{font-size:22px;} .faq-section p{font-size:16px;}}

/*social share for blog articles*/
.social-share {margin-top:20px;}
.social-share h3 {font-size:18px;margin-bottom:10px;}
.social-share .social-icon {display:inline-block;margin-right:10px;margin-bottom:12px;padding:8px 12px;text-decoration:none;border-radius:4px;color:#fff;}
.social-icon.facebook{background-color:#3b5998;}
.social-icon.twitter{background-color:#1da1f2;}
.social-icon.linkedin{background-color:#0077b5;}
.social-icon.whatsapp{background-color:#25d366;}
.social-icon:hover{opacity:0.8;}

/*Reviews*/
.review-carousel-wrapper{width:100%;overflow:hidden;position:relative;margin:20px auto;background-color:#f9f9f9;border:1px solid #ddd;border-radius:8px;}
.review-carousel{display:flex;transition:transform 0.5s ease-in-out;will-change:transform;}
.review-slide{min-width:100%;box-sizing:border-box;padding:20px;text-align:center;}
.review-stars{font-size:20px;margin-bottom:10px;display:flex;justify-content:center;align-items:center;}
.star{color:gold;font-size:18px;}
.rating-number{font-size:20px;margin-left:10px;color:#333;}
.review-service{font-size:18px;font-weight:bold;margin-bottom:5px;}
.review-author{font-size:16px;margin-bottom:5px;color:#555;}
.review-body{font-size:14px;color:#555;}
/*Breadcrumbs*/
.breadcrumb{display:flex;flex-wrap:wrap;list-style:none;padding:10px 15px;margin:0;background-color:#f8f9fa;border-radius:5px;}
.breadcrumb-item{margin-right:5px;font-size:14px;}
.breadcrumb-item a {text-decoration:none;color:#007bff;transition:color 0.3s;}
.breadcrumb-item a:hover{color:#0056b3;}
.breadcrumb-item::after {content: '>'; margin-left:5px;color:#6c757d;}
.breadcrumb-item:last-child::after{content: '';}
.breadcrumb-item.active{color:#6c757d;font-weight:bold;}
.breadcrumb-item.active a {pointer-events:none;color:#6c757d;}
.cta-box { background-color: #f7f7f7; padding: 20px; border: 1px solid #ddd; margin: 20px 0; }
/*LOCAL SERVICE*/
.local-service{text-align:center;}
.local-contact{text-align:center;}

/*CHAT BOT*/
  /* General Chatbot Styling */

#chat-bubble {
  position:fixed;bottom:20px;right:20px;
  background-color: #007BFF;
  color: white;
  padding: 10px 15px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index:9999;
}

#chat-container {
  display: none;
  position: fixed;
  bottom: 60px;
  right: 20px;
  width: 300px;
  background-color: #fff;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  padding: 15px;
  max-height: 80vh;
  overflow-y: auto;
  color:black;
  z-index:9999;
}

#chat-header {
  font-size: 16px;
  font-weight: bold;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#close-chat {
  cursor: pointer;
}

#chat-messages {
  max-height: 300px;
  overflow-y: scroll;
  margin-bottom: 15px;
}

.user-message, .bot-message {
  padding: 8px;
  margin: 5px 0;
  border-radius: 5px;
}

.user-message {
  background-color: #e0e0e0;
  text-align: right;
}

.bot-message {
  background-color: #007BFF;
  color: white;
}

#chat-input-container {
  display: flex;
  gap: 10px;
}

#chat-input {
  width: 70%;
  padding: 8px;
  border-radius: 5px;
  border: 1px solid #ccc;
}

#send-btn {
  width: 25%;
  padding: 8px;
  background-color: #007BFF;
  color: white;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}

#send-btn:hover {
  background-color: #0056b3;
}

/* Email Form */
#email-container {
  margin-top: 15px;
  text-align: center;
}

#user-email, #user-phone, #email-message {
  width: 100%;
  padding: 10px;
  margin-bottom: 10px;
  border-radius: 5px;
  border: 1px solid #ccc;
}

#send-email-btn {
  padding: 10px;
  background-color: #28a745;
  color: white;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}

#send-email-btn:hover {
  background-color: #218838;
}

#send-email-btn:disabled {
    background-color: #b0d4ff;
    cursor: not-allowed;
}
/* Spinner Styles (Rotating Sand Timer) */
.spinner {
    border: 4px solid #f3f3f3; /* Light grey */
    border-top: 4px solid #007bff; /* Blue */
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: spin 1s linear infinite;
    margin: 20px auto;
}

/* Spinner Animation */
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Mobile Devices */
@media (max-width: 767px) {
  #chat-container {
    width: 80%;
    right: 0;
    bottom: 0;
    border-radius: 0;
  }

  #chat-bubble {
    bottom: 20px;
    right: 10px;
    padding: 15px;
  }
}

/*ESTIMATE FORM CSS*/
form {
    max-width: 600px;
    margin: 50px auto;
    padding: 20px;
    background-color: #f9f9f9;
    border: 1px solid #ddd;
    border-radius: 10px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    font-family: Arial, sans-serif;
}

form .form-section {
    margin-bottom: 20px;
}

form .form-section label {
    display: block;
    margin-bottom: 5px;
}

form .form-section input[type="number"],
form .form-section select {
    width: 100%;
    padding: 20px;
    font-size: 16px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

form button {
    padding: 10px 20px;
    font-size: 16px;
    background-color: #4CAF50;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

form button:hover {
    background-color: #45a049;
}

.result {
    margin-top: 20px;
    font-size: 18px;
    font-weight: bold;
}
/* Add styles for result and reset button */
.result {
    margin-top: 20px;
    font-size: 18px;
    font-weight: bold;
    background-color: #e9ffe9;
    padding: 15px;
    border: 1px solid #b4e0b4;
    border-radius: 5px;
}

#start-again-btn {
    margin-top: 10px;
    padding: 10px 20px;
    font-size: 16px;
    background-color: #f44336;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

#start-again-btn:hover {
    background-color: #d32f2f;
}
.h2-estimate {text-align:center;}

/*SEARCH BOX*/
#search-container{margin-top:10px;}#search-bar{padding:0.5em;width:300px;}
/*BURRIDGE BLOG*/
.main-blog-container{display:flex;align-items:flex-start;gap:20px;max-width:1200px;margin:auto;padding:20px;} #blog-container{flex:1;padding:20px;display:grid;grid-template-columns:repeat(auto-fill, minmax(300px,1fr));gap:20px;margin-bottom:20px;}
/*SIDEBAR*/
  .sidebar{flex:1;padding:20px;background-color:#f9f9f9;border:1px solid #ddd;border-radius:8px;margin-bottom:20px;margin-top:20px;}
  .sidebar-section{margin-bottom:20px;}
  .sidebar-section h3{font-size:1.2em;color:#333;margin-bottom:10px;text-align:left;border-bottom:2px solid #007bff;padding-bottom:5px;}
  .sidebar-section ul {list-style-type:none;padding:0;}
  .sidebar-section li{cursor:pointer;padding:8px;color:#007bff;}
  .sidebar-section li:hover{background-color:#e0e0e0;}
/*BLOG CARD*/
  .blog-card{background-color:#fff;padding:20px;border-radius:10px;box-shadow:0 4px 6px rgba(0,0,0,0.1);transition:transform 0.2s ease;}
  .blog-card:hover{transform:scale(1.05);}
  .blog-card h2{font-size:24px;margin-bottom:15px;color:#007BFF;}
  .blog-card h2 a {text-decoration:none;color:inherit;}
  .blog-card p {font-size:15px;color:#555;margin-bottom:20px;}
  .blog-card .category{font-size:14px;font-style:italic;color:#777;margin-top:10px;}
  .blog-card .tags{font-size:12px;font-style:italic;color:#777;margin-top:10px;}
/*READ MORE BUTTON*/
  .read-more {display:inline-block;padding:10px 20px;font-size:16px;background-color:#007BFF;color:#FFF;border-radius:5px;text-decoration:none;transition:background-color 0.3s ease;}
  .read-more:hover{background-color:#0056b3;}
/*LOAD MORE BUTTON*/
  #load-more{display:block;width:200px;margin-bottom:10px;padding:12px;font-size:16px;background-color:#28a745;color:#fff;text-align:center;margin:0 auto;border:none;border-radius:5px;cursor:pointer;transition: background-color 0.3s ease;}
  #load-more:hover{background-color:#218838;}
/*BLOG MEDIA SCREEN SIZES*/
  @media (max-width: 480px) {#blog-container{grid-template-columns:1fr;}}
/* Table of Contents Wrapper */
nav#toc {
  background: #f8f9fa; /* Light gray background for contrast */
  border: 1px solid #ddd; /* Subtle border */
  border-radius: 8px; /* Rounded corners */
  padding: 1rem;
  margin-bottom: 2rem; /* Spacing from other elements */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Soft shadow */
}

/* Table of Contents Heading */
nav#toc h3 {
  font-size: 1.5rem;
  font-weight: 600;
  color: #333; /* Darker color for emphasis */
  margin-bottom: 0.5rem;
  border-bottom: 2px solid #007bff; /* Accent line below heading */
  padding-bottom: 0.25rem;
}

/* TOC List Styles */
nav#toc ul {
  list-style: none; /* Remove default bullets */
  padding: 0;
  margin: 0;
}

/* TOC List Items */
nav#toc ul li {
  margin: 0.5rem 0;
}

/* TOC Links */
nav#toc ul li a {
  text-decoration: none; /* Remove underline */
  font-size: 1rem;
  color: #007bff; /* Stylish blue for links */
  font-weight: 500;
  display: block;
  padding: 0.4rem 0.6rem;
  border-radius: 6px;
  transition: all 0.3s ease; /* Smooth hover transition */
}

/* Hover Effect on Links */
nav#toc ul li a:hover {
  background-color: #007bff; /* Blue background */
  color: #fff; /* White text for contrast */
  text-decoration: none;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); /* Subtle shadow */
}

/* Active Link Styles (Optional) */
nav#toc ul li a:active,
nav#toc ul li a:focus {
  outline: none;
  background-color: #0056b3; /* Darker blue */
  color: #fff;
  font-weight: 600;
}
@media (max-width: 768px) {
  nav#toc {
    padding: 0.8rem;
    font-size: 0.9rem;
  }
  nav#toc h3 {
    font-size: 1.25rem;
  }
  nav#toc ul li a {
    font-size: 0.9rem;
    padding: 0.3rem 0.5rem;
  }
}

.sticky-cta {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: #333;
  color: #fff;
  padding: 10px;
  font-size: 16px;
  text-align: center;
  z-index: 999;
}
.sticky-cta a {
  color: #ffc107;
  font-weight: bold;
}
.trust-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
  margin: 2rem 0;
  padding: 1rem;
  background-color: #f8f8f8;
  border-radius: 10px;
}

.trust-badge {
  flex: 1 1 120px;
  max-width: 200px;
  text-align: center;
  padding: 0.5rem;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 0 5px rgba(0,0,0,0.05);
}

.trust-badge img {
  max-width: 100%;
  height: auto;
}
/* ---------- PRICING SECTION ---------- */

.pricing {
  padding: 60px 20px;
  background: #f6f7fb;
  text-align: center;
}

.pricing h2 {
  font-size: 32px;
  margin-bottom: 35px;
  color: #1e1e1e;
}

.price-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 25px;
  max-width: 1000px;
  margin: 0 auto;
}

.price-card {
  position: relative;
  overflow: hidden;
  background: #fff;
  border-radius: 12px;
  padding: 25px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
  transition: 0.3s;
}

.price-card h3 {
  margin-bottom: 10px;
  color: #1e73be; /* Your brand blue */
}

.price-card p {
  font-size: 20px;
  font-weight: 600;
  margin: 10px 0 20px;
}

.price-card .btn.small {
  display: inline-block;
  padding: 10px 18px;
  background: #1e73be;
  color: #fff;
  border-radius: 6px;
  font-size: 15px;
  text-decoration: none;
  transition: 0.2s;
}

.price-card .btn.small:hover {
  background: #155a8f;
}

.price-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 10px rgba(0,0,0,0.12);
}

/* Base ribbon style */
.ribbon {
  position: absolute;
  top: 28px;
  right: -65px;
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  padding: 6px 60px;
  transform: rotate(45deg);
  display:flex;
  align-items:center;
  justify-content:center;
  letter-spacing:0.5px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}

/* Variations */
.ribbon.booked { background: #0077ff; }   /* Most Booked */
.ribbon.value { background: #28a745; }    /* Best Value */
.ribbon.popular { background: #ff9800; }  /* Popular Choice */

/* ---------- AUDIENCES (HOMEOWNER / LANDLORD / COMMERCIAL) ---------- */

.audiences {
  padding: 60px 20px;
  text-align: center;
}

.audiences h2 {
  font-size: 32px;
  margin-bottom: 35px;
  color: #1e1e1e;
}

.audience-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 25px;
  max-width: 1000px;
  margin: 0 auto;
}

.audience-card {
  background: #fff;
  border: 1px solid #e1e1e1;
  border-radius: 12px;
  padding: 25px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  transition: 0.3s;
}

.audience-card h3 {
  margin-bottom: 10px;
  color: #1e73be;
  font-size: 22px;
}

.audience-card p {
  margin-bottom: 15px;
  color: #444;
}

.audience-card .btn.small {
  display: inline-block;
  padding: 10px 18px;
  background: #1e73be;
  color: #fff;
  border-radius: 6px;
  font-size: 15px;
  text-decoration: none;
  transition: 0.2s;
}

.audience-card .btn.small:hover {
  background: #155a8f;
}

.audience-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 10px rgba(0,0,0,0.10);
}


/* ---------- MOBILE / TABLET RESPONSIVE ---------- */

@media(max-width: 600px) {
  .pricing h2, .audiences h2 {
    font-size: 26px;
  }

  .price-card, .audience-card {
    padding: 20px;
  }

  .price-card p {
    font-size: 18px;
  }
}

/* ---------- BENEFITS SECTION ---------- */

.benefits {
  padding: 60px 20px;
  background: #ffffff;
  text-align: center;
}

.benefits h2 {
  font-size: 32px;
  margin-bottom: 35px;
  color: #1e1e1e;
}

.benefit-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 25px;
  max-width: 1000px;
  margin: 0 auto;
}

.benefit-card {
  background: #f6f7fb;
  border-radius: 12px;
  padding: 25px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
  border: 1px solid #e4e6ec;
  transition: 0.3s;
}

.benefit-card h3 {
  margin-bottom: 12px;
  color: #1e73be;
  font-size: 20px;
}

.benefit-card p {
  color: #444;
  line-height: 1.45;
  font-size: 15px;
}

.benefit-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 10px rgba(0,0,0,0.10);
}

/* ---------- MOBILE RESPONSIVE ---------- */

@media(max-width: 600px) {
  .benefits h2 {
    font-size: 26px;
  }

  .benefit-card {
    padding: 20px;
  }
}
.local-services {
  padding: 50px 0;
}

.service-links {
  list-style: none;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.service-links li a {
  background: #f6f7fb;
  padding: 10px 15px;
  border-radius: 6px;
  border: 1px solid #e4e6ec;
  display: inline-block;
  text-decoration: none;
  color: #1e73be;
  transition: 0.3s;
}

.service-links li a:hover {
  background: #1e73be;
  color: #fff;
}
    .trust-banner {
  background: #f7f7f7;
  padding: 35px 0;
  text-align: center;
  border-top: 1px solid #e2e2e2;
  border-bottom: 1px solid #e2e2e2;
  transition: background 0.2s ease-in-out;
}

.trust-banner:hover {
  background: #f1f1f1;
}

.trust-banner p {
  font-size: 1.15rem;
  max-width: 900px;
  margin: 0 auto;
  color: #2b2b2b;
  font-weight: 500;
  line-height: 1.6;
}
/* ------Trust Strip ------ */
.trust-strip {
  background: #f8fbff;
  border: 1px solid #e2eaff;
  padding: 14px 20px;
  border-radius: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin: 25px 0;
  flex-wrap: wrap;
}

/* Left badges container */
.trust-strip .left {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

/* Single badge */
.trust-strip .badge {
  background: #e8f1ff;
  color: #003366;
  padding: 6px 12px;
  font-size: 0.9rem;
  border-radius: 6px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 4px;
  border: 1px solid #cfe0ff;
}

/* Muted text (smaller + softer) */
.trust-strip .badge .muted {
  color: #6f7a89;
  font-weight: 500;
  font-size: 0.85rem;
}

/* Right side text */
.trust-strip .right {
  font-size: 0.9rem;
  color: #556;
  text-align: right;
  flex: 1;
}

/* Responsive behavior */
@media (max-width: 768px) {
  .trust-strip {
    flex-direction: column;
    align-items: flex-start;
  }
  
  .trust-strip .right {
    text-align: left;
    margin-top: 6px;
    width: 100%;
  }
}