/* Extra CSS only for Implanti i komplikacije landing page */

:root{
    --petrol-900:#082d52;
    --petrol-800:#0b3b6d;
    --petrol-700:#114d8a;
    --petrol-600:#1a66b0;
    --petrol-500:#2f84d6;
    --petrol-300:#8bb8e8;
    --petrol-100:#dceafb;
    --petrol-50:#eef5fd;
    --coral:#d98a72;
    --coral-strong:#CB775D;
}

.hero{
    position:relative;
    overflow:hidden;
}

.hero::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    z-index:1;
    background:
        linear-gradient(
            180deg,
            rgba(0,0,0,0) 55%,
            rgba(0,0,0,.18) 72%,
            rgba(0,0,0,.45) 88%,
            rgba(0,0,0,.72) 100%
        );
}

.hero .wrap{
    position:relative;
    z-index:2;
}

.hero-grid{
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:clamp(1.5rem,4vw,3.5rem);
    align-items:center;
}

.hero-media{
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:0;
}

.hero-demo{
    display:block;
    width:100%;
    height:auto;
    mix-blend-mode:lighten;
}

.hero-media .hero-demo{
    max-width:430px;
}

.hero-demo--inline{
    display:none !important;
    max-width:215px;
    margin:.3rem auto 1.2rem;
    position:relative;
    left:0;
}

.btn-primary,
.btn-dark{
    background:#d98a72;
    color:#fff;
    border:2px solid #d98a72;
    box-shadow:0 10px 26px rgba(203,119,93,.30);
}

.btn-primary:hover,
.btn-dark:hover{
    background:#CB775D;
    color:#fff;
    border-color:#CB775D;
}

.hero-phone svg,
.trust-num .plus{
    color:#d98a72;
}

.eyebrow::before{
    background:#d98a72;
}

.cta-final::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;
    background:
        linear-gradient(
            97deg,
            rgba(8,45,82,.88) 0%,
            rgba(8,45,82,.74) 35%,
            rgba(8,45,82,.48) 68%,
            rgba(8,45,82,.18) 100%
        ),
        linear-gradient(
            180deg,
            rgba(8,45,82,.25) 0%,
            rgba(8,45,82,.55) 100%
        );
}

.contact-item .ci-ic{
    background:#d98a72;
    color:#fff;
}

.contact-item:hover .ci-ic{
    background:#CB775D;
}

.logo-white{display:block;}
.logo-color{display:none;}
.site-header.scrolled .logo-white{display:none;}
.site-header.scrolled .logo-color{display:block;}

.brand img,
.footer-brand img{
    filter:none !important;
}

.logo-white,
.logo-color{
    height:60px;
    width:auto;
}

.logo-footer{
    height:50px;
    width:auto;
}

.process-cta{
    margin-top:48px;
    text-align:center;
}

@media (max-width:860px){
    .hero-grid{
        grid-template-columns:1fr;
    }

    .hero-media{
        display:none !important;
    }

    .hero-demo--inline{
        display:block !important;
    }
}
.process-cta{
    margin-top:48px;
    text-align:center;
}