/* ========================================================= AUTO CENTAR BIMMER — intro.css Cinematic intro s JEDNOM slikom: intro-lights.png. Farovi blicnu 2× (samo opacity/brightness/drop-shadow), zatim elegantan fade u stranicu. Samo naslovnica, jednom po sesiji. Prikazuje se ISKLJUČIVO kad inline head-skripta doda .intro-active na (no-JS / reduced motion → intro se ne prikazuje). ========================================================= */ #intro { display: none; } html.intro-active { overflow: hidden; } html.intro-active #intro { display: block; position: fixed; inset: 0; width: 100vw; height: 100vh; z-index: 10000; overflow: hidden; background: #000; /* ista crna kao pozadina slike → bez vidljivog ruba */ /* Brz prijelaz: dva bljeska pa kratak fade — overlay nestaje na ~1.43s */ animation: introOut .38s var(--ease, ease) 1.05s forwards; } /* ---- Jedina slika: cijela vidljiva, centrirana, bez rezanja ---- */ .intro-lights { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: center; opacity: .7; filter: brightness(1); will-change: opacity, filter; animation: introLights 1.05s var(--ease, ease) forwards; } /* Blink 2× — kao paljenje LED farova (samo svjetlina + mali halo) */ @keyframes introLights { 0% { opacity: .7; filter: brightness(1); } 8% { opacity: .7; filter: brightness(1); } /* kratka tama */ 20% { opacity: 1; filter: brightness(2.2) drop-shadow(0 0 6px rgba(225,238,255,.55)); } /* blink 1 */ 32% { opacity: .7; filter: brightness(1); } /* spušta */ 42% { opacity: .7; filter: brightness(1); } /* kratka pauza */ 54% { opacity: 1; filter: brightness(2.4) drop-shadow(0 0 7px rgba(212,232,255,.6)); } /* blink 2 */ 68% { opacity: .75; filter: brightness(1.05); } /* natrag na normalu */ 100% { opacity: .75; filter: brightness(1.05); } } /* ---- Elegantan izlaz cijelog overlaya ---- */ @keyframes introOut { 0% { opacity: 1; } 100% { opacity: 0; visibility: hidden; } } /* ---- Reduced motion: bez introa, bez blokade scrolla ---- */ @media (prefers-reduced-motion: reduce) { html.intro-active { overflow: auto; } html.intro-active #intro { display: none; } }