/* ===========================
   RESET
=========================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    font-family:'Inter',sans-serif;

    background:
        radial-gradient(
            circle at 15% 18%,
            rgba(255,255,255,.95),
            transparent 28%
        ),
        radial-gradient(
            circle at 85% 12%,
            rgba(240,244,255,.55),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fbfcff 45%,
            #f7f9fc 100%
        );

    color:#111827;
    overflow-x:hidden;
    -webkit-font-smoothing:antialiased;
}

/* ===========================
   VARIABLES
=========================== */

:root{

    --white:#ffffff;

    --background:#fafafa;

    --text:#101114;

    --gray:#6b7280;

    --border:rgba(0,0,0,.08);

    --blue:#5d7cff;

    --purple:#8668ff;

    --radius:28px;

    --transition:.35s cubic-bezier(.22,.61,.36,1);

}

/* ===========================
   CONTAINER
=========================== */

.container{

    width:min(1380px,92%);

    margin:auto;

}

/* ===========================
   BACKGROUND
=========================== */

body::before{

content:"";

position:fixed;

top:-250px;

left:-200px;

width:700px;

height:700px;

background:radial-gradient(circle,#F1EDE7 0%,transparent 72%);

filter:blur(90px);

z-index:-3;

}

body::after{

content:"";

position:fixed;

right:-250px;

bottom:-250px;

width:700px;

height:700px;

background:radial-gradient(circle,#ECE7E0 0%,transparent 72%);

filter:blur(100px);

z-index:-3;

}

/* ===========================
   HEADER
=========================== */

/*==========================
PREMIUM LIQUID NAVBAR
==========================*/

.header{

    position:fixed;

    top:20px;

    left:50%;

    transform:translateX(-50%);

    width:min(1320px,90%);

    height:78px;

    display:flex;

    align-items:center;

    z-index:9999;

    border-radius:999px;

   background:rgba(255,255,255,.12);

   backdrop-filter:blur(22px) saturate(180%);
   -webkit-backdrop-filter:blur(22px) saturate(180%);

   border:1px solid rgba(255,255,255,.55);

   box-shadow:
    0 16px 45px rgba(17,24,39,.08),
    inset 0 1px 0 rgba(255,255,255,.75),
    inset 0 -1px 0 rgba(255,255,255,.10);

    overflow:hidden;

    transition:

    transform .45s cubic-bezier(.22,.61,.36,1),

    background .4s,

    box-shadow .4s;

}
.header::before{
    display:none;
    content:none;
    animation:none;
}

.header::after{
    content:none;
}
@keyframes navReflection{

0%{

left:-60%;

}

100%{

left:170%;

}

}
.header.scrolled{
    background:rgba(255,255,255,.06);

    backdrop-filter:blur(18px) saturate(170%);
    -webkit-backdrop-filter:blur(18px) saturate(170%);

    box-shadow:
        0 16px 45px rgba(17,24,39,.07),
        inset 0 1px 0 rgba(255,255,255,.55);
}
.header.hide{

transform:

translate(-50%,-140px);

}
.desktop-menu a{

position:relative;

text-decoration:none;

font-weight:600;

color:#222;

transition:.35s;

}

.desktop-menu a::after{

content:"";

position:absolute;

bottom:-8px;

left:50%;

transform:translateX(-50%);

width:0;

height:2px;

background:#5d7cff;

transition:.35s;

border-radius:20px;

}

.desktop-menu a:hover::after{

width:100%;

}

.desktop-menu a:hover{

color:#5d7cff;

}


/* ===========================
   NAV
=========================== */

.nav{
    position:relative;

    display:flex;
    align-items:center;

    height:72px;
    width:100%;

    padding:0 18px;
}
.logo{

display:flex;

align-items:center;

position:relative;

height:72px;

overflow:visible;

text-decoration:none;

}
.logo img{

height:120px;

width:auto;

display:block;

position:relative;

left:0;

top:0;

transform:none;

transition:.3s ease;

}

.logo:hover img{

transform:scale(1.03);

}

.desktop-menu{
    position:absolute;
    left:46%;

    display:flex;
    gap:38px;

    margin:0;
    transform:translateX(-50%);
}

.desktop-menu a{

text-decoration:none;

color:#444;

font-weight:500;

transition:.25s;

}

.desktop-menu a:hover{

color:#000;

}

.header-right{
    margin-left:auto;

display:flex;

gap:14px;

align-items:center;

}

.language,

.cart-btn{

height:48px;

padding:0 22px;

border:none;

cursor:pointer;

background:white;

border-radius:18px;

font-weight:600;

transition:.3s;

box-shadow:0 8px 30px rgba(0,0,0,.05);
display:flex;
align-items:center;
justify-content:center;
gap:8px;

}

.language,
.cart-btn{

height:50px;

padding:0 24px;

border:none;

cursor:pointer;

border-radius:999px;

background:

rgba(255,255,255,.65);

backdrop-filter:blur(15px);

box-shadow:

0 10px 30px rgba(0,0,0,.05);

transition:.35s;

}




/* ===========================
   HERO
=========================== */

.hero{

padding-top:190px;

padding-bottom:130px;

}

.hero-wrapper{

display:grid;

grid-template-columns:1.05fr .95fr;

align-items:center;

gap:70px;

}
.hero-right{
    position:relative;
    display:flex;
    justify-content:flex-end;
    align-items:center;
    height:700px;
    overflow:visible;
}

.hero-badge{

display:inline-flex;

padding:10px 18px;

border-radius:999px;

background:white;

box-shadow:0 10px 25px rgba(0,0,0,.06);

font-size:14px;

font-weight:600;

margin-bottom:30px;

}

.hero h1{

font-size:74px;

line-height:1.05;

font-weight:800;

letter-spacing:-2px;

margin-bottom:30px;

max-width:700px;

}

.hero p{

font-size:21px;

color:#6b7280;

line-height:1.8;

max-width:640px;

margin-bottom:45px;

}

/* ===========================
   BUTTONS
=========================== */

.hero-buttons{

display:flex;

gap:18px;

}

.primary-btn{

display:flex;

align-items:center;

justify-content:center;

padding:18px 34px;

border-radius:18px;

background:linear-gradient(135deg,#5d7cff,#8668ff);

color:white;

font-weight:700;

text-decoration:none;

transition:.35s;

box-shadow:

0 20px 45px rgba(92,120,255,.28);

}

.primary-btn:hover{

transform:translateY(-4px);

}

.secondary-btn{
    display:flex;
    align-items:center;
    justify-content:center;

    padding:18px 34px;

    border:1px solid rgba(17,24,39,.10);
    border-radius:18px;

    background:#ffffff;

    color:#111827;

    font-family:inherit;
    font-size:16px;
    font-weight:700;

    text-decoration:none;
    cursor:pointer;

    box-shadow:0 10px 30px rgba(0,0,0,.06);

    transition:.35s;
}

.secondary-btn:hover{
    transform:translateY(-4px);

    box-shadow:
        0 18px 40px rgba(0,0,0,.10);
}

/* ===========================
   BIG TITLE — CLEAN LOOP FIX
=========================== */

.big-title-section{
    position:relative;

    width:100%;

    margin-top:-55px;
    padding:14px 0 12px;

    overflow:hidden;
}

.big-title-wrapper{
    width:100%;
    overflow:hidden;
}

.big-title-track{
    display:flex;
    align-items:center;

    width:max-content;

    animation:bigTitleLoop 34s linear infinite;

    will-change:transform;

    transform:translate3d(0,0,0);
    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;
}

.big-title-group{
    display:flex;
    align-items:center;

    flex-shrink:0;
}

.big-title-group span{
    display:block;
    flex-shrink:0;

    padding:12px 45px 16px;

    white-space:nowrap;
    user-select:none;

    font-size:clamp(44px,6.3vw,92px);
    font-weight:900;

    /* Važno — da se ne iseče Š */
    line-height:1.15;

    letter-spacing:-5px;

    color:rgba(17,24,39,.055);

    text-transform:uppercase;
}

@keyframes bigTitleLoop{
    from{
        transform:translate3d(0,0,0);
    }

    to{
        transform:translate3d(-50%,0,0);
    }
}


/*==================================================
SECTION TITLE
==================================================*/

section h2{

    font-size:52px;

    font-weight:800;

    letter-spacing:-1px;

    margin-bottom:20px;

}

section p{

    color:var(--gray);

    font-size:19px;

    line-height:1.8;

}

/*==================================================
PROCESS
==================================================*/

.process{
    position:relative;
    margin-top:-4px;

    padding:55px 0 55px;

    overflow:hidden;

    background:
        radial-gradient(
            circle at 18% 18%,
            rgba(111,86,255,.07),
            transparent 32%
        ),
        radial-gradient(
            circle at 88% 35%,
            rgba(72,151,255,.07),
            transparent 33%
        );
}

/* blagi dekorativni talasi iza kartica */

.process::before{
    content:"";

    position:absolute;

    left:4%;
    right:4%;
    bottom:85px;

    height:240px;

    border-radius:50%;

    background:
        radial-gradient(
            ellipse at center,
            rgba(255,255,255,.88),
            rgba(245,247,255,.38) 48%,
            transparent 72%
        );

    filter:blur(12px);

    pointer-events:none;
}

.process .container{
    position:relative;
    z-index:2;
}

/* ================= HEADER ================= */

.process-header{
    position:relative;

    display:grid;
    grid-template-columns:1.05fr .95fr;

    align-items:center;

    gap:60px;

    margin-bottom:90px;
}

.process-heading{
    position:relative;
    z-index:3;
}

.process-label{
    display:inline-flex;
    align-items:center;
    gap:11px;

    padding:10px 18px;

    margin-bottom:28px;

    border-radius:999px;

    background:rgba(255,255,255,.72);

    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);

    border:1px solid rgba(255,255,255,.92);

    box-shadow:
        0 12px 32px rgba(93,76,255,.08),
        inset 0 1px 0 rgba(255,255,255,.9);

    color:#6758ff;

    font-size:14px;
    font-weight:800;

    letter-spacing:.4px;

    text-transform:uppercase;
}

.process-label-dot{
    width:10px;
    height:10px;

    border-radius:50%;

    background:#6d5cff;

    box-shadow:
        0 0 0 6px rgba(109,92,255,.10),
        0 0 18px rgba(109,92,255,.55);
}

.process h2{
    max-width:720px;

    margin:0;

    color:#0f172a;

    font-size:clamp(52px,5.5vw,78px);
    line-height:1.03;

    font-weight:850;

    letter-spacing:-4px;
}

.process h2 span{
    background:linear-gradient(
        135deg,
        #6366f1,
        #7c5cff,
        #5d7cff
    );

    -webkit-background-clip:text;
    background-clip:text;

    -webkit-text-fill-color:transparent;
    color:transparent;
}

.process-subtitle{
    max-width:620px;

    margin:22px 0 0;

    color:#697386;

    font-size:20px;
    line-height:1.7;
}

/* ================= LINIJA GORE DESNO ================= */

.process-line{
    display:none;
    position:relative;

    width:100%;
    height:210px;

    opacity:.9;
}

.process-line svg{
    position:absolute;

    inset:0;

    width:100%;
    height:100%;

    overflow:visible;
}

.process-line path{
    fill:none;

    stroke:rgba(104,92,255,.24);

    stroke-width:2.5;

    stroke-dasharray:3 10;

    stroke-linecap:round;
}

.line-dot{
    position:absolute;

    width:17px;
    height:17px;

    border-radius:50%;

    background:#796cff;

    border:4px solid rgba(255,255,255,.96);

    box-shadow:
        0 0 0 3px rgba(121,108,255,.16),
        0 6px 18px rgba(121,108,255,.36);

    z-index:2;

    animation:processDotPulse 2.6s ease-in-out infinite;
}

.dot-one{
    left:3%;
    bottom:42px;
}

.dot-two{
    left:43%;
    bottom:55px;

    animation-delay:.5s;
}

.dot-three{
    right:2%;
    top:21px;

    animation-delay:1s;
}

@keyframes processDotPulse{

    0%,
    100%{
        transform:scale(1);
    }

    50%{
        transform:scale(1.18);
    }

}

/* ================= GRID ================= */

.process-grid{
    position:relative;

    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));

    gap:38px;

    align-items:stretch;
}

/* ================= CARD ================= */

.process-card{
    --accent:#6f5cff;
    --accent-rgb:111,92,255;

    position:relative;

    min-height:430px;

    padding:128px 42px 40px;

    overflow:visible;

    border-radius:34px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.92),
            rgba(255,255,255,.70)
        );

    backdrop-filter:blur(28px) saturate(170%);
    -webkit-backdrop-filter:blur(28px) saturate(170%);

    border:1px solid rgba(255,255,255,.94);

    border-bottom:4px solid var(--accent);

    box-shadow:
        0 26px 65px rgba(15,23,42,.075),
        0 15px 40px rgba(var(--accent-rgb),.08),
        inset 0 1px 0 rgba(255,255,255,.96);

    transition:
        transform .45s cubic-bezier(.22,.61,.36,1),
        box-shadow .45s ease,
        border-color .45s ease;
}

/* svetlo ispod kartice */

.process-card::before{
    content:"";

    position:absolute;

    left:50%;
    bottom:-45px;

    width:78%;
    height:90px;

    transform:translateX(-50%);

    border-radius:50%;

    background:radial-gradient(
        ellipse,
        rgba(var(--accent-rgb),.24) 0%,
        rgba(var(--accent-rgb),.10) 42%,
        transparent 75%
    );

    filter:blur(24px);

    opacity:.8;

    z-index:-1;

    pointer-events:none;
}

/* blaga bela refleksija */

.process-card::after{
    content:"";

    position:absolute;

    top:0;
    left:12%;

    width:76%;
    height:1px;

    background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.95),
        transparent
    );
}

/* različite boje kao na slici */

.process-card-purple,
.process-card-blue,
.process-card-cyan{
    --accent:#7157ff;
    --accent-rgb:113,87,255;
}

/* ================= ICON ================= */

.process-icon-wrap{
    position:absolute;

    top:-48px;
    left:48px;

    width:126px;
    height:126px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:36px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.95),
            rgba(255,255,255,.68)
        );

    transform:rotate(10deg);

    border:1px solid rgba(255,255,255,.95);

    box-shadow:
        0 24px 48px rgba(var(--accent-rgb),.13),
        inset 0 1px 0 rgba(255,255,255,.95);

    transition:
        transform .5s cubic-bezier(.22,.61,.36,1);
}

.process-icon{
    width:108px;
    height:108px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:32px;

    transform:rotate(-10deg);

    background:
        linear-gradient(
            145deg,
            rgba(var(--accent-rgb),.78),
            var(--accent)
        );

    box-shadow:
        0 22px 45px rgba(var(--accent-rgb),.30),
        inset 0 1px 0 rgba(255,255,255,.30);

    transition:
        transform .5s cubic-bezier(.22,.61,.36,1);
}

.process-icon i{
    color:#ffffff;

    font-size:43px;

    filter:drop-shadow(
        0 6px 12px rgba(20,30,60,.15)
    );
}

/* ================= NUMBER ================= */

.process-number{
    position:absolute;

    top:34px;
    right:34px;

    color:rgba(var(--accent-rgb),.075);

    font-family:'Inter',sans-serif;

    font-size:92px;
    line-height:1;

    font-weight:850;

    letter-spacing:-7px;

    user-select:none;
}

/* ================= TEXT ================= */

.process-card-content{
    position:relative;
    z-index:2;
}

.process-card h3{
    margin:0;

    color:#111827;

    font-size:29px;
    line-height:1.2;

    font-weight:800;

    letter-spacing:-1.1px;
}

.process-small-line{
    display:block;

    width:30px;
    height:3px;

    margin:21px 0 22px;

    border-radius:999px;

    background:var(--accent);

    box-shadow:
        0 5px 14px rgba(var(--accent-rgb),.28);
}

.process-card p{
    max-width:310px;

    margin:0;

    color:#6b7280;

    font-size:17px;
    line-height:1.75;
}

/* ================= ARROW BUTTON ================= */

.process-arrow{
    position:absolute;

    right:25px;
    bottom:25px;

    width:62px;
    height:62px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:0;

    border:none;
    outline:none;

    border-radius:50%;

    background:rgba(255,255,255,.93);

    color:var(--accent);

    font-size:23px;

    cursor:pointer;

    box-shadow:
        0 14px 34px rgba(15,23,42,.10),
        inset 0 1px 0 rgba(255,255,255,1);

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        background .35s ease,
        color .35s ease;
}

/* ================= HOVER ================= */

.process-card:hover{
    transform:translateY(-12px);

    box-shadow:
        0 36px 85px rgba(15,23,42,.11),
        0 20px 50px rgba(var(--accent-rgb),.13),
        inset 0 1px 0 rgba(255,255,255,.98);
}

.process-card:hover .process-icon-wrap{
    transform:
        translateY(-7px)
        rotate(5deg);
}

.process-card:hover .process-icon{
    transform:
        rotate(-5deg)
        scale(1.035);
}

.process-arrow:hover{
    transform:
        translateX(4px)
        scale(1.07);

    background:var(--accent);
    color:#ffffff;

    box-shadow:
        0 18px 38px rgba(var(--accent-rgb),.28);
}

/* ================= ANIMATION ================= */

.process-card{
    animation:processCardFloat 5s ease-in-out infinite;
}

.process-card:nth-child(2){
    animation-delay:.6s;
}

.process-card:nth-child(3){
    animation-delay:1.2s;
}

@keyframes processCardFloat{

    0%,
    100%{
        translate:0 0;
    }

    50%{
        translate:0 -6px;
    }

}

/* ================= RESPONSIVE ================= */

@media(max-width:1100px){

    .process-header{
        grid-template-columns:1fr;
        gap:30px;
    }

    .process-line{
        display:none;
    }

    .process-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .process-card:last-child{
        grid-column:1 / -1;
        max-width:520px;
        width:100%;
        justify-self:center;
    }

}

@media(max-width:760px){

    .process{
        padding:105px 0 120px;
    }

    .process-header{
        margin-bottom:75px;
    }

    .process h2{
        font-size:48px;
        letter-spacing:-2.8px;
    }

    .process-subtitle{
        font-size:18px;
    }

    .process-grid{
        grid-template-columns:1fr;
        gap:85px;
    }

    .process-card:last-child{
        grid-column:auto;
        max-width:none;
    }

    .process-card{
        min-height:400px;
        padding:
            120px
            30px
            35px;
    }

    .process-icon-wrap{
        left:30px;
    }

    .process-number{
        right:25px;
        font-size:78px;
    }

}

@media(max-width:480px){

    .process h2{
        font-size:41px;
    }

    .process-label{
        font-size:12px;
    }

    .process-card{
        border-radius:28px;
    }

    .process-icon-wrap{
        width:112px;
        height:112px;
    }

    .process-icon{
        width:96px;
        height:96px;
    }

    .process-icon i{
        font-size:38px;
    }

}


/*==================================================
WHY US
==================================================*/

.why{

    padding:140px 0;

}

.why p{

    max-width:650px;

}

.savings-table{

    margin-top:60px;

    border-radius:30px;

    overflow:hidden;

    background:white;

    box-shadow:

    0 25px 70px rgba(0,0,0,.05);

}

.savings-table table{

    width:100%;

    border-collapse:collapse;

}

.savings-table th{

    background:#f7f8fb;

    padding:26px;

    text-align:left;

    font-size:15px;

    text-transform:uppercase;

    letter-spacing:1px;

}

.savings-table td{

    padding:24px 26px;

    border-top:1px solid #ececec;

    font-size:17px;

}


/*==================================================
REVIEWS
==================================================*/

.reviews-section {
    position: relative;
    padding: 120px 0 35px;
    overflow: hidden;
    isolation: isolate;
}

.reviews-header {
    position: relative;
    z-index: 3;
    width: min(900px, calc(100% - 40px));
    margin: 0 auto 70px;
    text-align: center;
}

.reviews-rating {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 20px;
    padding: 9px 15px;
    border: 1px solid rgba(92, 104, 255, 0.12);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.65);
    box-shadow: 0 10px 35px rgba(36, 42, 80, 0.06);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    color: #596dff;
    font-size: 15px;
    font-weight: 750;
}

.rating-stars {
    letter-spacing: 1px;
}

.reviews-header h2 {
    margin: 0;
    color: #101827;
    font-size: clamp(42px, 5vw, 68px);
    line-height: 1.05;
    letter-spacing: -3px;
    font-weight: 800;
}

.reviews-header > p {
    max-width: 720px;
    margin: 25px auto 0;
    color: #747d8e;
    font-size: 19px;
    line-height: 1.7;
}


/* SLIDER */

.reviews-slider {
    position: relative;
    z-index: 2;
    width: 100%;
    overflow: hidden;
    padding: 25px 0 45px;
}

.reviews-track {
    display: flex;
    width: max-content;
    gap: 28px;
    padding-left: 28px;
    will-change: transform;
    animation: reviewsLoop 42s linear infinite;
}



@keyframes reviewsLoop {
    from {
        transform: translate3d(0, 0, 0);
    }

    to {
        transform: translate3d(calc(-50% - 14px), 0, 0);
    }
}


/* KARTICA */

.review-card {
    position: relative;
    flex: 0 0 460px;
    min-height: 315px;
    padding: 36px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.94),
            rgba(255, 255, 255, 0.68)
        );

    border: 1px solid rgba(255, 255, 255, 0.92);
    border-radius: 34px;

    box-shadow:
        0 30px 80px rgba(28, 37, 70, 0.09),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);

    backdrop-filter: blur(25px);
    -webkit-backdrop-filter: blur(25px);

    transition:
        transform 0.45s cubic-bezier(0.2, 0.8, 0.2, 1),
        box-shadow 0.45s ease,
        border-color 0.45s ease;
}

.review-card::before {
    content: "";
    position: absolute;
    top: -130px;
    right: -110px;
    width: 250px;
    height: 250px;
    border-radius: 50%;
    background: radial-gradient(
        circle,
        rgba(101, 94, 255, 0.16),
        transparent 68%
    );
    opacity: 0;
    transition: opacity 0.45s ease;
    pointer-events: none;
}

.review-card::after {
    content: "“";
    position: absolute;
    right: 28px;
    bottom: -45px;
    color: rgba(96, 87, 255, 0.055);
    font-family: Georgia, serif;
    font-size: 190px;
    line-height: 1;
    pointer-events: none;
}

.review-card:hover {
    transform: none;
}

.review-card:hover::before {
    opacity: 1;
}

