/* Vánoční turnaj ve futsale 2026 · společné styly webu */
:root{
	--bg:#06203F;            /* přesně podklad loga Sportovců → logo splývá se stránkou */
	--bg2:#0A2749;
	--bg3:#0F3058;
	--ink:#F4F1EA;
	--mute:#9AACC3;
	--acc:#E2C27A;
	--yellow:#FFE100;
	--red:#FF5A4E;
	--rule:rgba(244,241,234,.14);
	--cream:#F4F1EA;
	--navy:#06203F;
	--a1:#2C63B8;
	--a2:#D9A93F;
	--a3:#1B3F78;
	--pad:clamp(20px,5vw,72px);
	--max:1240px;
	--band:clamp(72px,9vw,136px);
}
*{
	box-sizing:border-box;
	margin:0;
	padding:0
}
html{
	scroll-behavior:smooth
}
body{
	background:var(--bg);
	color:var(--ink);
	font:17px/1.6 Inter,system-ui,sans-serif;
	-webkit-font-smoothing:antialiased;
	overflow-x:hidden
}
img{
	display:block;
	max-width:100%;
	height:auto       /* poměr stran podle obrázku, i když má v HTML width/height */
}
a{
	color:inherit
}
button{
	font:inherit;
	color:inherit;
	background:none;
	border:0;
	cursor:pointer
}
.wrap{
	max-width:var(--max);
	margin:0 auto;
	padding:0 var(--pad)
}
:focus-visible{
	outline:2px solid var(--yellow);
	outline-offset:3px
}

/* ---------- typografická škála ---------- */
.lab{
	font:600 13px/1.2 Inter;
	letter-spacing:.18em;
	text-transform:uppercase;
	color:var(--acc)
}
.h2{
	font-family:"Hepta Slab",serif;
	font-weight:800;
	font-size:clamp(38px,5.6vw,76px);
	line-height:1.1;
	letter-spacing:-.03em;
	margin-top:18px
}
.sub{
	font-size:clamp(18px,1.6vw,21px);
	color:var(--mute);
	max-width:40ch;
	margin-top:18px
}
.val{
	font-family:"Hepta Slab",serif;
	font-weight:600;
	font-size:clamp(26px,2.5vw,36px);
	line-height:1.12;
	letter-spacing:-.02em
}
.small{
	font-size:15px;
	color:var(--mute)
}

/* ---------- header ---------- */
.bar{
	position:relative;
	z-index:5;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:16px;
	padding:20px var(--pad);
	max-width:calc(var(--max) + 2*var(--pad));
	margin:0 auto
}
.bar nav{
	display:flex;
	gap:28px;
	font-size:15px;
	font-weight:500
}
.bar nav a{
	text-decoration:none;
	opacity:.85
}
.bar nav a:hover{
	opacity:1
}
.bar nav a[aria-current]{
	opacity:1;
	color:var(--yellow)
}
.logo-s{
	width:52px;
	height:52px
}
.logo-c{
	height:32px;
	width:auto
}

/* ---------- buttons ---------- */
.btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	font:600 16px/1 Inter;
	padding:18px 30px;
	border-radius:999px;
	text-decoration:none;
	transition:transform .15s ease,box-shadow .15s ease
}
.btn:hover{
	transform:translateY(-1px)
}
.btn.pri{
	background:var(--yellow);
	color:var(--navy)
}
.btn.sec{
	background:var(--ink);
	color:var(--navy)
}
.btn.ghost{
	color:var(--ink);
	box-shadow:inset 0 0 0 1px var(--rule)
}
.btn.ghost:hover{
	box-shadow:inset 0 0 0 1px rgba(244,241,234,.4)
}
.btn.sm{
	padding:11px 18px;
	font-size:14px
}
.dot{
	width:8px;
	height:8px;
	flex:none;
	border-radius:50%;
	background:var(--red);
	animation:pulse 1.8s infinite
}
@keyframes pulse{
	0%{
		box-shadow:0 0 0 0 rgba(255,90,78,.6)
	}
	70%{
		box-shadow:0 0 0 8px rgba(255,90,78,0)
	}
	100%{
		box-shadow:0 0 0 0 rgba(255,90,78,0)
	}
}
.link{
	display:inline-flex;
	gap:8px;
	font-weight:600;
	text-decoration:none;
	color:var(--yellow)
}
.link:hover{
	text-decoration:underline;
	text-underline-offset:4px
}

/* ---------- aura ---------- */
.aura{
	position:absolute;
	inset:0;
	pointer-events:none;
	overflow:hidden
}
.aura i{
	position:absolute;
	border-radius:50%;
	will-change:transform;
	animation:drift 24s ease-in-out infinite alternate
}
.aura i:nth-child(1){
	width:min(900px,120vw);
	height:min(620px,90vw);
	left:50%;
	top:6%;
	margin-left:-20%;
	background:radial-gradient(closest-side,rgba(44,99,184,.62),rgba(44,99,184,0));
	transform:rotate(-24deg)
}
.aura i:nth-child(2){
	width:min(560px,80vw);
	height:min(440px,64vw);
	left:50%;
	top:36%;
	margin-left:-42%;
	background:radial-gradient(closest-side,rgba(217,169,63,.30),rgba(217,169,63,0));
	animation-duration:30s
}
.aura i:nth-child(3){
	width:min(640px,90vw);
	height:min(540px,76vw);
	left:50%;
	top:-10%;
	margin-left:-6%;
	background:radial-gradient(closest-side,rgba(27,63,120,.7),rgba(27,63,120,0));
	animation-duration:36s
}
@keyframes drift{
	to{
		transform:translate(40px,-24px) rotate(12deg) scale(1.08)
	}
}
@media (prefers-reduced-motion:reduce){
	.aura i,.dot{
		animation:none
	}
	html{
		scroll-behavior:auto
	}
}

