@font-face {
    font-family: 'Clash Display';
    src: url('../fonts/ClashDisplay-Variable.woff2') format('woff2'),
         url('../fonts/ClashDisplay-Variable.woff') format('woff');
    font-weight: 200 700;
    font-display: swap;
    font-style: normal;
}

/* Zvětšení řádkování nadpisů */
h2 {
    line-height: 1.2 !important;
}

/* Stavy pro JS Navigaci */
#mainNav.is-minimal .nav-content-full { display: none; }
#mainNav.is-minimal .nav-content-minimal { display: flex; }
#mainNav.is-minimal > div { padding-left: 1.5rem; padding-right: 1.5rem; }

/* Stavy pro JS Reveal Text Animaci */
.reveal-text { overflow: hidden; display: inline-block; vertical-align: bottom; }
.reveal-word { display: inline-block; transform: translateY(110%); opacity: 0; transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1); }

/* Reveal reaguje na třídu .is-visible na rodiči */
.hero-content.is-visible .reveal-word { transform: translateY(0); opacity: 1; }

/* Stavy pro Modály */
.modal-overlay.is-active { opacity: 1; visibility: visible; }
.modal-overlay.is-active .modal-content { transform: translateY(0); }

/* --- OPRAVA MOBILNÍHO MENU --- */
body.menu-open #mainNav > div { 
    background-color: #FFFFFF !important; 
    border-color: rgba(0,0,0,0.1);
}
body.menu-open #mainNav img:not(#toggleIcon) { 
    filter: brightness(0); /* Logo zčerná */
}
body.menu-open #menuToggle { 
    background-color: #000000 !important; 
}
body.menu-open #toggleIcon { 
    filter: brightness(0) invert(1) !important; /* Křížek bude zářivě bílý na černém buttonu */
    opacity: 1 !important;
    display: block !important;
}

/* --- MASKOT (PES) STYLING --- */
.dog-container {
    position: fixed;
    bottom: 0;
    left: 2vw;
    z-index: 1; 
    pointer-events: none;
    transition: transform 1s cubic-bezier(0.16, 1, 0.3, 1);
    width: clamp(280px, 25vw, 550px);
    transform: translateY(100%);
    display: flex;
    justify-content: center;
}

.dog-image {
    width: 100%;
    height: auto;
    object-fit: contain;
}

.dog-container.is-loaded {
    transform: translateY(2%);
}

.dog-container.is-scrolled {
    transform: translateY(100%);
}

@media (max-width: 1024px) {
    .dog-container {
        left: 50%;
        transform: translateX(-50%) translateY(100%);
    }
    .dog-container.is-loaded {
        transform: translateX(-50%) translateY(5%);
    }
    .dog-container.is-scrolled {
        transform: translateX(-50%) translateY(100%);
    }
}

/* --- INTRO ANIMACE (RONIN STYLE) --- */
#intro-loader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000000;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10000;
    transition: transform 0.8s cubic-bezier(0.85, 0, 0.15, 1);
    overflow: hidden;
}

.intro-logo {
    width: clamp(160px, 25vw, 320px);
    opacity: 0;
    transform: scale(0.95);
    filter: brightness(0) invert(1);
    animation: logoIn 1.2s ease-out forwards 0.4s;
}

body.is-loading {
    overflow: hidden;
}

@keyframes logoIn {
    0% { opacity: 0; transform: scale(0.95); }
    100% { opacity: 1; transform: scale(1); }
}

/* --- ANIMOVANÉ POZADÍ HERO SEKCE (ZNATELNĚJŠÍ POHYB) --- */
#onas {
    background: #003DFE; /* Brand modrá jako základ */
    position: relative;
    overflow: hidden;
}

#onas::after {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    right: -50%;
    bottom: -50%;
    /* Více vrstev s různými odstíny modré a vyšším kontrastem */
    background: 
        radial-gradient(circle at 30% 30%, rgba(100, 180, 255, 0.4) 0%, transparent 40%),
        radial-gradient(circle at 70% 70%, rgba(0, 20, 150, 0.5) 0%, transparent 40%),
        radial-gradient(circle at 50% 40%, rgba(231, 255, 7, 0.05) 0%, transparent 30%); /* Velmi jemný záblesk accent žluté */
    
    filter: blur(40px); /* Sníženo pro jasnější tvary */
    z-index: 0;
    /* Dynamičtější animace s rotací a posunem */
    animation: digitalAtmosphere 12s ease-in-out infinite alternate;
    pointer-events: none;
}

@keyframes digitalAtmosphere {
    0% { transform: translate(-5%, -5%) rotate(0deg) scale(1); }
    50% { transform: translate(10%, 5%) rotate(5deg) scale(1.1); }
    100% { transform: translate(-10%, 10%) rotate(-5deg) scale(0.9); }
}

.hero-content {
    z-index: 2;
}