/* -------------------- tag styles --------------------*/
:root {
  /*Colors*/
	--black:#161515;
	--orange:#ff551e;
  --violet: #5f4085;
	--white:#fff;

	--orange-bg: #ff551e;
	--green-bg: #8ec099;
	--lightgreen-bg:#c7e9dd;

    /* Steps Desktop */
    --d-circle: 36px;
    --d-line: 100px;
    --d-tail: 40px;
    
    /* Steps Mobile */
    --m-circle: 15px;
    --m-line: 40px;
    --m-tail: 15px;
}

body {font-family: Epilogue,sans-serif; font-weight:500; font-size:24px; color: var(--black);}
*{transition: font-size 0.2s ease-in-out;}
html,body{margin:0;padding:0;height:100%;border:none;}
table {border-spacing: 0px; border-collapse: collapse;}
td {vertical-align: top; padding:0px;}
img {border: 0px;}
form{margin:0px; padding:0px;}

h1, h2, h3, h4, h5, h6 {margin: 0px; font-weight:bold;}
p{margin:0; padding:0 0 30px 0;}
a:focus,input:focus {outline: none;}

/* -------------------- standard styles --------------------*/
.b {font-weight: bold;}
.i {font-style: italic;}

.tr{text-align:right;}
.tl{text-align:left;}
.tc{text-align:center;}

.pa {position: absolute;}
.pr {position: relative;}

.fl {float: left;}
.fr {float: right;}
.cl {clear: left;}
.cr {clear: right;}

.ls25 {letter-spacing: 0.025em;}

section,article,nav,header,footer{display:block;}

.no-gutter{
    padding-right:0;
	padding-left:0;
}
.row.no-gutter{
	margin-right:0;
	margin-left:0;
}
.no-gutter-left {
    padding-left:0;
}
.no-gutter-right {
    padding-right:0;
}

/* -------------------------------------------------------------------------------------------*/
.fai:before{font-family: "Font Awesome 6 Free"; font-weight:bold; font-size:20px; font-style:normal; font-variant:normal; text-rendering:auto; -webkit-font-smoothing:antialiased; transition:all 0.8s ease 0s; transform:translate(0px,0px);}
.fai:after{font-family: "Font Awesome 6 Free"; font-weight:bold; font-size:20px; font-style:normal; font-variant:normal; text-rendering:auto; -webkit-font-smoothing:antialiased; transition:all 0.8s ease 0s; transform:translate(0px,0px);}

p.intro{font-weight:bold; font-size:36px; line-height:46px;}

