:root {
      --westonik-blue: #007bff;
      --westonik-dark: #08101f;
      --westonik-text: #192234;
      --westonik-muted: #667085;
      --westonik-border: #e6ebf2;
    }

    body {
      font-family: "Poppins", sans-serif;
    }

    /* Keep existing header structure; only small responsive fixes */
    @media (max-width: 575px) {
      .dskt-logo .nav-brand img {
        max-height: fit-content;
        max-width: 190px !important;
      }
    }

    .hc-offcanvas-nav .nav-content > h2,
    .hc-offcanvas-nav .nav-content > h3,
    .hc-offcanvas-nav .nav-content > h4,
    .hc-offcanvas-nav .nav-content > h5,
    .hc-offcanvas-nav .nav-content > h6 {
      font-size: 19px !important;
      font-weight: 400;
      padding: 10px !important;
      color: #fff;
    }

    .ree-btn2 {
      font-size: 18px;
      color: #fff;
      border-radius: 14px;
      display: inline-block;
      line-height: 45px !important;
      width: 45px !important;
      height: 45px !important;
      text-align: center;
    }

    .hc-offcanvas-nav li.nav-parent .nav-item-link:last-child {
      padding-right: 4px;
    }

    /* Hero */
    .wd-hero {
      position: relative;
      overflow: hidden;
      padding: 120px 0 0;
      background:
        radial-gradient(circle at 10% 10%, rgba(0,123,255,.10), transparent 28%),
        radial-gradient(circle at 92% 22%, rgba(55,103,255,.09), transparent 30%),
        linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    }

    .wd-hero::before {
      content: "";
      position: absolute;
      width: 420px;
      height: 420px;
      border: 1px solid rgba(0,123,255,.10);
      border-radius: 50%;
      right: -180px;
      top: 45px;
      pointer-events: none;
    }

    .wd-hero-content {
      position: relative;
      z-index: 2;
      padding: 35px 0 60px;
    }

    .wd-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      padding: 8px 13px;
      margin-bottom: 22px;
      border: 1px solid rgba(0,123,255,.18);
      border-radius: 50px;
      background: rgba(255,255,255,.85);
      color: var(--westonik-blue);
      font-size: 13px;
      font-weight: 600;
      letter-spacing: .2px;
      box-shadow: 0 8px 30px rgba(24,39,75,.05);
    }

.wd-benefits {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 28px;              
  padding: 0;
  margin: 0 0 28px;
  list-style: none;      
}

.wd-benefits li {
  color: #0b5ed7;         
  font-size: 14.5px;
  font-weight: 500;
  white-space: nowrap;    
}
.wd-benefits i {
  color: #007bff;
  font-size: 14px;
}

/* मोबाइल और टैबलेट के लिए ऑटो बैलेंस */
@media (max-width: 991px) {
  .wd-benefits {
    justify-content: center;
    gap: 10px 18px;
  }
}

@media (max-width: 575px) {
  .wd-benefits {
    display: grid;
    grid-template-columns: 1fr 1fr; /* मोबाइल पर 2x2 ग्रिड में बराबर दिखेगा */
    gap: 10px 14px;
    width: 100%;
  }
  .wd-benefits li {
    font-size: 12px;
    white-space: normal;
  }
}

    .wd-eyebrow-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--westonik-blue);
      box-shadow: 0 0 0 5px rgba(0,123,255,.10);
    }

    .wd-hero h1 {
      max-width: 720px;
      margin: 0 0 20px;
      color: var(--westonik-dark);
      font-size: 54px;
      line-height: 1.08;
      font-weight: 800;
      letter-spacing: -1.8px;
    }

    .wd-hero h1 .accent {
      color: var(--westonik-blue);
    }

    .wd-hero-copy {
      max-width: 660px;
      margin-bottom: 24px;
      color: var(--westonik-muted);
      font-size: 17px;
      line-height: 1.75;
    }

    .wd-benefits {
      display: flex;
      flex-wrap: wrap;
      gap: 10px 20px;
      padding: 0;
      margin: 0 0 28px;
      list-style: none;
    }

    .wd-benefits li {
      display: flex;
      align-items: center;
      gap: 8px;
      color: #344054;
      font-size: 14px;
      font-weight: 500;
    }

    .wd-benefits i {
      color: var(--westonik-blue);
      font-size: 14px;
    }

    .wd-cta-group {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 12px;
    }

    .wd-primary-btn,
    .wd-secondary-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      min-height: 52px;
      padding: 13px 22px;
      border-radius: 8px;
      font-size: 15px;
      font-weight: 600;
      transition: .25s ease;
      text-decoration: none !important;
    }

    .wd-primary-btn {
      background: var(--westonik-blue);
      color: #fff !important;
      border: 1px solid var(--westonik-blue);
      box-shadow: 0 10px 25px rgba(0,123,255,.22);
    }

    .wd-primary-btn:hover {
      transform: translateY(-2px);
      background: #0069d9;
      border-color: #0069d9;
      box-shadow: 0 14px 30px rgba(0,123,255,.28);
    }

    .wd-secondary-btn {
      background: #fff;
      color: var(--westonik-dark) !important;
      border: 1px solid var(--westonik-border);
    }

    .wd-secondary-btn:hover {
      transform: translateY(-2px);
      border-color: rgba(0,123,255,.35);
      color: var(--westonik-blue) !important;
    }

    .wd-microcopy {
      margin-top: 13px;
      color: #7b8494;
      font-size: 12px;
    }

    .wd-microcopy i {
      margin-right: 5px;
      color: #22a06b;
    }

    .wd-visual-wrap {
      position: relative;
      min-height: 510px;
      display: flex;
      align-items: flex-end;
      justify-content: center;
      z-index: 1;
    }

    .wd-visual-card {
      position: relative;
      width: 100%;

    }

    .wd-visual-card img {
      position: relative;
      z-index: 2;
      width: 100%;
      display: block;
    }

    .wd-float-card {
      position: absolute;
      z-index: 4;
      min-width: 170px;
      padding: 13px 15px;
      border: 1px solid rgba(0,0,0,.06);
      border-radius: 12px;
      background: rgba(255,255,255,.96);
      box-shadow: 0 15px 40px rgba(31,45,75,.12);
    }

    .wd-float-card strong {
      display: block;
      color: var(--westonik-dark);
      font-size: 13px;
      font-weight: 700;
    }

    .wd-float-card span {
      display: block;
      margin-top: 3px;
      color: var(--westonik-muted);
      font-size: 11px;
    }

    .wd-float-card i {
      color: var(--westonik-blue);
      margin-right: 7px;
    }

    .wd-float-one {
      left: -10px;
      top: 105px;
    }

    .wd-float-two {
      right: -8px;
      bottom: 95px;
    }

    /* Trust strip */
    .wd-trust {
      position: relative;
      z-index: 5;
      margin-top: 0;
      border-top: 1px solid var(--westonik-border);
      background: #fff;
    }

    .wd-trust-inner {
      padding: 22px 0;
    }

    .wd-trust-label {
      margin: 0;
      color: #667085;
      font-size: 12px;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: .8px;
      white-space: nowrap;
    }

    .wd-logo-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 28px;
    }

    .wd-logo-row img {
      max-height: 34px;
      max-width: 125px;
      width: auto;
      opacity: .56;
      filter: grayscale(100%);
      transition: .2s ease;
    }

    .wd-logo-row img:hover {
      opacity: .9;
      filter: grayscale(0);
    }

    @media (max-width: 991px) {
      .wd-hero {
        padding-top: 125px;
      }

      .wd-hero-content {
        padding: 25px 0 25px;
        text-align: center;
      }

      .wd-hero h1,
      .wd-hero-copy {
        margin-left: auto;
        margin-right: auto;
      }

      .wd-hero h1 {
        font-size: 44px;
      }

      .wd-benefits,
      .wd-cta-group {
        justify-content: center;
      }

      .wd-visual-wrap {
        min-height: auto;
        margin-top: 15px;
      }

      .wd-visual-card {
        max-width: 500px;
      }

      .wd-float-one {
        left: 5%;
      }

      .wd-float-two {
        right: 5%;
      }

      .wd-trust-label {
        margin-bottom: 18px;
        text-align: center;
      }

      .wd-logo-row {
        justify-content: center;
        flex-wrap: wrap;
      }
    }

    @media (max-width: 575px) {
      .wd-hero {
        padding-top: 100px;
      }

      .wd-hero-content {
        padding-top: 22px;
      }

      .wd-eyebrow {
        margin-bottom: 17px;
        font-size: 11px;
      }

      .wd-hero h1 {
        font-size: 35px;
        line-height: 1.14;
        letter-spacing: -1px;
      }

      .wd-hero-copy {
        font-size: 15px;
        line-height: 1.65;
      }

      .wd-benefits {
        display: grid;
        grid-template-columns: 1fr;
        justify-items: start;
        width: max-content;
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
        text-align: left;
      }

      .wd-cta-group {
        flex-direction: column;
      }

      .wd-primary-btn,
      .wd-secondary-btn {
        width: 100%;
      }

      .wd-visual-card {
        
      }

      .wd-float-card {
        min-width: 145px;
        padding: 10px 11px;
      }

      .wd-float-one {
        left: 0;
        top: 65px;
      }

      .wd-float-two {
        right: 0;
        bottom: 55px;
      }

      .wd-logo-row {
        gap: 20px 28px;
      }

      .wd-logo-row img {
        max-height: 27px;
        max-width: 95px;
      }
    }
.westonik-portfolio-dark {
    overflow: hidden;
    position: relative;

    background:
        radial-gradient(
            circle at 10% 20%,
            rgba(0,123,255,.13),
            transparent 28%
        ),
        radial-gradient(
            circle at 90% 75%,
            rgba(0,123,255,.07),
            transparent 30%
        ),
        #05070b;
}


