/* ============================================================
   MOBILE FIXES – responzivita / horizontální scroll
   2026-06-08
   Načítá se POSLEDNÍ (za style.css a style-seo-additions.css),
   takže přepíše odpovídající media-query pravidla.
   ------------------------------------------------------------
   PROČ: na úzkých telefonech (≤ ~386 px CSS šířky, tj. iPhone SE,
   většina Androidů 360 px) vznikal horizontální scroll.
   Příčina: .stats__inner zůstával 2sloupcový i pod 640 px –
   dlouhá slova ("VYROBENÝCH KUSŮ") se nezalomila, grid přetekl
   o ~41 px a roztáhl fixed .nav (right:0 → šířka přetékajícího
   dokumentu). Oprava příčiny = stats do 1 sloupce na telefonech.
   ============================================================ */

/* --- 1) STATS: jeden sloupec na telefonech (příčina h-scrollu) --- */
@media (max-width: 560px) {
  .stats__inner { grid-template-columns: 1fr; }
  /* zúžit vnitřní padding karet, ať číslo i popisek dýchají,
     ale nepřetékají na nejužších zařízeních (320 px) */
  .stat { padding: 18px 24px; }
  .stats { padding: 40px 22px; }
}

/* --- 2) HERO REVEAL přes CSS (LCP fix) -----------------------------
   Hero foto je LCP element. Dřív ho odhalovalo GSAP (opacity 0→1), což
   čekalo na GSAP CDN → ScrollTrigger → script.js (defer) → na mobilu se
   foto objevilo až ~6 s (LCP). GSAP hero reveal je vyřazen ve script.js;
   reveal teď řídí tato CSS animace, která běží OKAMŽITĚ při renderu
   (nezávislá na GSAP) → LCP ~2 s. Timing replikuje původní GSAP 1:1
   (power3.out ≈ ease-out-cubic, duration 0.55/0.7 s, stagger 0.06 s).
   Pojistka: animace má `both` fill → opacity skončí na 1 vždy (i kdyby
   GSAP CDN spadl). prefers-reduced-motion reveal vypne. -------------- */
@keyframes heroRevealUp    { from { opacity: 0; transform: translateY(50px); } to { opacity: 1; transform: translateY(0); } }
@keyframes heroRevealRight { from { opacity: 0; transform: translateX(70px); } to { opacity: 1; transform: translateX(0); } }

.hero .js-fade-up    { animation: heroRevealUp 0.55s cubic-bezier(0.215, 0.61, 0.355, 1) 0s both; }
.hero .js-fade-up.d1 { animation-delay: 0.06s; }
.hero .js-fade-up.d2 { animation-delay: 0.12s; }
.hero .js-fade-up.d3 { animation-delay: 0.18s; }
.hero .js-fade-up.d4 { animation-delay: 0.24s; }
.hero .js-fade-up.d5 { animation-delay: 0.30s; }
.hero .js-fade-right { animation: heroRevealRight 0.7s cubic-bezier(0.215, 0.61, 0.355, 1) 0.15s both; }

@media (prefers-reduced-motion: reduce) {
  .hero .js-fade-up, .hero .js-fade-right { animation: none !important; opacity: 1; transform: none; }
}