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


      :root{
  --gold:#b8860b;
  --dark:#0d0d0d;
}

body{
  font-family:'Inter',sans-serif;
  overflow-x:hidden;
}

.top-bar{
  background:#0a0a0a;
}

.social-icon{
  width:32px;
  height:32px;
  border:1px solid rgba(255,255,255,.4);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:.3s;
}

.social-icon:hover{
  background:var(--gold);
  border-color:var(--gold);
}

.logo-box{
  width:52px;
  height:52px;
  background:#1b1b1b;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:'Playfair Display',serif;
  font-size:28px;
  border-radius:4px;
}

.brand-text{
  font-family:'Playfair Display',serif;
  font-size:22px;
  color:#111;
}

.quote-btn{
  border:1px solid var(--gold);
  padding:12px 22px;
  text-decoration:none;
  color:#111;
  font-weight:500;
  transition:.3s;
}

.quote-btn:hover{
  background:var(--gold);
  color:#fff;
}

.hero-section{
  position:relative;
  background:url('../images/bgcc.png') center/cover no-repeat;
  margin-top: 45px;
}

.hero-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(
    90deg,
    rgba(255,255,255,.96) 0%,
    rgba(255,255,255,.90) 45%,
    rgba(255,255,255,.72) 70%,
    rgba(0,0,0,.55) 100%
  );
}

.services-list{
  border-right:1px solid rgba(0,0,0,.25);
  padding-right:24px;
  margin-top: -10rem;
}

.service-item{
  display:flex;
  gap:14px;
  align-items:flex-start;
  margin:38px 0;
  color:#444;
}

.service-item .number{
  font-family:'Playfair Display',serif;
  font-size:42px;
  line-height:1;
}

.service-item h6{
  margin:0;
  font-size:14px;
  font-weight:600;
  letter-spacing:.04em;
}

.service-item p{
  margin:2px 0 0;
  font-size:13px;
}

.service-item.active{
  color:var(--gold);
}

.hero-content h1{
  font-family:'Playfair Display',serif;
  font-size:50px;
  line-height:1.04;
  color:#111;
  margin-bottom:24px;
}

.hero-content h1 span{
  color:var(--gold);
}

.gold-line{
  width:64px;
  height:2px;
  background:var(--gold);
  margin:28px 0;
}

.hero-text{
  color:#444;
  font-size:18px;
  line-height:1.8;
  max-width:520px;
}

.restore-btn{
  display:inline-block;
  margin-top:24px;
  padding:16px 34px;
  border:1px solid var(--gold);
  text-decoration:none;
  color:#111;
  font-weight:600;
  letter-spacing:.02em;
  transition:.3s;
  background:rgba(255,255,255,.65);
  backdrop-filter:blur(2px);
}

.restore-btn:hover{
  background:var(--gold);
  color:#fff;
}

.hero-arrows button{
  width:48px;
  height:48px;
  border:none;
  background:transparent;
  color:var(--gold);
  font-size:26px;
}


.slider-container {
  margin: 0 auto;
  /* margin-top: 5rem; */
  position: relative;
  width: 100%;
  /* max-width: 800px; */
  height: 550px;
  border-radius: 0.7rem;
  overflow: hidden;
}

.before-image,
.after-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

/* Styling the Before/After text */
.before-text,
.after-text {
  position: absolute;
  font-family: system-ui;
  font-size: 14px;
  font-weight: 600;
  color: #3a3a3a;
  z-index: 4;
  padding: 10px 20px;
  background-color: #ffffff9e;
  border-radius: 0.3rem;
  letter-spacing: 2px;
  transition: opacity 0.3s ease-in-out;
}

/* Before text */
.before-text {
  left: 20px; /* Position text to the left */
  top: 20px;
  z-index: 5;
}

/* After text */
.after-text {
  right: 20px; /* Position text to the right */
  top: 20px;
  z-index: 3;
}

/* Hide the After text initially */
.after-image .after-text {
  visibility: visible;
  z-index: 3;
}

.after-image {
  clip-path: inset(0 50% 0 0);
}

.slider-handle {
  position: absolute;
  top: 0;
  left: 50%;
  width: 0px;
  height: 100%;
  background-color: #fff;
  cursor: pointer;
  z-index: 2;
}