/* heading */

.portfolio-kicker {
    color: #007bff;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.7px;
}

.portfolio-heading {
    margin: 10px 0 12px;

    color: #fff;

    font-size: 42px;
    line-height: 1.2;
    font-weight: 700;
}

.portfolio-subtext {
    max-width: 650px;

    margin: auto;

    color: rgba(255,255,255,.55);

    font-size: 15px;
    line-height: 1.7;
}


/* marquee */

.w-showcase-mask {
    width: 100%;
    overflow: hidden;
    position: relative;
}


/* fade edges */

.w-showcase-mask::before,
.w-showcase-mask::after {
    content: "";

    position: absolute;

    top: 0;
    bottom: 0;

    width: 100px;

    z-index: 10;

    pointer-events: none;
}

.w-showcase-mask::before {
    left: 0;

    background: linear-gradient(
        90deg,
        #05070b 0%,
        rgba(5,7,11,.85) 35%,
        transparent 100%
    );
}

.w-showcase-mask::after {
    right: 0;

    background: linear-gradient(
        270deg,
        #05070b 0%,
        rgba(5,7,11,.85) 35%,
        transparent 100%
    );
}


.w-showcase-track {
    display: flex;

    align-items: stretch;

    gap: 24px;

    width: max-content;

    padding: 10px 0 30px;

    animation: westonikPortfolioMarquee 55s linear infinite;

    will-change: transform;
}


@keyframes westonikPortfolioMarquee {

    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }

}


/* pause on hover */

.w-showcase-mask:hover .w-showcase-track {
    animation-play-state: paused;
}


/* browser card */

.portfolio-browser-card {
    flex: 0 0 430px;

    display: block;

    overflow: hidden;

    border:
        1px solid
        rgba(255,255,255,.09);

    border-radius: 14px;

    background: #0c1016;

    box-shadow:
        0 18px 55px rgba(0,0,0,.4);

    text-decoration: none !important;

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease;
}


.portfolio-browser-card:hover {
    transform: translateY(-7px);

    border-color:
        rgba(0,123,255,.48);

    box-shadow:
        0 28px 70px rgba(0,0,0,.6);
}


/* browser chrome */

.browser-topbar {
    height: 42px;

    display: flex;
    align-items: center;

    padding: 0 14px;

    background: #151922;

    border-bottom:
        1px solid
        rgba(255,255,255,.06);
}


.browser-dots {
    width: 65px;

    display: flex;

    gap: 6px;
}


.browser-dots .dot {
    width: 8px;
    height: 8px;

    display: block;

    border-radius: 50%;
}


.browser-dots .red {
    background: #ff5f57;
}

.browser-dots .yellow {
    background: #febc2e;
}

.browser-dots .green {
    background: #28c840;
}


.browser-address {
    flex: 1;

    max-width: 260px;

    height: 25px;

    display: flex;

    align-items: center;
    justify-content: center;

    gap: 6px;

    margin: auto;

    padding: 0 12px;

    border:
        1px solid
        rgba(255,255,255,.06);

    border-radius: 6px;

    background: #0d1016;

    color:
        rgba(255,255,255,.4);

    font-size: 10px;
}


.browser-address i {
    color: #2ed56f;
    font-size: 8px;
}


.browser-menu {
    width: 65px;

    color:
        rgba(255,255,255,.25);

    text-align: right;

    font-size: 11px;
}


/* screenshot */

.browser-screen {
    height: 255px;

    overflow: hidden;

    background: #090b10;
}


.browser-screen img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;
    object-position: top;

    transition:
        transform .8s
        cubic-bezier(.2,.65,.3,1);
}


.portfolio-browser-card:hover
.browser-screen img {

    transform: scale(1.03);

}


/* project bottom */

.project-info {
    display: flex;

    align-items: center;
    justify-content: space-between;

    padding: 17px 20px 19px;
}


.project-type {
    display: block;

    margin-bottom: 5px;

    color: #007bff;

    font-size: 10px;

    font-weight: 600;

    text-transform: uppercase;

    letter-spacing: .8px;
}


.project-info h4 {
    margin: 0 0 3px;

    color: #fff;

    font-size: 17px;

    font-weight: 600;
}


.project-info p {
    margin: 0;

    color:
        rgba(255,255,255,.42);

    font-size: 11px;
}


.project-arrow {
    width: 38px;
    height: 38px;

    display: flex;

    align-items: center;
    justify-content: center;

    border:
        1px solid
        rgba(255,255,255,.08);

    border-radius: 50%;

    background:
        rgba(255,255,255,.04);

    color: #fff;

    transition: .25s ease;
}


.portfolio-browser-card:hover
.project-arrow {

    background: #007bff;

    border-color: #007bff;

}


/* tablet */

@media (max-width: 991px) {

    .portfolio-heading {
        font-size: 34px;
    }

    .portfolio-browser-card {
        flex-basis: 370px;
    }

    .browser-screen {
        height: 220px;
    }

}


/* mobile */

@media (max-width: 575px) {

    .portfolio-heading {
        font-size: 28px;
    }

    .portfolio-subtext {
        font-size: 13px;
    }

    .portfolio-browser-card {
        flex-basis: 300px;
    }

    .browser-screen {
        height: 178px;
    }

    .browser-topbar {
        height: 36px;
        padding: 0 10px;
    }

    .browser-dots,
    .browser-menu {
        width: 44px;
    }

    .browser-address {
        height: 21px;
        font-size: 8px;
    }

    .project-info {
        padding: 14px 15px 16px;
    }

    .project-info h4 {
        font-size: 15px;
    }

    .project-info p {
        font-size: 10px;
    }

    .w-showcase-mask::before,
    .w-showcase-mask::after {
        width: 28px;
    }

}
      
      
      
      
      
      
      
      
      
/* ==========================================
           WEB DEVELOPMENT SERVICES
        ========================================== */

        .web-services-section {
            position: relative;
            overflow: hidden;

            padding: 80px 0;

            background:
                radial-gradient(
                    circle at 0% 10%,
                    rgba(0, 123, 255, .07),
                    transparent 28%
                ),
                radial-gradient(
                    circle at 100% 90%,
                    rgba(0, 123, 255, .045),
                    transparent 28%
                ),
                linear-gradient(
                    180deg,
                    #ffffff 0%,
                    #f9fbfe 100%
                );
        }


        /* ==========================================
           SECTION HEADER
        ========================================== */

        .section-kicker {
            display: inline-block;

            margin-bottom: 8px;

            color: #007bff;

            font-size: 11px;
            font-weight: 700;

            letter-spacing: 1.7px;

            text-transform: uppercase;
        }


        .section-title {
            margin: 0 0 12px;

            color: #0c1424;

            font-size: 40px;
            line-height: 1.2;

            font-weight: 700;

            letter-spacing: -.8px;
        }


        .section-subtitle {
            max-width: 690px;

            margin: auto;

            color: #667085;

            font-size: 14px;
            line-height: 1.75;
        }


        /* ==========================================
           SERVICE CARD
        ========================================== */

        .service-card {
            position: relative;

            display: flex;
            flex-direction: column;

            height: 100%;

            overflow: hidden;

            padding: 27px 24px 24px;

            border: 1px solid #e7ecf3;

            border-radius: 14px;

            background: #ffffff;

            box-shadow:
                0 10px 35px
                rgba(20, 35, 70, .045);

            transition:
                transform .3s ease,
                box-shadow .3s ease,
                border-color .3s ease;
        }


        .service-card::before {
            content: "";

            position: absolute;

            width: 110px;
            height: 110px;

            top: -65px;
            right: -65px;

            border-radius: 50%;

            background:
                rgba(0, 123, 255, .055);

            transition: .35s ease;
        }


        .service-card:hover {
            transform: translateY(-5px);

            border-color:
                rgba(0, 123, 255, .25);

            box-shadow:
                0 20px 50px
                rgba(20, 35, 70, .09);
        }


        .service-card:hover::before {
            transform: scale(1.5);
        }


        /* ==========================================
           CARD NUMBER
        ========================================== */

        .service-number {
            position: absolute;

            top: 25px;
            right: 24px;

            color: #d8dee8;

            font-size: 10px;
            font-weight: 700;

            letter-spacing: 1px;
        }


        /* ==========================================
           ICON
        ========================================== */

        .service-icon {
            position: relative;
            z-index: 2;

            width: 46px;
            height: 46px;

            display: flex;
            align-items: center;
            justify-content: center;

            margin-bottom: 18px;

            border:
                1px solid
                rgba(0, 123, 255, .09);

            border-radius: 10px;

            background:
                rgba(0, 123, 255, .07);

            color: #007bff;

            font-size: 18px;
        }


        /* ==========================================
           TITLE
        ========================================== */

        .service-card h4 {
            position: relative;
            z-index: 2;

            margin-bottom: 9px;

            color: #101828;

            font-size: 17px;
            line-height: 1.4;

            font-weight: 650;
        }


        /* ==========================================
           DESCRIPTION
        ========================================== */

        .service-card p {
            position: relative;
            z-index: 2;

            margin-bottom: 18px;

            color: #667085;

            font-size: 12.5px;
            line-height: 1.7;
        }


        /* ==========================================
           BEST FOR
        ========================================== */

        .service-best {
            position: relative;
            z-index: 2;

            display: flex;
            align-items: center;

            gap: 6px;

            margin-top: auto;

            padding-top: 14px;

            border-top:
                1px solid
                #edf0f4;

            color: #667085;

            font-size: 10px;
        }


        .service-best i {
            color: #16a34a;

            font-size: 10px;
        }


        /* ==========================================
           BOTTOM CTA
        ========================================== */

        .service-bottom-cta {
            margin-top: 8px;

            padding-top: 12px;
        }


        .service-bottom-cta p {
            margin-bottom: 12px;

            color: #667085;

            font-size: 12px;
        }


        .service-cta-btn {
            display: inline-flex;

            align-items: center;
            justify-content: center;

            gap: 8px;

            padding: 12px 20px;

            border-radius: 7px;

            background: #007bff;

            color: #ffffff !important;

            font-size: 12px;
            font-weight: 600;

            text-decoration: none !important;

            box-shadow:
                0 10px 25px
                rgba(0, 123, 255, .18);

            transition: .25s ease;
        }


        .service-cta-btn:hover {
            transform: translateY(-2px);

            background: #0069d9;

            box-shadow:
                0 14px 30px
                rgba(0, 123, 255, .25);
        }


        .service-cta-btn i {
            transition:
                transform .2s ease;
        }


        .service-cta-btn:hover i {
            transform:
                translateX(3px);
        }


        /* ==========================================
           TABLET
        ========================================== */

        @media (max-width: 991px) {

            .web-services-section {
                padding: 65px 0;
            }


            .section-title {
                font-size: 34px;
            }

        }


        /* ==========================================
           MOBILE
        ========================================== */

        @media (max-width: 575px) {

            .web-services-section {
                padding: 50px 0;
            }


            .section-title {
                font-size: 28px;
                line-height: 1.25;

                letter-spacing: -.3px;
            }


            .section-subtitle {
                font-size: 12.5px;
            }


            .service-card {
                padding: 23px 20px 21px;
            }


            .service-number {
                top: 22px;
                right: 20px;
            }


            .service-icon {
                width: 43px;
                height: 43px;

                margin-bottom: 15px;

                font-size: 16px;
            }


            .service-card h4 {
                font-size: 16px;
            }


            .service-card p {
                font-size: 12px;
            }


            .service-best {
                font-size: 9.5px;
            }


            .service-cta-btn {
                width: 100%;

                padding: 13px 15px;
            }

        }

      
      
      
      
       /* =========================================
   COMPACT WEBSITE AUDIT CTA
========================================= */

