/* O nama (page 1766) → red */
body.page-id-1766{
  --service-about:#FF2E43;
  --accent:#FF2E43; --accent-strong:#FF5061; --accent-soft:rgba(255,46,67,.14);
  --glow-accent:0 0 24px rgba(255,46,67,.35);
}
body.page-id-1766 .page-hero{ --bloom-a:#FF2E43 !important; --bloom-b:#FF7A6E !important; }

/* Kontakt (page 1771) → yellow */
body.page-id-1771{
  --accent:#FDE11E; --accent-strong:#FFD400; --accent-soft:rgba(253,225,30,.16);
  --glow-accent:0 0 24px rgba(253,225,30,.32);
}
body.page-id-1771 .page-hero{ --bloom-a:#FDE11E !important; --bloom-b:#FFA94D !important; }


/* --- section palettes: override the spectrum walk with each page's two tones --- */
body.page-id-1768 .band{ --sa:#FC03FB; --sb:#FF3EA0; }  /* Dizajn rasvjete : magenta + pink */
body.page-id-1770 .band{ --sa:#00E8FF; --sb:#4FA8FF; }  /* Programiranje   : cyan + blue */
body.page-id-1769 .band{ --sa:#48F06E; --sb:#00E8FF; }  /* Laser show      : green + cyan */
body.page-id-1767 .band{ --sa:#B44BF8; --sb:#4FA8FF; }  /* Projekti        : violet + blue */
body.page-id-1766 .band{ --sa:#FF2E43; --sb:#FF7A6E; }  /* O nama          : red + coral */
body.page-id-1771 .band{ --sa:#FDE11E; --sb:#FFA94D; }  /* Kontakt         : yellow + amber */

/* keep each hero's bloom pair in step with its sections (o-nama/kontakt in ll-recolor-pages) */
body.page-id-1768 .page-hero{ --bloom-a:#FC03FB !important; --bloom-b:#FF3EA0 !important; }
body.page-id-1770 .page-hero{ --bloom-a:#00E8FF !important; --bloom-b:#4FA8FF !important; }
body.page-id-1769 .page-hero{ --bloom-a:#48F06E !important; --bloom-b:#00E8FF !important; }
body.page-id-1767 .page-hero{ --bloom-a:#B44BF8 !important; --bloom-b:#4FA8FF !important; }

/* --- crowd-LED fix: the .crowd-canvas ([data-crowdfx]) has no animator anywhere (blank).
       Re-enable the section-field aurora so the section reads as a proper background. --- */
.crowd-band::before{ display:block !important; }
.crowd-band{ min-height:clamp(420px,52vh,620px) !important; }


.eyebrow::before,
.pdx .pdx-eye::before,
.thx .thx-eye::before,
.tlx .tlx-eye::before,
.container:has(.work-feature) .eyebrow::before{
  content:"" !important;
  width:40px !important; height:12px !important; border-radius:0 !important;
  --lle-a:var(--sa, var(--page-a, var(--cyan,#00E8FF)));
  --lle-b:var(--sb, var(--page-b, var(--magenta,#FC03FB)));
  background:
    radial-gradient(circle at 4px 50%, #fff 0 1.4px, var(--lle-a) 1.8px 3.4px, transparent 4.3px),
    linear-gradient(90deg, var(--lle-a), var(--lle-b) 96%, transparent) !important;
  background-size:40px 12px, 30px 2px !important;
  background-position:left center, 9px center !important;
  background-repeat:no-repeat !important;
  filter:drop-shadow(0 0 5px color-mix(in srgb, var(--lle-a) 58%, transparent)) !important;
  animation:lle-pulse 3.2s ease-in-out infinite !important;
}
@keyframes lle-pulse{
  0%,100%{ filter:drop-shadow(0 0 4px color-mix(in srgb, var(--lle-a) 40%, transparent)); }
  50%{ filter:drop-shadow(0 0 9px color-mix(in srgb, var(--lle-a) 80%, transparent)); }
}
@media (prefers-reduced-motion:reduce){
  .eyebrow::before,.pdx .pdx-eye::before,.thx .thx-eye::before,.tlx .tlx-eye::before,
  .container:has(.work-feature) .eyebrow::before{ animation:none !important; }
}


/* ---------- resting state (in the page, under the hero) ---------- */
nav.subnav{
  position:relative !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  z-index:150 !important;
  background:linear-gradient(180deg, rgba(10,10,16,.50), rgba(8,8,12,.44)) !important;
  -webkit-backdrop-filter:blur(20px) saturate(1.45);
  backdrop-filter:blur(20px) saturate(1.45) !important;
  border-top:1px solid rgba(255,255,255,.05) !important;
  border-bottom:1px solid rgba(255,255,255,.05) !important;
  transition:background .5s ease, border-color .5s ease, box-shadow .5s ease;
}
/* The fullscreen menu owns the entire viewport. Keep the quicklinks in the
   document flow, but remove their painted layer and hit area while it is open. */
body.menu-open nav.subnav{
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
nav.subnav::after{
  content:"";
  position:absolute; bottom:-1px; left:50%; transform:translateX(-50%);
  height:1.5px; width:34%;
  background:var(--gradient-spectrum, linear-gradient(90deg,#00E8FF,#48F06E,#B44BF8,#FC03FB,#FDE11E));
  opacity:.35;
  transition:width .55s cubic-bezier(.22,1,.36,1), opacity .45s ease;
  pointer-events:none;
}

.subnav-inner{
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  flex-wrap:nowrap !important;
  gap:8px !important;
  padding-block:11px !important;
  overflow-x:auto;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.subnav-inner::-webkit-scrollbar{display:none}

.subnav-label{
  flex:0 0 auto;
  white-space:nowrap;
  overflow:hidden;
  transition:max-width .5s cubic-bezier(.22,1,.36,1), opacity .3s ease, margin .5s ease;
}

/* ---------- docked state: second tier of the menu bar ---------- */
nav.subnav.is-stuck{
  position:fixed !important;
  top:calc(var(--ll-top-h, 64px) + 8px) !important;
  left:50% !important; right:auto !important;
  width:max-content !important;
  max-width:calc(100% - 24px) !important;
  transform:translateX(-50%) !important;
  z-index:190 !important;               /* under .site-top (200) — slides out from beneath it */
  background:linear-gradient(180deg, rgba(5,7,10,.94), rgba(3,4,7,.9)) !important;
  -webkit-backdrop-filter:blur(14px) saturate(1.22);
  backdrop-filter:blur(14px) saturate(1.22) !important;
  border:0 !important;
  border-radius:999px !important;
  box-shadow:0 10px 28px rgba(0,0,0,.42), inset 0 0 0 1px rgba(255,255,255,.025) !important;
  isolation:isolate;
  animation:lsn-drop .42s cubic-bezier(.22,1,.36,1) both;
}
@keyframes lsn-drop{
  from{ transform:translate(-50%,-6px) scale(.985); opacity:0 }
  55% { opacity:1 }
  to  { transform:translate(-50%,0); opacity:1 }
}
/* Full capsule emitter: the same travelling brand spectrum as the menu tape,
   rendered as a precise one-pixel ring without bloom or blur. */
nav.subnav.is-stuck::before{
  content:"";
  position:absolute;
  z-index:3;
  inset:0;
  padding:1px;
  border-radius:inherit;
  pointer-events:none;
  background-image:linear-gradient(90deg,
    #00E8FF 0%,#48F06E 12%,#B44BF8 25%,#FC03FB 37%,#FDE11E 50%,
    #FC03FB 63%,#B44BF8 75%,#48F06E 88%,#00E8FF 100%);
  background-size:2200px 100%;
  background-repeat:repeat-x;
  animation:lltg-flow 36s linear infinite;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
          mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
          mask-composite:exclude;
  opacity:.82;
}
nav.subnav.is-stuck::after{ display:none !important; }

/* docked: drop the "on this page" label so the pills read as a menu row */
nav.subnav.is-stuck .subnav-label{
  max-width:0 !important;
  opacity:0 !important;
  margin:0 !important;
  padding:0 !important;
}
nav.subnav.is-stuck .subnav-inner{
  gap:3px !important;
  padding:4px 6px !important;
  justify-content:center !important;
}
@media(max-width:900px){
  nav.subnav.is-stuck .subnav-inner{ justify-content:flex-start !important; }
}

/* ---------- pills: same language as the site-wide button system ----------
   Michroma uppercase label, 11px radius, page-accent spectral hairline ring
   drawn with a masked ::before (identical construction to .btn in ll-buttons).
   Deliberate deviation from .btn: no full-spectrum hover flood — in a row of
   four adjacent items that reads as a rainbow flicker, so hover simply lifts
   the ring to full strength. */
.subnav a{
  position:relative;
  z-index:1;
  isolation:isolate;
  flex:0 0 auto;
  padding:5px 10px !important;
  border-radius:999px !important;
  border:0 !important;
  background:transparent !important;
  font-family:var(--font-display, 'Michroma', sans-serif) !important;
  font-size:8.5px !important;
  font-weight:400 !important;
  line-height:1.15 !important;
  letter-spacing:.085em !important;
  text-transform:uppercase !important;
  white-space:nowrap !important;
  color:var(--gray-4,#B4B4B4) !important;
  text-decoration:none !important;
  transition:color .3s ease, transform .3s ease, background .3s ease;
}
.subnav a::before{
  content:"";
  position:absolute; inset:0; z-index:-1;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(135deg,
      var(--page-a, var(--cyan,#00E8FF)),
      var(--page-b, var(--magenta,#FC03FB)));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
          mask-composite:exclude;
  opacity:0;
  transition:opacity .3s ease;
  pointer-events:none;
}
.subnav a:hover{
  color:#fff !important;
  transform:none;
  background:rgba(255,255,255,.045) !important;
}
.subnav a:hover::before{ opacity:0; }
.subnav a.is-active{
  color:#fff !important;
  background:transparent !important;      /* the sliding puck supplies the fill */
}
.subnav a.is-active::before{ opacity:0; }
/* the active pill sits directly on top of the sliding puck — lifting it on
   hover would slide the two out of register and read as a doubled outline */
.subnav a.is-active:hover{ transform:none !important; }

@media(max-width:900px){
  nav.subnav.is-stuck{max-width:calc(100% - 16px) !important;}
  .subnav a{ font-size:8px !important; padding:5px 9px !important; letter-spacing:.075em !important; }
}

/* sliding indicator — subtly lit, squared to match the pill */
.subnav-ind{
  position:absolute;
  top:50%;
  left:0;
  height:22px;
  margin-top:-11px;
  z-index:0;
  opacity:0;
  border-radius:999px;
  pointer-events:none;
  background:linear-gradient(90deg,
    color-mix(in srgb, var(--page-a, var(--cyan,#00E8FF)) 24%, transparent),
    color-mix(in srgb, var(--page-b, var(--magenta,#FC03FB)) 20%, transparent));
  /* fill + halo only — NO inset hairline. The pill's own ::before already draws
     the ring; a second ring here shows as a doubled outline the moment the two
     are even a pixel out of register. */
  box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--page-a, var(--cyan,#00E8FF)) 12%, transparent);
  transition:transform .5s cubic-bezier(.22,1,.36,1), width .5s cubic-bezier(.22,1,.36,1), opacity .34s ease;
}

/* flow placeholder that keeps the page from jumping when the bar docks */
.subnav-ph{ display:block; width:100%; margin:0; padding:0; }

/* anchored jumps clear both tiers of the bar */
.band[id], section[id]{
  scroll-margin-top:calc(var(--ll-top-h, 64px) + var(--ll-sub-h, 52px) + 14px);
}

@media(prefers-reduced-motion:reduce){
  nav.subnav.is-stuck{ animation:none !important; }
  .subnav-ind{ transition:opacity .2s ease !important; }
}


/* shared spectrum tile — deliberately wider than a desktop viewport, so at any
   moment you see two or three brand hues blending, never the whole rainbow */
.ll-spill, .ll-spill.b{
  /* background-IMAGE, never the `background` shorthand. The shorthand also sets
     background-position, and an !important declaration BEATS a CSS animation —
     so writing it that way silently froze lltg-flow and the band sat still. */
  background-image:linear-gradient(90deg,
      #00E8FF 0%,  #48F06E 12%, #B44BF8 25%, #FC03FB 37%, #FDE11E 50%,
      #FC03FB 63%, #B44BF8 75%, #48F06E 88%, #00E8FF 100%) !important;
  background-size:2200px 100% !important;
  background-repeat:repeat-x !important;
  animation:lltg-flow 36s linear infinite !important;
  will-change:background-position;
}

/* the bloom: soft, dim, fading down and out at both ends */
.ll-spill{
  height:46px !important;
  filter:blur(17px) saturate(.92) !important;
  opacity:.32 !important;
  -webkit-mask-image:
    linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,.34) 46%, rgba(0,0,0,0) 100%),
    linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 14%, rgba(0,0,0,1) 86%, rgba(0,0,0,0) 100%);
  -webkit-mask-composite:source-in;
  mask-image:
    linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,.34) 46%, rgba(0,0,0,0) 100%),
    linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 14%, rgba(0,0,0,1) 86%, rgba(0,0,0,0) 100%);
  mask-composite:intersect;
  transition:opacity .6s ease, height .55s cubic-bezier(.22,1,.36,1), filter .55s ease;
}

/* the emitter: a hairline on the strip's own edge. Same tile, same speed, so its
   colour always matches the bloom directly beneath it */
.ll-spill.b{
  height:1px !important;
  filter:none !important;
  opacity:.5 !important;
  -webkit-mask-image:linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 12%, rgba(0,0,0,1) 88%, rgba(0,0,0,0) 100%);
  mask-image:linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 12%, rgba(0,0,0,1) 88%, rgba(0,0,0,0) 100%);
  transition:opacity .6s ease;
}

/* colours travel across the bar at ~61px/s — a slow drift, not a chase. The loop
   is seamless because the gradient starts and ends on the same brand cyan and
   scrolls exactly one tile width. */
@keyframes lltg-flow{
  from{ background-position:0 0 }
  to  { background-position:-2200px 0 }
}

/* docked quicklinks: the bloom would wash over the pills, so it retreats to a
   faint halo and the hairline carries the colour */
body.ll-sub-stuck .ll-spill:not(.b){ height:1px !important; opacity:0 !important; filter:none !important; }
body.ll-sub-stuck .ll-spill.b{ height:1px !important; opacity:.72 !important; filter:none !important; }

/* calmer once the hero is behind us, so the menu bar stays readable */
body.ll-past-hero .ll-spill{   opacity:.17 !important; }
body.ll-past-hero .ll-spill.b{ opacity:.4 !important; }
/* Docked quicklinks always win over the generic past-hero state: one crisp,
   synchronized emitter remains on the menu edge and the bloom stays off. */
body.ll-past-hero.ll-sub-stuck .ll-spill:not(.b){ height:1px !important; opacity:0 !important; filter:none !important; }
body.ll-past-hero.ll-sub-stuck .ll-spill.b{ height:1px !important; opacity:.72 !important; filter:none !important; }

@media(max-width:700px){
  .ll-spill{ height:32px !important; filter:blur(13px) saturate(.92) !important; }
}

@media(prefers-reduced-motion:reduce){
  .ll-spill, .ll-spill.b{ animation:none !important; }
}


.site-top{
  background:linear-gradient(180deg, rgba(9,9,14,.62), rgba(9,9,14,.40)) !important;
  -webkit-backdrop-filter:blur(22px) saturate(1.3);
  backdrop-filter:blur(22px) saturate(1.3) !important;
  border-bottom:1px solid rgba(255,255,255,.06) !important;
  transition:background .5s ease, border-color .5s ease, box-shadow .5s ease;
}
/* pinned only after JS has measured the original flow position */
body.ll-topfix .site-top{
  position:fixed !important;
  top:0 !important; left:0 !important; right:0 !important;
  width:100% !important;
}
body.ll-past-hero .site-top{
  background:linear-gradient(180deg, rgba(6,6,9,.80), rgba(6,6,9,.62)) !important;
  border-bottom-color:rgba(255,255,255,.09) !important;
  box-shadow:0 12px 34px rgba(0,0,0,.34) !important;
}
.ll-top-spacer{display:block;width:100%;pointer-events:none}


/* default mid stop = exact midpoint of the pair, so 3-stop == 2-stop visually */
body{ --page-c: color-mix(in srgb, var(--page-a, var(--cyan,#00E8FF)) 50%, var(--page-b, var(--magenta,#FC03FB))); }

/* --- per-page accent pairs (hr / en / de ids), matching ll-page-palettes --- */
body.page-id-1766, body.page-id-1783, body.page-id-1784{  /* O nama        : red + coral   */
  --page-a:#FF2E43 !important; --page-b:#FF7A6E !important; }
body.page-id-1767, body.page-id-1785, body.page-id-1786{  /* Projekti      : violet + blue */
  --page-a:#B44BF8 !important; --page-b:#4FA8FF !important; }
body.page-id-1768, body.page-id-1787, body.page-id-1788{  /* Dizajn        : magenta + pink*/
  --page-a:#FC03FB !important; --page-b:#FF3EA0 !important; }
body.page-id-1770, body.page-id-1791, body.page-id-1792{  /* Programiranje : cyan + blue   */
  --page-a:#00E8FF !important; --page-b:#4FA8FF !important; }
body.page-id-1771, body.page-id-1793, body.page-id-1794{  /* Kontakt       : yellow + amber*/
  --page-a:#FDE11E !important; --page-b:#FFA94D !important; }

/* Laser show — the three-tone page: cyan -> blue -> green.
   a/b are the two ends, so the project-tile wash reads cyan->green as briefed;
   c supplies the blue that only the multi-stop gradients (subnav) pick up. */
body.page-id-1769, body.page-id-1789, body.page-id-1790{
  --page-a:#00E8FF !important; --page-c:#4FA8FF !important; --page-b:#48F06E !important; }

/* --- subnav quicklinks: three stops so the mid tone actually shows --- */
.subnav a::before{
  background:linear-gradient(135deg,
      var(--page-a, var(--cyan,#00E8FF)) 0%,
      var(--page-c, var(--page-b, var(--magenta,#FC03FB))) 50%,
      var(--page-b, var(--magenta,#FC03FB)) 100%) !important;
}
.subnav-ind{
  background:linear-gradient(90deg,
      color-mix(in srgb, var(--page-a, var(--cyan,#00E8FF)) 24%, transparent),
      color-mix(in srgb, var(--page-c, var(--page-b, var(--magenta,#FC03FB))) 22%, transparent),
      color-mix(in srgb, var(--page-b, var(--magenta,#FC03FB)) 20%, transparent)) !important;
  box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--page-c, var(--page-a, var(--cyan,#00E8FF))) 14%, transparent) !important;
}


/* Denser tiles for the laser band only. .ll-laser-work exists nowhere else, and
   the two-class prefix outranks styles.css's single-class rules without
   !important, media query or not. */
.ll-laser-work .work-grid{
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:var(--space-4,16px);
}
@media (max-width:1240px){
  .ll-laser-work .work-grid{ grid-template-columns:repeat(3, minmax(0,1fr)); }
}
@media (max-width:900px){
  .ll-laser-work .work-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .ll-laser-work .work-grid{ gap:var(--space-3,12px); }
}
/* Phones stay two-up. One column x 12 tiles measured 4655px of scroll at 560px
   wide - a wall nobody reaches the end of. Two 3/2 tiles per row on a 390px
   screen are ~183px each, still readable, and cut the band to a third. */
@media (max-width:560px){
  .ll-laser-work .work-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--space-3,12px); }
}

/* shorter crop: 3/2 instead of 4/3 takes ~11% off every row's height */
.ll-laser-work .work-card img{ aspect-ratio:3 / 2; }

/* chrome scaled to the smaller tile so the caption never crowds the crop */
.ll-laser-work .work-card,
.ll-laser-work .work-card::after{ border-radius:13px; }
.ll-laser-work .work-card .work-card-info{
  padding:var(--space-5,24px) var(--space-4,16px) var(--space-3,12px);
  gap:2px;
}
.ll-laser-work .work-card h3{ font-size:var(--text-base,15px); line-height:1.28; }
.ll-laser-work .work-card .meta{ font-size:10px; letter-spacing:0.06em; }
.ll-laser-work .work-card::before{
  inset:10px auto auto 12px;
  font-size:9.5px;
  letter-spacing:0.16em;
  padding:3px 7px;
  border-radius:14px;
}
/* two-up phone tiles are the smallest the band ever gets - shrink the caption
   and the counter with them so neither eats the crop */
@media (max-width:560px){
  .ll-laser-work .work-card,
  .ll-laser-work .work-card::after{ border-radius:11px; }
  .ll-laser-work .work-card .work-card-info{
    padding:var(--space-4,16px) var(--space-3,12px) var(--space-2,8px);
  }
  .ll-laser-work .work-card h3{ font-size:var(--text-sm,13px); line-height:1.24; }
  .ll-laser-work .work-card .meta{ font-size:9px; letter-spacing:0.05em; }
  .ll-laser-work .work-card::before{
    inset:8px auto auto 9px;
    font-size:8.5px;
    padding:2px 6px;
  }
}


/* (A) sane pre-JS puck default: the pills are 28.07px tall, not 33px. No
   !important — the inline styles written by ll-subnav.php and by the sync
   script below must still win. */
.subnav-ind{ height:28px; margin-top:-14px; }

/* (B) one hairline, not two — see the header comment. Dropping the border and
   adding its 1px to the padding leaves every box metric identical while making
   the padding box (which ::before's inset:0 resolves against) equal to the
   border box, so the masked ring sits exactly on the button's outline and
   border-radius:inherit is finally the right curve. */
.btn{
  border:0 !important;
  padding:16px 27px !important;
  box-shadow:0 6px 22px rgba(0,0,0,.32),
             inset 0 1px 0 rgba(255,255,255,.06),
             inset 0 0 0 1px rgba(245,245,245,.14) !important;
}


@media(max-width:980px){
  body:not(.home) .llsc-media{ min-height:clamp(240px,46vw,340px) !important; }
}
@media(max-width:700px){
  body:not(.home) .llsc{ padding-block:clamp(34px,9vw,52px) !important; }
  body:not(.home) .llsc-console{ border-radius:14px !important; }
  body:not(.home) .llsc-media{
    min-height:0 !important;
    height:clamp(150px,44vw,210px) !important;
    aspect-ratio:16/9 !important;
  }
  body:not(.home) .llsc-head{ padding:11px 14px !important; }
  body:not(.home) .llsc-kick{ font-size:9.5px !important; letter-spacing:.14em !important; }
  /* short, glanceable cue list rather than a full programme */
  body:not(.home) .llsc-cue{
    padding:9px 14px !important;
    font-size:11px !important;
    grid-template-columns:26px 14px 1fr auto !important;
    gap:8px !important;
  }
  body:not(.home) .llsc-cue:nth-child(n+6){ display:none !important; }
}
@media(max-width:430px){
  body:not(.home) .llsc-media{ height:clamp(130px,40vw,170px) !important; }
  body:not(.home) .llsc-cue:nth-child(n+5){ display:none !important; }
}


    #llg-grid .llg-frame { background: #050505; }
    #llg-grid .llg-frame img { transition: opacity .28s ease; }
    #llg-grid .llg-frame.is-recovering img { opacity: .28; }
    #llg-grid .llg-frame.is-recovering::after,
    #llg-grid .llg-frame.llg-image-unavailable::after {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      background: linear-gradient(105deg, transparent 30%, rgba(79,168,255,.14) 48%, transparent 66%);
      background-size: 220% 100%;
      animation: llCardRecoverySweep 1.15s linear infinite;
    }
    #llg-grid .llg-frame.llg-image-unavailable::after {
      background: radial-gradient(circle at 50% 45%, rgba(79,168,255,.13), transparent 38%);
      animation: none;
    }
    @keyframes llCardRecoverySweep {
      from { background-position: 100% 0; }
      to { background-position: -120% 0; }
    }
    @media (prefers-reduced-motion: reduce) {
      #llg-grid .llg-frame.is-recovering::after { animation: none; }
    }
    

    .site-footer.llfc-ready {
      --llfc-line: color-mix(in srgb,var(--page-a,#00e8ff) 70%,#fff 30%);
      position: relative;
      isolation: isolate;
      overflow: hidden;
      padding: clamp(84px,8.4vw,150px) 0 clamp(24px,3.2vw,48px) !important;
      border: 0 !important;
      background:
        radial-gradient(75% 65% at 86% 2%,color-mix(in srgb,var(--page-b,#8a7bff) 13%,transparent),transparent 72%),
        radial-gradient(58% 52% at 12% 36%,color-mix(in srgb,var(--page-a,#00e8ff) 9%,transparent),transparent 76%),
        linear-gradient(180deg,#020305 0%,#050609 48%,#020204 100%) !important;
    }
    .site-footer.llfc-ready::before {
      content:"";
      position:absolute;
      z-index:8;
      inset:0 0 auto;
      height:1px;
      background:linear-gradient(90deg,transparent 2%,var(--page-a,#00e8ff) 24%,#f5f7fb 50%,var(--page-b,#8a7bff) 76%,transparent 98%);
      box-shadow:0 0 24px color-mix(in srgb,var(--page-a,#00e8ff) 25%,transparent);
      opacity:.88;
    }
    .site-footer.llfc-ready::after {
      content:"";
      position:absolute;
      z-index:-2;
      left:-12%; right:-12%; bottom:-28%;
      height:64%;
      transform:perspective(720px) rotateX(66deg);
      transform-origin:center bottom;
      background-image:
        linear-gradient(color-mix(in srgb,var(--page-a,#00e8ff) 8%,transparent) 1px,transparent 1px),
        linear-gradient(90deg,color-mix(in srgb,var(--page-b,#8a7bff) 8%,transparent) 1px,transparent 1px);
      background-size:72px 54px;
      -webkit-mask-image:linear-gradient(180deg,transparent,#000 24%,#000 76%,transparent);
              mask-image:linear-gradient(180deg,transparent,#000 24%,#000 76%,transparent);
      opacity:.55;
      pointer-events:none;
    }
    .site-footer.llfc-ready > .container {
      position:relative;
      z-index:2;
      width:min(100% - clamp(34px,7vw,136px),1760px) !important;
      max-width:none !important;
    }
    .llfc-atmosphere { position:absolute; z-index:-1; inset:0; overflow:hidden; pointer-events:none; }
    .llfc-atmosphere i {
      position:absolute;
      top:-12%;
      width:1px;
      height:78%;
      transform-origin:50% 0;
      background:linear-gradient(180deg,rgba(255,255,255,.68),color-mix(in srgb,var(--page-a,#00e8ff) 42%,transparent) 34%,transparent 90%);
      box-shadow:0 0 15px color-mix(in srgb,var(--page-a,#00e8ff) 24%,transparent);
      opacity:.16;
      animation:llfc-beam-drift 12s ease-in-out infinite alternate;
    }
    .llfc-atmosphere i:nth-child(1){left:8%;transform:rotate(-25deg);animation-delay:-2s}
    .llfc-atmosphere i:nth-child(2){left:31%;transform:rotate(-11deg);animation-delay:-7s}
    .llfc-atmosphere i:nth-child(3){left:57%;transform:rotate(13deg);animation-delay:-4s}
    .llfc-atmosphere i:nth-child(4){left:81%;transform:rotate(27deg);animation-delay:-9s}
    @keyframes llfc-beam-drift { to { opacity:.32; filter:brightness(1.35); } }

    .llfc-intro {
      display:grid;
      grid-template-columns:minmax(0,1.55fr) minmax(280px,.55fr);
      gap:clamp(42px,8vw,150px);
      align-items:end;
      padding-bottom:clamp(64px,7vw,120px);
    }
    .llfc-intro-copy { min-width:0; display:grid; gap:clamp(18px,2vw,30px); }
    .llfc-eyebrow,
    .llpz-kicker {
      display:flex;
      align-items:center;
      gap:14px;
      color:color-mix(in srgb,var(--page-a,#00e8ff) 76%,#fff 24%);
      font:500 10px/1.2 var(--font-mono,monospace);
      letter-spacing:.22em;
      text-transform:uppercase;
    }
    .llfc-eyebrow::before,
    .llpz-kicker::before {
      content:"";
      width:38px;
      height:1px;
      background:currentColor;
      box-shadow:0 0 12px currentColor;
    }
    .llfc-title {
      width:100%;
      min-width:0;
      max-width:12.5ch;
      box-sizing:border-box;
      justify-self:stretch;
      margin:0;
      color:#f5f7fb;
      font:400 clamp(52px,6.5vw,116px)/.87 var(--font-display,sans-serif);
      letter-spacing:-.058em;
      text-wrap:balance;
    }
    .llfc-spectrum-word {
      display:inline-block;
      color:transparent;
      background:linear-gradient(90deg,#b44bf8 0%,#8a7bff 11%,#4fa8ff 22%,#00e8ff 33%,#4ee97d 44%,#ffe13d 56%,#ffa94d 67%,#ff6f72 78%,#ff3ea0 89%,#fc03fb 100%);
      background-size:115% 100%;
      background-position:50% 50%;
      -webkit-background-clip:text;
              background-clip:text;
      -webkit-text-fill-color:transparent;
      filter:drop-shadow(0 0 18px rgba(111,180,255,.16));
    }
    .llfc-intro-side { display:grid; gap:26px; padding-bottom:8px; }
    .llfc-intro-side p {
      max-width:40ch;
      margin:0;
      color:rgba(235,239,247,.58);
      font-size:clamp(15px,1.25vw,19px);
      line-height:1.65;
    }
    .llfc-actions { display:flex; flex-wrap:wrap; gap:10px; }
    .llfc-actions a {
      min-height:52px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:12px;
      padding:0 22px;
      border:1px solid rgba(255,255,255,.17);
      background:rgba(255,255,255,.025);
      color:#f7f8fb;
      font:500 10px/1 var(--font-mono,monospace);
      letter-spacing:.17em;
      text-transform:uppercase;
      transition:transform .45s cubic-bezier(.16,1,.3,1),border-color .35s ease,background .35s ease,box-shadow .35s ease;
    }
    .llfc-actions a:first-child {
      border-color:color-mix(in srgb,var(--page-a,#00e8ff) 56%,transparent);
      background:color-mix(in srgb,var(--page-a,#00e8ff) 8%,rgba(255,255,255,.02));
    }
    .llfc-actions a:hover,.llfc-actions a:focus-visible {
      transform:translateY(-3px);
      border-color:var(--llfc-line);
      box-shadow:0 14px 36px rgba(0,0,0,.35),0 0 24px color-mix(in srgb,var(--page-a,#00e8ff) 16%,transparent);
    }

    .site-footer.llfc-ready .footer-pozornice.llpz-handoff {
      position:relative;
      display:grid !important;
      grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr) !important;
      align-items:stretch !important;
      gap:0 !important;
      min-height:0;
      margin:0 0 clamp(66px,7vw,118px) !important;
      padding:0 !important;
      overflow:hidden;
      border:1px solid rgba(255,255,255,.2) !important;
      border-radius:0 !important;
      background:#0c0c0c !important;
      box-shadow:0 20px 60px rgba(0,0,0,.25) !important;
      animation:none !important;
      isolation:isolate;
      text-decoration:none;
      transition:border-color .25s ease,box-shadow .25s ease !important;
    }
    .site-footer.llfc-ready .footer-pozornice.llpz-handoff::before { content:none; }
    .site-footer.llfc-ready .footer-pozornice.llpz-handoff::after {
      content:"";
      position:absolute;
      left:0; right:0; bottom:0;
      height:2px;
      background:linear-gradient(90deg,#00e8ff,#fc03fb);
      pointer-events:none;
    }
    .llpz-identity {
      display:flex;
      flex-direction:column;
      justify-content:center;
      align-items:center;
      gap:22px;
      min-width:0;
      padding:clamp(30px,4vw,64px);
      border-right:1px solid rgba(255,255,255,.12);
      background:
        linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
        linear-gradient(150deg,rgba(255,255,255,.05),transparent);
      background-size:32px 32px,32px 32px,100% 100%;
    }
    .llpz-identity .llpz-mark {
      display:block;
      width:clamp(105px,12vw,170px) !important;
      height:auto !important;
      margin:0;
      animation:none !important;
      transform:none;
      filter:drop-shadow(0 16px 18px rgba(0,0,0,.35));
      transition:transform .35s ease !important;
    }
    .llpz-identity .llpz-wordmark {
      display:block;
      width:min(100%,270px) !important;
      height:auto !important;
      margin:0;
    }
    .llpz-copy {
      display:flex;
      flex-direction:column;
      align-items:flex-start;
      justify-content:center;
      gap:20px;
      min-width:0;
      padding:clamp(28px,4.4vw,72px);
    }
    .llpz-copy .llpz-kicker {
      color:#9e9e9e;
      font:500 10px/1.5 var(--font-mono,monospace);
      letter-spacing:.14em;
    }
    .llpz-copy .llpz-kicker::before { content:none; }
    .llpz-copy .llpz-title {
      max-width:21ch;
      margin:0;
      color:#f5f5f5;
      font:400 clamp(26px,3.1vw,48px)/1.12 var(--font-display,sans-serif);
      letter-spacing:-.04em;
      text-wrap:balance;
    }
    .llpz-copy .llpz-description {
      max-width:51ch;
      margin:0;
      color:#9e9e9e;
      font-size:clamp(15px,1.1vw,18px);
      line-height:1.65;
    }
    .llpz-copy .llpz-link {
      display:inline-flex;
      align-items:center;
      justify-content:space-between;
      gap:24px;
      min-height:46px;
      margin-top:6px;
      padding:12px 18px;
      border:1px solid rgba(255,255,255,.38);
      color:#f5f5f5;
      font:500 10px/1.4 var(--font-mono,monospace);
      letter-spacing:.1em;
      text-transform:uppercase;
      transition:background .25s ease,border-color .25s ease;
    }
    .llpz-link::after { content:"↗"; font-size:18px; transition:transform .25s ease; }
    .site-footer.llfc-ready .footer-pozornice.llpz-handoff:hover { border-color:rgba(255,255,255,.44) !important; }
    .llpz-handoff:hover .llpz-link { background:rgba(255,255,255,.07); border-color:#f5f5f5; }
    .llpz-handoff:hover .llpz-link::after { transform:translate(2px,-2px); }
    .site-footer.llfc-ready .footer-pozornice.llpz-handoff:focus-visible {
      outline:2px solid #00e8ff;
      outline-offset:5px;
    }
    @media (max-width:720px) {
      .site-footer.llfc-ready .footer-pozornice.llpz-handoff { grid-template-columns:minmax(0,1fr) !important; }
      .llpz-identity {
        flex-direction:row;
        justify-content:flex-start;
        gap:22px;
        padding:26px 24px;
        border-right:0;
        border-bottom:1px solid rgba(255,255,255,.12);
      }
      .llpz-identity .llpz-mark { width:76px !important; flex:none; }
      .llpz-identity .llpz-wordmark { width:min(58%,210px) !important; }
      .llpz-copy { padding:28px 24px 32px; gap:18px; }
      .llpz-copy .llpz-title { font-size:clamp(25px,6.8vw,38px); }
      .llpz-copy .llpz-link { width:100%; }
    }
    @media (prefers-reduced-motion:reduce) {
      .llpz-handoff,.llpz-handoff *,.llpz-link::after { transition:none !important; animation:none !important; }
    }

    .site-footer.llfc-ready .footer-grid {
      position:relative;
      grid-template-columns:minmax(260px,1.7fr) repeat(3,minmax(150px,.72fr)) !important;
      gap:clamp(30px,5vw,92px) !important;
      margin:0 0 clamp(52px,6vw,92px) !important;
      padding:clamp(38px,4vw,64px) 0 0;
      border-top:1px solid rgba(255,255,255,.11);
    }
    .site-footer.llfc-ready .footer-brand { gap:22px; }
    .site-footer.llfc-ready .footer-brand > img { width:min(100%,245px); height:auto !important; }
    .site-footer.llfc-ready .footer-brand p { max-width:42ch; color:rgba(232,237,246,.54); line-height:1.65; }
    .site-footer.llfc-ready .footer-col h3 { color:rgba(239,243,250,.34); margin-bottom:22px; }
    .site-footer.llfc-ready .footer-col ul { gap:10px; }
    .site-footer.llfc-ready .footer-col a { position:relative; color:rgba(239,243,250,.62); transition:color .25s ease,transform .3s ease; }
    .site-footer.llfc-ready .footer-col a:hover { color:#fff; transform:translateX(4px); }
    .site-footer.llfc-ready .footer-col p { color:rgba(239,243,250,.5); line-height:1.6; }
    .site-footer.llfc-ready .footer-social a { border-radius:50%; background:rgba(255,255,255,.025); }
    .site-footer.llfc-ready .footer-bottom {
      display:grid;
      grid-template-columns:1fr auto auto;
      align-items:center;
      gap:18px 36px;
      padding-top:24px;
      border-color:rgba(255,255,255,.1);
      color:rgba(233,238,246,.34);
    }
    .site-footer.llfc-ready .footer-bottom .ll-inhouse { grid-column:1 / 2; grid-row:2; }
    .site-footer.llfc-ready .footer-bottom .smpte { justify-self:center; }
    .site-footer.llfc-ready .footer-bottom .footer-legal { justify-self:end; }
    .site-footer.llfc-ready .footer-bottom > span:last-child { justify-self:end; }

    .menu-pozornice.llpz-menu {
      grid-template-columns:70px minmax(0,1fr) !important;
      grid-template-areas:"mark kick" "mark word" "mark note" !important;
      gap:5px 16px !important;
      align-items:center;
      max-width:430px;
      padding:16px 18px !important;
      border:1px solid rgba(208,216,230,.2) !important;
      border-radius:0 !important;
      background:linear-gradient(120deg,rgba(255,255,255,.055),rgba(255,255,255,.012)) !important;
      box-shadow:inset 0 1px 0 rgba(255,255,255,.07) !important;
      animation:none !important;
    }
    .menu-pozornice.llpz-menu .llpz-menu-mark { grid-area:mark; width:70px; height:auto; margin:0; }
    .menu-pozornice.llpz-menu .mp-kicker { grid-area:kick; color:rgba(228,233,242,.45); }
    .menu-pozornice.llpz-menu .llpz-menu-word { grid-area:word; width:min(100%,190px); height:auto; margin:0; }
    .menu-pozornice.llpz-menu .mp-note { grid-area:note; color:rgba(232,237,246,.54); font-size:11px; }
    .menu-pozornice.llpz-menu:hover { border-color:rgba(226,233,244,.46) !important; box-shadow:0 18px 50px rgba(0,0,0,.4),0 0 28px color-mix(in srgb,var(--page-a,#00e8ff) 10%,transparent) !important; }

    @media (max-width:980px) {
      .llfc-intro { grid-template-columns:1fr; gap:32px; }
      .llfc-title { max-width:14ch; }
      .site-footer.llfc-ready .footer-grid { grid-template-columns:1.35fr repeat(3,1fr) !important; gap:32px !important; }
    }
    @media (max-width:720px) {
      .site-footer.llfc-ready { padding-top:76px !important; }
      .site-footer.llfc-ready > .container { width:min(100% - 32px,1760px) !important; }
      .llfc-title { max-width:100%; font-size:clamp(38px,10.8vw,52px); line-height:.92; }
      .llfc-actions { display:grid; grid-template-columns:1fr; }
      .llfc-actions a { width:100%; }
      .site-footer.llfc-ready .footer-grid { grid-template-columns:1fr 1fr !important; }
      .site-footer.llfc-ready .footer-brand { grid-column:1 / -1; padding-bottom:12px; }
      .site-footer.llfc-ready .footer-bottom { grid-template-columns:1fr; }
      .site-footer.llfc-ready .footer-bottom > *,
      .site-footer.llfc-ready .footer-bottom .ll-inhouse,
      .site-footer.llfc-ready .footer-bottom .footer-legal,
      .site-footer.llfc-ready .footer-bottom > span:last-child { grid-column:auto; grid-row:auto; justify-self:start; }
      .site-footer.llfc-ready .footer-bottom .smpte { justify-self:start; }
    }
    @media (max-width:440px) {
      .site-footer.llfc-ready .footer-grid { grid-template-columns:1fr !important; }
      .site-footer.llfc-ready .footer-brand { grid-column:auto; }
      .menu-pozornice.llpz-menu { grid-template-columns:56px minmax(0,1fr) !important; }
      .menu-pozornice.llpz-menu .llpz-menu-mark { width:56px; }
    }
    @media (prefers-reduced-motion:reduce) {
      .llfc-atmosphere i,.llpz-mark { animation:none !important; }
    }
    

    :root {
      --llsm-ease: cubic-bezier(.16,1,.3,1);
      --llsm-duration: 980ms;
    }

    html.llsm-motion .llsm-item {
      --llsm-x: 0px;
      --llsm-y: 38px;
      --llsm-scale: .988;
      opacity: 0;
      transform: translate3d(var(--llsm-x),var(--llsm-y),0) scale(var(--llsm-scale));
      transform-origin: 50% 62%;
      transition:
        opacity 720ms ease-out var(--llsm-delay,0ms),
        transform var(--llsm-duration) var(--llsm-ease) var(--llsm-delay,0ms);
      will-change: opacity,transform;
      backface-visibility: hidden;
    }
    html.llsm-motion .llsm-item[data-llsm-variant="left"]  { --llsm-x:-28px; --llsm-y:18px; }
    html.llsm-motion .llsm-item[data-llsm-variant="right"] { --llsm-x: 28px; --llsm-y:18px; }
    html.llsm-motion .llsm-item[data-llsm-variant="focus"] { --llsm-y:20px; --llsm-scale:.965; }
    html.llsm-motion .llsm-item.llsm-seen {
      opacity: 1;
      transform: translate3d(0,0,0) scale(1);
      will-change: auto;
    }

    /* Individual translate composes with the site's existing hover transforms. */
    html.llsm-motion [data-llsm-parallax] {
      --llsm-shift: 0px;
      translate: 0 var(--llsm-shift);
      backface-visibility: hidden;
      will-change: translate;
    }
    html.llsm-motion [data-llsm-parallax].llsm-parallax-idle { will-change:auto; }

    /* A snow-white registration line makes each scene entrance feel intentional. */
    html.llsm-motion .llsm-section-line {
      position:relative;
      isolation:isolate;
    }
    html.llsm-motion .llsm-section-line::after {
      content:"";
      position:absolute;
      z-index:8;
      left:var(--llsm-line-left,0);
      right:var(--llsm-line-right,0);
      top:0;
      height:1px;
      pointer-events:none;
      background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--page-a,#00e8ff) 52%,#fff 48%),transparent);
      opacity:.18;
      transform:scaleX(.38);
      transform-origin:50% 50%;
      transition:opacity 1s ease,transform 1.3s var(--llsm-ease);
    }
    html.llsm-motion .llsm-section-line.llsm-scene-seen::after {
      opacity:.54;
      transform:scaleX(1);
    }

    @media (max-width:760px) {
      html.llsm-motion .llsm-item {
        --llsm-y: 25px;
        --llsm-scale: .994;
        transition-duration:650ms,820ms;
      }
      html.llsm-motion .llsm-item[data-llsm-variant="left"],
      html.llsm-motion .llsm-item[data-llsm-variant="right"] { --llsm-x:0px; --llsm-y:25px; }
      html.llsm-motion .llsm-section-line::after { opacity:.13; }
    }

    @media (prefers-reduced-motion:reduce) {
      html.llsm-motion .llsm-item,
      html.llsm-motion .llsm-item.llsm-seen {
        opacity:1 !important;
        transform:none !important;
        transition:none !important;
      }
      html.llsm-motion [data-llsm-parallax] { translate:none !important; }
      html.llsm-motion .llsm-section-line::after { transform:none !important; transition:none !important; }
    }
    

      #work-section,
      #work-section > .container,
      #work-section .llsm-item,
      #work-section .reveal,
      #llg-grid {
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        transition: none !important;
        animation: none !important;
        will-change: auto !important;
      }
      #llg-grid {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        grid-auto-flow: dense;
        align-items: start;
        gap: 20px;
        height: auto !important;
      }
      #llg-grid .llg-card {
        position: relative !important;
        inset: auto !important;
        width: auto !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        break-inside: avoid;
      }
      /* Stable editorial rhythm: wide features, one shared frame height. Vertical
         source images crop inside the frame instead of stretching the grid row. */
      #llg-grid .llg-card:nth-child(7n + 1) { grid-column: span 2; }
      #llg-grid .llg-frame { height: clamp(250px, 22vw, 420px) !important; aspect-ratio: auto !important; }
      #llg-grid .llg-card.is-out { display: none !important; }
      #llg-grid .llg-card:not(.is-out),
      #llg-grid .llg-frame,
      #llg-grid .llg-info,
      #llg-grid .llg-card img {
        opacity: 1 !important;
        visibility: visible !important;
      }
      /* One composed hover motion. The reliability layer previously replaced
         the image's transform transition with an opacity-only transition,
         making the inherited zoom snap between states. */
      #llg-grid .llg-frame {
        transition: border-color .8s ease, box-shadow .9s cubic-bezier(.16,1,.3,1) !important;
      }
      #llg-grid .llg-frame img {
        transform: translate3d(0,0,0) scale(1.008) !important;
        transform-origin: 50% 48%;
        will-change: transform;
        transition: transform 1.35s cubic-bezier(.16,1,.3,1), filter .9s ease, opacity .28s ease !important;
      }
      #llg-grid .llg-frame::after {
        content: "";
        position: absolute;
        z-index: 1;
        inset: 0;
        pointer-events: none;
        background: linear-gradient(180deg, transparent 40%, rgba(5,5,5,.16) 61%, rgba(5,5,5,.86) 100%);
        opacity: .52;
        transition: opacity .82s cubic-bezier(.16,1,.3,1);
      }
      body #llg-grid .llg-info {
        z-index: 3;
        padding-top: 52px;
        background: none !important;
        transform: translate3d(0,0,0) !important;
        transition: transform .85s cubic-bezier(.16,1,.3,1), opacity .55s ease !important;
      }
      @media (hover:hover) and (pointer:fine) {
        body #llg-grid .llg-info {
          opacity: .76 !important;
          transform: translate3d(0,7px,0) !important;
        }
        #llg-grid .llg-frame::after { opacity: .42; }
        #llg-grid .llg-card:hover .llg-frame,
        #llg-grid .llg-card:focus-visible .llg-frame {
          border-color: rgba(109,222,255,.42) !important;
          box-shadow: 0 22px 48px -28px rgba(0,0,0,.88), 0 0 24px rgba(62,180,255,.09) !important;
        }
        #llg-grid .llg-card:hover .llg-frame img,
        #llg-grid .llg-card:focus-visible .llg-frame img {
          transform: translate3d(0,-.7%,0) scale(1.045) !important;
          filter: saturate(1.04) contrast(1.025) brightness(1.025);
        }
        body #llg-grid .llg-card:hover .llg-info,
        body #llg-grid .llg-card:focus-visible .llg-info {
          opacity: 1 !important;
          transform: translate3d(0,0,0) !important;
        }
        #llg-grid .llg-card:hover .llg-frame::after,
        #llg-grid .llg-card:focus-visible .llg-frame::after {
          opacity: .9;
        }
      }
      @media (hover:none), (pointer:coarse) {
        body #llg-grid .llg-info { opacity: 1 !important; transform: none !important; }
        #llg-grid .llg-frame::after { opacity: .68; }
      }
      @media (max-width: 1079px) {
        #llg-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        #llg-grid .llg-frame { height: clamp(230px, 36vw, 380px) !important; }
      }
      @media (max-width: 639px) {
        #llg-grid { grid-template-columns: minmax(0, 1fr); }
        #llg-grid .llg-card:nth-child(7n + 1) { grid-column: span 1; }
        #llg-grid .llg-frame { height: auto !important; aspect-ratio: 16 / 10 !important; }
      }
    

			/* The spectrum tape belongs to the full quicklink strip, not its centre. */
			body.llpr3d-20260729-page nav.subnav::after {
				left: 0 !important;
				width: 100% !important;
				transform: none !important;
				opacity: .48 !important;
			}

			/* Preserve the descender in the Croatian word "riječ". */
			body.llpr3d-20260729-page #press-title {
				overflow: visible !important;
				padding-bottom: .13em !important;
				line-height: 1.01 !important;
			}

			/* Press hierarchy: the article title supports the quote, not vice versa. */
			body.llpr3d-20260729-page .press-stage[data-llpress-ready] .pp-head {
				max-width: 24ch !important;
				font-size: clamp(1.7rem, 2.45vw, 3.25rem) !important;
				line-height: 1.04 !important;
				letter-spacing: -.032em !important;
				color: rgba(245,245,245,.68) !important;
			}
			body.llpr3d-20260729-page .press-stage[data-llpress-ready] .pp-quote {
				max-width: 54ch !important;
				padding-left: clamp(1.1rem, 1.8vw, 1.8rem);
				border-left: 2px solid var(--llpress-accent);
				font-family: "Chakra Petch", sans-serif;
				font-size: clamp(1.3rem, 1.7vw, 1.9rem) !important;
				font-weight: 400;
				line-height: 1.38 !important;
				letter-spacing: -.015em;
				color: #f5f5f5 !important;
				text-wrap: pretty;
			}
			body.llpr3d-20260729-page .press-stage[data-llpress-ready] .pp-q2 {
				max-width: 58ch;
				font-size: clamp(.95rem, 1.05vw, 1.12rem);
				line-height: 1.55;
				color: rgba(245,245,245,.68);
			}
			@media (max-width: 760px) {
				body.llpr3d-20260729-page .press-stage[data-llpress-ready] .pp-head {
					font-size: clamp(1.55rem, 7vw, 2.35rem) !important;
				}
				body.llpr3d-20260729-page .press-stage[data-llpress-ready] .pp-quote {
					font-size: clamp(1.05rem, 4.7vw, 1.3rem) !important;
					line-height: 1.42 !important;
				}
			}

			/* Remove every remaining GPU-risky hero overlay, not only video filters. */
			body.ll-design-hero-film .ll-service-hero__media,
			body.ll-design-hero-film .ll-service-hero__poster,
			body.ll-design-hero-film .ll-service-hero__video,
			body.ll-contact-cinema .llcc-stage,
			body.ll-contact-cinema .llcc-film {
				-webkit-filter: none !important;
				filter: none !important;
				-webkit-transform: none !important;
				transform: none !important;
				-webkit-clip-path: none !important;
				clip-path: none !important;
				-webkit-mask: none !important;
				mask: none !important;
				mix-blend-mode: normal !important;
				will-change: auto !important;
				contain: none !important;
			}
			body.ll-contact-cinema .page-hero-bloom,
			body.ll-contact-cinema .llcc-stage::after,
			body.ll-design-hero-film .ll-service-hero .page-hero-bloom { display: none !important; }

			/* These dark hero overlays inherited the global rotating beam animation,
			 * turning the overlay itself into a large floating black rectangle. */
			body.ll-design-hero-film .ll-service-hero[data-service="design"]::before,
			body.ll-contact-cinema .page-hero::before {
				inset: 0 !important;
				animation: none !important;
				transform: none !important;
				-webkit-transform: none !important;
				transform-origin: center !important;
				will-change: auto !important;
			}

			/* Design page transition: full-width spectrum rules and no dead gap
			 * between the hero quicklinks and the process dossier. */
			body.page-id-1768 nav.subnav {
				border-bottom: 0 !important;
			}
			body.page-id-1768 nav.subnav::after {
				left: 0 !important;
				right: 0 !important;
				width: 100% !important;
				transform: none !important;
				opacity: .68 !important;
			}
			body.lldx-page .elementor-element-70a90e,
			body.lldx-page .elementor-element-70a90e > .elementor-widget,
			body.lldx-page .elementor-element-70a90e .elementor-widget-container,
			body.lldx-page .elementor-element-70a90e .elementor-shortcode {
				min-height: 0 !important;
				margin: 0 !important;
				padding-top: 0 !important;
				gap: 0 !important;
			}
			body.lldx-page .elementor-element-70a90e .lldx-project-dock {
				margin-top: 0 !important;
				border-top: 0 !important;
				border-bottom: 0 !important;
				border-radius: 0 !important;
			}
			body.lldx-page .elementor-element-70a90e .lldx-project-dock::after {
				left: 0 !important;
				right: 0 !important;
				bottom: 0 !important;
				height: 1px !important;
				background: var(--gradient-spectrum) !important;
				opacity: .68 !important;
			}

			/* A meaningful previz build: stage, trusses, fixtures, focus zones and beams. */
			.llsf-previz .llsf-plan-stage { fill: rgba(245,245,245,.025); stroke: rgba(245,245,245,.32); }
			.llsf-previz .llsf-plan-truss { stroke: rgba(79,168,255,.8); stroke-width: 1.4; }
			.llsf-previz .llsf-plan-fixture { fill: #050505; stroke: #00e8ff; stroke-width: 1.2; }
			.llsf-previz .llsf-plan-beam { fill: rgba(0,232,255,.06); stroke: rgba(0,232,255,.62); stroke-width: .8; }
			.llsf-previz .llsf-plan-focus { fill: none; stroke: rgba(255,62,160,.75); stroke-width: .8; stroke-dasharray: 3 3; }
			.llsf-previz .llsf-plan-label { fill: rgba(245,245,245,.58); font: 5px "Martian Mono", monospace; letter-spacing: .08em; }
			[aria-labelledby="deliver-title"].is-in .llsf-previz .llsf-plan-truss { stroke-dasharray: 190; stroke-dashoffset: 190; animation: llsf-plan-draw 1.2s .15s ease-out forwards; }
			[aria-labelledby="deliver-title"].is-in .llsf-previz .llsf-plan-fixture { opacity: 0; animation: llsf-plan-pop .3s var(--llsf-delay,.8s) ease-out forwards; }
			[aria-labelledby="deliver-title"].is-in .llsf-previz .llsf-plan-beam { opacity: 0; animation: llsf-plan-beam 1.8s var(--llsf-delay,1.15s) ease-in-out infinite alternate; }
			@keyframes llsf-plan-draw { to { stroke-dashoffset: 0; } }
			@keyframes llsf-plan-pop { to { opacity: 1; } }
			@keyframes llsf-plan-beam { from { opacity: .18; } to { opacity: .82; } }
			@media (prefers-reduced-motion: reduce) {
				.llsf-previz .llsf-plan-truss { stroke-dashoffset: 0 !important; }
				.llsf-previz .llsf-plan-fixture, .llsf-previz .llsf-plan-beam { opacity: 1 !important; animation: none !important; }
			}