/* ── Hero Section ── */
#dd-hero {
	background-color: #021C2F;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	padding: 329px 76px 87px;
	position: relative;
	float: left;
	width: 100%;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

.hero-inner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
}

.hero-left-block {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 25px;
	max-width: 650px;
}

.hero-wifi-badge {
    position: absolute;
    right: 80px;
    bottom: 275px;
    width: 120px;
    height: auto;
    display: block;
}

.hero-title {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 66px;
	line-height: 1.17;
	color: #fff;
	margin: 0;
}

.hero-subtitle {
    font-family: 'Outfit', sans-serif;
    font-weight: 300;
    font-size: 20px;
    line-height: 1.6;
    letter-spacing: 0.027em;
    color: #fff;
    margin: 0;
    max-width: 520px;
}

.hero-btn-wrap {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
}

.hero-cta-btn {
	font-family: 'Outfit', sans-serif;
	font-weight: 500;
	font-size: 18px;
	line-height: 1.25;
	letter-spacing: 0.039em;
	color: #fff;
	background-color: rgba(0, 0, 0, 0.15);
	-webkit-backdrop-filter: blur(2.1316871643066406px);
	        backdrop-filter: blur(2.1316871643066406px);
	border: 1px solid #fff;
	border-radius: 200px;
	padding: 14px 9px 14px 28px;
	height: 71px;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 12px;
	text-decoration: none;
	-webkit-transition: all 600ms ease-in-out;
	-o-transition: all 600ms ease-in-out;
	   transition: all 600ms ease-in-out;
}

.hero-cta-btn:hover {
	background-color: rgba(120, 120, 120, 0.3);
	color: #fff;
	border-color: #fff;
	text-decoration: none;
}

.hero-cta-icon {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background-color: #89BEF4;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	-webkit-transition: -webkit-transform 600ms ease-in-out;
	transition: -webkit-transform 600ms ease-in-out;
	-o-transition: transform 600ms ease-in-out;
	transition: transform 600ms ease-in-out;
	transition: transform 600ms ease-in-out, -webkit-transform 600ms ease-in-out;
}

.hero-cta-btn:hover .hero-cta-icon {
	-webkit-transform: rotate(90deg);
	    -ms-transform: rotate(90deg);
	        transform: rotate(90deg);
}

/* Hero popust baner */

.hero-popust-baner {
    background: #fff;
    border-radius: 10px;
    border: 1px solid #C7CFD5;
    background: #FFF;
    display: flex;
    padding: 20px;
    max-width: 315px;
    position: absolute;
    right: 78px;
    bottom: 87px;
    /* width: 120px; */
    height: auto;
    /* display: block; */
}

.popust-baner-tekst {
    color: rgb(2, 28, 47);
    font-family: Outfit;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 25px;
    margin: 0px;
}

.popust-baner-tekst span{
  font-weight: 600;
}

/* Banner hidden by scroll (mirrors header behavior, used under 991) */
.hero-popust-baner.is-hidden-by-scroll-threshold {
    display: none !important;
}

/* Banner hidden when footer is visible (both breakpoints) */
.hero-popust-baner.popust-baner-hidden-footer {
    display: none !important;
}

/* ── Hero Section end ── */

/* ── Prva Sekcija ── */
#dd-prva-sekcija {
	background-color: #fff;
	padding: 103px 76px;
	float: left;
	width: 100%;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

.prva-sekcija-kontejner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
}

.prva-sekcija-kontejner:after {
	content: '';
	display: table;
	clear: both;
}

/* Left card */
#dd-prva-sekcija .prva-sekcija-levi-okvir {
	padding-left: 0;
	padding-right: 0;
	width: 33%;
}

.prva-sekcija-levi-okvir {
	min-height: 393px;
	background-color: #fff;
	border-radius: 20px;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
}

.levi-blok {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 15px;
	padding-right: 15px;
	width: 100%;
}

.naslov-podnaslov {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 11px;
}

.prva-sekcija-naslov {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 44px;
	line-height: 1.23;
	color: #021C2F;
	margin: 0;
	max-width: 520px;
}

.prva-sekcija-paragraf {
	font-family: 'Outfit', sans-serif;
	font-weight: 300;
	font-size: 16px;
	line-height: 1.75;
	letter-spacing: 0.01em;
	color: #021C2F;
	margin: 0;
	max-width: 500px;
}

.cekeri {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 2px;
	max-width: 453px;
}

.ceker {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 9px;
}

.checker-ikona {
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	width: 22px;
	height: 22px;
	display: block;
}

.checker-tekst {
	font-family: 'Outfit', sans-serif;
	font-weight: 500;
	font-size: 16px;
	line-height: 1.75;
	letter-spacing: 0.01em;
	color: #021C2F;
}

/* Right stat cards */
.desni-blokovi {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width: 67%;
}

.gif-blok {
	min-height: 393px;
	background-color: #4C3F36;
	border-radius: 20px;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	position: relative;
	overflow: hidden;
}

.gif-blok::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #000;
	opacity: 0.2;
	z-index: 1;
	pointer-events: none;
}

.gif-blok-video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
	z-index: 0;
	pointer-events: none;
}

.gif-blok .postotak-objasnjenje {
	position: relative;
	z-index: 2;
}

#dd-prva-sekcija .gif-blok--prvi {
	padding: 36px 49px;
	margin-right: 15px;
}

#dd-prva-sekcija .gif-blok--drugi {
	padding: 36px 49px;
	margin-left: 15px;
}

.postotak-objasnjenje {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 18px;
}

.postotak {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 70px;
	line-height: 1;
	color: #fff;
	margin: 0;
}

.gif-opis {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 18px;
	line-height: 1.56;
	color: #fff;
	margin: 0;
	max-width: 409px;
}

#dd-prva-sekcija .gif-blok--drugi .gif-opis {
	max-width: 259px;
}

/* Prva Sekcija responsive */


/* ── Prva Sekcija end ── */

/* ── Plutajuci Tekst (Marquee) Section ── */
#dd-plutajuci-tekst {
	background-color: #fff;
	overflow: hidden;
	padding: 0px 0 121px;
	width: 100%;
}

.plutajuci-traka {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	-webkit-animation: plutajuci-scroll 28s linear infinite;
	        animation: plutajuci-scroll 28s linear infinite;
	will-change: transform;
}

.plutajuci-sadrzaj {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 21px;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	padding-right: 21px;
}

.plutajuci-deo {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 21px;
}

.plutajuci-procenat {
	font-family: 'Outfit', sans-serif;
	font-weight: 250;
	font-size: 104px;
	line-height: 1.36;
	letter-spacing: 0.01em;
	color: #021C2F;
	white-space: nowrap;
}

.plutajuci-opis {
	font-family: 'Outfit', sans-serif;
	font-weight: 200;
	font-size: 104px;
	line-height: 1.36;
	letter-spacing: 0.01em;
	color: #A2A5A9;
	white-space: nowrap;
}

.plutajuci-slika-wrap {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	border-radius: 21px;
	overflow: hidden;
	width: 123px;
	height: 128px;
}

.plutajuci-slika-wrap img {
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
	display: block;
	border-radius: 21px;
}

@-webkit-keyframes plutajuci-scroll {
	0%   { -webkit-transform: translateX(0); transform: translateX(0); }
	100% { -webkit-transform: translateX(-50%); transform: translateX(-50%); }
}

@keyframes plutajuci-scroll {
	0%   { -webkit-transform: translateX(0); transform: translateX(0); }
	100% { -webkit-transform: translateX(-50%); transform: translateX(-50%); }
}

/* Marquee responsive */


/* ── Plutajuci Tekst end ── */

/* ── Kako Funkcioniše Section ── */
#dd-kako-funkcionise {
	background-color: #F6F7F8;
	padding: 146px 76px 120px;
	position: relative;
	overflow: hidden;
}

.kako-funkcionise-pozadina {
    position: absolute;
    top: 47%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 0;
    pointer-events: none;
    scale: 0.9;
}

.kako-funkcionise-pozadina img {
	display: block;
	max-width: none;
	height: auto;
}

.kako-funkcionise-sekcija {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 80px;
	position: relative;
	z-index: 1;
}

