/* ===== Extracted from nastupi.html: original-inline-style-1 ===== */
:root{--green:#0E2619;--green-light:#173826;--cream:#EEEBD8;--yellow:#F4DC3C;--white:#fff}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--green);font-family:'IBM Plex Sans',system-ui,sans-serif;font-size:17px;line-height:1.6}
a{color:inherit}
a:focus-visible{outline:3px solid var(--yellow);outline-offset:4px}
.site-head{position:sticky;top:0;z-index:1200;background:rgba(14,38,25,.96);color:var(--cream);border-bottom:1px solid #2E4C39;backdrop-filter:none}
.head-inner{max-width:1360px;margin:0 auto;padding:18px 32px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.logo{font-family:'Big Shoulders Display',sans-serif;font-weight:900;font-size:clamp(25px,3vw,34px);line-height:1;text-transform:uppercase;text-decoration:none;color:var(--yellow);letter-spacing:.01em}
.back-link{font-family:'IBM Plex Mono',monospace;font-size:13px;text-transform:uppercase;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:4px}
main{max-width:1200px;margin:0 auto;padding:78px 32px 104px}
.eyebrow{font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;margin:0 0 16px}
h1{font-family:'Big Shoulders Display',sans-serif;font-size:clamp(66px,11vw,138px);font-weight:900;line-height:.82;letter-spacing:-.015em;text-transform:uppercase;margin:0;max-width:950px}
.intro{font-size:18px;max-width:60ch;margin:28px 0 0}
.status{margin:34px 0 12px;font-family:'IBM Plex Mono',monospace;font-size:12px;line-height:1.5;text-transform:uppercase;letter-spacing:.035em;color:#536454}
.events{border-top:2px solid var(--green)}
.event-row{display:grid;grid-template-columns:150px 86px minmax(0,1fr) auto;align-items:center;gap:24px;padding:25px 0;border-bottom:1px dashed #617061}
.event-poster{width:86px;aspect-ratio:3/4;background:var(--green);border:2px solid var(--green);overflow:hidden;display:flex;align-items:center;justify-content:center}
.event-poster img{display:block;width:100%;height:100%;object-fit:cover}.event-poster.poster-placeholder{background:var(--green);color:var(--yellow);font-family:'Big Shoulders Display',sans-serif;font-size:19px;font-weight:900;line-height:.9;text-align:center;white-space:pre-line;letter-spacing:.03em;padding:6px}
.event-date{font-family:'Big Shoulders Display',sans-serif;font-size:clamp(28px,4vw,40px);font-weight:800;line-height:.95;white-space:nowrap}
.event-info{min-width:0;display:flex;flex-direction:column;gap:2px}
.event-city{font-family:'IBM Plex Mono',monospace;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;margin:0}
.event-venue{margin:0;font-size:17px}
.event-show{margin:6px 0 0;font-size:17px}
.event-cta{min-width:128px;min-height:46px;padding:0 16px;display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--green);color:var(--yellow);font-family:'IBM Plex Mono',monospace;font-size:12px;font-weight:600;text-transform:uppercase;text-decoration:none;text-align:center;border:1px solid var(--green);transition:background .15s,color .15s}
.event-cta:hover{background:var(--yellow);color:var(--green)}
.empty{padding:30px 0;border-bottom:1px dashed #617061}
.bottom-link{display:inline-flex;align-items:center;gap:10px;margin-top:38px;font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:600;text-transform:uppercase;text-underline-offset:5px}
footer{background:var(--green);color:var(--cream);padding:24px 32px;font-family:'IBM Plex Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:.04em}
.footer-inner{max-width:1200px;margin:0 auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.booking-float{position:fixed;right:clamp(12px,2vw,28px);bottom:clamp(14px,2vw,28px);z-index:999;width:205px;min-height:108px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:12px 12px 10px;text-align:center;text-decoration:none!important;color:#F4DC3C;background:#0E2619;border:3px solid #EEEBD8;outline:1px solid #0E2619;box-shadow:6px 6px 0 #F4DC3C,10px 10px 0 rgba(0,0,0,.18);transform:rotate(-4deg);transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .25s;isolation:isolate}
.booking-float:before{content:"";position:absolute;inset:5px;border:1px solid #EEEBD8;pointer-events:none;z-index:0}.booking-float>*{position:relative;z-index:1}.booking-float:hover{box-shadow:3px 3px 0 #F4DC3C,6px 6px 0 rgba(0,0,0,.18);transform:rotate(3deg) scale(1.035)}
.booking-sticker-tags{display:flex;align-items:center;justify-content:center;gap:5px;width:100%}.booking-sticker-tags span{display:inline-flex;align-items:center;justify-content:center;min-height:21px;padding:1px 5px;border:1px solid #EEEBD8;font-family:'Big Shoulders Display',sans-serif;font-size:14px;line-height:1;font-weight:900;letter-spacing:.015em;box-shadow:2px 2px 0 rgba(0,0,0,.3)}.booking-sticker-tags span:nth-child(1){background:#F4DC3C;color:#0E2619;transform:rotate(-5deg)}.booking-sticker-tags span:nth-child(2){background:#EEEBD8;color:#0E2619;transform:rotate(3deg)}.booking-sticker-tags span:nth-child(3){background:#173826;color:#F4DC3C;transform:rotate(-2deg)}.booking-sticker-label{font-family:'Big Shoulders Display',sans-serif;font-size:clamp(22px,2vw,30px);line-height:.88;font-weight:900;text-transform:uppercase;letter-spacing:-.035em;max-width:100%;overflow-wrap:anywhere;text-shadow:1px 1px 0 #173826}.booking-sticker-arrow{position:absolute;right:11px;bottom:5px;font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:900;color:#EEEBD8}.booking-float.tilt-a{transform:rotate(-4deg)}.booking-float.tilt-b{transform:rotate(3deg)}.booking-float.tilt-c{transform:rotate(-1deg) scale(.98)}
@media(max-width:700px){
.head-inner{padding:15px 16px;align-items:center;gap:12px}.logo{font-size:27px}.back-link{margin-top:0;font-size:10px;line-height:1.3;max-width:52%;text-align:right}
main{padding:38px 16px 88px}.eyebrow{font-size:11px;margin-bottom:12px}h1{font-size:clamp(56px,15vw,82px);line-height:.82}.intro{font-size:16px;line-height:1.45;margin-top:20px}.status{margin:24px 0 12px;font-size:10px;line-height:1.45}
.event-row{grid-template-columns:78px minmax(0,1fr);grid-template-areas:"poster date" "poster info" "poster cta";align-items:start;gap:5px 13px;padding:21px 0;min-width:0}
.event-date{grid-area:date;font-size:clamp(27px,7.8vw,34px);line-height:.95;white-space:normal;overflow-wrap:normal;min-width:0}
.event-poster{grid-area:poster;width:78px;max-width:100%;aspect-ratio:3/4;align-self:start;border-width:1px;margin-top:2px}
.event-info{grid-area:info;grid-column:auto;grid-row:auto;min-width:0;gap:3px}.event-city{font-size:10px;letter-spacing:.04em}.event-venue{font-size:15px;line-height:1.3}.event-show{font-size:15px;line-height:1.25;margin-top:4px;overflow-wrap:anywhere}
.event-cta{grid-area:cta;grid-column:auto;grid-row:auto;justify-self:start;min-width:130px;min-height:40px;margin-top:4px;padding:0 13px;font-size:11px}
.booking-float{right:10px;bottom:max(10px,env(safe-area-inset-bottom));width:min(164px,49vw);min-height:60px;padding:8px;border-width:2px;box-shadow:4px 4px 0 #F4DC3C}.booking-sticker-label{font-size:clamp(17px,4.8vw,22px)}footer{padding:20px 16px}
}
@media(max-width:360px){.event-row{grid-template-columns:66px minmax(0,1fr);column-gap:10px}.event-poster{width:66px}.event-date{font-size:27px}.event-venue,.event-show{font-size:14px}.event-cta{min-width:118px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
/* Shared booking CTA treatment */
.booking-float{position:fixed;right:clamp(12px,2vw,28px);bottom:clamp(14px,2vw,28px);z-index:999;width:248px;min-height:76px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;padding:12px 15px;text-align:center;text-decoration:none!important;border:3px solid #EEEBD8;outline:0;box-shadow:5px 5px 0 rgba(14,38,25,.85);isolation:isolate;gap:0;transition:background-color .35s,color .35s,transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .25s}
.booking-float:before{content:"";position:absolute;inset:5px;border:1px solid #EEEBD8;pointer-events:none;z-index:0}
.booking-float>*{position:relative;z-index:1}
.booking-float .booking-sticker-tags,.booking-float .booking-sticker-arrow{display:none!important}
.booking-sticker-label{display:block;width:100%;font-family:'Big Shoulders Display',sans-serif;font-size:clamp(22px,2.2vw,30px);font-weight:900;line-height:.95;letter-spacing:.025em;text-transform:uppercase;text-shadow:none}
.booking-float.color-a{background:#0E2619;color:#F4DC3C}.booking-float.color-b{background:#F4DC3C;color:#0E2619}.booking-float.color-c{background:#EEEBD8;color:#0E2619}
.booking-float.color-a:before,.booking-float.color-b:before,.booking-float.color-c:before{border-color:#EEEBD8}
.booking-float.tilt-a{transform:rotate(-3deg)}.booking-float.tilt-b{transform:rotate(2.8deg)}.booking-float.tilt-c{transform:rotate(-1deg) scale(.98)}
.booking-float:hover{box-shadow:3px 3px 0 rgba(14,38,25,.9);transform:rotate(0) scale(1.035)}
@media(max-width:760px){.booking-float{right:12px;bottom:max(12px,env(safe-area-inset-bottom));width:min(190px,53vw);min-height:62px;padding:10px 12px;border-width:2px;box-shadow:4px 4px 0 rgba(14,38,25,.9)}.booking-float:before{inset:4px}.booking-sticker-label{font-size:clamp(18px,5vw,24px)}}
@media(prefers-reduced-motion:reduce){.booking-float{transition:none!important}}
/* Punk booking badge — instant, rough cuts rather than smooth animation. */
.booking-float{border:3px solid #EEEBD8!important;border-radius:0!important;box-shadow:6px 6px 0 #F4DC3C,-3px -3px 0 #EEEBD8!important;transition:none!important;clip-path:polygon(0 3%,97% 0,100% 94%,3% 100%)!important}
.booking-float.color-a{background:#0E2619!important;color:#F4DC3C!important}.booking-float.color-c{background:#0E2619!important;color:#EEEBD8!important}.booking-float.color-b{background:#F4DC3C!important;color:#0E2619!important}
.booking-float.tilt-a{transform:rotate(-3.2deg)!important}.booking-float.tilt-b{transform:rotate(3.5deg) translate(1px,-1px)!important}.booking-float.tilt-c{transform:rotate(-1.7deg) translate(-1px,1px)!important}
.booking-float:hover{transition:none!important;transform:rotate(1deg) translate(-2px,-2px)!important}
@media(prefers-reduced-motion:reduce){.booking-float{transition:none!important}}
/* Shared page footer, viewport overflow protection and punk booking sticker. */
html,body{width:100%;max-width:100%;overflow-x:clip}
x-dc{display:block;width:100%;max-width:100%;overflow-x:clip}
.site-footer{background:#0E2619;color:#EEEBD8;border-top:1px solid #2E4C39;padding:26px clamp(18px,3vw,40px) max(104px,8vw);box-sizing:border-box;font:11px/1.5 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.04em}
.site-footer-inner{width:100%;max-width:1360px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:18px}
.site-footer-inner>a:last-child{justify-self:end}
.site-footer a{color:#F4DC3C;text-underline-offset:4px}
.site-footer span{text-align:center}
.booking-float{position:fixed!important;right:clamp(14px,2.1vw,32px)!important;bottom:clamp(18px,2.3vw,34px)!important;z-index:9999!important;box-sizing:border-box!important;width:clamp(210px,13.5vw,270px)!important;min-height:82px!important;padding:14px 16px!important;display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;text-decoration:none!important;color:#F4DC3C;background:#0E2619;border:5px solid #EEEBD8!important;border-radius:0!important;outline:0!important;box-shadow:8px 8px 0 #F4DC3C!important;clip-path:polygon(0 2%,98% 0,100% 96%,2% 100%)!important;transform:rotate(-2.4deg);transition:none!important;animation:booking-sticker-colors 6.6s steps(1,end) infinite!important;isolation:isolate}
.booking-float:before{content:none!important;display:none!important}
.booking-float .booking-rotator{display:grid!important;place-items:center;width:100%;min-height:46px;font:900 clamp(22px,2.2vw,32px)/.92 'Big Shoulders Display',sans-serif;letter-spacing:-.015em;text-transform:uppercase}
.booking-rotator>span{grid-area:1/1;max-width:100%;overflow-wrap:anywhere;opacity:0}
.booking-rotator>span:nth-child(1){animation:booking-text-a 6.6s steps(1,end) infinite}
.booking-rotator>span:nth-child(2){animation:booking-text-b 6.6s steps(1,end) infinite}
.booking-rotator>span:nth-child(3){animation:booking-text-c 6.6s steps(1,end) infinite}
@keyframes booking-sticker-colors{0%,33.25%{background:#0E2619;color:#F4DC3C;transform:rotate(-2.4deg)}33.3%,66.55%{background:#F4DC3C;color:#0E2619;transform:rotate(2.7deg)}66.6%,100%{background:#0E2619;color:#EEEBD8;transform:rotate(-1.1deg)}}
@keyframes booking-text-a{0%,33.25%{opacity:1}33.3%,100%{opacity:0}}
@keyframes booking-text-b{0%,33.25%{opacity:0}33.3%,66.55%{opacity:1}66.6%,100%{opacity:0}}
@keyframes booking-text-c{0%,66.55%{opacity:0}66.6%,100%{opacity:1}}
.booking-float:hover{box-shadow:10px 10px 0 #F4DC3C!important}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.home-events-table{width:100%;min-width:0;font:15px/1.45 'IBM Plex Mono',monospace}
.home-events-head,.home-events-row{display:grid;grid-template-columns:minmax(100px,.85fr) minmax(76px,.65fr) minmax(130px,1.1fr) minmax(150px,1.35fr) minmax(116px,auto);gap:16px;align-items:center;min-width:0}
.home-events-head{padding-bottom:12px;border-bottom:2px solid #0E2619;font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.home-events-row{padding:18px 0;border-bottom:1px dashed #0E2619}
.home-event-date{font:800 30px/1 'Big Shoulders Display',sans-serif;white-space:nowrap}
.home-event-ticket{justify-self:end;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;background:#0E2619;color:#F4DC3C;font-weight:600;font-size:12px;text-transform:uppercase;text-decoration:none;white-space:nowrap}
.home-event-ticket:hover{background:#F4DC3C;color:#0E2619}
#kontakt>div{padding-bottom:clamp(120px,10vw,150px)!important}
@media(max-width:820px){.home-events-head{display:none}.home-events-row{grid-template-columns:minmax(80px,96px) minmax(0,1fr);grid-template-areas:'date venue' 'date show' '. action';gap:4px 12px;align-items:start;padding:18px 0}.home-event-date{grid-area:date;white-space:normal;font-size:clamp(27px,7vw,34px);overflow-wrap:normal}.home-event-city{display:none}.home-event-venue{grid-area:venue;min-width:0;overflow-wrap:anywhere;font-size:14px}.home-event-show{grid-area:show;min-width:0;overflow-wrap:anywhere;font-size:14px}.home-event-ticket{grid-area:action;justify-self:start;min-height:38px;margin-top:8px;padding:0 14px;font-size:11px}.site-footer{padding:22px 18px max(112px,24vw)}.site-footer-inner{grid-template-columns:minmax(0,1fr);gap:8px}.site-footer-inner>*{justify-self:start!important;text-align:left!important}.site-footer span{text-align:left}}
@media(max-width:420px){.booking-float{right:11px!important;bottom:max(12px,env(safe-area-inset-bottom))!important;width:min(190px,55vw)!important;min-height:66px!important;padding:10px 12px!important;border-width:4px!important;box-shadow:6px 6px 0 #F4DC3C!important}.booking-float .booking-rotator{font-size:clamp(20px,5.6vw,25px)}}
@media(prefers-reduced-motion:reduce){.booking-float,.booking-rotator>span{animation:none!important}.booking-rotator>span{opacity:0}.booking-rotator>span:first-child{opacity:1}}
/* Final viewport overflow safeguard: prevent a 100vw breakout from adding a page scrollbar. */
html, body { width:100%; max-width:100%; overflow-x:hidden !important; }
body { margin-right:0; }
img, canvas, video, iframe { max-width:100%; }
/* Shared sticky navigation and fixed bottom booking bar. */
html,body{max-width:100%;overflow-x:clip}
body{padding-bottom:calc(74px + env(safe-area-inset-bottom))!important}
.site-head,.bio-header{position:sticky!important;top:0!important;z-index:1200!important;backdrop-filter:none}
.site-bottom-bar{position:fixed;left:0;right:0;bottom:0;z-index:2500;display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,auto) minmax(0,1fr);align-items:center;gap:clamp(10px,2vw,28px);padding:9px clamp(14px,2.2vw,32px) calc(9px + env(safe-area-inset-bottom));min-height:70px;box-sizing:border-box;background:#F4DC3C;color:#0E2619;border-top:3px solid #EEEBD8;box-shadow:0 -4px 0 #0E2619;font-family:'IBM Plex Mono',monospace;text-transform:uppercase}
.bottom-bar-socials{min-width:0;display:flex;align-items:center;gap:clamp(5px,.8vw,12px)}
.bottom-social-icon{width:27px;height:27px;display:inline-flex;align-items:center;justify-content:center;color:#0E2619;text-decoration:none;border:2px solid transparent;flex:none}
.bottom-social-icon svg{width:21px;height:21px;display:block}
.bottom-social-icon:hover{border-color:#0E2619;background:#EEEBD8}
.bottom-game-link{display:inline-flex;align-items:center;gap:5px;text-decoration:none;color:#0E2619;font-size:10px;font-weight:700;white-space:nowrap;padding:4px 7px;border:1px solid rgba(14,38,25,.35)}
.bottom-game-link img{width:22px;height:22px;object-fit:contain;display:block}
.bottom-game-link:hover{background:#0E2619;color:#F4DC3C}
.bottom-bar-booking{justify-self:center;display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:48px;padding:0 clamp(16px,2vw,28px);border:3px solid #EEEBD8;background:#0E2619;color:#F4DC3C;text-decoration:none;font:900 clamp(18px,1.9vw,26px)/1 'Big Shoulders Display',sans-serif;letter-spacing:.02em;white-space:nowrap;box-shadow:5px 5px 0 #0E2619}
.bottom-bar-booking:hover{background:#EEEBD8;color:#0E2619;box-shadow:3px 3px 0 #0E2619;transform:translate(2px,2px)}
.bottom-bar-copyright{justify-self:end;text-align:right;font-size:10px;font-weight:600;letter-spacing:.04em;white-space:nowrap}
@media(max-width:760px){body{padding-bottom:calc(102px + env(safe-area-inset-bottom))!important}.site-bottom-bar{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:'social copyright' 'booking booking';gap:6px 10px;padding:6px 10px calc(8px + env(safe-area-inset-bottom));min-height:96px}.bottom-bar-socials{grid-area:social;gap:3px;flex-wrap:nowrap}.bottom-social-icon{width:24px;height:24px}.bottom-social-icon svg{width:18px;height:18px}.bottom-game-link{padding:2px 4px;gap:3px;font-size:9px}.bottom-game-link img{width:19px;height:19px}.bottom-bar-booking{grid-area:booking;width:100%;min-height:40px;box-sizing:border-box;font-size:19px;box-shadow:3px 3px 0 #0E2619}.bottom-bar-copyright{grid-area:copyright;font-size:8px;white-space:normal;max-width:112px;line-height:1.25}}
@media(max-width:380px){.bottom-game-link span{display:none}.bottom-bar-copyright{max-width:84px}.bottom-bar-booking{font-size:17px}}
@media(prefers-reduced-motion:reduce){.bottom-bar-booking{transition:none!important}}
.site-footer{display:none!important}
/* Mobile event list spacing and poster/image safety. */
#events,.events-list,.event-list{max-width:100%;min-width:0;box-sizing:border-box}
.event-row,.event-card{min-width:0;max-width:100%}
@media(max-width:520px){.event-row{padding:17px 0!important;gap:8px!important}.event-poster{width:100%!important;max-width:100%!important}.event-row img{max-width:100%}}
/* Shared navigation: the yellow bar stays at the viewport bottom on every page. */
html,body{width:100%;max-width:100%;overflow-x:clip!important}
.site-head,.bio-header{position:sticky!important;top:0!important;z-index:2400!important;backdrop-filter:none}
.site-bottom-bar{position:fixed!important;left:0!important;right:0!important;bottom:0!important;z-index:2500!important;display:grid!important;grid-template-columns:minmax(0,1fr) minmax(220px,auto) minmax(0,1fr)!important;align-items:center!important;gap:clamp(10px,2vw,28px)!important;padding:9px clamp(14px,2.2vw,32px) calc(9px + env(safe-area-inset-bottom))!important;min-height:70px!important;box-sizing:border-box!important;background:#F4DC3C!important;color:#0E2619!important;border-top:3px solid #EEEBD8!important;box-shadow:0 -4px 0 #0E2619!important}
.bottom-bar-booking{justify-self:center!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;min-height:48px!important;padding:0 clamp(16px,2vw,28px)!important;box-sizing:border-box!important;border:4px solid #EEEBD8!important;outline:0!important;background:#F4DC3C!important;color:#0E2619!important;text-decoration:none!important;font:900 clamp(18px,1.9vw,26px)/1 'Big Shoulders Display',sans-serif!important;letter-spacing:.02em!important;white-space:nowrap!important;box-shadow:5px 5px 0 #0E2619!important;transition:none!important;transform:none!important}
.bottom-bar-booking::before,.bottom-bar-booking::after{content:none!important;display:none!important}
.bottom-bar-booking:hover{background:#EEEBD8!important;color:#0E2619!important;box-shadow:3px 3px 0 #0E2619!important;transform:translate(2px,2px)!important}
.bottom-bar-socials{min-width:0!important;display:flex!important;align-items:center!important;gap:clamp(4px,.8vw,10px)!important}
.bottom-social-icon{flex:none!important;width:28px!important;height:28px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;color:#0E2619!important;text-decoration:none!important;border:0!important;background:transparent!important}
.bottom-social-icon svg{width:22px!important;height:22px!important;display:block!important}
.bottom-social-icon:hover{color:#0E2619!important;background:#EEEBD8!important}
.bottom-game-link{display:inline-flex!important;align-items:center!important;gap:5px!important;padding:3px 5px!important;border:0!important;background:transparent!important;color:#0E2619!important;font-size:10px!important;font-weight:800!important;white-space:nowrap!important;text-decoration:none!important}
.bottom-game-link img{width:22px!important;height:22px!important;object-fit:contain!important;display:block!important}
.bottom-game-link:hover{background:#EEEBD8!important;color:#0E2619!important}
.bottom-bar-copyright{justify-self:end!important;text-align:right!important;color:#0E2619!important;font-size:10px!important;font-weight:700!important;letter-spacing:.02em!important;white-space:nowrap!important}
/* Punk booking sticker: one thick white frame, no inner frame, abrupt print-like changes. */
.booking-float{position:fixed!important;right:clamp(14px,2vw,28px)!important;bottom:calc(88px + env(safe-area-inset-bottom))!important;z-index:2400!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;width:min(242px,calc(100vw - 36px))!important;min-height:72px!important;box-sizing:border-box!important;padding:10px 12px!important;text-align:center!important;text-decoration:none!important;border:5px solid #EEEBD8!important;outline:0!important;box-shadow:6px 6px 0 #F4DC3C!important;background:#0E2619!important;color:#F4DC3C!important;clip-path:polygon(0 4%,98% 0,100% 95%,2% 100%)!important;transform:rotate(-2deg)!important;transition:none!important;animation:booking-sticker-colors-fast 5.4s steps(1,end) infinite!important}
.booking-float::before,.booking-float::after{content:none!important;display:none!important}
.booking-float:hover{transform:rotate(2deg)!important;box-shadow:4px 4px 0 #0E2619!important}
.booking-float .booking-rotator{display:grid!important;place-items:center!important;width:100%!important;min-height:46px!important;font:900 clamp(20px,2.3vw,30px)/.92 'Big Shoulders Display',sans-serif!important;letter-spacing:-.015em!important;text-transform:uppercase!important}
.booking-rotator>span{grid-area:1/1!important;max-width:100%!important;overflow-wrap:anywhere!important;opacity:0}
.booking-rotator>span:nth-child(1){animation:booking-text-fast-a 5.4s steps(1,end) infinite!important}
.booking-rotator>span:nth-child(2){animation:booking-text-fast-b 5.4s steps(1,end) infinite!important}
.booking-rotator>span:nth-child(3){animation:booking-text-fast-c 5.4s steps(1,end) infinite!important}
@keyframes booking-sticker-colors-fast{0%,33.25%{background:#0E2619;color:#F4DC3C;transform:rotate(-2.4deg)}33.3%,66.55%{background:#F4DC3C;color:#0E2619;transform:rotate(2.7deg)}66.6%,100%{background:#0E2619;color:#EEEBD8;transform:rotate(-1.1deg)}}
@keyframes booking-text-fast-a{0%,33.25%{opacity:1}33.3%,100%{opacity:0}}
@keyframes booking-text-fast-b{0%,33.25%{opacity:0}33.3%,66.55%{opacity:1}66.6%,100%{opacity:0}}
@keyframes booking-text-fast-c{0%,66.55%{opacity:0}66.6%,100%{opacity:1}}
/* Posters fill their slots without green/cream letterboxing; button baselines stay aligned. */
#solo .solo-show-grid>article{height:100%!important;min-width:0!important;display:flex!important;flex-direction:column!important;align-items:stretch!important}
#solo .solo-show-grid>article>.card{display:block!important;width:100%!important;aspect-ratio:4/5!important;height:auto!important;min-width:0!important;padding:0!important;overflow:hidden!important;background:transparent!important;border:0!important;box-shadow:none!important;line-height:0!important}
#solo .solo-show-grid>article>.card img{display:block!important;width:100%!important;height:100%!important;aspect-ratio:auto!important;object-fit:cover!important;object-position:center!important;background:transparent!important;border:0!important}
#solo .solo-show-grid>article>h3{min-height:2em!important}
#solo .solo-show-grid>article>p{min-height:3.4em!important}
#solo .solo-show-grid>article>div:last-child{margin-top:auto!important;min-height:42px!important;display:flex!important;align-items:flex-end!important}
.info-btn{display:inline-flex!important;justify-content:center!important;align-items:center!important;gap:12px!important;min-width:92px!important;width:92px!important;min-height:42px!important;height:42px!important;padding:0 12px!important;box-sizing:border-box!important;background:transparent!important;border:1px solid #EEEBD8!important;color:#EEEBD8!important;font:700 12px 'IBM Plex Mono',monospace!important;text-transform:uppercase!important;white-space:nowrap!important;cursor:pointer!important}
.info-btn:hover{background:#F4DC3C!important;color:#0E2619!important;border-color:#F4DC3C!important}
#projekti .rail .card{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:12px!important;padding:0!important;overflow:hidden!important;background:#173826!important;min-width:0!important}
#projekti .rail .card>img{display:block!important;width:100%!important;height:auto!important;aspect-ratio:4/5!important;object-fit:cover!important;object-position:center!important;background:transparent!important;border:0!important}
#projekti .rail .card>span{margin-left:16px!important;margin-right:16px!important}
#projekti .rail .card>span:last-child{margin-bottom:16px!important}
#projekti .rail-arrow{cursor:pointer!important;touch-action:manipulation!important}
/* Simple empty/filled circular carousel indicators. */
.carousel-dots{display:flex!important;align-items:center!important;justify-content:center!important;gap:9px!important;min-height:16px!important;padding:12px 0 0!important}
.carousel-dot{appearance:none!important;width:9px!important;height:9px!important;min-width:9px!important;min-height:9px!important;padding:0!important;border:1.5px solid #EEEBD8!important;border-radius:50%!important;background:transparent!important;box-shadow:none!important;transition:none!important;cursor:pointer!important}
.carousel-dot[aria-current="true"]{width:9px!important;height:9px!important;border-color:#F4DC3C!important;border-radius:50%!important;background:#F4DC3C!important}
#nastupi,.events-list,.event-list,.home-events-table{width:100%;max-width:100%;min-width:0;box-sizing:border-box}
.home-events-row{min-width:0;max-width:100%;box-sizing:border-box}
.event-poster{background:transparent!important;border:0!important;padding:0!important;overflow:hidden!important}
.event-poster img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;border:0!important;padding:0!important;background:transparent!important}
/* Prevent the yellow contact band and galleries from bleeding past their content gutters. */
#kontakt{width:100%;max-width:100%;overflow:hidden!important;box-sizing:border-box}
#kontakt>div,#projekti>div,#shop>div{width:100%;max-width:1360px;box-sizing:border-box;padding-left:clamp(18px,4vw,44px)!important;padding-right:clamp(18px,4vw,44px)!important;margin-left:auto!important;margin-right:auto!important}
#kontakt>div{padding-top:clamp(54px,7vw,104px)!important;padding-bottom:calc(116px + env(safe-area-inset-bottom))!important;gap:clamp(28px,5vw,64px)!important}
#projekti,#shop{overflow:hidden!important}
#top.hero{height:100svh!important;min-height:100svh!important;max-height:100svh!important;box-sizing:border-box!important;overflow:hidden!important}
.hero-content{padding-bottom:calc(92px + env(safe-area-inset-bottom))!important}
/* Poster detail and enlarged photo gallery: no extra frame around the image itself. */
.poster-frame{padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;min-width:0!important;overflow:hidden!important}
.poster-frame img{display:block!important;width:100%!important;height:auto!important;max-width:100%!important;max-height:none!important;object-fit:contain!important;border:0!important;outline:0!important;box-shadow:none!important;background:transparent!important}
.lightbox{padding:8px!important;overflow:hidden!important}
.lightbox-image-wrap{width:min(97vw,1600px)!important;max-width:97vw!important;height:calc(100svh - 72px)!important;max-height:calc(100svh - 72px)!important;background:transparent!important;border:0!important;box-shadow:none!important}
.lightbox-image-wrap img,.lightbox img{width:auto!important;height:auto!important;max-width:97vw!important;max-height:calc(100svh - 72px)!important;object-fit:contain!important;background:transparent!important;border:0!important;outline:0!important;box-shadow:none!important}
.lightbox-nav{position:fixed!important;top:50%!important;z-index:3002!important;transform:translateY(-50%)!important}
.lightbox-prev{left:clamp(8px,2vw,24px)!important}.lightbox-next{right:clamp(8px,2vw,24px)!important}
/* Lily modal fits the viewport and has no horizontal scrollbar. */
.lily-game-backdrop{padding:clamp(6px,1.4vw,18px)!important;overflow:hidden!important;box-sizing:border-box!important}
.lily-game-panel{width:min(980px,calc(100vw - 28px))!important;max-width:calc(100vw - 28px)!important;min-width:0!important;max-height:calc(100svh - 24px)!important;overflow-x:hidden!important;overflow-y:auto!important;box-sizing:border-box!important;margin:0 auto!important;padding:clamp(8px,1.6vw,18px)!important;border:2px solid #EEEBD8!important;box-shadow:none!important}
.lily-game-stage{width:100%!important;max-width:100%!important;min-width:0!important;overflow:hidden!important;border:0!important;box-shadow:none!important}
#lily-game-canvas{display:block!important;width:100%!important;max-width:100%!important;height:auto!important;aspect-ratio:9/5!important;box-sizing:border-box!important;border:0!important;outline:0!important;box-shadow:none!important}
.lily-game-score,.lily-game-lives{padding:0!important;margin:0!important;border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important}
@media(max-width:760px){
body{padding-bottom:calc(103px + env(safe-area-inset-bottom))!important}
.site-bottom-bar{grid-template-columns:minmax(0,1fr) auto!important;grid-template-areas:'social copyright' 'booking booking'!important;gap:6px 10px!important;padding:6px 10px calc(8px + env(safe-area-inset-bottom))!important;min-height:96px!important}
.bottom-bar-socials{grid-area:social!important;gap:3px!important;flex-wrap:nowrap!important}
.bottom-social-icon{width:23px!important;height:23px!important}.bottom-social-icon svg{width:18px!important;height:18px!important}
.bottom-game-link{padding:2px 3px!important;gap:3px!important;font-size:9px!important}.bottom-game-link img{width:18px!important;height:18px!important}
.bottom-bar-booking{grid-area:booking!important;width:100%!important;min-height:40px!important;box-shadow:4px 4px 0 #0E2619!important;font-size:19px!important}
.bottom-bar-copyright{grid-area:copyright!important;font-size:8px!important;white-space:normal!important;max-width:112px!important;line-height:1.25!important}
.booking-float{right:10px!important;bottom:calc(108px + env(safe-area-inset-bottom))!important;width:min(184px,52vw)!important;min-height:62px!important;padding:7px 9px!important;border-width:4px!important;box-shadow:5px 5px 0 #F4DC3C!important}
.booking-float .booking-rotator{min-height:42px!important;font-size:clamp(16px,4.7vw,21px)!important}
#solo .solo-show-grid>article{flex-basis:min(82vw,360px)!important;width:min(82vw,360px)!important}
#solo .solo-show-grid>article>p{min-height:0!important}#solo .solo-show-grid>article>div:last-child{min-height:42px!important}
.home-events-head{display:none!important}
.home-events-row{grid-template-columns:minmax(76px,88px) minmax(0,1fr)!important;grid-template-areas:'date venue' 'date show' '. action'!important;gap:4px 11px!important;align-items:start!important;padding:17px 0!important}
.home-event-date{grid-area:date!important;font-size:clamp(28px,7.3vw,35px)!important;white-space:normal!important;line-height:.92!important;overflow-wrap:anywhere!important}
.home-event-city{display:none!important}.home-event-venue{grid-area:venue!important;font-size:14px!important;line-height:1.3!important;overflow-wrap:anywhere!important}.home-event-show{grid-area:show!important;font-size:14px!important;line-height:1.3!important;overflow-wrap:anywhere!important}
.home-event-ticket{grid-area:action!important;justify-self:start!important;min-height:37px!important;margin-top:5px!important;padding:0 13px!important;font-size:11px!important}
.hero-content{padding-bottom:calc(112px + env(safe-area-inset-bottom))!important}
#kontakt>div{padding-bottom:calc(132px + env(safe-area-inset-bottom))!important}
.lightbox-image-wrap{width:100%!important;max-width:100%!important;height:calc(100svh - 58px)!important;max-height:calc(100svh - 58px)!important}
.lightbox-image-wrap img,.lightbox img{max-width:100vw!important;max-height:calc(100svh - 58px)!important}
.lightbox-nav{width:40px!important;height:50px!important;font-size:30px!important}.lightbox-prev{left:4px!important}.lightbox-next{right:4px!important}
.lily-game-panel{width:calc(100vw - 14px)!important;max-width:calc(100vw - 14px)!important;max-height:calc(100svh - 12px)!important;padding:7px!important}
.lily-game-head{margin:0 0 7px!important}.lily-game-title{font-size:clamp(28px,8vw,44px)!important}
}
@media(max-width:390px){.bottom-game-link span{display:inline!important;font-size:8px!important}.bottom-bar-copyright{max-width:84px!important}.bottom-bar-booking{font-size:17px!important}}
@media(prefers-reduced-motion:reduce){.booking-float,.booking-rotator>span,.bottom-bar-booking{animation:none!important;transition:none!important}.booking-float{background:#0E2619!important;color:#F4DC3C!important;transform:none!important}.booking-rotator>span{opacity:0!important}.booking-rotator>span:first-child{opacity:1!important}}
/* Final cross-page overrides: stable sticky nav, single booking sticker and fixed yellow action bar. */
html, body { width:100%; max-width:100%; overflow-x:clip !important; }
x-dc { display:block; width:100%; max-width:100%; overflow-x:clip !important; }
body { padding-bottom:calc(82px + env(safe-area-inset-bottom)) !important; }
.site-head, .bio-header { position:sticky !important; top:0 !important; z-index:2400 !important; width:100%; backdrop-filter:none; }
.site-bottom-bar { position:fixed !important; left:0 !important; right:0 !important; bottom:0 !important; z-index:2500 !important; display:grid !important; grid-template-columns:minmax(0,1fr) minmax(220px,auto) minmax(0,1fr) !important; align-items:center !important; gap:clamp(10px,2vw,28px) !important; padding:9px clamp(14px,2.2vw,32px) calc(9px + env(safe-area-inset-bottom)) !important; min-height:70px !important; box-sizing:border-box !important; background:#F4DC3C !important; color:#0E2619 !important; border-top:3px solid #EEEBD8 !important; box-shadow:0 -4px 0 #0E2619 !important; }
footer:not(.site-bottom-bar), .site-footer, .bio-footer { display:none !important; }
.bottom-bar-socials { min-width:0 !important; display:flex !important; align-items:center !important; flex-wrap:nowrap !important; gap:clamp(4px,.8vw,10px) !important; }
.bottom-social-icon { flex:none !important; width:28px !important; height:28px !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; color:#0E2619 !important; background:transparent !important; border:0 !important; }
.bottom-social-icon svg { width:22px !important; height:22px !important; display:block !important; }
.bottom-game-link { display:inline-flex !important; align-items:center !important; gap:5px !important; color:#0E2619 !important; background:transparent !important; border:0 !important; padding:3px 5px !important; font-size:10px !important; font-weight:800 !important; white-space:nowrap !important; text-decoration:none !important; }
.bottom-game-link img { width:22px !important; height:22px !important; object-fit:contain !important; }
.bottom-bar-booking { grid-area:auto !important; justify-self:center !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:10px !important; min-height:48px !important; padding:0 clamp(16px,2vw,28px) !important; box-sizing:border-box !important; border:4px solid #EEEBD8 !important; outline:0 !important; background:#F4DC3C !important; color:#0E2619 !important; text-decoration:none !important; font:900 clamp(18px,1.9vw,26px)/1 'Big Shoulders Display',sans-serif !important; white-space:nowrap !important; box-shadow:5px 5px 0 #0E2619 !important; transition:none !important; transform:none !important; }
.bottom-bar-booking::before, .bottom-bar-booking::after { content:none !important; display:none !important; }
.bottom-bar-copyright { justify-self:end !important; text-align:right !important; color:#0E2619 !important; font-size:10px !important; font-weight:700 !important; white-space:nowrap !important; }
/* One single, punk-like booking sticker; intentionally hard colour/rotation cuts, no inner border. */
.booking-float { position:fixed !important; right:clamp(14px,2vw,28px) !important; bottom:calc(88px + env(safe-area-inset-bottom)) !important; z-index:2400 !important; display:flex !important; align-items:center !important; justify-content:center !important; width:min(242px,calc(100vw - 36px)) !important; min-height:72px !important; box-sizing:border-box !important; padding:10px 12px !important; text-align:center !important; text-decoration:none !important; border:5px solid #EEEBD8 !important; border-radius:0 !important; outline:0 !important; box-shadow:6px 6px 0 #F4DC3C !important; background:#0E2619 !important; color:#F4DC3C !important; clip-path:polygon(0 4%,98% 0,100% 95%,2% 100%) !important; transform:rotate(-2.4deg) !important; transition:none !important; animation:booking-hard-swap 5.4s steps(1,end) infinite !important; isolation:isolate !important; }
.booking-float::before, .booking-float::after { content:none !important; display:none !important; }
.booking-float .booking-rotator { display:grid !important; place-items:center !important; width:100% !important; min-height:46px !important; font:900 clamp(20px,2.3vw,30px)/.92 'Big Shoulders Display',sans-serif !important; text-transform:uppercase !important; }
.booking-rotator>span { grid-area:1/1 !important; max-width:100% !important; overflow-wrap:anywhere !important; opacity:0; }
.booking-rotator>span:nth-child(1) { animation:booking-text-a 5.4s steps(1,end) infinite !important; }
.booking-rotator>span:nth-child(2) { animation:booking-text-b 5.4s steps(1,end) infinite !important; }
.booking-rotator>span:nth-child(3) { animation:booking-text-c 5.4s steps(1,end) infinite !important; }
@keyframes booking-hard-swap { 0%,33.25% {background:#0E2619;color:#F4DC3C;transform:rotate(-2.8deg)} 33.3%,66.55% {background:#F4DC3C;color:#0E2619;transform:rotate(3.2deg)} 66.6%,100% {background:#0E2619;color:#EEEBD8;transform:rotate(-1deg)} }
@keyframes booking-text-a { 0%,33.25% {opacity:1} 33.3%,100% {opacity:0} }
@keyframes booking-text-b { 0%,33.25% {opacity:0} 33.3%,66.55% {opacity:1} 66.6%,100% {opacity:0} }
@keyframes booking-text-c { 0%,66.55% {opacity:0} 66.6%,100% {opacity:1} }
/* Poster images fill their actual frames; no green/cream letterboxing. */
#solo .solo-show-grid>article { height:100% !important; min-width:0 !important; display:flex !important; flex-direction:column !important; align-items:stretch !important; }
#solo .solo-show-grid>article>.card { display:block !important; width:100% !important; aspect-ratio:0.707/1 !important; height:auto !important; min-width:0 !important; padding:0 !important; overflow:hidden !important; background:transparent !important; border:0 !important; box-shadow:none !important; line-height:0 !important; }
#solo .solo-show-grid>article>.card img { display:block !important; width:100% !important; height:100% !important; object-fit:cover !important; object-position:center !important; background:transparent !important; border:0 !important; }
#solo .solo-show-grid>article>h3 { min-height:2em !important; }
#solo .solo-show-grid>article>p { min-height:3.4em !important; }
#solo .solo-show-grid>article>div:last-child { margin-top:auto !important; min-height:42px !important; display:flex !important; align-items:flex-end !important; }
.info-btn { display:inline-flex !important; justify-content:center !important; align-items:center !important; width:92px !important; min-width:92px !important; height:42px !important; min-height:42px !important; padding:0 12px !important; box-sizing:border-box !important; background:transparent !important; border:1px solid #EEEBD8 !important; color:#EEEBD8 !important; font:700 12px 'IBM Plex Mono',monospace !important; text-transform:uppercase !important; white-space:nowrap !important; }
#projekti .rail .card { display:flex !important; flex-direction:column !important; align-items:stretch !important; gap:12px !important; padding:0 !important; overflow:hidden !important; background:#173826 !important; min-width:0 !important; }
#projekti .rail .card>img { display:block !important; width:100% !important; height:auto !important; aspect-ratio:4/5 !important; object-fit:cover !important; object-position:center !important; background:transparent !important; border:0 !important; }
#projekti .rail .card>span { margin-left:16px !important; margin-right:16px !important; }
#projekti .rail .card>span:last-child { margin-bottom:16px !important; }
.carousel-dots { display:flex !important; align-items:center !important; justify-content:center !important; gap:9px !important; padding:12px 0 0 !important; min-height:16px !important; }
.carousel-dot { appearance:none !important; width:9px !important; height:9px !important; min-width:9px !important; min-height:9px !important; padding:0 !important; border:1.5px solid #EEEBD8 !important; border-radius:50% !important; background:transparent !important; box-shadow:none !important; transition:none !important; }
.carousel-dot[aria-current="true"] { width:9px !important; height:9px !important; border-color:#F4DC3C !important; background:#F4DC3C !important; border-radius:50% !important; }
#kontakt { width:100% !important; max-width:100% !important; overflow:hidden !important; box-sizing:border-box !important; }
#kontakt>div,#projekti>div,#shop>div { width:100% !important; max-width:1360px !important; box-sizing:border-box !important; padding-left:clamp(18px,4vw,44px) !important; padding-right:clamp(18px,4vw,44px) !important; margin-left:auto !important; margin-right:auto !important; }
#kontakt>div { padding-top:clamp(54px,7vw,104px) !important; padding-bottom:calc(116px + env(safe-area-inset-bottom)) !important; gap:clamp(28px,5vw,64px) !important; }
#top.hero { height:100svh !important; min-height:100svh !important; max-height:100svh !important; box-sizing:border-box !important; overflow:hidden !important; }
.hero-content { padding-bottom:calc(92px + env(safe-area-inset-bottom)) !important; }
.poster-frame { padding:0 !important; border:0 !important; background:transparent !important; box-shadow:none !important; min-width:0 !important; overflow:hidden !important; }
.poster-frame img { display:block !important; width:100% !important; height:auto !important; max-width:100% !important; object-fit:contain !important; border:0 !important; outline:0 !important; box-shadow:none !important; background:transparent !important; }
.lightbox { padding:8px !important; overflow:hidden !important; }
.lightbox-image-wrap { width:min(97vw,1600px) !important; max-width:97vw !important; height:calc(100svh - 72px) !important; max-height:calc(100svh - 72px) !important; background:transparent !important; border:0 !important; box-shadow:none !important; }
.lightbox-image-wrap img,.lightbox img { width:auto !important; height:auto !important; max-width:97vw !important; max-height:calc(100svh - 72px) !important; object-fit:contain !important; background:transparent !important; border:0 !important; outline:0 !important; box-shadow:none !important; }
.lightbox-nav { position:fixed !important; top:50% !important; z-index:3002 !important; transform:translateY(-50%) !important; }
.lightbox-prev { left:clamp(8px,2vw,24px) !important; } .lightbox-next { right:clamp(8px,2vw,24px) !important; }
/* Lily: plain score number / heart row, no extra boxed HUD or yellow bottom edge. */
.lily-game-backdrop { padding:clamp(6px,1.4vw,18px) !important; overflow:hidden !important; box-sizing:border-box !important; }
.lily-game-panel { width:min(980px,calc(100vw - 28px)) !important; max-width:calc(100vw - 28px) !important; min-width:0 !important; max-height:calc(100svh - 24px) !important; overflow-x:hidden !important; overflow-y:auto !important; box-sizing:border-box !important; margin:0 auto !important; padding:clamp(8px,1.6vw,18px) !important; border:2px solid #EEEBD8 !important; box-shadow:none !important; scrollbar-width:none !important; }
.lily-game-panel::-webkit-scrollbar { display:none !important; }
.lily-game-stage { position:relative !important; width:100% !important; max-width:100% !important; min-width:0 !important; overflow:hidden !important; border:0 !important; border-bottom:0 !important; box-shadow:none !important; background:#173826 !important; }
#lily-game-canvas { display:block !important; width:100% !important; max-width:100% !important; height:auto !important; aspect-ratio:9/5 !important; box-sizing:border-box !important; border:0 !important; outline:0 !important; box-shadow:none !important; }
.lily-game-hud { position:absolute !important; left:12px !important; right:12px !important; top:10px !important; display:flex !important; align-items:center !important; justify-content:space-between !important; gap:12px !important; background:transparent !important; border:0 !important; padding:0 !important; pointer-events:none !important; }
.lily-game-score,.lily-game-lives { display:inline-flex !important; align-items:center !important; gap:7px !important; padding:0 !important; margin:0 !important; border:0 !important; outline:0 !important; background:transparent !important; box-shadow:none !important; color:#F4DC3C !important; font:900 clamp(22px,3vw,34px)/1 'IBM Plex Mono',monospace !important; text-shadow:2px 2px 0 #0E2619 !important; }
.lily-game-score::before,.lily-game-lives::before { content:none !important; display:none !important; }
.lily-game-overlay { inset:0 !important; display:flex !important; align-items:center !important; justify-content:center !important; padding:22px !important; background:rgba(14,38,25,.86) !important; }
.lily-game-overlay-copy { display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important; gap:12px !important; width:min(620px,100%) !important; padding:0 !important; background:transparent !important; border:0 !important; box-shadow:none !important; text-align:center !important; }
.lily-game-overlay-copy h3 { margin:0 !important; color:#F4DC3C !important; font:900 clamp(82px,15vw,170px)/.76 'Big Shoulders Display',sans-serif !important; text-shadow:4px 4px 0 #0E2619 !important; }
.lily-game-overlay-copy p { max-width:36ch !important; margin:0 auto !important; color:#EEEBD8 !important; font:700 clamp(17px,2vw,25px)/1.25 'IBM Plex Sans',sans-serif !important; }
.lily-countdown { display:block !important; color:#F4DC3C !important; font:900 clamp(90px,17vw,180px)/.8 'Big Shoulders Display',sans-serif !important; text-shadow:4px 4px 0 #0E2619 !important; }
.lily-game-stage::before,.lily-game-stage::after { content:none !important; display:none !important; }
@media(max-width:760px) {
body { padding-bottom:calc(104px + env(safe-area-inset-bottom)) !important; }
.site-bottom-bar { grid-template-columns:minmax(0,1fr) auto !important; grid-template-areas:'social copyright' 'booking booking' !important; gap:6px 10px !important; padding:6px 10px calc(8px + env(safe-area-inset-bottom)) !important; min-height:96px !important; }
.bottom-bar-socials { grid-area:social !important; gap:3px !important; flex-wrap:nowrap !important; }
.bottom-social-icon { width:23px !important; height:23px !important; } .bottom-social-icon svg { width:18px !important; height:18px !important; }
.bottom-game-link { padding:2px 3px !important; gap:3px !important; font-size:8px !important; } .bottom-game-link img { width:18px !important; height:18px !important; }
.bottom-bar-booking { grid-area:booking !important; width:100% !important; min-height:40px !important; font-size:19px !important; }
.bottom-bar-copyright { grid-area:copyright !important; font-size:8px !important; white-space:normal !important; max-width:112px !important; line-height:1.25 !important; }
.booking-float { right:10px !important; bottom:calc(108px + env(safe-area-inset-bottom)) !important; width:min(184px,52vw) !important; min-height:62px !important; padding:7px 9px !important; border-width:4px !important; box-shadow:5px 5px 0 #F4DC3C !important; }
.booking-float .booking-rotator { min-height:42px !important; font-size:clamp(16px,4.7vw,21px) !important; }
#solo .solo-show-grid>article { flex-basis:min(82vw,360px) !important; width:min(82vw,360px) !important; }
#solo .solo-show-grid>article>h3 { min-height:2em !important; }
#solo .solo-show-grid>article>p { min-height:0 !important; }
#solo .solo-show-grid>article>div:last-child { min-height:42px !important; }
.home-events-head { display:none !important; }
.home-events-row { grid-template-columns:minmax(76px,88px) minmax(0,1fr) !important; grid-template-areas:'date venue' 'date show' '. action' !important; gap:4px 11px !important; align-items:start !important; padding:17px 0 !important; }
.home-event-date { grid-area:date !important; font-size:clamp(28px,7.3vw,35px) !important; white-space:normal !important; line-height:.92 !important; overflow-wrap:anywhere !important; }
.home-event-city { display:none !important; } .home-event-venue { grid-area:venue !important; font-size:14px !important; line-height:1.3 !important; overflow-wrap:anywhere !important; } .home-event-show { grid-area:show !important; font-size:14px !important; line-height:1.3 !important; overflow-wrap:anywhere !important; }
.home-event-ticket { grid-area:action !important; justify-self:start !important; min-height:37px !important; margin-top:5px !important; padding:0 13px !important; font-size:11px !important; }
.hero-content { padding-bottom:calc(112px + env(safe-area-inset-bottom)) !important; }
#kontakt>div { padding-bottom:calc(132px + env(safe-area-inset-bottom)) !important; }
.lightbox-image-wrap { width:100% !important; max-width:100% !important; height:calc(100svh - 58px) !important; max-height:calc(100svh - 58px) !important; }
.lightbox-image-wrap img,.lightbox img { max-width:100vw !important; max-height:calc(100svh - 58px) !important; }
.lightbox-nav { width:40px !important; height:50px !important; font-size:30px !important; } .lightbox-prev { left:4px !important; } .lightbox-next { right:4px !important; }
.lily-game-panel { width:calc(100vw - 14px) !important; max-width:calc(100vw - 14px) !important; max-height:calc(100svh - 12px) !important; padding:7px !important; }
.lily-game-head { margin:0 0 7px !important; } .lily-game-title { font-size:clamp(28px,8vw,44px) !important; }
.lily-game-overlay { padding:12px !important; }
.lily-game-overlay-copy { gap:10px !important; }
.lily-game-overlay-copy p { font-size:16px !important; }
}
@media(max-width:390px) { .bottom-game-link span { display:inline !important; font-size:8px !important; } .bottom-bar-copyright { max-width:84px !important; } .bottom-bar-booking { font-size:17px !important; } }
@media(prefers-reduced-motion:reduce) { .booking-float,.booking-rotator>span,.bottom-bar-booking { animation:none !important; transition:none !important; } .booking-float { background:#0E2619 !important; color:#F4DC3C !important; transform:none !important; } .booking-rotator>span { opacity:0 !important; } .booking-rotator>span:first-child { opacity:1 !important; } }
/* Cross-page finishing touches: full-bleed event images and a visible, persistent bottom bar. */
.event-poster { background:transparent !important; border:0 !important; padding:0 !important; overflow:hidden !important; }
.event-poster img { display:block !important; width:100% !important; height:100% !important; object-fit:cover !important; object-position:center !important; border:0 !important; outline:0 !important; padding:0 !important; background:transparent !important; }
.event-poster.poster-placeholder { display:flex !important; align-items:center !important; justify-content:center !important; background:#0E2619 !important; color:#F4DC3C !important; border:0 !important; }
.site-bottom-bar { visibility:visible !important; opacity:1 !important; }
/* Final consistency pass: no blurred nav, no fixed bottom toolbar, one normal footer. */
html,body{max-width:100%;overflow-x:clip}
body{padding-bottom:0!important}
.site-head,.bio-header{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:#0E2619!important}
.site-bottom-bar{display:none!important;visibility:hidden!important;pointer-events:none!important}
footer.site-footer,footer:not(.site-bottom-bar){display:none!important;visibility:hidden!important;pointer-events:none!important}
.site-footer{width:100%;box-sizing:border-box;background:#0E2619!important;color:#EEEBD8!important;border-top:1px solid #2E4C39!important;padding:22px clamp(18px,3vw,40px)!important;margin:0!important;font:11px/1.5 'IBM Plex Mono',monospace!important;text-transform:uppercase;letter-spacing:.04em}
.site-footer-inner{width:100%;max-width:1360px;margin:0 auto;display:flex!important;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.site-footer-socials{display:flex;align-items:center;gap:clamp(8px,1.2vw,16px);flex-wrap:wrap}
.site-footer-socials>a{display:inline-flex;align-items:center;justify-content:center;color:#F4DC3C!important;text-decoration:none;min-width:26px;min-height:26px}
.site-footer-socials>a svg{display:block;width:21px;height:21px}
.site-footer-socials>a:hover{color:#EEEBD8!important}
.site-footer-socials .site-footer-game{display:inline-flex;gap:6px;align-items:center;font-size:10px;font-weight:700;white-space:nowrap}
.site-footer-game img{display:block;width:22px;height:22px;object-fit:contain}
.site-footer-copyright{margin-left:auto;text-align:right;color:#EEEBD8;white-space:nowrap}
/* Booking remains a full section at the end of the document, never a fixed bottom bar. */
.booking-end-section{display:block!important;position:relative;width:100%;max-width:100%;box-sizing:border-box;background:#F4DC3C!important;color:#0E2619!important;margin:0;padding:clamp(46px,6vw,88px) clamp(18px,4vw,44px)!important;overflow:hidden}
.booking-end-inner{width:100%;max-width:1360px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.8fr);gap:clamp(26px,5vw,76px);align-items:end}
.booking-end-kicker{font:600 11px 'IBM Plex Mono',monospace;text-transform:uppercase;letter-spacing:.06em;margin:0 0 12px}
.booking-end-inner h2{font:900 clamp(58px,8.8vw,132px)/.79 'Big Shoulders Display',sans-serif;text-transform:uppercase;letter-spacing:-.025em;margin:0;overflow-wrap:anywhere}
.booking-end-copy{display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-width:0}
.booking-end-copy p{margin:0;font-size:clamp(16px,1.7vw,21px);font-weight:600;line-height:1.35}
.booking-end-copy>a{font-size:clamp(19px,2.2vw,29px);font-weight:700;line-height:1.2;color:#0E2619!important;text-underline-offset:6px;overflow-wrap:anywhere}
.booking-end-copy .booking-end-note{font:11px 'IBM Plex Mono',monospace;text-transform:uppercase;margin-top:6px}
/* One punk booking sticker. Hard cuts between yellow/green; no inner keyline. */
.booking-float{position:fixed!important;right:clamp(14px,2vw,28px)!important;bottom:max(18px,env(safe-area-inset-bottom))!important;top:auto!important;z-index:9999!important;box-sizing:border-box!important;width:clamp(210px,13.5vw,270px)!important;min-height:82px!important;padding:12px 15px!important;display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;text-decoration:none!important;border:5px solid #EEEBD8!important;border-radius:0!important;outline:0!important;outline-offset:0!important;box-shadow:8px 8px 0 #F4DC3C!important;clip-path:polygon(0 2%,98% 0,100% 96%,2% 100%)!important;animation:none!important;background:#0E2619!important;color:#F4DC3C!important;transition:none!important;isolation:isolate!important}
.booking-float:before,.booking-float:after{content:none!important;display:none!important}
.booking-float .booking-rotator{display:grid!important;place-items:center!important;width:100%!important;min-height:44px!important;font:900 clamp(22px,2.2vw,32px)/.92 'Big Shoulders Display',sans-serif!important;letter-spacing:-.015em!important;text-transform:uppercase!important}
.booking-float .booking-rotator>span{grid-area:1/1!important;max-width:100%!important;opacity:0!important;overflow-wrap:anywhere!important;animation:none!important;opacity:0!important}
.booking-float:hover{box-shadow:10px 10px 0 #F4DC3C!important;filter:contrast(1.08)}
/* Desktop uses clean carousels; position dots only for the mobile touch layout. */
@media(min-width:761px){.carousel-dots{display:none!important}}
@media(max-width:760px){.carousel-dots{display:flex!important}.site-footer{padding:18px!important}.site-footer-inner{align-items:flex-start;flex-direction:column;gap:12px}.site-footer-copyright{margin-left:0;text-align:left;white-space:normal}.booking-end-section{padding:42px 18px!important}.booking-end-inner{grid-template-columns:minmax(0,1fr);gap:26px}.booking-end-inner h2{font-size:clamp(60px,16vw,94px)}.booking-end-copy>a{font-size:clamp(18px,5vw,24px)}.booking-float{right:12px!important;bottom:max(12px,env(safe-area-inset-bottom))!important;width:min(190px,52vw)!important;min-height:62px!important;padding:9px 10px!important;border-width:4px!important;box-shadow:5px 5px 0 #F4DC3C!important}.booking-float .booking-rotator{font-size:clamp(18px,4.9vw,24px)!important;min-height:38px!important}}
@media(max-width:420px){.booking-float{width:min(166px,49vw)!important;min-height:56px!important;padding:7px!important}.booking-float .booking-rotator{font-size:clamp(16px,4.7vw,20px)!important}}
/* About images sit between the title and the copy on wide screens. */
@media(min-width:761px){.home-about-wrap{grid-template-columns:minmax(0,.72fr) minmax(0,1.05fr) minmax(0,1fr)!important;gap:clamp(22px,3.2vw,52px)!important;align-items:center!important}.home-about-visual{display:contents!important}.home-about-visual>h2{grid-column:1!important;align-self:center!important}.home-about-visual>.about-collage{grid-column:2!important;min-width:0!important;width:100%!important}.home-about-wrap>.home-about-copy{grid-column:3!important;min-width:0!important}}
@media(max-width:760px){.home-about-wrap{grid-template-columns:minmax(0,1fr)!important}.home-about-visual{display:contents!important}.home-about-visual>h2,.home-about-visual>.about-collage,.home-about-wrap>.home-about-copy{grid-column:1!important;min-width:0!important}.home-about-visual>.about-collage{width:100%!important}}
/* Booking contact section is normal flow; hero no longer reserves space for a fake fixed footer. */
#kontakt>div{padding-top:clamp(48px,6vw,88px)!important;padding-bottom:clamp(34px,4vw,54px)!important;gap:clamp(28px,4vw,52px)!important}
.hero-content{padding-bottom:clamp(24px,4vh,48px)!important}
/* Gallery lightbox must obey the hidden attribute even when its open-state CSS uses !important. */
#gallery-lightbox[hidden],.lightbox[hidden]{display:none!important;visibility:hidden!important;pointer-events:none!important;opacity:0!important}
.lightbox:not([hidden]){display:grid!important;visibility:visible!important;pointer-events:auto!important;opacity:1!important}
@media(prefers-reduced-motion:reduce){.booking-float,.booking-float .booking-rotator>span{animation:none!important}.booking-float{background:#0E2619!important;color:#F4DC3C!important;transform:rotate(-1deg)!important}.booking-float .booking-rotator>span{opacity:0!important}.booking-float .booking-rotator>span:first-child{opacity:1!important}}
/* Final intentional layout: booking is in normal page flow; no sticky bottom toolbar. */
html, body { max-width:100%; overflow-x:clip !important; }
body { padding-bottom:0 !important; }
.site-head, .bio-header { backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
.site-bottom-bar { display:none !important; visibility:hidden !important; pointer-events:none !important; }
footer.site-footer, .site-footer { display:block !important; position:relative !important; inset:auto !important; z-index:1 !important; width:100% !important; box-sizing:border-box !important; margin:0 !important; padding:18px clamp(18px,3vw,40px) calc(18px + env(safe-area-inset-bottom)) !important; background:#F4DC3C !important; color:#0E2619 !important; border-top:1.5px solid #0E2619 !important; box-shadow:none !important; font:11px/1.5 'IBM Plex Mono',monospace !important; text-transform:uppercase; letter-spacing:.04em; }
.site-footer-inner { width:100% !important; max-width:1360px !important; margin:0 auto !important; display:flex !important; flex-direction:row !important; align-items:center !important; justify-content:space-between !important; gap:14px 24px !important; flex-wrap:wrap !important; }
.site-footer-socials { display:flex !important; align-items:center !important; gap:clamp(8px,1.2vw,16px) !important; flex-wrap:wrap !important; }
.site-footer-socials>a, .site-footer .site-footer-game, .site-footer-copyright { color:#0E2619 !important; }
.site-footer-socials>a { border:0 !important; background:transparent !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; min-width:26px !important; min-height:26px !important; text-decoration:none !important; }
.site-footer-socials>a svg { display:block !important; width:21px !important; height:21px !important; }
.site-footer-socials>a:hover, .site-footer .site-footer-game:hover { background:rgba(14,38,25,.08) !important; color:#0E2619 !important; }
.site-footer .site-footer-game { display:inline-flex !important; align-items:center !important; gap:6px !important; font-size:10px !important; font-weight:700 !important; white-space:nowrap !important; text-decoration:none !important; }
.site-footer-game img { display:block !important; width:22px !important; height:22px !important; object-fit:contain !important; }
.site-footer-copyright { margin-left:auto !important; text-align:right !important; white-space:nowrap !important; font-size:10px !important; }
/* Reliable punk CTA: a single visible label, rotated/coloured by JS with no legacy keyframe conflicts. */
.booking-float { position:fixed !important; right:clamp(14px,2vw,28px) !important; bottom:max(18px,env(safe-area-inset-bottom)) !important; top:auto !important; z-index:9999 !important; display:flex !important; align-items:center !important; justify-content:center !important; box-sizing:border-box !important; width:clamp(210px,13.5vw,270px) !important; min-height:82px !important; padding:12px 15px !important; border:5px solid #EEEBD8 !important; border-radius:0 !important; outline:0 !important; box-shadow:8px 8px 0 #F4DC3C !important; clip-path:polygon(0 2%,98% 0,100% 96%,2% 100%) !important; background:#0E2619 !important; color:#F4DC3C !important; text-decoration:none !important; transition:none !important; animation:none !important; isolation:isolate !important; }
.booking-float::before, .booking-float::after { content:none !important; display:none !important; }
.booking-float .booking-rotator { display:block !important; position:relative !important; width:100% !important; min-height:0 !important; padding:0 !important; margin:0 !important; color:inherit !important; opacity:1 !important; visibility:visible !important; text-align:center !important; font:900 clamp(22px,2.2vw,32px)/.92 'Big Shoulders Display',sans-serif !important; letter-spacing:-.015em !important; text-transform:uppercase !important; overflow-wrap:anywhere !important; animation:none !important; }
.booking-float:hover { box-shadow:10px 10px 0 #F4DC3C !important; filter:contrast(1.08); }
@media (max-width:760px) {
.site-footer { padding:16px 18px calc(16px + env(safe-area-inset-bottom)) !important; }
.site-footer-inner { flex-direction:row !important; align-items:center !important; justify-content:space-between !important; }
.site-footer-copyright { margin-left:auto !important; text-align:right !important; white-space:normal !important; }
.booking-float { right:12px !important; bottom:max(12px,env(safe-area-inset-bottom)) !important; width:min(190px,52vw) !important; min-height:62px !important; padding:9px 10px !important; border-width:5px !important; box-shadow:6px 6px 0 #F4DC3C !important; }
.booking-float .booking-rotator { font-size:clamp(18px,4.9vw,24px) !important; }
}
@media (max-width:420px) {
.site-footer-inner { gap:10px 16px !important; }
.site-footer-copyright { max-width:100% !important; }
.booking-float { width:min(166px,49vw) !important; min-height:56px !important; padding:7px !important; }
.booking-float .booking-rotator { font-size:clamp(16px,4.7vw,20px) !important; }
}
@media (min-width:761px) {
/* Title and photo collage form one left column; bio copy is the right column. */
.home-about-wrap { display:grid !important; grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr) !important; gap:clamp(28px,5vw,76px) !important; align-items:center !important; }
.home-about-visual { display:flex !important; flex-direction:column !important; align-items:stretch !important; justify-content:center !important; gap:16px !important; grid-column:1 !important; min-width:0 !important; }
.home-about-visual>h2 { grid-column:auto !important; align-self:flex-start !important; margin:0 !important; }
.home-about-visual>.about-collage { grid-column:auto !important; width:100% !important; max-width:580px !important; min-width:0 !important; margin:0 !important; }
.home-about-wrap>.home-about-copy { grid-column:2 !important; min-width:0 !important; }
}
@media (max-width:760px) {
.home-about-wrap { display:grid !important; grid-template-columns:minmax(0,1fr) !important; gap:24px !important; }
.home-about-visual { display:flex !important; flex-direction:column !important; gap:12px !important; grid-column:1 !important; min-width:0 !important; }
.home-about-visual>h2, .home-about-visual>.about-collage, .home-about-wrap>.home-about-copy { grid-column:1 !important; width:100% !important; min-width:0 !important; }
}
@media (min-width:761px) { .carousel-dots { display:none !important; } }
@media (prefers-reduced-motion:reduce) { .booking-float { transform:none !important; } }
/* Final correction: one single yellow Booking & suradnje footer, no second footer bar. */
html, body { max-width:100%; overflow-x:clip !important; }
body { padding-bottom:0 !important; }
.site-bottom-bar { display:none !important; visibility:hidden !important; pointer-events:none !important; }
.site-footer, .bio-footer { display:none !important; }
.booking-end-section { display:block !important; width:100% !important; box-sizing:border-box !important; margin:0 !important; padding:clamp(38px,5.2vw,76px) clamp(18px,3.3vw,48px) 22px !important; overflow:hidden !important; background:#F4DC3C !important; color:#0E2619 !important; }
.booking-end-inner { width:100% !important; max-width:1360px !important; margin:0 auto !important; display:flex !important; flex-direction:column !important; gap:clamp(28px,4.2vw,54px) !important; }
.booking-end-main { display:grid !important; grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr) !important; align-items:end !important; gap:clamp(26px,5vw,76px) !important; min-width:0 !important; }
.booking-end-title { min-width:0 !important; }
.booking-end-kicker { margin:0 0 12px !important; font:600 11px/1.4 'IBM Plex Mono',monospace !important; text-transform:uppercase !important; letter-spacing:.05em !important; }
.booking-end-title h2 { margin:0 !important; font:900 clamp(58px,8.8vw,132px)/.8 'Big Shoulders Display',sans-serif !important; letter-spacing:-.025em !important; text-transform:uppercase !important; overflow-wrap:anywhere !important; }
.booking-end-copy { min-width:0 !important; display:flex !important; flex-direction:column !important; align-items:flex-start !important; gap:10px !important; }
.booking-end-copy p { margin:0 !important; font-size:clamp(16px,1.7vw,21px) !important; font-weight:600 !important; line-height:1.35 !important; }
.booking-end-copy>a { max-width:100% !important; color:#0E2619 !important; font-size:clamp(19px,2.2vw,29px) !important; font-weight:700 !important; line-height:1.2 !important; text-underline-offset:6px !important; overflow-wrap:anywhere !important; }
.booking-end-copy .booking-end-note { margin-top:4px !important; font:11px/1.5 'IBM Plex Mono',monospace !important; text-transform:uppercase !important; }
.booking-end-meta { width:100% !important; box-sizing:border-box !important; padding-top:18px !important; border-top:2px solid #0E2619 !important; display:flex !important; align-items:center !important; justify-content:space-between !important; gap:14px 24px !important; flex-wrap:wrap !important; font-family:'IBM Plex Mono',monospace !important; text-transform:uppercase !important; }
.booking-end-socials { display:flex !important; align-items:center !important; gap:clamp(8px,1.15vw,16px) !important; flex-wrap:wrap !important; min-width:0 !important; }
.booking-end-socials>a:not(.booking-end-game) { display:inline-flex !important; align-items:center !important; justify-content:center !important; width:28px !important; height:28px !important; color:#0E2619 !important; background:transparent !important; text-decoration:none !important; border:0 !important; padding:0 !important; }
.booking-end-socials>a svg { display:block !important; width:22px !important; height:22px !important; }
.booking-end-socials>a:hover { color:#0E2619 !important; transform:translateY(-2px) !important; }
.booking-float.booking-hidden-at-contact { opacity:0 !important; visibility:hidden !important; pointer-events:none !important; }
.booking-end-game { display:inline-flex !important; align-items:center !important; gap:6px !important; min-height:28px !important; color:#0E2619 !important; background:transparent !important; text-decoration:none !important; font:700 10px/1.2 'IBM Plex Mono',monospace !important; white-space:nowrap !important; }
.booking-end-game img { display:block !important; width:24px !important; height:24px !important; object-fit:contain !important; }
.booking-end-copyright { margin-left:auto !important; text-align:right !important; color:#0E2619 !important; font:700 10px/1.5 'IBM Plex Mono',monospace !important; letter-spacing:.03em !important; white-space:nowrap !important; }
/* On the homepage hero, keep the header transparent but give the right-hand nav its own dark-green label block. */
body:not(.nav-solid) .site-head .site-nav { background:#0E2619 !important; border:0 !important; box-shadow:3px 3px 0 rgba(14,38,25,.25) !important; }
body:not(.nav-solid) .site-head .site-nav a { color:#EEEBD8 !important; }
body.nav-solid .site-head, body.nav-solid .site-head .site-nav { background:#0E2619 !important; }
body.nav-open .site-head .site-nav { background:#0E2619 !important; border:2px solid #EEEBD8 !important; box-shadow:4px 4px 0 #F4DC3C !important; }
@media (max-width:760px) {
.booking-end-section { padding:38px 18px calc(20px + env(safe-area-inset-bottom)) !important; }
.booking-end-main { grid-template-columns:minmax(0,1fr) !important; gap:28px !important; }
.booking-end-title h2 { font-size:clamp(58px,15vw,92px) !important; }
.booking-end-copy>a { font-size:clamp(18px,5vw,24px) !important; }
.booking-end-meta { align-items:flex-start !important; flex-direction:column !important; gap:14px !important; }
.booking-end-socials { gap:10px !important; }
.booking-end-copyright { margin-left:0 !important; text-align:left !important; white-space:normal !important; }
.booking-float { bottom:calc(14px + env(safe-area-inset-bottom)) !important; }
}
@media (prefers-reduced-motion:reduce) { .booking-end-socials>a:hover { transform:none !important; } }
/* Footer and contact are intentionally one section; hide every legacy footer element. */
.site-bottom-bar, footer.site-footer, footer:not(.site-bottom-bar), .site-footer, .bio-footer { display:none !important; visibility:hidden !important; pointer-events:none !important; }
.booking-end-section { background:#F4DC3C !important; color:#0E2619 !important; }
/* ===== Extracted from nastupi.html: punk-section-transitions-events-page ===== */
/* Match the homepage's torn-paper language on the all-events page. */
:root { --events-paper:#EEEBD8; --events-yellow:#F4DC3C; --events-green:#0E2619; }
main {
position:relative !important;
isolation:isolate !important;
background-color:var(--events-paper) !important;
background-image:radial-gradient(circle,rgba(14,38,25,.045) .6px,transparent .95px),radial-gradient(circle,rgba(14,38,25,.025) .65px,transparent 1px) !important;
background-size:9px 11px,17px 19px !important;
background-position:2px 2px,5px 8px !important;
}
main > * { position:relative; z-index:1; }
.booking-end-section {
position:relative !important;
isolation:isolate !important;
overflow:visible !important;
background-color:var(--events-yellow) !important;
background-image:radial-gradient(circle,rgba(14,38,25,.045) .6px,transparent .95px),radial-gradient(circle,rgba(14,38,25,.022) .65px,transparent 1px) !important;
background-size:11px 13px,21px 23px !important;
}
.booking-end-section::before {
content:""; position:absolute; left:0; right:0; top:-25px; height:50px; z-index:0; pointer-events:none;
background-color:var(--events-yellow);
background-image:radial-gradient(circle,rgba(14,38,25,.07) .65px,transparent 1px);
background-size:10px 12px;
clip-path:polygon(0 42%,3% 29%,6% 45%,10% 31%,14% 43%,18% 25%,22% 41%,26% 30%,30% 47%,34% 32%,38% 44%,42% 26%,47% 42%,51% 30%,55% 47%,59% 32%,63% 43%,67% 26%,72% 41%,76% 30%,80% 47%,85% 31%,89% 43%,93% 26%,97% 40%,100% 32%,100% 100%,0 100%);
}
.booking-end-inner { position:relative !important; z-index:1 !important; }
@media(max-width:760px) { .booking-end-section::before { top:-16px; height:32px; } }
/* ===== Extracted from nastupi.html: final-paper-and-navbar-sync-20261030 ===== */
/* FINAL: keep the torn yellow booking paper visible on every page. */
.booking-end-section {
position: relative !important;
isolation: isolate !important;
overflow: visible !important;
z-index: 20 !important;
}
.booking-end-section::before {
content: "" !important;
display: block !important;
position: absolute !important;
left: 0 !important;
right: 0 !important;
top: -27px !important;
height: 54px !important;
z-index: 1 !important;
pointer-events: none !important;
background: #F4DC3C !important;
background-image: radial-gradient(circle, rgba(14,38,25,.07) .65px, transparent 1px) !important;
background-size: 10px 12px !important;
clip-path: polygon(
0 43%,3% 30%,6% 46%,10% 32%,14% 42%,18% 25%,22% 40%,
26% 31%,30% 48%,34% 33%,38% 44%,42% 27%,47% 41%,51% 30%,
55% 47%,59% 32%,63% 42%,67% 26%,72% 41%,76% 31%,80% 47%,
85% 30%,89% 43%,93% 26%,97% 40%,100% 32%,100% 100%,0 100%
) !important;
}
.booking-end-inner {
position: relative !important;
z-index: 2 !important;
}
@media (max-width: 760px) {
.booking-end-section::before {
top: -17px !important;
height: 34px !important;
}
}
/* FINAL: homepage navbar background and logo switch together.
The old implementation changed the background via body.nav-solid but
changed the logo through a React/state rerender, causing a visible lag. */
.site-head {
transition: none !important;
}
.site-head > div > a[href="#top"] {
transition: none !important;
}
body:not(.nav-solid) .site-head {
background: transparent !important;
border-bottom-color: transparent !important;
}
body.nav-solid .site-head {
background: #0E2619 !important;
border-bottom: 1px solid #2E4C39 !important;
}
body:not(.nav-solid) .site-head > div > a[href="#top"] {
opacity: 0 !important;
transform: translateY(-6px) !important;
pointer-events: none !important;
}
body.nav-solid .site-head > div > a[href="#top"] {
opacity: 1 !important;
transform: none !important;
pointer-events: auto !important;
}
body:not(.nav-solid) .site-head .site-nav {
background: transparent !important;
border-color: transparent !important;
}
body.nav-solid .site-head .site-nav {
background: #0E2619 !important;
border-color: transparent !important;
}
/* ===== Extracted from nastupi.html: unified-subpage-navbar-20261030 ===== */
/* Unified subpage navbar: same visual language as the main site, but always visible. */
.site-head {
position: sticky !important;
top: 0 !important;
z-index: 2400 !important;
width: 100% !important;
box-sizing: border-box !important;
margin: 0 !important;
padding: 12px 16px !important;
background: #0E2619 !important;
color: #EEEBD8 !important;
border-bottom: 1px solid #2E4C39 !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
transition: none !important;
}
.site-head .head-row, .site-head .head-inner {
width: 100% !important;
max-width: 1360px !important;
min-height: 48px !important;
margin: 0 auto !important;
padding: 0 !important;
box-sizing: border-box !important;
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 16px !important;
}
.site-head .wordmark, .site-head .logo {
color: #F4DC3C !important;
opacity: 1 !important;
transform: none !important;
pointer-events: auto !important;
visibility: visible !important;
font-family: 'Big Shoulders Display', sans-serif !important;
font-weight: 900 !important;
font-size: clamp(25px, 2.2vw, 32px) !important;
line-height: 1 !important;
text-transform: uppercase !important;
text-decoration: none !important;
white-space: nowrap !important;
}
.site-head .nav, .site-head .site-nav {
display: flex !important;
align-items: center !important;
justify-content: flex-end !important;
gap: 0 !important;
flex-wrap: wrap !important;
background: #0E2619 !important;
border: 0 !important;
box-shadow: none !important;
padding: 4px 0 !important;
}
.site-head .nav a, .site-head .site-nav a {
color: #EEEBD8 !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 11px !important;
line-height: 1.2 !important;
text-transform: uppercase !important;
text-decoration: none !important;
padding: 6px 9px !important;
transition: background .12s steps(1,end), color .12s steps(1,end) !important;
}
.site-head .nav a:hover, .site-head .nav a:focus-visible, .site-head .site-nav a:hover, .site-head .site-nav a:focus-visible {
background: #F4DC3C !important;
color: #0E2619 !important;
}
.site-head .mobile-menu-toggle { margin-left: auto !important; }
@media (max-width: 760px) {
.site-head { padding: 10px 14px !important; }
.site-head .head-row, .site-head .head-inner { min-height: 42px !important; }
.site-head .wordmark, .site-head .logo { font-size: 21px !important; }
}
/* ===== Extracted from nastupi.html: navbar-torn-paper-edge-20261030 ===== */
/* The navbar is a dark-green paper strip: its lower edge follows the same
irregular cut used by the section dividers instead of a flat hairline. */
.site-head {
overflow: visible !important;
isolation: isolate !important;
}
.site-head > div {
position: relative !important;
z-index: 2 !important;
}
body.nav-solid .site-head::after,
body.subpage-page .site-head::after {
content: "" !important;
display: block !important;
position: absolute !important;
left: 0 !important;
right: 0 !important;
bottom: -16px !important;
height: 17px !important;
opacity: 1 !important;
pointer-events: none !important;
z-index: 1 !important;
background-color: #0E2619 !important;
background-image:
radial-gradient(circle, rgba(238,235,216,.055) .65px, transparent .95px),
radial-gradient(circle, rgba(0,0,0,.10) .6px, transparent .95px) !important;
background-size: 9px 11px, 17px 19px !important;
background-position: 2px 2px, 6px 8px !important;
clip-path: polygon(
0 0, 100% 0, 100% 49%, 97% 65%, 94% 43%, 90% 62%,
86% 44%, 82% 66%, 78% 45%, 74% 61%, 70% 42%, 66% 65%,
62% 44%, 58% 62%, 54% 43%, 50% 66%, 46% 45%, 42% 62%,
38% 42%, 34% 65%, 30% 44%, 26% 63%, 22% 42%, 18% 65%,
14% 44%, 10% 62%, 6% 43%, 3% 63%, 0 46%
) !important;
}
/* Over the hero the navbar is intentionally transparent, so its paper edge
appears only once the solid navigation strip is visible. */
body:not(.nav-solid):not(.subpage-page) .site-head::after {
content: none !important;
display: none !important;
}
@media (max-width: 760px) {
body.nav-solid .site-head::after,
body.subpage-page .site-head::after {
bottom: -12px !important;
height: 13px !important;
clip-path: polygon(
0 0, 100% 0, 100% 48%, 96% 64%, 91% 43%, 86% 63%,
81% 44%, 76% 65%, 71% 43%, 66% 62%, 61% 44%, 56% 65%,
51% 43%, 46% 63%, 41% 44%, 36% 65%, 31% 43%, 26% 62%,
21% 44%, 16% 64%, 11% 43%, 6% 63%, 3% 44%, 0 55%
) !important;
}
}
/* ===== Extracted from nastupi.html: fullscreen-mobile-navigation ===== */
/* Mobile navigation: a true full-viewport panel, not a dropdown under the header. */
@media (max-width: 800px) {
html.menu-open,
body.nav-open {
overflow: hidden !important;
}
body.nav-open .site-head {
z-index: 5000 !important;
}
body.nav-open .site-head .site-nav,
body.nav-open .site-head .nav,
body.nav-open .site-head .bio-nav {
position: fixed !important;
inset: 0 !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
z-index: 5001 !important;
display: flex !important;
flex-direction: column !important;
flex-wrap: nowrap !important;
align-items: stretch !important;
justify-content: center !important;
gap: 0 !important;
width: 100vw !important;
max-width: none !important;
height: 100vh !important;
height: 100dvh !important;
max-height: none !important;
box-sizing: border-box !important;
margin: 0 !important;
padding: max(104px, calc(env(safe-area-inset-top) + 92px)) clamp(26px, 8vw, 64px) calc(64px + env(safe-area-inset-bottom)) !important;
overflow-x: hidden !important;
overflow-y: auto !important;
overscroll-behavior: contain !important;
-webkit-overflow-scrolling: touch;
background: #0E2619 !important;
border: 0 !important;
border-radius: 0 !important;
box-shadow: none !important;
visibility: visible !important;
opacity: 1 !important;
transform: none !important;
}
body.nav-open.subpage-page .site-head .nav,
body.nav-open.subpage-page .site-head .site-nav {
display: flex !important;
}
body.nav-open .site-head .site-nav::before,
body.nav-open .site-head .nav::before,
body.nav-open .site-head .bio-nav::before {
content: "HRVOJE KRMELIĆ";
position: absolute;
top: max(26px, calc(env(safe-area-inset-top) + 20px));
left: clamp(26px, 8vw, 64px);
display: block;
color: #F4DC3C;
font: 900 clamp(27px, 7vw, 38px)/.9 "Big Shoulders Display", Impact, sans-serif;
text-transform: uppercase;
letter-spacing: .01em;
pointer-events: none;
}
body.nav-open .site-head .site-nav::after,
body.nav-open .site-head .nav::after,
body.nav-open .site-head .bio-nav::after {
content: "ODABERI GDJE ŽELIŠ IĆI";
position: absolute;
left: clamp(26px, 8vw, 64px);
bottom: max(24px, calc(env(safe-area-inset-bottom) + 16px));
display: block;
color: rgba(238, 235, 216, .58);
font: 500 10px/1.2 "IBM Plex Mono", monospace;
letter-spacing: .14em;
text-transform: uppercase;
pointer-events: none;
}
body.nav-open .site-head .site-nav a,
body.nav-open .site-head .nav a,
body.nav-open .site-head .bio-nav a {
display: flex !important;
align-items: center !important;
justify-content: flex-start !important;
width: 100% !important;
min-height: clamp(58px, 9.4dvh, 82px) !important;
box-sizing: border-box !important;
margin: 0 !important;
padding: 12px 0 !important;
color: #EEEBD8 !important;
background: transparent !important;
border: 0 !important;
border-bottom: 1px solid rgba(238, 235, 216, .24) !important;
border-radius: 0 !important;
box-shadow: none !important;
font: 900 clamp(34px, 8.4vw, 54px)/.9 "Big Shoulders Display", Impact, sans-serif !important;
letter-spacing: -.015em !important;
text-decoration: none !important;
text-transform: uppercase !important;
white-space: normal !important;
transition: color .16s ease, padding-left .16s ease !important;
}
body.nav-open .site-head .site-nav a:last-child,
body.nav-open .site-head .nav a:last-child,
body.nav-open .site-head .bio-nav a:last-child {
border-bottom: 0 !important;
}
body.nav-open .site-head .site-nav a:hover,
body.nav-open .site-head .site-nav a:focus-visible,
body.nav-open .site-head .nav a:hover,
body.nav-open .site-head .nav a:focus-visible,
body.nav-open .site-head .bio-nav a:hover,
body.nav-open .site-head .bio-nav a:focus-visible {
color: #F4DC3C !important;
background: transparent !important;
padding-left: 10px !important;
outline: none;
}
body.nav-open .site-head .mobile-menu-toggle {
position: fixed !important;
top: max(14px, calc(env(safe-area-inset-top) + 10px)) !important;
right: clamp(16px, 5vw, 28px) !important;
z-index: 5002 !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
min-height: 42px !important;
margin: 0 !important;
padding: 0 13px !important;
color: #0E2619 !important;
background: #F4DC3C !important;
border: 2px solid #EEEBD8 !important;
border-radius: 0 !important;
box-shadow: 3px 3px 0 #EEEBD8 !important;
font: 600 12px "IBM Plex Mono", monospace !important;
text-transform: uppercase !important;
}
}
/* ===== Extracted from nastupi.html: footer-final-alignment ===== */
/* Footer alignment final pass: contact kicker belongs to the right column. */
.booking-end-section{width:100%!important;box-sizing:border-box!important;background:#F4DC3C!important;color:#0E2619!important;padding:clamp(44px,5.6vw,82px) clamp(18px,4vw,52px) 24px!important;margin:0!important;overflow:hidden!important;}
.booking-end-inner{width:100%!important;max-width:1360px!important;margin:0 auto!important;display:flex!important;flex-direction:column!important;gap:clamp(30px,4vw,52px)!important;}
.booking-end-main{width:100%!important;display:grid!important;grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr)!important;align-items:center!important;gap:clamp(30px,5vw,88px)!important;min-width:0!important;}
.booking-end-title{grid-column:1!important;min-width:0!important;margin:0!important;}
.booking-end-title h2{margin:0!important;font:900 clamp(60px,8.7vw,136px)/.8 'Big Shoulders Display',sans-serif!important;letter-spacing:-.025em!important;text-transform:uppercase!important;overflow-wrap:anywhere!important;}
.booking-end-copy{grid-column:2!important;align-self:center!important;min-width:0!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:10px!important;padding:0!important;margin:0!important;}
.booking-end-copy .booking-end-kicker{display:block!important;margin:0 0 2px!important;font:600 11px/1.4 'IBM Plex Mono',monospace!important;letter-spacing:.05em!important;text-transform:uppercase!important;}
.booking-end-copy p{margin:0!important;line-height:1.4!important;}
.booking-end-copy>a{display:inline-block!important;max-width:100%!important;color:#0E2619!important;font-size:clamp(19px,2.2vw,29px)!important;line-height:1.2!important;font-weight:700!important;overflow-wrap:anywhere!important;text-underline-offset:6px!important;}
.booking-end-copy .booking-end-note{margin-top:4px!important;font:11px/1.5 'IBM Plex Mono',monospace!important;text-transform:uppercase!important;}
.booking-end-meta{width:100%!important;box-sizing:border-box!important;margin:0!important;padding:18px 0 0!important;border-top:2px solid #0E2619!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:14px 24px!important;flex-wrap:wrap!important;}
.booking-end-socials{display:flex!important;align-items:center!important;gap:clamp(8px,1.15vw,16px)!important;flex-wrap:wrap!important;min-width:0!important;}
.booking-end-socials>a:not(.booking-end-game){display:inline-flex!important;align-items:center!important;justify-content:center!important;width:28px!important;height:28px!important;color:#0E2619!important;background:transparent!important;text-decoration:none!important;border:0!important;padding:0!important;}
.booking-end-socials>a svg{display:block!important;width:22px!important;height:22px!important;}
.booking-end-copyright{margin-left:auto!important;text-align:right!important;color:#0E2619!important;font:700 10px/1.5 'IBM Plex Mono',monospace!important;white-space:nowrap!important;}
.site-bottom-bar,.site-footer,.bio-footer{display:none!important;visibility:hidden!important;pointer-events:none!important;}
@media(max-width:760px){.booking-end-section{padding:38px 18px calc(22px + env(safe-area-inset-bottom))!important}.booking-end-main{grid-template-columns:minmax(0,1fr)!important;gap:26px!important;align-items:start!important}.booking-end-title,.booking-end-copy{grid-column:1!important}.booking-end-title h2{font-size:clamp(58px,15vw,92px)!important}.booking-end-copy>a{font-size:clamp(18px,5vw,24px)!important}.booking-end-meta{align-items:flex-start!important;flex-direction:row!important;gap:14px!important}.booking-end-socials{gap:10px!important}.booking-end-copyright{margin-left:auto!important;text-align:right!important;white-space:normal!important;max-width:42%!important}}
@media(max-width:420px){.booking-end-meta{align-items:flex-start!important}.booking-end-socials{gap:8px!important}.booking-end-copyright{max-width:100%!important}}
/* ===== Extracted from nastupi.html: booking-cta-frame-and-color-fixes ===== */
/* The cream frame is the CTA's own border, so it always rotates with its green/yellow face. */
.booking-float {
clip-path: none !important;
-webkit-clip-path: none !important;
border: 8px solid #EEEBD8 !important;
outline: 0 !important;
border-radius: 0 !important;
box-shadow: 8px 8px 0 #F4DC3C !important;
transform-origin: 50% 50% !important;
transition: none !important;
}
.booking-float::before,
.booking-float::after { content: none !important; display: none !important; }
.booking-float:hover { box-shadow: 9px 9px 0 #F4DC3C !important; filter: contrast(1.08); }
@media (max-width: 760px) {
.booking-float { border-width: 6px !important; box-shadow: 6px 6px 0 #F4DC3C !important; }
}
/* Event posters: consistent portrait layout, using the event-specific FB image whenever available. */
.event-row { grid-template-columns: 150px 104px minmax(0, 1fr) auto !important; align-items: center !important; }
.event-poster { width: 104px !important; aspect-ratio: 2 / 3 !important; height: auto !important; background: transparent !important; border: 0 !important; padding: 0 !important; overflow: hidden !important; }
.event-poster img { display: block !important; width: 100% !important; height: 100% !important; aspect-ratio: 2 / 3 !important; object-fit: cover !important; object-position: center top !important; background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; }
@media (max-width: 700px) {
.event-row { grid-template-columns: 82px minmax(0, 1fr) !important; grid-template-areas: "poster date" "poster info" "poster cta" !important; align-items: start !important; gap: 6px 13px !important; }
.event-poster { grid-area: poster !important; width: 82px !important; aspect-ratio: 2 / 3 !important; align-self: start !important; }
.event-poster img { width: 100% !important; height: 100% !important; }
}
@media (max-width: 360px) {
.event-row { grid-template-columns: 72px minmax(0, 1fr) !important; column-gap: 10px !important; }
.event-poster { width: 72px !important; }
}
/* ===== Extracted from nastupi.html: final-footer-hover-status-layout-fixes ===== */
/* Success is intentionally quiet on the events page; show the status only when it carries useful state. */
#status[hidden] { display:none !important; }
/* Yellow contact/footer: links flip to a dark-green tile with yellow foreground on hover/focus. */
.booking-end-section a { transition: background-color .12s steps(1,end), color .12s steps(1,end) !important; }
.booking-end-copy > a { display:inline-block !important; padding:5px 8px !important; margin-left:-8px !important; text-decoration-thickness:2px !important; text-underline-offset:5px !important; }
.booking-end-copy > a:hover, .booking-end-copy > a:focus-visible,
.booking-end-section .booking-end-socials > a:hover,
.booking-end-section .booking-end-socials > a:focus-visible {
background:#0E2619 !important; color:#F4DC3C !important;
}
.booking-end-section .booking-end-socials > a:not(.booking-end-game) { border-radius:0 !important; }
.booking-end-section .booking-end-socials > a.booking-end-game { padding:4px 7px !important; box-sizing:border-box !important; }
.booking-end-section .booking-end-socials > a.booking-end-game:hover,
.booking-end-section .booking-end-socials > a.booking-end-game:focus-visible { background:#0E2619 !important; color:#F4DC3C !important; }
.booking-end-section .booking-end-socials > a.booking-end-game:hover img { filter:none !important; }
.booking-end-section .booking-end-copyright { background:transparent !important; }
/* Do not add a shadow behind the booking sticker: the changing face is the only colour block. */
.booking-float, .booking-float:hover, .booking-float:focus-visible { box-shadow:none !important; }
/* Keep all main content containers on the same centred width. Background colours remain full bleed. */
.home-about-wrap, #nastupi > div, #solo > div, #projekti > div, #shop > div, #kontakt > div, .booking-end-inner {
width:100% !important; max-width:1200px !important; margin-left:auto !important; margin-right:auto !important; box-sizing:border-box !important;
}
@media (max-width:760px) {
.home-about-wrap { padding-left:18px !important; padding-right:18px !important; }
#nastupi > div, #solo > div, #projekti > div, #shop > div, #kontakt > div { padding-left:18px !important; padding-right:18px !important; }
}
/* Hero nav keeps its green label block for readability but no shadow/blur. */
body:not(.nav-solid) .site-head,
body:not(.nav-solid) .site-head .site-nav,
body:not(.nav-solid) .site-head .site-nav a {
box-shadow:none !important; text-shadow:none !important; filter:none !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
}
/* Carousel dots belong only on the mobile layout. */
.carousel-dots, #solo-show-dots, #merch-dots, #projects-dots { display:none !important; }
@media (max-width:760px) {
.carousel-dots, #solo-show-dots, #merch-dots, #projects-dots { display:flex !important; }
}
/* ===== Extracted from nastupi.html: rough-image-edges-no-tape-or-added-frames ===== */
/* Keep the header crisp in every state: no shadow, blur, or translucent overlay. */
.site-head,
.site-head::before,.site-head::after,.site-head *,
.site-head *::before,.site-head *::after,
.site-head .site-nav, body.nav-solid .site-head, body.nav-solid .site-head .site-nav,
body:not(.nav-solid) .site-head .site-nav, body.nav-open .site-head .site-nav,
.bio-header,.bio-header::before,.bio-header::after,.bio-header *,
.bio-header *::before,.bio-header *::after,.bio-nav,.bio-nav a,.bio-nav.is-open,
.mobile-menu-toggle {
box-shadow:none !important;
-webkit-box-shadow:none !important;
text-shadow:none !important;
filter:none !important;
backdrop-filter:none !important;
-webkit-backdrop-filter:none !important;
}
body:not(.nav-solid) .site-head .site-nav,
body.nav-solid .site-head .site-nav { box-shadow:none !important; filter:none !important; backdrop-filter:none !important; }
/* Remove the recently-added masking tape, picture mats and decorative outlines. */
#solo .solo-show-grid > article > .card,
#projekti .rail .card,
#projekti > div > article > .card,
#shop .merch-gallery > div > a,
#shop .merch-gallery > div > a > div,
.poster-frame,
.gallery-item,
.event-poster,
.bio-intro > img,
.photo-story img,
.bio-gallery figure {
outline:0 !important;
border:0 !important;
box-shadow:none !important;
background:transparent !important;
}
#solo .solo-show-grid > article > .card,
#projekti .rail .card,
#projekti > div > article > .card,
#shop .merch-gallery > div > a,
.poster-frame,
.event-poster {
transform:none !important;
}
#solo .solo-show-grid > article > .card::before,
#solo .solo-show-grid > article > .card::after,
#projekti .rail .card::before,
#projekti .rail .card::after,
#projekti > div > article > .card::before,
#projekti > div > article > .card::after,
#shop .merch-gallery > div > a::before,
#shop .merch-gallery > div > a::after,
.poster-frame::before,.poster-frame::after,
.gallery-item::before,.gallery-item::after,
.photo-story::before,.photo-story::after,
.bio-gallery figure::before,.bio-gallery figure::after {
content:none !important;
display:none !important;
}
/* Fanzine/video-section look: full-bleed imagery with a slightly torn edge, no extra frame. */
:root { --rough-image-edge: polygon(
.7% 1%, 7% .2%, 13% .8%, 20% .1%, 27% .7%, 34% .2%, 41% .8%, 49% .1%,
57% .7%, 65% .2%, 73% .8%, 81% .1%, 89% .7%, 96% .2%, 99.6% .8%,
100% 7%, 99.3% 14%, 100% 22%, 99.2% 30%, 100% 38%, 99.3% 47%, 100% 55%,
99.2% 64%, 100% 72%, 99.3% 81%, 100% 90%, 99.2% 98.8%, 92% 100%, 84% 99.2%,
76% 100%, 68% 99.2%, 60% 100%, 52% 99.2%, 44% 100%, 36% 99.2%, 28% 100%,
20% 99.2%, 12% 100%, 4% 99.2%, .3% 100%, 0 92%, .7% 84%, 0 76%, .7% 68%,
0 60%, .7% 51%, 0 43%, .7% 34%, 0 26%, .7% 17%, 0 9%
); }
#solo .solo-show-grid > article > .card > img,
#projekti .rail .card > img,
#projekti > div > article > .card > img,
#shop .merch-gallery > div > a > div > img,
.poster-frame > img,
.gallery-item > img,
.event-poster > img,
.bio-intro > img,
.photo-story > img,
.bio-gallery figure > img {
display:block !important;
border:0 !important;
outline:0 !important;
box-shadow:none !important;
background:transparent !important;
border-radius:0 !important;
clip-path:var(--rough-image-edge) !important;
}
#solo .solo-show-grid > article > .card > img,
#projekti .rail .card > img,
#projekti > div > article > .card > img,
#shop .merch-gallery > div > a > div > img {
width:100% !important;
max-width:100% !important;
}
#solo .solo-show-grid > article > .card > img { object-position:center !important; }
#projekti .rail .card > img { object-fit:contain !important; }
#shop .merch-gallery > div > a > div { overflow:visible !important; }
#shop .merch-gallery > div > a > div > img { object-fit:contain !important; }
.poster-frame { overflow:visible !important; padding:0 !important; }
.poster-frame > img { width:100% !important; max-width:100% !important; height:auto !important; object-fit:contain !important; }
/* Gallery thumbnails look like cropped video stills, not polaroids. */
.gallery-item {
box-sizing:border-box !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
width:100% !important;
min-height:0 !important;
height:clamp(220px,27vw,410px) !important;
padding:0 !important;
margin:0 !important;
border:0 !important;
outline:0 !important;
background:transparent !important;
box-shadow:none !important;
overflow:visible !important;
transform:none !important;
}
.gallery-item > img { width:100% !important; height:100% !important; max-height:none !important; object-fit:cover !important; }
.gallery-item:focus-visible,
#solo .solo-show-grid > article > .card:focus-visible,
#projekti .rail .card:focus-visible,
#projekti > div > article > .card:focus-visible { outline:2px solid var(--zine-yellow,#F4DC3C) !important; outline-offset:5px !important; }
/* Biography and show-detail photos use the same edge treatment without paper mats. */
.bio-intro > img,.photo-story > img { width:100% !important; border:0 !important; box-shadow:none !important; }
.bio-gallery figure { margin:0 !important; padding:0 !important; border:0 !important; outline:0 !important; background:transparent !important; box-shadow:none !important; transform:none !important; }
.bio-gallery figure > img { display:block !important; width:100% !important; height:auto !important; aspect-ratio:4/3; object-fit:cover !important; }
.bio-gallery figcaption { padding:8px 0 0 !important; color:inherit !important; background:transparent !important; }
.event-poster { outline:0 !important; border:0 !important; padding:0 !important; background:transparent !important; overflow:visible !important; }
.event-poster > img { width:100% !important; height:100% !important; object-fit:cover !important; object-position:center top !important; }
@media (max-width:760px) {
.gallery-item { height:clamp(210px,72vw,340px) !important; }
#shop .merch-gallery > div > a > div { overflow:visible !important; }
}
@media (prefers-reduced-motion:reduce) {
#solo .solo-show-grid > article > .card,
#projekti .rail .card,
#projekti > div > article > .card,
.gallery-item { scroll-behavior:auto !important; transition:none !important; }
}
/* ===== Extracted from nastupi.html: image-variation-black-borders-and-hover-fixes-20261030 ===== */
/* Slightly different cut edges for each image family: one visual language, not identical clones. */
:root {
--image-ink:#FFFFFF;
--cut-a:polygon(0 1.5%,12% 0,25% 1%,39% 0,52% 1.2%,65% 0,78% 1%,100% 0,99% 17%,100% 31%,99% 46%,100% 60%,99% 74%,100% 88%,99% 100%,80% 99%,64% 100%,46% 99%,28% 100%,14% 99%,0 100%,1% 84%,0 68%,1% 50%,0 34%,1% 18%);
--cut-b:polygon(0 0,15% 1.5%,29% 0,43% 1.2%,58% 0,73% 1%,87% 0,100% 2%,98.8% 14%,100% 27%,98.8% 41%,100% 58%,99% 71%,100% 87%,98.4% 100%,83% 98.8%,69% 100%,54% 98.8%,38% 100%,22% 98.8%,0 100%,1.2% 84%,0 70%,1.2% 55%,0 40%,1.2% 25%,0 10%);
--cut-c:polygon(1.5% 0,26% 1%,39% 0,56% 1.5%,72% 0,99% 2%,100% 25%,98% 34%,100% 51%,98% 68%,100% 83%,98% 100%,76% 98.5%,63% 100%,43% 98%,29% 100%,0 97%,1% 78%,0 62%,1% 48%,0 31%,1% 15%);
--cut-d:polygon(0 2%,20% 0,35% 1.8%,49% 0,68% 1%,82% 0,100% 1%,98.5% 19%,100% 37%,98% 53%,100% 73%,98.5% 99%,78% 100%,61% 98.4%,44% 100%,27% 98.7%,1% 100%,0 81%,1.5% 62%,0 45%,1.5% 27%);
}
/* Cards remain flush to the poster; the black contour belongs to the image itself. */
#solo .solo-show-grid > article > .card,
#projekti .rail .card,
#projekti > div > article > .card,
#shop .merch-gallery > div > a,
#shop .merch-gallery > div > a > div,
.poster-frame,
.event-poster,
.gallery-item {
border:0 !important;
outline:0 !important;
box-shadow:none !important;
background:transparent !important;
}
#solo .solo-show-grid > article > .card,
#projekti .rail .card,
#projekti > div > article > .card { padding:0 !important; overflow:visible !important; }
#projekti .rail .card { background:transparent !important; }
#solo .solo-show-grid > article > .card > img,
#projekti .rail .card > img,
#projekti > div > article > .card > img,
#shop .merch-gallery > div > a > div > img,
.poster-frame > img,
.event-poster > img,
.gallery-item > img,
.about-collage .about-photo > img,
.bio-intro > img,
.photo-story > img,
.bio-gallery figure > img,
#merch-image {
box-sizing:border-box !important;
border:4px solid var(--image-ink) !important;
outline:0 !important;
box-shadow:none !important;
border-radius:0 !important;
background:transparent !important;
filter:none !important;
}
/* Solo posters: each has a subtly different hand-cut contour and angle. */
#solo .solo-show-grid > article:nth-child(3n + 1) > .card > img { clip-path:var(--cut-a) !important; transform:rotate(-.25deg) !important; }
#solo .solo-show-grid > article:nth-child(3n + 2) > .card > img { clip-path:var(--cut-b) !important; transform:rotate(.3deg) !important; }
#solo .solo-show-grid > article:nth-child(3n) > .card > img { clip-path:var(--cut-c) !important; transform:rotate(-.15deg) !important; }
/* Group projects: more vertical side cuts, alternating across the rail. */
#projekti .rail .card:nth-child(3n + 1) > img { clip-path:var(--cut-b) !important; transform:rotate(-.35deg) !important; }
#projekti .rail .card:nth-child(3n + 2) > img { clip-path:var(--cut-d) !important; transform:rotate(.25deg) !important; }
#projekti .rail .card:nth-child(3n) > img { clip-path:var(--cut-a) !important; transform:rotate(-.2deg) !important; }
#projekti > div > article > .card > img { clip-path:var(--cut-c) !important; }
/* Merch product shots and individual show posters use their own cut. */
#shop .merch-gallery > div:nth-child(3n + 1) > a > div > img { clip-path:var(--cut-d) !important; }
#shop .merch-gallery > div:nth-child(3n + 2) > a > div > img { clip-path:var(--cut-a) !important; }
#shop .merch-gallery > div:nth-child(3n) > a > div > img { clip-path:var(--cut-b) !important; }
.poster-frame > img { clip-path:var(--cut-b) !important; }
.event-poster:nth-child(4n + 1) > img { clip-path:var(--cut-a) !important; }
.event-poster:nth-child(4n + 2) > img { clip-path:var(--cut-c) !important; }
.event-poster:nth-child(4n + 3) > img { clip-path:var(--cut-d) !important; }
.event-poster:nth-child(4n) > img { clip-path:var(--cut-b) !important; }
#merch-image { clip-path:var(--cut-d) !important; }
/* Home "A tko sam ja?": remove the old white polaroid mat; keep the collage positioning, but vary each black-edged photo. */
.home-about .about-photo,
.about-collage .about-photo,
.home-about .about-photo--framed {
background:transparent !important;
padding:0 !important;
border:0 !important;
box-shadow:none !important;
overflow:visible !important;
}
.home-about .about-photo--framed img,
.about-collage .about-photo > img {
position:absolute !important;
top:0 !important;
left:0 !important;
width:100% !important;
height:100% !important;
object-fit:cover !important;
padding:0 !important;
}
.about-collage .about-photo[data-slot="left"] > img { clip-path:var(--cut-a) !important; border-width:4px !important; }
.about-collage .about-photo[data-slot="center"] > img { clip-path:var(--cut-c) !important; border-width:5px !important; }
.about-collage .about-photo[data-slot="right"] > img { clip-path:var(--cut-b) !important; border-width:3px !important; }
.home-about .about-photo[data-slot="left"] { transform:rotate(-6deg) !important; }
.home-about .about-photo[data-slot="center"] { transform:rotate(1.8deg) !important; }
.home-about .about-photo[data-slot="right"] { transform:rotate(5deg) !important; }
/* Full biography photographs: different cuts by editorial role; black borders only, no white mats or yellow offset shadows. */
.bio-intro > img { clip-path:var(--cut-a) !important; border-width:5px !important; }
.photo-story:not(.reverse) > img { clip-path:var(--cut-d) !important; border-width:4px !important; }
.photo-story.reverse > img { clip-path:var(--cut-b) !important; border-width:5px !important; }
.bio-gallery figure { background:transparent !important; border:0 !important; padding:0 !important; box-shadow:none !important; }
.bio-gallery figure:nth-child(4n + 1) > img { clip-path:var(--cut-a) !important; }
.bio-gallery figure:nth-child(4n + 2) > img { clip-path:var(--cut-b) !important; }
.bio-gallery figure:nth-child(4n + 3) > img { clip-path:var(--cut-c) !important; }
.bio-gallery figure:nth-child(4n) > img { clip-path:var(--cut-d) !important; }
/* Show photo gallery: every thumbnail has a black edge, with contour variation rather than a generic rectangle. */
.gallery-item { overflow:visible !important; padding:0 !important; background:transparent !important; }
.gallery-item:nth-child(4n + 1) > img { clip-path:var(--cut-a) !important; }
.gallery-item:nth-child(4n + 2) > img { clip-path:var(--cut-c) !important; }
.gallery-item:nth-child(4n + 3) > img { clip-path:var(--cut-d) !important; }
.gallery-item:nth-child(4n) > img { clip-path:var(--cut-b) !important; }
.lightbox-image-wrap img, .lightbox img { border:4px solid var(--image-ink) !important; clip-path:none !important; box-sizing:border-box !important; }
/* Booking sticker uses a thicker white contour; no duplicate shadow/backplate. */
.booking-float {
border:9px solid #FFFFFF !important;
outline:0 !important;
box-shadow:none !important;
border-radius:0 !important;
clip-path:polygon(1% 2%,18% 0,41% 1.2%,58% 0,83% 2%,100% 0,99% 24%,100% 49%,98.5% 70%,100% 98%,78% 100%,56% 98%,39% 100%,16% 98%,0 100%,1.2% 74%,0 53%,1% 28%) !important;
transition:none !important;
filter:none !important;
}
.booking-float::before, .booking-float::after { content:none !important; display:none !important; }
.booking-float:hover, .booking-float:focus-visible { box-shadow:none !important; filter:none !important; transition:none !important; }
/* Footer links swap immediately to green background + yellow foreground. */
.booking-end-section .booking-end-socials > a,
.booking-end-section .booking-end-copy > a,
.site-footer a, .bio-footer a {
transition:none !important;
animation:none !important;
}
.booking-end-section .booking-end-socials > a {
box-sizing:border-box !important;
border:1px solid transparent !important;
border-radius:0 !important;
background:transparent !important;
color:#0E2619 !important;
transform:none !important;
padding:3px 5px !important;
}
.booking-end-section .booking-end-socials > a:hover,
.booking-end-section .booking-end-socials > a:focus-visible,
.booking-end-section .booking-end-copy > a:hover,
.booking-end-section .booking-end-copy > a:focus-visible,
.site-footer a:hover, .site-footer a:focus-visible,
.bio-footer a:hover, .bio-footer a:focus-visible {
background:#0E2619 !important;
color:#F4DC3C !important;
border-color:#0E2619 !important;
text-decoration:none !important;
transform:none !important;
transition:none !important;
}
.booking-end-section .booking-end-socials > a svg { color:inherit !important; }
.booking-end-section .booking-end-socials > a.booking-end-game { padding:4px 7px !important; gap:6px !important; }
.booking-end-section .booking-end-socials > a.booking-end-game img { border:0 !important; clip-path:none !important; }
/* Navbar hover: instant yellow background and dark-green text. */
.site-head nav a, .site-nav a, .bio-header nav a, .bio-nav a, header .nav a {
transition: none !important;
box-shadow: none !important;
text-shadow: none !important;
}
.site-head nav a:hover, .site-head nav a:focus-visible,
.site-nav a:hover, .site-nav a:focus-visible,
.bio-header nav a:hover, .bio-header nav a:focus-visible,
.bio-nav a:hover, .bio-nav a:focus-visible,
header .nav a:hover, header .nav a:focus-visible {
background: #F4DC3C !important;
color: #0E2619 !important;
border-color: #F4DC3C !important;
box-shadow: none !important;
text-shadow: none !important;
transition: none !important;
}
@media(max-width:760px) {
#solo .solo-show-grid > article > .card > img,
#projekti .rail .card > img,
#projekti > div > article > .card > img,
#shop .merch-gallery > div > a > div > img,
.poster-frame > img, .event-poster > img, .gallery-item > img,
.about-collage .about-photo > img, .bio-intro > img,
.photo-story > img, .bio-gallery figure > img, #merch-image { border-width:3px !important; }
.booking-float { border-width:6px !important; }
}
@media(prefers-reduced-motion:reduce) {
.site-head nav a, .bio-header nav a, header .site-nav a, header .nav a, .bio-nav a,
.booking-end-section .booking-end-socials > a,
.booking-end-section .booking-end-copy > a { transition:none !important; }
}
/* ===== Extracted from nastupi.html: booking-cta-hover-inverse-third-palette ===== */
/* CTA palette sequence: green/yellow, yellow/green, green/cream. Hover/focus inverses each pair. */
.booking-float { cursor:pointer !important; transition:none !important; }
.booking-float:hover, .booking-float:focus-visible { filter:none !important; box-shadow:none !important; outline:none !important; }
.booking-float .booking-rotator { color:inherit !important; }
@media (prefers-reduced-motion: reduce) {
.booking-float { animation:none !important; transition:none !important; }
}
/* ===== Extracted from nastupi.html: images-no-added-border-keep-booking-cta-white ===== */
/* Images should end at their own cut edge: no white/black frame or extra shadow. */
#solo .solo-show-grid > article > .card > img,
#projekti .rail .card > img,
#projekti > div > article > .card > img,
#shop .merch-gallery > div > a > div > img,
.poster-frame > img,
.event-poster > img,
.gallery-item > img,
.about-collage .about-photo > img,
.home-about .about-photo--framed img,
.bio-intro > img,
.photo-story > img,
.bio-gallery figure > img,
#merch-image,
.lightbox-image-wrap img,
.lightbox img {
border: 0 !important;
outline: 0 !important;
box-shadow: none !important;
background: transparent !important;
}
/* Keep the rough, varied image cuts, but don't simulate a border around them. */
#solo .solo-show-grid > article > .card,
#projekti .rail .card,
#projekti > div > article > .card,
#shop .merch-gallery > div > a,
#shop .merch-gallery > div > a > div,
.poster-frame,
.event-poster,
.gallery-item,
.bio-gallery figure {
border: 0 !important;
outline: 0 !important;
box-shadow: none !important;
background: transparent !important;
}
#about-collage .about-photo[data-slot="left"] > img,
#about-collage .about-photo[data-slot="center"] > img,
#about-collage .about-photo[data-slot="right"] > img,
.about-collage .about-photo[data-slot="left"] > img,
.about-collage .about-photo[data-slot="center"] > img,
.about-collage .about-photo[data-slot="right"] > img,
.photo-story:not(.reverse) > img,
.photo-story.reverse > img {
border: 0 !important;
}
/* The bottom-right booking CTA intentionally keeps its thick white border. */
.booking-float {
border: 9px solid #FFFFFF !important;
}
@media (max-width:760px) {
.booking-float { border-width: 6px !important; }
}
/* ===== Extracted from nastupi.html: final-navbar-hover-green-bold ===== */
/* Hover/keyboard-focus item: yellow tab, bold dark-green text, instant change. */
body:not(.nav-solid) .site-head .site-nav a:hover,
body:not(.nav-solid) .site-head .site-nav a:focus-visible,
body.nav-solid .site-head .site-nav a:hover,
body.nav-solid .site-head .site-nav a:focus-visible,
body.nav-open .site-head .site-nav a:hover,
body.nav-open .site-head .site-nav a:focus-visible,
.site-head .site-nav a:hover,
.site-head .site-nav a:focus-visible,
.bio-header .bio-nav a:hover,
.bio-header .bio-nav a:focus-visible,
.bio-nav a:hover,
.bio-nav a:focus-visible,
header .nav a:hover,
header .nav a:focus-visible,
.nav a:hover,
.nav a:focus-visible {
background-color: #F4DC3C !important;
color: #0E2619 !important;
font-weight: 800 !important;
text-shadow: none !important;
box-shadow: none !important;
transition: none !important;
}
body:not(.nav-solid) .site-head .site-nav a:hover *,
body:not(.nav-solid) .site-head .site-nav a:focus-visible *,
body.nav-solid .site-head .site-nav a:hover *,
body.nav-solid .site-head .site-nav a:focus-visible *,
.site-head .site-nav a:hover *,
.site-head .site-nav a:focus-visible *,
.bio-nav a:hover *, .bio-nav a:focus-visible *,
header .nav a:hover *, header .nav a:focus-visible *,
.nav a:hover *, .nav a:focus-visible * {
color: #0E2619 !important;
font-weight: 800 !important;
text-shadow: none !important;
}
/* ===== Extracted from nastupi.html: final-section-edge-visibility-fix ===== */
/* Final cross-page torn-edge visibility fix: keep edges visible above the preceding colour block. */
:root { --edge-cream:#EEEBD8; --edge-yellow:#F4DC3C; --edge-green:#0E2619; }
.booking-end-section {
position:relative !important;
isolation:isolate !important;
overflow:visible !important;
z-index:20 !important;
}
.booking-end-section::before {
content:"" !important;
display:block !important;
position:absolute !important;
left:0 !important; right:0 !important;
top:-27px !important;
height:54px !important;
z-index:1 !important;
pointer-events:none !important;
background-color:var(--edge-yellow) !important;
background-image:radial-gradient(circle,rgba(14,38,25,.07) .65px,transparent 1px) !important;
background-size:10px 12px !important;
clip-path:polygon(0 43%,3% 30%,6% 46%,10% 32%,14% 42%,18% 25%,22% 40%,26% 31%,30% 48%,34% 33%,38% 44%,42% 27%,47% 41%,51% 30%,55% 47%,59% 32%,63% 42%,67% 26%,72% 41%,76% 31%,80% 47%,85% 30%,89% 43%,93% 26%,97% 40%,100% 32%,100% 100%,0 100%) !important;
}
.booking-end-inner { position:relative !important; z-index:2 !important; }
@media(max-width:760px) {
.booking-end-section::before { top:-17px !important; height:34px !important; }
}
/* All-events page: stack the yellow contact paper above the cream list so its torn edge is visible. */
main { position:relative !important; isolation:isolate !important; z-index:1 !important; overflow:visible !important; }
main > * { position:relative; z-index:1; }
.booking-end-section { z-index:5 !important; }
.booking-end-section::before { z-index:1 !important; }
/* ===== Extracted from nastupi.html: subpage-booking-torn-edge-fix-20261030 ===== */
/* SUBPAGES: make the booking band itself carry the torn-paper edge.
This avoids relying on a pseudo-element escaping the previous section's stacking context. */
.booking-end-section {
position: relative !important;
overflow: visible !important;
isolation: isolate !important;
margin-top: -25px !important;
padding-top: calc(clamp(44px, 5.6vw, 82px) + 25px) !important;
clip-path: polygon(
0 22px, 3% 11px, 6% 20px, 10% 13px, 14% 19px, 18% 9px,
22% 18px, 26% 12px, 30% 21px, 34% 13px, 38% 19px, 42% 10px,
47% 18px, 51% 12px, 55% 20px, 59% 13px, 63% 18px, 67% 9px,
72% 18px, 76% 12px, 80% 20px, 85% 11px, 89% 19px, 93% 10px,
97% 18px, 100% 12px, 100% 100%, 0 100%
) !important;
}
.booking-end-section::before { display: none !important; }
.booking-end-inner { position: relative !important; z-index: 2 !important; }
@media (max-width: 760px) {
.booking-end-section {
margin-top: -16px !important;
padding-top: calc(38px + 16px) !important;
clip-path: polygon(
0 15px, 8% 7px, 16% 13px, 25% 8px, 34% 14px, 43% 7px,
52% 13px, 61% 8px, 70% 14px, 79% 7px, 88% 13px, 100% 8px,
100% 100%, 0 100%
) !important;
}
}
/* ===== Extracted from nastupi.html: booking-cta-rotation-only ===== */
/* Bottom-right CTA: on hover/focus, only tilt to the opposite side. No color, scale, shadow or filter effect. */
.booking-float {
transition: transform .24s cubic-bezier(.2,.8,.2,1) !important;
}
.booking-float:hover,
.booking-float:focus-visible {
box-shadow: none !important;
filter: none !important;
outline: none !important;
}
/* ===== Extracted from nastupi.html: events-desktop-date-spacing-and-show-title-20261030 ===== */
/* All-events list polish: only widen the date track on desktop, leaving the
mobile date/poster arrangement untouched. */
@media (min-width: 701px) {
#events .event-row {
grid-template-columns: 164px 104px minmax(0, 1fr) auto !important;
}
#events .event-row.event-row--facebook-cover {
grid-template-columns: 164px 168px minmax(0, 1fr) auto !important;
}
#events .event-show {
font-size: 19px !important;
line-height: 1.25 !important;
font-weight: 600 !important;
}
}
@media (max-width: 700px) {
#events .event-show {
font-size: 17px !important;
line-height: 1.28 !important;
font-weight: 600 !important;
}
}
@media (max-width: 360px) {
#events .event-show { font-size: 16px !important; }
}
/* ===== Extracted from nastupi.html: mobile-all-events-layout-fix-20261030 ===== */
/* All events: date occupies a separate row; poster and event details align beneath it. */
@media (max-width:700px) {
#events .event-row {
display:grid !important;
grid-template-columns:74px minmax(0,1fr) !important;
grid-template-areas:"date date" "poster info" "poster cta" !important;
align-items:start !important;
gap:7px 13px !important;
padding:20px 0 !important;
min-width:0 !important;
max-width:100% !important;
}
#events .event-date {
grid-area:date !important;
grid-column:1 / -1 !important;
grid-row:auto !important;
width:100% !important;
min-width:0 !important;
max-width:100% !important;
font-size:clamp(29px,8vw,36px) !important;
line-height:.92 !important;
white-space:normal !important;
overflow-wrap:normal !important;
}
#events .event-poster {
grid-area:poster !important;
width:74px !important;
max-width:100% !important;
height:auto !important;
aspect-ratio:2 / 3 !important;
margin:0 !important;
}
#events .event-info {
grid-area:info !important;
width:100% !important;
min-width:0 !important;
max-width:100% !important;
overflow-wrap:anywhere !important;
}
#events .event-city { font-size:10px !important; line-height:1.25 !important; }
#events .event-venue, #events .event-show { font-size:14px !important; line-height:1.35 !important; overflow-wrap:anywhere !important; }
#events .event-cta {
grid-area:cta !important;
justify-self:start !important;
min-width:0 !important;
min-height:38px !important;
margin:2px 0 0 !important;
padding:0 12px !important;
white-space:nowrap !important;
}
}
@media (max-width:380px) {
#events .event-row { grid-template-columns:66px minmax(0,1fr) !important; column-gap:10px !important; }
#events .event-poster { width:66px !important; }
#events .event-date { font-size:clamp(27px,8vw,32px) !important; }
}
/* ===== Extracted from nastupi.html: navbar-two-state-edge-20261030 ===== */
/* Subpages always start in the homepage's full navbar state. Keep the same type, rhythm and edges. */
body.subpage-page .site-head {
position: sticky !important;
top: 0 !important;
z-index: 2400 !important;
display: block !important;
width: 100% !important;
margin: 0 !important;
padding: 16px 32px !important;
box-sizing: border-box !important;
color: #EEEBD8 !important;
background: #0E2619 !important;
border: 0 !important;
border-radius: 0 !important;
box-shadow: none !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
transition: none !important;
isolation: isolate !important;
}
body.subpage-page .site-head::after {
content: "" !important;
position: absolute !important;
left: 32px !important;
right: 32px !important;
bottom: 0 !important;
height: 1px !important;
pointer-events: none !important;
background: repeating-linear-gradient(
90deg,
rgba(238,235,216,.48) 0 3px,
transparent 3px 8px
) !important;
z-index: 5 !important;
}
body.subpage-page .site-head .head-row {
position: relative !important;
width: 100% !important;
max-width: 1360px !important;
min-height: 38px !important;
margin: 0 auto !important;
padding: 0 !important;
box-sizing: border-box !important;
display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
align-items: center !important;
justify-content: space-between !important;
gap: 10px 32px !important;
}
body.subpage-page .site-head .wordmark {
display: inline-flex !important;
align-items: center !important;
flex: 0 0 auto !important;
margin: 0 !important;
padding: 6px 12px !important;
color: #F4DC3C !important;
background: #0E2619 !important;
font-family: 'Big Shoulders Display', sans-serif !important;
font-size: 26px !important;
font-weight: 900 !important;
line-height: 1 !important;
letter-spacing: .01em !important;
text-transform: uppercase !important;
text-decoration: none !important;
white-space: nowrap !important;
opacity: 1 !important;
visibility: visible !important;
transform: none !important;
pointer-events: auto !important;
transition: none !important;
}
body.subpage-page .site-head .nav,
body.subpage-page .site-head .site-nav {
position: static !important;
display: flex !important;
flex: 0 1 auto !important;
flex-direction: row !important;
flex-wrap: wrap !important;
align-items: center !important;
justify-content: flex-end !important;
gap: 2px 0 !important;
margin: 0 !important;
padding: 6px 8px !important;
color: #EEEBD8 !important;
background: #0E2619 !important;
border: 0 !important;
border-radius: 0 !important;
box-shadow: none !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 14px !important;
line-height: 1.2 !important;
text-transform: uppercase !important;
letter-spacing: .04em !important;
}
body.subpage-page .site-head .nav a,
body.subpage-page .site-head .site-nav a {
display: inline-flex !important;
align-items: center !important;
margin: 0 !important;
padding: 4px 10px !important;
color: #EEEBD8 !important;
background: transparent !important;
border: 0 !important;
font-family: 'IBM Plex Mono', monospace !important;
font-size: 14px !important;
font-weight: 500 !important;
line-height: 1.2 !important;
letter-spacing: .04em !important;
text-decoration: none !important;
text-transform: uppercase !important;
white-space: nowrap !important;
transition: background .12s steps(1,end), color .12s steps(1,end) !important;
}
body.subpage-page .site-head .nav a:hover,
body.subpage-page .site-head .nav a:focus-visible,
body.subpage-page .site-head .site-nav a:hover,
body.subpage-page .site-head .site-nav a:focus-visible {
color: #0E2619 !important;
background: #F4DC3C !important;
}
body.subpage-page .site-head .mobile-menu-toggle {
display: none !important;
margin: 0 0 0 auto !important;
padding: 9px 12px !important;
color: #F4DC3C !important;
background: #0E2619 !important;
border: 2px solid #EEEBD8 !important;
border-radius: 0 !important;
box-shadow: 3px 3px 0 #F4DC3C !important;
font: 600 12px 'IBM Plex Mono', monospace !important;
text-transform: uppercase !important;
}
@media (max-width: 760px) {
body.subpage-page .site-head {
padding: 10px 14px !important;
}
body.subpage-page .site-head .head-row {
min-height: 33px !important;
flex-wrap: nowrap !important;
align-items: center !important;
gap: 10px !important;
}
body.subpage-page .site-head .wordmark {
padding: 6px 12px !important;
font-size: 21px !important;
}
body.subpage-page .site-head .mobile-menu-toggle {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 8px !important;
}
body.subpage-page .site-head .nav,
body.subpage-page .site-head .site-nav {
position: absolute !important;
top: calc(100% + 9px) !important;
left: 0 !important;
right: 0 !important;
z-index: 100 !important;
display: none !important;
flex-direction: column !important;
flex-wrap: nowrap !important;
align-items: stretch !important;
justify-content: flex-start !important;
gap: 2px !important;
padding: 10px !important;
background: #0E2619 !important;
border: 2px solid #EEEBD8 !important;
box-shadow: 4px 4px 0 #F4DC3C !important;
}
body.nav-open.subpage-page .site-head .nav,
body.nav-open.subpage-page .site-head .site-nav {
display: flex !important;
}
body.subpage-page .site-head .nav a,
body.subpage-page .site-head .site-nav a {
display: flex !important;
width: 100% !important;
min-height: 40px !important;
padding: 12px !important;
border-bottom: 1px solid rgba(238,235,216,.22) !important;
font-size: 13px !important;
}
body.subpage-page .site-head .nav a:last-child,
body.subpage-page .site-head .site-nav a:last-child {
border-bottom: 0 !important;
}
body.subpage-page .site-head::after {
left: 14px !important;
right: 14px !important;
}
}
@media (prefers-reduced-motion: reduce) {
body.subpage-page .site-head,
body.subpage-page .site-head * { transition: none !important; }
}
/* ===== Extracted from nastupi.html: final-mobile-hero-and-global-navbar-edge-20261030 ===== */
/* MOBILE HERO: slightly tighter crop, shifted upward and to the right. */
@media (max-width: 760px) {
.hero-img-tall {
transform: translate(3.5%, -8.5%) scale(1.58) !important;
transform-origin: 50% 50% !important;
}
/* Keep Lily's tap target aligned with her head after the revised mobile crop. */
.lily-trigger-tall {
left: 64.5% !important;
top: 16.5% !important;
width: 30% !important;
height: 20% !important;
}
}
/* GLOBAL NAVBAR: straight top edge, irregular paper cut ONLY along the bottom. */
.site-head {
overflow: visible !important;
isolation: isolate !important;
}
body.nav-solid .site-head,
body.subpage-page .site-head {
border-bottom: 0 !important;
box-shadow: none !important;
}
.site-head > div {
position: relative !important;
z-index: 3 !important;
}
.site-head::after {
content: none !important;
display: none !important;
}
body.nav-solid .site-head::after,
body.subpage-page .site-head::after {
content: "" !important;
display: block !important;
position: absolute !important;
left: 0 !important;
right: 0 !important;
bottom: -11px !important;
height: 12px !important;
opacity: 1 !important;
pointer-events: none !important;
z-index: 2 !important;
background-color: #0E2619 !important;
background-image:
radial-gradient(circle, rgba(238,235,216,.06) .65px, transparent .98px),
radial-gradient(circle, rgba(0,0,0,.10) .6px, transparent .95px) !important;
background-size: 9px 11px, 17px 19px !important;
background-position: 2px 2px, 6px 8px !important;
clip-path: polygon(
0 0, 100% 0, 100% 54%, 97% 91%, 94% 59%, 90% 96%,
86% 55%, 82% 94%, 78% 62%, 74% 91%, 70% 54%, 66% 98%,
62% 57%, 58% 93%, 54% 55%, 50% 97%, 46% 60%, 42% 92%,
38% 55%, 34% 98%, 30% 61%, 26% 91%, 22% 56%, 18% 96%,
14% 58%, 10% 92%, 6% 55%, 3% 95%, 0 57%
) !important;
}
/* The front-page nav stays transparent over the hero; its torn edge appears with the solid state. */
body:not(.nav-solid):not(.subpage-page) .site-head::after {
content: none !important;
display: none !important;
}
@media (max-width: 760px) {
body.nav-solid .site-head::after,
body.subpage-page .site-head::after {
bottom: -9px !important;
height: 10px !important;
clip-path: polygon(
0 0, 100% 0, 100% 54%, 96% 93%, 91% 58%, 86% 96%,
81% 55%, 76% 94%, 71% 58%, 66% 96%, 61% 55%, 56% 94%,
51% 57%, 46% 96%, 41% 55%, 36% 94%, 31% 57%, 26% 95%,
21% 55%, 16% 94%, 11% 57%, 6% 95%, 3% 56%, 0 92%
) !important;
}
}
/* ===== Extracted from nastupi.html: facebook-event-cover-horizontal-layout-20261030 ===== */
/* Facebook event covers are landscape photographs, not portrait posters. */
#events .event-row.event-row--facebook-cover {
grid-template-columns: 150px 168px minmax(0,1fr) auto !important;
}
#events .event-row.event-row--facebook-cover .event-poster {
width: 168px !important;
height: auto !important;
aspect-ratio: 1920 / 1005 !important;
}
#events .event-row.event-row--facebook-cover .event-poster > img {
width: 100% !important;
height: 100% !important;
aspect-ratio: 1920 / 1005 !important;
object-fit: cover !important;
object-position: center !important;
}
@media (max-width:700px) {
#events .event-row.event-row--facebook-cover {
grid-template-columns: clamp(112px,36vw,142px) minmax(0,1fr) !important;
grid-template-areas: "date date" "poster info" "poster cta" !important;
}
#events .event-row.event-row--facebook-cover .event-poster {
grid-area: poster !important;
width: 100% !important;
max-width: 100% !important;
aspect-ratio: 1920 / 1005 !important;
align-self: start !important;
}
#events .event-row.event-row--facebook-cover .event-date { grid-area: date !important; }
#events .event-row.event-row--facebook-cover .event-info { grid-area: info !important; }
#events .event-row.event-row--facebook-cover .event-cta { grid-area: cta !important; }
}
/* 2026-10-30: remove dotted print grain from event paper surfaces, keep torn edges. */
body, main, .events, .event-row, .booking-end-section, .booking-end-section::before,
.site-head::after {
background-image: none !important;
}
.event-show-link {
display: inline-flex;
align-items: baseline;
gap: 7px;
color: inherit;
text-decoration: none;
}
.event-show-link strong { font-weight: 700; }
.event-show-link .event-show-arrow {
display: inline-block;
color: #0E2619;
font: 600 .82em/1 'IBM Plex Mono', monospace;
transition: transform .16s ease, color .16s ease;
}
.event-show-link:hover .event-show-arrow,
.event-show-link:focus-visible .event-show-arrow {
color: #B08F00;
transform: translate(2px, -2px);
}
/* Whole event show title is the link target, not just its arrow. */
.event-show-link { cursor:pointer !important; width:fit-content; max-width:100%; }
.event-show-link strong { display:inline; }
/* Desktop navigation hover: yellow tab with bold dark-green lettering. */
@media (hover: hover) and (min-width: 761px) {
.site-head .site-nav a,
.site-head .nav a,
.bio-header .bio-nav a,
.bio-nav a,
header .nav a {
display: inline-flex !important;
align-items: center !important;
padding: 8px 10px !important;
background: transparent !important;
color: #EEEBD8 !important;
font-weight: 600 !important;
text-decoration: none !important;
}
.site-head .site-nav a:hover,
.site-head .site-nav a:focus-visible,
.site-head .nav a:hover,
.site-head .nav a:focus-visible,
.bio-header .bio-nav a:hover,
.bio-header .bio-nav a:focus-visible,
.bio-nav a:hover,
.bio-nav a:focus-visible,
header .nav a:hover,
header .nav a:focus-visible {
background: #F4DC3C !important;
color: #0E2619 !important;
font-weight: 800 !important;
border-color: #F4DC3C !important;
box-shadow: none !important;
text-shadow: none !important;
}
}
/* 2026-10-30: align the date-to-cover spacing with show-page upcoming events.
The larger date track moves the photo and details together while the image-to-info gap and right-aligned CTA remain unchanged. */
@media (min-width: 801px) {
#events .event-row.event-row--facebook-cover {
grid-template-columns: 188px 168px minmax(0, 1fr) auto !important;
}
}
/* ===== 2026-11-02: pictures without frames or torn edges =====
Photos, posters and merch shots are shown as clean rectangles.
The :is(#_a#_b#_c) entry only raises specificity so this wins over the older per-image cut rules.
Section edges, the booking sticker and the Lily game panel keep their rough shapes. */
:is(#solo, #projekti, #shop, #termini, #o-meni, .about-collage, .poster-frame, .event-poster, .gallery-item, .bio-intro, .photo-story, .bio-gallery, .merch-layout, #_a#_b#_c) img {
clip-path: none !important;
-webkit-clip-path: none !important;
border: 0 !important;
outline: 0 !important;
box-shadow: none !important;
border-radius: 0 !important;
transform: none !important;
}
/* ===== 2026-11-02: no ruled line under the "Svi nastupi." heading ===== */
main > .events { border-top: 0 !important; }
/* ===== 2026-11-02: text links ("Dovedi me u svoj grad", "Povratak na početnu stranicu") get the same colour-swap hover =====
The dark block grows outward with a box-shadow, so nothing around the link moves. */
a.link-swap, main > a.bottom-link {
transition: background-color .16s ease, color .16s ease, box-shadow .16s ease !important;
}
a.link-swap:hover, a.link-swap:focus-visible,
main > a.bottom-link:hover, main > a.bottom-link:focus-visible {
background: #0E2619 !important;
color: #F4DC3C !important;
box-shadow: 0 0 0 8px #0E2619 !important;
text-decoration: none !important;
outline: none !important;
}