/*BANNER*/
section.banner{margin-top:30px; height:auto;}
section.banner .container {width:1740px; max-width:1740px; height:auto; margin:0 auto; background-image:linear-gradient(to top right, #e2f3ee, #faf9f6, #e2e0f6);  padding-bottom:60px; border-radius:40px;  position:relative;}
section.banner .container .row {width:1740px; max-width:1740px; height:auto; width:1320px; max-width:1320px; margin:0 auto;}
section.banner .btxt{width:50%;}
section.banner .btxt p a{color:var(--orange); text-decoration:none;}
section.banner .btxt p a:hover{border-bottom:1px solid var(--orange);}
section.banner h1{font-size:56px; line-height:60px; /*height:60px;*/ margin:90px 0 50px;}
section.banner p{display:block;}

/*banner boxes*/
section.banner .txtblock.mobile{display:none;}
section.banner .txtblock {display:flex; flex-direction:row; align-items:flex-start; gap: 10px; max-width: 740px; width: 100%; }
section.banner .custom-box {position: relative; flex: 1; padding: 20px; /* Prostor za strlese robove okvirja */}
section.banner .content { background-color: var(--white); border-radius: 30px; padding: 30px 25px 0px 35px; z-index: 1; position: relative; color: var(--black); font-size: 1.125rem; line-height: 1.6;}
section.banner .content strong{color:var(--orange); font-weight:500;}
/*SVG frames */
section.banner .outline-svg { position: absolute; top: 0; left: 0;width: 100%;height: 100%; pointer-events: none;z-index: 2;}
section.banner .outline-svg path {fill: none;stroke-width: 2px;vector-effect: non-scaling-stroke;}

section.banner .survey-button{}
section.banner .survey-button.mobile,.survey-button.mobile{display:none;}
section.banner .survey-button p{text-align:center; padding:60px 29.8% 45px; font-size:18px;}
section.banner .survey-button a,.survey-button a{color:var(--white); background-color:var(--violet); text-decoration:none; display:block; width:450px; height:80px; line-height:80px; font-weight:bold; font-size:24px; margin:0 auto 120px auto; text-align:center; border-top-left-radius:40px; transition:all 0.8s ease 0s;}
section.banner .survey-button a::after,.survey-button a::after{content:"\f178";margin-left:17px;}
section.banner .survey-button a:hover{background-color: var(--orange);}

section.banner .illustration1{position:absolute;top:240px; right:140px; width:600px;}
section.banner .illustration2{position:absolute; /*top:947px;*/ bottom:160px; right:280px; width:160px;}
section.banner .illustration3{position:absolute;bottom:125px; left:270px; width:150px;}
section.banner .illustration4{position:absolute;bottom:-58px; right:208px; width:200px;}

section.banner .millustration1{display:none;}
section.banner .millustration2{display:none;}
section.banner .millustration3{display:none;}
section.banner .millustration4{display:none;}

	/*NAVBAR*/
	.navbar{margin-top:54px; height:40px;
	--bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");}
	.navbar .navbar-toggler{position:absolute; top:10px; right:20px; width:50px; height:50px; background-color:var(--green-bg); border-color:var(--green-bg); color:var(--white); border-radius:50%; padding:9px 0 0 0px; z-index:1005; transition:all 1s ease;}
	
  .navbar-nav{width:100%; height:40px; /*margin-left:245px;*/}
	.navbar-nav .navbar-brand{}
	.navbar-nav a.nav-link, .navbar-expand-lg .navbar-nav a.nav-link{ font-size:20px; font-weight:500; height:60px; line-height:60px; padding: 0 40px; margin:0px 8px; color: var(--white); transition:all 0.8s ease 0s;}
	.navbar-nav a.nav-link.oprojektu{background-color:var(--orange); border-bottom-left-radius:20px;}
	.navbar-nav a.nav-link.oprojektu:hover{background-color:var(--violet);}
	.navbar-nav a.nav-link.vprasalnik{background-color:var(--violet); border-top-left-radius:20px;}
	.navbar-nav a.nav-link.vprasalnik:hover{background-color:var(--orange);}
	.navbar-nav a.nav-link:hover,.navbar-nav a.nav-link.active{color: var(--white); background: var(--green);}
	.navbar-nav .nav-item-contacts{margin: 0px 5px;}
	.navbar-nav .nav-item-contacts a{display:inline-block; background: var(--green-bg); color: var(--white); width:60px; height:60px; line-height:60px; text-decoration:none; text-align:center;/*padding: 0 25px; margin:3px 5px;*/ border-radius:40px;}
	.navbar-nav .nav-item-contacts a:hover{background-color:#fff; color: var(--green);}
	.navbar-nav .nav-item-contacts a.email::before{font-family: "Font Awesome 6 Free"; font-weight:bold; font-size:20px; font-style:normal; font-variant:normal; text-rendering:auto; -webkit-font-smoothing:antialiased; transition:all 0.8s ease 0s; transform:translate(0px,0px);}
	.navbar-nav .nav-item-contacts a.email::before{content:"\f0e0";}


/*INTRO BLOCK 1, BLOCK 2*/
section.block{padding:90px 0;}
section.imgtxt .container {width:1464px; max-width:1464px;}
section.imgtxt .container .row {width:1464px; max-width:1464px;}
section.txtimg .container {width:1350px; max-width:1350px;}
section.txtimg .container .row {width:1350px; max-width:1350px;}
section.block.imgtxt .img{ height:600px; background:transparent url(../images/bck-img-frame.png) no-repeat 0 0; position:relative;}
section.block.txtimg .img{ height:597px; background:transparent url(../images/bck-img-frame2.png) no-repeat 0 0; position:relative;}
section.block.txtimg .img{background-position:top right;}
section.block.block .img img.photo{position:absolute; border-radius:30px;}
section.block.imgtxt .img img.photo{left:75px; top:24px;}
section.block.txtimg .img img.photo{right:15px; top:24px;}
section.block.imgtxt .img img.illustration{position:absolute; left:320px; bottom:-55px;}
section.block.txtimg .img img.illustration{position:absolute; right:224px; bottom:-15px;}
section.block.imgtxt .txt{padding:90px 0 0 112px;}
section.block.txtimg .txt{padding:90px 0 0 15px;}

/*INNER - o projektu*//*
section.banner.inner{height:1160px; height:auto;}
section.banner.inner .container {height:1160px; height:auto;}
section.banner.inner .container .row {height:1160px; height:auto;}*/
section.banner.inner .illustration5{position:absolute;top:350px; right:140px; width:auto;}

section.block .txtblock{font-size:24px; width:30%; display:inline-block; padding:5px 10px; background-color:var(--white); border-radius:20px; position:relative; z-index:1001; margin-top:90px;}
section.block .txtblock.txtblock1{margin-right:30px; height:360px;}
section.block .txtblock.txtblock2{height:295px; vertical-align:top;}
section.block .txtblock article{ padding:55px 40px;  width:100%; position:absolute; top:-8px; left:8px; z-index:1000;}
section.block .txtblock article.txtblock1{background: transparent url(../images/bck-txt-frame.png) no-repeat 0 0;}
section.block .txtblock article.txtblock2{background: transparent url(../images/bck-txt-frame2.png) no-repeat 0 0;}
section.block .txtblock article.txtblock3{background: transparent url(../images/bck-txt-frame.png) no-repeat 0 0;}
section.block .txtblock strong{color:var(--orange); font-weight:500;}



section.cilji { padding: 90px 0; }
section.cilji .container { width: 1464px; max-width: 1464px; position: relative; margin: 0 auto; }

/* KLJUČNA POPRAVA: Dodan flex in centriranje */
section.cilji .container .row { 
    width: 100%; 
    display: flex; 
    justify-content: center; 
    align-items: center; 
    flex-wrap: wrap; 
    gap: 50px; /* To nadomesti margin-right in poskrbi za razmik med poligoni */
}

section.cilji .illustration { position: absolute; bottom: -80px; left: 90px; width: auto; }

/* Poligoni */
.shape-border { 
    width: 29%; 
    height: 440px; 
    padding: 0; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
}


.shape-border.violet { background: var(--violet); }
.shape-border.orange { background: var(--orange); }

/* Odstranil sem margin-right: 50px tukaj, ker ga zdaj rešuje 'gap' zgoraj */

/* Clip-path ostane enak */
.polygon1 { clip-path: polygon(0% 0%, 100% 0%, 97% 98%, 0% 100%); }
.polygon2 { clip-path: polygon(0% 0%, 98% 0%, 100% 100%, 7% 100%); }
.polygon3 { clip-path: polygon(0% 0%, 90% 0%, 100% 100%, 0% 100%); }

.shape-inner { 
    width: calc(100% - 5px); 
    height: calc(100% - 5px); 
    background: white; 
    padding: 50px 50px 90px 50px; 
    display: flex; 
    align-items: center; 
    justify-content: center;

}


section.block.imgtxt.inner .img{ height:600px; background:none; position:relative;}
section.block.imgtxt.inner .txt{padding:0px 0 0 112px;}
section.block.txtimg.inner .img{ background:none; height:auto;}

section.block.imgtxt.inner.oprojektu{padding:90px 0 0 0;}

section.block.consumerdemand{padding:50px 0 90px 0;}
section.block.consumerdemand .illustration,section.block.txtimg.consumerdemand .img img.illustration{position:absolute;top:80px; right:20px; width:auto;}


section.banner.inner.survey .vprasalnik11{position:absolute;top:250px; left:170px; width:auto;}
section.banner.inner.survey .vprasalnik12{position:absolute;top:250px; right:170px; width:auto;}
section.banner.inner.survey .vprasalnik13{position:absolute;bottom:55px; left:140px; width:auto;}
section.banner.inner.survey .vprasalnik21{position:absolute;top:335px; right:140px; width:auto;}
section.banner.inner.survey .vprasalnik22{position:absolute;bottom:230px; left:110px; width:auto;}
section.banner.inner.survey .vprasalnik23{position:absolute;bottom:30px; right:160px; width:auto;}
section.banner.inner.survey .vprasalnik31{position:absolute;top:475px; left:30px; width:auto;}
section.banner.inner.survey .vprasalnik32{position:absolute;top:1030px; right:5px; width:auto;}
section.banner.inner.survey .vprasalnik41{position:absolute;top:670px; right:20px; width:auto;}
section.banner.inner.survey .vprasalnik42{position:absolute;top:1130px; left:40px; width:auto;}
section.banner.inner.survey .vprasalnik51{position:absolute;top:520px; left:35px; width:auto;}
section.banner.inner.survey .vprasalnik52{position:absolute;bottom:20px; right:20px; width:auto;}

/*Survey STEPS*/
.steps {display: flex; justify-content: center; align-items: center; counter-reset: step-counter; list-style: none; padding: 100px 0 50px;}
/* KROGCI */
.steps span {display: flex; align-items: center; justify-content: center; position: relative; width: var(--d-circle); height: var(--d-circle); background-color: var(--orange); border-radius: 50%; z-index: 2; margin-right: var(--d-line);}
/* Zadnji krogec nima dolgega margina, ker nima naslednjika */
.steps span:last-child {margin-right: 0;}
/* ŠTEVILKE */
.steps span::before {counter-increment: step-counter; content: counter(step-counter); color: var(--white);font-weight: bold;font-size: 18px;}
/* CRTICE MED KROGCI */
.steps span::after {content: "";position: absolute;left: 100%;top: 50%;transform: translateY(-50%);width: var(--d-line);height: 3px;background-color: var(--orange);z-index: 1;}
/* ZACETNA CRTICA (Pred stevilko 1) */
.steps::before {content: ""; width: var(--d-tail); height: 3px; background-color: var(--violet); margin-right: 0; /* Če želiš razmik od roba ekrana, uporabi padding na .steps */}
/* KONCNA CRTICA (Za zadnjo številko) */
/* Ker zadnji span nima desnega margina, mu podaljšamo ::after za tail */
.steps span:last-child::after {width: var(--d-tail);}
/* BARVNA LOGIKA */
.steps span.done, .steps span.active {background-color: var(--violet);}
/* Črta postane vijolična, ko je krog pred njo OPRAVLJEN */
.steps span.done::after {background-color: var(--violet);}

section.banner.inner.survey h1{text-align:center; margin:0 0 20px;}

/*SURVEY*/
.options {  display: grid; grid-template-columns: 1fr 1fr; counter-reset: alpha-counter; gap: 20px;}
.options input[type="radio"] {display: none;} /* skrij radio */
/* kartica */
.card {display: flex; flex-direction: row;  align-items: center; gap: 16px;width: 100%; box-sizing: border-box;padding: 20px;border-radius: 18px;  background: var(--white);border: 2px solid transparent;cursor: pointer;}
.card:hover { background: #eee;}
/* ikona levo */
.icon {flex-shrink: 0; width: 80px;height: 80px; border-radius: 50%; background: #f6f4ef; color: var(--orange);  display: flex; align-items: center; justify-content: center;  font-weight: 600;  font-size: 24px; font-size:0;}
.icon::before {counter-increment: alpha-counter; content: counter(alpha-counter, upper-alpha); font-size: 24px;}

.text {display: flex;flex-direction: column;justify-content: center; margin-left:20px;}
.text strong {display: block;font-size: 24px;color: #161515;}
.text small { display: block; font-size: 16px; color: #777;  margin-top: 4px;}

/* selected */
.options input:checked + .card {background: #fff; border: 2px solid var(--orange);}

.options input:checked + .card .icon {background: var(--orange); color: white;}
.options input:checked + .card .icon::before {content: "✓";  font-size: 24px;}
.options input:checked + .card .icon {font-size: 0;}
/* DRUGO */
.other {grid-column: 1 / -1;margin-top: 10px;}
.other-label {display: block;margin-bottom: 10px;font-weight: 600;width: 47%;margin:30px auto 10px auto;text-align:center; position:relative;}
textarea {width:70%; height:200px; margin:0 auto; display:block; border-radius: 16px;  border: none;  padding: 16px;  background: var(--white); font-size: 14px;  resize: none; position:relative;}
/* error */
.error {grid-column: 1 / -1;color:var(--orange);display: none;margin: 5px auto; position:relative;}
/* button */
.submit-btn {grid-column: 1 / -1; padding: 12px;border: none;color:var(--white); background-color:var(--violet);color: white;cursor: pointer;width:284px;
height:80px; font-weight:bold; font-size:24px; margin:95px auto 0 auto; text-align:center; border-top-left-radius:40px; transition:all 0.8s ease 0s;}
.submit-btn::after{content:"\f178";margin-left:17px;}
.submit-btn.last::after{content:"";}
.submit-btn:hover{background-color: var(--orange);}
form a.back{text-align:center; color:var(--black); font-size:16px; font-weight:500; grid-column: 1 / -1;}
form p.lastinfo{text-align:center; color:gray; width:35%; margin:0 auto; font-size:16px; font-weight:500; grid-column: 1 / -1;}

.banner.inner.survey p.thankyou{text-align:center;}

div.cdculeu.mobile{display:none;}


/*STATISTIKA*/
section.banner.inner .btxt.stats .survey-button{margin-top:160px;}

section.banner .btxt.stats .survey-button a,.survey-button a{background: var(--green-bg);margin:0 auto 60px auto;}
section.banner .btxt.stats .survey-button a::after,.survey-button a::after{content:"\f019";margin-left:17px;}
section.banner .btxt.stats .survey-button a:hover{background-color: var(--orange);}

/*PODPORNIKI*/
section.podporniki .container{width:1000px; max-width:1000px;}
section.podporniki .row{width:1000px; max-width:1000px;}/*
/* --- SWIPER --- */
.section.podporniki .logos {width: 100%;padding:60px 0;overflow: hidden; }
.my-swiper-wrapper {display: flex; align-items: center; overflow-x: auto; scroll-snap-type: x mandatory; gap: 60px; /* Razmik med logotipi */padding: 20px;
/* Skrije scrollbar v vseh brskalnikih */
scrollbar-width: none; -ms-overflow-style: none;}
.my-swiper-wrapper::-webkit-scrollbar { display: none;}
.my-slide { flex: 0 0 auto; /* Prepreči krčenje in uporabi naravno širino */scroll-snap-align: center; /* Ustavi se na sredini elementa */}
.my-slide img { width: auto; display: block;}

/*SMALLFOOT*/
section.smallfoot{height:80px; display:grid; margin:20px 0;}
section.smallfoot .container{width:1740px; max-width:1740px;}
section.smallfoot .row{width:1740px; max-width:1740px; margin-bottom:40px; background:var(--lightgreen-bg); border-radius:20px; height:80px; line-height:80px; padding:0 210px;}
section.smallfoot p, section.smallfoot a, section.smallfoot span{color:var(--gray); line-height:80px; display:inline; padding:0; width:auto;font-size:20px;}
section.smallfoot .copyright {text-align:left;}
section.smallfoot .cdculeu {text-align:center;}
section.smallfoot .production {text-align:right;}