/* ── Blok 01 / Blok 02 ── */
.blok-01,
.blok-02 {
	-ms-flex-align: center;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

/* Left text block (blok-01) */
.blok-01 .levi-blok {
	min-height: 534px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	padding: 0 30px 0 0;
}

.levi-blok-sadrzaj {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 15px;
	max-width: 769px;
}

.naslov-podnaslov-kako {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 19px;
}

.kako-naslov {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 44px;
	line-height: 1.23;
	color: #021C2F;
	margin: 0;
	max-width: 483px;
}

.kako-podnaslov-wrap {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 14px;
}

.kako-podnaslov {
	font-family: 'Outfit', sans-serif;
	font-weight: 300;
	font-size: 16px;
	line-height: 1.625;
	letter-spacing: 0.005em;
	color: #021C2F;
	margin: 0;
}

.kako-cekeri {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 1px;
	max-width: 453px;
}

.kako-ceker {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 9px;
}

.kako-checker-ikona {
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	width: 22px;
	height: 22px;
	display: block;
}

.kako-checker-tekst {
	font-family: 'Outfit', sans-serif;
	font-weight: 500;
	font-size: 16px;
	line-height: 1.75;
	letter-spacing: 0.01em;
	color: #021C2F;
}

/* ── Image collage (Mask group) ── */
#dd-kako-funkcionise .mask-group {
	-webkit-box-flex: 1;
	    -ms-flex: 1 1 0%;
	        flex: 1 1 0%;
	position: relative;
	border-radius: 40px;
	overflow: hidden;
	min-height: 534px;
}

.mask-group.mask-group--01.col-12.col-sm-6 {
	padding: 0;
}

.mask-group.mask-group--02.col-12.col-sm-6 {
	padding: 0;
}

.mask-bg-div {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	z-index: 999;
	position: relative;
	height: 100%;
}

.mask-rekuperacija-bg {
	background-position: center 85%;
}

/* Rekuperacija right text block */
.rekuperacija-desni-blok {
	min-height: 544px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
}

.rekuperacija-desni-blok.col-12.col-sm-6 {
	padding: 0 0 0 50px;
}

.rekuperacija-naslov-podnaslov .kako-podnaslov-wrap {
	max-width: 760px;
}

.rekuperacija-naslov-podnaslov {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 26px;
	padding: 130px 0;
}

/* ── Kako Funkcioniše responsive ── */


/* ── Kako Funkcioniše end ── */

/* ── Sta Dobijate Section ── */
#dd-sta-dobijate {
	background-color: #fff;
	padding: 139px 0 61px 72px;
}

.sta-dobijate-kontejner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: flex-start;
	    -ms-flex-align: flex-start;
	        align-items: flex-start;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	gap: 48px;
}

.sta-dobijate-levi {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 254px;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	width: 478px;
}

.sta-dobijate-naslov {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 44px;
	line-height: 1.22;
	color: #021C2F;
	margin: 0;
}

.navigacija-wrap {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 12px;
}

.slider-nav-btn {
	width: 67px;
	height: 67px;
	border-radius: 200px;
	border: 1px solid #000;
	background-color: transparent;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	cursor: pointer;
	-webkit-transition: all 600ms ease-in-out;
	-o-transition: all 600ms ease-in-out;
	   transition: all 600ms ease-in-out;
}

.slider-nav-btn:hover {
	background-color: #f0f0f0;
	background: #89BEF4;
	color: #fff;
	border: solid 1px #89BEF4;
	opacity: 50%;
}

.sta-dobijate-desni {
	-webkit-box-flex: 1;
	    -ms-flex: 1;
	        flex: 1;
	overflow: hidden;
	max-width: 50%;
}

.slide-blok-slider {
	width: 100%;
}

.slide-item {
	padding-right: 20px;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

.slide-img-wrap {
	height: 430px;
	border-radius: 20px;
	background-color: #021C2F;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	position: relative;
	overflow: hidden;
}

.slide-card-check {
	position: absolute;
	top: 28px;
	right: 28px;
	z-index: 2;
	line-height: 0;
}

.slide-card-text {
	position: absolute;
	left: 34px;
	bottom: 44px;
	z-index: 2;
	max-width: 188px;
	margin: 0;
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 26px;
	line-height: 1.1;
	letter-spacing: 0;
	color: #fff;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
}

.slide-blok-slider .slick-list {
	overflow: visible !important;
	padding-right: 100px;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

/* Sta dobijate responsive */


/* ── Sta Dobijate end ── */

/* ── Proizvodi Section ── */
#dd-proizvodi {
	background-color: #fff;
	padding: 161px 76px;
	border-top: 1px solid #D9D9D9;
}

.proizvodi-kontejner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 76px;
}

.proizvodi-zaglavlje {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: flex-start;
	    -ms-flex-align: flex-start;
	        align-items: flex-start;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
}

.proizvodi-naslov-wrap {
	max-width: 700px;
}

.proizvodi-naslov {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 44px;
	line-height: 1.22;
	color: #021C2F;
	margin: 0;
}

.proizvodi-stat {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	-webkit-box-align: flex-end;
	    -ms-flex-align: flex-end;
	        align-items: flex-end;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
}

.proizvodi-stat-broj {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 87px;
	line-height: 1;
	color: #021C2F;
	margin: 0;
}

.proizvodi-stat-tekst {
	font-family: 'Outfit', sans-serif;
	font-weight: 300;
	font-size: 20px;
	line-height: 1.5;
	color: #021C2F;
	margin: 0;
}

.proizvodi-lista {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 37px;
}

.proizvod-kartica {
	border: 1px solid #C7CFD5;
	border-radius: 20px;
}

.proizvod-unutrasnjost {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: stretch;
	    -ms-flex-align: stretch;
	        align-items: stretch;
	gap: 0;
	padding: 48px 50px;
}

.proizvod-slika-wrap,
.proizvod-sadrzaj,
.proizvod-slika-desna {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
}

.proizvod-slika-wrap {
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	width: 527px;
	height: 378px;
	border-radius: 10px;
	overflow: hidden;
}

.proizvod-slika-bg {
	width: 100%;
	height: 100%;
	border-radius: 10px;
	overflow: hidden;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.proizvod-slika-bg img {
	width: 100%;
	height: auto;
	-o-object-fit: contain;
	   object-fit: contain;
	-o-object-position: center;
	   object-position: center;
	display: block;
	border-radius: 10px;
}

.proizvod-sadrzaj {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 27px;
	-webkit-box-flex: 1;
	    -ms-flex: 1;
	        flex: 1;
	min-width: 0;
	max-width: 512px;
	margin: 0 auto;
	padding: 0 15px;
}

.proizvod-info {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 18px;
}

.proizvod-naslov-podnaslov {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 8px;
}

.proizvod-h3 {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 28px;
	line-height: 1.25;
	color: #021C2F;
	margin: 0;
}

.proizvod-opis {
	font-family: 'Outfit', sans-serif;
	font-weight: 300;
	font-size: 16px;
	line-height: 1.625;
	letter-spacing: 0.005em;
	color: #021C2F;
	margin: 0;
}

.proizvod-lista-stavki {
	list-style: none;
	padding: 0;
	margin: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 6px;
}

.proizvod-lista-stavki li {
	font-family: 'Outfit', sans-serif;
	font-weight: 500;
	font-size: 16px;
	line-height: 1.875;
	letter-spacing: 0.01em;
	color: #021C2F;
	padding-left: 16px;
	position: relative;
}

.proizvod-lista-stavki li::before {
	font-size: 24px;
	content: '·';
	position: absolute;
	left: 0;
	top: -7px;
}

.proizvod-dugmici {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 16px;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
}

.proizvod-btn-primarni {
	font-family: 'Outfit', sans-serif;
	font-weight: 500;
	font-size: 16px;
	line-height: 1.25;
	letter-spacing: 0.039em;
	color: #021C2F;
	background-color: #DFEFFF;
	border: 1px solid #fff;
	border-radius: 200px;
	padding: 14px 9px 14px 28px;
	height: 63px;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 10px;
	text-decoration: none;
	-webkit-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}

.proizvod-btn-primarni:hover {
	color: #021C2F;
	border-color: #fff;
	background-color: #BFDFFF;
}

.proizvod-btn-primarni:hover .proizvod-btn-ikona {
	-webkit-transform: rotate(90deg);
	    -ms-transform: rotate(90deg);
	        transform: rotate(90deg);
}

.proizvod-btn-ikona {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-color: #89BEF4;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-transition: -webkit-transform 600ms ease-in-out;
    transition: -webkit-transform 600ms ease-in-out;
    -o-transition: transform 600ms ease-in-out;
    transition: transform 600ms ease-in-out;
    transition: transform 600ms ease-in-out, -webkit-transform 600ms ease-in-out;
}

.proizvod-btn-sekundarni {
	font-family: 'Outfit', sans-serif;
	font-weight: 500;
	font-size: 16px;
	line-height: 1.25;
	letter-spacing: 0.039em;
	color: #021C2F;
	background-color: transparent;
	border: 1px solid #021C2F;
	border-radius: 200px;
	padding: 14px 28px;
	height: 63px;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	text-decoration: none;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}

.proizvod-btn-sekundarni:hover {
	color: #89BEF4;
	border-color: #89BEF4;
}

.proizvod-slika-desna {
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	width: 515px;
	height: 378px;
	border-radius: 10px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	background-color: #D9D9D9;
	-ms-flex-item-align: center;
	    align-self: center;
	max-width: 515px;
	padding: 0px !important;
}

.proizvod-kartica:nth-child(2) .proizvod-slika-desna {
	background-position: bottom;
}

/* Proizvodi responsive */


/* ── Proizvodi Section end ── */

/* ── Koraci Section ── */
#dd-koraci {
	background-color: #EDE6E1;
	background-image: url('/wp-content/uploads/2026/04/kako-izgleda-proces-ugradnjeWEBP-1.webp');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	padding: 122px 76px;
}

