/* Preloader stránky - logotyp (znak + text) je sestaven stejně jako v hlavičce webu (zlatá #960, kurzíva Dancing Script, oddělovací linka) */

body.is-loading { overflow: hidden;}

#preloader {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 99999;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #000 url('../themes/top.back.fw.png') center no-repeat;
    background-size: cover;
    transition: opacity .7s ease, visibility .7s ease;
}

#preloader::before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: radial-gradient(farthest-corner at 50% 50%, rgba(153,102,0,.3), rgba(0,0,0,.88) 55%, #000 100%);
}

#preloader.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.preloader-inner {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    animation: preloader-rise .9s cubic-bezier(.22,1,.36,1) both;
}

/* Logotyp = znak kanceláře + text, tak jak je poskládaný v hlavičce webu */
.preloader-lockup {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Vlastní znak webu (logo.fw.png), s jemnou zlatou září jako indikátorem načítání */
.preloader-mark {
    width: 92px;
    height: 90px;
    position: relative;
    flex: none;
}

.preloader-mark::before {
    content: '';
    width: 140%;
    height: 140%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 100%;
    background: radial-gradient(closest-side, rgba(153,102,0,.55), rgba(153,102,0,0) 70%);
    animation: preloader-glow 2.4s ease-in-out infinite;
}

.preloader-logo {
    width: 100%;
    height: 100%;
    position: relative;
    background: url('../themes/logo.fw.png') center no-repeat;
    background-size: contain;
    animation: preloader-pulse 2.4s ease-in-out infinite;
}

/* Oddělovací linka mezi znakem a textem - stejný prvek jako .header-contain v hlavičce */
.preloader-divider {
    width: 1px;
    height: 62px;
    margin: 0 24px;
    flex: none;
    background: linear-gradient(180deg, rgba(153,102,0,0), rgba(153,102,0,.65), rgba(153,102,0,0));
}

/* Textová část loga, stejný jazyk jako nadpis v hero sekci webu */
.preloader-word {
    text-align: left;
    flex: none;
}

.preloader-brand {
    font-family: 'Dancing Script', cursive;
    font-weight: 700;
    font-size: 38px;
    line-height: 1;
    color: #d4a941;
    text-shadow: 0 0 18px rgba(153,102,0,.45);
    white-space: nowrap;
}

.preloader-sub {
    margin: 7px 0 0 0;
    font-family: 'Play', sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: rgba(239,239,239,.55);
    white-space: nowrap;
}

/* Tenká linka rozevírající se od středu pod logotypem, jako indikátor průběhu */
.preloader-line {
    width: 100%;
    height: 1px;
    margin: 24px 0 0 0;
    display: flex;
    justify-content: center;
}

.preloader-line::after {
    content: '';
    width: 46px;
    height: 1px;
    background: linear-gradient(90deg, rgba(153,102,0,0), #960, rgba(153,102,0,0));
    animation: preloader-line-grow 2.4s ease-in-out infinite;
}

@keyframes preloader-pulse {
    0%, 100% { opacity: .92; transform: scale(1);}
    50% { opacity: 1; transform: scale(1.05);}
}

@keyframes preloader-glow {
    0%, 100% { opacity: .5; transform: translate(-50%, -50%) scale(.9);}
    50% { opacity: 1; transform: translate(-50%, -50%) scale(1.1);}
}

@keyframes preloader-line-grow {
    0%, 100% { width: 20px; opacity: .5;}
    50% { width: 70px; opacity: 1;}
}

@keyframes preloader-rise {
    from { opacity: 0; transform: translateY(16px) scale(.97);}
    to { opacity: 1; transform: translateY(0) scale(1);}
}

@media screen and (max-width: 767px) {
    .preloader-mark { width: 72px; height: 70px;}
    .preloader-divider { height: 52px; margin: 0 16px;}
    .preloader-brand { font-size: 28px;}
    .preloader-sub { font-size: 10px; letter-spacing: 2px;}
}

@media screen and (max-width: 420px) {
    .preloader-lockup { flex-direction: column;}
    .preloader-mark { width: 80px; height: 78px;}
    .preloader-divider { width: 46px; height: 1px; margin: 14px 0; background: linear-gradient(90deg, rgba(153,102,0,0), rgba(153,102,0,.65), rgba(153,102,0,0));}
    .preloader-word { text-align: center;}
}

@media (prefers-reduced-motion: reduce) {
    .preloader-logo, .preloader-mark::before, .preloader-line::after, .preloader-inner { animation: none;}
}