.website-audit-cta {
    padding: 25px 0 70px;
    background: #f9fbfe;
}


.audit-cta-box {
    position: relative;

    overflow: hidden;

    padding: 45px;

    border-radius: 20px;

    border:
        1px solid
        rgba(255,255,255,.07);

    background:
        radial-gradient(
            circle at 5% 10%,
            rgba(0,123,255,.15),
            transparent 30%
        ),
        radial-gradient(
            circle at 95% 90%,
            rgba(0,123,255,.08),
            transparent 30%
        ),
        #070a10;

    box-shadow:
        0 25px 60px
        rgba(12,20,36,.14);
}


/* LEFT */

.audit-label {
    display: inline-block;

    margin-bottom: 10px;

    color: #4ea1ff;

    font-size: 10px;
    font-weight: 700;

    letter-spacing: 1.5px;
}


.audit-cta-box h2 {
    max-width: 650px;

    margin: 0 0 14px;

    color: #fff;

    font-size: 35px;
    line-height: 1.22;

    font-weight: 700;

    letter-spacing: -.7px;
}


.audit-cta-box h2 span {
    color: #007bff;
}


.audit-desc {
    max-width: 610px;

    margin: 0 0 22px;

    color:
        rgba(255,255,255,.55);

    font-size: 13px;
    line-height: 1.7;
}


/* PROBLEM CHIPS */

.audit-problems {
    display: flex;

    flex-wrap: wrap;

    gap: 9px;
}


.audit-problems span {
    display: inline-flex;

    align-items: center;

    gap: 6px;

    padding: 7px 10px;

    border:
        1px solid
        rgba(255,255,255,.07);

    border-radius: 6px;

    background:
        rgba(255,255,255,.035);

    color:
        rgba(255,255,255,.70);

    font-size: 10px;
}


.audit-problems i {
    color: #ff6b6b;

    font-size: 9px;
}


/* RIGHT CARD */

.audit-action-card {
    padding: 25px;

    border:
        1px solid
        rgba(255,255,255,.08);

    border-radius: 14px;

    background:
        rgba(255,255,255,.045);

    backdrop-filter:
        blur(10px);
}


.audit-small-title {
    display: block;

    margin-bottom: 7px;

    color: #4ea1ff;

    font-size: 8px;
    font-weight: 700;

    letter-spacing: 1.2px;
}


.audit-action-card h3 {
    margin-bottom: 17px;

    color: #fff;

    font-size: 20px;
    line-height: 1.35;

    font-weight: 600;
}


/* LIST */

.audit-action-card ul {
    padding: 0;

    margin: 0 0 20px;

    list-style: none;
}


.audit-action-card li {
    display: flex;

    align-items: center;

    gap: 8px;

    padding: 5px 0;

    color:
        rgba(255,255,255,.68);

    font-size: 11px;
}


.audit-action-card li i {
    width: 18px;
    height: 18px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background:
        rgba(0,123,255,.13);

    color: #4ea1ff;

    font-size: 7px;
}


/* CTA */

.audit-main-btn {
    display: flex;

    align-items: center;
    justify-content: center;

    gap: 8px;

    width: 100%;

    padding: 13px 15px;

    border-radius: 7px;

    background: #007bff;

    color: #fff !important;

    font-size: 12px;
    font-weight: 600;

    text-decoration: none !important;

    box-shadow:
        0 10px 25px
        rgba(0,123,255,.23);

    transition: .25s ease;
}


.audit-main-btn:hover {
    transform: translateY(-2px);

    background: #0069d9;

    box-shadow:
        0 14px 30px
        rgba(0,123,255,.30);
}


.audit-main-btn .fa-whatsapp {
    font-size: 15px;
}


.audit-note {
    margin: 9px 0 0;

    color:
        rgba(255,255,255,.30);

    font-size: 8px;

    text-align: center;
}


/* TABLET */

@media (max-width: 991px) {

    .audit-cta-box {
        padding: 35px;
    }


    .audit-action-card {
        margin-top: 30px;
    }

}


/* MOBILE */

