@charset "UTF-8";

/* ==========================================================================
   JKDR — Judo klub "Duga Resa"
   Vizualni smjer: Tatami
   Boje izvedene iz grba kluba (skerlet #E02000, tamna #B00000).
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Fontovi (lokalno hostani, bez poziva na Google)
   -------------------------------------------------------------------------- */

/*
 * Poppins je tipografija iz knjige standarda kluba (brandbook koristi
 * Poppins-Bold i Poppins-Medium). Hostana je lokalno, bez poziva na Google.
 *
 * Za tekst knjiga standarda navodi Helvetica Now — komercijalni font koji se
 * ne smije ugraditi na javnu web-stranicu bez web licence. Zato tekst koristi
 * sustavni Helvetica niz: na Appleu se iscrtava stvarna Helvetica Neue, na
 * Windowsu Arial, koji je metrički blizak.
 */

@font-face {
	font-family: "Poppins";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/poppins-600-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
		U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
		U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Poppins";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/poppins-600-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
		U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191,
		U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Poppins";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/poppins-700-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
		U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
		U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Poppins";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/poppins-700-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
		U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191,
		U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Poppins";
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url("../fonts/poppins-800-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
		U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
		U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Poppins";
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url("../fonts/poppins-800-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
		U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191,
		U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Samo dva znaka: 柔 i 道. Podskup je 1,4 KB. */
@font-face {
	font-family: "Noto Serif JP";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/notoserifjp-judo.woff2") format("woff2");
	unicode-range: U+67D4, U+9053;
}

/* --------------------------------------------------------------------------
   2. Tokeni
   -------------------------------------------------------------------------- */

:root {
	/*
	 * Boje su uzete iz knjige standarda. Crvena #E02808 uzorkovana je iz
	 * logotipa, brand patterna, posjetnice, potpisa e-pošte i app ikone —
	 * u svim materijalima identična.
	 */
	--jk-red: #e02808;
	--jk-red-deep: #b00800;
	--jk-red-lift: #f0421c; /* na tamnoj podlozi: 4.8:1 */

	/* Tamna strana — crna s blagim toplim odmakom prema crvenoj */
	--jk-sumi: #0e0c0b;
	--jk-sumi-2: #171413;
	--jk-sumi-3: #201c1a;
	--jk-bone: #f4f2f0;
	--jk-bone-dim: #a8a09c;
	--jk-straw: #9a8f88; /* sitne verzalne oznake na tamnom: 5.8:1 */

	/* Svijetla strana — brend je bijelo/crveno/crno, bez krem tonova */
	--jk-paper: #f1f0ee;
	--jk-paper-2: #ffffff;
	--jk-ink: #131010;
	--jk-ink-dim: #5a5350;
	--jk-rule: #dcd9d6;

	/* Zadržani nazivi radi kompatibilnosti sa starijim pravilima */
	--jk-scarlet: var(--jk-red);
	--jk-scarlet-hi: var(--jk-red-lift);
	--jk-scarlet-dp: var(--jk-red-deep);

	/* Semantika */
	--jk-ok: #1f7a4c;
	--jk-warn: #b8791a;
	--jk-err: #c22118;

	/* Tipografija iz knjige standarda */
	--jk-f-display: "Poppins", "Segoe UI", system-ui, sans-serif;
	--jk-f-body: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica,
		Arial, sans-serif;
	--jk-f-jp: "Noto Serif JP", serif;

	/* Mjere */
	--jk-maxw: 1180px;
	--jk-gut: clamp(1rem, 4vw, 2.25rem);
	--jk-band: clamp(3.25rem, 8vw, 6.5rem);
	--jk-header-h: 76px;

	/* Pokret */
	--jk-ease: cubic-bezier(0.2, 0.7, 0.3, 1);
	--jk-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
	--jk-dur: 0.45s;

	/* Znak kluba kao raster — koristi se kao tiha tekstura na tamnim plohama */
	--jk-mark: url("../img/mark.png");
}

/* --------------------------------------------------------------------------
   3. Osnova
   -------------------------------------------------------------------------- */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	background: var(--jk-paper);
	color: var(--jk-ink);
	font-family: var(--jk-f-body);
	font-size: 1.0625rem;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

img,
picture,
video,
canvas,
svg {
	display: block;
	max-width: 100%;
	height: auto;
}

a {
	color: inherit;
	text-decoration-color: color-mix(in srgb, currentColor 35%, transparent);
	text-underline-offset: 0.18em;
}

button,
input,
select,
textarea {
	font: inherit;
	color: inherit;
}

h1, h2, h3, h4, h5, h6 {
	margin: 0;
	font-family: var(--jk-f-display);
	font-weight: 800;
	line-height: 1.06;
	letter-spacing: -0.022em;
	text-wrap: balance;
}

p {
	margin: 0 0 1em;
}

p:last-child {
	margin-bottom: 0;
}

:focus-visible {
	outline: 3px solid var(--jk-scarlet);
	outline-offset: 3px;
	border-radius: 2px;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.jkdr-skip {
	position: absolute;
	left: 50%;
	top: 0;
	transform: translate(-50%, -120%);
	z-index: 200;
	background: var(--jk-scarlet);
	color: #fff;
	font-family: var(--jk-f-display);
	font-size: 0.875rem;
	font-weight: 700;
	padding: 0.7rem 1.1rem;
	transition: transform 0.2s var(--jk-ease);
}

.jkdr-skip:focus {
	transform: translate(-50%, 0);
}

/* --------------------------------------------------------------------------
   4. Layout
   -------------------------------------------------------------------------- */

.jkdr-wrap {
	width: 100%;
	max-width: var(--jk-maxw);
	margin-inline: auto;
	padding-inline: var(--jk-gut);
}

.jkdr-band {
	padding-block: var(--jk-band);
}

.jkdr-band--dark {
	background: var(--jk-sumi);
	color: var(--jk-bone);
}

.jkdr-band--light {
	background: var(--jk-paper);
	color: var(--jk-ink);
}

.jkdr-band--paper {
	background: var(--jk-paper-2);
	color: var(--jk-ink);
}

/* Uska skerletna traka — "obi" */
.jkdr-obi {
	height: 4px;
	background: var(--jk-scarlet);
}

.jkdr-eyebrow {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	margin: 0 0 1rem;
	font-family: var(--jk-f-display);
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--jk-ink-dim);
}

.jkdr-band--dark .jkdr-eyebrow {
	color: var(--jk-bone-dim);
}

.jkdr-eyebrow::before {
	content: "";
	flex: none;
	width: 1.75rem;
	height: 2px;
	background: var(--jk-scarlet);
}

.jkdr-jp {
	font-family: var(--jk-f-jp);
	font-weight: 700;
	color: var(--jk-scarlet);
	line-height: 1;
}

/*
 * Na tamnoj podlozi osnovni skerlet daje 3.95:1. Svjetlija varijanta daje
 * 4.8:1, pa znak ostaje čitljiv i kad nije samo ukras.
 */
.jkdr-band--dark .jkdr-jp,
.jkdr-hero .jkdr-jp,
.jkdr-footer .jkdr-jp,
.jkdr-portal-box .jkdr-jp,
.jkdr-404 .jkdr-jp,
.jkdr-pagehero .jkdr-jp {
	color: var(--jk-scarlet-hi);
}

/* --------------------------------------------------------------------------
   5. Zaglavlje i navigacija
   -------------------------------------------------------------------------- */

.jkdr-header {
	position: sticky;
	top: 0;
	z-index: 100;
	color: var(--jk-bone);
	border-bottom: 1px solid rgba(255, 255, 255, 0.09);
	transition: box-shadow var(--jk-dur) var(--jk-ease);
}

/*
 * Pozadinu zaglavlja nosi pseudoelement, a ne samo zaglavlje.
 *
 * Razlog je `backdrop-filter` u skupljenom stanju: element s tim svojstvom
 * postaje referentni okvir za `position: fixed` potomke. Mobilni panel je
 * potomak zaglavlja, pa bi se pri skrolu razapinjao unutar skupljenog
 * zaglavlja (60 px) umjesto preko cijelog ekrana — ostao bi vidljiv samo
 * prvi redak izbornika. Na pseudoelementu filtar nema taj učinak jer panel
 * nije njegov potomak.
 *
 * Ne vraćati `background` ni `backdrop-filter` na .jkdr-header.
 */
.jkdr-header::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: var(--jk-sumi);
	transition: background var(--jk-dur) var(--jk-ease);
}

.jkdr-header.is-stuck {
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.35);
}

.jkdr-header.is-stuck::before {
	background: rgba(18, 16, 15, 0.94);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
}

.jkdr-header-inner {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	min-height: var(--jk-header-h);
	transition: min-height var(--jk-dur) var(--jk-ease);
}

.jkdr-header.is-stuck .jkdr-header-inner {
	min-height: 60px;
}

.jkdr-brand {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	margin-right: auto;
	text-decoration: none;
	flex: none;
}

.jkdr-brand img {
	width: auto;
	height: 52px;
	transition: height var(--jk-dur) var(--jk-ease);
}

.jkdr-header.is-stuck .jkdr-brand img {
	height: 42px;
}

.jkdr-brand-text {
	display: none;
	font-family: var(--jk-f-display);
	font-weight: 800;
	font-size: 0.8125rem;
	line-height: 1.15;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.jkdr-brand-text span {
	display: block;
	color: var(--jk-scarlet-hi);
}

@media (min-width: 420px) {
	.jkdr-brand-text {
		display: block;
	}
}

/* Izbornik — zajedničko */
.jkdr-menu {
	display: flex;
	align-items: center;
	gap: 0.25rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.jkdr-menu-item {
	position: relative;
}

.jkdr-menu-link {
	display: block;
	padding: 0.55rem 0.75rem;
	font-family: var(--jk-f-display);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--jk-bone);
	white-space: nowrap;
	transition: color 0.2s var(--jk-ease);
}

.jkdr-menu-link::after {
	content: "";
	display: block;
	height: 2px;
	margin-top: 0.3rem;
	background: var(--jk-scarlet);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.28s var(--jk-ease);
}

.jkdr-menu-item:hover > .jkdr-menu-link,
.jkdr-menu-item:focus-within > .jkdr-menu-link,
.jkdr-menu-item.is-current > .jkdr-menu-link {
	color: #fff;
}

.jkdr-menu-item:hover > .jkdr-menu-link::after,
.jkdr-menu-item:focus-within > .jkdr-menu-link::after,
.jkdr-menu-item.is-current > .jkdr-menu-link::after {
	transform: scaleX(1);
}

.jkdr-submenu-toggle {
	position: absolute;
	right: -0.15rem;
	top: 50%;
	transform: translateY(-50%);
	display: grid;
	place-items: center;
	width: 1.5rem;
	height: 1.5rem;
	padding: 0;
	background: none;
	border: 0;
	color: currentColor;
	cursor: pointer;
}

.jkdr-chevron {
	transition: transform 0.28s var(--jk-ease);
}

.jkdr-submenu-toggle[aria-expanded="true"] .jkdr-chevron {
	transform: rotate(180deg);
}

.jkdr-submenu {
	list-style: none;
	margin: 0;
	padding: 0;
}

/* --- Desktop navigacija --- */
@media (min-width: 1000px) {
	.jkdr-nav-desktop {
		display: block;
	}

	.jkdr-nav-toggle,
	.jkdr-nav-panel {
		display: none !important;
	}

	.jkdr-has-children > .jkdr-menu-link {
		padding-right: 1.6rem;
	}

	.jkdr-nav-desktop .jkdr-submenu {
		position: absolute;
		top: calc(100% + 0.4rem);
		left: 0;
		min-width: 15rem;
		padding: 0.4rem;
		background: var(--jk-sumi-2);
		border: 1px solid rgba(255, 255, 255, 0.1);
		box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45);
		opacity: 0;
		visibility: hidden;
		transform: translateY(-6px);
		transition: opacity 0.22s var(--jk-ease),
			transform 0.22s var(--jk-ease),
			visibility 0s linear 0.22s;
	}

	.jkdr-nav-desktop .jkdr-has-children:hover > .jkdr-submenu,
	.jkdr-nav-desktop .jkdr-has-children:focus-within > .jkdr-submenu,
	.jkdr-nav-desktop .jkdr-submenu.is-open {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
		transition: opacity 0.22s var(--jk-ease),
			transform 0.22s var(--jk-ease),
			visibility 0s linear 0s;
	}

	.jkdr-nav-desktop .jkdr-submenu .jkdr-menu-link {
		padding: 0.6rem 0.75rem;
		white-space: normal;
	}

	.jkdr-nav-desktop .jkdr-submenu .jkdr-menu-link::after {
		display: none;
	}

	.jkdr-nav-desktop .jkdr-submenu .jkdr-menu-item:hover > .jkdr-menu-link {
		background: var(--jk-sumi-3);
		color: var(--jk-scarlet-hi);
	}
}

/* --- Mobilna navigacija --- */
@media (max-width: 999.98px) {
	.jkdr-nav-desktop {
		display: none;
	}
}

.jkdr-nav-toggle {
	display: grid;
	place-items: center;
	width: 48px;
	height: 48px;
	padding: 0;
	background: none;
	border: 1px solid rgba(255, 255, 255, 0.22);
	color: var(--jk-bone);
	cursor: pointer;
	flex: none;
}

.jkdr-burger {
	display: block;
	position: relative;
	width: 20px;
	height: 2px;
	background: currentColor;
	transition: background 0.2s var(--jk-ease);
}

.jkdr-burger::before,
.jkdr-burger::after {
	content: "";
	position: absolute;
	left: 0;
	width: 20px;
	height: 2px;
	background: currentColor;
	transition: transform 0.28s var(--jk-ease), top 0.28s var(--jk-ease);
}

.jkdr-burger::before {
	top: -6px;
}

.jkdr-burger::after {
	top: 6px;
}

.jkdr-nav-toggle[aria-expanded="true"] .jkdr-burger {
	background: transparent;
}

.jkdr-nav-toggle[aria-expanded="true"] .jkdr-burger::before {
	top: 0;
	transform: rotate(45deg);
}

.jkdr-nav-toggle[aria-expanded="true"] .jkdr-burger::after {
	top: 0;
	transform: rotate(-45deg);
}

.jkdr-nav-panel {
	position: fixed;
	inset: var(--jk-header-h) 0 0 0;
	z-index: 99;
	background: var(--jk-sumi);
	padding: var(--jk-gut) var(--jk-gut) 3rem;
	overflow-y: auto;
	overscroll-behavior: contain;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-8px);
	/*
	 * `visibility` je diskretno svojstvo — ako se navede s trajanjem, prebacuje
	 * se tek na polovici animacije, pa panel prvih 150 ms ostaje neprimjenjiv
	 * za fokus. Zato ovdje ide s trajanjem 0 i odgodom, samo pri zatvaranju.
	 */
	transition: opacity 0.3s var(--jk-ease),
		transform 0.3s var(--jk-ease),
		visibility 0s linear 0.3s;
}

