/* Izrada sajta - cena i paketi (2026-10-23, PA Designer). Boje i fontovi kao /odrzavanje-sajta/:
   darkorange akcent, tamna #3c3950, kartice #aed581 / #58c5d3 / #383b4f iz inner_page_higlights. */
.itl-cene{--or:#ff8c00;--tamna:#3c3950;--linija:#e3e7ea;--svetla:#f4f6f7;--zelena:#aed581;--plava:#58c5d3;--tekst:#5f727f}
.itl-cene, .itl-cene *{box-sizing:border-box}
.itl-cene [id]{scroll-margin-top:110px}
.itl-cene .screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* uvod */
.itl-cene-uvod{font-size:19px;line-height:1.6;color:var(--tamna);margin:0 0 18px}
.itl-cene-dokaz{display:flex;flex-wrap:wrap;gap:6px 22px;margin:0 0 26px;padding:0;list-style:none;font-family:'Montserrat',sans-serif;font-weight:700;font-size:14px;color:var(--tamna);text-transform:uppercase;letter-spacing:.04em}
.itl-cene-dokaz li{display:flex;align-items:center;gap:8px;margin:0;padding:0}
.itl-cene-dokaz li::before{display:none}
.itl-cene-dokaz i{color:var(--or)}
.itl-cene-akcije{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}
.itl-cene-btn, .itl-cene a.itl-cene-btn{display:inline-block;background:var(--or);color:#fff;font-family:'Montserrat',sans-serif;font-weight:700;font-size:14px;letter-spacing:.03em;padding:14px 26px;border:0;border-radius:3px;text-decoration:none;cursor:pointer;transition:background .2s}
.itl-cene-btn:hover, .itl-cene a.itl-cene-btn:hover, .itl-cene-btn:focus-visible{background:var(--tamna);color:#fff}
.itl-cene-tel{font-family:'Montserrat',sans-serif;font-weight:700;font-size:16px;color:var(--tamna);text-decoration:none;white-space:nowrap}
.itl-cene-tel i{color:var(--or);margin-right:6px}
.itl-cene-sitno{font-size:13px;line-height:1.5;color:var(--tekst);margin:10px 0 0}

/* tabele */
.itl-cene-skrol{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:18px 0 6px;border:1px solid var(--linija);border-radius:4px}
.itl-cene-t{width:100%;border-collapse:collapse;margin:0;font-size:15px;line-height:1.45}
.itl-cene-t th, .itl-cene-t td{padding:12px 14px;border:0;border-bottom:1px solid var(--linija);text-align:left;vertical-align:top;color:var(--tekst)}
.itl-cene-t thead th{background:var(--tamna);color:#fff;font-family:'Montserrat',sans-serif;font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.04em}
.itl-cene-t tbody tr:last-child > *{border-bottom:0}
.itl-cene-t tbody th{color:var(--tamna);font-weight:700}
.itl-cene-t tbody th a{color:var(--tamna);text-decoration:underline;text-decoration-color:var(--or);text-underline-offset:3px}
.itl-cene-t .itl-cene-iznos{color:var(--tamna);font-weight:700;white-space:nowrap}
.itl-cene-t tbody tr:nth-child(even) > *{background:var(--svetla)}

/* kartice paketa */
.itl-cene-paketi{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin:24px 0 8px}
.itl-cene-paket{display:flex;flex-direction:column;background:#fff;border:1px solid var(--linija);border-top:5px solid var(--b,var(--or));border-radius:4px;padding:26px 24px 24px}
.itl-cene-paket:nth-child(1){--b:var(--zelena)}
.itl-cene-paket:nth-child(2){--b:var(--plava)}
.itl-cene-paket:nth-child(3){--b:var(--or)}
.itl-cene-paket:nth-child(4){--b:var(--tamna)}
.itl-cene-paket h3{margin:0 0 6px;font-size:15px;line-height:1.3;letter-spacing:.08em;text-transform:uppercase;color:var(--tamna)}
.itl-cene-paket .itl-cene-cena{font-family:'Montserrat',sans-serif;font-weight:700;font-size:28px;line-height:1.15;color:var(--tamna);margin:0 0 4px}
.itl-cene-paket .itl-cene-zakoga{font-size:15px;line-height:1.55;margin:12px 0 14px}
.itl-cene-lista{list-style:none;margin:0 0 16px;padding:0}
.itl-cene ul.itl-cene-lista > li{position:relative;list-style:none!important;margin:0;padding:5px 0 5px 26px;font-size:15px;line-height:1.45;color:var(--tekst);background:none}
.itl-cene ul.itl-cene-lista > li::before{content:"\f00c"!important;font-family:"Font Awesome 6 Free"!important;font-weight:900!important;display:block!important;position:absolute;left:0;top:6px;width:auto;height:auto;background:none;border:0;font-size:13px;line-height:1.45;color:var(--b,var(--or))}
.itl-cene .itl-cene-paket:nth-child(1) ul.itl-cene-lista > li::before{color:#7cb342}
.itl-cene-paket .itl-cene-btn{display:block;text-align:center}
.itl-cene-paket > :last-child{margin-top:auto;margin-bottom:0} /* dugme na dno (wpautop ga zna umotati u <p>) */

/* sta je ukljuceno */
.itl-cene-ukljuceno{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 30px;margin:22px 0 18px}
.itl-cene-stavka{display:flex;gap:14px;align-items:flex-start}
.itl-cene-stavka i{flex:0 0 42px;height:42px;display:grid;place-content:center;border-radius:50%;background:#fff3e3;color:var(--or);font-size:17px}
.itl-cene-stavka p{margin:0;font-size:15px;line-height:1.55}
.itl-cene-stavka strong{color:var(--tamna)}

/* koraci */
.itl-cene-koraci{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:22px 0 20px;padding:0;list-style:none;counter-reset:k}
.itl-cene-koraci li{counter-increment:k;margin:0;padding:18px 16px;background:var(--svetla);border-radius:4px;font-size:14px;line-height:1.5;color:var(--tekst)}
.itl-cene-koraci li::before{content:counter(k);display:grid;place-content:center;width:34px;height:34px;border-radius:50%;background:var(--or);color:#fff;font-family:'Montserrat',sans-serif;font-weight:700;font-size:15px;margin-bottom:12px;font-variant-numeric:tabular-nums}
.itl-cene-koraci strong{display:block;color:var(--tamna);font-family:'Montserrat',sans-serif;font-size:14px;line-height:1.35;margin-bottom:6px}
.itl-cene-napomena{border-left:4px solid var(--or);background:var(--svetla);padding:18px 22px;border-radius:0 3px 3px 0;font-size:15px;line-height:1.6;margin:0 0 10px}
.itl-cene-napomena strong{color:var(--tamna)}

/* brojke */
.itl-cene-brojke{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:22px 0;border:1px solid var(--linija);border-radius:4px}
.itl-cene-brojka{padding:22px 18px;text-align:center;border-left:1px solid var(--linija)}
.itl-cene-brojka:first-child{border-left:0}
.itl-cene-brojka b{display:block;font-family:'Montserrat',sans-serif;font-weight:700;font-size:34px;line-height:1.1;color:var(--or);font-variant-numeric:tabular-nums}
.itl-cene-brojka span{display:block;margin-top:8px;font-size:14px;line-height:1.4;color:var(--tekst)}
/* reference: isti [wpb-portfolio] kao na naslovnoj, izgled daje plugin */
.itl-cene-ref{margin:24px 0 18px}
.itl-cene-link{font-family:'Montserrat',sans-serif;font-weight:700;font-size:14px;color:var(--or);text-decoration:none}
.itl-cene-link::after{content:" \2192"}
.itl-cene-link:hover{color:var(--tamna)}

/* CTA + forma */
.itl-cene-cta{background:var(--tamna);color:#d7dbe6;border-radius:4px;padding:44px 40px 34px;margin:10px 0 20px;border-top:5px solid var(--or)}
.itl-cene-cta h2{color:#fff;margin:0 0 10px;font-size:26px;line-height:1.3}
.itl-cene-cta > p{margin:0 0 26px;font-size:16px;line-height:1.55}
/* dve opcije: kratak upitnik (kalkulator) + forma "Kontakt telefon" */
.itl-cene-izbor{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.itl-cene-opcija{display:flex;flex-direction:column;background:#fff;border-radius:4px;padding:26px 24px 24px;color:var(--tekst);min-width:0}
.itl-cene-oznaka{font-family:'Montserrat',sans-serif;font-weight:700;font-size:13px;letter-spacing:.08em;color:var(--or)}
.itl-cene .itl-cene-opcija h3{margin:6px 0 6px;font-size:19px;line-height:1.3;color:var(--tamna);text-transform:none;letter-spacing:0}
.itl-cene-opcija > p{margin:0 0 18px;font-size:15px;line-height:1.5}
.itl-cene-opcija:first-child{background:#fff3e3}
.itl-cene-ikona{display:block;width:84px;height:84px;margin:auto;padding:0 0 18px;fill:none;stroke:var(--or);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.itl-cene-opcija .itl-calc-wrap{margin-top:auto}
.itl-cene .itl-cene-opcija .itl-calc-open, .itl-cene .itl-cene-opcija .form_cta{display:block;width:100%;margin:0;padding:15px 20px;background:var(--or);color:#fff;border:0;border-radius:3px;box-shadow:none;font-family:'Montserrat',sans-serif;font-weight:700;font-size:15px;letter-spacing:.03em;line-height:1.3;cursor:pointer;transform:none;transition:background .2s}
.itl-cene .itl-cene-opcija .itl-calc-open:hover, .itl-cene .itl-cene-opcija .form_cta:hover, .itl-cene .itl-cene-opcija .form_cta:focus-visible{background:var(--tamna);color:#fff;transform:none;box-shadow:none}
.itl-cene-opcija form{margin:0}
.itl-cene-opcija input[type=text], .itl-cene-opcija input[type=tel]{display:block;width:100%;padding:12px 13px;margin:0 0 10px;border:1px solid #ccd3d8;border-radius:4px;background:#fff;font-size:15px;line-height:1.4;color:var(--tamna)}
.itl-cene-opcija input:focus{outline:2px solid var(--or);outline-offset:1px;border-color:var(--or)}
/* broj telefona: velik, centriran, tel: link */
.itl-cene a.itl-cene-broj{display:flex;align-items:center;justify-content:center;gap:14px;margin:26px 0 0;font-family:'Montserrat',sans-serif;font-weight:700;font-size:clamp(26px,6vw,36px);line-height:1.1;color:#fff;text-decoration:none;font-variant-numeric:tabular-nums;white-space:nowrap}
.itl-cene a.itl-cene-broj i{display:grid;place-content:center;width:52px;height:52px;flex:0 0 52px;border-radius:50%;background:var(--or);color:#fff;font-size:21px}
.itl-cene a.itl-cene-broj:hover{color:var(--or)}
.itl-cene-kontakt{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 26px;margin:16px 0 0;font-size:15px}
.itl-cene-kontakt a{color:#fff;text-decoration:none;font-weight:700}
.itl-cene-kontakt a:hover{color:var(--or)}
.itl-cene-kontakt i{color:var(--or);margin-right:7px}

@media (max-width:991px){
  .itl-cene-koraci{grid-template-columns:repeat(2,minmax(0,1fr))}
  .itl-cene-brojke{grid-template-columns:repeat(2,minmax(0,1fr))}
  .itl-cene-brojka:nth-child(3){border-left:0}
  .itl-cene-brojka:nth-child(n+3){border-top:1px solid var(--linija)}
}
@media (max-width:767px){
  .itl-cene-uvod{font-size:17px}
  .itl-cene-paketi, .itl-cene-ukljuceno, .itl-cene-koraci, .itl-cene-izbor{grid-template-columns:minmax(0,1fr)}
  .itl-cene-opcija{padding:22px 18px 20px}
  .itl-cene-ikona{display:none}
  .itl-cene a.itl-cene-broj{gap:10px}
  .itl-cene a.itl-cene-broj i{width:42px;height:42px;flex-basis:42px;font-size:17px}
  .itl-cene-paket{padding:22px 18px 20px}
  .itl-cene-cta{padding:28px 16px 24px}
  .itl-cene-cta h2{font-size:21px}
  /* tabela cena na mobilnom: svaki red je kartica */
  .itl-cene-skrol-ne{border:0;overflow:visible}
  .itl-cene-kartice thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .itl-cene-kartice, .itl-cene-kartice tbody, .itl-cene-kartice tr, .itl-cene-kartice th, .itl-cene-kartice td{display:block;width:100%}
  .itl-cene-kartice tr{border:1px solid var(--linija);border-radius:4px;margin-bottom:12px;overflow:hidden}
  .itl-cene-kartice tbody tr:nth-child(even) > *{background:#fff}
  .itl-cene-kartice tbody th{background:var(--tamna)!important;color:#fff;border:0}
  .itl-cene-kartice tbody th a{color:#fff}
  .itl-cene-kartice td{display:flex;justify-content:space-between;gap:12px;padding:10px 14px}
  .itl-cene-kartice tbody tr:last-child > *{border-bottom:1px solid var(--linija)}
  .itl-cene-kartice tbody tr > *:last-child{border-bottom:0}
  .itl-cene-kartice td::before{content:attr(data-label);font-weight:700;color:var(--tamna)}
  .itl-cene-kartice td.itl-cene-iznos{white-space:normal;text-align:right}
}