/* Runda 2 prijedloga (R1–R14) — vrijedi SAMO kad <html> ima klasu .r2 (prekidač na pregledu).
   Na www.psrd-poljud.com se ne prikazuje dok Ino ne odluči (docs/ODLUKE.md §4a). */

.r2-only, .hero > img.r2-slika, .kron-r2 { display: none; }
html.r2 .r2-only { display: block; }
html.r2 a.r2-only, html.r2 .izbornik a.r2-only { display: inline-block; }
html.r2 .mob-izb a.st.r2-only { display: block; }

/* ---------- R1 Naslovna: velika slika lučice iz zraka + dva gumba ---------- */
html.r2 .hero { height: min(86vh, 760px); min-height: 560px; }
html.r2 .hero > img:not(.r2-slika) { display: none; }
html.r2 .hero > img.r2-slika { display: block; animation: r2zum 22s ease-out both; }
@keyframes r2zum { from { transform: scale(1.08); } to { transform: scale(1); } }
html.r2 .hero::after { background: linear-gradient(90deg, rgba(13,43,78,.88) 0%, rgba(13,43,78,.6) 42%, rgba(13,43,78,.08) 78%), linear-gradient(0deg, rgba(13,43,78,.55) 0%, rgba(13,43,78,0) 45%); }
html.r2 .hero-in { height: 100%; display: flex; flex-direction: column; justify-content: center; padding-top: 0; }
html.r2 .hero h1 { width: 680px; max-width: 100%; font-size: 58px; line-height: 1.04; letter-spacing: -.5px; }
html.r2 .hero-crta { margin: 26px 0 24px; }
html.r2 .hero p { width: 540px; max-width: 100%; font-size: 17px; line-height: 1.55; }
html.r2 .hero-gumbi { display: flex; gap: 14px; margin-top: 34px; }
html.r2 .hero .gumb { margin-top: 0; width: auto; height: 50px; padding: 0 26px; }
html.r2 .hero .hero-g2 { display: inline-flex; order: -1; }
html.r2 .hero .hero-g1 { background: rgba(255,255,255,.08); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.75); }
html.r2 .hero .hero-g1:hover { background: rgba(255,255,255,.16); }
html.r2 .hero-dolje { display: grid; place-items: center; position: absolute; z-index: 2; left: 50%; bottom: 22px; width: 40px; height: 40px; margin-left: -20px; border-radius: 50%; color: #fff; background: rgba(255,255,255,.12); animation: r2skok 2.2s ease-in-out infinite; }
html.r2 .hero-dolje svg { width: 16px; height: 16px; }
@keyframes r2skok { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(6px); } }
@media (prefers-reduced-motion: reduce) { html.r2 .hero > img.r2-slika, html.r2 .hero-dolje { animation: none; } }

