/* =====================================================================
   PutzMajster - Preloader stránky + řízené odkrytí obsahu
   Akcent: #D67E29 | Základ: #4A4B52 | Doplňky: #DFE1E3, #FEFEFE
   Font: Barlow (načítá style.css)

   Soubor je nezávislý na style.css - dá se kdykoliv odpojit bez následků.
   POZOR: obsah stránky se odkrývá POUZE přes opacity. Layout stojí na
   position: absolute, takže transform/filter na sekcích by přepsal
   containing block a rozházel pozicování.
   ===================================================================== */

/* ---------------------------------------------------------------------
   1) Stav načítání - zámek stránky
   Třídy pm-js + pm-loading nasazuje inline skript v hlavičce, takže
   bez JavaScriptu se nic neskryje a stránka funguje postaru.
   --------------------------------------------------------------------- */
html.pm-js.pm-loading,
html.pm-js.pm-loading body { overflow: hidden;}

/* ---------------------------------------------------------------------
   2) Odkrytí obsahu - kaskáda sekcí odshora dolů
   --------------------------------------------------------------------- */
html.pm-js #facebody { opacity: 1; transition: opacity 0.8s ease-out;}
html.pm-js.pm-loading #facebody { opacity: 0;}

html.pm-js #header-face,
html.pm-js #service-face,
html.pm-js .content-space,
html.pm-js #realizace-face,
html.pm-js #orderbox-face,
html.pm-js #maps-face,
html.pm-js #partners-face,
html.pm-js #bottom-face { opacity: 1; transition: opacity 0.9s ease-out;}

html.pm-js.pm-loading #header-face,
html.pm-js.pm-loading #service-face,
html.pm-js.pm-loading .content-space,
html.pm-js.pm-loading #realizace-face,
html.pm-js.pm-loading #orderbox-face,
html.pm-js.pm-loading #maps-face,
html.pm-js.pm-loading #partners-face,
html.pm-js.pm-loading #bottom-face { opacity: 0;}

html.pm-js #header-face    { transition-delay: 0.10s;}
html.pm-js #service-face   { transition-delay: 0.26s;}
html.pm-js .content-space  { transition-delay: 0.34s;}
html.pm-js #realizace-face { transition-delay: 0.42s;}
html.pm-js #orderbox-face  { transition-delay: 0.50s;}
html.pm-js #maps-face      { transition-delay: 0.58s;}
html.pm-js #partners-face  { transition-delay: 0.66s;}
html.pm-js #bottom-face    { transition-delay: 0.74s;}

/* ---------------------------------------------------------------------
   3) Vlastní preloader
   --------------------------------------------------------------------- */
#pm-preloader { display: none;}

html.pm-js #pm-preloader {
    position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9999;
    display: flex; align-items: center; justify-content: center;
    padding: 20px; box-sizing: border-box;
    text-align: center; font-family: 'Barlow', 'Segoe UI', Arial, sans-serif;
    color: #FEFEFE;
    background: #4A4B52;
    background: radial-gradient(ellipse at 50% 38%, #5C5D66 0%, #4A4B52 46%, #35363B 100%);
    opacity: 1; visibility: visible;
    transition: opacity 0.55s ease-in-out, visibility 0s linear 0.55s;
}

html.pm-js #pm-preloader.pm-preloader-done { opacity: 0; visibility: hidden;}

/* Obsahový blok */
/* fill-mode "backwards" (ne "both") - po doběhnutí se vrátí základní
   hodnoty, jinak by animace přebila výstupní transform. */
.pm-preloader-box {
    width: 100%; max-width: 460px; margin: 0;
    opacity: 1; transform: translateY(0);
    animation: pm-preloader-in 0.7s cubic-bezier(.22,.61,.36,1) backwards;
    transition: transform 0.55s ease-in-out, opacity 0.55s ease-in-out;
}
.pm-preloader-done .pm-preloader-box { transform: translateY(-26px); opacity: 0;}

