@charset "UTF-8";
.homepage-hero {
  min-height: 600px;
  margin-bottom: 110px;
}
@media (max-width: 768px) {
  .homepage-hero {
    margin-bottom: 170px;
  }
}
.homepage-hero .hero-image {
  height: 600px;
}

/* Bloby */
.blob-block {
  position: absolute;
  z-index: 2;
}

.blob-desktop {
  display: block;
}
@media (max-width: 768px) {
  .blob-desktop {
    display: none;
  }
}

.blob-mobile {
  display: none;
  width: 100%;
  height: 20vh;
}
@media (max-width: 768px) {
  .blob-mobile {
    display: block;
  }
}

.blob-premobile {
  display: none;
  width: 100%;
}
@media (max-width: 768px) {
  .blob-premobile {
    display: block;
  }
}
@media (max-width: 576px) {
  .blob-premobile {
    display: none;
  }
}

/* Text uvnitř blobů */
.blob-text {
  position: absolute;
  top: 0;
  left: 0;
  width: 95%;
  display: flex;
  justify-content: center;
  flex-direction: column;
  text-align: left;
  padding: 80px 0 0 80px;
}
@media (max-width: 992px) {
  .blob-text {
    padding: 10% 0 0 10%;
  }
}
@media (max-width: 768px) {
  .blob-text {
    display: block;
    padding: 5% 0 0 5%;
  }
}
@media (max-width: 576px) {
  .blob-text {
    padding: 30px 0 0 20px;
  }
}

/* Desktop pozice blobů */
.block-school {
  top: 0;
  left: 0;
  color: #222222;
}
.block-school img {
  object-position: bottom;
}
.block-school .blob-text {
  gap: 24px;
}

.block-director {
  top: 40%;
  right: 20px;
  color: black;
}
.block-director .blob-mobile {
  height: 100%;
}
@media (max-width: 768px) {
  .block-director .blob-mobile {
    display: none;
  }
}
@media (max-width: 576px) {
  .block-director .blob-mobile {
    display: block;
  }
}
.block-director .blob-text {
  gap: 8px;
  padding: 0;
  width: 320px;
  height: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media (max-width: 768px) {
  .block-director .blob-text {
    top: 20%;
    left: 5%;
    transform: none;
  }
}
.block-director .blob-text h4 {
  padding-bottom: 24px;
  margin: 0;
}
.block-director .blob-text a, .block-director .blob-text p {
  font-size: 14px;
}
.block-director .blob-text a {
  color: #222222;
  text-decoration: none;
}

/* --- Mobilní zobrazení --- */
@media (max-width: 768px) {
  .hero-image {
    position: relative;
    height: 300px;
    clip-path: none; /* full image */
  }
  /* Pořadí: první blob nahoře, hero obrázek, druhý blob pod */
  .block-school {
    position: relative;
    top: auto;
    left: auto;
    margin-bottom: -100px;
  }
  .block-director {
    position: relative;
    right: auto;
    top: 160px;
  }
  .blob-text h1 {
    font-size: 32px;
  }
  .blob-text h4 {
    font-size: 20px;
  }
}
@media (max-width: 576px) {
  .block-director {
    top: 200px;
  }
}
/* TILES */
.hp_tiles {
  padding-bottom: 90px;
  row-gap: 30px;
}
@media (max-width: 576px) {
  .hp_tiles {
    row-gap: 20px;
    padding-bottom: 40px;
    padding-top: 30px;
  }
}
@media (max-width: 576px) {
  .hp_tiles {
    /* Sudé prvky (2., 4., 6...) */
  }
  .hp_tiles .tile-blob-wrapper:nth-child(odd) {
    padding-right: 6px;
  }
  .hp_tiles .tile-blob-wrapper:nth-child(even) {
    padding-left: 6px;
  }
}

.hp_tiles a img, .og-item svg {
  /* Nastaví plynulost pro filter. 0.3s je zlatý střed pro rychlost. */
  transition: filter 0.3s ease-in-out;
}

.hp_tiles a:hover img, .og-item:hover svg {
  filter: brightness(0.85);
}

/* Kontejner pro celou dláždici */
.tile-block {
  position: relative;
  display: inline-block;
  margin: 15px;
  vertical-align: top;
}

/* Kontejner pro SVG blob a jeho obsah (proklik) */
.tile-blob-wrapper {
  display: block;
  position: relative;
  height: 100%;
  overflow: hidden;
  text-decoration: none; /* Odstraní podtržení z odkazu */
}
.tile-blob-wrapper img {
  width: 100%;
  height: 100%;
}

/* Samotné SVG */
.tile-blob {
  width: 100%;
  height: 100%;
  display: block;
}

/* Obsah uvnitř Blobu (ikona + text) */
.blob-tile-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: #fff;
  padding: 10px;
  pointer-events: none; /* Důležité: umožní proklik přes celý tile-blob-wrapper */
}