@media (max-width: 575px) {

    .website-audit-cta {
        padding: 15px 0 50px;
    }


    .audit-cta-box {
        padding: 28px 20px;

        border-radius: 15px;
    }


    .audit-cta-box h2 {
        font-size: 27px;
    }


    .audit-desc {
        font-size: 12px;
    }


    .audit-problems {
        gap: 7px;
    }


    .audit-problems span {
        font-size: 9px;
    }


    .audit-action-card {
        padding: 20px;
    }


    .audit-action-card h3 {
        font-size: 18px;
    }

}
      
      
      
  * {
            box-sizing: border-box;
        }

        body {
            margin: 0;
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
            background: #ffffff;
            color: #111827;
        }


        /* ==========================================
           TECHNOLOGY SECTION
        ========================================== */

        .website-tech-section {
            position: relative;
            overflow: hidden;

            padding: 90px 0;

            background:
                radial-gradient(
                    circle at 5% 10%,
                    rgba(0, 123, 255, .07),
                    transparent 28%
                ),
                radial-gradient(
                    circle at 95% 90%,
                    rgba(0, 123, 255, .05),
                    transparent 28%
                ),
                #ffffff;
        }


        /* ==========================================
           LEFT CONTENT
        ========================================== */

        .tech-copy {
            max-width: 540px;
        }


        .tech-kicker {
            display: inline-block;

            margin-bottom: 12px;

            color: #007bff;

            font-size: 11px;
            font-weight: 700;

            letter-spacing: 1.7px;
        }


        .tech-copy h2 {
            margin-bottom: 18px;

            color: #101828;

            font-size: 42px;
            line-height: 1.18;

            font-weight: 700;

            letter-spacing: -.9px;
        }


        .tech-copy h2 span {
            color: #007bff;
        }


        .tech-intro {
            margin-bottom: 24px;

            color: #667085;

            font-size: 14px;
            line-height: 1.8;
        }


        /* ==========================================
           LEFT POINTS
        ========================================== */

        .tech-points {
            margin-bottom: 28px;
        }


        .tech-point {
            display: flex;
            align-items: center;

            gap: 10px;

            margin-bottom: 12px;

            color: #344054;

            font-size: 12px;
        }


        .tech-point i {
            width: 23px;
            height: 23px;

            display: flex;
            align-items: center;
            justify-content: center;

            flex: 0 0 23px;

            border-radius: 50%;

            background:
                rgba(0, 123, 255, .09);

            color: #007bff;

            font-size: 8px;
        }


        /* ==========================================
           LEFT NOTE
        ========================================== */

        .tech-mini-note {
            display: flex;
            align-items: flex-start;

            gap: 12px;

            max-width: 470px;

            padding: 15px 16px;

            border: 1px solid #e8edf4;

            border-radius: 10px;

            background: #f9fbfe;
        }


        .tech-note-icon {
            width: 35px;
            height: 35px;

            flex: 0 0 35px;

            display: flex;
            align-items: center;
            justify-content: center;

            border-radius: 8px;

            background:
                rgba(0, 123, 255, .08);

            color: #007bff;

            font-size: 13px;
        }


        .tech-mini-note strong {
            display: block;

            margin-bottom: 3px;

            color: #101828;

            font-size: 11px;
        }


        .tech-mini-note p {
            margin: 0;

            color: #7b8493;

            font-size: 9.5px;
            line-height: 1.55;
        }


        /* ==========================================
           RIGHT VISUAL
        ========================================== */

        .tech-visual {
            position: relative;

            width: 100%;

            min-height: 500px;

            max-width: 570px;

            margin-left: auto;
        }


        .tech-visual::before {
            content: "";

            position: absolute;

            width: 380px;
            height: 380px;

            left: 50%;
            top: 50%;

            transform:
                translate(-50%, -50%);

            border-radius: 50%;

            background:
                radial-gradient(
                    circle,
                    rgba(0, 123, 255, .12),
                    rgba(0, 123, 255, .035) 42%,
                    transparent 70%
                );

            filter: blur(2px);
        }


        /* ==========================================
           ORBITS
        ========================================== */

        .tech-orbit {
            position: absolute;

            left: 50%;
            top: 50%;

            border:
                1px dashed
                rgba(0, 123, 255, .13);

            border-radius: 50%;

            transform:
                translate(-50%, -50%);

            pointer-events: none;
        }


        .orbit-one {
            width: 275px;
            height: 275px;

            animation:
                orbitRotate 26s linear infinite;
        }


        .orbit-two {
            width: 420px;
            height: 420px;

            border-color:
                rgba(15, 23, 42, .07);

            animation:
                orbitRotateReverse 38s linear infinite;
        }


        @keyframes orbitRotate {

            from {
                transform:
                    translate(-50%, -50%)
                    rotate(0deg);
            }

            to {
                transform:
                    translate(-50%, -50%)
                    rotate(360deg);
            }

        }


        @keyframes orbitRotateReverse {

            from {
                transform:
                    translate(-50%, -50%)
                    rotate(360deg);
            }

            to {
                transform:
                    translate(-50%, -50%)
                    rotate(0deg);
            }

        }


        /* ==========================================
           CENTER WEB NODE
        ========================================== */

        .tech-center {
            position: absolute;

            left: 50%;
            top: 50%;

            z-index: 3;

            transform:
                translate(-50%, -50%);
        }


        .tech-center-inner {
            width: 105px;
            height: 105px;

            display: flex;
            flex-direction: column;

            align-items: center;
            justify-content: center;

            border:
                1px solid
                rgba(0, 123, 255, .15);

            border-radius: 50%;

            background:
                rgba(255, 255, 255, .92);

            backdrop-filter:
                blur(12px);

            box-shadow:
                0 20px 50px
                rgba(15, 23, 42, .09);

            color: #007bff;

            animation:
                centerPulse 4s ease-in-out infinite;
        }


        @keyframes centerPulse {

            0%,
            100% {
                box-shadow:
                    0 20px 50px rgba(15, 23, 42, .09),
                    0 0 0 0 rgba(0, 123, 255, .05);
            }

            50% {
                box-shadow:
                    0 20px 50px rgba(15, 23, 42, .09),
                    0 0 0 12px rgba(0, 123, 255, 0);
            }

        }


        .tech-center-inner i {
            margin-bottom: 6px;

            font-size: 24px;
        }


        .tech-center-inner span {
            color: #101828;

            font-size: 9px;
            font-weight: 700;

            letter-spacing: 1.5px;
        }


        /* ==========================================
           FLOATING LOGOS
        ========================================== */

        .tech-logo {
            position: absolute;

            z-index: 4;

            display: flex;

            flex-direction: column;

            align-items: center;
            justify-content: center;

            min-width: 82px;

            padding: 11px 10px;

            border:
                1px solid
                rgba(15, 23, 42, .06);

            border-radius: 13px;

            background:
                rgba(255, 255, 255, .88);

            backdrop-filter:
                blur(10px);

            box-shadow:
                0 12px 30px
                rgba(15, 23, 42, .06);

            animation:
                techFloat 5s ease-in-out infinite;

            transition:
                transform .3s ease,
                box-shadow .3s ease,
                border-color .3s ease;
        }


        .tech-logo:hover {
            transform:
                translateY(-7px)
                scale(1.05);

            border-color:
                rgba(0, 123, 255, .18);

            box-shadow:
                0 20px 40px
                rgba(15, 23, 42, .11);
        }


        .tech-logo img {
            width: 34px;
            height: 34px;

            margin-bottom: 7px;

            object-fit: contain;

            filter:
                saturate(.95);

            transition:
                transform .3s ease;
        }


        .tech-logo:hover img {
            transform:
                scale(1.12)
                rotate(-3deg);
        }


        .tech-logo span {
            color: #344054;

            font-size: 8px;
            font-weight: 600;

            white-space: nowrap;
        }


        @keyframes techFloat {

            0%,
            100% {
                transform:
                    translateY(0);
            }

            50% {
                transform:
                    translateY(-9px);
            }

        }


        /* ==========================================
           LOGO POSITIONS
        ========================================== */

        .tech-logo-1 {
            left: 1%;
            top: 12%;
        }


        .tech-logo-2 {
            left: 32%;
            top: 1%;

            animation-delay: .4s;
        }


        .tech-logo-3 {
            right: 6%;
            top: 12%;

            animation-delay: .8s;
        }


        .tech-logo-4 {
            right: -1%;
            top: 40%;

            animation-delay: 1.1s;
        }


        .tech-logo-5 {
            right: 7%;
            bottom: 7%;

            animation-delay: 1.5s;
        }


        .tech-logo-6 {
            left: 38%;
            bottom: -1%;

            animation-delay: 1.9s;
        }


        .tech-logo-7 {
            left: 2%;
            bottom: 8%;

            animation-delay: 2.3s;
        }


        .tech-logo-8 {
            left: -3%;
            top: 42%;

            animation-delay: .7s;
        }


        .tech-logo-9 {
            left: 22%;
            top: 31%;

            animation-delay: 1.3s;
        }


        .tech-logo-10 {
            right: 23%;
            top: 31%;

            animation-delay: 1.8s;
        }


        .tech-logo-11 {
            left: 17%;
            bottom: 27%;

            animation-delay: 2.1s;
        }


        .tech-logo-12 {
            right: 16%;
            bottom: 28%;

            animation-delay: 2.5s;
        }


        /* ==========================================
           TABLET
        ========================================== */

        @media (max-width: 991px) {

            .website-tech-section {
                padding: 70px 0;
            }


            .tech-copy {
                max-width: 680px;

                margin: auto;

                text-align: center;
            }


            .tech-copy h2 {
                font-size: 35px;
            }


            .tech-point {
                justify-content: center;
            }


            .tech-mini-note {
                margin:
                    0 auto;
            }


            .tech-visual {
                margin:
                    45px auto 0;
            }

        }


        /* ==========================================
           MOBILE
        ========================================== */

        @media (max-width: 575px) {

            .website-tech-section {
                padding: 55px 0;
            }


            .tech-copy h2 {
                font-size: 28px;
            }


            .tech-intro {
                font-size: 12px;
            }


            .tech-point {
                justify-content: flex-start;

                text-align: left;

                font-size: 11px;
            }


            .tech-mini-note {
                text-align: left;
            }


            .tech-visual {
                min-height: 420px;

                transform:
                    scale(.86);

                transform-origin:
                    top center;

                margin-top: 35px;

                margin-bottom: -50px;
            }


            .orbit-one {
                width: 225px;
                height: 225px;
            }


            .orbit-two {
                width: 335px;
                height: 335px;
            }


            .tech-center-inner {
                width: 82px;
                height: 82px;
            }


            .tech-center-inner i {
                font-size: 20px;
            }


            .tech-logo {
                min-width: 68px;

                padding: 8px 7px;
            }


            .tech-logo img {
                width: 25px;
                height: 25px;
            }


            .tech-logo span {
                font-size: 7px;
            }

        }


        /* REDUCED MOTION */

        @media (prefers-reduced-motion: reduce) {

            .tech-logo,
            .tech-orbit,
            .tech-center-inner {
                animation: none !important;
            }

        }

      
      
      
      
        /* =====================================================
           SMART PRICING SECTION
        ===================================================== */

        .smart-pricing-section {
            position: relative;
            overflow: hidden;

            padding: 90px 0;

            background:
                radial-gradient(
                    circle at 0% 10%,
                    rgba(0, 123, 255, .07),
                    transparent 26%
                ),
                radial-gradient(
                    circle at 100% 90%,
                    rgba(0, 123, 255, .045),
                    transparent 28%
                ),
                linear-gradient(
                    180deg,
                    #ffffff 0%,
                    #f8fbff 100%
                );
        }


        .smart-pricing-section::before {
            content: "";

            position: absolute;

            width: 380px;
            height: 380px;

            border-radius: 50%;

            background: rgba(0, 123, 255, .035);

            filter: blur(50px);

            top: -160px;
            right: -140px;

            pointer-events: none;
        }


        /* =====================================================
           SECTION HEADER
        ===================================================== */

        .pricing-head {
            max-width: 750px;

            margin: 0 auto 42px;

            text-align: center;
        }


        .pricing-kicker {
            display: inline-block;

            margin-bottom: 11px;

            color: #007bff;

            font-size: 11px;
            font-weight: 700;

            letter-spacing: 1.6px;
        }


        .pricing-head h2 {
            margin: 0 0 15px;

            color: #101828;

            font-size: 42px;
            line-height: 1.18;

            font-weight: 700;

            letter-spacing: -.9px;
        }


        .pricing-head h2 span {
            color: #007bff;
        }


        .pricing-head p {
            max-width: 680px;

            margin: 0 auto;

            color: #667085;

            font-size: 13px;
            line-height: 1.75;
        }


        /* =====================================================
           UNLOCK BOX
        ===================================================== */

        .pricing-unlock-box {
            position: relative;

            overflow: hidden;

            margin-bottom: 34px;

            padding: 28px;

            border-radius: 18px;

            background:
                radial-gradient(
                    circle at 90% 0%,
                    rgba(0, 123, 255, .20),
                    transparent 34%
                ),
                linear-gradient(
                    135deg,
                    #090d13 0%,
                    #101722 100%
                );

            box-shadow:
                0 24px 60px
                rgba(15, 23, 42, .15);
        }


        .pricing-unlock-box::after {
            content: "";

            position: absolute;

            width: 180px;
            height: 180px;

            border-radius: 50%;

            border:
                1px solid
                rgba(255,255,255,.06);

            right: 35px;
            top: -85px;
        }


        .unlock-content,
        .unlock-form-wrap {
            position: relative;
            z-index: 2;
        }


        .unlock-label {
            display: inline-flex;

            align-items: center;

            gap: 7px;

            margin-bottom: 9px;

            color: #62adff;

            font-size: 10px;
            font-weight: 700;

            letter-spacing: 1.3px;
        }


        .unlock-content h3 {
            margin: 0 0 8px;

            color: #fff;

            font-size: 22px;
            line-height: 1.35;

            font-weight: 650;
        }


        .unlock-content p {
            max-width: 470px;

            margin: 0;

            color: rgba(255,255,255,.58);

            font-size: 13px;
            line-height: 1.7;
        }


        .unlock-benefits {
            display: flex;

            flex-wrap: wrap;

            gap: 14px;

            margin-top: 14px;
        }


        .unlock-benefits span {
            color:
                rgba(255,255,255,.70);

            font-size: 11px;
        }


        .unlock-benefits i {
            margin-right: 4px;

            color: #55d187;
        }


        /* =====================================================
           FORM
        ===================================================== */

        .unlock-form-wrap {
            padding: 19px;

            border:
                1px solid
                rgba(255,255,255,.08);

            border-radius: 13px;

            background:
                rgba(255,255,255,.045);

            backdrop-filter:
                blur(10px);
        }


        .unlock-form-title {
            display: block;

            margin-bottom: 10px;

            color:
                rgba(255,255,255,.75);

            font-size: 11px;
            font-weight: 600;
        }


        .unlock-field-row {
            display: flex;

            gap: 8px;
        }


        .pricing-phone-field {
            display: flex;

            align-items: center;

            flex: 1;

            height: 47px;

            overflow: hidden;

            border:
                1px solid
                rgba(255,255,255,.12);

            border-radius: 8px;

            background:
                rgba(255,255,255,.06);
        }


        .phone-code {
            display: flex;

            align-items: center;

            height: 100%;

            padding: 0 12px;

            border-right:
                1px solid
                rgba(255,255,255,.10);

            color: #fff;

            font-size: 12px;
            font-weight: 600;
        }


        .pricing-phone-field input {
            width: 100%;
            height: 100%;

            border: 0;
            outline: 0;

            padding: 0 13px;

            background: transparent;

            color: #fff;

            font-size: 12px;
        }


        .pricing-phone-field input::placeholder {
            color:
                rgba(255,255,255,.35);
        }


        .unlock-price-btn {
            min-width: 180px;
            height: 47px;

            border: 0;

            border-radius: 8px;

            padding: 0 17px;

            background: #007bff;

            color: #fff;

            font-size: 12px;
            font-weight: 650;

            cursor: pointer;

            transition: .25s ease;
        }


        .unlock-price-btn:hover {
            transform:
                translateY(-2px);

            background:
                #0069d9;

            box-shadow:
                0 10px 22px
                rgba(0,123,255,.24);
        }


        .unlock-price-btn i {
            margin-left: 7px;
        }


        .unlock-note {
            display: flex;

            align-items: center;

            gap: 6px;

            margin-top: 9px;

            color:
                rgba(255,255,255,.45);

            font-size: 10px;
        }


        .unlock-error {
            display: none;

            margin-top: 8px;

            color: #ff9494;

            font-size: 11px;
        }


        /* =====================================================
           SUCCESS STATE
        ===================================================== */

        .unlock-success {
            display: none;

            position: relative;

            z-index: 2;

            align-items: center;

            justify-content: space-between;

            gap: 15px;

            padding: 17px 19px;

            border:
                1px solid
                rgba(73, 214, 137, .16);

            border-radius: 12px;

            background:
                rgba(73,214,137,.065);
        }


        .unlock-success-left {
            display: flex;

            align-items: center;

            gap: 12px;
        }


        .success-icon {
            width: 38px;
            height: 38px;

            flex: 0 0 38px;

            display: flex;

            align-items: center;

            justify-content: center;

            border-radius: 50%;

            background:
                rgba(63, 207, 120, .14);

            color: #49d689;

            font-size: 15px;
        }


        .unlock-success strong {
            display: block;

            margin-bottom: 3px;

            color: #fff;

            font-size: 13px;
        }


        .unlock-success span {
            color:
                rgba(255,255,255,.55);

            font-size: 11px;
        }


        /* =====================================================
           PRICING CARDS
        ===================================================== */

        .pricing-card {
            position: relative;

            display: flex;

            flex-direction: column;

            height: 100%;

            padding: 25px 21px 20px;

            border:
                1px solid
                #e4e9ef;

            border-radius: 16px;

            background: #fff;

            box-shadow:
                0 10px 36px
                rgba(15,23,42,.045);

            transition:
                transform .3s ease,
                box-shadow .3s ease,
                border-color .3s ease;
        }


        .pricing-card:hover {
            transform:
                translateY(-6px);

            border-color:
                rgba(0,123,255,.23);

            box-shadow:
                0 20px 46px
                rgba(15,23,42,.09);
        }


        .pricing-card.featured {
            border:
                1.5px solid
                #007bff;

            box-shadow:
                0 18px 50px
                rgba(0,123,255,.11);
        }


        .popular-pill {
            position: absolute;

            top: 13px;
            right: 13px;

            padding: 5px 8px;

            border-radius: 50px;

            background: #007bff;

            color: #fff;

            font-size: 7px;
            font-weight: 700;

            letter-spacing: .7px;
        }


        .package-top {
            display: flex;

            align-items: center;

            justify-content: space-between;

            margin-bottom: 17px;
        }


        .package-type {
            color: #007bff;

            font-size: 10px;
            font-weight: 700;

            letter-spacing: 1px;
        }


        .package-icon {
            width: 40px;
            height: 40px;

            display: flex;

            align-items: center;

            justify-content: center;

            border-radius: 10px;

            background:
                rgba(0,123,255,.07);

            color: #007bff;

            font-size: 14px;
        }


        .pricing-card h3 {
            margin: 0 0 8px;

            color: #101828;

            font-size: 19px;
            font-weight: 650;
        }


        .package-description {
            min-height: 62px;

            margin-bottom: 17px;

            color: #667085;

            font-size: 13px;
            line-height: 1.65;
        }


        /* =====================================================
           PRICE AREA
        ===================================================== */

        .smart-price {
            position: relative;

            margin-bottom: 18px;

            padding: 16px 0;

            border-top:
                1px solid
                #edf0f4;

            border-bottom:
                1px solid
                #edf0f4;
        }


        .price-label {
            display: block;

            margin-bottom: 5px;

            color: #98a2b3;

            font-size: 9px;
            font-weight: 700;

            text-transform: uppercase;

            letter-spacing: .8px;
        }


        .regular-price {
            display: inline-block;

            color: #98a2b3;

            font-size: 16px;
            font-weight: 550;

            text-decoration:
                line-through;
        }


        .locked-offer {
            margin-top: 10px;
        }


        .locked-offer span,
        .unlocked-offer span {
            display: block;

            margin-bottom: 5px;

            color: #667085;

            font-size: 10px;
            font-weight: 650;

            text-transform: uppercase;

            letter-spacing: .7px;
        }


        .locked-price-row {
            display: flex;

            align-items: center;

            gap: 7px;
        }


        .locked-offer strong {
            color: #101828;

            font-size: 26px;
            line-height: 1;

            letter-spacing: 4px;
        }


        .locked-offer i {
            color: #007bff;

            font-size: 11px;
        }


        .unlock-mini-text {
            display: block;

            margin-top: 6px;

            color: #98a2b3;

            font-size: 10px;

            text-transform:
                none !important;

            letter-spacing:
                0 !important;
        }


        .unlocked-offer {
            display: none;

            margin-top: 9px;
        }


        .unlocked-offer strong {
            display: block;

            color: #007bff;

            font-size: 30px;
            line-height: 1;

            font-weight: 750;
        }


        .save-badge {
            display: inline-flex !important;

            align-items: center;

            width: auto;

            margin-top: 8px;

            padding: 5px 9px;

            border-radius: 50px;

            background: #ecfdf3;

            color: #168946 !important;

            font-size: 10px !important;
            font-weight: 650 !important;

            text-transform:
                none !important;

            letter-spacing:
                0 !important;
        }


        /* =====================================================
           FEATURES
        ===================================================== */

        .package-features {
            margin:
                0 0 20px;

            padding: 0;

            list-style: none;
        }


        .package-features li {
            display: flex;

            align-items: flex-start;

            gap: 8px;

            padding: 5px 0;

            color: #475467;

            font-size: 12px;
            line-height: 1.55;
        }


        .package-features li i {
            width: 18px;
            height: 18px;

            flex: 0 0 18px;

            display: flex;

            align-items: center;

            justify-content: center;

            margin-top: 1px;

            border-radius: 50%;

            background: #ecfdf3;

            color: #16a34a;

            font-size: 7px;
        }


        /* =====================================================
           CARD CTA
        ===================================================== */

        .package-action {
            display: none;

            align-items: center;

            justify-content: space-between;

            width: 100%;

            margin-top: auto;

            padding: 12px 13px;

            border:
                1px solid
                #dfe4ea;

            border-radius: 8px;

            background: #fff;

            color: #101828 !important;

            font-size: 11px;
            font-weight: 650;

            text-decoration:
                none !important;

            transition:
                .25s ease;
        }


        .package-action:hover {
            background: #101828;

            border-color: #101828;

            color: #fff !important;
        }


        .featured .package-action {
            background: #007bff;

            border-color: #007bff;

            color: #fff !important;
        }


        .featured .package-action:hover {
            background: #0069d9;
        }


        /* =====================================================
           LOCKED CTA
        ===================================================== */

        .locked-card-trigger {
            display: flex;

            align-items: center;

            justify-content: center;

            gap: 7px;

            width: 100%;

            margin-top: auto;

            padding: 12px 13px;

            border:
                1px solid
                #e0e5eb;

            border-radius: 8px;

            background: #f8fafc;

            color: #475467;

            font-size: 11px;
            font-weight: 650;

            cursor: pointer;

            transition:
                .25s ease;
        }


        .locked-card-trigger:hover {
            border-color: #007bff;

            color: #007bff;

            background: #f5faff;
        }


        /* =====================================================
           UNLOCKED STATE
        ===================================================== */

        .smart-pricing-section.pricing-unlocked .locked-offer {
            display: none;
        }


        .smart-pricing-section.pricing-unlocked .unlocked-offer {
            display: block;

            animation:
                revealPrice .45s ease both;
        }


        .smart-pricing-section.pricing-unlocked .locked-card-trigger {
            display: none;
        }


        .smart-pricing-section.pricing-unlocked .package-action {
            display: flex;
        }


        .smart-pricing-section.pricing-unlocked .unlock-form-wrap {
            display: none;
        }


        .smart-pricing-section.pricing-unlocked .unlock-success {
            display: flex;
        }


        @keyframes revealPrice {

            from {
                opacity: 0;

                transform:
                    translateY(7px);
            }

            to {
                opacity: 1;

                transform:
                    translateY(0);
            }

        }


        /* =====================================================
           BOTTOM CTA
        ===================================================== */

        .pricing-bottom-cta {
            display: flex;

            align-items: center;

            justify-content: space-between;

            gap: 20px;

            margin-top: 17px;

            padding: 18px 20px;

            border:
                1px solid
                #e4e9ef;

            border-radius: 12px;

            background: #fff;
        }


        .pricing-bottom-cta strong {
            display: block;

            margin-bottom: 4px;

            color: #101828;

            font-size: 13px;
        }


        .pricing-bottom-cta p {
            margin: 0;

            color: #667085;

            font-size: 12px;
            line-height: 1.6;
        }


        .bottom-actions {
            display: flex;

            gap: 8px;

            flex-wrap: wrap;
        }


        .full-pricing-btn,
        .whatsapp-btn {
            display: inline-flex;

            align-items: center;

            justify-content: center;

            gap: 7px;

            padding: 11px 15px;

            border-radius: 7px;

            font-size: 11px;
            font-weight: 650;

            text-decoration:
                none !important;

            transition:
                .25s ease;
        }


        .full-pricing-btn {
            border:
                1px solid
                #dfe4ea;

            background: #fff;

            color: #101828 !important;
        }


        .full-pricing-btn:hover {
            border-color: #101828;
        }


        .whatsapp-btn {
            border:
                1px solid
                #007bff;

            background: #007bff;

            color: #fff !important;
        }


        .whatsapp-btn:hover {
            background: #0069d9;
        }


        /* =====================================================
           TABLET
        ===================================================== */

        @media (max-width: 991px) {

            .smart-pricing-section {
                padding: 70px 0;
            }


            .pricing-head h2 {
                font-size: 35px;
            }


            .pricing-unlock-box {
                padding: 24px;
            }


            .unlock-form-wrap {
                margin-top: 24px;
            }


            .pricing-bottom-cta {
                flex-direction: column;

                align-items: flex-start;
            }

        }


        /* =====================================================
           MOBILE
        ===================================================== */

        @media (max-width: 575px) {

            .smart-pricing-section {
                padding: 55px 0;
            }


            .pricing-head {
                margin-bottom: 30px;
            }


            .pricing-head h2 {
                font-size: 28px;
            }


            .pricing-head p {
                font-size: 13px;
            }


            .pricing-unlock-box {
                padding: 20px 17px;

                border-radius: 14px;
            }


            .unlock-content h3 {
                font-size: 19px;
            }


            .unlock-content p {
                font-size: 12px;
            }


            .unlock-field-row {
                flex-direction: column;
            }


            .unlock-price-btn {
                width: 100%;
            }


            .package-description {
                min-height: auto;

                font-size: 13px;
            }


            .package-features li {
                font-size: 12px;
            }


            .pricing-bottom-cta {
                padding: 17px;
            }


            .bottom-actions {
                width: 100%;

                flex-direction: column;
            }


            .full-pricing-btn,
            .whatsapp-btn {
                width: 100%;
            }


            .unlock-success {
                align-items: flex-start;
            }

        }

      
      
      
      
      .ww-proof-section {

    position: relative;

    overflow: hidden;

    padding: 100px 0 55px;

    background:
        radial-gradient(
            circle at 90% 5%,
            rgba(0,123,255,.12),
            transparent 28%
        ),
        radial-gradient(
            circle at 5% 100%,
            rgba(0,123,255,.055),
            transparent 25%
        ),
        #080b10;

    color: #fff;

}


