h2{font-weight:bold}
.main-navigation, .main-navigation ul ul {background-color:transparent !important}
.main-navigation .main-nav ul li[class*="current-menu-"] > a{color:#000 !important}
.site-header{
    background-color:#f5f7f7 !important
}
.one-container .site-content {
     padding: 0px !important;
}
 .hero-title {
     font-size: clamp(3.5rem, 4.2vw, 5.5rem);
     font-weight: 800;
     color: #0f172a;
     margin-bottom: 2rem;
}
 .hero-title span {
     color: #ff6b1a;
}
 .hero-description {
     max-width: 560px;
     font-size: 1.25rem;
     color: #4b5563;
     margin-bottom: 2rem;
}
 .hero-buttons {
     display: flex;
     gap: 20px;
     margin: 30px 0;
}
 .btn {
     display: inline-flex;
     align-items: center;
     gap: 12px;
     padding: 18px 34px;
     border-radius: 14px;
     font-weight: 700;
     text-decoration: none;
     transition: .2s;
}
 .btn-primary {
     background: #ff6b1a;
     color: white;
}
 .btn-secondary {
     background: white;
     color: #5b21b6;
     border: 2px solid #e5e7eb;
}
 .hero-benefits {
     display: flex;
     gap: 2rem;
     margin-top: 2rem;
}
 .benefit {
     display: flex;
     align-items: center;
     gap: .75rem;
     font-weight: 600;
     color: #374151;
}
 .benefit-icon {
     width: 42px;
     height: 42px;
     border: 1px solid #d8b4fe;
     border-radius: 50%;
     display: flex;
     justify-content: center;
     align-items: center;
     color: #7c3aed;
}
 .hero-footer {
     display: flex;
     flex-wrap: wrap;
     gap: 2rem;
     margin-top: 10px;
     margin-bottom:20px;
     font-size: .95rem;
     color: #6b7280;
}
 .footer-item {
     display: flex;
     align-items: center;
     gap: .6rem;
}
 .hero {
     position: relative;
     overflow: hidden;
     background: white;
}
 .hero-bg {
     position: absolute;
     right: -250px;
     bottom: -250px;
     width: 750px;
     height: 750px;
     background: linear-gradient(135deg, #7c3aed, #4f46e5, #e54873);
     transform: rotate(-38deg);
     z-index: 0;
}
 .section-header {
     text-align: center;
     margin-bottom: 70px;
}
 .section-header h2 {
     font-size: 42px;
     font-weight: 700;
     color: #14213d;
     margin-bottom: 12px;
}
 .section-header p {
     color: #6b7280;
     font-size: 18px;
}
 .workflow-grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 45px;
}
 .step {
     position: relative;
     text-align: center;
}
 .step-icon {
     width: 110px;
     height: 110px;
     margin: auto auto 40px;
     border-radius: 50%;
     background: white;
     box-shadow: 0 8px 35px rgba(16, 24, 40, .08);
     display: flex;
     justify-content: center;
     align-items: center;
     color: #6C3EF4;
     font-size: 42px;
}
 .step-number {
     display: block;
     margin-bottom: 12px;
     font-size: 32px;
     font-weight: 700;
     color: #6C3EF4;
}
 .step h3 {
     font-size: 24px;
     color: #17223B;
     margin-bottom: 16px;
}
 .step p {
     font-size: 17px;
     color: #667085;
    
}
 .step-arrow {
     position: absolute;
     top: 54px;
     right: -58px;
     width: 90px;
     border-top: 3px dashed #ff7a21;
}
 .step-arrow::after {
     content: "➜";
     position: absolute;
     right: -10px;
     top: -16px;
     color: #ff7a21;
     font-size: 20px;
}
 .step:last-child .step-arrow {
     display: none;
}
 .benefits {
     background: #111936;
}
 .benefits-grid {
     display: grid;
     grid-template-columns: 1.2fr 1fr 1fr;
     gap: 70px;
     align-items: start;
}
 .benefits-intro h2 {
     color: #fff;
     font-size: 34px;
     font-weight: 700;
     margin-bottom: 30px;
}
 .benefits-intro span {
     color: #ff6b1a;
}
 .benefits-intro p {
     color: #C5C9DA;
     font-size: 18px;
     margin-bottom: 40px;
}
 .benefits-link {
     color: #ff6b1a;
     font-weight: 700;
     text-decoration: none;
     display: inline-flex;
     gap: 10px;
     align-items: center;
}
 .benefit-item {
     display: flex;
     gap: 22px;
     margin-bottom: 0px;
    /* 55px */
}
 .icon {
     width: 58px;
     height: 58px;
     display: flex;
     justify-content: center;
     align-items: center;
     color: #ff6b1a;
     font-size: 34px;
     flex-shrink: 0;
}
 .benefit-item h3 {
     color: white;
     font-size: 24px;
     margin-bottom: 14px;
}
 .benefit-item p {
     color: #B7BDD0;
     font-size: 17px;
}
 .benefits-column {
     border-left: 1px solid rgba(255, 255, 255, .08);
     padding-left: 15px;
}
 .platforms {
     padding: 90px 0;
     padding-bottom: 0px;
     background: #fff;
     text-align: center;
}
 .platforms h2 {
     font-size: 42px;
     color: #17223B;
     margin-bottom: 12px;
}
 .platforms .section-heading p {
     color: #6B7280;
     font-size: 18px;
     margin-bottom: 55px;
}
 .platform-logos {
     display: flex;
     justify-content: center;
     align-items: center;
     flex-wrap: wrap;
     gap: 30px;
}
 .platform-logos img {
    /*height:34px;
     */
     width: 100px;
     transition: .25s;
}
 .platform-logos img:hover {
     transform: translateY(-3px);
     opacity: .9;
}
 .divider {
     width: 1px;
     height: 28px;
     background: #E5E7EB;
}
 .custom-export {
     margin-top: 35px;
     color: #6C4CF5;
     font-weight: 600;
     font-size: 17px;
}
 .results {
     background: #FBF8F8;
}
 .results-grid {
     padding: 50px;
     display: grid;
     grid-template-columns: 3fr 1fr 1fr 1fr;
     align-items: center;
}
 .stat {
     border-left: 1px solid #E8E8EE;
     text-align: center;
}
 .testimonial {
     padding-right: 30px;
}
 .testimonial h2 {
     font-size: 30px;
     color: #16233D;
     margin-bottom: 10px;
     font-weight: bold;
}
 .intro {
     color: #667085;
     margin-bottom: 28px;
}
.results-grid blockquote {
     color: #17223B;
     font-style: italic;
     margin: 0 0 20px;
     border: none;

}
 .author {
     color: #667085;
     font-size: 15px;
}
 .stat-icon {
     color: #6C4CF5;
     font-size: 48px;
     margin-bottom: 28px;
}
 .stat-number {
     font-size: 30px;
     font-weight: 700;
     color: #17223B;
     margin-bottom: 18px;
}
 .stat-title {
     color: #667085;
     font-size: 18px;

}
 .cta {
     padding: 70px 0;
     padding-top: 30px;
     padding-bottom: 30px;
     background: linear-gradient(90deg, #4A2CF5 0%, #6935F9 25%, #8E3FC9 50%, #C94D86 75%, #FF6B1A 100%);
}
 .cta-grid {
     display: grid;
     grid-template-columns: 2fr auto 2fr;
     gap: 120px;
     align-items: center;
     padding-left: 120px;
     padding-right: 120px;
}
 .cta-content h2 {
     color: white;
     font-weight: bold;
     font-size: 30px;
     margin-bottom: 18px;
}
 .cta-content p {
     color: rgba(255, 255, 255, .85);
     font-size: 18px;
     max-width: 420px;
}
 .cta-button {
     text-align: center;
}
 .btn-white {
     display: inline-flex;
     align-items: center;
     gap: 14px;
     padding: 22px 46px;
     background: white;
     color: #17223B;
     text-decoration: none;
     font-weight: 700;
     border-radius: 12px;
     font-size: 20px;
     transition: .25s;
}
 .btn-white:hover {
     transform: translateY(-3px);
     box-shadow: 0 20px 40px rgba(0, 0, 0, .15);
}
 .cta-button span {
     display: block;
     margin-top: 18px;
     color: rgba(255, 255, 255, .9);
     font-size: 15px;
}
 .cta-features {
     display: flex;
     flex-direction: column;
     gap: 18px;
}
 .feature {
     display: flex;
     align-items: center;
     gap: 14px;
     color: white;
     font-size: 18px;
}
 .feature i {
     color: white;
     font-size: 20px;
}
 footer {
     background: #111936;
     padding: 70px 60px 30px 60px;
}
 .footer-grid {
     display: grid;
     grid-template-columns: 1.4fr .8fr .8fr 1.3fr;
     gap: 70px;
}
 .footer-brand img {
     width: 180px;
     margin-bottom: 22px;
}
 .footer-brand p {
     color: #BFC5D5;
     font-size: 16px;
     max-width: 260px;
}
 .footer-column h4 {
     color: white;
     font-size: 13px;
     letter-spacing: 1.5px;
     margin-bottom: 22px;
}
 .footer-column ul {
     list-style: none;
     padding: 0;
     margin: 0;
}
 .footer-column li {
     margin-bottom: 14px;
}
 .footer-column a {
     color: #BFC5D5;
     text-decoration: none;
     transition: .2s;
}
 .footer-column a:hover {
     color: white;
}
 .footer-newsletter p {
     color: #BFC5D5;
     margin-bottom: 18px;
}
 .footer-newsletter form {
     display: flex;
     overflow: hidden;
     border-radius: 8px;
     background: white;
}
 .footer-newsletter input {
     flex: 1;
     border: none;
     padding: 16px;
     font-size: 15px;
     outline: none;
}
 .footer-newsletter button {
     width: 58px;
     border: none;
     background: #FF6B1A;
     color: white;
     cursor: pointer;
     font-size: 18px;
}
 .footer-bottom {
     margin-top: 60px;
     padding-top: 30px;
     text-align: center;
     color: #9AA4BC;
     font-size: 14px;
}



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

@media (max-width: 991px) {

    /* ---------- HERO ---------- */
    .testimonial h2{margin-bottom:30px}
    .hero {
        padding: 40px 20px;
    }

    .hero .gb-grid-wrapper {
        display: flex !important;
        flex-direction: column;
    }

    .hero-title {
        font-size: 2.8rem;
        line-height: 1.1;
        margin-bottom: 20px;
        text-align: center;
    }

    .hero-description {
        font-size: 18px;
        text-align: center;
        max-width: 100%;
    }

    .hero-buttons {
        flex-direction: column;
        gap: 15px;
    }

    .btn,
    .btn-white {
        width: 100%;
        justify-content: center;
    }

    .hero-benefits {
        justify-content: center;
        flex-wrap: wrap;
        gap: 20px;
    }

    .hero-footer {
        justify-content: center;
        text-align: center;
        gap: 12px;
    }

    .hero-bg {
        width: 500px;
        height: 500px;
        right: -250px;
        bottom: -250px;
    }

    /* ---------- SECTION HEADINGS ---------- */

    .section-header {
        margin-bottom: 40px;
    }

    .section-header h2,
    .platforms h2 {
        font-size: 2rem;
        line-height: 1.2;
    }

    .section-header p,
    .platforms .section-heading p {
        font-size: 16px;
    }

    /* ---------- WORKFLOW ---------- */

    .workflow-grid {
        grid-template-columns: 1fr;
        gap: 50px;
    }

    .step-arrow {
        display: none;
    }

    .step-icon {
        width: 90px;
        height: 90px;
        font-size: 34px;
        margin-bottom: 25px;
    }

    .step h3 {
        font-size: 22px;
    }

    .step p {
        font-size: 16px;
    }

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

    .benefits-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .benefits-column {
        border: none;
        padding-left: 0;
    }

    .benefits-intro {
        text-align: center;
    }

    .benefits-intro h2 {
        font-size: 2rem;
    }

    .benefit-item {
        margin-bottom: 35px;
    }

    /* ---------- PLATFORMS ---------- */

    .platform-logos {
        gap: 20px;
    }

    .platform-logos img {
        width: 90px;
    }

    .divider {
        display: none;
    }

    /* ---------- RESULTS ---------- */

    .results-grid {
        grid-template-columns: 1fr;
        padding: 40px 25px;
        gap: 40px;
    }

    .testimonial {
        padding-right: 0;
        text-align: center;
    }

    .testimonial h2 {
        font-size: 2rem;
    }

    .stat {
        border-left: none;
        padding-top: 35px;
    }

    .stat:first-of-type {
        border-top: none;
        padding-top: 0;
    }

    /* ---------- CTA ---------- */

    .cta-grid {
        grid-template-columns: 1fr;
        gap: 35px;
        padding: 0 25px;
        text-align: center;
    }

    .cta-content p {
        max-width: 100%;
    }

    .cta-features {
        align-items: center;
    }

    /* ---------- FOOTER ---------- */

    footer {
        padding: 50px 25px;
    }

    .footer-grid {
        grid-template-columns: 1fr;
        gap: 40px;
        text-align: center;
    }

    .footer-brand p {
        margin: auto;
    }

    .footer-newsletter form {
        max-width: 400px;
        margin: auto;
    }

}


/* =====================================================
   SMALL PHONES
===================================================== */

@media (max-width: 576px) {

    .cta-grid{padding-left:50px;padding-right:50px}
    .platforms{padding:0}
    .stat{padding-top:10px}
    .stat-number{margin-bottom:10px}
    .stat-icon{margin-bottom:0px}
    .hero-title {
        font-size: 2.2rem;
    }

    .hero-description,
    .intro,
    .cta-content p {
        font-size: 16px;
    }

    .btn,
    .btn-white {
        padding: 16px 24px;
        font-size: 17px;
    }

    .hero-benefits {
        flex-direction: column;
        align-items: center;
    }

    .hero-footer {
        flex-direction: column;
        gap: 10px;
    }

    .benefits-intro h2,
    .section-header h2,
    .platforms h2,
    .testimonial h2,
    .cta-content h2 {
        font-size: 1.8rem;
    }

    .platform-logos img {
        width: 75px;
    }

    .stat-number {
        font-size: 2rem;
    }

}