/* ---------- hero ---------- */
.hero{
	position:relative;
	text-align:center;
	padding:clamp(16px,3vw,40px) var(--pad) clamp(72px,9vw,128px);
	overflow:hidden
}
.hero>*:not(.aura){
	position:relative
}
.hero .znak{
	display:inline-block;
	width:clamp(100px,10vw,128px);
	margin-bottom:clamp(20px,2.6vw,32px)
}
.hero h1{
	font-family:"Hepta Slab",serif;
	font-weight:600;
	font-size:clamp(24px,3vw,40px);
	line-height:1.15;
	letter-spacing:-.015em;
	color:var(--acc);
	max-width:24ch;
	margin:0 auto clamp(18px,2.4vw,30px);
	text-wrap:balance
}
.hero h1 b{
	display:block;
	font-weight:800;
	color:var(--ink)
}
.slogan{
	font-family:"Hepta Slab",serif;
	font-weight:800;
	font-size:clamp(50px,8vw,120px);
	line-height:.92;
	letter-spacing:-.035em;
	max-width:15ch;
	margin:0 auto;
	text-wrap:balance
}
.lead{
	font-size:clamp(18px,1.7vw,22px);
	font-weight:500;
	margin-top:clamp(22px,3vw,40px)
}
.lead span{
	display:block;
	color:var(--mute);
	font-weight:400
}
.cta{
	display:flex;
	justify-content:center;
	align-items:center;
	gap:12px;
	margin-top:clamp(26px,3vw,40px);
	flex-wrap:wrap
}

/* ---------- pruhy (sekce) ---------- */
.band{
	position:relative;
	content-visibility:auto;
	contain-intrinsic-size:auto 900px
}
.band>.wrap{
	position:relative;
	padding-top:var(--band);
	padding-bottom:var(--band)
}

.split{
	display:grid;
	grid-template-columns:minmax(160px,1fr) 3fr;
	gap:clamp(16px,4vw,64px)
}
.split .txt{
	font-family:"Hepta Slab",serif;
	font-weight:600;
	font-size:clamp(24px,2.8vw,38px);
	line-height:1.3;
	letter-spacing:-.015em
}
.split .link{
	margin-top:32px;
	font-size:18px
}
.loni{
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	gap:10px;
	margin-top:32px;
	padding-top:26px;
	border-top:1px solid var(--rule)
}
.loni b{
	font:800 clamp(36px,4.4vw,56px)/1 "Hepta Slab";
	letter-spacing:-.03em;
	color:var(--yellow);
	white-space:nowrap
}
.loni span{
	color:var(--mute);
	font-size:18px;
	max-width:30ch
}

.center{
	text-align:center
}
.center .h2{
	margin-bottom:clamp(36px,5vw,64px)
}
.prog{
	list-style:none;
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:clamp(16px,3vw,40px);
	text-align:left
}
.prog li{
	border-top:1px solid var(--ink);
	padding-top:18px;
	color:var(--mute);
	font-size:17px
}
.prog b{
	display:block;
	font-family:"Hepta Slab";
	font-weight:600;
	font-size:clamp(28px,2.8vw,40px);
	line-height:1.1;
	color:var(--ink);
	letter-spacing:-.02em;
	margin-bottom:8px
}
.prog li.hl b{
	color:var(--acc)
}

.public .h2{
	max-width:14ch
}
.items{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:clamp(16px,3vw,40px);
	margin-top:clamp(36px,5vw,64px)
}
.items>div{
	padding-top:18px;
	border-top:1px solid var(--rule)
}
.items h3{
	font:600 clamp(20px,1.65vw,24px)/1.2 "Hepta Slab";
	white-space:nowrap;
	letter-spacing:-.01em;
	margin-bottom:8px
}
.items p{
	color:var(--mute);
	font-size:17px
}