.koraci-kontejner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	gap: 60px;
}

.proces-titel-sub {
	width: 28%;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 16px;
}

.koraci-title {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 44px;
	line-height: 1.22;
	color: #021C2F;
	margin: 0;
}

.koraci-sub {
	font-family: 'Outfit', sans-serif;
	font-weight: 300;
	font-size: 16px;
	line-height: 1.75;
	letter-spacing: 0.005em;
	color: #021C2F;
	margin: 0;
}

.koraci-desni-blok {
	width: 58.1%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	gap: 24px;
}

.koraci-item {
	width: calc(50% - 12px);
	background-color: #fff;
	border-radius: 20px;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

.koraci-content {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 100px;
	padding: 38px 36px;
}

.koraci-cont-top {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
}

.icon-image {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.icon-image img {
	width: 58px;
	height: 58px;
	display: block;
}

.koraci-number {
	width: 67px;
	height: 67px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

.koraci-number img {
	width: 67px;
	height: 67px;
	display: block;
}

.koraci-text {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 8px;
}

.koraci-item-title {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 28px;
	line-height: 42px;
	color: #021C2F;
	margin: 0;
}

.koraci-item-desc {
	font-family: 'Outfit', sans-serif;
	font-weight: 300;
	font-size: 15px;
	line-height: 1.6;
	letter-spacing: 0.005em;
	color: #021C2F;
	margin: 0;
}

.koraci-arrows-holder {
	display: none;
}

/* Koraci responsive */


/* ── Koraci Section end ── */

/* ── Plutajuci Tekst Dva (Second Marquee) Section ── */
#dd-plutajuci-tekst-dva {
	background-color: #fff;
	overflow: hidden;
	padding: 52px 0 70px;
	width: 100%;
}

.plutajuci-traka-dva {
	-webkit-animation-duration: 50s;
	        animation-duration: 50s;
	gap: 40px;
}

.plutajuci-sadrzaj-dva {
	gap: 40px;
	padding-right: 40px;
}


/* ── Plutajuci Tekst Dva end ── */

/* ── Baner Sekcija ── */
#dd-baner-sekcija {
	background-color: #F6F7F8;
	padding: 96px 76px;
}

.baner-kontejner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 48px;
	-webkit-box-align: stretch;
	    -ms-flex-align: stretch;
	        align-items: stretch;
}

.baner-slika {
	-webkit-box-flex: 1;
	    -ms-flex: 1;
	        flex: 1;
	border-radius: 20px;
	min-height: 541px;
	position: relative;
	overflow: hidden;
}

.baner-slika-bg {
	position: relative;
	inset: 0;
	width: 100%;
	height: 100%;
	background-color: #4C3F36;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	border-radius: 20px;
}

.baner-desni-blok {
	-webkit-box-flex: 1;
	    -ms-flex: 1;
	        flex: 1;
	background-color: #fff;
	border-radius: 20px;
	padding: 46px 58px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
}

.baner-elementi {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	height: 100%;
}

.banner-naslov {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.baner-h2 {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 44px;
	line-height: 1.22;
	color: #021C2F;
	margin: 0;
	max-width: 580px;
}

.baner-dugme {
	font-family: 'Outfit', sans-serif;
	font-weight: 500;
	font-size: 16px;
	line-height: 1.25;
	letter-spacing: 0.039em;
	color: #021C2F;
	background-color: #DFEFFF;
	border: 1px solid #fff;
	border-radius: 200px;
	padding: 14px 9px 14px 28px;
	height: 63px;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 12px;
	text-decoration: none;
	-ms-flex-item-align: start;
	    align-self: flex-start;
	-webkit-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}

.baner-dugme:hover {
	color: #021C2F;
	border-color: #fff;
	background-color: #BFDFFF;
}

.baner-dugme:hover .baner-dugme-ikona {
	-webkit-transform: rotate(90deg);
	    -ms-transform: rotate(90deg);
	        transform: rotate(90deg);
}

.baner-dugme-ikona {
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background-color: #89BEF4;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	-webkit-transition: -webkit-transform 600ms ease-in-out;
	transition: -webkit-transform 600ms ease-in-out;
	-o-transition: transform 600ms ease-in-out;
	transition: transform 600ms ease-in-out;
	transition: transform 600ms ease-in-out, -webkit-transform 600ms ease-in-out;
}

/* Baner Sekcija responsive */


/* ── Baner Sekcija end ── */

/* ── Instalacija Sekcija ── */
#dd-instalacija-sekcija {
	background-color: #F7FDFF;
	padding: 120px 0 0;
}

.instalacija-kontejner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: stretch;
	    -ms-flex-align: stretch;
	        align-items: stretch;
}

.instalacija-levi-blok {
	padding: 0 69px;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 40px;
}

.instalacija-content-top {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 30px;
}

.instalacija-content-text {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 20px;
}

.instalacija-naslov-podnaslov {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 14px;
}

.instalacija-naslov {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 45px;
	line-height: 1.2;
	color: #021C2F;
	margin: 0;
}

.instalacija-paragraf {
	font-family: 'Outfit', sans-serif;
	font-weight: 300;
	font-size: 16px;
	line-height: 1.625;
	letter-spacing: 0.005em;
	color: #021C2F;
	margin: 0;
}

.instalacija-list {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 10px;
}

.instalacija-list-item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	gap: 10px;
	align-content: flex-start;
}

.instalacija-checker {
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	width: 22px;
	height: 22px;
	display: block;
	margin-top: 3px;
}

.instalacija-list-tekst {
	font-family: 'Outfit', sans-serif;
	font-weight: 500;
	font-size: 16px;
	line-height: 1.75;
	letter-spacing: 0.01em;
	color: #021C2F;
}

.instalacija-logs {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 16px;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
}

.instalacija-logs-link {
	display: block;
	text-decoration: none;
}

.instalacija-logs-img {
	display: block;
	height: 40px;
	width: auto;
	-webkit-transition: -webkit-filter 0.2s ease;
	transition: -webkit-filter 0.2s ease;
	transition: filter 0.2s ease;
	transition: filter 0.2s ease, -webkit-filter 0.2s ease;
}

.instalacija-logs-link:hover .instalacija-logs-img {
	-webkit-filter: brightness(.5);
	        filter: brightness(.5);
}

.instalacija-video {
    background-color: #4C3F36;
    border-radius: 21px;
    padding-bottom: 49%;
    position: relative;
    width: 100%;
    overflow: hidden;
    height: auto;
    margin-bottom: 110px;
    aspect-ratio: 16/9;
}

.instalacija-video iframe {
	display: block;
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	-webkit-transform: scale(1.02);
	        transform: scale(1.02);
	z-index: 1;
	pointer-events: auto;
	transform-origin: center center;
	-webkit-transform-origin: center center;
}

.instalacija-desni-blok {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

.instalacija-desni-blok.col-xs-12.col-md-6 {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: end;
	    -ms-flex-align: end;
	        align-items: flex-end;
}

.instalacija-slika {
    display: block;
    width: auto;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: bottom right;
    object-position: bottom right;
}

/* Instalacija responsive */


/* ── Instalacija Sekcija end ── */

/* ── Klijenti Sekcija ── */
#dd-klijenti {
	background-color: #fff;
	padding: 184px 76px;
}

