/* ═══════════════════════════════════════════════════════════════════════
   BOKA ACADEMY · stranica CIJENE
   Nadogradnja na site.css + programi-rich.css (--akc, --sp-*, .ak).
   Header, footer, talasi i modal ostaju nepromijenjeni.
   Bogato ilustrovana varijanta po referenci, u postojećem sistemu „Zaliv".
   ═══════════════════════════════════════════════════════════════════════ */

.cijene-rich{scroll-behavior:smooth}
.cijene-rich section[id]{scroll-margin-top:104px}

/* ── rukopisni akcenat ────────────────────────────────────────────────── */
.hw{font-family:"Caveat", var(--display); font-weight:600; line-height:1.18;
  color:var(--kamen); letter-spacing:.005em}

/* ── plutajući ukrasi: zajednička osnova ─────────────────────────────── */
.dec{position:absolute; pointer-events:none; z-index:0; line-height:0}
.dec img{display:block; width:100%; height:auto}
.dec.front{z-index:2}

@keyframes cFloat{0%,100%{transform:translateY(0) rotate(var(--rot,0deg))}
  50%{transform:translateY(calc(var(--amp,10px) * -1)) rotate(calc(var(--rot,0deg) + var(--tw,2deg)))}}
@keyframes cSwing{0%,100%{transform:rotate(calc(var(--rot,0deg) - 5deg))}
  50%{transform:rotate(calc(var(--rot,0deg) + 5deg))}}
@keyframes cTurn{to{transform:rotate(360deg)}}
@keyframes cTwinkle{0%,100%{transform:scale(1) rotate(var(--rot,0deg)); opacity:.9}
  50%{transform:scale(1.14) rotate(calc(var(--rot,0deg) + 12deg)); opacity:1}}
@keyframes cDriftX{0%,100%{transform:translateX(0)} 50%{transform:translateX(26px)}}

.fl{animation:cFloat var(--dur,7s) ease-in-out infinite; animation-delay:var(--dl,0s)}
.sw{transform-origin:50% 8%; animation:cSwing var(--dur,5.4s) ease-in-out infinite;
  animation-delay:var(--dl,0s)}
.tk{animation:cTwinkle var(--dur,4s) ease-in-out infinite; animation-delay:var(--dl,0s)}
.dx{animation:cDriftX var(--dur,16s) ease-in-out infinite; animation-delay:var(--dl,0s)}
.tn img{animation:cTurn var(--dur,44s) linear infinite}

@media (prefers-reduced-motion:reduce){
  .fl,.sw,.tk,.dx,.tn img{animation:none !important}
}

/* ═══ 1 · HERO ══════════════════════════════════════════════════════════ */
.chero{position:relative; isolation:isolate; overflow:hidden; margin-bottom:-1px;
  background:linear-gradient(180deg, var(--krecnjak) 0%, var(--pijesak) 100%);
  padding:clamp(118px,13.5vh,168px) 0 clamp(52px,6.5vh,86px)}
.chero::before{content:""; position:absolute; z-index:-1; left:-8%; top:-18%;
  width:min(560px,52vw); aspect-ratio:1/.9; background:var(--oleander-soft); opacity:.5;
  border-radius:54% 46% 42% 58% / 46% 54% 46% 54%}
.chero::after{content:""; position:absolute; z-index:-1; right:-10%; bottom:-30%;
  width:min(520px,46vw); aspect-ratio:1; background:var(--zaliv-soft); opacity:.4;
  border-radius:48% 52% 56% 44% / 52% 44% 56% 48%}

.chero-in{position:relative; display:grid; grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);
  gap:clamp(26px,4vw,58px); align-items:center}

/* fotografija u organskoj maski */
.cfoto{position:relative; margin:0}
.cfoto-in{display:block; position:relative; z-index:1; overflow:hidden; background:var(--pijesak-2);
  border-radius:58% 42% 46% 54% / 48% 52% 48% 52%;
  aspect-ratio:1/.82; box-shadow:0 30px 56px -34px rgba(23,50,46,.55)}
.cfoto-in img{width:100%; height:100%; object-fit:cover; display:block;
  transition:transform 1.8s cubic-bezier(.16,.7,.2,1)}
.cfoto:hover .cfoto-in img{transform:scale(1.06)}
.cfoto .hw{position:absolute; z-index:2; left:-7%; top:-8%; max-width:13ch; text-wrap:balance;
  font-size:clamp(1.15rem,1.9vw,1.5rem); transform:rotate(-8deg); color:var(--noc)}