.board{
	display:grid;
	grid-template-columns:1.1fr 1fr;
	gap:clamp(24px,4vw,64px);
	align-items:center
}
.count-lab{
	margin-top:32px;
	font:600 13px/1 Inter;
	letter-spacing:.18em;
	text-transform:uppercase;
	color:var(--ink)
}
.count{
	display:flex;
	gap:clamp(18px,3vw,40px);
	margin:14px 0 10px
}
.count div{
	font-family:"Hepta Slab";
	font-weight:800;
	font-size:clamp(46px,5.4vw,72px);
	line-height:1;
	letter-spacing:-.03em;
	font-variant-numeric:tabular-nums
}
.count small{
	display:block;
	font:500 13px/1 Inter;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:var(--mute);
	margin-top:10px
}
.count-note{
	color:var(--mute);
	margin-bottom:28px
}
.score{
	display:block;
	background:var(--bg2);
	border-radius:20px;
	padding:clamp(18px,2.4vw,28px);
	text-decoration:none
}
.score header{
	display:flex;
	justify-content:space-between;
	align-items:center;
	font-size:14px;
	color:var(--mute);
	margin-bottom:10px
}
.score header span{
	display:inline-flex;
	align-items:center;
	gap:8px;
	color:var(--ink);
	font-weight:600
}
.score .row{
	display:grid;
	grid-template-columns:1fr auto 1fr;
	gap:12px;
	align-items:center;
	padding:16px 0;
	border-top:1px solid var(--rule);
	font-weight:500
}
.score .row .r{
	text-align:right
}
.score .row em{
	font-style:normal;
	font-family:"Hepta Slab";
	font-weight:800;
	font-size:24px;
	min-width:72px;
	text-align:center;
	color:var(--mute)
}
.score footer{
	font-size:14px;
	color:var(--mute);
	padding-top:14px;
	border-top:1px solid var(--rule)
}

/* O nás */
.about{
	display:grid;
	grid-template-columns:minmax(220px,1fr) 2fr;
	gap:clamp(28px,5vw,80px);
	align-items:start
}
.about .crest{
	position:sticky;
	top:32px
}
.about .crest img{
	width:min(100%,280px)
}
.facts{
	display:flex;
	flex-direction:column;
	gap:18px;
	margin-top:20px;
	padding-left:clamp(0px,1.6vw,22px)
}
.facts div{
	font-family:"Hepta Slab";
	font-weight:800;
	font-size:clamp(30px,2.8vw,38px);
	line-height:1;
	letter-spacing:-.02em;
	padding-bottom:18px;
	border-bottom:1px solid var(--rule)
}
.facts div:last-child{
	border:0;
	padding-bottom:0
}
.facts small{
	display:block;
	font:500 13px/1.3 Inter;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:var(--mute);
	margin-top:8px
}
.about .intro{
	font-size:clamp(20px,2vw,26px);
	line-height:1.45;
	max-width:34ch;
	margin-top:24px
}
.acts{
	list-style:none;
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:clamp(24px,3vw,44px) clamp(16px,3vw,40px);
	margin-top:clamp(36px,5vw,56px)
}
.acts li{
	border-top:1px solid var(--rule);
	padding-top:18px
}
.acts h3{
	font:600 clamp(21px,1.9vw,25px)/1.2 "Hepta Slab";
	letter-spacing:-.01em;
	margin-bottom:8px
}
.acts p{
	color:var(--mute);
	font-size:17px
}

/* Praktické informace */
.info-grid{
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:clamp(36px,4vw,56px) clamp(24px,4vw,72px);
	margin-top:clamp(36px,5vw,64px)
}
.info-grid>div{
	border-top:1px solid var(--ink);
	padding-top:20px
}
.info-grid h3{
	font:600 13px/1.2 Inter;
	letter-spacing:.18em;
	text-transform:uppercase;
	color:var(--acc);
	margin-bottom:16px
}
.info-grid .val+p{
	margin-top:12px
}
.info-grid p{
	color:var(--mute)
}
.info-grid .link{
	margin-top:14px;
	font-size:17px
}
.qr{
	background:#fff;
	border-radius:14px;
	padding:12px;
	width:168px;
	margin:16px 0 12px
}
.note{
	font-size:14px;
	color:var(--mute)
}
.nowrap{
	white-space:nowrap
}

/* Dokumenty */
.docs{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:16px;
	margin-top:clamp(36px,5vw,64px)
}
.doc{
	display:flex;
	flex-direction:column;
	gap:22px;
	min-height:250px;
	padding:26px;
	border-radius:20px;
	background:var(--bg2);
	text-decoration:none;
	transition:background .15s ease,transform .15s ease
}
.doc:hover{
	background:var(--bg3);
	transform:translateY(-2px)
}
.doc svg{
	width:48px;
	height:48px
}
.doc b{
	font:800 clamp(24px,2.2vw,28px)/1.1 "Hepta Slab";
	letter-spacing:-.02em
}
.doc p{
	font-size:16px;
	color:var(--mute);
	margin-top:-10px
}
.doc span{
	margin-top:auto;
	font-size:16px;
	color:var(--yellow);
	font-weight:600
}

/* Minihra */
.hra .hud{
	display:flex;
	gap:clamp(20px,3vw,36px)
}
.hra .hud div{
	font:800 clamp(30px,3vw,40px)/1 "Hepta Slab";
	letter-spacing:-.02em;
	font-variant-numeric:tabular-nums
}
.hra .hud small{
	display:block;
	font:500 12px/1 Inter;
	letter-spacing:.14em;
	text-transform:uppercase;
	color:var(--mute);
	margin-top:8px
}
.game-head{
	display:flex;
	justify-content:space-between;
	align-items:end;
	gap:20px 40px;
	flex-wrap:wrap;
	margin-bottom:22px
}
.pitch{
	position:relative;
	border-radius:20px;
	overflow:hidden;
	background:#0B2A50;
	touch-action:manipulation;
	user-select:none;
	-webkit-user-select:none
}
.pitch canvas{
	display:block;
	width:100%;
	cursor:crosshair
}
.over{
	position:absolute;
	inset:0;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:14px;
	text-align:center;
	padding:20px;
	background:rgba(6,32,63,.72);
	backdrop-filter:blur(3px)
}
.over[hidden]{
	display:none
}
.over b{
	font:800 clamp(28px,4vw,52px)/1.05 "Hepta Slab";
	letter-spacing:-.03em
}
.over p{
	color:var(--mute);
	max-width:34ch
}

