footer + .notice{
    background-color: #ffff00;
    position: sticky;
    z-index: 99999999;
} 
    footer + .notice h1{
        font-size: var(--f-size-l);
        line-height: var(--l-height-l);
    }

    footer + .notice p{
        font-size: var(--f-size-xs);
        line-height: var(--l-height-s);
    }

    .nc-submit{
        background: unset;
        border: unset;
        padding: unset;
        cursor: pointer;
    }
    .nc-submit:hover .txt{
        text-decoration: underline;
    }
    .response.open + .nc-submit{
        display: none;
    }

        .nc-submit .txt{
            font-size: var(--f-size-xs);
            line-height: var(--l-height-s);
            color: var(--governor-bay);
        }

        .nc-submit.load .txt{
            display: none;
        }

        .nc-submit .btn-loading{
            height: var(--l-height-l);
            color: var(--gray-dark);
            display: none;
        }
            .nc-submit.load .btn-loading{
                display: flex;
            }

            .nc-submit .loading, .nc-submit .loading:before, .nc-submit .loading:after {
                border-radius: 50%;
                width: 1.5em;
                height: 1.5em;
                animation-fill-mode: both;
                animation: bblFadInOut 1.8s infinite ease-in-out;
                top: -17px;
            }
            .nc-submit .loading {
                color: var(--gray-dark);
                font-size: 7px;
                position: relative;
                text-indent: -9999em;
                transform: translateZ(0);
                animation-delay: -0.16s;
            }
            .nc-submit .loading:before,
            .nc-submit .loading:after {
                content: '';
                position: absolute;
                top: 0;
            }
            .nc-submit .loading:before {
                left: -3.5em;
                animation-delay: -0.32s;
            }
            .nc-submit .loading:after {
                left: 3.5em;
            }

            @keyframes bblFadInOut {
                0%, 80%, 100% { box-shadow: 0 2.5em 0 -1.3em }
                40% { box-shadow: 0 2.5em 0 0 }
            }

    @media all and (min-width: 1024px){
        footer + .notice{
            bottom: 0;
        }
    }

    @media all and (max-width: 1023px){
        footer + .notice{
            bottom: calc( env(safe-area-inset-bottom) + 57px );
        }
    }


    .write-review{
        position: relative;
    }

            .write-box{
                position: relative;
                overflow: hidden;
                width: min(700px, 80%);
                background-image: var(--linear-gr-1);
                gap: var(--gap-m);
                border-radius: var(--b-r-l);
                padding: var(--gap-xl) var(--gap-m);
            }
                .wr-bg{
                    position: absolute;
                    z-index: 0;
                    left: 0;
                    top: -50%;
                    width: 100%;
                    height: auto;
                    opacity: .15;
                }

                .write-wrap{
                    z-index: 3;
                    gap: var(--gap-m);
                }
                    .write-review .title{
                        color: var(--f-light-default);
                        font-size: var(--f-size-xxxxl);
                        line-height: var(--l-height-xxl);
                        font-weight: 600;
                    }

                    .write-review p{
                        color: var(--f-light-default);
                        font-size: var(--f-size-xs);
                        line-height: var(--l-height-s);
                        text-wrap: balance;
                        text-align: center;
                    }

    .footer{
        position: relative;
        background: var(--f-light-default);
        gap: var(--gap-xxl);
    }

        .footer-nav{}

            .footer-txt{
                font-size: var(--f-size-xxs);
                line-height: var(--l-height-xxs);
            }
            .footer-logo-box{
                margin: 0 0 var(--gap-m) 0;
            }
                .footer-logo{
                    width: 130px;
                    height: auto;
                }

            .footer-menu .menu-item-has-children{
                flex: 1 1 auto;
                display: flex;
                flex-direction: column;
            }
                .footer-menu .menu-item-has-children > a,
                .footer-menu .menu-item-has-children > div{
                    color: var(--umbra);
                    font-size: var(--f-size-s);
                    font-weight: 700;
                    line-height: var(--l-height-xs);
                    margin: 0 0 var(--gap-s) 0;
                }

                    .footer-menu .menu-item{
                        width: 100%;
                        list-style: none;
                        margin: 0 0 5px 0;
                    }
                        .footer-menu .sub-menu .menu-item a,
                        .footer-menu .sub-menu .menu-item div{
                            font-size: var(--f-size-xxs);
                            line-height: var(--l-height-xxs);
                            text-decoration: none;
                        }

        .footer-bottom{
            padding: 0 0 var(--gap-l) 0;
        }
            .footer-bottom .boxW{
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                justify-content: space-between;
            }

                .footer-copy{
                    width: fit-content;
                    font-size: var(--f-size-xxs);
                    line-height: 100%;
                    align-self: center;
                }

                .footer-socials{
                    width: fit-content;
                    gap: var(--gap-s);
                }
                    .f-social{
                        display: flex;
                    }
                        .f-social a{
                            width: fit-content;
                            height: auto;
                            padding: var(--gap-xs);
                        }
                            .f-social a span{
                                font-size: var(--f-size-l);
                                line-height: 100%;
                                color: var(--gray);
                            }

        @media all and (max-width: 1023px){
            footer{
                padding-bottom: var(--gap-xxl);
            }

            .footer-bottom .boxW{
                place-content: center;
                place-items: center;
                gap: var(--gap-s);
            }

            .footer-menu .menu-item-has-children > a,
            .footer-menu .menu-item-has-children > div{
                margin: 0;
            }

        }

        @media all and (min-width: 800px){

            .badges-box{
                display: grid;
                grid-template-columns: repeat(2, min(40%, 240px));
                justify-content: center;
            }

            .footer-content-box{
                display: grid;
                grid-template-columns: minmax(180px, 30%) auto;
            }

                .footer-menu .menu-items{
                    display: grid;
                    grid-template-columns: repeat(4, max-content);
                    justify-content: space-between;
                }
        }

        @media all and (max-width: 799px){

            .badges-box{
                display: grid;
                justify-content: center;
            }
                .badges-box a{display: contents;}
                    .badges-box img{
                        width: clamp(50%, 200px, 70%);
                    }

            .footer-content-box{
                display: grid;
            }

            .footer-content{
                width: max-content;
                justify-self: center;
            }

            .footer-menu .menu-items{
                width: var(--full-w);
                display: grid;
                grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
                justify-content: space-between;
                justify-self: center;
            }
        }

        @media all and (max-width: 600px){

            .footer-menu .menu-item {
                margin: 0 0 15px 0;
            }
                .footer-menu .sub-menu .menu-item a{
                    font-size: var(--f-size-xs);
                    line-height: var(--l-height-s);
                }

        }