.review-top {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.review-stars {
    color: #ffad00;
    font-size: 20px;
    letter-spacing: 2px;
}

.verified-badge {
    padding: 8px 12px;
    border-radius: 999px;
    background: rgba(89, 109, 255, 0.08);
    color: #596dff;
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.2px;
    white-space: nowrap;
}

.review-text {
    position: relative;
    z-index: 2;
    margin: 34px 0;
    color: #687285;
    font-size: 18px;
    line-height: 1.75;
}

.review-user {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 17px;
}

.review-avatar {
    width: 62px;
    height: 62px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: 21px;
    background: linear-gradient(145deg, #5f79ff, #7657ff);
    box-shadow: 0 14px 28px rgba(101, 92, 255, 0.25);
    color: white;
    font-size: 20px;
    font-weight: 800;
    transition: transform 0.4s ease;
}



.review-user h3 {
    margin: 0 0 5px;
    color: #171d2b;
    font-size: 16px;
    font-weight: 800;
}

.review-user p {
    margin: 0;
    color: #858b98;
    font-size: 14px;
}


/* FADE SA STRANA */

.reviews-fade {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 5;
    width: 130px;
    pointer-events: none;
}

.reviews-fade-left {
    left: 0;
    background: linear-gradient(
        90deg,
        #f8f9fc 10%,
        rgba(248, 249, 252, 0)
    );
}

.reviews-fade-right {
    right: 0;
    background: linear-gradient(
        -90deg,
        #f8f9fc 10%,
        rgba(248, 249, 252, 0)
    );
}


/* DEKORATIVNO SVETLO */

.reviews-glow {
    position: absolute;
    z-index: -1;
    width: 440px;
    height: 440px;
    border-radius: 50%;
    filter: blur(100px);
    opacity: 0.24;
    pointer-events: none;
}

.reviews-glow-left {
    top: 180px;
    left: -250px;
    background: rgba(93, 116, 255, 0.45);
}

.reviews-glow-right {
    right: -250px;
    bottom: 40px;
    background: rgba(255, 194, 129, 0.42);
}


/* DONJI PODACI */

.reviews-trust {
    position: relative;
    z-index: 3;
    width: fit-content;
    max-width: calc(100% - 40px);
    margin: 45px auto 0;
    padding: 20px 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 28px;

    background: rgba(255, 255, 255, 0.68);
    border: 1px solid rgba(255, 255, 255, 0.9);
    border-radius: 25px;

    box-shadow:
        0 22px 55px rgba(37, 44, 80, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);

    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

.trust-item {
    min-width: 135px;
    text-align: center;
}

.trust-item strong {
    display: block;
    margin-bottom: 4px;
    color: #161d2c;
    font-size: 19px;
    font-weight: 850;
}

.trust-item span {
    color: #838b99;
    font-size: 12px;
}

.trust-divider {
    width: 1px;
    height: 34px;
    background: rgba(25, 31, 48, 0.1);
}


/* RESPONSIVE */

@media (max-width: 768px) {

    .reviews-section {
        padding: 85px 0 80px;
    }

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

    .reviews-header h2 {
        font-size: 42px;
        letter-spacing: -2px;
    }

    .reviews-header > p {
        font-size: 16px;
    }

    .reviews-track {
        gap: 18px;
        padding-left: 18px;
        animation-duration: 35s;
    }

    .review-card {
        flex-basis: 335px;
        min-height: 300px;
        padding: 28px;
        border-radius: 28px;
    }

    .verified-badge {
        display: none;
    }

    .review-text {
        font-size: 16px;
    }

    .reviews-fade {
        width: 45px;
    }

    .reviews-trust {
        padding: 18px;
        gap: 14px;
    }

    .trust-item {
        min-width: auto;
    }

    .trust-item strong {
        font-size: 16px;
    }

    .trust-item span {
        font-size: 10px;
    }

}

@media (prefers-reduced-motion: reduce) {

    .reviews-track {
        animation-play-state: paused;
    }

}


/* =========================
   FAQ
========================= */

.faq{
    padding:45px 0 35px;
}

.faq-wrapper{
    max-width:950px;
    margin:auto;

    display:flex;
    flex-direction:column;
    gap:18px;
}

.faq-item{
    background:rgba(255,255,255,.52);

    backdrop-filter:blur(20px) saturate(170%);
    -webkit-backdrop-filter:blur(20px) saturate(170%);

    border:1px solid rgba(255,255,255,.78);
    border-radius:22px;

    overflow:hidden;

    box-shadow:
        0 14px 40px rgba(15,23,42,.06),
        inset 0 1px 0 rgba(255,255,255,.88);

    transition:
        background .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}

.faq-item.active{
    background:rgba(255,255,255,.66);
    border-color:rgba(93,124,255,.18);

    box-shadow:
        0 20px 50px rgba(15,23,42,.08),
        inset 0 1px 0 rgba(255,255,255,.95);
}

.faq-question{
    width:100%;
    min-height:84px;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;

    padding:20px 26px;

    border:none;
    background:transparent;

    color:#111827;

    font-family:inherit;
    font-size:16px;
    font-weight:700;
    text-align:left;

    cursor:pointer;
}

.faq-question span{
    width:38px;
    height:38px;

    flex-shrink:0;

    display:flex;
    align-items:center;
    justify-content:center;

    padding-bottom:2px;
    box-sizing:border-box;

    border-radius:50%;

    background:rgba(93,124,255,.10);
    color:#5d7cff;

    font-size:24px;
    font-weight:300;
    line-height:1;

    transition:
    transform .35s cubic-bezier(.22,.61,.36,1),
    background .25s ease;
}

.faq-item.active .faq-question span{
    transform:rotate(45deg);
    background:rgba(93,124,255,.15);
}

.faq-answer{
    max-height:0;

    display:flex;
    align-items:center;

    padding:0 26px;

    overflow:hidden;

    opacity:0;

    color:#5b5b5b;
    font-size:16px;
    line-height:1.7;

    transform:translateY(-8px);

    transition:
    max-height .55s cubic-bezier(.22,.61,.36,1),
    padding .55s cubic-bezier(.22,.61,.36,1),
    opacity .3s ease,
    transform .45s cubic-bezier(.22,.61,.36,1);
}

.faq-item.active .faq-answer{
    max-height:140px;

    padding:10px 26px 34px;

    opacity:1;
    transform:translateY(0);
}
/*==========================
CONTACT
==========================*/

.contact{

    padding:140px 0 0;

    background:
    linear-gradient(
        180deg,
        #ffffff 0%,
        #fafafa 35%,
        #f4f4f4 100%
    );

}

.contact-wrapper{

    display:grid;
    grid-template-columns:1fr 1fr;
    gap:70px;
    padding:80px;
    margin-bottom:120px;
    border-radius:34px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.38),
            rgba(255,255,255,.12)
        );

    backdrop-filter:blur(32px) saturate(180%);
    -webkit-backdrop-filter:blur(32px) saturate(180%);

    border:1px solid rgba(255,255,255,.72);

    box-shadow:
        0 30px 80px rgba(31,41,55,.08),
        inset 0 1px 0 rgba(255,255,255,.95),
        inset 0 -1px 0 rgba(255,255,255,.20);

    position:relative;
    overflow:hidden;
}
.contact-wrapper::before{
    content:"";
    position:absolute;
    top:-60%;
    left:-20%;
    width:55%;
    height:220%;

    background:linear-gradient(
        110deg,
        transparent,
        rgba(255,255,255,.38),
        transparent
    );

    transform:rotate(18deg);
    pointer-events:none;
}
.contact-left,
.contact-right{
    position:relative;
    z-index:2;
}
.contact-right input,
.contact-right textarea{

    width:100%;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.68),
            rgba(255,255,255,.34)
        );

    backdrop-filter:blur(20px) saturate(160%);
    -webkit-backdrop-filter:blur(20px) saturate(160%);

    border:1px solid rgba(255,255,255,.88);

    box-shadow:
        0 14px 34px rgba(31,41,55,.07),
        inset 0 1px 0 rgba(255,255,255,.98),
        inset 0 -1px 0 rgba(255,255,255,.28);

    border-radius:18px;

    padding:20px 22px;

    font-family:inherit;
    font-size:16px;
    color:#111827;

    outline:none;

    transition:
        border-color .3s ease,
        background .3s ease,
        box-shadow .3s ease;
}
.contact-right input::placeholder,
.contact-right textarea::placeholder{
    color:#7d8594;
    opacity:1;
}
.contact-right input:focus,
.contact-right textarea:focus{

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.86),
            rgba(255,255,255,.50)
        );

    border-color:rgba(93,124,255,.42);

    box-shadow:
        0 18px 40px rgba(31,41,55,.08),
        0 0 0 4px rgba(93,124,255,.10),
        inset 0 1px 0 rgba(255,255,255,1);
}
.contact-right textarea{
    height:180px;
    resize:none;
}

.contact-badge{

    display:inline-block;

    padding:10px 18px;

    border-radius:999px;

    background:#eef3ff;

    color:#5d7cff;

    font-weight:700;

    margin-bottom:25px;

}

.contact-left h2{

    font-size:54px;

    margin-bottom:22px;

}

.contact-left p{

    max-width:520px;

    line-height:1.8;

    margin-bottom:45px;

}

.contact-info{

    display:flex;

    flex-direction:column;

    gap:20px;

}

.info-box{

    padding:22px 26px;

    background:#f8f9fc;

    border-radius:22px;

}

.info-box h4{

    margin-bottom:8px;

}

.info-box span{

    color:#6b7280;

}

.contact-right form{

    display:flex;

    flex-direction:column;

    gap:22px;

}

.contact-right input,
.contact-right textarea{

    width:100%;

    border:1px solid rgba(105,115,140,.16);

    background:rgba(255,255,255,.72);

    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);

    border-radius:20px;

    padding:20px 22px;

    font-family:inherit;
    font-size:16px;

    color:#111827;

    outline:none;

    box-shadow:
        0 12px 35px rgba(31,41,55,.055),
        inset 0 1px 0 rgba(255,255,255,.95);

    transition:
        border-color .3s ease,
        background .3s ease,
        box-shadow .3s ease;
}
.contact-right input::placeholder,
.contact-right textarea::placeholder{
    color:#8b93a3;
    opacity:1;
}
.contact-right input:focus,
.contact-right textarea:focus{

    background:rgba(255,255,255,.90);

    border-color:rgba(93,124,255,.45);

    box-shadow:
        0 16px 40px rgba(31,41,55,.07),
        0 0 0 4px rgba(93,124,255,.10);
}
.contact-right textarea{

    height:180px;

    resize:none;

}
.contact-left,
.contact-right{
    position:relative;
    z-index:2;
}
.contact-left{
    display:flex;
    flex-direction:column;
    justify-content:center;
}

.contact-left h2{
    max-width:520px;
    margin-bottom:24px;

    font-size:clamp(46px,5vw,68px);
    line-height:1.05;
    letter-spacing:-3px;

    color:#111827;
}

.contact-left p{
    max-width:540px;
    margin-bottom:0;

    color:#687285;
    font-size:18px;
    line-height:1.8;
}
.contact-badge{
    width:fit-content;

    display:inline-flex;
    align-items:center;

    padding:10px 18px;
    margin-bottom:28px;

    border-radius:999px;

    background:rgba(93,124,255,.10);
    color:#5d7cff;

    border:1px solid rgba(93,124,255,.12);

    font-size:14px;
    font-weight:700;

    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
}

.contact-right button{

    height:60px;

    border:none;

    border-radius:18px;

    cursor:pointer;

    color:white;

    font-size:17px;

    font-weight:700;

    background:linear-gradient(135deg,#5d7cff,#8866ff);

    box-shadow:

    0 18px 40px rgba(93,124,255,.25);

    transition:.35s;

}

.contact-right button:hover{

    transform:translateY(-4px);

}
/*==========================
FOOTER
==========================*/

.footer{
    position:relative;
    padding:55px 0 35px;
    overflow:hidden;

    background:
    radial-gradient(
        circle at 18% 8%,
        rgba(255,255,255,.85),
        transparent 32%
    ),
    radial-gradient(
        circle at 82% 14%,
        rgba(244,247,252,.55),
        transparent 34%
    ),
    linear-gradient(
        180deg,
        #f8fafc 0%,
        #f5f7fa 55%,
        #f1f4f8 100%
    );

    border-top:1px solid rgba(17,24,39,.04);
}

.footer-top{

    display:grid;

    grid-template-columns:1.7fr 1fr;

    align-items:start;

    gap:120px;

}

.footer-brand h2{

    font-size:34px;

    font-weight:900;

    letter-spacing:-2px;

    margin-bottom:18px;

    color:#111827;

}
.footer-brand img{
    display:block;
    margin-left:-12px;
    margin-top:10px;
}

.footer-brand p{

    max-width:500px;

    font-size:16px;

    line-height:1.9;

    color:#6b7280;

}

.footer-social{

    display:flex;

    gap:14px;

    margin-top:30px;

}

.footer-social a{

    width:54px;
    height:54px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:18px;

    background:rgba(255,255,255,.72);

    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);

    border:1px solid rgba(255,255,255,.85);

    box-shadow:
        0 12px 35px rgba(0,0,0,.06);

    color:#111827;

    text-decoration:none;

    transition:.35s cubic-bezier(.22,.61,.36,1);

}
.footer-social a i{

    font-size:22px;

    transition:.35s;

}

.footer-social a:hover{

    transform:translateY(-6px);

    background:linear-gradient(
        135deg,
        #5d7cff,
        #8866ff
    );

    color:#fff;

    box-shadow:
        0 20px 45px rgba(93,124,255,.28);

}

.footer-social a:hover i{

    transform:scale(1.12);

}
.footer-social a:hover{

    transform:translateY(-5px);

    background:linear-gradient(
    135deg,
    #5d7cff,
    #8866ff
    );

    color:#fff;

    box-shadow:0 18px 35px rgba(37,99,235,.28);

}

.footer-column h4{

    font-size:13px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:2px;

    color:#6b7280;

    margin-bottom:22px;

}

.footer-column{

    display:flex;

    flex-direction:column;

    gap:16px;

}

.footer-column a{

    color:#111827;

    text-decoration:none;

    font-size:15px;

    font-weight:500;

    transition:.3s;

}

.footer-column a:hover{

    color:#2563eb;

    padding-left:6px;

}

.footer-column a:hover{

    color:#5d7cff;

}

.newsletter{

    display:flex;

    flex-direction:column;

    gap:18px;

    margin-top:24px;

}

.newsletter input{

    height:60px;

    border:1px solid rgba(17,24,39,.08);

    background:rgba(255,255,255,.75);

    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);

    border-radius:18px;

    padding:0 22px;

    outline:none;

    font-size:15px;

    transition:.3s ease;

}

.newsletter input:focus{

    border-color:#5d7cff;

    box-shadow:0 0 0 4px rgba(93,124,255,.12);

}

.newsletter button{

    height:60px;

    border:none;

    cursor:pointer;

    border-radius:18px;

    color:#fff;

    font-size:15px;

    font-weight:700;

    background:linear-gradient(
        135deg,
        #5d7cff,
        #8866ff
    );

    transition:.35s ease;

    box-shadow:
    0 14px 35px rgba(93,124,255,.25);

}

.newsletter button:hover{

    transform:translateY(-3px);

    box-shadow:
    0 22px 45px rgba(93,124,255,.35);

}

.footer-bottom{
    width:100% !important;

    margin-top:70px !important;
    padding-top:28px !important;

    display:flex !important;
    flex-direction:row-reverse !important;
    align-items:center !important;
    justify-content:space-between !important;

    gap:30px !important;

    border-top:1px solid rgba(17,24,39,.08) !important;
}

/* © 2026 LICENSO — LEVO */

.footer-bottom > p{
    margin:0 !important;
    padding:0 !important;

    text-align:left !important;

    color:#6b7280 !important;
}

/* POLITIKA, USLOVI, POVRAĆAJ — DESNO */

.footer-links{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;

    gap:30px !important;

    margin:0 !important;
    padding:0 !important;
}
/* ===========================
SCROLL REVEAL
=========================== */

.reveal{

    opacity:0;

    transform:translateY(60px);

    transition:

        opacity .9s ease,

        transform .9s ease;

    will-change:opacity,transform;

}

.reveal.show{

    opacity:1;

    transform:translateY(0);

}
button{

position:relative;

overflow:hidden;

}

.ripple{

position:absolute;

border-radius:50%;

background:rgba(255,255,255,.45);

transform:scale(0);

animation:ripple .6s linear;

pointer-events:none;

}

@keyframes ripple{

to{

transform:scale(5);

opacity:0;

}

}


.mouse-light{

position:absolute;

width:220px;

height:220px;

border-radius:50%;

background:

radial-gradient(

circle,

rgba(255,255,255,.35),

transparent 70%

);

pointer-events:none;

filter:blur(18px);

opacity:0;

transition:opacity .25s;

}


@keyframes floatLogo{

0%{
transform:translateY(0);
}

50%{
transform:translateY(-7px);
}

100%{
transform:translateY(0);
}

}

/*==========================
PREMIUM PRICE
==========================*/

.price{

    display:flex;

    align-items:flex-end;

    gap:14px;

    margin:22px 0 28px;

}

.price strong{

    font-size:42px;

    font-weight:800;

    color:#111827;

}

.price span{

    font-size:18px;

    color:#9ca3af;

    text-decoration:line-through;

    padding-bottom:7px;

}
body::before{
content:"";
position:fixed;
top:-250px;
left:-250px;
width:700px;
height:700px;
background:radial-gradient(circle,
rgba(255,255,255,.65) 0%,
rgba(255,255,255,.18) 45%,
transparent 75%);
filter:blur(70px);
pointer-events:none;
z-index:-2;
}

body::after{
content:"";
position:fixed;
right:-220px;
bottom:-220px;
width:650px;
height:650px;
background:radial-gradient(circle,
rgba(255,215,170,.28) 0%,
rgba(255,255,255,.12) 45%,
transparent 75%);
filter:blur(90px);
pointer-events:none;
z-index:-2;
}
/*========================================
PREMIUM BENEFITS
========================================*/

.premium-benefits{

padding:130px 0;

position:relative;
overflow:hidden;

}
.premium-benefits::before{

content:"";

position:absolute;

left:-260px;

top:-180px;

width:520px;

height:520px;

border-radius:50%;

background:

radial-gradient(circle,

rgba(93,124,255,.10),

transparent 72%);

filter:blur(50px);

pointer-events:none;

}

.premium-benefits::after{

content:"";

position:absolute;

right:-260px;

bottom:-180px;

width:560px;

height:560px;

border-radius:50%;

background:

radial-gradient(circle,

rgba(136,102,255,.10),

transparent 72%);

filter:blur(60px);

pointer-events:none;

}

.premium-benefits-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:80px;

align-items:center;

}

.premium-left{

max-width:620px;

}

.premium-label{

display:inline-flex;

align-items:center;

padding:10px 20px;

border-radius:999px;

background:rgba(255,255,255,.75);

backdrop-filter:blur(18px);

border:1px solid rgba(255,255,255,.9);

box-shadow:0 12px 35px rgba(0,0,0,.05);

font-size:14px;

font-weight:600;

margin-bottom:28px;

text-transform:uppercase;

letter-spacing:1px;

color:#5D7CFF;

}

.premium-left h2{

font-size:68px;

line-height:1.05;

font-weight:800;

letter-spacing:-2px;

margin-bottom:28px;

color:#111827;

}

.premium-left h2 span{

background:linear-gradient(135deg,#5D7CFF,#8866FF);

-webkit-background-clip:text;

-webkit-text-fill-color:transparent;

}

.premium-left p{

font-size:21px;

line-height:1.8;

color:#6B7280;

margin-bottom:48px;

max-width:560px;

}

.premium-stats{

display:flex;

align-items:center;

gap:38px;

padding:28px 34px;

border-radius:28px;

background:rgba(255,255,255,.70);

backdrop-filter:blur(24px);

border:1px solid rgba(255,255,255,.85);

box-shadow:0 18px 50px rgba(0,0,0,.05);

width:fit-content;

}

.stat h3{

font-size:54px;

font-weight:800;

line-height:1;

margin-bottom:8px;

color:#111827;

}

.stat span{

font-size:15px;

color:#6B7280;

}

.divider{

width:1px;

height:58px;

background:#E5E7EB;

}
/*==================================================
LICENSO BENEFITS SYSTEM
==================================================*/

.premium-right{
    position:relative;

    min-height:720px;

    display:flex;
    align-items:center;
    justify-content:center;
}

/* ceo desni vizuelni sistem */

.licenso-system{
    position:relative;

    width:100%;
    max-width:720px;
    height:690px;
}

/* centralna LICENSO kartica */

.licenso-center-card{
    position:absolute;

    left:42%;
    top:50%;

    width:220px;
    height:220px;

    transform:translate(-50%,-50%);

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    border-radius:34px;

    background:rgba(255,255,255,.92);

    backdrop-filter:blur(24px);
    -webkit-backdrop-filter:blur(24px);

    border:1px solid rgba(255,255,255,.98);

    box-shadow:
        0 24px 65px rgba(15,23,42,.10),
        inset 0 1px 0 rgba(255,255,255,1);

    z-index:4;

    transition:
        transform .45s ease,
        box-shadow .45s ease;
}

/* bez svetla iza kartice */

.licenso-center-card::before,
.licenso-center-card::after{
    display:none;
}

.licenso-center-card img{
    width:84px;
    height:auto;

    margin-bottom:20px;

    object-fit:contain;
}

.licenso-center-card span{
    color:#111827;

    font-size:27px;
    font-weight:800;

    letter-spacing:-1px;
}

.licenso-center-card:hover{
    transform:
        translate(-50%,-50%)
        translateY(-6px);

    box-shadow:
        0 32px 78px rgba(15,23,42,.13),
        inset 0 1px 0 rgba(255,255,255,1);
}

/* benefit stavke */

.licenso-benefit{
    position:absolute;

    display:flex;
    align-items:center;

    gap:20px;

    width:310px;

    z-index:5;
}

/* pozicije */

.benefit-one{
    top:35px;
    right:0;
}

.benefit-two{
    top:210px;
    right:0;
}

.benefit-three{
    top:385px;
    right:0;
}

.benefit-four{
    top:560px;
    right:0;
}

/* kružna ikonica */

.licenso-benefit-icon{
    flex:0 0 auto;

    width:102px;
    height:102px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:rgba(255,255,255,.95);

    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);

    border:1px solid rgba(255,255,255,.98);

    box-shadow:
        0 16px 42px rgba(15,23,42,.08),
        inset 0 1px 0 rgba(255,255,255,1);

    transition:
        transform .4s ease,
        box-shadow .4s ease;
}

.licenso-benefit-icon i{
    color:#6d5cff;

    font-size:39px;

    filter:drop-shadow(
        0 6px 12px rgba(109,92,255,.18)
    );
}

/* tekst pored ikonice */

.licenso-benefit-text{
    position:relative;

    padding-left:18px;
}

.licenso-benefit-text::before{
    content:"";

    position:absolute;

    left:0;
    top:3px;

    width:2px;
    height:82px;

    border-radius:999px;

    background:linear-gradient(
        to bottom,
        #6d5cff,
        rgba(109,92,255,.12)
    );
}

.licenso-benefit-number{
    display:block;

    margin-bottom:7px;

    color:#6d5cff;

    font-size:19px;
    font-weight:800;
}

.licenso-benefit h3{
    margin:0 0 8px;

    color:#111827;

    font-size:21px;
    line-height:1.2;

    font-weight:800;
    letter-spacing:-.5px;
}

.licenso-benefit p{
    margin:0;

    color:#6b7280;

    font-size:15px;
    line-height:1.6;
}

/* connecting lines */

.licenso-line{
    position:absolute;

    height:2px;

    background:#7c6cff;

    transform-origin:left center;

    opacity:.72;

    z-index:1;
}

/* mali završni kružići na linijama */

.licenso-line::before,
.licenso-line::after{
    content:"";

    position:absolute;

    top:50%;

    width:9px;
    height:9px;

    transform:translateY(-50%);

    border-radius:50%;

    background:#6d5cff;

    box-shadow:
        0 0 0 4px rgba(109,92,255,.10);
}

.licenso-line::before{
    left:-4px;
}

.licenso-line::after{
    right:-4px;
}

/* linija 1 */

.line-one{
    left:52%;
    top:270px;

    width:195px;

    transform:rotate(-50deg);
}

/* linija 2 */

.line-two{
    left:53%;
    top:330px;

    width:155px;

    transform:rotate(-12deg);
}

/* linija 3 */

.line-three{
    left:53%;
    top:390px;

    width:155px;

    transform:rotate(15deg);
}

/* linija 4 */

.line-four{
    left:52%;
    top:450px;

    width:205px;

    transform:rotate(48deg);
}

/* hover */

.licenso-benefit:hover .licenso-benefit-icon{
    transform:
        translateY(-5px)
        scale(1.04);

    box-shadow:
        0 22px 52px rgba(109,92,255,.14),
        inset 0 1px 0 rgba(255,255,255,1);
}

/* blaga animacija ikonica */

.licenso-benefit-icon{
    animation:licensoIconFloat 4.5s ease-in-out infinite;
}

.benefit-two .licenso-benefit-icon{
    animation-delay:.5s;
}

.benefit-three .licenso-benefit-icon{
    animation-delay:1s;
}

.benefit-four .licenso-benefit-icon{
    animation-delay:1.5s;
}

@keyframes licensoIconFloat{

    0%,
    100%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(-6px);
    }

}

/* responsive */

@media(max-width:1200px){

    .premium-right{
        min-height:680px;
    }

    .licenso-system{
        transform:scale(.9);
        transform-origin:center;
    }

}

@media(max-width:1050px){

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

    .premium-left{
        max-width:100%;
    }

    .premium-right{
        min-height:700px;
    }

    .licenso-system{
        max-width:760px;

        margin:0 auto;

        transform:none;
    }

}

@media(max-width:760px){

    .premium-right{
        min-height:auto;
    }

    .licenso-system{
        height:auto;

        display:flex;
        flex-direction:column;

        gap:22px;
    }

    .licenso-center-card{
        position:relative;

        left:auto;
        top:auto;

        width:190px;
        height:190px;

        margin:0 auto 35px;

        transform:none;
    }

    .licenso-center-card:hover{
        transform:translateY(-6px);
    }

    .licenso-benefit{
        position:relative;

        top:auto;
        right:auto;

        width:100%;

        padding:20px 0;
    }

    .licenso-line{
        display:none;
    }

    .licenso-benefit-icon{
        width:84px;
        height:84px;
    }

    .licenso-benefit-icon i{
        font-size:32px;
    }

}

@media(max-width:480px){

    .licenso-benefit{
        gap:15px;
    }

    .licenso-benefit-text{
        padding-left:14px;
    }

    .licenso-benefit h3{
        font-size:18px;
    }

    .licenso-benefit p{
        font-size:14px;
    }

}
/*==================================================
LICENSO BENEFITS SYSTEM
==================================================*/

.premium-right{
    position:relative;

    min-height:720px;

    display:flex;
    align-items:center;
    justify-content:center;
}

/* ceo desni vizuelni sistem */

.licenso-system{
    position:relative;

    width:100%;
    max-width:720px;
    height:690px;
}

/* centralna LICENSO kartica */

.licenso-center-card{
    position:absolute;

    left:42%;
    top:50%;

    width:220px;
    height:220px;

    transform:translate(-50%,-50%);

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    border-radius:34px;

    background:rgba(255,255,255,.92);

    backdrop-filter:blur(24px);
    -webkit-backdrop-filter:blur(24px);

    border:1px solid rgba(255,255,255,.98);

    box-shadow:
        0 24px 65px rgba(15,23,42,.10),
        inset 0 1px 0 rgba(255,255,255,1);

    z-index:4;

    transition:
        transform .45s ease,
        box-shadow .45s ease;
}

/* bez svetla iza kartice */

.licenso-center-card::before,
.licenso-center-card::after{
    display:none;
}

.licenso-center-card img{
    width:84px;
    height:auto;

    margin-bottom:20px;

    object-fit:contain;
}

.licenso-center-card span{
    color:#111827;

    font-size:27px;
    font-weight:800;

    letter-spacing:-1px;
}

.licenso-center-card:hover{
    transform:
        translate(-50%,-50%)
        translateY(-6px);

    box-shadow:
        0 32px 78px rgba(15,23,42,.13),
        inset 0 1px 0 rgba(255,255,255,1);
}

/* benefit stavke */

.licenso-benefit{
    position:absolute;

    display:flex;
    align-items:center;

    gap:20px;

    width:310px;

    z-index:5;
}

/* pozicije */

.benefit-one{
    top:35px;
    right:0;
}

.benefit-two{
    top:210px;
    right:0;
}

.benefit-three{
    top:385px;
    right:0;
}

.benefit-four{
    top:560px;
    right:0;
}

/* kružna ikonica */

.licenso-benefit-icon{
    flex:0 0 auto;

    width:102px;
    height:102px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:rgba(255,255,255,.95);

    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);

    border:1px solid rgba(255,255,255,.98);

    box-shadow:
        0 16px 42px rgba(15,23,42,.08),
        inset 0 1px 0 rgba(255,255,255,1);

    transition:
        transform .4s ease,
        box-shadow .4s ease;
}