/* ---------- footer ---------- */
footer.site{
	border-top:1px solid var(--rule);
	padding:56px 0 64px
}
.foot{
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:28px;
	flex-wrap:wrap
}
.foot .logos{
	display:flex;
	align-items:center;
	gap:22px
}
.foot .logos .logo-s{
	width:88px;
	height:88px
}   /* štít loga ≈ výška pětky */
.foot .logos .znak{
	display:block;
	width:74px
}   /* výška ≈ 80 px vč. ročníku */
.foot .addr{
	text-align:center;
	font-size:16px
}
.foot .addr a{
	text-decoration:none
}
.foot .addr .web{
	font-weight:600;
	font-size:19px
}
.foot .addr .soc{
	display:flex;
	gap:18px;
	justify-content:center;
	margin-top:8px;
	color:var(--mute)
}
.foot .addr svg{
	width:16px;
	height:16px;
	vertical-align:-3px;
	margin-right:6px
}

/* ---------- pruhy jako číslované kapitoly propojené svislou osou ---------- */
main{
	counter-reset:ch
}
.band{
	counter-increment:ch
}
.band>.wrap::before{
	content:"";
	position:absolute;
	left:calc(var(--pad) / 2);
	top:0;
	bottom:0;
	width:2px;
	margin-left:-.5px;
	background:rgba(244,241,234,.22)
}
.band:first-of-type>.wrap::before{
	top:var(--band)
}
.band .lab::before{
	content:counter(ch,decimal-leading-zero) "\2003";
	font:800 13px/1 "Hepta Slab";
	color:var(--ink);
	letter-spacing:0
}
.band .lab::after{
	content:"";
	position:absolute;
	left:calc(var(--pad) / 2 - 5px);
	width:11px;
	height:11px;
	margin-top:2px;
	border-radius:50%;
	background:var(--yellow);
	box-shadow:0 0 0 5px var(--bg)
}

/* ---------- mobilní menu a plovoucí tlačítko ---------- */
.menu-btn{
	display:none;
	width:44px;
	height:44px;
	border-radius:12px;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:5px;
	margin-left:auto
}
.menu-btn span:not(.sr){
	display:block;
	width:22px;
	height:2px;
	border-radius:2px;
	background:var(--ink);
	transition:transform .2s ease
}
.menu-open .menu-btn span:nth-child(1){
	transform:translateY(3.5px) rotate(45deg)
}
.menu-open .menu-btn span:nth-child(2){
	transform:translateY(-3.5px) rotate(-45deg)
}
.sr{
	position:absolute;
	width:1px;
	height:1px;
	overflow:hidden;
	clip:rect(0 0 0 0);
	white-space:nowrap
}
.mnav{
	position:fixed;
	inset:var(--hdr,68px) 0 0;
	z-index:55;
	background:var(--bg);
	padding:12px 20px calc(24px + env(safe-area-inset-bottom));
	display:flex;
	flex-direction:column;
	overflow-y:auto
}
.mnav[hidden]{
	display:none
}
.mnav nav{
	display:flex;
	flex-direction:column
}
.mnav nav a{
	font:800 30px/1.1 "Hepta Slab";
	letter-spacing:-.02em;
	text-decoration:none;
	padding:14px 0;
	border-bottom:1px solid var(--rule)
}
.mnav nav a[aria-current]{
	color:var(--yellow)
}
.mnav .btn{
	margin-top:28px
}
.menu-open{
	overflow:hidden
}
.fab{
	display:none
}
.acct{
	display:flex;
	align-items:center;
	gap:12px;
	flex-wrap:wrap;
	margin-top:14px
}
.acct span{
	font-size:14px;
	color:var(--mute)
}
.acct b{
	font-weight:600;
	font-variant-numeric:tabular-nums
}
.acct button[disabled]{
	opacity:.5;
	cursor:default
}

