/* Úvodní stránka podle Slávkových obrazových a hlasových podkladů. */
.home-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.home-page .home-hero { padding: 30px 0 0; }
.home-page .home-title { --letter-height: clamp(25px, 4.1vw, 49px); display: flex; align-items: center; justify-content: center; gap: 20px; margin: 0 0 20px; padding: 22px 24px; background: #080808; line-height: 1; }
.home-title-flag { width: auto; height: calc(var(--letter-height) * 1.22); border: 3px solid #111; border-radius: 2px; flex: none; }
.home-title-words { display: flex; align-items: center; gap: calc(var(--letter-height) * var(--title-word-gap)); min-width: 0; }
.home-title-words img { height: var(--letter-height); width: auto; max-width: none; }
.home-page .home-biography { padding-top: 38px; padding-bottom: 0; }
.home-portraits { display: flex; flex-direction: column; align-items: center; gap: 18px; margin: 0 auto 36px; }
.home-triple-portrait { width: 300px; max-width: 100%; height: auto; }
.home-story { display: flow-root; font-size: 17px; line-height: 1.8; color: #333; }
.home-story p { margin: 0 0 1.25em; }
.home-story > :last-child { margin-bottom: 0; }
.home-lion { width: 34%; max-width: 350px; }
.home-lion-right { float: right; margin: 5px 0 22px 30px; }
.home-lion-left { float: left; clear: both; margin: 5px 30px 22px 0; }
.home-lion a, .home-lion img { display: block; width: 100%; height: auto; border-radius: 8px; }
.home-lion a:focus-visible, .home-gallery a:focus-visible, .home-et a:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }
.home-et { width: min(520px, 100%); margin: 36px auto 0; text-align: center; }
.home-et a, .home-et img { display: block; width: 100%; height: auto; border-radius: 8px; }
.home-et figcaption { margin-top: 14px; font-size: 15px; font-weight: 800; line-height: 1.5; }
.home-page .home-gallery-section { padding-top: 44px; padding-bottom: 0; }
.home-gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: start; gap: 12px; }
.home-gallery-column { display: flex; flex-direction: column; min-width: 0; gap: 12px; }
.home-gallery-column > a, .home-gallery-column > a img { display: block; width: 100%; height: auto; }
.home-gallery-column > a img { border-radius: 2px; }
.home-diploma { width: 100%; max-width: 204px; margin: 10px auto 0; }
.home-diploma a, .home-diploma img { display: block; width: 100%; height: auto; }
@media (max-width: 760px) {
  .home-page .home-title { --letter-height: clamp(21px, 4vw, 30px); gap: 12px; margin-bottom: 20px; padding: 18px 16px; }
  .home-page .home-biography { padding-top: 28px; }
  .home-story { font-size: 16px; line-height: 1.75; }
  .home-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 10px; }
  .home-gallery-column { gap: 10px; }
}
/* Úvodní sekvence: nadpis se odkryje zleva doprava, karavana se rozjasní jako při východu slunce.
   E. T. se „přenese“ paprskem, až k němu návštěvník dojede (třídu is-shown přidává site.js). */
@media (prefers-reduced-motion: no-preference) {
  .home-title-flag { animation: home-flag .5s ease-out both; }
  .home-title-words img { animation: home-reveal .8s cubic-bezier(.6, 0, .2, 1) .15s both; }
  .home-title-words .home-title-name { animation-delay: .5s; }
  .home-hero .hero-banner { animation: home-sunrise 1.8s ease-out .2s both; }
}
@media screen and (prefers-reduced-motion: no-preference) {
  .js-motion .home-et img, .js-motion .home-et figcaption { opacity: 0; }
  .js-motion .home-et.is-shown img { animation: home-beam 1.1s ease-out both; }
  .js-motion .home-et.is-shown figcaption { animation: home-caption .5s ease-out .85s both; }
}
@keyframes home-flag { from { opacity: 0; transform: translateX(-14px); } }
@keyframes home-reveal { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0); } }
@keyframes home-sunrise { from { filter: brightness(.3) saturate(.4); } to { filter: none; } }
@keyframes home-beam {
  0% { opacity: 1; clip-path: inset(0 49% 0 49%); filter: brightness(3) saturate(0); }
  30% { opacity: .8; clip-path: inset(0); filter: brightness(2) saturate(.3); }
  42% { opacity: 1; }
  52% { opacity: .65; }
  100% { opacity: 1; clip-path: inset(0); filter: none; }
}
@keyframes home-caption { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (max-width: 520px) {
  .home-page .home-title { --letter-height: clamp(16px, 5vw, 25px); padding-right: 12px; padding-left: 12px; }
  .home-title-words { flex-direction: column; align-items: flex-start; gap: 7px; }
  .home-title-flag { height: 44px; }
  .home-portraits { margin-bottom: 28px; }
  .home-lion { float: none; clear: both; width: 100%; max-width: 380px; margin: 24px auto; }
  .home-et { margin-top: 28px; }
  .home-et figcaption { font-size: 13px; }
}