.jkdr-nav-panel.is-open {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	transition: opacity 0.3s var(--jk-ease),
		transform 0.3s var(--jk-ease),
		visibility 0s linear 0s;
}

.jkdr-nav-panel .jkdr-menu {
	flex-direction: column;
	align-items: stretch;
	gap: 0;
}

.jkdr-nav-panel .jkdr-menu-item {
	border-bottom: 1px solid rgba(255, 255, 255, 0.09);
}

.jkdr-nav-panel .jkdr-menu-link {
	padding: 1.05rem 0;
	font-size: 1rem;
	letter-spacing: 0.06em;
	min-height: 48px;
}

.jkdr-nav-panel .jkdr-menu-link::after {
	display: none;
}

.jkdr-nav-panel .jkdr-submenu-toggle {
	right: 0;
	width: 48px;
	height: 48px;
}

.jkdr-nav-panel .jkdr-submenu {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.32s var(--jk-ease);
}

.jkdr-nav-panel .jkdr-submenu.is-open {
	grid-template-rows: 1fr;
}

.jkdr-nav-panel .jkdr-submenu > * {
	overflow: hidden;
}

.jkdr-nav-panel .jkdr-submenu .jkdr-menu-item {
	border-bottom: 0;
	border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.jkdr-nav-panel .jkdr-submenu .jkdr-menu-link {
	padding-left: 1.1rem;
	font-size: 0.875rem;
	color: var(--jk-bone-dim);
}

body.jkdr-nav-open {
	overflow: hidden;
}

/* Gumb "Upiši se" — uvijek vidljiv */
.jkdr-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.7rem 1.1rem;
	background: var(--jk-scarlet);
	color: #fff;
	font-family: var(--jk-f-display);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
	border: 0;
	cursor: pointer;
	white-space: nowrap;
	transition: background 0.22s var(--jk-ease), transform 0.22s var(--jk-ease);
}

.jkdr-cta:hover,
.jkdr-cta:focus-visible {
	background: var(--jk-scarlet-dp);
	transform: translateY(-1px);
}

.jkdr-cta--ghost {
	background: transparent;
	border: 1px solid rgba(255, 255, 255, 0.35);
	color: var(--jk-bone);
}

.jkdr-cta--ghost:hover,
.jkdr-cta--ghost:focus-visible {
	background: rgba(255, 255, 255, 0.08);
	border-color: var(--jk-bone);
}

/*
 * Skriva se samo gumb u traci zaglavlja, gdje na uskim ekranima nema mjesta
 * pored logotipa i hamburgera. Gumb unutar mobilnog panela mora ostati
 * vidljiv — zato je selektor vezan na .jkdr-header-inner, a ne na .jkdr-header.
 */
.jkdr-header-inner > .jkdr-cta {
	display: none;
}

@media (min-width: 620px) {
	.jkdr-header-inner > .jkdr-cta {
		display: inline-flex;
	}
}

.jkdr-nav-panel .jkdr-cta {
	display: flex;
	width: 100%;
	margin-top: 1.75rem;
	padding-block: 1rem;
	font-size: 0.875rem;
}

.jkdr-menu-missing {
	margin: 0;
	padding: 0.5rem 0.75rem;
	font-family: var(--jk-f-display);
	font-size: 0.75rem;
	color: var(--jk-scarlet-hi);
}

/* --------------------------------------------------------------------------
   6. Podnožje
   -------------------------------------------------------------------------- */

.jkdr-footer {
	background: var(--jk-sumi);
	color: var(--jk-bone);
	padding-block: clamp(2.5rem, 6vw, 4rem) 0;
}

.jkdr-footer-grid {
	display: grid;
	gap: clamp(1.75rem, 4vw, 3rem);
	grid-template-columns: 1fr;
}

@media (min-width: 720px) {
	.jkdr-footer-grid {
		grid-template-columns: 1.4fr 1fr 1fr;
	}
}

.jkdr-footer h2 {
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--jk-bone-dim);
	margin-bottom: 1rem;
}

.jkdr-footer-brand img {
	height: 72px;
	width: auto;
	margin-bottom: 1rem;
}

.jkdr-footer p {
	color: var(--jk-bone-dim);
	font-size: 0.9375rem;
}

.jkdr-footer a {
	color: var(--jk-bone);
	text-decoration: none;
	transition: color 0.2s var(--jk-ease);
}

.jkdr-footer a:hover,
.jkdr-footer a:focus-visible {
	color: var(--jk-scarlet-hi);
}

.jkdr-footer .jkdr-menu {
	flex-direction: column;
	align-items: flex-start;
	gap: 0.15rem;
}