/* ---------- responsive ---------- */
@media (max-width:1060px){
	.docs{
		grid-template-columns:1fr 1fr
	}
	.acts{
		grid-template-columns:1fr 1fr
	}
}
@media (max-width:860px){
	:root{
		--hdr:68px
	}
	[id]{
		scroll-margin-top:var(--hdr)
	}
	.bar nav{
		display:none
	}
	.menu-btn{
		display:flex
	}
	.bar{
		position:sticky;
		top:0;
		z-index:60;
		background:var(--bg);
		padding:12px 20px;
		gap:12px
	}
	.bar .logo-s{
		width:44px;
		height:44px
	}
	.bar .logo-c{
		height:26px
	}
	.fab{
		display:flex;
		position:fixed;
		left:16px;
		right:16px;
		bottom:calc(12px + env(safe-area-inset-bottom));
		z-index:50;
		box-shadow:0 12px 30px -8px rgba(0,0,0,.55);
		transform:translateY(calc(100% + 24px));
		transition:transform .25s ease
	}
	.fab.on{
		transform:none
	}
	.center{
		text-align:left
	}   /* na mobilu vše od osy vlevo, jako ostatní kapitoly */
	.prog li{
		padding:16px 0 6px
	}
	.prog b{
		font-size:28px;
		margin-bottom:4px
	}
	.split,.about{
		grid-template-columns:1fr
	}
	.about .crest{
		position:static;
		display:grid;
		grid-template-columns:150px 1fr;
		gap:24px;
		align-items:center
	}
	.about .crest img{
		width:150px
	}
	.facts{
		margin-top:0
	}
	.prog,.items{
		grid-template-columns:1fr 1fr
	}
	.board{
		grid-template-columns:1fr
	}
	.foot{
		flex-direction:column;
		text-align:center
	}
}
@media (max-width:560px){
	body{
		font-size:16px
	}
	.hero{
		padding:18px 20px 64px
	}
	.hero .znak{
		width:84px;
		margin-bottom:16px
	}
	.hero h1{
		font-size:24px;
		margin-bottom:14px
	}
	.slogan{
		font-size:clamp(46px,13.6vw,58px)
	}
	.lead{
		font-size:17px;
		margin-top:18px
	}
	.cta{
		display:grid;
		grid-template-columns:1fr 1fr;
		gap:10px;
		margin-top:24px
	}
	.cta .btn{
		width:100%;
		padding:16px 12px;
		font-size:15px
	}
	.cta .btn.pri{
		grid-column:1/-1;
		padding:18px
	}
	.band>.wrap{
		padding-top:64px;
		padding-bottom:64px
	}
	.h2{
		font-size:clamp(34px,10vw,44px)
	}
	.count div{
		font-size:44px
	}
	.foot .addr .soc{
		flex-direction:column;
		gap:4px
	}
	.foot .addr .soc a{
		padding:8px 0
	}
	.score .row em{
		min-width:56px;
		font-size:20px
	}
	.score .row{
		font-size:15px
	}
	.acts,.docs,.info-grid,.prog,.items{
		grid-template-columns:1fr
	}
	.doc{
		min-height:0
	}
}

/* upoutávka na minihru */
.teaser{
	display:block;
	border-radius:20px;
	transition:transform .2s ease
}
.teaser:hover{
	transform:translateY(-3px)
}
.teaser svg{
	display:block;
	width:100%;
	height:auto
}

/* ---------- fotogalerie ---------- */
.gallery{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	grid-auto-rows:clamp(180px,17vw,250px);
	gap:12px;
	margin-top:clamp(36px,5vw,64px);
	grid-template-areas:"a a b b" "a a c d" "e e c f"
}
.gallery figure{
	position:relative;
	margin:0;
	border-radius:16px;
	overflow:hidden;
	background:var(--bg2)
}
.gallery .g-a{
	grid-area:a
}
.gallery .g-b{
	grid-area:b
}
.gallery .g-c{
	grid-area:c
}
.gallery .g-d{
	grid-area:d
}
.gallery .g-e{
	grid-area:e
}
.gallery .g-f{
	grid-area:f
}
.gallery button{
	display:block;
	width:100%;
	height:100%;
	padding:0;
	cursor:zoom-in
}
.gallery img{
	width:100%;
	height:100%;
	object-fit:cover;
	transition:transform .4s ease
}
.gallery figure:hover img{
	transform:scale(1.03)
}
.gallery figcaption{
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	padding:36px 16px 14px;
	font-size:15px;
	font-weight:500;
	line-height:1.3;
	background:linear-gradient(transparent,rgba(6,32,63,.88));
	pointer-events:none
}
.lightbox{
	margin:auto;
	border:0;
	padding:0;
	background:transparent;
	max-width:min(1100px,94vw);
	max-height:92vh;
	color:var(--ink)
}
.lightbox::backdrop{
	background:rgba(3,14,30,.9)
}
.lightbox img{
	display:block;
	max-width:100%;
	max-height:80vh;
	border-radius:12px;
	margin:0 auto
}
.lightbox p{
	text-align:center;
	margin-top:12px;
	font-weight:500
}
.lightbox .lb-nav{
	display:flex;
	justify-content:center;
	gap:10px;
	margin-top:12px
}
.lightbox .lb-nav button{
	width:48px;
	height:48px;
	border-radius:50%;
	background:rgba(244,241,234,.12);
	font-size:20px
}
@media (max-width:860px){
	/* na mobilu vodorovný pás na posouvání prstem */
	.gallery{
		display:flex;
		overflow-x:auto;
		scroll-snap-type:x mandatory;
		gap:12px;
		margin-left:-20px;
		margin-right:-20px;
		padding:0 20px 8px;
		scrollbar-width:none;
		grid-template-areas:none
	}
	.gallery::-webkit-scrollbar{
		display:none
	}
	.gallery figure{
		flex:0 0 82%;
		aspect-ratio:4/3;
		scroll-snap-align:center
	}
}