.cfoto .heart{position:absolute; z-index:2; left:-4%; top:22%; width:26px; color:var(--oleander)}

.chero-copy h1{margin-top:12px; max-width:15ch; color:var(--noc);
  font-size:clamp(2.1rem,4.7vw,3.5rem); line-height:1.04}
.chero-copy .lede{margin-top:16px; max-width:44ch}
.chero-cta{display:flex; gap:13px; flex-wrap:wrap; margin-top:28px}
.chero-fine{margin-top:16px; font-size:.79rem; color:var(--kamen)}

/* sekundarno dugme na svijetloj podlozi */
.btn-line{background:transparent; color:var(--noc); border:2px solid var(--rub); box-shadow:none;
  transition:background .35s var(--ease), border-color .35s var(--ease), transform .3s var(--ease)}
.btn-line:hover{background:var(--krecnjak); border-color:var(--duboko); transform:translateY(-2px)}
.btn-line:active{transform:translateY(0)}

/* ukrasi u herou */
.chero .d-sun{right:6%; top:clamp(96px,12vh,138px); width:clamp(92px,11vw,148px); --amp:9px; --dur:8s}
.chero .d-kite{right:2%; top:clamp(58px,7vh,84px); width:clamp(58px,6.4vw,86px); --rot:6deg; --dur:5.2s}
.chero .d-book{right:11%; bottom:8%; width:clamp(74px,8.2vw,112px); --rot:-7deg; --amp:8px; --dur:6.4s; --dl:.5s}
.chero .d-cloud{left:21%; bottom:3%; width:clamp(58px,6.6vw,92px); opacity:.8; --dur:19s}
.chero .d-star{right:26%; top:32%; width:clamp(20px,2.2vw,30px); --rot:-8deg; --dur:3.6s}
.chero .d-leaf{left:-3%; bottom:-6%; width:clamp(72px,8vw,116px); --rot:12deg; --dur:9s; opacity:.9}
.chero .hw-stack{position:absolute; right:2.5%; top:46%; z-index:2; text-align:left;
  font-size:clamp(1rem,1.5vw,1.3rem); transform:rotate(-5deg); color:var(--zlato)}
.chero .hw-stack span{display:block}

/* ═══ 2 · KARTICE CIJENA ════════════════════════════════════════════════ */
.cprices{position:relative; overflow:hidden}
.cprices > .wrap{padding-top:clamp(74px,8vw,112px); padding-bottom:clamp(22px,2.6vw,34px)}
.cgrid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(16px,2vw,26px); align-items:stretch; margin-top:clamp(64px,7vw,92px)}

.pk{position:relative; display:flex; flex-direction:column; border-radius:var(--r-xl);
  padding:clamp(22px,2.4vw,32px); padding-top:clamp(56px,6vw,74px);
  border:1px solid var(--pk-line, var(--linija)); background:var(--pk-bg, var(--krecnjak));
  box-shadow:var(--shadow-1); overflow:visible;
  transition:transform .45s var(--ease), box-shadow .45s var(--ease), border-color .45s var(--ease)}
.js .pk{opacity:0; transform:translateY(26px)}
.js .pk.in{opacity:1; transform:none;
  transition:opacity .75s var(--ease) var(--d,0ms), transform .85s cubic-bezier(.2,.9,.25,1) var(--d,0ms),
             box-shadow .45s var(--ease), border-color .45s var(--ease)}