.licenso-benefit-icon i{
    color:#6d5cff;

    font-size:39px;

    filter:drop-shadow(
        0 6px 12px rgba(109,92,255,.18)
    );
}

/* tekst pored ikonice */

.licenso-benefit-text{
    position:relative;

    padding-left:18px;
}

.licenso-benefit-text::before{
    content:"";

    position:absolute;

    left:0;
    top:3px;

    width:2px;
    height:82px;

    border-radius:999px;

    background:linear-gradient(
        to bottom,
        #6d5cff,
        rgba(109,92,255,.12)
    );
}

.licenso-benefit-number{
    display:block;

    margin-bottom:7px;

    color:#6d5cff;

    font-size:19px;
    font-weight:800;
}

.licenso-benefit h3{
    margin:0 0 8px;

    color:#111827;

    font-size:21px;
    line-height:1.2;

    font-weight:800;
    letter-spacing:-.5px;
}

.licenso-benefit p{
    margin:0;

    color:#6b7280;

    font-size:15px;
    line-height:1.6;
}

/* connecting lines */

.licenso-line{
    position:absolute;

    height:2px;

    background:#7c6cff;

    transform-origin:left center;

    opacity:.72;

    z-index:1;
}

/* mali završni kružići na linijama */

.licenso-line::before,
.licenso-line::after{
    content:"";

    position:absolute;

    top:50%;

    width:9px;
    height:9px;

    transform:translateY(-50%);

    border-radius:50%;

    background:#6d5cff;

    box-shadow:
        0 0 0 4px rgba(109,92,255,.10);
}

.licenso-line::before{
    left:-4px;
}

.licenso-line::after{
    right:-4px;
}

/* linija 1 */

.line-one{
    left:52%;
    top:270px;

    width:195px;

    transform:rotate(-50deg);
}

/* linija 2 */

.line-two{
    left:53%;
    top:330px;

    width:155px;

    transform:rotate(-12deg);
}

/* linija 3 */

.line-three{
    left:53%;
    top:390px;

    width:155px;

    transform:rotate(15deg);
}

/* linija 4 */

.line-four{
    left:52%;
    top:450px;

    width:205px;

    transform:rotate(48deg);
}

/* hover */

.licenso-benefit:hover .licenso-benefit-icon{
    transform:
        translateY(-5px)
        scale(1.04);

    box-shadow:
        0 22px 52px rgba(109,92,255,.14),
        inset 0 1px 0 rgba(255,255,255,1);
}

/* blaga animacija ikonica */

.licenso-benefit-icon{
    animation:licensoIconFloat 4.5s ease-in-out infinite;
}

.benefit-two .licenso-benefit-icon{
    animation-delay:.5s;
}

.benefit-three .licenso-benefit-icon{
    animation-delay:1s;
}

.benefit-four .licenso-benefit-icon{
    animation-delay:1.5s;
}

@keyframes licensoIconFloat{

    0%,
    100%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(-6px);
    }

}

/* responsive */

@media(max-width:1200px){

    .premium-right{
        min-height:680px;
    }

    .licenso-system{
        transform:scale(.9);
        transform-origin:center;
    }

}

@media(max-width:1050px){

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

    .premium-left{
        max-width:100%;
    }

    .premium-right{
        min-height:700px;
    }

    .licenso-system{
        max-width:760px;

        margin:0 auto;

        transform:none;
    }

}

@media(max-width:760px){

    .premium-right{
        min-height:auto;
    }

    .licenso-system{
        height:auto;

        display:flex;
        flex-direction:column;

        gap:22px;
    }

    .licenso-center-card{
        position:relative;

        left:auto;
        top:auto;

        width:190px;
        height:190px;

        margin:0 auto 35px;

        transform:none;
    }

    .licenso-center-card:hover{
        transform:translateY(-6px);
    }

    .licenso-benefit{
        position:relative;

        top:auto;
        right:auto;

        width:100%;

        padding:20px 0;
    }

    .licenso-line{
        display:none;
    }

    .licenso-benefit-icon{
        width:84px;
        height:84px;
    }

    .licenso-benefit-icon i{
        font-size:32px;
    }

}

@media(max-width:480px){

    .licenso-benefit{
        gap:15px;
    }

    .licenso-benefit-text{
        padding-left:14px;
    }

    .licenso-benefit h3{
        font-size:18px;
    }

    .licenso-benefit p{
        font-size:14px;
    }

}
/*==============================
PREMIUM BENEFITS ANIMATION
==============================*/

.premium-left{

opacity:1;

transform:none;

transition:

opacity .9s ease,

transform .9s ease;

}

.premium-right{

opacity:1;

transform:none;

transition:

opacity .9s ease .15s,

transform .9s ease .15s;

}

.premium-benefits.show .premium-left,

.premium-benefits.show .premium-right{

opacity:1;

transform:none;

}

.benefit-card{

opacity:1;

transform:none;

}

.premium-benefits.show .benefit-card:nth-child(1){

opacity:1;

transform:none;

transition:.55s ease .15s;

}

.premium-benefits.show .benefit-card:nth-child(2){

opacity:1;

transform:none;

transition:.55s ease .28s;

}

.premium-benefits.show .benefit-card:nth-child(3){

opacity:1;

transform:none;

transition:.55s ease .41s;

}

.premium-benefits.show .benefit-card:nth-child(4){

opacity:1;

transform:none;

transition:.55s ease .54s;

}
@keyframes floatCard{

0%{

transform:translateY(0px);

}

50%{

transform:translateY(-8px);

}

100%{

transform:translateY(0px);

}

}

.benefit-card:nth-child(2){

animation-delay:1.2s;

}

.benefit-card:nth-child(3){

animation-delay:2.4s;

}

.benefit-card:nth-child(4){

animation-delay:3.6s;

}
.benefit-card:hover .shine{

left:170%;

}

/* ===========================
   BIG LICENSO DIVIDER
=========================== */

.footer-big-title{
    font-size:clamp(110px,16vw,230px);
    font-weight:900;
    line-height:.78;
    letter-spacing:-9px;
    text-align:center;

    margin:20px 0 45px;

    color:rgba(17,24,39,.055);

    transform:translateY(-10px);

    -webkit-mask-image:linear-gradient(
        to bottom,
        #000 0%,
        #000 68%,
        rgba(0,0,0,.75) 82%,
        transparent 100%
    );

    mask-image:linear-gradient(
        to bottom,
        #000 0%,
        #000 68%,
        rgba(0,0,0,.75) 82%,
        transparent 100%
    );

    user-select:none;
    pointer-events:none;
}

/* ===========================
   FOOTER BACKGROUND EFFECT
=========================== */

.contact{

    position:relative;

    overflow:hidden;

}

.contact::before{

    content:"";

    position:absolute;

    width:700px;
    height:700px;

    left:-220px;
    top:120px;

    border-radius:50%;

    background:radial-gradient(
        circle,
        rgba(99,102,241,.12) 0%,
        rgba(99,102,241,0) 70%
    );

    filter:blur(90px);

    pointer-events:none;

}

.contact::after{

    content:"";

    position:absolute;

    width:600px;
    height:600px;

    right:-180px;
    bottom:-120px;

    border-radius:50%;

    background:radial-gradient(
        circle,
        rgba(59,130,246,.10) 0%,
        rgba(59,130,246,0) 70%
    );

    filter:blur(90px);

    pointer-events:none;

}

.contact-wrapper,
.footer,
.footer-big-title{

    position:relative;

    z-index:2;

}


.footer-column{

    display:flex;

    flex-direction:column;

    align-items:flex-start;

    gap:16px;

}
 .footer-bottom p{

    margin:0;

    color:#6b7280;

    font-size:14px;

    line-height:1.6;

}
.footer-bottom a{

    color:#6b7280;

    font-size:14px;

    text-decoration:none;

    transition:.3s ease;

}

.footer-bottom a:hover{

    color:#111827;

}
.footer-bottom{

    margin-top:80px;

    padding-top:28px;

    border-top:1px solid rgba(17,24,39,.08);

    display:flex;

    justify-content:space-between;

    align-items:center;

    flex-wrap:wrap;

    gap:20px;

}

.footer-bottom span{

    color:#6b7280;

    font-size:14px;

}

.footer-bottom-links{

    display:flex;

    align-items:center;

    gap:28px;

}

.footer-bottom-links a{

    color:#6b7280;

    text-decoration:none;

    font-size:14px;

    transition:.3s ease;

}

.footer-bottom-links a:hover{

    color:#111827;

}
.footer-column:last-child{

    justify-self:end;

    width:100%;

    max-width:420px;

}
.footer-main{
    display:grid;
    grid-template-columns:1.4fr 1fr;
    gap:100px;
    align-items:start;

    margin-top:-10px;
}

.footer-newsletter{
    width:360px;
}

.footer-newsletter h4{
    margin-bottom:14px;
    font-size:18px;
    font-weight:700;
    color:#111827;
}

.footer-newsletter p{
    margin-bottom:24px;
    font-size:16px;
    line-height:1.5;
    color:#667085;
}

.footer-newsletter .newsletter{
    display:flex;
    flex-direction:column;
    gap:16px;
    width:100%;
}

.footer-newsletter .newsletter input{
    width:100%;
    height:62px;
    padding:0 22px;
    border-radius:18px;
    border:1px solid rgba(17,24,39,.08);
    background:rgba(255,255,255,.82);
    font-family:inherit;
    font-size:16px;
    color:#111827;
    outline:none;
}

.footer-newsletter .newsletter input::placeholder{
    color:#98a2b3;
}

.footer-newsletter .newsletter button{
    width:100%;
    height:62px;
    border:none;
    border-radius:18px;
    background:linear-gradient(135deg,#5f7cff,#845cff);
    color:#fff;
    font-family:inherit;
    font-size:16px;
    font-weight:700;
    cursor:pointer;
    box-shadow:0 16px 32px rgba(104,92,255,.22);
}
.footer-logo{
    display:block;
    width:200px;
    height:auto;

    margin-left:-18px;
    margin-bottom:-8px;
}
/* ===========================
   CART DRAWER
=========================== */

/* =========================
   PREMIUM CART DRAWER
========================= */

.cart-overlay{
    position:fixed;
    inset:0;
    z-index:9998;

    background:rgba(15,23,42,.18);

    backdrop-filter:blur(5px);
    -webkit-backdrop-filter:blur(5px);

    opacity:0;
    visibility:hidden;

    transition:
        opacity .3s ease,
        visibility .3s ease;
}

.cart-overlay.active{
    opacity:1;
    visibility:visible;
}

.cart-drawer{
    position:fixed;
    top:12px;
    right:12px;
    bottom:12px;

    width:min(440px,calc(100% - 24px));
    height:auto;

    display:flex;
    flex-direction:column;

    background:rgba(255,255,255,.96);

    border:1px solid rgba(15,23,42,.08);
    border-radius:30px;

    box-shadow:
        0 30px 90px rgba(15,23,42,.18),
        inset 0 1px 0 rgba(255,255,255,.95);

    overflow:hidden;

    transform:translateX(calc(100% + 30px));
    transition:transform .42s cubic-bezier(.22,.61,.36,1);

    z-index:9999;
}

.cart-drawer.active{
    transform:translateX(0);
}

/* HEADER */

.cart-header{
    display:flex;
    align-items:center;
    justify-content:space-between;

    padding:24px 24px 20px;

    background:rgba(255,255,255,.88);
    border-bottom:1px solid rgba(15,23,42,.06);
}

.cart-header h2{
    margin:0;

    font-size:22px;
    font-weight:750;
    letter-spacing:-.6px;

    color:#101828;
}

.cart-close{
    width:42px;
    height:42px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:0;
    border:1px solid rgba(15,23,42,.07);
    border-radius:14px;

    background:#f8fafc;
    color:#344054;

    font-size:19px;
    line-height:1;

    cursor:pointer;

    transition:
        transform .25s ease,
        background .25s ease;
}

.cart-close:hover{
    transform:rotate(90deg);
    background:#f1f4f8;
}

/* ITEMS AREA */

.cart-items{
    flex:1;

    display:flex;
    flex-direction:column;
    gap:14px;

    padding:18px 18px 24px;

    overflow-y:auto;
}

.cart-items::-webkit-scrollbar{
    width:5px;
}

.cart-items::-webkit-scrollbar-thumb{
    background:rgba(102,112,133,.25);
    border-radius:999px;
}

/* PRODUCT CARD */

.cart-item{
    display:grid;
    grid-template-columns:72px minmax(0,1fr);
    gap:15px;

    padding:16px;

    background:#ffffff;

    border:1px solid rgba(15,23,42,.07);
    border-radius:21px;

    box-shadow:0 8px 24px rgba(15,23,42,.045);
}

.cart-item-logo{
    width:72px;
    height:72px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:18px;

    background:linear-gradient(
        145deg,
        #f5f7ff,
        #fafaff
    );

    border:1px solid rgba(93,124,255,.1);
}

.cart-item-logo img{
    width:42px;
    height:42px;
    object-fit:contain;
}

.cart-item-content{
    min-width:0;
}

.cart-item-top{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.cart-item-top h3{
    margin:1px 0 5px;

    font-size:15px;
    font-weight:750;
    line-height:1.3;

    color:#101828;
}

.cart-item-top p{
    margin:0;

    font-size:12px;
    line-height:1.4;

    color:#98a2b3;
}

.cart-item-top strong{
    flex-shrink:0;

    font-size:14px;
    font-weight:750;

    color:#101828;
}

/* QUANTITY AND REMOVE */

.cart-item-actions{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;

    margin-top:14px;
}

.cart-quantity{
    display:flex;
    align-items:center;
    gap:5px;

    margin:0;
    padding:4px;

    background:#f5f7fa;
    border-radius:12px;
}

.quantity-btn{
    width:29px;
    height:29px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:0;
    border:none;
    border-radius:9px;

    background:#ffffff;
    color:#344054;

    box-shadow:0 2px 7px rgba(15,23,42,.07);

    font-size:16px;
    font-weight:600;
    line-height:1;

    cursor:pointer;
}

.cart-quantity span{
    min-width:25px;

    text-align:center;

    font-size:13px;
    font-weight:700;

    color:#344054;
}

.remove-item{
    padding:0;

    border:none;
    background:transparent;

    color:#98a2b3;

    font-size:12px;
    font-weight:600;

    cursor:pointer;

    transition:color .2s ease;
}

.remove-item:hover{
    color:#e5484d;
    text-decoration:none;
}

/* CART FOOTER */

.cart-summary{
    padding:20px 22px 22px;

    background:rgba(248,250,252,.96);

    border-top:1px solid rgba(15,23,42,.07);
}

.cart-summary-row{
    display:flex;
    align-items:center;
    justify-content:space-between;

    margin-bottom:10px;

    font-size:13px;

    color:#667085;
}

.cart-summary-row strong{
    color:#344054;
}

.cart-total{
    display:flex;
    align-items:center;
    justify-content:space-between;

    margin-top:17px;
    padding-top:17px;

    border-top:1px solid rgba(15,23,42,.08);

    font-size:16px;
    font-weight:700;

    color:#101828;
}

.cart-total strong{
    font-size:22px;
    letter-spacing:-.5px;
}

.cart-checkout{
    width:100%;
    height:55px;

    margin-top:20px;

    border:none;
    border-radius:16px;

    background:linear-gradient(
        135deg,
        #5d7cff 0%,
        #7357e8 55%,
        #8a63ee 100%
    );

    color:#ffffff;

    font-size:15px;
    font-weight:750;

    box-shadow:0 14px 30px rgba(93,124,255,.25);

    cursor:pointer;

    transition:
        transform .25s ease,
        box-shadow .25s ease;
}

.cart-checkout:hover{
    transform:translateY(-2px);

    box-shadow:0 18px 36px rgba(93,124,255,.32);
}

.cart-continue{
    display:block;

    margin:15px auto 0;
    padding:0;

    border:none;
    background:transparent;

    color:#667085;

    font-size:13px;
    font-weight:600;

    cursor:pointer;
}

.cart-continue:hover{
    color:#344054;
}

.cart-payment-methods{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:7px;

    margin-top:17px;
}

.cart-payment-methods span{
    padding:6px 10px;

    border:1px solid rgba(15,23,42,.06);
    border-radius:8px;

    background:#ffffff;

    color:#667085;

    font-size:10px;
    font-weight:650;
}

/* EMPTY CART */

.cart-empty{
    flex:1;
    min-height:300px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    padding:40px 24px;

    text-align:center;
}

.cart-empty-icon{
    display:flex;
    align-items:center;
    justify-content:center;

    width:64px;
    height:64px;

    margin-bottom:24px;

    border:1px solid rgba(93,124,255,.12);
    border-radius:20px;

    background:#ffffff;

    color:#695cff;

    box-shadow:
        0 12px 28px rgba(28,36,75,.07),
        inset 0 1px 0 rgba(255,255,255,.95);
}

.cart-empty-icon::before,
.cart-empty-icon::after{
    content:none !important;
    display:none !important;
}

.cart-empty-icon svg{
    display:block;

    width:28px;
    height:28px;

    position:static;
    transform:none;
}

.cart-empty h3{
    margin:0 0 8px;

    font-size:19px;
    font-weight:750;
    letter-spacing:-.3px;

    color:#101828;
}

.cart-empty p{
    max-width:250px;

    margin:0;

    color:#98a2b3;

    font-size:13px;
    line-height:1.6;
}

/* MOBILE */

@media(max-width:560px){

    .cart-drawer{
        top:8px;
        right:8px;
        bottom:8px;

        width:calc(100% - 16px);

        border-radius:24px;
    }

    .cart-header{
        padding:20px 18px 16px;
    }

    .cart-items{
        padding:14px;
    }

    .cart-summary{
        padding:18px;
    }

}
.faq-header {
    width: 100%;
    margin: 0 auto 55px;
    text-align: center;
}

.faq-header h2 {
    margin: 0 0 20px;
    text-align: center;
}

.faq-header p {
    max-width: 700px;
    margin: 0 auto;
    text-align: center;
}
/* REVIEW KARTICE – SAMO HORIZONTALNO KRUŽENJE */

#reviews .review-card,
#reviews .review-card:hover,
#reviews .review-card.show,
#reviews .review-card.reveal,
#reviews .show .review-card {
    animation: none !important;
    transform: none !important;
    translate: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    transition:
        border-color .35s ease,
        box-shadow .35s ease !important;
}

/* traka nastavlja neprekidno da se kreće */

#reviews .reviews-track,
#reviews .reviews-slider:hover .reviews-track {
    animation-name: reviewsLoop !important;
    animation-duration: 42s !important;
    animation-timing-function: linear !important;
    animation-iteration-count: infinite !important;
    animation-play-state: running !important;
}
#reviews {
    padding-bottom: 60px !important;
}

#faq {
    padding-top: 75px !important;
}
/*==================================================
WHY MODAL
==================================================*/

.why-modal-box{
    position:relative;
    z-index:2;

    width:min(920px,100%);
    padding:28px 24px 24px;

    border-radius:34px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.34),
            rgba(255,255,255,.14)
        );

    backdrop-filter:
        blur(34px)
        saturate(180%);

    -webkit-backdrop-filter:
        blur(34px)
        saturate(180%);

    border:1px solid rgba(255,255,255,.72);

    box-shadow:
        0 40px 110px rgba(15,23,42,.22),
        inset 0 1px 0 rgba(255,255,255,.95),
        inset 0 -1px 0 rgba(255,255,255,.16);

    overflow:hidden;
}
.why-modal-box::before{
    content:"";

    position:absolute;
    top:-60%;
    left:-22%;

    width:55%;
    height:220%;

    background:
        linear-gradient(
            110deg,
            transparent,
            rgba(255,255,255,.34),
            transparent
        );

    transform:rotate(18deg);

    pointer-events:none;
    z-index:0;
}
.why-modal-header,
.why-modal-grid,
.why-modal-close{
    position:relative;
    z-index:2;
}
.why-modal-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px;

    background:transparent;
    border:none;
    box-shadow:none;
}
.why-modal-card{
    min-height:285px;
    padding:28px 24px;

    border-radius:26px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.42),
            rgba(255,255,255,.18)
        );

    backdrop-filter:blur(22px) saturate(170%);
    -webkit-backdrop-filter:blur(22px) saturate(170%);

    border:1px solid rgba(255,255,255,.76);

    box-shadow:
        0 18px 45px rgba(15,23,42,.07),
        inset 0 1px 0 rgba(255,255,255,.92);

    text-align:center;
}

.why-modal.active{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
}

.why-modal-overlay{
    position:absolute;
    inset:0;

    background:rgba(17,24,39,.42);

    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
}


/* GLAVNI PROZOR */

.why-modal-box{
    position:relative;
    z-index:2;

    width:min(920px,100%);
    max-height:calc(100vh - 60px);

    overflow:auto;

    padding:38px 28px 28px;

    border-radius:36px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.86),
            rgba(255,255,255,.58)
        );

    backdrop-filter:blur(36px) saturate(180%);
    -webkit-backdrop-filter:blur(36px) saturate(180%);

    border:1px solid rgba(255,255,255,.96);

    box-shadow:
        0 45px 120px rgba(15,23,42,.24),
        inset 0 1px 0 rgba(255,255,255,1),
        inset 0 -1px 0 rgba(255,255,255,.25);

    transform:
        translateY(35px)
        scale(.96);

    opacity:0;

    transition:
        transform .5s cubic-bezier(.22,.61,.36,1),
        opacity .4s ease;
}

.why-modal.active .why-modal-box{
    transform:
        translateY(0)
        scale(1);

    opacity:1;
}


/* ZATVARANJE */

.why-modal-close{
    position:absolute;

    top:24px;
    right:24px;

    width:46px;
    height:46px;

    border:none;
    border-radius:50%;

    background:rgba(255,255,255,.66);

    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);

    box-shadow:
        0 10px 28px rgba(15,23,42,.08);

    cursor:pointer;

    transition:
        transform .3s ease,
        background .3s ease;
}

.why-modal-close:hover{
    transform:none;
    background:rgba(255,255,255,.92);
}

.why-modal-close span{
    position:absolute;

    left:50%;
    top:50%;

    width:20px;
    height:2px;

    border-radius:999px;

    background:#111827;
}

.why-modal-close span:first-child{
    transform:
        translate(-50%,-50%)
        rotate(45deg);
}

.why-modal-close span:last-child{
    transform:
        translate(-50%,-50%)
        rotate(-45deg);
}


/* HEADER */

.why-modal-header{
    max-width:650px;

    margin:0 auto 30px;

    text-align:center;
}

.why-modal-icon{
    width:72px;
    height:72px;

    margin:0 auto 16px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.94),
            rgba(239,236,255,.68)
        );

    border:1px solid rgba(255,255,255,.98);

    box-shadow:
        0 18px 45px rgba(109,92,255,.17),
        inset 0 1px 0 rgba(255,255,255,1);
}

.why-modal-icon i{
    color:#765dff;
    font-size:29px;
}

.why-modal-label{
    display:inline-flex;

    padding:8px 15px;
    margin-bottom:12px;

    border-radius:999px;

    background:rgba(93,124,255,.10);
    color:#5d7cff;

    font-size:13px;
    font-weight:800;
}

.why-modal-header h2{
    margin:0 0 12px;

    color:#101827;

    font-size:clamp(38px,4vw,54px);
    line-height:1.05;

    letter-spacing:-2.5px;
}

.why-modal-header p{
    max-width:590px;

    margin:0 auto;

    color:#6b7280;

    font-size:17px;
    line-height:1.7;
}


/* TRI KOLONE */

.why-modal-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px;

    overflow:visible;

    background:transparent;
    border:none;
    box-shadow:none;
}

.why-modal-card{
    position:relative;

    min-height:285px;

    padding:28px 24px 24px;

    text-align:center;

    border-radius:26px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.58),
            rgba(255,255,255,.26)
        );

    backdrop-filter:blur(24px) saturate(170%);
    -webkit-backdrop-filter:blur(24px) saturate(170%);

    border:1px solid rgba(255,255,255,.90);

    box-shadow:
        0 20px 50px rgba(15,23,42,.07),
        inset 0 1px 0 rgba(255,255,255,.95);
}


.why-card-icon{
    width:76px;
    height:76px;

    margin:0 auto 24px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.96),
            rgba(237,241,255,.70)
        );

    border:1px solid rgba(255,255,255,.98);

    box-shadow:
        0 18px 42px rgba(93,124,255,.14),
        inset 0 1px 0 rgba(255,255,255,1);

    transition:
        transform .4s ease,
        box-shadow .4s ease;
}

.why-card-icon i{
    color:#5d7cff;

    font-size:30px;
}

.why-modal-card:hover .why-card-icon{
    transform:translateY(-6px);

    box-shadow:
        0 24px 52px rgba(93,124,255,.22),
        inset 0 1px 0 rgba(255,255,255,1);
}

.why-modal-card h3{
    margin:0;

    color:#111827;

    font-size:19px;
    line-height:1.35;

    font-weight:800;
}

.why-card-line{
    display:block;

    width:28px;
    height:3px;

    margin:20px auto;

    border-radius:999px;

    background:linear-gradient(
        135deg,
        #5d7cff,
        #8866ff
    );
}

.why-modal-card p{
    margin:0;

    color:#657083;

    font-size:15px;
    line-height:1.75;
}


/* DONJA TRAKA */

.why-modal-bottom{
    margin-top:22px;
    padding:18px 24px;

    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;

    gap:22px;

    border-radius:22px;

    background:rgba(255,255,255,.54);

    border:1px solid rgba(255,255,255,.88);

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.95);
}

.why-bottom-item{
    display:flex;
    align-items:center;

    gap:10px;

    color:#596273;

    font-size:14px;
    font-weight:600;
}