/* ---------- Jak přispět (samostatná kapitola) ---------- */
.give{
	display:grid;
	grid-template-columns:1.15fr 1fr;
	gap:clamp(28px,5vw,80px);
	align-items:start
}
.ways{
	display:grid;
	gap:14px;
	margin-top:clamp(28px,4vw,44px)
}
.way{
	display:grid;
	grid-template-columns:48px 1fr;
	gap:18px;
	align-items:start;
	padding:22px 24px;
	border-radius:18px;
	background:var(--bg2)
}
.way svg{
	width:48px;
	height:48px
}
.way h3{
	font:800 clamp(22px,2vw,26px)/1.15 "Hepta Slab";
	letter-spacing:-.015em;
	margin-bottom:6px
}
.way p{
	color:var(--mute)
}
.paycard{
	background:var(--bg2);
	border-radius:24px;
	padding:clamp(22px,3vw,36px)
}
.qr-ph{
	aspect-ratio:1;
	max-width:260px;
	margin:0 auto 24px;
	border:2px dashed rgba(244,241,234,.28);
	border-radius:16px;
	display:flex;
	align-items:center;
	justify-content:center;
	text-align:center;
	color:var(--mute);
	font-size:15px;
	line-height:1.4;
	padding:20px
}
.qr-img{
	display:block;
	width:100%;
	max-width:260px;
	margin:0 auto 24px;
	background:#fff;
	border-radius:16px;
	padding:16px
}
.pay{
	display:grid;
	gap:14px
}
.pay div{
	border-top:1px solid var(--rule);
	padding-top:14px
}
.pay dt{
	font:600 12px/1.2 Inter;
	letter-spacing:.16em;
	text-transform:uppercase;
	color:var(--acc);
	margin-bottom:6px
}
.pay dd{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:12px;
	flex-wrap:wrap;
	font:600 20px/1.3 Inter
}
.paycard .note{
	margin-top:18px
}
@media (max-width:860px){
	.give{
		grid-template-columns:1fr
	}
	.qr-ph,.qr-img{
		max-width:200px
	}
}

/* sdílení v Jak přispět */
.share{
	display:flex;
	gap:10px;
	flex-wrap:wrap;
	margin-top:14px
}
.share .btn svg{
	width:16px;
	height:16px
}

/* ---------- minihra: zápis jména a žebříček TOP 13 ---------- */
.hra-layout{
	display:grid;
	grid-template-columns:1fr 300px;
	gap:clamp(16px,2.4vw,28px);
	align-items:start
}
.zapis{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	gap:10px;
	width:min(100%,420px)
}
.zapis[hidden]{
	display:none
}
.zapis input{
	flex:1;
	min-width:0;
	background:rgba(244,241,234,.1);
	border:1px solid rgba(244,241,234,.3);
	color:var(--ink);
	font:inherit;
	font-size:16px;
	padding:12px 16px;
	border-radius:999px
}
.zapis input:focus{
	outline:none;
	border-color:var(--yellow)
}
.zapis-stav{
	flex-basis:100%;
	font-size:15px;
	color:var(--yellow);
	min-height:1.4em
}
.top13-box{
	background:var(--bg2);
	border-radius:20px;
	padding:22px 22px 14px
}
.top13-box h2{
	font:800 26px/1 "Hepta Slab";
	letter-spacing:-.02em;
	margin-bottom:12px
}
.top13{
	list-style:none;
	counter-reset:none
}
.top13 li{
	display:grid;
	grid-template-columns:34px 1fr auto;
	gap:8px;
	align-items:baseline;
	padding:9px 0;
	border-top:1px solid var(--rule);
	font-size:16px
}
.top13 li .p{
	color:var(--mute);
	font-variant-numeric:tabular-nums
}
.top13 li .j{
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap
}
.top13 li b{
	font:800 18px/1 "Hepta Slab";
	font-variant-numeric:tabular-nums
}
.top13 li:nth-child(-n+3) .p{
	color:var(--yellow);
	font-weight:600
}
.top13 li.ja{
	background:rgba(255,225,0,.1);
	margin:0 -10px;
	padding-left:10px;
	padding-right:10px;
	border-radius:8px
}
.top13 li.prazdne{
	display:block;
	color:var(--mute)
}
@media (max-width:860px){
	.hra-layout{
		grid-template-columns:1fr
	}
}

/* štítek „Připravujeme“ */
.soon{
	display:inline-flex;
	align-items:center;
	gap:8px;
	margin-top:16px;
	padding:7px 14px;
	border-radius:999px;
	background:rgba(255,225,0,.12);
	color:var(--yellow);
	font:600 13px/1 Inter;
	letter-spacing:.12em;
	text-transform:uppercase
}
.soon::before{
	content:"";
	width:7px;
	height:7px;
	border-radius:50%;
	background:var(--yellow)
}