.jkdr-footer .jkdr-menu-link {
	padding: 0.35rem 0;
	color: var(--jk-bone-dim);
	font-size: 0.75rem;
}

.jkdr-footer .jkdr-menu-link::after {
	display: none;
}

.jkdr-footer .jkdr-menu-link:hover {
	color: var(--jk-scarlet-hi);
}

/*
 * U podnožju nema padajućih izbornika — podstavke se ispisuju kao obični
 * redovi, pa gumb za otvaranje ondje samo zbunjuje.
 */
.jkdr-footer .jkdr-submenu-toggle {
	display: none;
}

.jkdr-footer .jkdr-submenu .jkdr-menu-link {
	padding-left: 0.9rem;
	font-size: 0.6875rem;
}

.jkdr-footer .jkdr-submenu .jkdr-menu-link::before {
	content: "\2022";
	margin-right: 0.45rem;
	color: var(--jk-straw);
}

.jkdr-contact-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.55rem;
	font-size: 0.9375rem;
	color: var(--jk-bone-dim);
}

.jkdr-contact-list strong {
	display: block;
	font-family: var(--jk-f-display);
	font-size: 0.625rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--jk-straw);
	margin-bottom: 0.1rem;
}

.jkdr-colophon {
	margin-top: clamp(2rem, 5vw, 3rem);
	padding-block: 1.25rem;
	border-top: 1px solid rgba(255, 255, 255, 0.09);
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.5rem;
	align-items: center;
	justify-content: space-between;
	font-size: 0.8125rem;
	color: var(--jk-bone-dim);
}

.jkdr-colophon .jkdr-jp {
	font-size: 1.05rem;
	margin-right: 0.4rem;
	vertical-align: -0.1em;
}

/* --------------------------------------------------------------------------
   7. Sadržaj članaka i stranica
   -------------------------------------------------------------------------- */

.jkdr-prose {
	max-width: 68ch;
}

.jkdr-prose > * + * {
	margin-top: 1.1em;
}

.jkdr-prose h2 {
	font-size: clamp(1.375rem, 3vw, 1.875rem);
	margin-top: 2em;
	text-transform: uppercase;
}

.jkdr-prose h3 {
	font-size: clamp(1.125rem, 2.4vw, 1.375rem);
	margin-top: 1.8em;
}

.jkdr-prose ul,
.jkdr-prose ol {
	padding-left: 1.3em;
}

.jkdr-prose li + li {
	margin-top: 0.4em;
}

.jkdr-prose a {
	color: var(--jk-scarlet-dp);
	text-decoration-thickness: 1px;
}

.jkdr-prose a:hover {
	color: var(--jk-scarlet);
}

.jkdr-prose img {
	margin-block: 1.6em;
}

.jkdr-prose blockquote {
	margin: 1.8em 0;
	padding-left: 1.2rem;
	border-left: 3px solid var(--jk-scarlet);
	font-size: 1.125rem;
	color: var(--jk-ink-dim);
}

.jkdr-page-title {
	font-size: clamp(1.875rem, 5vw, 3rem);
	text-transform: uppercase;
}

/* --------------------------------------------------------------------------
   8. Pokret
   -------------------------------------------------------------------------- */

/*
 * Sadržaj se skriva samo ako je JavaScript stvarno dostupan. Bez ovog uvjeta
 * stranica ostaje prazna kad skripta zakaže ili kasni — a sadržaj mora biti
 * čitljiv i bez JS-a.
 */
.jkdr-js .jkdr-rise {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity 0.6s var(--jk-ease), transform 0.6s var(--jk-ease);
}

.jkdr-js .jkdr-rise.is-in {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
	}

	.jkdr-js .jkdr-rise {
		opacity: 1;
		transform: none;
	}
}

/* --------------------------------------------------------------------------
   9. Hero stranice i objave
   -------------------------------------------------------------------------- */

.jkdr-pagehero {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: clamp(300px, 48vh, 520px);
	background: var(--jk-sumi);
	color: var(--jk-bone);
	padding-block: clamp(2rem, 6vw, 4rem);
	overflow: hidden;
}

.jkdr-pagehero-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0.5;
}

.jkdr-pagehero::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(
		75deg,
		var(--jk-sumi) 10%,
		rgba(18, 16, 15, 0.66) 52%,
		rgba(18, 16, 15, 0.22)
	);
}

.jkdr-pagehero-in {
	position: relative;
	z-index: 2;
	width: 100%;
}

.jkdr-pagehero .jkdr-eyebrow {
	color: var(--jk-bone-dim);
}

.jkdr-pagehero-meta {
	margin-top: 0.85rem;
	font-family: var(--jk-f-display);
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--jk-bone-dim);
}

/* --------------------------------------------------------------------------
   10. Kartice objava
   -------------------------------------------------------------------------- */

.jkdr-cards {
	display: grid;
	gap: clamp(1.25rem, 3vw, 2rem);
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
}

.jkdr-card {
	display: flex;
	flex-direction: column;
	background: var(--jk-paper-2);
	border: 1px solid var(--jk-rule);
	overflow: hidden;
	transition: border-color 0.28s var(--jk-ease),
		box-shadow 0.28s var(--jk-ease),
		transform 0.28s var(--jk-ease);
}

.jkdr-card:hover {
	border-color: var(--jk-scarlet);
	box-shadow: 0 14px 34px rgba(23, 18, 15, 0.12);
	transform: translateY(-3px);
}

.jkdr-card-media {
	display: block;
	position: relative;
	aspect-ratio: 8 / 5;
	overflow: hidden;
	background: var(--jk-sumi-2);
}

.jkdr-card-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s var(--jk-ease);
}

.jkdr-card:hover .jkdr-card-media img {
	transform: scale(1.05);
}

.jkdr-card-fallback {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	font-size: 2.5rem;
	opacity: 0.35;
}

.jkdr-card-body {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: clamp(1.1rem, 2.4vw, 1.5rem);
}

.jkdr-card-date {
	margin: 0 0 0.6rem;
	font-family: var(--jk-f-display);
	font-size: 0.625rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--jk-ink-dim);
}

.jkdr-card-title {
	font-size: 1.125rem;
	line-height: 1.2;
	margin-bottom: 0.65rem;
}

.jkdr-card-title a {
	text-decoration: none;
	background-image: linear-gradient(var(--jk-scarlet), var(--jk-scarlet));
	background-repeat: no-repeat;
	background-size: 0 2px;
	background-position: left 100%;
	transition: background-size 0.35s var(--jk-ease);
}

.jkdr-card:hover .jkdr-card-title a {
	background-size: 100% 2px;
}

.jkdr-card-excerpt {
	margin: 0 0 1rem;
	font-size: 0.9375rem;
	color: var(--jk-ink-dim);
}

.jkdr-card-more {
	margin-top: auto;
	font-family: var(--jk-f-display);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--jk-scarlet-dp);
}

.jkdr-card-more::after {
	content: " →";
	display: inline-block;
	transition: transform 0.28s var(--jk-ease);
}

.jkdr-card:hover .jkdr-card-more::after {
	transform: translateX(4px);
}

/* --------------------------------------------------------------------------
   11. Paginacija i navigacija objava
   -------------------------------------------------------------------------- */

.pagination {
	margin-top: clamp(2rem, 5vw, 3rem);
}

.pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	align-items: center;
}

.pagination .page-numbers {
	display: grid;
	place-items: center;
	min-width: 44px;
	min-height: 44px;
	padding-inline: 0.6rem;
	border: 1px solid var(--jk-rule);
	font-family: var(--jk-f-display);
	font-size: 0.8125rem;
	font-weight: 600;
	text-decoration: none;
	transition: border-color 0.2s var(--jk-ease), color 0.2s var(--jk-ease);
}

.pagination .page-numbers:hover {
	border-color: var(--jk-scarlet);
	color: var(--jk-scarlet-dp);
}

.pagination .page-numbers.current {
	background: var(--jk-scarlet);
	border-color: var(--jk-scarlet);
	color: #fff;
}

.jkdr-postnav {
	display: grid;
	gap: 1px;
	background: var(--jk-rule);
	border: 1px solid var(--jk-rule);
	margin-top: clamp(2.5rem, 6vw, 4rem);
}

@media (min-width: 700px) {
	.jkdr-postnav {
		grid-template-columns: 1fr 1fr;
	}
}

.jkdr-postnav-link {
	display: block;
	padding: clamp(1rem, 2.4vw, 1.4rem);
	background: var(--jk-paper-2);
	font-family: var(--jk-f-display);
	font-size: 0.9375rem;
	font-weight: 700;
	line-height: 1.25;
	text-decoration: none;
	transition: background 0.22s var(--jk-ease), color 0.22s var(--jk-ease);
}

.jkdr-postnav-link:hover {
	background: var(--jk-sumi);
	color: var(--jk-bone);
}

.jkdr-postnav-link span {
	display: block;
	margin-bottom: 0.4rem;
	font-size: 0.625rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--jk-scarlet);
}

.jkdr-postnav-link--next {
	text-align: right;
}

/* --------------------------------------------------------------------------
   12. 404
   -------------------------------------------------------------------------- */

.jkdr-404 {
	position: relative;
	overflow: hidden;
}

.jkdr-404-mark {
	position: absolute;
	right: -0.1em;
	bottom: -0.35em;
	font-size: clamp(9rem, 26vw, 20rem);
	opacity: 0.07;
	pointer-events: none;
	user-select: none;
}

.jkdr-404 .jkdr-wrap {
	position: relative;
	z-index: 1;
}

/* --------------------------------------------------------------------------
   13. Naslovnica — zajedničko za sekcije
   -------------------------------------------------------------------------- */

.jkdr-sec-head {
	margin-bottom: clamp(1.75rem, 4vw, 2.75rem);
}

.jkdr-sec-head--row {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem 2rem;
	align-items: flex-end;
	justify-content: space-between;
}

