/* FK Vojvodina – crveno + belo + zlatni detalji.
   Šema: svaka sekcija prepisuje CSS promenljive (--bk*, --cream, --mute, --line, --gold*), pa se isti
   stilovi iz home.css ponašaju kao „svetla” (bela) ili „crvena” sekcija. */

:root {
	--ink: #1a0e0f;
	--red: #e2001c;
	--red-dk: #8f1318;
	--red-deep: #6d0c11;
	--gold-real: #d3a85d;
}

/* ---------- šeme ---------- */
/* svetla: bela pozadina, tamno-crven tekst, crveni akcenat */
.ck-home, .ck-news, .ck-school, .ck-fan, .ck-ticker, .ck-dock, .ck-sub, .ck-footer__sponsors, .ck-mc .ck-tabs {
	--bk: #ffffff; --bk2: #f7f2f0; --bk3: #efe7e5;
	--cream: var(--ink); --mute: rgba(26, 14, 15, .64); --line: rgba(226, 0, 28, .2);
	--gold: var(--red); --gold-hi: #f0263a; --gold-lo: var(--red-dk);
}
.ck-home { background: #fff; color: var(--ink); }
.ck-school, .ck-fan { --bk: #f7f2f0; --bk2: #f7f2f0; --bk3: #ffffff; }

/* crvena: puna crvena, bela slova, zlatan akcenat */
.ck-header, .ck-hero, .ck-mc, .ck-mm {
	--bk: var(--red); --bk2: #b01d23; --bk3: var(--red-dk);
	--cream: #ffffff; --mute: rgba(255, 255, 255, .82); --line: rgba(255, 255, 255, .3);
	--gold: var(--gold-real); --gold-hi: #f0d49a; --gold-lo: #a98543;
}
/* tamno crvena: istorija, footer, loader, donja traka */
.ck-history, .ck-footer, .ck-loader, .ck-tabbar {
	--bk: var(--red-dk); --bk2: #7d0f14; --bk3: var(--red-deep);
	--cream: #ffffff; --mute: rgba(255, 255, 255, .8); --line: rgba(255, 255, 255, .26);
	--gold: var(--gold-real); --gold-hi: #f0d49a; --gold-lo: #a98543;
}
/* u footeru je traka sa sponzorima bela */
.ck-footer .ck-footer__sponsors { background: #fff; }

/* ---------- dugmad ---------- */
.ck-btn--gold, .ck-btn--gold:hover { color: #fff; background: linear-gradient(135deg, #f0263a, var(--red) 55%, var(--red-dk)); }
.ck-header .ck-btn--gold, .ck-hero .ck-btn--gold, .ck-mc .ck-btn--gold, .ck-history .ck-btn--gold, .ck-footer .ck-btn--gold { color: var(--ink); background: linear-gradient(135deg, #f0d49a, var(--gold-real) 55%, #a98543); }
.ck-btn--ghost { border-color: var(--line); color: var(--cream); }
.ck-btn--ghost:hover { border-color: var(--gold); color: var(--gold); }
.ck-hero .ck-btn--ghost, .ck-history .ck-btn--ghost { border-color: rgba(255, 255, 255, .6); color: #fff; }
.ck-hero .ck-btn--ghost:hover, .ck-history .ck-btn--ghost:hover { background: #fff; color: var(--red); border-color: #fff; }

/* ---------- header ---------- */
.ck-header, .ck-header.is-scrolled { background: var(--red); border-top-color: var(--gold-real); box-shadow: 0 12px 28px -14px rgba(60, 5, 8, .75); backdrop-filter: none; }
.ck-nav > ul > li > a { color: #fff; }
.ck-nav > ul > li > a:hover, .ck-nav li.is-open > a { color: #f0d49a; }
.ck-lang, .ck-lang a { color: rgba(255, 255, 255, .8); }
.ck-lang a.is-active, .ck-lang a:hover { color: #f0d49a; }
.ck-sub { background: #fff; border-top-color: var(--line); border-bottom: 4px solid var(--gold-real); }
.ck-sub__title { color: var(--red); }
.ck-nav .ck-sub a { color: var(--ink); }
.ck-nav .ck-sub a:hover { color: var(--red); }

/* ---------- hero ---------- */
.ck-hero { background: linear-gradient(180deg, #7d0f14, #a81a20 70%, #8f1318); }
.ck-hero__video { background: transparent; }
.ck-hero__img { opacity: .55; mix-blend-mode: luminosity; filter: contrast(1.05); }
.ck-hero__shade { background: linear-gradient(90deg, rgba(109, 12, 17, .94) 0%, rgba(160, 22, 29, .74) 48%, rgba(226, 0, 28, .38) 100%), linear-gradient(0deg, #8f1318 0%, transparent 30%, rgba(109, 12, 17, .45) 100%); }
.ck-hero__glow { background: radial-gradient(circle, rgba(240, 212, 154, .28), transparent 70%); }
.ck-display em { color: #f0d49a; }
.ck-hero__lead { color: rgba(255, 255, 255, .88); }

/* naredna utakmica: bela kartica, crveni datum */
.ck-dock { background: #fff; border-color: var(--gold-real); box-shadow: 0 40px 70px -28px rgba(40, 3, 6, .8); }
.ck-dock__date { background: linear-gradient(140deg, #f0263a, var(--red) 55%, var(--red-dk)); color: #fff; }
.ck-dock__date, .ck-dock__date .ck-dock__tag { color: #fff; }
.ck-dock__tag i { background: var(--gold-real); animation: none; }
.ck-dock__teams .ck-dock__team { color: var(--ink); }
.ck-dock__team.is-us b { color: var(--red); }
.ck-dock__teams em { border-color: var(--gold-real); color: var(--red); }
.ck-count div { background: #f7f2f0; border-color: rgba(226, 0, 28, .2); }
.ck-count b { color: var(--ink); }
.ck-count i { color: var(--gold-real); }
.ck-dock__meta { color: var(--mute); }

/* ---------- traka „Najnovije” ---------- */
.ck-ticker { margin-top: 0; padding-top: 52px; background: #fff; }
.ck-ticker__label { color: var(--red); }
.ck-ticker__viewport { background: var(--gold-real); color: var(--ink); }
.ck-ticker__track i { background: var(--red); }

/* ---------- vesti (bela) ---------- */
.ck-news { background: #fff; }
.ck-news .ck-title, .ck-school .ck-title, .ck-fan .ck-title { color: var(--ink); }
.ck-title em { color: var(--red); }
.ck-meta em { background: rgba(226, 0, 28, .1); color: var(--red); }
.ck-meta { color: rgba(26, 14, 15, .55); }
.ck-lead:hover .ck-lead__body > b { color: var(--red); }
.ck-list a:hover { background: linear-gradient(90deg, rgba(226, 0, 28, .08), transparent); }
.ck-list__go { color: var(--red); }
.ck-list a:hover .ck-list__go { background: var(--red); color: #fff; }
.ck-more { color: var(--red); }
.ck-more:hover { color: var(--red-dk); }

/* ---------- match centar (crvena sa belom karticom) ---------- */
.ck-mc { background: var(--red); }
.ck-mc .ck-kicker, .ck-mc .ck-title em { color: #f0d49a; }
.ck-mc .ck-title { color: #fff; }
.ck-mc .ck-more { color: #fff; }
.ck-mc .ck-more:hover { color: #f0d49a; }
.ck-form { color: #fff; }
.ck-mc .ck-tabs { background: #fff; color: var(--ink); box-shadow: 0 40px 70px -34px rgba(60, 5, 8, .7); border-top: 4px solid var(--gold-real); }
.ck-mc .ck-tabs .ck-more { color: var(--red); }
.ck-tabs__nav { background: #f1e9e7; }
.ck-tabs__nav button { color: rgba(26, 14, 15, .6); }
.ck-tabs__nav button[aria-selected="true"] { background: linear-gradient(135deg, #f0263a, var(--red)); color: #fff; }
.ck-match { border-bottom-color: rgba(226, 0, 28, .12); }
.ck-match:hover { background: rgba(226, 0, 28, .04); }
.ck-match__team.is-us b { color: var(--red); }
.ck-match__score i { color: var(--gold-real); }
.ck-match__badge { background: #f1e9e7; border-color: rgba(226, 0, 28, .2); }
.ck-table th { color: var(--red); border-bottom-color: rgba(226, 0, 28, .25); }
.ck-table td { border-bottom-color: rgba(226, 0, 28, .1); }
.ck-table tr.is-us td { background: rgba(226, 0, 28, .1); color: var(--red); }

/* ---------- igrači: crvena sekcija, bele kartice ---------- */
.ck-squad {
  --bk: var(--red); --bk2: var(--red-dk); --bk3: var(--red-deep);
  --cream: #fff; --mute: rgba(255,255,255,.8); --line: rgba(255,255,255,.3);
  --gold: #fff; --gold-hi: #fff; --gold-lo: #fff;
  background: var(--red); color: #fff;
}
.ck-squad .ck-title, .ck-squad .ck-title em, .ck-squad .ck-kicker { color: #fff; }
.ck-squad .ck-more { color: var(--gold-real); }
.ck-squad .ck-more:hover { color: #f0d49a; }
.ck-squad .ck-pl {
  isolation: isolate; width: clamp(280px, 28vw, 370px); aspect-ratio: 4 / 5.4;
  padding: 24px; border: 1px solid rgba(255,255,255,.6); border-radius: 12px;
  color: var(--ink); background: linear-gradient(145deg, #fff 35%, #eee7e5);
  box-shadow: 0 12px 30px rgba(92,0,12,.12);
}
.ck-squad .ck-pl::before {
  inset: 0 0 100px; opacity: 1; z-index: 0;
  background: linear-gradient(130deg, transparent 55%, rgba(226,0,28,.07) 55% 72%, transparent 72%);
}
.ck-squad .ck-pl::after, .ck-squad .ck-pl.has-img::after {
  content: ''; position: absolute; inset: auto 0 0; height: 104px;
  z-index: 2; opacity: 1; background: #fff; border-top: 3px solid var(--red);
}
.ck-squad .ck-pl .ck-pl__img {
  left: 0; top: 0; bottom: 104px; width: 100%; height: calc(100% - 104px);
  max-width: none; object-fit: cover; object-position: center top; translate: none; z-index: 1;
  filter: drop-shadow(0 10px 12px rgba(60,10,16,.14));
}
.ck-squad .ck-pl .ck-pl__ini {
  position: absolute; z-index: 3; left: 16px; top: 16px; translate: none;
  display: grid; place-items: center; min-width: 64px; height: 72px; padding: 4px 12px;
  font: 900 54px/1 var(--f-display); letter-spacing: -.03em;
  color: #fff; background: var(--red); border-radius: 4px 4px 14px 4px;
  -webkit-text-stroke: 0; text-shadow: none; transform: none;
}
.ck-squad .ck-pl .ck-pl__name { z-index: 3; gap: 6px; padding-right: 36px; text-shadow: none; }
.ck-squad .ck-pl .ck-pl__name small { color: #705358; font-size: 11px; letter-spacing: .14em; }
.ck-squad .ck-pl .ck-pl__name b { color: var(--ink); font-size: clamp(23px, 2.2vw, 30px); letter-spacing: -.025em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ck-squad .ck-pl .ck-pl__go {
  z-index: 3; right: 18px; bottom: 26px; width: 32px; height: 32px;
  color: var(--red); background: #fff; border-color: rgba(226,0,28,.25);
}
.ck-squad .ck-pl:hover, .ck-squad .ck-pl:focus-visible { transform: translateY(-6px); border-color: #fff; box-shadow: 0 18px 36px rgba(92,0,12,.24); }
.ck-squad .ck-pl:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
.ck-squad .ck-pl:hover .ck-pl__go { background: var(--red); color: #fff; border-color: var(--red); }
.ck-squad .ck-roster__progress { background: rgba(211,168,93,.3); }
.ck-squad .ck-roster__progress i { background: var(--gold-real); }
.ck-squad .ck-roster__btns button { color: var(--gold-real); border-color: var(--gold-real); }
.ck-squad .ck-roster__btns button:hover { background: var(--gold-real); color: var(--red); border-color: var(--gold-real); }
@media (max-width: 640px) {
  .ck-squad .ck-pl { width: min(78vw, 330px); padding: 20px; }
  .ck-squad .ck-pl .ck-pl__ini { min-width: 56px; height: 64px; font-size: 46px; }
}
@media (prefers-reduced-motion: reduce) {
  .ck-squad .ck-pl, .ck-squad .ck-pl__img, .ck-squad .ck-pl__go { transition: none; }
}

/* ---------- istorija i trofeji (tamno crvena, zlatni detalji) ---------- */
.ck-history { background: radial-gradient(ellipse at 85% 10%, rgba(240, 212, 154, .14), transparent 55%), linear-gradient(160deg, #a81a20, #7d0f14); border-block: 0; }
.ck-history .ck-title { color: #fff; }
.ck-history .ck-title em, .ck-history .ck-kicker { color: #f0d49a; }
.ck-history__text { color: rgba(255, 255, 255, .85); }
.ck-history__img { box-shadow: 0 30px 60px -30px rgba(30, 2, 4, .8); outline: 2px solid rgba(240, 212, 154, .5); outline-offset: 6px; }
.ck-history__img figcaption { -webkit-text-stroke-color: #f0d49a; }
.ck-timeline { border-top-color: rgba(240, 212, 154, .45); }
.ck-timeline li::before { background: #f0d49a; box-shadow: 0 0 0 5px #8f1318; }
.ck-timeline b { color: #fff; }
.ck-timeline span { color: rgba(255, 255, 255, .8); }

/* ---------- omladinska škola (svetlo siva) ---------- */
.ck-school { background: #f7f2f0; border-color: rgba(226, 0, 28, .15); }
.ck-acc__item { color: #fff; border-color: rgba(226, 0, 28, .3); }
.ck-acc__body > span:not(.ck-readmore) { color: rgba(255, 255, 255, .85); }
.ck-acc__big { -webkit-text-stroke-color: rgba(240, 212, 154, .6); }
.ck-acc .ck-readmore { color: #f0d49a; }
.ck-acc__item.is-open, .ck-acc__item:hover { border-color: var(--gold-real); }

/* ---------- fan zona (svetla, kartice sa slikama) ---------- */
.ck-fan { background: #fff; }
.ck-fcard { color: #fff; border-color: rgba(226, 0, 28, .3); }
.ck-fcard h3 { color: #fff; }
.ck-fcard__extra { color: #f0d49a; }
.ck-fcard::after { background: linear-gradient(0deg, rgba(109, 12, 17, .96) 8%, rgba(143, 19, 24, .62) 55%, rgba(143, 19, 24, .12)); }
.ck-fcard--shop::after { background: linear-gradient(0deg, rgba(109, 12, 17, .97) 18%, rgba(143, 19, 24, .6) 60%, rgba(143, 19, 24, .05)); }
.ck-fan__social { border-color: rgba(226, 0, 28, .25); background: #f7f2f0; }
.ck-fan__social > span { color: var(--red); }
.ck-fan__social a { color: var(--red); border-color: rgba(226, 0, 28, .3); }
.ck-fan__social a:hover { background: var(--red); color: #fff; border-color: var(--red); }

/* ---------- footer ---------- */
.ck-footer { background: radial-gradient(ellipse at 85% 100%, rgba(240, 212, 154, .12), transparent 55%), linear-gradient(180deg, #8f1318, #6d0c11); border-top: 0; }
.ck-footer::before { background: linear-gradient(90deg, #a98543, #f0d49a, var(--gold-real), #a98543); }
.ck-footer__sponsors { border-bottom: 1px solid rgba(226, 0, 28, .15); }
.ck-footer__sp-label { color: var(--red); border-right-color: rgba(226, 0, 28, .25); }
.ck-footer__sponsors img { filter: none; opacity: 1; }
.ck-footer__sponsors a:hover img { transform: scale(1.07); }
.ck-footer__cols h4 { color: #f0d49a; border-bottom-color: #f0d49a; }
.ck-footer__cols a { color: rgba(255, 255, 255, .8); }
.ck-footer__cols a:hover { color: #f0d49a; }
.ck-footer__logo small { color: #f0d49a; }
.ck-footer__soc a { color: #f0d49a; border-color: rgba(240, 212, 154, .4); }
.ck-footer__soc a:hover { background: #f0d49a; color: var(--red-dk); border-color: #f0d49a; }
.ck-footer__bar b { color: #f0d49a; }
.ck-footer__bar { border-top-color: rgba(255, 255, 255, .2); }

/* ---------- mobilno ---------- */
.ck-mm { background: var(--red-dk); }
.ck-mm__list > li { border-bottom-color: rgba(255, 255, 255, .22); }
.ck-tabbar { background: rgba(109, 12, 17, .97); border-top-color: var(--gold-real); }
.ck-tabbar a, .ck-tabbar button { color: rgba(255, 255, 255, .75); }
.ck-tabbar a.is-active, .ck-tabbar [aria-expanded="true"] { color: #f0d49a; }

/* ---------- loader ---------- */
.ck-loader { background: radial-gradient(ellipse at 50% 55%, rgba(240, 212, 154, .2), transparent 60%), linear-gradient(160deg, #a81a20, #6d0c11); }
.ck-loader .ck-century__num { background-image: linear-gradient(180deg, #f6e2b3 0%, #d3a85d 38%, rgba(211, 168, 93, .3) 70%, transparent 92%); }

/* ---------- grb (portret) i naslovi ---------- */
.ck-brand { width: 66px; }
.ck-brand img { width: 66px; top: 12px; filter: drop-shadow(0 8px 12px rgba(40, 3, 6, .5)); }
.ck-header.is-scrolled .ck-brand img { width: 50px; top: 8px; }
.ck-footer__logo img { width: 76px; height: auto; filter: none; box-shadow: none; }
.ck-ph { background-size: auto 52%, auto, auto, auto; }
.ck-display { font-size: clamp(52px, 9.6vw, 152px); }
@media (max-width: 640px) {
	.ck-brand { width: 54px; }
	.ck-brand img { width: 54px; top: 8px; }
	.ck-header.is-scrolled .ck-brand img { width: 42px; top: 6px; }
}

.ck-hero .ck-display, .ck-hero { color: #fff; }
.ck-hero .ck-display em { color: #f0d49a; }
.ck-mc, .ck-mc .ck-title { color: #fff; }
.ck-history, .ck-footer { color: #fff; }

/* ---------- hero: traka utakmica (prethodne · naredna · buduće) ---------- */
.ck-brand img, .ck-header.is-scrolled .ck-brand img { filter: none; }
.ck-hero { justify-content: flex-start; padding-top: calc(var(--hh) + 70px); padding-bottom: 420px; }
.ck-strip { position: absolute; left: 0; right: 0; bottom: 0; padding: 22px 0 22px; background: linear-gradient(0deg, rgba(60, 5, 8, .94), rgba(60, 5, 8, .6) 70%, transparent); text-align: center; }
.ck-strip__count { display: grid; justify-items: center; gap: 8px; margin-bottom: 18px; }
.ck-strip__count > span { font: 800 13px/1 var(--f-body); letter-spacing: .26em; text-transform: uppercase; color: #f0d49a; }
.ck-strip__count .ck-count { padding: 0; gap: 10px; align-items: center; }
.ck-strip__count .ck-count div { background: none; border: 0; min-width: 64px; padding: 0; }
.ck-strip__count .ck-count b { font: 900 clamp(44px, 5vw, 66px)/1 var(--f-display); color: #fff; }
.ck-strip__count .ck-count small { color: rgba(255, 255, 255, .8); font-size: 11px; }
.ck-strip__count .ck-count i { font: 900 40px/1 var(--f-display); color: #f0d49a; margin-bottom: 16px; }
.ck-strip__track { display: flex; align-items: stretch; gap: 16px; overflow-x: auto; overflow-y: visible; scroll-snap-type: x mandatory; padding: 26px max(20px, calc((100vw - 1280px) / 2)) 10px; scrollbar-width: none; cursor: grab; text-align: left; }
.ck-strip__track::-webkit-scrollbar { display: none; }
.ck-strip__track.is-dragging { cursor: grabbing; scroll-snap-type: none; user-select: none; }
.ck-sm { position: relative; flex: none; width: clamp(300px, 30vw, 420px); scroll-snap-align: center; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; padding: 18px 14px; border-radius: 14px; background: #fff; color: var(--ink); box-shadow: 0 16px 34px -18px rgba(30, 2, 4, .7); border: 2px solid transparent; opacity: .88; }
.ck-sm--next { opacity: 1; border-color: #3d6bff; border-color: var(--gold-real); box-shadow: 0 0 0 4px rgba(240, 212, 154, .35), 0 20px 40px -16px rgba(30, 2, 4, .8); }
.ck-sm__tab { position: absolute; left: 50%; top: -2px; translate: -50% -100%; padding: 6px 22px 5px; border-radius: 12px 12px 0 0; background: var(--gold-real); color: var(--ink); font: 800 11px/1 var(--f-body); font-style: normal; letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; }
.ck-sm__team { display: grid; justify-items: center; gap: 6px; text-align: center; min-width: 0; }
.ck-sm__team .np-crest, .ck-sm__team .np-mono { width: 52px; height: 52px; }
.ck-sm__team b { font: 800 15px/1.1 var(--f-display); text-transform: uppercase; letter-spacing: .03em; overflow-wrap: anywhere; }
.ck-sm__team.is-us b { color: var(--red); }
.ck-sm__mid { display: grid; justify-items: center; gap: 3px; text-align: center; min-width: 74px; }
.ck-sm__mid small { font: 700 11px/1 var(--f-body); letter-spacing: .1em; text-transform: uppercase; color: var(--red); }
.ck-sm__mid strong { font: 900 28px/1 var(--f-display); }
.ck-sm__mid strong.is-date { font-size: 26px; }
.ck-sm__mid span { font: 500 12.5px/1.2 var(--f-body); color: rgba(26, 14, 15, .6); }
.ck-strip__nav { display: flex; align-items: center; justify-content: center; gap: 22px; margin-top: 10px; }
.ck-strip__nav button { display: grid; place-items: center; width: 36px; height: 36px; border: 0; background: none; color: #fff; cursor: pointer; transition: color .2s; }
.ck-strip__nav button:hover { color: #f0d49a; }
.ck-strip__dots { display: flex; align-items: center; gap: 6px; }
.ck-strip__dots i { width: 10px; height: 8px; border-radius: 8px; background: rgba(255, 255, 255, .5); cursor: pointer; transition: .3s; }
.ck-strip__dots i.is-on { width: 34px; background: #f0d49a; }
@media (max-width: 640px) {
	.ck-hero { padding-bottom: 410px; padding-top: calc(var(--hh) + 34px); }
	.ck-sm { width: 84vw; }
	.ck-strip__count .ck-count b { font-size: 38px; }
	.ck-strip__count .ck-count div { min-width: 52px; }
}


/* =============== navbar: luksuzni, logo u sredini =============== */
@media (min-width: 1101px) {
	:root { --hh: 126px; }
	.ck-header, .ck-header.is-scrolled { border-top: 0; background: var(--red); box-shadow: 0 18px 40px -20px rgba(40, 3, 6, .85); transition: box-shadow .3s; }
	.ck-header::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: linear-gradient(90deg, transparent, #a98543 12%, #f0d49a 50%, #a98543 88%, transparent); }
	/* gornja traka */
	.ck-util { background: #b5130d; border-bottom: 1px solid rgba(240, 212, 154, .35); max-height: 38px; overflow: hidden; transition: max-height .35s var(--ease), border-color .3s; }
	.ck-header.is-scrolled .ck-util { max-height: 0; border-color: transparent; }
	.ck-util__in { display: flex; align-items: center; justify-content: space-between; height: 38px; }
	.ck-util__tag { display: inline-flex; align-items: center; gap: 12px; font: 600 11.5px/1 var(--f-body); letter-spacing: .24em; text-transform: uppercase; color: rgba(255, 255, 255, .78); }
	.ck-util__tag i { width: 5px; height: 5px; background: #f0d49a; transform: rotate(45deg); }
	.ck-util__right { display: flex; align-items: center; gap: 22px; }
	.ck-util__soc { display: flex; gap: 4px; }
	.ck-util__soc a { display: grid; place-items: center; width: 28px; height: 28px; color: rgba(255, 255, 255, .8); transition: color .2s, transform .3s var(--ease); }
	.ck-util__soc a:hover { color: #f0d49a; transform: translateY(-2px); }
	/* glavna traka: levo meni · logo · desno meni */
	.ck-header__bar { display: grid; grid-template-columns: 1fr 170px 1fr; align-items: center; height: 88px; gap: 0; transition: height .35s var(--ease); }
	.ck-header.is-scrolled .ck-header__bar { height: 74px; }
	.ck-nav { display: contents; margin: 0; }
	.ck-nav > ul { display: flex; align-items: center; gap: 4px; }
	.ck-nav__l { grid-column: 1; justify-self: end; padding-right: 24px; }
	.ck-nav__r { grid-column: 3; justify-self: start; padding-left: 24px; }
	.ck-nav > ul > li > a { height: 88px; padding: 0 13px; font: 700 12.5px/1 var(--f-body); letter-spacing: .16em; position: relative; }
	.ck-header.is-scrolled .ck-nav > ul > li > a { height: 74px; }
	.ck-nav > ul > li > a::before { content: ''; position: absolute; left: 13px; right: 13px; bottom: 24px; height: 2px; background: #f0d49a; transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease); }
	.ck-nav > ul > li > a:hover::before, .ck-nav li.is-open > a::before { transform: scaleX(1); }
	.ck-brand { grid-column: 2; grid-row: 1; justify-self: center; position: relative; width: 118px; height: 88px; margin: 0; }
	.ck-brand img { position: absolute; left: 50%; top: -22px; translate: -50% 0; width: 104px; transition: width .35s var(--ease), top .35s var(--ease), transform .4s var(--ease); filter: none; }
	.ck-brand::before { content: ''; position: absolute; left: 50%; top: -34px; translate: -50% 0; width: 150px; height: 150px; border-radius: 50%; background: radial-gradient(circle at 50% 40%, #fff, #f6eaea 70%); border: 3px solid #f0d49a; box-shadow: 0 0 0 7px var(--red), 0 18px 34px -10px rgba(40, 3, 6, .75); transition: width .35s var(--ease), height .35s var(--ease), top .35s var(--ease); }
	.ck-brand img { z-index: 1; top: -12px; }
	.ck-header.is-scrolled .ck-brand::before { width: 112px; height: 112px; top: -22px; }
	.ck-header.is-scrolled .ck-brand img { width: 62px; top: -6px; }
	.ck-brand:hover img { transform: scale(1.04); }
	.ck-hero { padding-top: calc(var(--hh) + 70px); }
	html { scroll-padding-top: 110px; }
}
@media (max-width: 1100px) {
	.ck-util { display: none; }
}


/* ---------- bez kruga oko grba ---------- */
.ck-brand::before { display: none !important; content: none; }
@media (min-width: 1101px) {
	.ck-brand img { top: -6px; width: 112px; filter: drop-shadow(0 10px 14px rgba(40, 3, 6, .45)); }
	.ck-header.is-scrolled .ck-brand img { width: 70px; top: 2px; }
}

/* ---------- footer: partneri kao deo crvene podloge ---------- */
.ck-footer { background: linear-gradient(180deg, #e2001c 0%, #a81a20 46%, #7d0f14 100%); }
.ck-footer::before { display: none; }
.ck-partners { padding: clamp(46px, 6vw, 84px) 0 clamp(30px, 4vw, 52px); border-bottom: 1px solid rgba(255, 255, 255, .22); text-align: center; }
.ck-partners__title { margin-bottom: clamp(30px, 4vw, 54px); font: 800 15px/1 var(--f-body); letter-spacing: .34em; text-transform: uppercase; color: #fff; }
.ck-partners__title::after { content: ''; display: block; width: 54px; height: 2px; margin: 16px auto 0; background: #f0d49a; }
.ck-partners__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: clamp(24px, 4vw, 64px) clamp(34px, 5vw, 84px); margin-top: clamp(26px, 3.4vw, 46px); }
.ck-partners__row a { display: grid; place-items: center; transition: transform .35s var(--ease), opacity .3s; opacity: .92; }
.ck-partners__row a:hover { transform: translateY(-3px) scale(1.05); opacity: 1; }
.ck-partners__row img { width: auto; max-width: 100%; object-fit: contain; filter: brightness(0) invert(1); }
.ck-partners__row--1 img { height: clamp(55.2px, 6.48vw, 93.6px); max-width: min(360px, 84vw); }
.ck-partners__row--2 img { height: clamp(48px, 5.28vw, 74.4px); max-width: min(288px, 72vw); }
.ck-partners__row--3 img { height: clamp(33.6px, 3.84vw, 52.8px); max-width: min(204px, 48vw); }
.ck-partners__row--4 img { height: clamp(22px, 2.4vw, 32px); }
.ck-footer__main { border-top: 0; }
.ck-footer .ck-footer__sponsors { display: none; }

.ck-partners__row--4 img { height: clamp(43.2px, 4.8vw, 64.8px); }
.ck-partners__row--1 li:nth-child(3) img { height: clamp(67.2px, 7.68vw, 110.4px); }

/* hero fotografija: u boji, crveni preliv samo sa leve strane i pri dnu */
.ck-hero__img { mix-blend-mode: normal; opacity: 1; filter: saturate(1.08) contrast(1.05); object-position: center 40%; }
.ck-hero__shade { background: linear-gradient(90deg, rgba(109, 12, 17, .93) 0%, rgba(150, 20, 27, .72) 38%, rgba(226, 0, 28, .18) 100%), linear-gradient(0deg, rgba(109, 12, 17, .96) 0%, rgba(109, 12, 17, .35) 32%, transparent 55%); }

/* hero: ravnomerno tamnija crvena preko cele slike, sadržaj centriran */
.ck-hero__shade { background: linear-gradient(0deg, rgba(95, 10, 15, .95) 0%, rgba(95, 10, 15, .4) 34%, transparent 58%), rgba(120, 14, 20, .66); }
.ck-hero__grid { justify-items: center; text-align: center; }
.ck-hero__copy { display: grid; justify-items: center; max-width: 1000px; }
.ck-hero__lead { margin-inline: auto; max-width: 600px; }
.ck-hero__cta { justify-content: center; }
.ck-hero__copy .ck-display { text-align: center; }
@media (min-width: 1101px) { .ck-hero { text-align: center; } }

/* ---------- Anton za naslove ---------- */
.ck-display, .ck-title, .ck-sub__title, .ck-fcard h3, .ck-timeline b, .ck-acc__body b, .ck-history__img figcaption {
	font-family: 'Anton', var(--f-display); font-weight: 400; letter-spacing: .01em; text-transform: uppercase;
}
.ck-display em, .ck-title em { font-family: 'Anton', var(--f-display); font-weight: 400; font-size: 1em; }
.ck-display { font-size: clamp(46px, 8vw, 124px); line-height: .92; }
.ck-title { font-size: clamp(40px, 5.6vw, 80px); line-height: 1; }
.ck-sub__title { font-size: clamp(38px, 4.2vw, 60px); line-height: 1; }
.ck-fcard h3 { font-size: clamp(38px, 4.4vw, 60px); line-height: 1; }
.ck-timeline b { font-size: clamp(36px, 4vw, 58px); line-height: 1; }
.ck-acc__body b { font-size: clamp(24px, 2.6vw, 36px); line-height: 1.05; }
.ck-history__img figcaption { font-size: clamp(80px, 11vw, 150px); line-height: 1; }
@media (max-width: 640px) {
	.ck-display { font-size: 42px; line-height: .94; }
	.ck-title { font-size: 40px; }
}


/* ---------- vesti: slajder ---------- */
.ck-ticker { display: none; }
.ck-news { overflow: hidden; }
.ck-news__tools { display: flex; align-items: center; gap: 26px; }
.ck-news__btns { display: flex; gap: 10px; }
.ck-news__btns button { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; border: 1.5px solid rgba(226, 0, 28, .4); background: #fff; color: var(--red); cursor: pointer; transition: .25s var(--ease); }
.ck-news__btns button:hover { background: var(--red); color: #fff; border-color: var(--red); }
.ck-news__track { display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 6px 0 12px max(20px, calc((100vw - 1280px) / 2)); scroll-padding-left: max(20px, calc((100vw - 1280px) / 2)); scrollbar-width: none; cursor: grab; }
.ck-news__track::-webkit-scrollbar { display: none; }
.ck-news__track.is-dragging { cursor: grabbing; scroll-snap-type: none; user-select: none; }
.ck-news__track::after { content: ''; flex: none; width: 1px; }
.ck-nc { flex: none; width: calc((min(1280px, 100vw - 40px) - 40px) / 3); scroll-snap-align: start; display: grid; grid-template-rows: auto 1fr; gap: 18px; color: var(--ink); }
.ck-nc__img { display: block; aspect-ratio: 16 / 11; border-radius: 16px; overflow: hidden; background: #efe7e5; }
.ck-nc__img img { width: 100%; height: 100%; max-width: none; object-fit: cover; transition: transform .8s var(--ease); }
.ck-nc__img .ck-ph { transition: transform .8s var(--ease); }
.ck-nc:hover .ck-nc__img img, .ck-nc:hover .ck-nc__img .ck-ph { transform: scale(1.05); }
.ck-nc__body { display: grid; gap: 10px; align-content: start; }
.ck-nc__body b { font: 800 clamp(22px, 1.9vw, 27px)/1.1 var(--f-display); text-transform: uppercase; transition: color .25s; }
.ck-nc:hover .ck-nc__body b { color: var(--red); }
.ck-nc__ex { font-size: 15px; color: var(--mute); }
@media (max-width: 900px) { .ck-nc { width: min(78vw, 380px); } .ck-news__btns { display: none; } }
@media (max-width: 640px) { .ck-news__tools { gap: 0; } }

/* hero: tamnija crvena + spor zoom in/out slike u petlji */
.ck-hero__shade { background: linear-gradient(0deg, rgba(70, 6, 10, .97) 0%, rgba(70, 6, 10, .55) 36%, transparent 62%), rgba(95, 10, 15, .78); }
.ck-hero__video { overflow: hidden; }
.ck-hero__img { animation: ck-kenburns 26s ease-in-out infinite alternate; transform-origin: 50% 45%; will-change: transform; }
@keyframes ck-kenburns { from { transform: scale(1); } to { transform: scale(1.14); } }
@media (prefers-reduced-motion: reduce) { .ck-hero__img { animation: none; } }

/* naslovi sekcija: crveni na svetloj podlozi, zlatni na crvenoj */
.ck-title, .ck-title em { color: var(--red); }
.ck-news .ck-title, .ck-school .ck-title, .ck-fan .ck-title { color: var(--red); }
.ck-mc .ck-title, .ck-mc .ck-title em, .ck-history .ck-title, .ck-history .ck-title em { color: #f0d49a; }

/* hero: svetlija, živa crvena iz grba (bez bordo/mutne nijanse) */
.ck-hero { background: #e2001c; }
.ck-hero__shade { background: linear-gradient(0deg, rgba(150, 0, 18, .9) 0%, rgba(190, 0, 24, .45) 34%, transparent 60%), rgba(226, 0, 28, .5); }
.ck-hero__img { filter: saturate(1.1) contrast(1.05) brightness(1.05); }
.ck-strip { background: linear-gradient(0deg, rgba(150, 0, 18, .9), rgba(190, 0, 24, .5) 70%, transparent); }

/* hero: ravnomerna providnost preko cele sekcije (bez gradijenata) */
.ck-hero__shade { background: rgba(226, 0, 28, .55); }
.ck-strip { background: none; }

/* hero: jača crvena pozadina (slika slabije vidljiva), bez senki na karticama utakmica */
.ck-hero__shade { background: rgba(226, 0, 28, .78); }
.ck-sm, .ck-sm--next { box-shadow: none; }
.ck-sm--next { box-shadow: 0 0 0 3px rgba(240, 212, 154, .45); }

/* hero: smena pozadinskih fotografija (crossfade + spor zoom) */
.ck-hero__slides { position: absolute; inset: 0; }
.ck-hero__slide { position: absolute; inset: 0; opacity: 0; animation: ck-slide 24s infinite, ck-kenburns 24s ease-in-out infinite alternate; animation-delay: calc(var(--i) * 8s), 0s; }
@keyframes ck-slide { 0% { opacity: 0; } 4% { opacity: 1; } 33% { opacity: 1; } 37.5% { opacity: 0; } 100% { opacity: 0; } }
.ck-hero__slides[data-count="1"] .ck-hero__slide { opacity: 1; animation: ck-kenburns 26s ease-in-out infinite alternate; }
@media (prefers-reduced-motion: reduce) { .ck-hero__slide { animation: none; } .ck-hero__slide:first-child { opacity: 1; } }

/* traka utakmica: uži kontejner, 70px razmaka sa leve i desne strane */
.ck-strip__track { position: relative; }
@media (min-width: 641px) {
	.ck-strip__track { margin-inline: 70px; padding-inline: 0; scroll-padding-inline: 0; }
}

/* traka utakmica: tri cele kartice iste širine, ostale se skrolaju */
@media (min-width: 641px) {
	.ck-strip__track { gap: 16px; }
	.ck-sm, .ck-sm--next { width: calc((100% - 32px) / 3); flex: 0 0 calc((100% - 32px) / 3); }
	.ck-sm__team b { font-size: 14px; }
}

/* traka utakmica: pet kartica odjednom (desktop) */
@media (min-width: 1101px) {
	.ck-sm, .ck-sm--next { width: calc((100% - 64px) / 5); flex: 0 0 calc((100% - 64px) / 5); grid-template-columns: 1fr auto 1fr; gap: 4px; padding: 16px 8px; }
	.ck-sm__team .np-crest, .ck-sm__team .np-mono { width: 40px; height: 40px; }
	.ck-sm__team b { font-size: 12.5px; }
	.ck-sm__mid { min-width: 56px; }
	.ck-sm__mid strong { font-size: 22px; }
	.ck-sm__mid strong.is-date { font-size: 21px; }
	.ck-sm__mid span { font-size: 11px; }
	.ck-sm__mid small { font-size: 10px; }
}
@media (min-width: 641px) and (max-width: 1100px) {
	.ck-sm, .ck-sm--next { width: calc((100% - 32px) / 3); flex: 0 0 calc((100% - 32px) / 3); }
}


/* =============== istorija: stari papir, interaktivna vremenska linija =============== */
.ck-hist {
	--paper: #f0e4c8; --ink2: #3a2418; --sepia: #7a5a34;
	position: relative; padding: clamp(70px, 9vw, 130px) 0; color: var(--ink2); overflow: hidden; isolation: isolate;
	background:
		radial-gradient(ellipse at 50% 0, rgba(255, 250, 235, .9), transparent 60%),
		radial-gradient(ellipse at 100% 100%, rgba(150, 100, 40, .28), transparent 55%),
		radial-gradient(ellipse at 0 100%, rgba(150, 100, 40, .22), transparent 50%),
		var(--paper);
	border-block: 0;
}
.ck-hist::before { /* grain papira */
	content: ''; position: absolute; inset: 0; z-index: -1; opacity: .5; mix-blend-mode: multiply;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .32 0 0 0 0 .16 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.ck-hist::after { /* tanki ornament: koncentrični luk + linije kao stari dokument */
	content: ''; position: absolute; inset: 22px; z-index: -1; pointer-events: none;
	border: 1px solid rgba(122, 90, 52, .35); outline: 1px solid rgba(122, 90, 52, .2); outline-offset: -8px;
}
.ck-hist .ck-kicker { color: var(--red); }
.ck-hist .ck-title, .ck-hist .ck-title em { color: var(--ink2); }
.ck-hist .ck-title em { color: var(--red); }
.ck-hist .ck-more { color: var(--red); }
.ck-hist__stage { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(28px, 6vw, 90px); align-items: center; }
.ck-hist__photo { position: relative; margin: 0; padding: 14px; background: #fbf6ea; box-shadow: 0 24px 40px -22px rgba(58, 36, 24, .7), 0 0 0 1px rgba(122, 90, 52, .3); transform: rotate(-2deg); aspect-ratio: 4 / 3.5; }
.ck-hist__photo img { position: absolute; left: 14px; right: 14px; top: 14px; bottom: 14px; width: calc(100% - 28px); height: calc(100% - 28px); max-width: none; object-fit: cover; filter: sepia(.75) contrast(1.05) saturate(.8); opacity: 0; transition: opacity .7s var(--ease); }
.ck-hist__photo img.is-on { opacity: 1; }
.ck-hist__photo figcaption { position: absolute; z-index: 3; left: auto; right: 30px; bottom: 28px; text-align: right; font: 400 clamp(80px, 9vw, 144px)/1 'Anton', var(--f-display); letter-spacing: -.025em; color: transparent; -webkit-text-stroke: 2px var(--red); pointer-events: none; }
.ck-hist__tape { position: absolute; z-index: 2; left: 50%; top: -14px; width: 110px; height: 30px; translate: -50% 0; rotate: 3deg; background: rgba(226, 200, 140, .75); box-shadow: 0 2px 4px rgba(58, 36, 24, .25); }
.ck-hist__eyebrow { font: 700 13px/1 var(--f-body); letter-spacing: .26em; text-transform: uppercase; color: var(--red); margin-bottom: 14px; }
.ck-hist__copy h3 { font: 400 clamp(40px, 5.2vw, 76px)/1 'Anton', var(--f-display); text-transform: uppercase; color: var(--ink2); margin: 0 0 20px; }
.ck-hist__text { max-width: 52ch; font-size: 18px; line-height: 1.65; color: #4a3322; }
.ck-hist__stage.is-swap .ck-hist__copy { animation: ck-hsw .6s var(--ease); }
.ck-hist__stage.is-swap .ck-hist__photo { animation: ck-hph .6s var(--ease); }
@keyframes ck-hsw { from { opacity: 0; transform: translateY(14px); } }
@keyframes ck-hph { from { transform: rotate(-4deg) scale(.97); } }

/* vremenska linija */
.ck-hist__line { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; margin-top: clamp(44px, 6vw, 80px); }
.ck-hist__arr { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1.5px solid rgba(122, 90, 52, .6); background: transparent; color: var(--sepia); cursor: pointer; transition: .25s; }
.ck-hist__arr:hover { background: var(--red); border-color: var(--red); color: #fff; }
.ck-hist__track { position: relative; display: flex; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; padding: 26px 0 6px; margin: 0; list-style: none; }
.ck-hist__track::-webkit-scrollbar { display: none; }
.ck-hist__track::before { content: ''; position: absolute; left: 0; right: 0; top: 41px; height: 2px; background: repeating-linear-gradient(90deg, rgba(122, 90, 52, .7) 0 8px, transparent 8px 14px); min-width: 100%; width: max-content; }
.ck-hist__track li { flex: 0 0 calc(100% / 6); min-width: 150px; scroll-snap-align: center; }
.ck-hist__pt { position: relative; display: grid; justify-items: center; gap: 4px; width: 100%; padding: 0 6px; border: 0; background: none; color: inherit; cursor: pointer; font: inherit; }
.ck-hist__pt i { width: 14px; height: 14px; border-radius: 50%; background: #f0e4c8; border: 2px solid var(--sepia); margin-bottom: 14px; position: relative; z-index: 1; transition: .3s var(--ease); }
.ck-hist__pt b { font: 400 clamp(26px, 2.4vw, 34px)/1 'Anton', var(--f-display); letter-spacing: .04em; color: #8a6a44; transition: .3s; }
.ck-hist__pt span { font: 600 11px/1.3 var(--f-body); letter-spacing: .12em; text-transform: uppercase; color: rgba(58, 36, 24, .6); max-width: 15ch; }
/* velike prekretnice: titule i trofeji */
.ck-hist__pt--major i { width: 28px; height: 28px; margin-top: -7px; margin-bottom: 8px; background: radial-gradient(circle at 35% 30%, #f6e2b3, #d3a85d 60%, #a98543); border: 3px solid #fff8e4; box-shadow: 0 0 0 2px #a98543, 0 6px 12px -4px rgba(58, 36, 24, .6); }
.ck-hist__pt--major b { font-size: clamp(34px, 3.2vw, 46px); color: var(--ink2); }
.ck-hist__pt--major span { color: var(--red); font-weight: 800; }
/* aktivna godina */
.ck-hist__pt:hover b { color: var(--red); }
.ck-hist__pt.is-on b { color: var(--red); }
.ck-hist__pt.is-on i { background: var(--red); border-color: var(--red); box-shadow: 0 0 0 5px rgba(226, 0, 28, .2); }
.ck-hist__pt--major.is-on i { background: radial-gradient(circle at 35% 30%, #ff5a68, #e2001c 65%); border-color: #fff8e4; box-shadow: 0 0 0 2px var(--red), 0 0 0 8px rgba(226, 0, 28, .2); }
.ck-hist__pt.is-on::after { content: ''; position: absolute; left: 20%; right: 20%; bottom: -6px; height: 3px; background: var(--red); animation: ck-hline .5s var(--ease); }
@keyframes ck-hline { from { transform: scaleX(0); } }
@media (max-width: 900px) {
	.ck-hist__stage { grid-template-columns: 1fr; }
	.ck-hist__photo { max-width: 460px; margin-inline: auto; }
	.ck-hist__line { grid-template-columns: minmax(0, 1fr); }
	.ck-hist__arr { display: none; }
	.ck-hist__track li { flex: 0 0 50%; }
}
@media (max-width: 900px) { .ck-hist__photo { width: min(100%, 460px); } .ck-hist__copy h3 { font-size: 44px; } }

/* vremenska linija: neprekidna linija, kartice se vide i iza strelica i bledi ka ivicama */
.ck-hist__line { display: block; margin-inline: calc(50% - 50vw); padding-inline: 0; }
.ck-hist__track { padding-inline: 0; -webkit-mask-image: linear-gradient(90deg, transparent 0, rgba(0, 0, 0, .28) 6%, rgba(0, 0, 0, .55) 12%, #000 24%, #000 76%, rgba(0, 0, 0, .55) 88%, rgba(0, 0, 0, .28) 94%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, rgba(0, 0, 0, .28) 6%, rgba(0, 0, 0, .55) 12%, #000 24%, #000 76%, rgba(0, 0, 0, .55) 88%, rgba(0, 0, 0, .28) 94%, transparent 100%); }
.ck-hist__track::before { display: none; }
.ck-hist__track li { position: relative; flex: 0 0 calc(100vw / 7); min-width: 150px; }
.ck-hist__track li::before { content: ''; position: absolute; left: 0; right: 0; top: 41px; height: 2px; background: repeating-linear-gradient(90deg, rgba(122, 90, 52, .7) 0 8px, transparent 8px 14px); }
.ck-hist__arr { position: absolute; top: 50%; translate: 0 -50%; z-index: 3; background: rgba(240, 228, 200, .85); backdrop-filter: blur(3px); }
#ck-hist-prev { left: max(14px, calc((100vw - 1280px) / 2 - 10px)); }
#ck-hist-next { right: max(14px, calc((100vw - 1280px) / 2 - 10px)); }
@media (max-width: 900px) {
	.ck-hist__line { margin-inline: -20px; }
	.ck-hist__track li { flex: 0 0 50%; }
	.ck-hist__track { -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 14%, #000 86%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 14%, #000 86%, transparent 100%); }
}

.ck-hist__track li::before { top: 15px; }

.ck-hist__track li::before { top: 6px; }

/* istorija: bez okvira oko sekcije; strelice ispod vremenske linije, u sredini */
.ck-hist::after { display: none; }
.ck-hist__line { padding-bottom: 70px; }
.ck-hist__arr { top: auto; bottom: 8px; translate: 0 0; background: transparent; backdrop-filter: none; }
#ck-hist-prev { left: calc(50% - 56px); }
#ck-hist-next { right: calc(50% - 56px); }
@media (max-width: 900px) { .ck-hist__arr { display: grid; } }

/* vremenska linija: prva i poslednja godina u fokusu stoje na ivici kontejnera */
.ck-hist__line { --off: max(20px, calc((100vw - 1280px) / 2)); }
.ck-hist__track { padding-inline: var(--off); scroll-padding-inline: var(--off);
	-webkit-mask-image: linear-gradient(90deg, transparent 0, rgba(0, 0, 0, .35) calc(var(--off) * .55), #000 var(--off), #000 calc(100% - var(--off)), rgba(0, 0, 0, .35) calc(100% - var(--off) * .55), transparent 100%);
	mask-image: linear-gradient(90deg, transparent 0, rgba(0, 0, 0, .35) calc(var(--off) * .55), #000 var(--off), #000 calc(100% - var(--off)), rgba(0, 0, 0, .35) calc(100% - var(--off) * .55), transparent 100%); }
.ck-hist__track li:first-child .ck-hist__pt { justify-items: start; text-align: left; padding-left: 0; }
.ck-hist__track li:last-child .ck-hist__pt { justify-items: end; text-align: right; padding-right: 0; }
.ck-hist__track li:first-child .ck-hist__pt.is-on::after { left: 0; right: auto; width: 60%; }
.ck-hist__track li:last-child .ck-hist__pt.is-on::after { right: 0; left: auto; width: 60%; }

/* logo pri učitavanju: 10% manji (112px → 101px) */
@media (min-width: 1101px) { .ck-brand img { width: 101px; top: -2px; } }

/* logo pri učitavanju: još 10% manji (101px → 91px) */
@media (min-width: 1101px) { .ck-brand img { width: 91px; top: 2px; } }

/* logo viši */
@media (min-width: 1101px) { .ck-brand img { top: -12px; } }

/* sticky (posle skrola): stavke menija vertikalno centrirane i bliže logou */
@media (min-width: 1101px) {
	.ck-header.is-scrolled .ck-header__bar { height: 70px; grid-template-columns: 1fr 96px 1fr; }
	.ck-header.is-scrolled .ck-nav > ul { align-items: center; }
	.ck-header.is-scrolled .ck-nav > ul > li > a { height: 70px; display: flex; align-items: center; padding: 0 11px; }
	.ck-header.is-scrolled .ck-nav > ul > li > a::before { bottom: 20px; }
	.ck-header.is-scrolled .ck-nav__l { padding-right: 8px; }
	.ck-header.is-scrolled .ck-nav__r { padding-left: 8px; }
	.ck-header.is-scrolled .ck-brand { width: 96px; height: 70px; }
	.ck-header.is-scrolled .ck-brand img { width: 62px; top: 2px; }
}

/* mobilno: fotografija → vremenska linija → tekst */
@media (max-width: 900px) {
	.ck-hist > .ck-wrap { display: flex; flex-direction: column; }
	.ck-hist__stage { display: contents; }
	.ck-hist .ck-head { order: 0; }
	.ck-hist__photo { order: 1; }
	.ck-hist__line { order: 2; margin-top: 34px; padding-bottom: 64px; }
	.ck-hist__copy { order: 3; }
}
.ck-util__soc { gap: 6px; }

/* Istraži klub: ista širina, tipografija i zlatni akcenti kao ostatak početne. */
.ck-explore { padding: clamp(56px, 7vw, 100px) 0; background: var(--red); }
.ck-explore__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-template-rows: repeat(3, clamp(220px, 19vw, 270px)); gap: 20px; }
.ck-explore__card { position: relative; isolation: isolate; display: flex; align-items: flex-end; overflow: hidden; border: 1px solid rgba(240,212,154,.3); border-radius: 16px; background: var(--red-dk); color: #fff; transition: border-color .3s, box-shadow .3s; }
.ck-explore__card--team { grid-column: 1 / 6; grid-row: 1 / 3; }
.ck-explore__card--school { grid-column: 6 / 13; grid-row: 1; }
.ck-explore__card--tickets { grid-column: 6 / 13; grid-row: 2; }
.ck-explore__card--history { grid-column: 1 / 7; grid-row: 3; }
.ck-explore__card--shop { grid-column: 7 / 13; grid-row: 3; }
.ck-explore__card img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; filter: saturate(.8) contrast(1.04); transition: transform .8s var(--ease); }
.ck-explore__card--team img { object-position: 43% center; }
.ck-explore__card--school img { object-position: center 48%; }
.ck-explore__card--shop img { object-position: center 35%; }
.ck-explore__card::after { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(0deg, rgba(109,12,17,.96), rgba(109,12,17,.4) 48%, rgba(109,12,17,.12)), linear-gradient(90deg, rgba(143,19,24,.2), transparent); pointer-events: none; }
.ck-explore__copy { position: relative; z-index: 2; width: 100%; padding: 28px 88px 30px 28px; }
.ck-explore__copy p { margin: 0 0 12px; font: 700 11px/1.4 var(--f-body); letter-spacing: .2em; color: #f0d49a; }
.ck-explore__copy h2 { margin: 0; font: 400 clamp(28px, 2.8vw, 40px)/1.08 'Anton', var(--f-display); letter-spacing: .01em; color: #fff; text-transform: uppercase; text-wrap: balance; }
.ck-explore__card--team h2 { font-size: clamp(40px, 4vw, 56px); }
.ck-explore__arrow { position: absolute; z-index: 2; right: 24px; bottom: 28px; width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; color: #f0d49a; border: 1.5px solid rgba(240,212,154,.65); background: transparent; transition: background .25s, color .25s, transform .3s var(--ease); }
.ck-explore__arrow svg { width: 20px; height: 20px; }
.ck-explore__card:hover, .ck-explore__card:focus-visible { border-color: var(--gold-real); box-shadow: 0 16px 34px -18px rgba(60,5,8,.65); }
.ck-explore__card:hover img, .ck-explore__card:focus-visible img { transform: scale(1.045); }
.ck-explore__card:hover .ck-explore__arrow, .ck-explore__card:focus-visible .ck-explore__arrow { background: var(--gold-real); color: var(--red-dk); transform: rotate(45deg); }
.ck-explore__card:focus-visible { outline: 3px solid var(--gold-real); outline-offset: 4px; }
@media (max-width: 900px) {
  .ck-explore__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(3, 260px); gap: 16px; }
  .ck-explore__card--team { grid-column: 1; grid-row: 1 / 3; }
  .ck-explore__card--school { grid-column: 2; grid-row: 1; }
  .ck-explore__card--tickets { grid-column: 2; grid-row: 2; }
  .ck-explore__card--history { grid-column: 1; grid-row: 3; }
  .ck-explore__card--shop { grid-column: 2; grid-row: 3; }
  .ck-explore__copy { padding: 24px 24px 88px; }
  .ck-explore__arrow { right: 24px; bottom: 22px; width: 44px; height: 44px; }
}
@media (max-width: 560px) {
  .ck-explore__grid { grid-template-columns: minmax(0, 1fr); grid-template-rows: 390px; grid-auto-rows: 260px; }
  .ck-explore__card { grid-column: auto; grid-row: auto; }
  .ck-explore__copy { padding: 24px 82px 28px 24px; }
  .ck-explore__copy h2 { font-size: 30px; }
  .ck-explore__card--team h2 { font-size: 42px; }
  .ck-explore__copy p { font-size: 10px; letter-spacing: .16em; }
  .ck-explore__arrow { right: 20px; bottom: 26px; }
}
@media (prefers-reduced-motion: reduce) { .ck-explore__card, .ck-explore__card img, .ck-explore__arrow { transition: none; } }

/* Cyrillic display font follows the same condensed headings. */
html[lang="sr-Cyrl"] .ck-home { --f-display: 'Oswald', 'Arial Narrow', sans-serif; --f-body: 'Roboto', system-ui, sans-serif; }
html[lang="sr-Cyrl"] :is(.ck-display, .ck-display em, .ck-title, .ck-title em, .ck-sub__title, .ck-fcard h3, .ck-timeline b, .ck-acc__body b, .ck-history__img figcaption, .ck-hist__copy h3, .ck-hist__pt b, .ck-hist__photo figcaption, .ck-explore__copy h2) { font-family: 'Oswald', 'Arial Narrow', sans-serif; font-weight: 700; }

/* Zbijeniji naslovi sekcija. */
.ck-title, .ck-title em, .ck-explore__copy h2, .ck-fcard h3, .ck-hist__copy h3 { letter-spacing: -.015em; }

/* Zbijeniji hero naslov. */
.ck-hero .ck-display, .ck-hero .ck-display em { letter-spacing: -.035em; }

/* Mobilna navigacija: bela traka i grb u sredini. */
@media (max-width: 1100px) {
  .ck-tabbar { grid-template-columns: repeat(5, minmax(0, 1fr)); background: #fff; border-top: 1px solid rgba(211,168,93,.55); box-shadow: 0 -8px 28px rgba(60,5,8,.1); backdrop-filter: none; }
  .ck-tabbar a, .ck-tabbar button { color: #705358; font-size: 10px; letter-spacing: .04em; }
  .ck-tabbar a.is-active, .ck-tabbar [aria-expanded="true"], .ck-tabbar a:hover, .ck-tabbar button:hover { color: var(--red); }
  .ck-tabbar .ck-tabbar__brand { position: relative; align-self: center; align-items: center; height: 48px; padding: 0; }
  .ck-tabbar__brand::before { content: none; }
  .ck-tabbar__brand img { width: 32px; height: 44px; object-fit: contain; transform: none; }
  .ck-tabbar__brand:focus-visible { outline: 2px solid var(--red); outline-offset: 3px; border-radius: 50%; }
}

/* Header positioning, scroll behavior and script dropdown. */
.ck-header, .ck-header.is-scrolled { transition: transform .3s var(--ease), box-shadow .3s; }
.ck-header__bar { position: relative; }
.ck-brand { padding-left: 0; }
.ck-language { position: relative; display: block; letter-spacing: .04em; }
.ck-language summary { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-width: 64px; min-height: 36px; padding: 6px 8px; color: #fff; cursor: pointer; list-style: none; font: 700 12px/1 var(--f-body); }
.ck-language summary::-webkit-details-marker { display: none; }
.ck-language summary:focus-visible { outline: 2px solid var(--gold-real); outline-offset: 2px; border-radius: 4px; }
.ck-language[open] summary svg { rotate: 180deg; }
.ck-language__options { position: absolute; z-index: 90; right: 0; top: calc(100% + 6px); min-width: 148px; padding: 6px; border: 1px solid var(--gold-real); border-radius: 10px; background: #fff; box-shadow: 0 12px 32px rgba(60,5,8,.2); }
.ck-language .ck-language__options a { display: block; padding: 12px; color: var(--ink); border-radius: 6px; font-size: 13px; letter-spacing: 0; white-space: nowrap; }
.ck-language .ck-language__options a:hover, .ck-language .ck-language__options a[aria-current="true"] { color: var(--red); background: #f7f2f0; }
.ck-language--mobile { display: none; }
@media (min-width: 1101px) {
  .ck-util { overflow: visible; }
  .ck-header.is-scrolled .ck-util { visibility: hidden; }
  .ck-header.is-scrolled .ck-brand { padding: 0; height: 70px; }
  .ck-header.is-scrolled .ck-brand img { left: 50%; top: calc(50% + 10px); translate: -50% -50%; width: 52px; transform: none; }
}
@media (max-width: 1100px) {
  .ck-header .ck-header__bar { position: relative; justify-content: center; }
  .ck-header .ck-brand { position: absolute; left: 50%; top: 0; translate: -50% 0; width: 64px; height: 100%; margin: 0; padding: 0; }
  .ck-header .ck-brand img { left: 50%; top: calc(50% + 8px); translate: -50% -50%; width: 44px; height: auto; transform: none; }
  .ck-header.is-scrolled .ck-brand img { width: 44px; top: calc(50% + 8px); }
  .ck-header .ck-language--mobile { position: absolute; right: 0; top: 50%; translate: 0 -50%; display: block; }
}
@media (prefers-reduced-motion: reduce) { .ck-header, .ck-header.is-scrolled { transition: none; } }

@media (min-width: 1101px) { .ck-header:not(.is-scrolled) .ck-brand img { width: 80px; top: -3px; } }

/* Shop slider follows the news track and extends beyond the content container. */
.ck-shop { padding: clamp(70px, 10vw, 130px) 0; background: #fff; color: var(--ink); overflow: hidden; }
.ck-shop__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; }
.ck-shop__buttons { display: flex; gap: 10px; }
.ck-shop__buttons button { display: grid; place-items: center; width: 46px; height: 46px; padding: 0; border-radius: 50%; border: 1.5px solid rgba(226,0,28,.4); color: var(--red); background: #fff; cursor: pointer; transition: background .25s, color .25s, opacity .25s; }
.ck-shop__buttons button:hover:not(:disabled) { background: var(--red); color: #fff; border-color: var(--red); }
.ck-shop__buttons button:disabled { opacity: .3; cursor: default; }
.ck-shop__track { display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 6px max(20px, calc((100% - 1280px) / 2)) 16px; scroll-padding-inline: max(20px, calc((100% - 1280px) / 2)); scrollbar-width: none; cursor: grab; }
.ck-shop__track::-webkit-scrollbar { display: none; }
.ck-shop__track.is-dragging { cursor: grabbing; scroll-snap-type: none; user-select: none; }
.ck-product { flex: none; width: calc((min(1280px, 100vw - 40px) - 40px) / 3); display: grid; grid-template-rows: auto 1fr; gap: 20px; scroll-snap-align: start; color: var(--ink); }
.ck-product__image { display: block; aspect-ratio: 4 / 4.5; border-radius: 16px; overflow: hidden; background: #f7f2f0; border: 1px solid rgba(226,0,28,.08); }
.ck-product__image img { width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center; transition: transform .7s var(--ease); }
.ck-product:hover .ck-product__image img { transform: scale(1.035); }
.ck-product__body { display: flex; flex-direction: column; gap: 16px; }
.ck-product h3 { margin: 0; font: 700 clamp(22px, 1.9vw, 28px)/1.2 var(--f-display); text-transform: uppercase; letter-spacing: -.015em; }
.ck-product__bottom { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: auto; }
.ck-product__bottom strong { font: 700 22px/1.2 var(--f-body); color: var(--red); }
.ck-product__arrow { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid rgba(226,0,28,.25); border-radius: 50%; color: var(--red); }
.ck-product:hover h3 { color: var(--red); }
.ck-product:focus-visible, .ck-shop__track:focus-visible, .ck-shop__buttons button:focus-visible { outline: 2px solid var(--red); outline-offset: 3px; }
@media (max-width: 900px) { .ck-product { width: min(78vw, 380px); } .ck-shop__actions { justify-content: space-between; width: 100%; gap: 16px; } }
@media (max-width: 400px) { .ck-shop__actions .ck-btn { font-size: 11px; padding-inline: 16px; } .ck-shop__buttons button { width: 40px; height: 40px; } }
@media (prefers-reduced-motion: reduce) { .ck-product__image img, .ck-shop__buttons button { transition: none; } }

/* Compact social strip: hashtag on the left, icons on the right. */
.ck-social-strip { padding: 0 0 clamp(40px, 5vw, 70px); background: #fff; }
.ck-social-strip .ck-fan__social { margin-top: 0; }
@media (max-width: 560px) {
  .ck-social-strip .ck-fan__social { padding: 16px; gap: 12px; display: grid; grid-template-columns: minmax(0, 1fr) auto; }
  .ck-social-strip .ck-fan__social > span { font: 700 13px/1 var(--f-body); letter-spacing: .02em; white-space: nowrap; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .ck-social-strip .ck-fan__social div { gap: 6px; }
  .ck-social-strip .ck-fan__social a { width: 28px; height: 28px; }
}

@media (max-width: 360px) { .ck-social-strip .ck-fan__social { padding: 12px; gap: 8px; } .ck-social-strip .ck-fan__social > span { font-size: 11px; } .ck-social-strip .ck-fan__social div { gap: 3px; } .ck-social-strip .ck-fan__social a { width: 22px; height: 22px; } .ck-social-strip .ck-fan__social svg { width: 18px; height: 18px; } }

/* Mobile menu: scrolling content and a stationary back bar above the tabbar. */
@media (max-width: 1100px) {
  .ck-mm { display: flex; flex-direction: column; overflow: hidden; padding: calc(var(--ck-menu-header-height, 72px) + 14px) 0 var(--ck-tabbar-height, 66px); }
  .ck-mm__content { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding-bottom: 24px; scrollbar-width: thin; }
  .ck-mm[data-panel="submenu"] .ck-mm__content { padding-bottom: 104px; }
  .ck-mm__list > li > a, .ck-mm__list > li > button { font-size: 30px; padding-block: 16px; }
  .ck-mm__actions { position: absolute; z-index: 3; left: 0; right: 0; bottom: var(--ck-tabbar-height, 66px); padding: 16px 24px; background: var(--red-dk); border-top: 1px solid rgba(240,212,154,.22); box-shadow: 0 -12px 24px rgba(80,5,10,.12); }
  .ck-mm__actions[hidden] { display: none; }
  .ck-mm__actions .ck-mm__back { margin: 0; min-height: 44px; }
}

/* Standings preview shares the red background and container with the photo cards. */
.ck-standings { padding: clamp(64px, 8vw, 110px) 0 0; background: var(--red); color: #fff; }
.ck-standings .ck-title, .ck-standings .ck-title em { color: #fff; }
.ck-standings .ck-kicker { color: #f0d49a; }
.ck-standings__league { padding-bottom: 12px; border-bottom: 2px solid var(--gold-real); font: 700 12px/1.3 var(--f-body); text-transform: uppercase; letter-spacing: .08em; }
.ck-standings__table { width: 100%; border-collapse: collapse; table-layout: auto; }
.ck-standings__caption { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ck-standings__table abbr { text-decoration: none; }
.ck-standings__table thead th { padding: 0 12px 18px; color: rgba(255,255,255,.65); font: 700 12px/1.3 var(--f-body); text-transform: uppercase; letter-spacing: .08em; text-align: right; }
.ck-standings__table thead .ck-standings__team-head { text-align: left; }
.ck-standings__table .ck-standings__position { width: 40px; padding-left: 0; padding-right: 12px; text-align: left; color: rgba(255,255,255,.65); }
.ck-standings__table tbody td, .ck-standings__table tbody th { padding: 20px 12px; border: 0; vertical-align: middle; }
.ck-standings__table tbody td { font: 500 clamp(18px, 1.8vw, 24px)/1 var(--f-body); font-variant-numeric: tabular-nums; text-align: right; }
.ck-standings__table tbody th { width: 53%; text-align: left; }
.ck-standings__club { display: flex; align-items: center; gap: 20px; }
.ck-standings__club img { flex: none; width: 56px; height: 56px; max-width: none; object-fit: contain; }
.ck-standings__club strong { font: 400 clamp(28px, 3.2vw, 46px)/1.1 'Anton', var(--f-display); letter-spacing: -.015em; text-transform: uppercase; overflow-wrap: anywhere; }
html[lang="sr-Cyrl"] .ck-standings__club strong { font-family: 'Oswald', 'Arial Narrow', sans-serif; font-weight: 700; }
.ck-standings__mono { flex: none; width: 56px; height: 56px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; font: 700 16px/1 var(--f-body); }
.ck-standings__table .is-us, .ck-standings__table .is-us .ck-standings__position { color: #f0d49a; }
.ck-standings__table .ck-standings__points { font-weight: 700; }
.ck-standings__footer { display: flex; justify-content: center; margin-top: 34px; }
.ck-standings__footer .ck-btn { color: var(--ink); background: linear-gradient(135deg, #f0d49a, var(--gold-real) 55%, #a98543); }
.ck-standings__empty { color: rgba(255,255,255,.8); }
@media (max-width: 900px) {
  .ck-standings__club { gap: 12px; }
  .ck-standings__club img, .ck-standings__mono { width: 42px; height: 42px; }
  .ck-standings__club strong { font-size: 28px; }
  .ck-standings__table tbody td, .ck-standings__table tbody th { padding: 16px 8px; }
  .ck-standings__table thead th { padding-inline: 8px; }
}
@media (max-width: 640px) {
  .ck-standings__table .ck-standings__detail { display: none; }
  .ck-standings__table .ck-standings__position { width: 24px; padding-right: 4px; font-size: 14px; }
  .ck-standings__table tbody th { width: auto; }
  .ck-standings__table tbody td { font-size: 18px; }
  .ck-standings__table tbody td, .ck-standings__table tbody th { padding: 14px 5px; }
  .ck-standings__table thead th { padding-inline: 5px; font-size: 10px; }
  .ck-standings__club { gap: 10px; }
  .ck-standings__club img, .ck-standings__mono { width: 32px; height: 32px; }
  .ck-standings__club strong { font-size: 21px; }
  .ck-standings__league { font-size: 11px; }
}

/* The standings fade into the red background until expanded. */
.ck-standings__body { position: relative; isolation: isolate; }
.ck-standings__body.has-more:not(.is-expanded)::after { content: ''; position: absolute; z-index: 1; left: 0; right: 0; bottom: 0; height: 190px; background: linear-gradient(0deg, var(--red) 0%, var(--red) 28%, rgba(226,0,28,0) 100%); pointer-events: none; }
.ck-standings__footer { position: relative; z-index: 2; }
.ck-standings__body.has-more:not(.is-expanded) .ck-standings__footer { margin-top: -64px; padding: 28px 0 20px; }
.ck-standings__footer [hidden], .ck-standings__table tr[hidden] { display: none; }
.ck-standings__table tbody .is-us > td, .ck-standings__table tbody .is-us > th { border-top: 1px solid var(--gold-real); border-bottom: 1px solid var(--gold-real); }
.ck-standings__footer [aria-expanded="true"] svg { rotate: 180deg; }
.ck-standings__table tbody tr > td, .ck-standings__table tbody tr > th { transition: background-color .2s ease; }
@media (hover: hover) {
  .ck-standings__table tbody tr:hover > td, .ck-standings__table tbody tr:hover > th { background: rgba(255,255,255,.12); }
}
@media (max-width: 640px) {
  .ck-standings__body.has-more:not(.is-expanded)::after { height: 150px; }
  .ck-standings__body.has-more:not(.is-expanded) .ck-standings__footer { margin-top: -42px; padding-top: 22px; }
}