:root{
    --font-global: 'Montserrat', sans-serif;
    --font-alt: 'Montserrat', sans-serif;
    --section-padding-y: 140px;
    --color-dark-1: #2f3749;
    --color-dark-2: #384053;
    --color-dark-3: #414a5e;
    --color-dark-3a: #4e5a76;
    --color-dark-4: #555960;
    --color-gray-1: #6f7780;
    --color-gray-2: #747f8c;
    --color-gray-3: #8a95a2;
    --color-primary-1: #2454d6;
    --color-primary-1-a: #1d43ab;
    --color-primary-light-1: #e3ebfc;
    --color-primary-light-1-a: #c3d6f5;
    --color-primary-2: #5b46a2;
    --color-primary-light-2: #e9e4f7;
    --color-primary-3: #92386e;
    --color-primary-light-3: #f6e3ee;
    --color-primary-4: #c92a3a;
    --color-primary-light-4: #fbe1e3;
    --color-secondary-1: #f6d0d5;
    --color-gray-light-1: #f5f7fa;
    --color-gray-light-2: #f7f9fc;
    --color-gray-light-3: #cad0d7;
    --color-gray-light-4: #d5d7d8;
    --color-gray-light-5: #cccdcf;
    --color-gray-light-6: #bbbdbf;
    --gradient-gray-light-1: linear-gradient(0deg, #f7f9fc 0%, #fff 100%);
    --gradient-gray-light-2: linear-gradient(0deg, #fff 0%, #f7f9fc 100%);
    --border-radius-default: 5px;
    --box-shadow: 0px 5px 10px 0px rgba(30, 36, 50, 0.05),0px 1px 1px 0px rgba(30, 36, 50, 0.03),0px 3px 5px 0px rgba(30, 36, 50, 0.03);
    --box-shadow-strong: 0px 5px 10px 0px rgba(30, 36, 50, 0.08),0px 1px 1px 0px rgba(30, 36, 50, 0.06),0px 3px 5px 0px rgba(30, 36, 50, 0.06);
    --box-shadow-block: 0px 10px 30px 0px rgba(30, 36, 50, 0.07),0px 0px 1px 0px rgba(30, 36, 50, 0.1);
    --box-shadow-block-strong: 0px 15px 50px 0px rgba(30, 36, 50, 0.14),0px 0px 1px 0px rgba(30, 36, 50, 0.15);
}
.dark-mode{
    --color-primary-1: #6f95f2;
    --color-primary-2: #8f7bd4;
    --color-primary-3: #c96b9e;
    --color-primary-4: #ef6a72;
    --gradient-primary-1: linear-gradient( 90deg, var(--color-primary-4) 0%, var(--color-primary-3) 33%, var(--color-primary-2) 67%, var(--color-primary-1) 100%);
    --gradient-primary-1-a: linear-gradient( 90deg, var(--color-primary-4) 25%, var(--color-primary-3) 40%, var(--color-primary-2) 60%, var(--color-primary-1) 75%);
    --gradient-primary-1-b: linear-gradient( 45deg, var(--color-primary-4) 0%, var(--color-primary-3) 33%, var(--color-primary-2) 67%, var(--color-primary-1) 100%);
    --gradient-primary-1-c: linear-gradient( 0deg, var(--color-primary-4) 0%, var(--color-primary-3) 33%, var(--color-primary-2) 67%, var(--color-primary-1) 100%);
    --gradient-dark-alpha-1: linear-gradient( 90deg, var(--color-dark-1) 40%, transparent 87%);
    --gradient-dark-alpha-2: linear-gradient( 90deg, transparent 13%, var(--color-dark-1) 60%);
    --gradient-primary-alpha-1: linear-gradient( 90deg, var(--color-primary-1) 40%, transparent 87%);
    --gradient-primary-alpha-2: linear-gradient( 90deg, transparent 13%, var(--color-primary-1) 60%);
}
body{
    color: var(--color-dark-1);
    font-family: var(--font-global);
    font-size: 17px;
    font-weight: 400;
    line-height: 1.75;
    letter-spacing: normal;
    word-spacing: normal;
}
h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6{
    font-weight: 700;
    letter-spacing: -0.01em;
}
h3, .h3{
    font-size: 28px;
    letter-spacing: -0.02em;
}
b, strong{
    font-weight: 600;
}
.inner-nav ul li a{
    font-weight: 500;
}
.btn-mod{
    font-weight: 600 !important;
}
.small{
    font-size: 0.8em;
}
hr:not([size]){
    background: var(--color-dark-1);
    height: 1px;
    opacity: .1;
}
.bg-dark-alpha:before,
.bg-dark-alpha .YTPOverlay:before{
    background: #101828;
    opacity: .97;
}
.bg-dark-alpha-30:before,
.bg-dark-alpha-30 .YTPOverlay:before{
    background: #101828;
    opacity: .3;
}
.bg-dark-alpha-50:before,
.bg-dark-alpha-50 .YTPOverlay:before{
    background: #101828;
    opacity: .5;
}
.bg-dark-alpha-60:before,
.bg-dark-alpha-60 .YTPOverlay:before{
    background: #101828;
    opacity: .6;
}
.bg-dark-alpha-70:before,
.bg-dark-alpha-70 .YTPOverlay:before{
    background: #101828;
    opacity: .7;
}
.bg-dark-alpha-80:before,
.bg-dark-alpha-80 .YTPOverlay:before{
    background: #101828;
    opacity: .8;
}
.bg-dark-alpha-90:before,
.bg-dark-alpha-90 .YTPOverlay:before{
    background: #101828;
    opacity: .9;
}
.scroll-down-4{
    border-width: 1px;
}
.hs-status{
    border-width: 1px;
}
.light-content .section-caption-fancy{   
    background-image: linear-gradient(15deg, rgba(18,29,51, .75) 0%, transparent 100%);
}
.main-nav.dark{
    background-color: rgba(16,24,40, .8777);
}
.main-nav.dark-mode{
    background-color: rgba(65,75,92, .9);
}
.inner-nav ul{
    font-size: 16px;
    letter-spacing: normal;
}
.inner-nav ul li {
    margin: 0 18px;
}
.inner-nav > ul > li > a {
    opacity: .775;
}
.inner-nav ul li a{
    position: relative;
}
.mn-sub{
    background: rgba(72,80,100, .9927);
}
.mobile-on .desktop-nav ul{
    background: rgba(72,80,100, .99);
}
.mobile-on .desktop-nav ul li a,
.inner-nav ul li .mn-sub li a,
.mn-group-title{
    color: rgba(255,255,255, .9) !important;
 
}
.form label{
    margin-bottom: 10px;
    font-size: 18px;
    font-weight: 500;
}
.form .form-group{
    margin-bottom: 25px;
}
.form-tip,
.form-tip a{
    color: var(--color-dark-1);
    font-size: 13px;
    line-height: 1.53;
}
.form-tip a:hover{
    color: var(--color-gray-1);
}
.form input[type="text"],
.form input[type="email"],
.form input[type="number"],
.form input[type="url"],
.form input[type="search"],
.form input[type="tel"],
.form input[type="password"],
.form input[type="date"],
.form input[type="color"],
.form select,
.form textarea{
    border-color: rgba(52,61,85, .183);
}
.form select:not([multiple]){
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="9px" height="5px"><path fill-rule="evenodd" fill="#343d55" d="M8.886,0.631 L8.336,0.117 C8.263,0.049 8.178,0.015 8.083,0.015 C7.988,0.015 7.903,0.049 7.830,0.117 L4.506,3.155 L1.183,0.117 C1.109,0.049 1.025,0.015 0.930,0.015 C0.834,0.015 0.750,0.049 0.677,0.117 L0.127,0.631 C0.053,0.699 0.017,0.778 0.017,0.867 C0.017,0.956 0.053,1.035 0.127,1.103 L4.253,4.892 C4.327,4.960 4.411,4.994 4.506,4.994 C4.602,4.994 4.686,4.960 4.759,4.892 L8.886,1.103 C8.959,1.035 8.996,0.956 8.996,0.867 C8.996,0.778 8.959,0.699 8.886,0.631 L8.886,0.631 Z"/></svg>');  
}
.form input[type="text"]:hover,
.form input[type="email"]:hover,
.form input[type="number"]:hover,
.form input[type="url"]:hover,
.form input[type="search"]:hover,
.form input[type="tel"]:hover,
.form input[type="password"]:hover,
.form input[type="date"]:hover,
.form input[type="color"]:hover,
.form select:hover,
.form textarea:hover{
    border-color: rgba(52,61,85, .38);
}
.form input[type="text"]:focus,
.form input[type="email"]:focus,
.form input[type="number"]:focus,
.form input[type="url"]:focus,
.form input[type="search"]:focus,
.form input[type="tel"]:focus,
.form input[type="password"]:focus,
.form input[type="date"]:focus,
.form input[type="color"]:focus,
.form select:focus,
.form textarea:focus{
    border-color: rgba(52,61,85, .7);
    box-shadow: 0 0 3px rgba(52,61,85, .3);
}
.form input[type="text"]::placeholder,
.form input[type="email"]::placeholder,
.form input[type="number"]::placeholder,
.form input[type="url"]::placeholder,
.form input[type="search"]::placeholder,
.form input[type="tel"]::placeholder,
.form input[type="password"]::placeholder,
.form input[type="date"]::placeholder,
.form input[type="color"]::placeholder,
.form select::placeholder,
.form textarea::placeholder{
    color: var(--color-gray-1);
}
.form input[type="text"].input-md,
.form input[type="email"].input-md,
.form input[type="number"].input-md,
.form input[type="url"].input-md,
.form input[type="search"].input-md,
.form input[type="tel"].input-md,
.form input[type="password"].input-md,
.form input[type="date"].input-md,
.form input[type="color"].input-md,
.form select.input-md{
    height: 56px;
    font-size: 17px;
}
.form textarea.input-md{
    padding-top: 14px;
    padding-bottom: 14px;
    font-size: 17px;
}
.form input[type="text"].input-lg,
.form input[type="email"].input-lg,
.form input[type="number"].input-lg,
.form input[type="url"].input-lg,
.form input[type="search"].input-lg,
.form input[type="tel"].input-lg,
.form input[type="password"].input-lg,
.form input[type="date"].input-lg,
.form input[type="color"].input-lg,
.form select.input-lg{
    height: 62px;
    font-size: 18px;
}
.light-content input[type="text"],
.light-content input[type="email"],
.light-content input[type="number"],
.light-content input[type="url"],
.light-content input[type="search"],
.light-content input[type="tel"],
.light-content input[type="password"],
.light-content input[type="date"],
.light-content input[type="color"],
.light-content select,
.light-content textarea{
    border-color: rgba(255,255,255, .25);
}
.light-content input[type="text"]:hover,
.light-content input[type="email"]:hover,
.light-content input[type="number"]:hover,
.light-content input[type="url"]:hover,
.light-content input[type="search"]:hover,
.light-content input[type="tel"]:hover,
.light-content input[type="password"]:hover,
.light-content input[type="date"]:hover,
.light-content input[type="color"]:hover,
.light-content select:hover,
.light-content textarea:hover{
    border-color: rgba(255,255,255, .35);
}
.light-content input[type="text"]:focus,
.light-content input[type="email"]:focus,
.light-content input[type="number"]:focus,
.light-content input[type="url"]:focus,
.light-content input[type="search"]:focus,
.light-content input[type="tel"]:focus,
.light-content input[type="password"]:focus,
.light-content input[type="date"]:focus,
.light-content input[type="color"]:focus,
.light-content select:focus,
.light-content textarea:focus{
    border-color: rgba(255,255,255, .75);
}
.icon-info {
    top: 0.07em;
}
.btn-mod,
a.btn-mod{
    font-weight: 500;
}
.btn-mod.btn-border-c{
    border-color: var(--color-primary-light-1-a);
}
.btn-mod.btn-border-c:hover,
.btn-mod.btn-border-c:focus{
    background: transparent;
    color: var(--color-primary-1);
    border-color: var(--color-primary-light-1-a);
}
.btn-mod.btn-small{
    padding: 10px 22px;
    font-size: 16px;
    font-weight: 500;
    text-transform: none;
    letter-spacing: normal;
}
.btn-mod.btn-grad.btn-small{
    padding: 11px 22px;
}
.btn-mod.btn-medium{
    padding: 15px 40px;
    font-size: 16px;
    font-weight: 500;
    text-transform: none;
    letter-spacing: normal;
}
.btn-mod.btn-grad.btn-medium{
    padding: 16px 40px;
}
.btn-mod.btn-large{
    padding: 20px 50px 21px;
    font-size: 18px;
    font-weight: 500;
    text-transform: none;
    line-height: 1;
    letter-spacing: normal;
}
.btn-mod.btn-grad.btn-large{
    padding: 21px 50px 22px;
}
.big-icon{
    color: var(--color-primary-1);
}
.hs-title-1{
    font-size: 64px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.02em;
}
.light-content .toggle,
.light-content .toggle > dt > a,
.light-content .accordion,
.light-content .accordion > dt > a{
    border-color: rgba(255,255,255, .25);
}
.accordion > dt > a:after,
.toggle > dt > a:after{
    background: var(--gradient-primary-1-a);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.light-content .accordion > dt > a:after,
.light-content .toggle > dt > a:after{
    color: #fff;
}
.composition-4-image-1{
    border-color: var(--color-gray-light-3);
}
.composition-4-image-2{
    border-color: var(--color-gray-light-3);
}
.scroll-down-1-icon:before{
    opacity: .7;
}
.scroll-down-1-icon svg,
.scroll-down-1-icon img{
    opacity: .7;
}
.scroll-down-1-icon i{
    opacity: .7;
}
.scroll-down-1-text{
    font-weight: 500;
    opacity: .7;
    transition: opacity 0.4s ease, transform 0.4s var(--ease-elastic-2);
}
.typewrite .wrap:after{
    font-size: 0.9em;
}
.section-caption-fancy{
    padding: 9px 12px;
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0.1em;
    background-image: linear-gradient( 45deg, var(--color-primary-light-1) 0%, transparent 100%);
}
.section-title{
    font-size: 48px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.02em;
}
.section-title-small{
    font-size: 30px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.01em;
}
.section-title-tiny{
    font-size: 20px;
    font-weight: 600;
    letter-spacing: normal;
}
.section-caption-gradient{
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-size: 14px;
}
.section-descr{
    font-size: 19px;
    line-height: 1.736;
    letter-spacing: normal;
    font-weight: 400;
}
.section-descr-medium{
    line-height: 1.65;
}
a.link-hover-anim,
a.link-hover-anim:hover{
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    color: var(--color-primary-1);
    font-size: 18px;
    font-weight: 500;  
    letter-spacing: -0.005em;
}
.link-strong i{
    position: relative;
    top: -0.05em;
    vertical-align: middle;
}
.link-strong-hovered{
    top: 0;
}
.features-list{
    font-size: 17px;
}
.features-list-icon{
    top: 0.175em;
    color: var(--color-primary-1);
    background: var(--color-primary-light-1);
}
.works-grid.work-grid-fancy .work-title{
    margin-bottom: 10px;
    font-size: 22px;
    font-weight: 600;
}
.works-grid.work-grid-fancy .work-descr{
    font-size: 16px;
}
.work-img-bg{
    background: var(--color-gray-light-2);
}
.number-1-title{
    font-weight: 600;
}
.features-2-title{
    letter-spacing: normal;
}
.testimonials-3-text p {
    letter-spacing: -0.015em;
}
.testimonials-4-text p{
    color: var(--color-gray-1);
    line-height: 1.67;
}
.testimonials-4-author{
    font-weight: 600;
}
.testimonials-4-author .small{
    font-size: 15px;
    font-weight: 400;
}
.post-prev-container{
    overflow: hidden;
    background: #fff;
    border-radius: var(--border-radius-default); 
    box-shadow: var(--box-shadow-block);
    isolation: isolate;
    transform: translateZ(0);
    transition: all .27s var(--ease-default);
}
.post-prev-container:before{
    display: none;
}
.post-prev-container:hover{
    transform: translateY(-5px);
    box-shadow: var(--box-shadow-block-strong);
}
.post-prev-title{
    font-size: 22px;
    font-weight: 600;
}
.post-prev-img a:hover{
    opacity: 1;
}
.post-prev-img a:hover img{
    transform: translateZ(0.1px);
}
.post-prev-title{
    padding-top: 30px;
}
.post-prev-title a:hover{
    opacity: .85;
}
.post-prev-text{
    line-height: 1.625;
}
.post-prev-info,
.post-prev-info a{
    font-size: 14px;
}
.post-prev-title,
.post-prev-text,
.post-prev-info{
    padding-left: 30px;
    padding-right: 30px;
}
.post-prev-container > *:last-child{
    padding-bottom: 30px;
}
.post-prev-3-title{
    line-height: 1.6363;
}
.post-prev-3-text{
    line-height: 1.75;
}
.widget-body img{
    border-radius: var(--border-radius-default);
}
.tpl-minimal-tabs{
    display: flex;
    justify-content: center;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.059em;
    text-transform: uppercase;
}
.tpl-minimal-tabs li{
    padding: 0;
}
.tpl-minimal-tabs > li > a,
.tpl-minimal-tabs > li > a:hover,
.tpl-minimal-tabs > li > a:focus{
    position: relative;
    margin: 0 !important;
    padding: 10px 20px;
    color: var(--color-gray-1);
    border: none !important;
    border-radius: 0 !important; 
    isolation: isolate;   
}
.tpl-minimal-tabs > li > a:before{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 1px solid var(--color-dark-1);
    opacity: .3;
    transition: var(--transition-default);
    z-index: -1;
}
.tpl-minimal-tabs > li > a:after,
.tpl-minimal-tabs > li > a:hover:after{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    background: var(--color-primary-1);
    transform: none;
    transition: all .2s var(--ease-out-short);
    z-index: -1;
}
.tpl-minimal-tabs > li:not(:first-child) > a:before,
.tpl-minimal-tabs > li:not(:first-child) > a:after{
    width: calc(100% + 1px);
    margin-left: -1px;
    border-left: none;
}
.tpl-minimal-tabs > li:first-child > a:before,
.tpl-minimal-tabs > li:first-child > a:after{
    border-top-left-radius: 100px;
    border-bottom-left-radius: 100px;
}
.tpl-minimal-tabs > li:last-child > a:before,
.tpl-minimal-tabs > li:last-child > a:after{
    border-top-right-radius: 100px;
    border-bottom-right-radius: 100px;
}
.tpl-minimal-tabs > li > a.active,
.tpl-minimal-tabs > li > a.active:hover{
    color: #fff !important;
    border: none !important;
}
.tpl-minimal-tabs > li > a.active:after{
    opacity: 1;
}
.light-content .tpl-minimal-tabs > li > a,
.light-content .tpl-minimal-tabs > li > a:hover,
.light-content .tpl-minimal-tabs > li > a:focus{
    color: #fff;
}
.light-content .tpl-minimal-tabs > li > a:before{
    border-color: #fff;
}
.light-content .tpl-minimal-tabs li a.active,
.light-content .tpl-minimal-tabs li a.active:hover{
    color: #fff;
    border: none !important;    
}
.pricing-title{
    font-weight: 600;
    letter-spacing: -0.0175em;
}
.pricing-num{
    font-weight: 600;
}
.contact-item{
    padding-left: 69px;
}
.contact-item a.link-hover-anim,
.contact-item a.link-hover-anim:hover{
    font-size: 14px;   
}
a.link-hover-anim i{
    top: -0.05em;   
}
.contact-item{
    padding-left: 72px;
}
.ci-icon{
    width: 48px;
    height: 48px;
    color: var(--color-primary-1);
}
.ci-icon:before{
    background: var(--color-primary-light-1);  
}
.ci-text{
    margin-bottom: 2px;
    font-size: 16px;
    line-height: 1.7;
}
.ci-link{
    margin-top: 10px;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: normal;
    text-transform: none;
}
.ci-link a{
    color: var(--color-gray-1);
}
.light-content .ci-icon{
    color: var(--color-dark-1) !important;
}
.mt-icon:before{
    background: var(--gradient-primary-1-b);
}
.footer b,
.footer strong{
    font-weight: 500;
}
.fw-title {
    margin-bottom: 25px;
    font-size: 16px;
    font-weight: 600;    
    letter-spacing: normal;
}
.fw-menu li:not(:last-child){
    margin-bottom: 9px;
}
.appear-animate .linesAnimIn .word{   
    transform: translateY(37px) translateZ(0) scale(1.0) rotate(0.02deg);
    transition: all 0.8s var(--ease-out-short);
    transition-delay: calc( 0.065s * var(--line-index) );
}
@media (prefers-reduced-motion:reduce),print{
    .appear-animate .linesAnimIn .word{
        opacity: 1 !important;
        transform: none !important;
    }
}
.linesAnimIn.animated .word,
.mobile .linesAnimIn .word{
    opacity: 1;   
    transform: none;
}
.mfp-bg {
    background: var(--color-dark-1);
}
.steps-1-number{
    background: var(--color-primary-1);
}
.light-content .steps-1-number{
    color: #fff;
    background: var(--color-primary-1);
}
.light-content .map-section{
    background: rgba(16,24,40, .92);
}
.light-content .map-section:hover{
    background: rgba(16,24,40, .88);
}
@media only screen and (max-width: 1440px) {
    :root{
        --section-padding-y: 120px;
    }
}
@media only screen and (max-width: 1366px) {
    .container{
        max-width: var(--container-width);
    }
    .hs-title-1{
        font-size: calc(1.108rem + 3.68vw);
    }
    .section-title{
        font-size: calc(1.582rem + 2.25vw);
    }
    .section-title-small{
        font-size: calc(1.635rem + 0.57vw);
    }
    .section-descr{
        font-size: 19px;
    }
    .features-list,
    .number-1-descr{
        font-size: calc(0.962rem + 0.19vw);
    }
    .works-grid.work-grid-fancy .work-title,
    .post-prev-title{
        font-size: calc(0.967rem + 0.48vw);
    }
}
@media only screen and (max-width: 1200px) {
    .inner-nav ul li{
        margin: 0 12px;
    }
}
@media only screen and (max-width: 767px) {    
    .tpl-minimal-tabs > li{
        margin: 2px !important;
        width: 48%;
    }
    .tpl-minimal-tabs > li > a.active:after,
    .tpl-minimal-tabs > li > a:hover:after{
        transform: none;
    }
    .tpl-minimal-tabs > li > a:before,
    .tpl-minimal-tabs > li > a:after{
        width: 100%;
        margin-left: 0;
    }
    .tpl-minimal-tabs > li > a:before{
        border: 1px solid var(--color-dark-1) !important;
    }
    .tpl-minimal-tabs > li > a:before,
    .tpl-minimal-tabs > li > a:after{
        border-radius: 100px;
    }
}
@media only screen and (max-width: 480px) {
    .section-descr-medium{
        font-size: 22px;
        line-height: 1.37;
    }    
    .tpl-minimal-tabs > li{
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/*
 * Recolor legacy raster decoration (hardcoded pink/purple/blue) toward the blue/red brand palette.
 * Source hues run ~228deg (blue) to ~320deg (pink); a +25deg rotate lands the pink end on red
 * (~345deg) while keeping the blue end close to brand blue (~253deg).
 */
img[src*="decoration-2.png"]{
    filter: hue-rotate(25deg) saturate(1.1);
}

/*
 * Primary buttons: solid brand blue with a soft white sheen at the top, shifting to
 * brand red on hover/focus. Replaces the multi-stop rainbow gradient fill from
 * --gradient-primary-1 with a calmer two-color relationship (base style.css still
 * defines color/border/background-repeat for .btn-grad; this only overrides the fill).
 */
.btn-mod.btn-grad{
    background-color: var(--color-primary-1);
    background-image: linear-gradient(to bottom, rgba(255,255,255,.28) 0%, rgba(255,255,255,0) 55%);
    transition: background-color 0.27s var(--ease-default);
}
.btn-mod.btn-grad:hover,
.btn-mod.btn-grad:focus{
    background-color: var(--color-primary-4);
}

/*
 * Secondary "Get in touch" nav button: was a gradient-bordered pill with rainbow
 * gradient-fill text (background-clip: text). Simplified to a solid blue outline/text
 * that fills solid red on hover, matching the primary button's hover behaviour.
 */
.btn-mod.btn-border-grad{
    border: 1px solid var(--color-primary-1);
    background: #fff;
    color: var(--color-primary-1);
    transition: var(--transition-default);
}
.btn-mod.btn-border-grad:hover,
.btn-mod.btn-border-grad:focus{
    border-color: var(--color-primary-4);
    background: var(--color-primary-4);
    color: #fff;
}
.btn-mod.btn-border-grad > span,
.btn-mod.btn-border-grad > span i,
.btn-mod.btn-border-grad .btn-animate-y-1,
.btn-mod.btn-border-grad .btn-animate-y-2{
    background: none;
    -webkit-background-clip: initial;
    -webkit-text-fill-color: currentColor;
}
.main-nav.dark .btn-border-grad{
    background: #fff;
}

/*
 * Page loader: spinning brand icon instead of the plain CSS ring.
 * Overrides the ring border/background from style.css's base .loader rule
 * (higher specificity via the added .loader-logo class) and rotates the
 * logo image using the same @keyframes spinner already defined there.
 */
.loader.loader-logo{
    width: 56px;
    height: 56px;
    text-indent: 0;
    border: none;
    background: none;
    animation: none;
}
.loader.loader-logo img{
    width: 100%;
    height: 100%;
    display: block;
    animation: spinner 1.2s infinite linear;
}

/*
 * Fix: wow.js sometimes marks a scroll-reveal element "no-animate" instead of
 * running its fade-in (this happens on masonry grids, e.g. the portfolio and
 * homepage work-grids, when wow.js's initial visibility check runs before
 * Masonry finishes repositioning items). ".no-animate" only disables the CSS
 * transition (see style.css) -- it never resets the base .wow-p/.wow opacity
 * of 0.001, so any element that gets this class instead of "animated" is
 * left permanently invisible. This forces it visible as a safety net.
 */
.no-animate.wow,
.no-animate.wow-p,
.no-animate.wow-menubar{
    opacity: 1 !important;
    transform: none !important;
}

/*
 * The scroll-reveal fade-in on masonry-grid images (portfolio and homepage
 * work-grids) has proven unreliable: wow.js's visibility check races against
 * Isotope's async repositioning, and depending on timing either leaves items
 * stuck invisible (worked around above) or leaves Isotope's own column count
 * wrong until a delayed destroy+reinit runs (see the inline script near
 * </body> on these pages). Rather than keep patching race conditions,
 * grid images skip the reveal animation entirely and are always visible --
 * one less moving part, and a portfolio image is more important than a
 * fade-in effect.
 */
#work-grid .wow-p{
    opacity: 1 !important;
    transform: none !important;
}