:root{
	--color-dark: #080808;
	--color-light: #eaf207;
	--color-white: #fff;
	--color-grey: #f0f0f0;

	--content-w: 1440px;
  --content-pad-x: 120px;
  --header-h: 135px;
  --header-pad-y: 20px;
  --pill-h: 44px;
  --pill-pad-x: 22px;
  --menu-padding-x: 10px;

}

@media all and (max-width: 1000px) { 
	:root{
		--content-pad-x: 20px;
	}
}

html, body { margin: 0px; padding: 0px; font-family: Inter, Arial, Helvetica, sans-serif; background-color: var(--color-dark);    font-optical-sizing: auto;  font-style: normal; }
img { border: 0px;}

.content {background: var(--color-white); max-width: var(--content-w); width: 94%; box-sizing: border-box; position: relative; margin: auto; min-height: 100%; color: var(--color-dark); font-size: 18px;  padding: 0 var(--content-pad-x);}
.content table, .content td, .content th { font-size: 12px;}
.content h1 { font-family: "Big Shoulders", sans-serif; color: var(--color-dark); font-size: 110px; margin:0px; font-weight: bold; padding: 20px 0px;}
.content h2 { font-family: "Big Shoulders", sans-serif; color: var(--color-dark); font-size: 64px; margin:0px; font-weight: bold; padding: 20px 0px; text-transform: uppercase;}
.content h3 { color: var(--color-dark); font-size: 28px; font-weight: bold; margin: 0px; padding: 20px 0px;}
.content h4 { font-size: 24px;  font-weight: bold; margin: 6px 0px; padding: 0px;}
.content h5 { font-size: 20px; font-weight: normal; font-style: italic; margin: 6px 0px; padding: 0px;}
.content h6 { font-size: 18px; font-weight: bold; margin: 3px 0px; padding: 0px;}
.content a { color: var(--color-dark); }
.content p { line-height: 28px;}


header .content {background-color: var(--color-light); height: 135px;}

/* LOGO (left) */
header .logo{  position: absolute;  left: var(--content-pad-x);  top: var(--header-pad-y);}
header .logo a{  display: block;}
header .logo img{ display: block;  height: calc(var(--header-h) - (2 * var(--header-pad-y)));  width: auto;}
header .link_cjs{  position: absolute;  top: var(--header-pad-y);  right: calc(var(--content-pad-x) + 200px);   height: var(--pill-h);  display: inline-flex;  align-items: center;  padding: 0 var(--pill-pad-x);  border: 2px solid var(--color-dark);  border-radius: 999px;  color: var(--color-dark);  text-decoration: none;  font-weight: 600;  letter-spacing: 0.2px;  white-space: nowrap; box-sizing: border-box;}
header .link_cjs:hover{  text-decoration: none;}

/* FB icon (right, top) */
header .link_soc{  position: absolute;  top: calc(var(--header-pad-y) + 8px);  right: var(--content-pad-x);  width: 28px;  height: 28px;  }
header .link_soc img{  display: block;  width: auto;  height: 100%;}
header .link_soc.ig{  right: calc(var(--content-pad-x) + 42px);}
header .link_soc.yt{  right: calc(var(--content-pad-x) + 100px);}


/* LANG (CZ/EN) – vpravo, mezi pill a FB */
header ul{  list-style: none; margin: 0; padding: 0;}
header li{  margin: 0;  padding: 0; }
header .tgmenu {display: none;}
header nav .fa-times  {display: none;}

header .lang{  position: absolute;  top: calc(var(--header-pad-y) + 13px);  right: calc(var(--content-pad-x) + 154px);}
header .lang a{  color: var(--color-dark);  text-decoration: none;  font-weight: 700;  font-size: 14px;  letter-spacing: 0.6px; display: none;}
header .lang li.active a{   display: block;}
header .lang:hover a{display: block;}


/* MAIN MENU (right, bottom) */
header div.menu {  position: absolute;  right: calc(var(--content-pad-x) - var(--menu-padding-x));  bottom: 18px;}
header div.menu ul{  display: flex;  align-items: center;  gap: 6px;}
header div.menu a{  color: var(--color-dark);  text-decoration: none;  font-weight: 600;  font-size: 18px;  white-space: nowrap;  line-height: 1;  padding: 10px var(--menu-padding-x) 12px var(--menu-padding-x);}
header div.menu li.active a, header div.menu a.active{  background: var(--color-dark); color: var(--color-light); border-radius: 999px;}