.jkdr-sec-title {
	font-size: clamp(1.625rem, 4.2vw, 2.75rem);
	text-transform: uppercase;
}

.jkdr-accent {
	color: var(--jk-scarlet);
}

.jkdr-band--dark .jkdr-accent,
.jkdr-cta-band .jkdr-accent {
	color: var(--jk-scarlet-hi);
}

.jkdr-sec-lede {
	max-width: 62ch;
	margin-top: 1rem;
	color: var(--jk-ink-dim);
	font-size: clamp(1rem, 1.6vw, 1.125rem);
}

.jkdr-band--dark .jkdr-sec-lede {
	color: var(--jk-bone-dim);
}

.jkdr-link-more {
	font-family: var(--jk-f-display);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--jk-scarlet-dp);
	white-space: nowrap;
	padding-block: 0.4rem;
}

.jkdr-link-more::after {
	content: " \2192";
	display: inline-block;
	transition: transform 0.28s var(--jk-ease);
}

.jkdr-link-more:hover::after {
	transform: translateX(4px);
}

.jkdr-muted {
	color: var(--jk-ink-dim);
}

/* --------------------------------------------------------------------------
   14. Hero
   -------------------------------------------------------------------------- */

.jkdr-hero {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: clamp(460px, 78vh, 780px);
	background: var(--jk-sumi);
	color: var(--jk-bone);
	overflow: hidden;
}

.jkdr-hero-media {
	position: absolute;
	inset: 0;
}

.jkdr-hero-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0.46;
	transform: scale(1.02);
	animation: jkdr-breathe 18s var(--jk-ease) forwards;
}

@keyframes jkdr-breathe {
	to {
		transform: scale(1.08);
	}
}

.jkdr-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(
			72deg,
			var(--jk-sumi) 8%,
			rgba(18, 16, 15, 0.72) 46%,
			rgba(18, 16, 15, 0.28) 100%
		),
		linear-gradient(to top, var(--jk-sumi) 2%, transparent 32%);
	z-index: 1;
}

.jkdr-hero-inner {
	position: relative;
	z-index: 2;
	padding-top: clamp(3rem, 10vw, 6rem);
	padding-bottom: clamp(2rem, 5vw, 3.5rem);
}

.jkdr-hero-jp {
	display: block;
	font-size: clamp(1.5rem, 3.5vw, 2.25rem);
	margin-bottom: 0.75rem;
}

.jkdr-hero-title {
	font-size: clamp(2.25rem, 7.5vw, 5rem);
	text-transform: uppercase;
	max-width: 16ch;
}

/*
 * Izuzima se .jkdr-hi: highlight kutija mora obuhvatiti samo riječ, a ne
 * cijeli redak. Bez :not() bi je ovo pravilo raširilo preko pune širine.
 */
.jkdr-hero-title span:not(.jkdr-hi) {
	display: block;
	color: var(--jk-red-lift);
}

.jkdr-hero-lede {
	max-width: 48ch;
	margin-top: 1.25rem;
	font-size: clamp(1rem, 1.9vw, 1.1875rem);
	color: rgba(242, 237, 229, 0.82);
}

.jkdr-hero-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: clamp(1.5rem, 3.5vw, 2.25rem);
}

.jkdr-hero-stats {
	position: relative;
	z-index: 2;
	/* Puna podloga — bez nje bi se desno od zadnje ćelije vidjela fotografija. */
	background: var(--jk-sumi);
	border-top: 1px solid rgba(255, 255, 255, 0.14);
}

/*
 * auto-fit umjesto fiksnog broja stupaca — traka izgleda ispravno bez obzira
 * na to koliko je brojki, pa dodavanje ili micanje jedne ne traži zahvat u CSS.
 */
.jkdr-hero-stats-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
	gap: 1px;
	background: rgba(255, 255, 255, 0.12);
	padding-inline: 0;
}

.jkdr-stat {
	background: var(--jk-sumi);
	padding: clamp(0.9rem, 2.2vw, 1.35rem) clamp(1rem, 2.4vw, 1.5rem);
}

.jkdr-stat b {
	display: block;
	font-family: var(--jk-f-display);
	font-weight: 800;
	font-size: clamp(1.0625rem, 2.4vw, 1.625rem);
	line-height: 1.05;
	letter-spacing: -0.03em;
	color: var(--jk-scarlet-hi);
	font-variant-numeric: tabular-nums;
}

.jkdr-stat span {
	display: block;
	margin-top: 0.35rem;
	font-family: var(--jk-f-display);
	font-size: 0.625rem;
	font-weight: 600;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--jk-bone-dim);
}

/* --------------------------------------------------------------------------
   15. Termini treninga
   -------------------------------------------------------------------------- */

.jkdr-termini {
	display: grid;
	gap: 1px;
	background: var(--jk-rule);
	border: 1px solid var(--jk-rule);
	grid-template-columns: 1fr;
}

@media (min-width: 760px) {
	.jkdr-termini {
		grid-template-columns: repeat(3, 1fr);
	}
}

.jkdr-termin {
	position: relative;
	background: var(--jk-paper-2);
	padding: clamp(1.35rem, 3vw, 2rem);
}

.jkdr-termin::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 3px;
	background: var(--jk-scarlet);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.4s var(--jk-ease);
}

.jkdr-termin:hover::before {
	transform: scaleX(1);
}

.jkdr-termin-num {
	display: block;
	font-family: var(--jk-f-display);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: var(--jk-scarlet);
	margin-bottom: 0.9rem;
	font-variant-numeric: tabular-nums;
}

.jkdr-termin-uzrast {
	font-size: 1.0625rem;
	text-transform: uppercase;
	margin-bottom: 0.5rem;
}

.jkdr-termin-dani {
	margin: 0 0 0.75rem;
	font-family: var(--jk-f-display);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: var(--jk-ink);
}

.jkdr-termin-napomena {
	margin: 0;
	font-size: 0.9375rem;
	color: var(--jk-ink-dim);
}

.jkdr-prijave {
	margin-top: clamp(1.75rem, 4vw, 2.5rem);
	background: var(--jk-sumi);
	color: var(--jk-bone);
	padding: clamp(1.35rem, 3vw, 2rem);
}

.jkdr-prijave-naslov {
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--jk-bone-dim);
	margin-bottom: 1.15rem;
}

.jkdr-prijave-lista {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 1px;
	background: rgba(255, 255, 255, 0.12);
	border: 1px solid rgba(255, 255, 255, 0.12);
}

@media (min-width: 760px) {
	.jkdr-prijave-lista {
		grid-template-columns: repeat(3, 1fr);
	}
}

.jkdr-prijave-lista li {
	background: var(--jk-sumi);
	padding: 1rem 1.1rem;
}

.jkdr-prijave-lista span {
	display: block;
	font-family: var(--jk-f-display);
	font-size: 0.625rem;
	font-weight: 600;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--jk-straw);
	margin-bottom: 0.4rem;
}

.jkdr-prijave-lista a {
	font-family: var(--jk-f-display);
	font-size: 1rem;
	font-weight: 700;
	color: var(--jk-bone);
	text-decoration: none;
	transition: color 0.2s var(--jk-ease);
}

.jkdr-prijave-lista a:hover,
.jkdr-prijave-lista a:focus-visible {
	color: var(--jk-scarlet-hi);
}

/* --------------------------------------------------------------------------
   16. Poruka kluba i video
   -------------------------------------------------------------------------- */

.jkdr-manifest-grid {
	display: grid;
	gap: clamp(2rem, 5vw, 3.5rem);
	align-items: center;
	grid-template-columns: 1fr;
}

@media (min-width: 900px) {
	.jkdr-manifest-grid {
		grid-template-columns: 1fr 1fr;
	}
}

.jkdr-manifest-text {
	margin-block: clamp(1.25rem, 3vw, 1.75rem);
	max-width: 52ch;
}

.jkdr-manifest-text p {
	color: rgba(242, 237, 229, 0.8);
	font-size: 1.0625rem;
}

.jkdr-manifest-text p:first-child {
	font-size: clamp(1.125rem, 2.2vw, 1.375rem);
	color: var(--jk-bone);
	border-left: 3px solid var(--jk-scarlet);
	padding-left: 1.1rem;
}

.jkdr-video {
	margin: 0;
}

.jkdr-video-frame {
	position: relative;
	aspect-ratio: 16 / 9;
	background: var(--jk-sumi-2);
	border: 1px solid rgba(255, 255, 255, 0.14);
	overflow: hidden;
}

.jkdr-video-frame iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.jkdr-video figcaption {
	margin-top: 0.9rem;
	font-size: 0.9375rem;
	color: var(--jk-bone-dim);
}

.jkdr-video figcaption strong {
	display: block;
	font-family: var(--jk-f-display);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.11em;
	text-transform: uppercase;
	color: var(--jk-bone);
	margin-bottom: 0.25rem;
}

/* --------------------------------------------------------------------------
   17. Podržavatelji
   -------------------------------------------------------------------------- */

/*
 * Pločice s razmakom umjesto mreže s linijama u razmacima: broj sponzora
 * (9) ne popunjava zadnji red, pa bi tehnika "gap kao linija" ostavila
 * praznu ćeliju obojanu bojom linije.
 */
.jkdr-sponzori {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: clamp(0.5rem, 1.4vw, 0.75rem);
	grid-template-columns: repeat(2, 1fr);
}