.klijenti-kontejner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 60px;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
}

.klijenti-naslov-wrap {
	text-align: center;
	max-width: 708px;
}

.klijenti-naslov {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 44px;
	line-height: 1.22;
	color: #021C2F;
	margin: 0;
	text-align: center;
max-width: 550px;
}

.klijenti-logoi {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 80px;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
}

.klijent-logo-item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	max-width: 175px;
	height: 75px;
}

.klijent-logo-slika {
	max-width: 175px;
	max-height: 75px;
	-o-object-fit: contain;
	   object-fit: contain;
	display: block;
}

/* Klijenti responsive */


/* ── Klijenti Sekcija end ── */

/* ── FAQ Sekcija ── */
#dd-faq {
	background-color: #F6F7F8;
	padding: 143px 76px;
}

.faq-kontejner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 0;
	-webkit-box-align: stretch;
	    -ms-flex-align: stretch;
	        align-items: stretch;
}

.faq-left-image {
	-webkit-box-flex: 1;
	    -ms-flex: 1;
	        flex: 1;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-transition: all 380ms cubic-bezier(0.22, 1, 0.36, 1);
	-o-transition: all 380ms cubic-bezier(0.22, 1, 0.36, 1);
	transition: all 380ms cubic-bezier(0.22, 1, 0.36, 1);
}

.faq-left-image.col-xs-12.col-md-6 {
	padding-left: 0px;
}

.faq-left-image-bg {
	width: 100%;
	height: 100%;
	min-height: 100%;
	background-image: url('/wp-content/uploads/2026/04/faq-image-WEBP.webp');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 20px;
	overflow: hidden;
	display: block;
	-webkit-transition: all 380ms cubic-bezier(0.22, 1, 0.36, 1);
	-o-transition: all 380ms cubic-bezier(0.22, 1, 0.36, 1);
	transition: all 380ms cubic-bezier(0.22, 1, 0.36, 1);
	will-change: height;
}


.faq-blok {
	-webkit-box-flex: 1;
	    -ms-flex: 1;
	        flex: 1;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.faq-blok.col-xs-12.col-md-6 {
	padding-right: 0px;
}

.faq-blok-inner {
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	gap: 41px;
}

.faq-title-wrap {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.faq-naslov {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 44px;
	line-height: 1.22;
	color: #021C2F;
	margin: 0;
}

.faq-accordion {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
}

.faq-divider {
	height: 1px;
	background-color: #B2C0C9;
	width: 100%;
}

.faq-item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
}

.faq-question {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	gap: 16px;
	padding: 22px 0;
	background: none;
	border: none;
	cursor: pointer;
	width: 100%;
	text-align: left;
}

.faq-question-text {
	font-family: 'Outfit', sans-serif;
	font-weight: 500;
	font-size: 22px;
	line-height: 1.3;
	color: #021C2F;
	-webkit-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}

.faq-question:hover .faq-question-text {
	color: #89BEF4;
}

.faq-arrow {
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-transition: -webkit-transform 0.3s ease;
	        transition: transform 600ms ease-in-out;
}

.faq-arrow svg path {
	-webkit-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}

.faq-question:hover .faq-arrow svg path {
	stroke: #89BEF4;
}

.faq-item.active .faq-arrow {
	-webkit-transform: rotate(180deg);
	        transform: rotate(180deg);
}

.faq-answer {
	overflow: hidden;
	max-height: 0;
	opacity: 0;
	padding: 0;
	-webkit-transition: max-height 380ms cubic-bezier(0.22, 1, 0.36, 1), opacity 240ms ease, padding 240ms ease;
	-o-transition: max-height 380ms cubic-bezier(0.22, 1, 0.36, 1), opacity 240ms ease, padding 240ms ease;
	transition: max-height 380ms cubic-bezier(0.22, 1, 0.36, 1), opacity 240ms ease, padding 240ms ease;
	will-change: max-height, opacity;
}

.faq-item.active .faq-answer {
	opacity: 1;
	padding-bottom: 22px;
}

.faq-answer p {
	font-family: 'Outfit', sans-serif;
	font-weight: 300;
	font-size: 16px;
	line-height: 1.75;
	letter-spacing: 0.02em;
	color: #021C2F;
	margin: 0;
	max-width: 789px;
padding-bottom: 20px;
}

/* FAQ responsive */


/* ── FAQ Sekcija end ── */

/* ── Baner Sekcija Dva ── */
#dd-baner-sekcija-dva {
	padding: 360px 76px 82px;
	background-color: #4C3F36;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	float: left;
	width: 100%;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

.baner-blok {
	width: 553px;
	background-color: #fff;
	border-radius: 20px;
	padding: 59px 30px 59px 49px;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

.baner-blok .baner-elementi {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
}

.baner-naslov {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 44px;
	line-height: 1.22;
	color: #021C2F;
	margin: 0px 0 26px;
}

.baner-paragraf {
	font-family: 'Outfit', sans-serif;
	font-weight: 300;
	font-size: 16px;
	line-height: 1.75;
	letter-spacing: 0.005em;
	color: #021C2F;
	margin: 0 0 38px;
}


.baner-blok .baner-dugme {
	font-family: 'Outfit', sans-serif;
	font-weight: 500;
	font-size: 16px;
	line-height: 1.25;
	letter-spacing: 0.039em;
	color: #021C2F;
	background-color: #DFEFFF;
	border: 1px solid #DFEFFF;
	border-radius: 200px;
	padding: 14px 9px 14px 28px;
	height: 63px;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	gap: 12px;
	text-decoration: none;
	-ms-flex-item-align: start;
	    align-self: flex-start;
}

.baner-blok .baner-dugme:hover {
	color: #021C2F;
	border-color: #fff;
	background-color: #BFDFFF;
}

.baner-blok .baner-dugme:hover .baner-dugme-ikona {
	-webkit-transform: rotate(90deg);
	    -ms-transform: rotate(90deg);
	        transform: rotate(90deg);
}

.baner-dugme-tekst {
	display: inline;
}

.baner-dugme-ikona {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

/* Baner Sekcija Dva responsive */


/* ── Baner Sekcija Dva end ── */

/* Blog */
#dd-blog {
	padding: 0px 76px 220px;
}
.blog-kontejner {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
}
.blog-naslov {
	-webkit-box-flex: 0;
	    -ms-flex: 0 0 auto;
	        flex: 0 0 auto;
	width: 33%;
	padding-right: 110px;
}
.blog-heading {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 44px;
	line-height: 1.23em;
	color: #021C2F;
	margin: 0;
}
.blog-post-blok {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-flex: 1;
	    -ms-flex: 1 1 auto;
	        flex: 1 1 auto;
	max-width: 1200px;
}
.blog-post {
	-webkit-box-flex: 0;
	    -ms-flex: 0 0 calc(50% - 15px);
	        flex: 0 0 calc(50% - 15px);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
}
.blog-post:first-child {
	margin-right: 15px;
}
.blog-post:nth-child(2) {
	margin-left: 15px;
}
.blog-post-slika-wrap {
	position: relative;
	border-radius: 20px;
	overflow: visible;
	margin-bottom: 37px;
}
.blog-post-slika-link {
	position: absolute;
	inset: 0;
	border-radius: 20px;
	z-index: 1;
}
.blog-post-slika {
	display: block;
	width: 100%;
	height: 350px;
	-o-object-fit: cover;
	   object-fit: cover;
	border-radius: 20px;
}
.blog-post-plus-btn {
	position: absolute;
	right: 37px;
	top: unset;
	bottom: -30px;
	width: 63px;
	height: 63px;
	border-radius: 50%;
	background-color: #89BEF4;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	text-decoration: none;
	-webkit-transition: all 600ms ease-in-out;
	-o-transition: all 600ms ease-in-out;
	   transition: all 600ms ease-in-out;
	z-index: 2;
}
.blog-post-plus-btn:hover,
.blog-post:hover .blog-post-plus-btn {
	background-color: #6aaee6;
	-webkit-transform: rotate(90deg);
	    -ms-transform: rotate(90deg);
	        transform: rotate(90deg);
}
.blog-post-info {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
}
.blog-post-datum {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 1.25em;
	color: #021C2F;
	margin: 0 0 14px;
}
.blog-post-naslov {
	font-family: 'Outfit', sans-serif;
	font-weight: 400;
	font-size: 28px;
	line-height: 1.29em;
	color: #021C2F;
	margin: 0;
}
.blog-post-naslov a {
	color: #021C2F;
	text-decoration: none;
	width: 100%;
	display: flex;
	transition: color 300ms ease-in-out;
}
.blog-post-naslov a:hover {
	color: #89BEF4;
}

/* Blog responsive */


/* ── Blog end ── */

/* Instalacija Sekcija */
#dd-instalacija-sekcija {
	background-color: #F7FDFF;
	background-image: url('/wp-content/uploads/2026/04/Aplication-background-WEBP.webp');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	padding: 120px 76px 0;
}


/* ── Instalacija Sekcija end ── */

/* Form */
.dd-form-wrap .gform_required_legend,
.dd-form-wrap .gform_wrapper.gravity-theme .gfield_required {
	display: none;
}
.dd-form-wrap .gform_wrapper.gravity-theme .ginput_container_date input {
	width: 100%;
}

/* ?? MEDIA ?? */
@media screen and (max-width: 1930px) {
.instalacija-video {
		max-width: 679px;
	}
}

@media screen and (max-width: 1500px) {
#dd-hero {
    padding: 230px 76px 60px;
    min-height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
	.hero-inner {
		-webkit-box-flex: 1;
		    -ms-flex: 1;
		        flex: 1;
	}
	.hero-left-block {
		gap: 8px;
		max-width: 579px;
		height: 100%;
		-webkit-box-pack: end;
		    -ms-flex-pack: end;
		        justify-content: flex-end;
	}
.hero-wifi-badge {
    bottom: 229px;
}
.hero-popust-baner {
    right: 78px;
    bottom: 60px;
}
	.hero-title {
		font-size: 53px;
		line-height: 62px;
		max-width: 450px;
	}
	.hero-subtitle {
		font-size: 18px;
		line-height: 30px;
		letter-spacing: 0.54px;
		margin: 0 0 10px;
	}
	.hero-cta-btn {
		height: 64px;
	}
	.blok-01 .levi-blok {
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
		min-height: 444px;
	}
	.rekuperacija-naslov-podnaslov {
		padding: 80px 0;
	}
#dd-kako-funkcionise .mask-group {
    min-height: 434px;
}

.sta-dobijate-naslov {
		font-size: 36px;
		line-height: 50px;
	}
	.slider-nav-btn {
		width: 58px;
		height: 58px;
	}
	.proizvodi-naslov {
		font-size: 36px;
		line-height: 44px;
		max-width: 470px;
	}
	.proizvodi-lista {
		gap: 27px;
	}
	.baner-h2 {
		font-size: 36px;
		line-height: 44px;
	}
	.baner-slika {
		min-height: 433px;
	}
	.instalacija-naslov {
		font-size: 36px;
		max-width: 400px;
		line-height: 44px;
	}
.klijenti-naslov {
    font-size: 36px;
    max-width: 490px;
    line-height: 44px;
}
	.faq-question-text {
		font-size: 18px;
		line-height: 30px;
	}
	.baner-naslov {
    font-size: 36px;
    line-height: 44px;
    margin-bottom: 17px;
}
	.blog-heading {
		font-size: 36px;
		line-height: 44px;
	}
	.blog-post-naslov {
		font-size: 22px;
		line-height: 31px;
	}
	.blog-post-slika-wrap {
		margin-bottom: 31px;
	}
	.blog-post-slika {
		height: 256px;
	}

#dd-prva-sekcija {
		padding: 109px 76px 66px;
	}
	.postotak {
		font-size: 52px;
	}
	.prva-sekcija-naslov {
		font-size: 36px;
	}
	#dd-prva-sekcija .gif-blok--prvi {
		padding: 30px 30px;
		margin-right: 10px;
	}
	#dd-prva-sekcija .gif-blok--drugi {
		padding: 30px 30px;
		margin-left: 10px;
	}

