/*
Theme Name: Každej za sebe
Theme URI: https://kazdejzasebe.cz
Author: Tomáš Roud
Description: Vlastní téma webu kazdejzasebe.cz. Postavené na Underscores (_s), vzhled převzatý 1:1 z tématu Tracks od Compete Themes, ze kterého web migroval 27. 8. 2026. Žádný Customizer, žádný page builder.
Version: 1.0
Requires at least: 6.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kazdejzasebe
Tags: blog, podcast
*/

/* ===========================================================================
   KONVENCE — přečti, než sáhneš na CSS
   ---------------------------------------------------------------------------
   1. style.css je VÝSLEDEK BUILDU. Needituj ho, přepíše se.
      Zdroj je css/, sestavuje `php8.5 build-css.php` ve složce tématu.
      Seznam a pořadí souborů drží inc/css-zdroje.php (sdílí ho build i PHP).

   2. Číslo v názvu souboru určuje kaskádu. Nižší číslo = dřív = smí být přebito.

   3. Každý blok začíná komentářem: PROČ existuje a NA JAKÝ MARKUP míří.

   4. `!important` jen s napsaným důvodem na témže místě. Bez důvodu se maže.

   5. Pravidlo pro markup, který v tématu neexistuje, se nepíše.

   6. url() ve zdrojových souborech se píše RELATIVNĚ KE KOŘENI TÉMATU, ne ke
      složce css/ — build slévá vše do style.css, který leží o patro výš.
      Tedy `url(assets/fonts/…)`, ne `url(../assets/fonts/…)`.

   7. Vzhled je převzatý z Tracks 1.78 strojově — vytažena byla jen ta pravidla,
      jejichž selektory se opravdu vyskytují ve výstupu webu (66,7 kB → 28 kB).
      Zahozené skupiny: WooCommerce, bbPress, komentáře, widgety, sekundární
      menu, hledání v hlavičce, galerie, tmavá hlavička, obrázek na pozadí,
      prémiové rozvržení, medailonek autora, štítky, rubriky pod článkem.
      Kdyby něco z toho bylo někdy potřeba, originál je v záloze
      private/zaloha-pred-migraci-20260827/soubory/tracks/style.css.
   =========================================================================== */

/* ==== css/05-sdilene-skupiny.css ==== */
/* V Tracks tahle skupina zahrnovala i .toggle-navigation i. Ikona je dnes
   inline SVG — nahrazený prvek, který vlastní font-size a line-height na
   výšku řádku ani na účaří neuplatní. Metriky proto drží samo tlačítko,
   viz .toggle-navigation v 40-navigace.css. */
.site-title {
	font-size: 1.625em;
	line-height: 1.85;
}

.design-credit, .further-reading span, .further-reading a, .pagination, .more-link, .excerpt-meta, .entry-meta, .wp-caption-text, .wp-block-image figcaption, .alignright figcaption, .alignleft figcaption, .aligncenter figcaption, .alignnone figcaption, .alignwide figcaption, .alignfull figcaption, .size-auto figcaption, .size-full figcaption, .size-large figcaption, .size-medium figcaption, .size-thumbnail figcaption, .wp-block-table figcaption {
	font-size: 0.813em;
	line-height: 1.85;
}

.entry-container {
	padding: 0 5.55%;
}

.design-credit, .site-footer h1, .further-reading, .pagination, .more-link, .excerpt-title, .entry-title, .excerpt-meta, .entry-meta, .menu-unset > ul a, .menu-primary-items a, .site-title {
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-weight: 700;
}

/* ==== css/10-pismo.css ==== */
/* Raleway 400 a 700, hostované lokálně místo fonts.googleapis.com.
   Tracks načítal font z Google; jsou to tytéž soubory (Raleway v37), jen ze
   stejné domény jako web — o jeden DNS lookup a jedno cizí spojení míň, a bez
   odesílání IP návštěvníka třetí straně.

   Raleway je variabilní font: Google servíruje pro váhu 400 i 700 TENTÝŽ
   soubor. Proto jsou tu jen dva soubory (latin, latin-ext), ne čtyři.
   Cyrilice a vietnamština se nestahují — web je česky. */