.hero .content{  padding: 0;  border-top: 2px solid var(--color-dark);}
.hero img{  display: block;  width: 100%;  height: auto;}
.hero h1.title { position: absolute; top: 44px; left: var(--content-pad-x); font-size:110px; line-height:105px; font-weight: 900; text-transform:uppercase; }
.hero h1.title .title_num { font-family: "Big Shoulders Inline" }
.hero .nota {display: block; width: 160px; height: 160px; bottom:60px ; left: 33%; position: absolute; background: url('../images/ilustrace-nota-hvezda.svg') no-repeat top left; background-size: contain;}


/* REGISTRATION INFO BAR */
.info-bar{  font-family: "Big Shoulders", sans-serif;  border-top: 2px solid var(--color-dark);  border-bottom: 2px solid var(--color-dark);}
.info-bar .info-link{  display: block;  text-decoration: none;  color: var(--color-dark);}
.info-bar .content{  display: flex;  justify-content: space-between;  align-items: center;  padding-top: 26px;  padding-bottom: 26px;}
.info-left{  font-size: 40px;  font-weight: 500;}
.info-right{  display: flex;  align-items: center;  gap: 18px;}
.info-arrow{  font-size: 48px;}
.info-date{  font-size: 48px;  font-weight: 600;  letter-spacing: 1px;}


/* Student comments */
.comments-bar .content{  background: var(--color-light); display: flex;  align-items: center;  gap: 14px;  padding-top: 14px;  padding-bottom: 14px;}
.comments-label{  white-space: nowrap;  font-size: 18px;   flex: 0 0 auto;}
.comments-label .bullet{  margin-right: 8px;}
.comments-bar .slides{  position: relative;  overflow: hidden;    flex: 1 1 auto;  min-width: 0;   height: 37px;}
.comments-bar .slides ul{  list-style: none;  margin: 0;  padding: 0;  position: absolute;  left: 0;  top: 0; max-width: 100%; display: flex;  height: 100%;}
.comments-bar .slides li{  flex: 0 0 100%;  height: 37px;  display: flex;  align-items: center;  margin: 0;  padding: 0;}
.comments-bar q.dots{  display: block;  width: 100%;  white-space: nowrap;  overflow: hidden;  text-overflow: ellipsis;  font-style: italic;  font-size: 18px;}



@media all and (max-width: 1500px) { 
		.hero h1.title { font-size: 100px; line-height: 95px;}
		.hero .nota {width: 140px; height: 140px; bottom:40px ; left: 35%; }
}

@media all and (max-width: 1300px) { 
		.hero h1.title { top: 20px;}
}

@media all and (max-width: 1200px) { 
		.hero h1.title {top: 44px;  font-size: 80px; line-height: 75px;}
}

@media all and (max-width: 1100px) { 
		.hero h1.title { top: 20px;}
		.hero .nota {width: 100px; height: 100px; bottom:20px ;  }
}

@media all and (max-width: 1000px) { 
		.hero h1.title { font-size: 65px; line-height: 60px;}
}