/* ---------- příběh letošní benefice ---------- */
.pribeh{
	display:grid;
	grid-template-columns:minmax(220px,.9fr) 1.1fr;
	gap:clamp(20px,3vw,40px);
	align-items:start;
	margin-top:36px;
	padding-top:32px;
	border-top:1px solid var(--rule)
}
.pribeh-foto{
	margin:0
}
.pribeh-foto img{
	width:100%;
	height:auto;
	border-radius:18px;
	display:block
}
.pribeh-kicker{
	font:600 13px/1.2 Inter;
	letter-spacing:.18em;
	text-transform:uppercase;
	color:var(--acc);
	margin-bottom:14px
}
.pribeh-text p{
	font-size:18px;
	line-height:1.6;
	color:var(--mute)
}
.pribeh-text p b{
	color:var(--ink);
	font-weight:600
}
.pribeh-text p+p{
	margin-top:12px
}
.pribeh-text blockquote{
	margin:22px 0 18px;
	padding-left:18px;
	border-left:3px solid var(--yellow);
	font:600 clamp(18px,1.8vw,22px)/1.45 "Hepta Slab";
	color:var(--ink)
}
.pribeh-text cite{
	display:block;
	margin-top:10px;
	font:500 14px/1 Inter;
	font-style:normal;
	color:var(--acc);
	letter-spacing:.08em;
	text-transform:uppercase
}
@media (max-width:860px){
	.pribeh{
		grid-template-columns:1fr
	}
}

/* ---------- stránka Média ---------- */
.assets{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:16px;
	margin-top:clamp(28px,4vw,48px)
}
.asset{
	margin:0;
	display:flex;
	flex-direction:column;
	gap:14px;
	padding:16px;
	border-radius:20px;
	background:var(--bg2)
}
.asset-nahled{
	display:flex;
	align-items:center;
	justify-content:center;
	aspect-ratio:4/3;
	border-radius:12px;
	background:var(--bg3);
	overflow:hidden
}
.asset-nahled img{
	max-width:100%;
	max-height:100%;
	object-fit:contain
}
.asset figcaption b{
	display:block;
	font:800 21px/1.15 "Hepta Slab";
	letter-spacing:-.01em
}
.asset figcaption span{
	display:block;
	color:var(--mute);
	font-size:15px;
	margin-top:4px
}
.asset figcaption small{
	display:block;
	color:var(--acc);
	font-size:13px;
	margin-top:4px
}
.asset .btn{
	align-self:flex-start;
	margin-top:auto
}
.texty{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:16px;
	margin-top:clamp(28px,4vw,48px)
}
.text-karta{
	background:var(--bg2);
	border-radius:20px;
	padding:20px 22px
}
.text-hlava{
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:12px;
	margin-bottom:12px
}
.text-hlava h3{
	font:800 22px/1 "Hepta Slab"
}
.text-karta pre{
	white-space:pre-wrap;
	word-break:break-word;
	font:15px/1.55 Inter;
	color:var(--mute);
	max-height:360px;
	overflow:auto;
	margin:0
}
@media (max-width:980px){
	.assets{
		grid-template-columns:1fr 1fr
	}
	.texty{
		grid-template-columns:1fr
	}
}
@media (max-width:560px){
	.assets{
		grid-template-columns:1fr
	}
}
/* patička: odkazy pro média */
.foot .addr .foot-links{
	display:flex;
	gap:18px;
	justify-content:center;
	flex-wrap:wrap;
	margin-top:10px;
	font-size:14px
}
.foot .addr .foot-links a{
	color:var(--mute);
	text-decoration:underline;
	text-underline-offset:3px
}
.foot .addr .foot-links a:hover{
	color:var(--acc)
}

/* sloupce mřížky se nesmí roztáhnout podle obsahu (příběh benefice na mobilu přetékal) */
.split > *,.pribeh > *{
	min-width:0
}
/* odkaz „Přečtěte si celý příběh“ se na mobilu zalomí (jinak přetékal do strany) */
.loni a b{
	white-space:normal
}

/* stránka Příběh rodiny a benefice (benefice.html) */
.rodina-uvod{
	display:grid;
	grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);
	gap:clamp(28px,5vw,72px);
	align-items:center
}
.rodina-foto{
	margin:0
}
.rodina-foto img{
	width:100%;
	border-radius:22px
}
.rodina-text{
	columns:2 34ch;
	column-gap:clamp(28px,4vw,64px);
	margin-top:28px
}
.rodina-text p{
	font-size:18px;
	line-height:1.65;
	color:var(--mute);
	break-inside:avoid;
	margin-bottom:16px
}
.rodina-text b{
	color:var(--ink);
	font-weight:600
}
.rodina-dik{
	max-width:900px
}
.rodina-dik blockquote{
	padding-left:22px;
	border-left:4px solid var(--yellow);
	font:700 clamp(22px,2.6vw,32px)/1.4 "Hepta Slab";
	color:var(--ink)
}
.rodina-vzkaz{
	margin-top:28px;
	font-size:clamp(18px,1.8vw,21px);
	line-height:1.6;
	font-style:italic;
	color:var(--mute)
}
.rodina-podpis{
	margin-top:24px;
	font:800 clamp(22px,2.4vw,28px)/1.2 "Hepta Slab";
	color:var(--yellow)
}
.rodina-podpis span{
	display:block;
	margin-top:10px;
	font:500 14px/1 Inter;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:var(--acc)
}
@media (max-width:860px){
	.rodina-uvod{
		grid-template-columns:1fr
	}
}