.slider-line {
  position: absolute;
  top: 0;
  left: 50%;
  width: 0px;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: transparent;
  z-index: 1;
}
.pulse-container {
  position: relative;
  display: inline-block;
}

.pulse-container::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 70px; /* Larger than the SVG */
  height: 70px;
  border-radius: 50%;
  background-color: #ffffff; /* Color of the pulse */
  transform: translate(-50%, -50%) scale(1);
  opacity: 0;
  animation: pulse 1.5s infinite;
}

@keyframes pulse {
  0% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.6;
  }
  100% {
    transform: translate(-50%, -50%) scale(1.8);
    opacity: 0;
  }
}

.slider-line svg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
  cursor: pointer;
}
/* Prevent text/image selection while dragging */
.slider-container,
.before-image img,
.after-image img {
  user-select: none; /* Disable selection on most browsers */
  -webkit-user-select: none; /* Safari */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* IE10+ */
}

.slider-handle,
.slider-line {
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}



@media (max-width: 991px){
  .hero-content h1{
    font-size:52px;
  }

  .hero-text{
    max-width:100%;
  }

  .compare-box{
    max-width:420px;
  }
}

@media (max-width: 576px){
  .brand-text{
    display:none;
  }

  .hero-content h1{
    font-size:40px;
  }

  .hero-text{
    font-size:16px;
  }

  .restore-btn{
    width:100%;
    text-align:center;
  }

  .compare-box{
    max-width:100%;
  }
}



    .section-padding{
      padding:80px 0;
    }

    .gold{
      color:#b88a2f;
    }

    .line-title{
      font-size:14px;
      letter-spacing:1px;
      text-transform:uppercase;
      color:#b88a2f;
      display:flex;
      align-items:center;
      gap:12px;
      margin-bottom:25px;
    }

    .line-title::after{
      content:'';
      width:60px;
      height:1px;
      background:#d6c7a2;
    }

    .recognition-card{

      padding:50px;
      height:100%;
    }

    .recognition-logo{
      display:flex;
      align-items:center;
      gap:18px;
      margin-bottom:25px;
    }

    .recognition-logo .mark{
      width:58px;
      height:58px;
      border:2px solid #c62828;
      border-radius:16px;
      display:flex;
      align-items:center;
      justify-content:center;
      color:#c62828;
      font-weight:700;
    }

    .recognition-card h1{
      font-size:52px;
      font-weight:300;
      margin:0;
      line-height:1;
    }

    .recognition-card h2{
      font-size:28px;
      font-weight:600;
      text-transform:uppercase;
      letter-spacing:1px;
      color:#a06f12;
      margin:35px 0 20px;
      text-align:center;
    }

    .recognition-card p{
      color:#4b4b4b;
      line-height:1.8;
      text-align:center;
      max-width:560px;
      margin:0 auto 24px;
    }

    .recognition-card .divider{
      height:1px;
      background:#dfd3ba;
      margin:26px 0;
    }

    .recognition-image{
      border-radius:4px;
      overflow:hidden;
      height:600px;
      min-height:420px;
      box-shadow:0 10px 30px rgba(0,0,0,.12);
    }

    .recognition-image img{
      width:100%;
      height:100%;
      object-fit:cover;
      display:block;
    }

    .services-section{
      background:linear-gradient(90deg,#f7f6f3 0%,#f4f4f4 45%,#ececec 100%);
    }

    .services-hero{
      position:relative;
      /* min-height:360px; */
      height: 600px;
      border-radius:6px;
      overflow:hidden;
      /* box-shadow:0 10px 30px rgba(0,0,0,.08); */
    }

    .services-hero img{
      position:absolute;
      inset:0;
      /* width:100%;
      height:100%; */
      /* object-fit:cover; */
    }

    .jkgdf5222
    {
      margin-top: -15rem;
    }

    .services-section
    {
       background: url(../images/jksd582.png);
       background-size: cover;
    }

    .services-hero::after{
      content:'';
      position:absolute;
      inset:0;
      /* background:linear-gradient(90deg,rgba(247,246,243,.96) 0%,rgba(247,246,243,.85) 34%,rgba(247,246,243,.08) 68%,rgba(247,246,243,0) 100%); */
    }

    .services-hero-content{
      position:relative;
      z-index:1;
      padding:56px;
      max-width:460px;
    }

    .services-hero h3{
      font-size:54px;
      font-weight:300;
      margin-bottom:24px;
    }

    .services-hero p{
      line-height:1.8;
      color:#4f4f4f;
      margin:0;
    }

    .service-card{
      background:#f7f3ea;
      border:1px solid #d8bf83;
      padding:18px;
      height:100%;
      transition:all .3s ease;
    }

    .service-card:hover{
      transform:translateY(-6px);
      box-shadow:0 12px 28px rgba(0,0,0,.08);
    }

    .service-top{
      display:flex;
      justify-content:space-between;
      align-items:center;
      margin-bottom:16px;
      color:#c39a3c;
      font-weight:600;
    }

    .service-img{
      width:100%;
      height:150px;
      object-fit:cover;
      margin-bottom:18px;
      filter:grayscale(100%);
    }

    .service-card h5{
      font-size:20px;
      font-weight:700;
      text-transform:uppercase;
      margin-bottom:14px;
    }

    .service-card p{
      font-size:14px;
      color:#555;
      line-height:1.7;
      min-height:96px;
    }

    .learn-more{
      color:#b88a2f;
      text-decoration:none;
      font-weight:600;
      font-size:14px;
    }

    .cm-badge{
      width:52px;
      height:52px;
      border:1px solid #cdb074;
      display:flex;
      align-items:center;
      justify-content:center;
      margin:28px auto 0;
      color:#7a5b1f;
      font-weight:600;
      background:#fff;
      position:relative;
      margin-bottom: 30px;
    }

    .cm-badge::before,
    .cm-badge::after{
      content:'';
      position:absolute;
      top:50%;
      width:72px;
      height:1px;
      background:#d9c79d;
    }

    .cm-badge::before{ right:100%; margin-right:18px; }
    .cm-badge::after{ left:100%; margin-left:18px; }

    .trust-section{
      background:#f7f7f7;
    }

    .trust-heading{
      text-align:center;
      margin-bottom:55px;
    }

    .trust-heading h3{
      font-size:54px;
      font-weight:300;
      margin-top:18px;
    }

    .trust-item{
      text-align:center;
      padding:20px 18px;
    }

    .trust-icon{
      width:72px;
      height:72px;
      border-radius:50%;
      background:#fff;
      border:1px solid #e3d3a9;
      display:flex;
      align-items:center;
      justify-content:center;
      margin:0 auto 22px;
      color:#c39a3c;
      font-size:30px;
      box-shadow:0 4px 12px rgba(0,0,0,.04);
    }

    .trust-item h6{
      color:#a47716;
      font-weight:700;
      margin-bottom:12px;
    }

    .trust-item p{
      color:#555;
      line-height:1.7;
      margin:0;
    }

    @media (max-width: 991.98px){
      .recognition-card{
        padding:36px 24px;
      }

      .recognition-card h1{
        font-size:42px;
      }

      .recognition-card h2{
        font-size:22px;
      }

      .services-hero{
        min-height:320px;
      }

      .services-hero-content{
        padding:36px 28px;
        max-width:100%;
      }

      .services-hero h3,
      .trust-heading h3{
        font-size:40px;
      }
    }

    @media (max-width: 575.98px){
      .section-padding{
        padding:56px 0;
      }

      .recognition-card h1{
        font-size:34px;
      }

      .services-hero h3,
      .trust-heading h3{
        font-size:32px;
      }

      .cm-badge::before,
      .cm-badge::after{
        width:36px;
      }
    }











    .section-padding{
      padding:80px 0;
    }

    .section-subtitle{
      font-size:13px;
      letter-spacing:1px;
      text-transform:uppercase;
      color:#b4862b;
      text-align:center;
      margin-bottom:12px;
      position:relative;
    }

    .section-subtitle:before,
    .section-subtitle:after{
      content:'';
      width:80px;
      height:1px;
      background:#d4bf8a;
      display:inline-block;
      vertical-align:middle;
      margin:0 12px;
    }

    .section-title{
      text-align:center;
      font-size:54px;
      font-weight:300;
      margin-bottom:50px;
      line-height:1.15;
    }

    /* ---------- Workflow Cards ---------- */
    .workflow-card{
      background:#fff;
      border:1px solid #cfae63;
      padding:20px;
      height:100%;
      text-align:center;
      transition:all .3s ease;
    }

    .workflow-card:hover{
      transform:translateY(-6px);
      box-shadow:0 12px 24px rgba(0,0,0,.08);
    }

    .workflow-step{
      color:#b4862b;
      font-size:14px;
      font-weight:600;
      text-transform:uppercase;
      margin-bottom:16px;
      min-height:36px;
    }

    .workflow-card img{
      width:100%;
      height:160px;
      object-fit:cover;
      margin-bottom:18px;
      filter:grayscale(20%);
    }

    .workflow-card h5{
      font-size:20px;
      font-weight:700;
      text-transform:uppercase;
      margin-bottom:12px;
    }

    .workflow-card p{
      color:#666;
      line-height:1.7;
      font-size:14px;
      min-height:88px;
    }

    .btn-outline-gold{
      border:1px solid #cfae63;
      color:#8c6a1d;
      background:#fff;
      padding:8px 18px;
      font-size:14px;
    }

    .btn-outline-gold:hover{
      background:#cfae63;
      color:#fff;
    }

    .btn-gold{
      background:#fff;
      border:1px solid #cfae63;
      color:#222;
      padding:14px 28px;
      font-weight:500;
      letter-spacing:.3px;
    }

    .btn-gold:hover{
      background:#cfae63;
      color:#fff;
    }

    /* ---------- Proof Slider ---------- */
    .proof-section{
      background:#fafafa;
    }

    .proof-carousel{
      position:relative;
      overflow:hidden;
      padding:20px 0 10px;
    }

    .proof-track{
      display:flex;
      align-items:center;
      transition:transform .6s ease;
    }

    .proof-slide{
      flex:0 0 25%;
      padding:0 18px;
      opacity:.35;
      transform:scale(.88);
      transition:all .5s ease;
    }

    .proof-slide.active{
      opacity:1;
      transform:scale(1);
    }

    .proof-card{
      background:#fff;
      border:1px solid #d8c08a;
      padding:24px;
      text-align:center;
      min-height:420px;
      display:flex;
      align-items:center;
      justify-content:center;
    }

    .before-after{
      display:flex;
      align-items:center;
      justify-content:center;
      /* gap:22px; */
      width:100%;
    }

    .before-after .img-wrap{
      flex:1;
      text-align:center;
    }

    .before-after img{
      width:100%;
      max-width:220px;
      height:280px;
      object-fit:cover;
      border:1px solid #d7c18f;
    }

    .divider-circle{
      width:40px;
      height:40px;
      border-radius:50%;
      background:#b4862b;
      color:#fff;
      display:flex;
      align-items:center;
      justify-content:center;
      font-weight:700;
      flex-shrink:0;
    }

    .proof-label{
      margin-top:12px;
      font-size:14px;
      color:#666;
      text-transform:uppercase;
      letter-spacing:.6px;
    }

    .proof-nav{
      position:absolute;
      top:50%;
      transform:translateY(-50%);
      width:100%;
      display:flex;
      justify-content:space-between;
      pointer-events:none;
    }

    .proof-nav button{
      pointer-events:auto;
      width:44px;
      height:44px;
      border-radius:50%;
      border:1px solid #d4bf8a;
      background:#fff;
      color:#8c6a1d;
      font-size:20px;
      box-shadow:0 4px 10px rgba(0,0,0,.06);
    }

    .proof-nav button:hover{
      background:#b4862b;
      color:#fff;
    }

    /* ---------- Video Section ---------- */
    .video-wrap{
      max-width:900px;
      margin:0 auto;
      border:1px solid #cfae63;
      padding:10px;
      background:#fff;
      box-shadow:0 10px 25px rgba(0,0,0,.08);
    }

    .video-wrap video{
      width:100%;
      display:block;
      background:#000;
    }

    .video-caption{
      text-align:center;
      color:#666;
      margin-top:24px;
      line-height:1.8;
      font-size:15px;
    }

    @media (max-width: 991px){
      .section-title{
        font-size:40px;
      }

      .proof-slide{
        flex:0 0 100%;
        opacity:1;
        transform:none;
      }

      .proof-slide:not(.active){
        display:none;
      }

      .proof-card{
        min-height:auto;
      }
    }

    @media (max-width: 576px){
      .section-title{
        font-size:32px;
      }

      .before-after{
        flex-direction:column;
      }

      .divider-circle{
        transform:rotate(90deg);
      }
    }










        .section-padding{padding:80px 0;}

    .section-subtitle{
      text-align:center;
      font-size:13px;
      text-transform:uppercase;
      letter-spacing:1px;
      color:#b4862b;
      margin-bottom:12px;
      position:relative;
    }

    .section-subtitle:before,
    .section-subtitle:after{
      content:'';
      width:70px;
      height:1px;
      background:#d8c08a;
      display:inline-block;
      vertical-align:middle;
      margin:0 12px;
    }

    .section-title{
      text-align:center;
      font-size:54px;
      font-weight:300;
      margin-bottom:50px;
    }

    /* Gallery */
    .gallery-grid{
      display:grid;
      grid-template-columns:2fr 1fr 1fr;
      grid-auto-rows:160px;
      gap:16px;
    }

    .gallery-item{overflow:hidden;background:#eee;}
    .gallery-item img{
      width:100%;height:100%;object-fit:cover;
      transition:transform .5s ease;
    }
    .gallery-item:hover img{transform:scale(1.06);}
    .gallery-item.wide{grid-column:span 2;}
    .gallery-item.tall{grid-row:span 2;}

    /* Testimonial */
    .testimonial-section{background:#f3efe7;}

    .testimonial-left h3{
      font-size:44px;
      font-weight:600;
      line-height:1.3;
      margin-bottom:20px;
    }

    .testimonial-left p{
      color:#555;
      line-height:1.8;
      max-width:320px;
    }

    .nav-btn{
      width:52px;height:52px;border-radius:14px;
      border:1px solid #d7c18f;background:#fff;
      color:#8c6a1d;font-size:22px;
    }

    .nav-btn:hover{
      background:#caa24a;color:#fff;border-color:#caa24a;
    }

    .testimonial-card{
      background:#fff;
      border:1px solid #ead7aa;
      border-radius:28px;
      padding:30px;
      height:100%;
    }

    .stars{color:#caa24a;font-size:18px;letter-spacing:2px;margin-bottom:18px;}

    .testimonial-card p{
      line-height:1.9;
      min-height:150px;
      margin-bottom:24px;
    }

    .author{
      display:flex;align-items:center;gap:14px;
      padding-top:18px;border-top:1px solid #eee;
    }

    .author img{
      width:52px;height:52px;border-radius:50%;object-fit:cover;
    }

    /* CTA */
    .cta-section{background:#fafafa;text-align:center;}
    .cta-section p{
      color:#666;
      max-width:520px;
      margin:0 auto 28px;
      line-height:1.8;
    }

    .btn-gold{
      border:1px solid #caa24a;
      background:#fff;
      color:#8c6a1d;
      padding:12px 26px;
      font-weight:500;
    }

    .btn-gold:hover{
      background:#caa24a;color:#fff;
    }

    /* Footer */
    footer{
      background:#f7f5f1;
      border-top:1px solid #e8dfcf;
    }

    .footer-main{padding:55px 0 35px;}

    .footer-brand{
      display:flex;align-items:center;gap:12px;margin-bottom:18px;
    }

    .footer-logo{
      width:54px;height:54px;background:#1f2430;color:#fff;
      display:flex;align-items:center;justify-content:center;
      font-weight:700;font-size:22px;border-radius:4px;
    }

    .footer-brand-text{
      background:#111;color:#fff;padding:10px 14px;border-radius:4px;
    }

    .footer-title{
      color:#b4862b;
      font-size:14px;
      font-weight:700;
      text-transform:uppercase;
      margin-bottom:18px;
    }

    .footer-links a{
      display:block;
      color:#444;
      text-decoration:none;
      margin-bottom:12px;
    }

    .footer-links a:hover{color:#b4862b;}

    .contact-item{
      display:flex;
      align-items:flex-start;
      gap:10px;
      margin-bottom:14px;
      color:#444;
    }

    .footer-bottom{
      border-top:1px solid #e8dfcf;
      padding:18px 0;
      font-size:14px;
      color:#666;
    }

    @media(max-width:991px){
      .gallery-grid{grid-template-columns:1fr 1fr;}
      .gallery-item.wide{grid-column:span 2;}
      .section-title{font-size:40px;}
    }

    @media(max-width:576px){
      .gallery-grid{grid-template-columns:1fr;}
      .gallery-item.wide,.gallery-item.tall{
        grid-column:span 1;grid-row:span 1;
      }
      .section-title{font-size:32px;}
      .testimonial-left h3{font-size:32px;}
    }