header{
    z-index: 55;
}

.bitrix-banner{
    min-height: 900px;
    max-width: unset;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-right: calc(var(--wp--style--root--padding-right) * -1) !important;
    margin-left: calc(var(--wp--style--root--padding-left) * -1) !important;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.bitrix-banner h1{
    margin-bottom: 5px;
}
.bitrix-banner h1 mark{
    position: relative;
}
.bitrix-banner h1 mark:before{
    content: '';
    width: 90px;
    height: 54px;
    background-image: url(https://buzztree.com/wp-content/uploads/2026/03/time-whatsapp-icon.svg);
    background-size: contain;
    background-repeat: no-repeat;
    display: inline-block;
    margin-right: 15px;
    top: 14px;
    position: relative;
}
.bitrix-banner h1 mark:after{
    content: '';
    position: absolute;
    width: calc(100% - 10px);
    height: 15px;
    background-image: url(https://buzztree.com/wp-content/uploads/2026/03/hero-head-line.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right center;
    right: -6px;
    bottom: -2px;
}
.bitrix-banner .green-text{
    max-width: 420px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 6px;
}
.bitrix-banner .hero-diff-box{
    display: flex;
    align-items: center;
    column-gap: 10px;
}
.bitrix-banner .hero-diff-box p{
    margin: 0;
    padding: 8px 10px;
    font-weight: 500;
}
.bitrix-banner .hero-diff-box p:nth-of-type(1){
    background: rgba(247,134,51,0.1);
    color: #F68632;
}
.bitrix-banner .hero-diff-box p:nth-of-type(2){
    background: rgba(177,93,189,0.1);
    color: #B15DBD;
}
.bitrix-banner .hero-diff-box p:nth-of-type(3){
    background: #E7FFC9;
    color: #70C700;
}
.bitrix-banner .hero-mobile-icon{
    display: none;
}

.salesforce-banner{
    min-height: 900px;
    max-width: unset;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-right: calc(var(--wp--style--root--padding-right) * -1) !important;
    margin-left: calc(var(--wp--style--root--padding-left) * -1) !important;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.salesforce-banner h1{
    margin-bottom: 5px;
}
.salesforce-banner h1 mark{
    position: relative;
}
.salesforce-banner h1 mark:before{
    content: '';
    width: 90px;
    height: 54px;
    background-image: url(https://buzztree.com/wp-content/uploads/2026/03/sf-whatsapp.svg);
    background-size: contain;
    background-repeat: no-repeat;
    display: inline-block;
    margin-right: 15px;
    top: 14px;
    position: relative;
}
.salesforce-banner h1 mark:after{
    content: '';
    position: absolute;
    width: calc(100% - 10px);
    height: 15px;
    background-image: url(https://buzztree.com/wp-content/uploads/2026/03/hero-head-line.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right center;
    right: -6px;
    bottom: -2px;
}
.salesforce-banner .green-text{
    max-width: 420px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 6px;
}
.salesforce-banner .hero-diff-box{
    display: flex;
    align-items: center;
    column-gap: 10px;
}
.salesforce-banner .hero-diff-box p{
    margin: 0;
    padding: 8px 10px;
    font-weight: 500;
}
.salesforce-banner .hero-diff-box p:nth-of-type(1){
    background: rgba(247,134,51,0.1);
    color: #F68632;
}
.salesforce-banner .hero-diff-box p:nth-of-type(2){
    background: rgba(177,93,189,0.1);
    color: #B15DBD;
}
.salesforce-banner .hero-diff-box p:nth-of-type(3){
    background: #E7FFC9;
    color: #70C700;
}
.salesforce-banner .hero-mobile-icon{
    display: none;
}

.list-design{
    padding: 0;
    margin: 0;
    list-style: none;
}
.list-design li{
    position: relative;
    padding-left: 32px;
    color: #71778A;
    margin-top: 0 !important;
    margin-bottom: 10px !important;
}
.list-design li:last-child{
    margin-bottom: 0 !important;
}
.list-design li:before{
    content: '';
    position: absolute;
    width: 8px;
    height: 8px;
    left: 6px;
    top: 10px;
    border-radius: 20px;
    box-shadow: 0 0 0 5px rgba(112,199,0,0.3);
    background: #70C700;
}
.revops-slider-row h3{
    margin-bottom: 25px !important;
}
.revops-slider-row h3,
.revops-slider-row .list-design{
    max-width: 400px;
}

.revops-slider-row .slick-dots{
    right: calc(100% + 50px);
    display: flex;
    column-gap: 3px;
}
.revops-slider-row .slick-dots li{
    margin: 0;
    opacity: 1;
    width: 12px;
    height: 12px;
}
.revops-slider-row .slick-dots li button:before{
    display: none;
}
.revops-slider-row .slick-dots li button{
    width: 12px;
    height: 12px;
    border-radius: 12px;
    background: #E6E8E1 !important;
    opacity: 1;
    position: relative;
}
.revops-slider-row .slick-dots li.slick-active,
.revops-slider-row .slick-dots li.slick-active button{
    width: 35px;
}
.revops-slider-row .slick-dots li.slick-active button:after{
    content: '';
    width: 19px;
    height: 100%;
    left: 0;
    top: 0;
    background: #A1A494 !important;
    position: absolute;
    display: block !important;
    border-radius: 12px;
}
.better-connection-section > .wp-block-group:nth-of-type(1){
    position: relative;
}
.better-connection-section > .wp-block-group:nth-of-type(1):before,
.better-connection-section > .wp-block-group:nth-of-type(1):after{
    content: '';
    position: absolute;
    width: 12px;
    height: 12px;
    border-radius: 15px;
    border: 4px solid #70C700;
}
.better-connection-section > .wp-block-group:nth-of-type(1):before{
    left: -10%;
    top: -20px;
}
.better-connection-section > .wp-block-group:nth-of-type(1):after{
    right: 0%;
    bottom: 20px;
}
.better-connection-section .wp-block-cb-carousel{
    margin-top: 30px !important;
}
.better-connection-section .wp-block-cb-carousel{
    margin-top: 30px !important;
}
.better-connection-section #connectSlide .slick-slide:before{
    display: none;
}
.better-connection-section .slick-slide img{
    margin-bottom: 30px;
}
.better-connection-section .highlight-heading{
    position: relative;
}
.better-connection-section .highlight-heading:before{
    content: '';
    position: absolute;
    left: 30px;
    top: 30px;
    width: 160px;
    height: 5px;
    background-image: url(https://buzztree.com/wp-content/uploads/2026/03/connection-hed-line.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left;
}
.better-connection-section mark{
    background: rgba(247,134,51,0.2) !important;
    padding: 0px 5px !important;
}
.benefits-cta{
    position: relative;
}
.benefits-cta:before,
.benefits-cta:after{
    content: '';
    position: absolute;
    width: 160px;
    height: 90px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left;
}
.benefits-cta:before{
    top: -45px;
    left: 10%;
    background-image: url(https://buzztree.com/wp-content/uploads/2026/03/cta-orange-shape.svg);
}
.benefits-cta:after{
    bottom: -45px;
    right: 10%;
    background-image: url(https://buzztree.com/wp-content/uploads/2026/03/cta-purple-shape.svg);
}

.integration-section .small-head{
    padding: 5px 10px !important;
    width: 136px;
    display: flex;
}
.integration-section .small-head img{
    width: 24px;
    height: 24px;
}
.integration-section .small-head .wp-block-media-text__content{
    padding-left: 5px !important;
    padding-right: 0 !important;
}
.integration-section .small-head .wp-block-media-text__content p{
    margin: 0 !important;
}
.integration-section .wp-block-cb-slide{
    padding-left: 15px;
    padding-right: 15px;
}
.integration-section .wp-block-cb-slide > .wp-block-group{
    border-radius: 10px;
    min-height: 400px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.integration-section .wp-block-cb-slide > .wp-block-group .wp-block-media-text{
    display: flex;
    margin-left: 0 !important;
}
.integration-section .wp-block-cb-slide > .wp-block-group .wp-block-media-text .wp-block-media-text__media{
    align-self: unset;
}
.integration-section .wp-block-cb-slide > .wp-block-group .wp-block-media-text img{
    border-radius: 10px;
    width: 48px;
    height: 48px;
    box-shadow: 0 20px 20px #EAE7DE;
}
.integration-section .wp-block-cb-slide > .wp-block-group .wp-block-media-text .wp-block-media-text__content{
    padding-left: 25px !important;
    padding-right: 0 !important;
}
.integration-section .wp-block-cb-slide > .wp-block-group .wp-block-media-text .wp-block-media-text__content h3{
    margin: 0;
}
.integration-section .wp-block-cb-slide > .wp-block-group .list-design li{
    font-size: 17px !important;
}
.integration-section .wp-block-cb-slide > .wp-block-group .wp-block-columns{
    gap: 10px !important;
    width: 100%;
}
.integration-section .wp-block-cb-slide > .wp-block-group .wp-block-columns .wp-block-column{
    flex-basis: unset !important;
}
.enterprise-section .wp-block-media-text__content p{
    max-width: 425px;
    text-wrap:unset !important;
}
.enterprise-section .securityChk{
    margin-top: 44px;
    padding: 43px 40px 33px !important;
}
.enterprise-section .securityChk .wp-block-media-text__content{
    align-self: unset;
}
.integration-heading {
    position: relative;
    max-width: 620px;
}
.integration-section {
    background-size: contain !important;
    background-repeat: no-repeat;
    background-position-y: 150px;
}
.integration-heading::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 246px;
    height: 14px;
    background-image: url("https://buzztree.com/wp-content/uploads/2026/03/integration-pattern.svg");
    background-repeat: no-repeat;
    background-size: contain;
}
.steps-column {
    flex-wrap: wrap !important;
    column-gap: 60px;
    row-gap: 70px;
    justify-content: center;
}
.step-info {
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    width: calc(33.33% - 40px);
    flex-basis: unset !important;
    flex-grow: unset !important;
    align-items: center;
}
.step-num {
    width: 34px;
    height: 34px;
    border: 1px solid #f78633;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.step-first-pattern,
.step-third-pattern {
    position: relative;
}
.step-first-pattern::after {
    content: '';
    position: absolute;
    top: 0;
    left: 130px;
    width: 178px;
    height: 27px;
    background-image: url("https://buzztree.com/wp-content/uploads/2026/03/step-arrow.svg");
    background-repeat: no-repeat;
    background-size: contain;
}
.step-third-pattern::after {
    content: '';
    position: absolute;
    top: 0;
    left: -118px;
    width: 178px;
    height: 27px;
    background-image: url("https://buzztree.com/wp-content/uploads/2026/03/step-arrow.svg");
    background-repeat: no-repeat;
    background-size: contain;
}
.bitrix-heading {
    max-width: 695px;
}
.bitrix-heading::after {
    width: 448px;
    height: 20px;
    background-image: url("https://buzztree.com/wp-content/uploads/2026/03/bitrix-case-pattern.svg");
    bottom: -12px;
}
.case-slide {
    min-height: 384px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box;
}
.real-world-slider .slick-arrow {
    width: 40px;
    height: 40px;
    top: unset;
    bottom: -90px;
    transform: unset;
}
.real-world-slider .slick-arrow::before {
    opacity: 0;
}
.real-world-slider .slick-arrow::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url("https://buzztree.com/wp-content/uploads/2026/03/next-slide-arrow.svg");
    background-size: contain;
    background-repeat: no-repeat;
}
.real-world-slider .slick-prev.slick-arrow::after {
    background-image: url("https://buzztree.com/wp-content/uploads/2026/03/prev-slide-arrow.svg");
}
.real-world-slider .slick-arrow:hover {
    opacity: 65%;
}
.real-world-slider .slick-arrow.slick-prev {
    left: calc(50% - 45px);
}
.real-world-slider .slick-arrow.slick-next {
    right: CALC(50% - 45px);
}
.real-world-slider .slick-slide > div {
    margin-bottom: 0px;
}
.faq-section {
    max-width: none;
    margin-left: -50px !important;
    margin-right: -50px !important;
    background-size: 950px !important;
    background-repeat: no-repeat;
    background-position: center 72px;
    background-size: contain !important;
}
.faq-heading {
    max-width: 402px;
    position: relative;
}
.faq-heading::after {
    content: '';
    position: absolute;
    bottom: -6px;
    left: 50%;
    transform: translateX(-50%);
    width: 213px;
    height: 10px;
    background-image: url("https://buzztree.com/wp-content/uploads/2026/03/faq-pattern.svg");
    background-repeat: no-repeat;
    background-size: contain;
}
.faq-listing .wp-block-accordion-heading__toggle {
    padding: 30px;
    min-height: 108px;
}
.faq-listing .wp-block-accordion-heading__toggle:hover .wp-block-accordion-heading__toggle-title {
    text-decoration: unset;
}
.faq-listing .wp-block-accordion-panel {
    padding: 0px 30px 30px 30px;
    margin-top: -22px;
}
.faq-listing .wp-block-accordion-heading__toggle-icon {
    width: 40px;
    height: 40px;
    background-color: #E7FFC9;
    border-radius: 50%;
    font-size: 30px;
    line-height: 30px;
    color: #70C700;
    font-weight: 400;
}
.wp-block-accordion-item.is-open>.wp-block-accordion-heading .wp-block-accordion-heading__toggle-icon {
    /* opacity: 0; */
    color: transparent;
}
.wp-block-accordion-item.is-open>.wp-block-accordion-heading .wp-block-accordion-heading__toggle-icon::after {
    content: "-";
    font-size: 30px;
    position: absolute;
    top: 50%;
    left: 50%;
    line-height: 30px;
    color: #70C700;
    font-weight: 400;
    transform: translate(-50%, -50%) rotate(-45deg);
}
.sticky-section .powered-channel-section:nth-of-type(1){
    position: sticky !important;
    top: 0px;
}
.sticky-section .powered-channel-section{
    background: #fff !important;
}

.sticky-section .powered-channel-section:nth-of-type(1) h2{
    position: relative;
    margin-bottom: 30px;
}
.sticky-section .powered-channel-section:nth-of-type(1) h2:before{
    content: '';
    background-image: url(https://buzztree.com/wp-content/uploads/2026/03/powered-channel-head-line.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 8px;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
    bottom: -10px;
    position: absolute;
}
.main-nav  ul li:last-child a:before{
    display: none;
}
.main-nav  ul{
    left: 0 !important;
}
.main-nav  ul li a span{
    color: #71778a !important;
    font-size: 14px !important;
    font-weight: 400 !important;
}


@media (max-width:1200px){
    .bitrix-banner{
        min-height: 750px;
    }
    .bitrix-banner h1 mark:after{
        height: 13px;
    }
    .bitrix-banner  > :where(:not(.alignleft):not(.alignright):not(.alignfull)){
        max-width: 620px;
    }
	.salesforce-banner{
        min-height: 750px;
    }
    .salesforce-banner h1 mark:after{
        height: 13px;
    }
    .salesforce-banner  > :where(:not(.alignleft):not(.alignright):not(.alignfull)){
        max-width: 620px;
    }
    .integration-section .wp-block-cb-slide > .wp-block-group .list-design li{
        font-size: 15px !important;
    }
    .integration-section .wp-block-cb-slide .list-design li{
        padding-left: 18px;
    }
    .integration-section .wp-block-cb-slide .list-design li:before{
        width: 6px;
        height: 6px;
        left: 3px;
        top: 8px;
        border-radius: 20px;
        box-shadow: 0 0 0 3px rgba(112, 199, 0, 0.3);
        background: #70C700;
    }
    .case-slide {
        min-height: 350px;
    }
    .integration-section {
        padding: 80px 20px 0px !important;
        background-position-y: 50px;
    }
    .world-bitrix-sec {
        padding-bottom: 150px !important;
    }
    .faq-listing .wp-block-accordion-heading__toggle {
        padding: 26px;
        min-height: 90px;
    }
    .faq-listing .wp-block-accordion-heading__toggle-icon {
        width: 35px;
        height: 35px;
        font-size: 25px;
        line-height: 25px;
    }
    .faq-heading {
        margin-bottom: 55px !important;
    }
    .faq-section {
        margin-left: -40px !important;
        margin-right: -40px !important;
    }
}
@media (max-width:1024px){
    .bitrix-banner{
        min-height: 640px;
    }
    .bitrix-banner h1 mark:after{
        height: 11px;
    }
    .bitrix-banner  > :where(:not(.alignleft):not(.alignright):not(.alignfull)){
        max-width: 550px;
    }
    .salesforce-banner{
        min-height: 640px;
    }
    .salesforce-banner h1 mark:after{
        height: 11px;
    }
    .salesforce-banner  > :where(:not(.alignleft):not(.alignright):not(.alignfull)){
        max-width: 575px;
    }

    .powered-channel-section{
        margin-top: 0 !important;
        padding: 60px 0px !important;
    }
    .powered-channel-section > .wp-block-group{
        margin-bottom: 60px !important;
    }

    .better-connection-section{
        padding: 60px 20px !important;
    }
    .better-connection-section .slick-slide img{
        margin-bottom: 15px;
    }
    .better-connection-section #connectSlide img{
        height: 140px !important;
    }
    .better-connection-section .highlight-heading:before{
        left: 18px;
        top: 26px;
    }
    .better-connection-section mark{
        white-space: nowrap;
    }
    .integration-section{
        padding: 70px 0 40px !important;
        margin-top: 0 !important;
    }
    .integration-section h2{
        margin: 18px auto 30px !important;
    }
    
    .integration-section .wp-block-cb-slide {
        padding-left: 8px;
        padding-right: 8px;
    }
    .enterprise-section{
        margin-top: 0 !important;
    }
    .faq-listing .wp-block-accordion-heading__toggle {
        padding: 20px;
        min-height: 80px;
        gap: 20px;
    }
    .integration-section {
        background-position-y: 20px;
    }
    .steps-column {
        column-gap: 50px;
        row-gap: 50px;
    }
    .world-bitrix-sec {
        padding-bottom: 140px !important;
        padding-top: 20px !important;
    }
    .faq-listing .wp-block-accordion-panel {
        padding: 0px 20px 20px 20px;
        margin-top: -12px;
    }
}
@media (max-width:782px){
    .revops-slider-row h3, 
    .revops-slider-row .list-design{
        max-width: 100%;
    }

    .better-connection-section > .wp-block-group:nth-of-type(1) p{
        margin-top: 25px !important;
    }
    .enterprise-section .securityChk{
        padding: 38px 20px 24px !important;
    }
    .enterprise-section .wp-block-columns{
        gap: 0 !important;
    }
    .enterprise-section .wp-block-column{
        padding: 0 !important;
    }
}  
@media (min-width:1100px){
    .integration-section .wp-block-cb-slide:nth-of-type(1),
    .integration-section .wp-block-cb-slide:nth-of-type(2){
        width: calc(30% - 29px) !important;
    }
    .integration-section .wp-block-cb-slide:nth-of-type(3){
        width: calc(44% - 80px) !important;
    }
} 
@media(max-width: 781px) {
    .wp-block-columns:not(.is-not-stacked-on-mobile)>.wp-block-column.step-info {
        flex-basis: unset !important;
    }
    .case-slide {
        min-height: 320px;
        padding: 20px !important;
    }
}
@media (max-width:767px){
    .better-connection-section .slick-slide img{
        margin-bottom: 25px;
    }
    .better-connection-section #connectSlide p:not(.cCounter){
        max-width: 90%;
    }
    .better-connection-section .slick-next:before, .better-connection-section .slick-prev:before{
        display: none !important;
    }
    .better-connection-section .slick-next, .better-connection-section .slick-prev{
        width: 40px;
        height: 40px;
        border-radius: 4px;
        left: calc(50% + 25px) !important;
        transform: translateX(-50%) !important;
        top: calc(100% + 40px) !important;
        background-image: url(https://buzztree.com/wp-content/uploads/2026/03/dark-green-arrow.svg) !important;
        background-size: contain !important;
        background-repeat: no-repeat !important;
        background-position: center !important;
    }
    .better-connection-section .slick-prev{
        margin-left: -50px;
        transform: translateX(-50%) scaleX(-1) !important;
    }
    .better-connection-section .slick-disabled{
        opacity: 0.3;
    }
    .better-connection-section #connectSlide img{
        height: 240px !important;
    }
    .conection-img{
        margin-top: 160px !important;
    }
    .benefits-cta{
        margin-top: 70px !important;
    }
    .benefits-cta:before, 
    .benefits-cta:after{
        width: 105px;
        height: 60px;
    }
    .benefits-cta:before{
        left: 20px;
        top: -30px;
    }
    .benefits-cta:after{
        right: 40px;
        bottom: -30px;
    }
    .better-connection-section .highlight-heading{
        font-size: 22px !important;
    }
    .integration-section .slick-list{
        padding-right: 12% !important;
    }
    .page-id-794 .entry-content.has-global-padding{
        padding-left: 20px;
        padding-right: 20px;
    }
    .enterprise-section{
        padding: 40px 0 70px !important;
    }
    .steps-column {
        column-gap: 30px;
        row-gap: 40px;
    }
    .step-first-pattern::after,
    .step-third-pattern::after {
        top: 5px;
        left: 105px;
        width: 120px;
        height: 20px;
    }
    .step-third-pattern::after {
        left: -75px;
    }
    .world-bitrix-sec {
        padding-top: 0px !important;
    }
    .faq-section {
        margin-left: -20px !important;
        margin-right: -20px !important;
    }
    .world-bitrix-sec {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }
    .better-connection-section,
    .bitrix-banner {
        margin-left: -20px !important;
        margin-right: -20px !important;
    }
	.salesforce-banner {
        margin-left: -20px !important;
        margin-right: -20px !important;
    }
    .real-world-slider .slick-list.draggable {
        padding-right: 12%;
    }
}
@media (max-width:600px){
    .bitrix-banner{
        background-image: url(https://buzztree.com/wp-content/uploads/2026/03/hero-bg-img-mobile-img.svg) !important;
        background-position: top center !important;
        margin-top: 0 !important;
        margin-top: 0 !important;
        padding: 80px 20px 40px !important;
    }
    .bitrix-banner h1{
        max-width: 270px !important;
    }
    .bitrix-banner h1 mark:before{
        display: none;
    }
    .bitrix-banner .green-text{
        margin-bottom: 0;
    }
    .bitrix-banner .hero-mobile-icon{
        display: inline-block;
    }
    .bitrix-banner .hero-mobile-icon img{
        height: 42px;
        object-fit: contain;
    }
    .bitrix-banner .wp-block-buttons{
        margin: 34px auto 5px !important ;
    }
    .bitrix-banner .hero-diff-box{
        column-gap: 5px;
        row-gap: 5px;
        flex-wrap: wrap;
        justify-content: center;
    }
    .bitrix-banner .hero-diff-box p{
        font-size: 12px !important;
        padding: 5px 6px;
        margin: 0 !important;
    }
    .salesforce-banner{
        background-image: url(https://buzztree.com/wp-content/uploads/2026/03/hero-bg-img-mobile-img.svg) !important;
        background-position: top center !important;
        margin-top: 0 !important;
        margin-top: 0 !important;
        padding: 80px 20px 40px !important;
    }
    .salesforce-banner h1{
        max-width: 270px !important;
    }
    .salesforce-banner h1 mark:before{
        display: none;
    }
    .salesforce-banner .green-text{
        margin-bottom: 0;
    }
    .salesforce-banner .hero-mobile-icon{
        display: inline-block;
    }
    .salesforce-banner .hero-mobile-icon img{
        height: 42px;
        object-fit: contain;
    }
    .salesforce-banner .wp-block-buttons{
        margin: 34px auto 5px !important ;
    }
    .salesforce-banner .hero-diff-box{
        column-gap: 5px;
        row-gap: 5px;
        flex-wrap: wrap;
        justify-content: center;
    }
    .salesforce-banner .hero-diff-box p{
        font-size: 12px !important;
        padding: 5px 6px;
        margin: 0 !important;
    }

    .powered-channel-section{
        margin-top: 0 !important;
        padding: 50px 0px 70px !important;
    }
    .revops-slider-row .slick-dots{
        right: 0;
        justify-content: center;
    }
    .revops-slider-row .slick-dots li{
        width: 10px;
        height: 10px;
    }
    .revops-slider-row .slick-dots li button{
        width: 10px;
        height: 10px;
    }
    .revops-slider-row .slick-dots li.slick-active,
    .revops-slider-row .slick-dots li.slick-active button{
        width: 22px;
    }
    .revops-slider-row .slick-dots li.slick-active button:after{
        width: 10px;
    }
    .powered-channel-section > .wp-block-group{
        margin-bottom: 25px !important;
    }
    .powered-channel-section .list-design li{
        margin-bottom: 7px !important;
    }
    .better-connection-section > .wp-block-group:nth-of-type(1):before, 
    .better-connection-section > .wp-block-group:nth-of-type(1):after{
        width: 8px;
        height: 8px;
    }
    .benefits-cta{
        background-image: url(https://buzztree.com/wp-content/uploads/2026/03/cta-banner-mobile-img.svg) !important;
        background-position: top center !important;
    }
    .light-freen-cta{
        background-image: url(https://buzztree.com/wp-content/uploads/2026/03/cta-green-banner-mobile-img.svg) !important;
        background-position: 80% 50% !important;
        padding-top: 120px !important;
        padding-top: 100px !important;
    }
    .light-freen-cta > *{
        max-width: 260px !important;
    }
    .benefits-cta h2{
        max-width: 210px !important;
    }
    .integration-section .wp-block-cb-slide > .wp-block-group{
        padding: 18px !important;
        min-height: 370px;
    }
    .integration-section .wp-block-cb-slide > .wp-block-group .wp-block-media-text .wp-block-media-text__content {
        padding-left: 15px !important;
    }
    .case-slide {
        min-height: 370px;
    }
    .step-section {
        background-image: url("https://buzztree.com/wp-content/uploads/2026/03/step-mobile-bg.svg") !important;
        background-position-x: center;
    }
    .steps-column {
        column-gap: 23px;
        row-gap: 60px;
    }
    .step-info {
        width: calc(50% - 30px);
        min-width: 156px;
    }
    .step-third-pattern::after {
        display: none;
    }
    .step-first-pattern::after, .step-third-pattern::after {
        width: 180px;
        height: 30px;
    }
    .step-first-pattern::after {
        top: -20px;
        left: calc(50% + 55%);
        transform: translateX(-50%);
    }
    .step-four-pattern::after {
        left: -15px;
    }
    .world-bitrix-sec {
        padding-top: 30px !important;
    }
    .faq-listing .wp-block-accordion-heading__toggle-icon {
        width: 30px;
        height: 30px;
        font-size: 22px;
        line-height: 22px;
    }
    .faq-listing .wp-block-accordion-heading__toggle {
        min-height: 70px;
    }
    .faq-heading {
        margin-bottom: 40px !important;
    }
    .step-info h3 {
        margin-bottom: 16px !important;
    }
    .bitrix-heading::after {
        width: 190px;
    }
    .real-world-slider .slick-arrow {
        bottom: -60px;
    }
    .world-bitrix-sec {
        padding-bottom: 100px !important;
    }
    .faq-section {
        padding: 50px 20px !important;
    }
    .real-world-slider .slick-arrow {
        width: 35px;
        height: 35px;
    }
    .real-world-slider .slick-arrow.slick-next {
        right: CALC(50% - 40px);
    }
    .real-world-slider .slick-arrow.slick-prev {
        left: calc(50% - 40px);
    }
    .sticky-section .powered-channel-section:nth-of-type(1) h2{
        margin-bottom: 15px;
    }
    .sticky-section .powered-channel-section:nth-of-type(1) h2:before{
        height: 4px;
        bottom: 27px;
        position: absolute;
    }

    #mob_header .mobile-nav .has-child{
        display: flex !important;
        align-items: center !important;
        flex-wrap: wrap;
        justify-content: center;
    }
    #mob_header .mobile-nav .has-child ul{
                width: 100%;
        background: transparent !important;
        border: unset !important;
        display: block !important;
        height: unset;
        opacity: 1;
        visibility: visible;
    }
    #mob_header .mobile-nav .has-child .wp-block-navigation__submenu-icon{
        margin-top: -3px;
        display: none;
    }

    #mob_header .mobile-nav .has-child ul{
        position: unset !important;
    }
    #mob_header .mobile-nav .has-child li{
        margin-top: 10px !important;
    }
    #mob_header .mobile-nav .has-child ul li a:before{
        display: none;
    }
    #mob_header .mobile-nav .has-child ul li a{
        justify-content: center;
    }
    #mob_header .mobile-nav .has-child ul li a span{
        color: #71778a !important;
        font-size: 14px !important;
        font-weight: 400 !important;
    }
}


@media(max-width: 500px) {
    .step-first-pattern::after, .step-third-pattern::after {
        width: 170px;
        height: 28px;
    }
    .step-first-pattern::after {
        top: -30px;
    }
    .step-first-pattern::after {
        left: calc(50% + 59%);
    }
    .step-four-pattern::after {
        left: -18px;
    }
    .page-id-794 .entry-content{
        overflow: unset !important;
    }
    .better-connection-section{
        overflow: hidden;
    }
}

@media (max-width:380px){
    .bitrix-banner .hero-diff-box p{
        font-size: 11px !important;
    }
	.salesforce-banner .hero-diff-box p{
        font-size: 11px !important;
    }
}

/* ================================================================
   BuzzTree User Guide — block styling
   Paste this into: WordPress Admin → Appearance → Customize →
   Additional CSS  (or your theme/child-theme stylesheet).
   Works with the blocks in buzztree-gutenberg-blocks.txt.
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

.buzztree-guide{
  --bt-green:#70C700;
  --bt-green-press:#4F8E00;
  --bt-green-hover:#5FAE00;
  --bt-wash-green:#E7FFC9;
  --bt-border-green:#BADF8C;
  --bt-wash-cream:#FEF3EB;
  --bt-border-peach:#FFD5B7;
  --bt-orange:#F78633;
  --bt-heading:#171717;
  --bt-strong:#2B2B2B;
  --bt-body:#444;
  --bt-muted:#71778A;
  --bt-border:#E4E6EC;
  --bt-card-shadow:0 6px 20px rgba(122,125,132,.16);
}

/* Everything is scoped under .buzztree-guide (the Group block that wraps
   the guide), so these rules affect ONLY the guide page — nothing else. */
.buzztree-guide{
  font-family:'Poppins',system-ui,sans-serif;
  color:var(--bt-body);
  font-size:16px;
  line-height:1.65;
}
.buzztree-guide a{ color:var(--bt-green-press); text-decoration:none; }
.buzztree-guide a:hover{ color:var(--bt-green-hover); }
.buzztree-guide strong{ color:var(--bt-strong); font-weight:600; }

/* ---------- HERO ---------- */
.bt-hero{
  background:var(--bt-wash-green);
  border:1px solid var(--bt-border-green);
  border-radius:20px;
  padding:56px 32px;
  text-align:center;
  margin-bottom:48px;
}
.bt-eyebrow{
  display:inline-block;
  margin:0 0 14px;
  padding:6px 16px;
  background:#fff;
  border:1px solid var(--bt-border-green);
  border-radius:999px;
  font-size:12px;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--bt-green-press);
}
.bt-h1{
  margin:0 0 12px;
  font-weight:600;
  font-size:46px;
  line-height:1.1;
  letter-spacing:-.02em;
  color:var(--bt-heading);
}
.bt-subtitle{
  margin:0 0 14px;
  font-weight:500;
  font-size:20px;
  color:var(--bt-green-press);
}
.bt-subtitle strong{ color:var(--bt-green-press); }
.bt-lede{
  max-width:640px;
  margin:0 auto;
  font-size:17px;
  color:var(--bt-body);
}

/* ---------- HEADINGS ---------- */
.bt-h2{
  margin:8px 0 18px;
  padding-left:16px;
  border-left:5px solid var(--bt-green);
  font-weight:600;
  font-size:34px;
  line-height:1.15;
  letter-spacing:-.02em;
  color:var(--bt-heading);
}
.bt-h3{
  margin:44px 0 16px;
  padding-bottom:12px;
  border-bottom:1px solid var(--bt-border);
  font-weight:600;
  font-size:24px;
  color:var(--bt-strong);
}
.bt-h4{
  margin:28px 0 10px;
  font-weight:600;
  font-size:18px;
  color:var(--bt-strong);
}

/* ---------- LISTS ---------- */
.bt-steps,
.bt-list{ margin:0 0 4px; }
.bt-steps li,
.bt-list li{ margin:0 0 9px; padding-left:6px; line-height:1.6; }
.bt-steps{ counter-reset:none; }
.bt-steps li::marker{ color:var(--bt-green-press); font-weight:600; }
.bt-list{ list-style:none; padding-left:22px; }
.bt-list li{ position:relative; }
.bt-list li::before{
  content:"";
  position:absolute;
  left:-16px; top:.7em;
  width:7px; height:7px;
  border-radius:50%;
  background:var(--bt-green);
}

/* ---------- IMAGES ---------- */
.bt-figure img{
  border-radius:14px;
  border:1px solid var(--bt-border);
  display:block;
  width:100%;
  height:auto;
}
.bt-figure{ margin:24px 0; }
.bt-gallery{ margin:22px 0; }
.bt-gallery img{ border-radius:14px; border:1px solid var(--bt-border); }

/* ---------- CALLOUTS (Quote blocks) ---------- */
.bt-callout{
  margin:18px 0;
  padding:16px 20px;
  border-radius:12px;
  border-left-width:1px;
  quotes:none;
}
.bt-callout p{ margin:0; font-size:15px; line-height:1.6; color:var(--bt-body); }
.bt-callout__label{
  display:inline-block;
  margin-right:6px;
  font-weight:600;
}
.bt-callout--note{
  background:var(--bt-wash-green);
  border:1px solid var(--bt-border-green);
}
.bt-callout--note .bt-callout__label{ color:var(--bt-green-press); }
.bt-callout--prereq{
  background:var(--bt-wash-green);
  border:1px solid var(--bt-border-green);
}
.bt-callout--prereq .bt-callout__label{ color:var(--bt-green-press); }
.bt-callout--important{
  background:var(--bt-wash-cream);
  border:1px solid var(--bt-border-peach);
}
.bt-callout--important .bt-callout__label{ color:var(--bt-orange); }

/* ---------- TABLES ---------- */
.bt-table{ margin:20px 0; }
.bt-table table{
  border-collapse:separate;
  border-spacing:0;
  width:100%;
  border:1px solid var(--bt-border);
  border-radius:14px;
  overflow:hidden;
  box-shadow:var(--bt-card-shadow);
}
.bt-table thead th{
  background:#F6F8F1;
  text-align:left;
  font-weight:600;
  font-size:14px;
  color:var(--bt-strong);
  padding:14px 18px;
  border-bottom:1px solid var(--bt-border);
}
.bt-table tbody td{
  padding:14px 18px;
  font-size:15px;
  vertical-align:top;
  border-bottom:1px solid var(--bt-border);
}
.bt-table tbody tr:last-child td{ border-bottom:none; }
.bt-table tbody td:first-child{
  font-weight:600;
  color:var(--bt-green-press);
  white-space:nowrap;
}

/* ---------- SEPARATOR ---------- */
.bt-sep{
  max-width:none;
  margin:52px 0;
  border:none;
  border-top:1px solid var(--bt-border);
}

/* ---------- CTA ---------- */
.bt-cta{
  margin-top:44px;
  padding:28px;
  background:var(--bt-wash-green);
  border:1px solid var(--bt-border-green);
  border-radius:20px;
  text-align:center;
}
.bt-cta__title{
  margin:0 0 8px;
  padding:0;
  border:none;
  font-weight:600;
  font-size:20px;
  color:var(--bt-heading);
}
.bt-cta p{ margin:0; }

/* ---------- RESPONSIVE ---------- */
@media (max-width:600px){
  .bt-h1{ font-size:34px; }
  .bt-h2{ font-size:27px; }
  .bt-hero{ padding:40px 20px; }
  .bt-table tbody td:first-child{ white-space:normal; }
}
/* ============================================================
   BuzzTree — Pricing page styles  (SCOPED)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

/* ---- shared section shell ------------------------------------ */
.bt-pricing-page .bt-section{ padding:64px 32px; }
.bt-pricing-page .bt-section > .wp-block-group__inner-container,
.bt-pricing-page .bt-section > *{ max-width:1100px; margin-left:auto; margin-right:auto; }
.bt-pricing-page .bt-wash-green{ background:#E7FFC9; }
.bt-pricing-page .bt-wash-peach{ background:#FEF3EB; }

/* full-bleed fallback: make wash sections span the viewport even if the
   theme has no .alignfull rule of its own */
.bt-pricing-page .alignfull{ margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); max-width:100vw; width:auto; }
.bt-pricing-page .bt-pricing *,
.bt-pricing-page .bt-hero *,
.bt-pricing-page .bt-compare *,
.bt-pricing-page .bt-faq *{ box-sizing:border-box; }

/* ---- HERO (native Group + Heading + Paragraph) --------------- */
.bt-pricing-page .bt-hero{ text-align:center; padding:80px 32px 64px; }
.bt-pricing-page .bt-hero > *{ max-width:760px; margin-left:auto; margin-right:auto; }
.bt-pricing-page .bt-hero .bt-hero-title{ font-family:'Poppins',sans-serif; font-weight:600; font-size:60px; line-height:1.1; letter-spacing:-.02em; color:#000; margin:0 auto; }
.bt-pricing-page .bt-hero .bt-hero-sub{ font-family:'Poppins',sans-serif; font-weight:600; font-size:34px; line-height:1.2; letter-spacing:-.02em; color:#000; margin:18px auto 0; }
.bt-pricing-page .bt-hero .bt-hero-lede{ font-family:'Poppins',sans-serif; font-weight:400; font-size:17px; line-height:1.6; color:#71778A; margin:18px auto 0; }

/* ---- PRICING CARDS (Custom HTML block) ----------------------- */
.bt-pricing-page .bt-pricing{ font-family:'Poppins',sans-serif; padding:64px 32px 88px; }
.bt-pricing-page .bt-pricing .bt-cards{
  max-width:1100px; margin:0 auto;
  display:grid; grid-template-columns:repeat(2,minmax(320px,1fr));
  gap:32px; align-items:stretch;
}
.bt-pricing-page .bt-billing-input{ position:absolute; opacity:0; pointer-events:none; }

.bt-pricing-page .bt-card{ position:relative; border-radius:24px; padding:40px 36px; display:flex; flex-direction:column; gap:20px; }
.bt-pricing-page .bt-card--light{ background:#fff; border:1px solid #BADF8C; box-shadow:0 18px 40px rgba(112,199,0,.14); }
.bt-pricing-page .bt-card--dark{ background:#171717; box-shadow:0 18px 40px rgba(23,23,23,.18); }

.bt-pricing-page .bt-badge{ position:absolute; top:24px; right:28px; display:inline-flex; align-items:center; height:22px; padding:0 10px; font-weight:600; font-size:12px; border-radius:9999px; }
.bt-pricing-page .bt-badge--green{ background:#70C700; color:#fff; }
.bt-pricing-page .bt-badge--orange{ background:#F78633; color:#fff; }

.bt-pricing-page .bt-logo{ height:26px; width:auto; display:block; }
.bt-pricing-page .bt-plan-name{ margin:0; font-weight:600; font-size:23px; line-height:1.25; }
.bt-pricing-page .bt-card--light .bt-plan-name{ color:#171717; }
.bt-pricing-page .bt-card--dark .bt-plan-name{ color:#fff; }
.bt-pricing-page .bt-plan-desc{ margin:6px 0 0; font-size:15px; }
.bt-pricing-page .bt-card--light .bt-plan-desc{ color:#71778A; }
.bt-pricing-page .bt-card--dark .bt-plan-desc{ color:#BADF8C; }

/* segmented monthly / yearly control (Bitrix card only) */
.bt-pricing-page .bt-toggle{ align-self:flex-start; display:inline-flex; align-items:center; gap:4px; background:#F3FCE8; border:1px solid #BADF8C; border-radius:9999px; padding:4px; }
.bt-pricing-page .bt-seg{ cursor:pointer; font-weight:600; font-size:13px; padding:6px 20px; border-radius:9999px; color:#71778A; transition:all .2s ease; user-select:none; }
.bt-pricing-page #bt-monthly:checked ~ .bt-cards .bt-seg--monthly,
.bt-pricing-page #bt-yearly:checked  ~ .bt-cards .bt-seg--yearly{ background:#70C700; color:#fff; }

/* price + note swap driven purely by the radio state */
.bt-pricing-page .bt-price{ display:flex; align-items:flex-end; gap:8px; min-height:58px; }
.bt-pricing-page .bt-amt{ font-weight:600; font-size:52px; line-height:1; color:#171717; }
.bt-pricing-page .bt-per{ font-size:15px; color:#71778A; padding-bottom:8px; }
.bt-pricing-page .bt-note{ margin:-8px 0 0; font-size:14px; min-height:20px; color:#5FA800; }
.bt-pricing-page #bt-monthly:checked ~ .bt-cards [data-yearly]{ display:none; }
.bt-pricing-page #bt-yearly:checked  ~ .bt-cards [data-monthly]{ display:none; }

/* Salesforce fixed price block */
.bt-pricing-page .bt-price--dark .bt-amt{ color:#fff; }
.bt-pricing-page .bt-price-lead{ font-size:13px; color:#979797; line-height:1; }
.bt-pricing-page .bt-price--dark .bt-per{ color:#979797; }
.bt-pricing-page .bt-note--orange{ color:#F78633; }

/* CTA buttons */
.bt-pricing-page .bt-btn{ display:flex; width:100%; align-items:center; justify-content:center; gap:12px; font-family:'Poppins',sans-serif; font-weight:600; font-size:18px; line-height:1.2; padding:15px 32px; border-radius:9999px; border:1.5px solid transparent; cursor:pointer; text-decoration:none; transition:background .2s ease, transform .12s ease; }
.bt-pricing-page .bt-btn img{ width:20px; height:20px; }
.bt-pricing-page .bt-btn--primary{ background:#70C700; color:#fff; box-shadow:0 10px 24px rgba(112,199,0,.35); }
.bt-pricing-page .bt-btn--primary:hover{ background:#5FA800; color:#fff; }
.bt-pricing-page .bt-btn--ondark{ background:#fff; color:#171717; }
.bt-pricing-page .bt-btn--ondark:hover{ background:#EDEDED; color:#171717; }
.bt-pricing-page .bt-btn:active{ transform:scale(.98); }

.bt-pricing-page .bt-divider{ height:1px; margin:4px 0; }
.bt-pricing-page .bt-card--light .bt-divider{ background:#E7FFC9; }
.bt-pricing-page .bt-card--dark .bt-divider{ background:#3B364A; }
.bt-pricing-page .bt-incl{ font-weight:600; font-size:14px; }
.bt-pricing-page .bt-card--light .bt-incl{ color:#171717; }
.bt-pricing-page .bt-card--dark .bt-incl{ color:#fff; }

.bt-pricing-page .bt-feats{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; }
.bt-pricing-page .bt-feats li{ display:flex; align-items:flex-start; gap:12px; font-size:15px; line-height:1.4; }
.bt-pricing-page .bt-feats li img{ width:20px; height:20px; flex-shrink:0; margin-top:1px; }
.bt-pricing-page .bt-card--light .bt-feats li{ color:#444; }
.bt-pricing-page .bt-card--dark .bt-feats li{ color:#D8D8D8; }

/* ---- COMPARISON (native Table block) ------------------------- */
.bt-pricing-page .bt-compare{ font-family:'Poppins',sans-serif; }
.bt-pricing-page .bt-compare > h2,
.bt-pricing-page .bt-compare-title{ text-align:center; font-weight:600; font-size:34px; line-height:1.2; letter-spacing:-.02em; color:#000; margin:0 0 40px; }
.bt-pricing-page .bt-compare table{ border:1px solid #D8D8D8; border-radius:20px; border-collapse:separate; border-spacing:0; overflow:hidden; width:100%; }
.bt-pricing-page .bt-compare th, .bt-pricing-page .bt-compare td{ padding:22px 28px; font-size:15px; line-height:1.5; text-align:center; border:none; }
.bt-pricing-page .bt-compare thead th{ font-weight:600; font-size:17px; padding:20px 28px; border-bottom:1px solid #D8D8D8; }
.bt-pricing-page .bt-compare thead th:first-child{ color:#171717; border-right:1px solid #D8D8D8; }
.bt-pricing-page .bt-compare thead th:last-child{ color:#5FA800; background:#F3FCE8; }
.bt-pricing-page .bt-compare tbody td{ border-bottom:1px solid #EEEEEE; color:#444; }
.bt-pricing-page .bt-compare tbody td:first-child{ border-right:1px solid #D8D8D8; }
.bt-pricing-page .bt-compare tbody td:last-child{ background:#F3FCE8; color:#171717; }
.bt-pricing-page .bt-compare tbody tr:last-child td{ border-bottom:none; }

/* ---- FAQ (native Details blocks) ----------------------------- */
.bt-pricing-page .bt-faq{ font-family:'Poppins',sans-serif; }
.bt-pricing-page .bt-faq > h2,
.bt-pricing-page .bt-faq-title{ text-align:center; font-weight:600; font-size:34px; letter-spacing:-.02em; color:#000; margin:0 0 36px; }
.bt-pricing-page .bt-faq .wp-block-details{ background:#fff; border-radius:16px; box-shadow:0 4px 16px rgba(122,125,132,.08); padding:0; margin:0 0 14px; overflow:hidden; }
.bt-pricing-page .bt-faq .wp-block-details summary{ list-style:none; cursor:pointer; padding:20px 26px; font-weight:600; font-size:16px; color:#171717; display:flex; align-items:center; justify-content:space-between; }
.bt-pricing-page .bt-faq .wp-block-details summary::-webkit-details-marker{ display:none; }
.bt-pricing-page .bt-faq .wp-block-details summary::after{ content:""; width:14px; height:14px; flex-shrink:0; background:no-repeat center/contain; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2370C700' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); transition:transform .2s ease; }
.bt-pricing-page .bt-faq .wp-block-details[open] summary::after{ transform:rotate(180deg); }
.bt-pricing-page .bt-faq .wp-block-details p{ margin:0; padding:0 26px 22px; font-size:15px; line-height:1.6; color:#444; }

/* ---- responsive ---------------------------------------------- */
@media (max-width:820px){
  .bt-pricing-page .bt-pricing .bt-cards{ grid-template-columns:1fr; }
  .bt-pricing-page .bt-hero .bt-hero-title{ font-size:44px; }
  .bt-pricing-page .bt-hero .bt-hero-sub{ font-size:26px; }
}
/* ============================================================
   BuzzTree — Salesforce integration setup page 
      ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

.bt-sf-setup{
  --bt-green-700:#4F8E00; --bt-green-600:#5FA800; --bt-green-500:#70C700;
  --bt-green-300:#BADF8C; --bt-green-100:#E7FFC9;
  --bt-orange-600:#E0701F; --bt-orange-500:#F78633; --bt-orange-200:#FFD5B7; --bt-orange-100:#FEF3EB;
  --bt-whatsapp:#25D366;
  --bt-ink:#171717; --bt-body:#444444; --bt-muted:#71778A;
  --bt-gray-300:#CBCDD7; --bt-gray-200:#D8D8D8; --bt-gray-100:#F6F6F6; --bt-white:#FFFFFF;
  --bt-radius-md:12px; --bt-radius-lg:20px; --bt-radius-pill:999px;
  --bt-shadow-xs:0 1px 2px rgba(122,125,132,.12);
  --bt-shadow-sm:0 2px 8px rgba(122,125,132,.14);
  --bt-shadow-green:0 12px 28px rgba(112,199,0,.30);
  font-family:'Poppins',system-ui,-apple-system,sans-serif;
  color:var(--bt-ink);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.bt-sf-setup *{ box-sizing:border-box; }
.bt-sf-setup ::selection{ background:rgba(112,199,0,.22); }
.bt-sf-setup [id]{ scroll-margin-top:92px; }

/* ---- Layout ----
   The flex row applies whether the theme renders the Group flat or with
   an inner-container wrapper (older Gutenberg / some themes). */
.bt-main, .bt-main > .wp-block-group__inner-container{ width:100%; max-width:1180px; margin:0 auto; padding:0; display:flex; gap:48px; }
.bt-main{ padding:38px 40px 90px; }
.bt-main > .wp-block-group__inner-container{ padding:0; }
.bt-article{ flex:1 1 auto; max-width:760px; min-width:0; }
.bt-step{ margin-top:44px; }
.bt-step__body{ margin-top:10px; }
.bt-block{ margin-top:22px; }

/* ---- Typography (also styles native Heading / Paragraph / List blocks) ---- */
.bt-sf-setup h1, .bt-h1{ font-size:33px; line-height:1.12; letter-spacing:-.022em; margin:0 0 12px; font-weight:600; color:var(--bt-ink); }
.bt-sf-setup h2, .bt-step__title{ font-size:22px; line-height:1.25; letter-spacing:-.015em; margin:0; font-weight:600; color:var(--bt-ink); }
.bt-h3{ font-weight:600; font-size:16.5px; letter-spacing:-.01em; margin:0 0 16px; color:var(--bt-ink); }
.bt-lead{ margin:0 0 8px; font-size:16px; line-height:1.6; color:var(--bt-body); }
.bt-p{ margin:0; font-size:15px; line-height:1.6; color:var(--bt-body); }
.bt-sf-setup strong{ font-weight:600; color:var(--bt-ink); }
.bt-sf-setup a, .bt-link{ color:var(--bt-green-600); }
.bt-sf-setup a:hover, .bt-link:hover{ color:var(--bt-green-700); }
.bt-code{ font-family:'IBM Plex Mono',monospace; font-size:12.5px; background:var(--bt-gray-100); padding:1px 6px; border-radius:5px; }
.bt-code-link{ font-family:'IBM Plex Mono',monospace; font-size:12.5px; background:var(--bt-green-100); color:var(--bt-green-700); text-decoration:none; padding:1px 6px; border-radius:5px; }

/* ---- Lists ---- */
.bt-sf-setup .bt-article ol, .bt-sf-setup .bt-article ul{ margin:12px 0 0; padding-left:22px; font-size:14.5px; line-height:1.6; color:var(--bt-body); }
.bt-sf-setup .bt-article li{ margin-bottom:9px; }
.bt-sf-setup .bt-article li::marker{ color:var(--bt-green-700); }
.bt-list{ display:flex; flex-direction:column; gap:16px; }        /* use on <ol>/<ul> for even spacing + no marker reliance */
.bt-list--tight{ gap:9px; }
.bt-list li{ margin-bottom:0 !important; }

/* ---- Section label ---- */
.bt-label{ font-size:11.5px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--bt-muted); margin:22px 0 2px; }

/* ---- Meta pill ---- */
.bt-meta{ display:flex; flex-wrap:wrap; gap:9px; margin:0 0 20px; }
.bt-pill{ display:inline-flex; align-items:center; gap:7px; background:var(--bt-white); border:1px solid var(--bt-gray-200); color:var(--bt-muted); font-size:12.5px; font-weight:600; padding:6px 12px; border-radius:var(--bt-radius-pill); white-space:nowrap; }
.bt-pill svg{ width:14px; height:14px; }

/* ---- What to have ready ---- */
.bt-ready{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.bt-ready__card{ background:var(--bt-white); border:1px solid var(--bt-gray-200); border-radius:var(--bt-radius-md); padding:14px 15px; box-shadow:var(--bt-shadow-xs); }
.bt-ready__icon{ width:32px; height:32px; border-radius:9px; background:var(--bt-green-500); display:flex; align-items:center; justify-content:center; margin-bottom:9px; box-shadow:var(--bt-shadow-xs); }
.bt-ready__icon--wa{ background:var(--bt-whatsapp); }
.bt-ready__icon svg{ width:18px; height:18px; stroke:var(--bt-white); }
.bt-ready__title{ font-weight:600; font-size:13.5px; margin-bottom:2px; color:var(--bt-ink); }
.bt-ready__desc{ font-size:12.5px; color:var(--bt-muted); line-height:1.45; }

/* ---- Journey at a glance ---- */
.bt-journey{ display:flex; flex-direction:column; gap:13px; }
.bt-journey__row{ display:flex; gap:13px; align-items:flex-start; }
.bt-journey__num{ width:24px; height:24px; border-radius:50%; background:var(--bt-green-100); color:var(--bt-green-700); display:flex; align-items:center; justify-content:center; font-weight:600; font-size:12px; flex:0 0 auto; }
.bt-journey__txt{ font-size:14.5px; line-height:1.5; color:var(--bt-body); }

/* ---- Step header ---- */
.bt-step__head{ display:flex; align-items:center; gap:14px; margin-bottom:6px; flex-wrap:wrap; }
.bt-step__num{ width:38px; height:38px; border-radius:var(--bt-radius-md); background:var(--bt-green-500); color:var(--bt-white); display:flex; align-items:center; justify-content:center; font-weight:600; font-size:17px; flex:0 0 auto; box-shadow:var(--bt-shadow-green); }
.bt-step__num svg{ width:19px; height:19px; fill:var(--bt-white); }

/* ---- Callout box ---- */
.bt-callout{ background:var(--bt-green-100); border:1px solid var(--bt-green-300); border-radius:var(--bt-radius-md); padding:15px 16px; margin-top:20px; }
.bt-callout--cream{ background:var(--bt-orange-100); border-color:var(--bt-orange-200); }
.bt-callout__label{ font-size:11.5px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; color:var(--bt-green-700); margin-bottom:6px; }
.bt-callout--cream .bt-callout__label{ color:var(--bt-orange-600); }
.bt-callout__body{ font-size:13.5px; line-height:1.6; color:var(--bt-body); }

/* ---- Screenshots ----
   Works for a bare <img class="bt-shot"> AND a native Image block
   (<figure class="wp-block-image bt-shot"><img></figure>). */
.bt-shot{ margin-top:12px; }
img.bt-shot, .bt-shot img{ display:block; width:100%; height:auto; border:1px solid var(--bt-gray-200); border-radius:var(--bt-radius-md); box-shadow:var(--bt-shadow-xs); }
.bt-shot.bt-shot--narrow img, img.bt-shot--narrow{ width:70%; margin-left:auto; margin-right:auto; }

/* ---- On-this-page (TOC) ---- */
.bt-toc{ flex:0 0 208px; width:208px; align-self:flex-start; position:sticky; top:86px; display:flex; flex-direction:column; }
.bt-toc__label{ font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--bt-muted); padding:0 10px 10px; }
.bt-toc__nav{ display:flex; flex-direction:column; gap:1px; }
.bt-toc__link{ display:block; padding:7px 10px 7px 12px; border-radius:8px; font-size:12.5px; line-height:1.35; text-decoration:none; color:var(--bt-muted); font-weight:500; transition:color .12s, background .12s; }
.bt-toc__link:hover{ color:var(--bt-green-700); }
.bt-toc__link.is-active{ color:var(--bt-green-700); font-weight:600; background:var(--bt-green-100); }

/* ---- Responsive ---- */
@media (max-width:980px){
  .bt-main, .bt-main > .wp-block-group__inner-container{ flex-direction:column; gap:28px; }
  .bt-main{ padding:28px 20px 64px; }
  .bt-article{ max-width:none; }
  .bt-toc{ position:static; width:auto; flex:none; order:-1; }
  .bt-ready{ grid-template-columns:1fr; }
  .bt-shot.bt-shot--narrow img, img.bt-shot--narrow{ width:100%; }
}
/* =====================================================================
   BuzzTree — WhatsApp x Salesforce free-trial sign-up page
   
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap');

:root{
  --bt-green:#70C700; --bt-green-hover:#5FA800; --bt-green-press:#4F8E00;
  --bt-wash:#E7FFC9; --bt-wash-border:#BADF8C;
  --bt-ink:#171717; --bt-body:#444444; --bt-muted:#71778A;
  --bt-border:#CBCDD7; --bt-card-shadow:0 8px 24px rgba(122,125,132,.10);
  --bt-font:"Poppins",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}

/* ---- outer 2-column shell (core/columns) ---- */
.bt-signup.wp-block-columns{
  display:flex !important; flex-wrap:nowrap;
  margin:0 !important; gap:0 !important; max-width:none !important;
  align-items:stretch !important; background:#fff;
  font-family:var(--bt-font); color:var(--bt-body); min-height:100vh;
}
.bt-signup .bt-signup__form-col,
.bt-signup .bt-signup__wash-col{ padding:40px 56px; box-sizing:border-box; }
.bt-signup .bt-signup__form-col{ display:flex; flex-direction:column; }
.bt-signup .bt-signup__wash-col{
  background:var(--bt-wash); border-left:1px solid var(--bt-wash-border);
  display:flex; flex-direction:column; justify-content:center;
}

/* ---- top row: logo + login link ---- */
.bt-signup .bt-topbar{ display:flex; align-items:center; justify-content:space-between; margin:0 0 8px; }
.bt-signup .bt-topbar img{ height:30px; width:auto; }
.bt-signup .bt-login{ font-size:14px; color:var(--bt-muted); margin:0; }
.bt-signup .bt-login a{ color:var(--bt-green-hover); text-decoration:none; font-weight:500; }
.bt-signup .bt-login a:hover{ text-decoration:underline; }

/* ---- centred form well ---- */
.bt-signup .bt-form-well{
  flex:1; display:flex; flex-direction:column; justify-content:center;
  width:100%; max-width:440px; margin:0 auto; padding:32px 0;
}

/* ---- badge pill (green wash + dot) ---- */
.bt-signup .bt-badge{
  display:inline-flex; align-items:center; gap:8px; align-self:flex-start;
  background:var(--bt-wash); color:var(--bt-green-press);
  border-radius:999px; padding:7px 14px; margin:0 0 16px;
  font-weight:600; font-size:13px;
}
.bt-signup .bt-badge::before{ content:""; width:7px; height:7px; border-radius:999px; background:var(--bt-green); }

/* ---- headings & copy ---- */
.bt-signup .bt-title{
  font-weight:600; font-size:34px; line-height:1.18; letter-spacing:-.02em;
  color:var(--bt-ink); margin:0 0 8px;
}
.bt-signup .bt-subhead{ font-size:15px; color:var(--bt-muted); margin:0 0 28px; }
.bt-signup .bt-wash-title{
  font-weight:600; font-size:24px; line-height:1.25; letter-spacing:-.01em;
  color:var(--bt-ink); margin:0 0 20px; max-width:420px;
}

/* =====================================================================
   NATIVE FORM BLOCK  (core/form + core/form-input)
   Give the Form block the class  bt-form  in the editor sidebar.
   ===================================================================== */
.bt-signup .bt-form{ display:flex; flex-direction:column; gap:16px; margin:0; }
.bt-signup .bt-form .wp-block-form-input{ margin:0; }
.bt-signup .bt-form .wp-block-form-input__label{
  display:flex; flex-direction:column; gap:6px;
  font-weight:500; font-size:14px; color:var(--bt-ink);
}
.bt-signup .bt-form .wp-block-form-input__input{
  width:100%; box-sizing:border-box; font-family:var(--bt-font);
  font-size:15px; color:var(--bt-ink); background:#fff;
  border:1.5px solid var(--bt-border); border-radius:10px;
  padding:12px 14px; transition:border-color .15s ease, box-shadow .15s ease;
}
.bt-signup .bt-form .wp-block-form-input__input::placeholder{ color:#a3a7b3; }
.bt-signup .bt-form .wp-block-form-input__input:focus{
  outline:none; border-color:var(--bt-green);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--bt-green) 30%, transparent);
}

/* checkbox row (native checkbox field OR custom-HTML .bt-terms) */
.bt-signup .bt-form .wp-block-form-input--checkbox .wp-block-form-input__label,
.bt-signup .bt-terms{
  flex-direction:row; align-items:flex-start; gap:11px;
  font-weight:400; font-size:13.5px; line-height:1.5; color:var(--bt-body);
}
.bt-signup .bt-form input[type=checkbox],
.bt-signup .bt-terms input[type=checkbox]{
  appearance:none; -webkit-appearance:none; margin:1px 0 0; flex-shrink:0;
  width:22px; height:22px; border:1.5px solid var(--bt-border);
  border-radius:6px; background:#fff; cursor:pointer; position:relative;
  transition:background .15s ease, border-color .15s ease;
}
.bt-signup .bt-form input[type=checkbox]:checked,
.bt-signup .bt-terms input[type=checkbox]:checked{ background:var(--bt-green); border-color:var(--bt-green); }
.bt-signup .bt-form input[type=checkbox]:checked::after,
.bt-signup .bt-terms input[type=checkbox]:checked::after{
  content:""; position:absolute; left:7px; top:3px; width:5px; height:10px;
  border:solid #fff; border-width:0 2.5px 2.5px 0; transform:rotate(45deg);
}
.bt-signup .bt-terms a{ color:var(--bt-green-hover); text-decoration:none; font-weight:500; }
.bt-signup .bt-terms a:hover{ text-decoration:underline; }

/* submit button (native form submit OR a core/button given class bt-btn) */
.bt-signup .bt-form .wp-block-form-submit-button .wp-block-button__link,
.bt-signup .bt-btn .wp-block-button__link,
.bt-signup .bt-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  width:100%; box-sizing:border-box; border:none; cursor:pointer;
  background:var(--bt-green); color:#fff; font-family:var(--bt-font);
  font-weight:600; font-size:16px; padding:15px 24px; border-radius:999px;
  box-shadow:0 8px 20px rgba(112,199,0,.30); transition:background .15s ease, transform .05s ease;
}
.bt-signup .bt-form .wp-block-form-submit-button{ margin-top:4px; }
.bt-signup .bt-form .wp-block-form-submit-button .wp-block-button__link:hover,
.bt-signup .bt-btn:hover{ background:var(--bt-green-hover); }
.bt-signup .bt-form .wp-block-form-submit-button .wp-block-button__link:active,
.bt-signup .bt-btn:active{ background:var(--bt-green-press); transform:translateY(1px); }

/* trust microcopy under the button */
.bt-signup .bt-trust{
  display:flex; align-items:center; justify-content:center; gap:7px;
  margin:16px 0 0; font-size:13px; color:var(--bt-muted);
}
.bt-signup .bt-trust img{ width:16px; height:16px; }

/* =====================================================================
   BENEFIT CARDS (right wash column) — native core/group + core/image
   ===================================================================== */
.bt-signup .bt-cards{ display:flex; flex-direction:column; gap:16px; max-width:460px; }
.bt-signup .bt-benefit-card{
  display:flex; flex-wrap:nowrap; align-items:flex-start; gap:16px;
  background:#fff; border-radius:16px; padding:18px 20px; box-shadow:var(--bt-card-shadow); margin:0;
}
.bt-signup .bt-benefit-card__icon{ margin:0; flex:0 0 48px; }
.bt-signup .bt-benefit-card__icon img{ width:48px; height:48px; display:block; }
.bt-signup .bt-benefit-card__body{ margin:0; }
.bt-signup .bt-benefit-card__title{ font-weight:600; font-size:16px; color:var(--bt-ink); margin:0 0 3px; }
.bt-signup .bt-benefit-card__text{ font-size:14px; line-height:1.5; color:var(--bt-body); margin:0; }

/* =====================================================================
   RESPONSIVE — stack to one column on tablet / mobile
   ===================================================================== */
@media (max-width:900px){
  .bt-signup.wp-block-columns{ flex-direction:column !important; min-height:0; }
  .bt-signup .bt-signup__form-col,
  .bt-signup .bt-signup__wash-col{ flex-basis:100% !important; padding:32px 22px; }
  .bt-signup .bt-signup__wash-col{ border-left:none; border-top:1px solid var(--bt-wash-border); }
  .bt-signup .bt-title{ font-size:28px; }
}