/* ===== Extracted from index.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 index.html: unified-home-content-width ===== */
@media (min-width: 761px) {
  /* Solo Showovi uses 1360px content plus 32px side padding = 1424px visual canvas. */
  #o-meni > .home-about-wrap,
  #projekti > div,
  #shop > div {
    width: 100% !important;
    max-width: 1424px !important;
    box-sizing: border-box !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  #o-meni > .home-about-wrap {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }

  #projekti > div,
  #shop > div {
    padding-left: clamp(18px, 4vw, 44px) !important;
    padding-right: clamp(18px, 4vw, 44px) !important;
  }
}


/* ===== Extracted from index.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 index.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 index.html: original-inline-style-5 ===== */
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:#0E2619}
a{color:#F4DC3C}a:hover{color:#FFF3A6}
:focus-visible{outline:2px solid #F4DC3C;outline-offset:3px}
.hero{position:relative;display:flex;flex-direction:column;justify-content:flex-end;width:100%;height:100vh;height:100dvh;min-height:0;max-height:none;box-sizing:border-box;overflow:hidden}
.hero-media{position:absolute;inset:0}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.hero-img-wide{object-position:50% 36%}
.hero-img-tall{display:none;object-position:50% 60%}
.hero-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,38,25,0) 0%,rgba(14,38,25,0) 42%,rgba(14,38,25,.55) 64%,rgba(14,38,25,.95) 100%)}
.hero-content{position:relative;width:100%;max-width:1360px;margin:0 auto;padding:0 32px clamp(28px,4vh,48px);box-sizing:border-box;gap:clamp(16px,2.5vh,28px)!important}
.hero-name{font-size:clamp(74px,min(12.5vw,19vh),260px)}
@media (min-width:2200px){.hero-content{max-width:1580px}}
@media (max-height:760px) and (min-width:761px){.hero{height:100vh;height:100dvh;min-height:0}.hero-content{padding-bottom:20px;gap:16px!important}.hero-name{font-size:clamp(72px,min(11vw,17vh),170px)}}
@media (max-width:760px){
.hero{height:100vh;height:100dvh;min-height:0;justify-content:flex-end}
.hero-media{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto}
.hero-img-wide{display:none}
.hero-img-tall{display:block}
.hero-scrim{background:linear-gradient(180deg,rgba(14,38,25,.10) 0%,rgba(14,38,25,.12) 35%,rgba(14,38,25,.76) 62%,rgba(14,38,25,.98) 100%)}
.hero-content{margin:0 auto;padding:0 20px max(26px,env(safe-area-inset-bottom));gap:12px!important}
.hero-name{font-size:clamp(58px,14vw,100px);line-height:.84}
.hero-content>div:first-of-type{gap:18px!important}
.hero-content>div:first-of-type>div{gap:14px!important;padding-bottom:0!important}
.hero-content p{font-size:15px!important;line-height:1.42!important;max-width:40ch}
.site-head{padding:12px 16px !important}
.site-nav a{font-size:12px !important;padding:4px 7px !important}
}
.rail-shell{display:grid;grid-template-columns:48px minmax(0,1fr) 48px;align-items:center;gap:12px;min-width:0}
.rail{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;padding:4px 2px 12px;min-width:0;scroll-behavior:smooth}
.rail::-webkit-scrollbar{display:none}
.rail-arrow{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:48px;height:48px;border:2px solid #F4DC3C;background:#173826;color:#F4DC3C;cursor:pointer;font-family:'Big Shoulders Display',sans-serif;font-weight:900;font-size:30px;line-height:1;transition:background .18s,color .18s,transform .18s}
.rail-arrow:hover{background:#F4DC3C;color:#0E2619;transform:scale(1.04)}
.rail-arrow:disabled{opacity:.28;cursor:default;transform:none}
@media(max-width:760px){.rail-shell{grid-template-columns:36px minmax(0,1fr) 36px;gap:7px}.rail-arrow{width:36px;height:40px;font-size:25px}.rail{gap:16px}.card{flex-basis:min(78vw,300px)}}
.rail .card>img{object-fit:contain!important;background:#0E2619}
.social-links{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center}
.social-link{display:inline-flex;align-items:center;gap:8px;color:#0E2619!important;text-decoration:none;border:1px solid rgba(14,38,25,.35);padding:7px 10px;font-family:'IBM Plex Mono',monospace;font-size:13px;transition:background .16s,color .16s,transform .16s}
.social-link:hover{background:#0E2619;color:#F4DC3C!important;transform:translateY(-2px)}
.social-link svg{width:18px;height:18px;display:block;flex:none}
.lily-trigger{position:absolute;z-index:3;padding:0;border:0;background:transparent;cursor:pointer;border-radius:50%;outline-offset:4px}
.lily-trigger:focus-visible{outline:3px solid #F4DC3C}
.lily-trigger-wide{left:54%;top:14%;width:11%;height:20%}
.lily-trigger-tall{display:none}
@media(max-width:760px){.lily-trigger-wide{display:none}.lily-trigger-tall{display:block;left:54%;top:29%;width:23%;height:14%}}
.lily-game-backdrop{position:fixed;inset:0;z-index:3000;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(5,15,9,.88);box-sizing:border-box}
.lily-game-backdrop[hidden]{display:none}
.lily-game-panel{position:relative;width:min(980px,100%);max-height:calc(100svh - 36px);overflow:auto;background:#0E2619;color:#EEEBD8;border:3px solid #EEEBD8;box-shadow:10px 10px 0 #F4DC3C;padding:clamp(14px,2.5vw,28px)}
.lily-game-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:14px}
.lily-game-title{font-family:'Big Shoulders Display',sans-serif;font-size:clamp(36px,6vw,60px);line-height:.9;text-transform:uppercase;color:#F4DC3C;margin:0}
.lily-game-desc{font-size:14px;line-height:1.4;margin:8px 0 0;color:#EEEBD8}
.lily-game-close{border:2px solid #EEEBD8;background:#F4DC3C;color:#0E2619;font-size:30px;font-weight:900;line-height:1;width:44px;height:44px;cursor:pointer;flex:none}
.lily-game-stats{display:flex;flex-wrap:wrap;gap:8px 18px;margin:12px 0;font:600 13px 'IBM Plex Mono',monospace;text-transform:uppercase}
.lily-game-stats strong{color:#F4DC3C;font-size:18px;margin-left:6px}
#lily-game-canvas{display:block;width:100%;height:auto;aspect-ratio:9/5;background:#173826;border:2px solid #EEEBD8;touch-action:none;cursor:crosshair}
.lily-game-controls{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:14px;font-size:13px;line-height:1.4}
.lily-game-action{border:2px solid #EEEBD8;background:#F4DC3C;color:#0E2619;padding:10px 16px;font:700 13px 'IBM Plex Mono',monospace;text-transform:uppercase;cursor:pointer}
.lily-game-status{color:#B9C2A8;flex:1 1 250px}
@media(max-width:520px){.lily-game-backdrop{padding:8px}.lily-game-panel{padding:12px;border-width:2px;box-shadow:5px 5px 0 #F4DC3C}.lily-game-head{gap:8px}.lily-game-title{font-size:36px}.lily-game-desc{font-size:12px}.lily-game-stats{font-size:11px;gap:6px 12px}}
.card{all:unset;box-sizing:border-box;cursor:pointer;flex:0 0 clamp(240px,26vw,320px);scroll-snap-align:start;display:flex;flex-direction:column;gap:14px}
.card:hover .card-title{color:#F4DC3C}
.card:focus-visible{outline:2px solid #F4DC3C;outline-offset:4px}
.info-btn{all:unset;box-sizing:border-box;cursor:pointer;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border:1px solid currentColor;font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.03em}
.info-btn:hover{background:#F4DC3C;color:#0E2619;border-color:#F4DC3C}
.modal-backdrop{position:fixed;inset:0;z-index:100;background:rgba(6,18,11,.82);display:flex;align-items:center;justify-content:center;padding:24px;box-sizing:border-box;overflow-y:auto}
.modal{position:relative;width:100%;max-width:920px;max-height:calc(100% - 16px);overflow-y:auto;background:#EEEBD8;color:#0E2619;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.modal-close{all:unset;cursor:pointer;position:absolute;top:10px;right:10px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:#0E2619;color:#F4DC3C;z-index:2}
@media (max-width:720px){.modal{grid-template-columns:minmax(0,1fr)}.modal-backdrop{padding:12px;align-items:flex-start}}
@media (prefers-reduced-motion:reduce){*{transition:none !important;scroll-behavior:auto !important}}


.about-intro{flex:1.05 1 400px;min-width:0;display:flex;flex-direction:column;gap:28px}
.about-collage{position:relative;width:100%;max-width:600px;min-height:clamp(420px,47vw,650px);isolation:isolate;margin-top:4px;overflow:visible}
.about-photo{position:absolute;margin:0;box-sizing:border-box;aspect-ratio:3/4;width:44%;overflow:hidden;transition:filter .35s ease,transform .35s ease;will-change:auto}
.about-photo--framed{background:#EEEBD8;padding:8px 8px 24px;border:1px solid #fff;box-shadow:8px 10px 0 rgba(14,38,25,.2)}
.about-photo--framed img{position:absolute;top:8px;left:8px;width:calc(100% - 16px);height:calc(100% - 32px);display:block;object-fit:cover;background:#EEEBD8}
.about-photo[data-slot="left"]{top:4%;left:1%;right:auto;width:43%;transform:rotate(-7deg);z-index:2}
.about-photo[data-slot="center"]{top:23%;left:28%;right:auto;width:45%;transform:rotate(2deg);z-index:4}
.about-photo[data-slot="right"]{top:2%;left:auto;right:0;width:43%;transform:rotate(6deg);z-index:1}
.about-photo:hover{z-index:8!important;filter:drop-shadow(5px 8px 0 rgba(14,38,25,.22))}
.about-photo--framed:hover{transform:rotate(0deg) scale(1.035)}
.about-photo--cutout:hover{transform:rotate(0deg) scale(1.035)}
@media(max-width:760px){.about-intro{flex:1 1 100%}.about-collage{min-height:clamp(390px,110vw,520px);max-width:560px;margin-left:auto;margin-right:auto}.about-photo[data-slot="left"]{width:47%;top:4%;left:0}.about-photo[data-slot="center"]{width:49%;top:24%;left:24%}.about-photo[data-slot="right"]{width:47%;top:2%;right:0}}
@media(prefers-reduced-motion:reduce){.about-photo{transition:none!important;will-change:auto}}

/* Responsive hero: keep the headline and CTA inside the first screen where possible. */
/* Punk booking sticker: green/yellow print, rough layers, white frame. */
.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:760px){.booking-float{right:10px;bottom:12px;width:164px;min-height:88px;padding:9px 8px 8px;gap:5px;border-width:2px;box-shadow:4px 4px 0 #F4DC3C}.booking-sticker-tags{gap:3px}.booking-sticker-tags span{font-size:11px;min-height:17px;padding:1px 4px}.booking-sticker-label{font-size:21px}.booking-sticker-arrow{right:8px;bottom:3px;font-size:9px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.booking-float{transition:none}}

/* Responsive pass: compact home bio, mobile navigation, and rotating booking rectangle */
.site-head>div{position:relative}
.mobile-menu-toggle{display:none;align-items:center;justify-content:center;gap:9px;min-height:42px;padding:0 13px;background:#0E2619;color:#F4DC3C;border:2px solid #EEEBD8;font-family:'IBM Plex Mono',monospace;font-size:12px;font-weight:600;text-transform:uppercase;cursor:pointer;box-shadow:3px 3px 0 #F4DC3C}
.mobile-menu-icon{font-family:system-ui,sans-serif;font-size:19px;line-height:1}
.site-nav a{transition:background .15s,color .15s}
.site-nav a:hover{background:#F4DC3C!important;color:#0E2619!important}
.booking-float{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 rgba(238,235,216,.9);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}
.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{border-color:#EEEBD8}
.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)}
.home-about-wrap{max-width:1360px;margin:0 auto;padding:60px 32px;display:grid;grid-template-columns:minmax(0, .9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,72px);align-items:center}
.home-about-visual{min-width:0}
.home-about-visual>h2{margin:0;font-family:'Big Shoulders Display',sans-serif;font-weight:900;font-size:clamp(48px,6vw,82px);line-height:.84;text-transform:uppercase}
.home-about .about-intro{display:contents}
.home-about .about-collage{width:100%;max-width:420px;min-height:300px;height:300px;margin:16px 0 0;overflow:visible}
.home-about .about-photo{width:40%;aspect-ratio:3/4}
.home-about .about-photo[data-slot="left"]{top:3%;left:1%;right:auto;width:40%;transform:rotate(-7deg);z-index:2}
.home-about .about-photo[data-slot="center"]{top:20%;left:29%;right:auto;width:41%;transform:rotate(2deg);z-index:4}
.home-about .about-photo[data-slot="right"]{top:2%;left:auto;right:0;width:40%;transform:rotate(6deg);z-index:1}
.home-about .about-photo--framed{padding:6px 6px 19px;border:1px solid #fff;box-shadow:5px 6px 0 rgba(14,38,25,.2)}
.home-about .about-photo--framed img{top:6px;left:6px;width:calc(100% - 12px);height:calc(100% - 25px)}
.home-about-copy{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:18px;font-size:17px;line-height:1.55}
.home-about-copy p{margin:0;max-width:58ch}
.home-about-copy .home-about-lead{font-family:'Big Shoulders Display',sans-serif;font-size:clamp(24px,2.5vw,34px);font-weight:800;line-height:1.05}
.about-more-link{display:inline-flex;align-items:center;gap:12px;min-height:48px;padding:0 17px;border:2px solid #0E2619;color:#0E2619;font-family:'IBM Plex Mono',monospace;font-size:12px;font-weight:600;text-transform:uppercase;text-decoration:none;transition:background .16s,color .16s,transform .16s}
.about-more-link:hover{background:#0E2619;color:#F4DC3C;transform:translateY(-2px)}
@media(max-width:760px){
  .site-head{margin-bottom:-64px!important;padding:10px 14px!important}
  .site-head>div{gap:10px!important;align-items:center!important;flex-wrap:nowrap!important}
  .site-head>div>a[href="#top"]{font-size:21px!important}
  .mobile-menu-toggle{display:flex!important;margin-left:auto;flex:none}
  .site-nav{display:none!important;position:absolute!important;top:calc(100% + 9px);left:0;right:0;z-index:100;box-sizing:border-box;flex-direction:column!important;align-items:stretch!important;gap:2px!important;padding:10px!important;background:#0E2619!important;border:2px solid #EEEBD8;box-shadow:4px 4px 0 #F4DC3C;}
  body.nav-open .site-nav{display:flex!important}
  .site-nav a{display:block!important;padding:13px 12px!important;font-size:14px!important;border-bottom:1px solid rgba(238,235,216,.22)}
  .site-nav a:last-child{border-bottom:0}
  .home-about-wrap{grid-template-columns:minmax(0,1fr);padding:54px 18px;gap:18px}
  .home-about-visual>h2{font-size:clamp(48px,12vw,72px)}
  .home-about .about-collage{min-height:clamp(270px,76vw,340px);height:clamp(270px,76vw,340px);max-width:440px;margin:12px auto 0}
  .home-about .about-photo[data-slot="left"]{width:40%;top:2%;left:1%}
  .home-about .about-photo[data-slot="center"]{width:41%;top:20%;left:29%}
  .home-about .about-photo[data-slot="right"]{width:40%;top:2%;right:0}
  .home-about-copy{font-size:16px;gap:14px}
  .home-about-copy .home-about-lead{font-size:clamp(24px,6.5vw,31px)}
  .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)}
  #nastupi>div,#solo>div,#projekti>div,#shop>div,#kontakt>div{padding-left:18px!important;padding-right:18px!important}
  #solo>div,#projekti>div,#shop>div{padding-top:64px!important}
  #kontakt>div{padding-top:76px!important;gap:38px!important}
  .rail-shell{grid-template-columns:34px minmax(0,1fr) 34px;gap:6px}
  .rail-arrow{width:34px;height:42px;font-size:24px}
}
@media(max-width:400px){.mobile-menu-toggle{padding:0 9px;gap:6px}.mobile-menu-label{font-size:10px}.site-head>div>a[href="#top"]{font-size:18px!important}.booking-float{width:160px;min-height:57px}}
@media(prefers-reduced-motion:reduce){.booking-float{transition:none!important}}


/* Hard-cut punk booking sticker: no soft transitions, only abrupt colour/angle swaps. */
.booking-float{width:248px!important;min-height:76px!important;padding:12px 14px!important;border:3px solid #EEEBD8!important;border-radius:0!important;outline:0!important;box-shadow:6px 6px 0 #F4DC3C,-3px -3px 0 #EEEBD8!important;transition:none!important;animation:none!important;clip-path:polygon(0 3%,97% 0,100% 94%,3% 100%)!important;transform-origin:center center!important}
.booking-float:before{inset:5px!important;border:1px solid #EEEBD8!important}
.booking-float.color-a{background:#0E2619!important;color:#F4DC3C!important}
.booking-float.color-b{background:#F4DC3C!important;color:#0E2619!important}
.booking-float.color-c{background:#0E2619!important;color:#EEEBD8!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{box-shadow:3px 3px 0 #F4DC3C,-2px -2px 0 #EEEBD8!important;transform:rotate(1deg) translate(-2px,-2px)!important}
.booking-sticker-label{font-size:clamp(22px,2.2vw,30px)!important;font-weight:900!important;line-height:.92!important;letter-spacing:.02em!important;text-shadow:2px 2px 0 rgba(14,38,25,.22)!important}
@media(max-width:760px){.booking-float{right:12px!important;bottom:max(12px,env(safe-area-inset-bottom))!important;width:min(190px,53vw)!important;min-height:62px!important;padding:9px 10px!important;box-shadow:4px 4px 0 #F4DC3C,-2px -2px 0 #EEEBD8!important}.booking-sticker-label{font-size:clamp(18px,5vw,24px)!important}}
@media(prefers-reduced-motion:reduce){.booking-float{transition:none!important}}

/* Lily mini-game: viewport-contained, no horizontal scrollbar, minimal HUD and start screen. */
.lily-game-backdrop{padding:clamp(8px,2vw,20px)!important;overflow:hidden!important;overscroll-behavior:contain}
.lily-game-panel{width:min(920px,calc(100vw - 32px))!important;max-width:calc(100vw - 32px)!important;min-width:0!important;max-height:calc(100svh - 32px)!important;overflow-x:hidden!important;overflow-y:auto!important;box-sizing:border-box!important;padding:clamp(10px,2vw,20px)!important;border:3px solid #EEEBD8!important;box-shadow:7px 7px 0 #F4DC3C!important;scrollbar-width:none}
.lily-game-panel::-webkit-scrollbar{display:none}
.lily-game-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin:0 0 10px!important;min-width:0}
.lily-game-title{margin:0!important;font-size:clamp(30px,4.6vw,44px)!important;line-height:.88!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lily-game-close{width:38px!important;height:38px!important;font-size:26px!important;border:2px solid #EEEBD8!important}
.lily-game-stage{position:relative;width:100%;max-width:100%;min-width:0;overflow:hidden;line-height:0;background:#173826}
#lily-game-canvas{display:block;width:100%!important;max-width:100%!important;height:auto!important;aspect-ratio:9/5!important;box-sizing:border-box!important;border:0!important;touch-action:none}
.lily-game-hud{position:absolute;left:12px;right:12px;top:10px;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:12px;font:900 clamp(12px,1.8vw,17px)/1 'IBM Plex Mono',monospace;text-transform:uppercase;color:#EEEBD8;pointer-events:none;line-height:1}
.lily-game-score{display:inline-flex;align-items:center;gap:8px;background:#0E2619;padding:8px 10px;border:2px solid #EEEBD8;box-shadow:3px 3px 0 #F4DC3C}
.lily-game-score strong{color:#F4DC3C;font-size:1.25em}
.lily-game-lives{padding:8px 10px;background:#0E2619;border:2px solid #EEEBD8;box-shadow:-3px 3px 0 #F4DC3C;color:#F4DC3C;letter-spacing:.12em;white-space:nowrap}
.lily-game-overlay{position:absolute;inset:46px 0 0;z-index:3;display:flex;align-items:center;justify-content:center;padding:56px 18px 18px;background:rgba(14,38,25,.72);box-sizing:border-box;line-height:1.35}
.lily-game-overlay[hidden]{display:none!important}
.lily-game-overlay-copy{width:min(440px,100%);padding:clamp(18px,4vw,30px);background:#0E2619;color:#EEEBD8;border:3px solid #EEEBD8;box-shadow:6px 6px 0 #F4DC3C;text-align:center}
.lily-game-overlay-copy h3{margin:0 0 10px;font:900 clamp(30px,5vw,50px)/.88 'Big Shoulders Display',sans-serif;text-transform:uppercase;color:#F4DC3C}
.lily-game-overlay-copy p{margin:0 auto 18px;max-width:34ch;font:500 clamp(13px,1.8vw,16px)/1.4 'IBM Plex Sans',sans-serif}
.lily-game-action{border:2px solid #EEEBD8!important;background:#F4DC3C!important;color:#0E2619!important;padding:11px 17px!important;font:900 13px 'IBM Plex Mono',monospace!important;text-transform:uppercase;cursor:pointer;box-shadow:4px 4px 0 #EEEBD8!important}
.lily-game-action:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 #EEEBD8!important}
@media(max-width:520px){.lily-game-overlay{inset:42px 0 0;padding:8px}.lily-game-panel{width:calc(100vw - 16px)!important;max-width:calc(100vw - 16px)!important;padding:8px!important;border-width:2px!important;box-shadow:4px 4px 0 #F4DC3C!important}.lily-game-head{margin-bottom:7px!important}.lily-game-title{font-size:30px!important}.lily-game-close{width:34px!important;height:34px!important}.lily-game-hud{left:7px;right:7px;top:7px}.lily-game-score,.lily-game-lives{padding:6px 7px;border-width:1px;box-shadow:2px 2px 0 #F4DC3C}.lily-game-overlay{padding:46px 8px 8px}.lily-game-overlay-copy{padding:17px 12px;border-width:2px;box-shadow:4px 4px 0 #F4DC3C}}


/* 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;transform:rotate(1.5deg)!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}}

/* Lily modal: remove the artificial yellow bottom underline/shadow. */
.lily-game-panel{box-shadow:none!important}
.lily-game-stage{border-bottom:0!important}
.lily-game-score,.lily-game-lives{box-shadow:none!important}
.lily-game-overlay-copy{box-shadow:none!important}
@media(max-width:520px){.lily-game-panel{box-shadow:none!important}.lily-game-score,.lily-game-lives,.lily-game-overlay-copy{box-shadow:none!important}}

/* 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%; }

/* Lily playfield: no decorative bar or shadow under the canvas. */
.lily-game-panel, .lily-game-stage, #lily-game-canvas { box-shadow:none !important; outline:0 !important; }
.lily-game-stage::before, .lily-game-stage::after { content:none !important; display:none !important; }
#lily-game-canvas { border:0 !important; border-bottom:0 !important; }


/* Mobile swipe galleries for solo shows and merch, with pagination dots. */
.carousel-dots{display:flex;justify-content:center;align-items:center;gap:9px;min-height:14px;padding:12px 0 0;}
.carousel-dot{appearance:none;display:block;width:9px;height:9px;min-width:9px;border:1px solid #EEEBD8;border-radius:50%;padding:0;background:transparent;cursor:pointer;transition:width .12s steps(1,end),background-color .12s steps(1,end);}
.carousel-dot[aria-current="true"]{width:23px;border-radius:0;background:#F4DC3C;border-color:#F4DC3C;}
.carousel-dots--projects{padding-top:8px;}
#solo .solo-show-grid img{aspect-ratio:4/5!important;object-fit:contain!important;background:#173826!important;}
#shop .merch-gallery img{object-fit:contain!important;}
#solo-show-dots,#merch-dots{display:none;}
@media(max-width:760px){
  #solo .solo-show-grid,#shop .merch-gallery{display:flex!important;flex-wrap:nowrap!important;gap:18px!important;overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;scroll-behavior:smooth;min-width:0;padding:5px 18px 14px!important;margin-left:-18px!important;margin-right:-18px!important;}
  #solo .solo-show-grid::-webkit-scrollbar,#shop .merch-gallery::-webkit-scrollbar{display:none!important;}
  #solo .solo-show-grid>article{flex:0 0 min(82vw,360px)!important;width:min(82vw,360px)!important;min-width:0!important;scroll-snap-align:center;}
  #shop .merch-gallery>div{flex:0 0 min(82vw,360px)!important;width:min(82vw,360px)!important;min-width:0!important;scroll-snap-align:center;}
  #solo-show-dots,#merch-dots{display:flex!important;padding-top:10px;}
  #projects-dots{display:flex!important;}
}
@media(max-width:390px){#solo .solo-show-grid>article,#shop .merch-gallery>div{flex-basis:84vw!important;width:84vw!important;}}
@media(prefers-reduced-motion:reduce){#solo .solo-show-grid,#shop .merch-gallery{scroll-behavior:auto!important}.carousel-dot{transition:none!important}}

/* Final responsive pass: consistent sticky nav and fixed bottom booking bar on every page. */
html,body{max-width:100%;overflow-x:clip}
body{padding-bottom:calc(74px + env(safe-area-inset-bottom))!important}
.site-head{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}
/* Show posters fill their image slot without the green placeholder bars. */
#solo .solo-show-grid>article{height:100%;min-width:0;display:flex;flex-direction:column;align-items:stretch;gap:18px}
#solo .solo-show-grid>article>.card{width:100%;padding:0!important;overflow:hidden;background:transparent!important;border:0!important;box-shadow:none!important}
#solo .solo-show-grid>article>.card img{display:block;width:100%!important;aspect-ratio:4/5!important;height:auto;object-fit:cover!important;background:transparent!important}
#solo .solo-show-grid>article>h3{min-height:1.8em;font-size:clamp(42px,4.2vw,64px)!important;line-height:.9!important}
#solo .solo-show-grid>article>p{min-height:3.4em}
.info-btn{display:inline-flex!important;justify-content:center;align-items:center;gap:12px;min-width:92px!important;min-height:42px!important;padding:0 15px!important;background:transparent!important;border:1px solid #EEEBD8!important;color:#EEEBD8!important;font:700 12px 'IBM Plex Mono',monospace!important;text-transform:uppercase!important;cursor:pointer}
.info-btn:hover{background:#F4DC3C!important;color:#0E2619!important;border-color:#F4DC3C!important}
/* Filled / empty round pagination dots — no bars or stretching. */
.carousel-dots{display:flex;align-items:center;justify-content:center;gap:9px;min-height:16px;padding:12px 0 0}
.carousel-dot{appearance:none!important;display:block!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;cursor:pointer!important;transition:none!important;box-shadow: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{overflow:hidden;max-width:100%;box-sizing:border-box}
#kontakt>div{width:100%;max-width:1360px;box-sizing:border-box;padding-left:clamp(18px,4vw,44px)!important;padding-right:clamp(18px,4vw,44px)!important}
.home-about,.home-about-wrap{max-width:100%;box-sizing:border-box}
@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}
 #solo .solo-show-grid>article{flex-basis:min(82vw,360px)!important}
 #solo .solo-show-grid>article>h3{min-height:1.8em}
 #solo .solo-show-grid>article>p{min-height:0}
 .home-events-head{display:none}
 .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{min-height:100svh!important}
}
@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}}
/* The bottom bar replaces the older floating sticker and green footer. */
.site-footer{display:none!important}


/* Final Lily HUD/intro: plain numbers and hearts, no boxed widgets or extra yellow underline. */
.lily-game-panel{border:2px solid #EEEBD8!important;box-shadow:none!important;overflow-x:hidden!important}
.lily-game-stage{border:0!important;box-shadow:none!important}
#lily-game-canvas{border:0!important;outline:0!important;box-shadow:none!important}
.lily-game-score,.lily-game-lives{display:inline-flex!important;align-items:center;gap:7px;padding:0!important;margin:0!important;border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;color:#F4DC3C!important;letter-spacing:.1em;text-shadow:2px 2px 0 #0E2619;font:900 clamp(22px,3vw,34px)/1 'IBM Plex Mono',monospace!important}
.lily-game-score{font-size:clamp(25px,3.3vw,40px)!important;letter-spacing:0!important}
.lily-game-lives{font-size:clamp(20px,2.8vw,30px)!important}
.lily-game-overlay{inset:0!important;display:flex;align-items:center;justify-content:center;padding:22px!important;background:rgba(14,38,25,.86)!important}
.lily-game-overlay-copy{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;width:min(620px,100%)!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;text-align:center}
.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}
.lily-game-overlay-copy p{max-width:36ch;margin:0 auto!important;color:#EEEBD8;font:700 clamp(17px,2vw,25px)/1.25 'IBM Plex Sans',sans-serif!important}
.lily-countdown{display:block;color:#F4DC3C;font:900 clamp(90px,17vw,180px)/.8 'Big Shoulders Display',sans-serif;text-shadow:4px 4px 0 #0E2619}
.lily-game-action{margin-top:14px!important;box-shadow:4px 4px 0 #F4DC3C!important}
@media(max-width:520px){.lily-game-overlay{padding:12px!important}.lily-game-overlay-copy{gap:10px}.lily-game-overlay-copy p{font-size:16px!important}.lily-game-panel{border-width:2px!important}.lily-game-score{font-size:25px!important}.lily-game-lives{font-size:20px!important}}
/* Poster slots are full-width, without coloured letterboxing; group cards keep text inset. */
#solo .solo-show-grid>article>.card img{object-fit:cover!important;background:transparent!important}
#projekti .rail .card{padding:0!important;overflow:hidden!important;align-items:stretch!important;gap:12px!important;background:#173826!important}
#projekti .rail .card>img{display:block;width:100%!important;aspect-ratio:4/5!important;object-fit:cover!important;background:transparent!important}
#projekti .rail .card>span{margin-left:16px!important;margin-right:16px!important}
#projekti .rail .card>span:last-child{margin-bottom:16px!important}
.social-icon-only{width:42px;height:42px;justify-content:center;padding:0!important;border:0!important;background:transparent!important}
.social-icon-only svg{width:23px!important;height:23px!important}
#top.hero{min-height:100svh!important;box-sizing:border-box}



/* 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; }


/* Homepage nav overlays the hero but stays pinned while visitors scroll. */
.site-head { position:fixed !important; top:0 !important; left:0 !important; right:0 !important; width:100% !important; margin:0 !important; z-index:2400 !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; } }


/* Navbar behavior: transparent over the hero, solid once the hero has scrolled away. */
.site-head { background:transparent!important; border-bottom:1px solid transparent!important; transition:none!important; }
.site-head .site-nav { background:transparent!important; border-color:transparent!important; box-shadow:none!important; }
body.nav-solid .site-head { background:#0E2619!important; border-bottom:1px solid #2E4C39!important; }
body.nav-solid .site-head .site-nav { background:#0E2619!important; border-color:transparent!important; box-shadow:none!important; }
body.nav-open .site-head .site-nav { background:#0E2619!important; border:2px solid #EEEBD8!important; box-shadow:4px 4px 0 #F4DC3C!important; }
@media (prefers-reduced-motion:reduce) { .site-head { transition: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; }



/* Final alignment pass: center the whole About section inside a readable max-width. */
#o-meni { width:100% !important; max-width:none !important; overflow:hidden !important; }
@media (min-width:761px) {
  #o-meni > .home-about-wrap,
  #o-meni .home-about-wrap {
    display:grid !important;
    width:100% !important;
    max-width:1360px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:clamp(56px,5vw,84px) clamp(24px,2.5vw,40px) !important;
    box-sizing:border-box !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    gap:clamp(36px,4.8vw,76px) !important;
    align-items:center !important;
  }
  #o-meni .home-about-visual {
    display:flex !important;
    grid-column:1 !important;
    width:100% !important;
    min-width:0 !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:center !important;
    gap:18px !important;
  }
  #o-meni .home-about-visual > h2 {
    align-self:flex-start !important;
    grid-column:auto !important;
    margin:0 !important;
    max-width:100% !important;
  }
  #o-meni .home-about-visual > .about-collage {
    width:100% !important;
    max-width:540px !important;
    min-width:0 !important;
    height:clamp(310px,30vw,430px) !important;
    min-height:0 !important;
    margin:0 !important;
    justify-self:center !important;
  }
  #o-meni .home-about-wrap > .home-about-copy {
    grid-column:2 !important;
    width:100% !important;
    max-width:560px !important;
    min-width:0 !important;
    justify-self:center !important;
    align-self:center !important;
  }
}
@media (max-width:760px) {
  #o-meni .home-about-wrap {
    display:grid !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 auto !important;
    padding:46px 18px 52px !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:22px !important;
    box-sizing:border-box !important;
  }
  #o-meni .home-about-visual,
  #o-meni .home-about-wrap > .home-about-copy {
    grid-column:1 !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }
  #o-meni .home-about-visual { display:flex !important; flex-direction:column !important; gap:12px !important; }
  #o-meni .home-about-visual > .about-collage { width:100% !important; max-width:480px !important; height:clamp(290px,78vw,360px) !important; margin:0 auto !important; }
  #o-meni .home-about-copy { font-size:16px !important; gap:14px !important; }
}

/* No drop shadow/blur on any navbar state; keep the dark-green readable label block. */
.site-head, .site-head > div, .site-head .site-nav, .site-head .site-nav a,
.site-head .mobile-menu-toggle, .bio-header, .bio-header-inner, .bio-nav,
.bio-nav a, .mobile-menu-toggle {
  box-shadow:none !important;
  text-shadow:none !important;
  filter:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}


/* ===== Extracted from index.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 index.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; }
}


/* ===== Extracted from index.html: final-home-location-width-cta-fixes ===== */
/* Homepage events: city + venue are one logical location column, not two competing columns. */
.home-events-head, .home-events-row {
  display:grid !important;
  grid-template-columns:minmax(108px,.82fr) minmax(145px,1fr) minmax(170px,1.35fr) minmax(116px,auto) !important;
  gap:clamp(12px,1.7vw,22px) !important; align-items:center !important; min-width:0 !important;
}
.home-events-head > :nth-child(4) { display:block !important; }
.home-event-location { grid-column:auto !important; grid-row:auto !important; min-width:0 !important; display:flex !important; flex-direction:column !important; align-items:flex-start !important; gap:2px !important; overflow-wrap:anywhere !important; }
.home-event-city { display:block !important; margin:0 !important; font:600 10px/1.35 'IBM Plex Mono',monospace !important; text-transform:uppercase !important; letter-spacing:.06em !important; }
.home-event-venue { display:block !important; margin:0 !important; min-width:0 !important; font:15px/1.35 'IBM Plex Sans',sans-serif !important; overflow-wrap:anywhere !important; }
.home-event-show { min-width:0 !important; overflow-wrap:anywhere !important; }
/* Desktop booking CTA has one yellow fill state, not a second yellow offset rectangle behind it. */
.booking-float, .booking-float:hover, .booking-float:focus-visible { box-shadow:none !important; }
@media (max-width:820px) {
  .home-events-head { display:none !important; }
  .home-events-row { grid-template-columns:minmax(80px,96px) minmax(0,1fr) !important; grid-template-areas:'date location' 'date show' '. action' !important; gap:5px 12px !important; align-items:start !important; padding:18px 0 !important; }
  .home-event-date { grid-area:date !important; min-width:0 !important; white-space:normal !important; overflow-wrap:normal !important; font-size:clamp(27px,7vw,34px) !important; line-height:.92 !important; }
  .home-event-location { grid-area:location !important; min-width:0 !important; }
  .home-event-city { display:block !important; font-size:10px !important; line-height:1.25 !important; }
  .home-event-venue { font-size:14px !important; line-height:1.3 !important; }
  .home-event-show { grid-area:show !important; min-width:0 !important; font-size:14px !important; line-height:1.3 !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; }
}
@media (max-width:400px) {
  .home-events-row { grid-template-columns:minmax(76px,88px) minmax(0,1fr) !important; column-gap:10px !important; }
  .home-event-date { font-size:clamp(26px,7vw,32px) !important; }
}


/* ===== Extracted from index.html: punk-zine-section-transitions ===== */
/* Editorial torn-paper transitions: irregular cut edges, restrained print grain, no new assets. */
:root {
  --paper-cream: #EEEBD8;
  --punk-yellow: #F4DC3C;
  --ink-green: #0E2619;
  --print-green: rgba(14,38,25,.09);
  --print-light: rgba(238,235,216,.12);
}

#nastupi,
#o-meni,
#solo,
#projekti,
#shop,
#kontakt {
  position:relative !important;
  isolation:isolate !important;
}

/* 1. Hero image → cream event list: an uneven paper edge coming down from the hero. */
#nastupi {
  background-color:var(--paper-cream) !important;
  background-image:
    radial-gradient(circle, rgba(14,38,25,.07) .65px, transparent .9px),
    radial-gradient(circle, rgba(14,38,25,.035) .6px, transparent 1px) !important;
  background-size:9px 11px, 17px 19px !important;
  background-position:2px 2px, 5px 8px !important;
}
#nastupi::before {
  content:"";
  position:absolute;
  left:0; right:0; top:-25px;
  height:50px;
  pointer-events:none;
  z-index:0;
  background-color:var(--paper-cream);
  background-image:
    radial-gradient(circle, rgba(14,38,25,.08) .7px, transparent 1px),
    radial-gradient(circle, rgba(14,38,25,.035) .7px, transparent 1.1px);
  background-size:9px 11px, 17px 19px;
  background-position:2px 2px, 5px 8px;
  clip-path:polygon(
    0 39%, 2.5% 31%, 5% 46%, 7.8% 34%, 10.5% 43%, 13.4% 24%,
    16.6% 39%, 19.4% 31%, 22.7% 47%, 25.8% 32%, 29% 42%, 32.2% 25%,
    35.5% 40%, 38.8% 30%, 42% 46%, 45.2% 34%, 48.5% 43%, 51.6% 26%,
    54.8% 40%, 58.1% 31%, 61.4% 47%, 64.5% 33%, 67.8% 42%, 71% 24%,
    74.3% 39%, 77.4% 30%, 80.7% 46%, 83.9% 33%, 87.1% 42%, 90.2% 26%,
    93.5% 39%, 96.7% 31%, 100% 40%, 100% 100%, 0 100%
  );
}
#nastupi > div { position:relative !important; z-index:1 !important; }

/* 2. Cream event paper → yellow About section: little cream shreds left on the edge. */
#o-meni {
  background-color:var(--punk-yellow) !important;
  background-image:
    radial-gradient(circle, rgba(14,38,25,.055) .6px, transparent .9px),
    radial-gradient(circle, rgba(14,38,25,.025) .7px, transparent 1px) !important;
  background-size:11px 13px, 21px 23px !important;
  background-position:4px 3px, 8px 9px !important;
}
#o-meni::before {
  content:"";
  position:absolute;
  left:0; right:0; top:-8px;
  height:24px;
  z-index:0;
  pointer-events:none;
  background-color:var(--paper-cream);
  background-image:radial-gradient(circle, rgba(14,38,25,.08) .6px, transparent .9px);
  background-size:9px 11px;
  clip-path:polygon(
    0 0, 4% 9%, 8% 0, 12% 17%, 17% 4%, 22% 18%, 27% 1%, 32% 15%,
    37% 4%, 42% 20%, 48% 0, 53% 14%, 58% 3%, 63% 19%, 68% 1%,
    73% 16%, 78% 3%, 83% 19%, 88% 0, 93% 15%, 97% 4%, 100% 10%,
    100% 52%, 96% 45%, 92% 62%, 87% 48%, 82% 66%, 77% 50%, 72% 61%,
    67% 47%, 62% 65%, 57% 51%, 52% 62%, 47% 46%, 42% 64%, 37% 49%,
    32% 62%, 27% 48%, 22% 66%, 17% 50%, 12% 64%, 7% 48%, 3% 61%, 0 50%
  );
}
#o-meni > .home-about-wrap { position:relative !important; z-index:1 !important; }

/* 3. Yellow About section → deep-green solo show section: torn yellow paper edge. */
#solo::before {
  content:"";
  position:absolute;
  left:0; right:0; top:-20px;
  height:42px;
  z-index:0;
  pointer-events:none;
  background-color:var(--punk-yellow);
  background-image:radial-gradient(circle, rgba(14,38,25,.075) .65px, transparent .95px);
  background-size:10px 12px;
  clip-path:polygon(
    0 34%, 3% 48%, 6% 30%, 10% 43%, 14% 25%, 18% 45%, 23% 31%,
    27% 49%, 31% 27%, 35% 42%, 40% 30%, 44% 47%, 48% 28%, 53% 43%,
    57% 24%, 61% 44%, 66% 31%, 70% 47%, 74% 28%, 79% 43%, 83% 30%,
    87% 48%, 91% 29%, 95% 43%, 100% 33%, 100% 62%, 96% 74%, 92% 60%,
    87% 78%, 82% 64%, 77% 80%, 72% 64%, 67% 76%, 62% 60%, 57% 79%,
    52% 64%, 47% 78%, 42% 60%, 37% 75%, 32% 62%, 27% 80%, 22% 63%,
    17% 76%, 12% 61%, 7% 78%, 3% 63%, 0 72%
  );
}
#solo > div { position:relative !important; z-index:1 !important; }

/* The dark-green solo/projects/shop area stays uncluttered; the contact band starts with its own torn yellow edge. */
#kontakt {
  overflow:visible !important;
  background-color:var(--punk-yellow) !important;
  background-image:
    radial-gradient(circle, rgba(14,38,25,.05) .6px, transparent .9px),
    radial-gradient(circle, rgba(14,38,25,.025) .7px, transparent 1px) !important;
  background-size:11px 13px, 21px 23px !important;
  background-position:4px 3px, 8px 9px !important;
}
#kontakt::before {
  content:"";
  position:absolute;
  left:0; right:0; top:-25px;
  height:50px;
  z-index:0;
  pointer-events:none;
  background-color:var(--punk-yellow);
  background-image:radial-gradient(circle, rgba(14,38,25,.07) .7px, transparent 1px);
  background-size:10px 12px;
  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%
  );
}
#kontakt > .booking-end-inner { position:relative !important; z-index:1 !important; }

/* Keep the ripped edges compact and avoid sideways overflow on phones. */
@media (max-width:760px) {
  #nastupi::before { top:-16px; height:32px; }
  #o-meni::before { top:-5px; height:16px; }
  #solo::before { top:-14px; height:28px; }
  #kontakt::before { top:-16px; height:32px; }
  #nastupi, #o-meni, #solo, #projekti, #shop, #kontakt { max-width:100%; }
}
@media (prefers-reduced-motion:reduce) {
  #nastupi::before, #o-meni::before, #solo::before, #kontakt::before { scroll-behavior:auto; }
}


/* ===== Extracted from index.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 index.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; }
}
/* The new stage photo replaces the transparent cutout in the home "A tko sam ja?" collage.
   Keep its natural landscape ratio so the blue stage light and outstretched arm remain visible. */
.home-about .about-photo--wide {
  width:58% !important;
  left:20% !important;
  right:auto !important;
  top:27% !important;
  aspect-ratio: 3 / 2 !important;
  transform:rotate(1.8deg) !important;
  z-index:5 !important;
}
.home-about .about-photo--wide > img {
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
}
@media(max-width:760px) {
  .home-about .about-photo--wide {
    width:62% !important;
    left:19% !important;
    top:27% !important;
    aspect-ratio:3 / 2 !important;
  }
}


/* ===== Extracted from index.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 index.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 index.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 index.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; }
}

/* Home: make the yellow booking paper tear over the dark green content above it. */
#kontakt { position:relative !important; isolation:isolate !important; overflow:visible !important; z-index:20 !important; }
#kontakt::before { top:-27px !important; height:54px !important; z-index:1 !important; }
#kontakt > .booking-end-inner { position:relative !important; z-index:2 !important; }


/* ===== Extracted from index.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 index.html: mobile-home-events-layout-fix-20261030 ===== */
/* Mobile homepage events: keep date and CTA on their own first row, then location and show below. */
@media (max-width:760px) {
  #nastupi > div { padding: 50px 20px 72px !important; }
  .home-events-table { display:block !important; width:100% !important; max-width:100% !important; min-width:0 !important; }
  .home-events-head { display:none !important; }
  .home-events-row {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    grid-template-areas:"date action" "location location" "show show" !important;
    gap:8px 12px !important;
    align-items:start !important;
    padding:18px 0 20px !important;
    min-width:0 !important;
  }
  .home-event-date {
    grid-area:date !important;
    display:block !important;
    min-width:0 !important;
    max-width:100% !important;
    font-size:clamp(25px,6.8vw,32px) !important;
    line-height:.92 !important;
    white-space:nowrap !important;
    overflow:visible !important;
  }
  .home-event-location {
    grid-area:location !important;
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:wrap !important;
    align-items:baseline !important;
    gap:3px 12px !important;
    min-width:0 !important;
    max-width:100% !important;
    overflow-wrap:anywhere !important;
  }
  .home-event-city { display:block !important; flex:0 0 auto !important; margin:0 !important; font-size:10px !important; line-height:1.25 !important; }
  .home-event-venue { display:block !important; min-width:0 !important; margin:0 !important; font-size:14px !important; line-height:1.3 !important; overflow-wrap:anywhere !important; }
  .home-event-show { grid-area:show !important; display:block !important; min-width:0 !important; max-width:100% !important; font-size:14px !important; line-height:1.35 !important; overflow-wrap:anywhere !important; }
  .home-event-ticket { grid-area:action !important; justify-self:end !important; align-self:start !important; margin:0 !important; min-height:36px !important; padding:0 11px !important; font-size:10px !important; white-space:nowrap !important; }
}
@media (max-width:360px) {
  .home-events-row { grid-template-columns:minmax(0,1fr) auto !important; column-gap:8px !important; }
  .home-event-date { font-size:clamp(23px,7vw,27px) !important; }
  .home-event-ticket { min-height:34px !important; padding:0 8px !important; font-size:9px !important; }
}


/* ===== Extracted from index.html: mobile-hero-and-lily-game-final-fix ===== */
@media (max-width:760px) {
  .hero-img-tall {
    object-position: 50% 60% !important;
    transform: scale(1.22) translateY(-3.5%) !important;
    transform-origin: 50% 50% !important;
  }
  /* Keep Lily's easter-egg hit area aligned with her head after the mobile image zoom. */
  .lily-trigger-tall {
    left:46% !important;
    top:23.5% !important;
    width:31% !important;
    height:21% !important;
  }
}
/* Use the exact same irregular cut used by the site's images; no extra border, mat, or shadow. */
.lily-game-panel {
  border:0 !important;
  box-shadow:none !important;
  clip-path:var(--rough-image-edge) !important;
  -webkit-clip-path:var(--rough-image-edge) !important;
  overflow:hidden !important;
}
.lily-game-panel > .lily-game-head { padding:clamp(10px,1.7vw,18px) clamp(10px,1.7vw,18px) 0 !important; }
.lily-game-stage { clip-path:none !important; -webkit-clip-path:none !important; }
.lily-game-overlay-copy p {
  white-space:pre-line !important;
  max-width:min(680px,92%) !important;
}
/* The countdown's display rule must never override the HTML hidden attribute (the stray "1" bug). */
#lily-countdown[hidden] { display:none !important; visibility:hidden !important; }
#lily-overlay-title[hidden] { display:none !important; visibility:hidden !important; }
@media (max-width:520px) {
  .lily-game-panel { padding:0 0 8px !important; max-width:calc(100vw - 14px) !important; }
  .lily-game-panel > .lily-game-head { padding:11px 12px 0 !important; }
  .lily-game-stage { margin:0 8px !important; width:calc(100% - 16px) !important; }
  .lily-game-overlay-copy p { max-width:94% !important; font-size:15px !important; line-height:1.32 !important; }
}


/* ===== Extracted from index.html: navbar-two-state-edge-20261030 ===== */
/* The homepage keeps its two designed states: peek while over the hero, full after scrolling. */
.site-head { isolation: isolate !important; }
.site-head::after {
  content: "" !important;
  position: absolute !important;
  left: 32px !important;
  right: 32px !important;
  bottom: 0 !important;
  height: 1px !important;
  pointer-events: none !important;
  opacity: 0 !important;
  background: repeating-linear-gradient(
    90deg,
    rgba(238,235,216,.48) 0 3px,
    transparent 3px 8px
  ) !important;
  z-index: 5 !important;
}
body.nav-solid .site-head {
  border-bottom: 0 !important;
}
body.nav-solid .site-head::after { opacity: 1 !important; }
body:not(.nav-solid) .site-head::after { opacity: 0 !important; }
@media (max-width: 760px) {
  .site-head::after { left: 14px !important; right: 14px !important; }
}


/* NAVBAR EDGE FIX: remove the extra dotted 1px rule.
   The torn yellow paper transition above SOLO SHOWOVI is the intended separator. */
.site-head {
  border-bottom: 0 !important;
}
.site-head::after {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  background: none !important;
}


/* ===== Extracted from index.html: lily-game-mobile-height-adjustment ===== */
/* Slightly taller Lily mini-game popup on phones; desktop proportions stay unchanged. */
@media (max-width:520px) {
  #lily-game-canvas { aspect-ratio:45 / 28 !important; }
}


/* ===== Extracted from index.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%, -14.3%) scale(1.66) !important;
    transform-origin: 50% 50% !important;
  }
  /* Keep Lily's tap target aligned with her head after the revised mobile crop. */
  .lily-trigger-tall {
    left: 65.5% !important;
    top: 14.5% !important;
    width: 30% !important;
    height: 21% !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;
  }
}



/* ===== 2026-10-30 polish: remove dotted paper grain from section surfaces ===== */
/* Keep the torn silhouettes; remove only the repeating dot texture that reads like stray lines. */
#nastupi, #o-meni, #solo, #projekti, #shop, #kontakt,
#nastupi::before, #o-meni::before, #solo::before, #kontakt::before,
.booking-end-section, .booking-end-section::before {
  background-image: none !important;
}

/* Lily's start/retry control: match the rough white-and-yellow booking sticker CTA. */
.lily-game-action {
  position: relative !important;
  isolation: isolate !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 154px !important;
  min-height: 70px !important;
  margin: 10px 0 4px !important;
  padding: 12px 27px !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  color: #0E2619 !important;
  box-shadow: none !important;
  filter: none !important;
  font: 900 clamp(23px, 2.2vw, 30px)/.9 'Big Shoulders Display', sans-serif !important;
  letter-spacing: -.015em !important;
  text-transform: uppercase !important;
  text-align: center !important;
  text-shadow: none !important;
  cursor: pointer !important;
  transform: rotate(-2.4deg) !important;
  transition: transform .24s cubic-bezier(.2,.8,.2,1) !important;
  overflow: visible !important;
}
.lily-game-action::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -2 !important;
  background: #FFFFFF !important;
  clip-path: polygon(1% 3%, 18% 0, 42% 2%, 59% 0, 82% 2%, 100% 0, 99% 24%, 100% 49%, 98.5% 72%, 100% 98%, 78% 100%, 55% 98%, 38% 100%, 15% 98%, 0 100%, 1.5% 74%, 0 52%, 1% 28%) !important;
  filter: none !important;
}
.lily-game-action::after {
  content: "" !important;
  position: absolute !important;
  inset: 6px !important;
  z-index: -1 !important;
  background: #F4DC3C !important;
  clip-path: polygon(1% 2%, 20% 0, 43% 2%, 60% 0, 82% 2%, 100% 0, 99% 25%, 100% 50%, 98% 72%, 100% 98%, 78% 100%, 55% 98%, 38% 100%, 15% 98%, 0 100%, 1% 74%, 0 52%, 1% 28%) !important;
}
.lily-game-action:hover,
.lily-game-action:focus-visible {
  transform: rotate(2.4deg) !important;
  box-shadow: none !important;
  filter: none !important;
}
.lily-game-action:focus-visible {
  outline: 2px solid #F4DC3C !important;
  outline-offset: 6px !important;
}
@media (max-width: 520px) {
  .lily-game-action {
    min-width: 136px !important;
    min-height: 60px !important;
    padding: 9px 22px !important;
    font-size: clamp(20px, 5.8vw, 25px) !important;
  }
  .lily-game-action { box-shadow: none !important; filter: none !important; }
  .lily-game-action::before { filter: none !important; }
  .lily-game-action::after { inset: 5px !important; }
}

/* The complete show title and its arrow share one generous clickable link area. */
.home-show-detail-link {
  display: inline-flex !important;
  align-items: baseline !important;
  justify-content: flex-start !important;
  gap: 7px !important;
  max-width: 100% !important;
  margin: 0 !important;
  color: inherit !important;
  font: inherit !important;
  text-decoration: none !important;
  vertical-align: baseline !important;
  cursor: pointer !important;
  transition: color .16s ease !important;
}
.home-show-detail-link strong { font: inherit !important; font-weight: 700 !important; }
.home-show-detail-arrow {
  display: inline-block !important;
  flex: 0 0 auto !important;
  color: inherit !important;
  font: 600 .82em/1 'IBM Plex Mono', monospace !important;
  transition: transform .16s ease, color .16s ease !important;
}
.home-show-detail-link:hover strong,
.home-show-detail-link:focus-visible strong,
.event-show-link:hover strong,
.event-show-link:focus-visible strong {
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 3px !important;
}
.home-show-detail-link:hover .home-show-detail-arrow,
.home-show-detail-link:focus-visible .home-show-detail-arrow,
.event-show-link:hover .event-show-arrow,
.event-show-link:focus-visible .event-show-arrow {
  color: #B08F00 !important;
  transform: translate(2px, -2px) !important;
}
.home-show-detail-link:focus-visible,
.event-show-link:focus-visible {
  outline: 2px solid #B08F00 !important;
  outline-offset: 3px !important;
}


/* FINAL PAPER EDGE CLEANUP: keep only the solid-color torn silhouettes; no print dots or stray marks. */
#nastupi, #o-meni, #solo, #projekti, #shop, #kontakt,
#nastupi::before, #o-meni::before, #solo::before, #kontakt::before,
.booking-end-section, .booking-end-section::before {
  background-image: none !important;
  background-repeat: no-repeat !important;
}
#o-meni::before { background-color: #EEEBD8 !important; }
#solo::before { background-color: #F4DC3C !important; }
#nastupi::before { background-color: #EEEBD8 !important; }
#kontakt::before, .booking-end-section::before { background-color: #F4DC3C !important; }


/* HOMEPAGE NAVBAR FIX: transparent over hero, solid green only after scrolling.
   Keep the hero scrim intact; the navbar itself is the only element whose background changes. */
body:not(.subpage-page) .site-head {
  position: sticky !important;
  top: 0 !important;
  left: auto !important;
  right: auto !important;
  width: 100% !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
body:not(.nav-solid):not(.subpage-page) .site-head,
body:not(.nav-solid):not(.subpage-page) .site-head .site-nav {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
body:not(.nav-solid):not(.subpage-page) .site-head .site-nav a {
  background: transparent !important;
  color: #EEEBD8 !important;
}
body.nav-solid:not(.subpage-page) .site-head,
body.nav-solid:not(.subpage-page) .site-head .site-nav {
  background: #0E2619 !important;
}
@media (max-width: 760px) {
  body:not(.subpage-page) .site-head {
    margin-bottom: -64px !important;
  }
}

/* DESKTOP HOMEPAGE NAVBAR: overlay the hero just like the mobile header.
   The previous sticky rule kept the header in document flow on desktop,
   exposing the wrapper's green background as a solid strip above the photo.
   Fixed positioning removes that gap; only the scrolled state becomes green. */
@media (min-width: 761px) {
  body:not(.subpage-page) .site-head {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  body:not(.nav-solid):not(.subpage-page) .site-head,
  body:not(.nav-solid):not(.subpage-page) .site-head .site-nav {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
  }
  body.nav-solid:not(.subpage-page) .site-head {
    background: #0E2619 !important;
    border-bottom: 1px solid #2E4C39 !important;
  }
  body.nav-solid:not(.subpage-page) .site-head .site-nav {
    background: #0E2619 !important;
    border-color: transparent !important;
    box-shadow: none !important;
  }
}


/* Desktop homepage navbar: visible green strip at the hero top, stays green after scroll. */
@media (min-width: 761px) {
  body:not(.subpage-page) .site-head,
  body:not(.subpage-page) .site-head .site-nav {
    background: #0E2619 !important;
    border-color: transparent !important;
    box-shadow: none !important;
  }
  body:not(.subpage-page) .site-head {
    border-bottom: 1px solid #2E4C39 !important;
  }
}

/* Desktop navigation hover: a 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 {
    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 {
    background: #F4DC3C !important;
    color: #0E2619 !important;
    font-weight: 800 !important;
    border-color: #F4DC3C !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }
}

/* FINAL DESKTOP HOMEPAGE NAV STATES
   Over the hero: no full-width bar or logo; only the navigation links sit on
   their compact dark-green backing. After the hero: reveal the full green bar
   and logo, with the nav group blending into that bar. */
@media (min-width: 761px) {
  body:not(.nav-solid):not(.subpage-page) .site-head {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  body:not(.nav-solid):not(.subpage-page) .site-head > div {
    background: transparent !important;
  }
  body:not(.nav-solid):not(.subpage-page) .site-head > div > a[href="#top"] {
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(-6px) !important;
    pointer-events: none !important;
  }
  body:not(.nav-solid):not(.subpage-page) .site-head .site-nav {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 4px !important;
    width: max-content !important;
    max-width: 100% !important;
    margin-left: auto !important;
    padding: 5px 7px !important;
    box-sizing: border-box !important;
    background: #0E2619 !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  body:not(.nav-solid):not(.subpage-page) .site-head .site-nav a {
    background: transparent !important;
    color: #EEEBD8 !important;
  }
  body:not(.nav-solid):not(.subpage-page) .site-head .site-nav a:hover,
  body:not(.nav-solid):not(.subpage-page) .site-head .site-nav a:focus-visible {
    background: #F4DC3C !important;
    color: #0E2619 !important;
    font-weight: 800 !important;
  }

  body.nav-solid:not(.subpage-page) .site-head {
    background: #0E2619 !important;
    border: 0 !important;
    border-bottom: 1px solid #2E4C39 !important;
    box-shadow: none !important;
  }
  body.nav-solid:not(.subpage-page) .site-head > div {
    background: transparent !important;
  }
  body.nav-solid:not(.subpage-page) .site-head > div > a[href="#top"] {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    pointer-events: auto !important;
  }
  body.nav-solid:not(.subpage-page) .site-head .site-nav {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  body.nav-solid:not(.subpage-page) .site-head .site-nav a:hover,
  body.nav-solid:not(.subpage-page) .site-head .site-nav a:focus-visible {
    background: #F4DC3C !important;
    color: #0E2619 !important;
    font-weight: 800 !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: homepage "Sljedeći nastupi" show names use the date typeface ===== */
#nastupi .home-events-row .home-event-show,
#nastupi .home-events-row .home-event-show strong,
#nastupi .home-events-row .home-show-detail-link,
#nastupi .home-events-row .home-show-detail-link strong {
  font-family: 'Big Shoulders Display', sans-serif !important;
  font-weight: 800 !important;
  font-size: 26px !important;
  line-height: 1.05 !important;
  letter-spacing: 0 !important;
}
#nastupi .home-events-row .home-show-detail-arrow { font-size: 18px !important; }
@media (max-width: 820px) {
  #nastupi .home-events-row .home-event-show,
  #nastupi .home-events-row .home-event-show strong,
  #nastupi .home-events-row .home-show-detail-link,
  #nastupi .home-events-row .home-show-detail-link strong { font-size: 22px !important; }
}

/* ===== 2026-11-02: homepage "A tko sam ja?" shows a single photo instead of the three-photo collage ===== */
#o-meni .home-about-visual > .about-collage {
  height: auto !important;
  min-height: 0 !important;
  max-width: 440px !important;
}
#o-meni .about-collage .about-photo,
#o-meni .about-collage .about-photo[data-slot="left"] {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  width: 100% !important;
  aspect-ratio: 4 / 5 !important;
  transform: none !important;
}
#o-meni .about-collage .about-photo:hover {
  transform: none !important;
  filter: none !important;
}


/* ===== 2026-11-02: prominent buttons ("Više nastupa", "Još te više zanima tko sam ja?", O meni "Pogledaj nastupe") =====
   One shared style: solid fill, bigger mono label, and a hover that lifts the button onto a hard offset shadow
   while the arrow slides. --on-dark flips the colours for buttons that sit on the dark green background. */
a.btn-prominent,
.home-about a.btn-prominent.about-more-link,
.bio-cta a.btn-prominent {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  min-height: 60px !important;
  padding: 0 28px !important;
  box-sizing: border-box !important;
  background: #0E2619 !important;
  color: #F4DC3C !important;
  border: 2px solid #0E2619 !important;
  border-radius: 0 !important;
  box-shadow: 0 0 0 #0E2619 !important;
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  transform: none !important;
  transition: transform .16s ease, box-shadow .16s ease, background .16s ease, color .16s ease !important;
}
a.btn-prominent .btn-arrow { display: inline-block; transition: transform .16s ease; }
a.btn-prominent:hover,
a.btn-prominent:focus-visible,
.home-about a.btn-prominent.about-more-link:hover,
.home-about a.btn-prominent.about-more-link:focus-visible {
  transform: translate(-3px, -3px) !important;
  box-shadow: 6px 6px 0 #F4DC3C !important;
  background: #0E2619 !important;
  color: #F4DC3C !important;
}
/* On the yellow "A tko sam ja?" band the lift shadow is the page's off-white so it stays visible. */
.home-about a.btn-prominent.about-more-link:hover,
.home-about a.btn-prominent.about-more-link:focus-visible { box-shadow: 6px 6px 0 #EEEBD8 !important; }
a.btn-prominent:hover .btn-arrow,
a.btn-prominent:focus-visible .btn-arrow { transform: translateX(4px); }
a.btn-prominent:focus-visible { outline: 2px solid #0E2619 !important; outline-offset: 4px !important; }

.bio-cta a.btn-prominent.btn-prominent--on-dark {
  background: #F4DC3C !important;
  color: #0E2619 !important;
  border-color: #F4DC3C !important;
}
.bio-cta a.btn-prominent.btn-prominent--on-dark:hover,
.bio-cta a.btn-prominent.btn-prominent--on-dark:focus-visible {
  background: #F4DC3C !important;
  color: #0E2619 !important;
  box-shadow: 6px 6px 0 #EEEBD8 !important;
}
.bio-cta a.btn-prominent.btn-prominent--on-dark:focus-visible { outline-color: #F4DC3C !important; }

@media (max-width: 760px) {
  a.btn-prominent,
  .home-about a.btn-prominent.about-more-link,
  .bio-cta a.btn-prominent { min-height: 56px !important; padding: 0 18px !important; gap: 10px !important; font-size: 13px !important; letter-spacing: 0.02em !important; }
}
@media (prefers-reduced-motion: reduce) {
  a.btn-prominent, a.btn-prominent .btn-arrow { transition: none !important; }
  a.btn-prominent:hover, a.btn-prominent:focus-visible { transform: none !important; }
  a.btn-prominent:hover .btn-arrow, a.btn-prominent:focus-visible .btn-arrow { transform: none; }
}

/* ===== 2026-11-02: homepage "A tko sam ja?" uses a cut-out photo (transparent background) ===== */
#o-meni .home-about-visual > .about-collage { max-width: 320px !important; }
#o-meni .about-collage .about-photo,
#o-meni .about-collage .about-photo[data-slot="left"] { aspect-ratio: 723 / 1524 !important; background: transparent !important; }
#o-meni .about-collage .about-photo > img {
  object-fit: contain !important;
  background: transparent !important;
  clip-path: none !important;
  border: 0 !important;
}
@media (max-width: 760px) {
  #o-meni .home-about-visual > .about-collage { max-width: 240px !important; margin-left: auto !important; margin-right: auto !important; }
}

/* ===== 2026-11-02: solo show cards - consistent title/description spacing =====
   Titles no longer reserve two lines (with the real font they fit on one, which left a gap).
   On desktop each card is a subgrid, so posters, titles, descriptions and Info buttons line up across the row. */
#solo .solo-show-grid > article > h3 { min-height: 0 !important; margin: 0 !important; }
#solo .solo-show-grid > article > p { min-height: 0 !important; margin: 0 !important; }
@media (min-width: 761px) {
  #solo .solo-show-grid > article {
    display: grid !important;
    grid-row: span 4;
    grid-template-rows: subgrid;
    row-gap: 0 !important;
    align-content: start;
  }
  #solo .solo-show-grid > article > h3 { margin-top: 24px !important; align-self: start; }
  #solo .solo-show-grid > article > p { margin-top: 12px !important; align-self: start; }
  #solo .solo-show-grid > article > div { margin-top: 24px !important; align-self: start; }
}
@media (max-width: 760px) {
  #solo .solo-show-grid > article { gap: 0 !important; }
  #solo .solo-show-grid > article > h3 { margin-top: 18px !important; }
  #solo .solo-show-grid > article > p { margin-top: 10px !important; }
  #solo .solo-show-grid > article > div { margin-top: 18px !important; }
}

/* ===== 2026-11-02: "A tko sam ja?" - two columns, bigger photo with a hard shadow ===== */
@media (min-width: 761px) {
  #o-meni .home-about-wrap {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr) !important;
    column-gap: clamp(36px, 6vw, 110px) !important;
    row-gap: clamp(28px, 3vw, 40px) !important;
    align-items: center !important;
  }
  #o-meni .home-about-visual { display: contents !important; }
  #o-meni .home-about-visual > h2 { grid-column: 2 !important; grid-row: 1 !important; align-self: end !important; margin: 0 !important; }
  #o-meni .home-about-visual > .about-collage {
    grid-column: 1 !important; grid-row: 1 / span 2 !important;
    justify-self: center !important; align-self: center !important;
    width: 100% !important; max-width: 400px !important; margin: 0 !important;
  }
  #o-meni .home-about-wrap > .home-about-copy { grid-column: 2 !important; grid-row: 2 !important; align-self: start !important; justify-self: start !important; margin: 0 !important; padding-left: 0 !important; padding-right: 0 !important; max-width: 640px !important; }
  #o-meni .home-about-visual > h2 { justify-self: start !important; padding-left: 0 !important; }
}
#o-meni .about-collage .about-photo > img { filter: none !important; }

/* "A tko sam ja?" heading on one line where it fits; extra space before the text on phones too. */
#o-meni .home-about-visual > h2 { text-wrap: balance; }
@media (max-width: 760px) {
  #o-meni .home-about-visual > h2 { margin-bottom: 12px !important; }
  #o-meni .home-about-copy { margin-top: 20px !important; }
}

/* ===== 2026-11-02: "A tko sam ja?" compact - heading above a half-length photo that stands on the section edge ===== */
#o-meni .about-collage .about-photo,
#o-meni .about-collage .about-photo[data-slot="left"] { aspect-ratio: 552 / 776 !important; }
#o-meni .about-collage .about-photo > img { object-position: bottom center !important; }
@media (min-width: 761px) {
  #o-meni .home-about-wrap {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr) !important;
    align-items: end !important;
    padding-bottom: 0 !important;
    row-gap: 0 !important;
  }
  #o-meni .home-about-visual {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: clamp(20px, 2.4vw, 32px) !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    align-self: end !important;
  }
  #o-meni .home-about-visual > h2 { margin: 0 !important; max-width: 100% !important; overflow-wrap: normal; }
  #o-meni .home-about-visual > .about-collage {
    width: 100% !important;
    max-width: 340px !important;
    margin: 0 !important;
    align-self: center !important;
  }
  #o-meni .home-about-wrap > .home-about-copy {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: center !important;
    padding-bottom: 72px !important;
    padding-top: 0 !important;
  }
}
@media (max-width: 760px) {
  #o-meni .home-about-wrap { padding-bottom: 0 !important; }
  #o-meni .home-about-visual { display: contents !important; }
  #o-meni .home-about-wrap { display: flex !important; flex-direction: column !important; }
  #o-meni .home-about-visual > h2 { order: 1 !important; }
  #o-meni .home-about-wrap > .home-about-copy { order: 2 !important; margin-top: 8px !important; }
  #o-meni .home-about-visual > .about-collage { order: 3 !important; max-width: 260px !important; margin: 28px auto 0 !important; }
}

/* ===== 2026-11-02: "A tko sam ja?" mirrors "Put dalje?" =====
   Half-length photo on the left standing on the section's bottom border; heading + text + button on the right. */
@media (min-width: 761px) {
  #o-meni .home-about-wrap {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr) !important;
    grid-template-rows: auto auto !important;
    column-gap: clamp(32px, 6vw, 110px) !important;
    row-gap: clamp(20px, 2.4vw, 32px) !important;
    align-items: end !important;
    padding-bottom: 0 !important;
  }
  #o-meni .home-about-visual { display: contents !important; }
  #o-meni .home-about-visual > .about-collage {
    grid-column: 1 !important; grid-row: 1 / span 2 !important;
    align-self: end !important; justify-self: center !important;
    width: 100% !important; max-width: 360px !important; margin: 0 !important;
  }
  #o-meni .home-about-visual > h2 {
    grid-column: 2 !important; grid-row: 1 !important;
    align-self: end !important; justify-self: start !important; margin: 0 !important;
  }
  #o-meni .home-about-wrap > .home-about-copy {
    grid-column: 2 !important; grid-row: 2 !important;
    align-self: start !important; padding-top: 0 !important;
    padding-bottom: clamp(56px, 6vw, 82px) !important;
  }
}

/* "A tko sam ja?" photo is painted above the next section's torn edge so it meets the border
   instead of looking like it floats above the yellow teeth. */
#o-meni .home-about-visual > .about-collage,
#o-meni .about-collage .about-photo { position: relative !important; z-index: 3 !important; }
#o-meni { overflow-x: clip !important; overflow-y: visible !important; }
#o-meni .home-about-visual > .about-collage { margin-bottom: -18px !important; }
@media (max-width: 760px) {
  #o-meni .home-about-visual > .about-collage { margin-bottom: -16px !important; }
}

/* ===== 2026-11-02: "A tko sam ja?" photo like "Put dalje?" =====
   The photo runs from the heading's top line down past the section edge, and a dark copy of the
   torn edge (same shape as the yellow strip's lower jag, drawn by #solo::after) is laid over the
   photo's straight bottom, so he disappears into the edge instead of floating above it. */
#o-meni .home-about-visual > .about-collage,
#o-meni .about-collage .about-photo { position: relative !important; z-index: 3 !important; }
#solo::after {
  content: "";
  position: absolute;
  left: 0; right: 0; top: -20px;
  height: 42px;
  z-index: 6;
  pointer-events: none;
  background: #0E2619;
  clip-path: polygon(
    0 72%, 3% 63%, 7% 78%, 12% 61%, 17% 76%, 22% 63%, 27% 80%, 32% 62%, 37% 75%,
    42% 60%, 47% 78%, 52% 64%, 57% 79%, 62% 60%, 67% 76%, 72% 64%, 77% 80%,
    82% 64%, 87% 78%, 92% 60%, 96% 74%, 100% 62%, 100% 100%, 0 100%
  );
}
@media (max-width: 760px) {
  #solo::after { top: -14px; height: 28px; }
}
@media (min-width: 761px) {
  #o-meni .home-about-visual > .about-collage {
    grid-column: 1 !important; grid-row: 1 / span 2 !important;
    align-self: stretch !important; justify-self: center !important;
    display: flex !important; align-items: flex-end !important;
    width: auto !important; max-width: none !important; height: auto !important; min-height: 0 !important;
    margin: 0 0 -18px 0 !important;
  }
  #o-meni .about-collage .about-photo,
  #o-meni .about-collage .about-photo[data-slot="left"] {
    position: relative !important; top: auto !important; left: auto !important; right: auto !important;
    height: 100% !important; width: auto !important; max-width: 100% !important;
    aspect-ratio: 552 / 776 !important; transform: none !important;
  }
}
@media (max-width: 760px) {
  #o-meni .home-about-visual > .about-collage { margin-bottom: -11px !important; }
}

/* ===== 2026-11-02: yellow -> green edge under "A tko sam ja?" is now drawn by #o-meni itself =====
   #solo is its own stacking context and always paints over #o-meni, so the photo could never sit in front
   of the yellow strip. The edge is now dark green teeth at the bottom of #o-meni, painted over the photo
   (exactly how "Put dalje?" disappears into the next section's edge). */
#solo::before { display: none !important; }
#solo::after { content: none !important; }
#o-meni::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important; right: 0 !important; bottom: -1px !important; top: auto !important;
  height: 22px !important;
  z-index: 5 !important;
  pointer-events: none !important;
  background: #0E2619 !important;
  clip-path: polygon(
    0 42%, 3% 10%, 7% 63%, 12% 3%, 17% 56%, 22% 10%, 27% 70%, 32% 7%, 37% 52%,
    42% 0, 47% 63%, 52% 14%, 57% 66%, 62% 0, 67% 56%, 72% 14%, 77% 70%,
    82% 14%, 87% 63%, 92% 0, 96% 49%, 100% 7%, 100% 100%, 0 100%
  ) !important;
}
@media (max-width: 760px) { #o-meni::after { height: 14px !important; } }
#o-meni .home-about-visual > .about-collage { margin-bottom: 0 !important; }