@media (min-width: 620px) {
	.jkdr-sponzori {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (min-width: 960px) {
	.jkdr-sponzori {
		grid-template-columns: repeat(5, 1fr);
	}
}

.jkdr-sponzor {
	background: var(--jk-paper-2);
	border: 1px solid var(--jk-rule);
	transition: border-color 0.28s var(--jk-ease);
}

.jkdr-sponzor:hover {
	border-color: var(--jk-scarlet);
}

.jkdr-sponzor-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.85rem;
	height: 100%;
	padding: clamp(1.1rem, 2.4vw, 1.5rem) 0.9rem;
	text-decoration: none;
	color: inherit;
	transition: background 0.28s var(--jk-ease);
}

a.jkdr-sponzor-inner:hover,
a.jkdr-sponzor-inner:focus-visible {
	background: var(--jk-paper);
}

.jkdr-sponzor-plate {
	display: grid;
	place-items: center;
	width: 100%;
	height: 62px;
}

/*
 * Zatečeni logotipi su vrlo različitih veličina, a najmanji je 98x20 px.
 * Zato se koriste samo gornje granice: logotip se smanjuje ako je prevelik,
 * ali se nikad ne rasteže iznad prirodne veličine, gdje bi postao mutan.
 */
.jkdr-sponzor-logo {
	max-width: 100%;
	max-height: 56px;
	width: auto;
	height: auto;
	object-fit: contain;
	filter: grayscale(1);
	opacity: 0.62;
	transition: filter 0.32s var(--jk-ease), opacity 0.32s var(--jk-ease);
}

.jkdr-sponzor-inner:hover .jkdr-sponzor-logo,
.jkdr-sponzor-inner:focus-visible .jkdr-sponzor-logo {
	filter: grayscale(0);
	opacity: 1;
}

.jkdr-sponzor-noimg {
	font-family: var(--jk-f-display);
	font-size: 1.5rem;
	font-weight: 800;
	color: var(--jk-rule);
}

.jkdr-sponzor-naziv {
	font-family: var(--jk-f-display);
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	text-align: center;
	color: var(--jk-ink-dim);
	line-height: 1.3;
	transition: color 0.28s var(--jk-ease);
}

.jkdr-sponzor-inner:hover .jkdr-sponzor-naziv {
	color: var(--jk-scarlet-dp);
}

/* --------------------------------------------------------------------------
   18. Poziv na upis
   -------------------------------------------------------------------------- */

.jkdr-cta-band {
	position: relative;
	background: var(--jk-sumi);
	color: var(--jk-bone);
	padding-block: clamp(3rem, 8vw, 5.5rem);
	overflow: hidden;
}

.jkdr-cta-media {
	position: absolute;
	inset: 0;
}

.jkdr-cta-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0.32;
}

.jkdr-cta-band::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(
		100deg,
		var(--jk-sumi) 12%,
		rgba(18, 16, 15, 0.7) 55%,
		rgba(18, 16, 15, 0.4)
	);
	z-index: 1;
}

.jkdr-cta-inner {
	position: relative;
	z-index: 2;
}

.jkdr-cta-band .jkdr-eyebrow {
	color: var(--jk-bone-dim);
}

.jkdr-cta-lede {
	max-width: 52ch;
	margin-top: 1rem;
	color: rgba(242, 237, 229, 0.82);
	font-size: clamp(1rem, 1.7vw, 1.125rem);
}

@media (prefers-reduced-motion: reduce) {
	.jkdr-hero-img {
		animation: none;
		transform: none;
	}
}

/* --------------------------------------------------------------------------
   19. Obrasci
   -------------------------------------------------------------------------- */

.jkdr-form-wrap {
	scroll-margin-top: calc(var(--jk-header-h) + 1rem);
}

.jkdr-form-grid {
	display: grid;
	gap: 1rem 1.15rem;
	grid-template-columns: 1fr;
}

@media (min-width: 560px) {
	.jkdr-form-grid {
		grid-template-columns: 1fr 1fr;
	}
}

.jkdr-field {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}

.jkdr-field--wide {
	grid-column: 1 / -1;
}

.jkdr-field label {
	font-family: var(--jk-f-display);
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--jk-ink-dim);
}

.jkdr-req {
	color: var(--jk-scarlet);
	margin-left: 0.15em;
}

.jkdr-field input,
.jkdr-field textarea {
	width: 100%;
	padding: 0.8rem 0.9rem;
	background: var(--jk-paper-2);
	color: var(--jk-ink);
	border: 1px solid var(--jk-rule);
	border-radius: 0;
	font-family: var(--jk-f-body);
	font-size: 1rem;
	line-height: 1.5;
	transition: border-color 0.2s var(--jk-ease), box-shadow 0.2s var(--jk-ease);
}

.jkdr-field textarea {
	resize: vertical;
	min-height: 7rem;
}

.jkdr-field input:hover,
.jkdr-field textarea:hover {
	border-color: var(--jk-straw);
}

.jkdr-field input:focus,
.jkdr-field textarea:focus {
	border-color: var(--jk-scarlet);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--jk-scarlet) 18%, transparent);
	outline: none;
}

.jkdr-field.has-error input,
.jkdr-field.has-error textarea {
	border-color: var(--jk-err);
	background: color-mix(in srgb, var(--jk-err) 4%, var(--jk-paper-2));
}

.jkdr-field-err {
	font-family: var(--jk-f-display);
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--jk-err);
}

/* Honeypot — izvan ekrana, ne display:none, da ga roboti "vide" */
.jkdr-hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.jkdr-form-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.85rem 1.25rem;
	margin: 1.35rem 0 0;
}

.jkdr-form-actions .jkdr-cta {
	border: 0;
	font-family: var(--jk-f-display);
	padding: 0.85rem 1.5rem;
}

.jkdr-form-note {
	font-size: 0.8125rem;
	color: var(--jk-ink-dim);
	max-width: 34ch;
}

/* Poruke */
.jkdr-form-msg {
	margin-bottom: 1.35rem;
	padding: 0.95rem 1.15rem;
	border-left: 4px solid var(--jk-rule);
	background: var(--jk-paper-2);
	font-size: 0.9375rem;
}

.jkdr-form-msg:focus {
	outline: 3px solid var(--jk-scarlet);
	outline-offset: 2px;
}

.jkdr-form-msg--ok {
	border-left-color: var(--jk-ok);
	background: color-mix(in srgb, var(--jk-ok) 7%, var(--jk-paper-2));
}

.jkdr-form-msg--err {
	border-left-color: var(--jk-err);
	background: color-mix(in srgb, var(--jk-err) 7%, var(--jk-paper-2));
}

.jkdr-form-msg strong {
	font-family: var(--jk-f-display);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: 0.8125rem;
	margin-right: 0.35rem;
}

/* --------------------------------------------------------------------------
   20. Kontakt i portal
   -------------------------------------------------------------------------- */

.jkdr-kontakt-grid {
	display: grid;
	gap: clamp(2rem, 5vw, 3.5rem);
	grid-template-columns: 1fr;
	align-items: start;
}

@media (min-width: 900px) {
	.jkdr-kontakt-grid {
		grid-template-columns: 1.25fr 1fr;
	}
}

.jkdr-info-list {
	list-style: none;
	margin: 0 0 1.75rem;
	padding: 0;
	display: grid;
	gap: 1px;
	background: var(--jk-rule);
	border: 1px solid var(--jk-rule);
}

.jkdr-info-list li {
	background: var(--jk-paper-2);
	padding: 0.95rem 1.1rem;
}

.jkdr-info-list strong {
	display: block;
	margin-bottom: 0.3rem;
	font-family: var(--jk-f-display);
	font-size: 0.625rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--jk-ink-dim);
}

.jkdr-info-list a {
	font-family: var(--jk-f-display);
	font-weight: 700;
	text-decoration: none;
	color: var(--jk-ink);
	transition: color 0.2s var(--jk-ease);
}

.jkdr-info-list a:hover {
	color: var(--jk-scarlet-dp);
}

.jkdr-iban {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 0.9375rem;
	letter-spacing: 0.02em;
}

.jkdr-map {
	border: 1px solid var(--jk-rule);
	background: var(--jk-paper-2);
}

.jkdr-map iframe {
	display: block;
	width: 100%;
	height: 280px;
	border: 0;
}

.jkdr-map-link {
	margin: 0;
	padding: 0.7rem 1.1rem;
	border-top: 1px solid var(--jk-rule);
	font-family: var(--jk-f-display);
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.jkdr-map-link a {
	color: var(--jk-scarlet-dp);
	text-decoration: none;
}

.jkdr-portal-box {
	background: var(--jk-sumi);
	color: var(--jk-bone);
	padding: clamp(1.5rem, 3.5vw, 2.25rem);
}

.jkdr-portal-box p {
	color: var(--jk-bone-dim);
	margin-bottom: 1.5rem;
}

/* --------------------------------------------------------------------------
   21. Newsletter u pozivu na upis
   -------------------------------------------------------------------------- */

.jkdr-newsletter {
	margin-top: clamp(2rem, 5vw, 3rem);
	padding-top: clamp(1.75rem, 4vw, 2.5rem);
	border-top: 1px solid rgba(255, 255, 255, 0.16);
	max-width: 40rem;
}

.jkdr-newsletter-naslov {
	font-size: clamp(1rem, 2vw, 1.25rem);
	text-transform: uppercase;
	margin-bottom: 0.5rem;
}

.jkdr-newsletter-lede {
	color: rgba(242, 237, 229, 0.75);
	font-size: 0.9375rem;
	margin-bottom: 1.25rem;
}

/* Obrazac na tamnoj podlozi */
.jkdr-newsletter .jkdr-field label {
	color: var(--jk-bone-dim);
}

.jkdr-newsletter .jkdr-field input {
	background: rgba(255, 255, 255, 0.06);
	border-color: rgba(255, 255, 255, 0.24);
	color: var(--jk-bone);
}

.jkdr-newsletter .jkdr-field input::placeholder {
	color: var(--jk-bone-dim);
}

.jkdr-newsletter .jkdr-field input:focus {
	border-color: var(--jk-scarlet-hi);
	background: rgba(255, 255, 255, 0.1);
}

.jkdr-newsletter .jkdr-form-note {
	color: rgba(242, 237, 229, 0.6);
}

.jkdr-newsletter .jkdr-form-msg {
	background: rgba(255, 255, 255, 0.07);
	color: var(--jk-bone);
}

.jkdr-newsletter .jkdr-form-msg--ok {
	border-left-color: #4fbf88;
}

.jkdr-newsletter .jkdr-form-msg--err {
	border-left-color: var(--jk-scarlet-hi);
}

@media (min-width: 560px) {
	.jkdr-newsletter .jkdr-form-grid {
		grid-template-columns: 1fr;
	}
}

/* --------------------------------------------------------------------------
   22. O nama
   -------------------------------------------------------------------------- */

.jkdr-onama-grid {
	display: grid;
	gap: clamp(2rem, 5vw, 3.5rem);
	grid-template-columns: 1fr;
	align-items: start;
}

@media (min-width: 900px) {
	.jkdr-onama-grid {
		grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
	}
}

.jkdr-cinjenice {
	background: var(--jk-paper-2);
	border: 1px solid var(--jk-rule);
	padding: clamp(1.35rem, 3vw, 1.85rem);
}

@media (min-width: 900px) {
	.jkdr-cinjenice {
		position: sticky;
		top: calc(var(--jk-header-h) + 1.5rem);
	}
}

.jkdr-cinjenice-naslov {
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--jk-ink-dim);
	padding-bottom: 0.85rem;
	margin-bottom: 1.15rem;
	border-bottom: 2px solid var(--jk-scarlet);
}

