:root { --brand-green:#17b978; --brand-green-dark:#0f8052; --brand-green-soft:#eaf7f1; --brand-dark:#17241f; --soft:#f4f6f5; }
html { scroll-behavior:smooth; }
body { font-family:Roboto-Regular, Arial, sans-serif; color:#333; }
a { color:inherit; }
.topbar { background:#171c1a; }
.utility-links { gap:18px; display:flex; align-items:center; }
.utility-links a { font-family:Roboto-Regular, Arial, sans-serif; font-size:12px; color:#ddd; }
.brand-logo { display:flex; align-items:baseline; color:#222; letter-spacing:-1.5px; text-decoration:none!important; line-height:1; white-space:nowrap; }
.brand-logo b { font-family:Roboto-Black, Arial, sans-serif; font-size:36px; font-weight:400; }
.brand-logo span { font-family:Roboto-Black, Arial, sans-serif; color:var(--brand-green); font-size:36px; font-weight:400; }
.brand-logo small { display:block; margin-left:12px; color:#777; font-family:Roboto-Regular, Arial, sans-serif; font-size:10px; text-transform:uppercase; letter-spacing:.8px; }
.brand-logo-mobile b,.brand-logo-mobile span { font-size:23px; }
.brand-logo-stick { display:none; height:50px; align-items:center; padding:0 10px; }
.brand-logo-stick b,.brand-logo-stick span { font-size:22px; }
.fix-menu-desktop .brand-logo-stick { display:flex; }
.brand-logo-footer b,.brand-logo-footer span { font-size:29px; color:#fff; }
.brand-logo-footer span { color:#37cd8e; }
.wrap-logo { min-height:122px; }
.sponsor-banner { width:728px; max-width:100%; height:90px; display:flex; flex-direction:column; justify-content:center; align-items:center; background:linear-gradient(135deg,#f4f4f4,#e3e3e3); border:1px solid #ddd; color:#444; text-decoration:none!important; }
.sponsor-banner strong { font-family:Roboto-Medium, Arial, sans-serif; font-size:20px; font-weight:400; letter-spacing:.5px; }
.sponsor-banner span { font-family:Roboto-Regular, Arial, sans-serif; font-size:13px; color:#777; margin-top:5px; }
.menu-desktop.container { padding-left:0; padding-right:0; }
.main-menu > li > a { padding-left:13px; padding-right:13px; font-size:13px; }
.main-menu > li.main-menu-active > a { color:var(--brand-green); }
.headline-row { border-bottom:1px solid #eee; }
.headline-label { font-family:Lato-Regular, Arial, sans-serif; color:var(--brand-green-dark); font-weight:400; }
.feature-hero { background-position:center; }
.feature-hero:before,.feature-graphic:before { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(5,28,19,.88),rgba(5,28,19,.05) 70%); z-index:0; }
.feature-summary { color:#d9e5df; max-width:440px; font-family:Roboto-Regular, Arial, sans-serif; font-size:14px; line-height:1.55; margin-bottom:9px; }
.feature-graphic { overflow:hidden; background-color:#233d32; }
.feature-graphic:after { content:""; position:absolute; width:260px; height:260px; border:45px solid rgba(255,255,255,.07); border-radius:50%; right:-70px; top:-90px; }
.feature-memorial { background:linear-gradient(135deg,#196643,#173429); }
.feature-beach { background:linear-gradient(135deg,#08786d,#173f38); }
.feature-ezapis { background:linear-gradient(135deg,#436c57,#172820); }
.feature-memorial:before,.feature-beach:before,.feature-ezapis:before { background:linear-gradient(0deg,rgba(4,40,25,.92),rgba(4,40,25,.12)); }
.how1 > div { position:relative; z-index:1; }

/* Mega menu: vzhled a chování původní šablony MagNews2 */
.sub-mega-menu { z-index:1000; }
.sub-mega-menu .nav { width:210px; padding:24px 0; }
.sub-mega-menu .tab-content { width:calc(100% - 210px); }
.sub-mega-menu .tab-content .tab-pane { padding:24px 30px 30px; }
.sub-mega-menu .nav-pills .nav-link { padding:7px 20px 7px 27px; }
.mega-post-row { min-height:218px; }
.mega-post img { width:100%; height:112px; object-fit:cover; }
.mega-post h5 { margin:0 0 4px; font-family:Roboto-Medium, Arial, sans-serif; font-size:14px; line-height:1.35; font-weight:400; }
.mega-post h5 a:hover { color:var(--brand-green); }
.mega-post span { color:#999; font-family:Roboto-Regular, Arial, sans-serif; font-size:11px; }
.mega-empty { display:flex; align-items:center; gap:24px; padding-top:8px; }
.mega-empty img { width:220px; height:124px; object-fit:cover; }
.mega-empty strong { display:block; margin-bottom:8px; font-family:Roboto-Medium, Arial, sans-serif; font-size:19px; font-weight:400; }
.mega-empty p { max-width:480px; color:#777; font-family:Roboto-Regular, Arial, sans-serif; line-height:1.55; }

/* Nejnovější články – dvousloupcový blok Latest Articles z MagNews2 */
.latest-articles-template .latest-article-item img { width:100%; height:205px; object-fit:cover; }
.latest-articles-template .latest-article-item h3 { margin:0; font-family:Roboto-Regular, Arial, sans-serif; font-size:20px; line-height:1.25; font-weight:400; }
.latest-articles-template .latest-article-item .cl8 { font-size:12px; }
.latest-articles-template .latest-article-item { min-height:305px; }

.external-news-list article { display:grid; grid-template-columns:46px 1fr; gap:16px; padding:18px 0; border-bottom:1px solid #e6e6e6; }
.external-news-list h3 { font-family:Roboto-Medium, Arial, sans-serif; font-size:18px; line-height:1.35; margin:4px 0 7px; font-weight:400; }
.external-news-list p { color:#777; font-family:Roboto-Regular, Arial, sans-serif; line-height:1.55; margin:0; }
.source-pill { width:42px; height:25px; display:flex; justify-content:center; align-items:center; background:var(--brand-green); color:#fff; font-family:Roboto-Bold, Arial, sans-serif; font-size:11px; font-weight:400; margin-top:3px; }
.sidebar-box { margin-bottom:10px; }
.event-item { display:grid; grid-template-columns:58px 1fr; gap:14px; align-items:center; padding:13px 0; border-bottom:1px solid #e6e6e6; font-family:Roboto-Regular, Arial, sans-serif; font-size:14px; text-decoration:none!important; line-height:1.45; }
.event-item time { display:flex; flex-direction:column; align-items:center; justify-content:center; height:58px; background:#f2f3f5; border-left:3px solid var(--brand-green); }
.event-item time strong { font-family:Roboto-Bold, Arial, sans-serif; font-size:24px; font-weight:400; line-height:1; }
.event-item time span { color:#777; font-family:Roboto-Regular, Arial, sans-serif; font-size:11px; margin-top:4px; }
.sidebar-more { display:inline-block; margin-top:14px; color:var(--brand-green-dark); font-family:Roboto-Medium, Arial, sans-serif; font-size:13px; font-weight:400; }

/* VolejTV je záměrně tmavé a programové, nikoliv kalendářové */
.volejtv-box .how2 { position:relative; }
.demo-note { margin-left:auto; padding-right:9px; color:#999; font-family:Roboto-Regular, Arial, sans-serif; font-size:10px; text-transform:uppercase; letter-spacing:.5px; }
.tv-schedule { background:#17241f; padding:10px 15px 2px; }
.tv-item { display:grid; grid-template-columns:38px 54px 1fr; gap:10px; align-items:center; padding:13px 0; border-bottom:1px solid rgba(255,255,255,.12); color:#fff; text-decoration:none!important; }
.tv-item:last-child { border-bottom:0; }
.tv-play { width:32px; height:32px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--brand-green); font-size:11px; padding-left:2px; }
.tv-item time { display:flex; flex-direction:column; padding-right:8px; border-right:1px solid rgba(255,255,255,.18); }
.tv-item time strong { font-family:Roboto-Medium, Arial, sans-serif; font-size:12px; font-weight:400; }
.tv-item time small { color:#9fd3bd; font-family:Roboto-Regular, Arial, sans-serif; font-size:12px; margin-top:2px; }
.tv-info { min-width:0; }
.tv-info strong,.tv-info small { display:block; }
.tv-info strong { font-family:Roboto-Medium, Arial, sans-serif; font-size:13px; font-weight:400; line-height:1.35; }
.tv-info small { color:#aebbb5; margin-top:4px; font-family:Roboto-Regular, Arial, sans-serif; font-size:11px; }

.link-cards a { display:block; padding:14px 15px; margin-bottom:8px; border:1px solid #e3e3e3; border-left:3px solid var(--brand-green); text-decoration:none!important; }
.link-cards strong,.link-cards span { display:block; }
.link-cards strong { font-family:Roboto-Medium, Arial, sans-serif; font-weight:400; }
.link-cards span { color:#888; font-family:Roboto-Regular, Arial, sans-serif; font-size:12px; margin-top:3px; }
.google-ad { width:300px; max-width:100%; height:250px; margin:0 0 38px auto; display:flex; flex-direction:column; justify-content:center; align-items:center; background:#fafafa; border:1px solid #ddd; color:#999; text-align:center; }
.google-ad span { font-family:Roboto-Regular, Arial, sans-serif; font-size:9px; letter-spacing:1.4px; }
.google-ad strong { color:#777; margin:36px 0 5px; font-family:Roboto-Medium, Arial, sans-serif; font-size:17px; font-weight:400; }
.google-ad small { font-family:Roboto-Regular, Arial, sans-serif; font-size:11px; }
.footer-links { columns:2; }
.footer-links li { margin:9px 0; }
.footer-links a { color:#bbb; font-family:Roboto-Regular, Arial, sans-serif; font-size:13px; }
.copyright { color:#bbb; font-family:Roboto-Regular, Arial, sans-serif; font-size:12px; }
.footer-satoya { display:flex; justify-content:center; padding:24px 0 8px; margin-top:8px; border-top:1px solid rgba(255,255,255,.1); }
.footer-satoya .logo-footer { display:block; width:468px; max-width:100%; height:auto; }
.btn-back-to-top { border:0; }

/* Footer background and color tweaks to match prototype */
.bg2 { background-color: #222; color: #fff; }
.bg2 .brand-logo-footer b, .bg2 .brand-logo-footer span { color: #fff; }
.bg2 .brand-logo-footer span { color: #37cd8e; }
.bg2 .footer-links a { color: #bbb; }
.bg2 .footer-links a:hover { color: #fff; }
.bg11 { background-color: #151515; color: #bbb; }
.bg11 .copyright { color: #bbb; }



/* Zelené přebarvení pomocných tříd MagNews2 */
.how2-cl1 { border-color:var(--brand-green); }
.how2-cl1::before { background-color:var(--brand-green); }
.hov-cl10:hover { color:var(--brand-green)!important; }
.main-menu > li:hover > a { color:var(--brand-green); }
.sub-menu > li:hover > a,.sub-mega-menu .nav-pills .nav-link.active,.sub-mega-menu .show>.nav-pills .nav-link { background-color:var(--brand-green); }
.btn-back-to-top { background-color:var(--brand-green); }

@media (max-width:1199px) {
  .main-menu > li > a { padding-left:9px; padding-right:9px; font-size:12px; }
  .brand-logo small { display:none; }
  .sub-mega-menu .nav { width:180px; }
  .sub-mega-menu .tab-content { width:calc(100% - 180px); }
  .mega-post img { height:95px; }
}
@media (max-width:991px) {
  .wrap-logo,.wrap-main-nav,.topbar { display:none!important; }
  .headline-row { margin-top:12px; }
  aside { padding-top:25px; }
  .google-ad { margin-left:0; }
}
@media (max-width:575px) {
  .latest-articles-template .latest-article-item img { height:190px; }
  .latest-articles-template .latest-article-item { min-height:0; }
  .feature-summary { display:none; }
  .copyright { justify-content:center; gap:6px; text-align:center; }
}
/* Overrides for icon fonts omitted from the distributable prototype. */
.main-menu > li > a::after { display:none; }
.brand-logo:not(.brand-logo-stick):not(.brand-logo-mobile):not(.brand-logo-footer) { flex-wrap:wrap; max-width:360px; }
.brand-logo:not(.brand-logo-stick):not(.brand-logo-mobile):not(.brand-logo-footer) small { flex-basis:100%; margin-left:1px; margin-top:7px; }
.headline-row { flex-wrap:nowrap; }
.headline-row > .size-w-0 { flex:1; min-width:0; }
.slide100-txt-item:not(:first-child) { display:none; }
@media (max-width:767px) {
  .headline-row { flex-wrap:wrap; }
  .headline-row > .size-w-0 { width:100%; display:block; padding-right:0; flex:0 0 100%!important; max-width:100%; }
  .headline-row .slide100-txt { display:block; width:100%!important; min-height:22px; margin-top:5px; flex:none!important; max-width:100%; }
  .headline-row .slide100-txt-item { position:static!important; width:auto!important; white-space:normal; }
  .headline-row form.size-a-2 { width:100%; margin-top:12px; }
}

/* Verze 5: hlavní navigace a mega menu sjednocené s originálním MagNews2. */
.menu-desktop.container {
  width: 1050px;
  max-width: calc(100% - 30px);
  margin: 0 auto;
  padding-left: 0;
  padding-right: 0;
}

.main-menu > li > a {
  font-family: Roboto-Medium, Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  color: #222;
  padding: 5px 0;
  margin: 0 18px;
}

.main-menu > li.main-menu-active > a {
  color: #222;
}

.main-menu > li > a::before {
  left: -18px;
  width: calc(100% + 36px);
  background-color: var(--brand-green);
}

/* Šipka je pouze u položek, které opravdu rozbalují submenu. */
.main-menu > li > a::after {
  display: none;
  content: none;
}

.main-menu > li.has-submenu > a::after {
  content: "";
  display: block;
  width: 7px;
  height: 7px;
  margin-left: 8px;
  margin-bottom: 5px;
  border-right: 2px solid #222;
  border-bottom: 2px solid #222;
  transform: rotate(45deg);
  transition: border-color .3s, transform .3s;
}

.main-menu > li.has-submenu:hover > a::after {
  border-color: var(--brand-green);
}

/* Rozměry a typografie levého sloupce odpovídají původnímu mega menu. */
.sub-mega-menu .nav {
  width: 240px;
  padding: 30px 0;
}

.sub-mega-menu .tab-content {
  width: calc(100% - 240px);
}

.sub-mega-menu .nav-pills .nav-link {
  font-family: Roboto-Medium, Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.8;
  color: #222;
  border-radius: 0;
  padding: 8px 20px 8px 33px;
}

.sub-mega-menu .tab-content .tab-pane {
  padding: 25px 50px 35px 30px;
}

.mega-post h5 {
  margin: 0 0 5px;
  font-family: Roboto-Medium, Arial, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.333333;
}

.mega-post span {
  font-family: Roboto-Regular, Arial, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.7;
}

.mega-empty strong {
  font-family: Roboto-Medium, Arial, sans-serif;
  font-weight: 400;
}

/* Mobilní šipka ve stylu originálu. */
.arrow-main-menu-m::before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-right: 2px solid #666;
  border-bottom: 2px solid #666;
  transform: rotate(-45deg);
  transition: transform .3s;
}

.turn-arrow-main-menu-m::before {
  transform: rotate(45deg);
}

@media (max-width: 1199px) {
  .main-menu > li > a {
    margin: 0 10px;
    font-size: 15px;
  }

  .main-menu > li > a::before {
    left: -10px;
    width: calc(100% + 20px);
  }

  .sub-mega-menu .nav {
    width: 210px;
  }

  .sub-mega-menu .tab-content {
    width: calc(100% - 210px);
  }

  .sub-mega-menu .tab-content .tab-pane {
    padding-right: 30px;
  }
}


/* Verze 6: sjednocená typografie a klidnější nadpisy sekcí. */
.tab01-title { font-family:Roboto-Medium, Arial, sans-serif; font-weight:400; }
.tab01-link { font-family:Roboto-Regular, Arial, sans-serif; }
.latest-articles-template .f1-m-3 { font-family:Roboto-Regular, Arial, sans-serif; font-weight:400; }
.latest-articles-template .f1-s-4 { font-family:Roboto-Bold, Arial, sans-serif; font-weight:400; }
.external-news-list a { font-family:inherit; }
.how2-cl4::before { background-color:#333; }

/* Verze 7: feature články a Latest Articles přesněji podle MagNews2. */
.feature-hero .how-txt1,
.feature-graphic .how-txt1 {
  font-family: Roboto-Medium, Arial, sans-serif;
  font-weight: 400;
  color: #fff !important;
}

.feature-hero .how-txt1:hover,
.feature-graphic .how-txt1:hover {
  color: var(--brand-green) !important;
}

.feature-summary {
  color: #fff;
  opacity: .94;
}

.latest-articles-template .latest-article-item h5 {
  margin: 0;
  font-weight: 400;
}

.latest-articles-template .latest-article-item h5 > a.f1-m-3 {
  font-family: Roboto-Regular, Arial, sans-serif;
  font-size: 20px;
  line-height: 1.25;
  font-weight: 400;
  letter-spacing: 0;
  color: #333;
}

.latest-articles-template .latest-article-item h5 > a.f1-m-3:hover {
  color: var(--brand-green);
}


/* Verze 8: přímé a nezávislé selektory pro feature karty a Latest Articles. */
.feature-card .feature-card-title {
  display: block;
  font-family: Roboto-Medium, Arial, sans-serif !important;
  font-weight: 400 !important;
  color: #ffffff !important;
  opacity: 1 !important;
  filter: none !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.45);
  -webkit-font-smoothing: antialiased;
}

/* Hover funguje při najetí na titulek i kamkoli do celé karty. */
.feature-card:hover .feature-card-title,
.feature-card .feature-card-title:hover,
.feature-card .feature-card-title:focus {
  color: var(--brand-green) !important;
}

.feature-card .feature-summary,
.feature-card .how1-child2 .cl11 {
  color: #ffffff !important;
  opacity: 1 !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.4);
}

.latest-articles-template .latest-article-item h5 {
  margin: 0 !important;
  font-family: Roboto-Regular, Arial, sans-serif !important;
  font-size: inherit !important;
  line-height: inherit !important;
  font-weight: 400 !important;
}

.latest-articles-template .latest-article-item .latest-title-link {
  display: block;
  font-family: Roboto-Regular, Arial, sans-serif !important;
  font-size: 19px !important;
  line-height: 1.32 !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  color: #333333 !important;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

.latest-articles-template .latest-article-item .latest-title-link:hover,
.latest-articles-template .latest-article-item .latest-title-link:focus {
  color: var(--brand-green) !important;
}

.latest-articles-template .latest-article-item .f1-s-4 {
  font-family: Roboto-Medium, Arial, sans-serif !important;
  font-weight: 400 !important;
}

/* Verze 9: text horních karet musí být skutečně nad tmavým překryvem. */
.feature-card {
  isolation: isolate;
}

.feature-card > .how1-child1 {
  z-index: 1 !important;
}

.feature-card > .flex-col-e-s {
  position: relative !important;
  z-index: 3 !important;
}

.feature-card .how1-child2,
.feature-card .feature-card-title,
.feature-card .feature-summary {
  position: relative !important;
  z-index: 4 !important;
}

.feature-card .feature-card-title,
.feature-card .feature-summary,
.feature-card .how1-child2 .cl11 {
  color: rgb(255, 255, 255) !important;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}

.feature-card:hover .feature-card-title,
.feature-card:focus-within .feature-card-title,
.feature-card .feature-card-title:hover,
.feature-card .feature-card-title:focus {
  color: var(--brand-green) !important;
}


/* v10: hover a aktivní stav položek levého sloupce mega menu jako v MagNews2. */
.sub-mega-menu .nav-pills .nav-link:hover,
.sub-mega-menu .nav-pills .nav-link:focus,
.sub-mega-menu .nav-pills .nav-link.active,
.sub-mega-menu .show > .nav-pills .nav-link {
  color: #fff !important;
  background-color: var(--brand-green) !important;
}