.why-bottom-item i{
    color:#755dff;
    font-size:16px;
}

.why-bottom-dot{
    width:6px;
    height:6px;

    border-radius:50%;

    background:#765dff;
}


/* ZABRANI SKROL KAD JE MODAL OTVOREN */

body.modal-open{
    overflow:hidden;
}


/* RESPONSIVE */

@media(max-width:760px){

    .why-modal{
        padding:16px;
    }

    .why-modal-box{
        padding:65px 18px 22px;
        border-radius:28px;
    }

    .why-modal-grid{
        grid-template-columns:1fr;
    }

    .why-modal-card{
        min-height:auto;
        padding:30px 24px;
    }

    .why-modal-card:not(:last-child){
        border-right:none;
        border-bottom:1px solid rgba(17,24,39,.08);
    }

    .why-modal-bottom{
        flex-direction:column;
        align-items:flex-start;
    }

    .why-bottom-dot{
        display:none;
    }

}
#whyModal{
    position:fixed;
    inset:0;
    z-index:999999;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:30px;

    opacity:0;
    visibility:hidden;
    pointer-events:none;
}

#whyModal.active{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
}

#whyModal .why-modal-overlay{
    position:absolute;
    inset:0;

    background:rgba(17,24,39,.10);

    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
}

#whyModal .why-modal-box{
    position:relative;
    z-index:2;
}

body.modal-open{
    overflow:hidden;
}
/* STAKLO */

#whyModal .why-modal-box{
    position:relative;
    z-index:2;

    width:min(1120px,94%);
    min-height:650px;
    padding:58px 34px 52px;

    border-radius:38px;

    background:rgba(255,255,255,.12);

    backdrop-filter:blur(22px) saturate(180%);
    -webkit-backdrop-filter:blur(30px) saturate(180%);

    border:1px solid rgba(255,255,255,.55);

    box-shadow:
        0 16px 45px rgba(17,24,39,.14),
        inset 0 1px 0 rgba(255,255,255,.75),
        inset 0 -1px 0 rgba(255,255,255,.10);

    overflow:hidden;
}
#whyModal .why-modal-box::before,
#whyModal .why-modal-box::after{
    display:none !important;
}
/*==================================================
ADOBE PRODUCT MODAL
==================================================*/

.product-modal{
    position:fixed;
    inset:0;

    z-index:30000;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:30px;

    opacity:0;
    visibility:hidden;
    pointer-events:none;

    transition:
        opacity .35s ease,
        visibility .35s ease;
}

.product-modal.active{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
}

.product-modal-overlay{
    position:absolute;
    inset:0;

    background:rgba(17,24,39,.20);

    backdrop-filter:blur(13px);
    -webkit-backdrop-filter:blur(13px);
}


/* GLAVNI GLASS PROZOR */

.product-modal-box{
    position:relative;
    z-index:2;

    width:min(1080px,95%);
    max-height:calc(100vh - 50px);

    padding:32px;

    overflow:auto;

    border-radius:38px;

    background:rgba(255,255,255,.22);

    backdrop-filter:
        blur(30px)
        saturate(180%);

    -webkit-backdrop-filter:
        blur(30px)
        saturate(180%);

    border:1px solid rgba(255,255,255,.72);

    box-shadow:
        0 40px 110px rgba(15,23,42,.20),
        inset 0 1px 0 rgba(255,255,255,.92),
        inset 0 -1px 0 rgba(255,255,255,.12);

    opacity:0;

    transform:
        translateY(28px)
        scale(.97);

    transition:
        opacity .4s ease,
        transform .5s cubic-bezier(.22,.61,.36,1);
}

.product-modal.active .product-modal-box{
    opacity:1;

    transform:
        translateY(0)
        scale(1);
}


/* X DUGME */

.product-modal-close{
    position:absolute;

    top:22px;
    right:22px;

    z-index:5;

    width:48px;
    height:48px;

    padding:0;

    border:none;
    border-radius:50%;

    background:rgba(255,255,255,.74);

    color:#111827;

    cursor:pointer;

    box-shadow:
        0 12px 30px rgba(15,23,42,.08);

    transition:background .25s ease;
}

.product-modal-close:hover{
    background:rgba(255,255,255,.95);
}

.product-modal-close span{
    position:absolute;

    top:50%;
    left:50%;

    width:20px;
    height:2px;

    border-radius:999px;

    background:#111827;
}

.product-modal-close span:first-child{
    transform:
        translate(-50%,-50%)
        rotate(45deg);
}

.product-modal-close span:last-child{
    transform:
        translate(-50%,-50%)
        rotate(-45deg);
}


/* RASPORED */

.product-modal-layout{
    display:grid;
    grid-template-columns:.85fr 1.15fr;

    gap:26px;
}


/* LEVA STRANA */

.product-modal-visual{
    position:relative;

    min-height:570px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    padding:50px 38px;

    text-align:center;

    border-radius:30px;

    background:rgba(255,255,255,.20);

    backdrop-filter:blur(22px) saturate(170%);
    -webkit-backdrop-filter:blur(22px) saturate(170%);

    border:1px solid rgba(255,255,255,.68);

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.85),
        0 22px 55px rgba(15,23,42,.07);
}

.product-modal-discount{
    position:absolute;

    top:24px;
    left:24px;

    padding:9px 16px;

    border-radius:999px;

    background:linear-gradient(
        135deg,
        #5d7cff,
        #8866ff
    );

    color:#fff;

    font-size:13px;
    font-weight:800;
}

.product-modal-logo{
    width:150px;
    height:150px;

    margin-bottom:28px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:38px;

    background:rgba(255,255,255,.48);

    backdrop-filter:blur(22px);
    -webkit-backdrop-filter:blur(22px);

    border:1px solid rgba(255,255,255,.90);

    box-shadow:
        0 24px 55px rgba(15,23,42,.08),
        inset 0 1px 0 rgba(255,255,255,.95);
}

.product-modal-logo img{
    width:88px;
    height:88px;

    object-fit:contain;
}

.product-modal-status{
    display:inline-flex;

    padding:9px 16px;
    margin-bottom:20px;

    border-radius:999px;

    background:rgba(93,124,255,.10);
    color:#5d7cff;

    font-size:13px;
    font-weight:800;
}

.product-modal-visual h2{
    margin:0 0 18px;

    color:#111827;

    font-size:36px;
    line-height:1.12;

    letter-spacing:-1.5px;
}

.product-modal-visual p{
    max-width:390px;

    margin:0;

    color:#687285;

    font-size:16px;
    line-height:1.75;
}


/* DESNA STRANA */

.product-modal-content{
    min-height:570px;

    display:flex;
    flex-direction:column;

    padding:48px 42px 36px;

    border-radius:30px;

    background:rgba(255,255,255,.30);

    backdrop-filter:blur(22px) saturate(170%);
    -webkit-backdrop-filter:blur(22px) saturate(170%);

    border:1px solid rgba(255,255,255,.72);

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.88),
        0 22px 55px rgba(15,23,42,.07);
}

.product-modal-heading > span{
    display:block;

    margin-bottom:8px;

    color:#5d7cff;

    font-size:13px;
    font-weight:800;

    text-transform:uppercase;
    letter-spacing:1px;
}

.product-modal-heading h3{
    margin:0;

    color:#111827;

    font-size:28px;
    line-height:1.2;

    letter-spacing:-1px;
}


/* FEATURES */

.product-modal-features{
    display:flex;
    flex-direction:column;

    gap:17px;

    margin:32px 0;

    padding:0;

    list-style:none;
}

.product-modal-features li{
    display:flex;
    align-items:center;

    gap:13px;

    color:#596273;

    font-size:15px;
    line-height:1.5;
}

.product-modal-features i{
    width:28px;
    height:28px;

    flex-shrink:0;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    background:rgba(93,124,255,.11);
    color:#5d7cff;

    font-size:12px;
}


/* CENA I KOLIČINA */

.product-modal-purchase{
    margin-top:auto;

    padding:22px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:25px;

    border-radius:22px;

    background:rgba(255,255,255,.48);

    border:1px solid rgba(255,255,255,.82);
}

.product-modal-price-label,
.quantity-label{
    display:block;

    margin-bottom:8px;

    color:#7a8392;

    font-size:12px;
    font-weight:700;
}

.product-modal-price strong{
    color:#111827;

    font-size:32px;
    font-weight:850;

    letter-spacing:-1px;
}

.product-modal-old-price{
    margin-left:10px;

    color:#9ca3af;

    font-size:15px;

    text-decoration:line-through;
}

.quantity-control{
    text-align:right;
}

.quantity-buttons{
    display:flex;
    align-items:center;

    overflow:hidden;

    border-radius:14px;

    background:rgba(255,255,255,.80);

    border:1px solid rgba(17,24,39,.07);
}

.quantity-buttons button{
    width:42px;
    height:42px;

    padding:0;

    border:none;

    background:transparent;

    color:#111827;

    font-size:22px;

    cursor:pointer;
}

.quantity-buttons span{
    min-width:42px;

    text-align:center;

    color:#111827;

    font-size:15px;
    font-weight:800;
}


/* ADD TO CART */

.product-modal-add{
    width:100%;
    height:62px;

    margin-top:18px;

    display:flex;
    align-items:center;
    justify-content:center;

    gap:11px;

    border:none;
    border-radius:19px;

    background:linear-gradient(
        135deg,
        #5d7cff,
        #8866ff
    );

    color:#fff;

    font-family:inherit;
    font-size:16px;
    font-weight:800;

    cursor:pointer;

    box-shadow:
        0 18px 42px rgba(93,124,255,.28);

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

.product-modal-add:hover{
    transform:translateY(-2px);

    box-shadow:
        0 24px 50px rgba(93,124,255,.37);
}

.product-modal-security{
    display:flex;
    align-items:center;
    justify-content:center;

    gap:28px;

    margin-top:20px;

    color:#737c8b;

    font-size:12px;
}

.product-modal-security span{
    display:flex;
    align-items:center;

    gap:7px;
}

.product-modal-security i{
    color:#6f5cff;
}


/* ZABRANI SKROL STRANICE */

body.product-modal-open{
    overflow:hidden;
}


/* RESPONSIVE */

@media(max-width:850px){

    .product-modal{
        padding:14px;
    }

    .product-modal-box{
        padding:18px;
    }

    .product-modal-layout{
        grid-template-columns:1fr;
    }

    .product-modal-visual,
    .product-modal-content{
        min-height:auto;
    }

    .product-modal-visual{
        padding:45px 25px 35px;
    }

}

@media(max-width:520px){

    .product-modal-content{
        padding:35px 22px 24px;
    }

    .product-modal-purchase{
        align-items:flex-start;
        flex-direction:column;
    }

    .quantity-control{
        text-align:left;
    }

    .product-modal-security{
        align-items:flex-start;
        flex-direction:column;

        gap:10px;
    }

}
/* =========================================
   CART CLOSE — BEZ OKRETANJA I ANIMACIJE
========================================= */

.cart-drawer .cart-close,
.cart-drawer .cart-close:hover,
.cart-drawer .cart-close:active{
    transform:none !important;
    rotate:0deg !important;
    animation:none !important;
}

.cart-drawer .cart-close i,
.cart-drawer .cart-close:hover i,
.cart-drawer .cart-close svg,
.cart-drawer .cart-close:hover svg{
    transform:none !important;
    rotate:0deg !important;
    animation:none !important;
}

.cart-drawer .cart-close{
    transition:
        background-color .22s ease,
        border-color .22s ease,
        box-shadow .22s ease !important;
}

.cart-drawer .cart-close:hover{
    background:rgba(245,246,252,.95) !important;
    border-color:rgba(199,205,224,.72) !important;

    box-shadow:
        0 8px 18px rgba(30,38,70,.08) !important;
}
/* =========================================
   PREMIUM EMPTY CART
========================================= */

.cart-drawer .cart-empty{
    width:100%;
    min-height:330px;

    padding:42px 32px 34px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    text-align:center;
}


/* VIZUELNI DEO */

.cart-drawer .cart-empty-visual{
    position:relative;

    width:116px;
    height:116px;

    margin-bottom:24px;

    display:flex;
    align-items:center;
    justify-content:center;
}

.cart-drawer .cart-empty-orbit{
    position:absolute;
    inset:0;

    border-radius:50%;

    background:
        radial-gradient(
            circle at 32% 28%,
            rgba(255,255,255,.98),
            rgba(245,247,255,.76) 45%,
            rgba(231,229,255,.42) 100%
        );

    border:1px solid rgba(207,213,234,.62);

    box-shadow:
        0 22px 48px rgba(53,62,105,.10),
        0 0 35px rgba(116,88,255,.10),
        inset 0 2px 2px rgba(255,255,255,1),
        inset 0 -2px 4px rgba(133,145,190,.07);
}

.cart-drawer .cart-empty-icon{
    position:relative;
    z-index:2;

    width:66px;
    height:66px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:22px;

    color:#7054ff;

    font-size:27px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.98),
            rgba(246,246,255,.76)
        );

    border:1px solid rgba(255,255,255,.94);

    box-shadow:
        0 12px 28px rgba(65,75,120,.10),
        inset 0 1px 1px rgba(255,255,255,1);
}


/* SITNI DETALJI */

.cart-drawer .cart-empty-sparkle{
    position:absolute;
    z-index:3;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#8b55ff;
}

.cart-drawer .sparkle-one{
    top:9px;
    right:3px;

    font-size:16px;
}

.cart-drawer .sparkle-two{
    bottom:15px;
    left:5px;

    font-size:7px;

    opacity:.58;
}


/* TEKST */

.cart-drawer .cart-empty-label{
    margin-bottom:9px;

    color:#7856ff;

    font-size:11px;
    line-height:1;
    font-weight:800;

    letter-spacing:1.7px;
    text-transform:uppercase;
}

.cart-drawer .cart-empty h3{
    margin:0;

    color:#0c1220;

    font-size:24px;
    line-height:1.18;
    font-weight:800;

    letter-spacing:-.7px;
}

.cart-drawer .cart-empty p{
    max-width:300px;

    margin:12px auto 0;

    color:#858c9e;

    font-size:14px;
    line-height:1.65;
}


/* DUGME */

.cart-drawer .cart-empty-shop{
    min-width:190px;
    height:48px;

    margin-top:23px;
    padding:0 22px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    gap:10px;

    border:1px solid rgba(117,86,255,.18);
    border-radius:16px;

    color:#6848f5;

    font-family:inherit;
    font-size:13px;
    line-height:1;
    font-weight:750;

    background:
        linear-gradient(
            145deg,
            rgba(247,246,255,.98),
            rgba(241,239,255,.76)
        );

    box-shadow:
        0 12px 25px rgba(94,70,210,.10),
        inset 0 1px 1px rgba(255,255,255,1);

    cursor:pointer;

    transition:
        transform .22s ease,
        box-shadow .22s ease,
        background .22s ease;
}

.cart-drawer .cart-empty-shop:hover{
    transform:translateY(-2px);

    background:
        linear-gradient(
            135deg,
            rgba(115,84,255,.12),
            rgba(154,67,255,.09)
        );

    box-shadow:
        0 16px 31px rgba(94,70,210,.16),
        inset 0 1px 1px rgba(255,255,255,1);
}

.cart-drawer .cart-empty-shop i{
    font-size:12px;

    transition:transform .22s ease;
}

.cart-drawer .cart-empty-shop:hover i{
    transform:translateX(3px);
}
/* UKLANJANJE RAVNIH LINIJA I PREJAKIH SENKI NA SVIM UREĐAJIMA */

.process-card{
    box-shadow:
        0 14px 32px rgba(28,36,75,.07),
        inset 0 1px 0 rgba(255,255,255,.95) !important;
}

.process-card::before{
    display:none !important;
}

.products-grid .product-card{
    box-shadow:
        0 14px 32px rgba(28,36,75,.07),
        inset 0 1px 0 rgba(255,255,255,.95) !important;
}

.products-grid .product-card::before,
.products-grid .product-card::after{
    box-shadow:none !important;
}

.review-card{
    box-shadow:
        0 14px 30px rgba(28,36,75,.06),
        inset 0 1px 0 rgba(255,255,255,.95) !important;
}

.hero-buttons .secondary-btn{
    box-shadow:none !important;
}

.products,
.process,
.reviews-section,
.reviews-slider{
    overflow-x:hidden !important;
}

.products-liquid-background,
.reviews-glow,
.reviews-glow-left,
.reviews-glow-right,
.reviews-fade,
.reviews-fade-left,
.reviews-fade-right{
    display:none !important;
}
/* =====================================================
   JEDNA POZADINA SAJTA — SVI UREĐAJI
===================================================== */

html,
body{
    background:#f8f9fc !important;
    background-image:none !important;
}

.hero,
.big-title-section,
.process,
.products,
#products,
.reviews-section,
#reviews,
.reviews-slider,
.reviews-track,
.faq,
#faq{
    background:#f8f9fc !important;
    background-image:none !important;
    border-top:none !important;
    border-bottom:none !important;
}

/* UKLANJA SVE DEKORATIVNE SLOJEVE KOJI PRAVE PRELAZE */

body::before,
body::after,
.process::before,
.process::after,
.products::before,
.products::after,
.products-liquid-background,
.reviews-section::before,
.reviews-section::after,
.reviews-glow,
.reviews-glow-left,
.reviews-glow-right,
.reviews-fade,
.reviews-fade-left,
.reviews-fade-right{
    display:none !important;
    content:none !important;
    background:none !important;
    box-shadow:none !important;
}

/* BLAŽE SENKE — BEZ RAVNIH LINIJA ISPOD KARTICA */

.process-card,
.product-card,
.review-card{
    box-shadow:
        0 14px 32px rgba(28,36,75,.065),
        inset 0 1px 0 rgba(255,255,255,.95) !important;
}

/* SAMO FOOTER DRUGA BOJA */

.contact,
#contact,
.footer,
footer{
    background:#eef1f6 !important;
    background-image:none !important;
}
/* POPRAVKA PRAZNE KORPE */

.cart-empty{
    flex:1;
    min-height:300px;

    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;

    padding:40px 24px !important;

    text-align:center !important;
}

.cart-empty-icon{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:64px !important;
    height:64px !important;

    margin:0 auto 20px !important;

    flex-shrink:0 !important;
}

.cart-empty-label{
    display:block !important;

    margin:0 0 10px !important;

    text-align:center !important;
}

.cart-empty h3{
    display:block !important;

    width:100% !important;

    margin:0 0 8px !important;

    text-align:center !important;
}

.cart-empty p{
    display:block !important;

    width:100% !important;
    max-width:250px !important;

    margin:0 auto 22px !important;

    text-align:center !important;
}

.cart-empty-shop{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px !important;

    margin:0 auto !important;
}
.cart-drawer .cart-empty{
    width:100% !important;
    min-height:330px !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;

    padding:40px 28px !important;
    text-align:center !important;
}

.cart-drawer .cart-empty-icon{
    position:relative !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:64px !important;
    height:64px !important;

    margin:0 auto 20px !important;

    border-radius:20px !important;
    color:#7054ff !important;
    background:#ffffff !important;

    border:1px solid rgba(93,124,255,.12) !important;

    box-shadow:
        0 12px 28px rgba(65,75,120,.08) !important;
}

.cart-drawer .cart-empty-icon::before,
.cart-drawer .cart-empty-icon::after{
    content:none !important;
    display:none !important;
}

.cart-drawer .cart-empty-icon i{
    display:block !important;
    font-size:26px !important;
}

.cart-drawer .cart-empty-label{
    display:block !important;
    margin:0 0 10px !important;
}

.cart-drawer .cart-empty h3{
    width:100% !important;
    margin:0 0 10px !important;
    text-align:center !important;
}

.cart-drawer .cart-empty p{
    width:100% !important;
    max-width:260px !important;
    margin:0 auto 22px !important;
    text-align:center !important;
}

.cart-drawer .cart-empty-shop{
    margin:0 auto !important;
}
/* ==================================================
   FINALNA POPRAVKA PRAZNE KORPE
================================================== */

.cart-drawer .cart-items{
    overflow-x:hidden !important;
}

.cart-drawer .cart-items .cart-empty{
    width:100% !important;
    max-width:100% !important;
    min-height:330px !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;

    gap:0 !important;

    margin:0 !important;
    padding:40px 24px !important;

    text-align:center !important;
    overflow:hidden !important;
}

/* VIZUELNI DEO */

.cart-drawer .cart-empty-visual{
    position:relative !important;

    width:64px !important;
    height:64px !important;

    min-width:64px !important;
    min-height:64px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    margin:0 auto 20px !important;
    padding:0 !important;

    flex:none !important;
}

.cart-drawer .cart-empty-icon{
    position:static !important;

    width:64px !important;
    height:64px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    margin:0 !important;
    padding:0 !important;

    border:1px solid rgba(93,124,255,.12) !important;
    border-radius:20px !important;

    background:#ffffff !important;
    color:#7054ff !important;

    font-size:25px !important;

    box-shadow:
        0 12px 28px rgba(65,75,120,.08) !important;

    flex:none !important;
}

.cart-drawer .cart-empty-icon::before,
.cart-drawer .cart-empty-icon::after{
    content:none !important;
    display:none !important;
}

.cart-drawer .cart-empty-icon i{
    display:block !important;
    position:static !important;

    margin:0 !important;

    font-size:25px !important;
    line-height:1 !important;

    transform:none !important;
}

/* TEKST */

.cart-drawer .cart-empty-label{
    display:block !important;

    width:auto !important;

    margin:0 0 10px !important;
    padding:0 !important;

    color:#7856ff !important;

    font-size:10px !important;
    line-height:1 !important;
    font-weight:800 !important;
    letter-spacing:1.6px !important;

    text-align:center !important;
}

.cart-drawer .cart-empty h3{
    display:block !important;

    width:100% !important;
    max-width:320px !important;

    margin:0 0 10px !important;
    padding:0 !important;

    color:#0c1220 !important;

    font-size:23px !important;
    line-height:1.2 !important;
    font-weight:800 !important;

    text-align:center !important;
}

.cart-drawer .cart-empty p{
    display:block !important;

    width:100% !important;
    max-width:270px !important;

    margin:0 auto 22px !important;
    padding:0 !important;

    color:#858c9e !important;

    font-size:13px !important;
    line-height:1.6 !important;

    text-align:center !important;
}

/* DUGME */

.cart-drawer .cart-empty-shop{
    width:auto !important;
    min-width:190px !important;
    height:46px !important;

    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;

    gap:10px !important;

    margin:0 auto !important;
    padding:0 22px !important;

    flex:none !important;
}
/* PROMO KOD U KORPI */

.cart-promo{
    width:100%;
    margin:0 0 16px;
    padding:38px 0 16px;

    border-top:none !important;
    border-bottom:1px solid rgba(15,23,42,.08);
}
.cart-promo{
    border-top:none;
}

.cart-summary{
    padding-top:0;
}

.cart-summary::before{
    content:"";
    display:block;
    width:100%;
    height:1px;
    margin-bottom:18px;
    background:rgba(15,23,42,.08);
}
.cart-promo label{
    display:block;

    margin-bottom:9px;

    color:#344054;

    font-size:13px;
    font-weight:700;
}

.cart-promo-box{
    display:flex;
    align-items:center;

    gap:8px;
}

.cart-promo-box input{
    flex:1;
    min-width:0;
    height:44px;

    padding:0 13px;

    border:1px solid rgba(15,23,42,.10);
    border-radius:12px;

    outline:none;

    background:#ffffff;
    color:#101828;

    font-size:12px;

    transition:
        border-color .25s ease,
        box-shadow .25s ease;
}

.cart-promo-box input:focus{
    border-color:#765cff;

    box-shadow:
        0 0 0 3px rgba(118,92,255,.10);
}

.cart-promo-box button{
    height:44px;

    padding:0 16px;

    border:none;
    border-radius:12px;

    background:#101828;
    color:#ffffff;

    font-size:12px;
    font-weight:700;

    cursor:pointer;
}

.cart-promo-message{
    min-height:17px;

    margin:7px 0 0;

    font-size:11px;
    line-height:1.4;
}
.cart-promo{
    width:100%;
    margin:0;
    padding:16px 0;
    border-top:1px solid rgba(15,23,42,.08);
    border-bottom:1px solid rgba(15,23,42,.08);
}

.cart-promo-box{
    display:grid;
    grid-template-columns:1fr auto;
    gap:10px;
    align-items:center;
    width:100%;
}

.cart-promo-box input{
    width:100%;
    height:44px;
    padding:0 14px;

    border:1px solid rgba(15,23,42,.12);
    border-radius:12px;

    background:#ffffff;
    color:#101828;

    font-size:12px;
    outline:none;
}

.cart-promo-box button{
    height:44px;
    padding:0 18px;

    border:0;
    border-radius:12px;

    background:#101828;
    color:#ffffff;

    font-size:12px;
    font-weight:700;
    cursor:pointer;
}

.cart-promo-message{
    min-height:14px;
    margin:7px 0 0;
    font-size:11px;
}

.cart-total{
    margin-top:0 !important;
    padding-top:16px !important;
}
#applyPromoCode{
    background:linear-gradient(
        135deg,
        #5d7cff 0%,
        #7357e8 55%,
        #8a63ee 100%
    ) !important;

    box-shadow:0 10px 24px rgba(93,124,255,.22);
}
.cart-summary{
    border-top:none !important;
}

.cart-promo{
    border-top:none !important;
}

.cart-summary::before{
    content:none !important;
    display:none !important;
}
#privacyModal,
#termsModal,
#refundModal{
    display:none !important;
}
.header::before,
.header::after,
.nav::before,
.nav::after{
    display:none !important;
    content:none !important;
}
/* TAČNO CENTRIRANJE MENIJA */

.header .nav{
    position:relative;
}

.header .desktop-menu{
    position:absolute !important;
    left:50% !important;
    top:50% !important;

    display:flex !important;
    gap:38px !important;

    margin:0 !important;

    transform:translate(-50%, -50%) !important;
}