.jkdr-cinjenice dl {
	margin: 0 0 1.5rem;
	display: grid;
	gap: 1.1rem;
}

/* Na svijetloj podlozi slama ne bi prošla 4.5:1 — koristi se tamnija boja. */
.jkdr-cinjenice dt {
	font-family: var(--jk-f-display);
	font-size: 0.625rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--jk-ink-dim);
	margin-bottom: 0.3rem;
}

.jkdr-cinjenice dd {
	margin: 0;
	font-size: 0.9375rem;
	line-height: 1.5;
}

.jkdr-galerija {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: clamp(0.5rem, 1.5vw, 0.9rem);
	grid-template-columns: repeat(2, 1fr);
}

@media (min-width: 820px) {
	.jkdr-galerija {
		grid-template-columns: repeat(4, 1fr);
	}
}

.jkdr-galerija li {
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background: var(--jk-sumi-2);
}

.jkdr-galerija img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: grayscale(0.25);
	transition: transform 0.6s var(--jk-ease), filter 0.4s var(--jk-ease);
}

.jkdr-galerija li:hover img {
	transform: scale(1.05);
	filter: grayscale(0);
}

/* --------------------------------------------------------------------------
   23. Podržavatelji — puni popis
   -------------------------------------------------------------------------- */

.jkdr-partneri {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: clamp(0.75rem, 2vw, 1.1rem);
	grid-template-columns: 1fr;
}

@media (min-width: 720px) {
	.jkdr-partneri {
		grid-template-columns: repeat(2, 1fr);
	}
}

.jkdr-partner {
	display: grid;
	grid-template-columns: 120px 1fr;
	gap: clamp(1rem, 2.5vw, 1.5rem);
	align-items: start;
	padding: clamp(1.1rem, 2.5vw, 1.5rem);
	background: var(--jk-paper-2);
	border: 1px solid var(--jk-rule);
	transition: border-color 0.28s var(--jk-ease), box-shadow 0.28s var(--jk-ease);
}

.jkdr-partner:hover {
	border-color: var(--jk-scarlet);
	box-shadow: 0 10px 26px rgba(23, 18, 15, 0.08);
}

@media (max-width: 480px) {
	.jkdr-partner {
		grid-template-columns: 1fr;
	}
}

.jkdr-partner-logo {
	display: grid;
	place-items: center;
	min-height: 64px;
	padding: 0.5rem;
	background: var(--jk-paper);
	border: 1px solid var(--jk-rule);
}

/* Ista pravila kao u mreži na naslovnici: bez uvećavanja iznad prirodne veličine. */
.jkdr-partner-logo .jkdr-sponzor-logo {
	filter: none;
	opacity: 1;
	max-height: 48px;
}

.jkdr-partner-naziv {
	font-size: 1.0625rem;
	text-transform: uppercase;
	margin-bottom: 0.85rem;
}

.jkdr-partner-kontakt {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.6rem;
	font-size: 0.9375rem;
}

.jkdr-partner-kontakt span {
	display: block;
	font-family: var(--jk-f-display);
	font-size: 0.625rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--jk-ink-dim);
	margin-bottom: 0.15rem;
}

.jkdr-partner-kontakt a {
	color: var(--jk-ink);
	text-decoration: none;
	border-bottom: 1px solid var(--jk-rule);
	transition: color 0.2s var(--jk-ease), border-color 0.2s var(--jk-ease);
}

.jkdr-partner-kontakt a:hover {
	color: var(--jk-scarlet-dp);
	border-color: var(--jk-scarlet);
}

.jkdr-partner-prazno {
	margin: 0;
	font-size: 0.9375rem;
	font-style: italic;
	color: var(--jk-ink-dim);
}

/* Poziv na donaciju */
.jkdr-donacija {
	display: grid;
	gap: clamp(1.75rem, 4vw, 3rem);
	grid-template-columns: 1fr;
	align-items: center;
}

@media (min-width: 860px) {
	.jkdr-donacija {
		grid-template-columns: 1.3fr 1fr;
	}
}

.jkdr-iban-box {
	background: var(--jk-sumi-2);
	border: 1px solid rgba(255, 255, 255, 0.14);
	padding: clamp(1.35rem, 3vw, 1.85rem);
}

.jkdr-iban-box span {
	display: block;
	font-family: var(--jk-f-display);
	font-size: 0.625rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--jk-straw);
	margin-bottom: 0.5rem;
}

.jkdr-iban-box strong {
	display: block;
	font-size: clamp(0.9375rem, 2.2vw, 1.125rem);
	color: var(--jk-bone);
	margin-bottom: 1.35rem;
	word-break: break-all;
}

/* ==========================================================================
   24. Znakovlje marke
   Potpisni element preuzet iz klupskih objava: crvena kutija iza ključne
   riječi („DISCIPLINE BUILDS TRUE CHAMPIONS"). Kutija se pri ulasku u vidno
   polje iscrtava slijeva, a riječ tek tada pobijeli.
   ========================================================================== */

.jkdr-hi {
	position: relative;
	isolation: isolate;
	display: inline-block;
	padding: 0 0.2em;
	color: inherit;
	transition: color 0.25s linear 0.22s;
}

.jkdr-hi::before {
	content: "";
	position: absolute;
	inset: 0.08em 0 0.06em;
	z-index: -1;
	background: var(--jk-red);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.55s var(--jk-ease-out);
}

/* Obrisna varijanta — drugi ritam u istoj rečenici */
.jkdr-hi--line::before {
	background: transparent;
	border: 3px solid var(--jk-red);
}

/* Zapaljeno stanje: postavlja ga reveal.js, ili odmah ako nema JS-a */
.jkdr-hi.is-lit::before,
.jkdr-rise.is-in .jkdr-hi::before {
	transform: scaleX(1);
}

.jkdr-hi.is-lit,
.jkdr-rise.is-in .jkdr-hi {
	color: #fff;
}

.jkdr-hi--line.is-lit,
.jkdr-rise.is-in .jkdr-hi--line {
	color: inherit;
}

/* Bez JavaScripta kutija stoji ispunjena i tekst je bijel od početka. */
html:not(.jkdr-js) .jkdr-hi::before {
	transform: scaleX(1);
}

html:not(.jkdr-js) .jkdr-hi {
	color: #fff;
}

html:not(.jkdr-js) .jkdr-hi--line {
	color: inherit;
}

/* --------------------------------------------------------------------------
   25. Tekstura marke — znak kluba kao tihi raster
   -------------------------------------------------------------------------- */

.jkdr-textured {
	position: relative;
	isolation: isolate;
}

.jkdr-textured::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background-image: var(--jk-mark);
	background-repeat: repeat;
	background-size: 88px auto;
	opacity: 0.05;
}

/*
 * Ovdje je nekad stajalo `.jkdr-textured > * { position: relative }`.
 * Imalo je istu specifičnost kao `.jkdr-cta-media { position: absolute }`,
 * a dolazilo kasnije u datoteci — pa je pozadinsku sliku poziva na upis
 * izbacilo iz podloge u normalni tok i razbilo dno stranice.
 *
 * Ne treba: `isolation: isolate` iznad već stvara kontekst slaganja, pa
 * tekstura sa `z-index: -1` ide iza sadržaja, a sadržaj ostaje na svom mjestu.
 */

/* --------------------------------------------------------------------------
   26. Tipografske prilagodbe za Poppins + Helvetica
   -------------------------------------------------------------------------- */

body {
	font-family: var(--jk-f-body);
	font-size: 1.0625rem;
	line-height: 1.6;
	letter-spacing: -0.003em;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--jk-f-display);
	font-weight: 700;
	letter-spacing: -0.025em;
	line-height: 1.05;
}

.jkdr-hero-title,
.jkdr-page-title,
.jkdr-sec-title {
	font-weight: 800;
}

/* Poppins je geometričan i uzak u verzalima — mala pozitivna razmaknutost
   drži male oznake čitljivima. */
.jkdr-eyebrow,
.jkdr-menu-link,
.jkdr-cta,
.jkdr-stat span,
.jkdr-card-date,
.jkdr-card-more,
.jkdr-link-more,
.jkdr-termin-num,
.jkdr-field label,
.jkdr-partner-kontakt span,
.jkdr-info-list strong,
.jkdr-contact-list strong,
.jkdr-cinjenice dt,
.jkdr-prijave-lista span,
.jkdr-iban-box span {
	font-family: var(--jk-f-display);
	letter-spacing: 0.12em;
}