/* subtle ambient glow */

.ww-proof-section::before {

    content: "";

    position: absolute;

    width: 480px;
    height: 480px;

    top: 30%;
    left: 50%;

    transform:
        translate(-50%, -50%);

    border-radius: 50%;

    background:
        rgba(0,123,255,.025);

    filter:
        blur(80px);

    pointer-events: none;

}


.ww-proof-section .container {

    position: relative;

    z-index: 2;

}



/* =========================================================
   HEADER
========================================================= */

.ww-proof-head {

    max-width: 720px;

}


.ww-eyebrow {

    display: inline-block;

    margin-bottom: 13px;

    color: #4c9fff;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1.8px;

}


.ww-proof-head h2 {

    margin: 0;

    color: #fff;

    font-size: 44px;

    line-height: 1.15;

    font-weight: 700;

    letter-spacing: -1px;

}


.ww-proof-head h2 span {

    color: #007bff;

}


.ww-head-copy {

    height: 100%;

    display: flex;

    align-items: flex-end;

    padding-bottom: 4px;

}


.ww-head-copy p {

    margin: 0;

    color:
        rgba(255,255,255,.52);

    font-size: 13px;

    line-height: 1.8;

}



/* =========================================================
   PROOF GRID
========================================================= */

.ww-proof-grid {

    display: grid;

    grid-template-columns:
        repeat(2, 1fr);

    margin-top: 60px;

    border-top:
        1px solid
        rgba(255,255,255,.10);

    border-left:
        1px solid
        rgba(255,255,255,.10);

}