/* UKLANJANJE LINIJE / SJAJA PREKO NAVBARA */

.header::before,
.header::after,
.header .nav::before,
.header .nav::after,
.header .container::before,
.header .container::after{
    content:none !important;
    display:none !important;
    animation:none !important;
    background:none !important;
    box-shadow:none !important;
}
/* NAVBAR FINAL FIX */

.header::before{
    content:none !important;
    display:none !important;
    background:none !important;
    animation:none !important;
}

.header .nav{
    position:relative !important;
}

.header .desktop-menu{
    position:absolute !important;
    left:50% !important;
    top:50% !important;

    display:flex !important;
    gap:38px !important;

    margin:0 !important;

    transform:translate(-50%, -50%) !important;
}

.header .header-right{
    margin-left:auto !important;
}
.hero-card{
    box-shadow:none !important;
}

.hero-card.active{
    box-shadow:
        0 30px 80px rgba(0,0,0,.08) !important;
}

.hero-card:not(.active){
    box-shadow:none !important;
    background:transparent !important;
    border-color:transparent !important;
}
.hero-slider,
.hero-right{
    background:transparent !important;
    box-shadow:none !important;
}
/* FOOTER LOGO — FINALNO PORAVNANJE */

.footer-brand .footer-logo{
    position:static !important;

    display:block !important;

    width:200px !important;
    height:auto !important;

    margin-left:-38px !important;
    margin-right:0 !important;

    margin-top:36px !important;
    margin-bottom:10px !important;

    transform:none !important;
}
.footer-brand img{
    transform:translateY(35px) !important;
}
/* FOOTER — POMERI SAMO LICENSO LOGO */

.footer-brand img.footer-logo{
    position:relative !important;

    top:70px !important;
    left:-38px !important;

    margin:0 0 35px 0 !important;

    transform:none !important;
}
/* =========================================
   KORPA — FINALNO PORAVNANJE
========================================= */

/* Veći razmak između ikonice i naslova */

.cart-drawer .cart-empty-icon{
    margin-bottom:26px !important;
}

/* Podebljana linija iznad promo-koda */

.cart-drawer .cart-summary::before{
    content:"" !important;
    display:block !important;

    width:100% !important;
    height:2px !important;

    margin:0 0 24px !important;

    background:rgba(15,23,42,.13) !important;
}

/* Promo-kod malo niže */

.cart-drawer .cart-promo{
    margin:0 0 16px !important;
    padding:8px 0 16px !important;

    border-top:none !important;
}
/* UKLONI DUPLU LINIJU IZNAD UKUPNO */

.cart-drawer .cart-summary::before{
    content:"" !important;
    display:block !important;

    width:100% !important;
    height:2px !important;

    margin:0 0 24px !important;

    background:rgba(15,23,42,.13) !important;
}

/* GASI POSTOJEĆU DRUGU LINIJU */

.cart-drawer .cart-total{
    border-top:none !important;
    box-shadow:none !important;
}
/* =========================================
   KORPA — KOMPAKTNIJI DONJI DEO
========================================= */

.cart-drawer .cart-summary{
    padding-top:0 !important;
}

/* Linija iznad promo koda */

.cart-drawer .cart-summary::before{
    content:"" !important;
    display:block !important;

    width:100% !important;
    height:1px !important;

    margin:0 0 18px !important;

    background:rgba(17,24,39,.10) !important;
}

/* Promo kod — manji razmaci */

.cart-drawer .cart-promo{
    margin:0 0 16px !important;
    padding:0 !important;

    border:none !important;
}

/* Linija iznad ukupno */

.cart-drawer .cart-total{
    margin-top:0 !important;
    padding-top:18px !important;

    border-top:1px solid rgba(17,24,39,.10) !important;
}

/* Manji razmak ispod ukupnog iznosa */

.cart-drawer .cart-checkout{
    margin-top:16px !important;
}
/* SPUSTI SAMO PROMO POLJE I DUGME */

.cart-drawer .cart-promo{
    transform:translateY(12px) !important;
}
/* Spusti liniju iznad promo koda */

.cart-drawer .cart-summary::before{
    transform:translateY(18px) !important;
}
/* POMERI CEO DONJI BLOK KORPE NIŽE */

.cart-drawer .cart-summary{
    transform:translateY(18px) !important;

    border-top:none !important;
    box-shadow:none !important;
}

/* OSTAJE SAMO JEDNA PRAVA LINIJA IZNAD PROMO KODA */

.cart-drawer .cart-summary::before{
    content:"" !important;
    display:block !important;

    width:100% !important;
    height:1px !important;

    margin:0 0 14px !important;

    background:rgba(17,24,39,.10) !important;

    transform:none !important;
}
/* LINIJA IZNAD PROMO KODA — OD IVICE DO IVICE */

.cart-drawer .cart-summary::before{
    width:calc(100% + 48px) !important;
    margin-left:-24px !important;
    margin-right:-24px !important;

    height:1px !important;
    background:rgba(17,24,39,.10) !important;
}
/* KORPA — SITNA PORAVNANJA */

/* Spusti ljubičasti simbol korpice */

.cart-drawer .cart-empty-icon{
    transform:translateY(12px) !important;
}


/* UKLONI OSTATKE PRODUCT MODALA */

.product-modal,
.product-modal-add,
#modalAddToCart{
    display:none !important;
}
/* =========================================
   BIG TITLE — CENTRIRAN IZMEĐU HERO I PROCESS
========================================= */

.big-title-section{
    margin-top:-115px !important;
    margin-bottom:25px !important;

    padding-top:8px !important;
    padding-bottom:8px !important;
}
/* ==================================================
   LAPTOP — PODIGNI POKRETNU TRAKU I ZATVORI PRAZAN PROSTOR
================================================== */

@media (min-width:761px){

    .big-title-section{
        position:relative !important;
        margin-top:-170px !important;
        margin-bottom:-35px !important;
        padding:12px 0 !important;
        z-index:5 !important;
    }

    .process{
        margin-top:0 !important;
    }
}
/* TRaka BLIŽE HERO SEKCIJI, BEZ DODATNOG PRAZNOG PROSTORA */

@media (min-width:761px){

    .hero{
        padding-bottom:45px !important;
    }

    .big-title-section{
        margin-top:0 !important;
        margin-bottom:0 !important;
        padding:8px 0 !important;
    }

    .process{
        padding-top:35px !important;
        margin-top:0 !important;
    }
}
/* LAPTOP KORPA — POTPUNO BELA I NEPROVIDNA */

@media (min-width:761px){

    .cart-drawer,
    #cartDrawer{
        background:#ffffff !important;
        background-image:none !important;
        opacity:1 !important;

        backdrop-filter:none !important;
        -webkit-backdrop-filter:none !important;
    }

    .cart-drawer::before,
    .cart-drawer::after,
    #cartDrawer::before,
    #cartDrawer::after{
        content:none !important;
        display:none !important;
    }

    .cart-header,
    .cart-items,
    .cart-footer,
    .cart-summary,
    .cart-empty{
        background:#ffffff !important;
        background-image:none !important;

        backdrop-filter:none !important;
        -webkit-backdrop-filter:none !important;
    }
}
/* FINALNO — NEMA PROSTORA ISPOD FOOTERA */

html {
    margin: 0 !important;
    padding: 0 !important;
    background: #f8f9fc !important;
}

body {
    margin: 0 !important;
    padding: 0 !important;

    display: block !important;
    min-height: 0 !important;

    overflow-x: hidden !important;

    background: #f8f9fc !important;
}

.footer,
footer {
    margin: 0 !important;
    margin-bottom: 0 !important;

    border-bottom: 0 !important;

    background: #eef1f6 !important;
}

.footer-bottom {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}
/* LAPTOP — TRACKER BEZ PRAVOUGAONIKA */

@media (min-width:761px){

    .big-title-section,
    .big-title-wrapper,
    .big-title-track,
    .big-title-group{
        background:transparent !important;
        background-image:none !important;

        border:0 !important;
        outline:0 !important;
        box-shadow:none !important;
    }

    .big-title-section::before,
    .big-title-section::after,
    .big-title-wrapper::before,
    .big-title-wrapper::after{
        content:none !important;
        display:none !important;
    }
}
/* ==================================================
   LICENSO CHECKOUT MODAL
================================================== */

.licenso-checkout-modal{
    position:fixed;
    inset:0;
    z-index:99999;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:28px;
    visibility:hidden;
    opacity:0;
    pointer-events:none;
    transition:
        opacity .25s ease,
        visibility .25s ease;
}

.licenso-checkout-modal.is-open{
    visibility:visible;
    opacity:1;
    pointer-events:auto;
}

.licenso-checkout-backdrop{
    position:absolute;
    inset:0;
    background:rgba(22,25,40,.28);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
}

.licenso-checkout-window{
    position:relative;
    z-index:2;
    width:min(1180px, 100%);
    max-height:calc(100vh - 56px);
    overflow-y:auto;
    padding:32px;
    border-radius:32px;

    background:
        radial-gradient(
            circle at 90% 10%,
            rgba(123,94,255,.09),
            transparent 30%
        ),
        rgba(255,255,255,.96);

    border:1px solid rgba(255,255,255,.95);

    box-shadow:
        0 30px 90px rgba(30,35,65,.18),
        0 8px 30px rgba(67,72,110,.08),
        inset 0 1px 0 rgba(255,255,255,1);

    scrollbar-width:thin;
    scrollbar-color:rgba(112,94,255,.25) transparent;

    transform:translateY(18px) scale(.985);
    transition:transform .28s ease;
}

.licenso-checkout-modal.is-open
.licenso-checkout-window{
    transform:translateY(0) scale(1);
}

.licenso-checkout-window::-webkit-scrollbar{
    width:7px;
}

.licenso-checkout-window::-webkit-scrollbar-track{
    background:transparent;
}

.licenso-checkout-window::-webkit-scrollbar-thumb{
    background:rgba(112,94,255,.22);
    border-radius:999px;
}

/* TOP */

.licenso-checkout-close{
    position:absolute;
    top:22px;
    right:22px;
    width:42px;
    height:42px;
    border:0;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(245,246,252,.92);
    color:#73798c;
    font-size:18px;
    cursor:pointer;
    transition:
        background .2s ease,
        color .2s ease;
}

.licenso-checkout-close:hover{
    background:#eceef7;
    color:#2d3040;
}

.licenso-checkout-top{
    display:flex;
    align-items:center;
    gap:18px;
    padding-right:55px;
    margin-bottom:28px;
}

.licenso-checkout-back{
    width:44px;
    height:44px;
    flex:0 0 44px;
    border:0;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#f5f6fb;
    color:#555b6e;
    font-size:15px;
    cursor:pointer;
}

.licenso-checkout-heading{
    display:flex;
    align-items:center;
    gap:13px;
}

.licenso-checkout-lock{
    width:44px;
    height:44px;
    border-radius:15px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#7657ff;
    background:
        linear-gradient(
            145deg,
            rgba(120,88,255,.14),
            rgba(149,125,255,.06)
        );
    border:1px solid rgba(117,87,255,.12);
}

.licenso-checkout-heading h2{
    margin:0 0 3px;
    color:#202331;
    font-size:22px;
    line-height:1.15;
    font-weight:750;
    letter-spacing:-.6px;
}

.licenso-checkout-heading p{
    margin:0;
    color:#9297a8;
    font-size:12px;
    line-height:1.4;
}

/* LAYOUT */

.licenso-checkout-layout{
    display:grid;
    grid-template-columns:minmax(0, 1.65fr) minmax(320px, .85fr);
    gap:28px;
    align-items:start;
}

.licenso-checkout-main{
    min-width:0;
}

/* ORDER PREVIEW */

.licenso-order-preview{
    width:100%;
    min-height:76px;
    padding:14px 18px;
    border:1px solid #e8eaf2;
    border-radius:17px;
    display:grid;
    grid-template-columns:46px minmax(0,1fr) 18px auto;
    align-items:center;
    gap:13px;
    background:#fff;
    color:#2c2f3d;
    text-align:left;
    cursor:pointer;

    box-shadow:
        0 7px 22px rgba(40,44,75,.035),
        inset 0 1px 0 rgba(255,255,255,.9);
}

.licenso-order-icon{
    width:46px;
    height:46px;
    border-radius:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#7455ff;
    background:
        linear-gradient(
            145deg,
            rgba(121,89,255,.15),
            rgba(154,129,255,.07)
        );
    border:1px solid rgba(120,88,255,.1);
}

.licenso-order-copy{
    display:flex;
    flex-direction:column;
    min-width:0;
}

.licenso-order-copy strong{
    color:#333645;
    font-size:14px;
    line-height:1.3;
    font-weight:700;
}

.licenso-order-copy small{
    margin-top:3px;
    color:#a1a5b3;
    font-size:11px;
}

.licenso-order-preview > .fa-chevron-down{
    color:#9a9eac;
    font-size:11px;
}

.licenso-order-preview-total{
    color:#353846;
    font-size:14px;
    white-space:nowrap;
}

.licenso-order-products{
    display:none;
    margin-top:10px;
    padding:14px;
    border-radius:15px;
    border:1px solid #eceef5;
    background:#fafbfe;
}

.licenso-order-products.is-open{
    display:block;
}

/* SECTIONS */

.licenso-payment-section{
    margin-top:27px;
}

.licenso-section-title{
    display:flex;
    align-items:center;
    gap:9px;
    margin-bottom:12px;
    color:#333746;
}

.licenso-section-title > i{
    width:18px;
    color:#7557ff;
    font-size:14px;
    text-align:center;
}

.licenso-section-title h3{
    margin:0;
    font-size:13px;
    line-height:1.2;
    font-weight:700;
}

.licenso-section-title span{
    margin-left:2px;
    color:#a3a7b4;
    font-size:10px;
    font-weight:500;
}

/* INPUTS */

.licenso-field{
    position:relative;
    min-height:54px;
    display:flex;
    align-items:center;
    gap:10px;
    padding:0 15px;
    border:1px solid #e6e8f0;
    border-radius:14px;
    background:#fff;

    box-shadow:
        0 5px 18px rgba(40,45,75,.025),
        inset 0 1px 0 rgba(255,255,255,1);

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.licenso-field:focus-within{
    border-color:rgba(115,84,255,.45);
    box-shadow:
        0 0 0 4px rgba(115,84,255,.07),
        0 5px 18px rgba(40,45,75,.025);
}

.licenso-field-full{
    width:100%;
    margin-bottom:11px;
}

.licenso-fields-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:11px;
}

.licenso-field > i{
    flex:0 0 auto;
    color:#a6aab7;
    font-size:13px;
}

.licenso-field input,
.licenso-field select{
    width:100%;
    min-width:0;
    height:52px;
    border:0;
    outline:0;
    padding:0;
    background:transparent;
    color:#343746;
    font-family:inherit;
    font-size:13px;
}

.licenso-field input::placeholder{
    color:#b1b5c1;
    opacity:1;
}

.licenso-field select{
    appearance:none;
    -webkit-appearance:none;
    cursor:pointer;
}

.licenso-card-brands{
    flex:0 0 auto;
    display:flex;
    align-items:center;
    gap:5px;
}

.licenso-card-brands i{
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:25px;
    line-height:1;
}

.licenso-card-brands .fa-cc-visa{
    color:#1a1f71;
}

.licenso-card-brands .fa-cc-mastercard{
    color:#eb001b;
}

.licenso-card-brands .fa-paypal{
    color:#003087;
}

/* SUMMARY */

.licenso-checkout-summary{
    position:sticky;
    top:0;
    padding:22px;
    border-radius:22px;

    background:
        radial-gradient(
            circle at 100% 0,
            rgba(127,94,255,.10),
            transparent 40%
        ),
        linear-gradient(
            145deg,
            rgba(250,249,255,.96),
            rgba(245,245,253,.93)
        );

    border:1px solid rgba(226,226,240,.9);

    box-shadow:
        0 15px 40px rgba(48,52,85,.055),
        inset 0 1px 0 rgba(255,255,255,.95);
}

.licenso-payment-security{
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:12px;
    border-radius:15px;
    background:rgba(255,255,255,.62);
    border:1px solid rgba(232,232,244,.82);
}

.licenso-payment-security > span{
    width:38px;
    height:38px;
    flex:0 0 38px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#7355ff;
    background:rgba(118,85,255,.09);
}

.licenso-payment-security strong{
    display:block;
    margin:1px 0 4px;
    color:#4a4d5c;
    font-size:12px;
    line-height:1.3;
}

.licenso-payment-security p{
    margin:0;
    color:#a0a4b1;
    font-size:9px;
    line-height:1.45;
}

.licenso-summary-lines{
    padding:23px 4px 17px;
}

.licenso-summary-lines > div{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    color:#717686;
    font-size:12px;
}

.licenso-summary-lines strong{
    color:#414453;
    font-size:12px;
}

.licenso-summary-lines
.licenso-summary-total{
    margin-top:18px;
    padding-top:18px;
    border-top:1px solid rgba(218,220,232,.75);
    color:#313440;
    font-weight:700;
}

.licenso-summary-total strong{
    color:#7454ff;
    font-size:18px;
    letter-spacing:-.4px;
}

.licenso-pay-button{
    width:100%;
    min-height:55px;
    border:0;
    border-radius:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    padding:0 18px;
    color:#fff;
    cursor:pointer;
    font-family:inherit;

    background:
        linear-gradient(
            100deg,
            #6747ff 0%,
            #7e50ff 48%,
            #6d45f8 100%
        );

    box-shadow:
        0 14px 26px rgba(105,70,255,.22),
        inset 0 1px 0 rgba(255,255,255,.24);
}

.licenso-pay-button i{
    font-size:12px;
}

.licenso-pay-button span,
.licenso-pay-button strong{
    font-size:13px;
    font-weight:750;
}

.licenso-other-payment{
    position:relative;
    margin:19px 0 15px;
    text-align:center;
}

.licenso-other-payment::before{
    content:"";
    position:absolute;
    top:50%;
    left:0;
    width:100%;
    height:1px;
    background:#e4e5ed;
}

.licenso-other-payment span{
    position:relative;
    z-index:1;
    padding:0 10px;
    background:#f7f7fc;
    color:#a3a7b4;
    font-size:9px;
}

.licenso-payment-options{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
}

.licenso-payment-options button{
    min-height:47px;
    border:1px solid #e2e4ec;
    border-radius:13px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    background:rgba(255,255,255,.82);
    color:#555968;
    font-family:inherit;
    font-size:12px;
    cursor:pointer;
}

.licenso-paypal-logo{
    color:#003087;
    font-size:20px;
}

/* Zaključavanje stranice dok je modal otvoren */

body.licenso-checkout-open{
    overflow:hidden;
}
/* CHECKOUT — PROIZVODI U NARUDŽBINI */

.licenso-checkout-product{
    display:grid;
    grid-template-columns:42px minmax(0,1fr) auto;
    align-items:center;
    gap:12px;
    padding:10px 4px;
}

.licenso-checkout-product +
.licenso-checkout-product{
    border-top:1px solid #e7e9f1;
}

.licenso-checkout-product-logo{
    width:42px;
    height:42px;
    padding:8px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#fff;
    border:1px solid #e7e9f1;
}

.licenso-checkout-product-logo img{
    width:100%;
    height:100%;
    object-fit:contain;
}

.licenso-checkout-product-info{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:3px;
}

.licenso-checkout-product-info strong{
    overflow:hidden;
    color:#343746;
    font-size:12px;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.licenso-checkout-product-info span{
    color:#969baa;
    font-size:10px;
}

.licenso-checkout-product-price{
    color:#444856;
    font-size:12px;
    white-space:nowrap;
}

.licenso-order-preview .fa-chevron-down{
    transition:transform .2s ease;
}
.licenso-payment-section .licenso-field-full:last-child{
    margin-top:11px;
}
/* ==================================================
   LICENSO LIVE CHAT
================================================== */

.live-chat-button{
    position:fixed;
    right:28px;
    bottom:28px;
    z-index:99990;

    width:74px;
    height:74px;

    border:1px solid rgba(255,255,255,.72);
    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;

    background:
        radial-gradient(
            circle at 30% 24%,
            rgba(255,255,255,.42),
            transparent 28%
        ),
        radial-gradient(
            circle at 72% 78%,
            rgba(119,74,255,.30),
            transparent 44%
        ),
        linear-gradient(
            145deg,
            rgba(117,91,255,.46),
            rgba(50,32,125,.68)
        );

    backdrop-filter:blur(22px) saturate(180%);
    -webkit-backdrop-filter:blur(22px) saturate(180%);

    box-shadow:
        0 0 0 1px rgba(255,255,255,.18),
        0 0 26px rgba(122,84,255,.55),
        0 18px 45px rgba(42,28,105,.34),
        inset 0 1px 0 rgba(255,255,255,.78),
        inset 0 -14px 26px rgba(60,35,155,.22);

    cursor:pointer;
    overflow:visible;

    transition:
        transform .22s ease,
        box-shadow .22s ease;
}

.live-chat-button:hover{
    transform:translateY(-3px) scale(1.035);

    box-shadow:
        0 0 0 1px rgba(255,255,255,.22),
        0 0 32px rgba(122,84,255,.68),
        0 24px 55px rgba(42,28,105,.38),
        inset 0 1px 0 rgba(255,255,255,.82),
        inset 0 -14px 26px rgba(60,35,155,.22);
}

.live-chat-glow{
    position:absolute;
    inset:-14px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(127,88,255,.34) 0%,
            rgba(106,67,255,.18) 42%,
            transparent 72%
        );

    filter:blur(10px);
    pointer-events:none;
}

.live-chat-icon{
    position:relative;
    z-index:2;

    width:46px;
    height:46px;

    border-radius:16px;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#fff;
    font-size:24px;

    background:
        linear-gradient(
            145deg,
            rgba(145,106,255,.92),
            rgba(99,58,230,.96)
        );

    border:1px solid rgba(255,255,255,.56);

    box-shadow:
        0 0 18px rgba(162,124,255,.72),
        inset 0 1px 0 rgba(255,255,255,.72),
        inset 0 -7px 14px rgba(67,35,170,.24);
}

.live-chat-online{
    position:absolute;
    right:5px;
    bottom:5px;

    width:16px;
    height:16px;

    border-radius:50%;

    background:#35dc92;

    border:3px solid rgba(72,45,162,.95);

    box-shadow:
        0 0 0 4px rgba(53,220,146,.15),
        0 0 15px rgba(53,220,146,.95);
}

.live-chat-badge{
    position:absolute;
    top:-4px;
    right:-4px;

    min-width:22px;
    height:22px;
    padding:0 6px;

    border-radius:999px;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#fff;
    background:#ff4f7d;

    font-size:11px;
    font-weight:800;

    border:2px solid #fff;

    box-shadow:
        0 6px 16px rgba(255,79,125,.28);
}

/* CHAT WINDOW */

.live-chat-modal{
    position:fixed;
    right:28px;
    bottom:110px;

    z-index:99989;

    width:380px;
    height:560px;

    display:flex;
    flex-direction:column;

    border-radius:30px;
    overflow:hidden;

    background:
        radial-gradient(
            circle at 12% 5%,
            rgba(126,92,255,.14),
            transparent 34%
        ),
        radial-gradient(
            circle at 92% 15%,
            rgba(115,155,255,.10),
            transparent 36%
        ),
        linear-gradient(
            145deg,
            rgba(255,255,255,.94),
            rgba(247,248,255,.78)
        );

    border:1px solid rgba(255,255,255,.92);

    box-shadow:
        0 35px 90px rgba(72,78,120,.18),
        0 12px 35px rgba(108,84,255,.10),
        inset 0 1px 0 rgba(255,255,255,1),
        inset 0 -1px 0 rgba(201,207,228,.42);

    backdrop-filter:blur(30px) saturate(175%);
    -webkit-backdrop-filter:blur(30px) saturate(175%);

    opacity:0;
    visibility:hidden;
    pointer-events:none;

    transform:translateY(18px) scale(.96);
    transform-origin:bottom right;

    transition:
        opacity .24s ease,
        visibility .24s ease,
        transform .24s ease;
}

.live-chat-modal.is-open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;

    transform:
        translateY(0)
        scale(1);
}

/* HEADER */

.live-chat-header{
    position:relative;

    min-height:88px;
    padding:18px;

    display:flex;
    align-items:center;
    gap:12px;

    background:
        radial-gradient(
            circle at 5% 0,
            rgba(125,87,255,.18),
            transparent 45%
        ),
        linear-gradient(
            135deg,
            rgba(255,255,255,.92),
            rgba(242,241,255,.72)
        );

    border-bottom:1px solid rgba(212,216,232,.70);

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.95);
}

.live-chat-avatar{
    width:46px;
    height:46px;

    flex:0 0 46px;

    border-radius:16px;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#fff;

    font-size:20px;
    font-weight:800;

    background:
        linear-gradient(
            145deg,
            #7d52ff,
            #5f36df
        );

    border:1px solid rgba(255,255,255,.22);

    box-shadow:
        0 10px 24px rgba(94,55,220,.28),
        inset 0 1px 0 rgba(255,255,255,.22);
}

.live-chat-header h3{
    margin:0 0 4px;

    color:#202334;

    font-size:15px;
    font-weight:750;
    letter-spacing:-.3px;
}

.live-chat-header p{
    margin:0;

    color:#27b978;

    font-size:11px;
    font-weight:650;
}

.live-chat-header button{
    margin-left:auto;

    width:38px;
    height:38px;

    border:1px solid rgba(215,218,232,.72);
    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#777d91;

    background:rgba(255,255,255,.62);

    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);

    cursor:pointer;

    box-shadow:
        0 8px 22px rgba(57,64,96,.06),
        inset 0 1px 0 rgba(255,255,255,.95);
}