#dd-plutajuci-tekst {
		padding: 0px 0 70px;
	}
	.plutajuci-procenat,
	.plutajuci-opis {
		font-size: 78px;
		line-height: 106px;
	}
	.plutajuci-slika-wrap {
		width: 103px;
		height: 98px;
	}
	.plutajuci-deo {
		gap: 15px;
	}
	.plutajuci-sadrzaj-dva {
		gap: 20px;
		padding-right: 20px;
	}

#dd-kako-funkcionise {
		padding: 116px 76px 103px;
	}
	.kako-funkcionise-sekcija {
		gap: 104px;
	}
	.kako-naslov {
		font-size: 36px;
	}
	.rekuperacija-desni-blok {
		padding: 80px 80px;
	}

#dd-sta-dobijate {
		background-color: #fff;
		padding: 119px 0 116px 76px;
	}
	.slide-img-wrap {
		height: 346px;
	}
	.slide-card-text {
		bottom: 32px;
		max-width: 158px;
		font-size: 22px;
		letter-spacing: 0.5px;
	}
	.sta-dobijate-levi {
		gap: 188px;
	}
	.sta-dobijate-desni {
		max-width: 60%;
	}

#dd-proizvodi {
		padding: 120px 76px 133px;
	}
	.proizvod-unutrasnjost {
		padding: 39px 35px;
	}
	.proizvodi-stat-broj {
		font-size: 70px;
	}

#dd-koraci {
		padding: 144px 76px 104px;
	}
	.koraci-desni-blok {
		width: 63.1%;
	}
	.koraci-item-title {
		font-size: 26px;
	}
	.koraci-text {
		gap: 18px;
	}
	.koraci-content {
		padding: 34px 33px;
	}

#dd-plutajuci-tekst-dva {
    padding: 72px 0 90px;
}

#dd-baner-sekcija {
		padding: 80px 76px;
	}

#dd-klijenti {
    background-color: #fff;
    padding: 105px 76px 110px;
}

#dd-faq {
		padding: 95px 76px 111px;
	}
	.faq-naslov {
		font-size: 36px;
	}

#dd-baner-sekcija-dva {
		padding: 263px 76px 86px;
	}
.baner-blok {
    width: 496px;
    padding: 43px 30px 44px 49px;
}
.baner-paragraf {
    margin: 0 0 23px;
}

#dd-blog {
		padding: 0px 76px 88px;
	}

.instalacija-slika {
		height: 100%;
		-o-object-fit: cover;
		   object-fit: cover;
		-o-object-position: bottom left;
		   object-position: bottom left;
	}

	.instalacija-desni-blok.col-xs-12.col-md-6 {
		padding-right: 0px;
	}

	#dd-instalacija-sekcija {
		padding-right: 0px;
		padding-top: 86px;
	}

	.instalacija-video {
		margin-bottom: 80px;
	}
.plutajuci-traka-dva {
    gap: 20px;
}
}

@media screen and (max-width: 1499px) {
.faq-left-image-bg {
		background-image: url('/wp-content/uploads/2026/04/Cesto-postavljena-pitanja-WEBP.webp');
	}
}

@media screen and (max-width: 1400px) {
.proizvod-opis br {
		display: none;
	}
	.koraci-title {
		font-size: 36px;
	}
}

@media screen and (max-width: 1300px) {
.instalacija-slika {
		-o-object-position: bottom center;
		   object-position: bottom center;
	}
}

@media screen and (max-width: 1200px) {
#dd-hero {
    padding: 247px 40px 87px;
    height: 100%;
    min-height: 0;
    display: block;
}
	.hero-inner {
		-webkit-box-flex: 0;
		    -ms-flex: 0;
		        flex: 0;
	}
	.hero-left-block {
		height: auto;
		-webkit-box-pack: start;
		    -ms-flex-pack: start;
		        justify-content: flex-start;
	}
.hero-wifi-badge {
    bottom: 235px;
    right: 40px;
}
.hero-popust-baner {
    right: 40px;
    bottom: 88px;
    padding: 16px;
    max-width: 274px;
}
.popust-baner-tekst {
    font-size: 16px;
    line-height: 24px;
}


	.hero-title {
		font-size: 50px;
		line-height: 60px;
		max-width: 450px;
	}

#dd-prva-sekcija {
		padding: 80px 40px;
	}
	

#dd-plutajuci-tekst {
		padding: 0px 0 70px;
	}

	.plutajuci-slika-wrap {
		width: 95px;
		height: 100px;
	}