.jkdr-prose {
	max-width: 64ch;
	font-size: 1.0625rem;
	line-height: 1.68;
}

.jkdr-prose h2 {
	font-size: clamp(1.375rem, 3vw, 1.75rem);
	text-transform: none;
	letter-spacing: -0.02em;
}

.jkdr-prose strong {
	font-weight: 700;
}

/*
 * Uvodni tekst preko cijele širine spremnika, poravnat s karticama ispod.
 * Koristi se ondje gdje tekst uvodi mrežu, pa ga uža mjera vizualno odvaja
 * od nje. Osnovna .jkdr-prose zadržava mjeru od 64 znaka za duže tekstove.
 */
.jkdr-prose.jkdr-prose--puna {
	max-width: none;
}

/* --------------------------------------------------------------------------
   27. Slogan marke
   -------------------------------------------------------------------------- */

.jkdr-slogan {
	font-family: var(--jk-f-display);
	font-weight: 700;
	font-size: clamp(1.125rem, 2.6vw, 1.75rem);
	line-height: 1.25;
	letter-spacing: -0.015em;
	text-transform: uppercase;
	max-width: 22ch;
}

/* --------------------------------------------------------------------------
   28. Doradе komponenti uz novu paletu
   -------------------------------------------------------------------------- */

.jkdr-cta {
	border-radius: 2px;
	font-weight: 700;
}

.jkdr-card,
.jkdr-termin,
.jkdr-partner,
.jkdr-sponzor,
.jkdr-cinjenice,
.jkdr-map,
.jkdr-info-list {
	border-radius: 3px;
}

.jkdr-field input,
.jkdr-field textarea {
	border-radius: 3px;
	font-family: var(--jk-f-body);
}

/* Kartica objave — mirnija sjena, oštriji rub u marki */
.jkdr-card:hover {
	box-shadow: 0 16px 38px rgba(19, 16, 16, 0.1);
}

/* Zaglavlje: logotip iz knjige standarda je širi, pa mu treba nešto zraka */
.jkdr-brand img {
	height: 50px;
}

.jkdr-header.is-stuck .jkdr-brand img {
	height: 40px;
}

/* Hero: znak marke kao vodeni žig u praznom desnom dijelu */
.jkdr-hero-inner::after {
	content: "";
	position: absolute;
	right: -2%;
	bottom: 8%;
	width: min(340px, 34vw);
	aspect-ratio: 150 / 130;
	background-image: var(--jk-mark);
	background-repeat: no-repeat;
	background-size: contain;
	opacity: 0.1;
	pointer-events: none;
	display: none;
}

@media (min-width: 1000px) {
	.jkdr-hero-inner {
		position: relative;
	}

	.jkdr-hero-inner::after {
		display: block;
	}
}

/* --------------------------------------------------------------------------
   29. Dani treninga kao oznake
   Roditelj traži jedno: koji dan i u koje vrijeme. Dani su zato izdvojeni
   iz rečenice u zasebne oznake koje se čitaju bez čitanja.
   -------------------------------------------------------------------------- */

.jkdr-dani {
	list-style: none;
	margin: 0 0 0.9rem;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
}

.jkdr-dani li {
	font-family: var(--jk-f-display);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--jk-red-deep);
	background: color-mix(in srgb, var(--jk-red) 9%, transparent);
	border: 1px solid color-mix(in srgb, var(--jk-red) 26%, transparent);
	border-radius: 999px;
	padding: 0.3rem 0.65rem;
	white-space: nowrap;
}

.jkdr-termin {
	display: flex;
	flex-direction: column;
}

.jkdr-termin-uzrast {
	font-size: 1.0625rem;
	text-transform: none;
	letter-spacing: -0.015em;
	margin-bottom: 0.85rem;
}

.jkdr-termin-napomena {
	margin-top: auto;
}

/* --------------------------------------------------------------------------
   30. Hero — nadnaslov sa znakom
   -------------------------------------------------------------------------- */

.jkdr-hero-eyebrow {
	color: var(--jk-bone-dim);
	gap: 0.7rem;
}

.jkdr-hero-eyebrow::before {
	display: none;
}

.jkdr-hero-eyebrow .jkdr-jp {
	font-size: 1.25rem;
	color: var(--jk-red-lift);
}

.jkdr-hero-title {
	max-width: 18ch;
	line-height: 1.02;
}

/* Kutija u heru je velika, pa joj treba nešto zraka ispod retka */
.jkdr-hero-title .jkdr-hi {
	margin-top: 0.12em;
}

/* --------------------------------------------------------------------------
   31. Slogan u podnožju
   -------------------------------------------------------------------------- */

.jkdr-footer-slogan {
	font-family: var(--jk-f-display);
	font-weight: 700;
	font-size: 0.9375rem;
	line-height: 1.35;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: var(--jk-bone);
	margin: 0 0 1.15rem;
}

.jkdr-footer-slogan .jkdr-hi::before {
	inset: 0.1em 0 0.08em;
}

/* --------------------------------------------------------------------------
   32. Društvene mreže u podnožju
   -------------------------------------------------------------------------- */

.jkdr-socials {
	list-style: none;
	margin: 1.35rem 0 0;
	padding: 0;
	display: flex;
	gap: 0.5rem;
}

.jkdr-socials a {
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	color: var(--jk-bone);
	background: rgba(255, 255, 255, 0.07);
	border: 1px solid rgba(255, 255, 255, 0.16);
	border-radius: 3px;
	text-decoration: none;
	transition: background 0.24s var(--jk-ease), border-color 0.24s var(--jk-ease),
		color 0.24s var(--jk-ease), transform 0.24s var(--jk-ease);
}

.jkdr-socials a:hover,
.jkdr-socials a:focus-visible {
	background: var(--jk-red);
	border-color: var(--jk-red);
	color: #fff;
	transform: translateY(-2px);
}

.jkdr-socials svg {
	display: block;
}

/* Vidljivo samo administratoru dok poveznice nisu upisane. */
.jkdr-socials-missing {
	margin: 1.35rem 0 0;
	font-family: var(--jk-f-display);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.06em;
}

.jkdr-socials-missing a {
	color: var(--jk-red-lift);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

/* ==========================================================================
   33. Interakcije
   ========================================================================== */

/* --------------------------------------------------------------------------
   Cijela kartica objave je klikabilna
   Poveznica na naslovu razvlači se preko cijele kartice. Tako i „Pročitaj"
   i fotografija vode na objavu, a čitač zaslona i dalje vidi samo jednu
   poveznicu s naslovom kao imenom.
   -------------------------------------------------------------------------- */

.jkdr-card {
	position: relative;
}

.jkdr-card-title a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

.jkdr-card:hover {
	cursor: pointer;
}

/* Fokus tipkovnicom mora obrubiti cijelu karticu, ne samo naslov. */
.jkdr-card:focus-within {
	outline: 3px solid var(--jk-red);
	outline-offset: 3px;
}

.jkdr-card-title a:focus-visible {
	outline: none;
}

/* Vrpca u vrhu kartice — isti „obi" potez kao na karticama termina */
.jkdr-card::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 3px;
	background: var(--jk-red);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.45s var(--jk-ease-out);
	z-index: 2;
}

.jkdr-card:hover::before,
.jkdr-card:focus-within::before {
	transform: scaleX(1);
}

.jkdr-card-more {
	transition: color 0.24s var(--jk-ease), letter-spacing 0.24s var(--jk-ease);
}

.jkdr-card:hover .jkdr-card-more {
	color: var(--jk-red);
	letter-spacing: 0.16em;
}

/* --------------------------------------------------------------------------
   Brojke koje odbrojavaju
   -------------------------------------------------------------------------- */

.jkdr-stat b {
	font-variant-numeric: tabular-nums;
	transition: color 0.3s var(--jk-ease);
}

.jkdr-stat {
	transition: background 0.3s var(--jk-ease);
}

.jkdr-stat:hover {
	background: var(--jk-sumi-2);
}

/* --------------------------------------------------------------------------
   Naslov sekcije — crta koja se izvuče
   -------------------------------------------------------------------------- */

.jkdr-eyebrow::before {
	transform: scaleX(0.35);
	transform-origin: left;
	transition: transform 0.6s var(--jk-ease-out);
}

.jkdr-rise.is-in .jkdr-eyebrow::before,
.jkdr-sec-head.is-in .jkdr-eyebrow::before,
html:not(.jkdr-js) .jkdr-eyebrow::before {
	transform: scaleX(1);
}

/* --------------------------------------------------------------------------
   Gumbi
   -------------------------------------------------------------------------- */

.jkdr-cta {
	position: relative;
	overflow: hidden;
}

/* Tanki svijetli potez koji prijeđe preko gumba na hover */
.jkdr-cta::after {
	content: "";
	position: absolute;
	inset: 0 auto 0 -60%;
	width: 45%;
	background: linear-gradient(
		100deg,
		transparent,
		rgba(255, 255, 255, 0.28),
		transparent
	);
	transform: skewX(-18deg);
	transition: left 0.55s var(--jk-ease-out);
	pointer-events: none;
}

.jkdr-cta:hover::after,
.jkdr-cta:focus-visible::after {
	left: 115%;
}

/* --------------------------------------------------------------------------
   Kartice termina i partnera — mekši podizaj
   -------------------------------------------------------------------------- */

.jkdr-termin {
	transition: transform 0.32s var(--jk-ease), box-shadow 0.32s var(--jk-ease);
}

.jkdr-termin:hover {
	transform: translateY(-3px);
	box-shadow: 0 14px 32px rgba(19, 16, 16, 0.09);
}

.jkdr-partner:hover,
.jkdr-sponzor:hover {
	transform: translateY(-2px);
}