/* =========================================================
   ITEM
========================================================= */

.ww-proof-item {

    position: relative;

    min-height: 330px;

    padding: 42px 46px;

    overflow: hidden;

    border-right:
        1px solid
        rgba(255,255,255,.10);

    border-bottom:
        1px solid
        rgba(255,255,255,.10);

    transition:
        background .35s ease;

}


.ww-proof-item:hover {

    background:
        linear-gradient(
            135deg,
            rgba(0,123,255,.075),
            rgba(255,255,255,.015)
        );

}



/* top blue line on hover */

.ww-proof-item::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 0;

    height: 2px;

    background: #007bff;

    transition:
        width .4s ease;

}


.ww-proof-item:hover::before {

    width: 100%;

}



/* =========================================================
   GIANT BACKGROUND NUMBER
========================================================= */

.ww-big-number {

    position: absolute;

    top: 17px;
    right: 28px;

    color:
        rgba(255,255,255,.035);

    font-size: 100px;

    line-height: 1;

    font-weight: 800;

    letter-spacing: -7px;

    pointer-events: none;

    transition:
        color .35s ease,
        transform .35s ease;

}


.ww-proof-item:hover .ww-big-number {

    color:
        rgba(0,123,255,.075);

    transform:
        translateY(-4px);

}



/* =========================================================
   ICON
========================================================= */

.ww-item-icon {

    width: 43px;
    height: 43px;

    display: flex;

    align-items: center;
    justify-content: center;

    margin-bottom: 25px;

    border:
        1px solid
        rgba(0,123,255,.20);

    border-radius: 10px;

    background:
        rgba(0,123,255,.09);

    color: #4c9fff;

    font-size: 15px;

}



/* =========================================================
   CONTENT
========================================================= */

.ww-proof-item h3 {

    position: relative;

    max-width: 350px;

    margin: 0 0 13px;

    color: #fff;

    font-size: 22px;

    line-height: 1.35;

    font-weight: 650;

}


.ww-proof-item p {

    position: relative;

    max-width: 480px;

    margin: 0 0 22px;

    color:
        rgba(255,255,255,.50);

    font-size: 13px;

    line-height: 1.75;

}



/* =========================================================
   TAGS
========================================================= */

.ww-tags {

    position: relative;

    display: flex;

    flex-wrap: wrap;

    gap: 7px;

}


.ww-tags span {

    padding:
        5px 9px;

    border:
        1px solid
        rgba(255,255,255,.09);

    border-radius: 5px;

    background:
        rgba(255,255,255,.025);

    color:
        rgba(255,255,255,.58);

    font-size: 10px;

    font-weight: 500;

    transition: .25s ease;

}


.ww-proof-item:hover .ww-tags span {

    border-color:
        rgba(0,123,255,.19);

    color:
        rgba(255,255,255,.72);

}



/* =========================================================
   BOTTOM CTA
========================================================= */

.ww-proof-bottom {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 30px;

    padding:
        28px 0 0;

    margin-top: 28px;

}


.ww-bottom-message {

    display: flex;

    align-items: center;

    gap: 13px;

}



/* animated status dot */

.ww-status-dot {

    position: relative;

    width: 9px;
    height: 9px;

    flex:
        0 0 9px;

    border-radius: 50%;

    background: #007bff;

    box-shadow:
        0 0 0 5px
        rgba(0,123,255,.10);

}


.ww-status-dot::after {

    content: "";

    position: absolute;

    inset: -5px;

    border:
        1px solid
        rgba(0,123,255,.35);

    border-radius: 50%;

    animation:
        wwPulse 2s infinite;

}


@keyframes wwPulse {

    0% {

        transform:
            scale(.8);

        opacity: 1;

    }

    100% {

        transform:
            scale(1.8);

        opacity: 0;

    }

}