/* Styling ikony, používá --icon-url z PHP */
.blob-tile-icon {
  width: 64px;
  height: 64px;
  background-size: contain;
  background-repeat: no-repeat;
  margin-bottom: 8px;
  background-image: var(--icon-url, none); /* Zde se aplikuje URL ikony */
}
@media (max-width: 768px) {
  .blob-tile-icon {
    width: 44px;
    height: 44px;
  }
}

/* Styling textu */
.blob-tile-content p {
  margin: 0;
  font-size: 1.1em;
  font-weight: bold;
  line-height: 1.2;
}

.blob-wrapper {
  position: relative;
  width: 100%;
  aspect-ratio: 1/1;
  background: #f2f2f2;
  border-radius: 60% 40% 30% 70%/60% 30% 70% 40%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.aktualita-item {
  position: relative;
}
.aktualita-item .row {
  padding-top: 10px;
  padding-bottom: 10px;
}

.aktualita-item:hover h4 {
  text-decoration: underline;
}

.aktualita-item .blob-container {
  padding: 10px 50px 30px 20px;
}
@media (max-width: 1200px) {
  .aktualita-item .blob-container {
    padding: 10px 30px 30px 20px;
  }
}
@media (max-width: 992px) {
  .aktualita-item .blob-container {
    padding: 10px 20px 20px 10px;
  }
}

@media (max-width: 576px) {
  .aktualita-image {
    justify-content: center;
    display: flex;
  }
  .aktualita-image .blob-container {
    max-width: 85%;
  }
}
.hp_news_grid {
  row-gap: 32px;
  padding-top: 70px;
}
@media (max-width: 992px) {
  .hp_news_grid {
    row-gap: 12px;
  }
}
@media (max-width: 768px) {
  .hp_news_grid {
    padding-top: 20px;
  }
}
.hp_news_grid .blob-image {
  width: 228px;
  height: 228px;
  border-radius: 20px;
}
@media (max-width: 1200px) {
  .hp_news_grid .blob-image {
    width: 100%;
    height: 100%;
  }
}

.blob-bottom {
  position: absolute;
  top: 0;
  left: -5px; /* vyčnívá doleva */
  z-index: 1; /* pod textem/obrázkem */
  pointer-events: none; /* aby blob nezasahoval do klikání */
}

/* Pokud chceš blob zmenšit na mobilu */
@media (max-width: 768px) {
  .blob-bottom svg {
    width: 200px;
    height: auto;
    left: -10px;
  }
}
.aktuality-list {
  padding-top: 60px;
}

.aktualita-title h3,
.aktualita-excerpt p {
  display: -webkit-box; /* potřebné pro line-clamp */
  -webkit-line-clamp: 2; /* počet řádků */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis; /* trojtečka ... */
}

.aktualita-title a {
  color: black;
}

button, .btn, .button {
  color: #B62F2B;
  border: 2px solid #9A1915;
  border-radius: 16px;
  padding: 8px 16px;
  transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}

button:hover, .btn:hover, .button:hover {
  background-color: #92120F;
}

button.grey, .btn.grey {
  background-color: #F7F6F6;
  color: black;
}

button.grey:hover, .btn.grey:hover {
  background-color: #EFEEEE;
  color: black;
}

.header-logo {
  max-height: 55px;
}
@media (max-width: 768px) {
  .header-logo {
    max-height: 45px;
  }
}

/* MENU */
/* Základní reset pro seznam */
.nav-menu {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 20px;
}

/* Skrytí tlačítka na desktopu */
.menu-toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
}

.menu-toggle span {
  display: block;
  width: 25px;
  height: 3px;
  background: black;
}

/* Mobilní verze (do 768px) */
@media (max-width: 768px) {
  .menu-toggle {
    display: flex;
  }
  .main-menu-container {
    display: none; /* Skryté menu */
    width: 100%;
  }
  .main-menu-container.is-open {
    display: block; /* Zobrazené menu po kliku */
  }
  .nav-menu {
    flex-direction: column;
    background: #f9f9f9;
    padding: 20px;
    position: absolute;
    width: 100%;
    left: 0;
  }
}
#section-footer {
  position: relative;
}