@keyframes pm-preloader-in {
    from { opacity: 0; transform: translateY(18px);}
    to   { opacity: 1; transform: translateY(0);}
}

/* Kostka - navazuje na motiv cube.mini z celého webu */
.pm-preloader-cube {
    width: 18px; height: 18px; margin: 0 auto 32px auto;
    background: #D67E29;
    animation: pm-preloader-cube 2.4s ease-in-out infinite;
}

@keyframes pm-preloader-cube {
    0%   { transform: rotate(0deg) scale(1);      opacity: 1;}
    50%  { transform: rotate(180deg) scale(.62);  opacity: .5;}
    100% { transform: rotate(360deg) scale(1);    opacity: 1;}
}

/* Značka - typograficky, aby naskočila okamžitě bez čekání na obrázek */
.pm-preloader-logo {
    margin: 0 0 12px 0;
    font-size: 44px; font-size: clamp(28px, 7vw, 52px);
    line-height: 1; font-weight: 900; letter-spacing: 0.05em;
    color: #FEFEFE;
}
.pm-preloader-logo span { color: #D67E29;}

/* Claim ze sekce služeb */
.pm-preloader-claim {
    margin: 0 0 38px 0;
    font-size: 16px; font-size: clamp(13px, 2.6vw, 17px);
    font-weight: 300; letter-spacing: 0.16em; text-transform: uppercase;
    color: #DFE1E3; opacity: .75;
}

/* Ukazatel průběhu */
.pm-preloader-bar {
    width: 100%; height: 3px; margin: 0 0 14px 0;
    background: rgba(223,225,227,.22); overflow: hidden;
}
.pm-preloader-bar-fill {
    position: relative; width: 0; height: 100%;
    background: #D67E29; overflow: hidden;
}
/* Jemný přejezd světla - drží dojem aktivity i když se procenta nehnou */
.pm-preloader-bar-fill:after {
    content: ''; position: absolute; top: 0; left: 0; width: 40%; height: 100%;
    background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.55), rgba(255,255,255,0));
    animation: pm-preloader-sheen 1.6s ease-in-out infinite;
}

/* Procenta se počítají z šířky přejezdu, dráha tak sedí na jakkoliv
   dlouhý ukazatel. */
@keyframes pm-preloader-sheen {
    0%   { transform: translateX(-100%);}
    100% { transform: translateX(350%);}
}

/* Popisek + procenta */
.pm-preloader-meta {
    display: flex; align-items: baseline; justify-content: space-between;
    font-size: 13px; letter-spacing: 0.1em; text-transform: uppercase;
}
.pm-preloader-status { font-weight: 300; color: #DFE1E3; opacity: .7;}
.pm-preloader-value  { font-weight: 900; color: #D67E29; font-variant-numeric: tabular-nums;}

/* ---------------------------------------------------------------------
   4) Malé displeje
   --------------------------------------------------------------------- */
@media screen and (max-width: 479px) {
    .pm-preloader-cube  { width: 14px; height: 14px; margin-bottom: 24px;}
    .pm-preloader-claim { margin-bottom: 28px; letter-spacing: 0.12em;}
    .pm-preloader-meta  { font-size: 11px;}
}

/* ---------------------------------------------------------------------
   5) Omezený pohyb - bez animací, jen prolnutí
   --------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
    .pm-preloader-box,
    .pm-preloader-cube,
    .pm-preloader-bar-fill:after { animation: none;}
    .pm-preloader-bar-fill:after { display: none;}
    .pm-preloader-done .pm-preloader-box { transform: none;}

    html.pm-js #pm-preloader,
    html.pm-js #facebody,
    html.pm-js #header-face,
    html.pm-js #service-face,
    html.pm-js .content-space,
    html.pm-js #realizace-face,
    html.pm-js #orderbox-face,
    html.pm-js #maps-face,
    html.pm-js #partners-face,
    html.pm-js #bottom-face { transition-duration: 0.2s; transition-delay: 0s;}
}