.ww-bottom-small {

    display: block;

    margin-bottom: 3px;

    color: #007bff;

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 1.2px;

}


.ww-bottom-message strong {

    display: block;

    color: #fff;

    font-size: 15px;

    font-weight: 600;

}



/* =========================================================
   BOTTOM BUTTONS
========================================================= */

.ww-bottom-actions {

    display: flex;

    align-items: center;

    gap: 10px;

}


.ww-btn-primary,
.ww-btn-simple {

    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 8px;

    padding:
        12px 17px;

    border-radius: 7px;

    font-size: 11px;

    font-weight: 650;

    text-decoration:
        none !important;

    transition: .25s ease;

}


.ww-btn-primary {

    background: #007bff;

    color:
        #fff !important;

}


.ww-btn-primary:hover {

    transform:
        translateY(-2px);

    background:
        #1687ff;

    box-shadow:
        0 10px 25px
        rgba(0,123,255,.22);

}


.ww-btn-simple {

    border:
        1px solid
        rgba(255,255,255,.12);

    background:
        rgba(255,255,255,.04);

    color:
        #fff !important;

}


.ww-btn-simple:hover {

    border-color:
        rgba(255,255,255,.22);

    background:
        rgba(255,255,255,.08);

}



/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .ww-proof-section {

        padding:
            75px 0 50px;

    }


    .ww-proof-head h2 {

        font-size: 36px;

    }


    .ww-head-copy {

        margin-top: 20px;

        max-width: 600px;

    }


    .ww-proof-grid {

        margin-top: 45px;

    }


    .ww-proof-item {

        min-height: 350px;

        padding:
            35px 30px;

    }


    .ww-proof-bottom {

        align-items:
            flex-start;

        flex-direction:
            column;

    }

}



/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .ww-proof-grid {

        grid-template-columns:
            1fr;

    }

}



@media (max-width: 575px) {

    .ww-proof-section {

        padding:
            60px 0 45px;

    }


    .ww-proof-head h2 {

        font-size: 29px;

    }


    .ww-head-copy p {

        font-size: 13px;

    }


    .ww-proof-grid {

        margin-top: 35px;

    }


    .ww-proof-item {

        min-height: auto;

        padding:
            30px 22px;

    }


    .ww-big-number {

        top: 18px;

        right: 20px;

        font-size: 72px;

    }


    .ww-item-icon {

        width: 40px;
        height: 40px;

        margin-bottom: 21px;

    }


    .ww-proof-item h3 {

        font-size: 19px;

    }


    .ww-proof-item p {

        font-size: 13px;

    }


    .ww-proof-bottom {

        margin-top: 20px;

    }


    .ww-bottom-actions {

        width: 100%;

        flex-direction: column;

    }


    .ww-btn-primary,
    .ww-btn-simple {

        width: 100%;

    }

}

      
      
      
/* =========================================================
   SECTION
========================================================= */

.testimonial-video-section {
    position: relative;
    overflow: hidden;

    padding: 95px 0 85px;

    background:
        radial-gradient(
            circle at 5% 15%,
            rgba(0,123,255,.045),
            transparent 28%
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f8fbff 100%
        );
}


/* =========================================================
   HEADER
========================================================= */

.testimonial-kicker {
    display: inline-block;

    margin-bottom: 11px;

    color: #007bff;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: 1.7px;
}


.testimonial-title {
    margin: 0;

    color: #101828;

    font-size: 42px;
    line-height: 1.17;

    font-weight: 700;

    letter-spacing: -.9px;
}


.testimonial-title span {
    color: #007bff;
}


.testimonial-intro {
    max-width: 460px;

    margin: 0 0 4px auto;

    color: #667085;

    font-size: 13px;
    line-height: 1.8;
}


/* =========================================================
   CAROUSEL
========================================================= */

.testimonial-carousel {
    position: relative;

    padding:
        10px 70px 48px;
}


/* =========================================================
   VIDEO CARD
========================================================= */

.review-video-card {
    max-width: 300px;

    margin: 0 auto;
}


.review-video-frame {
    position: relative;

    overflow: hidden;

    width: 100%;

    aspect-ratio: 9 / 16;

    border-radius: 18px;

    background: #090d13;

    box-shadow:
        0 20px 50px
        rgba(15,23,42,.14);

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}


.review-video-frame:hover {
    transform:
        translateY(-5px);

    box-shadow:
        0 28px 65px
        rgba(15,23,42,.18);
}


/* VIDEO */

.review-video-frame video {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;
}


/* GRADIENT OVERLAY */

.review-video-frame::after {
    content: "";

    position: absolute;
    inset: 0;

    pointer-events: none;

    background:
        linear-gradient(
            to top,
            rgba(6,10,15,.88) 0%,
            rgba(6,10,15,.30) 35%,
            transparent 62%
        );

    transition:
        opacity .3s ease;
}


/* =========================================================
   PLAY / PAUSE BUTTON
========================================================= */

.review-play-button {
    position: absolute;

    left: 50%;
    top: 50%;

    z-index: 5;

    width: 58px;
    height: 58px;

    display: flex;

    align-items: center;
    justify-content: center;

    transform:
        translate(-50%, -50%);

    border:
        1px solid
        rgba(255,255,255,.35);

    border-radius: 50%;

    background:
        rgba(255,255,255,.94);

    color: #101828;

    font-size: 15px;

    cursor: pointer;

    box-shadow:
        0 12px 30px
        rgba(0,0,0,.18);

    transition:
        transform .25s ease,
        background .25s ease,
        color .25s ease;
}


.review-play-button:hover {
    transform:
        translate(-50%, -50%)
        scale(1.08);

    background: #007bff;

    color: #fff;
}


.review-play-button i.fa-play {
    margin-left: 3px;
}


/* playing state */

.review-video-frame.is-playing
.review-play-button {
    width: 44px;
    height: 44px;

    top: 25px;
    left: auto;
    right: 20px;

    transform: none;

    opacity: .85;

    background:
        rgba(0,0,0,.48);

    color: #fff;

    border-color:
        rgba(255,255,255,.22);

    backdrop-filter: blur(6px);
}


.review-video-frame.is-playing
.review-play-button:hover {
    transform: none;

    background:
        rgba(0,0,0,.72);
}


/* =========================================================
   VIDEO INFO
========================================================= */

.review-video-info {
    position: absolute;

    z-index: 4;

    left: 0;
    right: 0;
    bottom: 0;

    padding: 22px;
}


.review-video-info > span {
    display: block;

    margin-bottom: 6px;

    color: #62adff;

    font-size: 9px;
    font-weight: 700;

    letter-spacing: 1.3px;
}


.review-video-info h3 {
    margin: 0 0 3px;

    color: #fff;

    font-size: 17px;
    font-weight: 650;
}


.review-video-info p {
    margin: 0;

    color:
        rgba(255,255,255,.58);

    font-size: 12px;
}


/* hide info while playing */

.review-video-frame.is-playing
.review-video-info {
    opacity: 0;

    pointer-events: none;
}


.review-video-frame.is-playing::after {
    opacity: 0;
}


/* =========================================================
   CAROUSEL CONTROLS
========================================================= */

.review-carousel-prev,
.review-carousel-next {
    top: 50%;

    width: 42px;
    height: 42px;

    transform:
        translateY(-50%);

    border:
        1px solid
        #e1e7ee;

    border-radius: 50%;

    background: #fff;

    color: #101828;

    opacity: 1;

    box-shadow:
        0 8px 24px
        rgba(15,23,42,.07);

    transition: .25s ease;
}


.review-carousel-prev {
    left: 0;
}


.review-carousel-next {
    right: 0;
}


.review-carousel-prev:hover,
.review-carousel-next:hover {
    background: #007bff;

    border-color: #007bff;

    color: #fff;
}


/* =========================================================
   INDICATORS
========================================================= */

.review-indicators {
    bottom: 0;

    margin-bottom: 4px;
}


.review-indicators li {
    width: 7px;
    height: 7px;

    margin: 0 4px;

    border: 0;

    border-radius: 50%;

    background: #cbd3dc;

    opacity: 1;
}


.review-indicators li.active {
    width: 22px;

    border-radius: 20px;

    background: #007bff;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .testimonial-video-section {
        padding: 75px 0;
    }


    .testimonial-title {
        font-size: 36px;
    }


    .testimonial-intro {
        margin:
            18px 0 0;

        max-width: 600px;
    }


    .testimonial-carousel {
        padding:
            10px 50px 48px;
    }


    .review-video-card {
        max-width: 280px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .testimonial-carousel {
        padding:
            10px 42px 48px;
    }


    /*
    Hide 2nd and 3rd cards on mobile,
    so each slide shows one vertical review.
    */

    .carousel-item .col-md-6:not(:first-child) {
        display: none;
    }


    .review-video-card {
        max-width: 285px;
    }

}


@media (max-width: 575px) {

    .testimonial-video-section {
        padding: 60px 0;
    }


    .testimonial-title {
        font-size: 29px;
    }


    .testimonial-intro {
        font-size: 13px;
    }


    .testimonial-carousel {
        padding:
            5px 35px 45px;
    }


    .review-video-frame {
        border-radius: 15px;
    }


    .review-video-info {
        padding: 19px;
    }


    .review-carousel-prev,
    .review-carousel-next {
        width: 34px;
        height: 34px;

        font-size: 11px;
    }

}

      
      .wd-kicker {
    display: inline-block;
    margin-bottom: 11px;
    color: #007bff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.7px;
}


/* =========================================================
   PROCESS
========================================================= */

.wd-process-section {
    padding: 95px 0;
    background: #fff;
}


.wd-section-head {
    max-width: 720px;
    margin: 0 auto 60px;
}


.wd-section-head h2 {
    margin: 0 0 14px;
    color: #101828;
    font-size: 42px;
    line-height: 1.18;
    font-weight: 700;
    letter-spacing: -.9px;
}