#dd-kako-funkcionise {
		padding: 90px 40px;
	}
	.kako-naslov {

		max-width: 380px;
	}
	.rekuperacija-desni-blok {
		padding: 60px 60px;
	}

#dd-sta-dobijate {
		padding: 80px 0 80px 40px;
	}
	.sta-dobijate-levi {
		width: 350px;
		gap: 130px;
	}

	.slide-img-wrap {
		height: 334px;
	}

#dd-proizvodi {
		padding: 80px 40px;
	}
	.proizvod-h3 br {
		display: none;
	}
	.proizvod-unutrasnjost {
		gap: 30px;
		padding: 36px 36px;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
	}
	.proizvod-unutrasnjost .proizvod-slika-wrap {
		width: 100%;
		max-width: 700px;
	}
	.proizvod-unutrasnjost .proizvod-slika-desna {
		width: 100%;
		aspect-ratio: 16 / 13;
		height: unset;
		max-width: 100%;
	}
	.proizvod-unutrasnjost .proizvod-sadrzaj {
		width: 100%;
		max-width: 630px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: start;
		    -ms-flex-align: start;
		        align-items: flex-start;
	}


#dd-plutajuci-tekst-dva {
    padding: 56px 0 70px;
}

#dd-baner-sekcija {
		padding: 80px 40px;
	}



	.instalacija-levi-blok {
		padding: 0 50px;
	}

#dd-klijenti {
		padding: 100px 40px;
	}




#dd-blog {
		padding: 0px 40px 78px;
	}
	.blog-naslov {
		padding-right: 50px;
	}

#dd-instalacija-sekcija {
		padding: 120px 0 0 40px;
	}

	.instalacija-list {
		gap: 5px;
	}

	.instalacija-content-top {
		gap: 20px;
	}

	#dd-instalacija-sekcija .instalacija-levi-blok {
		padding: 0 25px 0 0;
	}

	.instalacija-slika {
		-o-object-fit: contain;
		   object-fit: contain;
	}
#dd-kako-funkcionise .mask-group {
    min-height: 94px;
}
}

@media screen and (max-width: 1199px) {
#dd-koraci {
		padding: 90px 40px;
	}
	.koraci-content {
		padding: 30px 28px;
	}


.blog-naslov {
		width: 340px;
	}

	.blog-post-naslov {
		font-size: 22px;
	}

	#dd-baner-sekcija-dva {
		padding: 300px 40px 70px;
	}
}


@media screen and (max-width: 1100px) {
.proizvod-dugmici {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: start;
		    -ms-flex-align: start;
		        align-items: flex-start;
		gap: 16px;
	}
}

@media screen and (max-width: 992px) {
.baner-kontejner {
		-webkit-box-orient: vertical;
		-webkit-box-direction: reverse;
		    -ms-flex-direction: column-reverse;
		        flex-direction: column-reverse;
		gap: 32px;
	}
	.baner-slika {
		min-height: 300px;
	}
	.baner-desni-blok {
		padding: 40px 40px;
	}
	.baner-elementi {
		min-height: unset;
	}


#dd-instalacija-sekcija {
		padding: 80px 0 0;
	}
	.instalacija-kontejner {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
	}

#dd-klijenti {
		padding: 80px 40px;
	}
	.klijenti-naslov {
		font-size: 36px;
	}
	.klijenti-logoi {
		gap: 40px;
	}
	.klijent-logo-item {
		max-width: 50%;
		width: 31%;
		height: 75px;
	}

#dd-faq {
		padding: 90px 40px;
	}
	.faq-kontejner {
		-webkit-box-orient: vertical;
		-webkit-box-direction: reverse;
		    -ms-flex-direction: column-reverse;
		        flex-direction: column-reverse;
	}
	.faq-left-image {
		width: 100%;
	}
	.faq-left-image.col-xs-12.col-md-6 {
		padding-right: 0px;
	}
	.faq-blok.col-xs-12.col-md-6 {
		padding: 0 0 30px;
	}
	.faq-left-image-bg {
		min-height: 440px;
		background-image: url('/wp-content/uploads/2026/04/faq-image-WEBP.webp');
	}

	.hero-popust-baner{
display:none;
}
.hero-wifi-badge {
    bottom: 85px;
    right: 40px;
}

}

@media screen and (max-width: 991px) {
.prva-sekcija-kontejner {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
		-ms-flex-wrap: wrap;
		    flex-wrap: wrap;
		gap: 0;
	}
	#dd-instalacija-sekcija .instalacija-levi-blok {
		padding: 0 0 0 0;
	}
	.levi-blok {
		margin: 0 0 30px;
		padding: 0;
	}
	#dd-prva-sekcija .prva-sekcija-levi-okvir {
		width: 100%;
	}
	.prva-sekcija-naslov {
		font-size: 36px;
		max-width: 680px;
	}
	.prva-sekcija-paragraf {
		max-width: 673px;
	}
	.desni-blokovi {
		width: 100%;
	}
	#dd-prva-sekcija .gif-blok--prvi {
		padding: 40px 30px 210px;
	}
	#dd-prva-sekcija .gif-blok--drugi {
		padding: 40px 30px 210px;
	}
	.naslov-podnaslov {
		gap: 21px;
	}
	.naslov-podnaslov-kako {
		gap: 26px;
	}

.blok-01 .levi-blok,
	.mask-group,
	.rekuperacija-desni-blok {
		min-height: 420px;
	}
	#dd-kako-funkcionise .mask-group {
		min-height: unset;
	}
	.blok-01 .levi-blok {
		min-height: unset;
		padding: 0;
		width: 100%;
		-webkit-box-align: start;
		    -ms-flex-align: start;
		        align-items: flex-start;
	}
	.mask-group.mask-group--01.col-12.col-sm-6 {
		padding: 0;
		width: 100%;
	}
	.mask-group.mask-group--02.col-12.col-sm-6 {
		padding: 0;
		width: 100%;
	}
	.mask-bg-div {
		height: 100%;
		min-height: 460px;
	}
	.blok-01,
	.blok-02 {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
	}
	.blok-02.blok-2-wrap {
		-webkit-box-orient: vertical;
		-webkit-box-direction: reverse;
		    -ms-flex-direction: column-reverse;
		        flex-direction: column-reverse;
	}
	.rekuperacija-desni-blok.col-12.col-sm-6 {
		padding: 0;
		width: 100%;
	}
	.rekuperacija-naslov-podnaslov {
		gap: 26px;
		padding: 0 0 30px;
	}
	.kako-funkcionise-sekcija {
		gap: 60px;
	}
	.kako-naslov {
		max-width: 100%;
	}
	h2.kako-naslov br {
		display: none;
	}

#dd-sta-dobijate {
		padding: 80px 0 80px 20px;
	}
	.sta-dobijate-kontejner {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
		-webkit-box-pack: start;
		    -ms-flex-pack: start;
		        justify-content: flex-start;
		gap: 36px;
	}
	/* Title → slider → nav: hoist children with display:contents + flex order */
	.sta-dobijate-levi {
		display: contents;
	}
	.sta-dobijate-naslov {
		-webkit-box-ordinal-group: 2;
		    -ms-flex-order: 1;
		        order: 1;
		width: 100%;
		padding: 0 40px 0 0;
	}
	.sta-dobijate-desni {
		-webkit-box-ordinal-group: 3;
		    -ms-flex-order: 2;
		        order: 2;
		width: 100%;
		max-width: 100%;
		overflow: hidden;
	}
	.navigacija-wrap {
		-webkit-box-ordinal-group: 4;
		    -ms-flex-order: 3;
		        order: 3;
		width: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 12px;
	}
	.slide-blok-slider .slick-list {
		overflow: hidden !important;
		padding-right: 0;
		margin-left: 0;
	}
	/* variableWidth: gutter via margin-right (width set in custom.js) */
	#dd-sta-dobijate .slide-blok-slider .slide-item {
		padding-right: 0;
	}
	.slide-img-wrap {
		height: 380px;
	}

.proizvod-unutrasnjost {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
		gap: 50px;
	}
	.proizvodi-kontejner {
		gap: 45px;
	}
	.proizvod-naslov-podnaslov {
		gap: 16px;
	}
	.proizvod-info {
		gap: 16px;
	}
	.proizvod-sadrzaj {
		gap: 20px;
	}
	.proizvodi-lista {
		gap: 45px;
	}
	.proizvod-slika-wrap {
		width: 100%;
		height: auto;
		min-height: 280px;
	}
	.proizvod-unutrasnjost .proizvod-sadrzaj {
		width: 100%;
		max-width: 100%;
	}
	.proizvodi-zaglavlje {
		gap: 20px;
	}
	.proizvodi-stat {
		-webkit-box-align: flex-start;
		    -ms-flex-align: flex-start;
		        align-items: flex-start;
	}

