/**
 * Theme Name: Hot Water Apply
 * Author: Safe Planet
 * Description: Safe Planet is a proudly Australian-owned company. Established in 2019, we are currently working in Victoria as an accredited partner (AP) under the VEU programme. We are also recognized by the New South Wales Government as an Accredited Certificate Provider (ACP) and are involved in the New South Wales Energy Saving Scheme (ESS).
 * Version: 1.0.0
 * */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --red: #E8312A;
  --dark: #111110;
  --dark2: #1a1a18;
  --gray: #f4f4f2;
  --gray2: #e8e8e4;
  --text: #444440;
  --white: #ffffff;
  --font-head: 'Syne', sans-serif;
  --font-body: 'DM Sans', sans-serif;
  --radius: 16px;
  --radius-sm: 10px;
}

html { scroll-behavior: smooth; }
body { font-family: "Host Grotesk", sans-serif; overflow-x: hidden;}

/*NavBar*/
.navigation-bar{position: absolute; top: 0; left: 0; width: 100%; z-index: 999; margin-top: 15px;}
nav{background: #000; border-radius: 15px; border: 1px solid #424242; padding: 10px 20px; box-shadow: 0 0 50px rgba(255,255,255,0.2)}
.navbar-expand-lg .navbar-nav .nav-link{font-size: 18px; font-weight: 500; color: #fff; padding-left: 25px;}
/*Hero*/
section.position-relative{overflow: hidden;}
#particles-js{position: absolute; height: 100%; z-index: 1; pointer-events: none;}
canvas{display: block;}
.hero{padding: 200px 0 75px; background-size: 100% 100%; background-position: center; background-repeat: no-repeat;}
.hero-content{z-index: 2; position: relative;}
.hero-badge{display: inline-flex; align-items: center; gap: 8px; background: var(--gray); border-radius: 50px; padding: 6px 16px; font-size: 18px; font-weight: 600; color: #158371;}
.hero-badge span { width: 10px; height: 10px; border-radius: 50%; background: #158371; }
.hero h1 {font-size: 45px; font-weight: 800; color: #fff; margin: 60px 0 80px;}
.hero h1 em { font-style: normal; color: #158371; font-family: "Playfair Display", serif;}
.trustpilot{height: 125px; margin-right: 25px;}
.goole-star{position: relative; background-color: #bebebe2b; border: 3px solid #ffffff26; padding: 25px 35px 17px 25px; backdrop-filter: blur(2px); display: inline-block;} 
.goole-star ul.star{padding-top: 13px; padding-bottom: 10px; margin: 10px 0; padding: 0;} 
.goole-star ul.star li{list-style: none; display: inline-block;}
.goole-star span{color: #02cd8b;} 
.goole-star ul li i{color: #158371;}
.form-section{background: #fff; box-shadow: 0 0 30px rgba(0,0,0,0.2); padding: 30px; border-radius: 15px; z-index: 55;}
.form-section h2{font-family: "Playfair Display", serif; color: #158371; margin-bottom: 40px; font-size: 30px; font-weight: 800;}
.form-section label{font-size: 17px; font-weight: 600; color: #004e35; text-transform: capitalize; display: block;}
.form-section input[type=text],[type=email]{padding: 12px 15px; color: #000; font-size: 16px; border: 1px solid #E0E0E0; border-radius: 15px; display: block; width: 100%; margin-top: 10px;}
.mb-field{margin-bottom: 20px;}
.mb-field p{color: #004e35; font-size: 18px; font-weight: 500;}
.radio-btn input{margin-right: 5px;}
.radio-btn{color: #000; font-size: 17px; font-weight: 500;}
.set-of-lb-rb{margin-right: 20px;}
.color-black{color: #000;}
.form-submit{display: block; width: 100%; background: #004e35; border: 1px solid #004e35; padding: 12px 25px; text-transform: uppercase; font-size: 16px; color: #fff; font-weight: 600; letter-spacing: 0.5px; border-radius: 15px; margin-top: 20px; transition: all 0.5s;}
.form-submit:hover{background: #000; border: 1px solid #000; color: #fff; transition: all 0.5s linear;}

/* ── TICKER ── */
.ticker-bar{background: #fff; padding: 40px 0;}
.owl-carousel .owl-item img{display: inline-block; height: 125px; width: auto!important;}

/*About Section*/
#features{padding: 0 0 75px;}
.about-heading h2{font-size: 40px; font-weight: 700; color: #000; margin: 30px 0 60px;}
.about-heading h2 em{font-style: normal; color: #158371; font-family: "Playfair Display", serif;}
.accordion-button{background: #fff; font-size: 30px; font-weight: 600; color: #000; box-shadow: none; padding-left: 0; padding-right: 0; }
.accordion-button:not(.collapsed){background: #fff; color: #158371; box-shadow: none;}
.accordion-button:focus{border-color: transparent; box-shadow: none;}
.accordion-button i{padding: 13px; background: #158371; border-radius: 50%; text-shadow: -0.5px 1px 2px rgba(0,0,0,0.7); height: 50px; width: 50px; font-size: 25px; color: #fff; margin-right: 15px;}
.accordion-item{border: none;}
.accordion-body{padding-left: 65px; padding-right: 0; padding-top: 0; font-size: 18px;}
.accordion-button:not(.collapsed) + i{background: #158371;}
.about-right-img img{border-radius: 5px;}

/*Why Choose*/
.process-section{background: linear-gradient(45deg,rgba(0, 0, 0, 1) 0%, rgba(21, 131, 113, 1) 100%, rgba(0, 42, 28, 1) 100%); padding: 75px 0;}
.process-heading h2{font-size: 40px; font-weight: 700; color: #fff; margin: 30px 0 20px;}
.process-heading p{font-size: 20px; color: #eee; margin: 0 0 50px;}
.nav-pills{width: 100%;}
.nav-pills .nav-item{width: 24%;}
.nav-pills .nav-item .nav-link{background: transparent; color: #fff; font-size: 20px; font-weight: 400; text-align: center; width: 100%; border-radius: 25px; border: 1px solid #eee;}
.nav-pills .nav-item .nav-link.active{background: #158371; color: #fff;}
.tab-pane{padding: 30px 0;}
.tab-item-img{margin-right: 50px; min-width: 65%;}
.tab-item-img img{border-radius: 25px;}
.tab-item-content h2{font-family: "Playfair Display", serif; color: #fff; font-size: 40px; font-weight: 400;}
.tab-item-content p{color: #eee; font-size: 20px; font-weight: 500; margin-top: 20px;}

/*Testimonials*/
.testimonials-section{padding: 75px 0; background: #eef7f4;}
.wid-32{width: 32%;}
.single-testimonials{background: #fff; border-radius: 15px; padding: 30px; box-shadow: 0 0 20px rgba(0,0,0,0.1); margin-bottom: 25px;}
.star-rating span{display: inline-block; color: #d5e209; font-size: 25px;}
.single-testimonials p{margin: 30px 0 20px; font-size: 18px; color: #000;}
.single-testimonials h3{font-family: "Playfair Display", serif; color: #158371; font-size: 20px; font-weight: 400;}
.testimonials-middle-heading h2{ font-weight: 600; font-size: 45px; color: #000;}
.testimonials-middle-heading h2 em{font-family: "Playfair Display", serif; color: #158371; font-style: normal;}
.testimonials-middle-heading p{font-size: 18px; color: #424242; margin: 15px 0 30px;}
.testimonials-middle-heading h3{color: #000; font-size: 40px;}
.testimonials-middle{position: sticky; top: 150px; align-self: start;}

/*FAQ*/
.faq{padding: 75px 0;}
.faq-heading h2{font-size: 40px; font-weight: 700; color: #000; margin: 20px 0;}
.faq-heading h2 em{font-style: normal; color: #158371; font-family: "Playfair Display", serif;}
.faq-heading p{font-size: 20px; color: #424242; margin: 0 0 50px;}
.more-margin{margin: 0 250px;}
.faq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; margin-top: 60px; }
.faq-list { display: flex; flex-direction: column; gap: 0; margin-top:36px;}
.faq-item { border-bottom: 1px solid var(--gray2); }
.faq-question {
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px 0; cursor: pointer; gap: 16px; font-weight: 600; font-size: 24px;
  transition: color .2s;
}
.faq-question:hover { color: #158371; }
.faq-icon { width: 28px; height: 28px; border-radius: 50%; background: var(--gray); display: grid; place-items: center; flex-shrink: 0; font-size: 1.1rem; transition: background .2s, transform .3s; }
.faq-item.open .faq-icon { background: #158371; color: #fff; transform: rotate(45deg); }
.faq-answer { max-height: 0; overflow: hidden; transition: max-height .35s ease, padding .35s; }
.faq-answer p { padding-bottom: 20px; font-size: 18px; color: #000;}
.faq-item.open .faq-answer { max-height: 200px; }
.faq-cta-box { background: var(--dark); border-radius: var(--radius); padding: 48px 36px; }
.faq-cta-box h3 { font-family: var(--font-head); font-size: 1.8rem; font-weight: 800; color: var(--white); margin-bottom: 16px; }
.faq-cta-box p { font-size: .92rem; color: rgba(255,255,255,0.6); line-height: 1.6; margin-bottom: 28px; }

/* ── FOOTER ── */
footer{background: #011C01; padding: 75px 0 50px; text-align: center;}
footer h2{color: #fff; font-size: 35px;}
footer p{color: #fff; font-size: 20px; font-weight: 400; padding: 15px 0 40px;}
footer a.check-btn-cls{padding: 15px 25px; background: #fff; border: 1px solid #fff; color: #000; border-radius: 25px; font-size: 18px; font-weight: 600; text-transform: capitalize; text-decoration: none;}
footer h5{color: #eee; font-size: 16px; font-weight: 400; margin-top: 75px;}
footer h5 a{color: #fff; text-decoration: none;}

.thank-you-section{padding: 200px 0 80px; background: linear-gradient(45deg,rgba(0, 0, 0, 1) 0%, rgba(21, 131, 113, 1) 100%, rgba(0, 42, 28, 1) 100%);}
.thank-you-section h1{font-size: 40px; color: #fff;}
.thank-you-section p{font-size: 26px; color: #fff; padding-bottom: 30px;}
.thank-you-section a{background: #000; padding: 12px 30px; color: #fff; font-size: 16px; text-decoration: none; border-radius: 15px; font-weight: 600;}

@media only screen and (max-width : 480px)
{
  .navbar-brand img{height: 60px;}
  .navbar-toggler i{color: #fff;}
  .navbar-expand-lg .navbar-nav .nav-link{padding-left: 0; padding-top: 15px;}
  .hero{padding: 140px 0 40px; background-size: cover;}
  .hero-badge{font-size: 16px;}
  .hero h1{margin: 20px 0; font-size: 22px;}
  .hero-btm-logos{justify-content: space-between; padding-bottom: 20px;}
  .hero-btm-logos .trustpilot{height: 80px; margin-right: 0;}
  .goole-star{padding: 20px;}
  .form-section{padding: 20px;}
  .form-section h2{font-size: 22px; margin-bottom: 15px;}
  .mb-field{margin-bottom: 15px;}
  .form-section label{font-size: 15px;}
  .form-section input[type=text], [type=email]{margin-top: 5px; padding: 7px 15px;}
  .mb-field p{font-size: 15px;}
  .form-submit{margin-top: 10px;}
  .about-heading h2{margin: 15px 0; font-size: 22px;}
  .accordion-button{font-size: 22px;}
  .accordion-body{padding-left: 60px;}
  #features{padding: 0 0 25px;}
  .process-section{padding: 30px 0;}
  .process-heading h2{font-size: 22px; margin: 20px 0;}
  .process-heading p{margin: 0 0 20px; font-size: 16px;}
  .nav-pills .nav-item .nav-link{font-size: 16px;}
  .tab-items-content{display: block!important;}
  .tab-item-img img{width: 100%;}
  .tab-item-img{margin-right: 0; min-width: 100%;}
  .tab-item-content h2{font-size: 22px; margin-top: 20px;}
  .tab-item-content p{font-size: 16px;}
  .tab-pane{padding: 30px 0 0;}
  .testimonials-section{padding: 30px 0;}
  .testimonial-set{flex-direction: column;}
  .wid-32{width: 100%;}
  .order-set{order: -1;}
  .testimonials-middle{position: static;}
  .testimonials-middle-heading h2{font-size: 22px;}
  .testimonials-middle-heading h3{font-size: 30px; margin-bottom: 10px;}
  .testimonials-middle-heading h5{margin-bottom: 20px;}
  .single-testimonials{padding: 20px;}
  .single-testimonials p{margin: 20px 0; font-size: 16px;}
  .single-testimonials h3{font-size: 18px;}
  .faq{padding: 40px 0;}
  .more-margin{margin: 0;}
  .faq-heading h2{font-size: 22px;}
  .faq-heading p{font-size: 16px; margin: 0 0 20px;}
  .faq-question{font-size: 20px;}
  .faq-answer p{font-size: 16px;}
  footer{padding: 40px 0;}
  footer h2{font-size: 22px;}
  footer p{font-size: 16px;}
  footer h5{margin-top: 50px;}
  .thank-you-section{padding: 130px 0 60px;}
  .thank-you-section h1{font-size: 25px; color: #fff;}
  .thank-you-section p{font-size: 18px;}
}