@layer shortcodes{
    .highlight{
        padding: 0 5px;
        border-radius: var(--b-r-m);
        width: fit-content;
        margin: 0 3px;
        font: inherit;
    }
 
    .highlight > *{color: inherit;}
 
        .highlight.blue,
        .highlight.blue > p,
        .highlight.blue > div,
        .highlight.blue > span,
        .hl-blue{
            background-color: var(--governor-bay-1) !important;
            color: var(--governor-bay) !important;
            font-weight: 600;
        }

        .highlight.pink,
        .highlight.pink > p,
        .highlight.pink > div,
        .highlight.pink > span,
        .hl-pink{
            background-color: var(--bondi-blue-1) !important;
            color: var(--bondi-blue) !important;
            font-weight: 600;
        }

    .div-solid,
    .div-dotted,
    .div-fadeout{
        width: 100%;
        height: 2px;
    }

    .div-solid{ background-color: var(--governor-bay); }
    .div-fadeout, .div-dotted{ background-color: var(--bondi-blue); }

    .quote{
        display: flex;
        flex-direction: column;
        gap: var(--gap-s);
        position: relative;
        border-radius: var(--gap-m);
        padding: var(--gap-m) var(--gap-m) var(--gap-m) var(--gap-l);
        font: inherit;
        border: 1px solid var(--umbra-2);
        border-left: 6px solid var(--governor-bay);
        quotes: "“" "”" "‘" "’";
    }
        blockquote.quote p::before {
            content: open-quote;
        }
        blockquote.quote p::after {
            content: close-quote;
        }

        .quote cite{
            color: var(--governor-bay);
            font-weight: 700;
            font-family: 'Urbanist','Roboto',sans-serif;
        }



    .accList{}

        .accItem{}
            .accLabel{
                cursor: pointer;
                border: 1px solid var(--umbra-2);
                border-radius: var(--b-r-l);
                padding: var(--gap-s) var(--gap-m);
            }
            .accCheck:checked + .accLabel{
                border-radius: var(--b-r-l) var(--b-r-l) 0 0;
            }
            .accLabel:hover{
                background-color: #ABABAE1A;
            }
                .accIcon{
                    font-size: var(--f-size-xs);
                    line-height: 1.2;
                    align-self: center;
                    transition: rotate 0.3s ease-in;
                }

                .accCheck:checked + .accLabel .accIcon{
                    rotate: 180deg;
                }

                .accTitle{
                    font-size: var(--f-size-l);
                    line-height: 1.2;
                    font-weight: 600;
                }

            .accContent{
                height: fit-content;
                max-height: 0;
                overflow: hidden;
                transition: max-height 0.3s ease-in;
            }
            .accCheck:checked ~ .accContent{ max-height: 2000px; }

                .accContent .content{
                    border: 1px solid var(--umbra-2);
                    border-radius: 0 0 var(--b-r-l) var(--b-r-l);
                    border-top: unset;
                    padding: var(--gap-s) var(--gap-m);
                }


    .testimonials-box .section-title{
        width: min( 600px, 100% );
    }

        .testimonials{
            width: 100%;
            overflow-x: auto;
            flex-wrap: nowrap;
            gap: var(--gap-m);
            scroll-behavior: smooth;
            scroll-snap-type: x mandatory;
            scroll-margin: 0 var(--gap-l);
            scroll-padding: 0 var(--gap-s);
            padding: var(--gap-l) var(--gap-l);
        }

            .testimonial{
                width: 100%;
                gap: var(--gap-s);
                scroll-snap-align: start;
                border: 1px solid var(--umbra-2);
                border-top: 6px solid var(--bondi-blue);
                border-radius: var(--gap-m);
                transition: box-shadow .15s ease-in;
                cursor: pointer;
            }

            .testimonial:hover {
                -moz-box-shadow: var(--b-s-glass);
                -webkit-box-shadow: var(--b-s-glass);
                box-shadow: var(--b-s-glass)
            }

            .testimonials-wrap:hover .testimonial{
                animation-play-state: paused;
            }

                .t-author{
                    display: flex;
                    gap: var(--gap-s);
                }

                    .t-avatar{
                        width: 70px;
                        height: auto;
                        aspect-ratio: 1;
                        border-radius: 100%;
                        flex: 0 0 70px;
                        border: 1px solid hsl(220 13% 91%);
                        box-shadow: var(--shadow-sm);
                    }

                    .t-author-box{
                        place-content: center;
                        flex: 1 0 calc(100% - 100px);
                    }
                        .t-author-name{
                            width: fit-content;
                            font-size: var(--f-size-s);
                            line-height: var(--l-height-s);
                            font-weight: 700;
                        }

                    .t-company{
                        display: flex;
                        flex-wrap: wrap;
                        font-weight: 300;
                        color: var(--umbra);
                    }
                        .t-position{
                            font-size: var(--f-size-xxs);
                            line-height: var(--l-height-xs);
                            font-weight: 300;
                            font-style: italic;
                            color: var(--umbra);
                        }
                        .t-sep{
                            font-size: var(--f-size-s);
                            line-height: var(--l-height-xs);
                            font-weight: 500;
                        }
                        .t-company-name{
                            font-size: var(--f-size-xs);
                            line-height: var(--l-height-xs);
                            text-transform: uppercase;
                            font-weight: 500;
                        }

                .t-content{
                    width: 100%;
                    font-size: var(--f-size-xs);
                    line-height: var(--l-height-xs);
                }

        .t-nav{
            padding: var(--gap-xs) var(--gap-s);
            border: 1px solid rgba(33, 31, 32, 0.20);
            border-radius: var(--b-r-l);
            background-color: var(--f-light-default);
            cursor: pointer;
        }

        .t-nav.off{
            opacity: 0.5;
            cursor: not-allowed;
        }
            .t-nav span{
                font-size: var(--f-size-m);
                line-height: 100%;
            }


            .expertInsight{
                margin-bottom: var(--gap-m);
            }
                .expertProfile{}
                    .expertInsight .expertAvatar{
                        width: 80px;
                        height: 80px;
                        aspect-ratio: 1;
                        border-radius: 100%;
                        border: 2px solid var(--governor-bay);
                    }
                    .expertInsight .expertBio{ justify-content: center; }
                        .expertInsight  .expertName{
                            font-size: var(--f-size-xl);
                            line-height: var(--l-height-m);
                            font-weight: 700;
                        }
                        .expertInsight .expertPosition{
                            font-size: var(--f-size-s);
                            line-height: var(--l-height-xs);
                            font-weight: 400;
                        }
                        .expertInsight .expertCompany{
                            font-size: var(--f-size-s);
                            line-height: var(--l-height-xs);
                            font-weight: 700;
                        }
                            .expertInsight .expertCompany .icon-new-tab2{
                                font-size: var(--f-size-s);
                                line-height: var(--l-height-xs);
                            }

                .expertInsight .expertQuote{
                    position: relative;
                    padding: var(--gap-m) 0 var(--gap-l) var(--gap-l);
                    border-left: 2px solid var(--governor-bay);
                    border-bottom: 2px solid var(--governor-bay);
                    border-bottom-left-radius: 30px;
                }
                .expertInsight .expertQuote::after{
                    content: "";
                    position: absolute;
                    left: 10%;
                    bottom: -2px;
                    width: 90%;
                    height: 2px;
                    background: linear-gradient( to right, var(--governor-bay), #f8f8f8 80% );
                }

                @media all and (min-width: 551px){
                    .expertInsight .expertQuote{ margin-left: 40px; }
                }

                @media all and (max-width: 550px){
                    .expertInsight .expertQuote{ margin: 0; }
                    .expertInsight .expertQuote::before{
                        content: "";
                        position: absolute;
                        left: -2px;
                        top: -40px;
                        width: 2px;
                        height: 40px;
                        background-color: var(--governor-bay);
                    }
                }

            .banner{
                flex-wrap: wrap;
                border: 1px solid #bfdbfe80;
                border-radius: var(--b-r-l);
                padding: 0 0 var(--gap-s) 0;
                box-shadow: var(--shadow-sm);
            }
            .banner.bg-cover{
                position: relative;
                padding: var(--gap-l) 0;
            }

                .banner picture.bg-cover{
                    position: relative;
                }

                .banner picture{
                    border-radius: var(--b-r-l) var(--b-r-l) 0 0;
                    overflow: hidden;
                    transition: box-shadow 0.15s ease-in;
                }
                .banner:hover picture{
                    -moz-box-shadow: var(--b-s-glass);
                    -webkit-box-shadow: var(--b-s-glass);
                    box-shadow: var(--b-s-glass);
                }

                .banner-image{
                    width: 100%;
                    height: auto;
                    border-radius: var(--b-r-l) var(--b-r-l) 0 0;
                }
                .banner .boxW{
                    flex-wrap: wrap;
                }
                figcaption.banner-title{
                    width: fit-content;
                    font-size: var(--f-size-m);
                    line-height: 1.2;
                    font-weight: 600;
                }

                figcaption.banner-title.red{ color: var(--candy-apple); }
                figcaption.banner-title.blue{ color: var(--governor-bay); }
                figcaption.banner-title.green{ color: var(--oz); }
                figcaption.banner-title.gold{ color: var(--marigold); }
                figcaption.banner-title.black{ color: var(--umbra-8); }
                figcaption.banner-title.white{ color: var(--f-light-default); }

            @media all and (max-width: 700px){
                figcaption.banner-title{ text-align: center; }
            }


        .fs.galleryWrap{
            position: fixed;
            z-index: 999;
            left: 0;
            width: 100%;
            height: calc(100% - 70px);
            padding: var(--gap-l) 0;
            background-color: #fff;
        }

        .fs.galleryWrap::before{
            content: "";
            position: fixed;
            z-index: -1;
            right: 0;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: #fff;
        }

            .gallery{
                width: 100%;
                overflow-x: auto;
                flex-wrap: nowrap;
                gap: var(--gap-m);
                scroll-behavior: smooth;
                scroll-snap-type: x mandatory;
                scroll-margin: 0;
                scroll-padding: 0;
                padding: var(--gap-s) 0;
            }
            .fs .gallery{
                scroll-margin: 0;
                scroll-padding: 0 10%;
            }

                .galleryFigure{
                    scroll-snap-align: start;
                    scroll-snap-stop: normal;
                    width: 100%;
                    gap: var(--gap-s);
                    scroll-snap-align: start;
                }
                .fs .galleryFigure{
                    justify-content: center;
                    width: auto;
                    max-width: 100%;
                    height: auto;
                    max-height: 95%;
                }
                .galleryFigure:hover{
                    cursor: zoom-in;
                }
                .fs .galleryFigure:hover{
                    cursor: zoom-out;
                }

                .galleryWrap:hover .galleryFigure{
                    animation-play-state: paused;
                }

                    .galleryPicture{
                        display: flex;
                        border-radius: var(--b-r-l);
                        overflow: hidden;
                    }
                    .galleryWrap:not(.fs) .galleryPicture{ height: 200px; }
                    .galleryWrap.fs .galleryPicture{ height: fit-content; }

                        .galleryImage{
                            align-self: center;
                        }
                        .fs .galleryImage {
                            height: auto;
                            max-height: 100%;
                        }

                    .galleryCaption{
                        display: flex;
                        justify-content: center;
                        text-align: center;
                        flex-wrap: wrap;
                        font-weight: 300;
                        color: var(--umbra-8);
                        font-style: italic;
                        font-size: var(--f-size-xs);
                    }
                    .fs .galleryCaption{
                        background-color: #ffffffeb;
                        padding: var(--gap-s) var(--gap-m);
                        width: fit-content;
                        align-self: center;
                        font-weight: 500;
                        border-radius: 10px;
                    }

        @supports ((-webkit-backdrop-filter: none) or (backdrop-filter: none)) {

            .fs.galleryWrap{
                backdrop-filter: blur(20px);
                -moz-backdrop-filter: blur(20px);
                -webkit-backdrop-filter: blur(20 px);
                padding: var(--gap-l) 0;
                background: rgba( 255,255,255, 0.97 );
            }

            .fs.galleryWrap::before{
                backdrop-filter: blur(20px);
                -moz-backdrop-filter: blur(20px);
                -webkit-backdrop-filter: blur(20 px);
                background: rgba( 255,255,255, 0.97 );
            }

        }

        @media all and (min-width: 1024px){
            .fs.galleryWrap{
                top: 70px;
            }
            .fs.galleryWrap::after{
                top: 70px;
            }
        }
        @media all and (max-width: 1023px){
            .fs.galleryWrap{
                top: 60px;
            }
            .fs.galleryWrap::after{
                top: 60px;
            }
        }


            .g-nav{
                display: flex;
                flex-direction: column;
                justify-content: center;
                padding: var(--gap-s) var(--gap-s);
                border: 1px solid rgba(33, 31, 32, .20);
                border-radius: var(--b-r-l);
                background-color: var(--f-light-default);
                cursor: pointer;
            }

            .g-nav.off{
                opacity: 0.5;
                cursor: not-allowed;
            }
                .g-nav span{
                    font-size: var(--f-size-m);
                    line-height: 100%;
                }

    
        @media all and (min-width: 700px){

            .testimonial {
                flex: 1 0 calc(50% - var(--gap-s));
            }

            .galleryFigure{
                flex: 1 0 calc(50% - var(--gap-s));
            }
            .fs .galleryFigure{
                flex: 1 0 100%;
            }

        }
    
        @media all and (max-width: 699px){

            .testimonial {
                flex: 1 0 calc( 98% - var(--gap-s) );
            }

            .galleryFigure {
                flex: 1 0 calc( 98% - var(--gap-s) );
            }

        }
            
    
        .columns{
            display: grid;
            gap: var(--gap-l);
        }
            .column.glass{
                box-shadow: unset;
                background: unset;
                border: 1px solid var(--umbra-2);
            }
            .column{ font: inherit; }

        @media all and (min-width: 600px){
    
            .columns.col2,
            .columns.col4{
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        
        }
    
        @media all and (min-width: 800px){
    
            .columns.col3{
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }
        
        }
    
            .column{
                border-radius: var(--b-r-l);
            }
                .columns img{
                    width: auto;
                    max-width: 100%;
                    place-self: center;
                    margin: 0 auto;
                    height: auto;
                    border-radius: var(--b-r-l);
                }
    
        .pretty-list{
            display: flex;
            flex-direction: column;
        }
            .pretty-list ul{
                display: flex;
                flex-direction: column;
            }
            div:not( .column ) > .pretty-list ul{ padding-left: var(--gap-l); }

                .pretty-list li{
                    list-style: none;
                    position: relative;
                }
    
                .pretty-list li::before{
                    font-family: 'icomoon';
                    font-size: var(--f-size-l);
                    line-height: 1;
                    position: relative;
                    top: 3px;
                }
                    .chevron-list li::before,
                    .arrow-list li::before{
                        content: "\edc8";
                        color: var(--governor-bay);
                    }
                    .dash-list li::before,
                    .star-list li::before{
                        content: "\ec6b";
                        color: var(--bondi-blue);
                    }

                    .pretty-list li :is(h1, h2, h3, h4, h5, h6){
                        display: inline-block;
                    }

        .box-green,
        .box-blue{
            position: relative;
            border-radius: var(--gap-m);
            padding: var(--gap-m) var(--gap-m) var(--gap-m) var(--gap-l);
            font: inherit;
            font-family: 'Roboto';
            border: 1px solid var(--umbra-2);
            border-left: 6px solid var(--bondi-blue);
        }

    .wpsm-titlebox{
        display: flex;
        flex-direction: column;
        gap: var(--gap-s);
        position: relative;
        border-radius: var(--gap-m);
        padding: var(--gap-m) var(--gap-m) var(--gap-m) var(--gap-l);
        font: inherit;
        border: 1px solid var(--umbra-2);
        border-left: 6px solid var(--governor-bay);
    }

        .titlebox{}
            .titlebox p,
            .titlebox h2,
            .titlebox h3,
            .titlebox h4{
                color: var(--governor-bay);
                font: inherit;
                font-family: 'Urbanist', 'Roboto', sans-serif;
                font-weight: 700;
            }
            .titlebox p{
                font: inherit;
            }

        .titlebox-content{
            position: relative;
            z-index: 2;
            font: inherit;
            font-family: 'Roboto';
        }

    .promobox{
        display: grid;
        gap: var(--gap-s);
        position: relative;
        border-radius: var(--gap-m);
        padding: var(--gap-m) var(--gap-m) var(--gap-m) var(--gap-l);
        font: inherit;
        border: 1px solid var(--umbra-2);
        border-left: 6px solid var(--governor-bay);

        background-color: var(--governor-bay-1);
    }

    .ext-box{
        display: grid;
        gap: var(--gap-s);
        position: relative;
        border-radius: var(--gap-m);
        padding: var(--gap-m) var(--gap-m) var(--gap-m) var(--gap-l);
        font: inherit;
        border: 1px solid var(--umbra-2);
        border-left: 6px solid var(--bondi-blue);

        background-color: var(--bondi-blue-1);
    }

        .ext-box .btn{
            background: var(--bondi-blue);
        }
        .ext-box .btn:focus{ box-shadow: 0px 1px 2px 0px rgba(255, 255, 255, 0.25) inset, 0px -1px 2px 0px rgba(0, 0, 0, 0.25) inset, 0px 0px 0px 3px var(--governor-bay-2); }

        .ext-box .btn::after {
            content: "\e91e";
            color: inherit;
            margin-left: var(--gap-s);
            position: relative;
            bottom: -2px;
            font-size: inherit;

            font-family: 'icomoon' !important;
            speak: never;
            font-style: normal;
            font-weight: normal;
            font-variant: normal;
            text-transform: none;
            line-height: 1;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }


    .pricing-box{
        display: flex;
        flex-direction: column;
        gap: var(--gap-s);
        position: relative;
        border-radius: var(--gap-m);
        padding: var(--gap-m) var(--gap-m) var(--gap-m) var(--gap-l);
        font: inherit;
        border: 1px solid var(--umbra-2);
        border-left: 6px solid var(--governor-bay);
    }
        .pb-item{
            font-weight: 700;
        }
        .pb-url{
            font-size: var(--f-size-s);
            line-height: var(--l-height-xs);
            color: var(--bondi-blue);
        }


    .embed-video{
        width: min( 100%, 800px );
        place-self: center;
    }
        .embed-box{
            position: relative;
            padding-bottom: 56.25%; /* 16:9 */
            height: 0;
            border-radius: 20px;
            overflow: hidden;
        }
            .placeholder.ph-yt{
                position: absolute;
                top: 0;
                left: 0;
                border: 0;
                width: 100%;
                height: 100%;
                cursor: pointer;
                z-index: 11;
                overflow: hidden;
            }

                .placeholder.ph-yt:before{
                    content: '';
                    width: 100%;
                    height: 110px;
                    position: absolute;
                    background-repeat: repeat-x;
                    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAADGCAYAAAAT+OqFAAAAdklEQVQoz42QQQ7AIAgEF/T/D+kbq/RWAlnQyyazA4aoAB4FsBSA/bFjuF1EOL7VbrIrBuusmrt4ZZORfb6ehbWdnRHEIiITaEUKa5EJqUakRSaEYBJSCY2dEstQY7AuxahwXFrvZmWl2rh4JZ07z9dLtesfNj5q0FU3A5ObbwAAAABJRU5ErkJggg==);
                    -webkit-transition: opacity .25s cubic-bezier(0,0,0.2,1);
                    transition: opacity .25s cubic-bezier(0,0,0.2,1);
                    pointer-events: none;
                    z-index: 12;
                }
                .placeholder.ph-yt picture{
                    position: relative;
                    display: flex;
                }
                .placeholder.ph-yt img{
                    box-shadow: unset !important;
                    border-radius: unset !important;
                    position: relative;
                    width: 100%;
                    height: auto;
                    align-self: center;
                    justify-self: center;
                }

                .ytp-title-box{
                    position: absolute;
                    top: 20px;
                    left: 15px;
                    min-height: 52px;
                    width: calc(100% - 30px);
                }
                    .ytp-title-text{
                        vertical-align: top;
                        font-size: 18px;
                        font-weight: 300;
                        width: 100%;
                        white-space: nowrap;
                        word-wrap: normal;
                        text-overflow: ellipsis;
                        overflow: hidden;
                        padding: 0;
                        color: var(--f-light-other);
                        z-index: 13;
                    }
                    .placeholder.ph-yt:hover .ytp-title-text{
                        color: var(--f-light-default);
                        -webkit-transition: color .1s cubic-bezier(0.4, 0, 1, 1);
                        transition: color .1s cubic-bezier(0.4, 0, 1, 1)
                    }

                .ytp-large-play-button {
                    position: absolute;
                    left: 50%;
                    top: 50%;
                    width: 68px;
                    height: 48px;
                    margin-left: -34px;
                    margin-top: -24px;
                    -webkit-transition: opacity .25s cubic-bezier(0,0,0.2,1);
                    transition: opacity .25s cubic-bezier(0,0,0.2,1);
                    z-index: 13;
                }
                    .ytp-large-play-button svg{
                        height: 100%;
                        left: 0;
                        position: absolute;
                        top: 0;
                        width: 100%;
                    }
                    .ytp-large-play-button-bg {
                        -webkit-transition: fill .1s cubic-bezier(0.4,0,1,1),fill-opacity .1s cubic-bezier(0.4,0,1,1);
                        transition: fill .1s cubic-bezier(0.4,0,1,1),fill-opacity .1s cubic-bezier(0.4,0,1,1);
                        fill: #212121;
                        fill-opacity: .8;
                    }
                    .placeholder.ph-yt:hover .ytp-large-play-button-bg {
                        -webkit-transition: fill .1s cubic-bezier(0, 0, 0.2, 1), fill-opacity .1s cubic-bezier(0, 0, 0.2, 1);
                        transition: fill .1s cubic-bezier(0, 0, 0.2, 1), fill-opacity .1s cubic-bezier(0, 0, 0.2, 1);
                        fill: #f00;
                        fill-opacity: 1;
                    }

            .embed-box iframe{
                position: absolute;
                top: 0;
                left: 0;
                border: 0;
                width: 100%;
                height: 100%;

                z-index: 15;
            }

    .single-deal{
        margin: 20px 0 0 0;
    }
        .single-deal .deal-box{
            max-width: 465px;
        }
    
        .multi-deals .deal-box{
            width: 465px;
        }
    
    
    /* Horizontal Scroll Softwares and Deals */
    
    .scroll-wrap{
        position: relative;
        margin: 0 0 var(--gap-s) 0;
    }
    
    /* Software Overview */
        .rbody-row.short{
            gap: var(--gap-l);
        }
    
            .overview-logo img{
                max-width: 100%;
            }

    .table-box.glass{
        box-shadow: unset;
        background: unset;
    }
    .table-box{
        border: 1px solid var(--umbra-2);
    }

        .table-box .table{
            position: relative;
            font: inherit;
            vertical-align: top;
            -webkit-overflow-scrolling: touch;
        }

            .table-box .basic-table .thead{
                background-color: var(--governor-bay-1);
            }
            .table-box .pricing-table .thead{
                background-color: var(--bondi-blue-1); 
            }

            tbody{
                -webkit-overflow-scrolling: touch;
            }

                    .table .thead tr{
                        border-radius: var(--b-r-m);
                        /* display: grid; */
                    }

                        .table .th-cell {
                            border: 0;
                            line-height: 1.4;
                            font-weight: 500;
                            padding: var(--gap-s);
                            text-align: left;
                            vertical-align: middle;
                            align-self: center;
                        }

                        .basic-table .th-cell{ color: var(--governor-bay); }
                        .pricing-table .th-cell{ color: var(--bondi-blue); }

                        .table .th-cell:first-child {
                            border-radius: 5px 0 0 5px;
                        }
                        .table .th-cell:last-child {
                            border-radius: 0 5px 5px 0;
                        }
                    .table .tb-row{
                        /* display: grid; */
                    }
                    .tb-row:nth-child(2n) {
                        background-color: var(--umbra-05);
                    }

                        .table .tb-row:last-child{ border: unset; }

                        .table .tb-cell {
                            line-height: var(--l-height-xs);
                            font-size: var(--f-size-s);
                            padding: var(--gap-s);
                            vertical-align: middle;
                            align-self: center;
                            font-family: 'Roboto', system-ui, sans-serif;
                        }

    @media all and (min-width: 960px){
        .table-box{
            overflow-x: scroll;
            border-radius: var(--gap-m) var(--gap-m) 0 0;
        }
        .table-box::-webkit-scrollbar {
            display: none;
        }

        .table-box:has( .basic-table ){
            border-top: 6px solid var(--governor-bay);
        }

        .table-box:has( .pricing-table ){
            border-top: 6px solid var(--bondi-blue);
        }

        .table{
            display: table;
        }

            .table .thead{
                width: 100%;
            }
        
            .table .thead tr{}
                .table .th-cell{}
        
            .table .tbody {}
        
                .tb-row {}
                    .tb-cell{ border-right: 1px solid var(--umbra-05); }
        
    }

    @media all and (max-width: 959px){

        .table-box{
            border-radius: var(--gap-m) 0 0 var(--gap-m);
        }
        .table-box:has( .basic-table ){
            border-left: 6px solid var(--governor-bay);
        }

        .table-box:has( .pricing-table ){
            border-left: 6px solid var(--bondi-blue);
        }

        .table{
            display: flex;
            flex-direction: row;
            max-width: 100%;
        }

        .table tr{
            width: clamp(200px, 33dvw, 300px);
        }
    
        .table .thead tr{
            display: grid;
            grid-auto-rows: 1fr;
            grid-auto-flow: row;
            width: fit-content;
            max-width: 100%;
            height: 100%;
        }
            .table .th-cell{
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                max-width: 100%;
                white-space: normal;
            }
    
        .table .tbody{
            display: flex;
            flex-direction: row;
            flex-grow: 0;
            flex-shrink: 1;
            overflow-x: scroll;
            scroll-snap-type: x mandatory;
        }
        .table .tbody::-webkit-scrollbar {
            display: none;
        }
            .tb-row {
                display: grid;
                grid-auto-rows: 1fr;
                grid-auto-flow: row;
                scroll-snap-align: start;
            }
            /* .basic-table .tb-row{ border-right: 1px solid var(--governor-bay); } */
            /* .pricing-table .tb-row{ border-right: 1px solid var(--bondi-blue); } */

                .tb-row .tb-cell{
                    display: flex;
                    place-items: center;
                    height: 100%;
                    border-bottom: 1px solid var(--umbra-05);
                }

                .tb-row .tb-cell:last-child{
                    border: none;
                }

    }
    
        .rbody-row {
            display: grid;
            font-size: var(--f-size-m);
            line-height: var(--l-height-l);
            gap: var(--gap-l);
        }
            .pro-cons .rbody-col{
                display: flex;
                flex-direction: column;
                gap: var(--gap-m);
                position: relative;
                border-radius: var(--gap-l);
                padding: var(--gap-m);
                font: inherit;
                border: 1px solid var(--umbra-2);
                border-top: 6px solid var(--oz);
            }

            .pro-cons .rbody-col:has( .pros ){ border-top: 6px solid var(--oz); }
            .pro-cons .rbody-col:has( .cons ){ border-top: 6px solid var(--candy-apple); }

                .col-title {
                    font-family: 'Urbanist', 'Roboto', sans-serif;
                    font-size: var(--f-size-xl);
                    line-height: 1.3;
                    font-weight: 700;
                }
                .col-title.pro {
                    color: var(--oz);
                }
        
                .col-title.con {
                    color: var(--candy-apple);
                }
                
                .pro-cons .col-title {
                    position: relative;
                    display: inline-block;
                    line-height: var(--l-height-l);
                }

            .pro-cons ul{
                display: flex;
                list-style: none !important;
                flex-direction: column;
            }
            .pro-cons ul > * + * { margin-top: 5px; }
                .pro-cons ul li{
                    display: flex;
                    gap: var(--gap-s);
                }
                .pro-cons ul li:has(*){ flex-wrap: wrap; }

                .pro-cons ul li::before{
                    font-family: icomoon;
                    font-size: var(--f-size-l);
                    align-self: flex-start;
                }
                .pro-cons .pros li::before{content: "\ee76"; color: var(--oz);}
                .pro-cons .cons li::before{content: "\ed66"; color: var(--candy-apple);}

                .pro-cons ul li > *{ flex: 1 0 calc(100% - 30px); }
        
        @media all and (max-width:550px){
            .sub-form{flex-wrap: wrap;}
        }
    
        .loop-coupons {
            display: grid;
            gap: var(--gap-m);
        }
    
        .xs-list{
            display: grid;
        }
        @media all and (min-width: 550px){
            .xs-list{
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }

    /**** Compare Page ***/
        .cp-items{
            display: grid;
        }
            .cp-item{
                display: flex;
                flex-direction: column;
                gap: 20px;
            }
    
            .cp-items::before,
            .cp-x3.cp-items::after{
                content: "vs";
            }
    
            .cp-items::before{
                grid-area: 1 / 2 / 2 / 3;
            }
        
            .cp-x3.cp-items::after{
                grid-area: 1 / 4 / 2 / 5;
            }
    
            .cpi-1{grid-area: 1 / 1 / 2 / 2;}
            .cpi-2{grid-area: 1 / 3 / 2 / 4;}
            .cpi-3{grid-area: 1 / 5 / 2 / 6;}


    @media all and (min-width: 960px){

        .ext-box,
        .promobox{
            display: grid;
            grid-template: 1fr / 1fr 300px;
            position: relative;
        }

    }

    @media all and (max-width: 959px){
    
        .ext-box,
        .promobox{
            display: grid;
            grid-template: auto 1fr / 1fr;
            position: relative;
            gap: var(--gap-m);
        }

    }
    
    @media all and (min-width: 1200px){
        .cp-logo{max-width: 50%;}
    }
    
    @media all and (min-width: 960px) and (max-width: 1199px){
        .cp-logo{max-width: 70%;}
    }
    
    @media all and (min-width: 799px) and (max-width: 959px){
        .cp-logo{max-width: 60%;}
    
    }
    
    @media all and (min-width: 599px) and (max-width: 799px){
        .cp-logo{max-width: 75%;}
    }
    
    
    @media all and (min-width: 599px) and (max-width: 799px){
    
        .cp-x3{
            grid-template-columns: 1fr 40px 1fr 40px 1fr;
        }
        .cp-x2{
            grid-template-columns: 1fr 40px 1fr;
        }
    
        .cp-items::before,
        .cp-x3.cp-items::after{
            font-size: var(--f-size-xxl);
            line-height: var(--l-height-l);
            text-align: center;
            align-self: flex-end;
        }
    
                .cp-fav{
                    display: none;
                }
                .cp-name{
                    margin-top: auto;
                    justify-content: center;
                }
    
    }
    
    @media all and (min-width: 599px){
    
        .cp-items{
            display: grid;
        }
        .cp-x3{
            grid-template-columns: 1fr 40px 1fr 40px 1fr;
        }
        .cp-x2{
            grid-template-columns: 1fr 40px 1fr;
        }
    
        .cp-items::before,
        .cp-x3.cp-items::after{
            font-size: var(--f-size-xxl);
            line-height: var(--l-height-l);
            text-align: center;
            align-self: flex-end;
        }
    
                .cp-fav{
                    display: none;
                }
                .cp-name{
                    margin-top: auto;
                    justify-content: center;
                    text-align: center;
                }
    
    }
    
    
    @media all and (max-width: 599px){
    
        .cp-items{
            display: grid;
            overflow-x: scroll;
            overflow-y: visible;
        }
        .cp-x3{
            grid-template-columns: 45% 10% 45% 10% 45%;
        }
        .cp-x2{
            grid-template-rows: 1fr 40px 1fr;
        }
    
        .cp-items::before,
        .cp-x3.cp-items::after{
            font-size: var(--f-size-xl);
            line-height: var(--l-height-m);
            display: flex;
            justify-content: center;
            align-items: center;
            text-align: center;
        }
    
            .cp-logo{
                display: none;
            }
            .cp-fav{
                width: clamp(5rem, 1.1081rem + 10.8108vw, 9rem);
            }
    
            .cp-name{
                align-self: center;
                justify-content: center;
                text-align: center;
            }
    
    }
    
    
    
    @media all and (min-width: 550px){
    
        .rbody-row.short{
            grid-template: 1fr / 200px auto;
        }
    
    }

    @media all and (max-width: 549px){
    
        .rbody-row.short{
            grid-template: 1fr auto / auto;
        }
            .rbody-row.short .overview-logo{
                display: flex;
                flex-grow: 0;
                flex-shrink: 1;
                justify-self: center;
            }
    
    }

    .people-list{
        display: grid;
        justify-content: center;
    }

        .person{
            gap: var(--gap-s);
            width: 100%;
        }

            .person-avatar{
                width: 100%;
                height: auto;
            }
            .person-name{
                font-size: var(--f-size-s);
                line-height: 1;
                font-weight: 500;
            }
            .person-business{
                display: flex;
                flex-wrap: wrap;
                justify-content: center;
                text-align: center;
            }

                .person-position,
                .person-sep,
                .person-company{
                    font-size: var(--f-size-xxs);
                    line-height: 1.2;
                }
                .person-sep{ font-weight: 700; margin: 0 3px; }
                .person-company{ font-weight: 500; }


    .people-list.cols1{ gap: var(--gap-xxl); }
    .people-list.cols2{ gap: var(--gap-xl); }
    .people-list.cols3{ gap: var(--gap-l); }
    .people-list.cols4{ gap: var(--gap-m); }
    .people-list.cols5{ gap: var(--gap-m); }

    @media all and (min-width: 83px){                           .people-list.cols1{ grid-template-columns: repeat(1, minmax(0, 1fr)); } }


    @media all and (min-width: 683px){                          .people-list.cols2{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
    @media all and (max-width: 682px){                          .people-list.cols2{ grid-template-columns: repeat(1, minmax(0, 1fr)); } }


    @media all and (min-width: 771px){                          .people-list.cols3{ grid-template-columns: repeat(3, minmax(0, 1fr)); } }
    @media all and (min-width: 502px) and (max-width: 770px){   .people-list.cols3{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
    @media all and (max-width: 501px){                          .people-list.cols3{ grid-template-columns: repeat(1, minmax(0, 1fr)); } }


    @media all and (min-width: 810px){                          .people-list.cols4{ grid-template-columns: repeat(4, minmax(0, 1fr)); } }
    @media all and (min-width: 588px) and (max-width: 809px){   .people-list.cols4{ grid-template-columns: repeat(3, minmax(0, 1fr)); } }
    @media all and (min-width: 384px) and (max-width: 587px){   .people-list.cols4{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
    @media all and (max-width: 383px){                          .people-list.cols4{ grid-template-columns: repeat(1, minmax(0, 1fr)); } }


    @media all and (min-width: 838px){                          .people-list.cols5{ grid-template-columns: repeat(5, minmax(0, 1fr)); } }
    @media all and (min-width: 666px) and (max-width: 837px){   .people-list.cols5{ grid-template-columns: repeat(4, minmax(0, 1fr)); } }
    @media all and (min-width: 493px) and (max-width: 665px){   .people-list.cols5{ grid-template-columns: repeat(3, minmax(0, 1fr)); } }
    @media all and (max-width: 492px){                          .people-list.cols5{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }

        .companies{
            width: 100%;
            flex-wrap: wrap;
            gap: var(--gap-m);
            border: 1px solid #211f2033;
            border-left: 6px solid var(--bondi-blue);
            border-radius: var(--gap-m);
            padding: var(--gap-m) var(--gap-m) var(--gap-m) var(--gap-l);
            background: #fff;
            transition: box-shadow 0.2s ease-in;
        }
        .companies:hover {
            box-shadow: var(--b-s-glass);
        }
                .company{
                    gap: var(--gap-s);
                    position: relative;
                }
                .favicons .company{
                    filter: grayscale(1);
                    transition: filter .35s ease-in-out;
                }
                .favicons .company:hover{
                    filter: unset;
                }

                    .company-brand{
                        width: auto;
                    }
                    .favicons .company-brand{
                        height: 60px;
                    }

                    .logos .company-brand {
                        height: 75px;
                        filter: grayscale(1);
                        transition: filter 0.3s ease-in;
                    }
                    .companies:hover .company-brand {
                        filter: unset;
                    }


    .timelines{
        display: flex;
        flex-direction: column;
        gap: var(--gap-m);
    }

        .timeline{
            position: relative;
            display: flex;
            flex-direction: column;
            gap: var(--gap-s);
            border: 1px solid var(--umbra-2);
            border-radius: var(--b-r-l);
            padding: var(--gap-m);
            width: calc(100% - var(--gap-m));
        }
            .timeline::after {
                content: "";
                display: block;
                position: absolute;
                top: 0;
                right: calc(-1 * var(--gap-m));
                width: 4px;
                height: 100%;
                background: var(--governor-bay-2);
                border-radius: var(--b-r-s);
                transition: background-color 0.3s ease-in;
            }
            .timeline.active,
            .timeline:hover::after{ background-color: var(--governor-bay); }

            .timeline .time{
                width: fit-content;
                padding: var(--gap-s);
                border-radius: var(--b-r-xl);
                background-color: var(--governor-bay);
                color: var(--f-light-default);
                font-size: var(--f-size-m);
                line-height: 1;
                font-weight: 700;
                font-family: Roboto, sans-serif;
            }

            .timeline .title{
                font-size: var(--f-size-s);
                font-weight: 700;
            }

            .timeline .description{
                font-size: var(--f-size-xs);
                font-family: Roboto, sans-serif;
            }

                .timeline .people{
                    display: flex;
                    flex-direction: column;
                    gap: var(--gap-s);
                }
                    .timeline .person{
                        display: grid;
                        grid-template: 1fr 1fr / auto 1fr;
                        background-color: var(--governor-bay-1);
                        border-radius: var(--b-r-l);
                        padding: var(--gap-s);
                        gap: var(--gap-xs);
                    }
                        .timeline .person .avatar{
                            grid-area: 1 / 1 / 3 / 2;
                            width: var(--gap-xl);
                            height: auto;
                            border-radius: 100%;
                        }
                        .timeline .person .name{
                            grid-area: 1 / 2 / 2 / 3;
                        }
                        .timeline .person .business{
                            grid-area: 2 / 2 / 3 / 3;
                        }

    .coupon{
        position: relative;
        display: grid;
        grid-template-columns: auto 1fr auto;
        gap: var(--gap-l);
        border-radius: var(--gap-m);
        padding: var(--gap-l) var(--gap-m) var(--gap-m);
        border: 1px solid var(--umbra-2);
        border-top: 6px solid var(--governor-bay);
        background-color: var(--governor-bay-1);
    }

    @media all and (min-width: 1100px){
        .coupon{
            display: grid;
            grid-template-columns: auto 1fr auto;
            gap: var(--gap-l);
        }
    }

    @media all and (min-width: 960px) and (max-width: 1099px){
        .coupon{
            display: grid;
            grid-template-columns: auto 1fr;
            column-gap: var(--gap-l);
            row-gap: var(--gap-s);
        }
            .coupon .discount{ grid-area: 1 / 1 / 2 / 2; }
            .coupon .content{ grid-area: 1 / 2 / 2 / 3; }
            .coupon .cta{ grid-area: 2 / 2 / 3 / 3; }
    }

    @media all and (min-width: 650px) and (max-width: 959px){
        .coupon{
            display: grid;
            grid-template-columns: auto 1fr auto;
            gap: var(--gap-l);
        }
    }

    @media all and (min-width: 450px) and (max-width: 649px){
        .coupon{
            display: grid;
            grid-template-columns: auto 1fr;
            column-gap: var(--gap-l);
            row-gap: var(--gap-s);
        }
            .coupon .discount{ grid-area: 1 / 1 / 2 / 2; }
            .coupon .content{ grid-area: 1 / 2 / 2 / 3; }
            .coupon .cta{ grid-area: 2 / 2 / 3 / 3; }
    }

    @media all and  (max-width: 449px){
        .coupon{
            display: flex;
            flex-direction: column;
            gap: var(--gap-s);
        }
        .coupon .discount{
            align-self: center;
        }
    }

        .coupon .discount{
            display: flex;
            flex-direction: column;
            width: min-content;
            gap: var(--gap-xs);
            place-content: center;
            place-items: center;
            padding: var(--gap-s);
        }
        .coupon .discount .percentage,
        .coupon .discount .text{
            font-size: var(--f-size-5xl);
            font-weight: 700;
            line-height: 1;
        }

        .coupon .content{
            display: flex;
            flex-direction: column;
            gap: var(--gap-s);
            flex: 1 1 auto;
        }
            .coupon .title{
                font-size: var(--f-size-s);
                font-weight: 700;
            }
            .coupon .description{
                font-size: var(--f-size-xs);
                font-family: Roboto, sans-serif;
            }
            .coupon .expiration{
                font-size: var(--f-size-xs);
                font-family: Roboto, sans-serif;
                font-style: italic;
            }

        .coupon .cta{
            display: flex;
            align-self: center;
            width: fit-content;
        }

}.softwareArticles{
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        width: 100%;
        gap: var(--gap-m);
    }
    .sxsList{
        gap: var(--gap-m);
    }

        .sxsItem{
            padding: var(--gap-s);
            width: 100%;
            gap: var(--gap-s);
            cursor: pointer;
            border: 1px solid var(--umbra-1);
            border-radius: var(--b-r-xl);
        }

            .sxsBox{
                position: relative;
                display: grid;
                grid-template-columns: 48px 1fr;
                gap: var(--gap-s);
            }
                .sxsLogoBox{
                    position: relative;
                    aspect-ratio: 1;
                    width: 48px;
                    height: 48px;

                    background: var(--f-light-default);
                    border-radius: var(--b-r-l);
                    border: 1px solid hsl(220 13% 91%);
                    box-shadow: var(--shadow-sm);
                }
                    .sxsLogo{
                        width: 100%;
                        max-width: 100%;
                        height: auto;
                        max-height: 100%;
                        aspect-ratio: 1;
                        border-radius: var(--b-r-l);
                    }

                .sxsWho{
                    justify-content: space-between;
                }
                    .sxsName{
                        display: flex;
                        gap: var(--gap-s);
                        font-size: var(--f-size-xs);
                        line-height: 1.2;
                        font-weight: 600;
                        color: var(--umbra);
                    }

                    .sxsScore{}
                        .sxsScore .label{
                            font-size: var(--f-size-xs);
                            line-height: 1;
                            font-weight: 400;
                        }
                        .sxsScore .value{
                            font-size: var(--f-size-s);
                            line-height: 1;
                            font-weight: 600;
                            color: var(--umbra);
                        }

    @media all and (min-width: 1100px){

        .sxsItem{ flex: 0 0 calc( ( 100% - var(--gap-m) * 2 ) / 3 ); }

    }

    @media all and (min-width: 800px) and (max-width: 1099px){

        .sxsItem{ flex: 0 0 calc( ( 100% - var(--gap-m) * 2 ) / 2 ); }

    }


@layer loop{
    
    .s-software-box{}

    .s-box{
        padding: clamp(1rem, 0.4667rem + 1.3333vw, 3rem);
        width: 100%;
        gap: var(--gap-m);
    }

    .scroll-items.software .s-software-box{
        width: 220px;
        scroll-snap-align: start;
        scroll-snap-stop: normal;
    }
        .s-row{
            display: flex;
            flex-direction: row;
        }

        .s-head{
            display: grid;
            grid-template-columns: 200px 1fr 200px;
            gap: var(--gap-l);
        }
            .s-logo-box{
                /* margin: 0 0 var(--gap-m) 0; */
                position: relative;
                aspect-ratio: 1;
            }
                .s-logo-box a{
                    height: 100%;
                    max-height: 100%;
                }
                .s-logo{
                    width: min(90%, 220px);
                    padding: 0 5%;
                    height: auto;
                    align-self: center;
                    max-height: 100%;
                }

            .s-name{
                padding: var(--gap-s) 0;
                gap: var(--gap-s);
            }

                .s-title{
                    display: flex;
                    gap: var(--gap-s);
                    font-size: var(--f-size-l);
                    line-height: 100%;
                    font-weight: 500;
                    color: var(--governor-bay);
                }
                    .s-title .icon-new-tab2{
                        color: var(--governor-bay);
                    }

                    .s-verified{
                        font-size: var(--f-size-xxxs);
                        position: relative;
                        flex-grow: 0;
                        width: 100%;
                    }
                        .status{
                            cursor: pointer;
                            width: max-content;
                        }
                        .status.unverified{
                            background: #909090;
                            padding: 0 var(--gap-s);
                            align-self: center;
                            border-radius: 5px;
                        }
                        .status.verified{
                            background: var(--bondi-blue);
                            padding: 0 var(--gap-s);
                            align-self: center;
                            border-radius: 5px;
                        }
                        .status.premium{
                            position: relative;
                            background: var(--linear-gr-1);
                            padding: 0 var(--gap-s);
                            align-self: center;
                            border-radius: 5px;
                        }

                            .s-verified .verif-msg{
                                height: var(--l-height-m);
                                line-height: 1;
                                color: var(--f-light-default);
                                text-transform: uppercase;
                                letter-spacing: 1px;
                                z-index: 3;
                            }

                            .s-verified .icon-info{
                                height: var(--l-height-m);
                                line-height: 1;
                                color: var(--f-light-default);
                                font-size: var(--f-size-xxxs);
                                z-index: 3;
                            }


                        .info-msg-box{
                            position: absolute !important;
                            z-index: 99;
                            background: var(--f-light-default);
                            top: 100%;
                            left: 0;
                            width: auto;
                            max-width: 100%;
                            display: none;
                        }
                        .status:hover + .info-msg-box{
                            display: block;
                        }
                            .info-msg{
                                padding: var(--gap-s);
                                font-size: var(--f-size-xxxs);
                                line-height: var(--l-height-s);
                            }


                .s-ratings{
                    position: relative;
                    max-width: min( 100%, 200px);
                }

                    .s-rs-txt{
                        font-size: var(--f-size-xxxs);
                        line-height: 14px;
                        justify-content: space-between;
                    }
                    .s-rs-txt:after{
                        content: attr(data-rating);
                        font-size: var(--f-size-xxs);
                        width: 25px;
                    }

                    .s-rs-ux{
                        height: 2px;
                    }

                    .s-rs-ux:after{
                        content: '';
                        position: absolute;
                        width: 100%;
                        height: 2px;
                        background-color: #a9a9a9;
                        z-index: -1;
                    }
                    .s-rs-ux.tekpon{
                        background-image: var(--linear-gr-2);
                    }
                    .s-rs-ux.users{
                        width: calc(74% - 30px);
                        background-image: var(--linear-gr-1);
                    }

                        .s-rs-ux .s-rs-dot{
                            width: 8px;
                            height: 8px;
                            border-radius: 100%;
                            align-self: center;
                            margin-left: auto;
                        }
                        .s-rs-ux.tekpon .s-rs-dot{
                            background-color: var(--candy-apple);
                        }
                        .s-rs-ux.users .s-rs-dot{
                            background-color: var(#4735af);
                        }

            .go-review{
                margin-top: auto;
                font-size: var(--f-size-xs);
                line-height: var(--l-height-s);
                font-weight: 500;
                width: min-content;
                white-space: nowrap;
                color: var(--governor-bay);
            }
            .go-review:hover{
                text-decoration: underline;
            }

            .s-btns-box{
                padding: var(--gap-s) 0;
            }

                .s-software-btn{}

                .s-deal-btn{}

                .s-website-btn{
                    display: flex;
                    justify-content: center;
                    gap: var(--gap-xs);
                }
                .s-website-btn span{
                    font-size: var(--f-size-l);
                    color: #fff;
                    line-height: var(--l-height-xl);
                }

        .s-body{}

                .s-learn-more{
                    color: var(--governor-bay);
                    font-weight: 500;
                }

        .s-footer{}
            .ua-compare{
                gap: var(--gap-xs);
                cursor: pointer;
            }
            body:not( .software ) .section-desc .ua-compare{ display: none; }

                .ua-compare span{
                    font-size: var(--f-size-s);
                    line-height: var(--l-height-m);
                    color: var(--governor-bay);
                }
                .ua-compare-txt{
                    color: var(--governor-bay);
                    font-size: var(--f-size-s);
                    line-height: var(--l-height-m);
                    font-weight: 500;
                }

                .ua-compare .off{display: inline;}
                .ua-compare .on{display: none;}

                .ua-compare.add .off{display: none;}
                .ua-compare.add .on{display: inline;}

            .sponsor{
                position: absolute;
                right: clamp(1rem, .4667rem + 1.3333vw, 3rem);
                bottom: clamp(1rem, .4667rem + 1.3333vw, 3rem);
                font-size: 12px;
                line-height: 1;
                color: var(--gray-light);
                text-transform: uppercase;
                font-weight: 500;
            }




    @media all and (min-width: 650px){

    .s-head{
        grid-template-columns: clamp(130px, 45%, 150px) 1fr 200px;
        gap: var(--gap-l);
    }

    .s-btns-box{
        display: flex;
        flex-direction: column;
        gap: var(--gap-l);
    }

    .s-excerpt{
        font-size: var(--f-size-s);
        line-height: var(--l-height-m);
    }

        .excerpt{
            display: inline;
        }
    }

    @media all and (max-width: 649px){


        .s-head{
            /* grid-template-columns: min(200px, 40%) 1fr; */
            gap: var(--gap-m);

            grid-template-columns: min(120px, 40%) 1fr;
            grid-template-rows: 1fr 50px;
            row-gap: var(--gap-s);
        }

            .s-logo-box {
                /* grid-area: 1 / 1 / 3 / 2; */
                grid-area: 1 / 1 / 2 / 2;
            }
            .s-name {
                /* grid-area: 1 / 2 / 2 / 3; */
                grid-area: 1 / 2 / 2 / 3;
            }

            .s-btns-box {
                grid-area: 2 / 1 / 3 / 3;

                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: var(--gap-s);
            }
                .s-btn-box{
                    justify-content: flex-start;
                    align-items: flex-start;
                    margin-top: auto;
                }

            .s-excerpt {
                font-size: var(--f-size-xs);
                line-height: var(--l-height-s);
            }
                .excerpt{
                    display: block;
                    max-height: calc(var(--l-height-s) * 3);
                    overflow: hidden;
                    margin-bottom: var(--gap-s);
                    position: relative;
                    transition: max-height 0.5s ease-in;
                }

                .excerpt::after{
                    font-family: 'icomoon' !important;
                    speak: never;
                    font-style: normal;
                    font-weight: normal;
                    font-variant: normal;
                    text-transform: none;
                    -webkit-font-smoothing: antialiased;
                    -moz-osx-font-smoothing: grayscale;

                    display: flex;
                    align-items: flex-end;
                    justify-content: center;
                    
                    content: "\edc0";
                    position: absolute;
                    right: 0;
                    bottom: -3px;
                    width: 100%;

                    background: linear-gradient(to top, #fff 0%, #fff 25%, rgb(255 255 255 / 95%) 50%, rgb(255 255 255 / 61%) 100%);
                    text-align: center;
                    line-height: 1;
                    height: 33px;
                    font-size: var(--f-size-l);
                }

                .m-open.excerpt{
                    max-height: 300px;
                    margin-bottom: 0;
                }
                .m-open.excerpt::after{display: none;}
    }

    @media all and (min-width: 550px){

        @keyframes score-ux {
            from {max-width: 8px;}
            to {max-width: 200px;}
        }
    
        .s-rs-ux{
            animation: score-ux 1s linear;
        }

    }

    @media all and (max-width: 499px){

        .s-software-body{
            gap: var(--gap-m);
        }
        .no-gap .s-software-body > * + *{ margin-top: var(--gap-s);}

        .s-software-btn-box {
            margin-top: auto;
        }

    }

    @media all and (max-width: 379px){
        .s-head{
            grid-template-rows: 1fr auto;
        }
            .s-btns-box {    
                grid-template-columns: 1fr;
                grid-template-rows: 1fr 1fr;
                gap: var(--gap-s);
            }

    }


}

@layer loop{

    .deals-box{
        display: grid;
    }
    @media all and (min-width: 530px){
        .deals-box{
            grid-template-columns: repeat( 2, 1fr );
        }
    }
    @media all and (max-width: 529px){
        .deals-box{
            grid-template-columns: 1fr;
        }
    }

        .deal-box{
            position: relative;
            
            box-shadow: 0px 5px 20px rgb(130 130 130 / 25%);
            border-radius: var(--b-r-l);
            /* background: #fff; */

            padding: var(--gap-s);
            display: grid;
        }
        .deal-box.exclusive{
            border: 5px solid transparent;

            background-image:
            linear-gradient(white, white),
            linear-gradient(180deg, var(--f-light-other), var(--governor-bay));

            background-repeat: no-repeat;
            background-size: 100% 100%, 100% 200%;
            background-position: 0 0, 0 100%;
            background-origin: padding-box, border-box;
            animation: spin 2.5s linear infinite alternate;

        }

        .deal-box.expired{
            filter: grayscale(100%);
            -webkit-filter: grayscale(100%);
            background: var(--exp-gr);
        }

        .scroll-items.deals .deal-box{
            width: 465px;
            scroll-snap-align: start;
            scroll-snap-stop: normal;
        }


            .deal-logo-box{
                position: relative;
                -moz-box-shadow: var(--b-s-glass);
                -webkit-box-shadow: var(--b-s-glass);
                box-shadow: var(--b-s-glass);
                border-radius: var(--b-r-l);

                padding: var(--gap-s);

                width: auto;
            }
                .deal-logo{
                    width: min(100%, 150px);
                    aspect-ratio: 1/1;
                    height: auto;
                }

            .deal-name{
                width: 100%;
                gap: var(--gap-xxs);
            }
                .deal-cat{}
                .deal-exclusive{
                    border-radius: 10px;
                    font-size: var(--f-size-xxxs);
                    line-height: var(--l-height-xs);
                    color: #ffffff;
                    background-color: var(--governor-bay);
                    width: min-content;
                    max-width: 100%;
                    padding: 0 var(--gap-s);
                }
                .deal-title{
                    font-size: var(--f-size-m);
                    line-height: var(--l-height-m);
                    font-weight: 500;
                }

            .deal-details{
                width: 100%;
                flex-wrap: wrap;
                gap: var(--gap-s);
            }
                .deal-excerpt{}
                .deal-url{
                    font-size: var(--f-size-s);
                    line-height: var(--l-height-s);
                    font-weight: 500;
                    color: var(--governor-bay);
                }

        @media all and (min-width: 770px){

            .deal-box{
                place-items: center;
                grid-column-gap: var(--gap-m);

                grid-template: auto auto / clamp(100px, 35%, 150px) 1fr;
            }

                .deal-logo-box{
                    grid-area: 1 / 1 / 3 / 2;
                }

                .deal-name{
                    grid-area: 1 / 2 / 2 / 3;
                    height: 100%;
                    justify-content: center;
                }
                    .deal-cat{

                        font-size: var(--f-size-xs);
                        line-height: var(--l-height-s);
                    }
                    .deal-title{
                        grid-area: 1 / 2 / 2 / 3;

                    }
                
                .deal-details{
                    grid-area: 2 / 2 / 3 / 3;
                    justify-content: space-between;
                }
                    .deal-excerpt{

                        font-size: var(--f-size-xs);
                        line-height: var(--l-height-xs);
                    }
                    .deal-url{
                    }

        }

        @media all and (min-width: 530px) and (max-width: 769px){

            .deal-box{
                place-content: center;
                place-items: center;
                grid-column-gap: var(--gap-m);
                grid-row-gap: var(--gap-s);

                grid-template: 170px auto 1fr / 1fr;
            }

                .deal-logo-box{
                    grid-area: 1 / 1 / 2 / 2;
                    align-self: flex-start;
                    width: auto;
                    max-width: 100%;
                    height: 100%;
                    aspect-ratio: 1/1;
                }

                .deal-name{
                    grid-area: 2 / 1 / 3 / 2;
                }
                    .deal-cat{
                        font-size: var(--f-size-xs);
                        line-height: var(--l-height-xxs);
                    }
                    .deal-excerpt{
                        font-size: var(--f-size-xs);
                        line-height: var(--l-height-xxs);
                    }
                .deal-details{
                    justify-content: space-between;
                    grid-area: 3 / 1 / 4 / 2;
                }
                    .deal-url{margin-top: auto;}

        }
        

        @media all and (min-width: 360px) and (max-width: 529px){

            .deal-box{
                grid-template: auto auto / clamp(100px, 35%, 150px) 1fr;
                place-content: center;
                place-items: center;
                grid-column-gap: var(--gap-m);
                grid-row-gap: var(--gap-xxs);
            }

                .deal-logo-box{
                    grid-area: 1 / 1 / 3 / 2;
                    width: auto;
                    max-width: 100%;
                }

                .deal-name{
                    grid-area: 1 / 2 / 2 / 3;
                    height: 100%;
                    justify-content: center;
                }
                    .deal-cat{

                        font-size: var(--f-size-xs);
                        line-height: var(--l-height-s);
                    }
                    .deal-title{
                        grid-area: 1 / 2 / 2 / 3;

                    }
                
                .deal-details{
                    grid-area: 2 / 2 / 3 / 3;
                    justify-content: space-between;
                }
                    .deal-excerpt{

                        font-size: var(--f-size-xs);
                        line-height: var(--l-height-xs);
                    }
                    .deal-url{
                    }

        }

        @media all and (max-width: 359px){

            .deal-box{
                place-content: center;
                place-items: center;
                grid-column-gap: var(--gap-m);
                grid-row-gap: var(--gap-s);

                grid-template: 170px auto 1fr / 1fr;
            }

                .deal-logo-box{
                    grid-area: 1 / 1 / 2 / 2;
                    align-self: flex-start;
                }

                .deal-name{
                    grid-area: 2 / 1 / 3 / 2;
                }
                    .deal-cat{
                        font-size: var(--f-size-xs);
                        line-height: var(--l-height-xxs);
                    }
                    .deal-excerpt{
                        font-size: var(--f-size-xs);
                        line-height: var(--l-height-xxs);
                    }
                .deal-details{
                    justify-content: space-between;
                    grid-area: 3 / 1 / 4 / 2;
                }
                    .deal-url{margin-top: auto;}

        }

        @media all and (max-width: 340px){
            .deal-logo-box{
                padding: var(--gap-s);
            }
        }
    
}

@layer loop{

    .insightsArticles:not( .featured ) {
        display: grid;
        grid-template-columns: repeat( auto-fit, minmax( 275px, 1fr ) );
        gap: var(--gap-m);
    }

    section.featured .insights.featured.f1{
        display: flex;
    }

    .insightsArticles.featured.f2,
    .insightsArticles.featured.f3{
        display: grid;
        grid-template-columns: repeat( auto-fit, minmax( 275px, 1fr ) );
        gap: var(--gap-m);
    }

        .insightsArticles.featured.f2 article.insight,
        .insightsArticles.featured.f3 article.insight{ flex-direction: column; }

            article.insight{
                width: 100%;
                display: flex;
                gap: var(--gap-m);
                border: 1px solid var(--umbra-2);
                border-radius: var(--b-r-l);
            }

            .insightsArticles.featured article.insight{
                box-shadow: unset;
                transition: scale 0.2s ease-in, box-shadow 0.2s ease-in;
            }

            .insightsArticles:not( .featured ) article.insight{ flex-direction: column; }

            .insightsArticles.featured article.insight:hover{ 
                scale: 1.05; 
                box-shadow: var(--shadow-sm);
            }

                .insightCTA{
                    display: flex;
                    flex-direction: column;
                    gap: var(--gap-m);
                    height: 100%;
                    cursor: pointer;
                }
                .insightCTA:hover{ text-decoration: none; cursor: pointer; }

                    .thumbBox{
                        width: 100%;
                        position: relative;
                        display: flex;
                        flex-direction: column;
                        justify-content: center;
                    }
                    .insightsArticles:not( .featured ) .thumbBox{
                        flex: 0 0 auto;
                        aspect-ratio: 1000 / 563;
                        border-radius: var(--b-r-l) var(--b-r-l) 0 0;
                        overflow: hidden;
                    }

                        .insightThumbnail{ 
                            width: 100%;
                            height: auto;
                        }
                        .insightsArticles:not( .featured ) .insightThumbnail{ transition: scale 0.2s ease-in; }
                        .insightsArticles:not( .featured ) .insightCTA:hover .insightThumbnail{ scale: 1.15; }

                    .insight .body{
                        flex-grow: 1;
                        height: 100%;
                        padding: 0 var(--gap-m) var(--gap-m);
                    }

                        article.insight .insightTopic{
                            width: fit-content;
                            font-family: Roboto, sans-serif;
                            font-size: var(--f-size-xxxs);
                            line-height: 1;
                            font-weight: 500;
                            text-transform: uppercase;
                            white-space: nowrap;
                            padding: var(--gap-xs) var(--gap-s);
                            border-width: 1px;
                            border-style: solid;
                            border-radius: var(--b-r-xl);
                        }

                        article.insight .insightTopic.umbra{
                            border-color: var(--umbra);
                            color: var(--umbra);
                            background-color: var(--umbra-1);
                        }

                        article.insight .insightTopic.governor{
                            border-color: var(--governor-bay);
                            color: var(--governor-bay);
                            background-color: var(--governor-bay-1);
                        }

                        article.insight .insightTopic.bondi{
                            border-color: var(--bondi-blue);
                            color: var(--bondi-blue);
                            background-color: var(--bondi-blue-1);
                        }

                        article.insight .insightTopic.calypso{
                            border-color: var(--calypso);
                            color: var(--calypso);
                            background-color: var(--calypso-1);
                        }

                        article.insight .insightTopic.oz{
                            border-color: var(--oz);
                            color: var(--oz);
                            background-color: var(--oz-1);
                        }

                        article.insight .insightTopic.thunderdome{
                            border-color: var(--thunderdome);
                            color: var(--thunderdome);
                            background-color: var(--thunderdome-1);
                        }

                        article.insight .insightTopic.candy{
                            border-color: var(--candy-apple);
                            color: var(--candy-apple);
                            background-color: var(--candy-apple-1);
                        }

                        article.insight .insightTopic.norman{
                            border-color: var(--norman);
                            color: var(--norman);
                            background-color: var(--norman-1);
                        }

                        article.insight .insightTopic.sorbet{
                            border-color: var(--sorbet);
                            color: var(--sorbet);
                            background-color: var(--sorbet-1);
                        }

                        article.insight .insightTopic.marigold{
                            border-color: var(--marigold);
                            color: var(--marigold);
                            background-color: var(--marigold-1);
                        }

                        .insightTitle{
                            display: -webkit-box;
                            -webkit-line-clamp: 2;
                            -webkit-box-orient: vertical;
                            overflow: hidden;
                            font-size: var(--f-size-m);
                            line-height: 1.3;
                            font-weight: 700;
                        }

                        article.insight .body .excerpt{
                            display: -webkit-box;
                            -webkit-line-clamp: 3;
                            -webkit-box-orient: vertical;  
                            overflow: hidden;
                            font-family: Roboto, sans-serif;
                            font-size: var(--f-size-xs);
                            line-height: var(--l-height-s);
                        }

                        .metas {
                            gap: var(--gap-s);
                            justify-content: space-between;
                            margin-top: auto;
                        }
                        /* .insightsArticles:not( .featured ) .metas{ margin-top: auto; } */

                            .metas .meta{
                                font-family: Roboto, sans-serif;
                            }

                            .meta.author{
                                font-size: var(--f-size-xxs);
                                line-height: 1;
                                font-weight: 300;
                                font-style: normal;
                            }

                            .meta.date{
                                font-size: var(--f-size-xxs);
                                line-height: 1;
                                font-weight: 300;
                            }
                                .meta .icon{
                                    font-size: var(--f-size-xxs);
                                    line-height: 1;
                                }
                                .meta.date .value{ font-family: Roboto, sans-serif; }

    .pagination {
        gap: var(--gap-l);
        grid-column: 1/-1;
    }

    @media all and (min-width: 960px) and (max-width: 1049px){

        article.insight .body .excerpt{ -webkit-line-clamp: 3; }

    }
    
    @media all and (min-width: 960px) and (max-width: 1049px){

        article.insight .body .excerpt{ -webkit-line-clamp: 2; }

    }

    @media all and (min-width: 960px){

        .insightsArticles.featured.f1 article.insight{
            display: grid;
            grid-template-columns: repeat( 2, 1fr );
        }

        .insightsArticles:not( .featured.f1 ) .thumbBox{ border-bottom: 1px solid var(--umbra-1); }
        .insightsArticles.featured.f1 .thumbBox{ border-right: 1px solid var(--umbra-1); }

            .insightsArticles:not( .featured.f1 ) .insightThumbnail{ border-radius: var(--b-r-l) var(--b-r-l) 0 0; }
            .insightsArticles.featured.f1 .insightThumbnail{ border-radius: var(--b-r-l) 0 0 var(--b-r-l); }

            .insightsArticles.featured.f1 .insight .body{
                padding: var(--gap-m) var(--gap-m) var(--gap-m) 0;
            }

    }

    @media all and (max-width: 959px){

        .insightsArticles.featured.f1 article.insight{
            display: flex;
            flex-direction: column;
            flex-wrap: wrap;
        }

            .thumbBox{ border-bottom: 1px solid var(--umbra-1); }

                .insightThumbnail{ border-radius: var(--b-r-l) var(--b-r-l) 0 0; }

            article.insight .body .excerpt{ -webkit-line-clamp: 3; }

    }

}