/* QR platba: stažení a odkaz na detail sbírky */
.qr-img{
	padding:6px
}
.qr-dl{
	display:flex;
	width:max-content;
	margin:-8px auto 24px
}
.pay-detail{
	display:inline-block;
	margin-top:20px
}
.pay dd b{
	overflow-wrap:anywhere
}

/* stránka Detail sbírky (sbirka.html) */
.fakta{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));
	gap:14px;
	margin-top:clamp(28px,4vw,44px)
}
.fakta div{
	background:var(--bg2);
	border-radius:18px;
	padding:20px 22px
}
.fakta dt{
	font:600 12px/1.2 Inter;
	letter-spacing:.16em;
	text-transform:uppercase;
	color:var(--acc);
	margin-bottom:8px
}
.fakta dd{
	font:600 18px/1.4 Inter
}
.letak{
	display:grid;
	grid-template-columns:minmax(0,340px) minmax(0,1fr);
	gap:clamp(28px,5vw,72px);
	align-items:center
}
.letak-nahled img{
	width:100%;
	border-radius:14px;
	box-shadow:0 18px 50px rgba(0,0,0,.35)
}
.letak .tlacitka{
	display:flex;
	gap:10px;
	flex-wrap:wrap;
	margin-top:28px
}
@media (max-width:860px){
	.letak{
		grid-template-columns:1fr
	}
	.letak-nahled{
		max-width:300px
	}
}

/* stránka Partneři a sponzoři (partneri.html) */
.partneri{
	display:grid;
	grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));
	gap:18px;
	margin-top:clamp(28px,4vw,44px)
}
.partner{
	display:flex;
	flex-direction:column;
	background:var(--bg2);
	border-radius:20px;
	padding:18px 18px 22px
}
.partner-logo{
	display:flex;
	align-items:center;
	justify-content:center;
	aspect-ratio:16/9;
	background:#fff;
	border-radius:14px;
	padding:18px 22px;
	margin-bottom:18px;
	text-decoration:none
}
.partner-logo img{
	max-height:100%;
	width:auto;
	object-fit:contain
}
.partner-logo span{
	font:800 22px/1.15 "Hepta Slab";
	color:#06203F;
	text-align:center;
	overflow-wrap:anywhere
}
.partner h3{
	font:800 21px/1.2 "Hepta Slab";
	letter-spacing:-.01em;
	margin-bottom:6px
}
.partner p{
	color:var(--mute);
	flex:1
}
.partner-odkazy{
	display:flex;
	gap:16px;
	flex-wrap:wrap;
	align-items:center;
	margin-top:14px
}
.partner-ig{
	display:inline-flex;
	align-items:center;
	gap:6px;
	color:var(--mute);
	text-decoration:none
}
.partner-ig:hover{
	color:var(--ink,#fff)
}
.partner-ig svg{
	width:18px;
	height:18px
}

/* loga partnerů – všechna mají stejné plátno 2:1, logo je v něm vyvážené */
.partner-logo{
	aspect-ratio:2/1;
	padding:0;
	overflow:hidden
}
.partner-logo img{
	width:100%;
	height:100%;
	max-height:none;
	object-fit:contain;
	transition:transform .2s
}
.partner-logo:hover img{
	transform:scale(1.04)
}

/* formulář Staňte se partnerem */
.formular{
	display:grid;
	gap:16px
}
.formular .pole{
	display:grid;
	gap:6px;
	min-width:0
}
.formular .pole2{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));
	gap:16px
}
.formular label,.formular legend{
	font:600 12px/1.2 Inter;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:var(--acc)
}
.formular input:not([type=checkbox]),.formular textarea{
	width:100%;
	font:500 17px/1.4 Inter;
	color:inherit;
	background:rgba(255,255,255,.06);
	border:1px solid var(--rule);
	border-radius:12px;
	padding:12px 14px
}
.formular textarea{
	resize:vertical;
	min-height:110px
}
.formular input:focus,.formular textarea:focus{
	outline:2px solid #FFE100;
	outline-offset:1px
}
.formular .volby{
	border:0;
	padding:0;
	margin:0;
	display:flex;
	flex-wrap:wrap;
	gap:10px 18px
}
.formular .volby legend{
	margin-bottom:10px
}
.formular .volby label,.formular .souhlas{
	display:flex;
	gap:10px;
	align-items:flex-start;
	font:500 16px/1.4 Inter;
	letter-spacing:0;
	text-transform:none;
	color:inherit;
	cursor:pointer
}
.formular .souhlas{
	font-size:14px;
	color:var(--mute)
}
.formular input[type=checkbox]{
	width:18px;
	height:18px;
	margin-top:2px;
	flex:none;
	accent-color:#FFE100
}
.formular .past{
	position:absolute;
	left:-9999px;
	width:1px;
	height:1px;
	overflow:hidden
}
.formular button{
	justify-self:start
}
.form-stav:empty{
	display:none
}
.form-stav.ok{
	color:#FFE100
}
.form-stav.chyba{
	color:#ff8a80
}

/* karty sponzorů: Instagram nad odkazem na web, web vždy jako poslední řádek */
.partner-odkazy{
	flex-direction:column;
	align-items:flex-start;
	gap:10px;
	margin-top:18px;
	padding-top:16px;
	border-top:1px solid var(--rule)
}