.live-chat-header button:hover{
    color:#363a4a;
    background:rgba(255,255,255,.88);
}


/* MESSAGES */

.live-chat-messages{
    flex:1;

    padding:18px;

    overflow-y:auto;

    background:
        radial-gradient(
            circle at 90% 4%,
            rgba(126,92,255,.08),
            transparent 32%
        ),
        radial-gradient(
            circle at 8% 88%,
            rgba(129,170,255,.07),
            transparent 36%
        ),
        rgba(250,251,255,.52);

    scrollbar-width:thin;
    scrollbar-color:
        rgba(116,96,216,.22)
        transparent;
}

.live-chat-messages::-webkit-scrollbar{
    width:6px;
}

.live-chat-messages::-webkit-scrollbar-track{
    background:transparent;
}

.live-chat-messages::-webkit-scrollbar-thumb{
    background:
        rgba(131,97,255,.32);

    border-radius:999px;
}

/* INPUT */

.live-chat-input{
    padding:14px;

    display:flex;
    align-items:center;
    gap:10px;

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.88),
            rgba(247,247,253,.76)
        );

    border-top:1px solid rgba(213,217,232,.72);

    box-shadow:
        0 -10px 28px rgba(61,67,104,.04),
        inset 0 1px 0 rgba(255,255,255,.95);
}
.live-chat-input input{
    flex:1;
    min-width:0;

    height:48px;

    border:1px solid rgba(206,210,226,.78);
    border-radius:15px;

    padding:0 15px;

    outline:0;

    color:#2d3140;

    background:rgba(255,255,255,.76);

    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);

    font-family:inherit;
    font-size:13px;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.96),
        0 8px 22px rgba(55,61,94,.045);
}

.live-chat-input input::placeholder{
    color:#9ba0af;
}

.live-chat-input input:focus{
    border-color:rgba(117,84,255,.42);

    box-shadow:
        0 0 0 4px rgba(117,84,255,.07),
        inset 0 1px 0 rgba(255,255,255,.96);
}

.live-chat-input button{
    width:48px;
    height:48px;

    flex:0 0 48px;

    border:0;
    border-radius:15px;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#fff;

    background:
        linear-gradient(
            145deg,
            #7d52ff,
            #6139e3
        );

    cursor:pointer;

    box-shadow:
        0 12px 24px rgba(94,55,220,.26),
        inset 0 1px 0 rgba(255,255,255,.22);
}

/* MOBILE */

@media (max-width:600px){

    .live-chat-button{
        right:18px;
        bottom:18px;

        width:62px;
        height:62px;
    }

    .live-chat-icon{
        width:40px;
        height:40px;
        font-size:20px;
    }

    .live-chat-modal{
        left:12px;
        right:12px;
        bottom:92px;

        width:auto;
        height:min(620px, calc(100vh - 118px));

        border-radius:24px;
    }

}
/* ==================================================
   LIVE CHAT PORUKE
================================================== */

.live-chat-message{
    width:100%;
    display:flex;
    align-items:flex-end;
    gap:9px;
    margin-bottom:15px;
}

.live-chat-message-visitor{
    justify-content:flex-end;
}

.live-chat-message-support{
    justify-content:flex-start;
}

.live-chat-message-avatar{
    width:32px;
    height:32px;
    flex:0 0 32px;

    border-radius:11px;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#fff;
    font-size:13px;
    font-weight:800;

    background:
        linear-gradient(
            145deg,
            #7d52ff,
            #6036dc
        );

    border:
        1px solid rgba(255,255,255,.18);
}

.live-chat-message-bubble{
    max-width:78%;
    padding:12px 13px 8px;

    border-radius:17px;

    box-shadow:
        0 10px 24px rgba(0,0,0,.12);
}

.live-chat-message-support
.live-chat-message-bubble{
    color:#343847;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.92),
            rgba(246,247,252,.78)
        );

    border:1px solid rgba(216,220,233,.82);

    border-bottom-left-radius:6px;

    box-shadow:
        0 12px 30px rgba(58,63,96,.07),
        inset 0 1px 0 rgba(255,255,255,.96);
}

.live-chat-message-visitor
.live-chat-message-bubble{
    color:#fff;

    background:
        linear-gradient(
            145deg,
            #8a63ff,
            #6842e8
        );

    border:1px solid rgba(255,255,255,.22);

    border-bottom-right-radius:6px;

    box-shadow:
        0 12px 28px rgba(103,70,224,.22),
        inset 0 1px 0 rgba(255,255,255,.20);
}
.live-chat-message-bubble p{
    margin:0;

    font-size:13px;
    line-height:1.5;

    overflow-wrap:anywhere;
}

.live-chat-message-time{
    margin-top:5px;

    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:4px;

    color:rgba(255,255,255,.46);

    font-size:8px;
    line-height:1;
}

.live-chat-message-visitor
.live-chat-message-time{
    color:rgba(255,255,255,.64);
}

.live-chat-message-time i{
    font-size:8px;
}
/* ==================================================
   FINALNA CHAT IKONICA — GLASS KUGLA
================================================== */

.live-chat-button{
    position:fixed;
    right:28px;
    bottom:28px;
    z-index:99990;

    width:76px;
    height:76px;

    padding:0;
    margin:0;

    border:1px solid rgba(255,255,255,.74);
    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;

    background:
        radial-gradient(
            circle at 29% 22%,
            rgba(255,255,255,.48),
            transparent 27%
        ),
        radial-gradient(
            circle at 72% 78%,
            rgba(122,78,255,.38),
            transparent 45%
        ),
        linear-gradient(
            145deg,
            rgba(130,102,255,.48),
            rgba(48,30,122,.76)
        );

    backdrop-filter:blur(24px) saturate(185%);
    -webkit-backdrop-filter:blur(24px) saturate(185%);

    box-shadow:
        0 0 0 1px rgba(255,255,255,.18),
        0 0 24px rgba(129,88,255,.58),
        0 18px 44px rgba(43,29,105,.34),
        inset 0 1px 0 rgba(255,255,255,.82),
        inset 0 -15px 26px rgba(61,36,153,.28);

    cursor:pointer;
    overflow:visible;

    transition:
        transform .22s ease,
        box-shadow .22s ease;
}

.live-chat-button:hover{
    transform:translateY(-3px) scale(1.035);

    box-shadow:
        0 0 0 1px rgba(255,255,255,.22),
        0 0 32px rgba(129,88,255,.72),
        0 24px 54px rgba(43,29,105,.40),
        inset 0 1px 0 rgba(255,255,255,.86),
        inset 0 -15px 26px rgba(61,36,153,.28);
}

.live-chat-glow{
    position:absolute;
    inset:-15px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(128,87,255,.36) 0%,
            rgba(107,68,255,.18) 44%,
            transparent 73%
        );

    filter:blur(11px);

    pointer-events:none;
}

.live-chat-icon{
    position:relative;
    z-index:2;

    width:47px;
    height:47px;

    border-radius:16px;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#fff;

    background:
        linear-gradient(
            145deg,
            rgba(151,112,255,.94),
            rgba(100,59,231,.98)
        );

    border:1px solid rgba(255,255,255,.60);

    box-shadow:
        0 0 19px rgba(164,126,255,.76),
        inset 0 1px 0 rgba(255,255,255,.76),
        inset 0 -8px 15px rgba(67,36,169,.26);
}

.live-chat-icon i{
    position:relative;
    z-index:1;

    font-size:25px;

    color:#fff;

    filter:
        drop-shadow(0 0 7px rgba(255,255,255,.78));
}

.live-chat-icon::after{
    content:"•••";

    position:absolute;
    top:8px;
    left:50%;

    transform:translateX(-50%);

    color:#fff;

    font-size:14px;
    line-height:1;
    letter-spacing:1px;

    text-shadow:
        0 0 8px rgba(255,255,255,.95);

    pointer-events:none;
}

.live-chat-online{
    position:absolute;
    right:5px;
    bottom:5px;

    width:16px;
    height:16px;

    border-radius:50%;

    background:#35dc92;

    border:3px solid rgba(73,46,164,.96);

    box-shadow:
        0 0 0 4px rgba(53,220,146,.15),
        0 0 15px rgba(53,220,146,.96);
}

.live-chat-badge{
    display:none !important;
}

@media(max-width:600px){

    .live-chat-button{
        right:18px;
        bottom:18px;

        width:70px;
        height:70px;
    }

    .live-chat-icon{
        width:43px;
        height:43px;
        border-radius:15px;
    }

    .live-chat-icon i{
        font-size:23px;
    }

    .live-chat-icon::after{
        top:7px;
        font-size:13px;
    }

    .live-chat-online{
        right:4px;
        bottom:4px;

        width:15px;
        height:15px;
    }
}
/* ==================================================
   MINIMALISTIČKA PROVIDNA CHAT IKONICA
================================================== */

.live-chat-button{
    position:fixed;
    right:28px;
    bottom:28px;
    z-index:99990;

    width:66px;
    height:66px;

    padding:0;
    margin:0;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    border:1px solid rgba(255,255,255,.78);

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.52),
            rgba(239,240,252,.30)
        );

    backdrop-filter:blur(20px) saturate(170%);
    -webkit-backdrop-filter:blur(20px) saturate(170%);

    box-shadow:
        0 16px 38px rgba(58,63,100,.13),
        inset 0 1px 0 rgba(255,255,255,.95),
        inset 0 -1px 0 rgba(180,185,210,.18);

    cursor:pointer;

    transition:
        transform .22s ease,
        box-shadow .22s ease,
        background .22s ease;
}

.live-chat-button:hover{
    transform:translateY(-3px);

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.68),
            rgba(241,241,255,.42)
        );

    box-shadow:
        0 20px 44px rgba(58,63,100,.17),
        inset 0 1px 0 rgba(255,255,255,1);
}

.live-chat-icon{
    width:42px;
    height:42px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:15px;

    color:#7357ff;

    background:
        linear-gradient(
            145deg,
            rgba(126,94,255,.12),
            rgba(126,94,255,.05)
        );

    border:1px solid rgba(115,87,255,.14);

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.78);
}

.live-chat-icon i{
    font-size:22px;
    line-height:1;
}

.live-chat-online{
    position:absolute;

    right:5px;
    bottom:5px;

    width:13px;
    height:13px;

    border-radius:50%;

    background:#39d98a;

    border:3px solid rgba(255,255,255,.95);

    box-shadow:
        0 0 0 2px rgba(57,217,138,.10);
}

.live-chat-badge{
    display:none !important;
}

.live-chat-glow{
    display:none !important;
}

@media(max-width:600px){

    .live-chat-button{
        right:18px;
        bottom:18px;

        width:60px;
        height:60px;
    }

    .live-chat-icon{
        width:38px;
        height:38px;

        border-radius:13px;
    }

    .live-chat-icon i{
        font-size:20px;
    }

    .live-chat-online{
        right:4px;
        bottom:4px;

        width:12px;
        height:12px;
    }
}
/* ==================================================
   CHAT IKONICA — MINIMALNA ALI VIDLJIVA
================================================== */

.live-chat-button{
    position:fixed;
    right:28px;
    bottom:28px;
    z-index:99990;

    width:68px;
    height:68px;

    padding:0;
    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid rgba(255,255,255,.78);

    background:
        radial-gradient(
            circle at 30% 22%,
            rgba(255,255,255,.48),
            transparent 26%
        ),
        linear-gradient(
            145deg,
            rgba(118,92,255,.52),
            rgba(77,55,184,.72)
        );

    backdrop-filter:blur(20px) saturate(170%);
    -webkit-backdrop-filter:blur(20px) saturate(170%);

    box-shadow:
        0 14px 34px rgba(77,55,184,.22),
        0 0 18px rgba(118,92,255,.24),
        inset 0 1px 0 rgba(255,255,255,.72),
        inset 0 -10px 18px rgba(62,42,150,.18);

    cursor:pointer;

    transition:
        transform .22s ease,
        box-shadow .22s ease;
}

.live-chat-button:hover{
    transform:translateY(-3px) scale(1.03);

    box-shadow:
        0 20px 42px rgba(77,55,184,.28),
        0 0 24px rgba(118,92,255,.32),
        inset 0 1px 0 rgba(255,255,255,.78);
}

.live-chat-glow{
    display:none !important;
}

.live-chat-icon{
    width:42px;
    height:42px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:14px;

    background:rgba(255,255,255,.12);

    border:1px solid rgba(255,255,255,.30);

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.35);
}

.live-chat-icon i{
    display:block !important;

    color:#fff;
    font-size:23px;
    line-height:1;

    filter:
        drop-shadow(0 0 6px rgba(255,255,255,.45));
}

.live-chat-icon::after{
    display:none !important;
    content:none !important;
}

.live-chat-online{
    position:absolute;
    right:4px;
    bottom:4px;

    width:14px;
    height:14px;

    border-radius:50%;

    background:#36d98a;

    border:3px solid rgba(255,255,255,.92);

    box-shadow:
        0 0 0 2px rgba(54,217,138,.12),
        0 0 10px rgba(54,217,138,.55);
}

.live-chat-badge{
    display:none !important;
}

@media(max-width:600px){

    .live-chat-button{
        right:18px;
        bottom:18px;

        width:64px;
        height:64px;
    }

    .live-chat-icon{
        width:40px;
        height:40px;
    }

    .live-chat-icon i{
        font-size:22px;
    }

}
/* CHAT IKONICA — BEZ PROMENE NA HOVER */

.live-chat-button:hover{
    transform:none !important;

    background:
        radial-gradient(
            circle at 30% 22%,
            rgba(255,255,255,.48),
            transparent 26%
        ),
        linear-gradient(
            145deg,
            rgba(118,92,255,.52),
            rgba(77,55,184,.72)
        ) !important;

    box-shadow:
        0 14px 34px rgba(77,55,184,.22),
        0 0 18px rgba(118,92,255,.24),
        inset 0 1px 0 rgba(255,255,255,.72),
        inset 0 -10px 18px rgba(62,42,150,.18) !important;
}

.live-chat-button:focus,
.live-chat-button:active{
    transform:none !important;

    background:
        radial-gradient(
            circle at 30% 22%,
            rgba(255,255,255,.48),
            transparent 26%
        ),
        linear-gradient(
            145deg,
            rgba(118,92,255,.52),
            rgba(77,55,184,.72)
        ) !important;

    box-shadow:
        0 14px 34px rgba(77,55,184,.22),
        0 0 18px rgba(118,92,255,.24),
        inset 0 1px 0 rgba(255,255,255,.72),
        inset 0 -10px 18px rgba(62,42,150,.18) !important;

    outline:none;
}
/* ==================================================
   LIVE CHAT — FAJLOVI I EMOJI
================================================== */

.live-chat-composer{
    position:relative;

    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.88),
            rgba(247,248,253,.76)
        );

    border-top:1px solid rgba(213,217,232,.72);
}

.live-chat-composer .live-chat-input{
    border-top:0;
    background:transparent;
}

.live-chat-tool-button{
    width:40px !important;
    height:40px !important;
    flex:0 0 40px !important;

    border:1px solid rgba(207,211,226,.76) !important;
    border-radius:13px !important;

    color:#777d91 !important;

    background:rgba(255,255,255,.72) !important;

    box-shadow:
        0 7px 18px rgba(57,63,96,.05),
        inset 0 1px 0 rgba(255,255,255,.95) !important;
}

.live-chat-tool-button i{
    font-size:15px;
}

.live-chat-tool-button:hover,
.live-chat-tool-button:focus,
.live-chat-tool-button:active{
    color:#7257f3 !important;
    background:rgba(255,255,255,.90) !important;
    transform:none !important;
}

/* PREVIEW FAJLA */

.live-chat-file-preview{
    margin:12px 14px 0;
    padding:10px;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;

    border:1px solid rgba(211,215,230,.80);
    border-radius:15px;

    background:rgba(255,255,255,.76);

    box-shadow:
        0 8px 24px rgba(55,61,94,.05),
        inset 0 1px 0 rgba(255,255,255,.96);
}

.live-chat-file-preview[hidden]{
    display:none;
}

.live-chat-file-preview-content{
    min-width:0;

    display:flex;
    align-items:center;
    gap:10px;
}

.live-chat-file-preview img{
    width:48px;
    height:48px;

    flex:0 0 48px;

    object-fit:cover;

    border-radius:11px;

    border:1px solid rgba(210,214,228,.85);
}

.live-chat-file-info{
    min-width:0;

    display:flex;
    align-items:center;
    gap:10px;
}

.live-chat-file-info > i{
    width:38px;
    height:38px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:11px;

    color:#7357f4;
    background:rgba(115,87,244,.09);
}

.live-chat-file-info div{
    min-width:0;

    display:flex;
    flex-direction:column;
    gap:3px;
}

.live-chat-file-info strong{
    max-width:210px;

    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;

    color:#333746;
    font-size:11px;
}

.live-chat-file-info span{
    color:#9aa0af;
    font-size:9px;
}

.live-chat-remove-file{
    width:30px !important;
    height:30px !important;
    flex:0 0 30px !important;

    border-radius:50% !important;

    color:#858a99 !important;
    background:rgba(244,245,250,.86) !important;

    box-shadow:none !important;
}

/* EMOJI MENI */

.live-chat-emoji-panel{
    position:absolute;
    left:14px;
    bottom:72px;
    z-index:5;

    width:224px;

    padding:10px;

    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:6px;

    border:1px solid rgba(255,255,255,.88);
    border-radius:16px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.94),
            rgba(246,247,253,.86)
        );

    backdrop-filter:blur(20px);
    -webkit-backdrop-filter:blur(20px);

    box-shadow:
        0 20px 45px rgba(54,60,96,.16),
        inset 0 1px 0 rgba(255,255,255,.98);
}

.live-chat-emoji-panel[hidden]{
    display:none;
}

.live-chat-emoji-panel button{
    width:28px;
    height:28px;

    border:0;
    border-radius:8px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:transparent;

    font-size:17px;
    cursor:pointer;
}

.live-chat-emoji-panel button:hover{
    background:rgba(115,87,244,.09);
}

/* SLIKA U PORUCI */

.live-chat-message-image{
    display:block;

    width:min(220px,100%);
    max-height:210px;

    margin-bottom:7px;

    object-fit:cover;

    border-radius:13px;
}

.live-chat-message-file{
    min-width:190px;

    display:flex;
    align-items:center;
    gap:10px;

    color:inherit;
}

.live-chat-message-file i{
    width:34px;
    height:34px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:10px;

    background:rgba(255,255,255,.15);
}

.live-chat-message-file div{
    min-width:0;

    display:flex;
    flex-direction:column;
    gap:3px;
}

.live-chat-message-file strong{
    max-width:150px;

    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;

    font-size:11px;
}

.live-chat-message-file span{
    font-size:8px;
    opacity:.68;
}

@media(max-width:600px){

    .live-chat-composer .live-chat-input{
        gap:7px;
        padding:10px;
    }

    .live-chat-tool-button{
        width:36px !important;
        height:36px !important;
        flex-basis:36px !important;
    }

    .live-chat-emoji-panel{
        left:10px;
        bottom:65px;
    }

}
/* ==================================================
   CHAT IKONICA — BELI PROVIDNI KRUG, BEZ KOCKICE
================================================== */

.live-chat-button{
    position:fixed;
    right:28px;
    bottom:28px;
    z-index:99990;

    width:68px;
    height:68px;

    padding:0;
    margin:0;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

    border:1px solid rgba(255,255,255,.88);

    background:
        radial-gradient(
            circle at 30% 24%,
            rgba(255,255,255,.85),
            transparent 34%
        ),
        linear-gradient(
            145deg,
            rgba(255,255,255,.64),
            rgba(235,238,248,.34)
        );

    backdrop-filter:blur(22px) saturate(165%);
    -webkit-backdrop-filter:blur(22px) saturate(165%);

    box-shadow:
        0 16px 38px rgba(63,70,100,.14),
        0 0 0 1px rgba(255,255,255,.28),
        inset 0 1px 0 rgba(255,255,255,.98),
        inset 0 -8px 18px rgba(178,185,210,.14);

    cursor:pointer;

    transition:none !important;
}

.live-chat-button:hover,
.live-chat-button:focus,
.live-chat-button:active{
    transform:none !important;

    background:
        radial-gradient(
            circle at 30% 24%,
            rgba(255,255,255,.85),
            transparent 34%
        ),
        linear-gradient(
            145deg,
            rgba(255,255,255,.64),
            rgba(235,238,248,.34)
        ) !important;

    box-shadow:
        0 16px 38px rgba(63,70,100,.14),
        0 0 0 1px rgba(255,255,255,.28),
        inset 0 1px 0 rgba(255,255,255,.98),
        inset 0 -8px 18px rgba(178,185,210,.14) !important;

    outline:none !important;
}

/* gasi staru unutrašnju kockicu */

.live-chat-icon{
    width:auto !important;
    height:auto !important;

    display:flex;
    align-items:center;
    justify-content:center;

    border:0 !important;
    border-radius:0 !important;

    background:transparent !important;

    box-shadow:none !important;
}

/* sam oblačić sa tačkicama */

.live-chat-icon i{
    display:block !important;

    color:#ffffff !important;

    font-size:29px !important;
    line-height:1;

    filter:
        drop-shadow(0 0 2px rgba(99,106,135,.65))
        drop-shadow(0 0 6px rgba(255,255,255,.95));
}

/* uklanja sve dodatne pseudo-elemente koji su pravili kocku ili tačke */

.live-chat-icon::before,
.live-chat-icon::after,
.live-chat-button::before,
.live-chat-button::after{
    content:none !important;
    display:none !important;
}

/* gasi stari glow */

.live-chat-glow{
    display:none !important;
}

/* zelena online tačka */

.live-chat-online{
    position:absolute;
    right:4px;
    bottom:4px;

    width:14px;
    height:14px;

    border-radius:50%;

    background:#37d991;

    border:3px solid rgba(255,255,255,.96);

    box-shadow:
        0 0 0 2px rgba(55,217,145,.10),
        0 0 9px rgba(55,217,145,.48);
}

.live-chat-badge{
    display:none !important;
}

@media(max-width:600px){

    .live-chat-button{
        right:18px;
        bottom:18px;

        width:62px;
        height:62px;
    }

    .live-chat-icon i{
        font-size:26px !important;
    }

    .live-chat-online{
        width:13px;
        height:13px;

        right:3px;
        bottom:3px;
    }
}
/* CHAT IKONICA — CRNI OBLAČIĆ I CRNA IVICA */

.live-chat-button{
    border:1.5px solid rgba(20,24,35,.22) !important;

    box-shadow:
        0 16px 38px rgba(63,70,100,.14),
        0 0 0 1px rgba(255,255,255,.35),
        inset 0 1px 0 rgba(255,255,255,.98),
        inset 0 -8px 18px rgba(178,185,210,.14) !important;
}

.live-chat-icon i{
    color:#171b25 !important;

    filter:
        drop-shadow(0 1px 1px rgba(255,255,255,.85)) !important;
}

.live-chat-button:hover,
.live-chat-button:focus,
.live-chat-button:active{
    border-color:rgba(20,24,35,.22) !important;

    transform:none !important;
}
/* ==================================================
   CHAT IKONICA — CLEAN PREMIUM GLASS
================================================== */

.live-chat-button{
    width:68px;
    height:68px;

    border:1px solid rgba(255,255,255,.88) !important;

    background:
        radial-gradient(
            circle at 30% 22%,
            rgba(255,255,255,.92),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            rgba(255,255,255,.72),
            rgba(238,240,249,.42)
        ) !important;

    backdrop-filter:blur(22px) saturate(170%);
    -webkit-backdrop-filter:blur(22px) saturate(170%);

    box-shadow:
        0 16px 36px rgba(52,60,94,.13),
        0 0 0 1px rgba(255,255,255,.34),
        inset 0 1px 0 rgba(255,255,255,1),
        inset 0 -10px 22px rgba(174,181,211,.12) !important;
}

.live-chat-button:hover,
.live-chat-button:focus,
.live-chat-button:active{
    transform:none !important;

    background:
        radial-gradient(
            circle at 30% 22%,
            rgba(255,255,255,.92),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            rgba(255,255,255,.72),
            rgba(238,240,249,.42)
        ) !important;

    box-shadow:
        0 16px 36px rgba(52,60,94,.13),
        0 0 0 1px rgba(255,255,255,.34),
        inset 0 1px 0 rgba(255,255,255,1),
        inset 0 -10px 22px rgba(174,181,211,.12) !important;
}

.live-chat-icon{
    width:auto !important;
    height:auto !important;

    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
}

.live-chat-icon i{
    color:#6f63d9 !important;
    font-size:27px !important;

    filter:
        drop-shadow(0 2px 5px rgba(111,99,217,.18)) !important;
}

.live-chat-online{
    right:5px;
    bottom:5px;

    width:13px;
    height:13px;

    background:#37d992;

    border:3px solid rgba(255,255,255,.96);

    box-shadow:
        0 0 0 3px rgba(55,217,146,.10),
        0 0 10px rgba(55,217,146,.40);
}

.live-chat-glow,
.live-chat-badge{
    display:none !important;
}
/* ==================================================
   CHAT IKONICA — VEĆI OBLAČIĆ, BEZ TAČKICA, GLASS KRUG
================================================== */

.live-chat-button{
    width:70px !important;
    height:70px !important;

    border:1px solid rgba(255,255,255,.88) !important;

    background:
        radial-gradient(
            circle at 30% 22%,
            rgba(255,255,255,.90),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            rgba(255,255,255,.58),
            rgba(235,238,248,.24)
        ) !important;

    backdrop-filter:blur(24px) saturate(175%) !important;
    -webkit-backdrop-filter:blur(24px) saturate(175%) !important;

    box-shadow:
        0 16px 38px rgba(55,62,96,.14),
        0 0 0 1px rgba(255,255,255,.34),
        inset 0 1px 0 rgba(255,255,255,1),
        inset 0 -10px 22px rgba(174,181,211,.12) !important;

    transition:none !important;
}