.koraci-kontejner {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
		gap: 28px;
	}
	.proces-titel-sub {
		width: 100%;
		gap: 21px;
	}
	.koraci-desni-blok {
		width: 100%;
	}
	.klijenti-kontejner {
		gap: 44px;
	}
	.faq-blok-inner {
		gap: 38px;
	}
	.faq-blok.col-xs-12.col-md-6 {
		padding: 0 0 50px;
	}

.baner-h2 {
		margin: 0 0 181px;
	}
	.baner-elementi {
		gap: 0px;
	}

#dd-baner-sekcija-dva {
		padding: 500px 40px 50px;
		background-position-x: -460px;
		-webkit-box-pack: start;
		    -ms-flex-pack: start;
		        justify-content: flex-start;
	}
	.baner-blok {
		width: 100%;
	}
	.baner-naslov {
		margin-bottom: 20px;
	}
	.baner-paragraf {
		margin: 0 0 30px;
	}
	#dd-plutajuci-tekst-dva {
		padding: 60px 0;
	}

.blog-kontejner {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
	}
	.blog-naslov {
		width: 100%;
		padding-right: 0;
		margin-bottom: 44px;
	}
	.blog-post-blok {
		width: 100%;
	}

#dd-instalacija-sekcija {
		padding: 86px 40px 0;
	}
	.instalacija-content-text {
		gap: 28px;
	}

	.instalacija-video {
		max-width: 100%;
		margin-bottom: 70px;
	}
.instalacija-desni-blok.col-xs-12.col-md-6 {
    justify-content: center;
}
.popust-baner-tekst {
    font-size: 14px;
    line-height: 24px;
    text-align: center;
    width: 100%;
}
p.popust-baner-tekst br {
    display: none;
}
}

@media screen and (max-width: 768px) {
#dd-hero {
		padding: 419px 20px 70px;
	}
	.hero-wifi-badge {
		position: static;
		width: 63px;
		height: 63px;
		margin-bottom: 52px;
	}
	.hero-title {
		font-size: 49px;
		line-height: 56px;
		max-width: 414px;
	margin-bottom: 10px;
	}
	.hero-subtitle {
		font-size: 16px;
		line-height: 26px;
		letter-spacing: 0.54px;
		margin: 0 0 20px;
	}

#dd-prva-sekcija {
		padding: 60px 20px 50px;
	}

	.postotak {
		font-size: 60px;
		line-height: 48px;
	}
	.gif-opis {
		font-size: 16px;
		line-height: 26px;
	}
	.gif-blok {
		min-height: 220px;
	}
	.prva-sekcija-levi-okvir {
		margin-bottom: 16px;
	}
	#dd-prva-sekcija .gif-blok--prvi {
		padding: 30px 30px 150px;
	}
	#dd-prva-sekcija .gif-blok--drugi {
		padding: 30px 30px 150px;
	}

#dd-plutajuci-tekst {
		padding: 0px 0 48px;
	}
	.plutajuci-procenat,
	.plutajuci-opis {
		font-size: 62px;
		line-height: 84px;
	}
	.plutajuci-slika-wrap {
		width: 68px;
		height: 70px;
	}

#dd-kako-funkcionise {
		padding: 53px 20px;
	}


#dd-sta-dobijate {
		padding: 57px 0 80px 20px;
	}
	.sta-dobijate-naslov {

		padding: 0 20px 0 0;
	}

#dd-proizvodi {
    padding: 68px 20px 51px;
}
	.proizvod-unutrasnjost {
		padding: 28px 23px;
	}
	.proizvod-unutrasnjost .proizvod-sadrzaj {
		padding: 0px;
	}
	

	.proizvodi-stat-broj {
		font-size: 50px;
	}
	.proizvod-dugmici {
		-ms-flex-wrap: wrap;
		    flex-wrap: wrap;
	}

#dd-plutajuci-tekst-dva {
		padding: 30px 0;
	}

#dd-baner-sekcija {
		padding: 40px 20px 25px;
	}
	.baner-elementi {
		gap: 0;
	}

	.baner-desni-blok {
		padding: 42px 24px;
	}

#dd-instalacija-sekcija {
		padding: 47px 20px 0;
	}
	.instalacija-kontejner {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
	}
	.instalacija-levi-blok {
		padding: 0 20px;
		width: 100%;
	}
	.instalacija-desni-blok {
		width: 100%;
	}
	.instalacija-desni-blok.col-xs-12.col-md-6 {
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
		padding: 0px;
	}
	.instalacija-slika {
		height: 380px;
	}
	.instalacija-naslov {
		max-width: 100%;
	}

#dd-klijenti {
		padding: 57px 20px 80px;
	}
	.klijenti-logoi {
		gap: 30px;
	}

#dd-faq {
		padding: 62px 20px;
	}

	.faq-question {
		padding: 12px 0;
	}
	.faq-question-text {
		font-size: 18px;
	}

.baner-blok {
		padding: 27px 30px 22px 30px;
	}
	.baner-naslov {
		max-width: 482px;
	}

#dd-instalacija-sekcija {
		padding: 47px 20px 0;
	}
}

@media screen and (max-width: 767px) {
	#dd-koraci {
		padding: 93px 20px 106px 20px;
	}
	.proces-titel-sub {
		padding-right: 0;
		gap: 21px;
	}
	.koraci-title {
		padding-right: 15px;
	}
	#dd-koraci .koraci-number {
		width: 67px;
		height: 67px;
	}

.klijent-logo-item {
		width: 41%;
	}

	#dd-baner-sekcija-dva {
		padding: 400px 40px 50px;
		background-position-x: 90%;
	}

#dd-blog {
		padding: 0px 20px 142px;
	}

	.blog-post-blok {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: unset;
		        flex-direction: unset;
		justify-content: space-between;
	}
	.blog-post:first-child {
		margin-right: 0;
		margin-bottom: 0px;
	}
	.blog-post:nth-child(2) {
		margin-left: 0;
	}
	.blog-post-slika {
		height: 254px;
	}
	.blog-post-plus-btn {
		top: 218px;
	}
	.blog-post-naslov {
		font-size: 24px;
		line-height: 34px;
	}
}

@media screen and (max-width: 600px) {
.levi-blok-sadrzaj {
		gap: 30px;
	}

.hero-cta-btn {
		height: 60px;
	}

.checker-tekst {
		font-size: 15px;
		line-height: 1.25;
		margin-bottom: 10px;
	}
.ceker {
		-webkit-box-align: start;
		    -ms-flex-align: start;
		        align-items: flex-start;
	}
.kako-ceker {
		-webkit-box-align: start;
		    -ms-flex-align: start;
		        align-items: flex-start;
	}
.kako-checker-tekst {
		font-size: 15px;
		line-height: 1.25;
		margin-bottom: 10px;
	}
.kako-checker-ikona {
		margin-top: -3px;
	}

.hero-title {
		font-size: 36px;
		line-height: 40px;
		max-width: 364px;
	}

.postotak {
		font-size: 58px;
		line-height: 60px;
	}
.postotak-objasnjenje {
		gap: 10px;
	}
.plutajuci-slika-wrap {
		border-radius: 11px;
	}
.plutajuci-slika-wrap img {
		border-radius: 11px;
	}
.sta-dobijate-kontejner {
		gap: 26px;
	}
.instalacija-list-tekst {
		font-size: 15px;
		line-height: 1.38;
		padding-bottom: 10px;
	}
.instalacija-checker {
		margin-top: -2px;
	}
	.desni-blokovi {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
	}
	#dd-prva-sekcija .gif-blok--prvi {
		margin: 0 0 20px;
	}
	#dd-prva-sekcija .gif-blok--drugi {
		padding: 30px 30px 150px;
		margin: 0;
	}

.mask-bg-div {
		height: 100%;
		min-height: 300px;
	}