@media all and (max-width: 800px) { 
	.content {width: 100%;}
	header .tgmenu {display: block; position: absolute;  top: var(--header-pad-y);  right: var(--content-pad-x); font-size: 60px; line-height: 90px; cursor: pointer;}
	header nav .fa-times  {display: block; font-size: 40px; cursor: pointer;position: absolute;  top: var(--header-pad-y);  right: var(--content-pad-x);}
	header nav {text-align: center;}
	body.visiblemenu header nav {display: block; position: fixed; top: 0; left: 0; width: 100%; min-height: 100%; background: var(--color-light); z-index: 1;}
	header nav {display: none;}
	header div.menu { position: static; }
	header div.menu ul { display:block; text-align:center; border-top: 1px solid var(--color-dark);  margin-top: 80px;}
	header div.menu li { font-family: "Big Shoulders", sans-serif; font-weight: bold;text-align: left; padding: 10px 0; border-bottom: 1px solid var(--color-dark); }
	header div.menu li a{  font-size: 32px;  text-transform: uppercase;}
	header div.menu li.active { background: var(--color-dark); }
	header div.menu li.active a{ background: none; }
	header .lang li {display: inline; padding: 0 10px;} 
	header .lang a, header .lang li.active a, header .lang:hover a {display: inline;}
	header .lang { position: static; display: block; margin: 10px 0;}
	header .link_soc {position: static;  width: auto; margin: 0 10px; text-decoration: none;}
	header .link_soc img{ width: 32px;  height: 32px; display: inline;}
	header .link_cjs {position: static; margin: 20px 0;}
	.hero h1.title { position: static; font-size: 80px; line-height: 75px; padding: var(--content-pad-x);}
	.hero .nota {width: 120px; height: 120px; right: var(--content-pad-x); top: 90px; left: auto; bottom: auto; }
	.hero h1 .respo {display: none;}
	.info-left{  font-size: 30px; }
	.info-arrow{  font-size: 34px;}
	.info-date{  font-size: 34px;}

	.content h2 {  font-size: 42px;}
}

@media all and (max-width: 650px) { 
	.info-left{  font-size: 26px; }
	.info-arrow{  font-size: 30px;}
	.info-date{  font-size: 30px;}
	
}
@media all and (max-width: 550px) { 
		.hero h1.title { font-size: 60px; line-height: 55px;}
		.hero .nota { top: 80px;  width: 90px; height: 90px;}
}
@media all and (max-width: 450px) { 
		.hero h1.title { font-size: 50px; line-height: 45px;}
		.hero .nota { top: 80px;  width: 60px; height: 60px;}
	.info-left{  font-size: 20px; }
	.info-arrow{  font-size: 24px;}
	.info-date{  font-size: 24px;}

}
@media all and (max-width: 350px) { 
		.hero h1.title { font-size: 40px; line-height: 35px;}
		.hero .nota { top: 70px;  width: 50px; height: 50px;}
}



/* =========================
   MAIN SECTION
   ========================= */

.main-section .content{  padding-top: 80px;  padding-bottom: 80px;}
.main-grid{  display: grid;  grid-template-columns: 1fr 1fr;  gap: 30px;  align-items: center;}
.main-text h2{ text-transform: uppercase; }
.main-text .lead{  font-size: 27px;  margin-bottom: 20px; line-height: 36px; margin-top: 0;}
.main-text p{  margin-bottom: 18px;  line-height: 28px;}
.main-links{ font-size: 20px; font-weight: bold;  margin-top: 30px;  }
.main-links a{ color: var(--color-dark);  display: block;position: relative;  padding-left: 32px; margin: 16px 0; }
.main-visual {text-align: right;}
.main-visual img{  max-width: 100%;  height: auto;}
.main-links a::before{  content: "";  position: absolute;  left: 0;  top: 50%;  transform: translateY(-50%);  width: 20px;  height: 20px;  background: url("../images/ico-video.svg") no-repeat center;  background-size: contain;}

/* ===== PARTNERS ===== */

.partners .content {    background: var(--color-grey);    padding: 60px 0;}
.partners h2.partners-title {  font-family: Inter, Arial, Helvetica, sans-serif;  text-align: center;    margin-bottom: 40px;    font-size: 32px;    font-weight: normal;}
.partners-logos {    display: flex;    flex-wrap: wrap;    justify-content: center;    align-items: center;    gap: 40px 60px;}
.partners .partner {    display: block;    opacity: 0.8;    transition: opacity .25s ease, transform .25s ease;}
.partners .partner:hover {    opacity: 1;    transform: translateY(-3px);}
.partners .partner img {    height: 45px;    width: auto;    display: block;}

/* větší PNG logo ZUŠ */
.partner img[src$=".png"] {    height: 55px;}

/* ===== FOOTER BOTTOM ===== */

footer .content p{text-align: right; font-size: 14px; padding: 30px 0; margin: 0;}