.live-chat-button:hover,
.live-chat-button:focus,
.live-chat-button:active{
    transform:none !important;

    background:
        radial-gradient(
            circle at 30% 22%,
            rgba(255,255,255,.90),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            rgba(255,255,255,.58),
            rgba(235,238,248,.24)
        ) !important;

    box-shadow:
        0 16px 38px rgba(55,62,96,.14),
        0 0 0 1px rgba(255,255,255,.34),
        inset 0 1px 0 rgba(255,255,255,1),
        inset 0 -10px 22px rgba(174,181,211,.12) !important;
}

.live-chat-icon{
    width:auto !important;
    height:auto !important;

    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
}

/* sakriva postojeću ikonicu sa tri tačke */

.live-chat-icon i{
    display:none !important;
}

/* pravi novi veći oblačić bez tačkica */

.live-chat-icon::before{
    content:"";

    display:block !important;

    width:34px;
    height:27px;

    border:3px solid #6f63d9;
    border-radius:13px;

    position:relative;

    box-sizing:border-box;

    filter:
        drop-shadow(0 3px 6px rgba(111,99,217,.16));
}

/* rep oblačića */

.live-chat-icon::after{
    content:"";

    display:block !important;

    position:absolute;

    left:8px;
    bottom:5px;

    width:11px;
    height:11px;

    border-left:3px solid #6f63d9;
    border-bottom:3px solid #6f63d9;

    background:transparent;

    transform:skew(-22deg) rotate(-12deg);

    border-bottom-left-radius:3px;
}

/* zelena online tačka */

.live-chat-online{
    right:4px !important;
    bottom:4px !important;

    width:14px !important;
    height:14px !important;

    background:#37d992 !important;

    border:3px solid rgba(255,255,255,.96) !important;

    box-shadow:
        0 0 0 3px rgba(55,217,146,.10),
        0 0 10px rgba(55,217,146,.42) !important;
}

.live-chat-glow,
.live-chat-badge{
    display:none !important;
}
/* SAMO OBLAČIĆ BEZ TAČKICA */

.live-chat-icon{
    position:relative !important;

    width:40px !important;
    height:34px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
}

.live-chat-icon i{
    display:none !important;
}

.live-chat-icon::before{
    content:"" !important;

    display:block !important;

    width:32px !important;
    height:25px !important;

    border:3px solid #6f63d9 !important;
    border-radius:12px !important;

    background:transparent !important;

    box-sizing:border-box !important;

    position:relative !important;

    filter:
        drop-shadow(0 3px 6px rgba(111,99,217,.18)) !important;
}

.live-chat-icon::after{
    content:"" !important;

    display:block !important;

    position:absolute !important;

    left:7px !important;
    bottom:2px !important;

    width:11px !important;
    height:10px !important;

    border-left:3px solid #6f63d9 !important;
    border-bottom:3px solid #6f63d9 !important;

    background:transparent !important;

    transform:skew(-20deg) rotate(-12deg) !important;

    border-bottom-left-radius:3px !important;
}
/* ==================================================
   ISPRAVAN CHAT OBLAČIĆ — BEZ TAČKICA
================================================== */

.live-chat-icon{
    position:relative !important;

    width:46px !important;
    height:46px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    border:0 !important;
    border-radius:0 !important;

    background:transparent !important;
    box-shadow:none !important;
}

.live-chat-icon i{
    display:none !important;
}

.live-chat-icon::before,
.live-chat-icon::after{
    content:none !important;
    display:none !important;
}

.live-chat-clean-icon{
    display:block;

    width:42px;
    height:42px;

    overflow:visible;
}

.live-chat-clean-icon path{
    fill:transparent;

    stroke:#6f63d9;
    stroke-width:4;

    stroke-linecap:round;
    stroke-linejoin:round;

    filter:
        drop-shadow(
            0 3px 6px
            rgba(111,99,217,.18)
        );
}
/* ==================================================
   CHAT MESSAGES — PROVIDNA BLUR POZADINA
================================================== */

.live-chat-messages{
    flex:1;

    padding:18px;

    overflow-y:auto;

    background:
        radial-gradient(
            circle at 18% 12%,
            rgba(255,255,255,.52),
            transparent 34%
        ),
        radial-gradient(
            circle at 86% 22%,
            rgba(124,92,255,.08),
            transparent 38%
        ),
        linear-gradient(
            145deg,
            rgba(255,255,255,.32),
            rgba(239,242,252,.20)
        ) !important;

    backdrop-filter:blur(26px) saturate(165%);
    -webkit-backdrop-filter:blur(26px) saturate(165%);

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.78),
        inset 0 -1px 0 rgba(202,207,226,.28);

    scrollbar-width:thin;
    scrollbar-color:
        rgba(112,94,210,.20)
        transparent;
}

/* Poruke podrške ostaju bele */

.live-chat-message-support
.live-chat-message-bubble{
    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.96),
            rgba(250,250,253,.88)
        ) !important;

    border:
        1px solid rgba(211,215,230,.88) !important;

    color:#343847 !important;

    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);

    box-shadow:
        0 12px 30px rgba(58,63,96,.08),
        inset 0 1px 0 rgba(255,255,255,1) !important;
}
/* FORCE — PROVIDNA BLUR POZADINA DELA SA PORUKAMA */

#liveChatMessages.live-chat-messages{
    background:
        radial-gradient(
            circle at 20% 12%,
            rgba(255,255,255,.42),
            transparent 34%
        ),
        radial-gradient(
            circle at 84% 20%,
            rgba(123,92,255,.10),
            transparent 38%
        ),
        rgba(255,255,255,.18) !important;

    backdrop-filter:blur(30px) saturate(170%) !important;
    -webkit-backdrop-filter:blur(30px) saturate(170%) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.62),
        inset 0 -1px 0 rgba(198,204,225,.22) !important;
}

/* beli oblačići poruka ostaju isti */

#liveChatMessages
.live-chat-message-support
.live-chat-message-bubble{
    background:rgba(255,255,255,.88) !important;

    backdrop-filter:blur(16px) !important;
    -webkit-backdrop-filter:blur(16px) !important;

    border:1px solid rgba(214,218,231,.86) !important;

    box-shadow:
        0 10px 26px rgba(58,63,96,.08),
        inset 0 1px 0 rgba(255,255,255,.96) !important;
}
/* ==================================================
   CHAT — STVARNA PROVIDNA GLASS POZADINA
================================================== */

#liveChatModal.live-chat-modal{
    background:
        radial-gradient(
            circle at 18% 10%,
            rgba(255,255,255,.72),
            transparent 38%
        ),
        radial-gradient(
            circle at 88% 20%,
            rgba(121,92,255,.10),
            transparent 42%
        ),
        rgba(245,247,255,.46) !important;

    backdrop-filter:blur(32px) saturate(170%) !important;
    -webkit-backdrop-filter:blur(32px) saturate(170%) !important;

    border:1px solid rgba(255,255,255,.88) !important;

    box-shadow:
        0 30px 75px rgba(60,67,105,.16),
        inset 0 1px 0 rgba(255,255,255,.95) !important;
}

/* sredina iza poruka */

#liveChatModal #liveChatMessages{
    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.18),
            rgba(231,235,249,.10)
        ) !important;

    backdrop-filter:blur(28px) saturate(165%) !important;
    -webkit-backdrop-filter:blur(28px) saturate(165%) !important;

    border-top:1px solid rgba(207,212,230,.38) !important;
    border-bottom:1px solid rgba(207,212,230,.38) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.56),
        inset 0 -1px 0 rgba(191,198,220,.16) !important;
}

/* beli oblačić poruke ostaje beo */

#liveChatModal
.live-chat-message-support
.live-chat-message-bubble{
    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.96),
            rgba(248,249,253,.88)
        ) !important;

    color:#343847 !important;

    border:1px solid rgba(205,211,228,.78) !important;

    backdrop-filter:blur(14px) !important;
    -webkit-backdrop-filter:blur(14px) !important;

    box-shadow:
        0 12px 28px rgba(56,63,100,.08),
        inset 0 1px 0 rgba(255,255,255,1) !important;
}
/* ==================================================
   CHAT — JAČI LIQUID GLASS EFEKAT
================================================== */

#liveChatModal.live-chat-modal{
    background:
        radial-gradient(
            circle at 16% 8%,
            rgba(255,255,255,.82),
            transparent 34%
        ),
        radial-gradient(
            circle at 88% 18%,
            rgba(123,94,255,.16),
            transparent 40%
        ),
        linear-gradient(
            145deg,
            rgba(255,255,255,.42),
            rgba(235,239,252,.24)
        ) !important;

    backdrop-filter:
        blur(34px)
        saturate(190%)
        contrast(104%) !important;

    -webkit-backdrop-filter:
        blur(34px)
        saturate(190%)
        contrast(104%) !important;

    border:
        1px solid rgba(255,255,255,.94) !important;

    box-shadow:
        0 32px 85px rgba(54,62,105,.17),
        0 10px 34px rgba(111,86,255,.08),
        inset 0 1px 0 rgba(255,255,255,1),
        inset 0 -1px 0 rgba(189,197,222,.25) !important;

    overflow:hidden;
}

/* sjajna refleksija preko celog chat prozora */

#liveChatModal.live-chat-modal::before{
    content:"";

    position:absolute;
    inset:0;

    border-radius:inherit;

    background:
        linear-gradient(
            125deg,
            rgba(255,255,255,.48) 0%,
            rgba(255,255,255,.12) 23%,
            transparent 42%,
            transparent 72%,
            rgba(150,125,255,.08) 100%
        );

    pointer-events:none;
    z-index:0;
}

/* svi delovi ostaju iznad refleksije */

#liveChatModal > *{
    position:relative;
    z-index:1;
}

/* deo sa porukama */

#liveChatModal #liveChatMessages{
    background:
        radial-gradient(
            circle at 24% 14%,
            rgba(255,255,255,.38),
            transparent 36%
        ),
        radial-gradient(
            circle at 82% 72%,
            rgba(120,92,255,.08),
            transparent 40%
        ),
        linear-gradient(
            145deg,
            rgba(255,255,255,.16),
            rgba(231,236,250,.08)
        ) !important;

    backdrop-filter:
        blur(28px)
        saturate(185%) !important;

    -webkit-backdrop-filter:
        blur(28px)
        saturate(185%) !important;

    border-top:
        1px solid rgba(255,255,255,.58) !important;

    border-bottom:
        1px solid rgba(198,205,228,.28) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.72),
        inset 0 -1px 0 rgba(190,198,220,.16) !important;
}

/* header ostaje glass */

#liveChatModal .live-chat-header{
    background:
        radial-gradient(
            circle at 8% 0,
            rgba(124,92,255,.16),
            transparent 42%
        ),
        linear-gradient(
            145deg,
            rgba(255,255,255,.40),
            rgba(241,243,252,.18)
        ) !important;

    backdrop-filter:
        blur(24px)
        saturate(180%) !important;

    -webkit-backdrop-filter:
        blur(24px)
        saturate(180%) !important;
}

/* donji deo sa inputom */

#liveChatModal .live-chat-composer{
    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.38),
            rgba(239,242,251,.18)
        ) !important;

    backdrop-filter:
        blur(26px)
        saturate(185%) !important;

    -webkit-backdrop-filter:
        blur(26px)
        saturate(185%) !important;

    border-top:
        1px solid rgba(255,255,255,.62) !important;
}
/* ==================================================
   CHAT ALATI — BEZ KOCKICA
================================================== */

.live-chat-tool-button{
    width:34px !important;
    height:34px !important;
    flex:0 0 34px !important;

    padding:0 !important;

    border:0 !important;
    border-radius:50% !important;

    color:#73798d !important;
    background:transparent !important;

    box-shadow:none !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    transition:none !important;
}

.live-chat-tool-button i{
    font-size:17px !important;
}

.live-chat-tool-button:hover,
.live-chat-tool-button:focus,
.live-chat-tool-button:active{
    color:#6f63d9 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    transform:none !important;
    outline:none !important;
}

.live-chat-composer .live-chat-input{
    gap:8px !important;
}

@media(max-width:600px){

    .live-chat-tool-button{
        width:30px !important;
        height:30px !important;
        flex-basis:30px !important;
    }

    .live-chat-tool-button i{
        font-size:16px !important;
    }

}
/* VRATI POLJE ZA PORUKU I DUGME ZA SLANJE */

.live-chat-composer .live-chat-input{
    width:100% !important;

    padding:14px !important;

    display:flex !important;
    align-items:center !important;
    gap:8px !important;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.38),
            rgba(239,242,251,.18)
        ) !important;

    border-top:
        1px solid rgba(255,255,255,.62) !important;
}

#liveChatInput{
    display:block !important;
    flex:1 1 auto !important;

    width:auto !important;
    min-width:0 !important;
    height:48px !important;

    padding:0 15px !important;

    border:
        1px solid rgba(185,174,255,.72) !important;

    border-radius:15px !important;

    color:#2d3140 !important;

    background:
        rgba(255,255,255,.78) !important;

    outline:none !important;

    font-family:inherit !important;
    font-size:13px !important;

    box-shadow:
        0 0 0 4px rgba(117,84,255,.05),
        inset 0 1px 0 rgba(255,255,255,.96) !important;
}

#liveChatInput::placeholder{
    color:#9ba0af !important;
}

#sendLiveMessage{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:48px !important;
    height:48px !important;
    flex:0 0 48px !important;

    padding:0 !important;

    border:0 !important;
    border-radius:15px !important;

    color:#fff !important;

    background:
        linear-gradient(
            145deg,
            #7d52ff,
            #6139e3
        ) !important;

    box-shadow:
        0 12px 24px rgba(94,55,220,.24),
        inset 0 1px 0 rgba(255,255,255,.22) !important;
}

#sendLiveMessage i{
    font-size:18px !important;
}

.live-chat-tool-button{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    width:32px !important;
    height:32px !important;
    flex:0 0 32px !important;

    padding:0 !important;

    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;

    color:#73798d !important;
}
/* LICENSO SIMBOL U CHATU */

.live-chat-avatar,
.live-chat-message-avatar{
    overflow:hidden;
}

.live-chat-avatar img{
    display:block;

    width:70%;
    height:70%;

    object-fit:contain;
}

.live-chat-message-avatar img{
    display:block;

    width:66%;
    height:66%;

    object-fit:contain;
}
/* ==================================================
   LICENSO SIMBOL U CHATU — BEZ LJUBIČASTE POZADINE
================================================== */

.live-chat-avatar,
.live-chat-message-avatar{
    background:rgba(255,255,255,.92) !important;

    border:1px solid rgba(214,218,232,.90) !important;

    box-shadow:
        0 10px 24px rgba(55,61,96,.08),
        inset 0 1px 0 rgba(255,255,255,1) !important;

    overflow:hidden !important;

    padding:0 !important;
}

/* VEĆA IKONICA GORE */

.live-chat-avatar{
    width:50px !important;
    height:50px !important;
    flex:0 0 50px !important;

    border-radius:15px !important;
}

.live-chat-avatar img{
    display:block !important;

    width:88% !important;
    height:88% !important;

    max-width:none !important;
    max-height:none !important;

    object-fit:contain !important;

    transform:scale(1.18) !important;
}

/* MALA IKONICA PORED PORUKE */

.live-chat-message-avatar{
    width:34px !important;
    height:34px !important;
    flex:0 0 34px !important;

    border-radius:10px !important;
}

.live-chat-message-avatar img{
    display:block !important;

    width:90% !important;
    height:90% !important;

    max-width:none !important;
    max-height:none !important;

    object-fit:contain !important;

    transform:scale(1.22) !important;
}
/* CHAT OBLAČIĆ — ZAOBLJENIJI OBLIK */

.live-chat-clean-icon{
    width:42px !important;
    height:42px !important;
}

.live-chat-clean-icon path{
    fill:transparent !important;

    stroke:#6f63d9 !important;
    stroke-width:3.8 !important;

    stroke-linecap:round !important;
    stroke-linejoin:round !important;

    filter:
        drop-shadow(0 2px 5px rgba(111,99,217,.20)) !important;
}

/* =========================================
   PROMENA IMENA KUPCA
========================================= */

.active-chat-name-row{
    display:flex;
    align-items:center;
    gap:8px;
    min-width:0;
}

.active-chat-name-row h2{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.rename-customer-button{
    width:30px;
    height:30px;
    flex:0 0 30px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:0;

    border:1px solid rgba(205,210,228,.78);
    border-radius:10px;

    color:#747b8e;
    background:rgba(255,255,255,.68);

    cursor:pointer;

    box-shadow:
        0 7px 18px rgba(54,61,96,.06),
        inset 0 1px 0 rgba(255,255,255,.96);
}

.rename-customer-button i{
    font-size:11px;
}

.rename-customer-button:hover{
    color:#684fe8;
    background:rgba(255,255,255,.90);
}

.rename-customer-button:disabled{
    opacity:.55;
    cursor:not-allowed;
}

/* ==================================================
   PERFORMANCE — DODATNE SEKCIJE ISPOD PRVOG EKRANA
================================================== */

.reviews-section,
.reviews-slider,
.faq,
#contact{
    content-visibility:auto;
}

.reviews-section{
    contain-intrinsic-size:auto 850px;
}

.reviews-slider{
    contain-intrinsic-size:auto 520px;
}

.faq{
    contain-intrinsic-size:auto 720px;
}

#contact{
    contain-intrinsic-size:auto 1200px;
}
/* ==================================================
   PERFORMANCE — NE CRTaj SEKCIJE DOK NISU BLIZU EKRANA
   Ne menja izgled niti tok sajta
================================================== */

.process,
.products,
#reviews,
#faq,
.footer{
    content-visibility:auto;
}

/* Rezerviše prostor pre renderovanja i sprečava pomeranje stranice */

.process{
    contain-intrinsic-size:auto 900px;
}

.products{
    contain-intrinsic-size:auto 2600px;
}

#reviews{
    contain-intrinsic-size:auto 750px;
}

#faq{
    contain-intrinsic-size:auto 700px;
}

.footer{
    contain-intrinsic-size:auto 1000px;
}

.payment-brand-logo{
    display:block;

    width:auto;
    height:28px;

    max-width:none;

    object-fit:contain;

    opacity:1;
    filter:none !important;
    transform:none !important;

    image-rendering:auto;
}
/* PAYMENT METHOD BUTTONS */

.licenso-payment-options{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
}

.payment-option{
    min-height:74px;

    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;

    padding:12px 18px;

    border:1px solid rgba(130,140,175,.18);
    border-radius:18px;

    background:rgba(255,255,255,.72);

    color:#5f6675;

    font-family:inherit;
    font-size:15px;
    font-weight:650;

    cursor:pointer;

    box-shadow:
        0 10px 28px rgba(31,41,55,.05),
        inset 0 1px 0 rgba(255,255,255,.95);

    transition:
        border-color .25s ease,
        background .25s ease,
        box-shadow .25s ease;
}

.payment-option.active{
    color:#6d4cff;

    border-color:rgba(109,76,255,.55);

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.95),
            rgba(245,241,255,.90)
        );

    box-shadow:
        0 12px 32px rgba(109,76,255,.13),
        inset 0 0 0 1px rgba(109,76,255,.08);
}

.payment-option i{
    font-size:17px;
}

.payment-paypal-logo{
    display:block;

    width:auto;
    height:60px;
    max-width:160px;

    object-fit:contain;

    opacity:1;
    filter:none !important;
    transform:none !important;
}

.paypal-payment-message{
    padding:42px 28px;

    text-align:center;

    border:1px solid rgba(118,92,255,.18);
    border-radius:24px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.94),
            rgba(245,242,255,.82)
        );

    box-shadow:
        0 18px 45px rgba(75,62,150,.08),
        inset 0 1px 0 rgba(255,255,255,.98);
}

.paypal-payment-message img{
    display:block;

    width:auto;
    height:52px;

    margin:0 auto 22px;

    object-fit:contain;

    filter:none !important;
}

.paypal-payment-message h3{
    margin:0 0 12px;

    color:#172033;

    font-size:21px;
}

.paypal-payment-message p{
    max-width:440px;

    margin:0 auto;

    color:#747c8f;

    font-size:14px;
    line-height:1.7;
}

[hidden]{
    display:none !important;
}
/* VISA + MASTERCARD — OŠTRE IKONICE */

.licenso-payment-brand{
    display:block !important;

    width:auto !important;
    height:28px !important;

    max-width:none !important;

    object-fit:contain !important;

    opacity:1 !important;
    filter:none !important;
    transform:none !important;

    image-rendering:auto !important;

    transition:
        opacity .2s ease,
        transform .2s ease !important;
}

.licenso-payment-brand.is-active{
    opacity:1 !important;
    filter:none !important;
    transform:scale(1.06) !important;
}

.licenso-payment-brand.is-muted{
    opacity:.38 !important;
    filter:none !important;
    transform:scale(.96) !important;
}
/* ==================================================
   PAYMENT SUCCESS MODAL
================================================== */

.payment-success-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 24px;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transition:
        opacity .25s ease,
        visibility .25s ease;
}

.payment-success-modal.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.payment-success-overlay {
    position: absolute;
    inset: 0;

    background: rgba(12, 18, 34, .46);

    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.payment-success-box {
    position: relative;
    z-index: 2;

    width: min(100%, 520px);

    padding: 48px 42px 36px;

    text-align: center;

    border-radius: 34px;

    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(132, 101, 255, .14),
            transparent 34%
        ),
        rgba(255, 255, 255, .96);

    border: 1px solid rgba(210, 215, 235, .76);

    box-shadow:
        0 38px 100px rgba(23, 32, 67, .20),
        inset 0 1px 0 rgba(255, 255, 255, 1);

    transform: translateY(18px) scale(.97);

    transition: transform .28s ease;
}

.payment-success-modal.is-open .payment-success-box {
    transform: translateY(0) scale(1);
}

.payment-success-close {
    position: absolute;
    top: 18px;
    right: 18px;

    width: 42px;
    height: 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 0;
    border-radius: 50%;

    color: #131927;
    background: rgba(245, 247, 252, .96);

    font-size: 18px;
    cursor: pointer;
}

.payment-success-icon {
    width: 86px;
    height: 86px;

    margin: 0 auto 22px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    color: #fff;
    font-size: 34px;

    background:
        linear-gradient(
            135deg,
            #5f7cff,
            #7b50ff,
            #9b36ed
        );

    box-shadow:
        0 20px 42px rgba(111, 74, 255, .30);
}

.payment-success-label {
    display: inline-flex;

    margin-bottom: 13px;
    padding: 8px 15px;

    border-radius: 999px;

    color: #6f49ef;
    background: rgba(111, 73, 239, .09);

    font-size: 13px;
    font-weight: 700;
}

.payment-success-box h2 {
    margin: 0;

    color: #0d1424;

    font-size: 32px;
    line-height: 1.12;
    letter-spacing: -1.2px;
}

.payment-success-box > p {
    max-width: 410px;

    margin: 17px auto 25px;

    color: #687287;

    font-size: 15px;
    line-height: 1.65;
}

.payment-success-order {
    margin-bottom: 24px;
    padding: 17px 20px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    border-radius: 18px;

    background: #f6f7fb;
    border: 1px solid rgba(217, 221, 234, .86);
}

.payment-success-order span {
    color: #778095;
    font-size: 13px;
    font-weight: 600;
}

.payment-success-order strong {
    color: #11182a;
    font-size: 14px;
    letter-spacing: .4px;
}

.payment-success-chat,
.payment-success-finish {
    width: 100%;
    height: 58px;

    border-radius: 19px;

    font-family: inherit;
    font-size: 16px;
    font-weight: 750;

    cursor: pointer;
}

.payment-success-chat {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 10px;

    color: #fff;
    border: 0;

    background:
        linear-gradient(
            110deg,
            #5287ff,
            #6b5cff,
            #922fff
        );

    box-shadow:
        0 18px 36px rgba(103, 78, 255, .26);
}

.payment-success-finish {
    margin-top: 11px;

    color: #262d3d;

    background: transparent;
    border: 1px solid rgba(207, 212, 227, .95);
}

@media (max-width: 600px) {
    .payment-success-box {
        padding: 44px 22px 26px;
        border-radius: 28px;
    }

    .payment-success-box h2 {
        font-size: 27px;
    }
}
/* ==================================================
   FINAL — SVETLEĆI BORDER OKO SVIH 12 LOGO KOCKICA
   OVAJ BLOK MORA BITI POSLEDNJI U card.css
================================================== */

.products-grid .product-card .product-logo{
    position:relative !important;
    overflow:visible !important;
    isolation:isolate !important;

    border:1px solid rgba(255,255,255,1) !important;

    box-shadow:
        0 0 0 2px rgba(255,255,255,.88),
        0 0 0 4px rgba(160,135,255,.18),

        0 0 18px rgba(255,255,255,1),
        0 0 30px rgba(139,112,255,.50),
        0 0 48px rgba(105,155,255,.30),

        0 22px 48px rgba(44,54,102,.13),

        inset 0 2px 3px rgba(255,255,255,1),
        inset 0 -2px 5px rgba(145,128,255,.10)
        !important;
}

/* prava svetleća kontura oko kockice */

.products-grid .product-card .product-logo::after{
    content:"" !important;

    position:absolute !important;
    inset:-8px !important;

    left:-8px !important;
    right:-8px !important;
    top:-8px !important;
    bottom:-8px !important;

    width:auto !important;
    height:auto !important;

    transform:none !important;

    border-radius:45px !important;

    background:transparent !important;

    border:2px solid rgba(255,255,255,.92) !important;

    box-shadow:
        0 0 8px rgba(255,255,255,1),
        0 0 18px rgba(160,116,255,.70),
        0 0 34px rgba(103,151,255,.42)
        !important;

    filter:none !important;
    opacity:1 !important;

    pointer-events:none !important;
    z-index:0 !important;
}