@font-face {
	font-family: 'Raleway';
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url(assets/fonts/raleway-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: 'Raleway';
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url(assets/fonts/raleway-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;
}

/* ==== css/20-zaklad.css ==== */
p {
	margin: 1.5em 0;
}

a {
	text-decoration: none;
	color: #222;
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

a:link {
	color: #222;
}

a:visited, a:hover, a:active, a:focus {
	color: black;
}

article a {
	text-decoration: underline;
}

h1, h2, h3, h4, h5, h6 {
	font-family: "raleway", sans-serif;
	margin: 0;
	padding: 0;
	font-weight: 400;
}

h1 {
	font-size: 2.625em;
	/* 42px / 16px */
	line-height: 1.143;
}

h2 {
	font-size: 2.25em;
	/* 36px / 16px */
	line-height: 1.34;
}

h3 {
	font-size: 1.625em;
	/* 26px / 16px */
	line-height: 1.85;
}

h4 {
	font-size: 1.313em;
	/* 21px / 16px */
	line-height: 1.143;
}

h5 {
	font-size: 1.125em;
	/* 18px / 16px */
	line-height: 1.34;
}

h6 {
	font-size: 1em;
	line-height: 1.5;
}

/* ==== css/30-layout.css ==== */
*, *:before, *:after {
	box-sizing: border-box;
}

body {
	height: 100%;
	font-size: 100%;
	margin: 0;
	padding: 0;
	font-family: "raleway", sans-serif;
	line-height: 1.5;
	color: #4d4d4d;
	background: #222;
	-webkit-font-smoothing: antialiased;
	word-wrap: break-word;
	-ms-word-wrap: break-word;
}

.overflow-container {
	overflow: hidden;
	position: relative;
	height: auto;
	min-height: 100%;
}

.main {
	background: #222;
	padding-bottom: 1.5em;
	margin: 0 auto;
}

/* .vypis-prispevku je titulní strana. Je to sice stránka, ale zobrazuje výpis
   příspěvků, takže musí mít stejnou šířku i spodní odsazení jako archiv —
   do 27. 8. 2026 na téhle adrese archiv rubriky skutečně byl. Třídu přidává
   kazdejzasebe_body_class() ve functions.php. */
.blog .main, .archive .main, .search .main, .vypis-prispevku .main {
	width: 88.89%;
	max-width: 1280px;
}

.archive .main, .vypis-prispevku .main {
	padding-bottom: 0;
}

/* ==== css/40-navigace.css ==== */
.toggle-navigation {
	/* Výšku řádku i polohu účaří určoval v Tracks glyf uvnitř tlačítka
	   (.toggle-navigation i: font-size 1.625em, line-height 1.85). Inline SVG
	   je nahrazený prvek — ani jedno z toho sám neuplatní, takže obojí nese
	   tlačítko. Bez toho je tlačítko o 21 px nižší a ikona sedí o 5 px výš.
	   Padding se tím pádem přepočítává: v Tracks to bylo 1.5em při 16 px,
	   tedy 24 px; při 26 px je stejná vzdálenost 1.5em / 1.625. */
	font-size: 1.625em;
	line-height: 1.85;
	position: relative;
	float: right;
	z-index: 29;
	border: none;
	background: none;
	margin: 0;
	padding: 0 0 0 calc(1.5em / 1.625);
	color: white;
	opacity: 0.6;
	-webkit-transition: opacity 0.2s ease;
	transition: opacity 0.2s ease;
}

.toggle-navigation:hover, .toggle-navigation:active, .toggle-navigation:focus {
	opacity: 1;
	cursor: pointer;
	outline: none;
}

.menu-primary, .menu-primary-tracks {
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	position: absolute;
	top: 0;
	padding-top: 6em;
	left: 100%;
	height: 100%;
	width: 100%;
	z-index: 19;
	background-image: -webkit-linear-gradient(#222 26px, transparent 24px, transparent 24px);
	background-image: linear-gradient(#222 26px, transparent 24px, transparent 24px);
	background-size: 1px 48px;
	/* this is a 24px baseline grid */
	text-align: center;
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.menu-primary-tracks {
	top: 1.5em;
	left: -100%;
	z-index: 19;
}

.menu-unset > ul, .menu-primary-items {
	list-style: none;
	opacity: 0;
}

.menu-unset > ul li.current-menu-item a, .menu-unset > ul li.current_page_item a, .menu-primary-items li.current-menu-item a, .menu-primary-items li.current_page_item a {
	opacity: 1;
}

.menu-unset > ul a, .menu-primary-items a {
	display: block;
	color: white;
	opacity: 0.6;
	margin: 1.5em 0 0.75em 0;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.menu-unset > ul a:only-child, .menu-primary-items a:only-child {
	margin: 1.5em 0;
}

.menu-unset > ul a:link, .menu-unset > ul a:visited, .menu-primary-items a:link, .menu-primary-items a:visited {
	color: white;
}

.menu-unset > ul a:hover, .menu-unset > ul a:active, .menu-unset > ul a:focus, .menu-primary-items a:hover, .menu-primary-items a:active, .menu-primary-items a:focus {
	opacity: 1;
}

.menu-unset > ul .sub-menu, .menu-unset > ul .children, .menu-primary-items .sub-menu, .menu-primary-items .children {
	list-style: none;
}

.menu-unset > ul .sub-menu li a, .menu-unset > ul .children li a, .menu-primary-items .sub-menu li a, .menu-primary-items .children li a {
	margin: 0.75em 0;
	opacity: 0.4;
}

.menu-unset > ul .sub-menu li a:hover, .menu-unset > ul .sub-menu li a:active, .menu-unset > ul .sub-menu li a:focus, .menu-unset > ul .children li a:hover, .menu-unset > ul .children li a:active, .menu-unset > ul .children li a:focus, .menu-primary-items .sub-menu li a:hover, .menu-primary-items .sub-menu li a:active, .menu-primary-items .sub-menu li a:focus, .menu-primary-items .children li a:hover, .menu-primary-items .children li a:active, .menu-primary-items .children li a:focus {
	opacity: 1;
}

.top-navigation {
	position: relative;
	left: -6%;
	width: 112%;
	min-height: 3em;
	background: #111;
	padding: 0.375em 5.55%;
	margin: -0.75em 0 0;
	line-height: 0;
}

.top-navigation ~ button {
	top: 2.25em;
}

.top-navigation .container {
	margin: 0 auto;
	max-width: 1280px;
}

.top-navigation .container:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}

@media all and (min-width: 37.5em) {
	.top-navigation {
		margin-top: -0.75em;
		left: -6.2%;
		width: 112.4%;
		z-index: 39;
	}
}

@media all and (min-width: 48em) {
	.toggle-navigation {
		display: none;
	}
}

@media all and (min-width: 48em) {
	.menu-primary, .menu-primary-tracks {
		background: none;
		position: static;
		width: 100%;
		height: auto;
		padding: 0;
		margin: 0;
		text-align: right;
		min-height: 37px;
	}
}

@media all and (min-width: 48em) {
	.menu-primary-tracks {
		display: none;
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul, .menu-primary-items {
		margin: 0 0 0 3em;
		opacity: 1;
		/* Tier 2 */
		/* Tier 3 */
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul li, .menu-unset > ul a, .menu-primary-items li, .menu-primary-items a {
		display: inline-block;
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul li, .menu-primary-items li {
		position: relative;
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul > li, .menu-primary-items > li {
		font-size: 0.813em;
		line-height: 1.85;
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul > li:after, .menu-primary-items > li:after {
		content: "/";
		position: absolute;
		right: -6px;
		top: 0;
		color: white;
		opacity: 0.6;
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul > li:last-child:after, .menu-primary-items > li:last-child:after {
		display: none;
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul > li:last-child a, .menu-primary-items > li:last-child a {
		margin-right: 0;
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul a, .menu-primary-items a {
		opacity: 0.6;
		margin: 0 0.75em;
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul a:only-child, .menu-primary-items a:only-child {
		margin: 0 0.75em;
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul ul, .menu-primary-items ul {
		position: absolute;
		top: -9999px;
		z-index: 9;
		opacity: 0;
		left: -70%;
		right: -70%;
		min-width: 100%;
		max-width: 220px;
		margin: 0 auto;
		background: #111;
		text-align: center;
		-webkit-transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
		transition: opacity 0.3s ease, transform 0.3s ease;
		-webkit-transform: scale(0.95);
		transform: scale(0.95);
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul ul li, .menu-unset > ul ul a, .menu-primary-items ul li, .menu-primary-items ul a {
		display: block;
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul ul:hover, .menu-primary-items ul:hover {
		top: 24px;
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul ul a, .menu-primary-items ul a {
		padding: 0 1.5em;
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul ul li:first-child > a, .menu-primary-items ul li:first-child > a {
		padding-top: 0.75em;
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul ul li:last-child > a, .menu-primary-items ul li:last-child > a {
		padding-bottom: 0.75em;
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul a:hover + ul, .menu-unset > ul a:active + ul, .menu-unset > ul a:focus + ul, .menu-primary-items a:hover + ul, .menu-primary-items a:active + ul, .menu-primary-items a:focus + ul {
		top: 24px;
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul ul ul, .menu-primary-items ul ul {
		left: auto;
		right: 100%;
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul ul ul:hover, .menu-primary-items ul ul:hover {
		top: -0.75em;
	}
}

@media all and (min-width: 48em) {
	.menu-unset > ul ul a:hover + ul, .menu-unset > ul ul a:active + ul, .menu-unset > ul ul a:focus + ul, .menu-primary-items ul a:hover + ul, .menu-primary-items ul a:active + ul, .menu-primary-items ul a:focus + ul {
		top: -0.75em;
	}
}

@media all and (min-width: 48em) {
	.top-navigation {
		margin: -2.25em 0 1.5em 0;
	}
}

@media all and (min-width: 1500px) {
	.top-navigation .social-media-icons {
		margin-right: 0px !important;
	}
}

/* ===========================================================================
   Dotykové cíle v mobilním menu
   ---------------------------------------------------------------------------
   Položky vysunutého menu měly 24 px na výšku, což je na prst málo — běžně
   se doporučuje ~44 px. Řeší to svislý padding; menu je vysunutý panel, takže
   se tím nic jiného neposune.

   Platí jen pod 768 px. Nad tím je menu vodorovné v hlavičce a ovládá se myší,
   kde by vyšší položky rozhodily výšku hlavičky.
   =========================================================================== */
/* 47.99em (767,84 px), ne 47.9375em (767 px). Prohlížeč počítá em v media
   query se subpixelovou přesností a 47.9375em mu vyjde těsně POD 767, takže
   na displeji širokém přesně 767 px neplatila ani tahle podmínka, ani
   `min-width: 48em` — vznikla mezera o jeden pixel, kde se web choval jako
   desktop. Ověřeno měřením: na 767 px byly obě media query nepravdivé. */
@media all and (max-width: 47.99em) {
	.menu-unset > ul a,
	.menu-primary-items a {
		padding-top: 0.625em;
		padding-bottom: 0.625em;
	}
}

/* ==== css/50-obsah.css ==== */
ul, ol {
	font-size: 1em;
	padding: 0;
	margin: 1.5em;
}

ul ul, ul ol, ol ul, ol ol {
	margin: 0 1.5em;
}

ul ul, ol ol, ul ol, ol ul, li li {
	font-size: 1em;
}

pre {
	word-wrap: break-word;
	-ms-word-wrap: break-word;
	word-break: break-all;
	white-space: pre-wrap;
	padding: 0.75em;
	background: #f5f5f5;
}

code {
	padding: 0 0.375em;
	background: #f5f5f5;
}

pre code {
	padding: 0;
}

blockquote {
	margin: 1.5em 0;
	padding: 0 1.5em;
	border-left: solid 0.75em #222;
}

blockquote cite {
	display: block;
	text-align: right;
}

hr {
	margin: 0.69em 0;
}

table {
	border-spacing: 0;
	border-collapse: collapse;
	margin: 1.5em 0;
}

td {
	padding: 0.5em 0.75em;
	border: solid 1px #4d4d4d;
	line-height: 1.5;
}

th {
	padding: 0.5em 0.75em;
	border: solid 1px #4d4d4d;
	line-height: 1.5;
}

.wp-block-table {
	margin: 0;
}

.wp-block-table thead {
	background: #ededed;
}

.wp-block-table td, .wp-block-table th {
	border-color: #aaaaaa;
}

.wp-block-table.is-style-stripes {
	border-bottom: none;
}

.wp-block-table.is-style-stripes thead {
	background: none;
}

.wp-block-table.is-style-stripes td, .wp-block-table.is-style-stripes th {
	border-color: #aaaaaa;
}

.wp-block-table figcaption {
	line-height: 1.5;
	margin: -1em 0 0 0;
	color: #8c8c8c;
	text-align: center;
}

.wp-block-image {
	margin: 0 auto;
	line-height: 0;
}

.alignright, .alignleft, .aligncenter, .alignnone, .alignwide, .alignfull, .size-auto, .size-full, .size-large, .size-medium, .size-thumbnail {
	height: auto;
	line-height: 0;
	max-width: 100%;
	max-width: calc(100% - 48px);
}

.alignright img, .alignleft img, .aligncenter img, .alignnone img, .alignwide img, .alignfull img, .size-auto img, .size-full img, .size-large img, .size-medium img, .size-thumbnail img {
	max-width: 100%;
}

.alignright figcaption, .alignleft figcaption, .aligncenter figcaption, .alignnone figcaption, .alignwide figcaption, .alignfull figcaption, .size-auto figcaption, .size-full figcaption, .size-large figcaption, .size-medium figcaption, .size-thumbnail figcaption {
	line-height: 1.5;
	margin: 6px 0 0 0;
	color: #8c8c8c;
	text-align: center;
}

.wp-block-image figcaption {
	line-height: 1.5;
	margin: 6px 0 0 0;
	color: #8c8c8c;
}

.alignleft {
	float: left;
	margin: 0 1.5em 1.5em 0;
}

.alignright {
	float: right;
	margin: 0 0 1.5em 1.5em;
}

.aligncenter {
	text-align: center;
	margin: 1.5em auto;
	display: block;
	max-width: 100%;
}

.alignnone {
	margin: 1.5em;
}

img {
	height: auto;
	line-height: 0;
}

.wp-caption-text {
	margin: 6px 0 0 0;
	color: #8c8c8c;
}

.wp-block-social-links a {
	color: #fff;
}

.wp-block-media-text .wp-block-media-text__content {
	line-height: 1.5;
}

.wp-block-media-text.alignwide {
	max-width: 100%;
}

.wp-block-group.alignwide, .wp-block-group .alignwide, .wp-block-group.alignfull, .wp-block-group .alignfull {
	line-height: 1.5;
}

.wp-block-gallery figcaption {
	margin: -8px auto 0;
	text-align: center;
	font-size: 14px;
}

textarea {
	max-width: 41.625em;
	overflow: auto;
}

input[type=submit] {
	background: #222;
	color: white;
	max-width: 22.2em;
	min-width: 11.1em;
	padding: 0.8em;
	min-height: 45px;
	outline: none;
	border: none;
	font-family: "raleway", sans-serif;
	font-size: 0.813em;
	line-height: 1.85;
	border-radius: 0;
	-webkit-appearance: none;
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

input[type=submit]:hover, input[type=submit]:active, input[type=submit]:focus {
	cursor: pointer;
	background: black;
}

a img {
	border: none;
}

.wp-block-image.alignfull, .wp-block-cover {
	position: relative;
	left: -6.5%;
	width: 113%;
	max-width: none;
}

.wp-block-quote.is-large {
	padding-left: 0;
	border-left: none;
	margin: 1.5em;
}

.wp-block-embed {
	margin: 1.5em 0;
}

.wp-block-code code {
	background: none;
}

@media all and (min-width: 43.75em) {
	.wp-block-image.alignfull, .wp-block-cover {
		left: -14.25%;
		width: 128.5%;
	}
}

@media all and (min-width: 43.75em) {
	.wp-block-image.alignwide {
		position: relative;
		left: -7%;
		width: 114%;
		max-width: none;
	}
}

@media all and (min-width: 56.25em) {
	.wp-block-image.alignfull, .wp-block-cover {
		left: -25%;
		width: 150%;
	}
}

@media all and (min-width: 56.25em) {
	.wp-block-image.alignwide {
		left: -15%;
		width: 130%;
	}
}

@media all and (min-width: 68.75em) {
	.wp-block-image.alignfull, .wp-block-cover {
		left: -32%;
		width: 164%;
	}
}

@media all and (min-width: 68.75em) {
	.wp-block-image.alignwide {
		left: -20%;
		width: 140%;
	}
}

@media all and (min-width: 75em) {
	.wp-block-image.alignfull, .wp-block-cover {
		left: -40%;
		width: 180%;
	}
}

@media all and (min-width: 75em) {
	.wp-block-image.alignwide {
		left: -25%;
		width: 150%;
	}
}

/* ==== css/60-komponenty/10-hlavicka.css ==== */
.site-header {
	padding: 0.75em 5.55%;
}

.site-header .container {
	margin: 0 auto;
	max-width: 1280px;
}

.site-header:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}

.title-info {
	float: left;
	position: relative;
	z-index: 29;
}

.site-title {
	letter-spacing: 0.06em;
	opacity: 0.6;
	-webkit-transition: opacity 0.2s ease;
	transition: opacity 0.2s ease;
}

.site-title span {
	opacity: 0;
	position: absolute;
	top: -99em;
}

.site-title a {
	color: white;
}

.site-title a:link, .site-title a:visited, .site-title a:hover, .site-title a:active, .site-title a:focus {
	color: white;
}

.site-title img {
	max-width: 5em;
	max-height: 1.5em;
}

.site-title:hover, .site-title:active, .site-title:focus {
	opacity: 1;
}

.site-header .site-description {
	opacity: 0;
	color: white;
}

.site-header.toggled .menu-unset > ul, .site-header.toggled .menu-primary-items, .site-header.toggled .site-description {
	-webkit-transition: opacity 0.3s 0.3s ease;
	transition: opacity 0.3s 0.3s ease;
}

.site-header.toggled .menu-primary, .site-header.toggled .menu-primary-tracks {
	left: 0;
}

.site-header.toggled .menu-unset > ul, .site-header.toggled .menu-primary-items {
	opacity: 1;
}

.site-header.toggled .site-description {
	opacity: 0.9;
}

.site-header .social-media-icons {
	float: right;
	height: 100%;
}

@media all and (min-width: 48em) {
	.site-header {
		position: relative;
		z-index: 2;
		padding: 1.5em 5.55% 2.25em;
		border-top: solid 0.75em #111;
	}
}

@media all and (min-width: 48em) {
	.title-info {
		margin-top: -0.75em;
	}
}

@media all and (min-width: 48em) {
	.site-title img {
		max-width: 8em;
		max-height: 3em;
	}
}

@media all and (min-width: 48em) {
	.menu-primary .site-description, .menu-primary-tracks .site-description {
		position: absolute;
		left: 0;
		opacity: 0.6;
	}
}

@media all and (min-width: 48em) {
	.menu-primary .site-description + div, .menu-primary-tracks .site-description + div {
		margin-bottom: 0.75em;
	}
}

/* ===========================================================================
   Úzké telefony: název webu se musí vejít vedle tlačítka menu
   ---------------------------------------------------------------------------
   Hlavička je plovoucí layout z Tracks: #title-info plave vlevo, tlačítko
   vpravo. Naměřeno, že řádek potřebuje 341 px (294 titulek + 47 tlačítko),
   zatímco kontejner má 307 px na 360px displeji a 333 px na 390px. Tlačítko
   se proto na většině telefonů zalomilo pod logo a hlavička narostla
   ze 108 na 156 px. Vejde se až od zhruba 400 px.

   Šířka titulku je odvozená od jeho písma: logo 1.5em + mezera 1em + text
   8.85em, dohromady ~11.35em. Když se tedy velikost písma zastropuje na
   (dostupná šířka − tlačítko) / 11.35, řádek se vejde vždycky. `min()` zařídí,
   že se nic nezmenšuje tam, kde se původních 26 px vejde — od ~400 px výš
   proto vypadá hlavička úplně stejně jako dřív.

   4.5rem místo naměřených 47 px tlačítka je rezerva: `vw` počítá i se svislým
   posuvníkem, takže na desktopu v úzkém okně vyjde dostupná šířka o něco větší,
   než jaká doopravdy je. S 3.5rem to na 390px displeji přetékalo o 4 px.

   Zlom vychází na ~413 px: od té šířky výš se použije původních 26 px.
   =========================================================================== */
/* 47.99em (767,84 px), ne 47.9375em (767 px). Prohlížeč počítá em v media
   query se subpixelovou přesností a 47.9375em mu vyjde těsně POD 767, takže
   na displeji širokém přesně 767 px neplatila ani tahle podmínka, ani
   `min-width: 48em` — vznikla mezera o jeden pixel, kde se web choval jako
   desktop. Ověřeno měřením: na 767 px byly obě media query nepravdivé. */
@media all and (max-width: 47.99em) {
	.site-title {
		font-size: min(1.625em, calc((88.89vw - 4.5rem) / 11.35));
	}
}

/* ==== css/60-komponenty/20-vypis.css ==== */
.loop-container:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}

.excerpt.sticky .excerpt-container {
	background: wheat;
}

.excerpt-container {
	padding: 0 5.55%;
	position: relative;
	z-index: 9;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.excerpt {
	text-align: center;
	background: white;
	overflow: hidden;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	margin-bottom: 1.5em;
}

/* Náhledový obrázek je <img>, ne <div> s background-image jako v Tracks.
   Důvod: pozadí neumí srcset, takže mobil stahoval vždycky variantu 1024 px.
   `object-fit: cover` dělá totéž co `background-size: cover`, `aspect-ratio`
   nahrazuje trik s `height: 0; padding-bottom: 50%`.

   `object-position: 50% 0` drží horní okraj. Obal podcastu je čtverec s
   názvem nahoře; při svislém vystředění (což byla výchozí hodnota) ořízne
   poměr 2:1 přesně tu část s nadpisem. */
.featured-image {
	display: block;
	width: 100%;
	aspect-ratio: 2 / 1;
	object-fit: cover;
	object-position: 50% 0;
	background-color: #111;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transition: -webkit-transform 0.3s ease;
	transition: transform 0.3s ease;
}

.zoom .featured-image-link {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.zoom .featured-image-link:hover .featured-image, .zoom .featured-image-link:active .featured-image, .zoom .featured-image-link:focus .featured-image {
	-webkit-transform: scale(1.05);
	transform: scale(1.05);
	-moz-transform: scale(1.05) rotate(0.02deg);
}

.excerpt-meta, .entry-meta {
	color: #aaaaaa;
	padding-top: 1.8450184502em;
}

.excerpt-meta a, .entry-meta a {
	color: #aaaaaa;
}

.excerpt-meta a:link, .entry-meta a:link, .excerpt-meta a:visited, .entry-meta a:visited {
	color: #aaaaaa;
}

.excerpt-meta a:hover, .entry-meta a:hover, .excerpt-meta a:active, .entry-meta a:active, .excerpt-meta a:focus, .entry-meta a:focus {
	color: #222;
}

.excerpt-title, .entry-title {
	letter-spacing: 0.04em;
	font-size: 1.313em;
	/* 21px / 16px */
	line-height: 1.143;
}

.excerpt-title a, .entry-title a {
	color: #4d4d4d;
}

.excerpt-title a:link, .entry-title a:link, .excerpt-title a:visited, .entry-title a:visited {
	color: #4d4d4d;
}

.excerpt-title a:hover, .entry-title a:hover, .excerpt-title a:active, .entry-title a:active, .excerpt-title a:focus, .entry-title a:focus {
	color: #222;
}

.excerpt-header, .entry-header {
	position: relative;
}

.excerpt-header:after, .entry-header:after {
	content: "";
	position: absolute;
	background: #4d4d4d;
	width: 4.5em;
	height: 0.375em;
	left: 0;
	right: 0;
	margin: 0 auto;
	bottom: -1.5em;
}

.excerpt-content {
	padding: 1.5em 0;
}

.more-link {
	position: relative;
	text-decoration: none;
	color: #4d4d4d;
	clear: both;
}

.more-link:link, .more-link:visited {
	color: #4d4d4d;
}

.more-link:hover, .more-link:active, .more-link:focus {
	color: #222;
}

.more-link:hover:after, .more-link:active:after, .more-link:focus:after {
	-webkit-transform: scaleX(1);
	transform: scaleX(1);
}

.more-link:after {
	content: "";
	position: absolute;
	width: 1.5em;
	height: 3px;
	background: #4d4d4d;
	bottom: -0.75em;
	left: 0;
	right: 0;
	margin: 0 auto;
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
	-webkit-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.singular-page .featured-image {
	margin-top: -3em;
	margin-bottom: 3em;
}

.archive-header {
	padding: 1.5em 0;
	text-transform: uppercase;
	color: #8c8c8c;
}

.archive-header span {
	letter-spacing: 0.08em;
}

.archive-header h1 {
	letter-spacing: 0.06em;
	font-weight: 700;
	font-size: 1em;
	line-height: 1.5;
	display: inline-block;
}

.archive-header p {
	margin: 0.75em 0;
	text-transform: none;
}

@media all and (min-width: 37.5em) {
	.excerpt {
		background: #111;
		margin-bottom: 1.5em;
	}
}

@media all and (min-width: 37.5em) {
	.excerpt:first-child {
		padding-top: 0;
	}
}

@media all and (min-width: 37.5em) {
	.excerpt-container {
		background: white;
		padding: 0 6.2%;
	}
}

@media all and (min-width: 37.5em) {
	.excerpt-title, .entry-title {
		font-size: 1.875em;
		/* 30px */
		line-height: 1.6;
	}
}

@media all and (min-width: 56.25em) {
	.excerpt-container {
		width: 50%;
		padding: 0 5.55%;
	}
}

@media all and (min-width: 56.25em) {
	.excerpt {
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		/* fix weird chrome wiggle glitch */
		position: relative;
		clear: both;
		padding: 0;
		margin-bottom: 1.5em;
		opacity: 0.8;
		-webkit-transition: opacity 0.2s;
		transition: opacity 0.2s;
	}
}

@media all and (min-width: 56.25em) {
	.excerpt .featured-image {
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		/* fixes FF glitch where image focuses & unfocuses */
		width: 50%;
		width: calc(50% + 2px);
		height: 100%;
		/* výšku tady určuje karta, ne poměr stran obrázku */
		aspect-ratio: auto;
		padding-bottom: 0;
		position: absolute;
		right: -1px;
	}
}

@media all and (min-width: 56.25em) {
	.excerpt:hover {
		opacity: 1;
	}
}

@media all and (min-width: 56.25em) {
	.excerpt.even .excerpt-container {
		float: right;
	}
}

@media all and (min-width: 56.25em) {
	.excerpt.even .featured-image {
		right: auto;
		left: -1px;
	}
}

@media all and (min-width: 56.25em) {
	.excerpt.even:after {
		content: ".";
		display: block;
		clear: both;
		visibility: hidden;
		line-height: 0;
		height: 0;
	}
}

@media all and (min-width: 56.25em) {
	.excerpt-meta, .entry-meta {
		padding-top: 3.6900369004em;
	}
}

@media all and (min-width: 56.25em) {
	.excerpt-content {
		padding-bottom: 3em;
	}
}

@media all and (min-width: 56.25em) {
	.entry .featured-image:after {
		position: absolute;
		content: "";
		background: #222;
		top: 0;
		bottom: 0;
		left: 0;
		width: 100%;
		opacity: 0.2;
		-webkit-transition: opacity 0.2s ease;
		transition: opacity 0.2s ease;
	}
}

@media all and (min-width: 56.25em) {
	.entry .featured-image:hover:after {
		opacity: 0;
	}
}

/* ==== css/60-komponenty/30-clanek.css ==== */
.entry {
	max-width: 1280px;
}

.entry {
	background: white;
	padding-bottom: 1.5em;
}

.entry-meta {
	text-align: center;
}

.entry-header {
	text-align: center;
}

.entry-meta, .entry-header {
	padding-left: 5.55%;
	padding-right: 5.55%;
}

.entry-content {
	margin: 3em 0;
}

.entry-content img.full-width {
	position: relative;
	max-width: none;
	width: 113%;
	left: -6.5%;
}

.entry-content iframe {
	max-width: 100%;
}

.entry-content:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}

.further-reading span {
	display: block;
}

.further-reading a {
	font-weight: 400;
	color: #8c8c8c;
}

.further-reading a:link, .further-reading a:visited {
	color: #8c8c8c;
}

.further-reading a:hover, .further-reading a:active, .further-reading a:focus {
	color: black;
}

.entry-meta-bottom {
	margin-bottom: 3em;
}

.singular-page .entry, .error404 .entry, .search .entry {
	padding-top: 3em;
}

@media all and (min-width: 37.5em) {
	.entry {
		width: 88.88%;
		margin: 0 auto;
	}
}

@media all and (min-width: 37.5em) {
	.entry-container {
		padding: 0 5.55%;
	}
}

@media all and (min-width: 37.5em) {
	.further-reading p {
		display: inline-block;
		width: 50%;
		vertical-align: top;
		padding-right: 3em;
	}
}

@media all and (min-width: 37.5em) {
	.further-reading .prev {
		float: left;
	}
}

@media all and (min-width: 37.5em) {
	.further-reading .next {
		float: right;
		text-align: right;
		padding: 0 0 0 3em;
	}
}

@media all and (min-width: 37.5em) {
	.further-reading:after {
		content: ".";
		display: block;
		clear: both;
		visibility: hidden;
		line-height: 0;
		height: 0;
	}
}

@media all and (min-width: 43.75em) {
	.entry-container {
		padding: 0 11.11%;
	}
}

@media all and (min-width: 43.75em) {
	.entry-meta, .entry-header {
		padding-left: 5.55%;
		padding-right: 5.55%;
	}
}

@media all and (min-width: 43.75em) {
	.entry-content img.full-width {
		width: 128.6%;
		left: -14.3%;
	}
}

@media all and (min-width: 56.25em) {
	.entry-container {
		padding: 0 16.66%;
	}
}

@media all and (min-width: 56.25em) {
	.entry-header h1 {
		font-size: 4.25em;
		line-height: 1.06;
	}
}

@media all and (min-width: 56.25em) {
	.entry-meta {
		font-size: 1em;
		line-height: 1.5;
		padding-top: 3em;
		letter-spacing: 0.08em;
	}
}

@media all and (min-width: 56.25em) {
	.entry-content {
		margin-top: 4.5em;
	}
}

@media all and (min-width: 56.25em) {
	.entry-content img.full-width {
		width: 150%;
		left: -25%;
	}
}

@media all and (min-width: 68.75em) {
	.entry-meta, .entry-header {
		padding-left: 11.11%;
		padding-right: 11.11%;
	}
}

@media all and (min-width: 68.75em) {
	.entry-container {
		padding: 0 19.435%;
		position: relative;
	}
}

@media all and (min-width: 68.75em) {
	.entry-content img.full-width {
		width: 163.6%;
		left: -31.8%;
	}
}

@media all and (min-width: 75em) {
	.entry-container {
		padding: 0 22.22%;
	}
}

@media all and (min-width: 75em) {
	.entry-content img.full-width {
		width: 179.9%;
		left: -39.95%;
	}
}

/* ==== css/60-komponenty/40-strankovani.css ==== */
.pagination {
	text-align: center;
	padding: 1.5em;
	margin-bottom: -1.5em;
}

.pagination a, .pagination span {
	margin: 0 0.375em;
	color: #8c8c8c;
}

.pagination a:link, .pagination a:visited {
	color: #8c8c8c;
}

.pagination a:hover, .pagination:active, .pagination:focus {
	color: #aaaaaa;
}

@media all and (min-width: 37.5em) {
	.pagination {
		padding: 0.75em 1.5em 3em;
	}
}

/* ==== css/60-komponenty/50-socialni-ikony.css ==== */
.site-footer .social-media-icons {
	margin: 0.75em 0 1.5em;
}

.site-footer .social-media-icons a {
	opacity: 0.4;
}

.social-media-icons {
	list-style: none;
	margin: 0;
	-webkit-transition: opacity 0.3s ease-in-out, -webkit-transform 0.2s ease-in-out;
	transition: opacity 0.3s ease-in-out, transform 0.2s ease-in-out;
}

.social-media-icons li, .social-media-icons a {
	display: inline-block;
}

.social-media-icons a {
	font-size: 1.313em;
	/* 21px / 16px */
	line-height: 1.714;
	margin: 0 0.375em;
	color: white;
	opacity: 0.4;
	position: relative;
	z-index: 9;
}

.social-media-icons a:link, .social-media-icons a:visited {
	color: white;
}

.social-media-icons a:hover, .social-media-icons a:active, .social-media-icons a:focus {
	color: white;
	opacity: 1;
}

.social-icons-highlight .social-media-icons a {
	opacity: 1;
}

/* ==== css/60-komponenty/60-vyhledavani.css ==== */
input[type=text], input[type=email], input[type=password], input[type=number], input[type=search], input[type=tel], input[type=url], textarea {
	padding: 0.8em;
	width: 100%;
	max-width: 27.75em;
	min-height: 45px;
	outline: solid 1px #000;
	border: none;
	font-family: "raleway", sans-serif;
	font-size: 0.813em;
	line-height: 1.85;
	border-radius: 0;
	-webkit-appearance: none;
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

input[type=search] {
	margin-right: 1.5em;
	padding-right: 0.375em;
	/* so safari 'x' doesn't get cut off */
}

.search .sticky {
	background: white;
}

.error404 input, .search input {
	margin: 0.75em 0;
}

.error404 input[type=search], .search input[type=search] {
	margin-right: 0.75em;
}

.search-form-container {
	margin: 1.5em 0 3em;
}

.search-form-container .search-icon {
	display: none;
}

.search .search-box {
	padding: 1.5em;
	margin-bottom: 1.5em;
	background: white;
	text-align: center;
	clear: both;
}

.search .search-box .search-form-container {
	margin-bottom: 1.5em;
}

.search .search-box.bottom {
	margin-top: 1.5em;
}

@media all and (min-width: 56.25em) {
	.search-form-container {
		margin: 1.5em 0 4.5em;
	}
}

/* ==== css/60-komponenty/70-paticka.css ==== */
.site-footer {
	color: #8c8c8c;
	text-align: center;
	padding-top: 3em;
	overflow: hidden;
	clear: both;
}

.site-footer a {
	color: #8c8c8c;
}

.site-footer h1 {
	letter-spacing: 0.06em;
	opacity: 0.4;
	-webkit-transition: opacity 0.2s ease;
	transition: opacity 0.2s ease;
}

.site-footer h1:hover, .site-footer h1:active, .site-footer h1:focus {
	opacity: 0.9;
}

.site-footer p {
	margin: 0 0 1.5em;
	opacity: 0.6;
}

.design-credit {
	background: #111;
	color: #8c8c8c;
	padding: 0.75em 0;
	margin-top: 48px;
}

.design-credit a {
	color: #8c8c8c;
}

.design-credit a:link, .design-credit a:visited {
	color: #8c8c8c;
}

.design-credit a:hover, .design-credit a:active, .design-credit a:focus {
	color: #aaaaaa;
}

.design-credit p {
	margin: 0;
	opacity: 0.6;
}

@media all and (min-width: 37.5em) {
	.design-credit {
		margin-top: 72px;
	}
}

@media all and (min-width: 56.25em) {
	.site-footer h1 {
		font-size: 2.625em;
		line-height: 1.143;
	}
}

/* ==== css/60-komponenty/80-nahoru.css ==== */
.return-top {
	display: none;
}

@media all and (min-width: 37.5em) {
	.return-top {
		display: block;
		position: fixed;
		bottom: -4em;
		right: 0;
		width: 5.55%;
		height: 4em;
		background: white;
		border: none;
		opacity: 0.8;
		text-align: center;
		line-height: 4em;
		outline: none;
		-webkit-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}
}

@media all and (min-width: 37.5em) {
	.return-top .ikona {
		position: relative;
		top: 0;
		-webkit-transition: top 0.3s ease;
		transition: top 0.3s ease;
	}
}

@media all and (min-width: 37.5em) {
	.return-top.visible {
		bottom: 0;
	}
}

@media all and (min-width: 37.5em) {
	.return-top.visible:hover, .return-top.visible:active, .return-top.visible:focus {
		opacity: 1;
		cursor: pointer;
	}
}

@media all and (min-width: 37.5em) {
	.return-top.visible:hover .ikona, .return-top.visible:active .ikona, .return-top.visible:focus .ikona {
		top: -6px;
	}
}

/* ==== css/60-komponenty/90-ikony.css ==== */
/* Ikony jsou vložené jako inline SVG (inc/ikony.php), ne přes Font Awesome.
   Tracks kvůli šesti ikonám načítal celé FA 6.1.1: all.min.css (~100 kB) plus
   webfonty fa-brands-400.woff2 (103 kB) a fa-solid-900.woff2 (151 kB).
   Tvary jsou přesně tytéž — jde o path data z Font Awesome Free 6.1.1, tedy
   z téže verze, kterou renderoval webfont.

   Metriky odpovídají tomu, co dělá FA vlastní svg-with-js.css: výška 1em,
   šířka podle poměru stran viewBoxu (proto width v .ikona--* níže) a posun
   vertical-align: -0.125em, aby ikona seděla na účaří stejně jako glyf. */

.ikona {
	display: inline-block;
	height: 1em;
	vertical-align: -0.125em;
	overflow: visible;
	fill: currentColor;
}

/* šířka = viewBox width / 512 em */
.ikona--twitter-square,
.ikona--youtube-square,
.ikona--bars {
	width: 0.875em;
}

.ikona--arrow-up {
	width: 0.75em;
}

.ikona--envelope,
.ikona--search {
	width: 1em;
}

/* ==== css/60-komponenty/95-logo-v-zahlavi.css ==== */
/* Převzato z „Doplňkového CSS“ v Customizeru tématu Tracks (wp_custom_css post
   ID 28). To CSS bylo svázané s tématem — s Tracks by zmizelo, proto je tady.

   Co dělá: šablona logo.php vypisuje vedle obrázku i název webu ve
   .screen-reader-text (kvůli čtečkám). Tenhle blok ho zviditelní vedle loga
   a obrázek nechá obtékat vlevo, takže v hlavičce je „logo + název“ na řádku. */

div#site-title a span {
	position: relative;
	clip-path: none;
	margin-left: 1em;
	top: 0;
	opacity: inherit;
}

div#site-title a img {
	float: left;
}

/* ==== css/90-pristupnost.css ==== */
/* Pozor na margin: -1px. Tracks ho v CSS nemá — na web ho dodávalo blokové CSS
   jádra (wp-block-library), které tohle téma na frontendu nenačítá. Bez něj se
   název webu vedle loga posune o pixel, protože ho z .screen-reader-text
   vytahuje 95-logo-v-zahlavi.css a margin se na něm projeví. */
.screen-reader-text {
	position: absolute;
	clip: rect(1px 1px 1px 1px);
	/* IE6, IE7 */
	clip: rect(1px, 1px, 1px, 1px);
	overflow: hidden;
	height: 1px;
	width: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	word-wrap: normal;
}

.skip-content {
	position: absolute;
	width: 100%;
	background: #111;
	color: #aaaaaa;
	text-align: center;
	padding: 0.375em;
	top: -4.5em;
	z-index: 19;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.skip-content:active, .skip-content:focus {
	top: 0;
	color: #ffffff;
}