.jkdr-partner,
.jkdr-sponzor {
	transition: transform 0.3s var(--jk-ease), border-color 0.28s var(--jk-ease),
		box-shadow 0.28s var(--jk-ease);
}

/* --------------------------------------------------------------------------
   Traka napretka čitanja — tanka skerletna crta uz vrh
   -------------------------------------------------------------------------- */

.jkdr-progress {
	position: fixed;
	top: 0;
	left: 0;
	height: 3px;
	width: 100%;
	transform: scaleX(0);
	transform-origin: left;
	background: var(--jk-red);
	z-index: 300;
	pointer-events: none;
}

/* --------------------------------------------------------------------------
   Poštovanje postavke smanjenog pokreta
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	.jkdr-card::before,
	.jkdr-eyebrow::before {
		transform: scaleX(1);
	}

	.jkdr-cta::after {
		display: none;
	}

	.jkdr-termin:hover,
	.jkdr-partner:hover,
	.jkdr-sponzor:hover {
		transform: none;
	}

	.jkdr-progress {
		display: none;
	}
}

/* --------------------------------------------------------------------------
   34. Karta preko cijele širine
   Lokacija je ono što posjetitelj traži nakon kontakta, pa dobiva punu
   širinu ispod obrasca umjesto uskog bočnog stupca.
   -------------------------------------------------------------------------- */

.jkdr-map-wide {
	position: relative;
	background: var(--jk-sumi);
	border-top: 4px solid var(--jk-red);
}

.jkdr-map-wide-frame {
	display: block;
	width: 100%;
	height: clamp(320px, 46vh, 520px);
	border: 0;
	filter: saturate(0.9);
}

.jkdr-map-wide-bar {
	background: var(--jk-sumi);
	color: var(--jk-bone);
	padding-block: clamp(1rem, 2.4vw, 1.35rem);
}

.jkdr-map-wide-bar-in {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem 1.5rem;
}

.jkdr-map-wide-adresa {
	margin: 0;
	font-size: 1.0625rem;
	line-height: 1.35;
}

.jkdr-map-wide-adresa span {
	display: block;
	margin-bottom: 0.25rem;
	font-family: var(--jk-f-display);
	font-size: 0.625rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--jk-straw);
}

/* Bočni stupac više ne nosi kartu, pa mu treba manje donjeg razmaka. */
.jkdr-kontakt-info .jkdr-info-list {
	margin-bottom: 0;
}

/* --------------------------------------------------------------------------
   35. Brojač — stanje dok odbrojava
   -------------------------------------------------------------------------- */

.jkdr-stat b {
	display: block;
	transition: transform 0.35s var(--jk-ease-out), color 0.35s var(--jk-ease);
	transform-origin: left center;
}

.jkdr-stat b.is-counting {
	color: #fff;
	transform: scale(1.06);
}

.jkdr-stat b.is-counted {
	transform: scale(1);
	color: var(--jk-red-lift);
}

/* Šest brojki traži nešto uže ćelije da stanu u jedan red na širokom ekranu. */
.jkdr-hero-stats-grid {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
}

.jkdr-stat {
	padding: clamp(0.85rem, 2vw, 1.15rem) clamp(0.9rem, 2vw, 1.25rem);
}

.jkdr-stat span {
	font-size: 0.5625rem;
	letter-spacing: 0.12em;
	line-height: 1.35;
}

@media (prefers-reduced-motion: reduce) {
	.jkdr-stat b,
	.jkdr-stat b.is-counting,
	.jkdr-stat b.is-counted {
		transform: none;
		transition: none;
	}
}

/* --------------------------------------------------------------------------
   36. Glavni podržavatelji

   Znak isticanja je obi — skerletna traka koju kartica nosi preko ruba, isti
   element koji stranice već koriste kao .jkdr-obi.

   Namjerno nije zlatna. Knjiga standarda drži paletu na bijeloj, crvenoj i
   crnoj; zlato bi bilo prva boja koja pada na pamet za „veći donator", ali bi
   u ovoj marki izgledalo posuđeno. U judu je uz to najviši pojas crven, pa
   klupska boja i najviši stupanj ovdje ionako padaju na isto mjesto.

   Isticanje se drži na dvije poluge — veličina i boja — bez dodatnih ukrasa.
   -------------------------------------------------------------------------- */

/* Naslov skupine u popisu podržavatelja */
.jkdr-grupa {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	margin: 0 0 clamp(1rem, 2.5vw, 1.4rem);
	font-family: var(--jk-f-display);
	font-size: 0.6875rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--jk-ink-dim);
}

.jkdr-grupa::before {
	content: "";
	flex: none;
	width: 1.75rem;
	height: 2px;
	background: var(--jk-scarlet);
}

/* Tanka crta dovršava redak: naslov skupine dijeli popis, pa tako i izgleda. */
.jkdr-grupa::after {
	content: "";
	flex: 1;
	height: 1px;
	background: var(--jk-rule);
}

.jkdr-partneri + .jkdr-grupa {
	margin-top: clamp(2.5rem, 5.5vw, 3.5rem);
}

/* --- Stranica Podržavatelji — velika kartica ------------------------------ */

.jkdr-partneri.jkdr-partneri--glavni {
	grid-template-columns: 1fr;
}

/*
 * Rub ostaje neutralan. Pojas već kaže sve, a obojani rub bi ponovio istu
 * poruku i istrošio prijelaz na skerletni rub pri prijelazu mišem.
 */
.jkdr-partner--glavni {
	position: relative;
	overflow: hidden;
	grid-template-columns: clamp(120px, 18vw, 200px) 1fr;
	gap: clamp(1.25rem, 3vw, 2.25rem);
	padding: clamp(1.5rem, 3.2vw, 2.25rem);
	box-shadow: 0 12px 34px rgba(23, 18, 15, 0.07);
}

@media (max-width: 480px) {
	.jkdr-partner--glavni {
		grid-template-columns: 1fr;
	}
}

/* Obi se pri otkrivanju kartice izvlači slijeva, kao da se pojas veže. */
.jkdr-partner--glavni::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 4px;
	background: var(--jk-red);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.8s var(--jk-ease-out) 0.15s;
}

.jkdr-partner--glavni.is-in::before {
	transform: scaleX(1);
}

.jkdr-partner--glavni .jkdr-partner-logo {
	min-height: clamp(96px, 14vw, 132px);
	padding: 1rem;
	background: var(--jk-paper-2);
}

/* I ovdje samo gornja granica — mali zatečeni logotipi se ne rastežu. */
.jkdr-partner--glavni .jkdr-partner-logo .jkdr-sponzor-logo {
	max-height: clamp(64px, 9vw, 96px);
}

.jkdr-partner--glavni .jkdr-partner-naziv {
	font-size: clamp(1.25rem, 2.6vw, 1.625rem);
	margin-bottom: clamp(1rem, 2.2vw, 1.35rem);
}

/*
 * Kartica je široka cijeli redak, pa kontakti idu u stupce umjesto da desna
 * polovica ostane prazna. Širina je informacija, ne ukras.
 *
 * Donja granica stupca je široka (260px) namjerno: uz četiri podatka to daje
 * uredan blok 2×2 umjesto reda od tri i jednog usamljenog ispod, a adresa —
 * najduži podatak — stane u jedan ili dva retka.
 */
.jkdr-partner--glavni .jkdr-partner-kontakt {
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 1rem clamp(1.25rem, 3vw, 2.5rem);
}

/* --- Naslovnica — dvostruka ploča u sivom zidu ---------------------------- */

/*
 * Ploča glavnog podržavatelja zauzima dvije ćelije. Kad ih je više, na mreži
 * s neparnim brojem stupaca zadnja ćelija reda ne bi primila široku ploču i
 * ostala bi rupa; `dense` je popuni sljedećom običnom pločom. Na zidu bez
 * istaknutih nema učinka, jer su tada sve ploče jednake.
 */
.jkdr-sponzori {
	grid-auto-flow: dense;
}

.jkdr-sponzor--glavni {
	grid-column: span 2;
}

.jkdr-sponzor--glavni .jkdr-sponzor-inner {
	position: relative;
	overflow: hidden;
	gap: 0.7rem;
	padding-block: clamp(1.35rem, 3vw, 1.9rem);
}

.jkdr-sponzor--glavni .jkdr-sponzor-inner::before {
	content: "";
	position: absolute;
	inset: auto 0 0 0;
	height: 3px;
	background: var(--jk-red);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.8s var(--jk-ease-out) 0.15s;
}

.jkdr-sponzor--glavni.is-in .jkdr-sponzor-inner::before {
	transform: scaleX(1);
}

.jkdr-sponzor--glavni .jkdr-sponzor-plate {
	height: clamp(78px, 11vw, 104px);
}

/* Jedini logotip u boji na sivom zidu — cijelo isticanje počiva na tome. */
.jkdr-sponzor--glavni .jkdr-sponzor-logo {
	max-height: clamp(70px, 10vw, 96px);
	filter: none;
	opacity: 1;
}

.jkdr-sponzor--glavni .jkdr-sponzor-naziv {
	font-size: 0.75rem;
	color: var(--jk-ink);
}

.jkdr-sponzor-znak {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	font-family: var(--jk-f-display);
	font-size: 0.5625rem;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--jk-red-deep);
}

.jkdr-sponzor-znak::before {
	content: "";
	flex: none;
	width: 0.85rem;
	height: 2px;
	background: var(--jk-red);
}

/* Bez JavaScripta pojas stoji zavezan od početka. */
html:not(.jkdr-js) .jkdr-partner--glavni::before,
html:not(.jkdr-js) .jkdr-sponzor--glavni .jkdr-sponzor-inner::before {
	transform: scaleX(1);
}

@media (prefers-reduced-motion: reduce) {
	.jkdr-partner--glavni::before,
	.jkdr-sponzor--glavni .jkdr-sponzor-inner::before {
		transform: scaleX(1);
		transition: none;
	}
}