.js .pk.in:hover{transform:translateY(-8px); box-shadow:var(--shadow-2); border-color:var(--pk-ink)}
.pk-cream{--pk-bg:var(--sunce-soft); --pk-line:#EFDFBC; --pk-ink:var(--zlato)}
.pk-mint{--pk-bg:var(--zaliv-soft); --pk-line:#CBE2DC; --pk-ink:var(--duboko)}
.pk-peach{--pk-bg:var(--oleander-soft); --pk-line:#F0D6C8; --pk-ink:var(--oleander-ink)}

/* ilustracija izlazi iznad kartice */
.pk-art{position:absolute; left:50%; bottom:calc(100% - clamp(48px,5.4vw,66px));
  width:clamp(150px,16vw,206px); transform:translateX(-50%); pointer-events:none}
.pk-art img{display:block; width:100%; height:auto;
  transition:transform .6s cubic-bezier(.2,1.35,.4,1)}
.js .pk.in:hover .pk-art img{transform:translateY(-7px) scale(1.06)}

.pk h3{font-size:clamp(1.25rem,1.9vw,1.55rem); color:var(--noc); text-align:center}
.pk-sub{margin-top:5px; text-align:center; font-size:.84rem; color:var(--kamen)}
.pk-price{margin-top:14px; text-align:center; font-family:var(--display); font-weight:700;
  font-size:clamp(2rem,3.4vw,2.7rem); line-height:1; color:var(--pk-ink)}
.pk-price small{font-family:var(--body); font-weight:500; font-size:.9rem; color:var(--kamen);
  letter-spacing:0}
.pk-pill{display:inline-flex; align-items:center; gap:7px; margin:10px auto 0; padding:6px 14px;
  border-radius:99px; background:var(--zaliv); color:#0B2E28;
  font-family:var(--display); font-weight:700; font-size:.7rem; letter-spacing:.11em;
  text-transform:uppercase}
.pk-peach .pk-pill{background:var(--sunce); color:#4A3106}

.pk-list{list-style:none; margin:clamp(16px,1.8vw,22px) 0 0; padding:0; display:grid; gap:11px;
  align-content:start; flex:1 1 auto}
.pk-list li{display:flex; gap:11px; align-items:flex-start; font-size:.92rem; line-height:1.5;
  color:var(--noc)}
.pk-list .tick{flex:0 0 auto; width:22px; height:22px; margin-top:1px; border-radius:50%;
  display:grid; place-items:center; background:var(--duboko); color:#fff}
.pk-list .tick svg{width:13px; height:13px}
.js .pk .pk-list li{opacity:0; transform:translateX(-8px)}
.js .pk.in .pk-list li{opacity:1; transform:none;
  transition:opacity .5s var(--ease) var(--li,0ms), transform .5s var(--ease) var(--li,0ms)}

.pk-note{display:flex; gap:10px; align-items:flex-start; margin-top:16px; padding-top:15px;
  border-top:1px dashed var(--pk-line); font-size:.83rem; line-height:1.55; color:var(--kamen)}
.pk-note svg{flex:0 0 auto; width:17px; height:17px; margin-top:2px; color:var(--pk-ink)}
.pk-body{margin-top:14px; font-size:.9rem; line-height:1.65; color:var(--kamen); text-align:center;
  flex:1 1 auto}

.pk .pcta{opacity:1; transform:none; pointer-events:auto; display:inline-flex; align-items:center; justify-content:center; gap:9px;
  margin-top:clamp(18px,2vw,24px); width:100%; padding:14px 20px; border:0; cursor:pointer;
  border-radius:99px; font:inherit; font-family:var(--display); font-weight:700; font-size:.94rem;
  background:var(--brand-plate); color:var(--pijesak); box-shadow:0 4px 0 var(--sunce);
  transition:transform .25s var(--ease), box-shadow .25s var(--ease)}
.pk .pcta:hover{transform:translateY(-2px); box-shadow:0 6px 0 var(--sunce)}
.pk .pcta:active{transform:translateY(1px); box-shadow:0 2px 0 var(--sunce)}
.pk .pcta .arw{transition:transform .25s var(--ease)}
.pk .pcta:hover .arw{transform:translateX(4px)}
.pk-peach .pk-price{font-size:clamp(1.7rem,2.7vw,2.2rem)}
.pk-peach .pk-price small{display:block; margin-top:7px}
.pk-peach .pcta{background:var(--krecnjak); color:var(--noc); box-shadow:0 4px 0 var(--oleander)}
.pk-peach .pcta:hover{box-shadow:0 6px 0 var(--oleander)}
.pk-peach .pcta:active{box-shadow:0 2px 0 var(--oleander)}

/* ukrasi oko kartica */
.cprices .d-grana{left:-5%; top:14%; width:clamp(86px,9vw,132px); --rot:-8deg; --dur:10s; opacity:.9}
.cprices .d-cvijet{right:0; top:8%; width:clamp(66px,7vw,98px); --rot:10deg; --dur:8.4s; --dl:.6s}
.cprices .d-zv1{left:8%; top:6%; width:22px; --rot:-12deg; --dur:3.4s}
.cprices .d-zv2{right:13%; bottom:16%; width:18px; --rot:14deg; --dur:4.2s; --dl:.8s}

/* ═══ 3 · PREVOZ: put sa kombijem ═══════════════════════════════════════ */
.croad{position:relative; overflow:hidden}
.croad > .wrap{padding-top:clamp(16px,2vw,26px); padding-bottom:clamp(30px,3.6vw,48px)}
.croad-in{position:relative; display:grid; grid-template-columns:auto minmax(0,1fr) auto;
  gap:clamp(14px,2.4vw,30px); align-items:center}
.croad-bus{width:clamp(96px,11vw,148px)}
.croad-bus img{display:block; width:100%; height:auto}
.js .croad-bus{opacity:0; transform:translateX(-46px)}
.js .croad.in .croad-bus{opacity:1; transform:none;
  transition:opacity .6s var(--ease), transform 1.1s cubic-bezier(.2,.85,.3,1)}
.js .croad.in .croad-bus img{animation:cFloat 3.4s ease-in-out infinite; --amp:4px; --tw:.6deg}
.croad-mid{position:relative; text-align:center}
.croad-mid p{font-size:.88rem; color:var(--kamen); line-height:1.5}
.croad-mid p b{color:var(--noc); font-weight:600}
.croad-line{display:block; width:100%; height:3px; margin-bottom:12px; border-radius:99px;
  background-image:linear-gradient(90deg, var(--rub) 0 14px, transparent 14px 26px);
  background-size:26px 3px; background-repeat:repeat-x}
.js .croad.in .croad-line{animation:roadDash 1.1s linear infinite}
@keyframes roadDash{to{background-position-x:-26px}}
.croad-pejzaz{width:clamp(150px,20vw,270px)}
.croad-pejzaz img{display:block; width:100%; height:auto}
@media (prefers-reduced-motion:reduce){
  .js .croad.in .croad-line, .js .croad.in .croad-bus img{animation:none}
}

/* ═══ 4 · BROJKE ════════════════════════════════════════════════════════ */
.cnum{position:relative; overflow:hidden}
.cnum > .wrap{padding-top:clamp(50px,6vw,78px); padding-bottom:clamp(54px,6.4vw,86px)}
.cnum-head{text-align:center}
.cnum-grid{position:relative; display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(14px,1.8vw,24px); margin-top:clamp(28px,3.4vw,44px)}
.cnum-grid::before{content:""; position:absolute; z-index:0; left:8%; right:8%; top:50%;
  height:2px; transform:translateY(-50%);
  background-image:linear-gradient(90deg, rgba(124,191,178,.55) 0 7px, transparent 7px 17px);
  background-size:17px 2px}
.ci{position:relative; z-index:1; display:flex; flex-direction:column; align-items:center;
  gap:5px; padding:clamp(20px,2.2vw,28px) 14px; border-radius:99px;
  background:var(--krecnjak); border:1px solid var(--linija); box-shadow:var(--shadow-1);
  transition:transform .4s var(--ease), border-color .4s var(--ease)}
.js .ci.in:hover{transform:translateY(-5px); border-color:var(--zaliv)}
.ci-ico{width:30px; height:30px; color:var(--c, var(--duboko))}
.ci-ico svg{width:100%; height:100%}
.ci b{font-family:var(--display); font-weight:700; font-size:clamp(1.7rem,2.6vw,2.15rem);
  line-height:1; color:var(--noc)}
.ci span{font-size:.8rem; line-height:1.4; color:var(--kamen); text-align:center; max-width:16ch}
.cnum .d-hw{position:absolute; right:3%; top:11%; z-index:2; max-width:12ch; text-align:center;
  font-size:clamp(1rem,1.5vw,1.28rem); transform:rotate(5deg); color:var(--zlato)}
.cnum .d-list{left:-2%; bottom:-6%; width:clamp(66px,7vw,104px); --rot:-14deg; --dur:9s; opacity:.85}

/* ═══ 5 · ŠTA POKRIVA ═══════════════════════════════════════════════════ */
.cincl{position:relative; overflow:hidden}
.cincl > .wrap{padding-top:var(--sp-sec); padding-bottom:var(--sp-sec)}
.cincl-head{text-align:center; max-width:60ch; margin-inline:auto}
.cincl-head h2{margin-top:12px}
.cincl-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(16px,2vw,26px); margin-top:var(--sp-blk)}
.ib{position:relative; border-radius:var(--r-xl); padding:clamp(24px,2.8vw,36px);
  background:var(--ib-bg); border:1px solid var(--ib-line)}
.ib-yes{--ib-bg:var(--zaliv-soft); --ib-line:#CBE2DC; --ib-ink:var(--duboko)}
.ib-no{--ib-bg:var(--oleander-soft); --ib-line:#F0D6C8; --ib-ink:var(--oleander-ink)}
.ib-head{display:flex; gap:13px; align-items:center}
.ib-head .ico{flex:0 0 auto; width:38px; height:38px; display:grid; place-items:center;
  border-radius:12px; background:rgba(255,255,255,.68); color:var(--ib-ink)}
.ib-head .ico svg{width:21px; height:21px}
.ib-head h3{font-size:clamp(1.15rem,1.7vw,1.4rem); color:var(--noc)}
.ib ul{list-style:none; margin:clamp(16px,1.8vw,22px) 0 0; padding:0; display:grid; gap:12px}
.ib li{display:flex; gap:11px; align-items:flex-start; font-size:.92rem; line-height:1.55;
  color:var(--kamen)}
.ib li b{color:var(--noc); font-weight:600}
.ib li .m{flex:0 0 auto; width:20px; height:20px; margin-top:2px; border-radius:50%;
  display:grid; place-items:center; background:var(--ib-ink); color:#fff}
.ib li .m svg{width:12px; height:12px}
.ib-sub{display:flex; gap:12px; align-items:flex-start; margin-top:18px; padding:15px 17px;
  border-radius:var(--r-md); background:rgba(255,255,255,.62)}
.ib-sub svg{flex:0 0 auto; width:22px; height:22px; color:var(--ib-ink); margin-top:2px}
.ib-sub b{display:block; font-family:var(--display); font-weight:700; font-size:.95rem;
  color:var(--noc)}
.ib-sub span{font-size:.85rem; line-height:1.5; color:var(--kamen)}
.cincl .d-grana2{right:-4%; top:18%; width:clamp(78px,8.4vw,126px); --rot:12deg; --dur:11s; opacity:.85}
.cincl .d-grancica{left:-4%; bottom:10%; width:clamp(64px,7vw,100px); --rot:-16deg; --dur:9.4s; opacity:.85}
.cincl .d-sunce-o{left:4%; top:8%; width:clamp(44px,5vw,68px); opacity:.55; --dur:52s}

/* ═══ 6 · UREDNIČKI BLOK ════════════════════════════════════════════════ */
.ced{position:relative; overflow:hidden}
.ced > .wrap{padding-top:var(--sp-sec); padding-bottom:var(--sp-sec)}
.ced-in{position:relative; display:grid; grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  gap:clamp(28px,4.4vw,64px); align-items:center}
.ced-fig{position:relative; margin:0}
.ced-fig-in{display:block; position:relative; z-index:1; overflow:hidden; background:var(--pijesak-2);
  border-radius:46% 54% 52% 48% / 54% 46% 54% 46%; aspect-ratio:1/.76;
  box-shadow:0 30px 56px -34px rgba(23,50,46,.5)}
.ced-fig-in img{width:100%; height:100%; object-fit:cover; display:block;
  transition:transform 1.8s cubic-bezier(.16,.7,.2,1)}
.ced-fig:hover .ced-fig-in img{transform:scale(1.06)}
.ced-fig .hw{position:absolute; z-index:2; left:-5%; top:6%; max-width:8ch;
  font-size:clamp(1.1rem,1.7vw,1.4rem); transform:rotate(-9deg); color:var(--noc)}
.ced h2{margin-top:12px; max-width:15ch}
.ced .pcopy{max-width:46ch}
.ced .more{margin-top:var(--sp-el)}
.ced .d-biljka{right:-1%; bottom:0; width:clamp(92px,10vw,150px); --rot:4deg; --dur:10s}
.ced .d-listovi{left:42%; top:-4%; width:clamp(56px,6vw,88px); --rot:-12deg; --dur:8.6s; opacity:.8}
.ced-note{position:absolute; z-index:2; right:5.5%; top:5%; max-width:150px; padding:14px 18px;
  border-radius:16px; transform:rotate(3.5deg); background:var(--krecnjak);
  border:1px solid var(--linija); box-shadow:0 14px 30px -18px rgba(23,50,46,.5);
  font-family:"Caveat", var(--display); font-weight:600; font-size:1.12rem; line-height:1.25;
  color:var(--noc)}

/* ═══ 7 · ZAVRŠNI POZIV ═════════════════════════════════════════════════ */
.ccta{position:relative; overflow:hidden}
.ccta > .wrap{padding-top:clamp(40px,5vw,64px); padding-bottom:clamp(58px,7vw,92px)}
.ccta-panel{position:relative; overflow:hidden; border-radius:var(--r-xl);
  background:var(--deep-bg); color:var(--deep-fg);
  padding:clamp(30px,4vw,54px) clamp(26px,4vw,56px);
  padding-left:clamp(26px,11vw,158px)}
.ccta-in{position:relative; z-index:2; display:grid;
  grid-template-columns:minmax(0,1fr) 1px minmax(0,.92fr) auto;
  gap:clamp(20px,3vw,40px); align-items:center}
.ccta h2{font-size:clamp(1.65rem,3vw,2.35rem); line-height:1.08; color:var(--deep-fg); max-width:12ch}
.ccta-rule{align-self:stretch; background:var(--deep-line)}
.ccta p{font-size:.96rem; line-height:1.6; color:var(--deep-muted); max-width:34ch}
.ccta .d-sun{left:-2.5%; bottom:-26%; width:clamp(104px,11.5vw,152px); opacity:.95; --amp:8px; --dur:9s}
/* sunce se okrene kad pređeš preko cijelog panela
   (rotacija ide na <img>, da ne gazi plutanje koje je na omotaču) */
.ccta .d-sun img{transform-origin:50% 50%;
  transition:transform 1.1s cubic-bezier(.22,.8,.24,1)}
.ccta-panel:hover .d-sun img,
.ccta-panel:focus-within .d-sun img{transform:rotate(22deg)}
@media (prefers-reduced-motion:reduce){
  .ccta-panel:hover .d-sun img, .ccta-panel:focus-within .d-sun img{transform:none}
}
.ccta .d-kite{right:20%; top:6%; width:clamp(42px,4.6vw,64px); --rot:-8deg; --dur:5.6s}
.ccta .d-zv{right:7%; bottom:16%; width:22px; --rot:10deg; --dur:3.8s}
.ccta .btn-sun{white-space:nowrap}

/* ═══ RESPONSIVE ════════════════════════════════════════════════════════ */
@media (max-width:1180px){
  .cfoto .hw{left:0; top:-7%}
  .ced-fig .hw{left:0}
}
@media (max-width:1040px){
  .cgrid{grid-template-columns:1fr; gap:clamp(64px,9vw,86px)}
  .pk{max-width:460px; margin-inline:auto; width:100%}
  .cnum-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cnum-grid::before{display:none}
  .ccta-panel{padding-left:clamp(26px,4vw,56px)}
  .ccta-in{grid-template-columns:1fr; gap:22px}
  .ccta-rule{display:none}
  .ccta p{max-width:46ch}
  .ccta .d-sun{left:auto; right:-4%; bottom:-30%; opacity:.5}
  .ccta .d-kite{right:6%}
  .chero .hw-stack{right:2.5%; top:auto; bottom:7%}
  .chero .d-star{display:none}
}
@media (max-width:920px){
  .chero-in{grid-template-columns:1fr; gap:clamp(26px,4.5vw,40px)}
  .cfoto{max-width:400px; margin-inline:auto}
  .chero-copy{text-align:left}
  .chero .hw-stack, .chero .d-cloud{display:none}
  .chero .d-book{bottom:auto; top:clamp(150px,19vh,200px); right:2%; width:76px}
  .chero .d-sun{right:14%; top:clamp(84px,10vh,116px); width:92px}
  .chero .d-kite{right:1%; top:clamp(54px,6.4vh,78px); width:56px}
  .ced-in{grid-template-columns:1fr; gap:clamp(26px,4.5vw,40px)}
  .ced-fig{max-width:400px; margin-inline:auto}
  .ced-note{right:2%; top:1%}
}
@media (max-width:760px){
  .cincl-grid{grid-template-columns:1fr}
  .croad-in{grid-template-columns:1fr; gap:16px; text-align:center}
  .croad-bus{width:120px; margin-inline:auto}
  .croad-pejzaz{width:200px; margin-inline:auto}
  .cincl .d-grana2, .cincl .d-grancica, .cprices .d-grana, .cprices .d-cvijet,
  .cprices .d-zv1, .cprices .d-zv2, .cnum .d-hw, .ced .d-listovi{display:none}
  .ced .d-biljka{width:84px; right:0}
}
@media (max-width:560px){
  .cnum-grid{grid-template-columns:1fr; gap:12px}
  .ci{border-radius:var(--r-lg); flex-direction:row; text-align:left; gap:14px; padding:16px 20px}
  .ci span{text-align:left; max-width:none}
  .cfoto .hw{left:0; top:-6%; max-width:16ch}
  .cfoto .heart{display:none}
  .ced-note{position:static; transform:none; margin-bottom:16px; max-width:none; display:inline-block}
  .chero .d-leaf{width:64px}
}