/* ---------- R2 Blok "Član si? Sve na jednom mjestu" ---------- */
html.r2 .clan-blok { position: relative; padding: 84px 0 88px; color: #fff; background: var(--navy) url('/slike/e9191c_d6508fa1bd444a42bc0cd43dfc7fc0eb~mv2.jpg') center / cover; }
html.r2 .clan-blok::before { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(13,43,78,.93), rgba(13,43,78,.86)); }
.clan-blok-in { position: relative; width: 1094px; max-width: calc(100% - 40px); margin: 0 auto; }
.clan-blok .nad { color: #8fc1e8; }
.clan-blok .nasl { color: #fff; font-size: 30px; line-height: 1.2; }
.cb-mreza { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin-top: 34px; }
.cb { display: flex; flex-direction: column; padding: 24px 22px 22px; border-radius: 16px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: transform .25s, background .25s; }
.cb:hover { transform: translateY(-4px); background: rgba(255,255,255,.1); }
.cb-ik { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 10px; background: rgba(74,144,196,.25); color: #9fcbee; }
.cb-ik svg { width: 20px; height: 20px; }
.cb h3 { margin-top: 16px; font-size: 17px; line-height: 1.3; }
.cb p { margin-top: 8px; font-size: 13px; line-height: 1.55; color: #c6d4e3; }
.cb .cb-iban { margin-top: 10px; font-size: 15px; font-weight: 700; letter-spacing: .6px; color: #fff; }
.cb-rokovi { margin: 10px 0 0; padding: 0; list-style: none; display: grid; gap: 7px; }
.cb-rokovi li { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; color: #c6d4e3; border-bottom: 1px dashed rgba(255,255,255,.14); padding-bottom: 6px; }
.cb-rokovi b { color: #fff; white-space: nowrap; order: 2; }
.cb-dno { display: flex; align-items: center; gap: 12px; margin-top: auto; padding-top: 18px; }
.cb-dno > a { font-size: 13px; font-weight: 700; color: #8fc1e8; }
.cb-dno > a span { display: inline-block; transition: transform .2s; }
.cb-dno > a:hover span { transform: translateX(4px); }
.cb-dno .cb-gumb { display: inline-flex; align-items: center; gap: 6px; padding: 10px 14px; border-radius: 8px; background: var(--plava); color: #fff; }
.cb-dno .cb-gumb:hover { background: #3b7fb2; }
html.r2 .clan-blok .kopiraj { display: inline-flex; border-color: rgba(255,255,255,.3); background: transparent; color: #fff; margin-left: 0; }
html.r2 .clan-blok .kopiraj:hover { background: #fff; color: var(--navy); }

/* ---------- R5 Za članove: važni rokovi ---------- */
html.r2 .rokovi { padding: 50px 0 0; }
.rokovi-in { width: 797px; max-width: calc(100% - 40px); margin: 0 auto; }
.rokovi-in > .nad, .rokovi-in > .nasl { margin-left: -3px; }
.rokovi-mreza { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 24px; }
.rok { padding: 20px 20px 18px; border-radius: 14px; background: #fff; border: 1px solid #e3e8ee; box-shadow: inset 0 3px 0 var(--plava), 0 6px 18px rgba(13,43,78,.05); }
.rok b { display: block; font-size: 26px; line-height: 1.1; color: var(--navy); letter-spacing: -.3px; }
.rok .rok-n { display: block; margin-top: 8px; font-size: 11px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; color: var(--plava-tamna); }
.rok p { margin-top: 6px; font-size: 12px; line-height: 1.5; color: var(--tekst); }

/* ---------- R6 Za članove: dokumenti i obrasci ---------- */
html.r2 .dokumenti { padding: 10px 0 40px; }
.dokumenti-in { width: 797px; max-width: calc(100% - 40px); margin: 0 auto; }
.dokumenti-in > .nad, .dokumenti-in > .nasl { margin-left: -3px; }
.dok-mreza { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 24px; }
html.r2 .dok-mreza .kartica-strelica { width: auto; margin: 0; min-height: 58px; height: auto; padding: 12px 18px; }
.dok-cta { display: flex; flex-direction: column; gap: 4px; padding: 14px 20px; border-radius: 12px; background: var(--plava); color: #fff; transition: transform .2s, box-shadow .2s; }
.dok-cta:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(13,43,78,.22); }
.dok-cta b { font-size: 14px; }
.dok-cta span { font-size: 12px; line-height: 1.45; color: #e3edf6; }
.dok-cta em { font-style: normal; font-size: 12px; font-weight: 700; }

/* ---------- R7 Za članove: mini izbornik koji ostaje gore ---------- */
html.r2 .podizbornik { display: flex; position: sticky; top: 80px; z-index: 40; justify-content: center; gap: 8px; padding: 10px 20px; background: rgba(255,255,255,.95); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border-bottom: 1px solid #edf1f5; overflow-x: auto; scrollbar-width: none; }
.podizbornik::-webkit-scrollbar { display: none; }
.podizbornik a { flex: none; padding: 8px 16px; border-radius: 999px; font-size: 13px; font-weight: 700; color: var(--navy); background: #eef3f8; transition: background .2s, color .2s; }
.podizbornik a.akt { background: var(--navy); color: #fff; }
html.r2 #rokovi, html.r2 #placanje, html.r2 #dokumenti, html.r2 #pitanja, html.r2 #dozvole { scroll-margin-top: 150px; }

/* ---------- R8 Kontakt (gumbi samo na mobitelu) ---------- */
.kontakt-akcije { display: none !important; }

/* ---------- R10 Podnožje: stupac Za članove ---------- */
html.r2 .podn-gore { grid-template-columns: 430px 190px 190px 1fr; }
.podn-clan a { display: block; font-size: 12px; line-height: 24px; }
.podn-clan a:hover { color: #fff; }

/* ---------- R11 Facebook objave ---------- */
html.r2 .fb-blok { padding: 70px 0; background: #f4f7fa; }
.fb-blok-in { width: 1094px; max-width: calc(100% - 40px); margin: 0 auto; display: grid; grid-template-columns: 1fr 500px; gap: 60px; align-items: center; }
.fb-blok p.uvod { margin-top: 14px; font-size: 15px; line-height: 1.6; color: var(--tekst); }
.fb-blok .gumb { margin-top: 24px; height: 46px; padding: 0 22px; background: #1877f2; }
.fb-okvir { min-height: 560px; border-radius: 16px; background: #fff; box-shadow: 0 10px 30px rgba(13,43,78,.10); overflow: hidden; display: grid; place-items: center; text-align: center; }
.fb-okvir iframe { display: block; width: 500px; max-width: 100%; height: 600px; border: 0; }
.fb-ucitaj { display: grid; justify-items: center; gap: 12px; padding: 30px; border: 0; background: none; color: var(--navy); cursor: pointer; }
.fb-ucitaj img { width: 56px; height: 56px; }
.fb-ucitaj b { font-size: 16px; }
.fb-ucitaj span { font-size: 12px; color: var(--siva); max-width: 280px; line-height: 1.5; }
.fb-ucitaj em { font-style: normal; display: inline-flex; padding: 10px 18px; border-radius: 8px; background: #1877f2; color: #fff; font-weight: 700; font-size: 13px; }

/* ---------- R12 Stranica Sportski ribolov ---------- */
.sr-uvod { padding: 60px 0 30px; }
.sr-in { width: 1094px; max-width: calc(100% - 40px); margin: 0 auto; }
.sr-uvod .sr-in { display: grid; grid-template-columns: 1.1fr 1fr; gap: 56px; align-items: center; }
.sr-uvod p { margin-top: 14px; font-size: 15px; line-height: 1.7; color: var(--tekst); }
.sr-uvod img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 18px; box-shadow: 0 16px 40px rgba(13,43,78,.18); }
.sr-brojke { background: var(--navy); color: #fff; }
.sr-brojke .sr-in { display: grid; grid-template-columns: repeat(4, 1fr); text-align: center; padding: 34px 0; }
.sr-brojke b { display: block; font-size: 32px; line-height: 1.2; }
.sr-brojke span { display: block; margin-top: 4px; font-size: 11px; letter-spacing: 1px; text-transform: uppercase; color: #c6d4e3; }
.sr-sek { padding: 64px 0; }
.sr-sek.sivo { background: #f4f7fa; }
.sr-kartice { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 28px; }
.sr-k { padding: 24px; border-radius: 16px; background: #fff; border: 1px solid #e3e8ee; box-shadow: 0 6px 18px rgba(13,43,78,.05); }
.sr-k h3 { font-size: 17px; color: var(--navy); }
.sr-k p { margin-top: 8px; font-size: 13px; line-height: 1.6; color: var(--tekst); }
.sr-k .ikona-dok { width: 40px; height: 40px; margin-bottom: 14px; }
.sr-k .ikona-dok svg { width: 20px; height: 20px; }
.sr-kat { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.sr-kat span { padding: 5px 11px; border-radius: 999px; background: #e9f2f9; color: var(--plava-tamna); font-size: 11px; font-weight: 700; }
.sr-dva { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.sr-dva img { width: 100%; aspect-ratio: 16 / 11; object-fit: cover; border-radius: 18px; }
.sr-dva p { margin-top: 14px; font-size: 15px; line-height: 1.7; color: var(--tekst); }
.sr-dva .gumb { margin-top: 22px; height: 46px; padding: 0 22px; }
.sr-hssrm { display: flex; align-items: center; gap: 24px; margin-top: 28px; padding: 26px 28px; border-radius: 16px; background: #fff; border: 1px solid #e3e8ee; }
.sr-hssrm b { display: block; font-size: 17px; color: var(--navy); }
.sr-hssrm p { margin-top: 6px; font-size: 13px; line-height: 1.6; color: var(--tekst); }
.sr-hssrm .gumb { flex: none; margin-left: auto; height: 44px; padding: 0 20px; }
.sr-napomena { margin-top: 18px; padding: 12px 16px; border-radius: 10px; background: #fff8e6; border: 1px dashed #e8b923; color: #7a5200; font-size: 12px; line-height: 1.5; }

/* ---------- R13 Novi timeline (O nama) ---------- */
html.r2 .kron .kron-in { display: none; }
html.r2 .kron-r2 { display: block; width: 1094px; max-width: calc(100% - 40px); margin: 0 auto; }
.kt { position: relative; margin-top: 40px; }
.kt::before { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 2px; margin-left: -1px; background: linear-gradient(var(--plava), #c8dced); }
.kt-st { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; padding-bottom: 34px; }
.kt-st::before { content: ''; position: absolute; left: 50%; top: 16px; width: 14px; height: 14px; margin-left: -7px; border-radius: 50%; background: #fff; border: 3px solid var(--plava); z-index: 1; }
.kt-st.kljucno::before { background: var(--plava); box-shadow: 0 0 0 6px rgba(74,144,196,.18); }
.kt-kar { padding: 18px 22px; border-radius: 14px; background: #fff; border: 1px solid #e3e8ee; box-shadow: 0 6px 18px rgba(13,43,78,.06); }
.kt-st:nth-child(odd) .kt-kar { grid-column: 1; text-align: right; }
.kt-st:nth-child(odd) .kt-sl { grid-column: 2; }
.kt-st:nth-child(even) .kt-kar { grid-column: 2; grid-row: 1; }
.kt-st:nth-child(even) .kt-sl { grid-column: 1; grid-row: 1; justify-self: end; }
.kt-god { font-size: 24px; font-weight: 700; color: var(--plava); letter-spacing: -.3px; }
.kt-kar b { display: block; margin-top: 4px; font-size: 16px; color: var(--navy); }
.kt-kar p { margin-top: 6px; font-size: 13px; line-height: 1.55; color: var(--tekst); }
.kt-sl img { width: 300px; max-width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 12px; box-shadow: 0 8px 22px rgba(13,43,78,.14); }
.kt-sl small { display: block; margin-top: 6px; font-size: 11px; color: var(--siva); }

/* =====================================================================
   MOBITEL — najbitnije (Ino 05.10.2026.)
   ===================================================================== */
@media (max-width: 750px) {
  /* R1 */
  html.r2 .hero { height: 84svh; min-height: 520px; max-height: 760px; }
  /* Ino 06.10.: naslov gore, rečenica "Čuvamo more…" i gumbi DOLJE (Ino: rečenica ostaje dolje), lučica u sredini */
  html.r2 .hero::after { background: linear-gradient(180deg, rgba(13,43,78,.9) 0%, rgba(13,43,78,.7) 30%, rgba(13,43,78,.1) 45%, rgba(13,43,78,.15) 55%, rgba(13,43,78,.85) 75%, rgba(13,43,78,.95) 100%); }
  html.r2 .hero-in { justify-content: flex-start; padding: calc(26*var(--u)) calc(20*var(--u)) calc(26*var(--u)); }
  html.r2 .hero p { margin-top: auto; }
  html.r2 .hero h1 { width: auto; font-size: calc(27*var(--u)); line-height: 1.08; }
  html.r2 .hero p { width: auto; font-size: calc(13*var(--u)); }
  html.r2 .hero-crta { margin: calc(14*var(--u)) 0; }
  html.r2 .hero-gumbi { flex-direction: row; gap: calc(10*var(--u)); margin-top: calc(22*var(--u)); }
  html.r2 .hero .gumb { flex: 1 1 0; width: auto; min-width: 0; height: calc(44*var(--u)); padding: 0 calc(8*var(--u)); font-size: calc(10*var(--u)); letter-spacing: calc(.6*var(--u)); white-space: nowrap; }
  html.r2 .hero .gumb::after { margin-left: calc(-2*var(--u)); }
  html.r2 .hero-dolje { bottom: calc(14*var(--u)); }

  /* R2 */
  html.r2 .clan-blok { padding: calc(46*var(--u)) 0 calc(50*var(--u)); }
  .clan-blok-in { width: auto; max-width: none; padding: 0 calc(20*var(--u)); }
  .clan-blok .nasl { font-size: calc(20*var(--u)); }
  .cb-mreza { grid-template-columns: 1fr; gap: calc(12*var(--u)); margin-top: calc(22*var(--u)); }
  .cb { padding: calc(18*var(--u)); border-radius: calc(14*var(--u)); }
  .cb h3 { font-size: calc(15*var(--u)); margin-top: calc(12*var(--u)); }
  .cb p, .cb-rokovi li, .cb-dno > a { font-size: calc(12*var(--u)); }
  .cb .cb-iban { font-size: calc(14*var(--u)); }

  /* R3 */
  html.r2 .kartice3 { grid-template-columns: 1fr; gap: calc(10*var(--u)); }
  html.r2 .kartice3 .nat { display: flex; }
  html.r2 .kartica-link { height: calc(54*var(--u)); font-size: calc(10*var(--u)); gap: calc(12*var(--u)); padding-left: calc(16*var(--u)); }
  html.r2 .kartica-link .ikona-dok { display: grid; width: calc(32*var(--u)); height: calc(32*var(--u)); }


  /* R5 */
  html.r2 .rokovi { padding: calc(30*var(--u)) 0 0; }
  .rokovi-in { width: auto; max-width: none; padding: 0 calc(20*var(--u)); }
  .rokovi-in > .nad, .rokovi-in > .nasl { margin-left: 0; }
  .rokovi-mreza { grid-template-columns: 1fr; gap: calc(10*var(--u)); margin-top: calc(16*var(--u)); }
  .rok { display: grid; grid-template-columns: calc(92*var(--u)) 1fr; column-gap: calc(12*var(--u)); align-items: center; padding: calc(14*var(--u)) calc(16*var(--u)); }
  .rok b { grid-row: 1 / 3; font-size: calc(19*var(--u)); }
  .rok .rok-n { margin-top: 0; font-size: calc(10*var(--u)); }
  .rok p { margin-top: calc(3*var(--u)); font-size: calc(11*var(--u)); }

  /* R6 */
  html.r2 .dokumenti { padding: calc(10*var(--u)) 0 calc(30*var(--u)); }
  .dokumenti-in { width: auto; max-width: none; padding: 0 calc(20*var(--u)); }
  .dokumenti-in > .nad, .dokumenti-in > .nasl { margin-left: 0; }
  .dok-mreza { grid-template-columns: 1fr; gap: calc(10*var(--u)); margin-top: calc(16*var(--u)); }
  html.r2 .dok-mreza .kartica-strelica { font-size: calc(11*var(--u)); min-height: calc(50*var(--u)); }

  /* R7 */
  html.r2 .podizbornik { top: calc(72*var(--u)); justify-content: flex-start; padding: calc(8*var(--u)) calc(14*var(--u)); gap: calc(6*var(--u)); }
  .podizbornik a { padding: calc(7*var(--u)) calc(13*var(--u)); font-size: calc(11*var(--u)); }
  html.r2 #rokovi, html.r2 #placanje, html.r2 #dokumenti, html.r2 #pitanja, html.r2 #dozvole { scroll-margin-top: calc(130*var(--u)); }

  /* R8 */
  html.r2 .ki-ik { display: grid; width: calc(38*var(--u)); height: calc(38*var(--u)); flex: none; }
  html.r2 .ki { display: flex; gap: calc(12*var(--u)); align-items: center; }
  html.r2 .kontakt-info { padding-left: 0; margin-top: calc(24*var(--u)); }
  html.r2 .kontakt .fb { position: static; display: inline-block; margin-top: calc(18*var(--u)); }
  html.r2 .kontakt-akcije { display: grid !important; grid-template-columns: 1fr 1fr; gap: calc(10*var(--u)); margin-top: calc(6*var(--u)); }
  html.r2 .kontakt-akcije .gumb { height: calc(46*var(--u)); font-size: calc(12*var(--u)); letter-spacing: 0; text-transform: none; }
  .gumb-svijetli { background: #eef3f8 !important; color: var(--navy) !important; box-shadow: none !important; }

  /* R9 mobilni izbornik */
  html.r2 .mob-izb { align-items: stretch; padding: 86px 24px 30px; }
  html.r2 .mob-izb a.st { padding: 15px 4px; border-bottom: 1px solid #edf1f5; font-size: 17px; font-weight: 700; color: var(--navy); text-transform: none; letter-spacing: 0; }
  html.r2 .mob-izb a.st.akt { color: var(--plava); }
  html.r2 .mob-izb .mob-izb-akcije { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 22px; }
  .mob-izb-akcije a { display: flex; align-items: center; justify-content: center; gap: 8px; height: 48px; border-radius: 10px; background: var(--plava); color: #fff; font-weight: 700; font-size: 14px; }
  .mob-izb-akcije a + a { background: #eef3f8; color: var(--navy); }
  .mob-izb-akcije svg { width: 17px; height: 17px; }
  html.r2 .mob-izb .fb { align-self: center; }

  /* R10 */
  html.r2 .podn-gore { grid-template-columns: 1fr 1fr; }
  html.r2 .podn-clan { grid-column: 1 / -1; }
  html.r2 .podn-clan h4 { margin-top: calc(30*var(--u)); }
  .podn-clan a { display: inline-block; margin-right: calc(14*var(--u)); font-size: calc(10*var(--u)); line-height: calc(22*var(--u)); }

  /* R11 */
  html.r2 .fb-blok { padding: calc(40*var(--u)) 0; }
  .fb-blok-in { width: auto; max-width: none; padding: 0 calc(20*var(--u)); grid-template-columns: 1fr; gap: calc(20*var(--u)); }
  .fb-blok p.uvod { font-size: calc(13*var(--u)); }
  .fb-okvir { min-height: calc(340*var(--u)); }
  .fb-okvir iframe { width: 100%; height: 520px; }

  /* R12 */
  .sr-uvod { padding: calc(28*var(--u)) 0 calc(20*var(--u)); }
  .sr-in { width: auto; max-width: none; padding: 0 calc(20*var(--u)); }
  .sr-uvod .sr-in { grid-template-columns: 1fr; gap: calc(20*var(--u)); }
  .sr-uvod p, .sr-dva p { font-size: calc(13*var(--u)); }
  .sr-brojke .sr-in { grid-template-columns: 1fr 1fr; row-gap: calc(20*var(--u)); padding: calc(26*var(--u)) calc(20*var(--u)); }
  .sr-brojke b { font-size: calc(22*var(--u)); }
  .sr-brojke span { font-size: calc(9*var(--u)); }
  .sr-sek { padding: calc(36*var(--u)) 0; }
  .sr-kartice { grid-template-columns: 1fr; gap: calc(12*var(--u)); }
  .sr-k { padding: calc(18*var(--u)); }
  .sr-dva { grid-template-columns: 1fr; gap: calc(20*var(--u)); }
  .sr-hssrm { flex-direction: column; align-items: flex-start; gap: calc(14*var(--u)); padding: calc(18*var(--u)); }
  .sr-hssrm .gumb { margin-left: 0; }

  /* R13 */
  html.r2 .kron-r2 { width: auto; max-width: none; padding: 0 calc(20*var(--u)); }
  .kt::before { left: calc(9*var(--u)); }
  .kt-st { grid-template-columns: 1fr; gap: calc(10*var(--u)); padding: 0 0 calc(22*var(--u)) calc(30*var(--u)); }
  .kt-st::before { left: calc(9*var(--u)); top: calc(14*var(--u)); }
  .kt-st:nth-child(n) .kt-kar { grid-column: 1; grid-row: auto; text-align: left; }
  .kt-st:nth-child(n) .kt-sl { grid-column: 1; grid-row: auto; justify-self: start; }
  .kt-god { font-size: calc(18*var(--u)); }
  .kt-kar { padding: calc(14*var(--u)) calc(16*var(--u)); }
  .kt-kar b { font-size: calc(14*var(--u)); }
  .kt-kar p { font-size: calc(12*var(--u)); }
  .kt-sl img { width: 100%; }

}

/* =====================================================================
   05.10.2026. — Inove odluke nakon runde 2
   ===================================================================== */

/* Blok Za članove: samo "Novi broj ili adresa?" */
html.r2 .clan-blok { padding: 64px 0; }
.cb-jedan { display: flex; align-items: center; gap: 28px; padding: 34px 40px; border-radius: 18px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.cb-jedan .cb-ik { flex: none; width: 60px; height: 60px; border-radius: 14px; }
.cb-jedan .cb-ik svg { width: 28px; height: 28px; }
.cb-tekst .nasl { margin-top: 6px; font-size: 26px; }
.cb-tekst p { margin-top: 8px; font-size: 15px; line-height: 1.6; color: #c6d4e3; max-width: 560px; }
.cb-jedan .cb-gumb { flex: none; margin-left: auto; display: inline-flex; align-items: center; gap: 10px; height: 50px; padding: 0 26px; border-radius: 10px; background: var(--plava); color: #fff; font-size: 14px; font-weight: 700; box-shadow: 0 8px 20px rgba(0,0,0,.25); transition: transform .2s, background .2s; }
.cb-jedan .cb-gumb:hover { background: #3b7fb2; transform: translateY(-2px); }
.cb-jedan .cb-gumb span { transition: transform .2s; }
.cb-jedan .cb-gumb:hover span { transform: translateX(4px); }

/* Novosti: poveznica na Facebook umjesto ugrađenog feeda */
.fb-vise { display: flex; align-items: center; justify-content: center; gap: 10px; width: max-content; margin: 40px auto 10px; padding: 12px 20px; border-radius: 999px; background: #eef3f8; color: var(--navy); font-size: 14px; font-weight: 700; transition: background .2s; }
.fb-vise:hover { background: #dfe9f3; }
.fb-vise img { width: 22px; height: 22px; }

/* Ujednačeno sa stranicom Sportski ribolov: ista širina, veličina teksta, boja trake */
@media (min-width: 751px) {
  html.r2 .brojke, html.r2 .brojke.plave { height: auto; background: var(--navy); }
  html.r2 .brojke-in, html.r2 .brojke.plave .brojke-in { width: 1094px; max-width: calc(100% - 40px); padding: 34px 0; }
  html.r2 .brojke b, html.r2 .brojke.plave b { font-size: 32px; line-height: 1.2; }
  html.r2 .brojke span, html.r2 .brojke.plave span { margin-top: 4px; font-size: 11px; letter-spacing: 1px; color: #c6d4e3; }

  html.r2 :is(.prica-in, .misija-in, .arhiva-in, .dok-in, .galerija-in, .upute-in, .faq-in, .rokovi-in, .dokumenti-in, .vijesti-in, .onama-in, .blog-in, .kontakt-in, .kamere-in, .prijava-in) { width: 1094px; max-width: calc(100% - 40px); }
  html.r2 :is(.misija-in, .galerija-in, .upute-in, .rokovi-in, .dokumenti-in) > :is(.nad, .nasl) { margin-left: 0; }
  html.r2 :is(.prica, .misija, .kron, .dok, .galerija, .upute, .faq, .kontakt, .onama, .vijesti) { padding-top: 64px; padding-bottom: 64px; }

  html.r2 .prica-in { grid-template-columns: 1.1fr 1fr; column-gap: 56px; align-items: start; }
  html.r2 .prica .tekst { padding-top: 14px; }
  html.r2 :is(.prica .tekst p, .onama p, .sr-uvod p) { font-size: 15px; line-height: 1.7; }
  html.r2 :is(.prica .tekst p, .onama .tekst p) + p { margin-top: 14px; }
  html.r2 .prica-slike { padding-top: 56px; grid-template-columns: 1fr 1.6fr; gap: 12px; }
  html.r2 .prica-slike .s1 { height: 300px; border-radius: 18px; }
  html.r2 .prica-slike .s2, html.r2 .prica-slike .s3 { height: 200px; border-radius: 14px; }

  html.r2 .onama-in { grid-template-columns: 1.1fr 1fr; column-gap: 56px; }
  html.r2 .onama-slika { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 18px; margin-top: 60px; }

  html.r2 .mk h3 { font-size: 17px; letter-spacing: .2px; }
  html.r2 .mk p { font-size: 14px; line-height: 1.6; color: #a9b8c9; }

  html.r2 :is(.okvir-plavi, .opis-uvod, .upozorenje, .pomoc p, .rok p, .faq-odg, .dok-cta span) { font-size: 14px; line-height: 1.6; }
  html.r2 .pomoc b { font-size: 15px; }
  html.r2 .faq-st button { font-size: 15px; min-height: 64px; }
  html.r2 .faq-odg { color: var(--tekst); }
  html.r2 .kontakt { width: auto; }
  html.r2 .kontakt-in { grid-template-columns: 1fr 1fr; column-gap: 56px; }
  html.r2 .ki b { font-size: 15px; }
  html.r2 .politika-in { font-size: 15px; line-height: 1.7; }
  html.r2 .vk p { font-size: 14px; }
}

@media (max-width: 750px) {
  html.r2 .brojke, html.r2 .brojke.plave { height: auto; background: var(--navy); }
  html.r2 .brojke-in, html.r2 .brojke.plave .brojke-in { padding: calc(26*var(--u)) calc(20*var(--u)); row-gap: calc(20*var(--u)); }
  html.r2 .brojke b, html.r2 .brojke.plave b { font-size: calc(22*var(--u)); line-height: 1.2; }
  html.r2 .brojke span, html.r2 .brojke.plave span { margin-top: calc(3*var(--u)); font-size: calc(9*var(--u)); letter-spacing: 1px; color: #c6d4e3; }
  html.r2 :is(.prica .tekst p, .onama p, .mk p, .okvir-plavi, .opis-uvod, .faq-odg, .politika-in, .pomoc p, .upozorenje) { font-size: calc(13*var(--u)); line-height: 1.65; }
  html.r2 .prica-slike { padding: calc(26*var(--u)) 0 0; grid-template-columns: 1fr 1fr; gap: calc(8*var(--u)); }
  html.r2 .prica-slike .s1 { height: calc(170*var(--u)); border-radius: calc(12*var(--u)); }
  html.r2 .prica-slike .s2, html.r2 .prica-slike .s3 { height: calc(110*var(--u)); border-radius: calc(10*var(--u)); }
  html.r2 .mk h3 { font-size: calc(15*var(--u)); }

  .cb-jedan { flex-direction: column; align-items: flex-start; gap: calc(14*var(--u)); padding: calc(22*var(--u)) calc(20*var(--u)); border-radius: calc(14*var(--u)); }
  .cb-jedan .cb-ik { width: calc(46*var(--u)); height: calc(46*var(--u)); }
  .cb-tekst .nasl { font-size: calc(20*var(--u)); }
  .cb-tekst p { font-size: calc(13*var(--u)); }
  .cb-jedan .cb-gumb { margin-left: 0; width: 100%; justify-content: center; height: calc(46*var(--u)); font-size: calc(13*var(--u)); }
  html.r2 .clan-blok { padding: calc(36*var(--u)) 0; }
  .fb-vise { margin: calc(26*var(--u)) auto calc(6*var(--u)); font-size: calc(12*var(--u)); }
}

/* ---------- Timeline B: kompaktni (redovi: godina | tekst | sličica) ---------- */
html[data-tl="b"] .kt { margin-top: 30px; }
html[data-tl="b"] .kt::before { left: 158px; }
html[data-tl="b"] .kt-st { grid-template-columns: 1fr 140px; gap: 24px; align-items: center; padding: 18px 0; border-bottom: 1px solid #edf1f5; }
html[data-tl="b"] .kt-st::before { left: 158px; top: 50%; margin-top: -7px; }
html[data-tl="b"] .kt-st:nth-child(n) .kt-kar { grid-column: 1; grid-row: 1; text-align: left; display: grid; grid-template-columns: 138px 1fr; column-gap: 52px; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: none; }
html[data-tl="b"] .kt-god { grid-row: 1 / 3; font-size: 20px; text-align: right; align-self: center; white-space: nowrap; }
html[data-tl="b"] .kt-kar b { margin-top: 0; }
html[data-tl="b"] .kt-kar p { margin-top: 2px; }
html[data-tl="b"] .kt-st:nth-child(n) .kt-sl { grid-column: 2; grid-row: 1; justify-self: end; }
html[data-tl="b"] .kt-sl img { width: 140px; aspect-ratio: 3 / 2; border-radius: 10px; box-shadow: 0 4px 12px rgba(13,43,78,.12); }
html[data-tl="b"] .kt-sl small { display: none; }

@media (max-width: 750px) {
  html[data-tl="b"] .kt::before { left: calc(9*var(--u)); }
  html[data-tl="b"] .kt-st { grid-template-columns: 1fr calc(64*var(--u)); gap: calc(12*var(--u)); padding: calc(14*var(--u)) 0 calc(14*var(--u)) calc(30*var(--u)); }
  html[data-tl="b"] .kt-st::before { left: calc(9*var(--u)); }
  html[data-tl="b"] .kt-st:nth-child(n) .kt-kar { grid-template-columns: 1fr; }
  html[data-tl="b"] .kt-god { grid-row: auto; text-align: left; font-size: calc(15*var(--u)); }
  html[data-tl="b"] .kt-sl img { width: calc(64*var(--u)); border-radius: calc(8*var(--u)); }
}

.samo-pregled { display: none; }
html.pregled .samo-pregled { display: block; }

/* ---------- Ispravci za mobitel (Ino 05.10.2026.) ---------- */
@media (max-width: 750px) {
  /* timeline: kružić u ravnini s godinom */
  html[data-tl="b"] .kt-st { align-items: start; }
  html[data-tl="b"] .kt-st::before { top: calc(17*var(--u)); margin-top: 0; }
  html[data-tl="b"] .kt-sl { padding-top: calc(4*var(--u)); }
  /* slika uvijek ispod teksta, kao u uvodu */
  .sr-dva > img { order: 2; }
  /* kartice natjecanja sve iste širine */
  .sr-sek .vk-mreza { justify-items: stretch; }
  .sr-sek .vk { width: auto; }
  /* upute za plaćanje: ne od ruba do ruba */
  html.r2 .dva-stupca { margin: calc(30*var(--u)) 0 0; }
  html.r2 .bijeli-okvir, html.r2 .dva-stupca .bijeli-okvir:last-child { padding: 0; }
  /* "Niste sigurni…": tekst i gumbi unutar okvira */
  html.r2 .pomoc { display: block; padding: calc(16*var(--u)) calc(16*var(--u)) calc(18*var(--u)); background: #e9f2f9; border: 1px solid #c8dced; border-radius: calc(12*var(--u)); box-shadow: none; }
  html.r2 .pomoc-gumbi { flex-direction: column; gap: calc(8*var(--u)); }
  html.r2 .pomoc-gumbi a { justify-content: center; height: calc(42*var(--u)); font-size: calc(12*var(--u)); }
}

/* =====================================================================
   Uplatnica s barkodom (/uplatnica) — Ino 05.10.2026.
   ===================================================================== */
.uplatnica-cta { display: flex; align-items: center; gap: 16px; margin: 22px 0 6px; padding: 18px 22px; border-radius: 14px; background: var(--navy); color: #fff; box-shadow: 0 10px 26px rgba(13,43,78,.22); transition: transform .2s, box-shadow .2s; }
.uplatnica-cta:hover { transform: translateY(-2px); box-shadow: 0 16px 34px rgba(13,43,78,.28); }
.uplatnica-cta .ikona-dok { width: 44px; height: 44px; flex: none; background: rgba(255,255,255,.12); color: #9fcbee; }
.uplatnica-cta .ikona-dok svg { width: 22px; height: 22px; }
.uplatnica-cta b { display: block; font-size: 16px; }
.uplatnica-cta small { display: block; margin-top: 3px; font-size: 13px; color: #c6d4e3; }
.uplatnica-cta em { margin-left: auto; flex: none; font-style: normal; padding: 10px 16px; border-radius: 8px; background: var(--plava); font-weight: 700; font-size: 13px; }

.uplatnica { padding: 56px 0 70px; }
.uplatnica-in { width: 1094px; max-width: calc(100% - 40px); margin: 0 auto; display: grid; grid-template-columns: 1fr 460px; gap: 48px; align-items: start; }
.u-forma { display: grid; gap: 16px; }
.u-korak { display: grid; grid-template-columns: 34px 1fr; gap: 14px; padding: 20px 22px; border-radius: 14px; background: #fff; border: 1px solid #e3e8ee; box-shadow: 0 4px 14px rgba(13,43,78,.04); }
.u-korak > b { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--navy); color: #fff; font-size: 14px; }
.u-forma label, .u-nasl { display: block; font-size: 14px; font-weight: 700; color: var(--navy); }
.u-nasl.mala { margin-top: 14px; font-size: 13px; color: var(--tekst); }
.u-forma i { font-style: normal; font-weight: 400; color: var(--siva); }
.u-forma input:not([type=checkbox]):not([type=radio]) { display: block; width: 100%; height: 46px; margin-top: 8px; padding: 0 14px; border: 1px solid #d5dde6; border-radius: 10px; font: inherit; font-size: 16px; color: var(--tamni); outline: none; transition: border-color .2s, box-shadow .2s; }
.u-forma input:focus { border-color: var(--plava); box-shadow: 0 0 0 3px rgba(74,144,196,.18); }
.u-forma small { display: block; margin-top: 8px; font-size: 13px; line-height: 1.5; color: var(--tekst); }
.u-forma small a { color: var(--plava); font-weight: 700; }
.u-plocice { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.u-plocica { position: relative; cursor: pointer; }
.u-plocica input { position: absolute; opacity: 0; pointer-events: none; }
.u-plocica span { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 10px; border: 1.5px solid #d5dde6; background: #fff; font-size: 14px; font-weight: 700; color: var(--navy); transition: all .15s; }
.u-plocica.mala span { padding: 8px 14px; font-size: 13px; }
.u-plocica input:checked + span { border-color: var(--plava); background: #e9f2f9; color: var(--plava-tamna); }
.u-plocica input[type=checkbox]:checked + span::before { content: '✓'; }
.u-plocica input:focus-visible + span { box-shadow: 0 0 0 3px rgba(74,144,196,.25); }
.u-dodatno { padding: 16px 22px; border-radius: 14px; background: #f7f9fb; border: 1px solid #e3e8ee; }
.u-dodatno summary { cursor: pointer; font-size: 14px; font-weight: 700; color: var(--navy); }
.u-dodatno[open] summary { margin-bottom: 12px; }
.u-dodatno label { margin-top: 12px; }
.u-kvacica { display: flex !important; align-items: center; gap: 10px; font-weight: 400 !important; }
.u-kvacica input { width: 18px; height: 18px; }

.u-izlaz { position: sticky; top: 100px; }
.u-karta { border-radius: 18px; background: #fff; border: 1px solid #e3e8ee; box-shadow: 0 14px 36px rgba(13,43,78,.10); overflow: hidden; }
.u-zag { padding: 16px 20px; background: var(--navy); color: #fff; }
.u-zag b { display: block; font-size: 17px; }
.u-zag span { font-size: 12px; color: #c6d4e3; }
.u-prazno { padding: 30px 22px; text-align: center; font-size: 14px; line-height: 1.6; color: var(--siva); }
.u-barkod { display: none; padding: 18px 20px 6px; text-align: center; }
.u-izlaz.spremno .u-barkod { display: block; }
.u-barkod canvas { max-width: 100%; height: auto; }
.u-barkod small { display: block; margin-top: 6px; font-size: 12px; color: var(--siva); }
.u-podaci { padding: 6px 20px 16px; }
.u-red { display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid #edf1f5; }
.u-red:last-child { border-bottom: 0; }
.u-lbl { grid-column: 1; font-size: 11px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; color: var(--siva); }
.u-vr { grid-column: 1; font-size: 14px; font-weight: 700; color: var(--navy); word-break: break-word; }
.u-red .kopiraj { grid-column: 2; grid-row: 1 / 3; display: inline-flex; margin: 0; }
.u-izlaz:not(.spremno) .u-red .kopiraj { visibility: hidden; }
.u-poruka p { margin-top: 12px; padding: 12px 14px; border-radius: 10px; background: #fff8e6; border: 1px solid #f0dfae; font-size: 13px; line-height: 1.55; color: #7a5200; }
.u-poruka p.u-greska { background: #fef3f2; border-color: #f5c6c2; color: #b42318; }
.u-gumbi { display: flex; gap: 10px; margin-top: 14px; }
.u-gumbi .gumb { flex: 1; height: 46px; border: 0; cursor: pointer; letter-spacing: .3px; }
.u-izlaz:not(.spremno) .u-gumbi { opacity: .45; pointer-events: none; }
.u-sitno { margin-top: 12px; font-size: 12px; line-height: 1.5; color: var(--siva); text-align: center; }
html.r2 .uplatnica .gumb-svijetli { background: #eef3f8; color: var(--navy); box-shadow: none; }

@media print {
  body * { visibility: hidden !important; }
  .uplatnica-ispis, .uplatnica-ispis * { visibility: visible !important; }
  .uplatnica-ispis { position: absolute; left: 0; top: 0; width: 100%; box-shadow: none; border: 1px solid #ccc; }
  .uplatnica-ispis .kopiraj { display: none !important; }
}

@media (max-width: 750px) {
  .uplatnica-cta { flex-wrap: wrap; gap: calc(12*var(--u)); padding: calc(16*var(--u)); margin: calc(20*var(--u)) 0 calc(6*var(--u)); }
  .uplatnica-cta b { font-size: calc(14*var(--u)); }
  .uplatnica-cta small { font-size: calc(12*var(--u)); }
  .uplatnica-cta em { margin-left: 0; width: 100%; text-align: center; }
  .uplatnica { padding: calc(24*var(--u)) 0 calc(40*var(--u)); }
  .uplatnica-in { width: auto; max-width: none; padding: 0 calc(16*var(--u)); grid-template-columns: 1fr; gap: calc(20*var(--u)); }
  .u-korak { grid-template-columns: calc(28*var(--u)) 1fr; gap: calc(10*var(--u)); padding: calc(16*var(--u)) calc(14*var(--u)); }
  .u-korak > b { width: calc(28*var(--u)); height: calc(28*var(--u)); font-size: calc(12*var(--u)); }
  .u-forma label, .u-nasl { font-size: calc(13*var(--u)); }
  .u-plocica span { padding: calc(9*var(--u)) calc(12*var(--u)); font-size: calc(12*var(--u)); }
  .u-izlaz { position: static; }
  .u-gumbi { flex-direction: column; }
  .u-gumbi .gumb { flex: none; width: 100%; height: calc(48*var(--u)); font-size: calc(12*var(--u)); }
}

/* =====================================================================
   Galerija: slike se vrte (Ino 05.10.2026.)
   ===================================================================== */
.lb { background: rgba(8,20,36,.96); }
.lb-okvir { position: absolute; inset: 60px 80px 70px; display: grid; grid-template: minmax(0, 1fr) / minmax(0, 1fr); place-items: center; overflow: hidden; }
/* Ino 06.10.: uvijek se vidi CIJELA slika (prije su portretne slike izlazile iz okvira i bile odrezane) */
.lb img { width: auto; height: auto; max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 6px; opacity: 0; transform: translateX(var(--od, 0)) scale(.985); transition: opacity .45s ease, transform .45s ease; box-shadow: 0 20px 60px rgba(0,0,0,.45); }
.lb img.vidi { opacity: 1; transform: none; }
/* polagano povećanje u prikazu je maknuto: odrezalo bi rubove slike */
.lb button { color: #fff; }
.lb .lijevo, .lb .desno { width: 52px; height: 52px; border-radius: 50%; background: rgba(255,255,255,.1); transition: background .2s; }
.lb .lijevo:hover, .lb .desno:hover { background: rgba(255,255,255,.22); }
.lb-traka { position: absolute; left: 0; right: 0; bottom: 18px; display: flex; justify-content: center; align-items: center; gap: 16px; color: #c6d4e3; font-size: 13px; font-weight: 700; }
.lb .lb-play { position: static; width: auto; height: 34px; padding: 0 16px; border-radius: 999px; background: rgba(255,255,255,.12); font: 700 13px/1 'DM Sans', system-ui, sans-serif; }
.lb.vrti .lb-play { background: var(--plava); }

.album-vrh { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.album-prikaz { flex: none; height: 40px; padding: 0 18px; border: 0; border-radius: 999px; background: var(--navy); color: #fff; font: 700 13px/1 'DM Sans', system-ui, sans-serif; cursor: pointer; transition: transform .2s, background .2s; }
.album-prikaz:hover { background: var(--plava); transform: translateY(-1px); }

.klizac.teci .klizac-traka { overflow: hidden; display: block; scroll-snap-type: none; -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.teci-unutra { display: flex; gap: 10px; width: max-content; animation: teci linear infinite; }
.klizac.teci:hover .teci-unutra, .klizac.teci:active .teci-unutra { animation-play-state: paused; }
.klizac.teci .klizac-sl, .klizac.teci .klizac-pr { display: none !important; }
.klizac.teci button img { transition: transform .4s; }
.klizac.teci button:hover img { transform: scale(1.04); }
@keyframes teci { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .teci-unutra { animation: none; } .klizac.teci .klizac-traka { overflow-x: auto; } }

@media (max-width: 750px) {
  .lb-okvir { inset: 56px 8px 80px; }
  .lb .lijevo, .lb .desno { width: 44px; height: 44px; bottom: 16px; }
  .lb-traka { bottom: 22px; }
  .album-vrh { align-items: center; padding-right: calc(20*var(--u)); }
  .album-prikaz { height: calc(34*var(--u)); padding: 0 calc(12*var(--u)); font-size: calc(11*var(--u)); }
  .teci-unutra { gap: calc(8*var(--u)); }
}
.sr-podnaslov { margin-top: 10px; font-size: 15px; line-height: 1.6; color: var(--tekst); }
@media (max-width: 750px) { .sr-podnaslov { font-size: calc(13*var(--u)); } .sr-sek .vk-mreza + .fb-vise { margin-top: calc(20*var(--u)); } }