.wd-section-head h2 span {
    color: #007bff;
}


.wd-section-head p {
    margin: 0;
    color: #667085;
    font-size: 13px;
    line-height: 1.8;
}


.wd-process-wrap {
    position: relative;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
}


.wd-process-line {
    position: absolute;
    left: 8%;
    right: 8%;
    top: 25px;
    height: 1px;
    background: #dfe5ec;
}


.wd-process-step {
    position: relative;
    padding: 0 16px;
    text-align: center;
}


.wd-process-node {
    position: relative;
    z-index: 2;
    width: 50px;
    height: 50px;
    margin: 0 auto 23px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dde4ec;
    border-radius: 50%;
    background: #fff;
    color: #98a2b3;
    font-size: 10px;
    font-weight: 700;
    transition: .3s ease;
}


.wd-process-step:hover .wd-process-node {
    background: #007bff;
    border-color: #007bff;
    color: #fff;
    box-shadow: 0 9px 25px rgba(0,123,255,.18);
}


.wd-process-icon {
    width: 38px;
    height: 38px;
    margin: 0 auto 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: rgba(0,123,255,.07);
    color: #007bff;
    font-size: 13px;
}


.wd-process-content h3 {
    margin: 0 0 8px;
    color: #101828;
    font-size: 16px;
    line-height: 1.4;
    font-weight: 650;
}


.wd-process-content p {
    margin: 0;
    color: #667085;
    font-size: 12px;
    line-height: 1.7;
}


.wd-process-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 55px;
    padding: 19px 21px;
    border-top: 1px solid #e5eaf0;
    border-bottom: 1px solid #e5eaf0;
}


.wd-process-footer strong {
    display: block;
    margin-bottom: 3px;
    color: #101828;
    font-size: 13px;
}


.wd-process-footer p {
    margin: 0;
    color: #667085;
    font-size: 12px;
}


.wd-process-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 16px;
    border-radius: 7px;
    background: #101828;
    color: #fff !important;
    font-size: 11px;
    font-weight: 650;
    text-decoration: none !important;
    white-space: nowrap;
    transition: .25s ease;
}


.wd-process-btn:hover {
    background: #007bff;
    transform: translateY(-2px);
}


/* =========================================================
   FAQ
========================================================= */

.wd-faq-section {
    padding: 95px 0;
    background:
        radial-gradient(circle at 100% 10%, rgba(0,123,255,.045), transparent 25%),
        #f8fafc;
}


.wd-faq-left {
    max-width: 330px;
}


.wd-faq-left h2 {
    margin: 0 0 16px;
    color: #101828;
    font-size: 38px;
    line-height: 1.18;
    font-weight: 700;
    letter-spacing: -.8px;
}


.wd-faq-left h2 span {
    color: #007bff;
}


.wd-faq-left > p {
    margin: 0 0 25px;
    color: #667085;
    font-size: 13px;
    line-height: 1.75;
}


.wd-faq-contact {
    display: block;
    padding-top: 18px;
    border-top: 1px solid #dfe5ec;
    color: #667085 !important;
    font-size: 11px;
    text-decoration: none !important;
}


.wd-faq-contact span {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-top: 5px;
    color: #101828;
    font-size: 13px;
    font-weight: 650;
}


.wd-faq-item {
    border-bottom: 1px solid #dfe5ec;
}


.wd-faq-item:first-child {
    border-top: 1px solid #dfe5ec;
}


.wd-faq-question {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 4px;
    border: 0;
    outline: 0 !important;
    background: transparent;
    color: #101828;
    text-align: left;
    font-size: 15px;
    font-weight: 650;
    cursor: pointer;
}


.wd-faq-question i {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dfe5ec;
    border-radius: 50%;
    color: #667085;
    font-size: 9px;
    transition: .3s ease;
}


.wd-faq-question:not(.collapsed) i {
    transform: rotate(45deg);
    border-color: #007bff;
    background: #007bff;
    color: #fff;
}


.wd-faq-answer {
    max-width: 720px;
    padding: 0 45px 22px 4px;
    color: #667085;
    font-size: 13px;
    line-height: 1.75;
}


/* =========================================================
   FINAL LEAD CTA
========================================================= */

.wd-final-lead-section {
    padding: 90px 0;
    background: #fff;
}


.wd-final-lead {
    position: relative;
    overflow: hidden;
    padding: 50px;
    border-radius: 22px;
    background:
        radial-gradient(circle at 92% 5%, rgba(0,123,255,.28), transparent 30%),
        radial-gradient(circle at 5% 100%, rgba(0,123,255,.08), transparent 28%),
        #080c12;
    box-shadow: 0 30px 70px rgba(15,23,42,.16);
}


.wd-final-lead::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
    background-size: 38px 38px;
}


.wd-final-copy,
.wd-final-form-wrap {
    position: relative;
    z-index: 2;
}


.wd-final-kicker {
    display: inline-block;
    margin-bottom: 12px;
    color: #61acff;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.6px;
}


.wd-final-copy h2 {
    margin: 0 0 16px;
    color: #fff;
    font-size: 40px;
    line-height: 1.18;
    font-weight: 700;
    letter-spacing: -.9px;
}


.wd-final-copy h2 span {
    color: #1687ff;
}


.wd-final-copy > p {
    max-width: 500px;
    margin: 0;
    color: rgba(255,255,255,.56);
    font-size: 13px;
    line-height: 1.8;
}


.wd-final-points {
    display: flex;
    flex-direction: column;
    gap: 9px;
    margin-top: 25px;
}


.wd-final-points span {
    color: rgba(255,255,255,.72);
    font-size: 12px;
}


.wd-final-points i {
    margin-right: 7px;
    color: #4fd184;
}


/* FORM */

.wd-final-form-wrap {
    padding: 24px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 15px;
    background: rgba(255,255,255,.055);
    backdrop-filter: blur(10px);
}


.wd-final-form-label {
    display: block;
    margin-bottom: 16px;
    color: #62adff;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 1.3px;
}


.wd-form-group {
    margin-bottom: 14px;
}


.wd-form-group label {
    display: block;
    margin-bottom: 6px;
    color: rgba(255,255,255,.62);
    font-size: 10px;
}


.wd-form-group input,
.wd-form-group select {
    width: 100%;
    height: 46px;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 7px;
    outline: 0;
    padding: 0 12px;
    background: rgba(255,255,255,.055);
    color: #fff;
    font-size: 12px;
}


.wd-form-group input::placeholder {
    color: rgba(255,255,255,.30);
}


.wd-form-group select option {
    color: #101828;
}


.wd-phone-field {
    display: flex;
    height: 46px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 7px;
    background: rgba(255,255,255,.055);
}


.wd-phone-field span {
    display: flex;
    align-items: center;
    padding: 0 11px;
    border-right: 1px solid rgba(255,255,255,.10);
    color: #fff;
    font-size: 11px;
}


.wd-phone-field input {
    height: 100%;
    border: 0;
    background: transparent;
}


.wd-final-submit {
    width: 100%;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border: 0;
    border-radius: 8px;
    background: #007bff;
    color: #fff;
    font-size: 12px;
    font-weight: 650;
    cursor: pointer;
    transition: .25s ease;
}


.wd-final-submit:hover {
    transform: translateY(-2px);
    background: #1687ff;
}


.wd-final-divider {
    position: relative;
    margin: 17px 0;
    text-align: center;
}


.wd-final-divider::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 1px;
    background: rgba(255,255,255,.08);
}


.wd-final-divider span {
    position: relative;
    z-index: 2;
    padding: 0 10px;
    background: #111821;
    color: rgba(255,255,255,.30);
    font-size: 8px;
}


.wd-final-whatsapp {
    width: 100%;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 8px;
    background: rgba(255,255,255,.05);
    color: #fff !important;
    font-size: 11px;
    font-weight: 600;
    text-decoration: none !important;
    transition: .25s ease;
}


.wd-final-whatsapp:hover {
    background: rgba(255,255,255,.10);
}


.wd-form-privacy {
    margin: 11px 0 0;
    text-align: center;
    color: rgba(255,255,255,.30);
    font-size: 9px;
}


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

@media (max-width: 991px) {

    .wd-process-section,
    .wd-faq-section,
    .wd-final-lead-section {
        padding: 75px 0;
    }

    .wd-process-wrap {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .wd-process-line {
        left: 24px;
        right: auto;
        top: 25px;
        bottom: 25px;
        width: 1px;
        height: auto;
    }

    .wd-process-step {
        display: flex;
        align-items: flex-start;
        gap: 22px;
        padding: 0 0 35px;
        text-align: left;
    }

    .wd-process-node {
        flex: 0 0 50px;
        margin: 0;
    }

    .wd-process-icon {
        margin: 0 0 12px;
    }

    .wd-process-footer {
        align-items: flex-start;
        flex-direction: column;
    }

    .wd-faq-left {
        max-width: 600px;
    }

    .wd-final-lead {
        padding: 38px;
    }

    .wd-final-copy h2 {
        font-size: 34px;
    }

}


@media (max-width: 575px) {

    .wd-process-section,
    .wd-faq-section,
    .wd-final-lead-section {
        padding: 60px 0;
    }

    .wd-section-head {
        margin-bottom: 42px;
    }

    .wd-section-head h2 {
        font-size: 29px;
    }

    .wd-faq-left h2 {
        font-size: 29px;
    }

    .wd-faq-question {
        padding: 19px 0;
        font-size: 14px;
    }

    .wd-faq-answer {
        padding: 0 20px 19px 0;
        font-size: 13px;
    }

    .wd-final-lead {
        padding: 28px 20px;
        border-radius: 16px;
    }

    .wd-final-copy h2 {
        font-size: 29px;
    }

    .wd-final-form-wrap {
        padding: 19px 16px;
    }

}