/* slika i unutrašnja refleksija iznad svetleće konture */

.products-grid .product-card .product-logo::before{
    z-index:1 !important;
}

.products-grid .product-card .product-logo img{
    position:relative !important;
    z-index:2 !important;
}
/* Broj nepročitane poruke */

.chat-toggle{
    position:relative;
}

.chat-notification{
    position:absolute;

    top:8px;
    right:8px;

    width:22px;
    height:22px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#ff3b30;
    color:#fff;

    border:2px solid #fff;
    border-radius:50%;

    font-size:12px;
    font-weight:700;
    line-height:1;

    box-shadow:
        0 6px 18px rgba(255,59,48,.35);

    z-index:100;
}
/* NEPROČITANA PORUKA NA CHAT IKONICI */

#liveChatButton{
    position:fixed !important;
    overflow:visible !important;
}

#liveChatBadge{
    position:absolute !important;

    top:-5px !important;
    right:-5px !important;

    min-width:22px !important;
    height:22px !important;

    padding:0 6px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    border-radius:999px !important;

    background:#ff3b30 !important;
    color:#ffffff !important;

    border:2px solid #ffffff !important;

    font-size:11px !important;
    font-weight:800 !important;
    line-height:1 !important;

    box-shadow:
        0 6px 16px rgba(255,59,48,.35) !important;

    opacity:1 !important;
    visibility:visible !important;

    z-index:999999 !important;
}
/* UKLANJA ZELENU ONLINE TAČKICU SA CHAT IKONICE */

#liveChatButton .live-chat-online{
    display:none !important;
}
/* ==================================================
   CHECKOUT PAYMENT METHOD - IPS / EBANKING
================================================== */

.licenso-payment-method-heading{
    margin-top:24px;
    margin-bottom:14px;

    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:12px;
}

.licenso-payment-method-heading span{
    font-size:14px;
    font-weight:750;
    color:#141827;
}

.licenso-payment-method-heading small{
    font-size:11px;
    font-weight:500;
    color:#9aa0af;
}


.licenso-payment-options{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;

    margin-bottom:14px;
}


.payment-option{
    min-width:0;
    height:78px;

    padding:0 16px;

    display:flex;
    align-items:center;
    justify-content:flex-start;

    gap:12px;

    border-radius:18px;
    border:1px solid rgba(25,30,50,.08);

    background:rgba(255,255,255,.76);

    box-shadow:
        0 8px 24px rgba(30,35,60,.04);

    cursor:pointer;

    transition:
        border-color .22s ease,
        background .22s ease,
        box-shadow .22s ease,
        transform .22s ease;
}


.payment-option:hover{
    transform:translateY(-1px);

    border-color:rgba(112,83,255,.20);
}


.payment-option.active{
    background:
        linear-gradient(
            135deg,
            rgba(248,247,255,.98),
            rgba(243,240,255,.88)
        );

    border-color:rgba(111,76,255,.42);

    box-shadow:
        0 10px 28px rgba(111,76,255,.10),
        inset 0 0 0 1px rgba(255,255,255,.75);
}


.payment-option-icon{
    width:38px;
    height:38px;

    flex:0 0 38px;

    display:grid;
    place-items:center;

    border-radius:12px;

    background:rgba(111,76,255,.08);

    color:#7051ff;

    font-size:15px;
}


.payment-option-copy{
    min-width:0;

    display:flex;
    flex-direction:column;
    align-items:flex-start;

    gap:3px;
}


.payment-option-copy strong{
    font-size:13px;
    font-weight:750;
    color:#171b29;
}


.payment-option-copy small{
    font-size:10px;
    font-weight:500;
    color:#999fac;

    white-space:nowrap;
}


.payment-option.active
.payment-option-copy strong{
    color:#6547f5;
}


.licenso-pay-button{
    margin-top:0;
}

/* ==================================================
   IPS QR PAYMENT MODAL
================================================== */

.ips-payment-modal{
    position:fixed;
    inset:0;

    z-index:12000;

    display:none;
    align-items:center;
    justify-content:center;

    padding:24px;
}

.ips-payment-modal.is-open{
    display:flex;
}

.ips-payment-overlay{
    position:absolute;
    inset:0;

    background:rgba(18,22,35,.28);

    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
}

.ips-payment-box{
    position:relative;
    z-index:2;

    width:min(720px,100%);

    max-height:90vh;
    overflow:auto;

    padding:30px;

    border-radius:30px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.97),
            rgba(248,249,255,.92)
        );

    border:1px solid rgba(255,255,255,.95);

    box-shadow:
        0 30px 90px rgba(31,38,70,.16),
        inset 0 1px 0 rgba(255,255,255,1);
}

.ips-payment-close{
    position:absolute;
    top:18px;
    right:18px;

    width:40px;
    height:40px;

    display:grid;
    place-items:center;

    border:none;
    border-radius:50%;

    background:rgba(245,246,251,.9);

    color:#5f6678;

    cursor:pointer;
}

.ips-payment-header{
    display:flex;
    align-items:flex-start;
    gap:16px;

    padding-right:46px;
}

.ips-payment-icon{
    width:52px;
    height:52px;

    flex:0 0 52px;

    display:grid;
    place-items:center;

    border-radius:16px;

    background:
        linear-gradient(
            135deg,
            rgba(112,81,255,.14),
            rgba(112,81,255,.07)
        );

    color:#7051ff;

    font-size:19px;
}

.ips-payment-label{
    display:block;

    margin-bottom:5px;

    color:#7051ff;

    font-size:11px;
    font-weight:800;

    letter-spacing:.7px;
    text-transform:uppercase;
}

.ips-payment-header h2{
    margin:0 0 7px;

    color:#151925;

    font-size:26px;
    line-height:1.15;

    letter-spacing:-.8px;
}

.ips-payment-header p{
    margin:0;

    max-width:500px;

    color:#747b8c;

    font-size:13px;
    line-height:1.65;
}

.ips-payment-content{
    margin-top:26px;

    display:grid;
    grid-template-columns:240px 1fr;

    gap:22px;
}

.ips-qr-side{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    gap:12px;

    padding:20px;

    border-radius:22px;

    background:rgba(255,255,255,.76);

    border:1px solid rgba(25,30,50,.07);

    box-shadow:
        0 10px 28px rgba(30,35,60,.05);
}

.ips-qr-code{
    width:180px;
    height:180px;

    display:grid;
    place-items:center;

    border-radius:18px;

    background:#ffffff;

    border:1px solid rgba(20,25,40,.07);

    overflow:hidden;
}

.ips-qr-code canvas,
.ips-qr-code img{
    width:100% !important;
    height:100% !important;
    object-fit:contain;
}

.ips-qr-hint{
    color:#969cab;

    font-size:10px;
    text-align:center;
}

.ips-payment-details{
    display:flex;
    flex-direction:column;

    border-radius:22px;

    overflow:hidden;

    background:rgba(255,255,255,.68);

    border:1px solid rgba(25,30,50,.07);
}

.ips-detail-row{
    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:20px;

    min-height:58px;

    padding:0 18px;

    border-bottom:1px solid rgba(20,25,40,.06);
}

.ips-detail-row:last-child{
    border-bottom:none;
}

.ips-detail-row span{
    color:#9298a7;

    font-size:11px;
}

.ips-detail-row strong{
    max-width:220px;

    color:#202534;

    font-size:12px;
    font-weight:750;

    text-align:right;
    word-break:break-word;
}

.ips-payment-note{
    margin-top:20px;

    display:flex;
    align-items:flex-start;

    gap:10px;

    padding:14px 16px;

    border-radius:16px;

    background:rgba(112,81,255,.055);

    color:#6f7485;
}

.ips-payment-note i{
    margin-top:2px;

    color:#7051ff;

    font-size:12px;
}

.ips-payment-note p{
    margin:0;

    font-size:11px;
    line-height:1.6;
}

.ips-payment-confirm{
    width:100%;
    height:54px;

    margin-top:18px;

    display:flex;
    align-items:center;
    justify-content:center;

    gap:9px;

    border:none;
    border-radius:17px;

    background:
        linear-gradient(
            135deg,
            #6b56ff,
            #765dff
        );

    color:#ffffff;

    font-family:inherit;
    font-size:13px;
    font-weight:800;

    cursor:pointer;

    box-shadow:
        0 15px 32px rgba(107,86,255,.22);

    transition:
        transform .2s ease,
        box-shadow .2s ease;
}

.ips-payment-confirm:hover{
    transform:translateY(-1px);

    box-shadow:
        0 18px 38px rgba(107,86,255,.28);
}

/* MOBILE */

@media(max-width:700px){

    .ips-payment-modal{
        padding:12px;
        align-items:flex-end;
    }

    .ips-payment-box{
        width:100%;

        max-height:92vh;

        padding:22px 18px 20px;

        border-radius:26px 26px 18px 18px;
    }

    .ips-payment-content{
        grid-template-columns:1fr;
    }

    .ips-qr-side{
        padding:16px;
    }

    .ips-qr-code {
    margin: 12px auto 14px;
}

    .ips-payment-header h2{
        font-size:22px;
    }
}
/* ==================================================
   IPS SIMPLE CONTENT
================================================== */

.ips-payment-content-simple{
    margin-top:28px;

    display:flex;
    flex-direction:column;
    align-items:center;

    text-align:center;
}

.ips-payment-content-simple .ips-qr-code{
    width:230px;
    height:230px;

    padding:14px;

    border-radius:24px;

    background:#fff;

    border:1px solid rgba(20,25,40,.07);

    box-shadow:
        0 16px 40px rgba(30,35,60,.07);
}

.ips-payment-amount{
    margin-top:22px;

    display:flex;
    flex-direction:column;

    gap:4px;
}

.ips-payment-amount span{
    color:#969cab;

    font-size:11px;
    font-weight:600;
}

.ips-payment-amount strong{
    color:#171b28;

    font-size:26px;
    font-weight:800;

    letter-spacing:-.6px;
}

.ips-payment-help{
    max-width:360px;

    margin:12px auto 0;

    color:#858b9b;

    font-size:12px;
    line-height:1.6;
}

.ips-copy-reference{
    margin-top:18px;

    height:44px;

    padding:0 18px;

    display:flex;
    align-items:center;
    justify-content:center;

    gap:8px;

    border-radius:14px;

    border:1px solid rgba(112,81,255,.14);

    background:rgba(112,81,255,.055);

    color:#6547f5;

    font-family:inherit;
    font-size:11px;
    font-weight:750;

    cursor:pointer;

    transition:
        background .2s ease,
        transform .2s ease;
}

.ips-copy-reference:hover{
    background:rgba(112,81,255,.09);

    transform:translateY(-1px);
}

@media(max-width:700px){

    .ips-payment-content-simple .ips-qr-code{
        width:200px;
        height:200px;
    }

    .ips-payment-amount strong{
        font-size:23px;
    }
}
/* ==========================================
   EBANKING BANK SELECT MODAL
========================================== */

.ebanking-bank-box {
    width: min(760px, calc(100vw - 40px));
    padding: 38px;
    border-radius: 30px;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.96),
            rgba(250,249,255,.92)
        );

    border: 1px solid rgba(255,255,255,.85);

    box-shadow:
        0 30px 90px rgba(34, 28, 70, .18),
        0 0 0 1px rgba(109, 82, 255, .04);

    backdrop-filter: blur(30px);
    -webkit-backdrop-filter: blur(30px);
}

.ebanking-bank-header {
    margin-bottom: 28px;
}

.ebanking-bank-label {
    display: inline-flex;
    align-items: center;

    margin-bottom: 10px;

    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;

    color: #745cff;
}

.ebanking-bank-header h3 {
    margin: 0;

    font-size: 30px;
    line-height: 1.1;
    font-weight: 750;

    color: #171723;
}

.ebanking-bank-header p {
    margin: 10px 0 0;

    font-size: 15px;
    line-height: 1.55;

    color: #8d8d9d;
}

.ebanking-bank-grid {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 14px;
}

.ebanking-bank-option {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: space-between;

    min-height: 76px;

    padding: 0 22px;

    border-radius: 20px;

    border:
        1px solid rgba(50, 45, 90, .09);

    background:
        rgba(255,255,255,.78);

    color: #242332;

    font-family: inherit;
    font-size: 15px;
    font-weight: 700;

    cursor: pointer;

    box-shadow:
        0 10px 28px rgba(30, 25, 70, .05);

    transition:
        transform .22s ease,
        border-color .22s ease,
        box-shadow .22s ease,
        background .22s ease;
}

.ebanking-bank-option:hover {
    transform: translateY(-3px);

    border-color:
        rgba(112, 86, 255, .38);

    background:
        rgba(255,255,255,.96);

    box-shadow:
        0 18px 40px
        rgba(77, 57, 170, .11);
}

.ebanking-bank-option i {
    font-size: 13px;

    color: #8f84d8;

    transition:
        transform .22s ease;
}

.ebanking-bank-option:hover i {
    transform: translateX(3px);
}

.ebanking-bank-option::before {
    content: "";

    width: 42px;
    height: 42px;

    flex: 0 0 42px;

    margin-right: 14px;

    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            rgba(117, 91, 255, .13),
            rgba(167, 147, 255, .06)
        );

    box-shadow:
        inset 0 0 0 1px
        rgba(112, 86, 255, .08);
}

.ebanking-bank-option span {
    margin-right: auto;
}

/* MOBILE */

@media (max-width: 700px) {

    .ebanking-bank-box {
        width:
            calc(100vw - 24px);

        padding:
            28px 20px 22px;

        border-radius: 26px;
    }

    .ebanking-bank-header h3 {
        font-size: 25px;
    }

    .ebanking-bank-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .ebanking-bank-option {
        min-height: 68px;
        padding: 0 18px;
        border-radius: 18px;
    }
}
/* ==========================================
   EBANKING DROPDOWN
========================================== */

.ebanking-bank-select-wrap {
    margin-top: 26px;
}

.ebanking-bank-select-label {
    display: block;

    margin-bottom: 9px;

    font-size: 13px;
    font-weight: 700;

    color: #6f6f7d;
}

.ebanking-bank-select-field {
    position: relative;

    display: flex;
    align-items: center;

    min-height: 66px;

    padding: 0 18px;

    border-radius: 18px;

    background:
        rgba(255,255,255,.88);

    border:
        1px solid rgba(40,35,80,.10);

    box-shadow:
        0 10px 28px rgba(40,30,90,.05);

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.ebanking-bank-select-field:focus-within {
    border-color:
        rgba(111,86,255,.45);

    box-shadow:
        0 14px 34px rgba(90,65,190,.10);
}

.ebanking-bank-select-field > i:first-child {
    margin-right: 13px;

    color: #7560ff;

    font-size: 17px;
}

.ebanking-bank-select-field > i:last-child {
    position: absolute;

    right: 19px;

    pointer-events: none;

    color: #8d89a2;

    font-size: 12px;
}

.ebanking-bank-select {
    width: 100%;

    padding-right: 40px;

    border: 0;
    outline: 0;

    appearance: none;
    -webkit-appearance: none;

    background: transparent;

    font-family: inherit;
    font-size: 15px;
    font-weight: 650;

    color: #22212d;

    cursor: pointer;
}

.ebanking-open-bank {
    width: 100%;

    min-height: 62px;

    margin-top: 16px;

    border: 0;
    border-radius: 18px;

    background:
        linear-gradient(
            135deg,
            #684cff,
            #7b56ff
        );

    color: #fff;

    font-family: inherit;
    font-size: 15px;
    font-weight: 750;

    cursor: pointer;

    box-shadow:
        0 15px 35px
        rgba(105,76,255,.24);

    transition:
        transform .2s ease,
        opacity .2s ease;
}

.ebanking-open-bank:hover:not(:disabled) {
    transform: translateY(-2px);
}

.ebanking-open-bank:disabled {
    opacity: .42;
    cursor: not-allowed;

    box-shadow: none;
}
.checkout-country-field {
    position: relative;

    display: flex;
    align-items: center;

    width: 100%;
    min-height: 64px;

    padding: 0 18px;

    border: 1px solid rgba(36, 32, 70, .10);
    border-radius: 18px;

    background: rgba(255,255,255,.82);

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.checkout-country-field:focus-within {
    border-color: rgba(111,86,255,.45);

    box-shadow:
        0 10px 28px
        rgba(94,72,190,.08);
}

.checkout-country-field > i:first-child {
    margin-right: 13px;

    color: #765cff;
}

.checkout-country-field > i:last-child {
    position: absolute;
    right: 19px;

    font-size: 11px;
    color: #9693a6;

    pointer-events: none;
}

.checkout-country-field select {
    width: 100%;

    padding-right: 38px;

    border: 0;
    outline: 0;

    appearance: none;
    -webkit-appearance: none;

    background: transparent;

    font-family: inherit;
    font-size: 15px;

    color: #262530;

    cursor: pointer;
}
/* ==========================================
   PAYMENT MODALS ABOVE CHECKOUT
========================================== */

.licenso-checkout-modal {
    z-index: 9000;
}

.ips-payment-modal {
    z-index: 12000 !important;
}

.ips-payment-overlay {
    z-index: 12001;
}

.ips-payment-box {
    position: relative;
    z-index: 12002;
}

.payment-success-modal {
    z-index: 13000 !important;
}

.payment-success-overlay {
    z-index: 13001;
}

.payment-success-box {
    position: relative;
    z-index: 13002;
}
/* Checkout preko navbara */

.licenso-checkout-modal {
    position: fixed;
    inset: 0;
    z-index: 20000 !important;
}

.licenso-checkout-backdrop {
    position: absolute;
    inset: 0;
    z-index: 20001;
}

.licenso-checkout-window {
    position: relative;
    z-index: 20002;
}
.ips-payment-modal {
    z-index: 21000 !important;
}

.ips-payment-overlay {
    z-index: 21001;
}

.ips-payment-box {
    position: relative;
    z-index: 21002;
}
/* Malo više prostora u IPS modalu */

#ipsQrCode {
    margin-top: 16px !important;
    margin-bottom: 16px !important;
}

.ips-payment-amount-label {
    display: block;
    margin-top: 6px !important;
    margin-bottom: 8px !important;
}

#ipsPaymentAmount {
    display: block;
    margin-bottom: 16px !important;
}

.ips-payment-help {
    margin-top: 0 !important;
    margin-bottom: 20px !important;
}
#ipsQrCode {
    margin-top: 22px !important;
    margin-bottom: 20px !important;
}

.ips-payment-amount-label {
    display: block;
    margin-top: 10px !important;
    margin-bottom: 8px !important;
}
/* IPS - završno podešavanje razmaka */

#ipsQrCode {
    margin: 18px auto 8px !important;
}

.ips-payment-amount-label {
    display: block;
    margin: 0 0 5px !important;
}

#ipsPaymentAmount {
    display: block;
    margin: 0 0 12px !important;
}

.ips-payment-help {
    margin: 0 0 18px !important;
}

.ips-payment-heading {
    margin-bottom: 0 !important;
}

.ips-payment-heading p {
    margin-bottom: 0 !important;
}
.ebanking-payment-confirm {
    width: 100%;
    min-height: 62px;

    margin-top: 12px;

    border: 0;
    border-radius: 18px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;

    background:
        linear-gradient(
            135deg,
            #684cff,
            #7b56ff
        );

    color: #fff;

    font-family: inherit;
    font-size: 15px;
    font-weight: 750;

    cursor: pointer;

    box-shadow:
        0 15px 35px
        rgba(105,76,255,.22);

    transition:
        transform .2s ease,
        opacity .2s ease;
}

.ebanking-payment-confirm:hover {
    transform: translateY(-2px);
}

.ebanking-payment-confirm:disabled {
    opacity: .65;
    cursor: wait;
    transform: none;
}
/* ==========================================
   EBANKING TRANSFER DETAILS
========================================== */

.ebanking-transfer-details {
    margin-top: 18px;
    padding: 20px;

    border-radius: 20px;

    background:
        rgba(255,255,255,.72);

    border:
        1px solid rgba(40,35,80,.08);

    box-shadow:
        0 12px 35px rgba(40,30,90,.06);
}

.ebanking-transfer-details[hidden] {
    display: none !important;
}

.ebanking-transfer-head {
    margin-bottom: 16px;
}

.ebanking-transfer-head strong {
    display: block;

    font-size: 17px;
    color: #20202a;

    margin-bottom: 5px;
}

.ebanking-transfer-head p {
    margin: 0;

    font-size: 13px;
    line-height: 1.45;

    color: #92909e;
}

.ebanking-transfer-row {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    padding: 11px 0;

    border-bottom:
        1px solid rgba(35,30,70,.06);
}

.ebanking-transfer-row span {
    font-size: 13px;
    color: #9996a5;
}

.ebanking-transfer-row strong {
    font-size: 14px;
    font-weight: 700;

    text-align: right;

    color: #22212b;
}

.ebanking-copy-transfer {
    width: 100%;

    margin-top: 15px;
    padding: 14px 18px;

    border: 0;
    border-radius: 15px;

    background:
        rgba(108,82,255,.09);

    color: #674eff;

    font-family: inherit;
    font-size: 14px;
    font-weight: 700;

    cursor: pointer;
}
/* ==========================================
   CHECKOUT REQUIRED FIELD ERROR
========================================== */

.checkout-field-error {
    border-color:
        rgba(220, 55, 75, .65) !important;

    box-shadow:
        0 0 0 3px
        rgba(220, 55, 75, .07) !important;
}

/* =========================================
   TRACKER — BEZ IKAKVOG BOXA / TRAKE
========================================= */

.big-title-track{
    position:relative !important;

    height:0 !important;
    min-height:0 !important;

    margin:0 !important;
    padding:0 !important;

    overflow:visible !important;

    background:none !important;
    border:0 !important;
    box-shadow:none !important;

    z-index:5 !important;

    transform:translateY(-20px);
}

.big-title-group{
    position:relative !important;

    background:none !important;
    border:0 !important;
    box-shadow:none !important;
}

.big-title-group span{
    padding:0 45px !important;
    line-height:1 !important;

    background:none !important;
    border:0 !important;
    box-shadow:none !important;
}
/* =========================================
   HERO → TRACKER → PROCESS RAZMACI
========================================= */

@media (min-width: 761px){

    .hero{
        padding-bottom:95px !important;
    }

    .big-title-track{
    position:relative !important;
    top:-5px !important;
}

    .process{
        margin-top:0 !important;
        padding-top:70px !important;
    }
}
/* ==========================================
   EBANKING PAYMENT DETAILS
========================================== */

.payment-details,
.ebanking-transfer-details{

    margin-top:24px;

    padding:24px;

    border:1px solid rgba(20,20,20,.08);

    border-radius:24px;

    background:rgba(255,255,255,.82);

    backdrop-filter:blur(24px);

    -webkit-backdrop-filter:blur(24px);

    box-shadow:
    0 20px 60px rgba(20,20,20,.06);

}

.payment-details h3,
.ebanking-transfer-head strong{

    display:block;

    font-size:28px;

    font-weight:800;

    color:#101322;

    margin-bottom:8px;

}

.payment-details p,
.ebanking-transfer-head p{

    color:#7d8497;

    font-size:16px;

    line-height:1.6;

    margin-bottom:22px;

}

.payment-detail-row,
.ebanking-transfer-row{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:16px 0;

    border-bottom:1px solid rgba(20,20,20,.06);

}

.payment-detail-row:last-of-type,
.ebanking-transfer-row:last-of-type{

    border-bottom:none;

}

.payment-detail-row span,
.ebanking-transfer-row span{

    color:#7d8497;

    font-weight:500;

}

.payment-detail-row strong,
.ebanking-transfer-row strong{

    color:#111827;

    font-weight:700;

    text-align:right;

}

.copy-payment-button,
.ebanking-copy-transfer{

    width:100%;

    margin-top:22px;

    height:58px;

    border:none;

    border-radius:18px;

    cursor:pointer;

    font-size:17px;

    font-weight:700;

    color:#fff;

    background:linear-gradient(
        135deg,
        #5c7cff,
        #8b4dff
    );

    transition:.25s;

}

.copy-payment-button:hover,
.ebanking-copy-transfer:hover{

    transform:translateY(-2px);

    box-shadow:
    0 14px 35px rgba(116,84,255,.35);

}
/* GEMINI - uvećaj samo ikonicu, okvir ostaje isti */

.products-grid .product-card:nth-child(3) .product-logo img{
    transform: scale(4.00) !important;
    transform-origin: center !important;
}
/* GEMINI — uvećaj samo logo unutar postojeće kockice */

.products-grid .product-logo img[src*="gemini"],
.hero-product-card .product-logo img[src*="gemini"]{
    width:115px !important;
    height:115px !important;

    max-width:none !important;
    max-height:none !important;

    object-fit:contain !important;

    transform:scale(1.12) !important;
    transform-origin:center !important;
}

/* =========================================================
   FAQ MOBILE — FINAL SMOOTH FIX
========================================================= */

@media (max-width:768px){

    .faq-answer{
        display:block !important;

        max-height:0 !important;
        opacity:0 !important;

        overflow:hidden !important;

        margin:0 !important;
        padding:0 18px !important;

        transform:translateY(-5px) !important;

        transition:
            max-height .38s cubic-bezier(.4,0,.2,1),
            opacity .25s ease,
            transform .32s cubic-bezier(.4,0,.2,1),
            padding .32s cubic-bezier(.4,0,.2,1)
            !important;
    }


    .faq-item.active .faq-answer{
        max-height:180px !important;

        opacity:1 !important;

        padding:
            10px
            18px
            22px
            !important;

        transform:translateY(0) !important;
    }


    .faq-question span{
        transform:rotate(0deg) !important;

        transition:
            transform .3s cubic-bezier(.4,0,.2,1)
            !important;
    }


    .faq-item.active .faq-question span{
        transform:rotate(45deg) !important;
    }

}





