/* Dodaci za CMS verziju: rasporedi sekcija, blokovi, uređivački način. Ne dira dizajn iz style.css. */

/* razmaci */
.sec-tight{padding-top:clamp(32px,4vw,56px);padding-bottom:clamp(32px,4vw,56px)}
.sec-pt0{padding-top:0}
.razmak-s{height:24px}.razmak-m{height:48px}.razmak-l{height:96px}

/* rasporedi */
.cols-2,.cols-3,.cols-4{display:grid;gap:22px;align-items:start}
.cols-2{grid-template-columns:repeat(2,1fr)}
.cols-3{grid-template-columns:repeat(3,1fr)}
.cols-4{grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.cols-3,.cols-4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.cols-2,.cols-3,.cols-4{grid-template-columns:1fr}}
.center-col{max-width:760px;margin-inline:auto}
.split > .blok,.split > .media,.split > div{min-width:0}
.hero-sm{min-height:min(60vh,560px)}
.hero .cta > .link{color:#fff}

/* blokovi */
.blok > * + *{margin-top:14px}
.blok > .btn + .btn{margin-left:8px}
.btn-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.center{text-align:center}
.center .btn-row{justify-content:center}
.prose{max-width:760px}
.prose h2,.prose h3{margin-top:1.4em}
.prose h2:first-child,.prose h3:first-child{margin-top:0}
.prose table{width:100%;border-collapse:collapse;font-size:.95rem;margin:1em 0}
.prose th,.prose td{border-bottom:1px solid var(--line);padding:10px 12px;text-align:left}
.prose ul{list-style:disc;padding-left:1.2em}
.prose li{margin-bottom:.4em}
.media > img:first-child,.media > figure:first-child img{border-radius:var(--r);width:100%;aspect-ratio:4/3;object-fit:cover;box-shadow:var(--shadow)}
.cbox p:last-child{margin-bottom:0}
.cbox a.big.sm{font-size:1.1rem}
.cbox.light .form{margin-top:14px}
.form-msg{padding:12px 14px;border-radius:10px;font-size:.92rem;margin:0 0 12px}
.form-msg.ok{background:#e8f7ec;color:#14532d}
.form-msg.greska{background:#fdecec;color:#7f1d1d}
.form label select{font:inherit;padding:12px 14px;border:1px solid var(--line-2);border-radius:10px;background:#fff;color:var(--ink);width:100%}
.form .priv input[type=checkbox]{width:auto}

/* slike */
figure.slika{margin:0}
figure.slika img{border-radius:var(--r-s);width:100%}
figure.slika figcaption{font-size:.82rem;color:var(--muted);margin-top:8px}
img.slika-banner{width:100%;border-radius:var(--r);aspect-ratio:21/9;object-fit:cover}
img.slika-round{border-radius:var(--r);box-shadow:var(--shadow)}
.hist-grid figure img{filter:grayscale(.15) contrast(1.05)}
.hist-grid figure:first-child{grid-column:1/-1}

/* sekcija: tamna tema za elemente */
.sec-dark .card{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.12)}
.sec-dark .card h3{color:#fff}
.sec-dark .card p,.sec-dark .card .price small{color:rgba(255,255,255,.75)}
.sec-dark .card .price{color:#fff}
.sec-dark .checks b{color:#fff}
.sec-dark .checks span{color:rgba(255,255,255,.75)}
.sec-dark .checks svg{color:var(--yellow)}
.sec-dark .btn-o{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}
.sec-dark .tl .y{color:var(--yellow)}
.sec-dark .tl p{color:rgba(255,255,255,.75)}
.sec-dark .timeline::before{background:rgba(255,255,255,.2)}
.sec-dark .faq details{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.12)}
.sec-dark .faq summary,.sec-dark .faq details p{color:#fff}
.sec-dark .partner{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.12)}
.sec-dark .partner b{color:#fff}
.sec-dark .plan:not(.hot){background:#fff}
.sec-dark .toggle{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.15)}
.sec-dark .plans-note{color:rgba(255,255,255,.7)}

/* karta kao samostalni element + kolačić vrata */
.map.karta{border-radius:var(--r);overflow:hidden;position:relative;background:var(--sky)}
.map.karta iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* uređivački način */
.cms-toolbar-expanded .sec:empty,.cms-toolbar-expanded .blok:empty{min-height:60px;outline:1px dashed var(--line-2)}
.cms .sec{scroll-margin-top:120px}
.cms-toolbar-expanded .header{top:46px}

/* ugniježđena sekcija (unutar sekcije ili bloka): bez vlastitog ruba, samo razmak od prethodnog sadržaja */
.pod-sec{margin-top:22px}
.pod-sec.sec-tight{margin-top:12px}
.pod-sec.sec-pt0{margin-top:0}
.pod-sec.sec-alt,.pod-sec.sec-dark{border-radius:var(--r);padding:clamp(24px,3vw,40px)}
.pod-sec.sec-dark{background:var(--navy);color:#fff}
.pod-sec.sec-dark h2,.pod-sec.sec-dark h3{color:#fff}
.pod-sec .sec-head{margin-bottom:22px}

/* tablica usporedbe: na uskim ekranima vodoravno klizanje umjesto preljeva */
.cmp-wrap{position:relative;overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--r)}
.cmp{min-width:640px}
@media (max-width:700px){.cmp th,.cmp td{padding:10px 12px;font-size:.88rem}.cmp tbody th{width:auto;min-width:160px}}