@media all and (max-width: 800px) { 
	.main-grid{  display: grid;  grid-template-columns: 1fr;  gap: 0px;} 
	.main-visual {margin: 60px 0; text-align: center;}
	.main-visual img{  max-width: 70%;}
}




.program-table {  max-width: 720px;  margin: 50px 0 28px 0;  }
.program-row {  display: grid;  grid-template-columns: 150px 1fr;  column-gap: 12px;  align-items: stretch;}
.program-time, .program-text {  padding: 10px 0;  border-bottom: 1px solid var(--color-dark);  font-size: 16px;  line-height: 1.3; } 
.program-row:first-child .program-time, .program-row:first-child .program-text {  border-top: 1px solid var(--color-dark);}
.program-time {  font-weight: 700;  white-space: nowrap; background: var(--color-grey); padding: 14px 20px;}
.program-text {  padding: 14px 12px;}
.program-text em {  font-style: italic;  color: #555;}
.program-note {  margin: 18px 0 0;  font-size: 14px;  color: #666;}


/* =========================
   LECTORS GRID
   ========================= */

.lectors { display: grid; grid-template-columns: repeat(4, 1fr); gap: 36px; margin-top: 40px;}
.lector { background: var(--color-grey);  position: relative;}

/* PHOTO */
.lector-photo{ position: relative; }
.lector-photo img{ display: block; width: 100%; height: auto; }

/* COUNTRY TAG */
.country{ position: absolute; top: 0; right: 0;    background: var(--color-light);     padding: 8px 10px; font-size: 14px; font-weight: bold; }

/* INFO */
.lector-info{ padding: 24px; }
.lector-info h3{ margin: 0 0 6px 0; font-size: 26px; padding: 0; }
.lector-info p{ margin: 0 0 90px 0; font-size: 18px; }

/* BUTTON */
.lector-info a{ letter-spacing: 1px; display: block; position: absolute; right: 20px; bottom: 30px; border: 2px solid var(--color-dark); border-radius: 30px; padding: 10px 22px; font-size: 14px; font-weight: bold; text-decoration: none; color: var(--color-dark); text-transform: uppercase; }
.lector-info a::after{ content: " \2192"; }
.lector-info a:hover{ background: var(--color-light); }


/* GALLERY */
.gallery { list-style: none;}
.gallery li {	display: inline-block;	margin-right: 15px;	margin-bottom: 15px; }


@media all and (max-width: 1200px) { 
	.lectors { grid-template-columns: repeat(3, 1fr); gap: 20px; }
}

@media all and (max-width: 800px) { 
	.lectors { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}

@media all and (max-width: 500px) { 
	.lectors { grid-template-columns: repeat(1, 1fr); gap: 20px; }
}


/* =========================
   LECTOR DETAIL
   ========================= */

.lector-detail-grid { display: grid; grid-template-columns: 360px 1fr; gap: 70px; align-items: start;}
.lector-detail-photo img { display: block; width: 100%; height: auto;}

.lector-detail-content h1 { margin: 0 0 14px 0; font-size: 64px; line-height: 0.95; text-transform: uppercase;}
.lector-detail-content h1 span { font-size: 0.7em; font-weight: normal;}
.lector-detail-subtitle { margin-bottom: 34px; font-size: 26px; line-height: 1.1; text-transform: uppercase;}

.lector-detail-text { max-width: 760px; font-size: 18px; line-height: 1.65;}
.lector-detail-text p { margin: 0 0 28px 0;}
.lector-detail-text a { color: var(--color-dark); font-weight: bold; text-decoration: underline;}

.lector-detail-back { margin-top: 70px;}
.lector-detail-back a { letter-spacing: 1px; display: inline-block; padding: 11px 32px; border: 2px solid var(--color-dark); border-radius: 999px; color: var(--color-dark); text-decoration: none; font-size: 14px; font-weight: bold; text-transform: uppercase;}
.lector-detail-back a::after { content: " \2192";}
.lector-detail-back a:hover { background: var(--color-light);}

@media (max-width: 1000px) { 
    .lector-detail-grid { grid-template-columns: 280px 1fr; gap: 40px; }
    .lector-detail-content h1 { font-size: 46px; }
    .lector-detail-subtitle { font-size: 22px; }
}

@media (max-width: 760px) { 
    .lector-detail { padding: 40px 0 60px; }
    .lector-detail-grid { grid-template-columns: 1fr; gap: 30px; }
    .lector-detail-photo { max-width: 420px; }
    .lector-detail-content h1 { font-size: 36px; }
    .lector-detail-subtitle { margin-bottom: 24px; font-size: 20px; }
    .lector-detail-text { font-size: 17px; line-height: 1.55; }
    .lector-detail-back { margin-top: 40px; }
}

.partners_page .content{ background:var(--color-white);padding-bottom: 200px;}
.partners_page .partners-title{text-align:center;font-size:60px;margin-bottom:60px;text-transform:uppercase;}
.partners_page .partners-logos{display:grid;grid-template-columns:repeat(4,1fr);gap:1px; background:var(--color-grey); border: 1px solid var(--color-grey);}
.partners_page .partner{display:flex;align-items:center;justify-content:center;padding:40px;min-height:120px;background:var(--color-white);}
.partners_page .partner img{max-height:60px;max-width:160px;width:auto;height:auto;display:block;}

@media (max-width:900px){
		.partners_page .partners-logos{grid-template-columns:repeat(2,1fr);}
}

@media (max-width:600px){
		.partners_page .partners-logos{grid-template-columns:repeat(1,1fr);}
}






/* =========================
   REGISTRATION
   ========================= */



.registration-section{margin:0 0 40px 0;padding:0 0 36px 0;}
.registration-section h3{margin:0 0 22px 0;font-size:34px;line-height:1;text-transform:uppercase;}
.registration-main-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;}
.registration-card{display:block;background:var(--color-grey);padding:24px 24px 22px 24px;color:var(--color-dark);text-decoration:none;min-height:132px;transition:background .2s ease,border-color .2s ease,transform .2s ease; cursor:pointer;}
.registration-card:hover{background:#d3d3d3;transform:translateY(-2px);}
.registration-card.is-active{ background:var(--color-light);}
.registration-card.is-disabled{opacity:.5;pointer-events:none;}
.registration-card-title{display:block;margin:0 0 4px 0;font-size:26px;line-height:1.1;font-weight:bold;}
.registration-card-lector{display:block;margin:0 0 18px 0;font-size:20px;line-height:1.1;font-weight:normal;}
.registration-card-price{display:block;font-size:22px;line-height:1;font-weight:bold;}
.registration-card-note{margin-top:14px;font-size:14px;line-height:1.3;}
.registration-card-input{position:absolute;opacity:0;pointer-events:none;}


.registration-accommodation .registration-options{display:block;}
.registration-accommodation .registration-option{display:flex;align-items:flex-start;gap:14px;padding:18px 0;cursor:pointer;}
.registration-accommodation .registration-option input{margin:4px 0 0 0;flex:0 0 auto;}
.registration-accommodation .registration-option-main{display:block;flex:1 1 auto;min-width:0;}
.registration-accommodation .registration-option-title{display:block;margin:0 0 4px 0;font-size:21px;line-height:1.25;font-weight:bold;}
.registration-accommodation .registration-option-price{display:block;margin:0;font-size:18px;line-height:1.25;}
.registration-accommodation .registration-option:hover .registration-option-title{text-decoration:underline;}
.registration-accommodation .registration-option.registration-option-disabled { cursor: default;}
.registration-accommodation .registration-option.registration-option-disabled:hover .registration-option-title{text-decoration:none; }

.registration-summary-col{position:relative;}
.registration-summary-box{background: var(--color-light);padding:28px 30px;position:sticky;top:30px;}
.registration-summary-box h3{margin:0 0 24px 0;font-size:32px;line-height:1;text-transform:uppercase;}
.registration-summary-empty{margin:0;font-size:18px;line-height:1.4;}
.registration-summary-list{list-style:none;margin:0;padding:0;}
.registration-summary-row{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding:0 0 14px 0;margin:0 0 14px 0;}
.registration-summary-label{display:block;font-size:17px;line-height:1.35;}
.registration-summary-price{display:block;font-size:17px;line-height:1.35;font-weight:bold;white-space:nowrap;}
.registration-summary-total{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-top:26px;padding-top:18px;border-top:2px solid #000;}
.registration-summary-total-label{display:block;font-size:24px;line-height:1;font-weight:bold;text-transform:uppercase;}
.registration-summary-total-price{display:block;font-size:24px;line-height:1;font-weight:bold;white-space:nowrap;}


.registration-personal-data{margin-top:50px;padding-top:10px;}
.registration-personal-data h3{margin:0 0 20px 0;font-size:34px;line-height:1;text-transform:uppercase;}
.registration-personal-data .row{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.registration-personal-data .field{margin:0 0 18px 0;}
.registration-personal-data .field.full{grid-column:1 / -1;}
.registration-personal-data label{display:block;margin:0 0 8px 0;font-size:16px;font-weight:bold;}
.registration-personal-data input[type="text"]{display:block;width:100%;height:50px;padding:0 14px;border:1px solid var(--color-dark); background:var(--color-white);font-size:16px;box-sizing:border-box;}
.registration-personal-data input[type="email"]{display:block;width:100%;height:50px;padding:0 14px;border:1px solid var(--color-dark);background:var(--color-white);font-size:16px;box-sizing:border-box;}
.registration-personal-data input[type="tel"]{display:block;width:100%;height:50px;padding:0 14px;border:1px solid var(--color-dark);  background:var(--color-white);font-size:16px;box-sizing:border-box;}
.registration-personal-data textarea{display:block;width:100%;min-height:140px;padding:12px 14px;border:1px solid var(--color-dark);   background:var(--color-white);font-size:16px;box-sizing:border-box;resize:vertical;}
.registration-personal-data .check{display:flex;align-items:flex-start;gap:12px;margin:0;font-weight:normal;}
.registration-personal-data .check input{margin:4px 0 0 0;flex:0 0 auto;}
.registration-personal-data .check span{display:block;font-size:16px;line-height:1.4;font-weight:normal;}
.registration-level{display:flex;gap:20px;flex-wrap:wrap;}
.registration-level-option{display:flex;align-items:center;gap:8px;cursor:pointer;}
.registration-level-option input{margin:0;}
.registration-level-option span{font-size:16px;}
.registration-terms{margin:30px 0 10px 0;padding:20px 24px;background:var(--color-white);border-left:4px solid var(--color-dark);}
.registration-terms-highlight{margin:0 0 16px 0;font-size:18px;line-height:1.4;font-weight:bold;}
.registration-terms h4{margin:10px 0 12px 0;font-size:20px;line-height:1;text-transform:uppercase;}
.registration-terms p{margin:0 0 12px 0;font-size:15px;line-height:1.5;}



#registration-form button[type="submit"]{display:inline-block;margin-top:30px;padding:12px 34px;border:2px solid var(--color-dark);border-radius:999px;background:transparent;color:var(--color-dark);font-size:15px;font-weight:bold;text-transform:uppercase;cursor:pointer;}
#registration-form button[type="submit"]:hover{background:var(--color-light);color:var(--color-dark);}


@media (max-width:1100px){
	.registration-summary-box{padding:24px;}
	.registration-summary-box h3{font-size:28px;}
	.registration-section h3{font-size:30px;}
	.registration-card-title{font-size:23px;}
}
@media (max-width:900px){
	.registration-summary-col{order:1;}
	.registration-main-col{order:2;}
	.registration-summary-box{position:static;}
	.registration-main-cards{grid-template-columns:1fr;}
	.registration-personal-data .row{grid-template-columns:1fr; gap:0;}
}
@media (max-width:600px){
	.registration-summary-box{padding:22px 20px;}
	.registration-section{margin-bottom:30px;padding-bottom:28px;}
	.registration-section h3{font-size:26px;}
	.registration-card{padding:20px;min-height:0;}
	.registration-card-title{font-size:22px;}
	.registration-card-price{font-size:19px;}
	.registration-accommodation .registration-option{gap:12px;padding:15px 0;}
	.registration-accommodation .registration-option-title{font-size:18px;}
	.registration-accommodation .registration-option-price{font-size:16px;}
	.registration-summary-total-label{font-size:20px;}
	.registration-summary-total-price{font-size:20px;}
}