.proizvodi-kontejner {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
		gap: 60px;
	}
	.proizvodi-zaglavlje {
		gap: 20px;
		-webkit-box-orient: vertical;
		-webkit-box-direction: reverse;
		    -ms-flex-direction: column-reverse;
		        flex-direction: column-reverse;
	}
	.proizvod-dugmici {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
		width: 100%;
		text-align: center;
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
		position: relative;
	}
	.plutajuci-traka-dva {
		gap: 15px;
	}
	.plutajuci-sadrzaj-dva {
		gap: 15px;
		padding-right: 15px;
	}
	.proizvod-btn-primarni {
		width: 100%;
		text-align: center;
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
	}
.proizvod-btn-ikona {
/*     position: absolute;
    right: 13px; */
    display: none;
}
	.proizvod-btn-sekundarni {
		width: 100%;
		text-align: center;
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
	}

#dd-koraci {
		padding: 46px 0 64px 20px;
		overflow: hidden;
	}
	#dd-koraci .md-slick-this .slick-slide {
		margin: 0 14px 0 0;
	}
	#dd-koraci .md-slick-this .slick-list {
		margin: 0;
	}
	.koraci-arrows-holder {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		gap: 12px;
		width: 100%;
		padding-top: 0;
	}
	.koraci-desni-blok {
		gap: 0;
		width: 100%;
	}
	.koraci-desni-blok.slick-slider .slick-list {
		overflow: hidden;
		padding-right: 22%;
	}
	.koraci-desni-blok.slick-slider .slick-track {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		margin-left: 0;
	}
	.koraci-desni-blok.slick-slider .koraci-item {
		width: auto;
		margin-right: 0;
		padding-right: 0;
		height: auto;
	}
	.koraci-content {
		gap: 84px;
		height: 100%;
		padding: 30px 29px;
	}
	.koraci-item-title {
		font-family: 'Outfit', sans-serif;
		font-weight: 500;
		font-size: 20px;
		line-height: 34px;
		color: #021C2F;
		margin: 0;
	}
	.koraci-text {
		gap: 15px;
	}
	#dd-koraci .slider-nav-btn {
		width: 58px;
		height: 58px;
		border: none;
		background-color: #fff;
	}

	#dd-koraci .slider-nav-btn:hover {
		background-color: #f0f0f0;
		background: #89BEF4;
		color: #fff;
		opacity: 50%;
	}

.faq-left-image-bg {
    background-image: url('/wp-content/uploads/2026/04/Cesto-postavljena-pitanja-WEBP.webp');
    min-height: 300px;
}

	.prva-sekcija-naslov {
		font-size: 28px;
		max-width: 330px;
	}
	.plutajuci-procenat,
	.plutajuci-opis {
		font-size: 50px;
		line-height: 68px;
	}
	.kako-naslov {
		font-size: 28px;
		max-width: 310px;
	}

	.naslov-podnaslov-kako .kako-naslov {
		font-size: 28px;
		max-width: 310px;
	}

	.rekuperacija-naslov-podnaslov .kako-naslov {
		font-size: 28px;
		max-width: 100%;
	}
	.rekuperacija-naslov-podnaslov h2.kako-naslov br {
		display: block;
	}
	.sta-dobijate-naslov {
		font-size: 28px;
		line-height: 36px;
		max-width: 340px;
	}
	.slide-card-text {
		font-size: 18px;
		line-height: 22px;
		max-width: 168px;
	}
	.proizvodi-stat-broj {
		font-size: 71px;
	}
	.proizvodi-naslov {
		font-size: 28px;
		line-height: 36px;
		max-width: 320px;
	}
	.proizvod-h3 {
		font-size: 22px;
		max-width: 260px;
		line-height: 28px;
	}
	.koraci-title {
		font-size: 28px;
		max-width: 370px;
	}
	.koraci-item-title {
		font-size: 20px;
		line-height: 34px;
	}
	.koraci-content {
		gap: 68px;
		height: 100%;
		padding: 24px 24px;
	}
	.koraci-number img {
		width: 54px;
		height: 54px;
	}
	.icon-image img {
		width: 45px;
		height: 45px;
	}
	#dd-baner-sekcija .baner-h2 {
		font-size: 26px;
		line-height: 34px;
		max-width: 380px;
		text-align: center;
	}
	#dd-baner-sekcija .baner-elementi {
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
	}
	#dd-baner-sekcija a.baner-dugme {
		margin-left: auto;
		margin-right: auto;
	}
	.instalacija-naslov {
		font-size: 28px;
		max-width: 340px;
		line-height: 36px;
	}
.klijenti-naslov {
    font-size: 28px;
    line-height: 36px;
    max-width: 330px;
}
	.faq-naslov {
		font-size: 28px;
		line-height: 36px;
	}

	.baner-naslov {
		font-size: 28px;
		line-height: 36px;
		max-width: 250px;
	}
	#dd-blog {
		padding: 0px 20px 70px;
	}
	.blog-heading {
		font-size: 28px;
		line-height: 36px;
		max-width: 290px;
	}
.proizvod-btn-primarni {
    line-height: 100%;
    padding: 10px 28px 14px 28px;

}
}

@media screen and (max-width: 580px) {
.plutajuci-procenat,
	.plutajuci-opis {
		font-size: 49px;
	}
	#dd-plutajuci-tekst {
		padding: 0px 0 48px;
	}
	#dd-prva-sekcija {
		padding: 60px 20px 50px;
	}

#dd-hero {
		padding: 211px 20px 52px;
	}
	.hero-wifi-badge {
		margin-bottom: 32px;
	}
	#dd-prva-sekcija {
		padding: 50px 20px 53px;
	}
	.proizvod-unutrasnjost .proizvod-slika-wrap {
		padding: 0px;
	}
	.proizvodi-lista {
		gap: 28px;
	}
#dd-proizvodi {
    padding: 68px 20px 54px;
}
	#dd-baner-sekcija {
		padding: 40px 20px 30px;
	}
	.baner-h2 {
		margin: 0 0 32px;
	}
	#dd-klijenti {
		padding: 57px 20px 75px;
	}
	#dd-faq {
		padding: 62px 20px 44px;
	}
	#dd-baner-sekcija-dva {
		padding: 234px 20px 27px;
	}
	.plutajuci-procenat,
	.plutajuci-opis {
		font-size: 53px;
		line-height: 72px;
	}
	#dd-plutajuci-tekst-dva {
		padding: 38px 0;
	}
	.blog-naslov {
		margin-bottom: 28px;
	}
	.blog-post-blok {
		-ms-flex-direction: column;
		    flex-direction: column;
		gap: 56px;
	}
	.blog-post-slika {
		height: 244px;
	}
	.blog-post-plus-btn {
		top: 220px;
		height: 49px;
		width: 49px;
	}
	.blog-post-slika-wrap {
		margin-bottom: 17.5px;
	}
	.blog-post-datum {
		line-height: 43px;
		margin: 0 0 5px;
	}
}

@media screen and (max-width: 550px) {
#dd-baner-sekcija-dva {
		background-position-x: 74%;
	}
}

@media screen and (max-width: 500px) {
.klijent-logo-item {
		width: 100%;
	}
	.klijenti-logoi {
		gap: 30px;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
	}

.blog-heading {
		font-size: 28px;
		max-width: 290px;
	}
}

@media screen and (max-width: 480px) {
.plutajuci-slika-wrap {
		width: 50px;
		height: 52px;
	}

.mask-bg-div {
		height: 100%;
		min-height: 250px;
	}
	.rekuperacija-desni-blok {
		padding: 40px 24px;
	}

.slide-img-wrap {
		height: 280px;
	}
	.sta-dobijate-naslov {
		font-size: 28px;
	}

.klijent-logo-item {
		max-width: 120px;
		height: 55px;
	}
}

@media screen and (max-width: 450px) {
.baner-h2 {
		max-width: 263px;
	}
}

@media screen and (max-width: 400px) {
.koraci-desni-blok.slick-slider .slick-list {
		padding-right: 11%;
	}

#dd-baner-sekcija-dva {
		padding: 260px 20px 50px;
	}
	.baner-naslov {
		max-width: 218px;
	}
}

@media screen and (max-width: 379px) {
#dd-hero {
		background-image: url('/wp-content/uploads/2026/04/Mobile_hero_WEBP.webp');
	}
}

@media screen and (max-width: 376px) {
#dd-hero {
		padding: 234px 20px 52px;
	}

	.hero-subtitle {
		font-size: 16px;
	}
	.hero-cta-btn {
		font-size: 16px;
	}
	.hero-cta-icon {
		width: 42px;
		height: 42px;
	}
}