.footer-logo {
  max-height: 55px;
}
@media (max-width: 768px) {
  .footer-logo {
    max-height: 45px;
  }
}

.footer-left-text {
  font-size: 22px;
}

.footer-right {
  color: #9A1915;
}

/* ZAKLADNI VLASTNOSTI */
/* Nastaveni nuloveho spodniho marginu pro posledni <p> prvek v clanku - aby to nezvetsovalo mezeru od navazujiciho prvku */
.type-page > p:last-child {
  margin-bottom: 0;
}

#page-content {
  padding-top: 62px;
  padding-bottom: 82px;
}
@media (max-width: 768px) {
  #page-content {
    padding-top: 30px;
    padding-bottom: 30px;
  }
}

.page.container {
  padding-block: 50px;
}
.hero-section {
  position: relative;
  width: 100%;
  overflow: visible;
  background-color: #fff;
  min-height: 420px;
  /* Hero obrázek */
}
@media (max-width: 768px) {
  .hero-section {
    min-height: 300px;
  }
}
.hero-section .hero-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 420px;
  clip-path: url(#hero-curve);
}
@media (max-width: 768px) {
  .hero-section .hero-image {
    height: 300px;
    clip-path: url(#hero-curve-mobile);
  }
}

.homepage-hero.hero-section {
  min-height: 520px;
}
.homepage-hero.hero-section .hero-image {
  height: 520px;
}
@media (max-width: 768px) {
  .homepage-hero.hero-section {
    min-height: 400px;
  }
  .homepage-hero.hero-section .hero-image {
    height: 400px;
  }
}
@media (max-width: 576px) {
  .homepage-hero.hero-section {
    min-height: 350px;
  }
}

.cream-wave {
  width: 100%;
}
.cream-wave .top-wave {
  margin-bottom: -1px;
}
.cream-wave .bottom-wave {
  margin-top: -1px;
}

.creambg {
  background-color: #E9DCC5;
  position: relative;
  z-index: 1;
  margin-top: -1px;
  margin-bottom: -1px;
}

.single-content {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 2rem; /* Toto definuje JEDNOTNOU mezeru mezi bloky */
}

/* Pokud nechceš flexbox, klasické moderní řešení je: */
.single-content > * + * {
  margin-top: 2rem; /* Přidá mezeru nad každý prvek kromě prvního */
}

img {
  max-width: 100%;
  height: auto;
  display: block; /* Doporučeno pro odstranění mezery pod obrázkem */
  object-fit: cover;
}

@media (max-width: 992px) {
  .blob-mob {
    padding-top: 30px;
  }
}

.bg-blob {
  padding-top: 30px;
  padding-bottom: 30px;
}
@media (max-width: 992px) {
  .bg-blob {
    background-image: none;
  }
}
.bg-blob img {
  border-radius: 60px;
  /*width: 614px;
  min-height: 566px;*/
}
@media (max-width: 992px) {
  .bg-blob img {
    border-radius: 20px;
  }
}

.single-content-row {
  min-height: 500px;
}

.blob-container {
  background-image: url("../images/single-page-image-blob-mob.png");
  background-repeat: no-repeat;
  background-size: contain;
  padding: 20px 80px 40px 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (max-width: 992px) {
  .blob-container {
    padding: 20px 60px 30px 30px;
  }
}
.blob-container img {
  aspect-ratio: 1/1;
  object-fit: cover;
}

.post-thumbnail-blob {
  position: absolute;
  top: -20px;
  left: 40%;
  transform: translateX(-50%);
  width: 120%;
  height: auto;
  z-index: 1;
}
.post-thumbnail-blob svg {
  width: 130%;
  height: auto;
  display: block;
  overflow: visible;
}

@media (max-width: 992px) {
  .post-thumbnail-blob {
    bottom: -30px;
    width: 150%;
  }
}
/* SINGLE */
.single-back-row {
  position: absolute;
  top: 20px;
}

/* AKtuality */
.pagination-wrapper ul {
  display: flex;
  list-style: none;
  padding: 0;
  gap: 10px;
}

.pagination-wrapper li a, .pagination-wrapper li span {
  padding: 8px 16px;
  border: 1px solid #ddd;
  border-radius: 5px;
  text-decoration: none;
  color: #333;
}

.pagination-wrapper li span.current {
  background-color: #007bff; /* Barva aktivní stránky */
  color: white;
  border-color: #007bff;
}

/* PAGIONATION */
/* Dropdown filtr */
.aktuality-filter .form-select {
  border-color: #B62F2B;
  color: #B62F2B;
  font-weight: 500;
  border-radius: 50px;
}

.aktuality-filter .form-select:focus {
  border-color: #B62F2B;
  box-shadow: 0 0 0 0.2rem rgba(255, 102, 0, 0.25);
}

/* Bootstrap pagination */
.pagination .page-item .page-link {
  color: #B62F2B;
  border-color: #B62F2B;
  font-weight: 500;
}

.pagination .page-item.active .page-link {
  background-color: #B62F2B;
  border-color: #B62F2B;
  color: #fff;
}

.pagination .page-item .page-link:hover {
  background-color: rgba(255, 102, 0, 0.1);
  color: #B62F2B;
  border-color: #B62F2B;
}

/* GALERY */
.ngg-gallery-thumbnail {
  padding-top: 8px;
  padding-bottom: 8px;
}
.ngg-gallery-thumbnail img {
  border-radius: 30px;
}
@media (max-width: 1400px) {
  .ngg-gallery-thumbnail {
    padding: 6px;
  }
}
@media (max-width: 768px) {
  .ngg-gallery-thumbnail {
    padding: 6px;
  }
  .ngg-gallery-thumbnail img {
    border-radius: 20px;
  }
}

/* GALERIE - stare fotky */
.col:has(.alignnone.size-medium) {
  display: flex;
  flex-wrap: wrap;
  clear: both;
}

/* Tvůj upravený kód pro obrázky */
.col:has(.alignnone.size-medium) .alignnone.size-medium {
  width: 25%;
  aspect-ratio: 1/1;
  object-fit: cover;
  border-radius: 30px;
  padding: 8px;
  box-sizing: border-box; /* Aby padding nevyhazoval obrázky z řádku */
}
@media (max-width: 768px) {
  .col:has(.alignnone.size-medium) .alignnone.size-medium {
    width: 50%;
  }
}

.alignnone.size-medium {
  width: 25%;
  aspect-ratio: 1/1; /* Vynutí čtverec (výška = šířka) */
  object-fit: cover; /* Ořízne obrázek, aby vyplnil čtverec a neroztáhl se */
  border-radius: 30px;
  height: auto; /* Resetuje případnou pevnou výšku z HTML */
  float: left;
  display: block;
  padding: 8px;
}

.alignnone.size-medium:nth-child(-n+5) {
  margin-top: 30px;
}
@media (max-width: 768px) {
  .alignnone.size-medium:nth-child(-n+5) {
    margin-top: 0;
  }
}

@media (max-width: 768px) {
  /* 2. Nastavíme margin jen pro první dva (první řada na mobilu) */
  .alignnone.size-medium:nth-child(-n+3) {
    margin-top: 30px;
  }
}
/* FONTY */
/* Regular */
@font-face {
  font-family: "Hanken Grotesk";
  src: url("../../assets/fonts/HankenGrotesk/HankenGrotesk-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
/* Medium */
@font-face {
  font-family: "Hanken Grotesk";
  src: url("../../assets/fonts/HankenGrotesk/HankenGrotesk-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
/* SemiBold */
@font-face {
  font-family: "Hanken Grotesk";
  src: url("../../assets/fonts/HankenGrotesk/HankenGrotesk-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
/* Bold */
@font-face {
  font-family: "Hanken Grotesk";
  src: url("../../assets/fonts/HankenGrotesk/HankenGrotesk-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
/* Extra Bold (když už ho tam máš) */
@font-face {
  font-family: "Hanken Grotesk";
  src: url("../../assets/fonts/HankenGrotesk/HankenGrotesk-ExtraBold.woff2") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
body {
  font-family: "Hanken Grotesk", sans-serif;
}

/* Ukázka rozdělení tloušťky */
h1 {
  font-weight: 800;
} /* ExtraBold */
h2 {
  font-weight: 700;
} /* Bold */
h3 {
  font-weight: 600;
} /* SemiBold */
.blind-friendly-nav {
  position: absolute;
  top: 0;
  left: 0;
  margin-left: -10000px;
  background: #fff;
  color: #000;
  padding: 10px;
  z-index: 0;
}

/*# sourceMappingURL=styles.css.map */